/* Controlled material v2 palette and peripheral surfaces.
   Approved workspace spacing/hierarchy lives in theme-workspace.css.
   Frozen IELTS Shell geometry, teaching fonts and player DOM stay unchanged. */
:root[data-evan-theme-page]{
 --surface-outer:#eef0f5;--surface-content:#fafaf9;--surface-panel:#e3e7e8;
 --text-primary:#292d30;--text-secondary:#56616a;--border-decoration:#e2e5e5;--border-control:#758087;
 --action-primary:#16284a;--action-hover:#20385e;--action-selected:#e8edf4;--brand-accent:#d9b16c;
 --info-text:#17708c;--info-surface:#e3f4f9;--success-text:#14392f;--success-surface:#e8f1ec;
 --warning-text:#8a4c28;--warning-surface:#fff0e6;--review-surface:#fae9e3;
 --danger-text:#b63d2a;--danger-surface:#fcece7;
 --cloud-green:141 169 154;--cloud-warm:217 177 130;
 --glass-light:250 250 249;--glass-dark:22 40 74;
 --glass-edge-light:rgb(255 255 255 / 88%);--glass-edge-dark:rgb(67 82 91 / 17%);
 --g:var(--action-primary);--gd:var(--action-primary);--bg:var(--surface-outer);
 --ink:var(--text-primary);--muted:var(--text-secondary);--line:var(--border-decoration);--white:var(--surface-content);--amber:var(--warning-text);
}
html[data-evan-theme-page] body{
 background-color:var(--surface-outer);color:var(--text-primary);
 background-image:
  radial-gradient(ellipse 55% 75% at 0% 0%,rgb(161 176 209 / 27%),transparent 78%),
  radial-gradient(ellipse 50% 80% at 100% 24%,rgb(222 196 151 / 23%),transparent 80%),
  radial-gradient(ellipse 62% 72% at 65% 100%,rgb(166 190 178 / 21%),transparent 82%);
 background-attachment:fixed;
}
html[data-evan-theme-page] :is(.card,.top,.modalbox,.readingPassage,.readingQuestions,.readingReviewQuestions,.exam-head,.exam-bottom,.exam-site-info,.exam-site-info[open] footer,.readingTools){background-color:var(--surface-content);color:var(--text-primary)}
html[data-evan-theme-page] :is(.muted,.workspaceEmpty,.workspaceNotice,.task p,.workspaceProfileLinks span,.stat span,.stat small,footer,footer a){color:var(--text-secondary)}
html[data-evan-theme-page] :is(.workspaceRow p,.draftSavedStatus){color:var(--text-secondary)}
html[data-evan-theme-page] .draftbar{background-color:var(--surface-panel);color:var(--text-primary)}
html[data-evan-theme-page] :is(.teacherReferencePanel,.answerKey){background-color:var(--review-surface);border-color:var(--border-control)}
html[data-evan-theme-page] :is(.teacherReferencePanel summary,.answerKey summary){color:var(--warning-text)}
html[data-evan-theme-page] .uploadbox{background-color:var(--surface-content);border-color:var(--border-control)}
html[data-evan-theme-page] a{color:var(--action-primary);text-decoration:underline;text-underline-offset:3px}
html[data-evan-theme-page] :is(.field input,.field textarea,.field select,input:not([type=checkbox]):not([type=radio]),textarea,select){background-color:var(--surface-content);color:var(--text-primary);border-color:var(--border-control)}
html[data-evan-theme-page] :is(input,textarea)::placeholder{color:var(--text-secondary);opacity:1}
html[data-evan-theme-page] :is(input[type=checkbox],input[type=radio]){accent-color:var(--action-primary)}
html[data-evan-theme-page] :is(.primary,button.on,button[aria-current],button[aria-pressed=true]){background-color:var(--action-primary);color:#fff;border-color:var(--action-primary)}
html[data-evan-theme-page] :is(.quiet,.readingTools button,.readingPassageTabs button,.readingQuestions nav button,.exam-navigation>button,.exam-question-nav button,.exam-pane-tabs button){background-color:var(--surface-content);color:var(--action-primary);border-color:var(--border-control)}
html[data-evan-theme-page] :is(.primary,button.on,button[aria-current],button[aria-pressed=true]):hover:not(:disabled){background-color:var(--action-hover);color:#fff}
html[data-evan-theme-page] :is(.quiet,.readingTools button,.readingPassageTabs button,.exam-navigation>button,.exam-question-nav button,.exam-pane-tabs button):hover:not(:disabled){background-color:var(--action-selected);color:var(--action-primary);border-color:var(--action-primary)}
html[data-evan-theme-page] :is(.creationModes button.active,.creationModes button.on,.readingTools button.on,.readingPassageTabs button.on,.exam-question-nav [aria-current],.exam-pane-tabs [aria-pressed=true]){background-color:var(--action-primary);color:#fff;border-color:var(--action-primary)}
html[data-evan-theme-page] :is(button,input,select,textarea,summary,a):focus-visible{outline:3px solid var(--action-primary);outline-offset:2px}
html[data-evan-theme-page] :is(button:disabled,input:disabled,select:disabled,textarea:disabled){opacity:1;background-color:var(--surface-panel);color:var(--text-secondary);border-color:var(--border-control);cursor:not-allowed}
html[data-evan-theme-page] :is(.abWorkspace,.pvWorkspace,.ieltsExamShell) :is(button:disabled,input:disabled,select:disabled,textarea:disabled){opacity:1;background-color:var(--surface-panel);color:var(--text-secondary);border-color:var(--border-control);cursor:not-allowed}
html[data-evan-theme-page] :is(.tag,.workspaceState){background-color:var(--info-surface);color:var(--info-text)}
html[data-evan-theme-page] .workspaceState::before{content:'• '}
html[data-evan-theme-page] :is(.status.submitted,.accessLegacy,.readingQuestionVocab){background-color:var(--warning-surface);color:var(--warning-text)}
html[data-evan-theme-page] .status.submitted::before{content:'◷ '}
html[data-evan-theme-page] :is(.status.reviewed,.successNote,.pvPublished){background-color:var(--success-surface);color:var(--success-text)}
html[data-evan-theme-page] .status.reviewed::before{content:'✓ '}
html[data-evan-theme-page] :is(.error,.formerror.error,[role=alert]:not(:empty),.toast.bad){background-color:var(--danger-surface);color:var(--danger-text)}
html[data-evan-theme-page] .status.disabled{background-color:var(--surface-panel);color:var(--text-secondary)}
html[data-evan-theme-page] .status.disabled::before{content:'— '}
html[data-evan-theme-page] .error:not(:empty)::before{content:'! '}
html[data-evan-theme-page] .quiet.danger{color:var(--danger-text);border-color:var(--danger-text)}
html[data-evan-theme-page] .quiet.danger:hover:not(:disabled){background-color:var(--danger-surface);color:var(--danger-text)}
html[data-evan-theme-page] .toast:not(.bad){background-color:var(--action-primary);color:#fff}
html[data-evan-theme-page] :is(.pvWords label:has(input:checked),.readingGroupRow.selected,.readingInlineBlank.selected){background-color:var(--action-selected);color:var(--text-primary);border-color:var(--action-primary)}
html[data-evan-theme-page] .readingOptions label{background-color:var(--surface-content);color:var(--text-primary)}
html[data-evan-theme-page] .readingOptions label:has(input:checked){background-color:var(--surface-content);color:var(--text-primary);border-color:var(--action-primary);box-shadow:inset 3px 0 var(--brand-accent)}
html[data-evan-theme-page] :is(.readingOptions label,.pvWords){border-color:var(--border-control)}
html[data-evan-theme-page] .pvTabs button.on{background-color:var(--action-selected);color:var(--action-primary);border-color:var(--action-primary)}
html[data-evan-theme-page] .abWorkspace [type=checkbox]:checked{outline-color:var(--action-primary)}
html[data-evan-theme-page] .readingSharedOptions{background-color:var(--surface-panel);color:var(--text-primary)}
html[data-evan-theme-page] :is(.readingActiveQuestion .field,.readingActiveQuestion>p.readingSourceStem,.readingParagraphLabel){color:var(--text-secondary)}
html[data-evan-theme-page] .readingSentence:hover{background-color:var(--action-selected)}
/* Evidence purple, user highlights/underlines and mark meanings retain V1 colors. */
html[data-evan-theme-page] .readingSentence.annotation-highlight{background-color:#fff0a8}
html[data-evan-theme-page] .readingSentence.evidenceSelected{background-color:#e9def7}
html[data-evan-theme-page] .side{background-color:var(--action-primary);color:#fff}
html[data-evan-theme-page] .logo b{background-color:var(--brand-accent);color:var(--action-primary)}
html[data-evan-theme-page] :is(.side nav button,.workspaceNavLabel,.logout){color:#fff}
html[data-evan-theme-page] .side nav button:hover{background-color:rgb(255 255 255 / 8%);color:#fff}
html[data-evan-theme-page] .side nav button.on{background-color:rgb(255 255 255 / 12%);color:#fff;box-shadow:inset 2px 0 var(--brand-accent);font-weight:600}
html[data-evan-theme-page] .side :is(button,a):focus-visible{outline-color:#fff}
html[data-evan-theme-page] :is(.logout,.exam-rail-toggle){border-color:var(--border-control)}
html[data-evan-theme-page] .shell:not(.ieltsExamShell)>.side::before{color:#fff}
/* Material only: inset edges/shadows do not change component bounds or density.
   Light secondary text always has an opaque backing, including over dark clouds. */
html[data-evan-theme-page] :is(.pagehead>div>.muted,.page>.muted,.abWorkspace>p.muted,.workspaceNotice,footer){background-color:var(--surface-content)}
/* Summary grid carries no material; its three sibling cards do (see theme-workspace.css). */
html[data-evan-theme-page] .workspaceStats{background:none;box-shadow:none;border:0;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-evan-theme-page] :is(.top,.exam-head,.exam-bottom){box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 var(--glass-edge-dark)}
html[data-evan-theme-page] .side{box-shadow:inset 0 1px 0 rgb(255 255 255 / 74%),inset 1px 0 0 rgb(255 255 255 / 30%),inset -1px 0 0 rgb(10 26 44 / 12%)}
html[data-evan-theme-page] .exam-head .muted{background-color:var(--surface-content)}
/* Peripheral filters only. Workbench has three independent sibling cards;
   the grid itself has no filter. Teaching and form surfaces remain opaque. */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 html[data-evan-theme-page][data-evan-glass=on] .shell>.side{background:linear-gradient(145deg,rgb(48 63 94 / 32%),rgb(19 34 63 / 36%)),rgb(var(--glass-dark) / 88%);-webkit-backdrop-filter:blur(14px) saturate(110%);backdrop-filter:blur(14px) saturate(110%)}
 html[data-evan-theme-page][data-evan-glass=on] .shell:not(.ieltsExamShell)>.main>.top{background:linear-gradient(115deg,rgb(255 255 255 / 28%),transparent 65%),rgb(var(--glass-light) / 72%);border-color:var(--glass-edge-light) rgb(255 255 255 / 50%) var(--glass-edge-dark) rgb(255 255 255 / 74%);-webkit-backdrop-filter:blur(16px) saturate(112%);backdrop-filter:blur(16px) saturate(112%)}
 html:is([data-evan-theme-page=reading],[data-evan-theme-page=listening])[data-evan-glass=on] .ieltsExamShell :is(.exam-head,.exam-bottom){background:linear-gradient(115deg,rgb(255 255 255 / 34%),transparent 40%),rgb(var(--glass-light) / 26%);border-color:var(--glass-edge-light);-webkit-backdrop-filter:blur(12px) saturate(112%);backdrop-filter:blur(12px) saturate(112%)}
}
/* Explicit local switch works even when the OS media feature is unsupported. */
html[data-evan-theme-page][data-evan-opaque=on] .shell>.side{background:var(--action-primary);-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-evan-theme-page][data-evan-opaque=on] :is(.shell:not(.ieltsExamShell)>.main>.top,.ieltsExamShell .exam-head,.ieltsExamShell .exam-bottom){background:var(--surface-content);-webkit-backdrop-filter:none;backdrop-filter:none}
@media(prefers-reduced-transparency:reduce){
 html[data-evan-theme-page][data-evan-glass] .shell>.side{background:var(--action-primary);-webkit-backdrop-filter:none;backdrop-filter:none}
 html[data-evan-theme-page][data-evan-glass] :is(.shell:not(.ieltsExamShell)>.main>.top,.ieltsExamShell .exam-head,.ieltsExamShell .exam-bottom){background:var(--surface-content);-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(forced-colors:active){
 html[data-evan-theme-page] body{background:Canvas}
 html[data-evan-theme-page][data-evan-glass] :is(.shell>.side,.shell:not(.ieltsExamShell)>.main>.top,.ieltsExamShell .exam-head,.ieltsExamShell .exam-bottom){background:Canvas;color:CanvasText;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
 html[data-evan-theme-page] :is(.side nav button,.workspaceNavLabel,.logout){color:CanvasText}
}

/* Login reuses the workspace palette and material. Input surfaces stay opaque. */
html[data-evan-theme-page=login] .login{min-height:100svh}
html[data-evan-theme-page=login] .brandpane{
 color:#fff;background:var(--action-primary);
 background-image:radial-gradient(ellipse at 8% 0%,rgb(var(--cloud-warm) / 15%),transparent 65%),linear-gradient(145deg,rgb(255 255 255 / 7%),transparent 65%);
 box-shadow:inset 0 1px 0 rgb(255 255 255 / 50%),inset -1px 0 0 rgb(255 255 255 / 20%);
}
html[data-evan-theme-page=login] .brandpane .logo b{background:var(--brand-accent);color:var(--action-primary);box-shadow:inset 0 1px 0 rgb(255 255 255 / 55%),0 4px 14px rgb(0 0 0 / 12%)}
html[data-evan-theme-page=login] .hero small{color:var(--brand-accent);letter-spacing:.14em;line-height:1.6}
html[data-evan-theme-page=login] .brandpane>small{color:#e4e8f0}
html[data-evan-theme-page=login] .loginpane{padding:36px;min-width:0}
html[data-evan-theme-page=login] .box{
 width:min(470px,100%);padding:32px;background:var(--surface-content);border:1px solid;
 border-color:var(--glass-edge-light) rgb(94 110 137 / 17%) rgb(70 89 120 / 22%) rgb(255 255 255 / 84%);
 border-radius:22px;box-shadow:0 18px 42px rgb(30 48 80 / 12%),0 2px 5px rgb(30 48 80 / 4%),inset 0 1px 0 #fff;
}
html[data-evan-theme-page=login] .box>h2{line-height:1.3}
html[data-evan-theme-page=login] .tabs{background:var(--surface-panel);border:1px solid var(--border-decoration);margin:24px 0}
html[data-evan-theme-page=login] .tabs button{min-height:44px;color:var(--text-secondary)}
html[data-evan-theme-page=login] .tabs button.on{background:var(--action-primary);color:#fff;box-shadow:0 2px 5px rgb(22 40 74 / 12%)}
html[data-evan-theme-page=login] .tabs button:hover:not(.on):not(:disabled){background:var(--action-selected);color:var(--action-primary)}
html[data-evan-theme-page=login] .field input{min-height:48px}
html[data-evan-theme-page=login] .primary{min-height:48px;box-shadow:inset 0 1px 0 rgb(255 255 255 / 15%),0 4px 12px rgb(22 40 74 / 12%)}
html[data-evan-theme-page=login] #err:empty{display:none}
html[data-evan-theme-page=login] #err{line-height:1.6;overflow-wrap:anywhere}
html[data-evan-theme-page=login] .tabs button:disabled{background:var(--surface-panel);color:var(--text-secondary);box-shadow:none;cursor:wait}
html[data-evan-theme-page=login] .primary:disabled{box-shadow:none;cursor:wait}
html[data-evan-theme-page=login] #login .site-footer{padding:24px 0 0;background:transparent;line-height:1.7;font-size:12px}
html[data-evan-theme-page=login] #login .site-footer a{overflow-wrap:anywhere}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 html[data-evan-theme-page=login][data-evan-glass=on] .brandpane{background-color:rgb(var(--glass-dark) / 94%);backdrop-filter:blur(14px) saturate(110%);-webkit-backdrop-filter:blur(14px) saturate(110%)}
 html[data-evan-theme-page=login][data-evan-glass=on] .box{background:linear-gradient(125deg,rgb(255 255 255 / 50%),rgb(255 255 255 / 10%) 65%),rgb(var(--glass-light) / 88%);backdrop-filter:blur(16px) saturate(108%);-webkit-backdrop-filter:blur(16px) saturate(108%)}
}
html[data-evan-theme-page=login][data-evan-opaque=on] .brandpane{background:var(--action-primary);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-evan-theme-page=login][data-evan-opaque=on] .box{background:var(--surface-content);backdrop-filter:none;-webkit-backdrop-filter:none}
@media(max-width:760px){
 html[data-evan-theme-page=login] .brandpane{min-height:0;padding:24px;gap:16px}
 html[data-evan-theme-page=login] .brandpane .logo{font-size:15px}
 html[data-evan-theme-page=login] .brandpane .logo b{width:36px;height:36px;font-size:22px}
 html[data-evan-theme-page=login] .hero h1{font-size:32px;line-height:1.25;margin:10px 0}
 html[data-evan-theme-page=login] .hero small{font-size:10px}
 html[data-evan-theme-page=login] .brandpane>small{font-size:12px}
 html[data-evan-theme-page=login] .loginpane{padding:24px 16px 32px}
 html[data-evan-theme-page=login] .box{padding:24px 20px;border-radius:18px}
 html[data-evan-theme-page=login] .box>h2{font-size:28px}
}
@media(prefers-reduced-transparency:reduce){
 html[data-evan-theme-page=login][data-evan-glass] .brandpane{background:var(--action-primary);backdrop-filter:none;-webkit-backdrop-filter:none}
 html[data-evan-theme-page=login][data-evan-glass] .box{background:var(--surface-content);backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(forced-colors:active){
 html[data-evan-theme-page=login] :is(.brandpane,.box,.tabs,.brandpane .logo b){background:Canvas!important;color:CanvasText!important;border:1px solid CanvasText;box-shadow:none;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 html[data-evan-theme-page=login] :is(.hero small,.brandpane>small){color:CanvasText}
}