/* One consistent order: map, navigation, scene, work, ending, notice, transition. */
:root{--layer-map:0;--layer-label:1;--layer-hud:2;--layer-dock:4;--layer-scene:6;--layer-dialogue:8;--layer-work:14;--layer-ending:30;--layer-toast:40;--layer-transition:50}
.app{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.panel-dialog{max-width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 16px)}
.map-input,.world-grain{z-index:var(--layer-map)}.location-layer{z-index:var(--layer-label)}.game-hud,.life-toolbar,.destination-ping{z-index:var(--layer-hud)}.game-dock{z-index:var(--layer-dock)}.interior-stage{z-index:var(--layer-scene)}.conversation,.notice-scene{z-index:var(--layer-dialogue)}.work-scene{z-index:var(--layer-work)}.ending-scene{z-index:var(--layer-ending)}.toast{z-index:var(--layer-toast)}.day-transition,.routine-progress{z-index:var(--layer-transition)}
[inert]{pointer-events:none}.life-toolbar{top:var(--toolbar-top,66px)}.game-hud>*{min-width:0}.state-card{overflow-wrap:anywhere}.topbar{flex-shrink:0}.topbar nav{flex-shrink:0}.canvas-wrap,.interior-art,.work-art,.ending-art{user-select:none;-webkit-user-select:none}.map-label:not(:disabled):active{transform:translate(calc(-50% + 1px),calc(-100% + 1px))}.map-label{max-width:calc(100% - 24px);text-overflow:ellipsis;overflow:hidden}
.conversation{overscroll-behavior:contain}.conversation-main{min-width:0}.conversation-heading h2{overflow-wrap:anywhere}.conversation-heading #lineCounter{flex-shrink:0}.conversation .choices{align-items:stretch}.choice-button{min-width:0}.choice-button>span:nth-child(2){min-width:0;overflow-wrap:anywhere}.choice-arrow{margin-left:auto}.scene-heading{pointer-events:none}.scene-heading>span,.scene-heading>small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Paper labels scale in the same coordinate system as the wooden board. */
#boardPapers{font-size:calc(16px * var(--board-scale,1))}
#boardPapers .notice-paper{font-size:inherit;overflow:hidden}
#boardPapers .paper-no{font-size:.5625em;letter-spacing:.06em}
#boardPapers .paper-seal{font-size:1.875em;padding:.125em .28em;border-width:max(1px,calc(2px * var(--board-scale,1)))}
#boardPapers .paper-prompt{font-size:.5625em;white-space:normal;line-height:1.5;padding:0 .3em}
#boardPapers .paper-content{gap:.125em}
#boardPapers .paper-content strong{font-size:1.1875em;letter-spacing:.03em;max-width:100%}
#boardPapers .paper-content small{font-size:.5625em;line-height:1.4}
#boardPapers .paper-content em{font-size:.5em;line-height:1.4}
#boardPapers .paper-rule{margin:.18em 0}
.board-reading{min-width:0}.board-reading>p{overflow-wrap:anywhere}.board-reading>div{flex-wrap:wrap}.board-reading button{min-width:0}.notice-paper:not(:disabled):active{transform:rotate(0) translateY(1px)}
.dialog-inner{min-width:0}.dialog-inner>h2,.dialog-inner>.eyebrow{overflow-wrap:anywhere}.panel-pages{flex-shrink:0}.panel-page>*{flex-shrink:0;min-width:0}.panel-page.oversized-page{overscroll-behavior:contain}.panel-body .ending-actions{align-items:stretch}.routine-slots select{min-width:0;max-width:100%}.journal-entry{overflow-wrap:anywhere}.panel-dialog::backdrop{backdrop-filter:blur(2px)}
.work-head h2{overflow-wrap:anywhere}.work-head button,.work-head>span{flex-shrink:0}.work-foot>p{overflow-wrap:anywhere}.work-controls{min-width:0}.work-controls small{min-width:0}.medicine-guide span{min-width:0}.work-art canvas:focus-visible{outline-offset:-3px}
.ending-scene{background:#14231e}.ending-head>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ending-head>span:last-child{flex-shrink:0}.ending-nav{min-width:0}.ending-nav>div{min-width:0}.ending-nav button{white-space:nowrap}.ending-copy{min-height:0}.ending-records{min-height:30px}.ending-detail{white-space:pre-line}
/* On low landscape windows, the dialogue occupies a side column, preserving the art. */
@media(max-height:620px) and (min-width:621px){
 .world-shell{--dialogue-width:clamp(285px,43vw,470px)}
 .in-conversation .conversation{left:auto;right:12px;top:50%;bottom:auto;transform:translateY(-50%);width:var(--dialogue-width);max-height:calc(100% - 24px);padding:12px}
 .in-conversation .conversation-enter{animation:scene-in .22s ease-out}
 .in-conversation .interior-art{top:45px;right:calc(var(--dialogue-width) + 34px);bottom:14px;left:12px}
 .in-conversation .scene-heading{left:12px;right:calc(var(--dialogue-width) + 34px);top:12px;flex-direction:column;align-items:center;gap:2px}
 .in-conversation .scene-heading>span{font-size:10px}.in-conversation .scene-heading>small{font-size:9px}
 .conversation-main{gap:8px;align-items:flex-start}.conversation-main>canvas{width:32px;height:32px;margin-top:5px}
 .conversation-heading{flex-wrap:wrap;padding-right:42px;gap:3px}.conversation-heading>span:first-child{display:none}.conversation-heading h2{font-size:11px;flex-basis:100%}.conversation-heading #lineCounter,.event-meta{font-size:8px}
 .conversation>.scene-back{font-size:8px;right:6px;top:6px;padding:3px}.spoken-area #spokenText{font-size:11px;line-height:1.75;margin:6px 0 19px}
 .conversation .choices,.conversation .choices:has(> :nth-child(2):last-child){grid-template-columns:1fr;gap:5px}.conversation .choices:has(> :nth-child(4)){grid-template-columns:1fr 1fr}
 .conversation .choice-button{padding:5px 7px;gap:6px}.choice-label{font-size:10px}.choice-hint,.choice-note{font-size:8px;line-height:1.5}.choice-note{margin-top:6px}.choice-arrow{font-size:10px}
 .work-scene{grid-template-columns:minmax(0,1fr) 245px;grid-template-rows:55px minmax(0,1fr)}.work-head{grid-column:1/-1;padding:4px 12px;gap:12px}.work-head h2{font-size:15px}.work-head .eyebrow{font-size:9px}.work-art{grid-column:1;grid-row:2}.work-foot{grid-column:2;grid-row:2;padding:8px 10px;gap:6px;align-content:center;border-top:0;border-left:2px solid #818e5955}.work-foot>p{font-size:11px;line-height:1.6}.work-foot #workDetail{font-size:9px;line-height:1.5;min-height:0}.medicine-guide{grid-template-columns:1fr;font-size:9px;gap:3px}.medicine-guide span{padding:2px 4px}.medicine-guide b{display:inline;margin-left:5px}.medicine-guide small{font-size:8px}.work-controls{flex-wrap:wrap;justify-content:center;gap:5px}.work-controls button{font-size:10px;min-height:30px;padding:5px 12px}
 .board-intro .eyebrow{display:none}.board-intro h2{font-size:18px}.board-intro p{font-size:9px}.notice-scene{gap:5px}
}
@media(max-width:620px){
 .topbar nav{gap:6px}.topbar .icon-button,.topbar .text-button{width:30px;height:32px;justify-content:center;padding:5px}.sound-slash{left:4px;top:16px}.notification{top:5px;right:1px}
 .game-hud{gap:6px}.date-card{flex-shrink:0}.state-card{flex:0 1 auto}.life-toolbar{top:var(--toolbar-top,70px)}
 .ending-scene .ending-nav{gap:6px}.ending-nav>div{gap:4px}.ending-scene .ending-nav button{font-size:9px;padding:6px 7px;min-height:33px}
 .ending-copy h2{font-size:21px;line-height:1.4}.ending-caption{line-height:1.8}.ending-final-actions{gap:5px}
 .panel-pages{gap:8px}.dialog-inner>.eyebrow{font-size:9px}.panel-dialog{margin:auto}
}
@media(max-width:380px){.brand{font-size:12px;gap:5px}.brand-mark{font-size:9px}.topbar{gap:5px}.topbar nav{gap:3px}.date-card{padding:5px 6px;gap:6px}.date-card .eyebrow{max-width:73px}.state-card{padding:6px}.state-card #standing{font-size:8px}.action-row{gap:5px}.action-row>span+span{font-size:9px}.ending-nav{flex-wrap:wrap}.ending-nav>div{flex:1;justify-content:space-between}.ending-scene .ending-nav button{flex:1}.ending-head{font-size:8px}}
@media(max-height:430px) and (min-width:621px){
 .notice-scene{grid-template-columns:minmax(0,1fr) 200px;grid-template-rows:28px minmax(0,1fr)}.board-top{grid-column:1/-1}.board-intro{display:none}.physical-board{grid-column:1;grid-row:2}.board-reading{grid-column:2;grid-row:2;gap:7px}.board-reading>div{flex-direction:column;gap:6px}.board-reading button{font-size:9px}.board-reading>p{font-size:10px}
 .ending-body{gap:16px}.ending-scene{padding:9px 14px}.ending-copy h2{font-size:18px;margin:5px 0 8px}.ending-caption{font-size:10px;line-height:1.75}.ending-detail{font-size:8px;line-height:1.6}.ending-records{font-size:9px;min-height:24px}.ending-final-actions{gap:4px}.ending-final-actions .secondary-button{font-size:8px;min-height:25px}.ending-head{font-size:8px}
}
@media(max-height:380px) and (min-width:621px){
 .in-conversation .conversation{padding:9px;max-height:calc(100% - 16px)}.conversation-main>canvas{display:none}.spoken-area #spokenText{font-size:10px;line-height:1.7}.conversation .choice-button{padding:4px 6px}.choice-hint,.choice-note{font-size:8px}.conversation-heading{padding-right:45px}
 .work-foot{padding:6px 8px;gap:4px}.work-foot>p{font-size:10px;line-height:1.45}.work-foot #workDetail{font-size:8px}.medicine-guide{font-size:8px;gap:2px}.medicine-guide span{padding:1px 3px}.work-controls{flex-wrap:nowrap;justify-content:space-between;gap:5px}.work-controls small{max-width:95px;font-size:8px}.work-controls button{font-size:9px;padding:4px 8px;min-height:28px;white-space:nowrap}
 .ending-scene{gap:6px;padding:8px 12px}.ending-caption{font-size:10px;margin-bottom:7px}.ending-copy h2{font-size:17px}.ending-final-actions{margin-top:6px}.ending-detail{margin-bottom:3px}.ending-nav{min-height:29px}
}

/* Let the title yield space to the controls on narrow screens. */
.topbar .brand{min-width:0}.topbar .brand>span:not(.brand-mark){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar .brand-mark{flex-shrink:0}
