/* Dashboard component contract. Deliberately inert without data-dashboard.
   Palette: public/landing.css. Existing token names remain compatibility aliases. */
html[data-dashboard] .dash-question { position:fixed; inset:0; z-index:20000; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(27,28,26,.62); }
html[data-dashboard] .dash-question-box { width:min(480px,100%); padding:24px; border-radius:24px; background:var(--panel); color:var(--text); box-shadow:var(--shadow-md); max-height:calc(100dvh - 32px); overflow:auto; }
html[data-dashboard] .dash-question-box p { white-space:pre-wrap; overflow-wrap:anywhere; margin:16px 0; }
html[data-dashboard] .dash-question-actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end; }
html[data-dashboard] select.dash-select-native { position:absolute!important; width:1px!important; height:1px!important; min-height:0!important; padding:0!important; border:0!important; opacity:0; clip-path:inset(50%); pointer-events:none; }
html[data-dashboard] .dash-select-button { width:100%; min-height:44px; padding:11px 14px; border:1.5px solid var(--border); border-radius:14px; background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left; font:14px/1.5 var(--font); }
html[data-dashboard] .dash-select-button span { min-width:0; overflow-wrap:anywhere; }
html[data-dashboard] .dash-select-button:disabled { opacity:.6; cursor:not-allowed; }
html[data-dashboard] .dash-select-button[aria-invalid=true] { border-color:var(--red); }
html[data-dashboard] .dash-select-list { position:fixed; margin:0; inset:auto; z-index:15000; overflow:auto; background:var(--panel); color:var(--text); border:1px solid var(--border); border-radius:14px; padding:4px; box-shadow:var(--shadow-md); }
html[data-dashboard] .dash-select-option { min-height:44px; padding:11px 14px; border-radius:10px; cursor:pointer; overflow-wrap:anywhere; }
html[data-dashboard] .dash-select-option.active,html[data-dashboard] .dash-select-option:hover { background:var(--accent-pale); }
html[data-dashboard] .dash-select-option[aria-selected=true] { font-weight:700; color:var(--accent); }
html[data-dashboard] .dash-select-option[aria-disabled=true] { opacity:.5; cursor:not-allowed; }
html[data-dashboard] .dash-select-group { padding:8px 14px; font-weight:700; font-size:12px; color:var(--text-muted); }
html[data-dashboard] {
  --dash-ink:#1B1C1A; --dash-muted:rgba(27,28,26,.64);
  --dash-line:rgba(27,28,26,.10); --dash-surface:#FAF8F4;
  --dash-panel:#FFFFFF; --dash-soft:#F5F0E8;
  --dash-accent:#2D6A4F; --dash-deep:#22543D; --dash-tint:#EAF0EC;
  --dash-on-accent:#FFFFFF; --dash-dark-accent:#7CC2A2;
  --dash-shadow:0 1px 2px rgba(27,28,26,.04),0 4px 14px rgba(27,28,26,.05);
  font-family:'DM Sans',system-ui,sans-serif;
}
html[data-dashboard="org"] { --dash-accent:#8F4517; --dash-deep:#743713; --dash-tint:#F9EBDD; --dash-dark-accent:#E9944C; }
html[data-dashboard="district"] { --dash-accent:#0D5C55; --dash-deep:#08453F; --dash-tint:#E3F0ED; --dash-dark-accent:#83CFC4; }
html[data-dashboard="dev"] { --dash-accent:#1356A0; --dash-deep:#10467F; --dash-tint:#E8F0FA; --dash-dark-accent:#9BC9FA; }
html[data-dashboard="parent"] { --dash-accent:#8A6408; --dash-deep:#6D4E06; --dash-tint:#F7EACC; --dash-dark-accent:#E9B44C; }
html[data-dashboard] body {
  --font:'DM Sans',system-ui,sans-serif; --display:var(--font); --mono:'JetBrains Mono',monospace;
  --font-sans:var(--font); --font-mono:var(--mono);
  --bg:var(--dash-surface); --panel:var(--dash-panel); --panel2:var(--dash-soft);
  --bg-card:var(--panel); --card:var(--panel); --panel-hover:var(--dash-soft); --warm:var(--dash-soft);
  --text:var(--dash-ink); --ink:var(--dash-ink); --cream:var(--dash-ink);
  --text-muted:var(--dash-muted); --muted:var(--dash-muted); --muted-lt:var(--dash-muted); --ink-soft:var(--dash-muted);
  --border:var(--dash-line); --border-lt:var(--dash-line);
  --accent:var(--dash-accent); --accent-lt:var(--dash-deep); --accent-pale:var(--dash-tint);
  --green:#2D6A4F; --green-lt:#22543D; --green-pale:#EAF0EC; --forest:#2D6A4F;
  --gold:#8A6408; --gold-fill:#D4A017; --gold-pale:#F7EACC; --gold-dim:#F7EACC;
  --amber:#8F4517; --amber-lt:#8F4517; --red:#B3261E; --red-lt:#B3261E; --red-pale:#F9DEDC;
  --teal:#0D5C55; --cyan:var(--accent); --cyan-dim:var(--accent-pale);
  --p-accent:var(--accent); --p-accent-lt:var(--accent-lt); --p-accent-pale:var(--accent-pale);
  --d-accent:var(--accent); --d-accent-lt:var(--accent-lt); --d-accent-pale:var(--accent-pale);
  --login-accent:var(--accent); --login-accent-lt:var(--accent-lt); --login-accent-pale:var(--accent-pale);
  --glass-bg:var(--panel); --glass-border:var(--border); --radius:20px; --radius-sm:14px; --topbar-h:64px;
  --shadow:var(--dash-shadow); --shadow-md:0 2px 6px rgba(27,28,26,.05),0 14px 34px rgba(27,28,26,.10);
  color:var(--text); background:var(--bg); font-family:var(--font); line-height:1.5;
}
html[data-dashboard] body.dark {
  --dash-surface:#0D1A18; --dash-panel:#223A35; --dash-soft:#28433D;
  --dash-ink:#FAF8F4; --dash-muted:#B9CBC3; --dash-line:rgba(250,248,244,.24);
  --dash-accent:var(--dash-dark-accent); --dash-deep:var(--dash-dark-accent); --dash-tint:#28433D;
  --dash-on-accent:#0D1A18; --green:#7CC2A2; --green-lt:#7CC2A2; --green-pale:#28433D;
  --gold:#E9B44C; --amber:#E9944C; --amber-lt:#E9944C; --red:#FFB4AB; --red-lt:#FFB4AB; --red-pale:#482924; --teal:#83CFC4;
}
html[data-dashboard="parent"] body { --forest-50:var(--text); --forest-800:var(--panel-hover); --emerald-500:var(--accent); --teal-500:var(--accent); }
@media(prefers-color-scheme:dark) {
  html[data-dashboard] body:not(.light) {
    --dash-surface:#0D1A18; --dash-panel:#223A35; --dash-soft:#28433D;
    --dash-ink:#FAF8F4; --dash-muted:#B9CBC3; --dash-line:rgba(250,248,244,.24);
    --dash-accent:var(--dash-dark-accent); --dash-deep:var(--dash-dark-accent); --dash-tint:#28433D;
    --dash-on-accent:#0D1A18; --green:#7CC2A2; --green-lt:#7CC2A2; --green-pale:#28433D;
    --gold:#E9B44C; --amber:#E9944C; --amber-lt:#E9944C; --red:#FFB4AB; --red-lt:#FFB4AB; --red-pale:#482924; --teal:#83CFC4;
  }
}
html[data-dashboard], html[data-dashboard] body { overflow-x:visible; }
html[data-dashboard] *, html[data-dashboard] *::before, html[data-dashboard] *::after { box-sizing:border-box; }
html[data-dashboard] [hidden] { display:none!important; }
html[data-dashboard] :is(h1,h2,h3,h4,.section-title,.page-title,.login-heading) { font-family:var(--font); color:var(--text); }
html[data-dashboard] h1, html[data-dashboard] .page-title { font-size:24px; line-height:1.25; }
html[data-dashboard] h2, html[data-dashboard] .section-title { font-size:18px; line-height:1.4; }
html[data-dashboard] :is(button,input,select,textarea) { font-family:var(--font); }
html[data-dashboard] :is(button,.btn,.nav-item,.nav-link,.auth-tab,.term-btn,.cancel-link,.parent-btn) {
  min-height:44px; min-width:44px; touch-action:manipulation;
}
html[data-dashboard] :is(.btn,.btn-sm,.btn-sign-in,.btn-login,.parent-btn) {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:10px 18px; border-radius:999px; font-size:14px; font-weight:700;
  line-height:1.5; white-space:normal; text-decoration:none; max-width:100%; flex-shrink:0; overflow-wrap:normal; word-break:normal;
}
html[data-dashboard] :is(.btn-primary,.btn-green,.btn-sign-in,.btn-login,.auth-tab.active) {
  background:var(--accent); color:var(--dash-on-accent); border:1px solid transparent;
}
html[data-dashboard] :is(.btn-primary,.btn-green,.btn-sign-in,.btn-login):hover:not(:disabled) { background:var(--accent-lt); transform:none; }
html[data-dashboard] :is(.btn-outline,.btn-ghost,.btn-logout) { background:var(--panel); color:var(--text); border:1px solid var(--border); }
html[data-dashboard] .btn-gold { background:#D4A017; color:#1B1C1A; }
html[data-dashboard] .btn-red { background:#B3261E; color:#FFFFFF; }
html[data-dashboard] .btn-success { background:#2D6A4F; color:#FFFFFF; }
html[data-dashboard] :is(.btn,.nav-item):hover { border-radius:999px; transform:none; }
html[data-dashboard] :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]),select,textarea) {
  width:100%; min-width:0; min-height:44px; max-width:100%; padding:11px 14px;
  border:1.5px solid var(--border); border-radius:14px; background:var(--panel); color:var(--text);
  font-size:14px; line-height:1.5; margin-bottom:0;
}
html[data-dashboard] textarea { min-height:96px; resize:vertical; }
html[data-dashboard] :is(input,select,textarea)::placeholder { color:var(--text-muted); opacity:1; }
html[data-dashboard] :is(input[type=checkbox],input[type=radio]) { width:20px; height:20px; min-width:20px; min-height:20px; padding:0; accent-color:var(--accent); flex:none; }
html[data-dashboard] label:has(> input:is([type=checkbox],[type=radio])) { display:inline-flex; align-items:center; gap:10px; min-height:44px; cursor:pointer; }
html[data-dashboard] :is(.field,.form-group) { min-width:0; margin-bottom:20px; }
html[data-dashboard] :is(.field,.form-group) > label { display:block; font:600 13px/1.5 var(--font); color:var(--text-muted); margin-bottom:8px; opacity:1; }
html[data-dashboard] :focus-visible { outline:3px solid var(--accent)!important; outline-offset:2px; }
html[data-dashboard] :is(input,select,textarea):focus { border-color:var(--accent); }
html[data-dashboard] :is(.card,.panel,.stat,.stat-card,.section-box,.school-card,.sc-card,.game-card,.plan-card,.auth-card,.login-card,.lang-card,.kid-card,.game-tile) {
  border-radius:20px; background:var(--panel); color:var(--text); border:1px solid var(--border); box-shadow:var(--shadow);
}
html[data-dashboard] :is(.card-hdr,.panel-hdr) { padding:16px 24px; flex-wrap:wrap; gap:12px; }
html[data-dashboard] :is(.card-body,.panel-body,.section-box) { padding:24px; }
html[data-dashboard] :is(.main,.container,.orders,.commercial,.layout,.card-body,.panel-body,.form-row,.grid-2,.two-col,.order-grid,.fields,.setting-row) { min-width:0; }
html[data-dashboard] :is(.main,.container,.orders,.commercial) { overflow-x:visible; overflow-wrap:anywhere; }
html[data-dashboard] .main { flex:1; }
html[data-dashboard] :is(.stat-label,.nav-section) { opacity:1; color:var(--text-muted); }
html[data-dashboard] .topbar-title { min-width:0; }
html[data-dashboard] .dash-brand + .topbar-title:not([id]) { display:none; }
html[data-dashboard] .setting-row-header > :is(input,select) { flex:1 1 160px; }
html[data-dashboard] .setting-row-header > button { flex:none; }
html[data-dashboard] .dash-auth-logo { display:block; }
html[data-dashboard-auth] body { padding:24px 16px; }
html[data-dashboard-auth] .auth-wrap { flex-direction:column; }
html[data-dashboard] :is(.modal,.modal-box,.modal-content) .form-row:has(> .field[hidden]):not(:has(> .field:not([hidden]))) { display:none; }
html[data-dashboard] :is(.login-logo,.login-brand,.apply-logo) { text-align:center; }
html[data-dashboard] :is(.stat-label,.stat-num,.page-sub,.nav-label,.nav-section-label,.badge,.sc-cell-label) { font-family:var(--font); }
html[data-dashboard] .btn-teal { background:var(--accent-pale); color:var(--accent); border:1px solid var(--border); }
html[data-dashboard] .stat.teal .stat-num { color:var(--teal); }
html[data-dashboard] .stat.gold .stat-num { color:var(--gold); }
html[data-dashboard] .stat.green .stat-num { color:var(--green); }
html[data-dashboard] :is(.nav-item.active,.child-tab.active) { background:var(--accent-pale); color:var(--accent); border-radius:999px; }
html[data-dashboard] .dash-legacy-menu { display:none; }
html[data-dashboard] :is(.form-row,.grid-2,.two-col,.order-grid,.fields) > * { min-width:0; }
html[data-dashboard] :is(.filter-row,.search-bar,.modal-actions,.form-actions,.setting-row-header) { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
html[data-dashboard] .page-hdr > div:has(> .btn) { display:flex; flex-wrap:wrap; gap:12px; }
html[data-dashboard] .gc-actions { display:flex; flex-wrap:wrap; gap:8px; }
html[data-dashboard] .gc-cell:has(> .btn) { display:flex; flex-wrap:wrap; gap:8px; }
html[data-dashboard] :is(.page-hdr,.card-hdr,.sc-header,.gc-header) { overflow-wrap:normal; }
html[data-dashboard] .badge { overflow-wrap:normal; word-break:normal; white-space:nowrap; }
html[data-dashboard] :is(.filter-row,.search-bar) > :is(input,select) { width:auto; flex:1 1 180px; }
html[data-dashboard] :is(.t-wrap,.dash-table-scroll) { overflow:auto; max-width:100%; border:1px solid var(--border); border-radius:14px; }
html[data-dashboard] table { width:100%; border-collapse:collapse; background:var(--panel); color:var(--text); }
html[data-dashboard] th { font:700 12px/1.5 var(--font); color:var(--text-muted); background:var(--panel-hover); white-space:nowrap; }
html[data-dashboard] :is(th,td) { padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); word-break:normal; min-width:100px; }
html[data-dashboard] td { font-size:14px; overflow-wrap:break-word; }
html[data-dashboard] :is(td.mono,code,pre,.code-editor,.key-reveal,.token-box) { font-family:var(--mono); }
html[data-dashboard] :is(.token-box,.token-warn,.result-msg,.callout) { border-radius:14px; }
html[data-dashboard] :is(.code-block,.code-editor,.key-reveal) { background:#0D1A18; color:#E2EDE9; border-radius:14px; }
html[data-dashboard] .dash-icon { width:20px; height:20px; flex:none; display:inline-block; vertical-align:middle; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
html[data-dashboard] :is(.material-symbols-outlined,.material-symbols-rounded,.ms-icon) { font-size:0!important; display:inline-flex; align-items:center; justify-content:center; flex:none; }
html[data-dashboard] .nav-icon .dash-icon { width:24px; height:24px; }
html[data-dashboard] .dash-brand { display:flex; align-items:center; gap:12px; min-height:44px; text-decoration:none; flex-shrink:0; color:var(--text); }
html[data-dashboard] .dash-brand img { display:block; height:32px!important; width:auto; max-width:180px; object-fit:contain; filter:none; margin:0!important; }
html[data-dashboard] body.dark .dash-brand img { background:#FAF8F4; border-radius:6px; }
@media(prefers-color-scheme:dark) { html[data-dashboard] body:not(.light) .dash-brand img { background:#FAF8F4; border-radius:6px; } }
html[data-dashboard] .dash-brand-label { font:600 14px/1.3 var(--font); color:var(--text-muted); }
html[data-dashboard] :is(.topbar,.parent-nav) { min-height:64px; height:auto; padding:10px 24px; gap:12px; background:var(--panel); border-bottom:1px solid var(--border); }
html[data-dashboard] :is(.login-brand-logo,.auth-logo img,.apply-logo img,.dash-auth-logo) { height:40px!important; width:auto; max-width:100%; object-fit:contain; filter:none; margin:0 auto 16px!important; }
html[data-dashboard] :is(.login-wrap,.auth-card) { max-width:460px; width:100%; }
html[data-dashboard] :is(.login-card,.auth-card) { padding:32px; }
html[data-dashboard] :is(.pw-reveal,.login-theme-toggle,.modal-close,.modal-close-btn,.theme-toggle) { width:44px; height:44px; min-width:44px; min-height:44px; padding:10px; flex:none; }
html[data-dashboard] .pw-reveal { right:2px; }
html[data-dashboard] .pw-wrap input { padding-right:50px!important; }
html[data-dashboard] :is(.modal-bg,.modal-overlay,#pin-overlay) { padding:16px; background:rgba(27,28,26,.62); z-index:1000; overflow-y:auto; }
html[data-dashboard] :is(.modal,.modal-box,.modal-content,.pin-box) {
  border-radius:24px; background:var(--panel); color:var(--text); border:1px solid var(--border);
  max-width:calc(100vw - 32px); max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px); overflow:auto; margin:0;
}
html[data-dashboard] :is(.modal-hdr,.modal-header,.modal-head) { background:var(--panel); color:var(--text); gap:12px; }
html[data-dashboard] :is(.modal-hdr,.modal-header) { position:sticky; top:0; z-index:1; padding:16px 24px; }
html[data-dashboard] .modal-actions { padding:16px 24px; margin:0; }
html[data-dashboard] .dash-dialog-actions { flex-wrap:wrap; gap:12px; padding:16px; }
html[data-dashboard] .dash-dialog-actions > .btn { flex:1 1 140px; }
html[data-dashboard] :is(.modal-title,.modal-head h3,.pin-box h2) { font:700 18px/1.4 var(--font); }
html[data-dashboard] .dash-skip { position:fixed; top:-100px; left:16px; z-index:3000; padding:12px; background:var(--panel); color:var(--text); }
html[data-dashboard] .dash-skip:focus { top:12px; }
@media(max-width:768px) {
  html[data-dashboard] :is(.main,.container,.orders,.commercial) { padding:20px 16px; }
  html[data-dashboard] :is(.card-body,.panel-body,.section-box,.auth-card,.login-card) { padding:16px; }
  html[data-dashboard] :is(.topbar,.parent-nav) { padding:10px 16px; flex-wrap:wrap; }
  html[data-dashboard] .dash-brand-label { font-size:12px; }
  html[data-dashboard] .dash-brand img { max-width:145px; }
  html[data-dashboard] :is(.form-row,.grid-2,.two-col,.order-grid,.fields,.type-grid) { grid-template-columns:minmax(0,1fr); }
  html[data-dashboard] .stat-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  html[data-dashboard] .stat { min-width:0; padding:16px; }
  html[data-dashboard] .stat-label { overflow-wrap:normal; word-break:normal; font-size:12px; }
  html[data-dashboard] :is(.modal,.modal-box,.modal-content,.pin-box) { border-radius:24px; }
  html[data-dashboard] :is(.modal-hdr,.modal-header,.modal-body,.modal-actions) { padding:16px; }
  html[data-dashboard] .topbar-right { flex-wrap:wrap; }
  html[data-dashboard] .topbar { flex-wrap:wrap; }
  html[data-dashboard] .topbar .dash-brand { gap:8px; flex-shrink:0; min-width:0; }
  html[data-dashboard] .topbar .dash-brand-label { max-width:80px; white-space:normal; }
  html[data-dashboard] .topbar .topbar-right { gap:4px; flex-wrap:nowrap; }
  html[data-dashboard] .topbar .topbar-title[id] { order:3; flex:1 1 100%; width:auto; max-width:100%; margin:0; white-space:normal; }
  html[data-dashboard] .topbar > :is(#tb-orgname,#tb-orgtype,#tb-games,#tb-schools,.topbar-status) { order:3; flex:1 1 auto; white-space:normal; }
  html[data-dashboard] .topbar-right { margin-left:auto; }
  html[data-dashboard] .topbar .btn { padding:10px; white-space:nowrap; }
  html[data-dashboard] .topbar-right .badge { font-size:10px; padding:2px 6px; }
  html[data-dashboard] .dash-legacy-menu { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:999px; background:var(--panel); color:var(--text); }
  html[data-dashboard] .dash-legacy-sidebar { display:block; position:fixed; top:64px; bottom:0; left:0; width:240px; height:calc(100vh - 64px); padding:16px; overflow:auto; z-index:200; transform:translateX(-100%); background:var(--panel); }
  html[data-dashboard] .dash-legacy-sidebar.mob-open { transform:none; }
  html[data-dashboard] .dash-legacy-sidebar .nav-item { width:100%; display:flex; align-items:center; gap:10px; padding:10px 14px; font:600 14px/1.5 var(--font); border:0; text-align:left; }
  html[data-dashboard] .dash-legacy-sidebar :is(.nav-label,.nav-section-label) { display:block; padding:12px 0; font:600 12px/1.5 var(--font); }
  html[data-dashboard] .sidebar:not(.mob-open) { visibility:hidden; }
  html[data-dashboard] .sidebar.mob-open { visibility:visible; }
}
@media(prefers-reduced-motion:reduce) { html[data-dashboard] *,html[data-dashboard] *::before,html[data-dashboard] *::after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; } }
