

.student-ui {
  --c-canvas: #fbfaf7;
  --c-ink: #1b1916;
  --c-ink-soft: #3d3933;
  --c-muted: #5d584f;
  --c-border: #e7e2d8;
  --control-line: #8b857b;
  --page-bg: var(--c-canvas);
  --surface: #ffffff;
  --surface-2: #f4f1eb;
  --surface-3: #ece8e0;
  --text: var(--c-ink); --text-soft: var(--c-ink-soft); --text-muted: var(--c-muted);
  --primary-bg: var(--c-ink); --primary-fg: #ffffff;
  --focus: var(--c-ink);
  --link: var(--c-ink);
  --shadow-float: 0 0 0 1px rgba(27, 25, 22, .08), 0 12px 28px -16px rgba(27, 25, 22, .3);
  --shadow-lift: 0 18px 34px -22px rgba(27, 25, 22, .38);
  --shadow-card: var(--shadow-lift); --shadow-btn: none; --shadow-solid: none;

  --subj-math-pastel: #ece6fd; --subj-physics-pastel: #ffe8d6; --subj-chemistry-pastel: #fce4ef;
  --subj-biology-pastel: #dcf3e8; --subj-general-pastel: #e6ebff;

  --font-heading: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-body: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  --type-hero: 400 clamp(2.5rem, 1.9rem + 2.6vw, 4.25rem)/1 var(--font-heading);
  --type-h1:   400 clamp(2.5rem, 2rem + 2vw, 3.75rem)/1.02 var(--font-heading);
  --type-h2:   400 clamp(1.75rem, 1.5rem + .9vw, 2.125rem)/1.08 var(--font-heading);
  --type-h3:   600 1.0625rem/1.3 var(--font-body);
  --type-lead: 400 1.0625rem/1.55 var(--font-body);
  --type-body: 400 1rem/1.55 var(--font-body);
  --type-meta: 400 .875rem/1.5 var(--font-body);
  --type-label: 600 .875rem/1.35 var(--font-body);
  --type-tag:  600 .8125rem/1.2 var(--font-body);
  --type-num:  400 2.25rem/1 var(--font-heading);
  --track-hero: -.02em; --track-head: -.015em;
  --radius-card: 18px; --radius-btn: 999px; --radius-control: 12px;
  font-synthesis: none;

  --c-blue: var(--c-ink); --c-blue-dark: var(--c-ink); --c-blue-ink: var(--c-ink);
  --c-blue-soft: var(--surface-2); --c-blue-line: var(--c-border);
  --accent: var(--c-ink); --accent-soft: var(--surface-2);
}

:root[data-theme="dark"] .student-ui {
  --c-canvas: #141312;
  --c-ink: #efece6;
  --c-ink-soft: #d6d1c8;
  --c-muted: #b2aca2;
  --c-border: #2f2c28;
  --control-line: #7a746a;
  --surface: #1d1c1a;
  --surface-2: #262421;
  --surface-3: #312e2a;
  --primary-bg: #efece6; --primary-fg: #161513;
  --focus: #efece6;
  --shadow-float: 0 0 0 1px rgba(255, 255, 255, .07), 0 12px 28px -12px rgba(0, 0, 0, .7);
  --shadow-lift: 0 18px 34px -18px rgba(0, 0, 0, .8);

  --subj-math: #bcaeff;      --subj-math-soft: #221e33;      --subj-math-deep: #cfc4ff;      --subj-math-pastel: #2b2545;
  --subj-physics: #ffb07e;   --subj-physics-soft: #2a1e16;   --subj-physics-deep: #ffc7a3;   --subj-physics-pastel: #38261a;
  --subj-chemistry: #f6a0c4; --subj-chemistry-soft: #2b1b23; --subj-chemistry-deep: #f9bcd5; --subj-chemistry-pastel: #3a2130;
  --subj-biology: #76d9ad;   --subj-biology-soft: #13271f;   --subj-biology-deep: #9ae4c3;   --subj-biology-pastel: #17342a;
  --subj-general: #9db4ff;   --subj-general-soft: #1b2135;   --subj-general-deep: #b9caff;   --subj-general-pastel: #222b47;
  --c-blue: var(--c-ink); --c-blue-dark: var(--c-ink); --c-blue-soft: var(--surface-2); --c-blue-line: var(--c-border); --c-blue-ink: var(--c-ink);
  --c-green: #6fd6a0; --c-green-soft: #142a1f; --c-green-line: #2c5a43;
  --c-error: #ff9a8b; --c-error-soft: #2e1814; --c-error-line: #5c2c24;
  --c-warn-soft: #2c2412; --c-warn-line: #5a4920; --c-warn-ink: #f2cf7a;
}
:root[data-theme="dark"] body:has(.student-ui) { background: #141312; }

.student-ui { background: var(--page-bg) !important; color: var(--text); }
.student-ui ::selection { background: color-mix(in srgb, var(--subj-math, #6a3fd1) 26%, transparent); }
.student-ui :where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible,
.student-ui .skip-link:focus-visible { outline-color: var(--focus) !important; box-shadow: 0 0 0 5px var(--page-bg); }
.student-ui h1, .student-ui .page-title { font: var(--type-h1); letter-spacing: var(--track-head); }
.student-ui h2, .student-ui .section-title { font: var(--type-h2); letter-spacing: -.01em; }
.student-ui h3, .student-ui .item-title { font: var(--type-h3); }
.student-ui .lead { color: var(--text-muted); }
.student-ui .crumbs a, .student-ui .text-link, .student-ui .prose a { color: var(--link); }
.student-ui .meta { color: var(--text-muted); }
@media (max-width: 767px) {
  .student-ui h1, .student-ui .page-title { font-size: 2.5rem; }
  .student-ui h2, .student-ui .section-title { font-size: 1.75rem; }
}

.student-ui > .topbar {
  min-height: 72px; gap: 14px; background: var(--page-bg) !important; border-bottom: 1px solid var(--c-border) !important;
}
.student-ui .topnav { display: none; }
@media (min-width: 1024px) {
  .student-ui .topnav {
    display: flex; gap: 2px; padding: 4px; margin: 0 auto; border-radius: 999px;
    background: var(--surface); border: 1px solid var(--c-border);
  }
  .student-ui .topnav a {
    display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px;
    color: var(--text-soft); font: 500 .9375rem/1 var(--font-body); text-decoration: none;
  }
  .student-ui .topnav a:hover { background: var(--surface-2); color: var(--text); }
  .student-ui .topnav a[aria-current="page"] { background: var(--primary-bg); color: var(--primary-fg); }
  .student-ui > .topbar .flex1 { display: none; }
  .student-ui:not(.focus-shell) .stage > .leftnav { display: none !important; }
  .student-ui .stage > .nav-backdrop { display: none !important; }
}
.student-ui .topbar .balance-link { background: var(--surface); border-color: var(--c-border); color: var(--text); min-height: 40px; padding: 4px 14px; }
.student-ui .topbar .balance-link .ic { color: #a87400; }
:root[data-theme="dark"] .student-ui .topbar .balance-link .ic { color: #ffd166; }
.student-ui .topbar .help-link { color: var(--text-soft); }
.student-ui .topbar .help-link:hover, .student-ui .icon-btn:hover { background: var(--surface-2); }
.student-ui .profile .av { background: var(--subj-math-pastel); color: var(--subj-math-deep); border: 0; }
.student-ui .profile-menu { background: var(--surface) !important; border: 0 !important; box-shadow: var(--shadow-float) !important; border-radius: 16px; }
.student-ui .pm-item { color: var(--text); }
.student-ui .pm-item:hover { background: var(--surface-2); }
.student-ui .leftnav { background: var(--surface) !important; border-right-color: var(--c-border) !important; }
.student-ui .navitem[aria-current="page"] { background: var(--primary-bg) !important; color: var(--primary-fg) !important; }
.student-ui .navitem[aria-current="page"] .ic { color: var(--primary-fg); }
.student-ui .navitem:hover { background: var(--surface-2) !important; }
.student-ui .content { background: var(--page-bg) !important; padding-top: 36px !important; }
.student-ui .page { max-width: 1240px; gap: 40px; }

@media (max-width: 1023px) { .student-ui > .topbar > .public-brand { margin-right: auto; } }

@media (max-width: 767px) {
  .student-ui > .topbar { min-height: 60px; }
  .student-ui .bottomnav {
    left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); padding: 5px; min-height: 0;
    border-radius: 999px; border: 0; background: var(--surface); box-shadow: var(--shadow-float);
  }
  .student-ui .bottomnav a, .student-ui .bottomnav button { min-height: 52px; border-radius: 999px; color: var(--text-soft); font: 500 .6875rem/1.2 var(--font-body); }
  .student-ui .bottomnav [aria-current="page"] { background: var(--primary-bg); color: var(--primary-fg); }
  .student-ui .bottomnav [aria-current="page"] .ic { width: 22px; height: 22px; padding: 0; background: none; color: var(--primary-fg); }
  .student-ui .content { padding-bottom: calc(var(--nav-h) + 48px + env(safe-area-inset-bottom, 0px)) !important; }
}

.student-ui .btn {
  min-height: 44px; padding: 10px 18px !important; border: 1px solid var(--c-border) !important; border-radius: 999px !important;
  background: var(--surface) !important; color: var(--text) !important; font: 600 .9375rem/1.25 var(--font-body) !important;
}
.student-ui .btn:hover { background: var(--surface-2) !important; }
.student-ui .btn-solid, .student-ui .btn.primary, .student-ui .btn.btn-on-color {
  background: var(--primary-bg) !important; border-color: var(--primary-bg) !important; color: var(--primary-fg) !important; font-weight: 600 !important;
}
.student-ui .btn-solid:hover, .student-ui .btn.primary:hover, .student-ui .btn.btn-on-color:hover {
  background: color-mix(in srgb, var(--primary-bg) 86%, var(--page-bg)) !important; border-color: transparent !important;
}
.student-ui .btn-quiet { background: transparent !important; border-color: transparent !important; color: var(--text) !important; text-decoration: underline; text-underline-offset: 3px; }
.student-ui .btn-quiet:hover { background: var(--surface-2) !important; }
.student-ui .btn-lg { min-height: 52px; padding: 12px 24px !important; }
.student-ui .btn:disabled, .student-ui .btn[aria-disabled="true"] { background: var(--surface-3) !important; border-color: transparent !important; color: var(--text-muted) !important; }
.student-ui .link-on-color { color: var(--text); }
.student-ui .chip { border-color: var(--c-border); background: var(--surface); color: var(--text); font-weight: 500; }
.student-ui .chip[aria-pressed="true"], .student-ui .chip[aria-current="true"] { background: var(--primary-bg); border-color: var(--primary-bg); color: var(--primary-fg); }
.student-ui .subj-chip { background: var(--surface); border: 1px solid var(--c-border); color: var(--text); font-weight: 500; }
.student-ui .subj-chip .subj-glyph, .student-ui .subj-chip .ic { color: var(--subj-deep); }
.student-ui .subj-chip:hover { background: var(--subj-soft); }
.student-ui .subj-chip[aria-pressed="true"] { background: var(--primary-bg); border-color: var(--primary-bg); color: var(--primary-fg); box-shadow: none; }
.student-ui .subj-chip[aria-pressed="true"] .subj-glyph, .student-ui .subj-chip[aria-pressed="true"] .ic { color: var(--primary-fg); }
.student-ui .choice { background: var(--surface); border-color: var(--control-line); }
.student-ui .choice:has(input:checked) { border-color: var(--text); background: var(--surface-2); color: var(--text); box-shadow: inset 0 0 0 1px var(--text); }
.student-ui .choice input { accent-color: var(--text); }
.student-ui .input, .student-ui .field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), .student-ui .field select, .student-ui .field textarea,
.student-ui .search input, .student-ui input[type="search"] {
  background: var(--surface); color: var(--text); border-color: var(--control-line); border-radius: var(--radius-control);
}

.student-ui .card, .student-ui .panel, .student-ui .ui-state, .student-ui .stat {
  background: var(--surface) !important; border-color: var(--c-border) !important; border-radius: var(--radius-card);
}
.student-ui .card-dim { background: var(--surface-2) !important; }
.student-ui .row-item { border-bottom-color: var(--c-border); }
.student-ui a.row-item:hover .item-title { color: var(--text); }
.student-ui .row-icon { background: var(--surface-2); color: var(--text); }
.student-ui .status { background: var(--surface-2); border-color: var(--c-border); color: var(--text-soft); font-weight: 600; }
.student-ui .status.is-current { background: var(--surface-2); color: var(--text); border-color: var(--control-line); }
.student-ui .progress-track { background: var(--surface-3); }
.student-ui .progress-track > i { background: var(--text); }
.student-ui [class*="subj-"] .progress-track > i { background: var(--subj); }
.student-ui .skeleton { background: linear-gradient(90deg, var(--surface-2), var(--surface-3), var(--surface-2)); background-size: 200% 100%; }
.student-ui .pring-track { stroke: var(--surface-3); }
.student-ui .pring-fill { stroke: var(--text); }
.student-ui .pring-num { font: 400 calc(var(--ring-size, 56px) * .32)/1 var(--font-heading); }
.student-ui .subj-pill, .student-ui .grade-pill { background: var(--surface); }
.student-ui [class*="subj-"] { --subj-line: color-mix(in srgb, var(--subj, var(--c-blue)) 20%, transparent); }
.student-ui .subj-motif { opacity: .32; }
:root[data-theme="dark"] .student-ui .subj-motif { opacity: .5; }

.student-ui .poster {
  position: relative; overflow: hidden; border-radius: var(--radius-card); background: var(--subj-pastel); color: var(--text);
  box-shadow: inset 0 0 0 1px var(--subj-line);
}
.student-ui .chapter-cover, .student-ui .subject-tile, .student-ui .resume-hero, .student-ui .chapter-hero, .student-ui .promise-tile {
  background: var(--subj-pastel) !important; border-color: var(--subj-line) !important;
}
.student-ui .subject-tile-ico { background: var(--surface); }
.student-ui .subject-tile-name, .student-ui .chapter-card .item-title { font: 400 1.5rem/1.1 var(--font-heading); }
.student-ui .stat-txt b { font-weight: 400; }

:root[data-theme="dark"] .student-ui :is(.bottomnav, .leftnav, .profile-menu, .cookie-bar, .dialog, dialog, .modal, .sheet, .toast) {
  background: var(--surface) !important; color: var(--text);
}
:root[data-theme="dark"] .student-ui .start-card { background: var(--surface-2) !important; border-color: var(--control-line) !important; }

@media (prefers-reduced-motion: reduce) {
  .student-ui .btn, .student-ui .poster { transition: none !important; }
}

.student-ui .plain-list { list-style: none; margin: 0; padding: 0; }
.student-ui .home-head .lead { margin-top: 10px; max-width: none; }
.student-ui .sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; }
.student-ui .sec-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--text); font-weight: 600; font-size: .9375rem; text-decoration: none; }
.student-ui .sec-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.student-ui .sec-link .ic { width: 16px; height: 16px; }

.student-ui .glance { display: grid; grid-template-columns: minmax(0, 4fr) minmax(250px, 1.2fr); gap: 14px; }
.student-ui .glance-subjects { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.student-ui .season { display: flex; flex-direction: column; min-height: 248px; height: 100%; padding: 18px; text-decoration: none; transition: transform 180ms cubic-bezier(.2,.7,.3,1), box-shadow 180ms; }
.student-ui .season:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px var(--subj-line), var(--shadow-lift); }
.student-ui .season .subj-motif { inset: 0 -30% auto auto; width: 130%; height: 62%; }
.student-ui .season-pct { position: relative; font: 400 1.375rem/1 var(--font-heading); color: var(--subj-deep); }
.student-ui .season-name { position: relative; margin-top: auto; font: 400 2rem/1.05 var(--font-heading); color: var(--text); }
.student-ui .season-meta { position: relative; margin-top: 6px; font-size: .8125rem; color: var(--text-soft); }
.student-ui .season .progress-track { position: relative; flex: none; margin-top: 12px; height: 4px; min-width: 0; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.student-ui .week-panel { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .week-total { display: flex; flex-direction: column; gap: 2px; }
.student-ui .week-total .big { font: 400 2.75rem/1 var(--font-heading); }
.student-ui .week-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; }
.student-ui .week-facts dt { font-size: .8125rem; color: var(--text-muted); order: 2; }
.student-ui .week-facts div { display: flex; flex-direction: column; }
.student-ui .week-facts dd { margin: 0; font: 400 1.75rem/1.1 var(--font-heading); }
.student-ui .week-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; margin-top: auto; }
.student-ui .week-days li { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.student-ui .day-cell { width: 100%; aspect-ratio: 1; border-radius: 7px; background: var(--surface-3); }
.student-ui .week-days li.on .day-cell { background: var(--text); }
.student-ui .week-days li.today .day-cell { outline: 2px solid var(--text); outline-offset: 2px; }
.student-ui .day-name { font-size: .75rem; font-weight: 600; color: var(--text-muted); }
.student-ui .week-days li.today .day-name { color: var(--text); }

.student-ui .billboard { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 340px; border-radius: 22px; overflow: hidden; background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .bb-text { display: flex; flex-direction: column; gap: 12px; padding: 36px 40px; min-width: 0; }
.student-ui .bb-meta { display: flex; align-items: flex-start; gap: 8px; margin: 0; font-size: .9375rem; line-height: 1.5; font-weight: 500; color: var(--text-soft); }
.student-ui .bb-meta .dot { width: 8px; height: 8px; margin-top: calc(.75em - 4px); border-radius: 50%; background: var(--subj); flex-shrink: 0; }
.student-ui .bb-title { font: var(--type-hero); letter-spacing: var(--track-hero); margin: 4px 0 0; color: var(--text); text-wrap: balance; }
.student-ui .billboard .actions { margin-top: auto; padding-top: 10px; }
.student-ui .bb-art { border-radius: 0; box-shadow: none; min-height: 220px; }
.student-ui .bb-art .subj-motif { opacity: .55; inset: 10% 17% 24% 8%; width: auto; height: auto; overflow: visible; }
.student-ui .bb-parts { position: absolute; left: 24px; right: 24px; bottom: 24px; display: flex; gap: 6px; }
.student-ui .bb-parts i { flex: 1; height: 5px; border-radius: 3px; background: color-mix(in srgb, var(--surface) 80%, transparent); }
.student-ui .bb-parts i.on { background: var(--subj-deep); }
.student-ui .bb-parts i.now { background: linear-gradient(90deg, var(--subj-deep) 45%, color-mix(in srgb, var(--surface) 80%, transparent) 45%); }

.student-ui .plan { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.student-ui .plan-item { display: flex; align-items: flex-start; gap: 16px; height: 100%; padding: 12px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); color: var(--text); text-decoration: none; transition: border-color 160ms, box-shadow 160ms; }
.student-ui .plan-item:hover { border-color: var(--control-line); }
.student-ui .plan-thumb { width: 88px; height: 88px; flex-shrink: 0; border-radius: 14px; }
.student-ui .plan-thumb .subj-motif { width: 180%; left: -40%; opacity: .5; }
.student-ui .plan-when { position: absolute; left: 8px; top: 8px; padding: 2px 9px; border-radius: 999px; background: var(--surface); color: var(--subj-deep); font: 600 .75rem/1.4 var(--font-body); }
.student-ui .plan-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.student-ui .plan-title { font: 400 1.5rem/1.1 var(--font-heading); }
.student-ui .plan-min { margin-top: 6px; white-space: nowrap; font-size: .8125rem; color: var(--text-muted); }
.student-ui .plan-min .num { font: 400 1.5rem/1 var(--font-heading); color: var(--text); }

.student-ui .revisit-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.student-ui .activity { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); column-gap: 32px; padding: 6px 22px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .activity li { border-bottom: 1px solid var(--c-border); }
.student-ui .activity li:nth-last-child(-n+2):nth-child(odd), .student-ui .activity li:last-child { border-bottom: 0; }
.student-ui .act-row { display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 10px 0; color: var(--text); text-decoration: none; }
.student-ui .act-row:hover .act-title { text-decoration: underline; text-underline-offset: 3px; }
.student-ui .act-thumb { width: 48px; height: 48px; flex-shrink: 0; border-radius: 12px; display: grid; place-items: center; color: var(--subj-deep); }
.student-ui .act-thumb .subj-glyph { width: 22px; height: 22px; }
.student-ui .act-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.student-ui .act-title { font-weight: 600; }
.student-ui .act-score { margin-left: auto; flex-shrink: 0; padding-left: 12px; font: 400 1.5rem/1 var(--font-heading); }
.student-ui .activity li { min-width: 0; }

@media (max-width: 1100px) {
  .student-ui .glance { grid-template-columns: 1fr; }
  .student-ui .plan { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .student-ui .glance-subjects { display: flex; overflow-x: auto; margin: 0 calc(-1 * var(--page-gutter)); padding: 2px var(--page-gutter) 6px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .student-ui .glance-subjects li { flex: 0 0 150px; scroll-snap-align: start; }
  .student-ui .season { min-height: 200px; padding: 14px; }
  .student-ui .season-name { font-size: 1.625rem; }
  .student-ui .billboard { grid-template-columns: 1fr; min-height: 0; }
  .student-ui .bb-art { order: -1; min-height: 160px; }
  .student-ui .bb-text { padding: 22px; }
  .student-ui .bb-title { font-size: 2.5rem; }
  .student-ui .billboard .actions .btn { flex: 1 1 100%; }
  .student-ui .plan-thumb { width: 72px; height: 72px; }
  .student-ui .activity { grid-template-columns: 1fr; padding: 4px 16px; }
  .student-ui .activity li:nth-last-child(-n+2):nth-child(odd) { border-bottom: 1px solid var(--c-border); }
  .student-ui .activity li:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) { .student-ui .season:hover { transform: none; } }

.student-ui .explore-controls .search-box { display: flex; align-items: center; gap: 10px; max-width: 640px; min-height: 52px; padding: 0 18px; border-radius: 999px; background: var(--surface); border: 1px solid var(--control-line); }
.student-ui .explore-controls .search-box input { flex: 1; min-width: 0; border: 0 !important; background: transparent !important; min-height: 48px; padding: 0 !important; font: 400 1rem/1.4 var(--font-body); color: var(--text); outline: none; }
.student-ui .explore-controls .search-box:focus-within { outline: 3px solid var(--focus); outline-offset: 2px; }
.student-ui .explore-controls .search-box .ic { color: var(--text-muted); }
.student-ui .explore-filters { display: flex; flex-direction: column; gap: 12px; }
.student-ui .filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.student-ui .shelf { gap: 14px; }
.student-ui .shelf h2 { display: flex; align-items: center; gap: 10px; }
.student-ui .shelf-glyph { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: var(--subj-pastel); color: var(--subj-deep); }
.student-ui .shelf-glyph .subj-glyph { width: 20px; height: 20px; }
.student-ui .pp-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(190px, calc((100% - 5 * 14px) / 6)); gap: 14px; overflow-x: auto; padding: 6px 6px 12px; margin-inline: -6px; scroll-padding-inline: 6px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.student-ui .pp-row li { scroll-snap-align: start; }
.student-ui .pp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.student-ui .pp {
  display: flex; flex-direction: column; gap: 6px; aspect-ratio: 3 / 4; padding: 18px; text-decoration: none;
  transition: transform 180ms cubic-bezier(.2,.7,.3,1), box-shadow 180ms;
}
.student-ui .pp:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px var(--subj-line), var(--shadow-lift); }
.student-ui .pp .subj-motif { inset: 0 -40% auto auto; width: 170%; height: 50%; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
.student-ui .pp-title { position: relative; margin-top: auto; font: 400 1.75rem/1.02 var(--font-heading); color: var(--text); text-wrap: balance; }
.student-ui .pp-title.is-long { font-size: 1.375rem; line-height: 1.08; }
.student-ui .pp-meta { position: relative; font-size: .8125rem; color: var(--text-soft); }
.student-ui .pp .progress-track { position: relative; flex: none; height: 4px; min-width: 0; margin-top: 6px; background: color-mix(in srgb, var(--surface) 75%, transparent); }
.student-ui .pp-state { position: relative; display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; margin-top: 4px; padding: 2px 10px; border-radius: 999px; background: var(--surface); font: 600 .75rem/1.6 var(--font-body); color: var(--c-green); }
.student-ui .pp-state .ic { width: 14px; height: 14px; }
@media (max-width: 767px) {
  .student-ui .pp-row { grid-auto-columns: 46%; margin: 0 calc(-1 * var(--page-gutter)); padding: 4px var(--page-gutter) 10px; }
  .student-ui .pp-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .student-ui .pp { padding: 14px; }
  .student-ui .pp-title { font-size: 1.375rem; }
  .student-ui .pp-title.is-long { font-size: 1.1875rem; }
  .student-ui .subject-picker, .student-ui .filter-bar > div { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-1 * var(--page-gutter)); padding: 2px var(--page-gutter); scrollbar-width: none; }
  .student-ui .subject-picker > *, .student-ui .filter-bar .chip { flex-shrink: 0; }
}
@media (prefers-reduced-motion: reduce) { .student-ui .pp:hover { transform: none; } }

.student-ui .crumbs:has(+ .chapter-bb) { margin-bottom: -24px; }
.student-ui .chapter-bb h1.bb-title { font: var(--type-hero); }
.student-ui .chapter-bb .lead { max-width: 52ch; }
.student-ui .chapter-bb .actions { align-items: center; }
.student-ui .chapter-cols { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); gap: 32px; align-items: start; }
.student-ui .lesson-list { display: flex; flex-direction: column; }
.student-ui .lesson-row { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 12px; border-radius: 16px; color: var(--text); text-decoration: none; }
.student-ui .lesson-list li + li .lesson-row { border-top: 1px solid var(--c-border); border-radius: 0 0 16px 16px; }
.student-ui .lesson-row:hover { background: var(--surface); }
.student-ui .lesson-row.is-current { background: var(--surface); box-shadow: 0 0 0 1px var(--c-border), var(--shadow-lift); border-top-color: transparent !important; border-radius: 16px !important; }
.student-ui .lesson-list li:has(.is-current) + li .lesson-row { border-top-color: transparent; }
.student-ui .lr-thumb { height: 72px; border-radius: 12px; }
.student-ui .lr-thumb .subj-motif { width: 160%; left: -30%; opacity: .5; }
.student-ui .lesson-row.is-done .lr-thumb { opacity: .7; }
.student-ui .lr-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.student-ui .lr-title { font: 400 1.5rem/1.15 var(--font-heading); text-wrap: balance; }
.student-ui .lr-title .num { color: var(--text-muted); }
.student-ui .lr-side { display: flex; align-items: center; color: var(--text-muted); }
.student-ui .lr-side .ic { width: 20px; height: 20px; }
.student-ui .lr-done { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--c-green-soft); color: var(--c-green); }
.student-ui .lesson-row .btn { pointer-events: none; }
.student-ui .prove-card { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; padding: 24px; border-radius: 20px; background: var(--surface); border: 1px solid var(--c-border); color: var(--text); }
.student-ui .prove-title { font: 400 2rem/1.05 var(--font-heading); }
.student-ui .prove-card p { color: var(--text-muted); }
@media (max-width: 960px) { .student-ui .chapter-cols { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
  .student-ui .crumbs:has(+ .chapter-bb) { margin-bottom: -12px; }
  .student-ui .lesson-row { grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; padding: 10px 6px; }
  .student-ui .lr-thumb { height: 56px; }
  .student-ui .lr-title { font-size: 1.25rem; }
  .student-ui .lesson-row .btn { padding: 6px 12px !important; }
}
.student-ui .explore-controls .search-box .ic { position: static; transform: none; flex-shrink: 0; width: 20px; height: 20px; }
@media (max-width: 767px) {
  .student-ui .lesson-row.is-current { grid-template-columns: 64px minmax(0, 1fr); }
  .student-ui .lesson-row.is-current .lr-side { grid-column: 1 / -1; }
  .student-ui .lesson-row.is-current .lr-side .btn { width: 100%; min-height: 44px; }
}

.student-ui.lesson-shell { --wb-bg: #ffffff; }
:root[data-theme="dark"] .student-ui.lesson-shell { --wb-bg: #191816; }
.lesson-shell.app { display: block !important; position: relative; background: var(--wb-bg) !important; }
.lesson-shell .lesson-workspace { position: absolute; inset: 0; }
.lesson-shell .lesson-board.rt-board {
  height: 100%; background: var(--wb-bg) !important;
  padding: 104px clamp(20px, 6vw, 96px) 240px !important; scroll-padding-block: 104px 240px;
}

.lesson-shell .lesson-board.rt-board {
  --fade: linear-gradient(180deg, transparent 0, transparent 60px, #000 100px, #000 calc(100% - 184px), transparent calc(100% - 144px));
  -webkit-mask-image: var(--fade); mask-image: var(--fade);
}
.lesson-shell .rt-space { max-width: 1120px; }
.lesson-shell .rt-el h1, .lesson-shell .rt-el h2.board-title { font: 400 clamp(2.25rem, 1.8rem + 1.8vw, 3.25rem)/1.05 var(--font-heading); letter-spacing: -.015em; }
.lesson-shell .rt-el h2 { font: 400 1.875rem/1.15 var(--font-heading); }
.lesson-shell .rt-el h3 { font: 600 1.25rem/1.35 var(--font-body); }

.lesson-shell .lesson-head {
  position: absolute; z-index: 40; top: calc(14px + env(safe-area-inset-top, 0px)); left: 16px; right: 16px;
  display: flex; align-items: flex-start; gap: 10px; flex-wrap: nowrap; min-height: 0; padding: 0;
  background: transparent !important; border: 0 !important; pointer-events: none;
}
.lesson-shell .lesson-head > * { pointer-events: auto; }
.lesson-shell .lesson-back, .lesson-shell .lesson-title-wrap, .lesson-shell .lesson-head-actions {
  background: var(--surface) !important; border: 0 !important; border-radius: 999px !important; box-shadow: var(--shadow-float) !important;
}
.lesson-shell .lesson-back { min-height: 48px; padding: 0 16px 0 12px !important; text-decoration: none !important; }
.lesson-shell .lesson-title-wrap { flex: 0 1 auto; max-width: min(560px, 46vw); padding: 7px 20px 7px 18px; }
.lesson-shell .lesson-title { font: 400 1.375rem/1.15 var(--font-heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lesson-shell .lesson-sub { margin-top: 1px; }
.lesson-shell .lesson-head-actions { margin-left: auto; padding: 4px; gap: 2px; flex-wrap: nowrap; }
.lesson-shell .lesson-head-actions .btn { border-color: transparent !important; background: transparent !important; min-height: 40px; }
.lesson-shell .lesson-head-actions .btn:hover, .lesson-shell .lesson-head-actions .btn[aria-pressed="true"] { background: var(--surface-2) !important; color: var(--text) !important; }
.lesson-shell .lesson-progress { position: absolute; left: 0; right: 0; top: calc(100% + 8px); }

.lesson-shell .lesson-dock {
  position: absolute; z-index: 40; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  width: min(920px, calc(100% - 32px)); padding: 10px 12px; gap: 8px;
  background: var(--surface) !important; border: 0 !important; border-radius: 24px; box-shadow: var(--shadow-float);
}
.lesson-shell .lesson-composer textarea { background: var(--surface-2) !important; border-color: transparent !important; border-radius: 16px; color: var(--text); }
.lesson-shell .lesson-composer textarea:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.lesson-shell .dock-tray { background: var(--surface-2); border-color: var(--c-border); }
.lesson-shell .dock-marker[aria-expanded="true"], .lesson-shell .talk-btn.is-live { background: var(--surface-2) !important; border-color: var(--text) !important; color: var(--text) !important; }
.lesson-shell .dock-marker .marker-dot { background: var(--text); box-shadow: 0 0 0 2px var(--surface); }
.lesson-shell[data-turn="waiting"] .turn-status { color: var(--c-green); }

.lesson-shell .lesson-panel {
  position: absolute; z-index: 50; top: 76px; right: 16px; bottom: 16px; width: min(380px, calc(100% - 32px));
  background: var(--surface) !important; border: 0 !important; border-radius: 20px; box-shadow: var(--shadow-float);
}
.lesson-shell .jump-latest { bottom: 200px !important; }

.lesson-shell .rt-check { background: var(--surface-2); border: 1px solid var(--c-border); border-radius: 18px; max-width: 820px; }
.lesson-shell .cp-form textarea { background: var(--surface); color: var(--text); }

@media (max-width: 767px) {
  .lesson-shell .lesson-board.rt-board { padding: 80px 18px 230px !important; scroll-padding-block: 80px 230px; }
  .lesson-shell .lesson-board.rt-board { --fade: linear-gradient(180deg, transparent 0, transparent 50px, #000 80px, #000 calc(100% - 214px), transparent calc(100% - 172px)); }
  .lesson-shell .lesson-head { top: calc(10px + env(safe-area-inset-top, 0px)); left: 10px; right: 10px; gap: 8px; }
  .lesson-shell .lesson-back { min-width: 48px; padding: 0 !important; justify-content: center; }
  .lesson-shell .lesson-title-wrap { flex: 1 1 auto; max-width: none; padding: 6px 16px; }
  .lesson-shell .lesson-title { font-size: 1.125rem; }
  .lesson-shell .lesson-dock { left: 8px; right: 8px; transform: none; width: auto; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); border-radius: 22px; padding: 8px 10px; }
  .lesson-shell .lesson-panel { top: auto; left: 8px; right: 8px; bottom: 8px; width: auto; height: min(78%, 620px); border-radius: 20px; }
}
@media print {
  .lesson-shell .lesson-board.rt-board { -webkit-mask-image: none; mask-image: none; }
  .lesson-shell.app { display: block !important; }
  .lesson-shell .lesson-workspace { position: static; }
  .lesson-shell .lesson-board.rt-board { padding: 0 !important; height: auto; }
}

.student-ui .heatcal .cell { background: var(--surface-3); border-color: transparent; }
.student-ui .heatcal .cell.l1 { background: color-mix(in srgb, var(--text) 25%, var(--surface-3)); border-color: transparent; }
.student-ui .heatcal .cell.l2 { background: color-mix(in srgb, var(--text) 55%, var(--surface-3)); border-color: transparent; }
.student-ui .heatcal .cell.l3 { background: var(--text); border-color: transparent; }
.student-ui .heatcal .cell.pad { background: transparent; }

.student-ui ::placeholder { color: var(--text-muted); opacity: 1; }
.student-ui .seltb, body:has(.student-ui) .cookie-bar { border: 0 !important; box-shadow: var(--shadow-float) !important; }
.student-ui .seltb { background: var(--surface) !important; }

.student-ui .rw-top { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 14px; }
.student-ui .rw-level { display: flex; flex-direction: column; gap: 18px; min-height: 260px; padding: 28px 32px; }
.student-ui .rw-level .subj-motif { inset: 0 -12% auto auto; width: 70%; height: 100%; opacity: .3; -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%); mask-image: linear-gradient(90deg, transparent, #000 55%); }
.student-ui .rw-level-title { position: relative; display: flex; flex-direction: column; gap: 4px; font: var(--type-hero); letter-spacing: var(--track-hero); }
.student-ui .rw-level-name { font: 400 clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem)/1.05 var(--font-heading); color: var(--subj-deep); }
.student-ui .rw-level-foot { position: relative; display: flex; flex-direction: column; gap: 6px; margin-top: auto; max-width: 520px; }
.student-ui .rw-level-foot .progress-track { height: 6px; margin-bottom: 6px; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.student-ui .rw-level-foot .progress-track > i { background: var(--subj-deep); }
.student-ui .rw-level-foot p { margin: 0; }
.student-ui .rw-wallet { display: flex; flex-direction: column; padding: 28px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .rw-big { margin: 0; font: 400 clamp(3.25rem, 2.6rem + 2.4vw, 4.5rem)/1 var(--font-heading); letter-spacing: -.02em; }
.student-ui .rw-wallet .meta { margin: 6px 0 0; }
.student-ui .rw-wallet .actions { margin-top: auto; padding-top: 20px; }
.student-ui .rw-head-bal { text-align: right; }
.student-ui .rw-head-bal .rw-big { font-size: 3rem; }
.student-ui .rw-head-bal .meta { margin: 4px 0 0; }
.student-ui .rw-sub { margin: 20px 0 12px; font: var(--type-label); color: var(--text-muted); }

.student-ui .badge-posters { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.student-ui .badge-poster { display: flex; flex-direction: column; gap: 6px; min-height: 250px; padding: 20px; }
.student-ui .badge-poster .subj-motif { inset: -10% -45% auto auto; width: 150%; height: 70%; opacity: .3; }
.student-ui .badge-ico { position: relative; display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; flex-shrink: 0; }
.student-ui .badge-ico .ic { width: 26px; height: 26px; stroke-width: 1.6; }
.student-ui .badge-poster .badge-ico { background: var(--surface); color: var(--subj-deep); box-shadow: inset 0 0 0 1px var(--subj-line); }
.student-ui .badge-poster .badge-name { position: relative; margin: auto 0 0; font: 400 1.75rem/1.05 var(--font-heading); }
.student-ui .badge-desc { position: relative; margin: 0; font-size: .875rem; color: var(--text); }
.student-ui .badge-when { position: relative; align-self: flex-start; margin: 6px 0 0; padding: 2px 10px; border-radius: 999px; background: var(--surface); font: 600 .75rem/1.6 var(--font-body); color: var(--subj-deep); }

.student-ui .badge-lockeds { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.student-ui .badge-locked { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; align-items: start; padding: 16px 18px; border-radius: var(--radius-card); border: 1px dashed var(--control-line); }
.student-ui .badge-locked .badge-ico { width: 44px; height: 44px; background: var(--surface-2); color: var(--text-muted); }
.student-ui .badge-locked .badge-ico .ic { width: 22px; height: 22px; }
.student-ui .badge-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.student-ui .badge-locked .badge-name { margin: 0; font: var(--type-h3); }
.student-ui .badge-text .meta { margin: 0; }
.student-ui .badge-prog { grid-column: 2; display: flex; flex-direction: column; gap: 6px; margin: 8px 0 0; }
.student-ui .badge-prog .progress-track { height: 4px; }
.student-ui .badge-prog .meta { margin: 0; font-size: .8125rem; }

.student-ui .ledger { margin-top: 14px; padding: 4px 22px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .ledger-row { display: flex; align-items: center; gap: 16px; min-height: 64px; padding: 10px 0; border-bottom: 1px solid var(--c-border); }
.student-ui .ledger-row:last-child { border-bottom: 0; }
.student-ui .ledger-row .row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.student-ui .ledger-amt { font: 400 1.625rem/1 var(--font-heading); white-space: nowrap; }
.student-ui .ledger-amt.is-pos { color: var(--c-green); }
.student-ui .ledger-amt.is-neg { color: var(--text-muted); }
#ledMoreWrap:not(:empty) { margin-top: 14px; }

@media (max-width: 900px) { .student-ui .rw-top { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
  .student-ui .rw-level { min-height: 230px; padding: 22px; }
  .student-ui .rw-wallet { padding: 22px; }
  .student-ui .badge-posters { grid-template-columns: 1fr 1fr; gap: 10px; }
  .student-ui .badge-poster { min-height: 210px; padding: 14px; }
  .student-ui .badge-poster .badge-name { font-size: 1.375rem; }
  .student-ui .badge-poster .badge-ico { width: 46px; height: 46px; }
  .student-ui .ledger { padding: 2px 16px; }
  .student-ui .rw-head-bal { text-align: left; }
}

.lesson-shell .cp-form.is-done { opacity: 1; }
.lesson-shell .cp-form.is-done:not(.cp-mcq), .lesson-shell .cp-form.is-done .actions { display: none; }
.lesson-shell .cp-answer { padding: 12px 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--c-border); }
.lesson-shell .cp-answer p { margin: 2px 0 0; color: var(--text); }
.lesson-shell .st-usermsg { background: var(--surface); border: 1px solid var(--control-line); }
.lesson-shell .st-usermsg .meta { color: var(--text-muted); }

.student-ui .score-poster { display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-end; gap: 16px 40px; flex-wrap: wrap; padding: 32px 36px; min-height: 260px; }
.student-ui .score-poster .subj-motif { inset: 8% 4% 8% auto; width: 44%; height: auto; opacity: .4; }
.student-ui .score-poster .score-main { position: relative; max-width: 520px; }
.student-ui .score-big { position: relative; margin: 0; font: 400 clamp(5rem, 4rem + 4vw, 8rem)/.85 var(--font-heading); letter-spacing: -.03em; color: var(--text); }
.student-ui .score-big span { font-size: .5em; margin-left: .04em; color: var(--subj-deep); }
.student-ui .score-poster .score-main { gap: 6px; }
.student-ui .score-poster .score-head { font: var(--type-h2); margin: 0; }
.student-ui .score-poster .score-marks { font: var(--type-lead); color: var(--text-soft); }
.student-ui .score-poster .score-delta { background: var(--surface); font-weight: 500; }
@media (max-width: 767px) { .student-ui .score-poster { padding: 22px; min-height: 0; } }
.student-ui :is(.rw-level-foot, .badge-prog) .progress-track { display: block; flex: none; width: 100%; min-width: 0; }
.lesson-shell .lesson-cover { min-height: 150px; background: var(--subj-pastel); border: 0; box-shadow: inset 0 0 0 1px var(--subj-line); border-radius: var(--radius-card); }
.lesson-shell .lesson-cover .subj-motif { inset: 12% 6% 12% auto; width: 50%; height: auto; opacity: .55; overflow: visible; }

.student-ui .option { border-color: var(--control-line); background: var(--surface); border-radius: 14px; }
.student-ui .option input { accent-color: var(--text); }
.student-ui .option:has(input:checked) { border-color: var(--text); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--text); }
.student-ui .option:has(input:checked) .option-letter { color: var(--text); }
.student-ui .qnav-item { border-radius: 999px; }
.student-ui .qnav-item.is-done { border-color: var(--primary-bg); background: var(--primary-bg); color: var(--primary-fg); }
.lesson-shell .cp-form:not(.is-graded) .cp-option:has(input:checked) { border-color: var(--text); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--text); }
.lesson-shell .dock-say { min-width: 0; }
.lesson-shell .turn-status { overflow-wrap: anywhere; }

.student-ui .omr-layout { display: grid; grid-template-columns: minmax(0, 760px) 300px; gap: 48px; align-items: start; justify-content: center; }
.student-ui .omr-main { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.student-ui .take-head { display: flex; flex-direction: column; gap: 14px; }
.student-ui .take-head .bb-meta { font-size: .875rem; }
.student-ui .omr-q { outline: none; scroll-margin-top: 24px; padding: 0; border: 0; background: none; box-shadow: none; }
.student-ui .omr-q .question { display: flex; flex-direction: column; gap: 14px; border: 0; margin: 0; padding: 0; min-width: 0; }
.student-ui .omr-q .question-legend { display: flex; flex-direction: column; gap: 20px; padding: 0; width: 100%; }
.student-ui .q-no { display: flex; align-items: baseline; gap: 10px; font: 400 clamp(4.5rem, 3.6rem + 3vw, 6rem)/.85 var(--font-heading); letter-spacing: -.035em; color: var(--text); }
.student-ui .q-no small { font: 400 1.5rem/1 var(--font-heading); letter-spacing: 0; color: var(--text-muted); }
.student-ui .omr-q .question-prompt { font: 400 clamp(1.625rem, 1.4rem + .9vw, 2.125rem)/1.22 var(--font-heading); letter-spacing: -.01em; color: var(--text); max-width: 34ch; line-height: 1.3; text-wrap: pretty; }
.student-ui .omr-q .question > .meta { margin: 0; }

.student-ui .omr-opts { display: flex; flex-direction: column; margin-top: 8px; border-top: 1px solid var(--c-border); }
.student-ui .omr-opt { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 18px; min-height: 66px; padding: 12px 6px; border-bottom: 1px solid var(--c-border); cursor: pointer; font: 400 1.0625rem/1.45 var(--font-body); color: var(--text); }
.student-ui .omr-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.student-ui .omr-bub { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid var(--control-line); color: var(--text-soft); font: 600 .875rem/1 var(--font-body); }
.student-ui .omr-bub::before { content: ""; position: absolute; inset: -1.5px; border-radius: 50%; background: var(--text); clip-path: circle(0% at 50% 50%); transition: clip-path 220ms cubic-bezier(.2, .7, .3, 1); }
.student-ui .omr-bub > span { position: relative; transition: color 160ms; }
.student-ui .omr-opt:hover .omr-bub { border-color: var(--text); color: var(--text); }
.student-ui .omr-opt:has(input:checked) { font-weight: 600; }
.student-ui .omr-opt:has(input:checked) .omr-bub { border-color: var(--text); }
.student-ui .omr-opt:has(input:checked) .omr-bub::before { clip-path: circle(50% at 50% 50%); }
.student-ui .omr-opt:has(input:checked) .omr-bub > span { color: var(--surface); }
.student-ui .omr-opt:has(input:focus-visible) .omr-bub { outline: 3px solid var(--focus); outline-offset: 3px; }
.student-ui .omr-write textarea, .student-ui .omr-write input { font-size: 1.0625rem; }
.student-ui .omr-flag .ic { width: 16px; height: 16px; }
.student-ui .omr-flag[aria-pressed="true"] { border-color: var(--flag) !important; background: var(--flag-soft) !important; color: var(--text) !important; }
.student-ui .omr-flag[aria-pressed="true"] .ic { color: var(--flag); fill: currentColor; }
.student-ui { --flag: #a87400; --flag-soft: #fff6dc; }
:root[data-theme="dark"] .student-ui { --flag: #f2cf7a; --flag-soft: #2c2412; }

.student-ui .take-nav { display: flex; justify-content: space-between; gap: 12px; }
.student-ui .take-nav-end { display: flex; gap: 10px; }
.student-ui .take-nav .btn { gap: 8px; }
.student-ui .take-nav .btn .ic { width: 18px; height: 18px; }

.student-ui .omr-sheet { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 4px; padding: 22px 18px 20px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); }
.student-ui .omr-sheet h2 { font: 400 1.625rem/1.1 var(--font-heading); margin: 0 6px; }
.student-ui .omr-sheet > .meta { margin: 0 6px 10px; font-size: .8125rem; }
.student-ui .omr-rows { display: flex; flex-direction: column; gap: 2px; max-height: min(52vh, 520px); overflow-y: auto; scrollbar-width: thin; }
.student-ui .omr-row { display: grid; grid-template-columns: 26px minmax(0, 1fr) 18px; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 0 8px; border: 0; border-radius: 12px; background: transparent; color: var(--text-muted); cursor: pointer; text-align: left; }
.student-ui .omr-row:hover { background: var(--surface-2); }
.student-ui .omr-row.is-current { background: var(--surface-2); color: var(--text); }
.student-ui .omr-row:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.student-ui .omr-n { font: 600 .8125rem/1 var(--font-body); text-align: right; font-variant-numeric: tabular-nums; }
.student-ui .omr-row.is-current .omr-n span { display: inline-grid; place-items: center; min-width: 26px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--primary-bg); color: var(--primary-fg); }
.student-ui .omr-marks { display: flex; gap: 8px; align-items: center; }
.student-ui .omr-marks i, .student-ui .omr-legend i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 1.25px solid color-mix(in srgb, var(--subj-deep) 75%, transparent); font: 600 .6875rem/1 var(--font-body); font-style: normal; color: var(--text-soft); }
.student-ui .omr-marks i.on, .student-ui .omr-legend i.on { background: var(--text); border-color: var(--text); color: var(--surface); }
.student-ui .omr-marks u { flex: 1; height: 0; margin-right: 6px; border-bottom: 1.5px dashed color-mix(in srgb, var(--subj-deep) 75%, transparent); }
.student-ui .omr-marks u.on { border-bottom: 2px solid var(--text); }
.student-ui .omr-row > .ic { width: 15px; height: 15px; color: var(--flag); fill: currentColor; }
.student-ui .omr-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 12px 6px 0; padding-top: 12px; border-top: 1px solid var(--c-border); font-size: .75rem; color: var(--text-muted); }
.student-ui .omr-legend span { display: inline-flex; align-items: center; gap: 6px; }
.student-ui .omr-legend i { width: 12px; height: 12px; }
.student-ui .omr-legend .ic { width: 13px; height: 13px; color: var(--flag); fill: currentColor; }
.student-ui .omr-submit { margin-top: 14px; width: 100%; justify-content: center; }
.student-ui .omr-submit[hidden] { display: none; }

.student-ui .take-admit .bb-title { font: var(--type-hero); }
.student-ui .take-admit .bb-text > p { margin: 0; }
.student-ui .admit-art { display: grid; place-items: center; padding: 28px; }
.student-ui .admit-sheet { display: flex; flex-direction: column; gap: 14px; width: fit-content; max-width: 100%; padding: 30px 34px; border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-lift); transform: rotate(-2deg); }
.student-ui .admit-row { display: flex; align-items: center; gap: 14px; }
.student-ui .admit-row b { width: 20px; font: 600 .8125rem/1 var(--font-body); color: var(--text-muted); text-align: right; }
.student-ui .admit-row i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 1.25px solid var(--subj-deep); color: var(--subj-deep); font: 600 .75rem/1 var(--font-body); font-style: normal; opacity: .75; }
.student-ui .admit-row u { flex: 1; border-bottom: 1.5px dashed var(--subj-deep); opacity: .6; height: 0; }
.student-ui .admit-more { margin-left: 28px; font-size: .75rem; color: var(--text-muted); }

@media (max-width: 1023px) {
  .student-ui .omr-layout { grid-template-columns: 1fr; gap: 32px; }
  .student-ui .omr-sheet { position: static; }
  .student-ui .omr-rows { max-height: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
}
@media (max-width: 767px) {
  .student-ui .omr-main { gap: 22px; }
  .student-ui .q-no { font-size: 4rem; }
  .student-ui .omr-q .question-prompt { font-size: 1.5rem; }
  .student-ui .omr-opt { gap: 14px; min-height: 60px; font-size: 1rem; }
  .student-ui .take-nav { position: sticky; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 5; padding: 6px; border-radius: 999px; background: var(--surface); box-shadow: var(--shadow-float); }
  .student-ui .take-nav .btn { flex: 1; justify-content: center; }
  .student-ui .take-nav #nextQ { flex: 1.6; }
  .student-ui .admit-art { min-height: 0; padding: 22px; }
  .student-ui .admit-sheet { transform: none; }
  .student-ui .take-admit .bb-title { font-size: 2.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .student-ui .omr-bub::before, .student-ui .omr-bub > span { transition: none; }
}
::view-transition-group(take-sheet) { animation-duration: 420ms; animation-timing-function: cubic-bezier(.16, 1, .3, 1); }

.student-ui .omr-strip { display: none; }
@media (max-width: 767px) {
  .student-ui .omr-strip { display: flex; gap: 6px; overflow-x: auto; margin: 0 calc(-1 * var(--page-gutter)); padding: 2px var(--page-gutter) 4px; scrollbar-width: none; }
  .student-ui .strip-bub { position: relative; display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; border-radius: 50%; border: 1.25px solid color-mix(in srgb, var(--subj-deep) 75%, transparent); background: var(--surface); color: var(--text-soft); font: 600 .8125rem/1 var(--font-body); cursor: pointer; }
  .student-ui .strip-bub.is-done { background: var(--text); border-color: var(--text); color: var(--surface); }
  .student-ui .strip-bub.is-current { outline: 2px solid var(--text); outline-offset: 2px; }
  .student-ui .strip-bub.is-flagged::after { content: ""; position: absolute; top: -2px; right: -2px; width: 10px; height: 10px; border-radius: 50%; background: var(--flag); box-shadow: 0 0 0 2px var(--page-bg); }
  .student-ui .strip-bub:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
  .student-ui .take-nav-end { flex: 1.8; }
  .student-ui .take-nav #flagQ { flex: 0 0 auto; min-width: 48px; }
  .student-ui .take-nav #flagQ span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .student-ui .take-nav #nextQ { flex: 1; }
  .student-ui .take-nav .nq-long { display: none; }
  .student-ui .focus-head .focus-title .meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .student-ui .focus-head .focus-status #takeSave.field-error { display: inline-flex; align-items: center; gap: 4px; }
}

.student-ui, .student-ui * { -webkit-tap-highlight-color: transparent; }
.student-ui :is(.btn, .chip, .subj-chip, .strip-bub, .omr-row) { transition: transform 120ms cubic-bezier(.2, .7, .3, 1), background-color 140ms; }
.student-ui :is(.btn, .chip, .subj-chip, .strip-bub):active:not(:disabled) { transform: scale(.97); }
.student-ui :is(.lesson-row, .act-row, .plan-item, a.row-item, .omr-row, .omr-opt, .lb-item):active { background: var(--surface-2); }
.student-ui :is(.pp, .season, .badge-poster):active { transform: scale(.985); }
@media (prefers-reduced-motion: reduce) { .student-ui :is(.btn, .chip, .subj-chip, .strip-bub, .pp, .season):active { transform: none; } }

.student-ui :is(.wordmark, .brand-mark, .public-brand) { color: var(--text) !important; }
.student-ui .av, .student-ui .profile > .av { background: var(--surface-2) !important; color: var(--text) !important; border: 1px solid var(--c-border) !important; }
.student-ui input[type="range"], .student-ui input[type="checkbox"], .student-ui input[type="radio"] { accent-color: var(--text); }
.student-ui .reward-art { background: var(--surface-2); color: var(--text); }
.student-ui .reward-foot .num.item-title { font: 400 1.75rem/1 var(--font-heading); }
.student-ui .lb-item.is-me { background: var(--surface-2); }
.student-ui .lb-list .num.item-title { font: 400 1.5rem/1 var(--font-heading); }
.student-ui .plan-card.is-current { border-color: var(--text); background: var(--surface); box-shadow: inset 0 0 0 1px var(--text); }
.student-ui .allow-meter { background: var(--surface-3); border-color: transparent; }
.student-ui .allow-meter > span { background: var(--text); }

.student-ui .row-main > .progress-track { display: block; flex: none; width: 100%; max-width: 360px; height: 4px; margin-top: 8px; }
.student-ui .row-main > .progress-track > i { background: var(--text); }
.student-ui .row-main > .progress-track.is-good > i { background: var(--c-green); }

.sparky {
  --sp: 40px; --sp-gold: #ffd166; --sp-line: #1b1916; --sp-shadow: rgba(27, 25, 22, .18); --sp-glint: #ffffff; --sp-cue: var(--text);
  display: inline-block; width: var(--sp); height: var(--sp); flex-shrink: 0; vertical-align: middle; line-height: 0;
}
:root[data-theme="dark"] .sparky { --sp-shadow: rgba(255, 255, 255, .16); }
.sparky svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sparky .sp-shadow { fill: var(--sp-shadow); }
.sparky .sp-body { fill: var(--sp-gold); stroke: var(--sp-line); stroke-width: 2.5; }
.sparky .sp-dot { fill: var(--sp-line); }
.sparky .sp-glint { fill: var(--sp-glint); }
.sparky .sp-waves path { fill: none; stroke: var(--sp-cue); stroke-width: 2.6; stroke-linecap: round; }
.sparky .sp-dots { fill: var(--sp-cue); }
.sparky .sp-joy path { fill: none; stroke: var(--sp-line); stroke-width: 3; stroke-linecap: round; }
.sparky .sp-waves, .sparky .sp-dots, .sparky .sp-joy { opacity: 0; transition: opacity 160ms; }
.sparky .sp-eye { transform-box: fill-box; transform-origin: center; transition: transform 280ms cubic-bezier(.2, .7, .3, 1); }
.sparky .sp-eyes { transition: transform 280ms cubic-bezier(.2, .7, .3, 1); }
.sparky :is(.sp-all, .sp-head, .sp-shadow) { transform-box: view-box; transform-origin: 30px 54px; }
.sparky .sp-head { transition: transform 300ms cubic-bezier(.2, .7, .3, 1); }

.sparky[data-mood="idle"] .sp-eye-a { animation: sp-blink-a 6s 1.2s 2 both; }
.sparky[data-mood="idle"] .sp-eye-b { animation: sp-blink-b 6s 1.2s 2 both; }

.sparky[data-mood="hello"] .sp-all { animation: sp-roll 760ms cubic-bezier(.34, 1.4, .64, 1) both; }
.sparky[data-mood="hello"] .sp-eye-b { animation: sp-wink 420ms 900ms ease-in-out both; }

.sparky[data-mood="thinking"] .sp-eyes { transform: translate(2px, -2px); }
.sparky[data-mood="thinking"] .sp-eye-a { animation: sp-shrink 1.5s ease-in-out 6 alternate both; }
.sparky[data-mood="thinking"] .sp-eye-b { animation: sp-grow 1.5s ease-in-out 6 alternate both; }
.sparky[data-mood="thinking"] .sp-dots { opacity: 1; animation: sp-pulse 1.4s ease-in-out infinite; }

.sparky[data-mood="writing"] .sp-eyes { transform: translate(-2.5px, 2px); }
.sparky[data-mood="writing"] .sp-head { animation: sp-nod 1.6s ease-in-out infinite; }

.sparky[data-mood="speaking"] .sp-head { animation: sp-bob .9s ease-in-out infinite; }
.sparky[data-mood="speaking"] .sp-eye-a { animation: sp-lively .45s ease-in-out infinite alternate; }
.sparky[data-mood="speaking"] .sp-eye-b { animation: sp-lively .45s .22s ease-in-out infinite alternate; }

.sparky[data-mood="listening"] .sp-eye-a { transform: scale(1.2); }
.sparky[data-mood="listening"] .sp-eye-b { transform: scale(1.55); }
.sparky[data-mood="listening"] .sp-waves { opacity: 1; animation: sp-pulse 1.2s ease-in-out infinite; }

.sparky[data-mood="curious"] .sp-head { transform: rotate(-10deg); }
.sparky[data-mood="curious"] .sp-eyes { transform: translate(-1.5px, 1.5px); }
.sparky[data-mood="curious"] .sp-eye-b { transform: scale(1.6); }

.sparky[data-mood="happy"] .sp-eyes { opacity: 0; }
.sparky[data-mood="happy"] .sp-joy { opacity: 1; }
.sparky[data-mood="happy"] .sp-head { animation: sp-hop 680ms cubic-bezier(.34, 1.56, .64, 1) both; }
.sparky[data-mood="happy"] .sp-shadow { animation: sp-squash 680ms cubic-bezier(.34, 1.56, .64, 1) both; }

.sparky[data-mood="worried"] .sp-eye { transform: scale(.62); }
.sparky[data-mood="worried"] .sp-head { transform: translateY(1.5px) rotate(4deg); }

@keyframes sp-blink-a { 0%, 30%, 34%, 100% { transform: scaleY(1); } 32% { transform: scaleY(.08); } }
@keyframes sp-blink-b { 0%, 30%, 34%, 70%, 76%, 100% { transform: scaleY(1); } 32% { transform: scaleY(.08); } 73% { transform: scaleY(.08); } }
@keyframes sp-wink { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.08); } }
@keyframes sp-roll { from { transform: translateX(-16px) rotate(-140deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes sp-shrink { from { transform: scale(1); } to { transform: scale(.6); } }
@keyframes sp-grow { from { transform: scale(1); } to { transform: scale(1.7); } }
@keyframes sp-pulse { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes sp-nod { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(4deg) translateY(1px); } }
@keyframes sp-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.6px); } }
@keyframes sp-lively { from { transform: scale(1); } to { transform: scale(1.14); } }
@keyframes sp-hop { 0% { transform: none; } 40% { transform: translateY(-8px); } 100% { transform: none; } }
@keyframes sp-squash { 0% { transform: none; } 40% { transform: scale(.8, .9); opacity: .6; } 100% { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .sparky *, .sparky[data-mood] * { animation: none !important; transition: none !important; }
  .sparky[data-mood="thinking"] .sp-dots, .sparky[data-mood="listening"] .sp-waves { opacity: 1; }
}

.lesson-shell .tutor-id { display: inline-flex; align-self: center; }
.lesson-shell .tutor-id .sparky { --sp: 42px; }
.lesson-shell .opening-host { display: flex; align-items: center; gap: 16px; }
.lesson-shell .opening-host .sparky { --sp: 72px; }
.lesson-shell .opening-host .lead { margin: 0; }
.student-ui .bb-host { display: grid; place-items: center; }
.student-ui .bb-host .sparky { position: relative; --sp: clamp(120px, 14vw, 172px); }
@media (max-width: 767px) {
  .lesson-shell .tutor-id .sparky { --sp: 36px; }
  .lesson-shell .opening-host .sparky { --sp: 56px; }
}
@media (max-width: 767px) {
  .lesson-shell .dock-bar:has(.dock-primary:not([hidden])) .dock-say { flex: 1 1 calc(100% - 56px); }
}
.student-ui :is(.reward-foot, .lb-list) .num.item-title .meta { font: 500 .8125rem/1 var(--font-body); margin-left: 2px; }

.lesson-shell:has(#stEmpty) .tutor-id { display: none; }

html { -webkit-tap-highlight-color: transparent; }
.student-ui input:-webkit-autofill, .student-ui input:-webkit-autofill:hover {
  -webkit-text-fill-color: var(--text); caret-color: var(--text);
  box-shadow: 0 0 0 1000px var(--surface) inset !important; transition: background-color 9999s;
}
.student-ui input:-webkit-autofill:focus-visible { box-shadow: 0 0 0 1000px var(--surface) inset, 0 0 0 5px var(--page-bg) !important; }

.ui-dialog-backdrop.student-ui, .student-ui .ui-dialog-backdrop { background: rgba(27, 25, 22, .42); }
:root[data-theme="dark"] :is(.ui-dialog-backdrop.student-ui, .student-ui .ui-dialog-backdrop) { background: rgba(0, 0, 0, .6); }
:is(.ui-dialog-backdrop.student-ui, .student-ui) .ui-dialog { box-shadow: var(--shadow-float); border: 0; border-radius: 20px; }
:is(.ui-dialog-backdrop.student-ui, .student-ui) .ui-dialog h2 { font: var(--type-h2); }

.cookie-bar .cookie-msg a { color: #1b1916; }
.cookie-bar .ck-btn { border-radius: 999px; border-color: #e7e2d8; color: #1b1916; }
.cookie-bar .ck-btn.is-primary { background: #1b1916; border: 1px solid #1b1916; color: #fff; font-weight: 600; }
.cookie-bar .ck-btn.is-primary:hover { background: #3d3933; border-color: #3d3933; }
.cookie-bar .ck-btn:focus-visible { outline: 3px solid #1b1916; outline-offset: 2px; box-shadow: 0 0 0 5px #fff; }
:root[data-theme="dark"] body:has(.student-ui) .cookie-bar { background: #1d1c1a !important; color: #efece6; }
:root[data-theme="dark"] body:has(.student-ui) .cookie-bar :is(.cookie-msg, .cookie-msg b, .cookie-msg a) { color: #efece6; }
:root[data-theme="dark"] body:has(.student-ui) .cookie-bar .ck-btn { background: #262421; border-color: #2f2c28; color: #efece6; }
:root[data-theme="dark"] body:has(.student-ui) .cookie-bar .ck-btn.is-primary { background: #efece6; border-color: #efece6; color: #161513; }
:root[data-theme="dark"] body:has(.student-ui) .cookie-bar .ck-btn:focus-visible { outline-color: #efece6; box-shadow: 0 0 0 5px #141312; }
.lesson-shell .cp-option input:focus-visible { outline: none !important; box-shadow: none !important; }

.student-ui .chip[aria-current="page"] { background: var(--primary-bg); border-color: var(--primary-bg); color: var(--primary-fg); }

.student-ui .bottomnav[aria-label="Parent quick navigation"] { grid-template-columns: repeat(3, 1fr); }
.student-ui .child-tabs { margin-bottom: -12px; }
.student-ui .parent-glance { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.student-ui .parent-glance .week-facts { grid-template-columns: 1fr 1fr; row-gap: 12px; }
.student-ui .panel-block { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); min-width: 0; }
.student-ui .block-title { margin: 0; font: var(--type-label); color: var(--text-muted); }
.student-ui .topic-list { display: flex; flex-direction: column; }
.student-ui .topic-row { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--c-border); }
.student-ui .topic-row:last-child { border-bottom: 0; }
.student-ui .topic-row .row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.student-ui .topic-row .progress-track { display: block; flex: none; width: 100%; height: 4px; margin-top: 6px; }
.student-ui .topic-row .progress-track > i { background: var(--text); }
.student-ui .topic-row .progress-track.is-good > i { background: var(--c-green); }
.student-ui .topic-pct { font: 400 1.75rem/1 var(--font-heading); white-space: nowrap; }
.student-ui .topic-pct small { font-size: .55em; margin-left: 1px; color: var(--text-muted); }
.student-ui .act-thumb.is-neutral { background: var(--surface-2); color: var(--text); }
.student-ui .act-thumb .ic { width: 22px; height: 22px; }
.student-ui .parent-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 14px; align-items: start; }
.student-ui .help-panel { display: flex; flex-direction: column; gap: 10px; padding: 24px 26px; border-radius: var(--radius-card); background: var(--surface-2); }
.student-ui .help-panel h2 { font: var(--type-h2); margin: 0; }
.student-ui .help-list { display: flex; flex-direction: column; gap: 8px; max-width: 70ch; }
.student-ui .help-list li { position: relative; padding-left: 20px; }
.student-ui .help-list li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--text); }

.student-ui .needs-you { display: flex; flex-direction: column; gap: 12px; }
.student-ui .approval-card { border: 1px solid var(--text) !important; box-shadow: inset 0 0 0 1px var(--text); }
.student-ui .approve-list { display: flex; flex-direction: column; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--text); padding: 4px 20px; }
.student-ui .approve-row { display: flex; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--c-border); flex-wrap: wrap; }
.student-ui .approve-row:last-child { border-bottom: 0; }
.student-ui .approve-row .row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 220px; }
.student-ui .approve-row .row-side { display: flex; gap: 8px; }
.student-ui .approve-cost { display: flex; flex-direction: column; align-items: center; min-width: 64px; font: 400 1.75rem/1 var(--font-heading); }
.student-ui .approve-cost small { font: 500 .75rem/1.3 var(--font-body); color: var(--text-muted); }

.student-ui .family-grid { gap: 14px; }
.student-ui .code-input { font: 600 1.25rem/1 var(--font-body) !important; letter-spacing: .3em; }
.student-ui .code-show { font: 400 1.5rem/1 var(--font-heading); letter-spacing: .08em; }
.student-ui .parent-hello .bb-title { font: var(--type-h1); }
@media (max-width: 1100px) { .student-ui .parent-glance { grid-template-columns: 1fr 1fr; } .student-ui .parent-glance .week-panel { grid-column: 1 / -1; } }
@media (max-width: 767px) {
  .student-ui .parent-glance { grid-template-columns: 1fr; }
  .student-ui .approve-row .row-side { width: 100%; }
  .student-ui .approve-row .row-side .btn { flex: 1; }
}

.student-ui .auth-top { background: var(--page-bg); }
.student-ui .auth-card { border-radius: var(--radius-card); }
.student-ui .auth-card h1 { font: var(--type-h1); font-size: clamp(2.25rem, 1.9rem + 1.4vw, 3rem); }
.student-ui .auth-promise { background: transparent; border: 0; padding: 8px 0 0 !important; gap: 22px; }
.student-ui .promise-mosaic { gap: 12px; }
.student-ui .promise-tile {
  min-height: 112px; padding: 14px 16px; border-radius: var(--radius-card); border: 0; box-shadow: inset 0 0 0 1px var(--subj-line);
  background: var(--subj-pastel); color: var(--text); font: 400 1.5rem/1 var(--font-heading); align-items: flex-end;
}
.student-ui .promise-tile .subj-motif { opacity: .45; width: 75%; }
.student-ui .promise-tile .subj-glyph { display: none; }
.student-ui .promise-host { display: flex; align-items: center; gap: 16px; }
.student-ui .promise-host .promise-title { margin: 0; }
.student-ui .promise-list li { font-weight: 500; color: var(--text-soft); }
.student-ui .promise-ico { background: var(--surface); border: 1px solid var(--c-border); border-radius: 50%; color: var(--text); }
.student-ui .choice-card:has(input:checked), .student-ui .choice-card.is-on { border-color: var(--text); box-shadow: inset 0 0 0 1px var(--text); background: var(--surface-2); }
@media (max-width: 860px) { .student-ui .promise-host .sparky { --sp: 48px; } }

.student-ui .parent-results { display: flex; flex-direction: column; border-radius: var(--radius-card); background: var(--surface); border: 1px solid var(--c-border); padding: 4px 22px; }
.student-ui .parent-results > li { border-bottom: 1px solid var(--c-border); }
.student-ui .parent-results > li:last-child { border-bottom: 0; }
.student-ui .presult > summary { display: flex; align-items: center; gap: 14px; min-height: 76px; padding: 10px 0; cursor: pointer; list-style: none; }
.student-ui .presult > summary::-webkit-details-marker { display: none; }
.student-ui .presult > summary > .ic { width: 18px; height: 18px; color: var(--text-muted); flex-shrink: 0; transition: transform 200ms cubic-bezier(.2, .7, .3, 1); }
.student-ui .presult[open] > summary > .ic { transform: rotate(180deg); }
.student-ui .presult > summary:hover .act-title { text-decoration: underline; text-underline-offset: 3px; }
.student-ui .presult > summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 12px; }
.student-ui .presult .act-thumb { color: var(--subj-deep); }
.student-ui .presult-score { display: flex; flex-direction: column; align-items: flex-end; margin-left: auto; flex-shrink: 0; }
.student-ui .presult-score .num { font: 400 1.75rem/1 var(--font-heading); }
.student-ui .presult-score small { font-size: .55em; color: var(--text-muted); }
.student-ui .presult .topic-list { padding: 0 0 14px 62px; }
@media (max-width: 767px) { .student-ui .parent-results { padding: 2px 16px; } .student-ui .presult .topic-list { padding-left: 0; } }
@media (prefers-reduced-motion: reduce) { .student-ui .presult > summary > .ic { transition: none; } }
