:root{
  color-scheme:dark;
  --bg:var(--color-background,#0b0f19);
  --bg-2:#0d1117;
  --glass:color-mix(in srgb,var(--color-surface,rgba(22,27,38,.72)) calc(var(--glass-alpha,.72) * 100%),transparent);
  --glass-strong:rgba(30,41,59,.82);
  --line:var(--color-border,rgba(255,255,255,.08));
  --line-bright:color-mix(in srgb,var(--color-primary,#6366f1) 45%,transparent);
  --text:var(--color-text,#f9fafb);
  --muted:var(--color-text-muted,#a7adbb);
  --faint:#6b7280;
  --accent:var(--color-primary,#6366f1);
  --secondary:var(--color-secondary,#8b5cf6);
  --cyan:var(--color-info,#06b6d4);
  --emerald:var(--color-success,#10b981);
  --rose:var(--color-danger,#f43f5e);
  --amber:var(--color-warning,#f59e0b);
  --radius:var(--radius-scale,16px);
  --ease:cubic-bezier(.4,0,.2,1);
  --shadow:0 22px 70px rgba(0,0,0,var(--shadow-alpha,.35));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100svh;
  overflow-x:hidden;
  width:100%;
  font-family:var(--font-family,"Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,sans-serif);
  font-weight:var(--body-weight,600);
  background:var(--bg);
  color:var(--text);
  text-rendering:optimizeLegibility;
}
.modal-lock{overflow:hidden}
body::selection{background:rgba(6,182,212,.35);color:#fff}
body::-webkit-scrollbar{width:12px}
body::-webkit-scrollbar-track{background:#070a11}
body::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--accent),var(--cyan));border:3px solid #070a11;border-radius:999px}
a{color:inherit;text-decoration:none;text-underline-offset:4px}
img,video{max-width:100%;display:block}
i{line-height:1}
.effects-off .ambient-bg::after{display:none}
.ambient-bg{
  position:fixed;
  inset:0;
  z-index:-2;
  background:
    radial-gradient(circle at 16% 12%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 26rem),
    radial-gradient(circle at 82% 18%,rgba(6,182,212,.2),transparent 24rem),
    radial-gradient(circle at 60% 88%,rgba(16,185,129,.16),transparent 28rem),
    linear-gradient(135deg,#070a11 0%,#0b0f19 44%,#111827 100%);
}
.ambient-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 88%);
}
button,.button{
  min-height:44px;
  min-width:44px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(15,23,42,.68);
  color:var(--text);
  padding:.82rem 1rem;
  font-weight:800;
  display:inline-flex;
  gap:.55rem;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease);
}
button:hover,.button:hover{transform:translateY(-2px);border-color:var(--line-bright);box-shadow:0 0 24px rgba(99,102,241,.18)}
button:active,.button:active{transform:scale(.98)}
button:disabled,.button[disabled]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid rgba(6,182,212,.85);outline-offset:3px}
.primary{background:linear-gradient(135deg,var(--accent),var(--secondary));border-color:rgba(199,210,254,.28);color:#fff}
.theme-light{color-scheme:light;--color-background:#f5f7fb;--color-surface:rgba(255,255,255,.9);--color-text:#111827;--color-text-muted:#4b5563;--color-border:rgba(15,23,42,.12)}
.glass-button{background:rgba(255,255,255,.06)}
.ghost{background:transparent;padding:.5rem;color:var(--muted)}
.app-shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100svh}
.sidebar{
  position:sticky;
  top:0;
  height:100svh;
  padding:1.25rem;
  border-right:1px solid var(--line);
  background:rgba(7,10,17,.58);
  backdrop-filter:blur(18px);
}
.brand{display:grid;gap:.3rem;line-height:1.05;margin-bottom:1.4rem}
.brand img{width:42px;height:42px;object-fit:contain;border-radius:12px;margin-bottom:.35rem}
.brand span{font-size:1.35rem;font-weight:var(--heading-weight,900);letter-spacing:-.03em}
.brand small{color:var(--muted);font-size:.74rem;font-weight:700;line-height:1.35}
.nav{display:grid;gap:.55rem}
.nav a,.nav button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:.75rem;
  color:var(--muted);
  background:transparent;
  border:1px solid transparent;
  border-radius:14px;
  padding:.86rem .9rem;
  font-size:.92rem;
}
.nav a i,.nav button i{width:1.1rem;text-align:center;color:#c7d2fe}
.nav a.active,.nav a:hover,.nav button:hover{
  color:var(--text);
  background:linear-gradient(135deg,rgba(99,102,241,.18),rgba(6,182,212,.08));
  border-color:var(--line-bright);
  box-shadow:0 12px 34px rgba(99,102,241,.12);
}
.nav form{margin:0}
.tab-strip{display:flex;gap:.55rem;overflow-x:auto;padding:.2rem 0 .9rem;scrollbar-width:thin;scrollbar-color:var(--accent) transparent}
.tab-strip button{white-space:nowrap}
.tab-strip button.active{color:var(--text);border-color:var(--line-bright);background:rgba(99,102,241,.18)}
.content-shell{min-width:0;overflow-x:hidden}
.topbar{
  position:sticky;
  top:1rem;
  z-index:20;
  width:min(1180px,calc(100% - 2rem));
  margin:1rem auto 0;
  min-height:64px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(16px);
  box-shadow:var(--shadow);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.7rem .9rem;
}
.mobile-brand{display:none;margin:0}
.topbar-status{display:flex;align-items:center;gap:.55rem;color:var(--muted);font-weight:800;font-size:.84rem}
.topbar-status i{color:var(--emerald)}
.page{width:min(1180px,100%);margin:0 auto;padding:1rem 1rem 3rem;overflow-x:hidden}
.footer{width:min(1180px,100%);margin:0 auto 2rem;padding:0 1rem;color:var(--muted);display:flex;justify-content:space-between;gap:1rem;font-weight:800}
.hero{
  min-height:68svh;
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  position:relative;
  display:grid;
  align-items:end;
  background:#070a11;
  box-shadow:var(--shadow);
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,10,17,var(--overlay-opacity,.78)),rgba(7,10,17,.58) 48%,rgba(7,10,17,.18)),linear-gradient(0deg,rgba(7,10,17,.95),transparent 55%);
}
.hero-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.05) brightness(.6)}
.hero-content{position:relative;z-index:1;padding:clamp(2rem,7vw,5.2rem);max-width:760px}
.hero.align-center{align-items:center;text-align:center}.hero.align-center .hero-content{margin-inline:auto}.hero.align-right{justify-items:end;text-align:right}
.hero-content h1{font-size:clamp(3rem,10vw,6rem);line-height:.92;margin:0 0 1rem;letter-spacing:-.04em;font-weight:var(--heading-weight,900)}
.hero-content span{font-size:clamp(1rem,2vw,1.25rem);display:block;max-width:42rem;color:#d1d5db;line-height:1.7}
.hero-content p{max-width:42rem;color:var(--muted);line-height:1.7}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem}
.hero-orbit{
  position:absolute;
  z-index:2;
  right:1.25rem;
  top:1.25rem;
  max-width:260px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(14px);
  padding:1rem;
  display:grid;
  gap:.3rem;
  color:var(--muted);
}
.hero-orbit strong{color:var(--text)}
.quick-access{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.75rem;
  margin:1rem 0;
}
.quick-link{
  min-height:74px;
  display:flex;
  align-items:center;
  gap:.75rem;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:.85rem;
  background:rgba(15,23,42,.5);
  color:var(--text);
  box-shadow:var(--shadow);
  transition:transform .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease);
}
.quick-link:hover{transform:translateY(-3px);border-color:var(--line-bright);background:rgba(30,41,59,.68)}
.quick-link i{color:var(--cyan);font-size:1.1rem}
.quick-link span{font-weight:900}
.grid{display:grid;gap:1rem;margin:1rem 0;min-width:0}
.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.panel,.stat,.form-shell,.auth-card{
  min-width:0;
  background:var(--glass);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:1.05rem;
  box-shadow:var(--shadow);
  backdrop-filter:blur(12px);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
  animation:fadeInUp .25s var(--ease) both;
}
.panel:hover,.stat:hover,.card:hover,.list-card:hover{transform:translateY(-4px);border-color:var(--line-bright);box-shadow:0 20px 70px rgba(0,0,0,.35),0 0 20px rgba(99,102,241,.18)}
.panel h1,.panel h2,.form-shell h1{margin-top:0}
h1,h2,h3{letter-spacing:-.03em;font-weight:var(--heading-weight,900)}
h2{font-size:1.05rem}
h2 i{color:var(--cyan);margin-right:.45rem}
.section-head,.dashboard-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:1rem 0}
.dashboard-head h1{margin:.15rem 0 0;font-size:clamp(2.25rem,6vw,4.7rem);line-height:.92;letter-spacing:-.04em}
.context-line{display:inline-flex;color:var(--muted);font-weight:900;font-size:.88rem}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem}
.assignment-grid,.profile-grid,.achievement-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.masonry{columns:3 230px;column-gap:1rem}
.masonry .card{break-inside:avoid;margin:0 0 1rem}
.card,.list-card{
  min-width:0;
  border:1px solid var(--line);
  background:rgba(15,23,42,.58);
  border-radius:14px;
  padding:1rem;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease);
}
.card:hover,.list-card:hover{transform:translateY(-3px);background:rgba(30,41,59,.7)}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;margin-bottom:.9rem}
.profile-card img,.avatar-fallback{width:88px;height:88px;border-radius:24px;margin-bottom:1rem;object-fit:cover}
.avatar-fallback{display:grid;place-items:center;background:linear-gradient(135deg,rgba(99,102,241,.22),rgba(6,182,212,.12));border:1px solid var(--line);color:#c7d2fe;font-size:2rem}
.card h3{margin:.3rem 0}
.card p,.list-card p{color:var(--muted);line-height:1.65}
.card strong,.list-card strong,.mini-row span,.admin-user strong{overflow-wrap:anywhere}
.compact{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.hot{background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(15,23,42,.58))}
.row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem}
.pill{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  padding:.28rem .58rem;
  background:rgba(99,102,241,.16);
  color:#c7d2fe;
  border:1px solid rgba(99,102,241,.25);
  font-size:.72rem;
  font-weight:900;
}
.pill.cyan{background:rgba(6,182,212,.13);color:#a5f3fc;border-color:rgba(6,182,212,.24)}
.pill.emerald,.pill.penting{background:rgba(16,185,129,.13);color:#bbf7d0;border-color:rgba(16,185,129,.24)}
.pill.danger-pill{background:rgba(244,63,94,.13);color:#fecdd3;border-color:rgba(244,63,94,.24)}
.pill.biasa{background:rgba(156,163,175,.11);color:#d1d5db}
.mini-row{
  display:flex;
  gap:.9rem;
  align-items:center;
  border:1px solid transparent;
  border-bottom-color:var(--line);
  padding:.85rem 0;
}
.timeline{position:relative}
.timeline .mini-row{position:relative;padding-left:1.25rem;border-bottom:0}
.timeline .mini-row::before{content:"";position:absolute;left:.1rem;top:1.25rem;width:.55rem;height:.55rem;border-radius:999px;background:var(--cyan);box-shadow:0 0 20px rgba(6,182,212,.55)}
.timeline .mini-row::after{content:"";position:absolute;left:.35rem;top:1.85rem;bottom:-.6rem;width:1px;background:var(--line)}
.mini-row b{min-width:4rem;color:#c7d2fe;font-variant-numeric:tabular-nums}
.mini-row span{display:grid;gap:.18rem}
.chronicle-row{align-items:flex-start}
.chronicle-row p{margin:.35rem 0;color:var(--muted);line-height:1.6}
.schedule-day[hidden]{display:none}
.schedule-lesson::before{background:var(--subject-color,var(--cyan))!important;box-shadow:0 0 20px color-mix(in srgb,var(--subject-color,var(--cyan)) 55%,transparent)!important}
.schedule-lesson b small{display:block;color:var(--muted);font-weight:800;margin-top:.12rem}
.active-lesson{border-radius:14px;background:linear-gradient(135deg,rgba(16,185,129,.14),rgba(15,23,42,.54));padding-right:.75rem}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.45rem}
.calendar-grid>strong{color:var(--muted);font-size:.78rem;text-align:center}
.calendar-cell{min-height:112px;border:1px solid var(--line);border-radius:14px;background:rgba(15,23,42,.42);padding:.55rem;display:grid;align-content:start;gap:.4rem;min-width:0}
.calendar-cell.empty{opacity:.25}
.calendar-cell.today{border-color:rgba(16,185,129,.45);box-shadow:0 0 0 1px rgba(16,185,129,.12)}
.calendar-cell b{color:var(--text);font-size:.85rem}
.calendar-event{min-height:32px;width:100%;justify-content:flex-start;text-align:left;padding:.35rem .45rem;border-radius:9px;border-color:color-mix(in srgb,var(--event-color,var(--accent)) 34%,transparent);background:color-mix(in srgb,var(--event-color,var(--accent)) 14%,transparent);font-size:.72rem;overflow:hidden}
.calendar-detail{margin-top:1rem}
.mini-row small,.list-card small,.card small,.muted{color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chips span{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.22);color:#bbf7d0;padding:.45rem .7rem;border-radius:999px;font-weight:850}
.stack{display:grid;gap:.9rem}
.stack label{display:grid;gap:.45rem;font-weight:800;color:#d1d5db}
input,select,textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:.86rem .9rem;
  background:rgba(15,23,42,.62);
  color:var(--text);
  font:inherit;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease);
}
textarea{resize:vertical;min-height:9rem}
input::placeholder,textarea::placeholder{color:#727b8d}
input:focus,select:focus,textarea:focus{border-color:rgba(6,182,212,.75);box-shadow:0 0 0 4px rgba(6,182,212,.12);background:rgba(15,23,42,.86)}
input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.dropzone{
  position:relative;
  min-height:128px;
  display:grid!important;
  place-items:center;
  text-align:center;
  gap:.35rem!important;
  border:1px dashed rgba(6,182,212,.5);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(6,182,212,.08),rgba(99,102,241,.08));
  color:var(--text)!important;
  overflow:hidden;
}
.dropzone i{font-size:1.6rem;color:var(--cyan)}
.dropzone small{color:var(--muted)}
.compact-drop{min-height:56px;padding:.7rem}
.compact-drop small{display:none}
.grid-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;align-items:end;min-width:0}
.wide{grid-column:span 3}
.alert{border-radius:14px;padding:.9rem 1rem;margin:1rem 0;font-weight:850;border:1px solid var(--line);backdrop-filter:blur(12px)}
.alert.success{background:rgba(16,185,129,.14);color:#bbf7d0;border-color:rgba(16,185,129,.28)}
.alert.error{background:rgba(244,63,94,.14);color:#fecdd3;border-color:rgba(244,63,94,.28)}
.auth-body{min-height:100svh;display:grid;place-items:center;padding:1rem;background:#0b0f19}
.auth-card{width:min(440px,100%);position:relative}
.auth-card h1{font-size:2.3rem;margin:.8rem 0 .4rem;line-height:.95}
.auth-card p{color:var(--muted);line-height:1.6}
.back-link{display:inline-flex;gap:.5rem;color:#c7d2fe;font-weight:900}
.stat{position:relative;overflow:hidden;min-height:150px}
.stat::after{content:"";position:absolute;right:-2rem;top:-2rem;width:7rem;height:7rem;border-radius:999px;background:rgba(99,102,241,.16);filter:blur(6px)}
.stat span{color:var(--muted);font-weight:900}
.stat strong,.balance{display:block;font-size:clamp(1.35rem,4vw,2.45rem);margin-top:.45rem;line-height:1.1;letter-spacing:-.03em}
.stat>i{position:absolute;right:1rem;bottom:1rem;color:rgba(255,255,255,.16);font-size:2.6rem}
.glow-cyan::after{background:rgba(6,182,212,.18)}
.glow-emerald::after{background:rgba(16,185,129,.18)}
.glow-rose::after{background:rgba(244,63,94,.18)}
.meter{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:1.1rem}
.meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--emerald),var(--cyan))}
.meter.danger i{background:linear-gradient(90deg,var(--rose),var(--amber))}
.meter.indigo i{background:linear-gradient(90deg,var(--accent),var(--cyan))}
.finance-row{display:grid;grid-template-columns:1fr auto auto auto;gap:.9rem;align-items:center}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin-top:.8rem}
.actions.end{justify-content:flex-end}
.actions form{margin:0}
.danger{color:#fecdd3!important}
.danger-fill{background:linear-gradient(135deg,var(--rose),#be123c);border-color:rgba(254,205,211,.25)}
.edit-panel{margin:.75rem 0 1rem;padding:1rem;border:1px solid var(--line);border-radius:14px;background:rgba(7,10,17,.34);animation:fadeInUp .25s var(--ease) both}
.admin-user{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:.7rem;align-items:start}
.admin-user .edit-panel{grid-column:1/-1}
.manage-card .actions{margin:.9rem 0}
.responsive-list{display:grid;gap:.8rem;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--accent) transparent}
.scroll-table{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--cyan) transparent}
.notification-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center}
.notification-row.unread{background:linear-gradient(135deg,rgba(99,102,241,.16),rgba(15,23,42,.58))}
.empty-state{min-height:220px;display:grid;place-items:center;text-align:center;gap:.5rem;color:var(--muted);border:1px dashed var(--line);border-radius:var(--radius);padding:2rem}
.empty-state i{font-size:2rem;color:var(--cyan)}
.settings-group{border:1px solid var(--line);border-radius:14px;padding:.8rem;background:rgba(15,23,42,.38)}
.settings-group summary{cursor:pointer;font-weight:900;min-height:44px;display:flex;align-items:center}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin-top:.9rem}
.settings-grid label{min-width:0}
.settings-grid label>span{font-weight:900}
.settings-grid label>small{display:block;min-height:2.3em;color:var(--muted);line-height:1.35}
.inline-switch{margin-top:.35rem}
.settings-form textarea{min-height:7rem}
.muted-link{color:#c7d2fe;font-weight:900;text-align:center}
.confirm-modal[hidden]{display:none}
.confirm-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:1rem;opacity:0;transition:opacity .2s var(--ease)}
.confirm-modal.open{opacity:1}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58);backdrop-filter:blur(8px)}
.modal-card{position:relative;width:min(440px,100%);border:1px solid var(--line);border-radius:18px;background:rgba(22,27,38,.86);box-shadow:var(--shadow);padding:1.15rem;animation:scaleIn .25s var(--ease) both}
.modal-card h2{margin-top:0}.modal-card h2 i{color:var(--rose)}.modal-card p{color:var(--muted);line-height:1.6}
.toast{position:fixed;right:1rem;top:1rem;z-index:90;width:min(390px,calc(100% - 2rem));box-shadow:var(--shadow);animation:fadeInUp .25s var(--ease) both}
.toast-out{opacity:0;transform:translateY(-10px);transition:all .25s var(--ease)}
@keyframes fadeInUp{from{opacity:0;transform:translateY(12px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.amount{font-variant-numeric:tabular-nums}
.masuk{color:#86efac}.keluar{color:#fda4af}
.data-panel{display:grid;gap:.65rem}
.data-row{display:grid;gap:.25rem}
.switch{display:flex!important;grid-template-columns:none!important;align-items:center;gap:.75rem!important;color:var(--muted)!important;cursor:pointer}
.switch input{position:absolute;opacity:0;pointer-events:none}
.switch span{width:52px;height:30px;border-radius:999px;background:rgba(15,23,42,.9);border:1px solid var(--line);position:relative;transition:all .3s var(--ease)}
.switch span::after{content:"";position:absolute;width:22px;height:22px;border-radius:999px;left:3px;top:3px;background:#d1d5db;transition:all .3s var(--ease)}
.switch input:checked+span{background:rgba(16,185,129,.22);border-color:rgba(16,185,129,.5);box-shadow:0 0 20px rgba(16,185,129,.18)}
.switch input:checked+span::after{transform:translateX(22px);background:#bbf7d0}
.switch b{font-size:.9rem}
.link{display:grid;gap:.65rem}
@media (max-width:960px){
  .app-shell{display:block}
  .sidebar{position:fixed;left:max(.75rem,env(safe-area-inset-left));right:max(.75rem,env(safe-area-inset-right));bottom:max(.75rem,env(safe-area-inset-bottom));top:auto;height:auto;z-index:30;padding:.35rem;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow)}
  .sidebar .brand{display:none}
  .nav{display:flex;align-items:center;justify-content:flex-start;gap:.25rem;overflow-x:auto;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a,.nav button{display:grid;place-items:center;gap:.25rem;font-size:.68rem;padding:.55rem .65rem;border-radius:13px;min-height:50px;min-width:72px}
  .nav a i,.nav button i{width:auto}
  .topbar{top:.75rem;width:calc(100% - 1.5rem);margin:.75rem auto 0}
  .mobile-brand{display:grid}
  .topbar-status{display:none}
  .page{padding:.75rem .75rem calc(6.5rem + env(safe-area-inset-bottom))}
  .footer{padding:0 .75rem calc(6.5rem + env(safe-area-inset-bottom));display:grid}
  .two,.three,.grid-form{grid-template-columns:1fr}
  .settings-grid{grid-template-columns:1fr}
  .wide{grid-column:auto}
  .hero{min-height:58svh;border-radius:20px}
  .hero-content{padding:2rem 1.1rem}
  .hero-orbit{position:relative;right:auto;top:auto;margin:0 1rem 1rem;max-width:none}
  .section-head,.dashboard-head{align-items:flex-start;flex-direction:column}
  .finance-row{grid-template-columns:1fr}
  .admin-user{grid-template-columns:1fr}
  .notification-row{grid-template-columns:1fr}
  .actions{width:100%}.actions button,.actions .button,.actions form{width:100%}.actions button,.actions .button{justify-content:center}
  .list-card,.card{overflow:hidden}
  .toast{top:.75rem;right:.75rem;width:calc(100% - 1.5rem)}
  .panel,.stat,.form-shell{padding:.95rem}
  .masonry{columns:1}
  .quick-access{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calendar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calendar-grid>strong{display:none}
  .calendar-cell.empty{display:none}
  .calendar-cell{min-height:96px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}
