/* Theme semantics shared by the desk, settings and every chess island. */
html[data-theme=warm]{--room-island:linear-gradient(135deg,#efdca9,#d9bc79);--room-island-ink:#5b421d;--room-island-muted:#79603b;--room-edge:#fff8dc;--room-edge-tail:#d5a95a;--room-panel:#fff6e6;--room-border:#be9e6940;--room-board-light:#f4ddb5;--room-board-dark:#b9905d}
html[data-theme=paper]{--room-island:linear-gradient(135deg,#303b36,#1e2925);--room-island-ink:#f3f0e8;--room-island-muted:#bec8bd;--room-edge:#f5f3e9;--room-edge-tail:#9ba99e;--room-panel:#faf8f2;--room-border:#8b958638;--room-board-light:#efe8d9;--room-board-dark:#a49d85}
html[data-theme=cyan]{--room-island:linear-gradient(135deg,#153b47,#09232e);--room-island-ink:#dcf9fc;--room-island-muted:#9bd5dd;--room-edge:#b7f9ff;--room-edge-tail:#22d3ee;--room-panel:#102d39;--room-border:#40899a55;--room-board-light:#b6d5db;--room-board-dark:#477785}
html[data-theme=quartz]{color-scheme:light;--ink:#303842;--muted:#7c8691;--accent:#617587;--bg:#f5f7f9;--panel-top:#fff;--panel-bottom:#f0f3f6;--theme-button-fill:#f5f7f9;--gold-ink:#38434e;--gold-surface:linear-gradient(140deg,#fff,#e9eef2);--room-island:linear-gradient(135deg,#fff,#e9eef2);--room-island-ink:#303c47;--room-island-muted:#768592;--room-edge:#fff;--room-edge-tail:#98adbd;--room-panel:#fff;--room-border:#a6b4c345;--room-board-light:#edf1f4;--room-board-dark:#9eacb8}
html[data-theme] body :is(.island,.puzzle-island,.opening-island){isolation:isolate;overflow:hidden;background:var(--room-island);color:var(--room-island-ink);border:1px solid var(--room-border);box-shadow:inset 0 1px #ffffff24,0 5px 16px #17262d12;backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-theme][data-effects] body .island,html[data-theme][data-effects] body .island[data-state]{background:var(--room-island);color:var(--room-island-ink);border-color:var(--room-border);box-shadow:inset 0 1px #ffffff24,0 5px 16px #17262d12}
html[data-theme] body :is(.island-copy small,.island-chevron,.puzzle-island small,.opening-island small){color:var(--room-island-muted)}
html[data-theme] body :is(.island-copy strong,.island-copy b,.puzzle-island strong,.opening-island strong){color:var(--room-island-ink)}
html[data-theme] body .thinking-bars i{background:var(--room-edge-tail)}
html[data-theme] body :is(.island-icon,.island-mark,.puzzle-island-spark){color:var(--room-island-muted)}
html[data-theme] body .puzzle-island-subtitle{color:var(--room-island-muted)}
html[data-theme] body .puzzle-island-fill{background:linear-gradient(90deg,var(--room-edge-tail),var(--room-edge),var(--room-edge-tail))}
html[data-theme] body .puzzle-island-icon{background:#ffffff12}
html[data-theme] body :is(.island,.puzzle-island,.opening-island)::before{display:none}
html[data-theme] body .island::after{border-color:var(--room-border);box-shadow:none}
/* Two glints follow the entire capsule. Only the inner square rotates. */
html[data-theme] body .island-rim{position:absolute;inset:0;z-index:3;padding:1px;border-radius:inherit;overflow:hidden;pointer-events:none;opacity:.62;contain:paint;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;transition:opacity .4s ease}
html[data-theme] body .island-rim::after{display:none}
html[data-theme] body .island-rim i{position:absolute;inset:auto;left:50%;top:50%;width:110%;height:auto;aspect-ratio:1;display:block;background:conic-gradient(from 0deg,transparent 0deg 54deg,var(--room-edge-tail) 85deg,var(--room-edge) 99deg,transparent 109deg 234deg,var(--room-edge-tail) 265deg,var(--room-edge) 279deg,transparent 289deg);transform:translate(-50%,-50%) rotate(0deg);animation:room-edge-orbit 12s linear infinite;filter:none;box-shadow:none;will-change:transform}
html[data-theme] body :is([data-state=thinking],[data-state=analyzing]) .island-rim{opacity:.95}
html[data-theme] body :is([data-state=thinking],[data-state=analyzing]) .island-rim i{animation-duration:6s}
@keyframes room-edge-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
html[data-theme] body .analysis-orb{width:10px;height:10px;border-radius:50%;border:0;box-shadow:none}
html[data-theme] body .settings-preview .analysis-orb{flex:0 0 12px;width:12px;height:12px}
html[data-theme=warm] body .analysis-orb{background:radial-gradient(circle at 30% 22%,#ffe691,#efb80e 52%,#895500)}
html[data-theme=paper] body .analysis-orb{background:#f4f3ee url('assets/taiji.svg') center/100% 100% no-repeat;box-shadow:0 0 0 .5px #ffffff40}
html[data-theme=paper] body .analysis-orb::before,html[data-theme=paper] body .analysis-orb::after{display:none}
html[data-theme=cyan] body .analysis-orb{background:radial-gradient(circle at 30% 22%,#e0fdff,#67e8f9 23%,#1397ab 68%,#064a5b)}
html[data-theme=quartz] body .analysis-orb{background:radial-gradient(circle at 30% 22%,#fff 0%,#f5f8fa 28%,#c2ced7 65%,#758998 100%)}
html[data-theme=cyan] body .analysis-orb::before,html[data-theme=quartz] body .analysis-orb::before{background:linear-gradient(105deg,transparent 18%,#ffffffaa 45%,transparent 70%)}
html[data-theme=cyan] body .analysis-orb::after,html[data-theme=quartz] body .analysis-orb::after{background:radial-gradient(ellipse at 78% 22%,#ffffffa0,transparent 50%)}
html[data-theme] body .workspace-engine{position:relative}
html[data-theme] body :is(.settings-module,.storage-option){background:var(--room-panel);border-color:var(--room-border);color:var(--ink,#4e4131)}
html[data-theme] body .settings-preview{color:var(--room-island-ink)}
html[data-theme] body .settings-preview small{color:var(--room-island-muted)}
html[data-theme=paper] body :is(.settings-portrait,.storage-summary){background:#e9e9df;border-color:#8b958638}
html[data-theme=cyan] body :is(.settings-portrait,.storage-summary){background:#123a46;border-color:#40899a55;color:#c9edf2}
html[data-theme=quartz] body,html[data-theme=quartz].native-backdrop body{background:radial-gradient(ellipse at 90% 0,#fff,transparent 65%),#f5f7f9;color:#303842}
html.native-backdrop[data-theme=quartz]{background:#f5f7f9!important}
html[data-theme=quartz] body :is(header,.desk-header){background:transparent;border-color:#a6b4c340;box-shadow:none}
html[data-theme=quartz] body :is(h1,h2,h3,.brand,.desk-brand,.entry-title,.classics-link strong,.workspace-heading h2,.panel-title h2){color:#303842}
html[data-theme=quartz] body :is(p,small,.entry-description,.classic-intro,.source-note,.muted,.desk-note,.theme-eyebrow,.section-label,.index,.eyebrow){color:#7c8691}
html[data-theme=quartz] body :is(.entry-arrow,h1 span,.opening-home-arrow){color:#7a8fa0}
html[data-theme=quartz] body :is(.entry-card,.classics-link,.panel,.classic-card,.opening-card,.opening-catalogue,.opening-detail,.position-card,.statistics-card,.continuation-card,.idea-card,.puzzle-card,.workspace-engine,.settings-surface){background:linear-gradient(145deg,#fff,#f2f5f7);border:1px solid #a6b4c340;box-shadow:0 8px 24px #27394b08;backdrop-filter:none;color:#303842}
html[data-theme=quartz] body :is(.entry-art,.picture-frame){background:transparent;box-shadow:none;mask:none;-webkit-mask:none}
html[data-theme=quartz] .ambient-background{display:none}
html[data-theme=quartz] body :is(button,.quiet,.room-home,.edition,.mode,.desk-engine,.guidance-toggle,.review-navigation,.board-tools,.opening-search,.opening-controls){background-color:#f0f3f6;background-image:none;color:#526373;border-color:#b0beca55;box-shadow:none}
html[data-theme=quartz] body :is(button.primary,.analyze-button){background:#617587!important;color:#fff!important;border-color:#617587!important}
html[data-theme=quartz] body :is(.mode.active,button[aria-pressed=true],button[aria-checked=true]){background-color:#e1e8ee;border-color:#8fa5b6;color:#303e4b}
html[data-theme=quartz] body :is(.theme-close,#islandToggle){background:none;color:inherit}
html[data-theme=quartz] body :is(dialog,#themeSettings,#promotion){background:#fafbfc;color:#303842;border:1px solid #b0beca66;box-shadow:0 16px 48px #243c5422}
html[data-theme=quartz] body :is(dialog,#themeSettings)::backdrop{background:#273e5555;backdrop-filter:none}
html[data-theme=quartz] body :is(input,select,textarea){background:#fff;color:#303842;border-color:#b7c3ce}
html[data-theme=quartz] body :is(.sheet-heading,.import-actions,.history-head,.history-row:nth-child(even),.turn-track,.workspace-engine-list button,.workspace-book-moves button){background:#eef2f5;color:#526373;border-color:#b0beca44}
html[data-theme=quartz] body :is(.workspace-engine b,.workspace-opening-name,.workspace-book-toggle,.inventory-number,.puzzle-stats b,.puzzle-panel-heading,.continuation-row b,.stats b){color:#526a7d}
html[data-theme=quartz] body :is(.workspace-engine-heading,.workspace-book-state,.workspace-opening-detail,.workspace-eyebrow,.workspace-mark,.eval-heading,.eval-detail,#evalScore,.history-row,.history-move){color:#6d7f8e}
html[data-theme=quartz] body .board-shell{background:#e6ecf1;border:1px solid #9eafbd66;box-shadow:0 0 0 3px #f8fafb,0 12px 30px #273e5512}
html[data-theme=quartz] body .eval-track{background:#697d8d;border-color:#9aabba}html[data-theme=quartz] body #evalWhite{background:#e9eff3}
html[data-theme=quartz] body #board{background-image:conic-gradient(from 90deg,var(--room-board-light) 25%,var(--room-board-dark) 0 50%,var(--room-board-light) 0 75%,var(--room-board-dark) 0);background-size:25% 25%}
html[data-theme=quartz] body #board .square{background:transparent}html[data-theme=quartz] body #board .square.last{background:#d7e3e9}html[data-theme=quartz] body #board .square.dark-square.last{background:#8babbc}html[data-theme=quartz] body #board .square.selected{background:#a5c6d7}
html[data-theme=quartz] body .coord{color:#5a7082}html[data-theme=quartz] body .dark-square .coord{color:#edf4f8}
html[data-theme=quartz] body :is(.settings-portrait,.storage-summary){background:#edf1f4;border-color:#b0beca44;color:#657b8e}
html[data-theme=quartz] body .theme-option[aria-pressed=true]{background:#e8eef3;border-color:#8da3b5;box-shadow:none}
html[data-theme=quartz] body .theme-check{color:#617587}
html[data-theme=quartz] body .guidance-toggle>i,html[data-theme=quartz] body .guidance-toggle[aria-checked=true]>i{background:#92a6b6}
html[data-theme=quartz] body .guidance-toggle em{background:linear-gradient(135deg,#fff,#e7eef3);box-shadow:0 1px 4px #344b5e20}
html[data-theme=quartz] body :is(.guidance-toggle b,.guidance-toggle small,.review-navigation>span,.play-mode-label){color:#6d7f8e}
html[data-theme=quartz] body :is(.side-thumb,.duration-thumb,.desk-segment i,.mode-track){background:#dbe5ec;border-color:#9eafbd}
.preview-quartz{--preview-bg:#f5f7f9;--preview-island:#9aabba;--preview-a:#edf1f4;--preview-b:#9eacb8}
html[data-theme] body :is(.storage-confirm .danger){background:#a66556;color:#fff;border-color:#a66556}
html[data-theme] body .storage-option[data-clear-scope=all] b{color:#b17566}
html.effects-paused body .island-rim i,html.viewport-settling body .island-rim i{animation-play-state:paused!important}
html.reduce-motion body .island-rim i{animation:none!important}
@media(prefers-reduced-motion:reduce){html[data-theme] body .island-rim i{animation:none!important}}
@media(orientation:landscape) and (max-height:450px){html body #themeSettings{width:min(800px,calc(100vw - 32px))}.theme-options{grid-template-columns:repeat(4,minmax(0,1fr))}.theme-option-copy b{font-size:11px}.theme-option-copy small{font-size:9px}}
/* 1.9.8: optical centre stays fixed through ready/thinking/evaluation. */
html[data-theme] body #islandToggle{display:grid;grid-template-columns:28px minmax(0,1fr) 28px;column-gap:9px;text-align:center}
html[data-theme] body #islandToggle>.island-icon{grid-column:1;grid-row:1;width:28px;justify-self:center}
html[data-theme] body #islandToggle>:is(.island-copy,.island-evaluation){grid-column:2;grid-row:1;width:100%;min-width:0;text-align:center;justify-self:center}
html[data-theme] body #islandToggle>:is(.island-chevron,.thinking-bars){grid-column:3;grid-row:1;justify-self:center;margin:0}
html[data-theme] body :is(.island-copy b,.island-copy small,.puzzle-island-title,.puzzle-island-subtitle){text-align:center}
html[data-theme] body :is(.puzzle-island,.opening-island){display:grid;grid-template-columns:34px minmax(0,1fr) 34px;gap:10px}
html[data-theme] body :is(.puzzle-island-icon,.opening-island>img){width:34px;justify-self:center}
html[data-theme] body :is(.puzzle-island-spark,.island-mark){justify-self:center}
html[data-theme] body .island-rim{opacity:.8;transition:opacity 320ms ease}
html[data-theme] body .island-rim i{animation-duration:14s;background:conic-gradient(transparent 0deg 48deg,var(--room-edge-tail) 80deg,var(--room-edge) 94deg,transparent 103deg 228deg,var(--room-edge-tail) 260deg,var(--room-edge) 274deg,transparent 283deg)}
html[data-theme] body :is(.island,.puzzle-island,.opening-island){transition:border-color 320ms ease,box-shadow 320ms ease,color 320ms ease}
html[data-theme=paper]{--room-island:linear-gradient(135deg,#343b39,#252b29);--room-edge:#f4f5f0;--room-edge-tail:#9ba9a3}
html[data-theme=paper] body .island-rim{opacity:.55}
html[data-theme=quartz]{--room-edge:#ffffff;--room-edge-tail:#7e9aaa}
html[data-theme=warm]{--room-edge:#fff9df;--room-edge-tail:#d6a347}
html[data-theme=cyan]{--bg:#12444b;--panel-top:#205760;--panel-bottom:#174a52;--room-panel:#1b515a;--room-island:linear-gradient(135deg,#277a80,#185960);--room-edge:#d4fffa;--room-edge-tail:#49ead6;--room-island-ink:#ecfffc;--room-island-muted:#b5e5de;--room-border:#70dfd45c;--ink:#e3faf6;--muted:#acd2cc;--accent:#54e4d3}
html[data-theme=cyan] body,html[data-theme=cyan].native-backdrop body{background:radial-gradient(ellipse at 95% 0,#237b7b88,transparent 60%),#12444b}
html.native-backdrop[data-theme=cyan]{background:#12444b!important}
html[data-theme=cyan] body :is(.panel,.entry-card,.classic-card,.classics-link,.opening-catalogue,.opening-detail,.position-card,.statistics-card,.continuation-card,.idea-card,.puzzle-card,.workspace-engine,.settings-module){background:linear-gradient(140deg,#235d64,#194c54);border-color:#70cfc54d}
html[data-theme=cyan] body :is(dialog,#themeSettings,.settings-surface,.sheet-heading,.import-actions){background:#194e56;color:#e3faf6;border-color:#70cfc56b}
html[data-theme=cyan] body :is(button,.quiet,.room-home,.workspace-engine-list button,.workspace-book-moves button){background-color:#28636b;border-color:#6ccdc25c;color:#dcf8f2}
html[data-theme=cyan] body #islandToggle{background:transparent;color:var(--room-island-ink)}
html[data-theme=cyan] body :is(.theme-close,.sheet-close){background:transparent}
html[data-theme=cyan] body .theme-option[aria-pressed=true]{background:#307b7e;border-color:#65eddb}
html[data-theme=cyan] body :is(button.primary,.analyze-button){background:#64e8d6!important;color:#104349!important;border-color:#64e8d6!important}
html[data-theme=cyan] body .analysis-orb{background:radial-gradient(circle at 30% 22%,#f0fffc,#80f4dd 24%,#2bb7b4 67%,#167a82)}
.preview-cyan{--preview-bg:#12444b;--preview-island:#64e8d6}
html.reduce-motion body :is(.island,.puzzle-island,.opening-island,.island-rim){transition:none!important}
@media(prefers-reduced-motion:reduce){html[data-theme] body :is(.island,.puzzle-island,.opening-island,.island-rim){transition:none!important}}

/* Compact evaluation stays on two lines: heading and meter. */
html[data-theme] body .eval-heading{min-width:0;gap:6px;flex-shrink:0}
html[data-theme] body #evalHeading{flex:1 1 auto;min-width:0;white-space:nowrap;text-align:left}
html[data-theme] body #evalScore{flex:0 0 auto;max-width:50%;white-space:nowrap}
html[data-theme] body .eval-track{flex-shrink:0}
@media(orientation:landscape) and (max-height:600px){
 html[data-theme] body .island-evaluation{gap:3px;justify-content:center;align-self:center}
 html[data-theme] body .eval-heading{font-size:9px;line-height:1.2}
 html[data-theme] body #evalScore{font-size:12px;line-height:1.2}
 html[data-theme] body .eval-track{height:5px}
 html[data-theme] body .eval-detail{display:none}
}
/* Spin the artwork on a separate layer; orbit/landing keep owning transform. */
html[data-theme=paper] body .analysis-orb{background:transparent;box-shadow:none}
html[data-theme=paper] body .analysis-orb::before{content:'';display:block;position:absolute;inset:0;border-radius:50%;background:#f4f3ee url('assets/taiji.svg') center/100% 100% no-repeat;animation:taiji-turn 2.4s linear infinite!important}
@keyframes taiji-turn{to{transform:rotate(360deg)}}
html.reduce-motion[data-theme=paper] body .analysis-orb::before{animation:none!important}
@media(prefers-reduced-motion:reduce){html[data-theme=paper] body .analysis-orb::before{animation:none!important}}
html.effects-paused[data-theme=paper] body .analysis-orb::before,html.viewport-settling[data-theme=paper] body .analysis-orb::before{animation-play-state:paused!important}
html[data-theme] body :is(.puzzle-room,.opening-room) .square{container-type:inline-size}
html[data-theme] body :is(.puzzle-room,.opening-room) .capture.move-marker{border-width:6cqw}

/* Interpolate live theme tokens rather than freezing the page in a snapshot. */
html[data-theme=warm]{--island-a:#efdca9;--island-b:#d9bc79;--canvas-a:#fff0d8;--canvas-b:#ffc17e}
html[data-theme=paper]{--island-a:#343b39;--island-b:#252b29;--canvas-a:#f8f5ed;--canvas-b:#ebe4d6}
html[data-theme=cyan]{--island-a:#277a80;--island-b:#185960;--canvas-a:#1b5960;--canvas-b:#12444b}
html[data-theme=quartz]{--island-a:#fff;--island-b:#e9eef2;--canvas-a:#fff;--canvas-b:#f5f7f9}
html[data-theme] body,html[data-theme].native-backdrop body{background:linear-gradient(135deg,var(--canvas-a),var(--canvas-b));min-height:100svh}
html[data-theme] body :is(.island,.puzzle-island,.opening-island,.settings-preview),html[data-theme][data-effects] body .island[data-state]{background:linear-gradient(135deg,var(--island-a),var(--island-b))}
@property --ui-text{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-muted{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-surface{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-raised{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-soft{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-line{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-accent{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-focus{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-on{syntax:"<color>";inherits:true;initial-value:#888}
@property --ui-shadow{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-island-ink{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-island-muted{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-edge{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-edge-tail{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-border{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-board-light{syntax:"<color>";inherits:true;initial-value:#888}
@property --room-board-dark{syntax:"<color>";inherits:true;initial-value:#888}
@property --island-a{syntax:"<color>";inherits:true;initial-value:#888}
@property --island-b{syntax:"<color>";inherits:true;initial-value:#888}
@property --canvas-a{syntax:"<color>";inherits:true;initial-value:#888}
@property --canvas-b{syntax:"<color>";inherits:true;initial-value:#888}
html.theme-color-transition{transition:--ui-text 2000ms cubic-bezier(.2,.8,.2,1),--ui-muted 2000ms cubic-bezier(.2,.8,.2,1),--ui-surface 2000ms cubic-bezier(.2,.8,.2,1),--ui-raised 2000ms cubic-bezier(.2,.8,.2,1),--ui-soft 2000ms cubic-bezier(.2,.8,.2,1),--ui-line 2000ms cubic-bezier(.2,.8,.2,1),--ui-accent 2000ms cubic-bezier(.2,.8,.2,1),--ui-focus 2000ms cubic-bezier(.2,.8,.2,1),--ui-on 2000ms cubic-bezier(.2,.8,.2,1),--ui-shadow 2000ms cubic-bezier(.2,.8,.2,1),--room-island-ink 2000ms cubic-bezier(.2,.8,.2,1),--room-island-muted 2000ms cubic-bezier(.2,.8,.2,1),--room-edge 2000ms cubic-bezier(.2,.8,.2,1),--room-edge-tail 2000ms cubic-bezier(.2,.8,.2,1),--room-border 2000ms cubic-bezier(.2,.8,.2,1),--room-board-light 2000ms cubic-bezier(.2,.8,.2,1),--room-board-dark 2000ms cubic-bezier(.2,.8,.2,1),--island-a 2000ms cubic-bezier(.2,.8,.2,1),--island-b 2000ms cubic-bezier(.2,.8,.2,1),--canvas-a 2000ms cubic-bezier(.2,.8,.2,1),--canvas-b 2000ms cubic-bezier(.2,.8,.2,1)}
html.reduce-motion.theme-color-transition{transition:none!important}
@media(prefers-reduced-motion:reduce){html.theme-color-transition{transition:none!important}}
