*{box-sizing:border-box}body{margin:0;background:#f6f7f2;color:#223c32;font-family:system-ui,sans-serif;font-size:16px}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid #cbd8d0;border-radius:12px;background:white;color:#185c48;min-height:44px;padding:10px 14px}a{color:#185c48}header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 24px;max-width:1050px;margin:auto}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:800;font-size:14px;letter-spacing:.7px}.brand img{width:58px;height:58px;object-fit:contain}.brand small{display:block;font-size:12px;font-weight:400;letter-spacing:0;margin-top:5px}.preview{background:#eee8d5;color:#655527;text-align:center;padding:10px;font-size:12px}main{max-width:1000px;margin:auto;padding:28px 24px 110px}h1{font-size:clamp(28px,5vw,42px);line-height:1.15;margin:8px 0 14px}h2{font-size:21px}h3{margin:0 0 10px;font-size:18px}p{line-height:1.6}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700}.hero{background:#185c48;color:white;border-radius:24px;padding:30px;margin-bottom:24px}.hero p{max-width:550px;color:#e1eee7}.tag{display:inline-block;border-radius:20px;background:#eef3ed;padding:5px 10px;color:#426a52;font-size:12px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.card{background:white;border:1px solid #dfe6de;border-radius:18px;padding:22px}.notice{border-left:4px solid #ba993e;background:#fff8e5;border-radius:12px;padding:16px;margin:20px 0}.notice p{margin:6px 0 0}.muted{color:#63736b}.primary{background:#185c48;color:white;border:0}.wide{width:100%}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.date{font-size:13px;color:#64776c}.empty{padding:32px 0;color:#63736b}nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:#fff;border-top:1px solid #dfe6de;padding:8px 8px calc(8px + env(safe-area-inset-bottom));z-index:2}nav a{flex:1;max-width:160px;min-height:48px;padding:14px 4px;text-decoration:none;text-align:center;font-size:13px;border-radius:12px}nav a[aria-current=page]{background:#e4eee6;font-weight:700}label{display:block;margin:16px 0;font-weight:600}input,select,textarea{display:block;width:100%;margin-top:8px;min-height:46px;border:1px solid #b9cabc;border-radius:10px;padding:12px;background:white;color:#223c32}textarea{min-height:100px}footer{text-align:center;padding:0 16px 100px;font-size:12px;color:#64776c}:focus-visible{outline:3px solid #c09a39;outline-offset:4px}@media(max-width:560px){header{padding:14px 16px}.brand{font-size:11px}.brand img{width:48px;height:48px}header button{font-size:12px;padding:8px}main{padding:22px 16px 100px}.hero{padding:24px}.grid{grid-template-columns:1fr}.card{padding:20px}nav a{font-size:12px}}/* Theme and mobile layout aligned to the supplied agreed interface. */
body{background:#edf4ff;color:#071a54;font-size:14px}header{background:#061d49;color:#ffdb23;max-width:480px;padding:14px 16px}.brand{color:#ffdb23;font-size:12px}.brand small{color:#c4d4ed;font-size:10px}.brand img{width:55px;height:55px}header button{background:#122d57;color:#fff;border-color:#496080;font-size:11px;padding:8px}.preview{max-width:480px;margin:auto;background:#e5efff;color:#496493;font-size:10px;padding:7px}main{max-width:480px;background:#f8fbff;min-height:70vh;padding:20px 16px 95px}h1{font-size:25px}h2{font-size:18px}h3{font-size:13px}.eyebrow{color:#546b96;font-size:10px}.hero{margin:-20px -16px 0;border-radius:0;padding:24px 20px 68px;background:radial-gradient(ellipse at 85% 15%,#164a76 0,transparent 55%),radial-gradient(ellipse at 70% 100%,#b78b37 0,transparent 45%),linear-gradient(160deg,#00183c,#073257 65%,#6a6c4b);position:relative;color:white;overflow:hidden}.hero h1{margin:4px 0 8px;font-size:27px}.hero p{font-size:12px;margin:6px 0 12px;color:#e9f0ff}.school-mark{font-size:11px;font-weight:700;letter-spacing:2px;color:#f8dd83}.school-mark span{display:block;font-size:8px;letter-spacing:1px;margin-top:5px}.dashboard{position:relative;margin-top:-45px}.card{border-color:#e0eafd;border-radius:16px;padding:18px;box-shadow:0 4px 14px #08275506;margin-bottom:14px}.compact{padding:14px}.compact .muted{font-size:12px;margin-bottom:0}.row h3{display:flex;align-items:center;gap:8px;margin:0}.row a{font-size:11px;text-decoration:none;white-space:nowrap}svg{width:22px;height:22px;flex-shrink:0}.row h3 svg{width:18px;height:18px}.muted,.date{color:#657caa}.announcement-strip{display:flex;align-items:center;gap:8px;background:#0056b9;color:white;border-radius:12px;padding:12px;text-decoration:none;font-size:12px;margin:12px 0}.announcement-strip span{margin-left:auto}.menu-panel{background:white;border-radius:20px;padding:12px 12px 18px;margin:14px -4px;box-shadow:0 3px 16px #07264f0a}.handle{width:38px;height:4px;border-radius:5px;background:#8493b0;margin:0 auto 12px}.menu-panel button{font-size:11px;min-height:36px;border:0;color:#005edb;padding:5px}.modules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 8px;margin:16px 0 0}.modules a{display:flex;align-items:center;flex-direction:column;gap:7px;color:#0b2259;font-weight:600;font-size:9px;text-align:center;text-decoration:none;position:relative}.module-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px #ffffff50}.module-icon svg{width:26px;height:26px}.blue{background:#0076ff;color:white}.ice{background:#d0e6ff;color:#0873ed}.pink{background:linear-gradient(135deg,#ff90bb,#ff3b67);color:white}.teal{background:#00bdcd;color:white}.orange{background:#ff9b00;color:white}.purple{background:#a75bff;color:white}.coral{background:#ff754c;color:white}.modules small{font-size:8px;background:#fff2bd;color:#a26900;padding:3px;border-radius:4px;max-width:70px}.menu-panel>h3{margin-top:26px}.extra{grid-template-columns:repeat(3,1fr)}.notice{background:#fff8df;color:#795d17;border-left-color:#ffd529;font-size:11px;padding:12px;line-height:1.5}.notice p{line-height:1.5}nav{left:50%;transform:translateX(-50%);width:100%;max-width:480px;padding:5px 4px calc(5px + env(safe-area-inset-bottom));box-shadow:0 -3px 15px #071a5410}nav a{display:flex;flex-direction:column;align-items:center;gap:3px;color:#5273a9;font-size:10px;padding:8px 2px;min-height:50px}nav a[aria-current=page]{background:transparent;color:#005dda}nav a:first-child[aria-current=page] svg{color:#e3ad00}nav svg{width:22px;height:22px}footer{max-width:480px;margin:auto;background:#f8fbff;font-size:10px;color:#617eae}button{color:#0755bb;border-color:#d7e4fa}.primary{background:linear-gradient(90deg,#0054bf,#0078ff);color:white}.yellow{background:#ffda28;color:#081a4b;font-weight:700;border:0}.tag{background:#e5efff;color:#005bd3}.welcome{margin:-20px -16px -10px;background:radial-gradient(ellipse at 80% 52%,#997735 0,transparent 30%),linear-gradient(155deg,#002444,#0d4061 55%,#cf9134);padding-top:35px}.welcome-brand{text-align:center;color:white;padding:20px 16px 42px}.welcome-brand img{width:130px;height:130px;object-fit:contain}.welcome-brand h1{font-size:25px;margin:18px 0 6px}.welcome-brand p{margin:0;line-height:1.5}.welcome-form{text-align:center;background:white;border-radius:22px 22px 0 0;padding:22px 22px 34px}.welcome-form h2{margin:0 0 8px}.welcome-form p{font-size:12px;color:#657cad;margin:0 0 16px}.welcome-form input{margin-bottom:12px;background:#f8fbff;border-color:#dbe7fa}.welcome-form small{display:block;font-size:10px;color:#657cad;margin-top:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.page-title{display:flex;align-items:center;gap:16px;margin:0 0 24px}.page-title a{font-size:28px;text-decoration:none}.page-title h2{flex:1;text-align:center;padding-right:32px}.construction{text-align:center;padding:35px 20px}.construction-icon{width:120px;height:100px;margin:auto;background:#e0edff;color:#0878ff;border-radius:35px;display:grid;place-items:center}.construction-icon svg{width:70px;height:70px}.construction p{color:#657caa}.profile{text-align:center}.avatar{width:80px;height:80px;border-radius:50%;background:#e5efff;color:#005edb;margin:auto;display:grid;place-items:center}.avatar svg{width:45px;height:45px}.profile-link{display:block;text-align:left;text-decoration:none;border-bottom:1px solid #e0eafa;padding:16px 4px}.profile-link small{display:block;color:#657caa;margin-top:6px}.profile button{margin-top:14px}input,select,textarea{border-color:#c7d7f0;color:#071a54}:focus-visible{outline-color:#f6c500}@media(min-width:600px){body{padding-top:24px}header{border-radius:22px 22px 0 0}main{box-shadow:0 10px 35px #0923540a}}@media(max-width:560px){main{padding:20px 16px 95px}header{padding:14px 16px}.hero{padding:24px 20px 68px}.card{padding:18px}.compact{padding:14px}nav a{font-size:10px}.grid{grid-template-columns:1fr}}

/* Close-up reference: dark photo backdrop and a single home content sheet. */
body.home-screen header{background:#041a38}body.home-screen main{background:#061b38 url('assets/school-reference-background.png') center top/cover no-repeat}.hero{background:linear-gradient(90deg,rgba(0,18,44,.82),rgba(0,21,45,.18)),url('assets/school-reference-background.png') center 55%/cover no-repeat;padding:22px 20px 65px;min-height:195px}.hero h1{font-size:30px}.hero>span{font-size:16px}.hero p{font-size:13px;text-shadow:0 1px 3px #001a40}.dashboard{background:linear-gradient(180deg,#fff,#f5faff);border-radius:26px 26px 0 0;margin:-32px -16px -95px;padding:14px 16px 100px;box-shadow:0 -2px 9px #00152f25}.dashboard .compact{background:transparent;box-shadow:none;border:0;padding:4px 0 12px;margin:0}.dashboard .compact .muted{background:#f4f8ff;border-radius:12px;padding:16px;margin-top:10px}.announcement-card{border-radius:18px;background:linear-gradient(110deg,#004783,#0062bd);padding:9px 7px 7px;color:#fff;border:2px solid #064c83;box-shadow:0 2px 3px #003b6d20}.announcement-card .row{padding:0 6px 7px;gap:4px}.announcement-card h3{font-size:12px}.announcement-card h3 svg{color:#ffd42a}.announcement-card .row a{color:#e8f3ff;font-size:10px}.announcement-item{display:flex;justify-content:space-between;align-items:center;border-radius:12px;background:#fff;color:#164274;padding:10px;font-size:11px;text-decoration:none}.dashboard .menu-panel{background:transparent;box-shadow:none;margin:6px -4px;padding:0 0 12px}.dashboard .menu-panel .handle{display:none}.dashboard .menu-panel>.row h3{font-size:0}.dashboard .menu-panel>.row{justify-content:flex-end;height:24px}.dashboard .menu-panel button{min-height:24px;padding:3px;background:transparent}.dashboard .modules{gap:22px 8px;margin-top:10px}.dashboard .module-icon{width:48px;height:48px;border-radius:12px;border:3px solid #fff;box-shadow:0 0 0 1px #edf5ff,0 3px 8px #1d77b01a}.dashboard .modules a{font-size:10px}.welcome{background:linear-gradient(180deg,rgba(0,21,50,.35),rgba(0,20,45,.1)),url('assets/school-reference-background.png') center/cover no-repeat}@media(max-width:560px){.hero{padding:22px 20px 65px}.dashboard .compact{padding:4px 0 12px}}

/* Sliding home sheet: compact and expanded snap positions. */
.home-screen main:has(.dashboard){height:calc(100dvh - 110px);min-height:580px;position:relative;overflow:hidden;padding-bottom:0}.home-screen:has(.dashboard) footer{display:none}.home-screen .dashboard{position:absolute;top:180px;bottom:0;left:0;right:0;margin:0;padding:0 16px 95px;overflow-y:auto;overscroll-behavior:contain;transition:top .3s ease;border-radius:26px 26px 0 0;scrollbar-width:thin}.home-screen .dashboard.expanded{top:55px}.dashboard .sheet-handle{display:flex;justify-content:center;align-items:center;width:100%;min-height:28px;height:28px;border:0;background:transparent;padding:0;touch-action:none;cursor:grab}.sheet-handle span{width:34px;height:4px;border-radius:5px;background:#b8c0cb}.dashboard .sheet-modules{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 10px}.dashboard .sheet-modules a{grid-column:span 2;background:#eef5ff;border-radius:15px;padding:12px 4px;gap:6px;font-size:12px}.dashboard .sheet-modules a.featured{grid-column:span 3;display:grid;grid-template-columns:48px 1fr;text-align:left;column-gap:10px;padding:12px}.sheet-modules .featured .module-icon{grid-row:span 2}.dashboard .sheet-modules small{background:transparent;color:#5574a0;font-weight:400;font-size:10px;max-width:none;padding:0}.dashboard .sheet-modules a:nth-child(1){background:#eaf8f2}.dashboard .sheet-modules a:nth-child(4){background:#fff0f5}.dashboard .sheet-modules a:nth-child(5),.dashboard .sheet-modules a:nth-child(6){background:#fff7e6}.dashboard .sheet-modules a:nth-child(7){background:#f7f0ff}.dashboard .sheet-modules a.additional{display:none}.dashboard.expanded .sheet-modules a.additional{display:flex}.dashboard .notice{font-size:10px;margin-top:16px}.home-screen .hero{min-height:240px}.dashboard .compact .muted{padding:10px;margin-bottom:0}.dashboard .menu-panel{margin-top:4px}.dashboard .sheet-modules{margin-top:4px}@media(prefers-reduced-motion:reduce){.home-screen .dashboard{transition:none}}

/* Keep the greeting visible above both sheet positions; fit modules to viewport. */
.home-screen main:has(.dashboard){height:calc(100dvh - 86px);min-height:0;padding:0;display:flex;flex-direction:column}.home-screen .hero{margin:0;flex-shrink:0;min-height:0;height:182px;padding:14px 20px;transition:height .3s ease}.home-screen .hero h1{margin:3px 0 5px;font-size:27px}.home-screen .hero p{margin:4px 0;font-size:12px}.home-screen main:has(.dashboard.expanded) .hero{height:88px}.home-screen main:has(.dashboard.expanded) .hero p{display:none}.home-screen .dashboard{position:relative;inset:auto;flex:1;min-height:0;margin:0;padding:0 12px calc(64px + env(safe-area-inset-bottom));overflow:hidden;display:flex;flex-direction:column}.home-screen .dashboard.expanded{top:auto}.dashboard .sheet-handle{flex-shrink:0;min-height:23px;height:23px}.dashboard .compact{flex-shrink:0;padding:0 4px 8px}.dashboard .compact .muted{padding:8px;margin-top:6px;font-size:11px}.dashboard .announcement-card{flex-shrink:0;padding:7px 6px 6px}.dashboard .announcement-item{padding:8px}.dashboard .menu-panel{display:flex;flex-direction:column;min-height:0;flex:1;margin:0;padding:0}.dashboard .menu-panel>.row{flex-shrink:0;height:24px}.dashboard .sheet-modules{flex:1;min-height:0;grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;margin:0}.dashboard.expanded .sheet-modules{grid-template-rows:repeat(4,minmax(0,1fr))}.dashboard .sheet-modules a{padding:5px 3px;gap:3px;justify-content:center;min-height:0;font-size:11px}.dashboard .sheet-modules a.featured{padding:6px;grid-template-columns:38px 1fr;column-gap:7px}.dashboard .sheet-modules .module-icon{width:38px;height:38px}.dashboard .sheet-modules .module-icon svg{width:23px;height:23px}.dashboard .sheet-modules small{font-size:9px;line-height:1.2}.home-screen:has(.dashboard) header{height:86px;flex-shrink:0}.home-screen:has(.dashboard) footer{display:none}@media(min-width:600px){.home-screen main:has(.dashboard){height:calc(100dvh - 110px)}}@media(max-height:720px){.home-screen main:has(.dashboard.expanded) .hero{height:76px;padding-top:9px}.dashboard .sheet-modules .module-icon{width:30px;height:30px}.dashboard .sheet-modules .module-icon svg{width:20px;height:20px}.dashboard .sheet-modules small{font-size:8px}.dashboard .sheet-modules a{font-size:10px}.dashboard .compact .muted{padding:5px}.dashboard .announcement-item{padding:6px}.dashboard .sheet-modules a.featured{grid-template-columns:30px 1fr}.dashboard .sheet-handle{height:20px;min-height:20px}}@media(prefers-reduced-motion:reduce){.home-screen .hero{transition:none}}
