/* New visual identity over the original application. No content/state overrides. */
@import url('design-dark-surfaces.css?v=20260909');
:root {
  --paper:#090d16; --panel:#0f172a; --ink:#f8fafc; --muted:#a5b4c8;
  --line:#2a364b; --teal:#2dd4bf; --teal-dark:#0f766e; --blue:#60a5fa;
  --surface-raised:#162032; --surface-soft:#142337; --accent-soft:#113b3e;
  --shadow:0 8px 28px rgba(0,0,0,.24); color-scheme:dark;
}
html[data-visual-theme="light"] {
  --paper:#f8fafc; --panel:#fff; --ink:#0f172a; --muted:#52657d;
  --line:#dce4ee; --teal:#087f75; --teal-dark:#075f59; --blue:#2563eb;
  --surface-raised:#f1f5f9; --surface-soft:#edf4fa; --accent-soft:#def5ef;
  --shadow:0 8px 28px rgba(15,23,42,.06); color-scheme:light;
}
body { background:radial-gradient(ellipse at 85% 0,rgba(37,99,235,.08),transparent 48%),var(--paper); color:var(--ink); font-family:'Segoe UI',system-ui,-apple-system,sans-serif; }
body :is(h1,h2,h3,h4) { color:var(--ink); letter-spacing:-.025em; }
body h1 { font-size:clamp(1.9rem,4vw,3.25rem); line-height:1.14; }
body h2 { font-size:clamp(1.4rem,2.5vw,2rem); }
body :is(p,li,td) { line-height:1.65; }
body :is(.eyebrow,.lesson-kicker) { color:var(--teal); letter-spacing:.09em; }
.site-header { background:var(--panel); border:1px solid var(--line); box-shadow:none; border-radius:18px; gap:12px; padding:16px 22px; }
.brand-logo { max-width:180px; }
html:not([data-visual-theme="light"]) .brand-logo { content:url('english_arena_logo_white.svg'); }
.top-nav { background:transparent; border:0; box-shadow:none; }
.top-nav a,.top-nav .nav-identity,.nav-account { color:var(--muted); }
.top-nav a:hover,.top-nav a[aria-current="page"] { color:var(--teal); background:var(--accent-soft); border-radius:12px; }
.visual-theme-toggle { min-height:48px; padding:10px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface-raised); color:var(--ink); font:600 14px/1.3 inherit; cursor:pointer; white-space:nowrap; }
body :is(.card,.panel,.hero-card,.auth-card,.auth-panel,.stat-card,.metric-card,
 .home-leader-card,.home-dashboard-card,.home-feature-card,.home-path-card,
 .dashboard-stat-card,.dashboard-kpi-card,.dashboard-chart-card,.dashboard-level-panel,
 .dashboard-tab-panel,.dashboard-panel,.dashboard-results-panel,.dashboard-badges-panel,
 .portal-workspace,.portal-panel,.portal-card,.portal-stat,.portal-overview,.portal-section,
 .grammar-lesson-card,.grammar-section,.grammar-card,.grammar-review-panel,
 .activity-test-card,.student-activity-card,.vocab-card,.flashcard,.daily-card,
 .attempt-dialog,.attempt-answer,.attempt-summary-grid article) {
  background:var(--panel); border-color:var(--line); border-radius:20px; box-shadow:var(--shadow); color:var(--ink);
}
body main :is(article,fieldset) { border-color:var(--line); }
body :is(.portal-hero,.dashboard-profile-strip,.student-hero-main,.hero) { border-color:var(--line); }
body :is(.portal-hero,.dashboard-profile-strip,.student-hero-main) {
 background:linear-gradient(115deg,var(--panel),var(--surface-soft)); color:var(--ink); border-radius:24px; box-shadow:var(--shadow);
}
body :is(.portal-hero,.dashboard-profile-strip,.student-hero-main) :is(h1,p) { color:var(--ink); }
body :is(input,select,textarea) { background:var(--surface-raised); color:var(--ink); border-color:var(--line); border-radius:12px; }
body :is(input,textarea)::placeholder { color:var(--muted); opacity:1; }
body :is(button,.button) { border-radius:12px; }
body :is(.button.primary,.primary-button,.portal-primary) { background:linear-gradient(110deg,#2563eb,#0d9488); color:#fff; border-color:transparent; box-shadow:0 5px 16px rgba(37,99,235,.16); }
body :is(.button.secondary,.mini-button,.text-button,.nav-menu-toggle) { background:var(--surface-raised); border-color:var(--line); color:var(--ink); }
body :is(.portal-tabs,.dashboard-tabs,.teacher-period-tabs,.teacher-state-tabs) { background:transparent; }
body :is(.portal-tabs,.dashboard-tabs,.teacher-period-tabs,.teacher-state-tabs) button { background:var(--surface-raised); border-color:var(--line); color:var(--muted); }
body :is(.portal-tabs,.dashboard-tabs,.teacher-period-tabs,.teacher-state-tabs) button.active { background:linear-gradient(110deg,#2563eb,#0d9488); color:#fff; }
body :is(.portal-filters,.teacher-activity-toolbar,.grammar-example,.grammar-callout,.grammar-pattern-grid>*,.grammar-type-grid>*,.grammar-job-grid>*,.grammar-compare-grid>*,.grammar-quiz-grid>*,.grammar-rule-list>*,.grammar-order-ribbon>*,.vocab-controls,.activity-bank-controls) { background:var(--surface-raised); color:var(--ink); border-color:var(--line); }
body :is(.grammar-example,.grammar-callout,.grammar-pattern-grid,.grammar-type-grid,.grammar-job-grid,.grammar-compare-grid,.grammar-quiz-grid,.grammar-rule-list) :is(p,span,strong) { color:inherit; }
body :is(.grammar-example,.grammar-job-grid,.grammar-compare-grid) span { background:var(--accent-soft); color:var(--teal); }
body table { background:var(--panel); color:var(--ink); }
body :is(th,td) { border-color:var(--line); }
body th { background:var(--surface-raised); color:var(--muted); }
body :is(.portal-table,.teacher-activity-table) tbody tr { background:var(--panel); border-color:var(--line); }
body :is(.portal-table,.teacher-activity-table) :is(small,td::before) { color:var(--muted); }
body :is(.teacher-needs-attention,.teacher-attention-list>button,.teacher-student-history,.teacher-student-history section>div) { background:var(--surface-raised); color:var(--ink); border-color:var(--line); }
body :is(.teacher-student-history small,.teacher-student-history time,.teacher-student-history section>h4,.teacher-group-activity article p,.teacher-activity-toolbar label) { color:var(--muted); }
body :is(.teacher-exact-activities li strong,.teacher-student-cell details>summary,.teacher-all-clear) { color:var(--teal); }
body :is(.level-chip,.teacher-group-level,.status-pill) { background:var(--accent-soft); color:var(--teal); }
body .site-footer { color:var(--muted); border-color:var(--line); }
body :is(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
@media(min-width:1100px) {
 body:not(.home-page):not([data-page="auth"]) { padding-left:248px; }
 body:not(.home-page):not([data-page="auth"]) .site-header { position:fixed; inset:0 auto 0 0; width:248px; margin:0; border-radius:0; border-width:0 1px 0 0; padding:26px 18px; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; overflow-y:auto; z-index:30; }
 body:not(.home-page):not([data-page="auth"]) .top-nav { display:flex; flex-direction:column; align-items:stretch; gap:6px; margin-top:28px; padding:0; width:100%; }
 body:not(.home-page):not([data-page="auth"]) .top-nav>a { padding:13px 16px; font-size:14px; }
 body:not(.home-page):not([data-page="auth"]) .nav-account { margin-top:22px; border-top:1px solid var(--line); padding-top:20px; display:grid; gap:12px; white-space:normal; }
 body:not(.home-page):not([data-page="auth"]) .nav-identity { white-space:normal; overflow-wrap:anywhere; }
 body:not(.home-page):not([data-page="auth"]) .visual-theme-toggle { margin-top:auto; }
 body:not(.home-page):not([data-page="auth"]) main { width:calc(100% - 56px); max-width:1300px; margin-left:auto; margin-right:auto; }
}
@media(max-width:1099px) {
 .site-header { flex-wrap:wrap; }
 .visual-theme-toggle { margin-left:auto; }
}
@media(max-width:760px) {
 body .site-header { grid-template-columns:minmax(0,1fr) auto; padding:12px 16px; border-radius:0; margin-top:0; }
 .visual-theme-toggle { grid-column:1 / -1; justify-self:end; min-height:44px; font-size:13px; }
 body .top-nav { background:var(--panel); }
 body .mobile-card-table tbody tr { background:var(--panel); border-color:var(--line); }
 body .mobile-card-table td::before { color:var(--muted); }
}
@media(prefers-reduced-motion:reduce) { .visual-theme-toggle { transition:none; } }