:root{
  --primary:#0d766e;--primary-strong:#075f59;--primary-soft:#e8f5f3;--ink:#172126;--muted:#6b767c;
  --bg:#f5f7f7;--card:#fff;--line:#e6ebea;--line-strong:#d7dfdd;--danger:#bf3d36;--danger-soft:#fff0ee;
  --warning:#a66710;--warning-soft:#fff6e5;--success:#237b4b;--success-soft:#eaf7ef;--blue:#315eaa;--blue-soft:#eef4ff;
  --shadow:0 16px 40px rgba(27,48,45,.07);--radius:20px;--radius-sm:14px;
}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-size:14px;line-height:1.5}
button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.money{font-variant-numeric:tabular-nums}.wide{width:100%}
.auth-screen{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 10% 10%,#dff3ef 0,transparent 35%),linear-gradient(135deg,#f8fbfa,#eef4f2)}
.auth-card{width:min(460px,100%);background:#fff;border:1px solid rgba(13,118,110,.1);border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(14,70,63,.12)}
.auth-brand,.brand{display:flex;align-items:center;gap:12px}.auth-brand strong,.brand strong{display:block;font-size:17px}.auth-brand span,.brand span{display:block;color:var(--muted);font-size:12px}.auth-copy{padding:36px 0 18px}.auth-copy h1{font-size:32px;line-height:1.12;margin:0 0 8px;letter-spacing:-.04em}.auth-copy p{margin:0;color:var(--muted)}
.brand-mark{width:46px;height:46px;border-radius:15px;background:linear-gradient(145deg,#0d766e,#159184);display:grid;place-items:center;color:#fff;font-weight:800;box-shadow:0 10px 24px rgba(13,118,110,.22)}.small-mark{width:40px;height:40px;border-radius:13px;font-size:13px}
.stack{display:grid;gap:16px}label{display:grid;gap:7px;color:#445157;font-size:13px;font-weight:650}input,select,textarea{width:100%;border:1px solid var(--line-strong);background:#fff;color:var(--ink);border-radius:12px;padding:11px 12px;outline:none;transition:.2s}textarea{min-height:90px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#58a9a1;box-shadow:0 0 0 4px rgba(13,118,110,.08)}
.btn{border:0;border-radius:12px;padding:10px 14px;font-weight:700;color:var(--ink);background:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn.primary{background:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(13,118,110,.16)}.btn.primary:hover{background:var(--primary-strong)}.btn.soft{background:var(--primary-soft);color:var(--primary-strong)}.btn.subtle,.btn.ghost{background:#f3f6f5;border:1px solid var(--line)}.btn.text{background:transparent;color:var(--primary);margin-top:10px}.btn.danger{background:var(--danger-soft);color:var(--danger)}.btn.large{padding:13px 16px}.btn.icon-only{width:40px;height:40px;padding:0;font-size:18px;background:#fff;border:1px solid var(--line)}.small-btn{padding:7px 10px;font-size:12px}
.app-shell{min-height:100vh;display:grid;grid-template-columns:240px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;background:#fff;border-right:1px solid var(--line);padding:24px 16px 18px;display:flex;flex-direction:column;z-index:20}.brand{padding:0 8px 24px}.nav{display:grid;gap:6px}.nav button{border:0;background:transparent;border-radius:12px;padding:11px 12px;display:flex;align-items:center;gap:11px;color:#536066;text-align:left;font-weight:650}.nav button:hover{background:#f4f7f6;color:var(--ink)}.nav button.active{background:var(--primary-soft);color:var(--primary-strong)}.nav-icon{width:20px;height:20px;display:grid;place-items:center;font-size:16px}.sidebar-utility{margin-top:auto;padding:14px 0;border-top:1px solid var(--line)}.utility-btn{width:100%;border:0;background:transparent;border-radius:11px;padding:10px 12px;display:flex;align-items:center;gap:10px;color:#5e6b70;text-align:left;font-weight:650}.utility-btn:hover{background:#f4f7f6}.sidebar-foot{display:grid;gap:12px;padding-top:4px}.profile-mini{display:flex;align-items:center;gap:10px;padding:8px}.profile-mini .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eaf3f1;color:var(--primary);font-weight:800}.profile-mini strong,.profile-mini span{display:block}.profile-mini span{font-size:11px;color:var(--muted);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.main{min-width:0}.topbar{height:88px;position:sticky;top:0;z-index:15;background:rgba(245,247,247,.9);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid rgba(230,235,234,.8)}.topbar h2{font-size:24px;letter-spacing:-.03em;margin:0}.topbar p{margin:3px 0 0;font-size:13px}.topbar-actions{display:flex;align-items:center;gap:10px}.month-pill{background:#fff;border:1px solid var(--line);padding:8px 11px;border-radius:11px;color:#536066;font-weight:650;font-size:12px}.page{max-width:1450px;margin:0 auto;padding:30px 32px 56px}.mobile-nav{display:none}
.hero-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}.hero-heading h3{font-size:25px;letter-spacing:-.035em;margin:0 0 4px}.hero-heading p{margin:0;color:var(--muted)}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.metric-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;min-height:126px;box-shadow:0 3px 14px rgba(31,55,51,.025)}.metric-card .metric-label{font-size:12px;color:var(--muted);font-weight:700}.metric-card .metric-value{font-size:31px;line-height:1.1;letter-spacing:-.045em;font-weight:800;margin-top:14px}.metric-card .metric-sub{font-size:11px;color:var(--muted);margin-top:7px}.metric-card.positive .metric-value{color:var(--success)}.metric-card.negative .metric-value{color:var(--danger)}
.section{margin-top:24px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px}.section.flat{background:transparent;border:0;padding:0}.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.section-head h3{margin:0;font-size:17px;letter-spacing:-.02em}.section-head p{margin:3px 0 0;color:var(--muted);font-size:12px}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.quick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.quick-action{border:1px solid var(--line);background:#fff;border-radius:17px;padding:16px;text-align:left;min-height:118px;display:flex;flex-direction:column;justify-content:space-between;transition:.18s}.quick-action:hover{border-color:#bfd8d4;box-shadow:var(--shadow);transform:translateY(-2px)}.quick-icon{width:36px;height:36px;border-radius:11px;background:var(--primary-soft);display:grid;place-items:center;color:var(--primary);font-weight:800}.quick-action strong{font-size:14px}.quick-action span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.attention-list,.activity-list,.student-list{display:grid}.attention-row,.activity-row,.student-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 2px;border-bottom:1px solid var(--line)}.attention-row:last-child,.activity-row:last-child,.student-row:last-child{border-bottom:0}.row-main{min-width:0}.row-main strong{display:block}.row-main p{margin:3px 0 0;color:var(--muted);font-size:12px}.row-side{text-align:right;white-space:nowrap}.row-side strong{display:block}
.class-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.class-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:19px;display:grid;gap:16px;transition:.18s}.class-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.class-card-head{display:flex;justify-content:space-between;gap:12px}.class-card h4{font-size:17px;margin:0;letter-spacing:-.025em}.class-card .sub{color:var(--muted);font-size:12px;margin-top:2px}.class-students{font-size:29px;font-weight:800;letter-spacing:-.04em}.class-students small{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:0}.class-economics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mini-stat{background:#f7f9f8;border-radius:12px;padding:10px}.mini-stat span{display:block;color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.mini-stat strong{display:block;margin-top:3px}.card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
.health{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800;text-transform:capitalize}.health:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.health.healthy{background:var(--success-soft);color:var(--success)}.health.watch{background:var(--warning-soft);color:var(--warning)}.health.merge,.health.loss{background:var(--danger-soft);color:var(--danger)}.health.closed{background:#eef1f1;color:#6b7579}
.search-row{display:flex;gap:10px;align-items:center}.search{max-width:420px;background:#fff}.filter-tabs{display:flex;gap:7px;flex-wrap:wrap}.filter-tab{border:1px solid var(--line);background:#fff;padding:7px 10px;border-radius:999px;font-size:11px;font-weight:750;color:#59666b}.filter-tab.active{background:#172126;color:#fff;border-color:#172126}.student-row{padding:15px 2px}.student-avatar{width:38px;height:38px;border-radius:12px;background:#eef5f3;color:var(--primary);display:grid;place-items:center;font-weight:800;flex:0 0 auto}.student-left{display:flex;align-items:center;gap:12px;min-width:0}.student-meta{min-width:0}.student-meta strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.student-meta span{display:block;color:var(--muted);font-size:11px;margin-top:2px}.student-money{text-align:right}.student-money strong{font-size:15px}.student-money span{display:block;font-size:10px;color:var(--danger);margin-top:2px}.student-actions{display:flex;gap:7px}
.chip{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:750;background:#f0f3f2;color:#667176;text-transform:capitalize}.chip.good{background:var(--success-soft);color:var(--success)}.chip.bad{background:var(--danger-soft);color:var(--danger)}.chip.warn{background:var(--warning-soft);color:var(--warning)}.chip.blue{background:var(--blue-soft);color:var(--blue)}
.finance-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.finance-action{border:1px solid var(--line);background:#fff;border-radius:15px;padding:14px;display:flex;align-items:center;gap:11px;text-align:left}.finance-action:hover{border-color:#bdd8d3}.finance-action .quick-icon{width:32px;height:32px;flex:0 0 auto}.finance-action span{font-size:11px;color:var(--muted);display:block}.finance-columns{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.amount-in{color:var(--success)}.amount-out{color:var(--danger)}
.month-panel{background:#172126;color:#fff;border-radius:24px;padding:22px;margin-top:24px}.month-panel .muted{color:#aeb8bb}.month-panel input{background:#263237;border-color:#39474b;color:#fff}.month-panel .btn.subtle{background:#263237;border-color:#39474b;color:#fff}.month-panel .btn.primary{background:#1aa391}.month-content{margin-top:18px}.month-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.month-step{background:#212c30;border:1px solid #344247;border-radius:16px;padding:15px}.month-step .step-num{font-size:10px;color:#8fa0a4;text-transform:uppercase;letter-spacing:.08em;font-weight:800}.month-step h4{margin:7px 0 10px}.month-step .big{font-size:24px;font-weight:800;letter-spacing:-.035em}.month-step p{font-size:11px;color:#aeb8bb;margin:4px 0 0}.month-decisions{margin-top:12px;display:grid;gap:8px}.decision-row{background:#263237;border-radius:12px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.empty{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--line-strong);border-radius:14px}.note,.alert{padding:12px 13px;border-radius:12px;background:#f4f7f6;color:#536066;font-size:12px}.alert{background:var(--danger-soft);color:var(--danger)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:12px 13px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:#f8faf9}tr:last-child td{border-bottom:0}.kv{display:grid;grid-template-columns:1fr auto;gap:9px 20px}.kv strong{text-align:right}
.modal{border:0;padding:0;border-radius:22px;width:min(620px,calc(100% - 28px));box-shadow:0 30px 100px rgba(20,36,33,.25);overflow:hidden}.modal::backdrop{background:rgba(16,29,27,.42);backdrop-filter:blur(3px)}.modal form{margin:0}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line)}.modal-head h3{margin:0;font-size:19px}.icon-btn{border:0;background:#f1f4f3;width:34px;height:34px;border-radius:10px;font-size:20px;color:#687377}.modal-body{padding:20px 22px;display:grid;gap:15px;max-height:70vh;overflow:auto}.modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:15px 22px;border-top:1px solid var(--line);background:#fbfcfc}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal.drawer-mode{margin:0 0 0 auto;height:100vh;max-height:100vh;width:min(520px,100%);border-radius:22px 0 0 22px}.modal.drawer-mode form{height:100%;display:flex;flex-direction:column}.modal.drawer-mode .modal-body{max-height:none;flex:1}.drawer-hero{padding:2px 0 10px}.drawer-hero h2{font-size:26px;margin:0;letter-spacing:-.04em}.drawer-hero p{margin:4px 0 0;color:var(--muted)}.drawer-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.drawer-stat{background:#f6f8f8;border-radius:13px;padding:12px}.drawer-stat span{display:block;font-size:10px;color:var(--muted);font-weight:700}.drawer-stat strong{font-size:18px;display:block;margin-top:3px}
.payment-due{background:linear-gradient(135deg,#eef8f6,#f7fbfa);border:1px solid #d7ece8;border-radius:17px;padding:16px}.payment-due span{font-size:11px;color:var(--muted);font-weight:700}.payment-due strong{display:block;font-size:30px;letter-spacing:-.045em;margin-top:3px}.quick-amounts{display:flex;gap:7px;flex-wrap:wrap}.quick-amount{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:700}.quick-amount:hover{border-color:#8bc1ba}.account-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.account-choice{position:relative}.account-choice input{position:absolute;opacity:0;pointer-events:none}.account-choice span{display:block;border:1px solid var(--line);border-radius:13px;padding:11px 12px;background:#fff;font-weight:700}.account-choice small{display:block;color:var(--muted);font-weight:500;margin-top:2px}.account-choice input:checked+span{border-color:#5aa79f;background:var(--primary-soft);color:var(--primary-strong);box-shadow:0 0 0 2px rgba(13,118,110,.06)}
.toast{position:fixed;right:22px;bottom:22px;z-index:1000;background:#172126;color:#fff;padding:12px 15px;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateY(0)}.toast.error{background:#9d332e}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.quick-grid{grid-template-columns:repeat(3,1fr)}.class-grid{grid-template-columns:repeat(2,1fr)}.month-steps{grid-template-columns:repeat(2,1fr)}.finance-columns{grid-template-columns:1fr}}
@media(max-width:780px){.app-shell{display:block}.sidebar{display:none}.main{padding-bottom:74px}.topbar{height:auto;min-height:76px;padding:13px 16px}.topbar h2{font-size:21px}.topbar-actions{gap:6px}.month-pill,.attendance-btn{display:none}.page{padding:18px 14px 34px}.mobile-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;z-index:40;left:0;right:0;bottom:0;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:7px 8px max(7px,env(safe-area-inset-bottom))}.mobile-nav button{border:0;background:transparent;border-radius:10px;padding:7px 3px;color:#6a7579;font-size:10px;font-weight:700;display:grid;gap:2px;place-items:center}.mobile-nav button.active{color:var(--primary);background:var(--primary-soft)}.metric-grid{grid-template-columns:1fr 1fr;gap:9px}.metric-card{padding:15px;min-height:108px}.metric-card .metric-value{font-size:25px}.quick-grid{grid-template-columns:1fr 1fr}.quick-action{min-height:106px}.class-grid{grid-template-columns:1fr}.section{padding:15px;margin-top:16px}.student-row{align-items:flex-start;flex-wrap:wrap}.student-left{width:calc(100% - 100px)}.student-actions{width:100%;justify-content:flex-end}.finance-actions{grid-template-columns:1fr 1fr}.month-steps{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.drawer-stats{grid-template-columns:1fr 1fr}.account-grid{grid-template-columns:1fr}.auth-card{padding:24px}.auth-copy{padding-top:28px}.auth-copy h1{font-size:28px}}


/* === Obsidian Emerald Finance — visual layer only === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{
 --primary:#005c55;--primary-strong:#00504a;--primary-soft:#e8f5f3;--ink:#131d22;--muted:#556066;
 --bg:#f5f7f7;--card:#fff;--line:#e6ebea;--line-strong:#bdc9c6;--danger:#ba1a1a;--danger-soft:#ffdad6;
 --warning:#8a6100;--warning-soft:#fff4d8;--success:#0d766e;--success-soft:#eaf7ef;--blue:#1e4f9b;--blue-soft:#e9f0ff;
 --shadow:0 2px 8px rgba(13,118,110,.04);--radius:20px;--radius-sm:12px
}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
.money,.metric-value,.class-students,.mini-stat strong,.drawer-stat strong,.month-step .big,.row-side strong,.student-money strong,.kv strong{font-variant-numeric:tabular-nums}
.app-shell{grid-template-columns:240px minmax(0,1fr)}
.sidebar{background:#fff;border-right:1px solid #bdc9c6;padding:28px 14px 20px}
.brand{padding:0 10px 28px}.brand strong{color:#005c55;font-size:18px;font-weight:800;letter-spacing:-.035em}.brand span{font-size:12px;color:#556066}
.brand-mark{background:#005c55;border-radius:12px;box-shadow:0 8px 18px rgba(13,118,110,.12)}
.nav{gap:4px}.nav button{position:relative;border-radius:10px;padding:11px 12px 11px 14px;color:#556066;font-weight:600}.nav button:hover{background:#f6f9f8;color:#005c55}.nav button.active{background:#d9e4eb;color:#005c55;font-weight:800}.nav button.active:before{content:"";position:absolute;left:-14px;top:5px;bottom:5px;width:4px;border-radius:0 4px 4px 0;background:#005c55}
.nav-icon{width:24px;height:24px;font-size:17px;color:currentColor}
.sidebar-utility{border-top:1px solid #e6ebea}.utility-btn{color:#556066}.utility-btn:hover{background:#f6f9f8;color:#005c55}.profile-mini .avatar{background:#e8f5f3;color:#005c55;border:1px solid #cfe2de}
.main{background:#f5f7f7}.topbar{min-height:74px;background:rgba(244,250,255,.90);backdrop-filter:blur(14px);border-bottom:1px solid #bdc9c6;padding:12px 32px}.topbar h2{font-size:24px!important;line-height:32px;letter-spacing:-.035em;color:#005c55;font-weight:800}.topbar p{font-size:12px;color:#556066}.month-pill{background:#fff;border:1px solid #e6ebea;border-radius:10px;color:#556066;box-shadow:0 2px 8px rgba(13,118,110,.04)}.attendance-btn{background:#e8f5f3!important;color:#005c55!important}.page{max-width:1480px;padding:30px 32px 58px}
.hero-heading{margin-bottom:22px}.hero-heading h3{font-size:32px;line-height:38px;letter-spacing:-.04em;font-weight:800;color:#005c55}.hero-heading p{font-size:14px;color:#556066}.section-head h3{font-size:19px;line-height:26px;letter-spacing:-.025em;color:#005c55;font-weight:800}.section-head p{color:#556066}
.metric-grid{gap:16px;margin-bottom:24px}.metric-card{background:#fff;border:1px solid #e6ebea;border-radius:20px;padding:22px 24px;min-height:142px;box-shadow:0 2px 8px rgba(13,118,110,.04);position:relative;overflow:hidden}.metric-card:hover{border-color:#bdc9c6;box-shadow:0 8px 18px rgba(13,118,110,.08);transform:translateY(-1px)}.metric-card:after{content:"";position:absolute;right:18px;top:18px;width:34px;height:34px;border-radius:10px;background:#e8f5f3;opacity:.9}.metric-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#556066;font-weight:800;max-width:75%}.metric-value{font-size:31px;line-height:34px;letter-spacing:-.045em;font-weight:800;margin-top:25px}.metric-sub{color:#556066;font-size:11px}.metric-card.positive .metric-value{color:#0d766e}.metric-card.negative .metric-value{color:#ba1a1a}
.section{background:#fff;border:1px solid #e6ebea;border-radius:20px;padding:22px 24px;box-shadow:0 2px 8px rgba(13,118,110,.04)}.section.flat{background:transparent;border:0;box-shadow:none;padding:0}
.quick-grid{gap:12px}.quick-action,.finance-action{border:1px solid #e6ebea;background:#fff;border-radius:14px;box-shadow:none;transition:.18s}.quick-action:hover,.finance-action:hover{border-color:#bdc9c6;box-shadow:0 8px 18px rgba(13,118,110,.08);transform:translateY(-1px)}.quick-icon{background:#e8f5f3;color:#005c55;border-radius:11px}.quick-action strong,.finance-action strong{color:#131d22}.quick-action span,.finance-action span{color:#556066}
.attention-row,.activity-row,.student-row{border-bottom-color:#e6ebea}.row-main p{color:#556066}
.class-grid{gap:16px}.class-card{background:#fff;border:1px solid #e6ebea;border-radius:20px;box-shadow:0 2px 8px rgba(13,118,110,.04)}.class-card:hover{border-color:#bdc9c6;box-shadow:0 8px 18px rgba(13,118,110,.08);transform:translateY(-1px)}.class-card h4{color:#005c55;font-weight:800}.class-card .sub{color:#556066}.class-students{font-size:31px;line-height:34px;letter-spacing:-.045em;font-weight:800}.mini-stat{background:#f7f9f8;border-radius:12px}.mini-stat span{font-size:10px;letter-spacing:.05em;color:#556066;font-weight:800}.health,.chip{border-radius:999px}.health:before,.chip.good:before,.chip.bad:before,.chip.warn:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.health.healthy,.chip.good{background:#eaf7ef;color:#0d766e}.health.watch,.chip.warn{background:#fff4d8;color:#8a6100}.health.merge,.health.loss,.chip.bad{background:#ffdad6;color:#ba1a1a}
.search,.filter-tab{background:#fff;border-color:#e6ebea}.filter-tab.active{background:#005c55;border-color:#005c55;color:#fff}.student-avatar{background:#e8f5f3;color:#005c55;border-radius:12px}.student-meta span{color:#556066}
.finance-actions{gap:10px}.finance-action{min-height:92px}.finance-columns{gap:18px}.amount-in{color:#0d766e!important}.amount-out{color:#ba1a1a!important}
.month-panel{background:#172126!important;color:#fff;border-radius:24px!important;padding:24px!important;border:1px solid #223036!important;box-shadow:0 20px 55px rgba(19,29,34,.12)!important}.month-panel .section-head h3{color:#fff!important}.month-panel .muted{color:#aeb8bb!important}.month-panel input,.month-panel select{background:#273237!important;border-color:#39474b!important;color:#fff!important}.month-panel .btn.subtle{background:#273237!important;border-color:#39474b!important;color:#fff!important}.month-panel .btn.primary{background:#0d766e!important}.month-step{background:#212c30!important;border:1px solid #344247!important;border-radius:16px!important}.month-step .step-num{color:#91a0a5!important}.month-step p{color:#aeb8bb!important}.decision-row{background:#273237!important}
input,select,textarea{border:1px solid #d7dfdd;border-radius:12px;background:#fff;color:#131d22}input:focus,select:focus,textarea:focus{border-color:#0d766e;box-shadow:0 0 0 4px rgba(13,118,110,.08)}label{color:#3e4947}.btn{border-radius:12px}.btn.primary{background:#005c55;color:#fff;box-shadow:0 8px 18px rgba(13,118,110,.12)}.btn.primary:hover{background:#00504a}.btn.soft{background:#e8f5f3;color:#005c55}.btn.subtle,.btn.ghost{background:#fff;border:1px solid #e6ebea}.btn.subtle:hover,.btn.ghost:hover{border-color:#bdc9c6}.btn.text{color:#005c55}.btn.danger{background:#ffdad6;color:#ba1a1a}
.payment-due{background:#f7fbfa;border-color:#d7ece8;border-radius:16px}.account-choice span{border-color:#e6ebea;border-radius:13px}.account-choice input:checked+span{border-color:#0d766e;background:#e8f5f3;color:#005c55}.quick-amount{border-color:#e6ebea}.quick-amount:hover{border-color:#0d766e}
.table-wrap{border-color:#e6ebea}.table-wrap table{background:#fff}th,td{border-bottom-color:#e6ebea}th{background:#f7f9f8;color:#556066;font-size:10px;letter-spacing:.06em;font-weight:800}
.modal{border-radius:22px;box-shadow:0 30px 100px rgba(19,29,34,.26)}.modal::backdrop{background:rgba(19,29,34,.46);backdrop-filter:blur(4px)}.modal-head{border-bottom-color:#e6ebea}.modal-head h3,.drawer-hero h2{color:#005c55}.modal-actions{border-top-color:#e6ebea;background:#fbfcfc}.drawer-stat{background:#f7f9f8}.drawer-stat span{color:#556066}.icon-btn{background:#f7f9f8;color:#556066}.note{background:#f4f7f6;color:#556066}.empty{border-color:#bdc9c6;color:#556066}.toast{background:#172126}
.auth-screen{background:radial-gradient(circle at 12% 8%,rgba(155,242,232,.24),transparent 34%),linear-gradient(145deg,#f4faff 0%,#f5f7f7 52%,#eaf5fc 100%)}.auth-card{border-color:#e6ebea;border-radius:24px;box-shadow:0 24px 70px rgba(19,29,34,.10)}.auth-copy h1{letter-spacing:-.04em}.auth-brand strong{color:#005c55}
@media(max-width:780px){.topbar{background:rgba(244,250,255,.92)}.mobile-nav{background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-top-color:#bdc9c6}.mobile-nav button.active{background:#e8f5f3;color:#005c55}.hero-heading h3{font-size:24px;line-height:32px}.metric-card{border-radius:16px}}


/* === Obsidian Emerald — faithful layout pass === */
.material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:22px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-feature-settings:'liga'}
body{background:#f4faff;color:#131d22}
.app-shell{grid-template-columns:292px minmax(0,1fr);background:#f4faff}
.sidebar{padding:28px 24px 22px;background:#f4faff;border-right:1px solid #bdc9c6}
.institutional-brand{padding:0 0 34px;gap:14px}.institutional-brand .brand-mark{width:42px;height:50px;border-radius:13px;background:#006a63;box-shadow:none}.institutional-brand .brand-mark .material-symbols-outlined{font-size:27px;color:#fff}.institutional-brand strong{font-size:21px;color:#006a63;letter-spacing:-.04em;white-space:nowrap}.institutional-brand span{font-size:13px;color:#556066;margin-top:2px}
.nav{gap:5px}.nav button{min-height:49px;border-radius:9px;padding:0 14px 0 18px;font-size:15px;color:#556066;gap:13px}.nav button.active{background:#d9e4eb;color:#005c55}.nav button.active:before{left:-24px;top:0;bottom:0;width:5px;border-radius:0 8px 8px 0}.nav-icon{font-family:'Material Symbols Outlined';font-size:25px;width:26px;height:26px}
.sidebar-cta{margin-top:auto;width:100%;border:0;border-radius:10px;background:#006a63;color:#fff;padding:13px 14px;font-weight:800;display:flex;justify-content:center;align-items:center;gap:9px;box-shadow:0 8px 18px rgba(13,118,110,.12)}.sidebar-cta:hover{background:#005c55;transform:translateY(-1px)}.sidebar-cta .material-symbols-outlined{font-size:20px}
.sidebar-utility{margin-top:28px;padding:22px 0 4px;border-top:1px solid #bdc9c6}.utility-btn{font-size:14px;padding:10px 12px}.utility-btn .material-symbols-outlined{font-size:21px}.sidebar-foot{padding-top:4px;gap:7px}.profile-mini{display:none}.sidebar-signout{border:0;background:transparent;color:#556066;padding:11px 12px;border-radius:9px;display:flex;align-items:center;gap:11px;font-weight:700;text-align:left}.sidebar-signout:hover{background:#eaf5fc;color:#005c55}.sidebar-signout .material-symbols-outlined{font-size:22px}
.main{background:#f5f7f7}.topbar{height:74px;min-height:74px;background:rgba(244,250,255,.93);border-bottom:1px solid #bdc9c6;padding:0 32px}.topbar-copy h2{font-size:18px!important;line-height:24px;color:#005c55}.topbar-copy p{font-size:11px}.topbar-actions{gap:9px}.month-pill{padding:8px 12px;border-color:#d7dfdd;background:#fff}.btn.icon-only{border-color:#d7dfdd;background:#fff;width:38px;height:38px}.btn.icon-only .material-symbols-outlined{font-size:20px}.attendance-btn{min-height:38px}
.page{max-width:none;margin:0;padding:30px 30px 44px}
.executive-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 24px}.executive-page-head h3{margin:0;color:#006a63;font-size:40px;line-height:44px;font-weight:800;letter-spacing:-.055em}.executive-page-head p{margin:5px 0 0;color:#556066;font-size:16px}.executive-head-actions{display:flex;gap:10px;align-items:center}.executive-head-actions .btn{min-height:42px;padding:0 16px;border-radius:10px}.executive-head-actions .material-symbols-outlined{font-size:18px}
.executive-metric-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:20px}.executive-metric-card{min-height:186px;background:#fff;border:1px solid #e6ebea;border-radius:14px;padding:24px 24px 20px;box-shadow:0 2px 8px rgba(13,118,110,.04);display:flex;flex-direction:column}.executive-card-top{display:flex;justify-content:space-between;align-items:flex-start}.executive-label{text-transform:uppercase;letter-spacing:.055em;font-size:11px;font-weight:800;color:#556066}.metric-symbol{width:36px;height:36px;border-radius:9px;background:#e8f5f3;color:#006a63;display:grid;place-items:center;font-size:20px}.executive-number{font-size:40px;line-height:44px;letter-spacing:-.055em;font-weight:800;margin-top:25px;color:#131d22;font-variant-numeric:tabular-nums}.executive-number small{font-size:20px;letter-spacing:-.025em;color:#bdc8cf}.executive-meta{display:flex;align-items:center;gap:10px;margin-top:auto;font-size:12px;color:#556066}.status-soft{display:inline-flex;align-items:center;gap:5px;background:#e8f5f3;color:#006a63;border-radius:7px;padding:5px 8px;font-weight:650}.status-soft .material-symbols-outlined{font-size:14px}.executive-critical{background:#17262b;color:#fff;border-color:#17262b;box-shadow:none}.executive-critical .executive-label{color:#bdc8cf}.executive-critical .metric-symbol{background:#27383e;color:#7fd5cc}.executive-critical .executive-number{color:#fff}.critical-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.critical-chip{background:#47272a;color:#ffb4ab;border-radius:8px;padding:5px 9px;font-size:11px;font-weight:700}.critical-link{border:0;background:transparent;color:#7fd5cc;text-decoration:underline;text-underline-offset:3px;font-size:14px;font-weight:700;padding:0}
.executive-bento{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.82fr);gap:20px;align-items:start}.executive-main-column{display:grid;gap:20px}.executive-panel{background:#fff;border:1px solid #e6ebea;border-radius:14px;box-shadow:0 2px 8px rgba(13,118,110,.04);overflow:hidden}.executive-panel-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid #e6ebea}.executive-panel-head h3{margin:0;font-size:24px;line-height:30px;color:#006a63;letter-spacing:-.035em;font-weight:800}.executive-panel-head p{margin:3px 0 0;color:#556066;font-size:12px}.executive-panel-head .btn.text{margin:0}
.finance-snapshot-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid #e6ebea;background:#f9fbfc}.finance-snapshot-strip>div{padding:17px 22px;border-right:1px solid #e6ebea}.finance-snapshot-strip>div:last-child{border-right:0}.finance-snapshot-strip span{display:block;text-transform:uppercase;letter-spacing:.06em;font-size:9px;font-weight:800;color:#6e7977}.finance-snapshot-strip strong{display:block;margin-top:4px;font-size:19px;font-variant-numeric:tabular-nums}.executive-class-list{display:grid}.executive-class-row{border:0;background:#fff;border-bottom:1px solid #e6ebea;padding:17px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;width:100%;transition:.15s}.executive-class-row:last-child{border-bottom:0}.executive-class-row:hover{background:#f4faff}.executive-class-row>div:first-child{min-width:0}.executive-class-row strong{display:block;color:#131d22;font-size:14px}.executive-class-row span{display:block;color:#556066;font-size:11px;margin-top:3px}.class-row-right{display:flex;align-items:center;gap:12px;white-space:nowrap}.class-row-right>strong{font-size:14px}.class-row-right .health{margin:0}
.quick-executive-panel{background:#eef7fd}.quick-executive-panel .executive-panel-head{background:#eef7fd}.executive-quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;padding:18px 24px 24px}.executive-quick-action{border:1px solid #d7dfdd;background:#fff;border-radius:10px;padding:16px 12px;min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;color:#131d22}.executive-quick-action:hover{border-color:#9fb3b0;transform:translateY(-1px)}.executive-quick-action>.material-symbols-outlined{font-size:25px;color:#556066}.executive-quick-action strong{font-size:13px}.executive-quick-action small{font-size:10px;color:#6e7977}
.recent-executive-panel{min-height:100%;background:#f4faff}.recent-executive-panel .executive-panel-head{background:#fff}.executive-activity-list{display:grid}.executive-activity-row{min-height:84px;padding:15px 20px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;border-bottom:1px solid #e1eaef}.activity-symbol{width:40px;height:40px;border-radius:9px;display:grid;place-items:center;font-size:22px;border:1px solid}.activity-symbol.in{background:#eaf7ef;color:#0d766e;border-color:#b9d5cc}.activity-symbol.out{background:#fff0ee;color:#ba1a1a;border-color:#ffc9c4}.activity-copy{min-width:0}.activity-copy strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-copy span{display:block;font-size:11px;color:#6e7977;margin-top:2px}.activity-amount{font-size:14px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}.attention-mini-block{margin:16px;background:#fff;border:1px solid #e6ebea;border-radius:11px;overflow:hidden}.attention-mini-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#f7fafb;border-bottom:1px solid #e6ebea;text-transform:uppercase;letter-spacing:.055em;font-size:10px;font-weight:800;color:#556066}.attention-mini-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid #e6ebea}.attention-mini-row:last-child{border-bottom:0}.attention-mini-row strong{display:block;font-size:12px}.attention-mini-row span{display:block;font-size:10px;color:#6e7977;margin-top:2px}.attention-mini-row .btn{flex:0 0 auto}.attention-mini-empty{padding:14px;color:#6e7977;font-size:12px}
.metric-card,.section,.class-card{border-radius:14px}.section-head h3,.class-card h4{color:#006a63}.filter-tab.active{background:#006a63;border-color:#006a63}.btn.primary{background:#006a63}.btn.primary:hover{background:#005c55}.month-panel{border-radius:18px!important}
@media(max-width:1180px){.app-shell{grid-template-columns:240px minmax(0,1fr)}.sidebar{padding-left:18px;padding-right:18px}.nav button.active:before{left:-18px}.executive-bento{grid-template-columns:1fr}.recent-executive-panel{min-height:auto}.executive-metric-row{grid-template-columns:repeat(3,minmax(0,1fr))}.executive-page-head h3{font-size:34px}.executive-quick-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:880px){.executive-metric-row{grid-template-columns:1fr 1fr}.executive-critical{grid-column:1/-1}.finance-snapshot-strip{grid-template-columns:1fr}.finance-snapshot-strip>div{border-right:0;border-bottom:1px solid #e6ebea}.finance-snapshot-strip>div:last-child{border-bottom:0}}
@media(max-width:780px){.app-shell{display:block}.sidebar{display:none}.page{padding:18px 14px 30px}.executive-page-head{align-items:flex-start;flex-direction:column}.executive-page-head h3{font-size:30px;line-height:34px}.executive-head-actions{width:100%}.executive-head-actions .btn{flex:1}.executive-metric-row{grid-template-columns:1fr}.executive-critical{grid-column:auto}.executive-metric-card{min-height:156px}.executive-bento{grid-template-columns:1fr}.executive-quick-grid{grid-template-columns:1fr 1fr;padding:14px}.executive-panel-head{padding:17px}.executive-class-row{padding:15px 17px}.class-row-right{align-items:flex-end;flex-direction:column;gap:5px}.executive-activity-row{padding:13px 14px}.topbar-copy p{display:none}}


/* === ClassFlow Compact Executive Pass — visual sizing only === */
@media (min-width:781px){
  .app-shell{grid-template-columns:208px minmax(0,1fr)}
  .sidebar{padding:20px 12px 16px}
  .brand{padding:0 8px 18px}.brand strong{font-size:16px}.brand span{font-size:10px}.small-mark{width:34px;height:34px;border-radius:10px}
  .nav{gap:2px}.nav button{padding:9px 10px 9px 12px;font-size:12px}.nav-icon{width:20px;height:20px;font-size:15px}.nav button.active:before{left:-12px}
  .sidebar-utility{padding:10px 0}.utility-btn{padding:8px 10px;font-size:12px}.profile-mini{padding:6px}.profile-mini .avatar{width:30px;height:30px}.sidebar-foot{gap:8px}
  .topbar{min-height:62px;height:62px;padding:8px 24px}.topbar h2{font-size:20px!important;line-height:25px}.topbar p{font-size:11px}.topbar-actions{gap:7px}.month-pill{padding:6px 9px;font-size:11px}.topbar .btn{min-height:34px;padding:7px 10px}.btn.icon-only{width:34px;height:34px}
  .page{max-width:1380px;padding:22px 24px 40px}
  .executive-page-head{gap:16px;margin-bottom:16px}.executive-page-head h3{font-size:30px;line-height:34px}.executive-page-head p{font-size:13px;margin-top:3px}.executive-head-actions{gap:7px}.executive-head-actions .btn{min-height:36px;padding:0 12px;font-size:12px}
  .executive-metric-row{gap:12px;margin-bottom:14px}.executive-metric-card{min-height:132px;border-radius:12px;padding:16px 17px 14px}.executive-label{font-size:9px}.metric-symbol{width:30px;height:30px;border-radius:8px;font-size:17px}.executive-number{font-size:30px;line-height:34px;margin-top:15px}.executive-number small{font-size:15px}.executive-meta{gap:7px;font-size:10px}.status-soft,.critical-chip{padding:4px 7px;font-size:10px}
  .executive-bento{grid-template-columns:minmax(0,1.55fr) minmax(300px,.72fr);gap:14px}.executive-main-column{gap:14px}.executive-panel{border-radius:12px}.executive-panel-head{padding:15px 18px;gap:12px}.executive-panel-head h3{font-size:19px;line-height:24px}.executive-panel-head p{font-size:10px}.executive-panel-head .btn{font-size:11px}
  .finance-snapshot-strip>div{padding:11px 16px}.finance-snapshot-strip span{font-size:8px}.finance-snapshot-strip strong{font-size:16px;margin-top:2px}
  .executive-class-row{padding:11px 18px;gap:12px}.executive-class-row strong{font-size:12px}.executive-class-row span{font-size:10px;margin-top:2px}.class-row-right{gap:8px}.class-row-right>strong{font-size:12px}.health{padding:4px 7px;font-size:9px}
  .executive-quick-grid{gap:8px;padding:12px 16px 16px}.executive-quick-action{min-height:82px;border-radius:9px;padding:10px 8px;gap:4px}.executive-quick-action>.material-symbols-outlined{font-size:21px}.executive-quick-action strong{font-size:11px}.executive-quick-action small{font-size:9px}
  .executive-activity-row{min-height:64px;padding:10px 14px;grid-template-columns:34px minmax(0,1fr) auto;gap:9px}.activity-symbol{width:34px;height:34px;border-radius:8px;font-size:18px}.activity-copy strong{font-size:12px}.activity-copy span{font-size:9px}.activity-amount{font-size:12px}.attention-mini-block{margin:11px}.attention-mini-head{padding:9px 11px;font-size:9px}.attention-mini-row{padding:9px 11px}.attention-mini-row strong{font-size:11px}.attention-mini-row span{font-size:9px}
  .section{margin-top:16px;padding:16px;border-radius:14px}.section-head{margin-bottom:12px}.section-head h3{font-size:16px}.section-head p{font-size:10px}.class-grid{gap:10px}.class-card{padding:14px;border-radius:14px;gap:11px}.class-card h4{font-size:14px}.class-students{font-size:24px}.mini-stat{padding:8px}.student-row,.attention-row,.activity-row{padding:10px 2px}.student-avatar{width:34px;height:34px}.student-meta strong{font-size:12px}.student-actions{gap:5px}.small-btn{padding:6px 8px;font-size:10px}
  .finance-actions{gap:8px}.finance-action{min-height:70px;padding:10px;border-radius:12px}.finance-action .quick-icon{width:28px;height:28px}.month-panel{padding:18px!important;border-radius:16px!important}.month-step{padding:12px;border-radius:12px!important}.month-step .big{font-size:20px}
}
@media (min-width:781px) and (max-width:1180px){.app-shell{grid-template-columns:196px minmax(0,1fr)}.sidebar{padding-left:10px;padding-right:10px}.nav button.active:before{left:-10px}.executive-bento{grid-template-columns:1fr}.page{padding-left:18px;padding-right:18px}}

/* Weekly class count */
.drawer-stat small{display:block;margin-top:3px;font-size:9px;color:var(--muted);font-weight:500}.class-card .card-footer .toolbar{justify-content:flex-end;flex-wrap:wrap}


/* === Active / Dropout roster update === */
.roster-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}.roster-summary>div{background:#f7f9f8;border:1px solid var(--line);border-radius:12px;padding:12px}.roster-summary span{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.roster-summary strong{display:block;margin-top:3px;font-size:20px;font-variant-numeric:tabular-nums}.roster-list{display:grid;border:1px solid var(--line);border-radius:14px;overflow:hidden}.roster-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 12px;border-bottom:1px solid var(--line);background:#fff}.roster-row:last-child{border-bottom:0}.roster-person{min-width:0}.roster-person strong{display:block}.roster-person span{display:block;color:var(--muted);font-size:11px;margin-top:2px}.roster-toggle{display:flex;gap:6px;flex:0 0 auto}.roster-toggle label{display:block;position:relative}.roster-toggle input{position:absolute;opacity:0;pointer-events:none}.roster-toggle span{display:block;border:1px solid var(--line);border-radius:9px;padding:6px 9px;font-size:11px;font-weight:750;color:var(--muted);background:#fff}.roster-toggle input[value="active"]:checked+span{background:var(--success-soft);border-color:#b9d5cc;color:var(--success)}.roster-toggle input[value="withdrawn"]:checked+span{background:var(--danger-soft);border-color:#ffc9c4;color:var(--danger)}
@media(max-width:600px){.roster-row{align-items:flex-start;flex-direction:column}.roster-toggle{width:100%}.roster-toggle label{flex:1}.roster-toggle span{text-align:center}.roster-summary{grid-template-columns:1fr 1fr}}

/* === Cozy compact UI pass — presentation only, 2026-08-23 === */
:root{
  --bg:#f7f8f6;
  --card:#fff;
  --line:#e7ebe8;
  --line-strong:#d4dcd8;
  --radius:12px;
}
body{background:var(--bg);font-size:13px}
.section,.executive-panel,.class-card,.executive-metric-card{box-shadow:none}
.section{margin-top:14px;padding:14px;border-radius:12px}
.section-head{margin-bottom:10px;gap:10px}
.section-head h3{font-size:15px;line-height:20px}
.section-head p{font-size:10px;margin-top:2px}
.btn{border-radius:9px;padding:8px 11px;font-size:12px;gap:6px;box-shadow:none}
.small-btn{padding:6px 8px;font-size:10px}
input,select,textarea{border-radius:9px;padding:9px 10px;font-size:13px}
label{gap:5px}
.search{max-width:360px}
.modal{width:min(560px,calc(100% - 28px));border-radius:16px;box-shadow:0 18px 55px rgba(19,29,34,.18)}
.modal-head{padding:14px 17px}
.modal-head h3{font-size:17px}
.modal-body{padding:15px 17px;gap:12px;max-height:72vh}
.modal-actions{padding:12px 17px}
.drawer-mode{width:min(480px,100%);border-radius:16px 0 0 16px}
.drawer-hero{padding-bottom:7px}
.drawer-hero h2{font-size:22px}
.drawer-stats{gap:7px}
.drawer-stat{padding:10px}
.roster-summary{gap:8px}
.roster-summary>div{padding:10px;border-radius:10px}
.roster-list{border-radius:11px}
.roster-row{padding:9px 10px}
.roster-toggle span{padding:5px 8px;border-radius:8px}

@media (min-width:781px){
  .app-shell{grid-template-columns:190px minmax(0,1fr)}
  .sidebar{padding:14px 10px 12px}
  .brand{gap:9px;padding:0 6px 14px}
  .brand-mark{width:36px;height:36px;border-radius:10px}
  .brand strong{font-size:14px}
  .brand span{font-size:9px}
  .nav{gap:3px}
  .nav button{min-height:40px;padding:7px 9px 7px 11px;font-size:12px;gap:9px;border-radius:8px}
  .nav button .material-symbols-outlined{font-size:18px}
  .nav button.active:before{left:-10px;width:3px}
  .topbar{height:58px;padding:0 20px;background:rgba(247,248,246,.94);backdrop-filter:blur(10px)}
  .topbar h2{font-size:18px!important;line-height:22px}
  .topbar p{font-size:10px;margin-top:1px}
  .page{max-width:1240px;padding:16px 20px 30px}
  .executive-page-head{margin-bottom:12px;gap:12px}
  .executive-page-head h3{font-size:26px;line-height:30px;letter-spacing:-.045em}
  .executive-page-head p{font-size:11px;margin-top:2px}
  .executive-head-actions .btn{min-height:32px;padding:0 10px;font-size:11px}
  .executive-metric-row{gap:9px;margin-bottom:11px}
  .executive-metric-card{min-height:104px;padding:12px 13px 11px;border-radius:11px}
  .executive-label{font-size:8px}
  .metric-symbol{width:27px;height:27px;border-radius:7px;font-size:16px}
  .executive-number{font-size:25px;line-height:29px;margin-top:9px}
  .executive-number small{font-size:13px}
  .executive-meta{font-size:9px;gap:5px}
  .status-soft,.critical-chip{padding:3px 6px;font-size:9px}
  .executive-bento{gap:11px;grid-template-columns:minmax(0,1.58fr) minmax(285px,.7fr)}
  .executive-main-column{gap:11px}
  .executive-panel{border-radius:11px}
  .executive-panel-head{padding:12px 14px;gap:9px}
  .executive-panel-head h3{font-size:16px;line-height:20px}
  .executive-panel-head p{font-size:9px}
  .finance-snapshot-strip>div{padding:9px 13px}
  .finance-snapshot-strip span{font-size:8px}
  .finance-snapshot-strip strong{font-size:14px;margin-top:1px}
  .executive-class-row{padding:9px 14px;gap:9px}
  .executive-class-row strong{font-size:11px}
  .executive-class-row span{font-size:9px}
  .class-row-right{gap:6px}
  .class-row-right>strong{font-size:11px}
  .health{padding:3px 6px;font-size:8px}
  .executive-quick-grid{gap:6px;padding:9px 12px 12px}
  .executive-quick-action{min-height:66px;padding:7px 6px;border-radius:8px;gap:2px}
  .executive-quick-action>.material-symbols-outlined{font-size:18px}
  .executive-quick-action strong{font-size:10px}
  .executive-quick-action small{font-size:8px}
  .executive-activity-row{min-height:54px;padding:8px 11px;grid-template-columns:30px minmax(0,1fr) auto;gap:8px}
  .activity-symbol{width:30px;height:30px;border-radius:7px;font-size:16px}
  .activity-copy strong,.activity-amount{font-size:11px}
  .activity-copy span{font-size:8px}
  .attention-mini-block{margin:8px}
  .attention-mini-head{padding:7px 9px;font-size:8px}
  .attention-mini-row{padding:8px 9px}
  .attention-mini-row strong{font-size:10px}
  .attention-mini-row span{font-size:8px}
  .class-grid{gap:9px}
  .class-card{padding:12px;border-radius:11px;gap:9px}
  .class-card h4{font-size:13px}
  .class-students{font-size:21px}
  .mini-stat{padding:7px;border-radius:9px}
  .student-row,.attention-row,.activity-row{padding:8px 2px;gap:11px}
  .student-avatar{width:31px;height:31px;font-size:11px}
  .student-meta strong{font-size:11px}
  .student-meta span{font-size:9px;margin-top:1px}
  .student-money strong{font-size:11px}
  .student-money span{font-size:9px}
  .student-actions{gap:4px}
  .finance-actions{gap:7px}
  .finance-action{min-height:62px;padding:8px 9px;border-radius:10px;gap:8px}
  .finance-action .quick-icon{width:26px;height:26px}
  .finance-action strong{font-size:11px}
  .finance-action span{font-size:9px}
  .month-panel{padding:14px!important;border-radius:13px!important}
  .month-step{padding:10px;border-radius:10px!important}
  .month-step .big{font-size:18px}
}

@media (min-width:781px) and (max-width:1180px){
  .app-shell{grid-template-columns:180px minmax(0,1fr)}
  .page{padding-left:16px;padding-right:16px}
  .executive-bento{grid-template-columns:1fr}
}

\n\n/* === Stitch-inspired ClassFlow surface system — design only === */\n:root{\n  --primary:#003527;\n  --primary-strong:#064e3b;\n  --primary-soft:#b0f0d6;\n  --ink:#151c27;\n  --muted:#56615c;\n  --bg:#f9f9ff;\n  --card:#ffffff;\n  --line:#d7dfdc;\n  --line-strong:#bfc9c3;\n  --danger:#ba1a1a;\n  --danger-soft:#ffdad6;\n  --warning:#755a00;\n  --warning-soft:#fff3c8;\n  --success:#0b6548;\n  --success-soft:#dff6eb;\n  --blue:#315eaa;\n  --blue-soft:#e7eefe;\n  --shadow:0 1px 3px rgba(21,28,39,.05);\n  --radius:12px;\n  --radius-sm:8px;\n}\nbody{background:var(--bg);color:var(--ink)}\n@media (min-width:781px){\n  .app-shell{grid-template-columns:216px minmax(0,1fr)}\n  .sidebar{padding:18px 12px 14px;background:#fff;border-right:1px solid var(--line-strong)}\n  .brand{gap:10px;padding:0 8px 18px}\n  .brand-mark{width:38px;height:38px;border-radius:9px;background:#064e3b;box-shadow:none}\n  .brand strong{font-size:14px;color:#003527;letter-spacing:-.025em}\n  .brand span{font-size:9px;color:#56615c}\n  .nav{gap:3px}\n  .nav button{min-height:38px;padding:7px 10px;font-size:12px;gap:10px;border-radius:8px;color:#56615c;font-weight:600}\n  .nav button:hover{background:#f0f3ff;color:#151c27}\n  .nav button.active{background:#dce2f3;color:#151c27;font-weight:700}\n  .nav button.active:before{display:none}\n  .nav .material-symbols-outlined{color:#707974;font-size:19px}\n  .nav button.active .material-symbols-outlined{color:#003527}\n  .topbar{height:62px;padding:0 20px;background:rgba(249,249,255,.94);border-bottom:0;backdrop-filter:blur(10px)}\n  .topbar h2{font-size:18px!important;line-height:22px;color:#003527;font-weight:700}\n  .topbar p{font-size:10px;color:#56615c}\n  .page{max-width:1320px;padding:18px 22px 34px}\n}\n\n/* Page hierarchy */\n.executive-page-head{margin-bottom:16px}\n.executive-page-head h3{color:#003527;font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.035em}\n.executive-page-head p{font-size:12px;color:#56615c}\n.section{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:none}\n.section-head h3,.executive-panel-head h3{color:#151c27}\n.section-head p,.executive-panel-head p{color:#56615c}\n.executive-panel{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:none}\n.executive-panel-head{background:#fff;border-bottom:1px solid var(--line);padding:13px 15px}\n\n/* Metric cards */\n.executive-metric-card{background:#fff!important;border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:none!important;color:#151c27!important}\n.executive-metric-card:hover{border-color:#bfc9c3!important;box-shadow:0 2px 8px rgba(21,28,39,.05)!important}\n.executive-label{color:#56615c!important}\n.executive-number{color:#151c27!important}\n.executive-number small{color:#707974!important}\n.executive-meta{color:#56615c!important}\n.metric-symbol{background:#b0f0d6!important;color:#003527!important}\n.status-soft{background:#f0f3ff!important;color:#404944!important;border:1px solid #dce2f3!important}\n.critical-chip{background:#ffdad6!important;color:#93000a!important}\n.finance-snapshot-strip{background:#f0f3ff!important;border-color:#dce2f3!important}\n.finance-snapshot-strip>div{border-color:#dce2f3!important}\n.finance-snapshot-strip span{color:#56615c!important}\n.finance-snapshot-strip strong{color:#151c27!important}\n\n/* Filters and search */\n.search,input,select,textarea{background:#fff;color:#151c27;border:1px solid var(--line-strong);border-radius:9px;box-shadow:none}\n.search:focus,input:focus,select:focus,textarea:focus{border-color:#064e3b;box-shadow:0 0 0 2px rgba(6,78,59,.08)}\n.filter-tabs{gap:7px}\n.filter-tab{padding:6px 11px;border-radius:999px;background:#fff;border:1px solid var(--line-strong);color:#56615c;font-size:10px;font-weight:700}\n.filter-tab:hover{background:#f0f3ff;color:#151c27}\n.filter-tab.active{background:#064e3b!important;color:#fff!important;border-color:#064e3b!important}\n\n/* Buttons follow reference hierarchy */\n.btn{border-radius:8px;box-shadow:none;font-weight:700}\n.btn.primary{background:#064e3b!important;color:#fff!important;border:1px solid #064e3b!important;box-shadow:0 1px 2px rgba(0,53,39,.12)!important}\n.btn.primary:hover{background:#003527!important}\n.btn.soft{background:#b0f0d6!important;color:#002117!important;border:1px solid transparent!important}\n.btn.soft:hover{background:#95d3ba!important}\n.btn.subtle{background:#fff!important;color:#151c27!important;border:1px solid var(--line-strong)!important}\n.btn.subtle:hover{background:#f0f3ff!important}\n.btn.text{background:transparent!important;color:#003527!important;border-color:transparent!important}\n.btn.text:hover{background:#f0f3ff!important}\n\n/* Students — card/list structure from reference */\n.student-list{display:grid;gap:9px}\n.student-row{background:#fff;border:1px solid var(--line-strong);border-radius:10px;padding:11px 13px;gap:12px;box-shadow:none;transition:border-color .16s,box-shadow .16s,transform .16s}\n.student-row:hover{border-color:#707974;box-shadow:0 2px 7px rgba(21,28,39,.05)}\n.student-row:last-child{border-bottom:1px solid var(--line-strong)}\n.student-avatar{width:40px;height:40px;border-radius:999px;background:#b0f0d6;color:#002117;font-size:12px;font-weight:700}\n.student-meta strong{font-size:13px;line-height:18px;color:#151c27}\n.student-meta span{font-size:10px;line-height:15px;color:#56615c}\n.student-money strong{font-size:13px;color:#151c27}\n.student-money span{font-size:10px;color:#56615c}\n.student-actions{gap:5px}\n.small-btn{min-height:29px;padding:5px 9px;font-size:10px;border-radius:8px}\n\n/* Class and finance surfaces */\n.class-card{background:#fff;border:1px solid var(--line-strong);border-radius:10px;box-shadow:none}\n.class-card:hover{border-color:#707974;box-shadow:0 2px 7px rgba(21,28,39,.05);transform:none}\n.mini-stat{background:#f0f3ff;border:1px solid #dce2f3}\n.finance-action{background:#fff;border:1px solid var(--line-strong);border-radius:10px;box-shadow:none}\n.finance-action:hover{background:#f9f9ff;border-color:#707974;box-shadow:0 2px 7px rgba(21,28,39,.05);transform:none}\n.finance-action .quick-icon,.quick-icon{background:#b0f0d6!important;color:#003527!important}\n.executive-quick-action{background:#fff;border:1px solid var(--line-strong);border-radius:9px;color:#151c27}\n.executive-quick-action:hover{background:#f9f9ff;border-color:#707974;transform:none}\n.executive-quick-action>.material-symbols-outlined{color:#003527}\n.executive-class-row,.executive-activity-row,.attention-mini-row{border-color:var(--line)}\n.executive-class-row:hover,.executive-activity-row:hover{background:#f9f9ff}\n.health{border-radius:999px}\n\n/* Modals / drawers */\n.modal{border-radius:14px;background:#fff;box-shadow:0 18px 50px rgba(21,28,39,.18)}\n.modal-head{padding:14px 16px;border-color:var(--line)}\n.modal-head h3{font-size:16px;color:#003527}\n.modal-body{padding:15px 16px;gap:12px}\n.drawer-mode{border-radius:14px 0 0 14px}\n.drawer-hero h2{color:#003527;font-size:22px}\n.drawer-stat{background:#f0f3ff;border-color:#dce2f3}\n.note{background:#f0f3ff!important;border-color:#dce2f3!important;color:#404944!important}\n\n/* Rosters and month-end */\n.roster-summary>div,.roster-list,.roster-row{background:#fff;border-color:var(--line)}\n.roster-summary>div{background:#f0f3ff}\n.roster-toggle span{border-color:var(--line-strong);border-radius:8px}\n.month-panel,.month-step{background:#fff!important;border-color:var(--line)!important;box-shadow:none!important}\n\n@media (min-width:781px) and (max-width:1180px){\n  .app-shell{grid-template-columns:190px minmax(0,1fr)}\n  .page{padding-left:16px;padding-right:16px}\n}\n@media(max-width:780px){\n  body{background:#f9f9ff}\n  .mobile-nav{background:rgba(255,255,255,.96);border-color:var(--line)}\n  .student-row{border-radius:10px;padding:10px}\n}\n

/* === Executive Home reference — presentation only === */
@media (min-width:781px){
  .executive-page-head{align-items:flex-end;margin-bottom:18px}
  .executive-page-head h3{font-size:28px;line-height:34px;color:#065f46;font-weight:700;letter-spacing:-.025em}
  .executive-page-head p{font-size:12px;color:#64748b;margin-top:3px}
  .executive-head-actions .btn{background:#fff!important;border:1px solid #dce2f3!important;color:#151c27!important;border-radius:8px;min-height:34px;padding:0 12px}
  .executive-head-actions .material-symbols-outlined{color:#065f46;font-size:17px}
  .executive-metric-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}
  .executive-metric-card{min-height:130px;padding:17px 18px 15px;border:1px solid #dce2f3;border-radius:12px;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.04)}
  .executive-label{font-size:9px;letter-spacing:.12em;color:#64748b;font-weight:700}
  .metric-symbol{width:31px;height:31px;border-radius:8px;background:#ecfdf5;color:#065f46;font-size:17px}
  .executive-number{font-size:30px;line-height:35px;margin-top:15px;color:#0f172a;font-weight:700;letter-spacing:-.035em}
  .executive-number small{font-size:15px;color:#94a3b8;font-weight:500}
  .executive-meta{font-size:9px;color:#94a3b8;margin-top:auto}
  .status-soft{background:#d1fae5;color:#065f46;border:0;border-radius:999px;padding:3px 7px;font-weight:700}
  .executive-critical{background:#0f172a!important;border-color:#1e293b!important;color:#fff!important}
  .executive-critical .executive-label{color:#94a3b8}
  .executive-critical .executive-number{color:#fff}
  .executive-critical .metric-symbol{background:#1e293b;color:#fff}
  .critical-chip{background:rgba(239,68,68,.15);color:#fca5a5;border:0;border-radius:999px}
  .critical-link{color:#34d399;font-size:11px;font-weight:700}

  .executive-bento{grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:14px;align-items:start}
  .executive-main-column,.executive-side-column{display:grid;gap:14px;min-width:0}
  .executive-panel{border:1px solid #dce2f3;border-radius:12px;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.035);overflow:hidden}
  .executive-panel-head{padding:15px 17px;border-bottom:1px solid #e7eefe;background:#fff}
  .executive-panel-head h3{font-size:16px;line-height:21px;color:#151c27;font-weight:700}
  .executive-panel-head p{font-size:9px;color:#64748b}
  .executive-panel-head .btn.text{color:#065f46!important;background:transparent!important;border:0!important}

  .finance-snapshot-strip{background:#f8fafc;border-bottom:1px solid #e7eefe}
  .finance-snapshot-strip>div{padding:11px 15px}
  .finance-snapshot-strip span{font-size:8px;letter-spacing:.11em;color:#64748b;font-weight:700}
  .finance-snapshot-strip strong{font-size:15px;color:#1e293b}
  .executive-class-row{padding:11px 15px;border-bottom:1px solid #f1f5f9;background:#fff}
  .executive-class-row:hover{background:#f8fafc}
  .executive-class-row strong{font-size:11px;color:#1e293b}
  .executive-class-row span{font-size:9px;color:#64748b}
  .health{border-radius:5px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}

  .quick-executive-panel{background:transparent;border:0;box-shadow:none;overflow:visible}
  .quick-executive-panel .executive-panel-head{padding:0 0 9px;border:0;background:transparent}
  .executive-quick-grid{padding:0;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .executive-quick-action{min-height:104px;padding:13px 10px;border:1px solid #dce2f3;border-radius:12px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.02)}
  .executive-quick-action:hover{border-color:#065f46;background:#fff;transform:none;box-shadow:0 3px 8px rgba(15,23,42,.05)}
  .executive-quick-action>.material-symbols-outlined{width:36px;height:36px;display:grid;place-items:center;margin:0 auto 5px;border-radius:8px;background:#f8fafc;color:#475569;font-size:19px}
  .executive-quick-action:hover>.material-symbols-outlined{background:#ecfdf5;color:#065f46}
  .executive-quick-action strong{font-size:11px;color:#1e293b}
  .executive-quick-action small{font-size:8px;color:#64748b}

  .executive-activity-row{min-height:58px;padding:10px 13px;border-bottom:1px solid #f1f5f9;grid-template-columns:30px minmax(0,1fr) auto}
  .activity-symbol{width:30px;height:30px;border-radius:8px;font-size:16px}
  .activity-symbol.in{background:#ecfdf5;color:#059669}
  .activity-symbol.out{background:#fff7ed;color:#ea580c}
  .activity-copy strong{font-size:10px;color:#1e293b}
  .activity-copy span{font-size:8px;color:#64748b}
  .activity-amount{font-size:10px;font-weight:700}

  .attention-executive-panel{overflow:hidden}
  .attention-executive-panel .attention-mini-head{margin:0;padding:12px 14px;background:#f8fafc;border-bottom:1px solid #e7eefe;text-transform:uppercase;letter-spacing:.1em;color:#64748b}
  .attention-executive-panel .attention-mini-head strong{background:#e2e8f0;color:#475569;border-radius:5px;padding:2px 5px}
  .attention-executive-list{display:grid}
  .attention-executive-panel .attention-mini-row{padding:11px 13px;border-bottom:1px solid #f1f5f9;background:#fff}
  .attention-executive-panel .attention-mini-row:last-child{border-bottom:0}
  .attention-executive-panel .attention-mini-row strong{font-size:10px;color:#1e293b}
  .attention-executive-panel .attention-mini-row span{font-size:8px;color:#64748b}
  .attention-executive-panel .btn.text{color:#065f46!important;background:transparent!important;border:0!important;padding:0;font-size:9px}
}
@media (min-width:781px) and (max-width:1050px){
  .executive-bento{grid-template-columns:1fr}
  .executive-side-column{grid-template-columns:1fr 1fr}
}
@media(max-width:780px){
  .executive-side-column{display:grid;gap:12px}
  .quick-executive-panel{background:transparent;border:0;box-shadow:none}
  .quick-executive-panel .executive-panel-head{padding-left:0;padding-right:0;border:0;background:transparent}
}


/* === Ledger Home redesign — presentation only === */
.ledger-home{--lnavy:#142a45;--lforest:#1f6e52;--lgold:#a9761f;--lrust:#b3492f;--paper:#f6f1e7;max-width:1180px;margin:0 auto;padding:8px 28px 60px;background:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,rgba(20,42,69,.045) 32px),var(--paper);min-height:calc(100vh - 62px);color:#1b2430;font-family:var(--font-body,Arial,sans-serif)}
.ledger-masthead{padding:28px 0 20px;border-bottom:2px solid var(--lnavy)}
.ledger-wordmark,.ledger-section-head>span,.ledger-summary span,.ledger-summary small{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ledger-wordmark{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#7c8496;margin-bottom:12px}.ledger-mast-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.ledger-mast-row h3{margin:0;font-family:Georgia,serif;font-style:italic;font-weight:500;font-size:48px;line-height:.95;color:var(--lnavy)}.ledger-mast-row p{margin:7px 0 0;color:#7c8496;font-size:11px}.ledger-period{border:1.5px solid var(--lnavy);border-radius:3px;padding:8px 13px;text-align:center;transform:rotate(-1deg);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.ledger-period span{display:block;font-size:9px;letter-spacing:.1em;color:var(--lnavy)}.ledger-period strong{display:block;font-size:9px;letter-spacing:.1em;color:var(--lforest);margin-top:3px}
.ledger-summary{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(20,42,69,.18)}.ledger-summary>div{padding:18px 24px;border-left:1px solid rgba(20,42,69,.18)}.ledger-summary>div:first-child{border-left:0;padding-left:0}.ledger-summary span{display:block;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7c8496;margin-bottom:7px}.ledger-summary strong{display:block;font-family:Georgia,serif;font-size:32px;color:var(--lnavy);font-variant-numeric:tabular-nums}.ledger-summary small{display:block;margin-top:4px;font-size:10px;color:#7c8496}.ledger-credit{color:var(--lforest)!important}.ledger-debit{color:var(--lrust)!important}
.ledger-spread{display:grid;grid-template-columns:1.55fr 1fr;position:relative}.ledger-left{padding:27px 28px 10px 0}.ledger-right{padding:27px 0 10px 28px;position:relative}.ledger-right:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1.5px;background:rgba(179,73,47,.3)}.ledger-section+.ledger-section{margin-top:38px}.ledger-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:15px}.ledger-section-head h4{margin:0;font-family:Georgia,serif;font-size:19px;font-weight:600;color:var(--lnavy)}.ledger-section-head>span{font-size:9px;letter-spacing:.06em;color:#7c8496;text-transform:uppercase;text-align:right}.ledger-rule{height:2px;background:var(--lnavy);margin:8px 0 0}.ledger-table-head,.ledger-class-row{display:grid;grid-template-columns:2.1fr .75fr 1.35fr .85fr 1fr;gap:9px;align-items:center}.ledger-table-head{padding:0 0 7px;border-bottom:1.5px solid var(--lnavy);margin-top:13px}.ledger-table-head span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#7c8496}.ledger-class-row{width:100%;padding:12px 0;border:0;border-bottom:1px solid rgba(20,42,69,.12);background:transparent;text-align:left;color:inherit;cursor:pointer}.ledger-class-row:hover{background:rgba(20,42,69,.025)}.ledger-class-row strong{display:block;font-size:13px;color:var(--lnavy)}.ledger-class-row small{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;color:var(--lforest);margin-top:2px}.ledger-class-row>span{font-size:11px;color:#4b5567}.ledger-class-row em{display:inline-block;border:1px solid;border-radius:3px;padding:3px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8px;font-style:normal;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transform:rotate(-2deg)}.ledger-net{text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700}.ledger-net i{display:block;width:58px;height:3px;margin:5px 0 0 auto;background:rgba(20,42,69,.12);position:relative}.ledger-net i:after{content:"";position:absolute;left:20%;top:-2px;width:1px;height:7px;background:#b7bec9}.ledger-net i b{display:block;height:3px;opacity:.45;border-radius:2px}.ledger-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.ledger-action{min-height:74px;padding:10px;border:1px solid rgba(20,42,69,.2);border-radius:4px;background:transparent;text-align:left;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px}.ledger-action:hover{background:rgba(20,42,69,.04);border-color:var(--lnavy)}.ledger-action .material-symbols-outlined{font-size:17px;color:var(--lnavy)}.ledger-action strong{font-size:11px;color:var(--lnavy)}.ledger-action small{font-size:9px;color:#7c8496}
.ledger-entry{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(20,42,69,.12)}.ledger-entry>b{width:26px;height:26px;border:1px solid;display:grid;place-items:center;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px}.ledger-entry strong{display:block;font-size:11.5px;color:var(--lnavy)}.ledger-entry small{display:block;font-size:9.5px;color:#7c8496;margin-top:2px}.ledger-entry>span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:700;white-space:nowrap}.ledger-flag{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:9px;align-items:start;padding:11px 0;border-bottom:1px solid rgba(20,42,69,.12)}.ledger-flag>.material-symbols-outlined{font-size:14px;color:var(--lrust);margin-top:1px}.ledger-flag strong{display:block;font-size:11.5px;color:var(--lnavy)}.ledger-flag small{display:block;font-size:9.5px;color:#7c8496;margin-top:2px}.ledger-link{border:0;background:none;padding:3px 0;color:var(--lnavy);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;font-weight:700;white-space:nowrap;cursor:pointer}.ledger-link:hover{text-decoration:underline}.ledger-home .empty{padding:18px 0;color:#7c8496;font-size:11px}
@media(max-width:1020px){.ledger-home{padding-left:20px;padding-right:20px}.ledger-spread{grid-template-columns:1fr}.ledger-right{padding-left:0}.ledger-right:before{display:none}.ledger-left{padding-right:0}.ledger-section+.ledger-section{margin-top:30px}}
@media(max-width:700px){.ledger-home{padding:4px 14px 40px}.ledger-masthead{padding:20px 0 16px}.ledger-mast-row{align-items:flex-start}.ledger-mast-row h3{font-size:38px}.ledger-period{padding:7px 9px}.ledger-summary{grid-template-columns:1fr}.ledger-summary>div,.ledger-summary>div:first-child{padding:13px 0;border-left:0;border-top:1px solid rgba(20,42,69,.14)}.ledger-summary>div:first-child{border-top:0}.ledger-summary strong{font-size:27px}.ledger-spread{display:block}.ledger-left,.ledger-right{padding-top:22px}.ledger-table-head,.ledger-class-row{grid-template-columns:1.8fr .6fr .95fr .75fr;gap:6px}.ledger-table-head span:nth-child(3),.ledger-class-row>span:nth-child(3){display:none}.ledger-net{grid-column:4}.ledger-actions{grid-template-columns:1fr 1fr}.ledger-section-head{align-items:flex-start;flex-direction:column;gap:4px}.ledger-section-head>span{text-align:left}.ledger-flag{grid-template-columns:16px minmax(0,1fr)}.ledger-link{grid-column:2;text-align:left}.ledger-mast-row p{font-size:10px}}
\n\n/* === EDTECH-inspired ClassFlow visual layer — DESIGN ONLY === */\n:root{\n  --portal-blue:#0b49c7;\n  --portal-blue-dark:#073b9f;\n  --portal-blue-soft:#eef5ff;\n  --portal-cyan:#e9f8ff;\n  --portal-bg:#f4f8fc;\n  --portal-line:#dfe8f2;\n  --portal-ink:#16243a;\n  --portal-muted:#68788f;\n  --portal-green:#16a35b;\n  --portal-orange:#f39a21;\n  --portal-purple:#7455d8;\n}\nbody{background:var(--portal-bg);color:var(--portal-ink)}\n.app-shell{grid-template-columns:220px minmax(0,1fr);background:var(--portal-bg)}\n.sidebar{background:#fff;border-right:1px solid var(--portal-line);padding:18px 12px 14px;box-shadow:2px 0 10px rgba(24,59,104,.035)}\n.brand{padding:4px 10px 20px}.brand strong{color:var(--portal-blue-dark);font-size:16px;letter-spacing:-.025em}.brand span{color:var(--portal-muted)}\n.brand-mark{background:linear-gradient(135deg,var(--portal-blue),#1d75e8);border-radius:10px;box-shadow:0 7px 18px rgba(11,73,199,.16)}\n.nav{gap:3px}.nav button{border-radius:9px;padding:9px 11px;color:#596a81;font-size:13px}.nav button:hover{background:#f3f7fc;color:var(--portal-blue)}.nav button.active{background:var(--portal-blue);color:#fff;box-shadow:0 5px 12px rgba(11,73,199,.16)}.nav button.active:before{display:none}.nav-icon{font-size:16px}\n.sidebar-cta{margin:14px 4px 10px;border:0;border-radius:9px;background:#eaf3ff;color:var(--portal-blue);padding:10px 11px;display:flex;align-items:center;gap:8px;font-weight:800;font-size:12px}.sidebar-cta:hover{background:#dfeeff}\n.sidebar-utility{border-top:1px solid var(--portal-line)}.utility-btn{font-size:12px}.profile-mini .avatar{background:#e9f2ff;color:var(--portal-blue);border:1px solid #d7e6fb}\n.main{background:var(--portal-bg)}\n.topbar{height:68px;min-height:68px;background:rgba(244,248,252,.94);border-bottom:1px solid var(--portal-line);padding:0 26px}.topbar h2{font-size:20px!important;color:var(--portal-ink);letter-spacing:-.03em}.topbar p{color:var(--portal-muted);font-size:11px}.month-pill{border-color:var(--portal-line);border-radius:9px;background:#fff;color:#56677e}.attendance-btn{background:#eaf3ff!important;color:var(--portal-blue)!important}\n.page{max-width:1420px;padding:22px 26px 44px}.hero-heading{margin-bottom:15px}.hero-heading h3{font-size:25px;line-height:30px;color:var(--portal-ink)}.hero-heading p{font-size:12px;color:var(--portal-muted)}\n.metric-grid{gap:11px;margin-bottom:16px}.metric-card{min-height:98px;padding:15px 17px;border-radius:13px;border:1px solid var(--portal-line);box-shadow:0 3px 10px rgba(27,62,107,.035)}.metric-card:hover{border-color:#c9dbef;box-shadow:0 7px 16px rgba(27,62,107,.06)}.metric-card .metric-value{font-size:26px;margin-top:9px}.metric-card .metric-sub{font-size:10px;color:var(--portal-muted)}\n.section{margin-top:16px;padding:16px 18px;border-radius:14px;border:1px solid var(--portal-line);box-shadow:0 3px 10px rgba(27,62,107,.03)}.section-head{margin-bottom:11px}.section-head h3{font-size:16px;color:var(--portal-ink)}.section-head p{font-size:11px}\n.quick-grid{gap:9px}.quick-action{min-height:92px;padding:12px;border-radius:11px;border-color:var(--portal-line);box-shadow:0 2px 8px rgba(27,62,107,.025)}.quick-action:hover{border-color:#c7daf2;box-shadow:0 7px 14px rgba(27,62,107,.07);transform:translateY(-1px)}.quick-icon{width:32px;height:32px;border-radius:9px;background:#e8f2ff;color:var(--portal-blue)}.quick-action strong{font-size:12px}.quick-action span{font-size:10px}\n.class-grid{gap:10px}.class-card{padding:14px;border-radius:14px;border-color:var(--portal-line);box-shadow:0 2px 9px rgba(27,62,107,.03);gap:12px}.class-card:hover{border-color:#c7daf2;box-shadow:0 7px 15px rgba(27,62,107,.07);transform:translateY(-1px)}.class-card h4{font-size:15px}.class-students{font-size:24px}.mini-stat{background:#f4f8fd;border-radius:9px;padding:8px}.mini-stat span{font-size:9px}.mini-stat strong{font-size:12px}\n.health{padding:4px 7px;font-size:10px}\n.search-row{gap:8px}.search{max-width:380px}.filter-tab{padding:6px 9px;font-size:10px}.filter-tab.active{background:var(--portal-blue);border-color:var(--portal-blue)}\n.student-row{padding:11px 2px}.student-avatar{width:34px;height:34px;border-radius:9px;background:#eaf3ff;color:var(--portal-blue)}.student-meta strong{font-size:13px}.student-meta span{font-size:10px}.student-money strong{font-size:13px}\n.finance-actions{gap:9px}.finance-action{border-radius:11px;padding:11px;border-color:var(--portal-line)}.finance-action .quick-icon{width:30px;height:30px}\n.table-wrap{border-color:var(--portal-line);border-radius:11px}th{background:#f3f7fc}th,td{padding:10px 11px}\n.modal{border-radius:16px}.modal-head{padding:16px 18px}.modal-head h3{font-size:17px}.modal-body{padding:17px 18px}.modal-actions{padding:12px 18px}\n/* Home: use the supplied education-portal composition without changing its data or controls. */\n.ledger-home{max-width:100%;font-family:Inter,ui-sans-serif,system-ui,sans-serif}\n.ledger-masthead{background:linear-gradient(135deg,#073b9f 0%,#0b49c7 55%,#1567d9 100%);color:#fff;border-radius:15px;padding:17px 20px;margin-bottom:13px;box-shadow:0 8px 20px rgba(11,73,199,.14);position:relative;overflow:hidden}\n.ledger-masthead:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-80px;top:-150px;background:rgba(255,255,255,.1)}\n.ledger-wordmark{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.86;margin-bottom:7px}.ledger-mast-row{display:flex;justify-content:space-between;align-items:end;gap:16px;position:relative;z-index:1}.ledger-mast-row h3{margin:0;font-size:24px;letter-spacing:-.04em}.ledger-mast-row p{margin:2px 0 0;font-size:11px;opacity:.82}.ledger-period{display:grid;text-align:right;gap:3px}.ledger-period span{font-size:9px;opacity:.75;font-weight:800}.ledger-period strong{font-size:10px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);padding:5px 8px;border-radius:999px}\n.ledger-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.ledger-summary>div{background:#fff;border:1px solid var(--portal-line);border-radius:12px;padding:12px 14px;box-shadow:0 2px 8px rgba(27,62,107,.025)}.ledger-summary span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:var(--portal-muted);font-weight:800}.ledger-summary strong{display:block;font-size:23px;line-height:25px;margin-top:6px;letter-spacing:-.04em}.ledger-summary small{display:block;color:var(--portal-muted);font-size:9px;margin-top:3px}.ledger-credit{color:var(--portal-green)}.ledger-debit{color:var(--portal-orange)}\n.ledger-spread{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.8fr);gap:12px}.ledger-left,.ledger-right{display:grid;gap:12px;align-content:start}.ledger-section{background:#fff;border:1px solid var(--portal-line);border-radius:13px;padding:14px 16px;box-shadow:0 2px 8px rgba(27,62,107,.025)}.ledger-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.ledger-section-head h4{margin:0;font-size:14px;color:var(--portal-ink);letter-spacing:-.02em}.ledger-section-head span{font-size:9px;color:var(--portal-muted)}.ledger-rule{height:1px;background:var(--portal-line);margin:9px 0}.ledger-table-head,.ledger-class-row{display:grid;grid-template-columns:1.35fr .55fr 1fr .75fr .8fr;gap:10px;align-items:center}.ledger-table-head{padding:0 8px 6px;color:var(--portal-muted);font-size:8px;text-transform:uppercase;letter-spacing:.06em;font-weight:800}.ledger-class-row{width:100%;border:0;border-bottom:1px solid #edf2f7;background:#fff;padding:10px 8px;text-align:left;color:var(--portal-ink)}.ledger-class-row:last-child{border-bottom:0}.ledger-class-row:hover{background:#f7faff}.ledger-class-row strong{display:block;font-size:11px}.ledger-class-row small{display:block;color:var(--portal-muted);font-size:9px;margin-top:1px}.ledger-class-row>span{font-size:10px}.ledger-class-row em{font-style:normal;font-size:8px;font-weight:800;border:1px solid currentColor;border-radius:999px;padding:3px 6px}.ledger-net{font-weight:800}.ledger-net i{display:block;height:3px;background:#e7eef5;border-radius:99px;margin-top:4px;overflow:hidden}.ledger-net b{display:block;height:100%;border-radius:99px}\n.ledger-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ledger-action{border:1px solid var(--portal-line);background:#fff;border-radius:10px;padding:10px;text-align:left;display:grid;grid-template-columns:28px 1fr;column-gap:8px;align-items:center}.ledger-action:hover{border-color:#c6d9ef;background:#f8fbff}.ledger-action .material-symbols-outlined{grid-row:span 2;width:28px;height:28px;border-radius:8px;background:#eaf3ff;color:var(--portal-blue);display:grid;place-items:center;font-size:17px}.ledger-action strong{font-size:10px}.ledger-action small{font-size:8px;color:var(--portal-muted)}\n.ledger-entry{display:grid;grid-template-columns:25px 1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #edf2f7}.ledger-entry:last-child{border-bottom:0}.ledger-entry>b{width:24px;height:24px;border:1px solid;border-radius:7px;display:grid;place-items:center;font-size:7px}.ledger-entry strong{display:block;font-size:10px}.ledger-entry small{display:block;color:var(--portal-muted);font-size:8px;margin-top:1px}.ledger-entry>span{font-size:10px;font-weight:800}.ledger-flag{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid #edf2f7}.ledger-flag:last-child{border-bottom:0}.ledger-flag>.material-symbols-outlined{width:24px;height:24px;border-radius:7px;background:#fff3df;color:var(--portal-orange);display:grid;place-items:center;font-size:15px}.ledger-flag strong{display:block;font-size:10px}.ledger-flag small{display:block;color:var(--portal-muted);font-size:8px;margin-top:1px}.ledger-link{border:0;background:transparent;color:var(--portal-blue);font-size:8px;font-weight:800;padding:3px}\n@media(max-width:1050px){.ledger-spread{grid-template-columns:1fr}.ledger-right{grid-template-columns:1fr 1fr}.ledger-actions{grid-template-columns:repeat(3,1fr)}}\n@media(max-width:780px){.app-shell{display:block}.topbar{min-height:68px;height:auto;padding:11px 15px}.page{padding:15px 12px 30px}.sidebar{display:none}.ledger-summary{grid-template-columns:1fr 1fr}.ledger-summary>div:last-child{grid-column:1/-1}.ledger-mast-row{align-items:start}.ledger-period{display:none}.ledger-spread{grid-template-columns:1fr}.ledger-right{grid-template-columns:1fr}.ledger-table-head{display:none}.ledger-class-row{grid-template-columns:1.5fr .5fr .75fr;grid-template-areas:'class students net' 'class teacher status';padding:10px 4px}.ledger-class-row>div{grid-area:class}.ledger-class-row>span:nth-child(2){grid-area:students}.ledger-class-row>span:nth-child(3){grid-area:teacher;font-size:8px;color:var(--portal-muted)}.ledger-class-row>span:nth-child(4){grid-area:status}.ledger-class-row>span:nth-child(5){grid-area:net}.ledger-actions{grid-template-columns:1fr 1fr}.ledger-summary strong{font-size:20px}}\n

/* Home reference design: visual-only layer. Existing actions/data bindings are unchanged. */
.home-ref{--ref-primary:#003527;--ref-primary-container:#064e3b;--ref-bg:#f9f9ff;--ref-surface:#fff;--ref-low:#f0f3ff;--ref-high:#e2e8f8;--ref-border:#bfc9c3;--ref-muted:#404944;--ref-green:#1f6e52;--ref-red:#b3492f;--ref-amber:#a9761f;background:var(--ref-bg);color:#151c27;font-family:Inter,system-ui,sans-serif;padding:28px 32px 40px;min-height:100%;box-sizing:border-box}
.home-ref-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}
.home-ref-head h2{margin:0;color:var(--ref-primary);font-size:24px;line-height:32px;font-weight:700;letter-spacing:-.01em}
.home-ref-head p{margin:3px 0 0;color:var(--ref-muted);font-size:12px;line-height:16px}
.home-ref-period{display:flex;align-items:center;gap:12px;padding:8px 14px;border:1px solid var(--ref-border);border-radius:999px;background:var(--ref-surface);color:var(--ref-muted);font-size:12px}
.home-ref-period strong{color:var(--ref-primary-container);font-size:10px;letter-spacing:.06em}
.home-ref-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}
.home-ref-stat{background:var(--ref-surface);border:1px solid var(--ref-border);border-radius:12px;padding:16px 18px;min-height:92px;display:flex;flex-direction:column;justify-content:center}
.home-ref-stat span{font-size:11px;color:var(--ref-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.home-ref-stat strong{font-size:24px;line-height:30px;margin:4px 0 2px;color:#151c27}
.home-ref-stat small{font-size:11px;color:#707974}
.home-ref-positive{color:var(--ref-green)!important}.home-ref-negative{color:var(--ref-red)!important}
.home-ref-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);gap:20px;align-items:start}
.home-ref-layout main,.home-ref-side{display:flex;flex-direction:column;gap:20px}
.home-ref-panel{background:var(--ref-surface);border:1px solid var(--ref-border);border-radius:12px;padding:18px}
.home-ref-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.home-ref-panel-head h3{margin:0;color:var(--ref-primary);font-size:17px;line-height:23px;font-weight:700}
.home-ref-panel-head p{margin:3px 0 0;color:var(--ref-muted);font-size:11px;line-height:16px}
.home-ref-link{border:0;background:transparent;color:var(--ref-primary-container);font-size:11px;font-weight:600;cursor:pointer;padding:4px 0;white-space:nowrap}
.home-ref-rule{height:1px;background:#e3e8e5;margin:14px 0}
.home-ref-class-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.home-ref-class-card{appearance:none;text-align:left;width:100%;border:1px solid #dce2ea;border-radius:10px;background:#fff;padding:14px;cursor:pointer;color:inherit;transition:box-shadow .15s,border-color .15s,transform .15s}
.home-ref-class-card:hover{border-color:#9aa9a2;box-shadow:0 5px 16px rgba(21,28,39,.07);transform:translateY(-1px)}
.home-ref-class-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.home-ref-class-top h4{margin:0;color:var(--ref-primary);font-size:14px;line-height:19px;font-weight:700}
.home-ref-class-top small{display:block;color:#707974;font-size:10px;line-height:15px;margin-top:2px}
.home-ref-class-top em{font-style:normal;font-size:9px;font-weight:700;border:1px solid;padding:3px 7px;border-radius:999px;white-space:nowrap}
.home-ref-good{color:var(--ref-green)!important;border-color:rgba(31,110,82,.35)!important;background:rgba(31,110,82,.07)}
.home-ref-watch{color:var(--ref-amber)!important;border-color:rgba(169,118,31,.35)!important;background:rgba(169,118,31,.08)}
.home-ref-risk{color:var(--ref-red)!important;border-color:rgba(179,73,47,.35)!important;background:rgba(179,73,47,.07)}
.home-ref-student-count{display:flex;align-items:baseline;gap:6px;margin:14px 0 12px}.home-ref-student-count strong{font-size:24px;line-height:28px}.home-ref-student-count span{font-size:10px;color:#707974}
.home-ref-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.home-ref-mini-grid>div{background:var(--ref-bg);border:1px solid #e1e5ee;border-radius:8px;padding:8px 9px;min-width:0}
.home-ref-mini-grid span{display:block;font-size:9px;line-height:13px;color:#707974;text-transform:uppercase;letter-spacing:.04em}.home-ref-mini-grid strong{display:block;font-size:13px;line-height:18px;margin-top:2px}
.home-ref-class-footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #e6ebe8;margin-top:12px;padding-top:10px;color:#707974;font-size:10px}.home-ref-class-footer span:last-child{color:var(--ref-primary-container);font-weight:600}
.home-ref-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.home-ref-action{appearance:none;border:1px solid #dce2ea;background:var(--ref-bg);border-radius:10px;padding:13px;text-align:left;cursor:pointer;display:grid;grid-template-columns:30px 1fr;column-gap:9px;align-items:center;transition:background .15s,border-color .15s,box-shadow .15s}
.home-ref-action:hover{background:#fff;border-color:#9aa9a2;box-shadow:0 4px 12px rgba(21,28,39,.05)}
.home-ref-action .material-symbols-outlined{grid-row:span 2;width:30px;height:30px;border-radius:8px;background:#e8f5ef;color:var(--ref-primary-container);display:flex;align-items:center;justify-content:center;font-size:17px}
.home-ref-action strong{font-size:12px;color:#151c27;line-height:16px}.home-ref-action small{font-size:9px;color:#707974;line-height:13px}
.home-ref-entry{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #e8ecea}.home-ref-entry:last-child{border-bottom:0}.home-ref-entry>b{width:28px;height:28px;border:1px solid;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:9px}.home-ref-entry strong,.home-ref-flag strong{display:block;font-size:11px;line-height:15px}.home-ref-entry small,.home-ref-flag small{display:block;font-size:9px;color:#707974;line-height:13px;margin-top:2px}.home-ref-entry>span{font-size:12px;font-weight:700;white-space:nowrap}
.home-ref-flag{display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;padding:11px 0;border-bottom:1px solid #e8ecea}.home-ref-flag:last-child{border-bottom:0}.home-ref-flag>.material-symbols-outlined{width:28px;height:28px;border-radius:8px;background:#fff3ef;color:var(--ref-red);display:flex;align-items:center;justify-content:center;font-size:16px}.home-ref-attention .home-ref-link{font-size:9px}
@media(max-width:1100px){.home-ref-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.home-ref-layout{grid-template-columns:1fr}.home-ref-side{display:grid;grid-template-columns:1fr 1fr}.home-ref-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.home-ref{padding:18px 14px 28px}.home-ref-head{align-items:flex-start}.home-ref-period{padding:7px 10px}.home-ref-summary,.home-ref-class-grid,.home-ref-actions,.home-ref-side{grid-template-columns:1fr}.home-ref-stat{min-height:78px}.home-ref-panel{padding:14px}.home-ref-panel-head{flex-direction:column;gap:6px}.home-ref-action{grid-template-columns:32px 1fr}.home-ref-class-footer{flex-direction:column;gap:3px}}


/* Reports — operational reporting UI */
.reports-page{max-width:1180px;margin:0 auto;padding:8px 24px 48px}.reports-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}.reports-head h2{margin:0;font-size:24px;color:#17324d}.reports-head p{margin:5px 0 0;color:#6b7c8f;font-size:13px}.reports-tabs{display:flex;gap:6px;flex-wrap:wrap}.reports-tabs button{border:1px solid #dbe5ed;background:#fff;color:#52677a;border-radius:999px;padding:8px 12px;font:600 12px inherit;cursor:pointer}.reports-tabs button.active{background:#0d766e;color:#fff;border-color:#0d766e}.report-card{background:#fff;border:1px solid #dfe7ef;border-radius:14px;box-shadow:0 4px 18px rgba(23,50,77,.05);overflow:hidden}.report-card-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border-bottom:1px solid #e6edf2}.report-card-head h3{margin:0;font-size:16px;color:#17324d}.report-card-head span{display:block;margin-top:4px;color:#718396;font-size:12px}.report-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.report-tools select,.report-date input{height:36px;border:1px solid #d6e1e9;border-radius:9px;background:#fff;padding:0 10px;color:#17324d;font-size:12px}.report-date{display:flex;align-items:center;gap:6px;color:#718396;font-size:11px;font-weight:600}.report-table-wrap{overflow:auto}.report-table{width:100%;border-collapse:collapse;min-width:760px}.report-table th{padding:10px 14px;text-align:left;background:#f7fafc;color:#718396;font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;border-bottom:1px solid #e3ebf1}.report-table td{padding:12px 14px;border-bottom:1px solid #edf1f4;color:#41566a;font-size:12px;vertical-align:middle}.report-table tr:last-child td{border-bottom:0}.report-table td strong{color:#17324d}.report-table td small{display:block;color:#8292a1;margin-top:2px}.amount-out{color:#b3492f!important}.report-agent-summary{display:flex;align-items:baseline;gap:8px;padding:14px 20px;background:#f5faf9;border-bottom:1px solid #e3efec}.report-agent-summary strong{font-size:24px;color:#0d766e}.report-agent-summary span{font-size:12px;color:#64798a}.report-period-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px 20px;border-bottom:1px solid #e6edf2}.report-period-grid>div{padding:12px;border:1px solid #e3ebf1;border-radius:10px;background:#fbfcfd}.report-period-grid span{display:block;color:#718396;font-size:11px}.report-period-grid strong{display:block;color:#17324d;font-size:20px;margin-top:4px}.report-period-grid small{display:block;color:#8998a6;font-size:10px;margin-top:3px}.report-columns{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:20px}.report-columns h4{margin:0 0 10px;font-size:13px;color:#17324d}.report-mini-list{border:1px solid #e3ebf1;border-radius:10px;overflow:hidden}.report-mini-list>div{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #edf1f4;font-size:12px;color:#52677a}.report-mini-list>div:last-child{border-bottom:0}.report-mini-list strong{color:#17324d}.reports-page .btn{font-size:12px}
@media(max-width:820px){.reports-head{align-items:flex-start;flex-direction:column}.report-card-head{align-items:flex-start;flex-direction:column}.report-tools{justify-content:flex-start}.report-period-grid{grid-template-columns:repeat(2,1fr)}.report-columns{grid-template-columns:1fr}.reports-page{padding:4px 12px 32px}}

/* Home-only sky-blue visual theme — no workflow or logic changes */
.home-ref{--home-sky:#0ea5e9;--home-sky-dark:#0284c7;--home-sky-soft:#e0f2fe;--home-sky-pale:#f0f9ff}
.home-ref-head,.home-ref-panel{border-color:#dbeafe}
.home-ref-period{background:var(--home-sky-pale);border-color:#bae6fd;color:#0369a1}
.home-ref-period strong{color:var(--home-sky-dark)}
.home-ref-stat{border-color:#dbeafe;background:#fff}
.home-ref-stat strong,.home-ref-positive{color:var(--home-sky-dark)}
.home-ref-link{color:var(--home-sky-dark)}
.home-ref-link:hover{color:#0369a1}
.home-ref-class-card:hover{border-color:#7dd3fc;box-shadow:0 8px 24px rgba(14,165,233,.10)}
.home-ref-action{border-color:#dbeafe;background:#fff}
.home-ref-action:hover{border-color:#7dd3fc;background:var(--home-sky-pale);color:#0369a1}
.home-ref-action .material-symbols-outlined{color:var(--home-sky-dark)}
.home-ref-good{color:#0284c7!important}
.home-ref-watch{background:#f0f9ff!important;color:#0369a1!important;border-color:#bae6fd!important}
.home-ref-risk{color:#b45309!important}
.home-ref-attention{border-color:#dbeafe}
.home-ref-flag .material-symbols-outlined{color:var(--home-sky-dark)}
.home-ref-rule{border-color:#e0f2fe}
.home-ref-panel-head h3{color:#17324d}


/* Home right rail: professionally separated Attention Queue and Quick Actions */
.home-ref-side { display: flex; flex-direction: column; gap: 20px; align-self: start; }
.home-ref-side-section { margin: 0 !important; }
.home-ref-quick-panel { border-top: 3px solid #38bdf8; box-shadow: 0 8px 24px rgba(15, 23, 42, .06); }
.home-ref-attention { border-top: 3px solid #f59e0b; box-shadow: 0 8px 24px rgba(15, 23, 42, .06); }
.home-ref-side .home-ref-actions { grid-template-columns: 1fr; gap: 10px; }
.home-ref-side .home-ref-action { min-height: 74px; text-align: left; }
@media (max-width: 980px) { .home-ref-side .home-ref-actions { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .home-ref-side .home-ref-actions { grid-template-columns: 1fr; } }


/* Sidebar active-state fix — keep selected item visible */
.sidebar .nav button.active,
.sidebar .nav button.active:hover,
.sidebar .nav button.active:focus,
#sideNav button.active,
#sideNav button.active:hover,
#sideNav button.active:focus {
  background: #eaf3ff !important;
  color: #0b49c7 !important;
  border-color: #cfe0ff !important;
  box-shadow: none !important;
}
.sidebar .nav button.active .nav-icon,
.sidebar .nav button.active .material-symbols-outlined,
#sideNav button.active .nav-icon,
#sideNav button.active .material-symbols-outlined {
  color: #0b49c7 !important;
}
.sidebar .nav button.active::before,
#sideNav button.active::before {
  display: none !important;
}


/* === Professional list alignment: Students + People === */
@media (min-width: 901px){
  .student-list{gap:0!important;}
  .student-list > .student-row{
    display:grid!important;
    grid-template-columns:minmax(320px,1.7fr) minmax(150px,.72fr) minmax(300px,1fr)!important;
    align-items:center!important;
    column-gap:28px!important;
    min-height:76px!important;
    padding:13px 18px!important;
    margin:0!important;
    border:0!important;
    border-bottom:1px solid var(--line-strong)!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .student-list > .student-row:first-child{border-top:0!important;}
  .student-list > .student-row:last-child{border-bottom:0!important;}
  .student-list > .student-row .student-left{width:auto!important;min-width:0!important;}
  .student-list > .student-row .student-money{
    width:auto!important;
    min-width:0!important;
    text-align:center!important;
    justify-self:stretch!important;
  }
  .student-list > .student-row .student-money strong,
  .student-list > .student-row .student-money span{display:block!important;text-align:center!important;}
  .student-list > .student-row .student-actions{
    width:auto!important;
    min-width:0!important;
    justify-self:end!important;
    justify-content:flex-end!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
  }
  .student-list > .student-row .student-actions .small-btn{white-space:nowrap!important;}
}
@media (min-width: 901px) and (max-width: 1180px){
  .student-list > .student-row{grid-template-columns:minmax(260px,1.35fr) minmax(125px,.65fr) minmax(250px,1fr)!important;column-gap:16px!important;padding-left:14px!important;padding-right:14px!important;}
  .student-list > .student-row .student-actions{gap:5px!important;}
  .student-list > .student-row .small-btn{padding-left:7px!important;padding-right:7px!important;}
}


/* === Excel-style people tables === */
@media (min-width:901px){
  .people-table-section{overflow-x:auto!important;padding:0!important;}
  .people-table-head{display:grid;grid-template-columns:minmax(230px,1.05fr) minmax(260px,1.25fr) minmax(150px,.7fr) minmax(300px,1fr);align-items:center;gap:0;min-width:980px;background:#f5f8fb;border-bottom:1px solid #dce4ea;color:#5f6f7c;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
  .people-table-head>span{padding:10px 14px;border-right:1px solid #e2e8ee;}
  .people-table-head>span:last-child{border-right:0;text-align:right;}
  .excel-list{display:block!important;min-width:980px;}
  .excel-list>.student-row{display:grid!important;grid-template-columns:minmax(230px,1.05fr) minmax(260px,1.25fr) minmax(150px,.7fr) minmax(300px,1fr)!important;gap:0!important;min-height:62px!important;padding:0!important;border-bottom:1px solid #e2e8ee!important;}
  .excel-list>.student-row>.student-left{display:contents!important;}
  .excel-list>.student-row>.student-left>.student-avatar{display:none!important;}
  .excel-list>.student-row>.student-left>.student-meta{display:contents!important;}
  .excel-list>.student-row>.student-left>.student-meta>strong{grid-column:1;align-self:stretch;display:flex;align-items:center;padding:10px 14px;border-right:1px solid #edf1f4;font-size:13px!important;}
  .excel-list>.student-row>.student-left>.student-meta>span{grid-column:2;align-self:center;padding:2px 14px;border-right:1px solid #edf1f4;font-size:11px!important;}
  .students-excel>.student-row>.student-left>.student-meta>span+span{margin-top:22px;}
  .excel-list>.student-row>.student-money{grid-column:3;grid-row:1 / span 2;align-self:stretch!important;display:flex!important;flex-direction:column;justify-content:center;padding:10px 14px;border-right:1px solid #edf1f4;text-align:left!important;}
  .excel-list>.student-row>.student-money strong,.excel-list>.student-row>.student-money span{text-align:left!important;}
  .excel-list>.student-row>.student-actions{grid-column:4;grid-row:1 / span 2;align-self:stretch!important;display:flex!important;justify-content:flex-end!important;align-items:center!important;padding:8px 14px!important;}
  .staff-table-head{margin-top:10px;}
  .staff-excel>.student-row>.student-left>.student-meta>span{display:flex;align-items:center;align-self:stretch;}
  .staff-excel>.student-row>.student-money{grid-row:1;}
  .staff-excel>.student-row>.student-actions{grid-row:1;}
  .excel-list>.student-row:hover{background:#f9fbfd!important;}
}


/* === Month-end: three management answers === */
.month-answer-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:14px;margin-top:16px}.month-answer-card{background:#fff;color:#172126;border:1px solid #dbe5eb;border-radius:16px;padding:18px;box-shadow:0 8px 22px rgba(15,23,42,.05)}.month-answer-kicker{display:block;color:#64748b;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.055em;margin-bottom:10px}.month-answer-value{font-size:34px;line-height:1.05;font-weight:850;letter-spacing:-.045em;color:#0f172a}.month-answer-card>p{font-size:11px;color:#64748b;margin:7px 0 15px}.month-answer-details{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #e7edf2}.month-answer-details>div{padding:10px 8px;border-bottom:1px solid #edf2f6}.month-answer-details>div:nth-child(odd){border-right:1px solid #edf2f6}.month-answer-details span{display:block;font-size:10px;color:#64748b;margin-bottom:3px}.month-answer-details strong{font-size:13px;color:#172126}.month-answer-details.compact{grid-template-columns:1fr}.month-answer-details.compact>div{border-right:0!important;display:flex;align-items:center;justify-content:space-between;gap:12px}.month-after-obligations{background:#f8fafc;margin-top:4px;border-radius:9px}.class-decision-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:13px 0}.class-decision-counts>div{border-radius:12px;padding:12px 8px;text-align:center;border:1px solid #e5eaf0}.class-decision-counts strong{display:block;font-size:25px;line-height:1}.class-decision-counts span{display:block;font-size:10px;margin-top:6px;color:#64748b}.class-decision-counts .continue{background:#ecfdf5;border-color:#bbf7d0}.class-decision-counts .watch{background:#fffbeb;border-color:#fde68a}.class-decision-counts .merge{background:#fff1f2;border-color:#fecdd3}.month-class-review{margin-top:14px;background:#fff;color:#172126;border:1px solid #dbe5eb;border-radius:16px;padding:16px}.decision-side{display:flex;align-items:center;gap:8px}.decision-pill{min-width:72px;text-align:center;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:800}.decision-pill.continue{background:#dcfce7;color:#166534}.decision-pill.watch{background:#fef3c7;color:#92400e}.decision-pill.merge{background:#ffe4e6;color:#9f1239}.month-close-summary{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;margin-top:14px;background:#0f172a;color:#fff;border-radius:16px;padding:16px 18px}.month-close-summary>div:not(.minus):not(.equals){display:flex;flex-direction:column;gap:4px}.month-close-summary span{font-size:10px;color:#cbd5e1;text-transform:uppercase;letter-spacing:.04em}.month-close-summary strong{font-size:20px}.month-close-summary .minus,.month-close-summary .equals{font-size:23px;color:#94a3b8}.month-close-action{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff;color:#172126;border:1px solid #dbe5eb;border-radius:16px;padding:15px 17px}.month-close-action p{margin:4px 0 0;color:#64748b;font-size:11px;max-width:720px}.month-close-action.closed{background:#f8fafc}.month-lock-note{background:#e8f0f7;color:#334155;border:1px solid #cddbe7;border-radius:12px;padding:11px 13px;font-size:12px;font-weight:650}.month-panel .month-answer-card .amount-in,.month-panel .month-close-summary .amount-in{color:#0f9d76!important}.month-panel .month-answer-card .amount-out,.month-panel .month-close-summary .amount-out{color:#ef6b73!important}@media(max-width:1100px){.month-answer-grid{grid-template-columns:1fr 1fr}.classes-answer{grid-column:1/-1}}@media(max-width:780px){.month-answer-grid{grid-template-columns:1fr}.classes-answer{grid-column:auto}.month-close-summary{grid-template-columns:1fr}.month-close-summary .minus,.month-close-summary .equals{display:none}.month-close-action{align-items:flex-start;flex-direction:column}.month-close-action .btn{width:100%}}


/* Motion+-inspired ClassFlow presentation layer — visual only */
:root{
  --primary:#ff4f2e;--primary-strong:#e63d20;--primary-soft:#fff0eb;
  --ink:#151515;--muted:#77736e;--bg:#f2f0eb;--card:#fbfaf7;
  --line:#dedbd4;--line-strong:#cfcac1;--shadow:0 1px 2px rgba(20,20,20,.04),0 18px 50px rgba(20,20,20,.06);
  --radius:12px;--radius-sm:9px;
}
html{background:var(--bg)}
body{background:var(--bg);color:var(--ink);letter-spacing:-.01em}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:radial-gradient(rgba(20,20,20,.12) .55px,transparent .55px);background-size:5px 5px;mask-image:linear-gradient(to bottom,black,transparent 45%);z-index:-1}
.app-shell{grid-template-columns:218px minmax(0,1fr);background:var(--bg)}
.sidebar{background:#171717;color:#f5f3ee;border-right:0;padding:18px 12px 14px}
.brand{padding:3px 7px 20px}.brand strong{color:#fff;font-size:14px;letter-spacing:-.02em}.brand span{color:#8f8d88;font-size:10px;text-transform:uppercase;letter-spacing:.1em}
.brand-mark{background:#ff4f2e!important;color:#171717!important;border-radius:8px!important;box-shadow:none!important}.small-mark{width:34px;height:34px}
.nav{gap:2px}.nav button{color:#9f9c96!important;border-radius:7px!important;padding:9px 10px!important;font-size:12.5px;font-weight:560;transition:background .18s ease,color .18s ease,transform .18s ease}.nav button:hover{background:#232323!important;color:#fff!important;transform:translateX(2px)}.nav button.active{background:#f4f1eb!important;color:#171717!important;box-shadow:none!important}.nav button.active .material-symbols-outlined{color:#ff4f2e!important}
.sidebar-cta{background:#ff4f2e!important;color:#171717!important;border:0!important;border-radius:8px!important;box-shadow:none!important;font-weight:750!important;transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s}.sidebar-cta:hover{transform:translateY(-2px);background:#ff674b!important}
.utility-btn,.sidebar-signout{color:#92908b!important;border-radius:7px!important}.utility-btn:hover,.sidebar-signout:hover{background:#232323!important;color:#fff!important}.sidebar-foot{border-color:#2b2b2b!important}.profile-mini strong{color:#f4f1eb}.profile-mini span{color:#77746f}.avatar{background:#292929!important;color:#ff6b4e!important}
.main{min-width:0;background:transparent}.topbar{height:76px!important;padding:0 28px!important;border-bottom:1px solid var(--line)!important;background:rgba(242,240,235,.88)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.topbar-copy h2{font-size:18px!important;font-weight:650!important;letter-spacing:-.035em!important}.topbar-copy p{font-size:11px!important}.page{padding:24px 28px 54px!important;max-width:1400px!important}
.section,.metric-card,.class-card,.home-ref-panel,.month-panel,.people-table-section{background:var(--card)!important;border:1px solid var(--line)!important;border-radius:10px!important;box-shadow:none!important}.section:hover,.class-card:hover,.metric-card:hover{border-color:#c8c3ba!important}
.metric-card{padding:16px!important;min-height:112px!important}.metric-card strong{font-size:25px!important;letter-spacing:-.045em!important}.metric-card span,.metric-card small{text-transform:none!important;letter-spacing:0!important}
.btn{border-radius:7px!important;font-size:12px!important;padding:8px 11px!important;box-shadow:none!important;transition:transform .18s cubic-bezier(.2,.8,.2,1),background .18s,border-color .18s!important}.btn:hover{transform:translateY(-1px)!important}.btn.primary{background:#171717!important;color:#fff!important}.btn.primary:hover{background:#ff4f2e!important;color:#171717!important}.btn.soft{background:#fff0eb!important;color:#b9341d!important}.btn.subtle,.btn.ghost{background:#f3f1ec!important;border:1px solid #ddd8cf!important}.btn.text{color:#d84226!important}
input,select,textarea{border-radius:7px!important;background:#fff!important;border-color:#d8d3ca!important;padding:9px 10px!important;font-size:12.5px!important}input:focus,select:focus,textarea:focus{border-color:#ff4f2e!important;box-shadow:0 0 0 3px rgba(255,79,46,.11)!important}
.month-pill,.chip,.filter-tab{border-radius:999px!important}.filter-tabs{gap:4px!important}.filter-tab{font-size:11px!important;padding:6px 10px!important;background:transparent!important;border:1px solid transparent!important}.filter-tab.active{background:#171717!important;color:#fff!important;border-color:#171717!important}
.people-table-head{background:#efede8!important;color:#7b7770!important;text-transform:uppercase!important;font-size:9px!important;letter-spacing:.08em!important}.student-row,.people-row,.activity-row{border-color:#e4e0d9!important}.student-row:hover,.people-row:hover,.activity-row:hover{background:#f7f5f1!important}
.student-avatar,.person-avatar{border-radius:7px!important;background:#ece9e3!important;color:#34312d!important}.student-meta strong,.row-main strong{letter-spacing:-.015em}
.class-card{transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .2s!important}.class-card:hover{transform:translateY(-3px)!important}.class-card h3,.section h3,.home-ref-panel h3{letter-spacing:-.03em!important}
.home-ref-stat{background:#fbfaf7!important;border:1px solid #dedbd4!important;border-radius:9px!important;box-shadow:none!important}.home-ref-stat strong{letter-spacing:-.05em!important}.home-ref-period{border-radius:7px!important;background:#171717!important;color:#fff!important}.home-ref-period strong{color:#ff674b!important}.home-ref-class-card{border-radius:8px!important;transition:transform .2s,border-color .2s!important}.home-ref-class-card:hover{transform:translateY(-2px);border-color:#bbb5ab!important}
.finance-action{border-radius:8px!important;border:1px solid var(--line)!important;background:#fbfaf7!important;box-shadow:none!important;transition:transform .18s,border-color .18s!important}.finance-action:hover{transform:translateY(-2px);border-color:#bdb7ad!important}.quick-icon{background:#171717!important;color:#ff674b!important;border-radius:6px!important}
.modal{border-radius:12px!important;border:1px solid #d6d1c8!important;background:#fbfaf7!important;box-shadow:0 30px 90px rgba(20,20,20,.18)!important}.modal::backdrop{background:rgba(20,20,20,.36)!important;backdrop-filter:blur(4px)}.modal-head,.modal-actions{border-color:#e2ded7!important}
.auth-screen{background:#171717!important}.auth-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,rgba(255,79,46,.13),transparent 34%);pointer-events:none}.auth-card{position:relative;background:#f5f2ec!important;border:1px solid #373737!important;border-radius:12px!important;box-shadow:0 40px 100px rgba(0,0,0,.3)!important}.auth-copy h1{font-size:38px!important;letter-spacing:-.055em!important}.auth-brand .brand-mark{background:#ff4f2e!important}.auth-brand strong{color:#171717!important}.auth-brand span{color:#7d7972!important}
@media (prefers-reduced-motion:no-preference){.page>*{animation:cfReveal .34s cubic-bezier(.2,.8,.2,1) both}.page>*:nth-child(2){animation-delay:.035s}.page>*:nth-child(3){animation-delay:.07s}.modal[open]{animation:cfModal .22s cubic-bezier(.2,.8,.2,1)}@keyframes cfReveal{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes cfModal{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}}
@media(max-width:820px){.topbar{padding:0 16px!important}.page{padding:16px 14px 88px!important}}


/* === Cinematic product motion layer — reference-inspired, workflow-safe === */
@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  .main{perspective:1400px}
  .topbar{transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}
  .sidebar{animation:cfSidebarIn .55s cubic-bezier(.16,1,.3,1) both}
  .brand-mark{transition:transform .5s cubic-bezier(.16,1,.3,1),border-radius .35s ease!important}
  .brand:hover .brand-mark{transform:rotate(-7deg) scale(1.06);border-radius:50%!important}
  .nav button,.sidebar-cta,.utility-btn,.sidebar-signout{position:relative;overflow:hidden;transition:transform .28s cubic-bezier(.16,1,.3,1),background .25s,color .25s!important}
  .nav button:before,.sidebar-cta:before,.utility-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.11) 48%,transparent 76%);transform:translateX(-130%);transition:transform .65s cubic-bezier(.16,1,.3,1);pointer-events:none}
  .nav button:hover:before,.sidebar-cta:hover:before,.utility-btn:hover:before{transform:translateX(130%)}
  .nav button:hover,.utility-btn:hover,.sidebar-signout:hover{transform:translateX(3px)}
  .nav button .material-symbols-outlined,.sidebar-cta .material-symbols-outlined{transition:transform .32s cubic-bezier(.16,1,.3,1)}
  .nav button:hover .material-symbols-outlined,.sidebar-cta:hover .material-symbols-outlined{transform:scale(1.13) rotate(-4deg)}
  .page.cf-page-enter>*{animation:cfCinematicReveal .62s cubic-bezier(.16,1,.3,1) both}
  .page.cf-page-enter>*:nth-child(2){animation-delay:.045s}.page.cf-page-enter>*:nth-child(3){animation-delay:.09s}.page.cf-page-enter>*:nth-child(4){animation-delay:.135s}.page.cf-page-enter>*:nth-child(5){animation-delay:.18s}
  .metric-card,.class-card,.home-ref-stat,.home-ref-class-card,.finance-action,.section,.month-panel{transform-origin:50% 70%;transition:transform .36s cubic-bezier(.16,1,.3,1),box-shadow .36s,border-color .28s!important}
  .metric-card:hover,.home-ref-stat:hover{transform:translateY(-4px) scale(1.012)!important;box-shadow:0 18px 45px rgba(20,20,20,.08)!important}
  .class-card:hover,.home-ref-class-card:hover,.finance-action:hover{transform:translateY(-5px) scale(1.008)!important;box-shadow:0 22px 50px rgba(20,20,20,.07)!important}
  .student-row,.people-row,.activity-row{transition:background .2s ease,transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s!important}
  .student-row:hover,.people-row:hover,.activity-row:hover{transform:translateX(3px);box-shadow:inset 3px 0 0 #ff4f2e!important}
  .btn{overflow:hidden;position:relative}.btn:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.32);left:var(--ripple-x,50%);top:var(--ripple-y,50%);transform:translate(-50%,-50%) scale(0);opacity:0;pointer-events:none}.btn.cf-press:after{animation:cfRipple .55s ease-out}
  .btn:active,.small-btn:active{transform:scale(.965)!important;transition-duration:.08s!important}
  .modal[open]{animation:cfModalSpring .42s cubic-bezier(.16,1,.3,1)!important}.modal::backdrop{animation:cfBackdrop .3s ease both}
  .toast{transition:transform .42s cubic-bezier(.16,1,.3,1),opacity .3s!important}
  .month-pill{transition:transform .25s ease,background .25s}.month-pill:hover{transform:translateY(-2px)}
  @keyframes cfSidebarIn{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
  @keyframes cfCinematicReveal{from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
  @keyframes cfModalSpring{0%{opacity:0;transform:translateY(24px) scale(.955)}70%{transform:translateY(-2px) scale(1.004)}100%{opacity:1;transform:none}}
  @keyframes cfBackdrop{from{opacity:0}to{opacity:1}}
  @keyframes cfRipple{0%{opacity:1;transform:translate(-50%,-50%) scale(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(28)}}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Student spreadsheet visibility: search + status filters must override table display rules. */
.excel-list > .student-row.hidden{display:none!important;}

/* === Improvement Lab === */
.agent-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:28px 30px;margin-bottom:18px;border:1px solid var(--line-strong);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(247,244,238,.88));overflow:hidden}.agent-hero h2{margin:6px 0 8px;font-size:28px;letter-spacing:-.04em}.agent-hero p{max-width:720px;margin:0;color:var(--muted)}.agent-kicker{font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--primary)}.agent-loop-note{display:flex;justify-content:space-between;gap:18px;padding:14px 16px;margin-bottom:16px;border-bottom:1px solid var(--line-strong)}.agent-loop-note span{color:var(--muted);font-size:12px}.agent-score{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line-strong);border-radius:14px;overflow:hidden}.agent-score>div{padding:16px;border-right:1px solid var(--line-strong)}.agent-score>div:last-child{border-right:0}.agent-score span,.agent-score strong{display:block}.agent-score span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.agent-score strong{margin-top:5px;font-size:18px}.agent-graph{display:flex;align-items:center;gap:7px;margin:18px 0;overflow-x:auto;padding-bottom:5px}.agent-node{min-width:118px;padding:12px;border:1px solid var(--line-strong);border-radius:12px;background:var(--card)}.agent-node span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--ink);color:#fff;font-size:10px}.agent-node strong,.agent-node small{display:block;margin-top:5px}.agent-node strong{text-transform:capitalize}.agent-node small{color:var(--muted)}.agent-edge{color:var(--muted)}.agent-findings{display:grid;gap:10px}.agent-finding{padding:15px 16px;border:1px solid var(--line-strong);border-left-width:4px;border-radius:12px;background:var(--card)}.agent-finding.high{border-left-color:#b33a2f}.agent-finding.medium{border-left-color:#b67819}.agent-finding.info{border-left-color:#4775a8}.agent-finding-top{display:flex;align-items:center;gap:10px}.agent-finding-top span{text-transform:uppercase;font-size:9px;font-weight:900;letter-spacing:.08em}.agent-finding p{margin:7px 0;color:var(--muted)}.agent-finding>div:last-child{font-size:12px}.agent-clean{padding:28px;text-align:center;border:1px dashed var(--line-strong);border-radius:14px}.agent-clean strong,.agent-clean span{display:block}.agent-clean span{margin-top:5px;color:var(--muted)}
@media(max-width:800px){.agent-hero{align-items:stretch;flex-direction:column}.agent-score{grid-template-columns:1fr 1fr}.agent-score>div:nth-child(2){border-right:0}.agent-score>div:nth-child(-n+2){border-bottom:1px solid var(--line-strong)}.agent-loop-note{flex-direction:column}}

/* === Improvement Agent engineering gate === */
.agent-finding-actions{display:flex;align-items:center;gap:8px;margin-top:12px}.agent-proposal-state,.agent-count{display:inline-flex;align-items:center;border:1px solid var(--line-strong);border-radius:999px;padding:5px 9px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.agent-engineering{margin-top:22px;padding-top:20px;border-top:1px solid var(--line-strong)}.agent-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:12px}.agent-section-head h3{margin:3px 0 2px;font-size:18px}.agent-section-head p{margin:0;color:var(--muted);font-size:12px}.agent-proposal{padding:16px;margin-top:10px;border:1px solid var(--line-strong);border-radius:13px;background:var(--card)}.agent-proposal.approved{box-shadow:inset 3px 0 0 #2d7a54}.agent-proposal.rejected{opacity:.58}.agent-proposal-head,.agent-proposal-head>div{display:flex;align-items:center;gap:10px}.agent-proposal-head{justify-content:space-between}.agent-proposal-head span{font-size:9px;text-transform:uppercase;font-weight:900;letter-spacing:.06em}.agent-proposal-head>b{font-size:10px;text-transform:uppercase;color:var(--muted)}.agent-proposal>p{margin:8px 0 12px;color:var(--muted)}.agent-proposal-grid{display:grid;grid-template-columns:1.5fr .5fr;gap:10px}.agent-proposal-grid>div{padding:10px;border:1px solid var(--line);border-radius:10px}.agent-proposal-grid small,.agent-proposal-grid strong{display:block}.agent-proposal-grid small{color:var(--muted);font-size:10px}.agent-proposal-grid strong{margin-top:3px;font-size:11px}.agent-proposal details{margin-top:10px}.agent-proposal summary{cursor:pointer;font-weight:750;font-size:11px}.agent-proposal ol{margin:8px 0 0;padding-left:20px;color:var(--muted);font-size:11px}.agent-proposal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}
@media(max-width:700px){.agent-section-head{align-items:flex-start;flex-direction:column}.agent-proposal-grid{grid-template-columns:1fr}}


/* === Jakob's Law redesign: familiar SaaS / finance conventions === */
:root{
  --primary:#2563eb!important;--primary-strong:#1d4ed8!important;--primary-soft:#eff6ff!important;
  --ink:#111827!important;--muted:#6b7280!important;--bg:#f8fafc!important;--card:#ffffff!important;
  --line:#eef2f7!important;--line-strong:#e5e7eb!important;--success:#15803d!important;--success-soft:#f0fdf4!important;
  --warning:#b45309!important;--warning-soft:#fffbeb!important;--danger:#b91c1c!important;--danger-soft:#fef2f2!important;
  --shadow:0 1px 2px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06)!important;--radius:12px!important;--radius-sm:9px!important
}
html,body{background:#f8fafc!important;color:#111827!important}
body{font-size:14px!important;line-height:1.45!important}
.app-shell{background:#f8fafc!important}
.sidebar{width:232px!important;background:#fff!important;color:#374151!important;border-right:1px solid #e5e7eb!important;box-shadow:none!important;padding:18px 12px!important}
.brand{padding:4px 8px 18px!important;border-bottom:1px solid #f1f5f9!important;margin-bottom:12px!important}
.brand-mark{background:#2563eb!important;border-radius:9px!important;box-shadow:none!important}
.brand strong{color:#111827!important;font-size:15px!important}.brand span{color:#6b7280!important;font-size:11px!important}
.nav{gap:3px!important}.nav button,.sidebar .nav button{min-height:40px!important;border-radius:8px!important;padding:9px 10px!important;color:#4b5563!important;font-weight:600!important;background:transparent!important;border:0!important;box-shadow:none!important;transition:background .12s ease,color .12s ease!important}
.nav button:hover,.sidebar .nav button:hover{background:#f3f4f6!important;color:#111827!important;transform:none!important}
.nav button.active,.sidebar .nav button.active{background:#eff6ff!important;color:#1d4ed8!important;font-weight:700!important}
.nav button.active .nav-icon,.sidebar .nav button.active .nav-icon{color:#2563eb!important}
.nav-icon{font-family:'Material Symbols Outlined'!important;font-size:19px!important;color:#6b7280!important;width:22px!important;text-align:center!important}
.sidebar-cta{margin:14px 4px 8px!important;border-radius:8px!important;background:#2563eb!important;color:#fff!important;box-shadow:none!important;min-height:42px!important;font-weight:700!important}
.sidebar-cta:hover{background:#1d4ed8!important;transform:none!important}
.sidebar-utility{border-top:1px solid #f1f5f9!important;margin-top:auto!important;padding-top:10px!important}.utility-btn,.sidebar-signout{border-radius:8px!important;color:#4b5563!important}.utility-btn:hover,.sidebar-signout:hover{background:#f3f4f6!important;color:#111827!important}
.profile-mini{border-top:1px solid #f1f5f9!important;padding-top:14px!important}.profile-mini .avatar{background:#f3f4f6!important;color:#374151!important}
.main{background:#f8fafc!important}.topbar{height:64px!important;padding:0 28px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid #e5e7eb!important;box-shadow:none!important;backdrop-filter:blur(8px)!important}
.topbar-copy h2{font-size:19px!important;line-height:1.2!important;letter-spacing:-.015em!important;font-weight:750!important;color:#111827!important}.topbar-copy p{font-size:12px!important;margin-top:2px!important;color:#6b7280!important}
.month-pill{background:#f8fafc!important;border:1px solid #e5e7eb!important;color:#4b5563!important;border-radius:8px!important;font-size:12px!important;font-weight:650!important}
.page{padding:24px 28px 40px!important;max-width:1500px!important;margin:0 auto!important;width:100%!important}
.section,.panel,.card,.metric-card,.home-ref-panel{background:#fff!important;border:1px solid #e5e7eb!important;border-radius:12px!important;box-shadow:var(--shadow)!important}
.section-head{margin-bottom:16px!important;align-items:center!important}.section-head h3{font-size:16px!important;margin:0!important}.section-head p{margin:3px 0 0!important;font-size:12px!important}
.btn{min-height:36px!important;border-radius:8px!important;padding:8px 12px!important;font-size:13px!important;font-weight:650!important;box-shadow:none!important;transition:background .12s ease,border-color .12s ease!important;transform:none!important}
.btn:hover{transform:none!important}.btn.primary{background:#2563eb!important;color:#fff!important}.btn.primary:hover{background:#1d4ed8!important}.btn.subtle,.btn.ghost,.btn.soft{background:#fff!important;color:#374151!important;border:1px solid #d1d5db!important}.btn.subtle:hover,.btn.ghost:hover,.btn.soft:hover{background:#f9fafb!important;border-color:#9ca3af!important}.btn.danger{background:#fff!important;color:#b91c1c!important;border:1px solid #fecaca!important}.btn.danger:hover{background:#fef2f2!important}
input,select,textarea{border:1px solid #d1d5db!important;border-radius:8px!important;background:#fff!important;color:#111827!important;min-height:38px!important;padding:8px 10px!important;box-shadow:none!important}input:focus,select:focus,textarea:focus{border-color:#2563eb!important;box-shadow:0 0 0 3px rgba(37,99,235,.12)!important}label{color:#374151!important;font-size:12px!important;font-weight:650!important;gap:6px!important}
.filter-tabs{background:#f3f4f6!important;border:1px solid #e5e7eb!important;padding:3px!important;border-radius:9px!important;gap:2px!important}.filter-tab{border:0!important;background:transparent!important;color:#6b7280!important;border-radius:6px!important;padding:7px 10px!important;font-size:12px!important;font-weight:650!important;box-shadow:none!important}.filter-tab.active{background:#fff!important;color:#111827!important;box-shadow:0 1px 2px rgba(15,23,42,.08)!important}.filter-tab:hover{color:#111827!important}
.search-box,.search-wrap{border-radius:8px!important}
.metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin-bottom:18px!important}.metric-card{padding:16px!important;min-height:104px!important}.metric-card span,.metric-label{font-size:11px!important;color:#6b7280!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important}.metric-card strong,.metric-value{font-size:24px!important;letter-spacing:-.025em!important;margin-top:5px!important}
/* Dashboard: familiar KPI cards + primary content + secondary attention */
.home-ref{display:block!important}.home-ref-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;margin:0 0 16px!important;padding:0!important}.home-ref-head h2{font-size:22px!important;margin:0!important;letter-spacing:-.02em!important}.home-ref-head p{margin:4px 0 0!important;color:#6b7280!important}.home-ref-period{background:#fff!important;border:1px solid #e5e7eb!important;border-radius:9px!important;padding:8px 10px!important;box-shadow:none!important}.home-ref-period span{color:#6b7280!important}.home-ref-period strong{color:#374151!important;font-size:10px!important}
.home-ref-summary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;background:transparent!important;border:0!important;padding:0!important;margin-bottom:18px!important}.home-ref-stat{background:#fff!important;border:1px solid #e5e7eb!important;border-radius:12px!important;padding:16px!important;box-shadow:var(--shadow)!important;min-height:106px!important}.home-ref-stat span{font-size:11px!important;color:#6b7280!important;text-transform:none!important;letter-spacing:0!important}.home-ref-stat strong{font-size:24px!important;color:#111827!important;letter-spacing:-.025em!important}.home-ref-stat small{font-size:11px!important;color:#6b7280!important}.home-ref-positive{color:#15803d!important}.home-ref-negative{color:#b91c1c!important}
.home-ref-layout{display:grid!important;grid-template-columns:minmax(0,1.65fr) minmax(280px,.75fr)!important;gap:16px!important}.home-ref-panel{padding:18px!important}.home-ref-panel-head h3{font-size:15px!important}.home-ref-panel-head p{font-size:11px!important;color:#6b7280!important}.home-ref-link{color:#2563eb!important;font-weight:650!important}.home-ref-rule{background:#e5e7eb!important}.home-ref-class-grid{gap:8px!important}.home-ref-class-card{border:1px solid #e5e7eb!important;border-radius:9px!important;background:#fff!important;box-shadow:none!important}.home-ref-class-card:hover{background:#f9fafb!important;transform:none!important;border-color:#d1d5db!important}
/* Familiar spreadsheet/table behavior */
.people-table-section{border:1px solid #e5e7eb!important;border-radius:12px!important;overflow:auto!important;background:#fff!important;box-shadow:var(--shadow)!important}.people-table-head{background:#f9fafb!important;color:#6b7280!important;border-bottom:1px solid #e5e7eb!important;font-size:10px!important;letter-spacing:.035em!important}.people-table-head>span{padding:10px 14px!important;border-right:0!important}.excel-list>.student-row{background:#fff!important;border-bottom:1px solid #eef2f7!important;min-height:58px!important}.excel-list>.student-row:hover{background:#f9fafb!important}.excel-list>.student-row>.student-left>.student-meta>strong{border-right:0!important;padding:10px 14px!important;font-size:13px!important}.excel-list>.student-row>.student-left>.student-meta>span,.excel-list>.student-row>.student-money{border-right:0!important}.excel-list>.student-row>.student-actions{padding:8px 12px!important}.student-money strong{font-variant-numeric:tabular-nums!important}
.class-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))!important;gap:12px!important}.class-card{border:1px solid #e5e7eb!important;border-radius:12px!important;background:#fff!important;box-shadow:var(--shadow)!important}.class-card:hover{transform:none!important;border-color:#d1d5db!important}.chip{border-radius:999px!important;font-size:10px!important;font-weight:700!important;padding:4px 8px!important}.chip.good{background:#f0fdf4!important;color:#166534!important}.chip.warn{background:#fffbeb!important;color:#92400e!important}.chip.bad{background:#fef2f2!important;color:#991b1b!important}
.modal{border-radius:14px!important;border:1px solid #e5e7eb!important;box-shadow:0 20px 50px rgba(15,23,42,.16)!important}.modal-head{border-bottom:1px solid #eef2f7!important;padding:16px 18px!important}.modal-body{padding:18px!important}.modal-actions{border-top:1px solid #eef2f7!important;padding:12px 18px!important;background:#f9fafb!important}
/* Reduce novelty: keep motion informative and fast */
.page>*,.section,.card,.class-card,.student-row,.btn,.nav button{animation-duration:.16s!important;transition-duration:.12s!important}.btn:active,.nav button:active,.class-card:active{transform:none!important}
/* Improvement Lab should look like a normal system-health/admin screen */
.agent-hero{background:#fff!important;border:1px solid #e5e7eb!important;border-radius:12px!important;padding:20px!important}.agent-hero h2{font-size:21px!important}.agent-kicker{color:#2563eb!important}.agent-score{border-color:#e5e7eb!important;border-radius:10px!important}.agent-node,.agent-proposal,.agent-finding{border-color:#e5e7eb!important;border-radius:9px!important}.agent-node span{background:#2563eb!important}.agent-loop-note{background:#f9fafb!important;border:1px solid #e5e7eb!important;border-radius:9px!important;padding:12px!important}
@media(max-width:1100px){.home-ref-summary,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.home-ref-layout{grid-template-columns:1fr!important}}
@media(max-width:760px){.sidebar{width:auto!important}.page{padding:16px 14px 84px!important}.topbar{padding:0 14px!important}.home-ref-summary,.metric-grid{grid-template-columns:1fr!important}.home-ref-head{align-items:flex-start!important;flex-direction:column!important;gap:10px!important}.filter-tabs{overflow-x:auto!important;max-width:100%!important}.mobile-nav{background:#fff!important;border-top:1px solid #e5e7eb!important;box-shadow:none!important}.mobile-nav button.active{color:#2563eb!important;background:#eff6ff!important}}

/* === Centered payment receipt === */
.payment-receipt-overlay{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:24px;background:rgba(15,23,42,.58);backdrop-filter:blur(5px);animation:receiptFade .18s ease-out}.payment-receipt-card{width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto;border:1px solid rgba(255,255,255,.6);border-radius:24px;background:var(--card,#fff);box-shadow:0 30px 90px rgba(15,23,42,.3);animation:receiptPop .24s cubic-bezier(.2,.8,.2,1)}.payment-receipt-hero{position:relative;text-align:center;padding:30px 28px 26px;color:#fff;background:linear-gradient(135deg,var(--primary,#0d766e),#2563eb 58%,#6d5dfc);overflow:hidden}.payment-receipt-hero:before,.payment-receipt-hero:after{content:"";position:absolute;border-radius:999px;background:rgba(255,255,255,.12)}.payment-receipt-hero:before{width:180px;height:180px;right:-70px;top:-85px}.payment-receipt-hero:after{width:120px;height:120px;left:-50px;bottom:-70px}.payment-receipt-close{position:absolute;right:16px;top:14px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:26px;line-height:1;cursor:pointer}.payment-receipt-check{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 12px;border:3px solid rgba(255,255,255,.92);border-radius:50%;background:#22c55e;font-size:31px;font-weight:900}.payment-receipt-hero>span{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;opacity:.9}.payment-receipt-hero h2{margin:4px 0 1px;font-size:36px;letter-spacing:-.03em}.payment-receipt-hero p{margin:0;opacity:.88}.payment-receipt-body{padding:24px}.payment-receipt-title{display:flex;align-items:center;gap:12px;padding-bottom:17px;border-bottom:1px solid var(--line,#e5e7eb)}.payment-receipt-title>.material-symbols-outlined{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:color-mix(in srgb,var(--primary,#0d766e) 12%,white);color:var(--primary,#0d766e)}.payment-receipt-title strong,.payment-receipt-title small{display:block}.payment-receipt-title strong{font-size:16px}.payment-receipt-title small{margin-top:2px;color:var(--muted,#64748b);font-size:11px}.payment-receipt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.payment-receipt-grid>div{padding:13px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px;background:var(--bg,#f8fafc)}.payment-receipt-grid>div:first-child{grid-column:1/-1}.payment-receipt-grid span,.payment-receipt-grid strong{display:block}.payment-receipt-grid span{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#64748b);font-weight:800}.payment-receipt-grid strong{margin-top:4px;font-size:14px}.payment-receipt-paid{background:#ecfdf5!important;border-color:#bbf7d0!important}.payment-receipt-paid strong{color:#15803d;font-size:19px}.payment-receipt-balance{background:#eff6ff!important;border-color:#bfdbfe!important}.payment-receipt-balance strong{color:#1d4ed8;font-size:19px}.payment-receipt-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.payment-receipt-actions .btn{display:inline-flex;align-items:center;gap:6px}@keyframes receiptFade{from{opacity:0}to{opacity:1}}@keyframes receiptPop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}@media(max-width:560px){.payment-receipt-overlay{padding:12px}.payment-receipt-card{width:100%;border-radius:20px}.payment-receipt-grid{grid-template-columns:1fr}.payment-receipt-grid>div:first-child{grid-column:auto}.payment-receipt-actions{flex-direction:column-reverse}.payment-receipt-actions .btn{justify-content:center;width:100%}}@media print{body>*:not(.payment-receipt-overlay){display:none!important}.payment-receipt-overlay{position:static;background:#fff;padding:0}.payment-receipt-card{box-shadow:none;max-height:none;width:100%;border:0}.payment-receipt-close,.payment-receipt-actions{display:none!important}}


/* Student deletion confirmation */
.delete-confirm-overlay{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:rgba(15,23,42,.58);backdrop-filter:blur(7px)}
.delete-confirm-card{width:min(520px,calc(100vw - 32px));background:var(--card,#fff);border:1px solid var(--line-strong,#d8dee7);border-radius:22px;box-shadow:0 28px 80px rgba(15,23,42,.28);padding:26px;display:grid;gap:18px;animation:deleteConfirmIn .18s ease-out}
.delete-confirm-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#fff0ee,#ffe1dc);color:#b42318;border:1px solid #ffd0c8}
.delete-confirm-icon .material-symbols-outlined{font-size:29px}
.delete-confirm-kicker{display:block;margin-bottom:5px;color:#b42318;font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.delete-confirm-card h3{margin:0;font-size:23px;line-height:1.2;color:var(--ink,#172126)}
.delete-confirm-card p{margin:8px 0 0;color:var(--muted,#6b767c);line-height:1.55}
.delete-confirm-warning{display:flex;gap:9px;align-items:flex-start;margin-top:14px;padding:11px 12px;border-radius:12px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:12px;line-height:1.45}
.delete-confirm-warning .material-symbols-outlined{font-size:18px;flex:0 0 auto}
.delete-confirm-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.delete-confirm-danger{background:#b42318!important;color:#fff!important;border-color:#b42318!important}
.delete-confirm-danger:hover{background:#8f1d14!important;border-color:#8f1d14!important}
@keyframes deleteConfirmIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:560px){.delete-confirm-card{padding:20px;border-radius:18px}.delete-confirm-actions{display:grid;grid-template-columns:1fr}.delete-confirm-actions .btn{width:100%}}


/* === Popup viewport safety — prevent side-scrolling and clipped drawers === */
html,body{max-width:100%;overflow-x:hidden}
.modal,.modal *{box-sizing:border-box;min-width:0}
.modal{max-width:calc(100vw - 24px)!important}
.modal-body{max-width:100%;overflow-x:hidden!important;overflow-y:auto}
.modal-body>*{max-width:100%}
.modal-body .student-list,.modal-body .section,.modal-body .payment-history,.modal-body .table-wrap{min-width:0!important;max-width:100%!important}
.modal-body .student-row{max-width:100%!important;min-width:0!important}
.modal-body .student-meta,.drawer-hero,.drawer-hero p,.drawer-hero h2{min-width:0;max-width:100%;overflow-wrap:anywhere}
.modal-body .toolbar,.modal-body .student-actions{flex-wrap:wrap}
.modal-body table{max-width:100%}

@media(max-width:780px){
  .modal.drawer-mode{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    height:auto!important;
    max-height:calc(100dvh - 20px)!important;
    margin:auto!important;
    border-radius:18px!important;
  }
  .modal.drawer-mode form{height:auto!important;max-height:calc(100dvh - 20px)!important}
  .modal.drawer-mode .modal-body{flex:0 1 auto!important;max-height:calc(100dvh - 142px)!important;padding:16px!important}
  .modal.drawer-mode .modal-head{padding:14px 16px!important}
  .modal.drawer-mode .modal-actions{padding:12px 16px!important}
  .drawer-stats{grid-template-columns:1fr!important}
  .form-row,.account-grid{grid-template-columns:1fr!important}
  .modal-body .student-row{width:100%!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;padding:12px!important}
  .modal-body .student-left,.modal-body .student-money,.modal-body .student-actions{width:100%!important;max-width:100%!important}
  .modal-body .student-money{text-align:left!important}
  .modal-body .student-actions{justify-content:flex-start!important}
}

@media(max-width:420px){
  .modal,.modal.drawer-mode{width:calc(100vw - 12px)!important;max-width:calc(100vw - 12px)!important}
  .modal-head,.modal-body,.modal-actions{padding-left:12px!important;padding-right:12px!important}
}

/* Full-page workflows share the application navigation and card surfaces. */
.workflow-page { width: min(100%, 920px); margin: 0 auto; padding: 24px; }
.workflow-page[hidden], #page[hidden] { display: none !important; }
.workflow-page form { background: var(--surface, #fff); border: 1px solid #dce3e8; border-radius: 16px; overflow: hidden; }
.workflow-page .modal-body { max-height: none; overflow: visible; }
.workflow-page .modal-head, .workflow-page .modal-actions { position: static; }
.class-mode-picker { display: flex; gap: 12px; border: 0; padding: 0; margin: 0 0 20px; }
.class-mode-picker legend { font-weight: 600; margin-bottom: 10px; }
.class-mode-picker label { flex: 1; display: flex; align-items: center; gap: 10px; padding: 16px; border: 1px solid #cbd5e1; border-radius: 10px; cursor: pointer; }
.class-mode-picker input { width: auto; margin: 0; }
.class-mode-picker label:has(input:checked) { border-color: #2563eb; background: #eff6ff; color: #1d4ed8; }
.receipt-card { display: grid; gap: 20px; max-width: 640px; margin: auto; }
.receipt-card h2 { font-size: 44px; margin: 0; }
.receipt-card textarea { min-height: 180px; }
.delete-confirm-inline { margin-bottom: 24px; }
.delete-confirm-inline .delete-confirm-card { max-width: none; width: auto; animation: none; }
@media (max-width: 600px) { .workflow-page { padding: 12px 0; } .workflow-page .modal-body { padding: 16px; } .receipt-card .toolbar { flex-wrap: wrap; } }
@media print { body:has(.receipt-card) .sidebar, body:has(.receipt-card) .topbar, body:has(.receipt-card) .mobile-nav, body:has(.receipt-card) .modal-head, body:has(.receipt-card) .modal-actions, body:has(.receipt-card) .receipt-card .toolbar, body:has(.receipt-card) #toast { display: none !important; } body:has(.receipt-card) .main { margin: 0; } .workflow-page { width: 100%; padding: 0; } }

.receipt-card { max-width: 780px; }
.receipt-document { border: 1px solid #d4a73b; border-radius: 14px; overflow: hidden; background: #fff; color: #082e60; }
.receipt-document header { background: #082e60; color: white; padding: 30px; border-bottom: 4px solid #d4a73b; }
.receipt-document header span { font-size: 24px; font-weight: 700; }
.receipt-document header h2 { font-size: 20px; margin: 16px 0 8px; }
.receipt-document header small { color: #efd18b; }
.receipt-document dl { margin: 24px; }
.receipt-document dl>div { display: grid; grid-template-columns: 35% 65%; border-bottom: 1px solid #cad4df; }
.receipt-document dt { background: #082e60; color: #fff; padding: 14px; font-weight: 600; }
.receipt-document dd { margin: 0; padding: 14px; overflow-wrap: anywhere; white-space: pre-wrap; }
.receipt-document .receipt-amount-row dd { background: #082e60; color: #efd18b; font-size: 24px; font-weight: 800; }
.receipt-document footer { padding: 24px; border-top: 2px solid #d4a73b; line-height: 1.6; }
.receipt-sharing { display: grid; gap: 16px; }
@media(max-width:600px) { .receipt-document dl { margin: 12px; } .receipt-document dt,.receipt-document dd { padding: 12px 8px; font-size: 12px; } }
@media print { .receipt-sharing { display:none!important; } .receipt-document { print-color-adjust:exact; -webkit-print-color-adjust:exact; } }

/* Guided collection and complete payment history. */
.collection-intro { display:flex; gap:16px; align-items:center; justify-content:space-between; }
.collection-intro p { margin:0; color:#64748b; }
.collection-roster { display:grid; gap:12px; padding:20px 0; }
.collection-roster h4,.collection-roster p { margin:0; }
.collection-student-list { display:grid; gap:8px; max-height:320px; overflow-y:auto; }
.collection-student { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; text-align:left; padding:14px 16px; border:1px solid #dce3e8; border-radius:10px; background:#fff; color:#15243b; cursor:pointer; }
.collection-student small { display:block; color:#64748b; margin-top:4px; }
.collection-student.selected { border-color:#2563eb; background:#eff6ff; }
.collection-student:focus-visible { outline:2px solid #2563eb; outline-offset:2px; }
.collection-details { border:0; border-top:1px solid #dce3e8; padding:20px 0 0; margin:0; display:grid; gap:16px; min-width:0; }
.collection-details[hidden] { display:none!important; }
.collection-details legend { font-weight:700; padding:0 8px 0 0; }
.history-filters { display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:12px; align-items:end; }
.history-payment { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:24px; align-items:center; padding:20px 0; border-bottom:1px solid #e2e8f0; }
.history-payment p { margin:6px 0 0; font-size:13px; color:#64748b; overflow-wrap:anywhere; }
.history-payment .chip { display:block; margin-top:6px; text-align:center; }
.history-pagination { margin-top:20px; justify-content:flex-end; align-items:center; }
@media(max-width:800px) { .history-filters { grid-template-columns:1fr 1fr; } .history-filters>label:first-child { grid-column:1/-1; } .history-payment { grid-template-columns:minmax(0,1fr) auto; gap:14px; } .history-payment>div:last-child { grid-column:1/-1; } .collection-intro { align-items:flex-start; flex-direction:column; } }