#bg .paintedScene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;animation:sceneReveal .8s ease-out}#ch{aspect-ratio:2/3;height:95%;width:auto;bottom:0!important;left:50%;filter:drop-shadow(0 12px 20px #0007)}#ch .paintedActor{width:100%;height:100%;object-fit:contain;object-position:center bottom;pointer-events:none}#ch[data-character="cat"]{height:49%;bottom:16%!important;left:52%;width:38%}#stage.isCG #ch{display:none}#stage.isCG #bg .paintedScene{animation:cgReveal 1.2s ease-out}#stage.dream #ch{filter:drop-shadow(0 0 16px #fff3cb66)}#title{background:linear-gradient(90deg,#0d1022e8,#0d102276),url('assets/redraw/bg-flat-night.png') center/cover}#title h1{text-shadow:0 2px 10px #000,0 0 40px #b27a3477}.bulb{display:none}#title .menu{background:#0b0d18a8;padding:12px;border-radius:8px}#gallery{background:linear-gradient(#101525ef,#151b23fa),url('assets/redraw/bg-flat-day.png') center/cover}#gallery .cast{width:90%;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;overflow:auto;align-items:start;height:75%}#gallery .cast div{width:auto;font-size:13px;padding:10px;background:#fff6e209;border:1px solid #a68b5e33;border-radius:8px}#gallery .cast img{height:220px;width:100%;object-fit:contain;object-position:center top}#gallery .cast b{font-size:19px}#speakerPortrait{display:none}#box.hasPortrait{padding-left:105px}#box.hasPortrait #speakerPortrait{display:block;position:absolute;left:12px;top:20px;width:78px;height:100px;overflow:hidden;background:#d4b98716;border:1px solid #aa8b5e55;border-radius:5px}#speakerPortrait img{position:absolute;top:0;left:50%;transform:translateX(-50%);width:160px;height:240px;object-fit:cover;object-position:top}#box{border-color:#bd9b65bb;box-shadow:0 10px 35px #0007}#stage[data-scene="loop"] #bg{filter:saturate(.7)}#stage.isCG #box{background:#11141ded}#stage.isCG #bg{filter:none}#title .care{text-shadow:0 1px 5px #000;color:#d0c5b5}.hud button{backdrop-filter:blur(8px);background:#11131dd9}#lamp{background:#10132277;border-radius:30px;padding:4px 10px}#stage.isCG #lamp{opacity:.6}
@keyframes sceneReveal{from{opacity:.25}to{opacity:1}}@keyframes cgReveal{from{opacity:.3;transform:scale(1.018)}to{opacity:1;transform:scale(1)}}
@media(max-width:700px){#ch{height:70%;bottom:24%!important;left:50%;width:100%;aspect-ratio:auto}#ch[data-character="cat"]{height:40%;bottom:28%!important;width:86%;left:50%}#gallery .cast{grid-template-columns:repeat(2,1fr);gap:10px;height:76%}#gallery .cast img{height:200px}#gallery .cast div{font-size:12px;padding:8px}#gallery .cast b{font-size:18px}#box.hasPortrait{padding-left:72px}#box.hasPortrait #speakerPortrait{left:7px;top:25px;width:55px;height:72px}#speakerPortrait img{width:115px;height:173px}#stage.isCG #bg{background:#171b24}#stage.isCG #bg .paintedScene{object-fit:contain;object-position:center 18%;height:70%;width:100%;background:#171b24}#stage.isCG #box{min-height:29%;bottom:4%}#stage.isCG #text{max-height:28dvh}#bg .paintedScene{object-position:52% center}#title{background-position:63% center}#lamp{padding:3px 5px}#stage.dream #bg{filter:saturate(.8)}#title .menu{padding:10px}}
@media(prefers-reduced-motion:reduce){.paintedScene{animation:none!important}}
@media(max-width:700px){#stage.isCG #bg::before{content:'';position:absolute;inset:-15px;background:var(--scene-art) center/cover;filter:blur(20px) brightness(.35)}#stage.isCG #bg .paintedScene{background:transparent;object-position:center 20%}}
@media(max-width:700px){#stage.isCG #bg .paintedScene{width:150%;max-width:none;left:-25%;top:15%;height:auto;object-fit:contain;object-position:center}}
/* V3: three primary controls; dedicated name row never overlaps portrait. */
.hud{z-index:6;top:18px;right:20px;max-width:75%;flex-wrap:nowrap;gap:8px}.hud>button{font-size:15px;min-height:40px;padding:7px 14px}.hud #moreMenu{position:absolute;right:0;top:calc(100% + 8px);min-width:160px;padding:8px;display:grid;gap:5px;background:#151925f7;border:1px solid #af915e;border-radius:10px;box-shadow:0 10px 30px #0009;z-index:10}.hud #moreMenu[hidden]{display:none}.hud #moreMenu button{text-align:left;font-size:15px;padding:9px 12px;background:transparent;border:0;min-height:42px}.hud #moreMenu button:hover{background:#c1994b25}#name{position:static;top:auto;left:auto;width:fit-content;margin:0 0 10px;padding:3px 12px;font-size:18px;line-height:1.3;letter-spacing:.1em;z-index:auto}#box{padding-top:20px}#box.hasPortrait #speakerPortrait{top:20px;left:14px}#box.hasPortrait{padding-left:110px}#box.hasPortrait #name,#box.hasPortrait #text{position:relative;margin-left:0}#text{max-height:19vh}
@media(max-width:700px){.hud{top:12px;right:12px;max-width:76%;gap:6px}.hud>button{font-size:13px;min-height:38px;padding:5px 10px}#name{font-size:15px;margin-bottom:8px;padding:3px 9px}#box{padding-top:16px;min-height:27%}#box.hasPortrait{padding-left:78px}#box.hasPortrait #speakerPortrait{left:10px;top:16px;width:55px;height:72px}#text{max-height:23dvh}.hud #moreMenu{min-width:170px}}


/* V4: visible controls split above and below the dialogue. */
.hud{inset:0;max-width:none;pointer-events:none;z-index:6}
.topControls{position:absolute;top:18px;right:20px;display:flex;gap:8px;pointer-events:auto}
.topControls button,#storyTools button{font-size:15px;min-height:44px;padding:7px 14px}
#storyTools{position:absolute;left:4%;right:4%;bottom:4%;display:flex;justify-content:flex-end;gap:10px;pointer-events:auto}
#storyTools button{border-color:#a88a5a77;border-radius:7px;background:#11141ded}
#storyTools #bHome{margin-left:18px;color:#c3b7a4}
#box{bottom:calc(4% + 58px)}
#choices{padding-bottom:100px}
#stage:has(#diary[style*="flex"]) #hud{visibility:hidden}
@media(max-width:700px){
.topControls{top:12px;right:12px;gap:6px}
.topControls button{font-size:13px;padding:5px 11px}
#storyTools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;bottom:max(12px,env(safe-area-inset-bottom))}
#storyTools button{font-size:12px;padding:6px 2px;min-height:44px;white-space:nowrap}
#storyTools #bHome{margin-left:0}
#box{bottom:calc(max(12px,env(safe-area-inset-bottom)) + 56px);min-height:25%;max-height:42%}
#choices{padding-bottom:100px}
}
@media(max-width:350px){
#storyTools{grid-template-columns:repeat(2,minmax(0,1fr))}
#box{bottom:112px;min-height:24%}
#choices{padding-bottom:140px}
}
