*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#100f18;color:#eee5d9;font-family:FangSong,STFangsong,'Noto Serif SC',serif}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}button:hover{color:#f5d7a0}button:focus-visible{outline:1px solid #d5b776;outline-offset:4px}[hidden]{display:none!important}#scene{height:100%;position:relative;isolation:isolate;background:#211c29}.room{position:absolute;inset:0;overflow:hidden;background:repeating-linear-gradient(90deg,transparent 0 14%,#b09a6c12 14.1% 14.3%,transparent 14.4% 28%),radial-gradient(ellipse at 50% 30%,#574759,#25202d 70%)}.ceiling{position:absolute;inset:0 0 auto;height:12%;border-bottom:12px double #8b735a55;box-shadow:0 6px 20px #0007}.window{position:absolute;width:31%;height:69%;top:0;left:34.5%;border:13px solid #473c41;border-radius:48% 48% 0 0;box-shadow:0 0 0 3px #ad95765c,0 0 100px #9783b044;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;background:linear-gradient(#35354e,#94828f 65%,#bcb0ac);overflow:hidden}.window:after{content:'';position:absolute;inset:45% -10% 0;background:linear-gradient(25deg,#252638 25%,transparent 25%),linear-gradient(-20deg,#454052 35%,transparent 35%);filter:blur(2px)}.window i{border:4px solid #53444b99}.curtain{position:absolute;top:0;width:15%;height:77%;background:repeating-linear-gradient(95deg,#281e32,#574057 15%,#302338 30%);box-shadow:0 12px 28px #0006;border-bottom:4px solid #9f8052;border-radius:0 0 40% 10%}.curtain.left{left:22%;transform:rotate(4deg)}.curtain.right{right:22%;transform:rotate(-4deg)}.shelf{position:absolute;top:16%;bottom:20%;width:22%;border:12px ridge #594238;background:repeating-linear-gradient(to bottom,transparent 0 22%,#715441 22% 25%,transparent 25% 46%,#35271e 46% 48%),repeating-linear-gradient(90deg,#322e3c 0 9px,#826b52 9px 12px,#45343e 12px 25px,#292f37 25px 41px,#8f7956 41px 44px);box-shadow:inset 0 20px 30px #0009,0 5px 20px #0008}.sleft{left:0}.sright{right:0}.walltrim{position:absolute;top:76%;height:24%;width:100%;border-top:12px double #7a6249;background:repeating-linear-gradient(90deg,#30252b 0 12%,#624b3b 12.1% 12.4%,#2a2229 12.5% 24%)}.rug{position:absolute;bottom:-20%;left:15%;width:70%;height:40%;background:#382335;transform:perspective(300px) rotateX(50deg);border:10px double #8d7457}.light{position:absolute;inset:0;background:linear-gradient(90deg,#09091466,transparent 40% 60%,#09091466),linear-gradient(0deg,#0b091c99,transparent 50%)}header{position:absolute;z-index:5;top:0;left:0;right:0;padding:22px 32px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#100e19a6,transparent)}header div{display:flex;gap:20px;align-items:center}header small{letter-spacing:7px;color:#d4ba85;font-size:15px}header span{font-size:13px;color:#c8bfba;letter-spacing:3px}#menu{font-size:23px}.portrait{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);height:94%;width:70%;display:flex;justify-content:center;pointer-events:none}.portrait img{height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 10px 25px #08051488);transition:opacity .16s}.desk{position:absolute;bottom:-4%;height:23%;width:116%;left:-8%;background:linear-gradient(#81614a,#3d2c2a 9%,#49302b 15%,#241b23 90%);border-top:6px solid #a58661;transform:perspective(600px) rotateX(12deg);box-shadow:0 -10px 40px #100a1988}.paper{position:absolute;left:10%;top:8%;width:17%;height:38%;background:repeating-linear-gradient(0deg,#c4b69c 0 10px,#8a7c6922 11px 12px);transform:rotate(-8deg);box-shadow:3px 5px 5px #0007}.ink{position:absolute;left:28%;top:6%;height:30px;width:30px;background:#181420;border:3px solid #ac8855;border-radius:5px}.lamp{position:absolute;right:15%;top:-60px;width:11px;height:90px;background:#aa8b5a;box-shadow:0 0 45px #ffd17c55}.lamp:before{content:'';position:absolute;top:-12px;left:-40px;width:90px;height:45px;background:#c7a372;border-radius:60% 60% 5% 5%;box-shadow:0 20px 60px #ffcb8477}.dialogue{position:absolute;z-index:6;bottom:3.2%;left:9%;right:9%;min-height:180px;padding:30px 42px 15px;background:linear-gradient(110deg,#171321f5,#252031ee 70%,#171321f7);border:1px solid #b195666e;box-shadow:0 0 0 5px #15111b55,0 12px 35px #0008;cursor:pointer}.dialogue:before,.dialogue:after{content:'◇';position:absolute;top:-13px;color:#d5b878;font-size:23px}.dialogue:before{left:-10px}.dialogue:after{right:-10px}.name{position:absolute;top:-18px;left:26px;padding:8px 25px;background:#272031;border:1px solid #a78c5d;color:#ead1a3;letter-spacing:5px;font-size:19px}p#line{font-size:21px;line-height:1.8;letter-spacing:1.6px;min-height:63px;margin:5px 0 17px}footer{display:flex;align-items:center;gap:14px;color:#a99caa;font-size:12px}footer .tools{margin-left:auto;display:flex;gap:16px}.diamond{color:#bba072;animation:pulse 2s infinite}.choices{position:absolute;z-index:7;bottom:30%;left:50%;transform:translateX(-50%);width:min(530px,85%);display:grid;gap:11px}.choices button{padding:15px 24px;background:linear-gradient(90deg,#211a2cf0,#393044f5,#211a2cf0);border:1px solid #bba37888;box-shadow:0 4px 20px #0007;font-size:17px;letter-spacing:2px}.choices button:hover{background:#52415c}aside{position:absolute;z-index:12;top:75px;right:24px;width:270px;max-height:80vh;overflow:auto;padding:20px;background:#1e1828f5;border:1px solid #9d8259;box-shadow:0 15px 50px #000a}.panelHead{display:flex;justify-content:space-between;color:#d9bd8d;font-size:20px}.panelHead button{font-size:24px}aside>button{display:block;width:100%;padding:11px 0;border-bottom:1px solid #71604455;text-align:left}.sub,#notice{font-size:13px;color:#a99aa9}#gallery{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:15px}#gallery button{border:1px solid #786384;padding:9px;font-size:12px}dialog{color:#e3d9da;background:#201b2bf5;border:1px solid #9b835e;width:min(680px,90%);max-height:80vh;padding:25px}dialog::backdrop{background:#0009;backdrop-filter:blur(5px)}#historyText p{line-height:1.8;border-bottom:1px solid #64586b55;padding-bottom:14px}#historyText b{color:#d1b985;font-weight:normal}#restore{position:absolute;bottom:20px;right:30px;z-index:8;background:#211a2bdd;padding:12px}#loading{position:absolute;inset:0;z-index:20;background:#17121d;display:grid;place-items:center;letter-spacing:5px;color:#d2b78c;transition:opacity .5s}@keyframes pulse{50%{opacity:.3}}@media(max-width:700px){header{padding:15px}header span{font-size:10px;letter-spacing:1px}.portrait{height:88%;width:100%;bottom:8%}.dialogue{left:3%;right:3%;bottom:2%;padding:27px 20px 12px;min-height:160px}p#line{font-size:17px;line-height:1.7}.choices{bottom:31%}.shelf{width:25%}.window{width:50%;left:25%}footer #hint{font-size:10px}header small{letter-spacing:4px}}@media(max-height:550px){.dialogue{min-height:120px;padding:20px 30px 10px;bottom:3%}p#line{font-size:17px;min-height:35px;margin:5px 0}.portrait{height:105%;bottom:-5%}.choices{bottom:37%;gap:7px}.choices button{padding:9px}header{padding:12px 25px}}
/* Reference-led composition: left navigation, close character, bottom dialogue. */
body{display:grid;place-items:center;background:#090810}#scene{width:100vw;height:100vh;max-height:62.5vw;min-height:320px;border:5px solid #27212e;box-shadow:inset 0 0 0 1px #b69b6655;overflow:hidden}.room{background:#201a26 url('assets/office-bg.webp') center/cover no-repeat}.room>*{display:none}.room:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#09071077,transparent 32% 80%,#08061033),linear-gradient(0deg,#09071066,transparent 35%)}header{top:1.5%;left:1.2%;right:auto;align-items:center;padding:0;background:none;gap:12px;z-index:8;pointer-events:none}.clock{height:86px;width:86px;position:relative;border:1px solid #b89a6b;border-radius:50%;display:grid!important;place-items:center!important;box-shadow:0 0 0 5px #bda57818,0 0 0 9px #bda57844,inset 0 0 0 9px #bda57811;background:repeating-conic-gradient(#bca37388 0deg 1deg,transparent 1deg 30deg)}.clock:before,.clock:after{content:'';position:absolute;border:1px solid #c2a57388;inset:15px;transform:rotate(45deg)}.clock:after{inset:25px;border-radius:50%;transform:none}.clock span{font-size:46px!important;color:#d9bd8d!important;letter-spacing:0!important}.date{display:flex!important;flex-direction:column;align-items:flex-start!important;gap:4px!important}.date strong{font-weight:normal;letter-spacing:3px;font-size:20px;color:#e4d5c6}.date span{font-size:12px;letter-spacing:1px;color:#cdbca6}.sideNav{position:absolute;z-index:9;top:28%;left:2.8%;width:145px;display:grid;gap:7px}.sideNav button{height:37px;display:flex;align-items:center;gap:18px;text-align:left;padding:0 13px;background:linear-gradient(90deg,#1b1425ef,#1b1425c9);border-top:1px solid #a38a6144;border-bottom:1px solid #a38a6144;color:#c4b4ca;font-size:14px;letter-spacing:3px;transition:.2s}.sideNav i{font-style:normal;color:#a98dab;font-size:20px;min-width:20px}.sideNav .active{color:#3c2c3e;background:linear-gradient(90deg,#d2c3c5,#eadcdaee,#bdaebbc9);border:1px solid #c1a576;box-shadow:0 0 15px #ae87bd30;position:relative}.sideNav .active:before{content:'◇';position:absolute;left:-20px;color:#d1b386;font-size:44px}.sideNav .active i{color:#66506c}.sideNav button:hover{background:#57425bdb;color:#f5e1bd}.location{position:absolute;right:24px;top:22px;z-index:7;font-size:10px;letter-spacing:3px;color:#d3bd9d80}.location span{letter-spacing:2px}.portrait{height:145%;width:90%;left:56%;bottom:-43%;z-index:2}.portrait img{max-width:100%;filter:drop-shadow(0 8px 15px #09061166)}.desk{bottom:-2%;height:15%;z-index:3;opacity:.93;background:linear-gradient(#80654f,#33232be8 8%,#201724 45%,#16101b);border-top:3px solid #92704f;box-shadow:0 -7px 15px #110b1577}.desk .paper{left:14%;top:-10%;width:13%;height:23%;opacity:.7}.desk .lamp{display:none}.desk .ink{left:78%;top:-15%;height:32px;width:40px}.dialogue{left:17%;right:0;bottom:0;min-height:0;height:23%;padding:25px 4.2% 10px;background:linear-gradient(90deg,#181320ed,#201a2ad9 65%,#181320ee);border:0;border-top:1px solid #b5986955;box-shadow:none;z-index:6}.dialogue:before{content:'';top:0;left:0;bottom:0;width:1px;background:linear-gradient(#d6b883,transparent);font-size:0}.dialogue:after{content:'◇';top:-10px;right:18px;font-size:18px;color:#c5ab7c}.speakerBadge{position:absolute;top:-35px;left:0;width:240px;height:35px;background:linear-gradient(90deg,#25202de8,#302637da 80%,transparent);border-top:1px solid #aa8f6255;display:flex;align-items:center;padding-left:37px}.sigil{position:absolute;left:-18px;top:-9px;font-size:50px;line-height:1;color:#d6b985;text-shadow:0 0 10px #b3934c44}.name{position:static;background:none;border:0;padding:0;letter-spacing:5px;font-size:21px;color:#e7d9d1}p#line{font-size:clamp(16px,1.65vw,24px);min-height:0;line-height:1.75;letter-spacing:1px;margin:0 0 10px}footer{position:absolute;bottom:10px;left:5%;right:4%;font-size:11px}footer .tools{gap:18px}#hint{color:#b6a8b3}.choices{bottom:29%;left:59%;width:min(480px,61%)}.choices button{font-size:16px;padding:12px 18px;background:linear-gradient(90deg,#201727eb,#3c2e42e8,#201727eb);border-color:#bba17a77}aside{top:20%;left:19%;right:auto;z-index:15;background:#211929f5}#toast{position:absolute;z-index:22;left:50%;top:15%;transform:translateX(-50%);background:#21182bee;border:1px solid #a98d61;padding:12px 25px;color:#e5cfad;box-shadow:0 8px 30px #0007}#restore{bottom:20px;z-index:10}dialog{z-index:30}
@media(min-aspect-ratio:2/1){#scene{height:100vh;width:178vh;max-height:none}}
@media(max-width:700px){#scene{max-height:none;border-width:2px}.clock{width:55px;height:55px}.clock span{font-size:33px!important}.clock:before{inset:10px}.clock:after{inset:16px}.date strong{font-size:15px}.date span{font-size:10px}header{gap:10px;top:15px;left:18px}.location{display:none}.sideNav{top:22%;left:3%;width:94px;gap:6px}.sideNav button{height:34px;padding:0 8px;gap:8px;font-size:12px;letter-spacing:1px}.sideNav i{font-size:16px;min-width:16px}.sideNav .active:before{left:-13px;font-size:29px}.portrait{height:105%;bottom:-3%;left:62%;width:140%;max-width:none}.portrait img{max-width:none}.dialogue{left:0;right:0;height:25%;padding:25px 23px 15px}.speakerBadge{left:16px}p#line{font-size:17px;line-height:1.7}.choices{left:58%;width:75%;bottom:31%}.choices button{font-size:14px}.desk{height:21%}aside{left:auto;right:12px;top:16%;max-height:70vh}footer{left:23px;right:23px}.speakerBadge .name{font-size:19px}.sideNav .active{box-shadow:none}}
@media(max-height:550px) and (min-width:701px){.clock{height:65px;width:65px}.date strong{font-size:16px}.date span{font-size:10px}.sideNav{width:125px;gap:5px;top:29%}.sideNav button{height:29px;font-size:12px}.dialogue{height:23%;padding:14px 4% 10px}p#line{font-size:16px;line-height:1.6}.speakerBadge{height:29px;top:-29px}.name{font-size:18px}footer{font-size:10px;bottom:5px}.choices{bottom:32%}.choices button{padding:8px;font-size:14px}.portrait{height:145%;bottom:-43%}}

/* Fixed portrait geometry and direct, unblurred image rendering. */
.portrait{height:130%;bottom:-28%}.portrait img{width:auto;max-width:none;aspect-ratio:2/3;object-fit:contain;flex:none;transition:none;transform-origin:50% 50%;image-rendering:auto;backface-visibility:hidden}
@media(max-width:700px){.portrait{height:100%;bottom:2%}}
@media(max-height:550px) and (min-width:701px){.portrait{height:130%;bottom:-28%}}

/* Keep expanded dialogue menus within the scene, including short screens. */
.choices{max-height:53%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a38a61 #211929;padding:4px 7px;gap:8px}.choices button{flex-shrink:0}.choices button:focus-visible{outline-offset:-3px}
@media(max-width:700px){.choices{max-height:48%}}

/* Phone portrait: full viewport, clear reading area, thumb-sized controls. */
@media(max-width:700px) and (orientation:portrait){
 html,body{width:100%;height:100%;height:100dvh;overscroll-behavior:none}
 #scene{width:100%;height:100vh;height:100dvh;max-height:none;min-height:0;border:0;--nav-height:58px;--reading-height:clamp(182px,27dvh,280px)}
 header{top:calc(env(safe-area-inset-top,0px) + 14px);left:18px;gap:12px}.clock{width:44px;height:44px}.clock span{font-size:27px!important}.clock:before{inset:8px}.clock:after{inset:14px}.date strong{font-size:14px}.date span{font-size:10px}.date{gap:2px!important}
 .room{background-position:50% 40%}.portrait{left:50%;bottom:calc(var(--reading-height) + var(--nav-height) + env(safe-area-inset-bottom,0px) - 5dvh);height:72%;width:100%;max-width:none;overflow:visible}.portrait img{max-width:none}
 .desk{bottom:calc(var(--reading-height) + var(--nav-height) + env(safe-area-inset-bottom,0px) - 22px);height:8%;width:116%}
 .sideNav{left:0;right:0;top:auto;bottom:0;width:auto;height:calc(var(--nav-height) + env(safe-area-inset-bottom,0px));padding:4px 8px calc(4px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;background:#17111ff5;border-top:1px solid #a38a6155}
 .sideNav button{height:50px;min-width:0;padding:4px 1px;display:flex;flex-direction:column;justify-content:center;gap:2px;font-size:11px;letter-spacing:1px;border:0;background:transparent}.sideNav i{font-size:19px;line-height:22px;min-width:0}.sideNav .active{border:0;background:#806b8b40;color:#f2dfbe}.sideNav .active:before{display:none}
 .dialogue{left:0;right:0;bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px));height:var(--reading-height);padding:20px 20px 53px;background:linear-gradient(110deg,#181320fc,#252031fa);border-top:1px solid #b5986977}
 .speakerBadge{left:20px;top:-29px;height:29px;width:190px;padding-left:24px}.speakerBadge .name{font-size:18px;letter-spacing:3px}.sigil{font-size:38px;left:-12px;top:-6px}
 p#line{font-size:17px;line-height:1.8;letter-spacing:.5px;margin:0;height:100%;overflow-y:auto;overscroll-behavior:contain}
 footer{bottom:5px;left:14px;right:14px;gap:5px;min-height:42px}footer .tools{gap:0}footer button{min-height:44px;min-width:44px;padding:0 7px}#hint{font-size:10px;letter-spacing:0}.diamond{font-size:10px}
 .choices{left:50%;width:calc(100% - 32px);bottom:calc(var(--reading-height) + var(--nav-height) + env(safe-area-inset-bottom,0px) + 40px);max-height:32%;padding:5px 6px;gap:7px;background:#17111f55;border-radius:4px}
 .choices:empty{display:none}.choices button{min-height:46px;padding:11px 14px;font-size:15px;line-height:1.5;text-align:left;white-space:normal;touch-action:manipulation;background:linear-gradient(90deg,#201727fa,#3c2e42fa,#201727fa)}
 #panel{top:calc(env(safe-area-inset-top,0px) + 15px);left:14px;right:14px;width:auto;max-height:calc(100dvh - var(--nav-height) - env(safe-area-inset-bottom,0px) - env(safe-area-inset-top,0px) - 32px);overflow-y:auto}#panel>button,.panelHead button{min-height:44px}#gallery{max-height:35dvh;overflow-y:auto}
 dialog{width:calc(100% - 24px);max-width:none;max-height:80dvh;padding:18px}#historyText{max-height:62dvh;overflow:auto}#restore{bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px) + 16px);min-height:46px;padding:10px 20px;background:#211929ef;border:1px solid #a38a61}
 #toast{top:calc(env(safe-area-inset-top,0px) + 90px);width:max-content;max-width:calc(100% - 36px);text-align:center;font-size:14px}
}
@media(max-width:380px) and (orientation:portrait){p#line{font-size:16px}.choices button{font-size:14px}.date span{font-size:9px}}

/* A dedicated stage above a bottom conversation dock keeps choices off the art. */
#scene{display:flex;flex-direction:column;background:#15111e}
.visualStage{position:relative;flex:1;min-height:0;overflow:hidden;isolation:isolate}
.visualStage:after{content:'';position:absolute;inset:0;pointer-events:none;border:1px solid #c7ab7040;box-shadow:inset 0 0 85px #0d091a77;z-index:4}
.visualStage .room{inset:0}.visualStage .portrait{height:125%;bottom:-22%;left:57%;width:90%}.visualStage .desk{bottom:-10%;height:15%}
.conversationDock{position:relative;z-index:7;flex:none;display:flex;flex-direction:column;max-height:54%;padding:16px 5% 10px 19%;background:radial-gradient(ellipse at 70% 0,#49365066,transparent 70%),linear-gradient(110deg,#1a1425,#241b30 55%,#171220);border-top:1px solid #bca171;box-shadow:0 -4px 0 #15101e,0 -5px 0 #bca17133,0 -18px 50px #0b081444}
.conversationDock:before{content:'✦';position:absolute;top:-10px;left:50%;padding:0 18px;background:#221a2c;color:#d1b77f;font-size:15px;line-height:18px}
.conversationDock .dialogue{position:relative;inset:auto;height:auto;min-height:110px;flex:none;padding:23px 10px 38px;background:none;border:0;box-shadow:none;cursor:pointer}
.conversationDock .dialogue:before,.conversationDock .dialogue:after{display:none}
.conversationDock .speakerBadge{position:relative;top:auto;left:auto;width:auto;height:26px;padding:0 0 0 24px;margin:0 0 8px;background:none;border:0}.conversationDock .sigil{left:0;top:2px;font-size:23px;color:#c9ac76}.conversationDock .name{font-size:19px;letter-spacing:4px;color:#f1dec1}
.conversationDock p#line{height:auto;max-height:17vh;min-height:34px;overflow-y:auto;margin:0;font-size:18px;line-height:1.85;letter-spacing:.7px;color:#eee5e1}
.conversationDock footer{left:10px;right:10px;bottom:0;min-height:32px}.conversationDock footer button{min-height:32px;padding:0 10px;color:#c3b5c9}.conversationDock footer button:hover{color:#f1d7a1}
.conversationDock .choices{position:relative;inset:auto;transform:none;width:100%;max-height:24vh;min-height:0;flex:0 1 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;margin:8px 0 0;padding:4px 3px 3px;overflow-y:auto;background:none;counter-reset:answer}
.conversationDock .choices:empty{display:none}
.conversationDock .choices button{position:relative;counter-increment:answer;min-height:44px;padding:10px 16px 10px 44px;text-align:left;font-size:15px;line-height:1.5;letter-spacing:.4px;color:#e4d9df;border:1px solid #a18b6859;border-radius:2px;background:linear-gradient(100deg,#47354b66,#302339aa 65%,#37283f77);box-shadow:inset 0 1px #ffffff05;transition:background .16s,border-color .16s,color .16s}
.conversationDock .choices button:before{content:counter(answer,decimal-leading-zero);position:absolute;left:13px;top:50%;transform:translateY(-50%);font-family:Georgia,serif;font-size:12px;letter-spacing:1px;color:#c6ac7d}.conversationDock .choices button:hover,.conversationDock .choices button:focus-visible{background:linear-gradient(100deg,#67516a99,#46334eaa);border-color:#d7b87c;color:#fff2d7}
.sideNav{top:25%;z-index:9}.sideNav button{border-radius:2px}.sideNav .active{background:linear-gradient(90deg,#b8a3b9,#e2d1d4);color:#392b40}
#panel{box-shadow:0 18px 70px #080510aa;border:1px solid #bca17166;border-radius:3px}dialog{border:1px solid #bca17188;border-radius:4px;background:linear-gradient(130deg,#30233b,#191321);color:#ece1df}dialog::backdrop{background:#0b0814b8;backdrop-filter:blur(5px)}
@media(max-width:700px) and (orientation:portrait){
 #scene{padding-bottom:calc(58px + env(safe-area-inset-bottom,0px))}
 .visualStage{min-height:27dvh}.visualStage .portrait{height:114%;bottom:-13%;left:50%;width:100%}.visualStage .desk{bottom:-5%;height:9%}
 .visualStage header{top:calc(env(safe-area-inset-top,0px) + 14px);left:19px}.visualStage:after{box-shadow:inset 0 -28px 38px #100b1e55}
 .conversationDock{max-height:57%;padding:10px 16px 9px;min-height:0}
 .conversationDock .dialogue{padding:6px 3px 40px;min-height:112px;flex:0 1 auto;min-width:0;overflow-y:auto}
 .conversationDock .speakerBadge{padding-left:24px;margin-bottom:6px;height:26px}.conversationDock .name{font-size:18px;letter-spacing:3px}.conversationDock p#line{font-size:16px;line-height:1.8;max-height:16dvh;min-height:29px;letter-spacing:.4px}
 .conversationDock footer{position:relative;inset:auto;min-height:36px;margin:5px 0 -38px;gap:4px}.conversationDock footer .tools{gap:0}.conversationDock footer button{min-height:36px;min-width:44px;padding:0 6px;font-size:12px}#hint{font-size:10px}
 .conversationDock .choices{grid-template-columns:1fr;max-height:25dvh;gap:6px;margin-top:5px;padding:3px 2px}
 .conversationDock .choices button{min-height:45px;padding:10px 13px 10px 43px;font-size:14px;background:linear-gradient(100deg,#4d385466,#2b2036dd);border-color:#b09a7759}
 .sideNav{height:calc(58px + env(safe-area-inset-bottom,0px));top:auto;bottom:0}.sideNav button{font-size:10px}.sideNav .active{color:#f2ddbb;background:#77608044;border:1px solid #c6a87633}
 #restore{bottom:calc(74px + env(safe-area-inset-bottom,0px))}
}
@media(max-height:550px) and (min-width:701px){.conversationDock{padding:8px 3% 5px 19%;max-height:61%}.conversationDock .dialogue{padding:3px 4px 27px;min-height:82px}.conversationDock .speakerBadge{height:20px;margin-bottom:3px}.conversationDock .name{font-size:16px}.conversationDock p#line{font-size:15px;max-height:13vh}.conversationDock .choices{max-height:23vh;margin-top:3px}.conversationDock .choices button{min-height:36px;font-size:13px;padding-top:6px;padding-bottom:6px}.conversationDock footer{min-height:25px}.conversationDock footer button{min-height:25px}}

/* Approved seated portraits share a landscape canvas. */
.visualStage .portrait{height:100%;bottom:0;left:57%;width:90%}
.visualStage .portrait img{height:100%;width:auto;aspect-ratio:1316/1195;object-fit:contain}
#panel{max-height:80%;overflow-y:auto}#gallery{max-height:45vh;overflow-y:auto;overscroll-behavior:contain}#gallery button{min-height:44px}
@media(max-width:700px) and (orientation:portrait){.visualStage .portrait{height:100%;bottom:0;left:50%;width:100%}#gallery{max-height:35dvh}}

/* Reserve both reading and choice space; text and choices never resize the stage. */
#scene{overflow:hidden}
.visualStage{flex:1 1 0;min-height:0;contain:layout paint}
.conversationDock{height:54%;max-height:none;min-height:0;flex:0 0 54%;display:grid;grid-template-rows:minmax(0,1.9fr) minmax(0,1fr);gap:8px;overflow:visible}
.conversationDock .dialogue{height:100%;min-height:0;max-height:none;overflow:hidden;display:grid;grid-template-rows:22px minmax(0,1fr) 24px;gap:4px;padding:0 10px}
.conversationDock .speakerBadge{height:22px;margin:0}
.conversationDock p#line{height:100%;min-height:0;max-height:none;margin:0;overflow:auto;scrollbar-gutter:stable;overscroll-behavior:contain}
.conversationDock footer{position:static;inset:auto;min-height:24px;margin:0}
.conversationDock .choices,.conversationDock .choices:empty{display:grid;position:relative;inset:auto;height:100%;min-height:0;max-height:none;margin:0;overflow:auto;align-content:start;grid-auto-rows:minmax(44px,auto);scrollbar-gutter:stable}
.conversationDock .choices:empty{visibility:hidden;pointer-events:none}
@media(max-width:700px) and (orientation:portrait){
 html,body{height:100svh}
 #scene{height:100svh;min-height:0;max-height:none}
 .visualStage{min-height:0;flex:1 1 0}
 .conversationDock{height:53%;flex-basis:53%;max-height:none;min-height:0;padding:10px 16px 9px;grid-template-rows:minmax(0,1.8fr) minmax(0,1fr);gap:8px}
 .conversationDock .dialogue{height:100%;min-height:0;padding:0 3px;overflow:hidden;grid-template-rows:22px minmax(0,1fr) 26px;gap:4px}
 .conversationDock footer{position:static;inset:auto;margin:0;min-height:26px}
 .conversationDock p#line{height:100%;min-height:0;max-height:none}
 .conversationDock .choices{height:100%;max-height:none;margin:0;grid-auto-rows:minmax(45px,auto)}
}
@media(max-height:550px) and (min-width:701px){
 .conversationDock{height:54%;flex-basis:54%;max-height:none;padding:8px 3% 5px 19%;gap:5px}
 .conversationDock .dialogue{height:100%;min-height:0;padding:0 4px;grid-template-rows:18px minmax(0,1fr) 22px;gap:2px}
 .conversationDock .speakerBadge{height:20px;margin:0}.conversationDock p#line{max-height:none;min-height:0}.conversationDock footer{min-height:25px}
 .conversationDock .choices{height:100%;max-height:none;margin:0;grid-auto-rows:minmax(36px,auto)}
}

#quickTest{position:absolute;z-index:10;right:16px;top:calc(env(safe-area-inset-top,0px) + 52px);min-height:44px;padding:10px 14px;background:#292033ed;border:1px solid #c6aa78;color:#f0d9ac;border-radius:3px;font-size:13px;letter-spacing:1px}#quickTest:hover{background:#493651} @media(max-width:700px) and (orientation:portrait){#quickTest{top:calc(env(safe-area-inset-top,0px) + 17px);right:12px;font-size:12px;padding:9px 10px}}