.masthead{justify-content:flex-end!important}
@media(min-width:701px) and (max-width:1280px){body .toolbar-wrap{width:calc(100vw - 40px)}body .toolbar{flex-wrap:wrap;justify-content:center}body .status{bottom:139px;font-size:9px}body .portrait-controls{bottom:162px}}
@media(max-width:700px){body .toolbar-wrap{width:calc(100vw - 28px);max-width:none}body .toolbar{flex-wrap:wrap;justify-content:center}body .toolbar button{padding:8px 10px;min-height:36px}body .toolbar .separator{display:none}body .status{bottom:151px}}
@media(min-width:701px) and (max-width:1100px){body .status{left:24px;bottom:98px;font-size:9px}}
:root{font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:#222;background:#fff;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}button:focus-visible,canvas:focus-visible{outline:2px solid #222;outline-offset:5px}button:hover{color:#000}#room,#scene{width:100%;height:100dvh;display:block}#room{transition:filter .28s ease,transform .35s ease}#scene{touch-action:none}.reader-open #room{filter:grayscale(.38) brightness(.76) contrast(.9);transform:scale(1.008)}.masthead{position:absolute;inset:36px 42px auto;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.identity{pointer-events:none}.edition{font:9px/1.5 Arial,sans-serif;letter-spacing:3px;color:#848484}h1{font-family:LocalSong,"Songti SC",serif;font-weight:400;font-size:42px;letter-spacing:8px;margin:12px 0 10px}h1 span{letter-spacing:0}.identity p{font-size:11px;letter-spacing:3px;color:#888;margin:0}.archive-button{pointer-events:auto;display:flex;gap:10px;align-items:center;padding:11px 14px;border:1px solid #e4e4e4;background:#ffffffc9;backdrop-filter:blur(12px);font-size:11px;border-radius:3px}.small-number{font:10px monospace;color:#888;padding-left:9px;border-left:1px solid #ddd}.paper-icon{width:11px;height:14px;border:1px solid #444;transform:rotate(-8deg);box-shadow:3px -2px 0 -1px #fff,3px -2px 0 0 #aaa}.status{position:absolute;left:42px;bottom:35px;display:flex;gap:8px;align-items:center;font-size:10px;color:#777;letter-spacing:1px;pointer-events:none}.status-dot{width:4px;height:4px;border-radius:50%;background:#333;animation:breathe 2s infinite}.paused .status-dot{animation:none;background:#aaa}.status-divider{height:10px;border-left:1px solid #ccc;margin:0 3px}#count{font:11px monospace;color:#333}.toolbar-wrap{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);text-align:center}.gesture-hint{font-size:10px;letter-spacing:1px;color:#999;margin:0 0 15px}.toolbar{display:flex;align-items:center;gap:4px;white-space:nowrap;background:#fffffff0;border:1px solid #dedede;border-radius:5px;padding:6px 9px;box-shadow:0 4px 20px #00000004;backdrop-filter:blur(16px)}.toolbar button{padding:9px 12px;display:flex;gap:9px;align-items:center;font-size:11px;transition:background .15s;border-radius:3px}.toolbar button:hover{background:#f0f0f0}.separator{height:15px;border-left:1px solid #ddd;margin:0 3px}.view-icon{font-size:17px;line-height:13px}.door-icon{font-size:19px;line-height:13px}#play-icon{font-size:12px;width:10px}#speed{font:12px monospace;min-width:36px;justify-content:center}.loading{position:fixed;inset:0;background:#fff;z-index:5;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .6s}.loading p{font-size:12px;letter-spacing:2px;color:#888;margin-top:24px}.loading-mark{width:22px;height:29px;border:1px solid #333;transform:rotate(-8deg);animation:breathe 1.4s infinite}.loading.done{opacity:0;pointer-events:none}.library{position:absolute;right:30px;top:103px;width:310px;max-height:calc(100dvh - 190px);border:1px solid #ddd;background:#fffffff5;backdrop-filter:blur(20px);padding:17px;border-radius:4px;box-shadow:0 8px 40px #0000000b;overflow:auto}.library-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:12px;letter-spacing:2px}.library-heading button{font-size:22px;padding:0 4px}.thumbnails{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 9px}.thumbnail{padding:0;text-align:left}.thumbnail img{width:100%;height:95px;object-fit:cover;filter:grayscale(1);border:1px solid #e4e4e4;display:block;transition:transform .2s}.thumbnail:hover img{transform:translateY(-3px)}.thumbnail span{display:block;font:9px monospace;color:#999;margin-top:5px}
dialog{border:0;padding:0;background:transparent;max-width:100vw;max-height:100dvh;width:100vw;height:100dvh;color:#1d1d1d;overflow:hidden}
dialog::backdrop{background:rgba(239,240,239,.64);backdrop-filter:blur(.5px) saturate(.45)}
dialog[open]{display:flex;justify-content:center;align-items:center;animation:readerFade .22s ease-out}
.reader-card{position:relative;width:min(760px,calc(100vw - 150px));height:min(86dvh,880px);padding:16px 18px 13px;background:transparent;border:0;box-shadow:none;pointer-events:none;display:flex;flex-direction:column;animation:readerLift .28s cubic-bezier(.2,.75,.25,1)}
.reader-header{height:42px;padding:0 7px 10px;display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto}
.reader-close{font:300 27px/1 Arial,sans-serif;color:#333;padding:2px 7px;transition:transform .15s,background .15s}
.reader-close:hover{background:#222;color:#fff;transform:rotate(3deg)}
.reader-stage{min-height:0;flex:1;display:grid;grid-template-columns:62px minmax(0,1fr) 62px;align-items:center;gap:12px;padding:16px 0 8px}
.reader-stage figure{margin:0;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
#reader-image{display:block;max-width:100%;max-height:calc(86dvh - 155px);min-height:0;object-fit:contain;background:transparent;border:1px solid #222;box-shadow:0 12px 40px #0002;filter:contrast(1.04)}
figcaption{font-size:11px;letter-spacing:2px;color:#4e4e4e;padding:12px 0 0;text-align:center}
.reader-nav{position:relative;color:#4b4b4b;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:2px;transition:background .16s,color .16s,transform .16s}
.reader-nav span{font:300 38px/1 Arial,sans-serif}
.reader-nav small{font:8px/1 Consolas,monospace;letter-spacing:1.5px}
.reader-nav:hover{background:#222;color:#fff;transform:translateY(-2px)}
.reader-close,.reader-nav,#reader-image,#reader-caption{pointer-events:auto}
.reader-hint{margin:0;padding:8px 6px 1px;color:#666;text-align:center;font-size:9px;letter-spacing:1px;flex:0 0 auto}
@keyframes readerFade{from{opacity:0}}
@keyframes readerLift{from{opacity:0;transform:translateY(18px) scale(.985)}}
@keyframes breathe{50%{opacity:.3}}
[hidden]{display:none!important}
@media(max-width:700px){.masthead{inset:23px 22px auto}.edition{font-size:8px;letter-spacing:2px}h1{font-size:34px;margin:8px 0}.identity p{font-size:10px;letter-spacing:1px}.archive-button{padding:9px 11px}.status{left:50%;transform:translateX(-50%);bottom:113px;white-space:nowrap}.toolbar-wrap{bottom:20px;width:max-content;max-width:95vw}.toolbar{padding:5px;gap:0}.toolbar button{padding:10px 8px;font-size:10px;gap:6px}.gesture-hint{font-size:9px;margin-bottom:13px;letter-spacing:0}.count-label{display:none}.library{right:15px;width:280px;top:95px;max-height:calc(100dvh - 230px)}.reader-card{width:calc(100vw - 30px);height:min(88dvh,760px);padding:12px 11px 10px}.reader-header{height:38px}.reader-stage{grid-template-columns:34px minmax(0,1fr) 34px;gap:4px;padding-top:10px}.reader-nav{padding:11px 1px}.reader-nav span{font-size:31px}.reader-nav small{display:none}#reader-image{max-height:calc(88dvh - 140px)}.reader-hint{font-size:8px;letter-spacing:0}}@media(prefers-reduced-motion:reduce){.status-dot,.loading-mark{animation:none}.reader-card,dialog[open]{animation:none}#room{transition:none}}

.interact{position:absolute;left:0;top:0;display:flex;gap:8px;align-items:center;padding:6px 11px 6px 6px;background:#fffffff2;border:1px solid #dcdcdc;border-radius:4px;box-shadow:0 4px 16px #0000000d;font-size:11px;letter-spacing:1px;white-space:nowrap;pointer-events:none;backdrop-filter:blur(12px);margin-top:-8px}.interact[hidden]{display:none}.interact kbd{font:600 11px/1 Arial,sans-serif;min-width:20px;height:20px;display:grid;place-items:center;border:1px solid #333;border-bottom-width:2px;border-radius:3px;background:#fff;color:#222}.interact-back{left:50%;top:auto;bottom:122px;transform:translateX(-50%);margin:0}
.interact-more{font-size:9px;color:#888;letter-spacing:0;padding-left:8px;border-left:1px solid #ddd}.interact-more[hidden]{display:none}
.book-controls{position:absolute;bottom:126px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:7px 10px;font-size:10px;background:#ffffffe8;border:1px solid #ddd;border-radius:4px;white-space:nowrap}.book-controls span{color:#888}.book-controls button{font-size:11px;border-bottom:1px solid #777;padding:5px 6px}.book-controls button:disabled{opacity:.4;cursor:default}.toolbar button:disabled{opacity:.4;cursor:wait}@media(max-width:700px){.book-controls{bottom:196px;gap:7px}.book-controls span{display:none}}

.loading-corner{position:absolute;right:clamp(20px,3vw,48px);bottom:clamp(18px,3vh,40px);display:flex;align-items:flex-end;gap:14px;width:min(450px,88vw);height:220px;pointer-events:none}
.loading-walker{display:block;width:min(325px,64vw);height:215px}
.loading-copy{display:flex;align-items:center;gap:10px;padding-bottom:27px;white-space:nowrap}
.loading-copy .loading-mark{flex:0 0 auto;width:13px;height:18px;border-width:1px}
.loading-copy p{margin:0;font:10px/1 Arial,sans-serif;letter-spacing:3px}
@media(max-width:600px){.loading-corner{right:14px;bottom:14px;width:min(350px,92vw);height:164px;gap:8px}.loading-walker{width:min(245px,64vw);height:158px}.loading-copy{padding-bottom:20px}.loading-copy p{font-size:9px;letter-spacing:2px}}

/* Near-black street-light preset: the HUD recedes so the light pools guide the eye. */
#room[data-light-preset="street"]{color:#d8d8d8}
#room[data-light-preset="street"] .loading{background:radial-gradient(ellipse 32% 27% at 84% 85%,rgba(255,199,111,.2) 0%,rgba(150,81,25,.09) 42%,transparent 76%),#020304}
#room[data-light-preset="street"] .loading p,
#room[data-light-preset="street"] .gesture-hint,
#room[data-light-preset="street"] .status{color:#8d8d8d}
#room[data-light-preset="street"] .loading p{color:#d8b276;text-shadow:0 0 18px rgba(255,190,96,.24)}
#room[data-light-preset="street"] .loading-mark{border-color:#ffc76f;box-shadow:0 0 18px rgba(255,190,96,.32),3px -2px 0 -1px #2b190b,3px -2px 0 0 #9d6b32}
#room[data-light-preset="street"] .toolbar,
#room[data-light-preset="street"] .archive-button,
#room[data-light-preset="street"] .book-controls{color:#d8d8d8;background:#080808d9;border-color:#2b2b2b;box-shadow:0 7px 28px #000a}
#room[data-light-preset="street"] .toolbar button:hover{color:#fff;background:#ffffff12}
#room[data-light-preset="street"] .separator,
#room[data-light-preset="street"] .status-divider,
#room[data-light-preset="street"] .small-number{border-color:#3a3a3a}
#room[data-light-preset="street"] .status-dot{background:#d8d8d8}
#room[data-light-preset="street"] #count{color:#cfcfcf}
#room[data-light-preset="street"] .paper-icon{border-color:#ddd;box-shadow:3px -2px 0 -1px #080808,3px -2px 0 0 #777}
#room[data-light-preset="street"] .library{color:#d8d8d8;background:#080808f2;border-color:#2b2b2b;box-shadow:0 10px 44px #000c}

/* Manga-paper HUD shared with the opening menu. */
#room{--manga-paper:#e2ddd2;--manga-paper-dark:#bdb6aa;--manga-ink:#1a1a19;--manga-muted:#66625c}
#room[data-light-preset="street"] .toolbar,
#room[data-light-preset="street"] .archive-button,
#room[data-light-preset="street"] .book-controls,
#room[data-light-preset="street"] .interact,
#room[data-light-preset="street"] .library{color:var(--manga-ink);background-color:var(--manga-paper);background-image:radial-gradient(circle,#17171715 0 .7px,transparent .9px);background-size:6px 6px;border:2px solid var(--manga-ink);border-radius:0;box-shadow:5px 6px 0 #050505,7px 8px 0 var(--manga-paper-dark);backdrop-filter:none;clip-path:polygon(.5% 0,100% 2%,99.2% 100%,0 97%)}
#room[data-light-preset="street"] .toolbar{transform:rotate(-.18deg);padding:7px 10px}
#room[data-light-preset="street"] .toolbar button{color:var(--manga-ink);font-weight:700;text-shadow:1px 1px 0 #fff8}
#room[data-light-preset="street"] .toolbar button:hover{color:var(--manga-paper);background:var(--manga-ink);transform:rotate(.4deg)}
#room[data-light-preset="street"] .toolbar button:focus-visible,#room[data-light-preset="street"] .archive-button:focus-visible{outline:2px solid var(--manga-paper);outline-offset:4px}
#room[data-light-preset="street"] .separator,#room[data-light-preset="street"] .status-divider,#room[data-light-preset="street"] .small-number{border-color:var(--manga-ink)}
#room[data-light-preset="street"] .small-number,#room[data-light-preset="street"] #count{color:var(--manga-ink);font-weight:700}
#room[data-light-preset="street"] .paper-icon{border:2px solid var(--manga-ink);box-shadow:3px -2px 0 -1px var(--manga-paper),3px -2px 0 0 var(--manga-ink)}
#room[data-light-preset="street"] .status{padding:7px 11px;color:var(--manga-ink);background:var(--manga-paper);border:2px solid var(--manga-ink);box-shadow:4px 4px 0 #050505;clip-path:polygon(1% 0,100% 4%,98% 100%,0 95%);font-weight:700}
#room[data-light-preset="street"] .status-dot{background:var(--manga-ink)}
#room[data-light-preset="street"] .gesture-hint{display:inline-block;padding:5px 9px;color:var(--manga-ink);background:var(--manga-paper);border:1px solid var(--manga-ink);box-shadow:3px 3px 0 #050505;transform:rotate(.25deg);font-weight:700}
#room[data-light-preset="street"] .interact{font-weight:700;letter-spacing:1.4px}
#room[data-light-preset="street"] .interact kbd{border:2px solid var(--manga-ink);border-bottom-width:4px;background:var(--manga-paper);color:var(--manga-ink);box-shadow:none}
#room[data-light-preset="street"] .interact-more,#room[data-light-preset="street"] .book-controls span{color:var(--manga-muted);border-color:var(--manga-ink)}
#room[data-light-preset="street"] .book-controls button{border:2px solid var(--manga-ink);padding:6px 8px;background:var(--manga-paper);color:var(--manga-ink);font-weight:700;box-shadow:2px 2px 0 var(--manga-ink)}
#room[data-light-preset="street"] .book-controls button:hover{background:var(--manga-ink);color:var(--manga-paper)}
#room[data-light-preset="street"] .library{padding:18px;box-shadow:-5px 6px 0 #050505,-7px 8px 0 var(--manga-paper-dark)}
#room[data-light-preset="street"] .library-heading{padding-bottom:10px;border-bottom:2px solid var(--manga-ink);font-weight:700}
#room[data-light-preset="street"] .thumbnail img{filter:grayscale(1) contrast(1.12);border:2px solid var(--manga-ink);background:#b9b3a8;box-shadow:2px 2px 0 var(--manga-ink)}
#room[data-light-preset="street"] .thumbnail span{color:var(--manga-ink);font-weight:700}
#room[data-light-preset="street"] .thumbnail:hover img{transform:translateY(-3px) rotate(-.8deg)}
#room[data-light-preset="street"] dialog::backdrop{background:#050505d9;backdrop-filter:blur(2px) grayscale(1)}
#room[data-light-preset="street"] .reader-close,#room[data-light-preset="street"] .reader-nav{color:var(--manga-paper);text-shadow:2px 2px 0 #000}
#room[data-light-preset="street"] .reader-hint{display:inline-block;margin-inline:auto;padding:7px 12px;color:var(--manga-ink);background:var(--manga-paper);border:2px solid var(--manga-ink);box-shadow:3px 3px 0 #050505;font-weight:700}

/* The gallery is the canonical HUD: translucent black, white keylines, no paper cards. */
#room[data-light-preset="street"] .toolbar,
#room[data-light-preset="street"] .archive-button,
#room[data-light-preset="street"] .book-controls,
#room[data-light-preset="street"] .interact,
#room[data-light-preset="street"] .library{color:#e8e8e5;background:#070707c9;background-image:none;border:1px solid #ffffff70;border-radius:2px;box-shadow:0 12px 38px #000b;backdrop-filter:blur(10px) grayscale(.45);clip-path:none}
#room[data-light-preset="street"] .toolbar{transform:none}
#room[data-light-preset="street"] .toolbar button{color:#ddd;font-weight:500;text-shadow:0 1px 8px #000}
#room[data-light-preset="street"] .toolbar button:hover{color:#050505;background:#eee;transform:none}
#room[data-light-preset="street"] .separator,#room[data-light-preset="street"] .status-divider,#room[data-light-preset="street"] .small-number{border-color:#ffffff4d}
#room[data-light-preset="street"] .small-number,#room[data-light-preset="street"] #count{color:#fff;font-weight:500}
#room[data-light-preset="street"] .paper-icon{border:1px solid #eee;box-shadow:3px -2px 0 -1px #080808,3px -2px 0 0 #aaa}
#room[data-light-preset="street"] .status{color:#ddd;background:#070707b8;border:1px solid #ffffff55;box-shadow:0 8px 28px #000a;clip-path:none;font-weight:500;backdrop-filter:blur(8px)}
#room[data-light-preset="street"] .status-dot{background:#eee}
#room[data-light-preset="street"] .gesture-hint{color:#ddd;background:#070707a8;border:1px solid #ffffff50;box-shadow:0 6px 22px #000a;transform:none;font-weight:500;backdrop-filter:blur(7px)}
#room[data-light-preset="street"] .interact{font-weight:500}
#room[data-light-preset="street"] .interact kbd{border:1px solid #eee;border-bottom-width:2px;background:#111;color:#fff}
#room[data-light-preset="street"] .interact-more,#room[data-light-preset="street"] .book-controls span{color:#aaa;border-color:#ffffff40}
#room[data-light-preset="street"] .book-controls button{border:1px solid #ffffff80;background:#0a0a0a;color:#eee;font-weight:500;box-shadow:none}
#room[data-light-preset="street"] .book-controls button:hover{background:#eee;color:#050505}
#room[data-light-preset="street"] .library{box-shadow:0 14px 46px #000c}
#room[data-light-preset="street"] .library-heading{border-bottom:1px solid #ffffff55;font-weight:500}
#room[data-light-preset="street"] .thumbnail img{border:1px solid #ffffff55;background:#111;box-shadow:none}
#room[data-light-preset="street"] .thumbnail span{color:#bbb;font-weight:400}
#room[data-light-preset="street"] .thumbnail:hover img{transform:translateY(-3px)}
#room[data-light-preset="street"] .reader-hint{color:#eee;background:#070707cf;border:1px solid #ffffff70;box-shadow:0 8px 30px #000b;font-weight:500;backdrop-filter:blur(8px)}

/* The story route keeps discovery in the world, with no teleport/selection toolbar. */
#room[data-story-entry="spirits"] .toolbar,#room[data-story-entry="spirits"] .masthead,#room[data-story-entry="spirits"] .status{display:none}
.chapter-caption{position:absolute;top:6%;left:10%;right:10%;margin:0;text-align:center;font:14px/1.7 Georgia,serif;letter-spacing:1.3px;color:#eee;text-shadow:0 2px 9px #000;pointer-events:none;z-index:5}
.chapter-caption[hidden]{display:none}
