/* Production refinements extend the accepted visual system. */
button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
/* The shared reading masthead remains outside every changing chapter. */
.masthead .brand{min-width:44px;min-height:44px;justify-content:flex-start;color:var(--ivory);text-decoration:none}
h1:focus,h2:focus{outline:none}
.reading-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-top:32px;border-top:1px solid #e3c79e55;padding-top:20px}
.return-link{min-height:44px;padding:10px 0;cursor:pointer}
.resume-reading{display:block;margin-top:20px}.resume-reading[hidden]{display:none}
.encounter-next{flex-wrap:wrap;gap:16px}
.encounter-next>.return-link{flex-basis:100%;text-align:left}
.orientation-option:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:4px}
.orientation-option strong{line-height:1.4}
/* Make choosing an expression unmistakably an action, separate from the prose. */
.encounter-copy>.encounter-choice-cue {font:400 .9375rem/1.6 'IBM Plex Sans',sans-serif;color:var(--gold-light);margin:0 0 1.5rem}
.encounter-choice-cue button {display:inline;min-height:44px;padding:.25rem 0;border:0;background:transparent;color:inherit;font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:.25em;cursor:pointer}
.orientation {min-width:0;margin-top:2.5rem;padding:1.25rem clamp(1rem,3vw,1.75rem) 1.5rem;border:2px solid #caa36e;background:#f4eedf;color:#1b2521;scroll-margin-top:110px}
.orientation legend {max-width:100%;padding:.35rem .65rem;background:#f4eedf;color:#1b2521;font:500 clamp(1.5rem,3vw,1.9rem)/1.2 'EB Garamond',serif}
.orientation .orientation-intro {margin:.25rem 0 1.25rem;color:#3d4941;font:400 1rem/1.5 'IBM Plex Sans',sans-serif}
.orientation .orientation-options {gap:.625rem;border:0}
.orientation .orientation-option {grid-template-columns:1.125rem minmax(0,1fr);column-gap:.625rem;row-gap:.3rem;align-items:center;min-height:108px;padding:1rem .75rem;text-align:left;background:#fffdf6;border:1px solid #8d8069;box-shadow:none}
.orientation .orientation-option input {position:static;opacity:1;grid-column:1;grid-row:1 / span 2;margin:0;width:1.125rem;height:1.125rem;accent-color:#775528}
.orientation .orientation-option strong {grid-column:2;color:#1b2521;font:600 1rem/1.4 'IBM Plex Sans',sans-serif}
.orientation .orientation-option small {grid-column:2;color:#465348;font:400 .875rem/1.45 'IBM Plex Sans',sans-serif}
.orientation .orientation-option:hover {border-color:#4d574c;background:#eee3ce}
.orientation .orientation-option:has(input:checked) {background:#e6d2ae;border-color:#614822;box-shadow:inset 0 0 0 1px #614822}
.orientation .orientation-option:has(input:checked):before {content:none}
.orientation .orientation-option:has(input:focus-visible) {outline:3px solid #226b7b;outline-offset:3px}
.orientation .orientation-response {min-height:0;margin-top:1.25rem;padding:.875rem 1rem;border-left:3px solid #775528;background:#e9dfcd;color:#28382d;font-size:1rem;line-height:1.5}
.orientation .orientation-response strong {margin-bottom:.3rem;color:#493617;font:600 .875rem/1.45 'IBM Plex Sans',sans-serif}
.encounter-next .material-action:disabled {cursor:not-allowed}
.constellation-card figcaption{font-size:.875rem;white-space:normal;overflow-wrap:anywhere}
.no-script{position:fixed;z-index:100;inset:auto 20px 20px;background:var(--ivory);color:var(--ink);padding:20px}
dialog{max-width:min(90vw,600px);background:var(--ivory);color:var(--ink);border:1px solid var(--gold);padding:32px}
dialog::backdrop{background:#000b}
dialog h2{font-size:2rem}dialog textarea{display:block;width:100%;margin:16px 0;padding:12px;font:1rem/1.5 sans-serif;color:var(--ink);background:#fff}
dialog .return-link{color:var(--ink)}
.onward-action:disabled{opacity:.45;cursor:wait}
.reading-exploration {margin-top:2rem;padding-top:1.5rem;border-top:1px solid #e3c79e55}
.reading-exploration[hidden] {display:none}
.reading-exploration h4 {font-family:'EB Garamond',serif;font-size:1.6rem;font-weight:500;margin:0 0 1rem;line-height:1.3}
.reading-exploration__cards,.reading-exploration__wider {display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
.reading-exploration a {display:inline-flex;align-items:center;min-height:44px;color:var(--gold);font-size:.9375rem;text-decoration:underline;text-underline-offset:.25em}
.reading-exploration a:hover {color:var(--ivory)}
.reading-exploration__wider {margin-top:1rem}
.encounter-card img{object-fit:contain}
/* Keep draw thumbnails and empty slots equal despite full-size image attributes. */
.drawn-cards>img,.drawn-cards>i{display:block;width:58px;height:87px;align-self:start}
@media(max-width:680px){
  .choice-card{--offset-mobile:calc((var(--slot) - 2)*clamp(43px,15vw,62px));width:clamp(70px,22vw,92px)}
  .orientation-options{grid-template-columns:1fr}
  .orientation-option{min-height:72px}
  .orientation .orientation-option{min-height:76px}
  .orientation{scroll-margin-top:88px}
  .constellation-card figcaption{font-size:.875rem;line-height:1.4}
  .reading-actions{flex-direction:column;align-items:flex-start}
  .masthead{gap:12px}.journey-status{font-size:.75rem}.journey-track{display:none}
  .threshold-art{min-height:0}.threshold-art img{max-height:45svh;width:auto}
}
@media(min-width:681px) and (max-width:850px){.choice-card{--offset-tablet:calc((var(--slot) - 2)*88px);width:120px}}