@font-face{font-family:Manrope;src:url('./assets/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:Plex;src:url('./assets/IBMPlexMono-Regular.ttf') format('truetype');font-display:swap}
:root{--ink:#342635;--muted:#6a5c62;--paper:#fbf8f1;--card:#fffcf5;--line:#b2a499;--plum:#3c283b;--orange:#f2bb6b;--coral:#85432e;--mono:Plex,monospace;--inset:clamp(18px,5.8vw,30px);color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;color:var(--ink);font:16px/1.5 Manrope,system-ui,sans-serif;background:var(--paper)}
button,input,textarea,select{font:inherit;color:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer;border:0;background:transparent}
a{color:inherit}
:is(a,button,input,textarea,select,summary):focus-visible{outline:3px solid #904518;outline-offset:3px}
button:disabled{cursor:not-allowed}
[hidden]{display:none!important}
.skip{position:fixed;top:-100px;left:8px;z-index:30}
.skip:focus{top:5px;background:white;padding:10px}
.workbench{min-height:100dvh}
.device{position:relative;display:flex;flex-direction:column;width:100%;max-width:580px;margin:0 auto;background:var(--paper);height:100vh;height:100dvh;min-height:0}
.top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;min-height:57px;padding:4px max(12px,env(safe-area-inset-right)) 4px max(12px,env(safe-area-inset-left));flex:none}
.back,.help-icon,.wordmark{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
.back{font:28px/1 Manrope}.back:disabled{visibility:hidden}
.wordmark{justify-self:center}.wordmark img{height:23px;width:auto}
.help-icon{font-size:19px;font-weight:650}
.viewport{overflow:auto;min-height:0;flex:1;scrollbar-width:thin;overscroll-behavior:contain}
.viewport main{padding:20px max(var(--inset),env(safe-area-inset-right)) 32px max(var(--inset),env(safe-area-inset-left));outline:none}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);background:#f0ebe2;padding:3px 8px max(3px,env(safe-area-inset-bottom));flex:none}
.tab{background:transparent;color:var(--muted);font-size:12px;font-weight:600;display:grid;justify-items:center;align-content:center;gap:2px;min-height:48px}
.tab svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65}
.tab[aria-current=page]{font-weight:800;color:#673421}.tab[aria-current=page] svg{fill:#e8bd81;stroke:#673421}
h1,h2,h3,p,figure{margin:0}
.screen-title,.story-title,.section-title{font-weight:760;letter-spacing:-.048em;text-wrap:balance}
.screen-title{font-size:clamp(32px,8.5vw,40px);line-height:1.1;margin:4px 0 12px}
.section-title{font-size:22px;line-height:1.18}
.eyebrow,.folio,.serial,.note,.muted,.lede{color:var(--muted)}
.eyebrow,.folio,.serial{font:650 13px/1.4 Manrope,system-ui,sans-serif;text-transform:none}
.eyebrow{display:block;margin-bottom:6px}
.lede{font-size:16px;margin:0 0 20px;line-height:1.52}
.pill{font-weight:720;font-size:14px;color:var(--coral)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:46px;min-width:44px;padding:10px 17px;background:var(--plum);color:#fffaf0;border-radius:5px;text-decoration:none;font-size:16px;font-weight:730;line-height:1.35;text-align:center}
.btn.alt,.btn.quiet{background:transparent;color:var(--coral);font-weight:680;padding-inline:6px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.btn.lead{background:#edb865;color:#352634;padding-inline:18px}
.btn:disabled{opacity:.55}
.actions,.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.actions{margin:16px 0}.stack{display:grid;gap:18px}.art{max-width:100%;height:auto}
.card{padding:12px 0}.card h2{font-size:32px}.note{display:block;font-size:14px;margin:10px 0}
.split{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:24px 0 8px}
.jump{min-height:44px;padding:7px 0;color:var(--coral);font-size:15px;font-weight:700}
.block-list{display:grid;gap:5px}
.block-list>button{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 0;width:100%;min-height:52px}
.block-list>button>span:first-child{flex:1}.block-list b{display:block;font-size:17px;font-weight:730}.block-list small{display:block;color:var(--muted);font-size:14px}.block-list em{font-style:normal;font-size:23px;color:var(--coral)}
.game-hall{margin-top:-20px}
.hall-mast{position:relative;isolation:isolate;display:grid;align-content:center;min-height:132px;margin-inline:calc(0px - var(--inset));overflow:hidden;background:#29131f;color:#fff6e4}
.hall-mast>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:72% 44%}
.hall-mast::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(30,10,25,.65),rgba(30,10,25,.30) 45%,transparent 71%)}
.hall-copy{padding:13px var(--inset);width:62%}
.hall-copy>span{font:12px/1.3 var(--mono);color:#ffd18c}
.hall-copy h1{font-size:clamp(29px,8.5vw,42px);font-weight:800;line-height:1.01;letter-spacing:-.047em;margin:5px 0 7px;text-wrap:balance}
.hall-copy p{max-width:19ch;font-size:13px;font-weight:550;line-height:1.36}
.hall-shortcuts{display:flex;flex-wrap:wrap;gap:0 13px}
.hall-shortcuts button{min-height:44px;padding:0;color:#ffe3ab;text-decoration:underline;text-underline-offset:4px;font-size:13px;font-weight:700}
.shelf-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px}
.shelf-heading h2,.hall-services h2{font-size:22px;line-height:1.15;letter-spacing:-.045em}
.shelf-heading button{min-height:44px;padding:5px 0 5px 12px;font-size:14px;font-weight:700;color:var(--coral)}
.box-shelf{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.box-cover{position:relative;isolation:isolate;display:flex;align-items:flex-end;overflow:hidden;min-width:0;border-radius:5px;text-align:left;color:#fff9ed;background:#382839;padding:11px 12px;min-height:clamp(98px,28vw,140px)}
.box-cover>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.box-cover::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(25,13,25,.94),rgba(25,13,25,.7) 28%,rgba(25,13,25,.08) 72%)}
.box-copy{display:grid;gap:3px}
.box-copy strong{font-size:clamp(17px,4.6vw,23px);font-weight:780;line-height:1.05;letter-spacing:-.035em}
.box-copy small{font-size:12px;line-height:1.25;color:#fff3db}
.box-cover:active{filter:brightness(.88)}
@media(hover:hover){.box-cover:hover strong,.hall-choices button:hover{text-decoration:underline;text-underline-offset:.16em}}
.hall-services{margin-top:23px}
.hall-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:11px}
.hall-choices button{display:grid;align-content:center;gap:3px;min-height:62px;padding:10px 12px;border-radius:4px;background:#eee4d5;text-align:left;font-size:15px;line-height:1.22;font-weight:740}
.hall-choices span{font-size:12px;line-height:1.35;font-weight:550;color:#65545a}
.hall-extras{margin-top:18px}
.resume-link{padding-top:10px}.resume-link .btn{width:100%}
.next-services{margin-top:12px;color:var(--muted);font-size:14px}.next-services summary{cursor:pointer;padding:12px 0;min-height:44px;color:var(--coral);font-weight:680}
.catalog-shelf{display:grid;gap:9px;margin-bottom:16px}
.catalog-shelf .box-cover{min-height:134px;padding:17px 15px;align-items:center}
.catalog-shelf .box-cover>img{object-position:center 40%}
.catalog-shelf .box-cover::before{background:linear-gradient(90deg,rgba(23,13,27,.96),rgba(23,13,27,.82) 42%,rgba(23,13,27,.25) 76%,transparent)}
.catalog-shelf .box-copy{max-width:68%;gap:6px}
.catalog-shelf strong{font-size:21px}
.catalog-shelf small{font-size:14px;line-height:1.36}
.story-title{font-size:28px;line-height:1.12;margin:0 0 12px}
.mode-head{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:14px}.avatar{width:32px;height:32px;border-radius:50%}.mode-head{margin:8px 0 14px}
.filter{display:flex;gap:3px;flex-wrap:wrap;margin:4px 0 8px}
.filter button{min-width:44px;min-height:44px;color:var(--muted);padding:5px 6px;font-size:14px}
.filter .on{color:var(--ink);font-weight:800;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:3px;text-decoration-color:#b46a29}
.welcome-ep{display:block;width:55%;height:170px;object-fit:contain;margin:14px auto 16px}
.speech{margin:12px 0 20px;font-size:17px;line-height:1.5}.bot-button{display:block;min-height:46px;width:100%;text-align:left;font-weight:700;color:var(--coral);padding:8px 0}
.frame-title{padding:6px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted);background:#f3eee4}
.frame-title a{display:inline-flex;align-items:center;min-height:44px;color:var(--coral)}
.frame-title.game-banner{position:relative;isolation:isolate;overflow:hidden;flex:none;min-height:48px;padding-block:2px;background:#2b1c2b;color:#fff7e8}
.game-banner>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.game-banner::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#231624e6,#251726aa)}
.game-banner strong{font-size:16px;line-height:1.2;margin-right:auto}
.game-banner a,.game-banner .btn.quiet{color:#ffedc8;font-size:13px}
#games-host{height:100%;display:flex;flex-direction:column;min-height:320px}
#games-host iframe{width:100%;height:100%;border:0;background:var(--paper);display:block}.frame-error{padding:16px}
body.review{background:#ede8df}
.designbar{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:0 18px;background:#e7e1d7;color:#40323c;min-height:44px;font-size:14px}.designbar b{font-weight:780}.designbar span{margin:0 5px;color:#806457}
.designbar button{color:var(--ink);min-width:44px;min-height:44px;padding:6px 8px;font-weight:730}
.review .device{height:calc(100dvh - 44px)}
.map{min-width:0;padding:10px 12px 20px;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}
.map .close-map{display:none}.map-modal .close-map{display:block;width:auto;margin-left:auto;color:var(--coral);text-decoration:underline}.map input{width:100%;padding:8px 10px;min-height:44px;font-size:16px;color:var(--ink);background:#faf7f0;border:1px solid #8c7d71;border-radius:3px;margin:12px 0}
.map details{margin:3px 0}.map summary{cursor:pointer;font-size:15px;font-weight:730;padding:10px 0;min-height:44px}
.map button{display:block;text-align:left;width:100%;min-height:44px;padding:6px 14px;font-size:14px}
.map button.on{font-weight:780;color:var(--coral);text-decoration:underline;text-underline-offset:4px}
.map h2{font-size:22px;letter-spacing:-.04em}.map-modal{position:fixed;inset:44px 0 0;background:var(--paper);z-index:10}
.inspect-num{font-size:14px;color:var(--coral)}#inspector h2{margin:7px 0;font-size:27px;line-height:1.16;letter-spacing:-.04em}#inspector p{font-size:14px;color:var(--muted)}#inspector .line{margin:26px 0 12px}#inspector button{min-height:44px;min-width:44px;padding:6px 10px 6px 0;font-size:15px;color:var(--coral);font-weight:700}
@media(min-width:850px){.review .workbench{display:grid;grid-template-columns:minmax(178px,248px) minmax(320px,416px) minmax(150px,216px);justify-content:center;gap:clamp(18px,4vw,60px);padding:24px 18px;min-height:0;align-items:start}.review .device{height:calc(100dvh - 92px);max-height:900px;min-height:410px;overflow:hidden}.review .map{height:calc(100dvh - 88px);padding-top:0}.review #inspector{display:block!important;padding:8px;position:sticky;top:14px}.designbar #show-map{display:none}}
@media(max-width:849px){.map:not(.map-modal),#inspector{display:none!important}.review .device{max-width:560px}.designbar{padding-inline:12px}}
@media(max-width:350px){.device{--inset:14px}.box-cover{padding:9px}.hall-copy{width:64%}}
@media(max-height:690px){.hall-copy{padding-block:8px}.box-shelf .box-cover{min-height:clamp(92px,25vw,114px)}}
@media(max-height:590px){.hall-mast{min-height:98px}.hall-copy{width:70%}.hall-copy h1{font-size:25px}.shelf-heading{min-height:44px}.box-shelf{gap:6px}.box-shelf .box-cover{min-height:86px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(forced-colors:active){.btn,.tab[aria-current=page],.filter .on{outline:1px solid ButtonText}}