:root{--cream:#f1e9df;--paper:#fffaf1;--plum:#4b244a;--ink:#2b2529;--muted:#5f565a;--rose:#9b3f51;--gold:#9a651e;--sage:#526a54;--line:#d2c2b5;font:16px/1.55 Georgia,"Times New Roman",serif;color:var(--ink);background:var(--cream);color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html[data-large=yes]{font-size:19px}
body{margin:0;min-width:280px;background:var(--cream)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background:radial-gradient(circle at 2px 2px,var(--plum) 1px,transparent 1.5px);background-size:22px 22px}
html[data-plain=yes] body:before{display:none}
button,a,input{font:inherit}
button{color:inherit}
.skip{position:fixed;top:-5rem;left:1rem;background:var(--plum);color:white;padding:.75rem 1rem;z-index:30}
.skip:focus{top:1rem}
header{height:76px;display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:0 clamp(1rem,5vw,5rem);background:#f1e9dfe8;border-bottom:1px solid var(--line);backdrop-filter:blur(14px);position:sticky;top:0;z-index:15;min-width:0}
.brand{display:flex;align-items:center;gap:.75rem;background:none;border:0;cursor:pointer;font-size:1.2rem;min-width:0;flex:0 1 auto}
.brand span{display:grid;place-items:center;width:38px;height:38px;border-radius:50% 50% 8% 50%;background:var(--plum);color:white;font:700 .75rem system-ui}
.brand b{font-style:italic}
.brand+nav,footer nav{display:flex;gap:.75rem;min-width:0}
.brand+nav button,.text-button{border:0;background:none;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.primary{border:0;background:var(--plum);color:white;padding:.82rem 1.2rem;border-radius:.25rem 1.1rem .25rem 1.1rem;font-weight:700;cursor:pointer}
.secondary{border:1px solid var(--plum);background:transparent;padding:.75rem 1rem;border-radius:.25rem 1rem .25rem 1rem;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
button:disabled{opacity:.38;cursor:not-allowed}
.kicker{text-transform:uppercase;letter-spacing:.18em;font:700 .75rem system-ui,sans-serif;color:var(--rose)}
.hero{min-height:calc(100vh - 76px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(490px,1.2fr);gap:5vw;align-items:center;padding:clamp(3rem,7vw,7rem) clamp(1.2rem,7vw,7rem);min-width:0}
.hero-copy{min-width:0}
.hero-copy h1{font-size:clamp(4rem,7vw,7.6rem);line-height:.84;letter-spacing:-.065em;margin:.75rem 0 1.7rem}
.hero-copy h1 i{font-weight:400;color:var(--plum)}
.hero-copy>p:not(.kicker){font-size:clamp(1rem,1.4vw,1.25rem);color:var(--muted);max-width:42rem}
.hero-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin:2rem 0}
.progress-line{height:5px;background:#d8ccc2;max-width:430px}
.progress-line span{display:block;height:100%;background:var(--rose)}
.resume-fold{margin-top:1.2rem;border:1px solid var(--plum);background:var(--paper);padding:1rem;box-shadow:8px 8px 0 #4b244a20}
.resume-fold h2{font-size:1.45rem;margin:.15rem 0}
.resume-fold>p:not(.kicker){font-size:.76rem;color:var(--muted)}
.resume-fold>div{display:flex;gap:.75rem;flex-wrap:wrap}
.hero-copy>small{color:var(--muted)}
.triptych{width:100%;min-width:0;height:min(65vh,630px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));perspective:1000px;filter:drop-shadow(0 25px 28px #4b244a22)}
.triptych>div{border:1px solid #8c6d7e;background-color:#dfc8c0;background-image:linear-gradient(45deg,#4b244a12 25%,transparent 25% 75%,#4b244a12 75%),linear-gradient(-45deg,#4b244a12 25%,transparent 25% 75%,#4b244a12 75%);background-size:32px 32px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:1.2rem;transform-origin:right}
.triptych>div:nth-child(2){background-color:#b4b9a0;transform:translateZ(35px)}
.triptych>div:nth-child(3){background-color:#dac28f;transform-origin:left}
.triptych span,.triptych b{font:700 .75rem system-ui;letter-spacing:.15em;text-transform:uppercase}
.triptych i{position:relative;display:block;width:60px;height:150px}
.triptych .candle:before{content:"";position:absolute;bottom:20px;left:23px;width:15px;height:95px;background:#f5e6c1}
.triptych .candle:after{content:"";position:absolute;left:22px;top:5px;width:18px;height:28px;border-radius:70% 30% 60% 40%;background:#bd5b38;transform:rotate(45deg)}
.triptych .lamp:before{content:"";position:absolute;left:6px;top:22px;width:48px;height:70px;background:#e8f1d3aa;border:3px solid var(--plum);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}
.triptych .lamp:after{content:"";position:absolute;left:27px;top:90px;width:6px;height:50px;background:var(--plum);box-shadow:-17px 48px 0 17px #4b244a}
.triptych .bulb:before{content:"";position:absolute;left:8px;top:20px;width:45px;height:60px;background:#fff5bd;border:3px solid var(--plum);border-radius:50% 50% 40% 40%}
.triptych .bulb:after{content:"";position:absolute;left:21px;top:77px;width:20px;height:28px;background:repeating-linear-gradient(#4b244a 0 4px,#b4a36f 4px 8px)}
.story-frame{margin:0 clamp(1.2rem,7vw,7rem) 4rem;border:1px solid var(--plum);background:var(--paper);display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;padding:clamp(1.4rem,3vw,2.6rem);position:relative;box-shadow:12px 12px 0 #4b244a18}
.story-frame h2{font-size:clamp(2rem,4vw,4rem);line-height:1;margin:.3rem 0}
.story-frame>div>p:last-child{color:var(--muted);max-width:60ch}
.story-frame aside{border-left:4px solid var(--rose);padding-left:1.3rem;align-self:center}
.story-frame aside strong{font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.12em;color:var(--rose)}
.story-frame aside p{font-size:.78rem}
.chapters{padding:6rem clamp(1.2rem,7vw,7rem);background:#fffaf1;position:relative}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:2rem}
.section-head h2{font-size:clamp(2.5rem,4vw,4.5rem);line-height:1;margin:.2rem 0}
.chapter-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.chapter-card{border:1px solid var(--line);background:#f7efe7;display:grid;grid-template-columns:auto 1fr auto;text-align:left;align-items:center;gap:1rem;padding:1.2rem;cursor:pointer}
.chapter-card:hover{border-color:var(--plum);box-shadow:inset 6px 0 var(--rose)}
.folio{font-size:2.2rem;color:var(--rose);font-style:italic}
.chapter-card small{font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.14em;color:var(--rose)}
.chapter-card strong{display:block;font-size:1.25rem}
.chapter-card p{color:var(--muted);font-size:.78rem;margin:.25rem 0}
.chapter-card em{font-size:.75rem;color:var(--plum)}
.house-achievements{padding:6rem clamp(1.2rem,7vw,7rem);position:relative}
.keepsake-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.keepsake-grid article{border:1px dashed var(--line);background:#f7efe7;padding:1.1rem;display:grid;grid-template-columns:auto 1fr;gap:.8rem}
.keepsake-grid article.earned{opacity:1;border-color:var(--rose);box-shadow:inset 5px 0 var(--rose)}
.keepsake-grid article>span{font-size:1.5rem;color:var(--rose)}
.keepsake-grid strong{font-style:italic}
.keepsake-grid p{font-size:.75rem;color:var(--muted);margin:.25rem 0}
.game{max-width:1700px;margin:auto;padding:2rem clamp(.75rem,3vw,3rem) 6rem}
.game-head{display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem;align-items:start;margin-bottom:1.2rem}
.game-head h1{font-size:clamp(2.6rem,4vw,4.8rem);line-height:1;margin:.1rem 0}
.game-head p{margin:.3rem 0;color:var(--muted)}
.daily-lens{border:1px solid var(--gold);background:#fff3cf;padding:.8rem 1rem;margin-bottom:.75rem;display:flex;gap:1rem;align-items:center}
.daily-lens span{font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);white-space:nowrap}
.daily-lens p{font-size:.78rem;margin:0}
.room-story{background:var(--plum);color:white;padding:1rem 1.2rem;margin-bottom:.75rem;display:grid;grid-template-columns:230px 1fr;gap:1.2rem;align-items:center}
.room-story span{font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.1em;color:#f1cbd4}
.room-story p{margin:0;font-style:italic}
.placed-count{display:grid;place-items:center;background:var(--plum);color:white;width:95px;height:95px;border-radius:50% 50% 15% 50%}
.placed-count strong{font-size:2rem;line-height:1}
.placed-count span{font-size:.75rem}
.selection-ribbon{min-height:46px;background:#ded1c6;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;border-left:5px solid #a58e82}
.selection-ribbon.active{background:#f1d4d5;border-color:var(--rose)}
.selection-ribbon button{border:0;background:none;text-decoration:underline;cursor:pointer}
.era-stage{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.era{min-width:0;min-height:500px;border:1px solid var(--line);padding:.8rem;background-color:#d8c8ba;background-image:linear-gradient(135deg,#ffffff33 25%,transparent 25% 75%,#ffffff33 75%);background-size:20px 20px;display:flex;flex-direction:column}
.era-1{background-color:#bec3ac;background-image:radial-gradient(circle,#5f6b5940 1px,transparent 2px);background-size:15px 15px}
.era-2{background-color:#d7bf8e;background-image:linear-gradient(90deg,#684e2918 50%,transparent 50%);background-size:18px}
.era-heading{min-height:115px;border-bottom:1px solid #4b244a55;display:grid;grid-template-columns:auto 1fr;gap:.8rem;padding:.75rem}
.era-heading>span{font-size:clamp(1.5rem,3vw,3rem);font-style:italic;color:var(--plum)}
.era-heading h2{font-size:1.15rem;margin:.2rem 0}
.era-heading p{font-size:.75rem;margin:0;color:#51464b}
.placed-objects{display:grid;gap:.75rem;padding:.75rem 0;flex:1;align-content:start}
.object-card{width:100%;min-height:78px;display:grid;grid-template-columns:auto 1fr auto;gap:.75rem;align-items:center;text-align:left;background:var(--paper);border:1px solid #8c786b;padding:.75rem;cursor:pointer;box-shadow:3px 4px 0 #57464a20}
.object-card:hover,.object-card.selected{border-color:var(--plum);box-shadow:5px 6px 0 #4b244a55;transform:translateY(-2px)}
.object-card.wrong{border:3px solid #a63742;background:#fff1ee}
.object-card>span:nth-child(2){display:grid}
.object-card small{color:var(--muted);font-size:.75rem}
.object-card>i{font-size:.75rem;color:#a63742}
.object-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--plum);color:white;border-radius:50% 50% 15% 50%;font:800 .75rem system-ui}
.empty-slot{height:78px;border:1px dashed #65535a66;display:grid;place-items:center;color:#65535a;font-size:.75rem}
.place-button{margin-top:auto;border:1px solid var(--plum);background:#fff9;padding:.75rem;cursor:pointer;font-weight:700}
.place-button:hover{background:var(--plum);color:white}
.object-table{display:grid;grid-template-columns:230px 1fr;gap:1rem;margin-top:.8rem;padding:1rem;background:#e6d8ce;border:1px solid var(--line)}
.object-table h2{margin:.2rem 0}
.deck{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.game-actions{display:grid;grid-template-columns:repeat(4,auto) 1fr;gap:.75rem;align-items:center;margin-top:.8rem}
.game-actions p{font-size:.76rem;color:#57464a}
.unfold{margin-top:3rem;background:var(--paper);border:1px solid var(--plum);box-shadow:12px 12px 0 #4b244a20;padding:clamp(1rem,3vw,3rem);scroll-margin-top:92px}
.unfold-head{display:flex;justify-content:space-between;align-items:center}
.unfold-head h2{font-size:3rem;margin:.2rem 0}
.reveal-actions{display:flex;gap:.75rem;align-items:center}
.story-triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:2rem 0}
.story-triptych article{border:1px solid var(--line);background:#f7efe7;padding:1rem}
.story-triptych span{font:700 .75rem system-ui;color:var(--rose);letter-spacing:.1em}
.story-triptych p{font-style:italic;font-size:.82rem}
.unfold>blockquote{border-left:5px solid var(--gold);margin:2rem 0;padding:1rem 1.4rem;background:#fff5dc;font-size:1.12rem}
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.fact-grid>div{border-top:4px solid var(--rose)}
.fact-grid h3{font-style:italic}
.fact-grid article{display:grid;grid-template-columns:auto 1fr;gap:.75rem;padding:1rem 0;border-top:1px solid var(--line)}
.fact-grid article>span,.notebook-grid article>span{font:800 .75rem system-ui;display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--plum);border-radius:50%}
.fact-grid h4{margin:0}
.fact-grid h4 small{font-weight:400;color:var(--muted)}
.fact-grid p{font-size:.76rem}
.fact-grid a,.notebook a{font-size:.75rem;color:var(--plum)}
.notebook{max-width:1300px;margin:auto;padding:3rem 1rem 6rem}
.notebook-title{margin:4rem 0}
.notebook-title h1{font-size:clamp(3rem,7vw,7rem);line-height:.85;margin:.75rem 0}
.notebook details{border-top:1px solid var(--plum)}
.notebook summary{display:grid;grid-template-columns:150px 1fr auto;gap:1rem;padding:1.2rem 0;cursor:pointer}
.notebook summary span,.notebook summary i{color:var(--rose)}
.notebook-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;padding:0 0 2rem}
.notebook-grid article{display:grid;grid-template-columns:auto 1fr;gap:.75rem;background:var(--paper);padding:1rem}
.notebook-grid h2{font-size:1.1rem;margin:.2rem 0}
.notebook-grid p{font-size:.76rem}
.notebook-tools{display:grid;grid-template-columns:1.5fr 1fr auto;gap:.75rem;background:#ded1c6;padding:1rem;margin-bottom:1.5rem;align-items:end}
.notebook-tools label{display:grid;gap:.35rem;font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.08em}
.notebook-tools input[type=search],.notebook-tools select{min-height:46px;border:1px solid var(--plum);background:var(--paper);padding:.75rem;font:16px Georgia,serif;text-transform:none;letter-spacing:0}
.notebook-tools .bookmark-filter{display:flex;align-items:center;min-height:46px;padding:.75rem}
.notebook-results{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.notebook-card{background:var(--paper);border:1px solid var(--line);padding:1rem;display:flex;flex-direction:column;min-width:0}
.notebook-card-head{display:grid;grid-template-columns:auto 1fr auto;gap:.75rem;align-items:center}
.notebook-card-head>span{font:800 .75rem system-ui;display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--plum);border-radius:50%}
.notebook-card h2{font-size:1.05rem;margin:.1rem 0}
.notebook-card small{color:var(--rose)}
.notebook-card>p{font-size:.76rem;flex:1}
.notebook-card>a{font-size:.75rem;color:var(--plum)}
.bookmark-button{border:0;background:none;color:var(--gold);font-size:1.5rem;cursor:pointer}
.notebook-card>label{display:grid;gap:.3rem;margin-top:1rem;border-top:1px solid var(--line);padding-top:.8rem;font:700 .75rem system-ui;text-transform:uppercase;letter-spacing:.08em}
.notebook-card textarea{resize:vertical;min-height:72px;border:1px solid var(--line);background:#fff;padding:.75rem;font:14px/1.4 Georgia,serif;text-transform:none;letter-spacing:0}
.empty-notebook{grid-column:1/-1;padding:3rem;text-align:center;border:1px dashed var(--line)}
.archive{max-width:1300px;margin:auto;padding:3rem 1rem 6rem}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.archive-grid button{border:1px solid var(--line);background:var(--paper);padding:1rem;text-align:left;display:grid;cursor:pointer;min-height:180px}
.archive-grid button:hover{border-color:var(--plum);box-shadow:inset 6px 0 var(--rose)}
.archive-grid span{font:700 .75rem system-ui;color:var(--rose);letter-spacing:.12em;text-transform:uppercase}
.archive-grid strong{font-size:1.25rem;margin-top:auto}
.archive-grid p{font-size:.75rem;color:var(--muted)}
.archive-grid small{color:var(--plum)}
footer{position:relative;display:flex;justify-content:space-between;align-items:center;padding:1.2rem clamp(1rem,5vw,5rem);border-top:1px solid var(--line);font-size:.76rem}
footer a{color:var(--plum)}
.legal{position:relative;max-width:800px;margin:5rem auto;padding:0 1.2rem}
.legal h1{font-size:4rem}
.legal li{margin:.8rem 0}
.legal a{color:var(--plum)}
dialog{border:1px solid var(--plum);padding:0;background:var(--paper);max-width:430px;width:calc(100% - 2rem);box-shadow:0 30px 90px #321d3066}
dialog::backdrop{background:#2d1d2aaa;backdrop-filter:blur(4px)}
dialog form{padding:1.2rem;display:grid;gap:1rem}
dialog label{display:flex;gap:.75rem}
.dialog-head{display:flex;justify-content:space-between;align-items:center}
.dialog-head h2{margin:0}
.dialog-head button{border:0;background:none;font-size:2rem}
.danger{color:#9c2d39;background:#fff0ed;border:1px solid #bd6a6e;padding:.75rem}
@media(max-width:1000px){.hero{grid-template-columns:minmax(0,1fr)}
.story-frame{grid-template-columns:1fr}
.triptych{height:500px}
.era-stage{grid-template-columns:1fr}
.era{min-height:0}
.placed-objects{grid-template-columns:repeat(3,1fr)}
.object-table{grid-template-columns:1fr}
.fact-grid{grid-template-columns:1fr}
.notebook-grid{grid-template-columns:repeat(2,1fr)}
.notebook-results,.archive-grid{grid-template-columns:repeat(2,1fr)}
.keepsake-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px){header nav .nav-link{padding-inline:.35rem;min-width:0}
header nav button:nth-of-type(1){display:none}
.hero{padding-top:3rem}
.hero-copy h1{font-size:clamp(3rem,16vw,4rem)}
.triptych{height:360px}
.chapter-grid{grid-template-columns:1fr}
.chapter-card{grid-template-columns:auto 1fr}
.chapter-card em{grid-column:2}
.section-head{display:block}
.game{padding-inline:.75rem}
.game-head{grid-template-columns:1fr auto;gap:.75rem}
.game-head>button{grid-column:1/-1;justify-self:start}
.room-story{grid-template-columns:1fr;gap:.75rem}
.daily-lens{display:block}
.placed-count{width:70px;height:70px}
.placed-objects,.deck{grid-template-columns:1fr}
.object-table{padding:.75rem}
.game-actions{grid-template-columns:1fr}
.unfold-head{display:block}
.reveal-actions{display:grid}
.story-triptych{grid-template-columns:1fr}
.notebook-grid{grid-template-columns:1fr}
.notebook-tools,.notebook-results,.archive-grid,.keepsake-grid{grid-template-columns:1fr}
.notebook summary{grid-template-columns:90px 1fr}
.notebook summary i{grid-column:2}
footer{display:grid;gap:.75rem}
}
@media(max-width:370px){.brand b{display:none}}
html[data-motion=yes] *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
html[data-plain=yes] .era,html[data-plain=yes] .triptych>div{background-image:none}

@media(pointer:coarse){button{min-height:44px}}

.brand{min-width:44px;flex-shrink:0}
.dialog-head button{min-width:44px;min-height:44px;padding:0;display:grid;place-items:center}

button{min-width:44px;min-height:44px}
header a,footer a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
dialog label,details>summary,.file-button{min-height:44px}
@media(max-width:480px){header{padding-inline:.75rem;gap:.25rem}.brand b{display:none}.brand+nav{gap:.25rem;justify-content:flex-end;flex:1}.brand+nav button,.brand+nav .nav-link{min-width:0;padding-inline:.2rem;font-size:.86rem}}

.more-games{border-top:1px solid var(--line,rgba(0,0,0,.18));padding:34px clamp(18px,4vw,58px) 8px;max-width:1400px;margin:auto}
.more-games h2{font:600 1.45rem/1.15 ui-serif,Georgia,serif;margin:0 0 6px}
.more-games>p{margin:0 0 18px;font-size:.85rem;max-width:62ch;opacity:.85}
.more-games ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 22px}
.more-games li{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line,rgba(0,0,0,.18));padding-top:9px}
.more-games li a{font-weight:700;min-height:44px;display:flex;align-items:center}
.more-games li span{font-size:.8rem;opacity:.8;padding-bottom:8px}

.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.about-game{border-top:1px solid var(--line,rgba(0,0,0,.18));padding:34px clamp(18px,4vw,58px) 4px;max-width:1400px;margin:auto}
.about-game h2{font:600 1.45rem/1.15 ui-serif,Georgia,serif;margin:0 0 10px}
.about-game p{margin:0 0 14px;max-width:72ch;font-size:.92rem;line-height:1.75;opacity:.9}
.about-game a{padding:2px 0}

header nav .nav-link{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-weight:700;text-decoration:none;color:inherit}
header nav .nav-link:hover{text-decoration:underline}

.score-breakdown{font-size:.8rem;opacity:.85;margin:2px 0 8px;line-height:1.6}

.object-reading{display:block;font-style:normal;font-size:.8125rem;line-height:1.4;margin:4px 0 6px;color:var(--muted,#5c5048)}
.coach-card{border:1px solid var(--line,rgba(0,0,0,.18));border-radius:18px;padding:18px;margin-bottom:18px;background:#2f2620;color:#f6efe6}
.coach-card h2{margin:0 0 8px;font-size:1.05rem}
.coach-card p{margin:0;font-size:.9375rem}
.coach-card .kicker{color:#e6b877}
.coach-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.coach-actions button{min-height:44px;padding:0 14px;border-radius:12px;cursor:pointer}
.house-record{margin:48px 0}
.record-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.record-grid div{border:1px solid var(--line,rgba(0,0,0,.16));border-radius:16px;padding:14px;min-width:0}
.record-grid strong{display:block;font-size:1.25rem;line-height:1.2;overflow-wrap:anywhere}
.record-grid span{font-size:.8125rem;color:var(--muted,#5c5048)}
.record-line{border:1px dashed var(--line,rgba(0,0,0,.24));border-radius:14px;padding:10px 12px;font-size:.875rem}
.shortcut-list{margin:0 0 12px;padding:0}
.shortcut-list div{display:flex;justify-content:space-between;gap:18px;padding:8px 0;border-bottom:1px solid var(--line,rgba(0,0,0,.14))}
.shortcut-list dt{margin:0;font-weight:700}
.shortcut-list dd{margin:0;text-align:right;font-size:.875rem;color:var(--muted,#5c5048)}
.import-status:not(:empty){display:block;margin-top:12px;font-size:.875rem;border:1px solid #a4402f;border-radius:12px;padding:10px 12px;color:#7c2c1f}
.fineprint{font-size:.8125rem;color:var(--muted,#5c5048)}
#shortcuts-dialog{max-width:min(560px,92vw)}
@media(max-width:560px){.record-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}}

.storage-banner{margin:0;padding:12px clamp(14px,4vw,32px);background:#7c2c1f;color:#fff;font-size:.875rem;line-height:1.45}
.storage-banner[hidden]{display:none!important}

.update-prompt{position:fixed;z-index:40;right:16px;bottom:16px;max-width:min(340px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);box-shadow:0 14px 40px rgba(0,0,0,.3)}
.update-prompt-text{margin:0;font-size:.875rem;line-height:1.45}
.update-prompt-actions{display:flex;flex-wrap:wrap;gap:8px}
.update-prompt button{min-width:44px;min-height:44px;padding:0 16px;border-radius:6px;font:inherit;font-size:.875rem;cursor:pointer}
.update-prompt-reload{border:1px solid transparent;background:var(--plum);color:#fffaf1;font-weight:700}
.update-prompt-dismiss{border:1px solid var(--line);background:transparent;color:inherit}
@media(prefers-reduced-motion:no-preference){.update-prompt{animation:update-prompt-in .18s ease-out}
@keyframes update-prompt-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(max-width:560px){.update-prompt{left:12px;right:12px;bottom:84px;max-width:none}}

.card-shell{display:grid;gap:.35rem;align-content:start}
.compare-toggle{min-height:44px;border:1px solid #8c786b;background:#fffdf9;font-size:.8125rem;cursor:pointer}
.compare-toggle[aria-pressed="true"]{background:var(--plum);color:#fff;border-color:var(--plum)}
.object-card.comparing{border-color:var(--plum);box-shadow:0 0 0 3px #4b244a33}
.compare-panel{border:1px dashed var(--plum);padding:1rem;margin:1rem 0}
.compare-panel h2{font-size:1.05rem;margin:0 0 .4rem}
.compare-panel p{font-size:.8125rem;margin:0}
.compare-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:.6rem 0}
.compare-grid article{border-left:4px solid var(--gold);padding-left:.75rem}
.compare-grid h3{font-size:.95rem;margin:0 0 .3rem}
.compare-grid p{font-size:.8125rem}
.placed-count.ready{background:var(--gold);color:#2a1b22}
.primary.ready{box-shadow:0 0 0 4px #c8a02f66}
.par-line,.next-step,.learned-line{font-size:.8125rem;margin:.5rem 0 0;max-width:60ch}
.next-step,.learned-line{font-weight:600}
.object-verdict{font-size:.76rem;font-weight:600;color:var(--plum);margin:.2rem 0}
.share-panel{margin-top:1rem;border:1px dashed var(--plum);padding:1rem;max-width:44rem}
.share-panel h3{font-size:1.05rem;margin:0 0 .5rem}
#share-preview{width:100%;min-height:96px;font:inherit;font-size:.8125rem;line-height:1.5;padding:.6rem;border:1px solid #8c786b;background:var(--paper);color:inherit;resize:vertical}
#copy-share{margin-top:.6rem;width:100%;min-height:44px;border:1px solid var(--plum);background:var(--paper);font-weight:700;cursor:pointer}
#copy-share[data-state="copied"]{background:var(--gold)}
#copy-share[data-state="failed"]{background:#a63742;color:#fff}
.share-panel .fineprint{font-size:.75rem;margin:.6rem 0 0}
.archive-dot{font-style:normal;margin-right:.4rem;color:var(--plum)}
.archive-grid button.played{border-color:var(--plum);box-shadow:inset 5px 0 var(--gold)}
#settings-dialog h3{font-size:.9rem;margin:1rem 0 .3rem}
/* A1: the research trail and footer links keep their type and gain a target. */
.fact-grid a,.notebook a{display:inline-flex;align-items:center;min-height:44px;padding:.25rem .5rem;margin-left:-.5rem}
footer nav a,.about-game a{display:inline-flex;align-items:center;min-height:44px;padding:0 .35rem}
:root[data-contrast="yes"]{--muted:#3a2c30;--line:rgba(42,27,34,.7)}
:root[data-contrast="yes"] .object-card,:root[data-contrast="yes"] .compare-toggle{border-color:#2a1b22;border-width:2px}
:root[data-contrast="yes"] .object-card small,:root[data-contrast="yes"] .object-reading{color:#2a1b22}
:root[data-contrast="yes"] .empty-slot{border-color:#2a1b22;color:#2a1b22}
:root[data-contrast="yes"] .kicker,:root[data-contrast="yes"] .fact-grid p{color:#2a1b22}

/* Play screen in one view. Desktop: the object table on the left, the three eras stacked on the right, Read the
   room under the table. Phone: the eras side by side as three drop zones with their Place buttons, the table as
   compact cards (the selected card opens to show its clue), and the actions after. */
.game{padding-top:.5rem;padding-bottom:1.5rem}
.game-head{margin-bottom:.5rem;align-items:center;gap:1rem}
.game-head h1{font-size:clamp(1.6rem,2.8vw,2.4rem)}
.game-head>*{min-width:0}
.placed-count{width:64px;height:64px}
.placed-count strong{font-size:1.4rem}
.room-story{padding:.5rem .8rem;margin-bottom:.5rem;grid-template-columns:200px 1fr;gap:.8rem}
.room-story p{font-size:.875rem;line-height:1.4}
.selection-ribbon{min-height:44px;padding:.3rem .8rem;margin-bottom:.5rem}
.era{min-height:0;padding:.5rem;display:flex;flex-direction:column}
.era-heading{min-height:0;padding:.3rem .5rem}
.era-heading>span{font-size:1.6rem}
.placed-objects{gap:.35rem;padding:.4rem 0}
.empty-slot{height:44px}
.era .card-shell{grid-template-columns:minmax(0,1fr) auto;align-items:stretch}
.era .object-card{min-height:44px;padding:.3rem .5rem;gap:.5rem}
.era .object-card .object-reading,.era .object-card small{display:none}
.era .object-mark{width:30px;height:30px}
.era .compare-toggle{font-size:.6875rem;padding:0 .4rem}
.place-button{min-height:44px;padding:.4rem}
.object-table{padding:.6rem;margin-top:0}
.object-card{min-height:0;padding:.5rem .6rem;gap:.5rem}
.object-card small{display:none}
.object-reading{margin:2px 0 0}
.deck{gap:.5rem}
.game-actions{margin-top:.5rem;gap:.5rem}
.game-actions button{min-height:44px}
@media(min-width:1001px){
.game:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);column-gap:.75rem;align-items:start}
.game>*{grid-column:1/-1;min-width:0}
.game>.object-table{grid-column:1;grid-row:span 1;grid-template-columns:1fr}
.game>.object-table>div:first-child{display:none}
.deck .object-mark{display:none}
.deck .object-card{grid-template-columns:1fr auto}
.game-head p{display:inline}
.game-head .kicker{margin:0}
.placed-count{width:56px;height:56px}
.game>.object-table>div:first-child h2{font-size:1rem}
.game>.era-stage{grid-column:2;grid-row:span 3;grid-template-columns:1fr;gap:.5rem;align-self:start}
.game>.game-actions{grid-column:1;grid-template-columns:repeat(5,auto) 1fr}
.game>.compare-panel{grid-column:1;order:8}
.game>.object-table{order:6}
.game>.era-stage{order:6}
.game>.game-actions{order:7}
.game>#reveal-slot{order:9}
.deck .card-shell{grid-template-columns:minmax(0,1fr) auto;align-items:stretch}
.deck .compare-toggle{writing-mode:vertical-rl;transform:rotate(180deg);padding:.3rem 0;min-width:44px;font-size:.75rem}
.deck .object-card{padding:.4rem .5rem}
.object-reading{font-size:.75rem;line-height:1.35}
.era{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.3rem .5rem}
.era>.era-heading{flex:1 1 60%;border:0}
.era>.place-button{margin:0;flex:0 0 auto}
.era>.placed-objects{flex:1 1 100%;padding:0;grid-template-columns:1fr}
.era .empty-slot{display:none}
.era-heading p{display:none}
}
@media(max-width:1000px) and (min-width:701px){header nav{display:flex;align-items:center;gap:.25rem;flex-wrap:nowrap!important}header nav :is(.nav-link,button){padding-inline:.45rem;font-size:.875rem;white-space:nowrap}}
@media(max-width:1000px){
.game:not([hidden]){display:flex;flex-direction:column}
.game>.era-stage{order:6}
.game>.object-table{order:7}
.game>.game-actions{order:8}
.game>.compare-panel{order:9}
.game>#reveal-slot{order:10}
.game-head{grid-template-columns:auto 1fr!important;gap:.25rem .6rem}
.game-head>button{grid-column:1!important;grid-row:1}
.game-head>.placed-count{grid-column:2;grid-row:1;justify-self:end;width:auto;height:auto;border-radius:.6rem;padding:.2rem .6rem;display:flex;gap:.3rem;align-items:baseline}
.game-head>div:not(.placed-count){grid-column:1/-1;grid-row:2}
.game-head .kicker{display:none}
.game-head h1{font-size:1.35rem}
.game-head p{font-size:.75rem}
.room-story{grid-template-columns:1fr;gap:.2rem}
.room-story span{display:none}
.room-story p{font-size:.75rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.era-stage{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.35rem}
.era{padding:.3rem}
.era-heading{grid-template-columns:1fr;gap:0;padding:.2rem}
.era-heading>span{font-size:1.1rem}
.era-heading h2{font-size:.75rem;margin:0}
.era-heading p{display:none}
.placed-objects{grid-template-columns:1fr!important}
.era .card-shell{grid-template-columns:1fr}
.era .compare-toggle{display:none}
.era .object-card{grid-template-columns:auto 1fr;padding:.2rem .3rem;font-size:.6875rem}
.era .object-mark{width:22px;height:22px;font-size:.5625rem}
.era .empty-slot{height:44px;font-size:.625rem}
.place-button{font-size:.75rem;padding:.3rem}
.object-table{grid-template-columns:1fr!important;padding:.4rem;gap:.3rem}
.object-table>div:first-child p{display:none}
.object-table>div:first-child h2{font-size:.875rem;margin:0}
.deck{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.3rem}
.deck .card-shell{gap:.2rem}
.deck .object-card{grid-template-columns:1fr;padding:.3rem .35rem;gap:.15rem;min-height:44px}
.deck .object-mark{display:none}
.deck .object-card strong{font-size:.75rem;line-height:1.2}
.deck .object-card .object-reading{display:none}
.deck .card-shell:has(.object-card.selected){grid-column:1/-1}
.deck .object-card.selected .object-reading{display:block;font-size:.75rem}
.deck .compare-toggle{display:none}
.deck .card-shell:has(.object-card.selected) .compare-toggle{display:block}
.game-actions{grid-template-columns:repeat(3,1fr)!important}
.game-actions .primary{grid-column:1/-1;order:-1}
.game-actions button{font-size:.75rem;padding:.2rem}
.game-actions #notice{grid-column:1/-1}
}
@media(max-width:820px) and (min-width:701px){header .brand b{display:none}}