/* Progressive enhancement: these rules apply only after the complete scene exists. */
.grid-wrap{--world-board-ratio:.86}
.scene .grid-wrap.world-board-loading{width:100%;max-width:100%;min-height:min(60vh,480px);max-height:min(60vh,480px);overflow:hidden}
.world-board-loading #grid,.world-board-loading>.compass{visibility:hidden}
.world-board-loading-note{position:absolute;inset:0;display:grid;place-items:center;margin:0;color:var(--muted);font-size:14px}
.mobile-board-controls{display:none}
@media(max-width:940px){
 .mobile-board-controls{display:grid;gap:8px;margin:8px 0}
 .mobile-board-picker{display:flex;align-items:center;gap:10px}
 .mobile-board-picker label{font-size:13px;white-space:nowrap;color:var(--muted)}
 .mobile-board-picker select{flex:1;min-width:0;height:44px;font-size:14px}
 .mobile-board-actions{display:flex;gap:8px;flex-wrap:wrap}
 .mobile-board-actions .btn{flex:1;min-width:0;min-height:44px;padding:8px;font:600 13px/1.3 var(--font-ui);white-space:normal}
 .mobile-board-actions [aria-pressed="true"]{border-color:var(--pick-line);background:var(--panel-strong)}
 .mobile-person-clues{font-size:13px;line-height:1.5;border:1px solid var(--border-strong);border-radius:8px;padding:0 10px}
 .mobile-person-clues summary{min-height:44px;align-content:center;cursor:pointer;overflow-wrap:anywhere}
 .mobile-person-clues ul{list-style:none;margin:0 0 10px;padding:0}
 .mobile-person-clues .clue-btn{min-height:44px;font-size:13px}
 .mobile-person-clues li+li{margin-top:6px}
 #mobile-board-controls>.status{position:static;transform:none;width:auto;max-width:none;min-height:2.8em;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:left;font-size:12px;line-height:1.4;pointer-events:auto}
}
@media(max-width:560px){
 .mobile-board-picker{display:block}
 .mobile-board-picker label{display:block;margin-bottom:4px}
 .mobile-board-picker select{width:100%;font-size:16px}
}
.world-webgl-stage,.world-webgl-labels{position:absolute;pointer-events:none}
.world-webgl-stage{z-index:0}
.world-webgl-labels{z-index:3;overflow:visible}
.scene .grid-wrap.world-webgl-active{perspective:none;isolation:isolate;padding-inline:0}
.world-webgl-active #grid{display:block;position:relative;transform:none;transform-style:flat;aspect-ratio:1 / var(--world-board-ratio);background:none;border:0;box-shadow:none;z-index:1}
.world-webgl-active #grid .cell{position:absolute;aspect-ratio:auto;min-height:0;padding:0;border:0;transform:none!important;transform-style:flat;animation:none!important;background:transparent!important;box-shadow:none!important;overflow:hidden}
.world-webgl-source{visibility:hidden}
.world-webgl-active #grid .cell::before,.world-webgl-active #grid .cell::after{content:none}
.world-webgl-active #grid .cell:focus-visible{background:#f7e8a63b!important;outline:3px solid #fff1b8;outline-offset:-4px}
.world-webgl-active #grid .cell:hover:where(:not(.grid-touch-input *)){background:#eee3ae18!important}
.world-webgl-active #grid .cell.cell-target{background:#e8d7910c!important;cursor:copy}
.world-webgl-active #grid .cell.cell-blocked{background:#25182020!important}
.world-webgl-active #grid .cell.cell-conflict{background:#d13e352d!important}
.world-webgl-active #grid .cell.rb-on{box-shadow:inset 0 0 0 2px #ead49e70!important}
.world-webgl-active #grid .cell.cell-werkzeug-ziel{box-shadow:inset 0 0 0 1px hsl(199 89% 62% / .34)!important}
.world-webgl-active #grid .cell.cell-werkzeug-ziel:hover:where(:not(.grid-touch-input *)){box-shadow:inset 0 0 0 2px hsl(199 89% 62% / .85)!important}
.world-webgl-active #grid .cell.cell-werkzeug-leer{box-shadow:inset 0 0 0 1px #ffffff38!important}
.world-webgl-active #grid .cell .cell-press-feedback{visibility:visible;transform:none;inset:0;background:#fff3cc38}
.world-webgl-mark{position:absolute;inset:auto;transform:none;pointer-events:none;white-space:nowrap;max-width:none;line-height:1.2;text-align:center;font-family:var(--font-body,Georgia,serif);text-shadow:0 1px 2px #000;box-sizing:border-box}
.world-webgl-person-name{color:#fff5d8;font-size:clamp(10px,1vw,13px);font-weight:600;background:#151b1ce8;padding:2px 4px;border:1px solid #cfb57180;border-radius:3px;z-index:3}
.world-webgl-room-name{color:#e4d195;font:bold clamp(9px,.9vw,12px)/1.05 Georgia,serif;text-transform:uppercase;white-space:normal;max-width:90px;background:#172527ed;border:1px solid #b6a774aa;padding:3px 5px;z-index:2}
.world-webgl-row,.world-webgl-column{font:9px/1 sans-serif;color:#e8dcb9;background:#172022cc;padding:1px 2px;z-index:2}
.world-webgl-note{width:18px;height:18px;color:#e4d49c;fill:currentColor}
.world-webgl-trace{width:38px;height:28px;overflow:visible;color:#7cdfff;fill:#7cdfffb8;stroke:#7cdfff}
.world-webgl-author,.world-webgl-conflict,.world-webgl-found,.world-webgl-searched{font:bold 11px/16px sans-serif;min-width:16px;height:16px;border-radius:50%;background:#192527;color:#f4dfac;border:1px solid #cfb571;z-index:4}
.world-webgl-conflict{background:#a12f2a;color:#fff}
@media(max-width:560px){.world-webgl-person-name{font-size:10px}.world-webgl-room-name{max-width:68px;font-size:9px}}
@media(forced-colors:active){.world-webgl-stage,.world-webgl-labels{display:none}}

/* The illustration keeps its original palette and aspect ratio. */
.scene .grid-wrap.world-authored-active,.scene .grid-wrap.world-overview-active{width:100%;max-width:100%;min-width:0;max-height:var(--authored-view-height);margin-block:8px 0;padding:0 0 36px 36px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9b8052 #172021}
.scene .grid-wrap.world-authored-overview{overflow:visible;display:flow-root}
/* Short desktop windows keep every instruction above the map, with less
   stacked whitespace. The original DOM and keyboard order stay unchanged. */
@media(min-width:941px) and (max-height:800px){
 .layout>.scene:has(>.world-authored-active){padding:8px 12px}
 .layout>.scene:has(>.world-authored-active)>.scene-head{margin-bottom:6px}
 .layout>.scene:has(>.world-authored-active)>.dossier{margin-bottom:6px}
 .layout>.scene:has(>.world-authored-active)>.lehr-zeile{padding:8px 12px;margin-bottom:8px;font-size:13px;line-height:1.45}
 .layout>.scene:has(>.world-authored-active)>.lehr-zeile>p{display:inline;margin:0;font-size:inherit;line-height:inherit}
 .layout>.scene:has(>.world-authored-active)>.lehr-zeile>.lehr-schritt{margin-inline-end:6px}
 .layout>.scene:has(>.world-authored-active)>.board-orientation{grid-template-columns:max-content minmax(0,1fr);gap:8px;margin-top:6px}
 .layout>.scene:has(>.world-authored-active) .world-authored-toolbar{margin-block:2px 6px}
 .layout>.scene:has(>.world-authored-active)>.scene-foot{margin-top:8px}
}
/* A phone scrolls the comfortable viewer into view; the illustration keeps its
   readable scale. At either vertical edge the page remains a native exit. */
@media(max-width:560px){.scene .grid-wrap.world-authored-active,.scene .grid-wrap.world-overview-active{padding-left:24px;padding-bottom:28px;overscroll-behavior-y:auto}}
.world-authored-active #grid,.world-overview-active #grid{width:var(--authored-width,100%);min-width:0;max-width:none;margin:0 auto}
.world-authored-active>.compass{top:18px;right:8px}
.world-authored-image,.world-authored-plaques,.world-authored-raster,.world-authored-pieces{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.world-authored-image,.world-authored-plaques{object-fit:contain;filter:none;opacity:1;mix-blend-mode:normal}
.world-authored-pieces{z-index:3}
.world-authored-plaques{z-index:2}
.world-authored-room-sign{position:absolute;z-index:4;box-sizing:border-box;display:flex;align-items:center;justify-content:center;pointer-events:none;white-space:pre;text-align:center;font-family:Georgia,serif;font-weight:700;line-height:1.12;color:#ffedb5;background:linear-gradient(#27302c,#111a19);border:1px solid #b99a54;box-shadow:0 2px 3px #0009;padding:1px;border-radius:1px}
.world-authored-raster{z-index:3;opacity:0;fill:none;stroke:#ffedb5;stroke-width:1.8;stroke-opacity:.7}
.world-authored-show-raster .world-authored-raster{opacity:1}
.world-webgl-active:has(#grid .cell-target,#grid .cell-blocked) .world-board-raster{opacity:1}
.world-authored-defs{position:absolute}
.world-webgl-active #grid .cell.cell-blocked{background:repeating-linear-gradient(135deg,#24141788 0 6px,#e4ac7955 6px 8px)!important;cursor:not-allowed}
.world-webgl-blocked{display:grid;place-items:center;width:23px;height:23px;border:1px solid #ffddb4;border-radius:4px;background:#34201df2;color:#ffe1bd;font:bold 23px/1 sans-serif}
/* A normal touch gesture belongs to the page, even when the map is enlarged. */
.scene .grid-wrap.world-overview-active:not(.world-pan-active):not(.world-authored-overview){overflow:hidden;overscroll-behavior:auto;touch-action:pan-y pinch-zoom}
.scene .grid-wrap.world-overview-active.world-authored-overview{overscroll-behavior:auto;touch-action:pan-y pinch-zoom}
.scene .grid-wrap.world-overview-active.world-pan-active{overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom}
/* A sibling row keeps every control outside the scrolling map at every zoom. */
.world-authored-toolbar{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:4px;width:max-content;max-width:100%;min-height:44px;margin:8px 0;overflow:visible;pointer-events:none;background:#172222f5;border-radius:5px}
.world-authored-toolbar button{pointer-events:auto;min-width:44px;height:44px;padding:0 10px;border:1px solid #bda573;border-radius:5px;color:#f8e9c5;background:#172222f5;font:600 13px Georgia,serif;box-shadow:0 2px 6px #0008}
.world-authored-toolbar button:focus-visible{outline:3px solid #fff2ae;outline-offset:2px}
.world-authored-toolbar button[aria-pressed=true]{background:#685533}
.world-authored-pan-hint{align-self:flex-start;white-space:nowrap;padding:6px 8px;margin-top:7px;border-radius:4px;background:#172222e8;color:#f3e2bd;font:11px/16px sans-serif}
.world-authored-person{position:absolute;width:var(--authored-piece-size);height:var(--authored-piece-size);transform:translate(-50%,-100%);border:3px solid #d3b576;border-bottom:6px solid var(--authored-coat);border-radius:50% 50% 43% 43%;background:#293337;box-shadow:0 3px 7px #0009,0 0 0 1px #2e2418;overflow:hidden}
.world-authored-person .avatar-anime-illustration{display:block;width:100%;height:100%}
.world-authored-victim{border-color:#cb9d83;border-bottom-color:#913e35;filter:saturate(.6)}
.world-authored-active .world-webgl-person-name{font-family:Georgia,serif;border-color:#c6a873;color:#ffefd0;background:#172223f0;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.world-authored-person--figure,.world-authored-person--seated,.world-authored-person--victim{border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.world-authored-person--victim .world-authored-figure-ground{display:none}
.world-authored-figure-art{position:absolute;inset:0;display:block;width:100%;height:100%;filter:drop-shadow(1px 2px 1px #16181380)}
.world-cell-footprints{position:absolute;inset:0;overflow:visible;pointer-events:none}
.world-cell-footprints polygon{fill:#10191b38;stroke:#f0d797;stroke-width:1.5;vector-effect:non-scaling-stroke}
.world-authored-figure-ground{position:absolute;left:var(--figure-foot-x);top:var(--figure-foot-y);width:var(--figure-ground-size);height:calc(var(--figure-ground-size)*.3);transform:translate(-50%,-50%);border:1px solid #cbb17bb3;border-radius:50%;background:radial-gradient(ellipse,#222819a6,transparent 70%);box-shadow:0 2px 3px #1118}
/* A soft warm edge separates the small figures from the tea house's dark rugs. */
[data-authored-map="teehandel-reference"] .world-authored-person--figure .world-authored-figure-art{filter:drop-shadow(0 0 .85px #f5dcb3ad) drop-shadow(1px 2px 1px #16181399)}
[data-authored-map="teehandel-reference"] .world-authored-person--figure .world-authored-figure-ground{border-color:#e3c998bf;background:radial-gradient(ellipse,#bca26b30,#2228198a 55%,transparent 72%)}
.world-board-overlap{position:fixed;z-index:1000;width:min(304px,calc(100vw - 16px));padding:14px;border:1px solid #b99a5e;border-radius:12px;background:#191b21;color:#f7edd8;box-shadow:0 12px 38px #0009;box-sizing:border-box}
.world-board-overlap-title{margin:0 0 10px;font-size:15px;font-weight:650}
.world-board-overlap button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;width:100%;min-height:48px;margin:6px 0 0;padding:10px 12px;border:1px solid #766341;border-radius:7px;background:#292b31;color:#f7edd8;font:inherit;text-align:left;cursor:pointer;touch-action:manipulation}
.world-board-overlap button:hover{background:#38352d;border-color:#e4c583}
.world-board-overlap button:focus-visible{outline:3px solid #f4d78d;outline-offset:2px}
.world-board-overlap small{font-size:12px;color:#d4c7ad}
.world-board-overlap [data-overlap-action="cancel"]{align-items:center;background:transparent;border-color:transparent}
.world-board-quality-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0;padding:10px 12px;border:1px solid #766341;border-radius:8px;background:#24251f;color:#f7edd8;font-size:14px}
.world-board-quality-note span{flex:1 1 220px}
.world-board-quality-note button{min-height:44px;padding:8px 12px;border:1px solid #b99a5e;border-radius:6px;background:#192526;color:#f7edd8;font:inherit;cursor:pointer;touch-action:manipulation}
.world-board-quality-note button:focus-visible{outline:3px solid #f4d78d;outline-offset:2px}
@media(forced-colors:active){.world-board-overlap,.world-board-overlap button{border-color:ButtonText;background:Canvas;color:CanvasText}.world-board-overlap small{color:CanvasText}}