@font-face{font-family:Mincho;src:url('../fonts/mincho.woff2')}@font-face{font-family:MinchoB;src:url('../fonts/minchoB.woff2')}@font-face{font-family:MaShan;src:url('../fonts/mashan.woff2')}
:root{--paper:#e9e5d5;--paper2:#dbd8c7;--ink:#182c30;--ink2:#43575a;--red:#945246;--gold:#d1b37b;--text:#f2eddf;--border:#a0aaa0}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:#081619;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:manipulation}body,button,input,select{font-family:Mincho,'Noto Serif SC',serif}button{cursor:pointer}button:focus-visible,[tabindex]:focus-visible{outline:3px solid #d1b37b;outline-offset:4px}button:disabled{cursor:default;opacity:.4}p{line-height:1.65}h1,h2,h3,h4{font-weight:400}button,input{color:inherit}.hidden{display:none!important}
#viewport{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}#stage{position:absolute;left:50%;top:50%;width:1280px;height:720px;margin:-360px 0 0 -640px;overflow:hidden;transform-origin:50% 50%;background:#15292b;color:var(--ink)}#scene,#actors,#props,#spots,#fx{position:absolute;inset:0}#scene .scene-layer{position:absolute;inset:0}#scene svg,#scene img{display:block;width:100%;height:100%}#scene img{object-fit:cover}#scene::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 100px #06161988;pointer-events:none}.scene-grain{position:absolute;inset:0;opacity:.07;background:url('../assets/grain.svg');mix-blend-mode:screen}.scene-vignette{position:absolute;inset:0;background:linear-gradient(0deg,#081a1f55,transparent 35%,transparent 80%,#081a1f88)}.scene-bed img{filter:brightness(.65)}.scene-dream img{filter:blur(2px) sepia(.2) brightness(.5)}.scene-ice img{filter:saturate(.55) hue-rotate(8deg)}
#actors{pointer-events:none;z-index:10}.actor{position:absolute;bottom:12px;width:256px;height:512px;margin-left:-128px;transition:opacity .35s,filter .25s;transform-origin:50% 100%}.pup-wrap{width:100%;height:100%}.actor.flip .pup-wrap{transform:scaleX(-1)}.pup{width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block;filter:drop-shadow(0 10px 10px #03131588)}.actor.talking .pup{filter:drop-shadow(0 0 4px #c5d7cd33) drop-shadow(0 8px 12px #03131588)}.actor.dim{filter:brightness(.65) saturate(.6)}.actor.enter{opacity:0}.actor .pup{animation:breath 6s ease-in-out infinite}@keyframes breath{50%{transform:translateY(-2px)}}
#props{z-index:12;pointer-events:none}.prop-frame{position:absolute;display:flex;align-items:center;justify-content:center;background:#142c30db;border:1px solid #aaa88e77;box-shadow:3px 4px 0 #07161a88;overflow:hidden}.prop-frame svg{width:100%;height:100%}.prop-frame .prop-index{position:absolute;left:5px;top:3px;font-size:12px;color:#d1b37b}.prop-frame::after{content:'';position:absolute;inset:3px;border:1px solid #b3b5a311;pointer-events:none}
#spots{z-index:20;pointer-events:none}.spot{pointer-events:auto;position:absolute;appearance:none;border:0;background:transparent;padding:0;border-radius:1px}.spot .dot{position:absolute;left:50%;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border:1px solid #e8dfbb;border-radius:50%;background:#17383c;box-shadow:0 0 0 4px #0c212499,0 0 14px #d7bd7b44;animation:pulse 2.5s infinite}.spot .dot::after{content:'';position:absolute;inset:7px;border-radius:50%;background:#dfbc77}.spot.seen .dot{border-color:#9eaaa1;opacity:.65;animation:none}.spot.seen .dot::after{background:#9eaaa1}.spot .lbl{position:absolute;left:50%;top:50%;transform:translate(-50%,20px);white-space:nowrap;font-size:18px;line-height:1.25;padding:4px 9px;border-bottom:1px solid #c4b78d88;background:#10292eee;color:#f3eddf;pointer-events:none}.spot:hover{background:#d8e7d40e;outline:1px solid #d6ccab55}.spot:hover .dot{background:#945246}.spot:hover .lbl{color:#ffe6ac}@keyframes pulse{50%{box-shadow:0 0 0 7px #0c212466,0 0 20px #d7bd7b55}}
#nav{position:absolute;left:20px;right:300px;bottom:15px;z-index:25;display:flex;flex-wrap:wrap;gap:7px;align-content:flex-end}.nav-btn{font-size:18px;line-height:1.15;padding:10px 14px;background:#112a2eee;border:1px solid #9aa58d88;color:var(--text);min-height:43px}.nav-btn::before{content:'‹ ';color:#c9b784}.nav-btn.cur{background:#52645be8;border-color:#c6c4a5}.nav-btn .badge{display:inline-block;width:7px;height:7px;background:#cc9278;border-radius:50%;margin-left:6px}.nav-btn:hover{background:#52645b}
#hud{position:absolute;top:0;left:0;right:0;height:78px;z-index:40;display:flex;justify-content:space-between;padding:14px 20px;pointer-events:none;background:linear-gradient(#07181bb3,transparent)}#hud>div{display:flex;align-items:center;gap:12px;pointer-events:auto}#hud.off{display:none}.hud-btn{width:58px;height:48px;border:1px solid #b9b18d99;background:#10282de8;color:#efead9;font-size:19px;box-shadow:inset 0 0 0 3px #27434880}.hud-btn:hover{background:#52645b}#hud-time{color:#e0dfd0;font-size:18px;letter-spacing:1px;align-self:flex-start;background:#0c2429c9;border-bottom:1px solid #9a9e8055;padding:9px 17px;max-width:560px;text-align:center}#hud-time:empty{display:none}#ink{display:flex;gap:6px;padding:7px;background:#0b2427aa}#ink i{display:block;width:16px;height:21px;background:#d1b37b;clip-path:polygon(50% 0,80% 42%,100% 70%,82% 100%,18% 100%,0 70%,25% 45%)}#ink i.gone{background:#58696a;opacity:.65}#ink.hit{animation:shake .3s}.hud-btn.flash{animation:flash 1s 3}@keyframes flash{50%{background:#945246}}@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.ink-btn{position:absolute;right:24px;bottom:16px;z-index:30;background:#91634c;color:#f9efda;border:1px solid #d1b37b;padding:11px 22px;font-size:21px;min-height:48px;max-width:280px;box-shadow:inset 0 0 0 3px #553d3480}.ink-btn:hover{background:#a57859}
#dialog{position:absolute;left:0;right:0;bottom:0;height:194px;z-index:50;padding:40px 132px 28px;cursor:pointer;background:linear-gradient(180deg,#0a202500,#10282ef7 25px,#10282efc);color:var(--text);border-bottom:2px solid #a89c75}#dialog::before{content:'';position:absolute;left:110px;right:110px;top:28px;border-top:1px solid #a8b4a133}#dlg-name{position:absolute;left:130px;top:2px;min-width:128px;text-align:center;padding:5px 18px;font-size:25px;color:#f7edda;background:#6a5448;border:1px solid #b3a17d;border-radius:1px}#dlg-name:empty{display:none}#dlg-text{font-size:26px;line-height:1.6;letter-spacing:.7px;padding-top:6px;max-height:112px;overflow:visible;white-space:pre-line}#dialog.narr #dlg-text{color:#dcded0}#dialog.think #dlg-text{color:#bcd5d1}#dlg-text .em{color:#eccb8e}#dlg-text .clue{color:#daa991}#dlg-more{position:absolute;right:125px;bottom:14px;font-size:15px;color:#b7b99f;animation:bob 1.5s infinite}@keyframes bob{50%{transform:translateY(3px)}}
#choices{position:absolute;inset:0;z-index:95;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#071a21d1;padding:65px 40px;overflow:auto}.choices-title{color:#f0e9d5;font-size:26px;margin-bottom:8px;max-width:900px;text-align:center}.choice{flex-shrink:0;min-width:540px;max-width:990px;padding:12px 30px;font-size:23px;line-height:1.4;text-align:left;color:#e8e8d8;border:1px solid #9cae9f;background:#1c373de8;box-shadow:3px 3px #07191c80}.choice::before{content:'◇';color:#d2b77d;margin-right:15px}.choice:hover{background:#3a5556;border-color:#d1b37b}.choice.used{color:#a2b5af}
#toast{position:absolute;top:84px;left:50%;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}.toast{padding:9px 22px;font-size:19px;color:#f2ebdb;background:#0d2529f2;border-left:3px solid #b5a37c;animation:toastin .3s,fadeout .4s 2.8s forwards;max-width:1150px;line-height:1.5;white-space:normal}.toast b{color:#eccb8e;font-weight:400}.toast.ach{border-left-color:#d6bb7b}@keyframes toastin{from{opacity:0;transform:translateY(-8px)}}
#overlay{position:absolute;inset:0;z-index:98;background:#07181dd9}.panel{position:absolute;inset:32px 50px;background:var(--paper);display:flex;flex-direction:column;box-shadow:8px 10px #03131899;border:1px solid #bac5b5}.panel::before{content:'';position:absolute;inset:5px;border:1px solid #a7b3a2;pointer-events:none}.panel-head{display:flex;align-items:center;padding:14px 26px;border-bottom:1px solid #8a9c90}.panel-title{font-size:32px;flex:1;letter-spacing:3px}.panel-close{width:44px;height:44px;flex-shrink:0;font-size:25px;border:1px solid #879e94;background:#203c40;color:#e8e5d5}.panel-body{flex:1;display:flex;min-height:0}.tabs{width:116px;flex-shrink:0;padding:12px 0;border-right:1px solid #a7b3a2;display:flex;flex-direction:column;gap:4px}.tab{padding:11px 5px;font-size:21px;text-align:center;cursor:pointer;color:#43575a}.tab.on{background:#344f50;color:#f4e9cc}.tab .n{font-size:13px;opacity:.75}.grid{flex:1;min-width:0;padding:16px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(139px,1fr));gap:10px;align-content:start}.card{min-height:140px;padding:10px;background:#f5f3e7;border:1px solid #a5b3a3;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative}.card svg{width:74px;height:74px}.card .nm{font-size:18px;line-height:1.4;margin-top:4px}.card.sel{border:2px solid #7d5145;background:#f9f2df}.card.new::after{content:'新';position:absolute;top:4px;right:4px;font-size:12px;background:#945246;color:#fff;padding:1px 4px}.detail{width:365px;flex-shrink:0;padding:17px 24px;border-left:1px solid #a7b3a2;overflow-y:auto}.detail h3{font-size:29px;margin:0 0 5px}.detail .cat{color:#945246;font-size:16px;margin-bottom:10px}.detail p{font-size:20px;line-height:1.7;white-space:pre-line;margin:0 0 10px}.detail .big{display:flex;justify-content:center;margin-bottom:12px}.detail .big svg{width:115px;height:115px}.empty{color:#6c7f77;font-size:21px;padding:30px;grid-column:1/-1}.present-bar{padding:12px 26px;display:flex;align-items:center;gap:15px;border-top:1px solid #a7b3a2;flex-shrink:0}.present-bar .q{font-size:20px;flex:1}.btn{padding:11px 25px;min-height:44px;font-size:21px;color:#f4ebd5;background:#29474b;border:1px solid #a3b09c}.btn:hover{background:#45605d}.btn.red{background:#87594c}.btn+.btn{margin-left:8px}
.people{flex:1;padding:16px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;align-content:start}.person{display:flex;gap:16px;padding:12px;background:#f5f3e7;border:1px solid #a5b3a3}.person .ph{width:85px;height:138px;flex-shrink:0;overflow:hidden;background:#ced6c8}.person .ph .pup{height:244px;width:122px;margin:-3px 0 0 -19px;object-position:top}.person h4{font-size:25px;margin:3px 0}.person p{font-size:18px;line-height:1.6;margin:0}.timeline{flex:1;padding:18px 30px;overflow-y:auto}.tl-row{display:flex;gap:20px;padding:12px 0;border-bottom:1px dashed #a5b3a3;font-size:21px}.tl-row .t{min-width:105px;color:#87594c}
.testi,.deduce{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:1000px;max-height:650px;padding:25px 34px;background:var(--paper);border:1px solid #a5b3a3;box-shadow:6px 8px #03131899;display:flex;flex-direction:column}.testi h2,.deduce h2{margin:0 0 10px;font-size:29px;line-height:1.5;text-align:center}.testi .sub{color:#43575a;font-size:18px;text-align:center;margin-bottom:12px}.testi .lines{min-height:0;overflow-y:auto}.tline{padding:12px 18px;margin:7px 0;font-size:22px;line-height:1.5;background:#f5f3e7;border-left:4px solid #819b8e;cursor:pointer}.tline.sel{border-color:#945246;outline:1px solid #a18770;background:#f7edda}.tline.broken{text-decoration:line-through;color:#87938a}.tline .press{float:right;font-size:14px;color:#945246;padding-left:8px}.testi .ops{display:flex;justify-content:center;gap:12px;margin-top:15px;flex-shrink:0}.deduce .tag{font-size:20px;text-align:center;letter-spacing:5px;color:#87594c;margin-bottom:9px}.deduce .opts{display:flex;flex-direction:column;gap:11px;min-height:0;overflow:auto}.deduce .opt{padding:13px 20px;font-size:22px;line-height:1.45;background:#f5f3e7;border:1px solid #a5b3a3;cursor:pointer}.deduce .opt:hover{border-color:#87594c}.deduce .opt.wrong{opacity:.4;text-decoration:line-through;pointer-events:none}
.accuse{position:absolute;inset:60px 40px;display:flex;flex-direction:column;justify-content:center}.accuse h2{color:#eee8d6;font-size:34px;text-align:center;letter-spacing:4px;margin:0 0 16px}.scroll{height:425px;background:var(--paper);display:flex;align-items:flex-end;padding:0 30px;overflow-x:auto;overflow-y:hidden;border:1px solid #a5b3a3}.suspect{width:180px;height:400px;flex-shrink:0;position:relative;cursor:pointer}.suspect .pup{position:absolute;left:-10px;bottom:-6px;width:200px;height:400px;pointer-events:none}.suspect .tagname{position:absolute;top:22px;right:5px;width:38px;padding:10px 2px;writing-mode:vertical-rl;font-size:24px;text-align:center;border:1px solid #8a9c90;background:#efeddf;letter-spacing:4px}.suspect.sel .tagname{background:#87594c;color:#eee8d6}.suspect.sel{background:#c4cec0}.accuse .ops{text-align:center;margin-top:15px}
.ach-list{flex:1;padding:20px 26px;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-content:start}.ach{display:flex;align-items:center;gap:16px;padding:16px;background:#f5f3e7;border:1px solid #a5b3a3}.ach .stamp{width:65px;height:65px;flex-shrink:0;display:grid;place-items:center;font-size:31px;background:#87594c;color:#eee8d6;border:4px double #eee8d6}.ach.lock .stamp{background:#9ca998}.ach h4{font-size:24px;margin:0 0 5px}.ach p{font-size:18px;margin:0}.menu-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:470px;background:var(--paper);padding:26px 36px;display:flex;flex-direction:column;gap:10px;max-height:660px;overflow:auto;border:1px solid #a5b3a3}.menu-panel h2{margin:0;text-align:center;font-size:32px}.menu-panel p{font-size:17px;margin:0 0 5px}.menu-panel .btn{margin:0}
.chapter{position:absolute;inset:0;z-index:105;background:#dce2d5;display:flex;align-items:center;justify-content:center;cursor:pointer}.chapter-water{position:absolute;inset:0;background:linear-gradient(100deg,#cfdbd0,#eff0df 48%,#a5bbb1);opacity:.8}.chapter-water::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(170deg,transparent 0 65px,#38565b0c 67px,transparent 68px)}.chapter .cv{position:relative;display:flex;flex-direction:row-reverse;align-items:flex-start;gap:33px}.chapter .c1{writing-mode:vertical-rl;font-size:30px;color:#945246;letter-spacing:7px;padding:12px 5px;border-left:1px solid #9ea99b}.chapter .c2{writing-mode:vertical-rl;font-family:MaShan,MinchoB,serif;font-size:88px;letter-spacing:15px}.chapter .c3{writing-mode:vertical-rl;max-height:440px;font-size:23px;color:#43575a;letter-spacing:4px;padding-top:95px}.chapter-tip{position:absolute;bottom:35px;color:#657f77;font-size:17px}
#fx{pointer-events:none;z-index:102}.ink-wipe{position:absolute;inset:0;background:#0c2127;animation:wipe 1s forwards}.flash-red{position:absolute;inset:0;background:radial-gradient(transparent,#944c4555);animation:fadeout .6s forwards}.objection{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%) rotate(-5deg);font-family:MaShan,MinchoB,serif;font-size:132px;color:#b86450;text-shadow:2px 3px #e8dfc7;animation:stamp .9s forwards}@keyframes stamp{0%{opacity:0;scale:1.5}20%,75%{opacity:1;scale:1}100%{opacity:0}}@keyframes wipe{0%,100%{opacity:0}40%,60%{opacity:1}}@keyframes fadeout{to{opacity:0}}.fadeout{animation:fadeout .6s forwards}
#title-screen{position:absolute;inset:0;z-index:90;background:#0d2529}.title-art,.title-art>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.title-art img{object-fit:cover;width:100%;height:100%}.title-shade{position:absolute;inset:0;background:linear-gradient(90deg,#071d25ee,#10242f88 42%,transparent 75%),linear-gradient(0deg,#071d29ee,transparent 35%)}.title-copy{position:absolute;left:100px;top:88px;width:510px;color:#e8ead7}.eyebrow{font-size:17px;letter-spacing:6px;color:#b7bca3}.title-copy h1{font-family:MaShan,MinchoB,serif;font-size:82px;line-height:1.3;margin:25px 0 18px;letter-spacing:8px}.title-copy h1 span{padding-left:50px}.title-copy p{font-size:21px;letter-spacing:3px;color:#c1d0c4;line-height:1.9}.title-seal{position:absolute;right:25px;top:185px;writing-mode:vertical-rl;background:#97564c;color:#e9d7c1;font-size:24px;letter-spacing:8px;padding:12px 6px;border:3px double #d4a389}.menu{position:absolute;right:85px;bottom:94px;width:275px;display:flex;flex-direction:column;gap:12px}.menu button{background:#112b2fdc;color:#e9e6d4;border:1px solid #9aa68b99;font-size:25px;letter-spacing:3px;padding:12px 22px;text-align:left;box-shadow:4px 4px #04161988}.menu button:hover{background:#4b625c}.menu small{display:block;font-size:12px;letter-spacing:2px;color:#b3beb0;margin-top:6px}.credit{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#a9bbb2;font-size:14px;letter-spacing:2px}
.ending-card{position:absolute;inset:0;z-index:106;padding:65px 150px 45px;color:#e7e9da;background:linear-gradient(115deg,#10262ff5,#203d3ced),url('../assets/scenes/river.webp') center/cover;display:flex;flex-direction:column}.ending-mark{font-size:16px;letter-spacing:6px;color:#cdb386}.ending-card h2{font:76px MaShan,MinchoB,serif;letter-spacing:14px;margin:15px 0 8px}.ending-sub{font-size:22px;color:#b9cfc5;margin:0 0 20px}.ending-text{flex:1;min-height:0;overflow:auto;font-size:22px;line-height:1.9;max-width:900px}.ending-text p{margin:0 0 16px}.ending-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #b4b69b66;padding-top:18px;margin-top:20px;font-size:17px;color:#acbcb1}
#rotate-tip{display:none;position:fixed;inset:0;z-index:200;background:#0d2529;color:#e8ead7;align-items:center;justify-content:center;text-align:center;flex-direction:column;font-size:26px;line-height:2}#rotate-tip small{font-size:15px;color:#a9bbb2}@media (orientation:portrait) and (max-width:700px){body:not(.ignore-rotate) #rotate-tip{display:flex}}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-thumb{background:#738c7f}::-webkit-scrollbar-track{background:#17393a15}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.title-art .title-figure{position:absolute;inset:auto;width:380px;height:760px;bottom:-110px;opacity:.9;filter:drop-shadow(0 10px 20px #071b26)}.title-art .title-shen{left:575px;transform:scaleX(-1)}.title-art .title-lu{left:890px}.title-art .title-figure img{object-fit:contain}.scene-dream{position:absolute;inset:0}.scene-dream .scene-bg{width:100%;height:100%;object-fit:cover}.dream-lines{position:absolute;inset:0;background:linear-gradient(90deg,#0d1e2ee8,transparent 45%,#0d1e2ee8);box-shadow:inset 0 0 170px #07161a}
.menu{left:100px;right:auto;bottom:67px;width:520px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.menu button{font-size:22px;padding:12px 18px}.title-art .title-shen{left:620px}.title-art .title-lu{left:920px}.actor.talking{z-index:2}.forensic{flex:1;min-width:0;overflow:auto;padding:16px 22px}.forensic h3{font-size:23px;margin:0 0 5px}.forensic p{font-size:17px;margin:5px 0 10px;color:#526b64}.forensic svg{width:100%;height:auto;max-height:430px;display:block;background:#e2e5d5;border:1px solid #a2b2a0}.forensic details{margin-top:15px}.forensic summary{font-size:20px;cursor:pointer;padding:8px;border-bottom:1px solid #a2b2a0}.forensic text{font-family:Mincho,serif}

/* V3 art finish. No stage, hit-area, modal stack, or scrolling geometry changes. */
:root{--ui-brass:#b7a078;--ui-brass-soft:#b7a07866;--ui-edge:#6b7667;--ui-paper:#e9e2ce;--ui-shadow:#06171bc9}
.hud-btn,.nav-btn,.ink-btn,.btn,.menu button,.panel-close{background-image:linear-gradient(105deg,#e5c9950c,transparent 40%,#00000016),repeating-linear-gradient(0deg,#dec8a406 0 1px,transparent 1px 5px);border-color:var(--ui-brass-soft);box-shadow:inset 0 0 0 3px #071b1b66,inset 0 0 0 4px #bbab8529,0 3px 7px #0414165e;transition:background-color .18s,border-color .18s,box-shadow .18s,color .18s}
.hud-btn:not(:disabled):hover,.nav-btn:not(:disabled):hover,.btn:not(:disabled):hover,.menu button:not(:disabled):hover{background-color:#3c5752;border-color:#dbc498;box-shadow:inset 0 0 0 3px #071b1b66,inset 0 0 0 4px #bbab8555,0 3px 14px #04141688;color:#fff3d9}
.ink-btn,.btn.red{background-color:#795045;border-color:#bc9271;box-shadow:inset 0 0 0 3px #412b2888,inset 0 0 0 4px #d6ad7144,0 3px 8px #05141666}
.ink-btn:hover,.btn.red:not(:disabled):hover{background-color:#92624e;border-color:#e0bb82}
.hud-btn:not(:disabled):active,.nav-btn:not(:disabled):active,.ink-btn:not(:disabled):active,.btn:not(:disabled):active,.menu button:not(:disabled):active{box-shadow:inset 0 3px 10px #020e13b3,inset 0 0 0 3px #c9b58638;color:#f8dfb1}
button:focus-visible,[tabindex]:focus-visible{outline:3px solid #e9ca85;outline-offset:3px}
.panel button:focus-visible,.panel [tabindex]:focus-visible,.menu-panel button:focus-visible,.testi [tabindex]:focus-visible,.deduce [tabindex]:focus-visible{outline-color:#86513c}
.hud-btn{background-color:#12292bec;border-color:#ac9d7c8c;border-radius:2px}
#hud-time{color:#efe6ce;background:linear-gradient(90deg,#122a2bea,#263b35ed,#122a2bea);border-color:#b19b6c88;box-shadow:0 3px 10px #06171b99,inset 0 1px #ccb88a33;text-shadow:0 2px 2px #06191c}
#ink{border-radius:2px;background:linear-gradient(90deg,#071d23cc,#1731329c);box-shadow:inset 0 -1px #bfa26d33}
#ink i:not(.gone){background:linear-gradient(#fff1bd,#d6b274 48%,#a77a49);filter:drop-shadow(0 0 3px #dbbb7050);animation:wick-breathe 4s ease-in-out infinite}
#ink i:nth-child(2n){animation-delay:-1.6s}
.nav-btn.cur{background-color:#46574a;border-color:#dfc78e;color:#fff0d3;box-shadow:inset 0 -3px #c8a96e,inset 0 0 0 3px #263c3280,0 3px 7px #04141666}
.nav-btn .badge{background:#ce8d66;box-shadow:0 0 0 2px #d3b78d28}

/* Quiet title ornament and warm carved-wood controls. */
#title-screen::before{content:'';position:absolute;inset:17px;border:1px solid #c5b18b33;box-shadow:inset 0 0 0 4px #10232a44;pointer-events:none}
.title-copy::before{content:'';position:absolute;left:-26px;top:3px;bottom:0;width:1px;background:linear-gradient(#c4b58c99,#c4b58c33 70%,transparent);pointer-events:none}
.title-copy::after{content:'';position:absolute;right:26px;top:0;width:94px;height:94px;background:url('../assets/ui/feather-v3.webp') center/contain no-repeat;opacity:.44;filter:drop-shadow(0 3px 5px #06191c);transform:rotate(12deg);pointer-events:none}
.title-copy h1{color:#eee8ce;text-shadow:0 3px 2px #071c25,0 0 22px #c9c39918}
.eyebrow{color:#d4c8a7}
.title-seal{background:linear-gradient(145deg,#8d5948,#6a4039);border-color:#cca27d;box-shadow:3px 3px 0 #09212866,inset 0 0 0 2px #432f2e88}
.menu button{position:relative;background-color:#112a2ded;border-color:#b5a47b9c;box-shadow:inset 0 0 0 4px #12232888,inset 0 0 0 5px #a7976c33,4px 5px 12px #041619a8}
.menu button::after{content:'';position:absolute;right:14px;top:18px;width:6px;height:6px;border-right:1px solid #c7b17d;border-top:1px solid #c7b17d;transform:rotate(45deg);pointer-events:none}
.menu small{color:#bdc8b8}
.menu #t-new{background-color:#67473d;border-color:#c5a477}
.menu #t-new:hover{background-color:#815b46}
.menu #t-new::before{content:'';position:absolute;right:12px;bottom:9px;width:29px;height:29px;background:url('../assets/ui/lamp-v3.webp') center/contain no-repeat;opacity:.8;filter:drop-shadow(0 0 5px #daab5555);animation:wick-breathe 4s ease-in-out infinite;pointer-events:none}
.menu button:disabled{opacity:.42;filter:saturate(.5)}
.credit{color:#b9c7bb;text-shadow:0 1px #071a21}

/* Paper panels, sewn margins, corner mounts, and engraved selection marks. */
.panel,.testi,.deduce,.menu-panel,#stage .qh-card{background-color:var(--ui-paper);background-image:linear-gradient(110deg,#fff9e350,#a38a5220 50%,#fffbe940),repeating-linear-gradient(0deg,#806d4707 0 1px,transparent 1px 4px);border-color:#b9ac8e;box-shadow:0 14px 42px #02121799,inset 0 0 30px #aa8c4e16}
.panel::before{border-color:#947d5559;box-shadow:0 0 0 2px #f7edce33}
.panel-head{color:#f0e6cb;background:linear-gradient(115deg,#182f32,#2c423c 65%,#182f32);border-color:#b5a071;box-shadow:inset 0 4px #e1c79311,inset 0 -3px #071b2033}
.panel-title{position:relative;padding-left:47px;text-shadow:0 2px 1px #061e23}
.panel-title::before{content:'';position:absolute;left:0;top:50%;width:34px;height:34px;transform:translateY(-50%) rotate(-8deg);background:url('../assets/ui/feather-seal-v3.webp') center/contain no-repeat;opacity:.86;filter:drop-shadow(1px 2px 1px #03191c);pointer-events:none}
.panel-close{background-color:#193338;color:#ede3c9;border-color:#baa77e;box-shadow:inset 0 0 0 3px #061e2866,inset 0 0 0 4px #c0ad7c44}
.tabs{background:linear-gradient(90deg,#b9b69b3b,#d7d0b63b);border-color:#b6a888;box-shadow:inset -4px 0 8px #9b815314}
.tab{position:relative;color:#40554f;background:linear-gradient(0deg,#9d8b6208,transparent);box-shadow:inset 0 -1px #a997720f}
.tab:hover{background-color:#b7bba248}
.tab.on{color:#fcf0d3;background:linear-gradient(90deg,#233d3e,#3c5147);box-shadow:inset 4px 0 #bd9d66,inset -1px 0 #10292d,inset 0 1px #e1c89422,inset 0 -1px #0c232999}
.tab.on::after{content:'';position:absolute;right:7px;top:50%;width:5px;height:5px;background:#dfbc7e;transform:translateY(-50%) rotate(45deg);pointer-events:none}
.grid{background:linear-gradient(90deg,#f5eed422,transparent 40%,#a48f5d0c)}
.card,.person,.ach{background:linear-gradient(140deg,#fbf6e9,#ebe4ce);border-color:#b7ac8f;box-shadow:0 2px 3px #5a4c2c0c,inset 0 0 0 3px #fff9df66}
.card{transition:border-color .18s,background-color .18s,box-shadow .18s}
.card::before{content:'';position:absolute;inset:5px;background:linear-gradient(#a08b60,#a08b60) left top/13px 1px no-repeat,linear-gradient(#a08b60,#a08b60) left top/1px 13px no-repeat,linear-gradient(#a08b60,#a08b60) right bottom/13px 1px no-repeat,linear-gradient(#a08b60,#a08b60) right bottom/1px 13px no-repeat;opacity:.48;pointer-events:none}
.card svg{filter:drop-shadow(1px 3px 2px #6d5b3d24)}
.card .nm{color:#243a38}
.card:hover{border-color:#94754e;box-shadow:inset 0 0 0 3px #c8ae7430,0 3px 7px #6b553a28}
.card.sel{border-color:#8b5844;background:linear-gradient(140deg,#fff3d8,#e5d3ad);box-shadow:inset 0 0 0 3px #f4e7c5,inset 0 0 0 4px #ad7a494d,0 3px 7px #6b553a26}
.card.sel::before{opacity:.9;background-size:18px 1px,1px 18px,18px 1px,1px 18px}
.card.new::after{background:#865040;border:1px solid #f1d5ae66;box-shadow:1px 1px 1px #4d342228;font-size:12px;color:#fff2da}
.detail{background:linear-gradient(90deg,#c8b78f22,#faf0d936 8%,#efe4c944);border-color:#b6a888;box-shadow:inset 5px 0 12px #8069370a}
.detail .big{background:radial-gradient(ellipse at center,#c3b18b36,transparent 62%);filter:drop-shadow(0 5px 3px #88734b22)}
.detail h3{color:#213b3b;text-shadow:0 1px #fff6df}
.detail .cat{color:#87523e;letter-spacing:2px}
.detail p{color:#2b403b}
.present-bar{background:linear-gradient(180deg,#d3c4a528,#e8dec45e);border-color:#b3a180;box-shadow:inset 0 1px #fff6dc99}
.person .ph{background:radial-gradient(ellipse at bottom,#e3d3a5,#9aa994);border:1px solid #b4a681}
.tl-row{border-color:#b4a481}.tl-row .t{color:#87533f}
.ach .stamp{background:linear-gradient(145deg,#965b47,#633b34);box-shadow:0 2px 4px #5e493a33;border-color:#e4d7b8}
.ach.lock .stamp{background:#858d7b}.menu-panel{box-shadow:0 14px 42px #02121799,inset 0 4px #8e624d,inset 0 0 30px #aa8c4e16}
.menu-panel h2{position:relative}
.menu-panel h2::after{content:'';position:absolute;width:26px;height:26px;right:0;top:4px;background:url('../assets/ui/feather-seal-v3.webp') center/contain no-repeat;opacity:.7;pointer-events:none}

/* Dialogue, decisions, testimony, and physical puzzle surfaces. */
#dialog{background:linear-gradient(180deg,#0a202500,#0d2528f5 25px,#10282bfc);border-bottom-color:#9b8058;box-shadow:inset 0 -6px 20px #04171b33}
#dialog::before{border-color:#c1ae8059;box-shadow:0 2px #07191d77}
#dlg-name{background:linear-gradient(105deg,#725443,#513d34);border-color:#b8a075;box-shadow:inset 0 0 0 3px #302a2877,inset 0 0 0 4px #c7b07944,0 2px 7px #05171baa;text-shadow:0 1px #302821}
#dlg-text{text-shadow:0 1px 2px #061c20}
#dlg-more{color:#d2c39e}
#choices{background:radial-gradient(ellipse at center,#173137d9,#061a21ed)}
.choices-title{color:#f4e8c9;text-shadow:0 2px 2px #041b23}
.choice{position:relative;background:linear-gradient(105deg,#234144ee,#193135ef);border-color:#ac9c78;box-shadow:inset 0 0 0 3px #0a242773,inset 0 0 0 4px #c8b58326,4px 5px 12px #04191f88;transition:background .18s,box-shadow .18s,border-color .18s}
.choice::before{color:#d8bb7d;text-shadow:0 1px #0a262a}
.choice:hover{background:linear-gradient(105deg,#3c554e,#283e3d);border-color:#dac190;box-shadow:inset 0 0 0 3px #112c2a88,inset 0 0 0 4px #d9bb7e55,4px 5px 18px #04191faa}
.choice:active{box-shadow:inset 0 4px 12px #071b1caa,inset 0 0 0 3px #d0b37b4d}
.testi,.deduce{box-shadow:0 14px 42px #02121799,inset 0 4px #8b5b45,inset 0 0 30px #aa8c4e16}
.testi h2,.deduce h2{color:#253e3a;text-shadow:0 1px #fff3d6}
.tline,.deduce .opt{background:linear-gradient(95deg,#faf3df,#eee4cb);border-color:#a99775;box-shadow:inset 0 0 0 3px #fff7df55}
.tline.sel{background:linear-gradient(95deg,#f8e8c7,#e5d2ae);border-color:#8e5744;outline-color:#b88e5f}
.tline .press{color:#81503e}.deduce .opt:hover{background:#f5e5c4;border-color:#94613f}
#stage .qh-card{border-top-color:#8c5b45}
#stage .qh-card .pz-title{color:#253e3a;text-shadow:0 1px #fff4d9}
#stage .qh-paper,#stage .qh-duty{background:linear-gradient(130deg,#fff9e7b0,#e6dbbc55);border-color:#ad9c77;box-shadow:inset 0 0 0 4px #fff5d95c,0 2px 4px #7968410b}
#stage .qh-paper h3,#stage .qh-duty h3{color:#3b5148}
#stage .qh-slot{background:linear-gradient(0deg,#aa8a5122,transparent);border-color:#8d7954;color:#6d4335}
#stage .qh-char{transition:background-color .15s,box-shadow .15s}
#stage .qh-char:not(.punctuation):hover{background-color:#c2ad7c40}
#stage .qh-char.selected{background:#ab78462b;border-color:#99623f;box-shadow:inset 0 -3px #99623f,inset 0 0 0 2px #fff1cf}
#stage .qh-choice,#stage .qh-step-tab,#stage .qh-check,#stage .qh-roster button,#stage .qh-index{background:linear-gradient(120deg,#fff7e0a6,#d5c7a544);border-color:#a79b79;box-shadow:inset 0 0 0 3px #fff4d34d;transition:background-color .15s,border-color .15s,box-shadow .15s}
#stage .qh-choice.selected,#stage .qh-step-tab.selected,#stage .qh-roster button.selected,#stage .qh-index.selected{border-color:#8b5842;background:linear-gradient(120deg,#f2d9a95c,#c3aa783d);box-shadow:inset 0 0 0 2px #fff1cf88,inset 0 -3px #98684455}
#stage .qh-check:has(input:checked){background:#d7c39555;border-color:#936347;box-shadow:inset 3px 0 #9a6948}
#stage .qh-step-tab.solved,#stage .qh-observation .done{background-color:#7d927338;border-color:#6c8669}
#stage .qh-input,#stage .qh-field select,#stage .qh-field input,#stage .qh-night select{background:linear-gradient(#fff8e6,#eee2c6);border-color:#7b8b72;box-shadow:inset 0 2px 5px #65513414}
#stage .qh-puzzle button:focus-visible,#stage .qh-puzzle select:focus-visible,#stage .qh-puzzle input:focus-visible{outline:3px solid #955e32;outline-offset:3px}
#stage .qh-ops{border-color:#b4a17a;box-shadow:0 -1px #fff5d577}
#stage .qh-log{border-color:#859378;background:linear-gradient(90deg,#929d7311,transparent)}
#stage .qh-feedback{color:#8a4538}#stage .qh-feedback.good{color:#375a3d}

/* Decorative feedback stays below content and never captures a pointer. */
.prop-frame{background:radial-gradient(ellipse at center,#5870647a,#11282de0 75%);border-color:#b6aa817d;box-shadow:0 6px 12px #03181c6b,inset 0 0 0 3px #071d2766;border-radius:2px}
.prop-frame::after{border-color:#a7996e44;background:linear-gradient(#d4bd87,#d4bd87) left top/12px 1px no-repeat,linear-gradient(#d4bd87,#d4bd87) left top/1px 12px no-repeat,linear-gradient(#d4bd87,#d4bd87) right bottom/12px 1px no-repeat,linear-gradient(#d4bd87,#d4bd87) right bottom/1px 12px no-repeat}
.prop-frame .art-raster{filter:drop-shadow(1px 3px 3px #04181b6b)}
.prop-frame .prop-index{color:#dfc690;text-shadow:0 1px 2px #04171b}
.spot .dot{border-color:#e1c891;background:radial-gradient(circle,#536054,#102d31);box-shadow:0 0 0 3px #071d24b3,0 0 12px #bda36733;animation:investigate-pulse 3.6s ease-in-out infinite}
.spot .dot::before{content:'';position:absolute;inset:-5px;border:1px solid #c6b68a6b;border-radius:50%;pointer-events:none}
.spot .dot::after{background:#e6c586;box-shadow:0 0 3px #ffe3a26b;pointer-events:none}
.spot .lbl{background:linear-gradient(90deg,#0e282de8,#203730f2,#0e282de8);border-color:#bda47499;color:#f5ead1;text-shadow:0 2px 1px #081e20;box-shadow:0 3px 6px #04191c66}
.spot:hover{outline-color:#d2bd805e;background:#c2cfa40b}.spot:hover .dot{background:#755340;border-color:#ffe0a1}.spot:hover .lbl{color:#ffe7b6}
.spot.seen .dot{animation:none;background:#2f4846;border-color:#9bab9e;box-shadow:0 0 0 3px #071d2499}.spot.seen .dot::before{opacity:.3}.spot.seen .dot::after{background:#a4b5a3;box-shadow:none}
.toast{position:relative;color:#f6ead0;border-color:#c5a56d;background:linear-gradient(100deg,#213a38f7,#10292ef7);box-shadow:0 5px 16px #03161b99,inset 0 1px #dfc69044,inset 0 -1px #dfc69033}
.toast::after{content:'';position:absolute;inset:4px;border:1px solid #d8bf8e1f;pointer-events:none}
.hud-btn.flash{animation:clue-flash 1.4s ease-in-out 3}
.ending-card{box-shadow:inset 0 0 0 17px #09212822,inset 0 0 0 18px #bbaa8030}
.ending-mark{color:#d4ba85}.ending-card h2{text-shadow:0 3px #071d25,0 0 25px #dfd49a0d}
.ending-footer{border-color:#bba57666}
::-webkit-scrollbar-thumb{background:linear-gradient(#9b9c7e,#667d6e);border:1px solid #d5ccb066;border-radius:2px}
@keyframes wick-breathe{0%,100%{filter:drop-shadow(0 0 2px #d1af6b44)}50%{filter:drop-shadow(0 0 5px #d1af6b6b)}}
@keyframes investigate-pulse{0%,100%{box-shadow:0 0 0 3px #071d24b3,0 0 9px #c4a96b26}50%{box-shadow:0 0 0 5px #071d2477,0 0 15px #c4a96b4d}}
@keyframes clue-flash{0%,100%{border-color:#ac9d7c8c;box-shadow:inset 0 0 0 3px #071b1b66,inset 0 0 0 4px #bbab8529}50%{border-color:#ecc589;background-color:#68503d;box-shadow:inset 0 0 0 3px #392e2a66,0 0 13px #d4ae6244}}
@media(prefers-reduced-motion:reduce){#stage *,#stage *::before,#stage *::after{animation:none!important;transition:none!important}}

/* V4 landscape UI: keep the 1280 x 720 scene and its hit coordinates intact.
   At 740 x 360 the stage scale is 0.5: 32 px text and 80 px controls
   render at 16 px and 40 px. Only interface panels are rearranged. */
@media (orientation:landscape) and (max-width:960px) and (max-height:500px){
  #hud{height:104px;padding:12px 18px;align-items:flex-start}
  #hud>div{gap:12px}
  .hud-btn{width:92px;height:80px;font-size:30px}
  #ink{gap:4px;padding:6px}
  #ink i{width:12px;height:22px}
  #hud-time{font-size:26px;max-width:600px;padding:12px 16px;line-height:1.3;letter-spacing:0}
  #nav{left:18px;right:310px;bottom:12px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:10px;padding:4px 2px;scroll-padding-inline:8px}
  .nav-btn{min-height:80px;font-size:30px;padding:10px 20px;flex-shrink:0;white-space:nowrap}
  .nav-btn .badge{width:10px;height:10px}
  .ink-btn{right:18px;bottom:16px;min-height:80px;font-size:30px;max-width:280px;padding:12px 22px;line-height:1.3}
  .spot .lbl{font-size:26px;padding:5px 9px}
  .spot[data-k="ch3_lu_reaction"] .lbl{left:auto;right:0;transform:translateY(20px)}
  #dialog{height:240px;padding:48px 48px 40px}
  #dialog::before{left:46px;right:46px;top:36px}
  #dlg-name{left:46px;top:0;font-size:30px;padding:6px 22px}
  #dlg-text{font-size:32px;line-height:1.45;letter-spacing:0;padding-top:4px;max-height:145px}
  #dlg-more{font-size:24px;right:48px;bottom:10px}
  #choices{padding:24px 40px;gap:14px;justify-content:flex-start;scroll-padding-block:24px}
  #choices::before,#choices::after{content:'';flex:1 0 0;min-height:0}
  .choices-title{font-size:32px;line-height:1.4;max-width:1160px;margin:0 0 8px;flex-shrink:0}
  .choice{font-size:32px;line-height:1.4;min-height:80px;min-width:0;width:1120px;max-width:100%;padding:16px 26px}
  #toast{top:106px;width:1160px;max-height:480px;overflow:hidden}
  .toast{font-size:28px;line-height:1.4;max-width:100%;padding:12px 24px}
  .panel{inset:12px 14px}
  .panel-head{padding:8px 20px;min-height:88px;flex-shrink:0}
  .panel-title{font-size:34px}
  .panel-close{width:80px;height:72px;font-size:36px}
  .tabs{width:122px;padding:8px 0;gap:2px;overflow-y:auto;scroll-padding-block:8px}
  .tab{font-size:28px;min-height:78px;padding:10px 6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;column-gap:6px}
  .tab .n{font-size:22px}
  .grid{padding:12px;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));scroll-padding-block:12px}
  .card{min-height:164px;padding:12px 10px}
  .card svg{width:68px;height:68px;flex-shrink:0}
  .card .nm{font-size:28px;line-height:1.35}
  .card.new::after{font-size:20px}
  .detail{width:48%;padding:16px 22px;scroll-padding-block:16px}
  .detail h3{font-size:34px;line-height:1.3}
  .detail .cat{font-size:26px;margin-bottom:10px}
  .detail p{font-size:32px;line-height:1.5;overflow-wrap:anywhere}
  .detail .big{float:right;margin:0 0 10px 14px}
  .detail .big svg{width:94px;height:94px}
  .empty{font-size:30px;padding:22px}
  .present-bar{padding:8px 18px;gap:16px;max-height:172px}
  .present-bar .q{font-size:28px;line-height:1.4;max-height:140px;overflow-y:auto}
  .btn{font-size:30px;min-height:80px;padding:14px 24px;line-height:1.3;flex-shrink:0}
  .people{grid-template-columns:1fr;gap:14px;padding:14px}
  .person h4{font-size:32px}.person p{font-size:30px;line-height:1.5}
  .person .ph{width:95px;height:150px}
  .timeline{padding:14px 22px}
  .tl-row{font-size:30px;line-height:1.5;gap:18px}.tl-row .t{min-width:155px}
  .forensic{padding:16px 22px}.forensic h3{font-size:32px}.forensic p{font-size:28px;line-height:1.5}
  .forensic summary{font-size:30px;min-height:76px;padding:14px}
  .forensic svg{max-height:none;min-width:1600px}
  /* System font keeps this scroll cue independent of the story font subsets. */
  .forensic::before{content:"\2194\0020\5de6\53f3\6ed1\52a8\67e5\770b\73b0\573a";font:28px/1.3 system-ui,sans-serif;display:block;position:sticky;left:0;width:max-content;max-width:100%;margin:0 0 14px;padding:8px 14px;color:#40554f;background:#e9e2ce;border:1px solid #b7ac8f;pointer-events:none}
  .testi,.deduce{width:1230px;max-height:692px;padding:18px 24px}
  .testi h2,.deduce h2{font-size:34px;line-height:1.3;margin:0 0 10px;flex-shrink:0}
  .testi .sub{font-size:28px;line-height:1.4;margin-bottom:10px;flex-shrink:0}
  .tline{font-size:32px;line-height:1.4;min-height:80px;padding:14px 18px;margin:10px 0}
  .tline .press{font-size:24px}
  .testi .ops{margin-top:12px;gap:14px}
  .deduce .tag{font-size:28px;margin-bottom:10px;flex-shrink:0}
  .deduce .opts{gap:12px;scroll-padding-block:8px}
  .deduce .opt{font-size:32px;line-height:1.4;min-height:80px;padding:15px 22px;flex-shrink:0}
  .accuse{inset:16px 22px}
  .accuse h2{font-size:34px;line-height:1.3;margin-bottom:12px}
  .accuse .scroll{height:470px;padding:0 12px;flex:1;min-height:0}
  .suspect{width:220px;height:100%;min-height:330px}
  .suspect .pup{height:400px;width:200px;left:10px}
  .suspect .tagname{font-size:30px;width:54px;top:20px;right:6px}
  .accuse .ops{margin-top:12px;flex-shrink:0}
  .ach-list{grid-template-columns:1fr;padding:14px 20px}
  .ach h4{font-size:32px}.ach p{font-size:28px;line-height:1.5}
  .menu-panel{width:850px;max-height:692px;padding:22px 30px;gap:14px;scroll-padding-block:18px}
  .menu-panel h2{font-size:36px;flex-shrink:0}.menu-panel p{font-size:28px;line-height:1.4;flex-shrink:0}
  .menu-panel .btn{flex-shrink:0}
  .title-copy{left:70px;top:50px;width:550px}
  .eyebrow{font-size:26px;letter-spacing:3px}
  .title-copy h1{font-size:80px;margin:14px 0 8px}
  .title-copy p{font-size:30px;line-height:1.5;letter-spacing:1px;margin-top:8px}
  .title-seal{right:10px;top:150px}
  .menu{left:70px;bottom:58px;width:650px;gap:14px}
  .menu button{font-size:32px;line-height:1.2;min-height:110px;padding:14px 22px;letter-spacing:1px}
  .menu small{font-size:24px;line-height:1.2;letter-spacing:0;margin-top:6px}
  .credit{font-size:20px;bottom:15px;letter-spacing:1px}
  .chapter .c1{font-size:34px}.chapter .c3{font-size:30px;max-height:540px;padding-top:60px}.chapter-tip{font-size:28px;bottom:30px}
  .ending-card{padding:22px 50px 20px}
  .ending-mark{font-size:24px}.ending-card h2{font-size:64px;margin:6px 0}
  .ending-sub{font-size:30px;margin:0 0 10px}
  .ending-text{font-size:32px;line-height:1.5;max-width:none;scroll-padding-block:10px}
  .ending-footer{font-size:26px;line-height:1.3;gap:20px;padding-top:12px;margin-top:12px;flex-shrink:0}
  #stage .qh-card{width:1240px;max-height:696px;padding:14px 18px 12px;gap:8px}
  #stage .qh-card .pz-title{font-size:34px;line-height:1.25;flex-shrink:0}
  #stage .qh-card .pz-sub{font-size:28px;line-height:1.35;flex-shrink:0}
  #stage .qh-body{padding:8px 10px;scroll-padding:12px;font-size:30px}
  #stage .qh-feedback{min-height:32px;font-size:28px;line-height:1.25}
  #stage .qh-feedback:empty{display:none}
  #stage .qh-ops{padding-top:10px;gap:14px;flex-wrap:nowrap}
  #stage .qh-puzzle .btn{font-size:30px;min-height:80px;padding:12px 24px;line-height:1.3}
  #stage .qh-two{grid-template-columns:1fr;gap:16px}
  #stage .qh-paper{padding:14px 20px}
  #stage .qh-paper h3{font-size:32px;margin-bottom:12px}
  #stage .qh-paper p{font-size:32px;line-height:1.5}
  #stage .qh-small{font-size:28px;line-height:1.4}
  #stage .qh-ritual-line{justify-content:center;gap:5px;min-height:82px}
  #stage .qh-char{font-size:34px;min-width:76px;min-height:80px;line-height:1;padding:16px 12px}
  #stage .qh-char.punctuation{min-width:28px;padding:0}
  #stage .qh-picks{gap:14px;min-height:74px}
  #stage .qh-slot{font-size:34px;width:64px;height:64px;line-height:62px}
  #stage .qh-field{font-size:32px;line-height:1.4;gap:18px;margin:14px 0;flex-wrap:wrap}
  #stage .qh-field select,#stage .qh-field input,#stage .qh-input{font-size:32px;min-height:80px;max-width:100%;padding:12px 18px}
  #stage .qh-field select{min-width:500px;flex:1}
  #stage .qh-input{width:620px}
  #stage .qh-input-row{margin:20px 0}
  #stage .qh-night-list{gap:18px}
  #stage .qh-night{padding:14px}
  #stage .qh-night label{font-size:30px}
  #stage .qh-night select{font-size:32px;min-height:80px;padding:10px}
  #stage .qh-choice{font-size:32px;min-height:80px;line-height:1.3;padding:14px 24px}
  #stage .qh-log{font-size:32px;line-height:1.45}
  #stage .qh-observation div{font-size:30px;padding:14px}
  #stage .qh-observation small{font-size:26px}
  #stage .qh-step-tabs{flex-wrap:nowrap;overflow-x:auto;gap:12px;padding:4px;margin-bottom:12px;scroll-padding-inline:8px}
  #stage .qh-step-tab{font-size:28px;min-width:160px;min-height:80px;padding:12px;flex-shrink:0}
  #stage .qh-question{font-size:32px;line-height:1.4}
  #stage .qh-proof-title{font-size:28px}
  #stage .qh-proofs{gap:14px}
  #stage .qh-check{font-size:30px;line-height:1.4;min-height:80px;padding:14px;gap:14px}
  #stage .qh-check input{width:32px;height:32px}
  #stage .qh-roster button{font-size:32px;min-height:80px;padding:16px 22px}
  #stage .qh-duty{padding:20px;min-height:200px}
  #stage .qh-duty h3{font-size:32px}
  #stage .qh-index{font-size:32px;min-height:84px;padding:14px 24px}
  #stage .qh-stamp{font-size:26px}
  #stage .qh-solved{font-size:32px;line-height:1.5}
  #stage .grid,#stage .detail,#stage .tabs,#stage .forensic,#stage .qh-body,#stage .lines,#stage .opts,#stage .ending-text,#stage .menu-panel,#choices{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  ::-webkit-scrollbar{width:10px;height:10px}
}

/* Reduced layout height while a software keyboard occupies the screen.
   Keep text-input puzzles and their nested book readable at 220-280 px. */
@media (orientation:landscape) and (max-width:960px) and (max-height:280px){
  #stage .qh-puzzle:has(.qh-input) .qh-card{max-height:704px;padding:10px 18px;gap:8px}
  #stage .qh-puzzle:has(.qh-input) .pz-title{font-size:52px;line-height:1.15;letter-spacing:1px}
  #stage .qh-puzzle:has(.qh-input) .pz-sub{font-size:44px;line-height:1.25}
  #stage .qh-puzzle:has(.qh-input) .qh-body{padding:4px 8px;scroll-padding:8px}
  #stage .qh-puzzle:has(.qh-input) .qh-input{font-size:52px;min-height:132px;width:900px;max-width:100%;padding:12px 18px}
  #stage .qh-puzzle:has(.qh-input) .qh-input-row{margin:8px 0}
  #stage .qh-puzzle:has(.qh-input) .qh-ops{gap:16px;padding-top:8px}
  #stage .qh-puzzle:has(.qh-input) .qh-ops .btn{font-size:48px;min-height:132px;padding:12px 24px;line-height:1.2}
  #stage .qh-puzzle:has(.qh-input) .qh-feedback{font-size:44px;line-height:1.2}
  #stage .qh-puzzle:has(.qh-input) .qh-field{font-size:48px;margin:10px 0}
  #stage .qh-puzzle:has(.qh-input) .qh-night label{font-size:46px;margin-bottom:10px}
  #stage .qh-puzzle:has(.qh-input) .qh-night select{font-size:52px;min-height:132px}
  .panel{inset:8px 12px}
  .panel-head{min-height:136px;padding:6px 18px}
  .panel-title{font-size:52px;letter-spacing:1px}
  .panel-close{width:132px;height:120px;font-size:54px}
  .tabs{width:150px;padding:6px 0}
  .tab{font-size:44px;min-height:120px;padding:10px 6px;gap:4px}
  .tab .n{font-size:32px}
  .grid{grid-template-columns:1fr;gap:12px;padding:10px}
  .card{min-height:132px;padding:12px}
  .card svg{display:none}
  .card .nm{font-size:46px;line-height:1.25;margin:0}
  .card.new::after{font-size:26px}
  .detail{width:54%;padding:12px 18px}
  .detail h3{font-size:52px}.detail .cat{font-size:42px}
  .detail p{font-size:52px;line-height:1.4}
  .detail .big{display:none}
  .present-bar .q{font-size:44px}
  .present-bar .btn{font-size:48px;min-height:132px}
}