/* Shared map controls use the existing cream panels, forest actions and SVG icons. */
.display-menu>div{width:min(300px,calc(100vw - 80px));min-width:0;max-height:calc(100dvh - 240px);overflow-y:auto;overscroll-behavior:contain}
.display-menu strong{font-size:12px}.display-menu small{font-size:11px;line-height:1.45;color:var(--muted)}
.display-menu hr{width:100%;margin:5px 0}.display-menu a.btn{display:block;text-decoration:none}
.display-frame-area{fill:#ddbc6720;stroke:#bf9135;stroke-width:3px;stroke-dasharray:10 5;vector-effect:non-scaling-stroke;cursor:move;pointer-events:all}
.display-frame text{fill:#fff;stroke:#173c32;stroke-width:3px;paint-order:stroke;vector-effect:non-scaling-stroke;font-weight:700}
.display-frame-handle{fill:#bf9135;stroke:#fff;stroke-width:2px;vector-effect:non-scaling-stroke;cursor:nwse-resize;pointer-events:all}
.display-frame :focus-visible{outline:none;stroke:#fff;stroke-width:5px}
.display-editbar>span{font-size:12px;max-width:240px;line-height:1.4}
.map-screen-open{overflow:hidden;background:#0b1713}
.map-screen{height:100dvh;width:100%;display:flex;flex-direction:column;background:#0b1713;color:var(--ink);position:relative;overflow:hidden}
.screen-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex-shrink:0;padding:8px max(10px,env(safe-area-inset-right)) 8px max(10px,env(safe-area-inset-left));background:var(--paper,#fffdf3);border-bottom:1px solid var(--line);z-index:5}
.screen-title{margin-right:auto;min-width:0}.screen-title strong,.screen-title small{display:block}.screen-title strong{font-size:16px}.screen-title small,.screen-live{font-size:11px;color:var(--muted)}
.screen-source{display:flex;align-items:center;gap:6px;font-size:12px}.screen-source select{width:200px;max-width:100%;margin:0;min-height:40px}
.screen-toolbar .btn{min-height:40px}.screen-board{flex:1;min-height:0!important;border:0;border-radius:0;background:#0b1713;position:relative}
.screen-board>svg{position:absolute;inset:0;width:100%;height:100%}
.is-display .screen-toolbar{position:absolute;top:8px;left:8px;right:8px;border:1px solid var(--line);border-radius:10px;opacity:0;transition:opacity .2s;pointer-events:none}
.is-display.show-controls .screen-toolbar,.is-display .screen-toolbar:focus-within,.is-display .screen-toolbar:hover{opacity:1;pointer-events:auto}
.is-display .pawn{pointer-events:none}
.preview-hint{padding:7px 12px;background:#f4e5bf;color:#5e471b;font-size:12px;flex-shrink:0}
.preview-tools{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:7px 10px max(7px,env(safe-area-inset-bottom));background:var(--paper,#fffdf3);flex-shrink:0}
.preview-tools span{font-size:12px;flex:1;min-width:100px}
.map-screen-message{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:var(--paper,#fffdf3);text-align:center}
.map-screen-message h1{font-size:clamp(22px,5vw,40px)}.map-screen-message p{max-width:550px}
@media(max-width:600px){.screen-toolbar{gap:6px;padding:6px}.screen-title strong{font-size:14px}.screen-toolbar>.screen-source{order:3;flex:1 1 100%;margin:0}.screen-source select{flex:1}.screen-toolbar .btn{font-size:11px;padding:6px 8px}.screen-toolbar .map-icon{padding:6px;min-width:36px}.screen-live{display:none}.preview-tools .btn{font-size:11px;padding:7px}.display-editbar>span{flex:1 1 100%;max-width:none}}
@media(max-height:500px){.preview-hint{padding:3px 8px}.screen-toolbar{padding:4px;gap:4px}.screen-source select{width:130px}.preview-tools{padding:3px 6px}.screen-title small{display:none}.display-menu>div{max-height:calc(100dvh - 205px)}}
@media(max-width:800px){.display-menu>div{max-height:calc(100dvh - 234px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}}
