/* ILIMI local school edition. The published static site keeps its own design. */
:root{
  --green:#145641;
  --green2:#0d4031;
  --yellow:#e4b449;
  --ink:#19332b;
  --muted:#52665c;
  --border:#dce6df;
  --bg:#f3f6f3;
  --mint:#e8f2eb;
  --red:#9f392e;
  --radius:18px;
  --premium-surface:#ffffff;
  --premium-navy:color-mix(in srgb,var(--green) 66%,#0a1d18);
  --premium-shadow:0 14px 36px rgba(20,54,39,.045),0 2px 8px rgba(20,54,39,.025);
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
h1,h2,h3,.stat-value{font-family:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
h1{font-size:clamp(28px,2.4vw,38px);font-weight:600;letter-spacing:-.045em;line-height:1.22}
h2{font-size:21px;letter-spacing:-.025em}
h3{font-size:18px}
p{line-height:1.6}
button,a,input,select,textarea,summary{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #b47b16;outline-offset:3px}

/* A quiet institutional rail frames the active school work. */
.sidebar{width:270px;padding:24px 15px 18px;background:var(--premium-navy);color:#eaf4ed;border-right:0;box-shadow:8px 0 24px rgba(17,46,39,.045)}
.shell{margin-left:270px;min-width:0}
.brand{padding:5px 12px 19px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:14px}
.brand img{display:block;width:100%;height:82px;max-height:82px;object-fit:contain;object-position:center;padding:8px;border-radius:12px;background:#fff;filter:none}
.brand strong{display:block;margin-top:12px}
.brand>span{color:#bdd7c4;font-size:11px;letter-spacing:.19em;margin-top:6px}
.nav-caption{color:#9fbdae;font-size:11px;letter-spacing:.16em;font-weight:700;padding:0 13px;margin:6px 0 9px}
nav{gap:3px}
nav a{min-height:46px;border-radius:11px;padding:10px 13px;color:#d3e4d8;font-size:14px;line-height:1.3;font-weight:500;gap:11px}
nav a svg{opacity:.86}
nav a:hover{background:rgba(255,255,255,.1);color:white}
nav a.active{background:#e8f2eb;color:#123d30;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.08)}
nav a.active:after{width:6px;height:6px;background:#d8a435}
.side-bottom{padding-top:10px}
.powered-by{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin:0 8px 12px;padding:13px 0 0;border-top:1px solid rgba(255,255,255,.16);color:#c8dfd1;font-size:11px;line-height:1.2}
.powered-by img{display:block;width:132px;height:52px;object-fit:contain;object-position:center;padding:6px;background:#fff;border-radius:9px;filter:none}
.powered-by span{order:-1;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.demo-card{background:#f6ebca;border:1px solid #dfc987;color:#463919;font-size:12px;line-height:1.45;padding:12px 13px;margin-bottom:12px}
.demo-card p{color:#5d4d2a;font-size:12px}
.profile{border-top:1px solid rgba(255,255,255,.15);padding:13px 9px 2px;margin-top:0;color:white;border-radius:0}
.profile:hover{background:rgba(255,255,255,.08)}
.profile strong{font-size:14px;color:white}
.profile small{font-size:12px;color:#b7cec0}
.profile>span:last-child{color:#b7cec0}
.avatar{background:#deeadf;color:#164e39;font-weight:700}
.profile .avatar{background:#d9ab46;color:#253a30}

.topbar{height:76px;padding:0 clamp(24px,3vw,54px);background:rgba(255,255,255,.94);border-bottom:1px solid var(--border)}
.breadcrumb{font-size:14px;color:var(--muted)}
.breadcrumb strong{color:var(--ink);font-weight:650}
.academic-year{font-size:13px;font-weight:650;color:#385446}
.status-pill{font-size:12px;font-weight:700;background:var(--mint);color:#145641;border-radius:99px;padding:7px 12px}
.central-bar{min-height:52px;padding:8px clamp(24px,3vw,54px);background:#e7f0e9;border-bottom:1px solid #d2e3d7;color:#2b5540;font-size:13px;gap:12px}
.central-bar strong{font-size:13px;margin-right:4px;color:#163c2d}
.central-bar #central-status{margin-right:auto}
.central-bar a{font-weight:700;color:#164e39;text-decoration:none}
.central-bar a:hover{text-decoration:underline}
.central-bar button{border-radius:9px;border:1px solid #b5d0bc;background:#fff;color:#164e39;min-height:44px;padding:7px 12px;font-weight:650}
.central-bar button:hover{background:#f4faf6}
.central-error{border-radius:12px;max-width:1200px;margin:16px auto;padding:14px 18px;font-size:15px;line-height:1.5}

main{max-width:1540px;padding:34px clamp(24px,3vw,54px) 48px}
.page-heading{margin-bottom:23px;align-items:end;gap:18px}
.page-heading>div:first-child{border-left:4px solid #d8a435;padding-left:17px}
.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:750;color:#316b50;margin-bottom:8px}
.sub{font-size:15px;color:var(--muted);line-height:1.5;max-width:72ch}
.page-heading .sub{margin-top:4px}
.btn,.btn.small{min-height:44px;padding:10px 15px;border-radius:10px;font-size:14px;line-height:1.3;font-weight:650;box-shadow:0 1px 1px rgba(24,61,42,.035)}
.btn:hover{background:#edf4ee;border-color:#c4d9ca;transform:translateY(-1px)}
.btn.primary{background:var(--green);border-color:var(--green);color:white;box-shadow:0 5px 12px rgba(20,86,65,.13)}
.btn.primary:hover{background:var(--green2);border-color:var(--green2)}
.btn.yellow{background:var(--yellow);border-color:var(--yellow)}
.btn.ghost{box-shadow:none}
.btn.danger{color:#922c25}
.button-row{gap:9px}
.panel,.class-card,.stat{border:1px solid var(--border);border-radius:var(--radius);background:var(--premium-surface);box-shadow:var(--premium-shadow)}
.panel-header{padding:20px 24px;border-bottom:1px solid #e9efeb}
.panel-body{padding:23px 24px}
.panel-header h2{font-size:19px}
.notice{background:#ecf4ed;border:1px solid #d3e5d7;border-left:4px solid #40936b;color:#315c43;border-radius:12px;padding:15px 19px;line-height:1.55;font-size:14px}
.notice.amber{background:#fcf7e9;border-color:#e8d9ae;border-left-color:#c99227;color:#705212}
.tag{background:#e8f2eb;color:#17513c;border-radius:7px;padding:5px 9px;font-size:12px;font-weight:650}
.tag.amber{background:#fcf3dd;color:#775513}
.tag.red{background:#f9eae6;color:#8d362b}
.tag.gray{background:#eef2ef;color:#465a4f}

/* School overview: a ledger of today's work, rather than a marketing dashboard. */
.dashboard-actions{margin-bottom:22px;gap:9px}
.stat-grid,.compact-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}
.stat{padding:19px 19px 17px;min-width:0;min-height:151px;display:flex;flex-direction:column;justify-content:space-between}
.stat-head{color:#52665c;font-size:13px;font-weight:650;line-height:1.35;gap:7px}
.stat-icon{width:35px;height:35px;background:#ebf4ed;color:#1a6747;border-radius:11px}
.stat-value{font-size:clamp(24px,2.3vw,34px);font-weight:600;line-height:1.24;letter-spacing:-.05em;color:#173e2d;margin:8px 0 4px;overflow-wrap:anywhere}
.stat-value small{font:500 13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#536b5b}
.stat-foot{font-size:12px;color:#596b60;line-height:1.35}
.stat-foot strong{color:#1a6244;font-weight:700}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.8fr);gap:18px;margin-bottom:22px}
.dashboard-chart{align-self:start}
.dashboard-chart>summary{padding:19px 23px;font-size:16px;color:#24553c}
.dashboard-chart[open]>summary{border-bottom:1px solid var(--border)}
.chart{height:190px;margin:8px 20px 26px}
.chart-label,.chart-amount,.chart-legend{font-size:12px}
.quick-item{min-height:69px;padding:12px 0}
.quick-item:hover{background:#f6faf7}
.action-notice{margin-bottom:22px;align-items:center}

/* Administrative tables and school forms. */
.toolbar{gap:13px;margin-bottom:18px}
.filters{gap:11px}
.field label{font-size:13px;font-weight:700;color:#405c4d}
input,select,textarea{min-height:43px;border-color:#cad9cf;border-radius:10px;font-size:15px;padding:10px 13px;background:#fff;color:var(--ink)}
input::placeholder{color:#66786d}
input:hover,select:hover,textarea:hover{border-color:#9bb8a5}
input:focus,select:focus,textarea:focus{border-color:#1d7452}
th{background:#f7faf7;color:#506557;font-size:11px;font-weight:750;letter-spacing:.075em;padding:13px 18px}
td{font-size:14px;padding:14px 18px;border-bottom-color:#e8efea}
tbody tr:hover{background:#f8fbf8}
.person strong{font-size:14px;font-weight:700}
.person small{font-size:12px}
.person .avatar{width:36px;height:36px;border-radius:11px;font-size:11px}
.table-footer{background:#fcfdfb;color:#556b5b;font-size:13px}
.pager{font-size:14px}
.pager span{font-size:14px;color:#52665c}
.class-grid{gap:16px}
.class-card{padding:21px;position:relative;overflow:hidden}
.class-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#cfaa55}
.class-card:hover{border-color:#a7cbb2;box-shadow:0 16px 36px rgba(20,54,39,.095);transform:translateY(-2px)}
.class-card h2{font-size:22px;margin:13px 0 6px}
.class-card .class-meta{font-size:13px;gap:10px}
.section-row{padding:20px 0}
.section-row h3{font-size:20px}
.section-rules summary,.grade-help summary{color:#1d6649}
.presence-choice{border-color:#d2dfd6;border-radius:11px;min-height:49px;font-size:15px}
.presence-choice:hover{border-color:#94bfa3;background:#f6faf7}
.presence-choice:has(input:checked){border-color:#246b4c;background:#eaf5ed;color:#164631}
.presence-choice input{accent-color:#1b6447}
.daily-slot{padding:20px 0}
.daily-slot h3{font-size:16px;color:#355740}
.lesson{border-left-color:#296c4c;border-radius:9px;background:#eaf3ec}
.lesson small{color:#496451}
.settings-group>summary,.catalog>summary{font-size:17px;color:#214c37}
.settings-group[open]>summary{color:#145641}
dialog{border-radius:20px;border:1px solid #d5e3d9;box-shadow:0 30px 90px rgba(13,41,27,.2)}
dialog::backdrop{background:rgba(13,35,25,.48)}
.modal-top{padding:20px 24px;background:#f8faf8}
.modal-top h2{font-size:22px}
.icon-button{min-height:44px;min-width:44px}
#toast{background:#153d2b;border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.19);font-size:14px}

/* The same visual system extends to the local sign-in and administration pages. */
.account{font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink)}
.account header{background:#fff;border-bottom:1px solid var(--border);padding:16px max(22px,calc((100% - 1120px)/2));gap:20px}
.account header a{display:flex;align-items:center;padding:4px}
.account header img{width:136px;height:55px;object-fit:contain;object-position:left center}
.account header span{color:#52665c;font-size:13px;font-weight:650;margin-left:auto}
.account main{max-width:1120px;padding:0 22px;margin:34px auto 70px}
.account h1{font-size:clamp(28px,2.7vw,38px);margin-bottom:7px}
.account h2{font-size:20px;margin-bottom:10px}
.account main>p{color:#52665c;max-width:70ch}
.account section{border-radius:18px;border:1px solid var(--border);box-shadow:var(--premium-shadow);padding:26px 30px;margin:21px 0;background:white}
.account article{padding:16px 0;border-bottom-color:#e8efea}
.account small{color:#52665c}
.account form{gap:17px}
.account label{gap:7px;color:#395447;font-size:14px;font-weight:700}
.account input,.account select{background:white;border:1px solid #bdcec2;border-radius:10px;min-height:46px;color:var(--ink);font-size:16px}
.account button,.account a.button{background:var(--green);border-color:var(--green);border-radius:10px;min-height:43px;padding:10px 16px;font-weight:700}
.account button:hover,.account a.button:hover{background:var(--green2);border-color:var(--green2)}
.account .demo-accounts button{background:#f3f8f4;border:1px solid #c4d9ca;color:#194533;box-shadow:none;min-height:116px;gap:7px}
.account .demo-accounts button:hover{background:#e8f3eb;border-color:#7eab8f;transform:translateY(-2px)}
.account .demo-accounts strong{font-family:Poppins,system-ui,sans-serif;color:#153f2f;font-size:20px}
.account .demo-accounts span{font-size:14px;color:#476452}
.account .demo-accounts b{color:#15563c}
.account #message{background:#fff3d5;color:#65480d;border-top:1px solid #e7d59f;z-index:5}

@media(max-width:1180px){
  .sidebar{transform:translateX(-100%);width:min(310px,88vw);box-shadow:15px 0 50px rgba(0,0,0,.18)}
  .sidebar.open{transform:translateX(0)}
  .shell{margin-left:0}
  .menu-button{display:grid;place-items:center}
  .topbar{min-height:69px;height:auto}
  .stat-grid,.compact-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){
  main{padding:24px 18px 40px}
  .topbar{padding:0 18px}
  .central-bar{padding:9px 18px}
  .dashboard-grid{grid-template-columns:1fr}
  .class-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-heading{align-items:flex-start}
}
@media(max-width:600px){
  body{font-size:16px}
  main{padding:21px 14px 34px}
  .page-heading{align-items:stretch;gap:15px}
  .page-heading>div:first-child{padding-left:13px}
  .page-heading .button-row{justify-content:flex-start}
  .topbar{padding:0 14px}
  .central-bar{gap:5px 12px;padding:8px 14px;font-size:12px}
  .central-bar #central-status{flex-basis:100%;order:2}
  .central-bar a,.central-bar button{font-size:12px}
  .stat-grid,.compact-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .stat{padding:14px;min-height:145px}
  .stat-head{font-size:12px}
  .stat-icon{display:none}
  .stat-value{font-size:26px}
  .stat-foot{font-size:11px}
  .class-grid{grid-template-columns:1fr}
  .panel-header,.panel-body{padding:17px}
  .responsive-table tbody tr{padding:17px}
  .responsive-table td{font-size:15px}
  .responsive-table td::before{font-size:12px}
  .presence-options{gap:8px}
  .presence-choice{font-size:14px;padding:9px}
  .account main{padding:0 14px;margin:24px auto 65px}
  .account section{padding:19px;margin:16px 0}
  .account header{padding:12px 16px}
  .account header img{width:112px;height:44px}
  .account header span{font-size:11px}
  .account .demo-accounts{grid-template-columns:1fr}
  #toast{max-width:calc(100vw - 28px)}
}
@media(max-width:390px){
  .stat-grid,.compact-stats{grid-template-columns:1fr 1fr}
  .stat{padding:11px;min-height:136px}
  .stat-value{font-size:23px}
  .breadcrumb{font-size:12px}
  .account header span{max-width:125px;text-align:right}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(prefers-contrast:more){:root{--border:#829c89;--muted:#2d4436;--green:#104b35}.panel,.class-card,.stat{border-width:2px}nav a.active{outline:2px solid #d8a435}}
@media print{.panel,.class-card,.stat{box-shadow:none}body{background:white}.account header{display:none}}

/* A consistent working surface for each role and the full weekly timetable. */
.central-identity{display:grid;gap:0;min-width:125px;line-height:1.25}
.central-identity strong{font-size:14px}
.central-identity small{color:#557363;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.central-bar #central-status{color:#3d604c;font-size:12px}
.central-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.central-actions a{min-height:44px;display:inline-flex;align-items:center;padding:7px 11px;border-radius:9px}
.central-actions a:hover{background:#d9eadd;text-decoration:none}
.central-actions #central-logout{background:transparent;border-color:transparent;color:#7c352c}
.central-actions #central-logout:hover{background:#fff2ef;border-color:#e7c6bf}
.role-home{position:relative;overflow:hidden;border-top:4px solid #cb9c34;background:#fffdf8}
.role-home::after{content:"";position:absolute;right:-75px;top:-105px;width:330px;height:330px;border:1px solid #e8dfc5;border-radius:50%;box-shadow:0 0 0 31px #fffdf8,0 0 0 32px #eee5cf,0 0 0 68px #fffdf8,0 0 0 69px #f3ead6;pointer-events:none}
.role-home .panel-body{position:relative;z-index:1;padding:clamp(25px,4vw,45px)}
.role-kicker{display:block;color:#6f5425;font-size:11px;font-weight:800;letter-spacing:.16em;line-height:1.4;margin-bottom:9px}
.role-home h2{font-size:clamp(24px,2.5vw,33px);line-height:1.2;margin-bottom:8px}
.role-home p{color:#536459;max-width:52ch}
.role-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.role-links a{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:46px;padding:10px 15px;border:1px solid #b6cdbd;border-radius:10px;background:#fff;color:#164b36;text-decoration:none;font-size:14px;font-weight:700}
.role-links a:first-child{background:var(--green);border-color:var(--green);color:#fff}
.role-links a:hover{transform:translateY(-2px);box-shadow:0 7px 16px rgba(20,65,39,.1)}
.schedule-context{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:18px 22px;margin:0 0 20px;background:#fdf9ee;border:1px solid #ebdbb8;border-left:4px solid #c99831;border-radius:12px}
.schedule-context strong{display:block;font:600 22px/1.25 Poppins,system-ui,sans-serif;color:#28422f}
.schedule-context small{display:block;color:#5d664f;margin-top:4px}
.schedule-context p{max-width:42ch;margin:0;font-size:13px;color:#5b5c43}
.teacher-week{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.teacher-day{overflow:hidden}
.teacher-day .panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.teacher-day-body{padding:2px 20px 15px}
.teacher-course{display:grid;grid-template-columns:minmax(105px,.42fr) minmax(0,1fr);gap:18px;align-items:start;padding:16px 3px;border-bottom:1px solid #e5ede6}
.teacher-course:last-child{border-bottom:0}
.teacher-course-time{font-size:13px;font-weight:750;color:#6b5425;white-space:nowrap}
.teacher-course strong{display:block;color:#193b2a;font-size:15px}
.teacher-course div span{display:block;color:#576b5c;font-size:13px;margin-top:2px}
.teacher-day-empty{padding:16px 3px;color:#647569;font-size:14px}

/* Sign-in, identity and administration share the same visual language. */
.account main{max-width:1180px}
.auth-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(350px,.8fr);gap:24px;align-items:stretch}
.auth-intro{position:relative;overflow:hidden;min-height:420px;padding:clamp(34px,5vw,64px);border-radius:21px;background:#143c2e;color:#fff;display:flex;flex-direction:column;align-items:flex-start}
.auth-intro::after{content:"";position:absolute;width:480px;height:480px;right:-220px;bottom:-250px;border:1px solid rgba(238,215,148,.35);border-radius:50%;box-shadow:0 0 0 46px #143c2e,0 0 0 47px rgba(238,215,148,.25),0 0 0 100px #143c2e,0 0 0 101px rgba(238,215,148,.2);pointer-events:none}
.auth-intro>*{position:relative;z-index:1}
.auth-eyebrow{color:#8b662c;font-size:11px;font-weight:800;letter-spacing:.18em}
.auth-intro .auth-eyebrow{color:#e8c873}
.auth-intro h1{font-size:clamp(36px,4vw,58px);line-height:1.09;letter-spacing:-.055em;color:#fff;margin:40px 0 17px;max-width:12ch}
.auth-intro>p{color:#d5e6d9;max-width:42ch;font-size:16px;line-height:1.7;z-index:1}
.auth-rule{margin-top:auto;padding-top:35px;display:flex;align-items:center;gap:16px;z-index:1}
.auth-rule>span{width:36px;height:1px;background:#d7b15a;flex:none}
.auth-rule p{max-width:30ch;color:#c5d9ca;font-size:13px;line-height:1.5}
.auth-step{z-index:1;display:flex;align-items:center;gap:14px;margin-top:22px;color:#dfebdf}
.auth-step:first-of-type{margin-top:auto}
.auth-step span{display:grid;place-items:center;width:35px;height:35px;border:1px solid #aac6af;border-radius:50%;font-size:12px;color:#edcf7c}
.account section.auth-card{margin:0;padding:clamp(28px,4vw,47px);display:flex;flex-direction:column;justify-content:center}
.auth-card h2{font-size:clamp(22px,2vw,28px);margin-bottom:3px}
.auth-card>p{font-size:14px;color:#566b5e;margin-bottom:28px}
.auth-card form{max-width:none}
.auth-card button[type=submit]{margin-top:5px;min-height:50px}
.account-flash{border:1px solid #bad9c3;border-left:4px solid #32845b;border-radius:11px;background:#ecf8ef;color:#225439;padding:13px 18px;margin-bottom:18px}
.account section.demo-access{margin-top:24px;padding:clamp(23px,3vw,35px)}
.account-section-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:25px 0 13px}
.demo-access .account-section-heading{margin:0 0 22px}
.account-section-heading h2{font-size:clamp(22px,2.2vw,29px);margin:5px 0 2px}
.account-section-heading p,.account-panel-heading p{color:#5e7062;font-size:14px;margin:0}
.account .demo-accounts{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.account .demo-accounts button{position:relative;min-height:160px;padding:17px;display:flex;flex-direction:column;gap:4px}
.account .demo-accounts strong{font-size:17px;line-height:1.25;margin-top:5px}
.account .demo-accounts span:not(.demo-role-mark){font-size:12px;line-height:1.4}
.account .demo-accounts b{font-size:12px;margin-top:auto}
.account .demo-role-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#deebdf;color:#19533a;font:700 15px Poppins,system-ui,sans-serif}
.account section.account-overview{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:0;padding:28px 32px;border-top:4px solid #cda149}
.account-identity{display:flex;align-items:center;gap:20px;min-width:0}
.account-monogram{display:grid;place-items:center;width:64px;height:64px;flex:none;border-radius:18px;background:#e3efe5;color:#1b6747;font:600 25px Poppins,system-ui,sans-serif}
.account-identity h1{font-size:29px;margin:0 0 4px}
.account-identity strong{font-size:16px}
.account-identity p{margin:1px 0 0;color:#5b6d60;overflow-wrap:anywhere}
.account-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.account .account-logout,.account .account-user-action{background:white;color:#7d342d;border-color:#e4c2bc}
.account .account-logout:hover,.account .account-user-action:hover{background:#fff1ee;border-color:#c5968e}
.account details.account-security,.account details.account-history{border:1px solid var(--border);border-radius:16px;background:white;box-shadow:var(--premium-shadow);margin:17px 0;overflow:hidden}
.account .account-security>summary,.account .account-history>summary{display:flex;align-items:center;justify-content:space-between;min-height:68px;padding:18px 24px;list-style:none}
.account .account-security>summary::after,.account .account-history>summary::after{content:"⌄";color:#54725a;font-size:24px;line-height:1;transition:transform .16s ease}
.account .account-security[open]>summary::after,.account .account-history[open]>summary::after{transform:rotate(180deg)}
.account .account-security>summary::-webkit-details-marker,.account .account-history>summary::-webkit-details-marker{display:none}
.account .account-security>summary strong,.account .account-history>summary strong{display:block;color:#244d35;font-size:16px}
.account .account-security>summary small,.account .account-history>summary small{font-weight:400;font-size:12px;margin-top:2px}
.account-security-body,.account-history-body{padding:0 24px 25px;border-top:1px solid #e7eee8}
.account-security-body>p{color:#596d5f;font-size:14px}
.account-jump{display:flex;flex-wrap:wrap;gap:7px}
.account-jump a{padding:8px 11px;border:1px solid #d5e3d8;border-radius:9px;background:#fff;color:#285c3e;text-decoration:none;font-size:12px;font-weight:700}
.account-jump a:hover{background:#eaf5ed}
.account-panel-heading{margin-bottom:13px}
.account section#accounts,.account section#backups,.account section#security{scroll-margin-top:20px}
.account-user-list{border-top:1px solid #e2eae4}
.account article.account-user{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:15px 0}
.account-user strong{font-size:15px}
.account-role{display:inline-block;margin-left:9px;padding:3px 8px;background:#e9f2ea;color:#23563b;border-radius:6px;font-size:11px;font-weight:750}
.account-user small{margin-top:4px;font-size:12px}
.account .account-user-action{font-size:12px;white-space:nowrap}
.account details.account-action-details{border:1px solid #d5e3d8;border-radius:11px;background:#fafcf9;margin-top:20px;overflow:hidden}
.account .account-action-details>summary{padding:15px 18px;color:#20583d;list-style:none}
.account .account-action-details>summary::after{content:"+";float:right;font-size:19px;line-height:1}
.account .account-action-details[open]>summary::after{content:"−"}
.account .account-action-details>summary::-webkit-details-marker{display:none}
.account .account-action-details[open]>summary{border-bottom:1px solid #dfeae1;background:#f2f8f3}
.account-details-body{padding:19px}
.account-details-body>p{font-size:14px;color:#5b6c5e}
.account .account-backup-list article{padding:10px 0;font-size:13px;color:#4d6353}
.account .account-backup-list a{color:#205d3e;font-weight:700}
.account-history-body article{display:flex;justify-content:space-between;gap:16px;font-size:13px}
.account-history-body small{text-align:right}
.account .account-check{display:flex;align-items:center;gap:10px;font-weight:550}
.account .account-check input{flex:none;margin:0}
.account-hint{margin:-10px 0 0;color:#637466;font-size:12px}

@media(max-width:1000px){.account .demo-accounts{grid-template-columns:repeat(2,minmax(0,1fr))}.auth-layout{grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}.teacher-week{grid-template-columns:1fr}}
@media(max-width:720px){.auth-layout{grid-template-columns:1fr}.auth-intro{min-height:260px;padding:30px}.auth-intro::after{display:none}.auth-intro h1{margin:25px 0 12px;max-width:none;font-size:36px}.auth-rule{padding-top:25px}.account section.auth-card{padding:26px}.account section.account-overview{align-items:stretch;flex-direction:column}.account-section-heading{align-items:flex-start;flex-direction:column}.schedule-context{align-items:flex-start;flex-direction:column;gap:11px}.role-home::after{opacity:.45}}
@media(max-width:600px){.central-bar{align-items:flex-start}.central-identity{min-width:0;flex:1}.central-bar #central-status{order:3;flex-basis:100%}.central-actions{width:100%;order:2}.central-actions a,.central-actions button{flex:1;justify-content:center;min-width:0;white-space:nowrap}.account .demo-accounts{grid-template-columns:1fr 1fr}.account .demo-accounts button{min-height:155px;padding:12px}.account .demo-accounts strong{font-size:15px}.account-identity{align-items:flex-start}.account-monogram{width:50px;height:50px;border-radius:14px;font-size:18px}.account article.account-user{align-items:flex-start;flex-direction:column;gap:8px}.account-history-body article{flex-direction:column;gap:3px}.account-history-body small{text-align:left}.teacher-course{grid-template-columns:1fr;gap:3px}.role-links{flex-direction:column}.role-links a{width:100%}}
@media(max-width:390px){.account .demo-accounts{grid-template-columns:1fr}.account .demo-accounts button{min-height:105px}.central-actions{gap:3px}.central-actions a,.central-actions button{font-size:11px;padding:7px 4px}.auth-intro h1{font-size:31px}}

/* School color settings must reach the local design system, not just legacy buttons. */
.brand>span,.eyebrow,.central-bar a,.stat-foot strong,.setting-row strong{color:var(--green)}
.nav-caption,.brand>span{color:#d1e2d3}
nav a.active{background:color-mix(in srgb,var(--green) 10%,white);color:var(--green)}
nav a.active:after,.class-card:before,.page-heading>div:first-child{border-color:var(--yellow)}
nav a.active:after,.class-card:before{background:var(--yellow)}
.status-pill,.tag,.stat-icon,.avatar{background:color-mix(in srgb,var(--green) 10%,white);color:var(--green)}
.stat-value,.person strong,.class-card h2,.account .account-section-heading h2{color:var(--ink)}
.lesson{background:color-mix(in srgb,var(--green) 9%,white);border-left-color:var(--green)}
.presence-choice:has(input:checked){background:color-mix(in srgb,var(--green) 10%,white);border-color:var(--green);color:var(--green)}
.presence-choice input{accent-color:var(--green)}
.role-home,.account section.account-overview{border-top-color:var(--yellow)}
.role-kicker,.schedule-context .role-kicker{color:color-mix(in srgb,var(--yellow) 54%,#3b2b13)}
.schedule-context{border-left-color:var(--yellow);background:color-mix(in srgb,var(--yellow) 10%,white)}
.central-bar{background:color-mix(in srgb,var(--green) 10%,white);border-bottom-color:color-mix(in srgb,var(--green) 22%,white)}
.central-actions a{color:var(--green)}
.role-links a:first-child{background:var(--green);border-color:var(--green)}
.demo-private-note{border-left:4px solid var(--yellow)!important;background:#fffdf8!important}