/* Family screens: reference composition, scoped away from the approved home. */
.ref-family{--rf-ink:#091d50;--rf-muted:#6b83b1;--rf-line:#dfeafa;--rf-blue:#1676ff;--rf-green:#009c89;padding:14px 2.5% 18px!important;color:var(--rf-ink);background:radial-gradient(ellipse at 80% 15%,#e4eeff 0,transparent 50%),radial-gradient(ellipse at 4% 64%,#e4f3ff 0,transparent 42%),#f5f9ff!important;font-family:Arial,Helvetica,sans-serif}
.ref-family .family-app-shell{max-width:1456px;width:100%;min-height:calc(100vh - 32px);margin:auto;border:1px solid #e2ebfa;border-radius:24px;background:linear-gradient(150deg,#f4f9ffb3,#edf5ff88 50%,#fafcff);box-shadow:0 16px 50px #3263ad10;overflow:hidden}
.ref-family .family-topbar{height:74px;min-height:74px;padding:8px 30px;display:flex;justify-content:space-between;gap:20px;background:#ffffffed;border-bottom:1px solid var(--rf-line)}
.ref-family .family-topbar>.family-back,.ref-family .family-topbar>.agenda-more{display:none}
.ref-family .family-brand{margin:0;justify-self:start}
.ref-family .family-brand>img{width:174px;height:52px;object-fit:contain}
.ref-family .ref-account{display:flex;align-items:center;gap:18px;margin-left:auto}
.ref-family .child-selector,.ref-family .family-guardian-selector{min-width:280px;min-height:54px;display:grid;grid-template-columns:44px minmax(0,1fr) 18px;gap:12px;align-items:center;border:1px solid var(--rf-line);background:#fcfdff;border-radius:17px;padding:7px 13px;text-align:left;color:var(--rf-ink);box-shadow:0 3px 10px #6174ab04}
.ref-family .family-guardian-selector{min-width:218px}
.ref-family .child-selector i,.ref-family .family-guardian-selector i{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(140deg,#dceaff,#eef7ff);font-size:13px!important;font-style:normal;color:#0666ff;font-weight:700}
.ref-family .family-guardian-selector i{color:#713eff;background:#eee7ff}
.ref-family .ref-account strong{font-size:14px!important;line-height:1.4;display:block;color:var(--rf-ink)}
.ref-family .ref-account small{font-size:12px!important;display:block;color:var(--rf-muted);margin-top:2px}
.ref-family .ref-account em{font-style:normal;font-size:20px!important;color:#426399}
.ref-family .ref-notifications{position:relative;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--rf-line);border-radius:14px;background:#fff;color:#2b5291;box-shadow:0 5px 12px #4779c310}
.ref-family svg{width:24px;height:24px;display:block}
.ref-family .ref-notifications b,.ref-family .family-bottom-nav b{position:absolute;right:-2px;top:-4px;min-width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#ff4668;color:white;font-size:11px!important;border:2px solid white}
.ref-family .family-content{width:100%;max-width:1344px;margin:auto;padding:20px 24px 105px}
.ref-family .agenda-heading{position:relative;isolation:isolate;min-height:156px;display:flex;align-items:center;justify-content:space-between;margin:0 0 16px;gap:18px}
.ref-family .agenda-heading>div:first-child{position:relative;z-index:1;max-width:58%}
.ref-family .agenda-heading>div>span{display:block;color:var(--rf-green);font-size:13px!important;font-weight:700;letter-spacing:.025em;margin-bottom:6px}
.ref-family .agenda-heading h1{font-size:40px!important;letter-spacing:-1.3px;line-height:1.12;color:var(--rf-ink);margin:4px 0 8px;font-weight:750}
.ref-family .agenda-heading p{font-size:18px!important;color:var(--rf-muted);line-height:1.4;margin:0}
.ref-family .ref-illustration{position:absolute;z-index:0;right:-25px;top:0;width:640px;height:156px;pointer-events:none;background-repeat:no-repeat;background-size:1536px 1024px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 95%,transparent);}
#familia-agenda .ref-illustration{background-image:url('assets/family-reference/agenda.png');background-position:-800px -90px;height:120px;top:15px}
#familia-atividades .ref-illustration{background-image:url('assets/family-reference/atividades.png');background-position:-790px -100px;height:175px;top:-10px}
#familia-boletim .ref-illustration{background-image:url('assets/family-reference/boletim.png');background-position:-810px -115px;height:165px}
#familia-boletim.ref-attendance .ref-illustration{background-image:url('assets/family-reference/frequencia.png');background-position:-810px -95px;height:130px}
#familia-cardapio .ref-illustration{background-image:url('assets/family-reference/cardapio.png');background-position:-790px -85px;height:140px;width:700px}
#familia-comunicados .ref-illustration{background-image:url('assets/family-reference/comunicados.png');background-position:-870px -100px;height:145px;width:610px}
#familia-mensagens .ref-illustration{background-image:url('assets/family-reference/mensagens.png');background-position:-905px -90px;width:380px;height:150px;right:190px}
#familia-calendario .ref-illustration{background-image:url('assets/family-reference/calendario.png');background-size:1942px 1033px;background-position:-1060px -132px;width:690px;height:136px;right:-52px;top:-6px}
#familia-mural .ref-illustration{background-image:url('assets/family-reference/mural.png');background-position:-930px -122px;width:550px;height:185px;top:-25px}
#familia-saude .ref-illustration{background-image:url('assets/family-reference/saude.png');background-position:-845px -82px;width:645px;height:138px}
.ref-family :is(button,input,select,textarea){font-family:inherit}
.ref-family :is(button,input,select):focus-visible{outline:3px solid #93baff;outline-offset:3px}
.ref-family :is(.activity-tabs,.agenda-filter-chips,.report-tabs){display:flex;gap:12px;flex-wrap:wrap}
.ref-family :is(.activity-tabs,.agenda-filter-chips,.report-tabs)>button{padding:11px 20px;min-height:44px;font-size:15px!important;font-weight:700;border:1px solid var(--rf-line);border-radius:14px;background:#ffffffdf;color:#5572a5;box-shadow:0 4px 12px #2c69b707}
.ref-family :is(.activity-tabs,.report-tabs)>button.active{background:linear-gradient(135deg,#4398ff,#266dff);color:#fff;border-color:#5392ff;box-shadow:0 5px 14px #397cff25}
.ref-family .agenda-filter-chips>button.active{background:#d9eaff;color:#075bff;border-color:#a3c9ff}
.ref-family :is(.activities-toolbar,.communications-toolbar,.agenda-toolbar){display:flex;justify-content:space-between;align-items:center;gap:16px;margin:16px 0}
.ref-family :is(.activities-toolbar,.communications-toolbar,.agenda-toolbar) input{font-size:14px!important;border:0;background:transparent;outline:0;min-width:0;width:100%;color:var(--rf-ink)}
.ref-family :is(.communication-search,.activities-toolbar select){height:46px;min-width:210px;padding:0 17px;border-radius:15px;background:#ffffffdf;border:1px solid var(--rf-line);font-size:15px!important;color:var(--rf-muted)}
.ref-family .communication-search{width:320px;display:flex;align-items:center;gap:10px}
.ref-family .family-bottom-nav{position:fixed;z-index:30;left:50%;right:auto;transform:translateX(-50%);bottom:10px;width:min(615px,calc(100% - 28px));height:68px;border:1px solid var(--rf-line);border-radius:23px;background:#ffffffed;box-shadow:0 12px 34px #4166ad12;display:flex;justify-content:space-around;gap:0;padding:4px 10px;backdrop-filter:blur(16px)}
.ref-family .family-bottom-nav button{position:relative;width:105px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:5px;border-radius:24px;color:#5b76a6;font-size:12px!important;min-width:0}
.ref-family .family-bottom-nav button.active{background:#eeedff;color:#3d33ff}
.ref-family .family-bottom-nav i{height:24px;display:block;font-style:normal}
.ref-family .family-bottom-nav b{right:24px;top:0}
.ref-family .ref-footer{padding:10px 28px 22px;font-size:12px!important;line-height:1.4;color:#7b90b9;display:flex;justify-content:space-between;margin-top:-60px;pointer-events:none}
.ref-family .ref-footer span:last-child{text-align:right}
.ref-family .ref-back{display:grid;place-items:center;width:40px;height:40px;border:1px solid #cfe0fa;background:#fff;border-radius:12px;color:#4569a5;font-size:20px!important;margin:0 0 -30px -62px}
/* Shared family chrome: the approved Home header and navigation on every screen. */
.family-view.family-unified-chrome .family-topbar{height:68px;min-height:68px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #dbe5f2;background:rgba(255,255,255,.94)}
.family-view.family-unified-chrome .family-topbar>.family-back,.family-view.family-unified-chrome .family-topbar>.agenda-more,.family-view.family-unified-chrome .family-topbar>.ref-calendar-menu{display:none}
.family-view.family-unified-chrome .family-brand{margin:0;display:flex;align-items:center}
.family-view.family-unified-chrome .family-brand>img{width:154px;height:48px;object-fit:contain}
.family-view.family-unified-chrome#familia-calendario .family-brand{margin-left:0}
.family-view.family-unified-chrome#familia-calendario .family-brand>img{width:154px}
.family-view.family-unified-chrome#familia-calendario .family-topbar>.ref-calendar-menu{display:none}
.family-view.family-unified-chrome .family-home-account{margin-left:auto;display:flex;align-items:center;gap:10px}
.family-view.family-unified-chrome .family-notification-button{position:relative;width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:12px;color:#375783;background:#f7faff;font-size:20px!important}
.family-view.family-unified-chrome .family-notification-button b{position:absolute;right:2px;top:-3px;min-width:18px;height:18px;display:grid;place-items:center;border-radius:10px;color:#fff;background:#ee5364;font-size:10px!important;border:0}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector){height:48px;min-height:48px;display:grid;grid-template-columns:36px minmax(0,1fr) 16px;align-items:center;gap:10px;padding:5px 12px;border:1px solid #dce6f2;border-radius:13px;background:#fff;text-align:left;box-shadow:0 4px 15px rgba(39,67,106,.03)}
.family-view.family-unified-chrome .family-student-selector{width:252px;min-width:252px}
.family-view.family-unified-chrome .family-guardian-selector{width:205px;min-width:205px}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector)>i{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-size:10px!important;font-weight:800;background:#eaf3ff;color:#1d6cd1}
.family-view.family-unified-chrome .family-guardian-selector>i{background:#f0edff;color:#6548df}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector) :is(strong,small){display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector) strong{color:#09264d;font-size:11px!important}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector) small{color:#7487a4;font-size:9px!important;margin-top:1px}
.family-view.family-unified-chrome :is(.family-student-selector,.family-guardian-selector) em{color:#6680a4;font-size:16px!important;font-style:normal}
.family-view.family-unified-chrome .family-account-divider{width:1px;height:30px;background:#e1e8f2;margin:0 2px}
.family-view.family-unified-chrome .family-exit-control{display:none}
.family-view.family-unified-chrome .family-bottom-nav{position:fixed;z-index:30;left:50%;right:auto;bottom:10px;transform:translateX(-50%);width:540px;height:56px;display:flex;justify-content:space-around;gap:0;padding:0;border:1px solid #dce6f2;border-radius:16px;background:#fff;box-shadow:0 9px 25px rgba(30,54,89,.12);overflow:visible;backdrop-filter:none}
.family-view.family-unified-chrome .family-bottom-nav button{position:relative;width:92px;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;border-radius:12px;color:#5f7698;font-size:9px!important}
.family-view.family-unified-chrome .family-bottom-nav button.active{color:#5747e0;background:linear-gradient(180deg,#f6f3ff,#eeeaff)}
.family-view.family-unified-chrome .family-bottom-nav i{height:auto;display:block;font-style:normal;font-size:17px!important;line-height:1}
.family-view.family-unified-chrome .family-bottom-nav b{position:absolute;top:2px;right:20px;min-width:16px;height:16px;display:grid;place-items:center;border-radius:9px;background:#ef6470;color:#fff;font-size:9px!important;border:0}
/* Comunicados */
#familia-comunicados .family-content{max-width:1392px}
#familia-comunicados .communication-summary{display:flex;gap:25px;align-items:center;padding:19px 24px;border-radius:18px;min-height:102px;background:linear-gradient(115deg,#2458ac,#2064b4 65%,#385fc4);box-shadow:0 10px 24px #2352a820;color:#fff}
#familia-comunicados .communication-summary:before{content:'✉';display:grid;place-items:center;flex:0 0 68px;height:68px;background:#ffffff24;border-radius:18px;font-size:35px!important;color:#fff}
#familia-comunicados .communication-summary>div{min-width:105px;border-right:1px solid #ffffff60;padding-right:24px;display:flex;flex-direction:column;align-items:flex-start;gap:0}
#familia-comunicados .communication-summary strong{font-size:32px!important;line-height:1.05}
#familia-comunicados .communication-summary span{font-size:14px!important}
#familia-comunicados .communication-summary p{font-size:16px!important;line-height:1.6;flex:1;margin:0;color:#fff}
#familia-comunicados .communication-summary button{border:1px solid #8cadf0;background:linear-gradient(135deg,#6689d0,#2f70f4);padding:14px 22px;border-radius:14px;white-space:nowrap;font-size:16px!important;color:#fff;font-weight:700}
#familia-comunicados .communication-summary button:disabled{opacity:.6;cursor:default}
#familia-comunicados .communications-list{display:grid;gap:12px}
#familia-comunicados .communication-card{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr) 14px;gap:24px;min-height:116px;margin:0;padding:13px 26px 10px;border:1px solid var(--rf-line);border-left:3px solid transparent;border-radius:19px;background:#ffffffed;color:var(--rf-ink);text-align:left;opacity:1}
#familia-comunicados .communication-card[data-read=false]{border-left-color:#ff496e}
#familia-comunicados .communication-card:after{content:'›';position:absolute;right:22px;top:22px;font-size:27px!important;font-weight:400;color:#5e7db0}
#familia-comunicados .communication-icon{width:68px;height:68px;border-radius:24px;display:grid;place-items:center;font-size:30px!important;font-weight:700;font-style:normal}
#familia-comunicados .communication-icon.orange{background:#ffedf1;color:#ff4b6f}
#familia-comunicados .communication-icon.blue{background:#e8f2ff;color:#237eff}
#familia-comunicados .communication-icon.green{background:#e1f4ef;color:#059d8c}
#familia-comunicados .communication-icon.violet{background:#f0eaff;color:#8050fa}
#familia-comunicados .communication-card>div>span{font-size:11px!important;color:#6b85b2;letter-spacing:0;font-weight:700}
#familia-comunicados .communication-card h2{font-size:16px!important;line-height:1.35;color:var(--rf-ink);margin:5px 0 3px}
#familia-comunicados .communication-card p{font-size:16px!important;font-weight:400;color:var(--rf-muted);margin:0;line-height:1.4}
#familia-comunicados .communication-card footer{padding:4px 10px 0 0;display:flex;align-items:center;justify-content:space-between;gap:10px}
#familia-comunicados .communication-card footer b{font-size:11px!important;border-radius:12px;padding:4px 10px;background:#fff0d9;color:#b85c00}
#familia-comunicados .communication-card footer em{font-size:11px!important;color:var(--rf-muted);font-style:normal;font-weight:400}
#familia-comunicados .communication-card>u{position:absolute;right:45px;top:19px;width:10px;height:10px;border-radius:50%;background:#ff4f74}
#familia-comunicados .activity-tabs b{background:#f7507c;color:white;padding:4px 7px;border-radius:20px;font-size:13px!important;margin-left:4px}
/* Agenda */
#familia-agenda .family-content{max-width:1208px;padding-top:12px}
#familia-agenda .agenda-heading{min-height:110px;margin-bottom:12px}
#familia-agenda .agenda-calendar{display:grid;grid-template-columns:36px repeat(7,minmax(0,1fr)) 36px;gap:8px;border:1px solid var(--rf-line);border-radius:18px;background:#ffffffde;height:76px;padding:4px 12px}
#familia-agenda .agenda-calendar>div{height:66px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:13px;gap:7px;font-size:14px!important}
#familia-agenda .agenda-calendar span{font-size:11px!important;color:#617fb2}
#familia-agenda .agenda-calendar b{font-size:15px!important;color:var(--rf-ink)}
#familia-agenda .agenda-calendar .selected{background:linear-gradient(130deg,#247bff,#1478e7);box-shadow:0 6px 15px #3679dc35}
#familia-agenda .agenda-calendar .selected :is(span,b){color:#fff}
#familia-agenda .agenda-calendar>button{background:transparent;border:0;font-size:29px!important;color:#365b98}
#familia-agenda .agenda-toolbar>span{font-size:12px!important;color:var(--rf-muted)}
#familia-agenda .agenda-feed{display:grid;gap:12px}
#familia-agenda .agenda-entry{display:grid;grid-template-columns:58px minmax(0,1fr) 12px;align-items:start;gap:22px;text-align:left;padding:13px 24px 10px 27px;margin:0;border:1px solid var(--rf-line);border-left:3px solid #2682ff;border-radius:17px;background:#ffffffed}
#familia-agenda .agenda-entry.featured{border-left-color:#ff9500}
#familia-agenda .agenda-entry:nth-child(4n){border-left-color:#ff4f70}
#familia-agenda .agenda-entry>.subject{width:56px;height:56px;border-radius:16px;background:#eee8ff;color:#8046fa;display:grid;place-items:center;font-style:normal}
#familia-agenda .agenda-entry:not(.featured)>.subject{background:#e7f1ff;color:#157fff}
#familia-agenda .agenda-entry:nth-child(4n)>.subject{background:#ffedf1;color:#fc3b66}
#familia-agenda .agenda-entry>.subject svg{width:30px;height:30px}
#familia-agenda .agenda-entry>div>span{font-size:11px!important;color:#6d86b2;font-weight:700}
#familia-agenda .agenda-entry h2{font-size:16px!important;margin:3px 0;color:var(--rf-ink);line-height:1.3}
#familia-agenda .agenda-entry>div>p{font-size:14px!important;color:var(--rf-muted);margin:0 0 6px;line-height:1.35}
#familia-agenda .entry-task{display:flex;gap:15px;padding:10px 16px;background:#fff6e6;border:0;border-radius:14px;margin:8px 0 4px}
#familia-agenda .entry-task>i{color:#e78b00;font-size:24px!important;font-style:normal}
#familia-agenda .entry-task p{margin:0;font-size:12px!important;line-height:1.35}
#familia-agenda .entry-task span{display:block;color:#cf7900;font-size:11px!important;font-weight:700}
#familia-agenda .entry-task strong{font-size:12px!important;font-weight:400;color:var(--rf-ink)}
#familia-agenda .entry-task small{display:block;font-size:13px!important;color:#8493a9;margin-top:2px}
#familia-agenda .agenda-entry footer{padding:2px 0 0;display:flex;justify-content:space-between;align-items:center}
#familia-agenda .agenda-entry footer b{font-size:11px!important;padding:4px 12px;border-radius:20px}
#familia-agenda .agenda-entry footer em{font-size:11px!important;color:var(--rf-muted);font-style:normal}
#familia-agenda .agenda-entry>strong{font-size:25px!important;color:#6780a9;font-weight:400}
/* Activities */
#familia-atividades .family-content{max-width:1360px}
#familia-atividades .agenda-heading h1{font-size:48px!important}
#familia-atividades .activity-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 25px}
#familia-atividades .activity-stats article{display:flex;gap:26px;align-items:center;background:#fff;border:1px solid var(--rf-line);border-radius:24px;padding:20px 22px;min-height:126px}
#familia-atividades .activity-stats i{display:grid;place-items:center;width:78px;height:78px;border-radius:22px;flex:none}
#familia-atividades .activity-stats svg{width:38px;height:38px}
#familia-atividades .activity-stats span{font-size:13px!important;color:#5577af;font-weight:700}
#familia-atividades .activity-stats strong{font-size:31px!important;color:var(--rf-ink);margin:3px 0}
#familia-atividades .activity-stats small{font-size:18px!important;color:var(--rf-muted)}
#familia-atividades .activities-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px}
#familia-atividades .activity-card{margin:0;background:#fff;border:1px solid var(--rf-line);border-radius:24px;padding:25px;opacity:1;display:flex;flex-direction:column}
#familia-atividades .activity-card-top{display:grid;grid-template-columns:72px minmax(0,1fr) 44px;gap:25px;align-items:start;flex:1}
#familia-atividades .activity-card-top>.subject{width:72px;height:72px;display:grid;place-items:center;border-radius:20px;background:#f0eaff;color:#8147fa;font-size:19px!important;font-style:normal}
#familia-atividades .activity-card-top>div>span{font-size:12px!important;color:#6685b3;font-weight:700}
#familia-atividades .activity-card h2{font-size:20px!important;line-height:1.3;margin:7px 0;color:var(--rf-ink)}
#familia-atividades .activity-card p{font-size:17px!important;line-height:1.5;color:var(--rf-muted);margin:0 0 14px}
#familia-atividades .favorite-button{height:44px;width:44px;border:1px solid #e9f0fb;background:#f4f8fe;border-radius:14px;color:#6687b7;font-size:25px!important}
#familia-atividades .favorite-button.active{color:#8150fa;background:#eee7ff}
#familia-atividades .activity-card-bottom{display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center;padding:18px 0 0;border-top:1px solid var(--rf-line);margin-top:4px}
#familia-atividades .deadline{font-size:17px!important;color:#d77c00;font-weight:700;background:transparent;padding:0}
#familia-atividades .deadline.done{color:#00a58e}
#familia-atividades .activity-card-bottom small{font-size:16px!important;color:var(--rf-muted);text-align:right}
#familia-atividades .complete-activity{grid-column:1/-1;width:100%;height:55px;background:#f0f7ff;color:#0668f5;border:1px solid #9fc6ff;border-radius:14px;font-size:18px!important;font-weight:700}
/* Boletim and attendance */
#familia-boletim .family-content{max-width:1420px}
#familia-boletim .report-summary{display:grid;grid-template-columns:1.3fr repeat(3,minmax(0,1fr));gap:15px;margin:0 0 24px}
#familia-boletim .report-summary article{border:1px solid var(--rf-line);border-radius:18px;min-height:150px;padding:24px;display:flex;align-items:center;gap:20px;background:white}
#familia-boletim .report-summary article.featured{display:block;background:linear-gradient(110deg,#094c95,#1689e8);color:white;padding-left:90px;position:relative}
#familia-boletim .report-summary article.featured:before{content:'▥';position:absolute;left:22px;top:28px;font-size:32px!important;display:grid;place-items:center;width:53px;height:58px;border-radius:16px;background:#ffffff20}
#familia-boletim .report-summary span{font-size:12px!important;color:#647fb0;font-weight:700}
#familia-boletim .report-summary strong{font-size:25px!important;display:block;color:var(--rf-ink);margin:5px 0}
#familia-boletim .report-summary p{font-size:15px!important;color:var(--rf-muted);margin:0;line-height:1.4}
#familia-boletim .report-summary .featured :is(span,strong,p){color:white}
#familia-boletim .report-summary .featured strong{font-size:31px!important}
#familia-boletim .report-summary .featured b{display:inline-block;margin-top:8px;padding:6px 12px;background:#ffffff22;border-radius:20px;font-size:13px!important}
#familia-boletim .report-summary i{width:65px;height:65px;flex:none;border-radius:22px;display:grid;place-items:center;font-size:30px!important}
#familia-boletim .family-report-panel{border:1px solid var(--rf-line);border-radius:22px;background:#fff;padding:26px 32px;margin-top:16px}
#familia-boletim .report-panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
#familia-boletim .report-panel-heading span{font-size:13px!important;color:#008e77;font-weight:700}
#familia-boletim .report-panel-heading h2{font-size:24px!important;color:var(--rf-ink);margin:5px 0 0}
#familia-boletim .report-panel-heading select{height:48px;border:1px solid var(--rf-line);background:white;border-radius:13px;padding:0 20px;font-size:15px!important;color:var(--rf-ink)}
#familia-boletim .grade-row{min-height:68px;grid-template-columns:2fr repeat(4,1fr);font-size:16px!important;padding:12px 18px;border-color:var(--rf-line)}
#familia-boletim .grade-row.head{min-height:48px;font-size:12px!important;color:#617baa;background:#f3f7fc}
#familia-boletim .grade-row :is(strong,b){font-size:16px!important;color:var(--rf-ink)}
#familia-boletim .grade-row i{height:46px;width:46px;font-size:17px!important;border-radius:14px}
#familia-boletim .grade-row em{font-size:14px!important;padding:9px 16px;border-radius:24px;font-style:normal}
#familia-boletim .teacher-note{display:flex;gap:18px;border-radius:15px;background:#f0f7ff;padding:18px;margin-top:18px}
#familia-boletim .teacher-note>i{display:grid;place-items:center;width:58px;height:58px;flex:none;background:#deebff;border-radius:50%;font-size:39px!important;color:#1476ff}
#familia-boletim .teacher-note :is(strong,span,small){font-size:15px!important;display:block;line-height:1.6;color:var(--rf-muted)}
#familia-boletim .teacher-note strong{color:var(--rf-ink)}
#familia-boletim .attendance-overview{display:grid;grid-template-columns:250px minmax(0,1fr);gap:48px;align-items:center;padding:0 8px 16px}
#familia-boletim .attendance-ring{width:215px;height:215px;background:conic-gradient(#23ac91 0 98.6%,#e6eff0 98.6%);border-radius:50%}
#familia-boletim .attendance-ring>div{width:161px;height:161px;background:#fff}
#familia-boletim .attendance-ring strong{font-size:29px!important;color:var(--rf-ink)}
#familia-boletim .attendance-ring span{font-size:14px!important;color:var(--rf-muted)}
#familia-boletim .attendance-bars>div{display:grid;grid-template-columns:94px 1fr 65px;gap:12px;align-items:center;margin:16px 0;font-size:15px!important}
#familia-boletim .attendance-bars em{height:12px;background:#e7edf2;border-radius:8px}
#familia-boletim .attendance-bars i{background:linear-gradient(90deg,#28af97,#76d6b9);border-radius:8px}
#familia-boletim .attendance-bars b{font-size:14px!important;text-align:right}
#familia-boletim .absence-list>div{padding:12px;border:1px solid var(--rf-line);border-radius:18px;margin:8px 0;display:flex;align-items:center;gap:26px}
#familia-boletim .absence-list>div>span{padding:14px 22px;background:#eff6ff;border-radius:15px;font-size:13px!important}
#familia-boletim .absence-list strong{font-size:15px!important;color:var(--rf-ink)}
#familia-boletim .absence-list small{font-size:14px!important;color:var(--rf-muted);display:block;margin-top:4px}
#familia-boletim .absence-list b{font-size:12px!important;margin-left:auto;padding:8px 16px;border-radius:20px}
/* Meals */
#familia-cardapio .family-content{max-width:1312px}
#familia-cardapio .meal-alert{padding:15px 20px;gap:16px;background:#e7faf4;border:1px solid #aee7d8;border-radius:18px;min-height:78px}
#familia-cardapio .meal-alert>i{width:48px;height:48px;font-size:30px!important;border-radius:16px}
#familia-cardapio .meal-alert strong{font-size:15px!important;color:#007b69}
#familia-cardapio .meal-alert p{font-size:14px!important;color:#5e829b;margin:5px 0 0}
#familia-cardapio .meal-alert button{font-size:15px!important;color:#007b69}
#familia-cardapio .meal-days{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:15px 0}
#familia-cardapio .meal-days button{height:66px;border:1px solid var(--rf-line);border-radius:18px;background:white;position:relative}
#familia-cardapio .meal-days span{font-size:12px!important;color:#6a86b3}
#familia-cardapio .meal-days b{font-size:16px!important;color:#294f90;margin-top:5px}
#familia-cardapio .meal-days button.active{background:linear-gradient(120deg,#099e96,#008b82);box-shadow:0 8px 20px #1cafb22a}
#familia-cardapio .meal-days button.active :is(span,b,i){color:white}
#familia-cardapio .meal-days i{font-size:12px!important}
#familia-cardapio .meal-layout{grid-template-columns:minmax(0,2.05fr) minmax(310px,1fr);gap:16px}
#familia-cardapio :is(.meal-plan,.family-profile-card){background:#fff;border:1px solid var(--rf-line);border-radius:20px;padding:22px 26px}
#familia-cardapio .family-section-heading span,#familia-cardapio .family-card-heading span{font-size:12px!important;color:#009d83;font-weight:700}
#familia-cardapio .family-section-heading h2{font-size:21px!important;margin:7px 0;color:var(--rf-ink)}
#familia-cardapio .meal-plan>article{display:grid;grid-template-columns:76px minmax(0,1fr);gap:23px;padding:17px 0;border-top:1px solid var(--rf-line)}
#familia-cardapio .meal-icon{width:76px;height:76px;border-radius:23px;font-size:36px!important}
#familia-cardapio .meal-plan article span{font-size:12px!important;color:#6580b0;font-weight:700}
#familia-cardapio .meal-plan h3{font-size:18px!important;margin:6px 0;color:var(--rf-ink)}
#familia-cardapio .meal-plan p{font-size:16px!important;color:var(--rf-muted);line-height:1.4;margin:0 0 9px}
#familia-cardapio .nutrition-tags{display:flex;gap:7px;flex-wrap:wrap}
#familia-cardapio .nutrition-tags b{font-size:12px!important;padding:8px 12px;border-radius:13px;background:#f0f5fa;color:#4b6b9e}
#familia-cardapio .family-card-heading h2{font-size:17px!important;margin:6px 0}
#familia-cardapio .nutrition-total{padding:14px;border-radius:16px;background:#ecf9f5;margin:16px 0}
#familia-cardapio .nutrition-total strong{font-size:26px!important;color:#008e7e}
#familia-cardapio .nutrition-total span{font-size:14px!important}
#familia-cardapio .nutrition-bar{grid-template-columns:110px 1fr 40px;gap:12px;margin:14px 0;font-size:13px!important}
#familia-cardapio .nutrition-bar em{height:11px}
#familia-cardapio .nutrition-note,#familia-cardapio .substitution-card p{font-size:14px!important;line-height:1.5;color:var(--rf-muted)}
#familia-cardapio .substitution-card button{height:43px;font-size:16px!important;color:#0666ff;border:1px solid #b9d5ff;border-radius:12px;background:white;width:100%}
/* Messages */
#familia-mensagens .family-content{max-width:1450px;padding:16px 22px 105px}
#familia-mensagens .agenda-heading{padding:0 28px;min-height:145px}
#familia-mensagens .new-message{align-self:flex-end;z-index:1;margin-bottom:8px;height:42px;background:linear-gradient(120deg,#0b3cbc,#385aff);color:white;border:0;border-radius:13px;padding:0 20px;font-size:14px!important}
#familia-mensagens .messages-layout{display:grid;grid-template-columns:34.5% minmax(0,1fr);min-height:590px;border:1px solid var(--rf-line);border-radius:23px;overflow:hidden;background:#fff}
#familia-mensagens .conversation-list{padding:20px 16px;border-right:1px solid var(--rf-line)}
#familia-mensagens .conversation-list>label{display:flex;align-items:center;padding:0 18px;gap:10px;height:48px;border:0;border-radius:14px;background:#f1f5fc;color:#6885b4;margin-bottom:15px}
#familia-mensagens .conversation-list input{font-size:15px!important;background:transparent;min-width:0;width:100%}
#familia-mensagens .conversation-list>button{position:relative;width:100%;min-height:80px;padding:13px 16px;border:1px solid var(--rf-line);border-radius:17px;background:white;gap:16px;margin:10px 0;display:flex;align-items:center;text-align:left}
#familia-mensagens .conversation-list>button.active{background:#e8f2ff;border-left:5px solid #345bff}
#familia-mensagens .conversation-list>button>i{width:52px;height:52px;border-radius:16px;background:#deefff;color:#154886;font-size:16px!important;font-style:normal;display:grid;place-items:center;flex:none}
#familia-mensagens .conversation-list strong{font-size:16px!important;color:var(--rf-ink);display:block}
#familia-mensagens .conversation-list p{font-size:14px!important;color:var(--rf-muted);margin:7px 0 0}
#familia-mensagens .conversation-list>button span{font-size:12px!important;color:var(--rf-muted)}
#familia-mensagens .conversation-panel{min-height:590px;display:flex;flex-direction:column;min-width:0;background:#f7fbff}
#familia-mensagens .conversation-panel>header{min-height:88px;background:#fff;padding:20px 25px;border-bottom:1px solid var(--rf-line);display:flex;gap:18px;align-items:center}
#familia-mensagens .conversation-panel>header>i{width:53px;height:53px;font-size:15px!important;border-radius:18px;background:#e1efff;color:#123e84}
#familia-mensagens .conversation-panel>header strong{font-size:18px!important;color:var(--rf-ink)}
#familia-mensagens .conversation-panel>header span{font-size:13px!important;color:var(--rf-muted);display:block;margin-top:6px}
#familia-mensagens .message-thread{flex:1;padding:25px;min-height:310px;max-height:400px;overflow:auto;display:flex;flex-direction:column;gap:14px;background:radial-gradient(ellipse at 20% 80%,#eef0ff66,transparent)}
#familia-mensagens .message-thread p{max-width:75%;padding:15px 20px;border-radius:20px;font-size:16px!important;line-height:1.4;margin:0;color:var(--rf-ink)}
#familia-mensagens .message-thread p.sent{align-self:flex-end;background:#e1f4f2}
#familia-mensagens .message-thread p.received{align-self:flex-start;background:white;border:1px solid var(--rf-line)}
#familia-mensagens .message-thread time{font-size:13px!important;color:#85a1b8;margin-top:7px;display:block}
#familia-mensagens .family-service-notice{font-size:13px!important;margin:8px 12px;padding:15px 17px;border:1px solid #e5e8ff;border-radius:14px;background:#f0f0ff;color:#6474b8}
#familia-mensagens .conversation-panel form{display:flex;align-items:center;gap:13px;background:#fff;border-top:1px solid var(--rf-line);padding:16px 22px}
#familia-mensagens .conversation-panel form input{height:49px;min-width:0;flex:1;font-size:15px!important;border:1px solid var(--rf-line);border-radius:17px;padding:0 20px}
#familia-mensagens .conversation-panel form button{height:50px;border:0;border-radius:27px;padding:0 26px;background:linear-gradient(100deg,#176c88,#245c7f);color:#fff;font-size:16px!important;font-weight:700}
#familia-mensagens .conversation-panel form #familyMessageAttachment{width:50px;padding:0;background:#f2f5fb;color:#4267a4}
/* Photo albums and health */
#familia-mural .family-content{max-width:1420px;padding-top:50px}
#familia-mural .album-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
#familia-mural .album-grid>button{padding:0;text-align:left;border:1px solid var(--rf-line);border-radius:22px;background:white;overflow:hidden;box-shadow:0 12px 25px #527ebc0a}
#familia-mural .album-cover{height:185px;position:relative;border-radius:0;background-size:cover}
#familia-mural .album-cover>span{font-size:95px!important;filter:drop-shadow(3px 8px 4px #45728430)}
#familia-mural .album-cover b{position:absolute;top:20px;right:23px;font-size:13px!important;padding:9px 16px;border-radius:25px;background:#354476b8;color:white}
#familia-mural .album-grid h2{font-size:20px!important;margin:18px 25px 4px;color:var(--rf-ink)}
#familia-mural .album-grid p{font-size:15px!important;margin:0 25px 20px;color:var(--rf-muted)}
#familia-mural .media-consent{padding:20px 18px;border:1px solid #b7e8df;background:#e6f8f2;border-radius:17px;color:#347385;font-size:16px!important;margin-bottom:20px}
#familia-mural .media-consent button{font-size:17px!important;color:#007f65;font-weight:700}
#familia-saude .family-content{max-width:1200px}
#familia-saude .health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#familia-saude .health-hero{grid-column:1/-1;display:flex;gap:24px;align-items:center;background:linear-gradient(110deg,#155daf,#225bad 65%,#1689e6);color:#fff;border-radius:21px;min-height:112px;padding:19px 26px}
#familia-saude .health-hero>i{width:76px;height:72px;border-radius:23px;display:grid;place-items:center;font-size:36px!important;background:#ffffff22;flex:none}
#familia-saude .health-hero span{font-size:12px!important;letter-spacing:.08em;color:#dcecff}
#familia-saude .health-hero h2{font-size:21px!important;margin:7px 0;color:#fff}
#familia-saude .health-hero p{font-size:14px!important;color:#fff;margin:0}
#familia-saude .health-hero>b{margin-left:auto;white-space:nowrap;background:#e6fbf5;color:#008c74;font-size:14px!important;padding:12px 20px;border-radius:24px}
#familia-saude .family-profile-card{border:1px solid var(--rf-line);background:white;border-radius:19px;padding:14px 18px}
#familia-saude .family-card-heading{display:flex;align-items:center;gap:18px;margin-bottom:10px}
#familia-saude .family-card-heading>div{flex:1}
#familia-saude .family-card-heading span{font-size:11px!important;font-weight:700;color:#008f89}
#familia-saude .family-card-heading h2{font-size:15px!important;margin:7px 0;color:var(--rf-ink)}
#familia-saude .family-card-heading button{font-size:13px!important;color:#0769ff}
#familia-saude .ref-card-icon{width:52px;height:52px;display:grid;place-items:center;flex:none;background:#e2f6ee;border-radius:17px;color:#008d78}
#familia-saude .ref-icon-1{background:#eee6ff;color:#7546fa}
#familia-saude .ref-icon-2{background:#e6f2ff;color:#0678ff}
#familia-saude .ref-icon-3{background:#ffebf1;color:#fa4b76}
#familia-saude .ref-card-icon svg{width:28px;height:28px}
#familia-saude .health-empty{font-size:13px!important;line-height:1.6;padding:14px 18px;margin:0;background:#eff9f7;border-radius:14px;color:#42868c}
#familia-saude .health-wide{grid-column:1/-1}
#familia-saude .health-wide:has(.family-contact-row){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px}
#familia-saude .health-wide>.family-card-heading{grid-column:1/-1}
#familia-saude .family-contact-row{display:flex;align-items:center;gap:18px;padding:14px;border:1px solid #e7edff;border-radius:17px;min-width:0}
#familia-saude .family-contact-row>i{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:15px!important;font-style:normal}
#familia-saude .family-contact-row strong{font-size:14px!important;color:var(--rf-ink)}
#familia-saude .family-contact-row small{font-size:14px!important;color:var(--rf-muted);margin:4px 0;display:block}
#familia-saude .family-contact-row span{font-size:13px!important;color:var(--rf-ink);display:block}
#familia-saude .family-contact-row>b{font-size:11px!important;padding:9px 12px;margin-left:auto;border-radius:20px}
#familia-saude .health-wide dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}
#familia-saude .health-wide dl>div{display:block;padding:12px 20px;background:#f5f8fd;border:1px solid var(--rf-line);border-radius:16px}
#familia-saude .health-wide dt{font-size:13px!important;color:var(--rf-muted)}
#familia-saude .health-wide dd{font-size:14px!important;color:var(--rf-ink);margin:6px 0 0;font-weight:700}
#familia-comunicados .agenda-heading{min-height:120px;margin-bottom:16px}
#familia-comunicados .ref-illustration{height:139px;top:-10px}
#familia-mural .album-cover>span{display:block;width:240px;height:170px;font-size:0!important;background-image:url('assets/family-reference/mural.png');background-repeat:no-repeat;background-size:1536px 1024px;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);filter:none}
#familia-mural .reading-album{background:linear-gradient(115deg,#e0d5ff,#c7b5fd)}
#familia-mural .reading-album>span{background-position:-330px -410px}
#familia-mural .sports-album{background:linear-gradient(115deg,#fff0c4,#ffd093)}
#familia-mural .sports-album>span{background-position:-1015px -410px}
#familia-mural .science-album{background:linear-gradient(115deg,#bdf1e6,#7ccfc9)}
#familia-mural .science-album>span{background-position:-320px -703px}
#familia-mural .album-cover:before{position:absolute;left:28px;top:60px;font-size:13px;font-weight:700;letter-spacing:1px;white-space:pre-line;line-height:1.5;color:#6e48dc}
#familia-mural .reading-album:before{content:'NOSSA LEITURA\a FAZ HISTÓRIAS'}
#familia-mural .sports-album:before{content:'ESPORTE TAMBÉM\a EDUCA';color:#c57916}
#familia-mural .science-album:before{content:'CIÊNCIA HOJE,\a UM AMANHÃ MELHOR';color:#008e83}
#familia-agenda .family-app-shell{max-width:1256px}
#familia-atividades .family-app-shell{max-width:1364px}
#familia-boletim .attendance-ring{display:grid;place-items:center}
#familia-boletim .attendance-ring:before{display:none}
#familia-boletim .attendance-ring>div{border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:static}
#familia-boletim.ref-attendance .family-content{max-width:1304px}
#familia-boletim.ref-attendance .agenda-heading{min-height:110px}
#familia-boletim.ref-attendance .report-summary article{min-height:140px}
#familia-cardapio .agenda-heading{min-height:102px}
#familia-cardapio .ref-illustration{top:-12px;height:132px}
#familia-mural .album-cover b{bottom:auto;height:auto;line-height:1.3}
#familia-mural .ref-back{margin:0 0 -20px;width:40px;height:40px}
#familia-mural .agenda-heading>div:first-child{padding-left:105px}
#familia-mural .agenda-heading>div:first-child:before{content:'▣';position:absolute;left:0;top:25px;display:grid;place-items:center;width:76px;height:76px;border-radius:23px;background:#ece7ff;color:#7e57ed;font-size:35px}
#familia-comunicados .agenda-heading>div:first-child{padding-left:90px}
#familia-comunicados .agenda-heading>div:first-child:before{content:'📣';position:absolute;left:0;top:15px;display:grid;place-items:center;width:67px;height:67px;border-radius:50%;background:#e8e3ff;font-size:40px}
/* Calendário escolar */
#familia-calendario .family-topbar{position:relative}
#familia-calendario .family-topbar>.ref-calendar-menu{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid var(--rf-line);border-radius:12px;background:#fff;color:#4569a5;font-size:20px!important}
#familia-calendario .family-brand{margin-left:145px}
#familia-calendario .family-brand>img{width:160px}
#familia-calendario .ref-account{margin-right:225px}
#familia-calendario .family-content{max-width:1040px;padding-top:4px}
#familia-calendario .agenda-heading{min-height:112px;margin-bottom:5px}
#familia-calendario .agenda-heading>div:first-child{max-width:48%}
#familia-calendario .agenda-heading h1{font-size:34px!important;margin-bottom:4px}
#familia-calendario .agenda-heading p{font-size:16px!important}
#familia-calendario .calendar-layout{grid-template-columns:minmax(0,2.3fr) minmax(280px,1fr);gap:14px;align-items:stretch}
#familia-calendario .calendar-main,#familia-calendario .calendar-upcoming{border:1px solid var(--rf-line);border-radius:20px;background:#ffffffee;box-shadow:0 9px 24px #446eae0a}
#familia-calendario .calendar-main{padding:14px 15px 17px}
#familia-calendario .calendar-month-head{display:grid;grid-template-columns:42px 1fr 42px 64px;align-items:center;gap:12px;min-height:44px}
#familia-calendario .calendar-month-head h2{text-align:center;font-size:17px!important;color:var(--rf-ink);margin:0}
#familia-calendario .calendar-month-head button{width:42px;height:42px;border:1px solid var(--rf-line);border-radius:12px;background:#fff;color:#244a86;font-size:18px!important}
#familia-calendario .calendar-month-head #calendarToday{width:64px;color:#1268ee;font-size:13px!important;font-weight:700}
#familia-calendario .calendar-legend{height:38px;display:flex;align-items:center;justify-content:center;gap:25px;margin:0 0 5px;padding:0;border-top:1px solid #e7eef9;border-bottom:1px solid #e7eef9}
#familia-calendario .calendar-legend span{font-size:11px!important;color:var(--rf-muted);gap:7px}
#familia-calendario .calendar-legend i{width:8px;height:8px}
#familia-calendario .calendar-legend i.blue{background:#2f86ef}
#familia-calendario .calendar-legend i.orange{background:#03a174}
#familia-calendario .calendar-legend i.green{background:#ff9718}
#familia-calendario .calendar-legend i.violet{background:#8845ef}
#familia-calendario .month-grid{gap:7px}
#familia-calendario .month-grid>b{padding:9px 4px 4px;font-size:10px!important;color:#6d82a8}
#familia-calendario .month-grid>button{height:64px;aspect-ratio:auto;border:1px solid transparent;border-radius:12px;background:#f7faff;color:#1e355f;font-size:13px!important}
#familia-calendario .month-grid>button:hover{background:#eef5ff}
#familia-calendario .month-grid .muted{background:#fbfcfe;color:#afbdd2}
#familia-calendario .month-grid .today{background:#f7faff;color:#1e355f;box-shadow:none}
#familia-calendario .month-grid .ref-today{border-color:#72a8ff;background:#f1f6ff;color:#1646df;font-weight:800}
#familia-calendario .month-grid .ref-today:after{content:'Hoje';position:absolute;right:-1px;top:-1px;padding:4px 8px;border-radius:8px 9px 0 8px;background:#2274ef;color:#fff;font-size:10px!important;font-weight:700}
#familia-calendario .month-grid button.selected{box-shadow:inset 0 0 0 2px #4f8eff;background:#f1f6ff}
#familia-calendario .month-grid .has-event i{width:7px;height:7px;bottom:10px}
#familia-calendario .month-grid .has-event small{position:absolute;left:8px;top:6px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;display:grid;place-items:center;background:#166bf3;color:#fff;font-size:9px!important;font-weight:800}
#familia-calendario .month-grid .blue-event i{background:#2f86ef}
#familia-calendario .month-grid .orange-event i{background:#ff9718}
#familia-calendario .month-grid .green-event i{background:#03a174}
#familia-calendario .month-grid .violet-event i{background:#8845ef}
#familia-calendario .calendar-upcoming{min-height:510px;padding:19px 20px 15px;display:flex;flex-direction:column}
#familia-calendario .calendar-upcoming .family-section-heading{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:14px}
#familia-calendario .calendar-upcoming .family-section-heading span{font-size:10px!important;color:var(--rf-green);font-weight:800;letter-spacing:.04em}
#familia-calendario .calendar-upcoming .family-section-heading h2{font-size:18px!important;color:var(--rf-ink);margin:7px 0 0}
#familia-calendario .ref-calendar-all{color:#0568f5;font-size:12px!important;font-weight:700;margin-top:10px;white-space:nowrap}
#familia-calendario .ref-calendar-all:hover{text-decoration:underline}
#familia-calendario .calendar-upcoming article{position:relative;grid-template-columns:54px minmax(0,1fr) 12px;gap:14px;min-height:78px;padding:11px 0;border-top:1px solid #e6edf8;cursor:pointer;border-radius:11px;transition:background .18s ease}
#familia-calendario .calendar-upcoming article:hover,#familia-calendario .calendar-upcoming article:focus-visible{background:#f5f9ff;outline:none}
#familia-calendario .calendar-upcoming article:after{content:'›';grid-column:3;grid-row:1;align-self:center;color:#2d65a8;font-size:22px!important}
#familia-calendario .calendar-upcoming time{grid-column:1;width:52px;height:52px;border-radius:13px;background:#e7f3ff!important;color:#0873e6!important;font-size:11px!important}
#familia-calendario .calendar-upcoming time b{font-size:15px!important;margin-bottom:-5px}
#familia-calendario .calendar-upcoming time.orange{background:#fff2df!important;color:#e97c00!important}
#familia-calendario .calendar-upcoming time.green{background:#e1f8f0!important;color:#008b66!important}
#familia-calendario .calendar-upcoming time.violet{background:#efe8ff!important;color:#7140df!important}
#familia-calendario .calendar-upcoming article>div{grid-column:2;min-width:0}
#familia-calendario .calendar-upcoming article span{font-size:9px!important;color:#657da8}
#familia-calendario .calendar-upcoming article strong{font-size:13px!important;line-height:1.25;color:var(--rf-ink);margin:4px 0}
#familia-calendario .calendar-upcoming article small{font-size:11px!important;color:#8195b7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#familia-calendario .calendar-school-note{margin-top:auto;min-height:58px;display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:13px;background:#edf6ff}
#familia-calendario .calendar-school-note>i{width:28px;height:28px;display:grid;place-items:center;color:#0672ef}
#familia-calendario .calendar-school-note svg{width:22px;height:22px}
#familia-calendario .calendar-school-note strong{font-size:11px!important;color:#223d70}
#familia-calendario .calendar-school-note span{font-size:10px!important;color:#7a90b2;margin-top:4px}
#familia-calendario .calendar-empty-month{margin:35px 0;color:#7489aa;text-align:center;font-size:13px!important}
.family-calendar-backdrop{z-index:450}
.family-calendar-detail{position:fixed;z-index:451;left:50%;top:50%;width:min(620px,calc(100% - 28px));max-height:min(720px,calc(100dvh - 32px));overflow:auto;transform:translate(-50%,-46%) scale(.97);opacity:0;pointer-events:none;background:#fff;border:1px solid #dfe9f7;border-radius:24px;padding:26px;box-shadow:0 24px 80px rgba(24,69,127,.24);transition:.2s ease}
.family-calendar-detail.open{transform:translate(-50%,-50%) scale(1);opacity:1;pointer-events:auto}
.family-calendar-detail>.drawer-close{right:18px;top:18px}
.family-calendar-detail-heading{display:flex;align-items:center;gap:15px;padding-right:42px;margin-bottom:18px}
.family-calendar-detail-heading>i{width:54px;height:54px;flex:0 0 54px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(145deg,#e4efff,#f1eaff);color:#316de6;font-size:25px!important;font-style:normal}
.family-calendar-detail-heading span{display:block;color:#0b8d75;font-size:10px!important;font-weight:800;letter-spacing:.06em}
.family-calendar-detail-heading h2{margin:4px 0;color:#071f58;font-size:23px!important}
.family-calendar-detail-heading p{margin:0;color:#6f84a8;font-size:13px!important}
.family-calendar-detail-list{display:grid;gap:12px}
.family-calendar-detail-list article{display:grid;grid-template-columns:8px minmax(0,1fr);gap:14px;padding:17px;border:1px solid #e3ebf6;border-radius:17px;background:#fbfdff}
.family-calendar-detail-list article>i{width:8px;height:100%;min-height:70px;border-radius:5px;background:#2f86ef}
.family-calendar-detail-list article.green>i{background:#03a174}.family-calendar-detail-list article.orange>i{background:#ff9718}.family-calendar-detail-list article.violet>i{background:#8845ef}
.family-calendar-detail-list span{color:#52719f;font-size:11px!important;font-weight:800;text-transform:uppercase}
.family-calendar-detail-list h3{margin:5px 0;color:#071f58;font-size:18px!important}
.family-calendar-detail-list p{margin:0 0 9px;color:#5f7598;font-size:14px!important;line-height:1.5}
.family-calendar-detail-list small{color:#284d83;font-size:12px!important;font-weight:700}
#familia-agenda .agenda-calendar>div{cursor:pointer}
#familia-agenda .agenda-calendar>div.is-today:not(.selected){box-shadow:inset 0 0 0 1px #77a7ef;background:#f5f9ff}
/* Responsive layouts retain readable content and all actions. */
@media(max-width:1100px){
 .ref-family .ref-illustration{opacity:.5;right:-130px;transform:scale(.85);transform-origin:right center}
 .ref-family .agenda-heading>div:first-child{max-width:65%}
 .ref-family .ref-account .family-guardian-selector{display:none}
 #familia-atividades .activity-card-top{grid-template-columns:48px minmax(0,1fr) 38px;gap:12px}
 #familia-atividades .activity-card-top>.subject{width:48px;height:48px}
 #familia-boletim .report-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 #familia-comunicados .communication-summary{gap:16px}
 #familia-comunicados .communication-summary p{font-size:14px!important}
 #familia-comunicados .communication-summary button{font-size:13px!important;padding:12px}
 #familia-mensagens .messages-layout{grid-template-columns:36% minmax(0,1fr)}
 #familia-calendario .family-brand{margin-left:0}
 #familia-calendario .ref-account{margin-right:0}
}
@media(max-width:720px){
 .ref-family{padding:0!important}
 .ref-family .family-app-shell{border:0;border-radius:0;min-height:100dvh}
 .ref-family .family-topbar{height:68px;min-height:68px;padding:8px 14px;gap:8px}
 .ref-family .family-brand>img{width:135px;height:44px}
 .ref-family .ref-account{gap:10px}
 .ref-family .child-selector{min-width:0;grid-template-columns:34px 12px;gap:5px;padding:5px 8px;min-height:43px;border-radius:14px}
 .ref-family .child-selector i{width:34px;height:34px;font-size:11px!important}
 .ref-family .child-selector span{display:none}
 .ref-family .ref-notifications{width:35px;height:37px}
 .ref-family .ref-illustration{display:none}
 .ref-family .family-content,#familia-mensagens .family-content,#familia-mural .family-content{padding:18px 16px 100px}
 .ref-family .agenda-heading,#familia-mensagens .agenda-heading{min-height:110px;padding:0;align-items:center;flex-wrap:wrap;margin-bottom:15px}
 .ref-family .agenda-heading>div:first-child{max-width:100%}
 #familia-comunicados .agenda-heading>div:first-child,#familia-mural .agenda-heading>div:first-child{padding-left:0}
 #familia-comunicados .agenda-heading>div:first-child:before,#familia-mural .agenda-heading>div:first-child:before{display:none}
 .ref-family .agenda-heading h1,#familia-atividades .agenda-heading h1{font-size:30px!important;letter-spacing:-.8px}
 .ref-family .agenda-heading p{font-size:15px!important}
 .ref-family .agenda-heading>div>span{font-size:11px!important}
 .ref-family .ref-back{margin:0 0 8px;width:35px;height:35px}
 .ref-family .family-bottom-nav{height:63px;bottom:8px;width:calc(100% - 20px);border-radius:19px;padding:3px}
 .ref-family .family-bottom-nav button{width:20%;font-size:10px!important;padding:3px}
 .ref-family .family-bottom-nav b{right:10px}
 .ref-family .ref-footer{display:none}
 .ref-family :is(.activities-toolbar,.communications-toolbar,.agenda-toolbar){align-items:stretch;flex-direction:column;gap:12px}
 .ref-family :is(.activity-tabs,.agenda-filter-chips,.report-tabs){gap:6px}
 .ref-family :is(.activity-tabs,.agenda-filter-chips,.report-tabs)>button{padding:9px 12px;font-size:12px!important;min-height:40px;border-radius:12px}
 .ref-family .communication-search{width:100%}
 #familia-comunicados .communication-summary{flex-wrap:wrap;padding:17px;gap:12px}
 #familia-comunicados .communication-summary:before{flex-basis:45px;height:45px;font-size:25px!important;border-radius:14px}
 #familia-comunicados .communication-summary>div{min-width:70px;border:0;padding:0}
 #familia-comunicados .communication-summary p{flex-basis:100%;font-size:14px!important}
 #familia-comunicados .communication-summary button{width:100%;font-size:14px!important}
 #familia-comunicados .communication-card{grid-template-columns:44px minmax(0,1fr);gap:12px;padding:15px 20px 14px 13px;min-height:0}
 #familia-comunicados .communication-icon{width:42px;height:45px;font-size:25px!important;border-radius:15px}
 #familia-comunicados .communication-card p{font-size:14px!important;line-height:1.5}
 #familia-comunicados .communication-card h2{font-size:16px!important;padding-right:10px}
 #familia-comunicados .communication-card footer{align-items:flex-start;flex-direction:column;gap:8px}
 #familia-comunicados .communication-card:after{right:10px;top:20px;font-size:22px!important}
 #familia-comunicados .communication-card>u{right:10px;top:10px;width:7px;height:7px}
 #familia-agenda .agenda-calendar{padding:4px;grid-template-columns:18px repeat(7,minmax(0,1fr)) 18px;gap:1px;height:66px}
 #familia-agenda .agenda-calendar>div{height:56px}
 #familia-agenda .agenda-calendar span{font-size:9px!important}
 #familia-agenda .agenda-calendar b{font-size:13px!important}
 #familia-agenda .agenda-entry{grid-template-columns:36px minmax(0,1fr) 7px;gap:10px;padding:14px 11px}
 #familia-agenda .agenda-entry>.subject{width:36px;height:40px;border-radius:11px}
 #familia-agenda .agenda-entry>.subject svg{width:23px;height:23px}
 #familia-agenda .entry-task{padding:10px;gap:8px}
 #familia-agenda .agenda-entry footer{align-items:flex-start;gap:8px;flex-wrap:wrap}
 #familia-atividades .activity-stats{grid-template-columns:1fr;gap:9px;margin-bottom:16px}
 #familia-atividades .activity-stats article{min-height:80px;padding:12px 18px;gap:18px;border-radius:18px}
 #familia-atividades .activity-stats i{width:52px;height:52px;border-radius:17px}
 #familia-atividades .activity-stats svg{width:28px;height:28px}
 #familia-atividades .activity-stats strong{font-size:25px!important}
 #familia-atividades .activity-stats small{font-size:14px!important}
 #familia-atividades .activities-list{grid-template-columns:1fr}
 #familia-atividades .activity-card{padding:17px}
 #familia-atividades .activity-card h2{font-size:18px!important}
 #familia-atividades .activity-card p{font-size:15px!important}
 #familia-atividades .activity-card-bottom{grid-template-columns:1fr}
 #familia-atividades .activity-card-bottom small{text-align:left;font-size:14px!important}
 #familia-atividades .complete-activity{font-size:16px!important}
 #familia-boletim .report-summary{gap:10px}
 #familia-boletim .report-summary article{min-height:120px;padding:13px;display:block}
 #familia-boletim .report-summary article.featured{padding:15px}
 #familia-boletim .report-summary article.featured:before{display:none}
 #familia-boletim .report-summary i{width:34px;height:34px;border-radius:10px;margin-bottom:8px}
 #familia-boletim .report-summary strong{font-size:24px!important}
 #familia-boletim .report-summary p{font-size:12px!important}
 #familia-boletim .family-report-panel{padding:16px 12px}
 #familia-boletim .report-panel-heading{gap:10px;align-items:flex-start;flex-wrap:wrap}
 #familia-boletim .report-panel-heading h2{font-size:20px!important}
 #familia-boletim .family-grade-table{overflow-x:auto}
 #familia-boletim .grade-row{min-width:540px}
 #familia-boletim .teacher-note{gap:10px;padding:14px}
 #familia-boletim .teacher-note>i{width:35px;height:35px;font-size:30px!important}
 #familia-boletim .teacher-note :is(strong,span,small){font-size:13px!important}
 #familia-boletim .attendance-overview{grid-template-columns:1fr;gap:15px;padding:0}
 #familia-boletim .attendance-ring{margin:auto}
 #familia-boletim .attendance-bars>div{grid-template-columns:65px 1fr 45px;gap:8px;font-size:13px!important}
 #familia-boletim .absence-list>div{gap:10px;flex-wrap:wrap}
 #familia-boletim .absence-list>div>span{padding:10px;font-size:11px!important}
 #familia-cardapio .meal-alert{align-items:flex-start;flex-wrap:wrap;padding:15px;gap:10px}
 #familia-cardapio .meal-alert>div{flex:1}
 #familia-cardapio .meal-alert>button{width:100%;text-align:left;margin-left:58px}
 #familia-cardapio .meal-days{gap:5px}
 #familia-cardapio .meal-days button{height:62px;border-radius:12px}
 #familia-cardapio .meal-days i{display:none}
 #familia-cardapio .meal-layout{grid-template-columns:1fr}
 #familia-cardapio :is(.meal-plan,.family-profile-card){padding:18px}
 #familia-cardapio .meal-plan>article{grid-template-columns:45px minmax(0,1fr);gap:12px}
 #familia-cardapio .meal-icon{width:45px;height:50px;font-size:28px!important;border-radius:15px}
 #familia-cardapio .meal-plan p{font-size:14px!important}
 #familia-cardapio .meal-plan h3{font-size:16px!important}
 #familia-cardapio .nutrition-tags b{font-size:11px!important;padding:6px 8px}
 #familia-mensagens .messages-layout{display:block;min-height:520px}
 #familia-mensagens .conversation-list{border:0;padding:12px}
 #familia-mensagens .conversation-panel{min-height:520px}
 #familia-mensagens .conversation-panel>header{padding:15px;gap:10px}
 #familia-mensagens .conversation-panel>header strong{font-size:16px!important}
 #familia-mensagens .conversation-panel>header span{font-size:12px!important}
 #familia-mensagens .message-thread{padding:15px}
 #familia-mensagens .message-thread p{max-width:90%;font-size:15px!important}
 #familia-mensagens .conversation-panel form{padding:10px;gap:6px;flex-wrap:wrap}
 #familia-mensagens .conversation-panel form button{padding:0 15px;height:44px;font-size:14px!important}
 #familia-mensagens .conversation-panel form input{padding:0 12px;font-size:14px!important}
 #familia-mural .album-grid{grid-template-columns:1fr;gap:16px}
 #familia-calendario .family-topbar>.ref-calendar-menu{display:none}
 #familia-calendario .family-content{padding-top:10px}
 #familia-calendario .agenda-heading{min-height:104px}
 #familia-calendario .agenda-heading>div:first-child{max-width:100%}
 #familia-calendario .calendar-layout{grid-template-columns:1fr}
 #familia-calendario .calendar-main{padding:10px 8px 14px}
 #familia-calendario .calendar-month-head{grid-template-columns:36px 1fr 36px 53px;gap:6px}
 #familia-calendario .calendar-month-head button{width:36px;height:36px}
 #familia-calendario .calendar-month-head #calendarToday{width:53px;font-size:11px!important}
 #familia-calendario .calendar-legend{gap:10px;justify-content:flex-start;padding:0 6px;overflow:auto}
 #familia-calendario .month-grid{gap:3px}
 #familia-calendario .month-grid>button{height:44px;border-radius:8px;font-size:11px!important}
 #familia-calendario .month-grid .ref-today:after{padding:2px 4px;font-size:8px!important}
 #familia-calendario .calendar-upcoming{min-height:0;padding:16px}
 #familia-mural .album-cover{height:170px}
 #familia-mural .media-consent{font-size:14px!important;line-height:1.6;padding:14px}
 #familia-mural .media-consent button{font-size:15px!important}
 #familia-saude .health-grid{grid-template-columns:1fr}
 #familia-saude .health-hero{padding:18px;gap:13px;flex-wrap:wrap}
 #familia-saude .health-hero>i{width:48px;height:48px;font-size:29px!important}
 #familia-saude .health-hero>div{flex:1}
 #familia-saude .health-hero h2{font-size:18px!important}
 #familia-saude .health-hero p{font-size:13px!important;line-height:1.5}
 #familia-saude .health-hero>b{padding:8px 15px}
 #familia-saude .family-card-heading{gap:10px;flex-wrap:wrap}
 #familia-saude .ref-card-icon{width:40px;height:44px;border-radius:13px}
 #familia-saude .health-wide:has(.family-contact-row){grid-template-columns:1fr;gap:10px}
 #familia-saude .health-wide dl{grid-template-columns:1fr}
 #familia-saude .family-contact-row{gap:10px;padding:10px}
}

/* Family photo album viewer */
#familia-mural .album-grid>button{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
#familia-mural .album-grid>button:hover{transform:translateY(-3px);border-color:#b8cdf5;box-shadow:0 18px 35px #3a70b91d}
#familia-mural .album-card-info{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-right:23px}
#familia-mural .album-card-info>div{min-width:0}
#familia-mural .album-card-info h2{margin-top:18px}
#familia-mural .album-card-info i{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;background:#f1f6ff;color:#246de0;font-size:27px!important;font-style:normal}
.family-album-open{overflow:hidden}
.family-album-backdrop{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;padding:24px;background:#071b48a8;backdrop-filter:blur(8px)}
.family-album-backdrop[hidden]{display:none}
.family-album-viewer{width:min(1040px,100%);max-height:min(890px,calc(100dvh - 48px));overflow:hidden;display:flex;flex-direction:column;border:1px solid #d8e4f6;border-radius:28px;background:#f8fbff;box-shadow:0 30px 90px #06163766;color:#0a2459}
.family-album-viewer>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 25px 18px;border-bottom:1px solid #dfe8f5;background:#fff}
.family-album-viewer>header span{display:block;margin-bottom:5px;color:#7a5af1;font-size:11px!important;font-weight:800;letter-spacing:.08em}
.family-album-viewer>header h2{margin:0;color:#08225a;font-size:27px!important;line-height:1.15}
.family-album-viewer>header p{margin:7px 0 0;color:#6680a8;font-size:14px!important}
.family-album-close{width:42px;height:42px;flex:none;border:1px solid #dae5f4;border-radius:14px;background:#f6f9fe;color:#385b91;font-size:29px!important;line-height:1;cursor:pointer}
.family-album-body{padding:20px 24px 24px;overflow:auto}
.family-album-stage{position:relative;min-height:390px;display:grid;grid-template-columns:52px minmax(0,1fr) 52px;align-items:center;gap:16px}
.family-album-photo{position:relative;height:390px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:25px;isolation:isolate;box-shadow:inset 0 0 0 1px #ffffff99,0 18px 35px #406ea91a}
.family-album-photo:before,.family-album-photo:after{content:'';position:absolute;border-radius:50%;background:#fff4;z-index:-1}
.family-album-photo:before{width:330px;height:330px;right:-85px;top:-100px}
.family-album-photo:after{width:240px;height:240px;left:-70px;bottom:-120px}
.family-album-photo.reading-album,.family-album-thumb.reading-album{background:linear-gradient(135deg,#d6ccff,#a697f4)}
.family-album-photo.sports-album,.family-album-thumb.sports-album{background:linear-gradient(135deg,#ffe8ac,#ffc66c)}
.family-album-photo.science-album,.family-album-thumb.science-album{background:linear-gradient(135deg,#baf1e7,#65c7bd)}
.family-album-photo.garden-album,.family-album-thumb.garden-album{background:linear-gradient(135deg,#d6f2c5,#77c890)}
.family-album-photo.variant-1,.family-album-thumb.variant-1{filter:saturate(.9) hue-rotate(4deg)}
.family-album-photo.variant-2,.family-album-thumb.variant-2{filter:saturate(1.08) brightness(.98)}
.family-album-photo.variant-3,.family-album-thumb.variant-3{filter:hue-rotate(-8deg)}
.family-album-photo.variant-4,.family-album-thumb.variant-4{filter:saturate(.82) brightness(1.05)}
.family-album-photo.variant-5,.family-album-thumb.variant-5{filter:hue-rotate(9deg) saturate(1.05)}
.family-album-photo>span{font-size:116px!important;filter:drop-shadow(5px 12px 7px #284d792b);transform:rotate(-5deg)}
.family-album-photo>strong{margin-top:18px;color:#15305e;font-size:23px!important}
.family-album-photo>small{margin-top:7px;padding:6px 12px;border-radius:20px;background:#ffffffa6;color:#476184;font-size:12px!important;font-weight:700}
.family-album-arrow{width:48px;height:48px;border:1px solid #ccdaee;border-radius:15px;background:#fff;color:#1b63ca;font-size:34px!important;box-shadow:0 8px 18px #315b9420;cursor:pointer}
.family-album-summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 70px 14px}
.family-album-summary div{display:flex;flex-direction:column;gap:5px}
.family-album-summary strong{font-size:16px!important;color:#0d2a5f}
.family-album-summary span{font-size:13px!important;color:#7187a8}
.family-album-summary>b{padding:8px 13px;border-radius:18px;background:#e8f1ff;color:#1763ce;font-size:13px!important;white-space:nowrap}
.family-album-thumbs{display:flex;gap:10px;padding:5px 70px 13px;overflow-x:auto;scrollbar-width:thin}
.family-album-thumb{position:relative;width:92px;height:70px;flex:0 0 92px;overflow:hidden;border:3px solid transparent;border-radius:13px;cursor:pointer;opacity:.68}
.family-album-thumb.active{border-color:#176cf1;box-shadow:0 0 0 2px #fff,0 0 0 4px #176cf1;opacity:1}
.family-album-thumb span{font-size:30px!important}
.family-album-thumb b{position:absolute;right:5px;bottom:4px;display:grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border-radius:12px;background:#16355fc7;color:white;font-size:10px!important}
.family-album-body>footer{margin:10px 70px 0;padding:12px 15px;border-radius:13px;background:#e8f7f2;color:#207763;font-size:12px!important}
@media(max-width:720px){
 .family-album-backdrop{padding:0;align-items:end}
 .family-album-viewer{max-height:94dvh;border-radius:24px 24px 0 0}
 .family-album-viewer>header{padding:17px 16px 14px}
 .family-album-viewer>header h2{font-size:21px!important}
 .family-album-viewer>header p{font-size:12px!important;line-height:1.4}
 .family-album-close{width:38px;height:38px}
 .family-album-body{padding:14px 12px 18px}
 .family-album-stage{min-height:270px;grid-template-columns:36px minmax(0,1fr) 36px;gap:7px}
 .family-album-photo{height:270px;border-radius:18px}
 .family-album-photo>span{font-size:78px!important}
 .family-album-photo>strong{font-size:16px!important;text-align:center;padding:0 10px}
 .family-album-arrow{width:36px;height:43px;border-radius:11px;font-size:27px!important}
 .family-album-summary{padding:14px 43px 11px;align-items:flex-start}
 .family-album-summary strong{font-size:14px!important}
 .family-album-summary span{font-size:11px!important}
 .family-album-thumbs{padding:5px 43px 12px}
 .family-album-thumb{width:72px;height:56px;flex-basis:72px}
 .family-album-body>footer{margin:8px 43px 0;line-height:1.45}
 #familia-mural .album-card-info{padding-right:16px}
}

/* Keep the approved Home chrome identical on every family screen on phones. */
@media(max-width:720px){
 .family-view.family-unified-chrome .family-topbar{height:68px;min-height:68px;padding:0 14px;gap:8px}
 .family-view.family-unified-chrome .family-brand>img{width:122px;height:48px}
 .family-view.family-unified-chrome#familia-calendario .family-brand>img{width:122px}
 .family-view.family-unified-chrome .family-home-account{gap:10px}
 .family-view.family-unified-chrome .family-student-selector{width:auto;min-width:0;grid-template-columns:34px 14px;gap:5px;padding:5px 8px}
 .family-view.family-unified-chrome .family-student-selector i{width:34px;height:34px;font-size:11px!important}
 .family-view.family-unified-chrome .family-student-selector span{display:none}
 .family-view.family-unified-chrome .family-guardian-selector,
 .family-view.family-unified-chrome .family-account-divider{display:none}
 .family-view.family-unified-chrome .family-notification-button{width:42px;height:42px}
 .family-view.family-unified-chrome .family-bottom-nav{width:calc(100% - 18px);height:56px;bottom:8px;padding:0;border-radius:16px}
 .family-view.family-unified-chrome .family-bottom-nav button{width:20%;font-size:9px!important;padding:0}
 .family-view.family-unified-chrome .family-bottom-nav b{top:2px;right:20px}
}
