/* Shared visual system: charcoal surfaces, sky blue, mint and amber. */
@font-face{font-family:CWSReading;src:url('fonts/ReadingMono.ttf') format('truetype');font-style:normal;font-weight:400 900;font-display:swap}
:root,:root[data-theme=playful],:root[data-world][data-theme=playful]{color-scheme:dark;--page:#101319;--panel:#1d2026;--ink:#e1e2eb;--muted:#bec7d4;--purple:#99cbff;--purple-ink:#99cbff;--on-accent:#003355;--lavender:#272a30;--border:#3f4852;--control:#89919d;--board:#0b0e14;--tile:#272a30;--found:#163e29;--found-ink:#7dffa2;--selected:#ffba20;--selected-ink:#271900;--hint:#ffba20;--focus:#99cbff;--tip:#272a30;--frame:#3f4852;--frame-light:#505a67;--frame-deep:#0b0e14;--shadow:0 5px 0 #0b0e14;--paper:#1d2026;--green:#99cbff;--line:#89919d}
:root[data-theme=light]{color-scheme:light;--page:#fff;--panel:#fff;--ink:#101010;--muted:#282828;--purple:#003659;--purple-ink:#003659;--on-accent:#fff;--lavender:#e7f1fa;--border:#666;--control:#444;--board:#eee;--tile:#fff;--found:#d2efdc;--found-ink:#052d17;--selected:#ffdf70;--selected-ink:#111;--hint:#713000;--focus:#0034b0;--tip:#fff5d9;--paper:#fff;--green:#003659;--line:#444}
:root[data-theme=dark]{color-scheme:dark;--page:#080b10;--panel:#101319;--ink:#fff;--muted:#e1e2eb;--purple:#b8dcff;--purple-ink:#b8dcff;--on-accent:#003355;--lavender:#1d2026;--border:#89919d;--control:#bec7d4;--board:#080b10;--tile:#101319;--found:#09351f;--found-ink:#acffbf;--selected:#ffe08a;--selected-ink:#16110a;--hint:#ffe08a;--focus:#b8dcff;--tip:#1d2026;--paper:#101319;--green:#b8dcff;--line:#bec7d4}
body{background:var(--page);color:var(--ink);font-family:'Trebuchet MS',Arial,sans-serif}
:root[data-reading=true] body,:root[data-reading=true] button,:root[data-reading=true] input,:root[data-reading=true] textarea,:root[data-reading=true] select{font-family:CWSReading,monospace;letter-spacing:.015em;word-spacing:.06em}
:root[data-reading=true] .letter{font-family:CWSReading,monospace;letter-spacing:0;font-weight:700}
.wrap,:root[data-view=play] .wrap{width:min(1300px,calc(100% - 40px))}
.site-header,:root[data-view=play] .site-header{padding-block:15px;gap:20px;min-height:102px;border-bottom:1px solid var(--border)}
.word-search-brand,:root[data-view=play] .word-search-brand{padding:0;background:transparent;box-shadow:none;border-radius:0;gap:12px;min-width:0}
.word-search-mark{width:66px;height:66px;background:#fffdf4;border-radius:16px;border:2px solid #99cbff;box-shadow:0 4px 0 #0b0e14}
.brand-classroom{font-size:1.12rem;letter-spacing:.6px;color:var(--ink)}
.brand-wordmark strong{font-size:2rem;line-height:1.1;letter-spacing:-.8px;color:var(--purple-ink)}
.word-search-brand .brand-wordmark small,:root[data-view=play] .word-search-brand small{display:block;font-size:.7rem;color:var(--muted)}
.header-actions{gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.header-actions .quiet-button,:root[data-view=play] .header-actions .quiet-button{background:var(--panel);border:1px solid var(--border);min-height:44px;padding:10px 12px;font-size:.8rem;box-shadow:0 3px 0 var(--frame-deep)}
.teacher-link svg,.teacher-actions svg{width:21px;height:21px;flex:none}
.header-actions .teacher-link{font-weight:900;color:var(--purple-ink)}
.world-backdrop{background:var(--scene-color)}
.world-shade{background:linear-gradient(180deg,#101319eb 0%,#10131980 35%,#10131980 75%,#101319e6 100%)}
.world-toolbar{display:flex;gap:12px;align-items:center;margin:18px 0;padding:12px;border:1px solid var(--border);border-radius:16px;background:var(--panel);box-shadow:0 4px 0 var(--frame-deep)}
.world-location{display:block;background:transparent;box-shadow:none;max-width:200px;font-size:.95rem;color:var(--ink);padding:0;margin-right:auto}
.world-toolbar .level-picker{flex:1;max-width:560px;background:var(--board);border:0;box-shadow:none;border-radius:12px;padding:5px 8px 8px}
.level-picker legend{font-size:.72rem;margin:0 0 3px;color:var(--muted)}
.level-options label>span,.custom-levels .level-options label>span,.level-options input:checked+span,.custom-levels .level-options input:checked+span{min-height:54px;border-width:1px;padding:6px 5px;border-radius:9px;box-shadow:none}
.level-options label>span{border-color:transparent;background:transparent;color:var(--muted)}
.level-options input:checked+span{background:var(--lavender);color:var(--ink);border-color:var(--control);box-shadow:0 3px 0 var(--purple)}
.level-options b{font-size:.88rem}.level-options small{font-size:.65rem;font-weight:500;line-height:1.3}
.level-options i{width:21px;height:21px;font-size:.72rem;border-width:2px}
:root[data-theme=playful] .level-options input[value=easy]+span i{color:#7dffa2}
:root[data-theme=playful] .level-options input[value=medium]+span i{color:#ffba20}
:root[data-theme=playful] .level-options input[value=hard]+span i{color:#ffb4ab}
.primary-button{background:var(--purple);color:var(--on-accent);border:1px solid var(--purple);box-shadow:0 4px 0 var(--frame-deep)}
:root[data-theme=dark] .primary-button{color:var(--on-accent)}
.secondary-button{background:var(--lavender);border:1px solid var(--border);color:var(--ink);box-shadow:0 3px 0 var(--frame-deep)}
.secondary-button:hover,.quiet-button:hover{border-color:var(--purple);background:var(--tile)}
.play-scene{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:clamp(16px,2vw,28px);align-items:start;justify-content:stretch;width:100%;max-width:none;margin:0}
.word-tools{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:8px;margin:0 0 10px}
.word-tools .level-picker{width:100%;max-width:none;min-width:0;padding:5px 7px 7px;box-shadow:none}
.word-tools .level-picker legend{font-size:.75rem;margin:0 0 2px}
.word-tools .level-options{gap:4px}
.word-tools .level-options label>span,.word-tools .level-options input:checked+span{min-height:52px;padding:5px 3px}
.word-tools .level-options b{gap:3px;font-size:.8rem}
.word-tools .level-options i{width:19px;height:19px;font-size:.68rem}
.word-tools .level-options small{font-size:.6rem;line-height:1.2;margin-top:3px}
.word-tools #print-button{width:48px;min-width:48px;height:48px;min-height:48px;padding:10px}
:root[data-view=play] #worlds-button{width:auto;min-width:68px;padding:7px 9px;gap:5px;white-space:nowrap}
:root[data-view=play] #worlds-button svg{width:18px;height:18px;flex:none}
.world-board,:root[data-world] .world-board,:root[data-custom-color=true][data-theme=playful] .world-board{width:100%;min-width:0;box-sizing:border-box;background:var(--panel);border:1px solid var(--border);box-shadow:0 7px 0 var(--frame-deep),0 12px 30px #0004;border-radius:20px;padding:18px}
.world-board:before,.world-board:after{display:none}
.board-heading{border:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0}
.board-heading h1,.board-heading h2{font-size:1.55rem;letter-spacing:-.5px;margin:0}
.board-heading .eyebrow{font-size:.65rem;letter-spacing:1px;color:var(--purple-ink)}
.board-instructions{font-size:.8rem;color:var(--muted);margin:10px 0}
.grid-scroll{border:1px solid var(--border);background:var(--board);padding:var(--grid-padding,12px);border-radius:12px;box-shadow:inset 0 3px 12px #0005;width:min(100%,var(--grid-width,560px));height:calc(var(--grid-width,560px) * 1.25);max-height:none}
.letter-grid,.grid-row{gap:var(--grid-gap,8px)}.letter{aspect-ratio:auto;height:var(--cell-height,52px);font-size:var(--cell-font,24px);border:1px solid var(--border);border-radius:8px;background:var(--tile);color:var(--ink);box-shadow:0 3px 0 #080b10;font-weight:900}
.letter:hover{background:var(--lavender);border-color:var(--control)}
.letter.is-found{background:var(--found);color:var(--found-ink);border:2px solid var(--found-ink);box-shadow:0 2px 0 var(--found-ink)}
.letter.is-selected{background:var(--selected);color:var(--selected-ink);border:2px solid var(--selected-ink);box-shadow:none}
.letter.is-hint{outline:3px dashed var(--hint)}
.sidebar{width:100%;min-width:0;align-self:start}
.word-card{box-sizing:border-box;width:100%;padding:18px;background:var(--panel);border:1px solid var(--border);border-radius:16px;box-shadow:0 5px 0 var(--frame-deep);transform:none}
.word-card .list-heading h2{font-size:1.2rem}.word-list,.word-list.long-words{grid-template-columns:1fr;max-height:320px;gap:8px}
.word-item{background:var(--tile);border:1px solid var(--border);border-radius:10px;font-size:.9rem;min-height:40px;padding:9px 12px;letter-spacing:1px}
.word-item.found{border-color:var(--found-ink)}
.count-badge{background:var(--found);color:var(--found-ink);border:1px solid var(--found-ink)}
progress::-webkit-progress-value{background:linear-gradient(90deg,#7dffa2,#99cbff)}progress::-moz-progress-bar{background:var(--purple)}
.guide-space,:root[data-background=color] .guide-space{display:block;min-height:0;padding:0;position:static;width:auto}
.guide-bubble{display:flex;align-items:center;gap:12px;max-width:100%;width:100%;padding:16px;margin:0;text-align:left;background:var(--panel);border:1px solid var(--border);border-radius:16px;box-shadow:0 5px 0 var(--frame-deep)}
.guide-bubble:before{display:none}.guide-label{color:var(--purple-ink);font-size:.7rem;letter-spacing:1px}.guide-bubble p{font-size:.84rem;font-weight:600}
.guide-bubble .mission{font-size:.74rem;color:var(--muted)}
.guide-portrait{width:68px;height:76px;flex:none;object-fit:cover;object-position:82% 22%;border-radius:13px;border:1px solid var(--control)}

.feedback{border-color:var(--border);font-size:.8rem}.board-actions .secondary-button{min-height:44px;font-size:.8rem}
#hint-button{background:var(--selected);color:var(--selected-ink);border-color:var(--selected)}
.puzzle-maker-action{padding:20px 0}
#print-sheet,#answer-sheet{display:none}
.site-footer{box-sizing:border-box;display:block;width:100%;margin:32px 0 0;padding:24px 20px;border-top:1px solid var(--border);background:var(--page);color:var(--muted);text-align:center;font-size:.85rem;line-height:1.5}
.site-footer p{margin:0;color:inherit;font-size:inherit}.site-footer .copyright-year{white-space:nowrap}
.world-tab{border:1px solid var(--border);box-shadow:0 5px 0 var(--frame-deep)}.world-welcome{padding-top:35px}.world-invitation{color:var(--muted)}
dialog{border:1px solid var(--control);border-radius:18px;box-shadow:0 25px 100px #0009}dialog::backdrop{background:#080b10c9}
.custom-dialog input:not([type=radio]):not([type=checkbox]),.custom-dialog textarea,select{background:var(--board);color:var(--ink);border-color:var(--control)}
.teacher-dialog{width:min(480px,calc(100% - 24px))}.teacher-dialog h3{font-size:1.2rem;margin:0 0 6px;overflow-wrap:anywhere}
.worksheet-summary{margin:20px 0}.worksheet-summary p{font-size:.82rem;margin:0;color:var(--muted)}.worksheet-summary #worksheet-size-note{margin-top:10px}
.teacher-dialog .text-button{min-height:44px;padding:8px 0;font-size:.85rem;text-align:left;overflow-wrap:anywhere}.teacher-make{margin-top:8px}
.teacher-dialog select{display:block;width:100%;min-height:48px;padding:10px;border-radius:9px;border:1px solid var(--control)}
.teacher-actions{display:flex;align-items:center;gap:12px;margin:18px 0 10px}.teacher-actions .primary-button{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;min-height:48px}.icon-button{width:48px;height:48px;padding:11px;display:grid;place-items:center}.teacher-dialog #worksheet-status{margin:12px 0;font-size:.85rem}.teacher-dialog #worksheet-status:empty{margin:0}.print-help{border-top:1px solid var(--border)}.print-help summary{min-height:44px;font-size:.85rem;padding:10px 0}.print-help p{font-size:.8rem}.print-help .check-option{margin:0 0 10px}
:root[data-reading=true] .header-actions .quiet-button{font-size:.74rem}
@media(max-width:1000px){.world-location{display:none}.site-header,:root[data-view=play] .site-header{flex-wrap:wrap}.header-actions{margin-left:auto}.header-actions .tool-label{display:none}.header-actions .teacher-link{width:auto}}
@media(max-width:760px){
 .wrap,:root[data-view=play] .wrap{width:calc(100% - 20px)}
 .site-header,:root[data-view=play] .site-header{gap:12px;padding-block:12px;flex-wrap:wrap;justify-content:center}
 .word-search-brand,:root[data-view=play] .word-search-brand{padding:0;gap:10px}.word-search-mark{width:56px;height:56px}
 .brand-classroom{font-size:.95rem}.brand-wordmark strong{font-size:1.7rem}.word-search-brand .brand-wordmark small,:root[data-view=play] .word-search-brand small{font-size:.65rem}
 .header-actions,:root[data-view=play] .header-actions{width:100%;justify-content:center;gap:6px;margin:0}
 .header-actions .quiet-button,:root[data-view=play] .header-actions .quiet-button{width:44px;min-width:44px;min-height:44px;padding:7px}
 .header-actions .teacher-link,:root[data-view=play] .header-actions .teacher-link{width:auto;flex:1;max-width:190px;padding:8px 12px;font-size:.78rem}
 .world-toolbar{display:grid;grid-template-columns:1fr auto;margin:12px 0;padding:8px;gap:6px}
 .world-toolbar>.level-picker{max-width:none;width:100%;grid-column:1/-1;grid-row:2;padding:3px 5px 6px}
 .level-picker legend{font-size:.7rem;margin-bottom:2px}.level-options b{font-size:.8rem}.level-options small,.custom-levels .level-options small{font-size:.61rem}
 .level-options label>span,.custom-levels .level-options label>span,.level-options input:checked+span,.custom-levels .level-options input:checked+span{padding:5px 2px;min-height:52px}
 .play-scene{display:flex;gap:10px}.world-board,:root[data-world] .world-board{padding:11px;border-radius:16px;border-width:1px}
 .board-heading h1,.board-heading h2{font-size:1.2rem}.board-heading .eyebrow{font-size:.6rem}.board-instructions{font-size:.72rem;margin:7px 0}
 .grid-scroll{--grid-padding:8px}.letter-grid,.grid-row{gap:var(--grid-gap,4px)}
 .word-card{padding:10px 12px;border-radius:14px}.word-card .list-heading h2{font-size:.9rem}
 .word-list,.word-list.long-words{display:flex;flex-wrap:wrap;gap:5px;max-height:66px;margin-top:6px;padding:2px}
 .word-item{font-size:.7rem;min-height:28px;padding:4px 7px;letter-spacing:.5px}.word-check{width:15px;height:15px}
 .guide-space,:root[data-background=color] .guide-space{display:none}
 .board-actions .secondary-button{font-size:.72rem;padding:8px 10px}.teacher-dialog{padding:20px}
}
@media(max-width:370px){.word-search-mark{width:52px;height:52px}.brand-wordmark strong{font-size:1.5rem}.brand-classroom{font-size:.9rem}}
/* The same palette in Studio, sign-in, setup guides and diagnostics. */
.site-admin,.site-document{background:var(--page);color:var(--ink)}
.site-admin a,.site-document a{color:var(--purple-ink)}
.site-admin .library-panel,.site-admin .editor-panel,.site-admin .delivery,.site-admin .install-note,.site-admin .mode-card,.site-admin dialog,.site-document .card,.site-document .note,.site-document .table-wrap{background:var(--panel);color:var(--ink);border-color:var(--border)}
.site-admin input,.site-admin textarea,.site-admin select{background:var(--board);color:var(--ink);border-color:var(--control);accent-color:var(--purple)}
.site-admin .primary{background:var(--purple);color:var(--on-accent);border-color:var(--purple);box-shadow:0 4px 0 var(--frame-deep)}
.site-admin .secondary,.site-admin .preview-heading button{background:var(--lavender);color:var(--ink);border-color:var(--control)}
.site-admin .brand span,.site-admin .connection-status,.site-admin .words-heading output{background:var(--lavender);color:var(--purple-ink);border-color:var(--control)}
.site-admin header,.site-admin .save-bar,.site-admin .optional-story,.site-admin .import-tools,.site-admin .color-options{border-color:var(--border)}
.site-admin .muted,.site-admin #empty-state,.site-document .muted,.site-document .intro{color:var(--muted)}
.site-admin #adventure-list button{background:var(--tile);color:var(--ink);border-color:var(--border)}
.site-admin #adventure-list button[aria-current=true]{background:var(--lavender);border-color:var(--purple);color:var(--purple-ink)}
.site-admin .color-preview span{color:var(--on-accent)}.site-admin .status.error{color:#ffb4ab}.site-admin .text-button{color:var(--purple-ink)}
.site-admin code,.site-document code{background:var(--lavender);color:var(--ink)}.site-document pre,.site-document pre code{background:var(--board);color:var(--ink)}
.site-document th,.site-document td,.site-document table{border-color:var(--border);background:var(--panel);color:var(--ink)}
.site-document input,.site-document select,.site-document textarea{background:var(--board);color:var(--ink);border-color:var(--control)}
.site-document button{background:var(--purple);color:var(--on-accent);border-color:var(--purple)}
.site-admin :focus-visible,.site-document :focus-visible{outline:3px solid var(--focus);outline-offset:4px}
@media(forced-colors:active){.world-backdrop{display:none!important}.letter.is-found,.word-item.found{border:2px solid LinkText;box-shadow:none}.letter.is-selected{background:Highlight;color:HighlightText}.level-options input:checked+span{outline:2px solid Highlight}.primary-button,.secondary-button,.quiet-button,.site-admin button{border:1px solid ButtonText;box-shadow:none}}
@media print{.site-document,.site-admin,.site-document .card,.site-document .note,.site-document pre,.site-document pre code,.site-document td,.site-document th{background:white!important;color:black!important}.site-document a,.site-admin a{color:black!important}.site-document main{padding:0}.site-document button{display:none}}

/* Homepage: the existing charcoal, sky, mint and amber palette carries through. */
:root[data-view=worlds] .world-backdrop{display:none}
:root[data-view=worlds] .site-header{width:min(1420px,calc(100% - 48px));min-height:88px;padding-block:10px;border-bottom-color:var(--border)}
:root[data-view=worlds] .header-actions{gap:8px;flex-wrap:nowrap}
.home-nav-item{display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:10px 14px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--ink);font-size:.85rem;font-weight:850;text-decoration:none;box-shadow:none}
.home-nav-item svg{width:21px;height:21px;flex:none}
.home-nav-item:hover,.home-nav-item:focus-visible{border-color:var(--border);background:var(--panel);color:var(--purple-ink)}
.play-tool{display:none}
:root[data-view=play] .home-nav-item{display:none}
:root[data-view=play] .play-tool{display:flex}
:root[data-view=worlds]{--home-content-gutter:max(24px,calc((100vw - 1320px)/2))}
:root[data-view=worlds] #world-picker{margin:0;padding:0}
.home-hero{position:relative;isolation:isolate;overflow:hidden;width:100vw;max-width:100vw;min-height:clamp(290px,35vw,440px);aspect-ratio:16/5;margin:-12px 0 46px;margin-left:calc(50% - 50vw);border:0;border-radius:0;background:#171b21;box-shadow:0 9px 0 var(--frame-deep),0 18px 46px #0006}
.hero-image,.hero-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-image{z-index:-2;object-fit:cover;object-position:center 42%;opacity:.82}
.hero-shade{z-index:-1;background:linear-gradient(90deg,#101319f5 0%,#101319db 34%,#10131960 66%,#10131920 100%),linear-gradient(0deg,#101319b8,transparent 35%)}
.hero-copy{position:absolute;left:var(--home-content-gutter);top:50%;width:min(580px,64%);transform:translateY(-50%)}
.hero-copy .eyebrow{color:var(--purple-ink);font-weight:900;font-size:.72rem;letter-spacing:1.7px;margin:0 0 12px!important}
.hero-copy h1{max-width:560px;margin:0 0 12px;color:#fff;font-size:clamp(2rem,4.2vw,3.65rem);line-height:1.06;letter-spacing:-1.6px;text-wrap:balance}
.hero-copy>p:not(.eyebrow){max-width:470px;margin:0 0 22px;color:#f0f1f4;font-size:clamp(.9rem,1.25vw,1.08rem);line-height:1.5}
.hero-copy .primary-button{min-height:48px;padding-inline:19px;border-radius:12px;font-size:.9rem}
.hero-copy .primary-button span{margin-left:10px}
.hero-controls{position:absolute;inset:0;pointer-events:none}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);width:80px;height:80px;display:grid;place-items:center;border:0;border-radius:0;background:transparent;color:#fff;font-family:Arial,sans-serif;font-size:3.8rem;font-weight:400;line-height:1;opacity:.58;box-shadow:none;pointer-events:auto;transition:opacity .15s ease,transform .15s ease}
.hero-previous{left:clamp(12px,3vw,44px)}.hero-next{right:clamp(12px,3vw,44px)}
.hero-arrow:hover,.hero-arrow:focus-visible{background:transparent;color:#fff;opacity:1;transform:translateY(-50%) scale(1.08)}
.hero-arrow:focus-visible{outline:2px solid #fff;outline-offset:-8px;border-radius:50%}
.hero-dots{position:static;width:max-content;margin-top:16px;transform:none;display:flex;align-items:center;gap:0;pointer-events:auto}
.hero-dot{position:relative;width:32px;height:36px;min-height:36px;padding:0;border:0;border-radius:50%;background:transparent;display:grid;place-items:center}
.hero-dot:before{content:"";width:8px;height:8px;border-radius:50%;background:#ffffff80}
.hero-dot[aria-current=true]:before{width:14px;height:14px;border:2px solid #fff;background:transparent}
.hero-dot:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.hero-dot:hover:before{background:#fff}
.hero-dot[aria-current=true]:hover:before{background:transparent}
.home-shelves{padding:0 0 10px}
.home-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:0 0 22px}
.home-section-heading .eyebrow{margin-bottom:6px!important;color:var(--purple-ink)}
.home-section-heading h2{margin:0 0 5px;font-size:clamp(1.7rem,3vw,2.35rem);letter-spacing:-.7px}
.home-section-heading .world-invitation{margin:0;color:var(--muted);font-size:.9rem}
.home-section-heading>.primary-button{flex:none;min-height:46px}
.game-shelf,.category-shelf{margin:0 0 34px}
.shelf-heading,.category-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 13px}
.shelf-heading h3,.category-heading h3{margin:0;font-size:1.22rem;letter-spacing:-.25px}
.shelf-heading>span,.category-heading p{margin:0;color:var(--muted);font-size:.76rem}
.world-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.world-tab{position:relative;display:flex;flex-direction:column;align-items:stretch;min-width:0;overflow:hidden;aspect-ratio:auto;padding:0;border:1px solid var(--border);border-radius:15px;background:var(--panel);color:inherit;text-align:left;text-decoration:none;box-shadow:0 4px 0 var(--frame-deep);transition:transform .16s ease,border-color .16s ease}
.world-tab:hover{transform:translateY(-3px);border-color:var(--purple)}
.world-tab:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.world-tab img{position:relative;display:block;flex:none;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center 34%;opacity:.92;background:var(--page)}
.world-tab img[hidden]{display:none}
.world-tab:after{content:none}
.world-tab-label{position:static;display:block;flex:1 0 auto;padding:16px;background:var(--panel);color:var(--ink)}
.world-tab strong{display:block;color:var(--ink);font-size:1.12rem;line-height:1.15}
.world-tab small{display:block;margin-top:6px;color:var(--muted);font-size:.75rem}
.enter-world{display:inline-block;margin-top:11px;padding:7px 10px;border:1px solid #ffffff8c;border-radius:99px;background:#101319a8;color:#fff;font-size:.71rem;font-weight:800}
.category-shelves{display:grid;gap:1px}
.category-shelf{min-width:0}
.category-games{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.category-placeholder{display:flex;min-height:165px;align-items:center;justify-content:center;gap:12px;padding:20px;border:1px dashed var(--control);border-radius:15px;background:linear-gradient(130deg,var(--panel),var(--page));color:var(--muted);text-align:center;font-size:.84rem}
.category-placeholder span{font-size:1.5rem;color:var(--purple-ink)}
.catalog-empty{margin:20px 0;padding:20px;border:1px dashed var(--control);border-radius:14px;color:var(--homepage-foreground,var(--ink));text-align:center;font-size:1rem}
.search-dialog{width:min(620px,calc(100% - 24px));height:auto;max-height:min(80vh,760px)}
.search-dialog input{display:block;width:100%;min-height:48px;margin-top:7px;padding:12px;border:1px solid var(--control);border-radius:10px;background:var(--board);color:var(--ink);font:inherit}
.search-results{display:grid;gap:7px;max-height:45vh;overflow:auto;margin-top:14px}
.search-result{display:flex;justify-content:space-between;gap:12px;align-items:center;width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--tile);color:var(--ink);text-align:left;text-decoration:none;cursor:pointer}
.search-result:hover{border-color:var(--purple);background:var(--lavender)}
#catalog-notice{margin:0 0 20px}
@media(max-width:850px){
 :root[data-view=worlds] .site-header{width:calc(100% - 28px);min-height:74px;gap:10px}
 :root[data-view=worlds] .word-search-mark{width:52px;height:52px}
 .home-nav-item{min-height:44px;padding:8px 10px;font-size:.76rem;gap:6px}
 .home-nav-item svg{width:19px;height:19px}
 .home-hero{aspect-ratio:12/5;min-height:280px}
 .world-tabs,.category-games{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
 :root[data-view=worlds] .site-header{display:flex;justify-content:space-between;flex-wrap:wrap;width:calc(100% - 24px);padding-block:9px}
 :root[data-view=worlds] .word-search-brand{gap:7px}
 :root[data-view=worlds] .word-search-mark{width:44px;height:44px}
 :root[data-view=worlds] .brand-classroom{font-size:.74rem}
 :root[data-view=worlds] .brand-wordmark strong{font-size:1.25rem}
 :root[data-view=worlds] .word-search-brand .brand-wordmark small{font-size:.58rem}
 :root[data-view=worlds] .header-actions{width:100%;justify-content:space-around;gap:3px}
 .home-nav-item{flex:1;gap:5px;padding-inline:5px;font-size:.72rem;white-space:nowrap}
 .home-nav-item svg{width:18px;height:18px}
 .home-hero{min-height:330px;aspect-ratio:auto;margin-top:-12px}
 .hero-image{object-position:68% center}
 .hero-shade{background:linear-gradient(90deg,#101319ed,#10131985 68%,#10131940),linear-gradient(0deg,#101319a8,transparent 50%)}
 .hero-copy{left:var(--home-content-gutter);right:var(--home-content-gutter);top:auto;bottom:58px;transform:none;width:auto}
 .hero-copy .eyebrow{font-size:.62rem}
 .hero-copy h1{font-size:clamp(1.8rem,9vw,2.5rem);max-width:420px}
 .hero-copy>p:not(.eyebrow){font-size:.84rem;max-width:370px;margin-bottom:15px}
 .hero-arrow{width:64px;height:64px;font-size:2.4rem}
 .hero-previous{left:8px}.hero-next{right:8px}
 .home-section-heading{align-items:flex-start;flex-direction:column;margin-bottom:19px}
 .home-section-heading>.primary-button{width:100%;justify-content:center}
 .shelf-heading,.category-heading{align-items:flex-start;flex-direction:column;gap:4px}
 .world-tabs,.category-games{gap:10px}
 .world-tab{aspect-ratio:auto;border-radius:12px}
 .world-tab img{aspect-ratio:4/3}
 .world-tab-label{padding:12px 10px}
 .world-tab strong{font-size:.95rem}
 .world-tab small{font-size:.68rem;margin-top:4px}
 .enter-world{margin-top:7px;padding:5px 8px;font-size:.62rem}
 .category-placeholder{min-height:132px;padding:14px;font-size:.76rem}
}
@media(max-width:1000px){
 :root[data-view=worlds]{--home-content-gutter:20px}
}
@media(max-width:480px){:root[data-view=worlds]{--home-content-gutter:12px}}

/* The configurable, mockup-purple color fills every edge of the homepage. */
:root[data-view=worlds] body{background:var(--homepage-background,#432577);color:var(--homepage-foreground,var(--ink))}
:root[data-view=worlds] .brand-classroom,:root[data-view=worlds] .brand-wordmark strong,:root[data-view=worlds] .brand-wordmark small,:root[data-view=worlds] .home-nav-item{color:var(--homepage-foreground,var(--ink))}
:root[data-view=worlds] .home-nav-item:hover,:root[data-view=worlds] .home-nav-item:focus-visible{color:var(--ink)}
:root[data-view=worlds] .home-shelves{color:var(--homepage-foreground,var(--ink))}
:root[data-view=worlds] .home-section-heading .eyebrow,:root[data-view=worlds] .home-section-heading .world-invitation,:root[data-view=worlds] .shelf-heading>span,:root[data-view=worlds] .category-heading p,:root[data-view=worlds] #catalog-notice{color:var(--homepage-foreground,var(--ink))}
:root[data-view=worlds] .site-footer{background:var(--homepage-background,#432577);color:var(--homepage-foreground,var(--ink))}
:root[data-view=worlds]{overflow-x:clip}
@media(max-width:370px){.home-nav-item{font-size:.65rem}.world-tabs,.category-games{grid-template-columns:1fr}.world-tab{aspect-ratio:16/9}}
@media(prefers-reduced-motion:reduce){.world-tab{transition:none}.world-tab:hover{transform:none}}
@media(forced-colors:active){.home-hero,.world-tab,.category-placeholder{border:2px solid CanvasText;box-shadow:none}.hero-image,.hero-shade{display:none}.hero-copy h1,.hero-copy>p:not(.eyebrow){color:CanvasText}.hero-arrow,.hero-dot,.search-result{border:1px solid ButtonText;color:ButtonText;background:Canvas}.hero-dot:before{background:ButtonText}.hero-dot[aria-current=true]:before{background:Canvas;border-color:ButtonText}}
:root[data-view=worlds] .header-actions .home-nav-item{background:transparent;border:1px solid transparent;box-shadow:none}
:root[data-view=worlds] .header-actions .home-nav-item:hover,:root[data-view=worlds] .header-actions .home-nav-item:focus-visible{background:var(--panel);border-color:var(--border);box-shadow:none}
:root[data-view=play] .header-actions .teacher-link{display:flex}
@media(max-width:370px){.home-nav-item{flex-direction:column;white-space:normal;line-height:1.15;text-align:center}}

/* Keep the main navigation reachable and readable as children scroll. */
:root[data-view=worlds] .site-header,:root[data-view=play] .site-header{position:sticky;top:0;z-index:50}
:root[data-view=worlds] .site-header{background-color:var(--homepage-background,#432577)}
:root[data-view=play] .site-header{background-color:var(--page)}
.category-heading h3{text-transform:uppercase;font-size:1.18rem;letter-spacing:.045em;line-height:1.3}
.home-seo-copy{max-width:900px;margin:22px auto 34px;padding:22px 0 4px;border-top:1px solid var(--border)}
.home-seo-copy h2{margin:0 0 8px;font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.3}
.home-seo-copy p{margin:0;color:var(--homepage-foreground,var(--ink));font-size:1rem;line-height:1.65}
@media(max-width:760px){
 :root[data-view=worlds] .site-header{padding-block:8px}
 .home-nav-item{font-size:1rem;line-height:1.25;min-height:48px;white-space:normal}
 .home-nav-item svg{width:20px;height:20px}
 :root[data-view=worlds] .brand-classroom{font-size:.86rem}
 :root[data-view=worlds] .word-search-brand .brand-wordmark small{font-size:.8rem}
 .hero-copy .eyebrow,.home-section-heading .eyebrow{font-size:.9rem;letter-spacing:1px}
 .hero-copy>p:not(.eyebrow),.home-section-heading .world-invitation{font-size:1rem;line-height:1.5}
 .hero-copy .primary-button,.home-section-heading>.primary-button{font-size:1rem;min-height:48px}
 .shelf-heading>span,.category-heading p{font-size:1rem;line-height:1.45}
 .category-heading h3{font-size:1.15rem;line-height:1.35}
 .world-tab strong{font-size:1rem;line-height:1.3}
 .world-tab small{font-size:1rem;line-height:1.35}
 .enter-world{font-size:1rem;line-height:1.25;padding:5px 9px}
 .category-placeholder{font-size:1rem;line-height:1.45}
 #catalog-notice{font-size:1rem;line-height:1.5}
 :root[data-view=worlds] .site-footer{font-size:1rem;line-height:1.5}
 :root[data-view=play] .header-actions .quiet-button{font-size:1rem;min-height:48px}
 .home-seo-copy{margin-block:18px 28px;padding-top:18px}
 .home-seo-copy p{font-size:1rem}
}
@media(max-width:370px){
 .home-nav-item{font-size:1rem;line-height:1.2}
 .world-tabs,.category-games{grid-template-columns:1fr}
 .world-tab img{aspect-ratio:16/9}
}
@media(forced-colors:active){
 :root[data-view=worlds] .site-header,:root[data-view=play] .site-header{background:Canvas;color:CanvasText;border-bottom:1px solid CanvasText}
 :root[data-view=worlds] .brand,:root[data-view=worlds] .brand-wordmark strong,:root[data-view=worlds] .brand-wordmark small,:root[data-view=worlds] .home-nav-item{color:CanvasText}
 .home-seo-copy{border-color:CanvasText}
}

/* Player navigation: a consistent, easy-to-scan icon above each label. */
.header-actions .quiet-button,
:root[data-view=play] .header-actions .quiet-button,
:root[data-view=worlds] .header-actions .home-nav-item{
  display:flex;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;min-width:66px;min-height:64px;padding:7px 9px;text-align:center;
  font-size:.78rem;line-height:1.15;white-space:normal;border-radius:12px
}
.header-actions .quiet-button svg,.header-actions .home-nav-item svg{display:block;width:23px;height:23px;flex:none}
.header-actions .quiet-button>span,.header-actions .home-nav-item>span{display:block}
.header-actions .quiet-button .help-icon{display:grid}
:root[data-view=worlds] .header-actions .home-nav-item{min-width:92px}
:root[data-view=play] .header-actions .teacher-link{display:flex}
:root[data-view=worlds] .header-actions .play-tool{display:none}
:root[data-view=play] .header-actions .home-nav-item:not(.teacher-link){display:none}
#print-button{width:auto;min-width:66px;min-height:64px;flex:0 0 auto;padding:7px 9px}
#print-button svg{width:23px;height:23px}
.settings-sound-button{display:flex;align-items:center;gap:12px;min-height:48px;width:100%;padding:10px 13px;border:1px solid var(--control);border-radius:12px;background:var(--board);color:var(--ink);font-weight:800;text-align:left}
.settings-sound-button svg{width:24px;height:24px;flex:none}
.settings-sound-button[aria-pressed=true]{border-color:var(--purple);background:var(--lavender);color:var(--purple-ink)}
.settings-group{margin:20px 0 0;padding:0}
.settings-group>legend,.settings-group>.level-field>legend{margin-bottom:9px;font-size:1rem;font-weight:900;color:var(--ink)}
#settings-dialog .settings-group>.field-label{font-size:.9rem}
#settings-dialog .settings-group select{margin-bottom:6px}
#settings-dialog .level-picker{max-width:none;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
#settings-dialog .level-picker .level-field{padding:0}
#settings-dialog .level-options{gap:8px}
#settings-dialog .level-options label>span{min-height:64px;padding:9px 6px;font-size:.88rem}
#settings-dialog .level-options input:checked+span{padding:8px 5px}
#settings-dialog .level-options small{font-size:.72rem;line-height:1.3}
#settings-dialog .level-options i{width:21px;height:21px}
#settings-dialog .settings-level-note{margin:9px 0 0}
@media(max-width:760px){
  .header-actions,:root[data-view=play] .header-actions{width:100%;justify-content:space-between;gap:3px;margin:0}
  .header-actions .quiet-button,:root[data-view=play] .header-actions .quiet-button,
  :root[data-view=worlds] .header-actions .home-nav-item{flex:1 1 0;min-width:0;min-height:64px;padding:6px 3px;font-size:.82rem;line-height:1.12}
  :root[data-view=worlds] .header-actions .home-nav-item{min-width:0}
  .header-actions .quiet-button svg,.header-actions .home-nav-item svg{width:22px;height:22px}
  #print-button{flex:1 1 0;min-width:0;min-height:64px;padding:6px 3px}
}
@media(max-width:380px){
  :root[data-view=play] .header-actions .quiet-button{font-size:.75rem}
  .header-actions .quiet-button svg{width:20px;height:20px}
}
@media(forced-colors:active){
  .settings-sound-button{border:1px solid ButtonText;background:Canvas;color:CanvasText}
  .settings-sound-button[aria-pressed=true]{outline:2px solid Highlight}
}

/* Keep Studio artwork controls readable on the shared dark palette. */
.site-admin .art-field{background:var(--panel);color:var(--ink);border-color:var(--border)}
.site-admin .art-field .muted{color:var(--muted)}
.site-admin .art-field input[type=file]{background:var(--board);color:var(--ink);border:1px solid var(--control)}
.site-admin .art-field input[type=file]::file-selector-button{background:var(--lavender);color:var(--ink);border:1px solid var(--control)}

/* Extend the sticky header's surface and shadow across the full viewport. */
:root[data-view=worlds] .site-header,:root[data-view=play] .site-header{position:sticky;isolation:isolate;background:transparent;border:0;box-shadow:none}
:root[data-view=worlds] .site-header::before,:root[data-view=play] .site-header::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:var(--page);border-bottom:1px solid var(--border);box-shadow:0 4px 16px rgba(15,20,28,.18);pointer-events:none}
:root[data-view=worlds] .site-header::before{background:var(--homepage-background,#432577)}
@media(forced-colors:active){
 :root[data-view=worlds] .site-header::before,:root[data-view=play] .site-header::before{background:Canvas;border-color:CanvasText;box-shadow:none}
}