:root {
  color-scheme: dark;
  --night: #101321;
  --deep: #0d1322;
  --panel: #191e32;
  --ivory: #f6f0e5;
  --mist: #c8c8d8;
  --quiet: #b0b1c3;
  --gold: #edce8c;
  --brass: #b69355;
  --mint: #9fdfb5;
  --serif: "Baskervville", "Baskerville", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--night); color: var(--ivory); font: 1rem/1.55 var(--sans); }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; color: inherit; }
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid #b8bbfc; outline-offset: 4px; }
[hidden] { display: none !important; }
button:disabled, input:disabled { cursor: wait; opacity: .66; }
.symbols { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.icon, .brand-mark, .poem-key { display: inline-block; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.icon { width: 19px; height: 19px; stroke-width: 1.65; flex-shrink: 0; }
.shell { width: min(calc(100% - 8rem), 1176px); margin-inline: auto; }
.skip { position: fixed; top: .5rem; left: .5rem; z-index: 5; padding: .65rem 1.2rem; background: var(--gold); color: var(--night); transform: translateY(-180%); }
.skip:focus { transform: none; }

.masthead { background: #101321; border-bottom: 1px solid #302e3a; }
.mast-inner { min-height: 67px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: .72rem; font: 400 1.7rem/1 var(--serif); letter-spacing: -.045em; }
.brand-mark { width: 32px; height: 32px; color: var(--gold); stroke-width: 1.35; }
nav { align-self: stretch; display: flex; gap: clamp(1rem, 3vw, 2rem); }
.nav-poem, .nav-puzzle { display: inline-flex; align-items: center; position: relative; border: 0; padding: 0 .1rem; background: none; font: 500 .88rem var(--sans); color: var(--mist); }
.nav-puzzle { color: var(--gold); }
.nav-puzzle::after { content: ""; height: 2px; position: absolute; inset: auto .1rem 13px; background: #b19a64; }
.nav-poem:hover, .nav-puzzle:hover, .text-button:hover { color: var(--gold); }

.cover { isolation: isolate; position: relative; overflow: hidden; background: #101626; border-bottom: 1px solid #665635; }
.cover-art, .cover-shade { position: absolute; z-index: -1; }
.cover-art { inset: 0 0 0 auto; width: max(67%, 690px); height: 100%; object-fit: cover; object-position: center 25%; }
.cover-shade { inset: 0; background: linear-gradient(90deg, #101626 9%, rgba(16,22,38,.98) 27%, rgba(16,22,38,.82) 39%, rgba(16,22,38,.32) 50%, transparent 63%); }
.chest-hotspot {
  position: absolute; inset: 29% 4% 10% auto; width: 32%; z-index: 1;
  display: grid; place-items: end center; padding: 0; background: transparent; border: 0;
  border-radius: 42% 42% 14% 14%; touch-action: manipulation;
}
.chest-hotspot-cue {
  display: inline-flex; align-items: center; gap: .38rem; min-height: 30px; padding: .23rem .78rem;
  color: #ffebbd; background: #15191deb; border: 1px solid #ac905d; border-radius: 18px;
  font: 550 .77rem/1.2 var(--sans); box-shadow: 0 2px 8px #0008;
  transition: transform .2s, background .2s;
}
.chest-hotspot-cue .icon { width: 15px; height: 15px; }
.chest-hotspot:hover .chest-hotspot-cue { transform: translateY(-2px); background: #272018; }
.chest-hotspot:active .chest-hotspot-cue { transform: translateY(1px) scale(.97); }
.cover.inspecting .cover-art { animation: knock .42s ease-out; transform-origin: 72% 63%; }
.cover.opening .cover-art { animation: chest-open 1.05s ease-out both; transform-origin: 72% 63%; }
@keyframes knock {
  30% { transform: scale(1.008) translateY(1px); filter: brightness(1.07); }
  65% { transform: scale(1.003); }
}
@keyframes chest-open {
  from { opacity: .45; filter: brightness(1.14); transform: scale(1.025); }
  to { opacity: 1; filter: brightness(1); transform: none; }
}
.cover-inner { min-height: clamp(375px, 31.5vw, 515px); display: flex; align-items: center; }
.cover-copy { max-width: 60%; padding-block: 2.5rem 2.8rem; }
.flourish { display: flex; align-items: center; gap: 5px; width: fit-content; color: var(--gold); opacity: .82; }
.flourish span { display: block; height: 1px; width: 29px; background: currentColor; }
.flourish i, .flourish b { display: block; width: 4px; height: 4px; transform: rotate(45deg); background: currentColor; }
.flourish b { width: 7px; height: 7px; border: 1px solid currentColor; background: transparent; }
.flourish.centered { margin-inline: auto; }
.cover h1, .puzzle h2, .completion h3, .poem-head h2 { font-family: var(--serif); font-weight: 400; text-wrap: balance; }
.cover h1 { margin: 1.05rem 0 .75rem; font-size: clamp(3.4rem, 5.75vw, 6rem); letter-spacing: -.066em; line-height: 1.05; color: #fff7e5; }
blockquote { margin: 0; font: italic clamp(1.04rem, 1.45vw, 1.38rem)/1.54 var(--serif); color: #dedde8; }
.cover-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.5rem; margin-top: 1.8rem; }
.gold-button, .text-button, .poem-return, .retry { display: inline-flex; justify-content: center; align-items: center; gap: .65rem; min-height: 45px; font: 600 .94rem/1.15 var(--sans); }
.gold-button { border: 1px solid #f4dc9b; border-radius: 5px; padding: .78rem 1.22rem; background: #e9c77e; color: #251f19; transition: background .18s, box-shadow .18s; }
.gold-button:hover:enabled, a.gold-button:hover { background: #f6d99a; box-shadow: 0 0 21px rgba(219,182,98,.18); }
.text-button { border: 0; background: none; color: #e7e2dc; padding: .55rem .05rem; font-weight: 500; }
.small-arrow { width: 16px; }

.puzzle { padding-block: clamp(2.1rem, 3.4vw, 3.8rem) 3.5rem; scroll-margin: 1rem; }
.puzzle:focus, .completion:focus { outline: none; }
.puzzle-heading { display: flex; gap: 1.15rem; align-items: center; justify-content: space-between; }
.puzzle h2 { margin: 0; color: var(--ivory); font-size: clamp(2.15rem, 3vw, 3.15rem); line-height: 1.15; letter-spacing: -.045em; }
.puzzle-heading p { margin: .45rem 0 0; color: var(--mist); font-size: .99rem; }
.progress { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: .48rem; padding: .35rem .8rem; border: 1px solid #555064; border-radius: 99px; color: #e0dae9; font-size: .83rem; white-space: nowrap; }
.progress .icon { width: 15px; height: 15px; color: #cbb788; }
.progress.complete { color: var(--mint); border-color: #4e8068; }
.progress.complete .icon { color: var(--mint); }
.puzzle.shell { max-width: 912px; }
.word-locks {
  list-style: none; margin: 1.35rem 0 .6rem; padding: 0; display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.18fr); gap: clamp(3px, .85vw, 10px);
}
.word-locks:empty { display: none; }
.word { min-width: 0; }
.word-selector {
  display: grid; align-content: center; justify-items: center; gap: .5rem; width: 100%; min-height: 57px;
  padding: .35rem .1rem; background: #191d2b; border: 1px solid #444451; border-radius: 4px;
  color: #d3d1da; touch-action: manipulation; transition: background .2s, border-color .2s;
}
.word-selector:hover { background: #242634; border-color: #85785d; }
.word.active .word-selector, .word-selector[aria-pressed="true"] {
  color: #ffdda0; background: #302b25; border-color: #bc9b5d; box-shadow: inset 0 -2px #bc9b5d;
}
.word.found .word-selector { color: #bcf0cb; background: #192e2a; border-color: #51816c; }
.word.found.active .word-selector { box-shadow: inset 0 -2px #9ed6b3; }
.word-selector:disabled { cursor: default; opacity: 1; }
.word-label { display: flex; align-items: center; justify-content: center; gap: .2rem; font: 500 .76rem/1 var(--sans); }
.word-label .icon { width: 11px; height: 11px; }
.word-cells { display: flex; align-items: center; justify-content: center; gap: clamp(1px, .32vw, 4px); min-height: .8rem; }
.cell { display: grid; place-items: center; font: 600 clamp(.63rem, 1.33vw, .93rem)/1 var(--serif); }
.cell.empty::after { content: ""; width: clamp(3px, .8vw, 9px); height: 1px; background: currentColor; }
.word.new-lock .word-selector { animation: lock-in .48s ease-out; }
@keyframes lock-in { from { transform: translateY(-2px); background: #41624e; } }

.mechanism {
  position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center;
  min-width: 0; border: 1px solid #64533c; border-radius: 5px; padding: clamp(15px, 2.3vw, 26px) clamp(7px, 2.2vw, 23px);
  background: linear-gradient(90deg, #15181cde, #251d14b3 50%, #15181cde),
    url("/art/forest-box.webp") 74% 60% / 490% auto, #251e18;
  box-shadow: inset 0 2px #a9894e35, inset 0 -3px #120f0d;
}
.mechanism::before {
  content: ""; position: absolute; inset: 5px; z-index: -1; pointer-events: none;
  border: 1px solid #ba97592e; border-radius: 2px;
}
.mechanism-heading { margin-bottom: .9rem; }
.mechanism-label { margin: 0; color: #ffedc3; font: 400 clamp(1.25rem, 2.9vw, 1.8rem)/1.2 var(--serif); }
.mechanism-guide, .mechanism-help, .wheel-help { margin: .3rem 0 0; color: #ece2cf; font: 400 .86rem/1.45 var(--sans); }
.wheel-rail {
  --screw: radial-gradient(circle, #322313 0 1px, #c6a66a 1.5px 2.5px, #665031 3px, #281e13 4px, transparent 4.5px);
  --wheel-width: clamp(41px, 6vw, 68px);
  position: relative; display: flex; align-items: stretch; justify-content: center; width: max-content; max-width: 100%; min-width: 0;
  gap: clamp(2px, .45vw, 6px); padding: 12px clamp(12px, 3.6vw, 38px);
  border: 1px solid #262016; border-radius: 9px; color: #3b301f;
  background: var(--screw) left 1px top 1px / 14px 14px no-repeat,
    var(--screw) right 1px top 1px / 14px 14px no-repeat,
    var(--screw) left 1px bottom 1px / 14px 14px no-repeat,
    var(--screw) right 1px bottom 1px / 14px 14px no-repeat,
    repeating-linear-gradient(7deg, transparent 0 3px, #fff3ce0c 3px 4px, transparent 4px 7px),
    linear-gradient(177deg, #ebd099 0, #ab874b 7%, #9d783e 24%, #c5a269 48%, #866436 72%, #574128 97%, #b89a63);
  box-shadow: inset 0 1px #fbe9ba, inset 0 -2px #4d3922, 0 2px 0 #0c0906, 0 6px 12px #0d0908a8;
}
.wheel-rail::before {
  content: ""; position: absolute; inset: 4px; border: 1px solid #584124; box-shadow: inset 0 1px #eac78b78;
  border-radius: 5px; pointer-events: none;
}
.letter-wheel {
  position: relative; flex: 0 1 var(--wheel-width); width: var(--wheel-width); min-width: 0; display: grid;
  grid-template-rows: 44px clamp(37px, 5.6vw, 52px) 44px;
  border-inline: 1px solid #231b13; border-radius: 4px;
  background: linear-gradient(180deg, #30271e 0%, #705e42 9%, #b7a07c 30%, #ecdfc0 48%, #ddd0ab 55%, #ae9879 71%, #746149 88%, #332a20);
  box-shadow: 0 0 0 2px #58442e, 2px 2px 2px #4b3527, inset 2px 0 1px #fff1c780, inset -2px 0 2px #412e1d85;
  touch-action: none; user-select: none; -webkit-user-select: none;
}
.wheel-step, .wheel-face {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-width: 0; padding: 0; border: 0; background: transparent; color: #321f11;
  font-family: var(--serif); font-variant-numeric: tabular-nums; touch-action: none;
}
.wheel-step { gap: 0; text-shadow: 0 1px #d9c6a082; }
.wheel-step:enabled:hover { background: #fff3c92c; }
.wheel-step:enabled:active { background: #412a1f29; }
.wheel-step:disabled { opacity: .72; cursor: default; }
.step-letter { font-size: clamp(.91rem, 2vw, 1.17rem); font-weight: 600; line-height: 1; }
.step-chevron { display: block; font: 600 .72rem/1 var(--sans); color: #281c10; }
.wheel-up .step-chevron { order: -1; }
.wheel-down .step-chevron { order: 1; }
.wheel-face {
  color: #fff0c9; font-size: clamp(1.55rem, 3.9vw, 2.35rem); font-weight: 600; line-height: 1;
  background: linear-gradient(180deg, #51402c, #56442e 45%, #3f3223);
  border-block: 1px solid #5f4b2e; box-shadow: inset 0 1px #a58d68, inset 1px 0 #c5ad804d, inset -1px 0 #19150f91;
  text-shadow: 0 1px 1px #17120d;
}
.wheel-face.empty { color: #ddcba6; font-weight: 400; }
.wheel-glyph, .step-letter { transform: translateY(var(--wheel-shift, 0px)); }
.letter-wheel.dragging, .wheel-face { cursor: ns-resize; }
.word.active .cell.draft { color: #ffe8b9; }
.mechanism[data-saved="true"] .wheel-face { color: #dbf4d2; background: linear-gradient(#355641, #244532); border-block-color: #5e7960; text-shadow: 0 1px #162d21; }
.mechanism[data-saved="true"] .mechanism-label { color: #c6ebcb; }
.letter-wheel:focus-within { z-index: 1; }
.letter-wheel :focus-visible { outline: 2px solid #31231b; outline-offset: -3px; box-shadow: inset 0 0 0 5px #f9dfa4; }
.mechanism-actions { display: flex; flex-direction: column; align-items: center; gap: .4rem; margin-top: 1rem; }
.wheel-submit { min-width: 145px; box-shadow: inset 0 1px #ffebc5, 0 2px 3px #130e0980; }
.wheel-help { font-size: .79rem; }
.mechanism.inspecting .wheel-rail { animation: knock .42s ease-out; }
.typing-option { margin-top: 1rem; }
.typing-option > summary { width: fit-content; min-height: 44px; padding: .55rem 0; color: var(--gold); font-weight: 550; cursor: pointer; }
.typing-option > summary:focus-visible { outline: 3px solid #b8bbfc; outline-offset: 3px; }
.typing-option[open] #guess-form { margin-block: .4rem .9rem; }
#guess-form { max-width: 810px; }
#guess-form label { display: inline-block; color: #e8e4ec; margin-bottom: .48rem; font: 550 .9rem/1.4 var(--sans); }
.entry-row { display: flex; gap: .6rem; }
#guess { min-width: 0; flex: 1; border: 1px solid #57566a; border-radius: 5px; padding: .73rem .95rem; appearance: none; background: #141726; color: var(--ivory); font-size: 1rem; }
#guess::placeholder { color: #a5a8bc; opacity: 1; }
.entry-note { margin: .62rem 0 0; color: var(--quiet); font-size: .8rem; }
.feedback { margin: .7rem 0 0; color: var(--gold); }
.feedback:empty { display: none; }
.feedback[data-tone="good"] { color: var(--mint); }
.feedback[data-tone="error"] { color: #f5b6bc; }
.retry { background: none; color: var(--gold); border: 0; text-decoration: underline; text-underline-offset: 4px; padding: .2rem 0; }
.completion { max-width: 790px; margin: 1.8rem auto .25rem; text-align: center; }
.completion h3 { margin: .8rem 0 .4rem; color: var(--ivory); font-size: clamp(1.85rem, 3vw, 2.75rem); line-height: 1.15; letter-spacing: -.035em; }
.completion p { margin: .6rem auto; color: var(--mist); }
#countdown { margin-top: 1rem; color: var(--gold); font: 500 1.1rem/1.5 var(--sans); font-variant-numeric: tabular-nums; }
#secret { margin: 1.2rem auto; padding: 1.35rem clamp(1rem, 3vw, 2.3rem); border-block: 1px solid #6b5e42; color: #f5e8c9; white-space: pre-wrap; overflow-wrap: anywhere; font: 400 clamp(1.1rem, 2vw, 1.4rem)/1.55 var(--serif); }
.site-footer { border-top: 1px solid #363547; }
.footer-inner { min-height: 64px; color: var(--quiet); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.footer-inner > span { color: #c5beaf; font: 1.07rem var(--serif); }
.footer-inner a { padding-block: .6rem; font-size: .8rem; }
.footer-inner a:hover { color: var(--gold); }
.footer-inner a span { padding-inline-start: .25rem; }

dialog { position: fixed; width: min(92vw, 650px); max-height: min(90vh, 900px); max-height: min(90dvh, 900px); margin: auto; padding: 0; border: 1px solid #a9966c; border-radius: 5px; background: #f2ecdd; color: #302d31; color-scheme: light; overscroll-behavior: contain; box-shadow: 0 26px 100px #0009; }
dialog::backdrop { background: rgba(6,9,18,.78); }
body:has(dialog[open]) { overflow: hidden; }
.paper { position: relative; padding: 2.15rem clamp(1rem, 5vw, 3.6rem) 2.3rem; }
.paper::before { content: ""; position: absolute; inset: .55rem; pointer-events: none; border: 1px solid #c7b998; }
.dialog-close { display: grid; place-items: center; position: absolute; right: .85rem; top: .85rem; width: 44px; height: 44px; color: #675a41; background: #f2ecdd; border: 0; border-radius: 50%; }
.dialog-close:hover { background: #e4d9be; }
.poem-head { text-align: center; margin-bottom: 2.1rem; }
.poem-key { width: 31px; height: 31px; color: #86682b; stroke-width: 1.35; }
.poem-head h2 { margin: .45rem auto .8rem; font-size: clamp(2.2rem, 5.3vw, 3.5rem); letter-spacing: -.045em; line-height: 1.15; }
.poem-head .flourish { color: #977633; }
.stanzas { width: fit-content; max-width: 100%; margin-inline: auto; font: 400 clamp(1.02rem, 2.5vw, 1.18rem)/1.55 var(--serif); }
.stanzas p { margin: 0 0 1.35em; }
.poem-return { margin: 1.3rem auto 0; display: flex; background: none; color: #59400e; border: 0; border-bottom: 1px solid #ad945b; }
.reading-room { width: min(94vw, 750px); color: #322c2e; background: #f5efdf; }
.reader-bar { position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center; min-height: 53px; padding: 0 clamp(1rem, 4vw, 2.35rem); gap: .6rem; border-bottom: 1px solid #c4b794; background: #efe6d2; }
#room-name { font: 1.35rem var(--serif); letter-spacing: -.04em; }
.reader-tools { display: flex; align-items: center; gap: .45rem; }
.reader-tools button, .paper-action { min-height: 44px; border: 0; background: transparent; color: #644915; padding: .45rem .65rem; font-weight: 600; font-size: .88rem; }
.reader-tools button:hover, .paper-action:hover { color: #36240b; text-decoration: underline; text-underline-offset: .22em; }
#close-room { display: grid; place-items: center; min-width: 44px; }
.reading-page { min-height: 145px; padding: clamp(1.75rem, 4.5vw, 3.4rem) clamp(1.25rem, 5vw, 3.8rem); }
.reading-page h2 { margin: 0; color: #30292a; font: 400 clamp(2rem, 5.5vw, 3.15rem)/1.12 var(--serif); letter-spacing: -.045em; text-wrap: balance; outline: none; overflow-wrap: anywhere; }
.reader-ornament { color: #866b36; margin-bottom: 1.2rem; }
.index-note, #room-status { color: #605855; font-size: .92rem; }
.index-note { margin: .6rem 0 1.55rem; }
#title-lines { margin: 0; padding: 0; list-style: none; }
#title-lines li { margin: 0; }
#title-lines .stanza-start { margin-top: 1.1rem; }
.title-line { display: block; width: 100%; min-height: 36px; border: 0; padding: .26rem 0; background: transparent; color: #42332e; font: 400 clamp(1.08rem, 2.65vw, 1.33rem)/1.42 var(--serif); text-align: left; overflow-wrap: anywhere; }
.title-line::first-letter { color: #77531a; font-weight: 600; }
.title-line:hover, .title-line:focus-visible { color: #77531a; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .23em; }
.reading-room button:focus-visible { outline-color: #795b22; }
#piece-number { margin: 0 0 .6rem; color: #7b653e; font: 550 .85rem var(--sans); }
#room-piece .reader-ornament { margin: 1.4rem 0 1.65rem; }
#piece-text { color: #383130; white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 4; font: 400 clamp(1.06rem, 2.6vw, 1.25rem)/1.62 var(--serif); }
.page-turn { margin-top: 2.25rem; border-top: 1px solid #c8b896; padding-top: .6rem; justify-content: space-between; flex-wrap: wrap; gap: .2rem; }
.page-turn button { padding-inline: 0; }
#next-piece, #last-to-index { margin-left: auto; }
#open-room { margin-top: .45rem; }
.open-chest { margin: .6rem auto 0; }
.reveal-scene { position: relative; width: min(100%, 440px); aspect-ratio: 2.4; margin: 1rem auto .75rem; overflow: hidden; border: 1px solid #796745; border-radius: 4px; background: #141927; }
.reveal-scene img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 72% 58%; }
.completion.opening .reveal-scene img { animation: chest-open 1.05s ease-out both; transform-origin: 72% 63%; }
.completion.opening #secret { animation: reveal-letter .7s ease-out both; }
@keyframes reveal-letter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) {
  .reading-room { width: 100%; max-width: 100%; height: 100%; max-height: 100dvh; border: 0; border-radius: 0; }
  .reading-page { padding-bottom: max(2rem, env(safe-area-inset-bottom)); }
  .title-line { min-height: 44px; }
}
@media (min-width: 1600px) { .cover-art { width: calc(50% + 275px); } }
@media (max-width: 1000px) {
  .shell { width: calc(100% - 5rem); }
}
@media (max-width: 760px) {
  .shell { width: calc(100% - 3rem); }
  .mast-inner { min-height: 60px; }
  .cover-inner { min-height: 340px; }
  .cover-copy { max-width: 65%; }
  .cover-art { width: 83%; }
  .cover-shade { background: linear-gradient(90deg, #101626 0%, rgba(16,22,38,.96) 25%, rgba(16,22,38,.75) 46%, rgba(16,22,38,.05) 71%); }
  .cover h1 { font-size: clamp(3rem, 7.2vw, 3.6rem); }
  .puzzle-heading { align-items: flex-start; }
  .progress { margin-top: .42rem; }
  .chest-hotspot { right: 5%; width: 37%; }
}
@media (max-width: 600px) {
  .shell { width: calc(100% - 2.5rem); }
  .mast-inner { min-height: 56px; }
  .brand { gap: .45rem; font-size: 1.46rem; }
  .brand-mark { width: 26px; height: 26px; }
  nav { gap: 1.05rem; }
  .nav-poem, .nav-puzzle { font-size: .81rem; }
  .nav-puzzle::after { bottom: 8px; }
  .cover { background: #101626; }
  .cover-art { position: relative; display: block; width: 100%; height: clamp(158px, 47vw, 248px); object-position: center 48%; }
  .cover-shade { background: linear-gradient(to bottom, transparent 38%, #101626 100%); inset: 0 0 auto; height: clamp(159px, 47.2vw, 249px); }
  .chest-hotspot { inset: clamp(40px, 14vw, 72px) 5% auto auto; width: 46%; height: clamp(100px, 31vw, 165px); }
  .chest-hotspot-cue { min-height: 26px; padding: .16rem .56rem; font-size: .72rem; }
  .cover-inner { min-height: 0; }
  .cover-copy { max-width: none; padding: 0 0 1.8rem; margin-top: -10px; }
  .cover-copy .flourish { display: none; }
  .cover h1 { margin: 0 0 .35rem; font-size: clamp(2.85rem, 11.6vw, 4rem); }
  blockquote { font-size: 1.03rem; }
  .cover-actions { margin-top: 1.15rem; gap: 1.2rem; }
  .gold-button, .text-button { font-size: .9rem; }
  .puzzle { padding-block: 1.8rem 2.5rem; }
  .puzzle-heading { display: block; }
  .puzzle-heading p { font-size: .93rem; }
  .progress { margin-top: .82rem; padding: .22rem .65rem; }
  .word-locks { margin-top: 1rem; }
  .word-selector { min-height: 50px; }
  .word-label { font-size: .7rem; }
  .mechanism-heading { margin-bottom: .72rem; }
  .mechanism-guide, .mechanism-help { font-size: .8rem; }
  .wheel-rail { --wheel-width: 48px; padding: 10px 12px; }
  .entry-row { gap: .4rem; }
  .entry-row .gold-button { padding-inline: .9rem; }
  .entry-row .icon { display: none; }
  .paper { padding-inline: 1.32rem; }
}
@media (max-width: 355px) {
  .shell { width: calc(100% - 1.75rem); }
  .cover-actions { gap: .9rem; }
  .entry-row { flex-wrap: wrap; }
  .entry-row input { flex-basis: 100%; }
  .entry-row .gold-button { width: 100%; }
  .stanzas { font-size: .94rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .wheel-glyph, .step-letter { transform: none; }
}