/* Warm paper, painted places, and a quieter interface. */
:root,:root[data-world]{--bg:#eee9dc;--surface:#fcf9f0;--surface2:#e6e0d1;--ink:#26352f;--muted:#646b60;--line:#c9c7b5;--accent:#31584e;--accent-ink:#fffdf6;--warm:#ac5336;--good:#39765b;--paper:#faf5e8;--display:'Libre Bodoni',Georgia,serif;--body:'Hanken Grotesk',sans-serif;--radius:12px;--btn-shadow:0 3px 0 #223b32;--card-shadow:0 8px 24px #2d392212}
body{background:var(--bg);color:var(--ink)}
button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #b86a32;outline-offset:5px}
#app{max-width:620px}.hub{padding:20px 20px 100px;gap:18px}
.brand{font-family:var(--display)!important;font-size:clamp(44px,6vw,68px)!important;letter-spacing:-2px;font-style:italic;color:#263c34!important;line-height:1.05}.brand .sia{color:inherit!important}.tag{font-size:15px;line-height:1.5;margin-bottom:8px!important;color:var(--muted)}
.hubhead{padding-bottom:12px;border-bottom:1px solid var(--line)}
.chip{font-size:12px;min-height:36px;border-color:var(--line)}.chip.btnchip.hv-jbtn{background:transparent;color:var(--ink);border-color:var(--line)}.hv-jbtn svg{color:var(--ink)}
.hv-tabs{padding:6px;background:#dcdccc;border:1px solid #c7cbbb;border-radius:50px;gap:4px;margin-bottom:16px}.hv-tabs button{font-size:14px;border-radius:40px;padding:12px 4px}.hv-tabs button[aria-selected=true]{background:#304c41;color:#fffdf5;box-shadow:0 3px 8px #26352f20}
.hv-pane{gap:20px;padding:4px 1px 24px}.hv-k{font-size:11px;letter-spacing:.19em;margin-top:10px}.hv-intro{background:transparent;color:var(--muted);padding:0 0 12px;border-bottom:1px solid var(--line);border-radius:0;gap:0;margin:0}.hv-intro p{font-size:13px;max-width:75ch}.hv-intro:after{display:none}.hv-tipb{color:var(--accent);padding:4px 0;min-height:32px;background:transparent}.hv-intro.shut{padding:0}.hv-intro.shut .hv-tipb{padding:2px 0}
.hv-hero{display:grid;grid-template-columns:1.2fr 1fr;padding:0;gap:0;overflow:hidden;border:1px solid #c7c3b0;border-radius:8px 28px 8px 8px;box-shadow:0 7px 0 #d6d2c1,0 12px 30px #26352f13;background:var(--surface);min-height:260px}.cover-art{width:100%;height:100%;object-fit:cover;min-height:260px}.hv-herot{padding:24px;gap:16px}.hv-herot b{font-size:clamp(25px,3vw,38px);line-height:1.05}.hv-sub{font-size:12px}.hv-herot .meter{height:4px}.hv-hero .kicker{font-size:10px}
.hv-lvl{border:0;border-top:1px solid #bfc1ad;border-radius:0;background:transparent;padding:22px 0 4px}.hv-lvl.later{border-style:solid;border-color:#bfc1ad}.hv-lvl h3{font-size:25px}.hv-lvl p{font-size:14px;margin-top:8px}.hv-mini{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}.hv-tile{border:1px solid #c9c5b5;background:var(--surface);border-radius:4px 14px 4px 4px;overflow:hidden;padding:0 0 14px;gap:7px;min-height:150px;box-shadow:0 4px 0 #dbd6c4;transition:transform .18s}.hv-tile:hover{transform:translateY(-4px)}.tile-art{width:100%;height:110px;object-fit:cover}.hv-tile b,.hv-tile small{padding:0 12px}.hv-tile b{font:600 17px/1.15 var(--display);margin-top:5px}.hv-tile small{font-size:11px;font-weight:500}.hv-tile.lock{opacity:.85}.hv-conn{display:none}
.hv-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.hv-row2{display:flex;flex-wrap:wrap;align-items:flex-start;border:1px solid #c7c4b5;border-radius:5px 22px 5px 5px;gap:12px;padding:0 18px 20px!important;background:var(--surface)!important;color:var(--ink)!important;box-shadow:0 5px 0 #d9d5c3;overflow:hidden;transition:transform .2s}.hv-row2:hover{transform:translateY(-3px)}.hv-row2.sel{border:2px solid var(--accent)}.world-cover{width:calc(100% + 36px);max-width:none;margin:0 -18px 6px;height:200px;object-fit:cover}.hv-rn{font-size:26px;width:auto;color:#976346}.hv-rb{flex-basis:65%;gap:8px}.hv-rb b{font-size:25px}.hv-rb>i{font-size:11px;text-transform:uppercase;letter-spacing:.1em}.hv-rb em{line-height:1.5;-webkit-line-clamp:3}.hv-row2 .av{width:34px;height:34px}.hv-arr{display:none}.hv-cb{height:4px}.hv-cb i{background:var(--accent)!important}.hv-cat{border-width:1px;background:var(--surface);font-size:12px;padding:9px 15px}.hv-cat[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.hv-map{padding:0!important;overflow:hidden;background:#f8f3e5;border:1px solid #cec9b6;border-radius:7px 26px 7px 7px;box-shadow:0 6px 0 #d9d4c1;gap:0}.path-cover{width:100%;height:270px;object-fit:cover;object-position:center 45%}.hv-map>.mhead{padding:28px 32px 18px;margin:0;gap:20px;align-items:center}.mtitle h1{font:500 clamp(28px,4vw,42px)/1.12 var(--display)}.mtitle .kicker{font-size:10px;margin-bottom:9px}.path-meta{display:flex;flex-direction:column;text-align:right;flex:none;gap:3px}.path-meta b{font:500 27px var(--display)}.path-meta span{font-size:10px;color:var(--muted)}.hv-map>.story{margin:0 32px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:transparent;box-shadow:none;border-radius:0}.story p{font-size:14px;line-height:1.7}.hv-map>.ctrls{padding:20px 32px;margin:0;display:flex;gap:12px}.hv-map .ctrls .btn{width:auto;flex:1;font-size:12px;padding:12px 16px;border:1px solid #c9c7b5;background:var(--surface);border-radius:50px;letter-spacing:0}.route-key{display:flex;justify-content:space-between;padding:16px 32px;border-top:1px solid #d9d3c0;color:var(--muted);font-size:11px;gap:16px}.route-key span:first-child{letter-spacing:.15em;font-size:10px;font-weight:700}
.illustrated-tree{margin:0 8%;width:84%;isolation:isolate}.illustrated-tree .lines path{stroke-width:4;stroke:#a9ae8c;stroke-dasharray:3 9}.illustrated-tree .lines .done{stroke:#3f6a51;stroke-dasharray:none}.illustrated-tree .node{width:150px;margin-left:-75px;gap:7px;z-index:2}.illustrated-tree .node .ring{width:96px;height:96px;padding:5px;background:#fffcf0;border:2px solid #879782;border-radius:47% 53% 49% 51%;box-shadow:0 5px 0 #c9c9b6,0 8px 15px #4b422518;animation:none;transition:transform .18s}.illustrated-tree .node:hover .ring{transform:rotate(-4deg) scale(1.06);border-color:#ac5336}.lesson-art{width:100%;height:100%;object-fit:cover;border-radius:50%}.lesson-number{position:absolute;left:-7px;top:-4px;width:27px;height:27px;background:#31584e;border-radius:50%;color:white;display:grid;place-items:center;font-size:10px;font-weight:700;border:3px solid #f8f3e5}.illustrated-tree .node .nm{max-width:150px;background:#fcf9ef;padding:7px 12px;border:1px solid #d6d0bb;border-radius:5px;box-shadow:0 3px 0 #e4decb;font:600 16px/1.15 var(--display);text-wrap:balance}.node-caption{font-size:10px;color:#68705c}.illustrated-tree .node.boss .ring{width:106px;height:106px;border:4px double #a76632}.path-landmark{position:absolute;right:-2%;width:24%;transform:rotate(5deg);opacity:.75;z-index:-1}.landmark-art{width:100%;aspect-ratio:1;object-fit:cover;border:6px solid #fff9e9;box-shadow:0 3px 8px #574d3422}.path-landmark span{display:block;font:italic 12px var(--display);margin-top:8px;text-align:center}.hv-explore{padding:28px 0;gap:10px}.hv-explore h3{font-size:30px}.hv-branches{gap:15px}.hv-bc{border:1px solid #c3c3ad;border-top:5px solid var(--c);background:#fcf9ef;border-radius:5px 14px 5px 5px;padding:20px}.hv-bc b{font:600 20px var(--display)}
.sheet{background:var(--surface);border-radius:16px;overflow:hidden;box-shadow:0 16px 80px #132b2544}.sheet-art{width:calc(100% + 40px);max-width:none;margin:-20px -20px 20px;height:180px;object-fit:cover}.sheet h3{font:500 27px var(--display)}.sheet p{line-height:1.65}.btn{border-radius:10px}.opt{border-radius:10px;padding:18px;line-height:1.5}.q{font-family:var(--display);line-height:1.25}.stage{line-height:1.6}.cloudnudge{font-size:12px;box-shadow:none}.cs-stage{max-width:720px}.cutscene{background:#26352f}
@media(min-width:900px){:root[data-layout=wide] #app{max-width:1080px}:root[data-layout=wide] .hub{display:flex;padding:28px 50px 100px;gap:16px}:root[data-layout=wide] .hub>.tag{margin-bottom:10px}.hv-tabs{max-width:600px;width:100%;align-self:center}.hv-pane{padding:8px 5px 30px}.hv-mini{grid-template-columns:repeat(3,minmax(0,1fr))}.hv-hero{min-height:300px}.cover-art{min-height:300px}.hv-herot{padding:38px}.tile-art{height:150px}.hv-map{max-width:820px;width:100%;margin:auto}.hv-explore{max-width:820px;width:100%;margin:auto}.hv-col{grid-template-columns:repeat(3,minmax(0,1fr))}.world-cover{height:170px}.hv-rb b{font-size:22px}.path-cover{height:300px}.illustrated-tree .node .ring{width:112px;height:112px}}
@media(max-width:540px){.hub{padding:14px 16px 90px}.brand{font-size:48px!important}.tag{font-size:13px}.hv-hero{grid-template-columns:1fr;min-height:0}.cover-art{height:190px;min-height:0}.hv-herot{padding:23px;gap:12px}.hv-herot b{font-size:30px}.hv-mini{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile-art{height:100px}.hv-col{grid-template-columns:1fr}.world-cover{height:210px}.path-cover{height:180px}.hv-map>.mhead{padding:22px 20px 16px}.path-meta{display:none}.hv-map>.story{margin:0 20px;align-items:flex-start}.hv-map>.ctrls{padding:18px 20px;gap:8px}.hv-map .ctrls .btn{padding:10px;font-size:11px}.route-key{padding:15px 20px;font-size:10px}.route-key span:last-child{max-width:110px;text-align:right}.illustrated-tree{margin:0 2%;width:96%}.illustrated-tree .node{width:105px;margin-left:-52.5px}.illustrated-tree .node .ring{width:76px;height:76px}.illustrated-tree .node .nm{font-size:14px;max-width:104px;padding:6px 8px}.illustrated-tree .node.boss .ring{width:84px;height:84px}.path-landmark{width:24%;right:1%}.node-caption{font-size:9px}.hv-bc b{font-size:17px}.hv-branches{gap:10px}.hv-bc{padding:15px 10px}.chip{padding:6px 8px}.hv-tabs button{font-size:12px}.hv-tile b{font-size:16px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.hv-tile,.hv-row2,.illustrated-tree .node .ring{transition:none}}
.hub>.cloudnudge{display:none}.hub>.tag{max-width:none}.hub .hv-intro{display:none}.illustrated-tree{flex-shrink:0}.illustrated-tree .lines{pointer-events:none}.hv-map>.story{border-left:0;border-right:0}.lesson-art[src$='.svg']{object-fit:cover}.hv-tile:only-child{max-width:320px;width:100%}
@media(min-width:900px){.hubhead{position:absolute;right:50px;top:32px;border:0}:root[data-layout=wide] .hub{padding-top:35px}.hub>.brand{padding-right:330px}.hub>.tag{max-width:none}.hv-tabs{margin:8px 0 12px}}
.illustrated-tree .lines path{stroke:#7d8d6d;stroke-width:4;stroke-dasharray:4 9}.illustrated-tree .lines .done{stroke:#31584e;stroke-dasharray:none}
/* Quiet studio: a reading surface, not a gallery. */
.quiet-art{display:block;flex-shrink:0;background-repeat:no-repeat}
.hv-hero{display:block;min-height:0;border:0;border-left:3px solid #6f8370;border-radius:0;box-shadow:none;background:transparent;padding:0 0 0 24px!important}.hv-herot{padding:6px 0!important;gap:12px;max-width:560px}.hv-herot b{font-size:30px}.hv-herot .meter{max-width:280px;height:3px}.hv-sub{font-size:12px;font-weight:500}.hv-hero .av,.hv-hero .cover-art{display:none}
.hv-mini{display:flex;flex-direction:column;gap:0;margin-top:16px}.hv-tile,.hv-tile:only-child{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;max-width:none;min-height:64px;width:100%;padding:16px 0;border:0;border-bottom:1px solid #d8d5c8;border-radius:0;background:transparent;box-shadow:none;transition:none}.hv-tile:hover{transform:none;background:#e7e4d8}.hv-tile b,.hv-tile small{padding:0;margin:0}.hv-tile b{font:500 18px var(--body)}.hv-tile small{font-size:12px;font-weight:400}.hv-tile .tile-art{display:none}.hv-lvl{padding:22px 0 8px}.hv-lh{min-height:44px}.hv-lvl h3{font-size:24px}.hv-lvl p{font-size:13px;margin:8px 0}.hv-k{margin-top:20px}.hv-pane[aria-label=Sections]{max-width:720px;margin-inline:auto;padding-bottom:40px}.hv-pane[aria-label=Sections] .hv-row{flex-direction:column}.hv-pane[aria-label=Sections] .hv-rc{flex:auto;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:16px 0}.hv-pane[aria-label=Sections] .hv-rc b{font-size:16px}
@media(max-width:540px){.hv-hero{padding-left:16px!important}.hv-herot b{font-size:27px}.hv-tile b{font-size:16px}.hv-tile small{font-size:11px}.hv-lvl h3{font-size:22px}.hv-pane[aria-label=Sections]{max-width:none;margin:0}}
.hv-pane[aria-label=Sections]{max-width:none;margin:0}
@media(min-width:900px){.hv-pane[aria-label=Sections]{padding-inline:100px}}

/* Drawn animation tests: frame substitution, never limb interpolation. */
.drawn-intro{max-width:900px;margin:0 auto;padding:24px 20px 40px;color:#283b33}.drawn-intro header{text-align:center;margin-bottom:20px}.drawn-intro header span,.drawn-name{font:600 12px/1.5 system-ui;letter-spacing:.12em;text-transform:uppercase}.drawn-intro h1{font-size:clamp(26px,5vw,42px);margin:8px 0}.drawn-stage{width:100%;aspect-ratio:4/3;background-size:300% 200%;background-repeat:no-repeat;background-color:#eee5d3;border-radius:12px 12px 0 0}.drawn-caption{background:#faf7ed;padding:25px 30px;border-radius:0 0 12px 12px}.drawn-dialogue{font-size:clamp(17px,2.3vw,21px);line-height:1.65;min-height:4.8em;margin:12px 0 24px}.drawn-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.drawn-controls button{min-height:44px;padding:10px 16px;background:transparent;border:1px solid #bdc0ad;border-radius:8px;color:inherit;cursor:pointer}.drawn-controls .drawn-next{background:#31594c;color:#fff;border-color:#31594c;margin-left:auto}.drawn-count{font:13px system-ui;color:#6c7265}.drawn-controls button:focus-visible{outline:3px solid #b87a36;outline-offset:3px}@media(max-width:520px){.drawn-intro{padding:16px 10px}.drawn-caption{padding:20px 18px}.drawn-controls{gap:8px}.drawn-controls button{padding:10px 12px}.drawn-stage{border-radius:8px 8px 0 0}}

/* A little color and a single small vignette keep the studio easy to scan. */
.hv-pane[aria-label=Sections] .studio-accent{border-top-color:#d1c9b8;padding-top:18px;margin-top:8px}
.studio-accent .hv-lh{display:flex;align-items:center;gap:13px;color:var(--section-ink)}
.studio-accent .hv-lh h3{color:var(--section-ink);font-size:24px}
.studio-accent .hv-chev{margin-left:auto}
.studio-symbol{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid currentColor;border-radius:50% 44% 48% 43%;font:25px Georgia;background:#f6f0e3}
.studio-accent .hv-lbody>p{margin-left:51px;color:#6d7265}
.hv-tile.quiet-choice,.hv-tile.quiet-choice:only-child{grid-template-columns:52px 1fr auto;gap:15px;padding:10px 10px 10px 0;min-height:74px;border-bottom-color:#dfd9ca;border-radius:6px}
.hv-tile.quiet-choice .studio-thumb{display:block;width:52px;height:52px;border-radius:9px;mix-blend-mode:multiply}
.hv-tile.quiet-choice b{color:var(--section-ink);font:600 18px/1.3 var(--display)}
.hv-tile.quiet-choice small{color:#626c60;font-variant-numeric:tabular-nums}
.hv-tile.quiet-choice:hover{background:#f3eddd}
.hv-tile.quiet-choice:focus-visible,.studio-accent .hv-lh:focus-visible{outline:2px solid var(--section-ink);outline-offset:4px}
.hv-pane[aria-label=Sections] .hv-hero{border-left-color:#a36d46;background:linear-gradient(100deg,#efe4ce80,transparent 80%);border-radius:0 12px 12px 0}
.hv-pane[aria-label=Sections] .hv-herot b{color:#77533b}
@media(max-width:540px){.studio-accent .hv-lh h3{font-size:21px}.hv-tile.quiet-choice,.hv-tile.quiet-choice:only-child{grid-template-columns:44px 1fr auto;gap:11px}.hv-tile.quiet-choice .studio-thumb{width:44px;height:44px}.hv-tile.quiet-choice b{font-size:17px}.studio-accent .hv-lbody>p{margin-left:0}.studio-symbol{width:32px;height:32px;flex-basis:32px;font-size:22px}}
/* World openings: transparent drawn hosts standing in their painted places. */
.drawn-stage.world-opening{position:relative;overflow:hidden;background-image:none;background-size:cover;isolation:isolate}
.opening-landscape{width:100%;height:100%;display:block;object-fit:cover}
.opening-portrait{position:absolute;right:0;bottom:0;width:64%;aspect-ratio:var(--pose-ratio,1);background-size:300% 200%;background-repeat:no-repeat;background-color:transparent;border:0;outline:0;border-radius:0;box-shadow:none}
.art-notes{background:#f8f4e9;border:1px solid #d7d0bf;border-radius:8px;margin:18px 0;padding:0 20px;color:#30483f;font-size:14px;line-height:1.65}
.art-notes summary{min-height:48px;padding:13px 0;cursor:pointer;font-weight:600;list-style-position:inside}
.art-notes summary:focus-visible{outline:3px solid #b86a32;outline-offset:3px}
.art-notes[open]{padding-bottom:22px}.art-notes h3{font:600 16px/1.5 var(--body);margin:20px 0 6px}.art-notes p{margin:7px 0 15px}.art-notes a{color:#315f57;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}.art-setting{font-weight:600}.art-downloads{display:flex;gap:20px;flex-wrap:wrap;margin-top:20px}.hv-map>.art-notes{margin:0 24px 20px}.drawn-intro h1:focus{outline:none}
@media(max-width:520px){.opening-portrait{width:66%}.art-notes{padding-inline:16px}.hv-map>.art-notes{margin:0 16px 18px}.drawn-controls .drawn-next{flex:1}.drawn-controls button{font-size:13px}.drawn-count{margin-left:auto}}