/* EMBERWILD Night Library. Semantic tokens cover host pages only: local and
   external game documents keep their own presentation and input behavior. */
:root{color-scheme:dark;--paper:#0d1520;--surface:#172331;--surface-hover:#203247;--ink:#edf4fc;--muted:#a6b8cc;--line:#2c3c50;--berry:#79caff;--accent:#79caff;--plum:#142232;--soft:#172638;--rose:#f1b884;--gold:#79caff;--gold-light:#b1dfff;--radius:12px;--header:76px}
body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}::selection{background:#79caff;color:#0d1520}h1,h2,h3{font-family:Arial,Helvetica,sans-serif;font-weight:700;letter-spacing:-.025em;text-wrap:balance}h1 em,h2 em{font-family:inherit;font-weight:inherit;font-style:normal;color:var(--accent)}p{text-wrap:pretty}.wrap{width:min(1320px,calc(100% - 80px))}.eyebrow{font-size:10px;color:var(--accent);letter-spacing:.08em}a,button{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}a:hover{transition:color .15s}h2[tabindex],#screen-controls,#saved-progress{scroll-margin-top:110px}
/* Sticky navigation uses a solid surface, so its contrast does not depend on
   whatever gameplay image happens to pass behind it. */
.site-header{background:#101c29;border-bottom:1px solid var(--line)}.header-inner{gap:36px}.brand{font-size:27px;letter-spacing:-.04em;color:var(--ink);gap:10px;min-height:44px}.brand img{width:36px;height:36px;object-fit:contain}.brand-dot{display:none}.primary-nav{margin-left:20px;gap:29px}.primary-nav a{display:flex;align-items:center;min-height:44px;color:var(--muted);font-size:13px;font-weight:600}.primary-nav a:hover,.primary-nav a[aria-current]{color:var(--ink)}.primary-nav a[aria-current]:after{width:100%;height:3px;bottom:-16px;background:var(--accent)}.header-actions{margin-left:auto;padding-left:24px;gap:17px}.site-header .icon-link,.site-header .saved-link{min-width:44px;min-height:44px;display:inline-flex;justify-content:center;align-items:center;color:var(--muted)}.site-header .icon-link:hover,.site-header .saved-link:hover{color:var(--accent)}.saved-count{background:var(--accent);color:#0d1520}.menu-toggle{color:var(--ink)}.skip{background:var(--accent);color:#0d1520}.secondary-home{color:var(--muted);font-size:11px}.secondary-home a:hover{color:var(--accent)}
.text-link{color:var(--accent);border:0;font-size:12px;gap:10px}.text-link:hover{color:#d3efff}.button{background:var(--accent);border:1px solid var(--accent);color:#092033;border-radius:6px;font-weight:700;min-height:48px;box-shadow:none;transition:background .15s,transform .15s}.button:hover{background:#b3e1ff;border-color:#b3e1ff;color:#092033}.button.secondary{background:var(--surface);color:var(--ink);border-color:var(--line)}.button.secondary:hover{background:var(--surface-hover);border-color:#6588a9}.toast{background:#c0e6ff;color:#0d2234}.notice{background:var(--soft);color:#c8daeb;border:1px solid var(--line);border-radius:8px}
/* Real screenshot cards, with a quiet frame and persistent play affordance. */
.game-grid{gap:24px 20px}.game-card{background:var(--surface);border:0;border-radius:var(--radius);overflow:hidden;box-shadow:none;transition:transform .18s}.game-card:hover{transform:translateY(-3px);background:var(--surface-hover)}.card-link{border-radius:var(--radius)}.card-image{border-radius:0;isolation:isolate}.card-image img{transition:transform .18s}.card-info{padding:18px}.card-info .eyebrow{font-size:9px;letter-spacing:.04em;color:var(--accent)}.card-info h3{font-size:21px;line-height:1.22;margin:9px 0 10px;color:var(--ink);min-height:0}.card-info p{font-size:12px;line-height:1.65;color:var(--muted);margin-bottom:16px}.card-meta{border-top:1px solid var(--line);padding-top:12px;color:var(--muted);font-size:9px}.card-meta .language{border-color:#40556a;padding:3px 5px}.card-launch{display:flex;align-items:center;gap:7px;color:var(--accent);font-size:11px;font-weight:700;padding-top:14px}.card-launch>span{margin-left:auto;font-size:16px}.save-button{width:44px;height:44px;top:9px;right:9px;background:#0b1729eF;color:#e3f2ff;border:1px solid #59738a;border-radius:8px}.save-button[aria-pressed=true]{background:var(--accent);color:#092033;border-color:var(--accent)}.card-play{opacity:1;transform:none;background:#0b1729eF;color:#e3f2ff;width:32px;height:32px}
/* Dense catalog tasks have independent spacing from the discovery homepage. */
.catalog-page>.page-heading{padding:26px 0 30px;margin-bottom:0}.page-heading h1{font-size:clamp(35px,4vw,55px);line-height:1.08;margin:0 0 18px}.page-heading>.eyebrow{display:none}.page-heading>p{color:var(--muted);max-width:65ch;line-height:1.8}.catalog-tools{background:var(--surface);padding:18px;border:0;border-radius:10px;align-items:end}.search-field{background:#0d1927;border-color:#40556b;min-height:48px;color:var(--muted)}.search-field input{color:var(--ink);padding:14px 0}.search-field:focus-within{outline:2px solid var(--accent);outline-offset:2px}.filter-select{font-size:10px}.filter-select select{background:#0d1927;color:var(--ink);border-color:#40556b}.category-pills{gap:9px;padding:22px 0}.category-pills button{background:transparent;color:var(--muted);border-color:var(--line);border-radius:6px;min-height:44px}.category-pills button:hover{background:var(--surface-hover);color:var(--ink)}.category-pills button[aria-pressed=true]{background:#294c68;color:#e4f4ff;border-color:#69add8}.results-row{font-variant-numeric:tabular-nums;color:var(--muted)}.empty-state{color:var(--muted)}.empty-state h2{color:var(--ink)}.empty-mark{color:var(--accent)}
.category-directory{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.category-feature{background:var(--surface);border:0;padding:28px}.category-feature:hover{background:var(--surface-hover)}.category-feature h2{font-size:28px;line-height:1.2}.category-label{color:var(--accent)}.category-feature p{color:var(--muted);font-size:13px}.category-top .mood-symbol{display:none}.category-top .eyebrow{color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.05em}
/* Player geometry stays in site.css. Only chrome and nearby facts are themed. */
.detail-heading{padding:30px 0 25px}.detail-heading h1{font-size:clamp(32px,3.8vw,49px);line-height:1.1;margin:10px 0}.detail-heading>.button{flex-shrink:0}.detail-layout{gap:24px;grid-template-columns:minmax(0,1fr) 265px}.player{background:#101d2b;border-color:var(--line)}.player-toolbar{background:#203448;color:#d4e5f3;padding:10px 14px}.player-toolbar button{min-height:36px}.player-toolbar button:hover{color:#fff}.player-label{letter-spacing:.06em}.player-stage{background:#070e16}.player-shade{background:linear-gradient(0deg,#08131ff5,#08131f40)}.launch-copy{color:#fff}.launch-copy h2{font-family:inherit;font-weight:700;font-style:normal;color:#fff;font-size:clamp(25px,3.5vw,43px)}.launch-copy .eyebrow{display:none}.launch-copy p{color:#d9e6f3}.launch{background:var(--accent);color:#092033;border-color:var(--accent)}.launch:hover{background:#b3e1ff;color:#092033}.player-bottom{background:#142232;border-top:1px solid var(--line)}.player-bottom p,.embed-disclosure{color:var(--muted)}.player-bottom button{color:#d3e4f3}.embed-disclosure{padding-top:5px}.embed-disclosure a{color:var(--accent)}.player.is-expanded{border-color:#6d98b9;box-shadow:0 0 0 30px #050b13e8}.game-facts{display:block;padding:24px;background:var(--surface);border:0;border-radius:12px}.game-facts>.eyebrow{display:none}.game-facts h2{font-size:24px;line-height:1.2;margin:0 0 22px}.game-facts h2 br{display:none}.game-facts h2 em{color:inherit}.game-facts dl>div{border-color:var(--line)}.game-facts dd{color:var(--ink)}.game-reading{gap:40px 55px}.game-reading .eyebrow{display:none}.game-reading h2{font-size:27px;line-height:1.2;margin:0 0 18px}.game-reading p,.game-reading li{color:var(--muted);max-width:70ch;font-size:13px}.game-reading a,.source-note a{color:var(--accent)}.first-tip{background:var(--surface);border:0}.source-note{border-color:var(--line);color:var(--muted)}
/* Reading pages keep a restrained line length and the same navigation chrome. */
.prose{width:min(760px,100%);margin:0 auto}.prose h2{font-size:27px;line-height:1.25}.prose h3{font-size:21px}.prose p,.prose li{color:var(--muted);max-width:72ch}.prose a{color:var(--accent);text-decoration-color:#537c9e}.prose form{background:var(--surface)}.prose input,.prose textarea,.prose select{background:#0d1927;color:var(--ink);border-color:#4e6680}.prose code{background:var(--surface);color:#cee4f7;padding:2px 5px;border-radius:3px}.contact-address{color:var(--accent)!important}.info-page .page-heading{padding-bottom:35px}.not-found h1{font-size:clamp(40px,6vw,72px)}
.site-footer{background:#0a121d;border-color:var(--line);padding-top:45px}.footer-line{font-size:26px;font-weight:700;color:var(--ink)}.footer-main h2{font:700 12px Arial,sans-serif;color:var(--ink)}.footer-main a:not(.brand),.footer-main .muted,.footer-bottom{color:var(--muted)}.footer-main a:hover{color:var(--accent)}.footer-bottom{border-color:var(--line)}
/* Host-only form overrides win over controls.css without altering any local
   game's shared controls. Popovers are appended directly beneath the host body. */
body[data-page] .custom-choice{color-scheme:dark}body[data-page] .choice-trigger{background:#0d1927;color:var(--ink);border-color:#40556b;box-shadow:none}body[data-page] .choice-trigger:hover,body[data-page] .choice-trigger[aria-expanded=true]{background:#22394e;border-color:var(--accent)}body[data-page] .choice-trigger:after{border-color:var(--accent)}body[data-page] .choice-options{background:#172b3d;color:var(--ink);color-scheme:dark;border-color:#52718b;box-shadow:0 12px 30px #0006}body[data-page] .choice-option:hover,body[data-page] .choice-option.is-active{background:#294c68;color:#fff}body[data-page] .choice-option[aria-selected=true]{background:#345d7a;color:#fff}body[data-page] .choice-option[aria-selected=true]:after{color:#b9e3ff}body[data-page] input::placeholder,body[data-page] textarea::placeholder{color:#9cafc3}body[data-page] input,body[data-page] textarea{caret-color:var(--accent)}body[data-page] input[type=checkbox],body[data-page] input[type=radio]{accent-color:var(--accent)}
html{scrollbar-color:#526c83 #0d1520}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:#0d1520}::-webkit-scrollbar-thumb{background:#526c83;border:3px solid #0d1520;border-radius:12px}::-webkit-scrollbar-thumb:hover{background:#85b4d8}::-webkit-scrollbar-corner{background:#0d1520}
@media(max-width:1150px){.wrap{width:calc(100% - 56px)}.header-inner{gap:24px}.primary-nav{margin-left:0;gap:23px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-directory{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.wrap{width:calc(100% - 40px)}.brand{font-size:25px}.brand img{width:32px;height:32px}.header-actions{margin-left:auto;padding-left:14px;gap:8px}.primary-nav a[aria-current]:after{bottom:3px;width:22px}.js .primary-nav{background:#142232;border-color:var(--line)}.js .primary-nav[data-closed]{visibility:hidden}.site-header .menu-toggle:not([hidden]){min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.detail-layout{grid-template-columns:1fr}.game-facts dl{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.game-facts dl>div{margin:0}.game-facts>.text-link{display:inline-flex}.game-facts h2{margin-bottom:18px}.game-reading{gap:30px}.category-directory{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.wrap{width:calc(100% - 32px)}.header-inner{gap:8px}.header-inner .brand{font-size:24px;gap:7px}.header-actions{gap:2px;padding-left:0}.site-header .menu-toggle:not([hidden]){padding:0;width:44px}.menu-toggle span{display:none}.primary-nav a{padding-inline:10px}.primary-nav a[aria-current]:after{left:10px}.game-grid{gap:14px 11px}.card-info{padding:14px 12px}.card-info h3{font-size:18px;line-height:1.25;min-height:45px;overflow-wrap:anywhere}.card-info p{font-size:11px;min-height:54px}.card-info .eyebrow{font-size:8px;letter-spacing:0}.card-meta{font-size:9px;align-items:flex-start}.card-meta .language{display:none}.card-launch{font-size:11px;padding-top:12px}.save-button{width:44px;height:44px;right:6px;top:6px}.save-button svg{width:18px}.page-heading h1{font-size:36px}.catalog-tools{padding:14px}.category-pills button{font-size:11px;padding:10px 12px}.results-row{font-size:10px}.detail-heading{flex-wrap:wrap;padding:26px 0 22px;gap:16px}.detail-heading h1{font-size:34px}.detail-heading>.button{font-size:12px;min-height:44px;padding:10px 14px}.player-toolbar{padding:7px 10px}.player-label{font-size:8px;letter-spacing:0}.player-toolbar>div{gap:7px}.player-toolbar button{font-size:9px;min-height:36px}.game-facts{padding:22px 18px}.game-facts dl{gap:0 16px}.game-reading h2,.prose h2{font-size:25px}.game-reading{grid-template-columns:1fr}.first-tip{padding:24px}.category-directory{grid-template-columns:1fr}.category-feature{padding:25px}.footer-bottom{font-size:9px}.footer-main{gap:30px}.info-page .page-heading{padding-top:30px}.prose form{padding:20px}.launch-copy h2{font-size:27px}}
@media(max-width:350px){.header-inner .brand{font-size:21px;gap:5px}.header-inner .brand img{width:25px;height:25px}.header-inner{gap:4px}.header-actions svg{width:18px}.card-info{padding:12px 10px}.card-info h3{font-size:17px}.player-toolbar button span{font-size:8px}.player-label{max-width:65px}}
@media(max-height:520px) and (orientation:landscape){.player.is-expanded .player-bottom,.player.is-expanded .embed-disclosure{display:none}}
@media(prefers-reduced-motion:reduce){.game-card,.card-image img,.text-link svg,.button{transition:none}.game-card:hover,.card-link:hover .card-image img,.text-link:hover svg{transform:none}}
/* Host buttons share one small pointer response. Restrict motion to devices
   with real hover, and keep it outside embedded game documents. Individual
   translate preserves component transforms (for example dropdown arrows). */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 body[data-page] :is(button,.button){transition:translate 150ms ease-out,background 150ms ease-out,color 150ms ease-out}
 body[data-page] :is(button,.button):not(:disabled):not([aria-disabled="true"]):hover{translate:0 -2px}
 body[data-page] :is(button,.button):not(:disabled):not([aria-disabled="true"]):active{translate:0 0;transform:none}
}
/* The enclosing search field owns the focus indicator. Suppress the shared
   input ring here to avoid drawing a second border around the text area. */
body[data-page] .search-field input,
body[data-page] .search-field input:focus,
body[data-page] .search-field input:focus-visible{border:0;outline:none;box-shadow:none}
@media(forced-colors:active){html{scrollbar-color:auto}.game-card,.button,.category-feature,.player,body[data-page] .choice-trigger,body[data-page] .choice-options{border:1px solid CanvasText}}

/* Inline navigation icons share the text baseline and never stretch. */

.secondary-home a,.home-recent-links small{display:inline-flex;align-items:center;gap:7px}.card-launch>span{display:inline-flex;align-items:center}.card-launch>span svg{width:16px;height:16px}

/* Cartridge shell shared by every standard catalog card. Corner cuts are an
   inset silhouette rather than clip-path, preserving external keyboard outlines. */
.game-card{
 --cartridge-cut:10px;
 background:transparent;
 border-radius:0;
 overflow:visible;
 padding:2px 2px 10px;
 isolation:isolate;
 transition:translate 180ms ease-out;
}
.game-card::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--surface);clip-path:polygon(var(--cartridge-cut) 0,calc(100% - var(--cartridge-cut)) 0,100% var(--cartridge-cut),100% calc(100% - var(--cartridge-cut)),calc(100% - var(--cartridge-cut)) 100%,var(--cartridge-cut) 100%,0 calc(100% - var(--cartridge-cut)),0 var(--cartridge-cut));border-bottom:3px solid #3d6683;transition:background 180ms ease-out,border-color 180ms ease-out}
/* A single recessed connector, not extra content or an interactive target. */
.game-card::after{content:'';position:absolute;bottom:4px;left:24%;right:24%;height:4px;background:#0b1521;border-top:1px solid #46617a;pointer-events:none}
.game-card .card-link{border-radius:0;overflow:hidden}
.game-card .card-image{clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%,0 9px)}
.game-card .card-info{margin:8px 10px 0;padding:15px 12px 12px;background:#102030;border-top:2px solid #416681}
.game-card .card-info h3{font-size:21px;letter-spacing:-.015em}
.game-card .card-info .eyebrow{font-size:9px;letter-spacing:.06em}
.game-card .card-meta{border-top:1px solid #2d4358}
.game-card .card-launch{margin-top:12px;padding-top:0;min-height:30px;color:#9edcff}
.game-card .save-button{border-radius:5px;top:10px;right:10px}
.game-card:hover{background:transparent;transform:none}
.game-card:focus-within::before{border-bottom-color:var(--accent)}
.game-card .card-link:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
@media(hover:hover) and (pointer:fine){
 .game-card:hover{translate:0 -4px}
 .game-card:hover::before{background:#21374b;border-bottom-color:var(--accent)}
}
@media(max-width:560px){
 .game-card{--cartridge-cut:7px;padding-bottom:8px}
 .game-card .card-info{margin:6px 5px 0;padding:12px 8px 8px}
 .game-card .card-info h3{font-size:18px}
 .game-card .card-info .eyebrow{font-size:8px;letter-spacing:0}
 .game-card .save-button{top:7px;right:7px}
 .game-card::after{height:3px;bottom:3px;left:28%;right:28%}
}
@media(max-width:350px){.game-card .card-info h3{font-size:17px}}
@media(prefers-reduced-motion:reduce){.game-card{transition:none}.game-card:hover{translate:none}.game-card::before{transition:none}}
@media(forced-colors:active){.game-card{border:1px solid CanvasText}.game-card::before,.game-card::after{display:none}.game-card .card-info{background:Canvas;border-color:CanvasText}}

/* Slim host scrollbars; embedded game documents keep their own scrollbars. */
html{scrollbar-width:thin;scrollbar-color:#526c83 #0d1520}
body[data-page] *{scrollbar-width:thin}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-thumb{border:1px solid #0d1520;border-radius:6px;background:#526c83}
::-webkit-scrollbar-thumb:hover{background:#85b4d8}
@supports selector(::-webkit-scrollbar){html,body[data-page] *{scrollbar-width:auto}}
@media(forced-colors:active){html{scrollbar-color:auto}}

/* Chromium's standard scrollbar-color overrides ::-webkit-scrollbar sizing.
   Reset both standard properties there, so the explicit 6px geometry wins. */
@supports selector(::-webkit-scrollbar){
 html,body[data-page],body[data-page] *{scrollbar-width:auto;scrollbar-color:auto}
 html::-webkit-scrollbar,body[data-page]::-webkit-scrollbar,body[data-page] *::-webkit-scrollbar{width:6px;height:6px}
 html::-webkit-scrollbar-thumb,body[data-page]::-webkit-scrollbar-thumb{background:#526c83;border:1px solid #0d1520;border-radius:6px}
 html::-webkit-scrollbar-thumb:hover,body[data-page]::-webkit-scrollbar-thumb:hover{background:#85b4d8}
 html::-webkit-scrollbar-button,body[data-page]::-webkit-scrollbar-button{display:none;width:0;height:0}
}

/* Progress paints over the header's existing bottom rule, without layout shift
   or eased lag; it must track reverse scrolling as precisely as forward scrolling. */
.site-header .scroll-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#79caff;transform:scaleX(0);transform-origin:left center;pointer-events:none}
@media(forced-colors:active){.site-header .scroll-progress{background:Highlight}}
