html,body{height:100%;overflow:hidden;background:#191d1b;color:#e4ebe6;color-scheme:dark}body{display:block}.note{display:none}.app{width:100%;height:100dvh;max-width:none;border:0;border-radius:0;display:block}.top{position:absolute;top:12px;left:16px;right:16px;z-index:12;background:transparent;pointer-events:none;gap:4px}.top>*{pointer-events:auto}.project{font-weight:600;max-width:none}.top .icon{background:#242a27}.body,.body.details-open{display:block;height:100%;position:relative}.workspace{height:100%;display:block}.views{height:100%;display:block;position:relative}.planbox{position:absolute;inset:0;background:#1c211f}.planbox #plan{width:100%;height:100%;padding:85px 50px 100px;box-sizing:border-box}.scene{position:absolute;right:20px;top:80px;width:300px;height:210px;overflow:hidden;border:0;border-radius:14px;box-shadow:0 8px 28px #0007;background:#101b26}.scene iframe{width:100%;height:100%;border:0;pointer-events:none;display:block}.scene #scene-overlay{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.views.swapped .scene{inset:0;width:100%;height:100%;border-radius:0;box-shadow:none}.views.swapped .planbox{inset:auto 20px 100px auto;width:260px;height:155px;z-index:2;border-radius:12px;box-shadow:0 8px 24px #0007;cursor:zoom-in}.views.swapped .planbox #plan{padding:12px}.views.swapped .planbox .view-action{display:none}.view-name{position:absolute;top:14px;left:16px;font-size:12px;pointer-events:none}.planbox>.view-name{top:74px}.views.swapped .planbox>.view-name{top:8px}.scene-back{display:none}.views.swapped .scene-back{display:grid;position:absolute;right:18px;top:76px;background:#26322d}.tools{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:15;width:max-content;max-width:calc(100% - 24px);min-height:56px;padding:6px;gap:5px;border-radius:32px;background:#272d29;box-shadow:0 8px 28px #0006}.tools>.spacer,.selection-name,#clear-selection,#preview-trigger{display:none!important}.tools .icon{width:44px;height:44px;flex-shrink:0}.creation-shell,.selection-actions{background:#344b3c;gap:0;padding:2px}.objects-menu{top:auto;bottom:74px;left:0;max-height:55vh;background:#2c332f;box-shadow:0 10px 32px #0008}.objects-menu button{min-height:46px}.power-menu{width:300px}.inspector{position:absolute;z-index:14;right:18px;top:76px;bottom:100px;width:300px;max-height:calc(100% - 176px);box-sizing:border-box;border:0;border-radius:14px;background:#282f2b;box-shadow:0 12px 36px #0006;padding:20px;overflow:auto;display:block}.inspector[hidden]{display:none}.panel-head{margin-bottom:18px}.panel-head h2{font-size:15px}.field label{font-size:13px}.detail-note{font-size:12px;line-height:1.5;color:#c1cdc4}.inspector .field{margin-bottom:20px}.strip-row,.row{font-size:12px}.pattern-options{grid-template-columns:repeat(3,1fr)}.pattern-options button{height:48px}.canvas-scale{bottom:100px;left:24px}.view-action{top:74px;left:18px;right:auto}.planbox>.view-name{left:76px}.gesture-hint{position:fixed;bottom:90px;z-index:20;max-width:calc(100vw - 30px);white-space:normal;text-align:center}.build-actions{position:fixed;bottom:136px;z-index:16}.views.swapped .build-actions{left:50vw;bottom:130px}.scene .view-name{top:14px}.views.swapped .scene .view-name{top:80px;left:22px}#camera-tools{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:none;gap:5px}.views.swapped #camera-tools{display:flex;bottom:100px}#camera-tools button{background:#26352d}#save-status{font-size:11px;color:#b1c4b7;margin-left:12px}.grid{opacity:.07}.surface-hit{pointer-events:all}.icon svg{width:27px;height:27px}button:focus-visible,select:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid #cae5b5;outline-offset:3px}::selection{background:#55795e;color:white}*{scrollbar-color:#728b79 #29342d;scrollbar-width:thin}.scene-handle{fill:#26392e;stroke:#e7f2db;stroke-width:1.5}.scene-outline{fill:none;stroke:#d9ead1;stroke-width:1;stroke-dasharray:4 5;pointer-events:none}.scene-hit{fill:transparent;stroke:transparent;stroke-width:22;pointer-events:all;cursor:grab}.scene-point{fill:#e1edda;stroke:#26372d;stroke-width:1;cursor:crosshair}.scene-off{fill:#26372d;stroke:#91aa98}.scene-control-hit{fill:transparent;pointer-events:all}
@media(max-width:700px){.top{top:8px;left:8px;right:8px}.top .project{font-size:12px;max-width:85px}.top #save-status{display:none}.scene{width:158px;height:115px;top:70px;right:10px}.planbox #plan{padding:120px 10px 135px}.tools{bottom:max(12px,env(safe-area-inset-bottom));max-width:calc(100% - 12px);padding:5px;gap:0;flex-wrap:wrap;justify-content:center;border-radius:26px}#grid-trigger,#color-trigger{display:none!important}.tools .icon{width:44px;height:44px}.inspector{top:auto;bottom:84px;right:10px;left:10px;width:auto;max-height:48vh;padding:16px}.views.swapped .planbox{width:150px;height:90px;right:10px;bottom:154px}.views.swapped #camera-tools{left:90px;bottom:96px}.canvas-scale{bottom:140px;left:16px}.view-action{top:68px;left:12px}.planbox>.view-name{top:82px;left:65px}.views.swapped .planbox>.view-name{top:6px;left:10px;font-size:10px}.views.swapped .scene .view-name{top:70px;left:14px}.gesture-hint{bottom:92px}.swatches{grid-template-columns:repeat(6,1fr)}.swatches button{height:44px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Keep the edited composition above/beside its contextual controls. */
@media(min-width:701px){.body.details-open .planbox #plan{padding-right:350px}}
@media(max-width:700px){.body.details-open .planbox #plan{padding-top:110px;padding-bottom:calc(48vh + 100px)}}
.planbox #plan{position:absolute;left:50px;top:85px;width:calc(100% - 100px);height:calc(100% - 185px);padding:0}
@media(min-width:701px){.body.details-open .planbox #plan{width:calc(100% - 400px);padding:0}}
@media(max-width:700px){.planbox #plan{left:10px;top:120px;width:calc(100% - 20px);height:calc(100% - 255px);padding:0}.body.details-open .planbox #plan{top:110px;height:calc(52vh - 210px);padding:0}}
.views.swapped .planbox #plan,.body.details-open .views.swapped .planbox #plan{left:8px;top:8px;width:calc(100% - 16px);height:calc(100% - 16px);padding:0}
[data-floating=true]{z-index:10!important;min-width:170px;min-height:140px;border-radius:14px!important;box-shadow:0 8px 28px #0008!important;overflow:hidden}
.floating-bar,.floating-resize{display:none}.floating-bar{position:absolute;left:0;right:0;top:0;height:44px;align-items:center;background:#29342d;z-index:6;touch-action:none;user-select:none;cursor:grab}.floating-bar:active{cursor:grabbing}.floating-grip{padding-left:13px;flex:1;font-size:12px;white-space:nowrap}.floating-grip small{display:none}.floating-bar button{padding:0;width:36px;min-width:36px;height:44px;display:grid;place-items:center;font-size:22px;border-radius:0;background:none}.floating-bar svg,.floating-resize svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8}.floating-resize{position:absolute;bottom:0;right:0;width:44px;height:44px;background:#29342dbb;border-radius:10px 0 0 0;z-index:7;touch-action:none;cursor:nwse-resize;padding:10px}[data-floating=true]>.floating-bar{display:flex}[data-floating=true]>.floating-resize{display:block}[data-floating=true]>.view-name{display:none}[data-floating=true].scene iframe,[data-floating=true].scene #scene-overlay{position:absolute;top:44px!important;left:0;width:100%;height:calc(100% - 44px)}[data-floating=true].planbox #plan,.body.details-open [data-floating=true].planbox #plan{top:50px;left:8px;width:calc(100% - 16px);height:calc(100% - 58px)}
#animation-toggle{position:absolute;left:18px;top:108px;z-index:4;display:none;background:#29382f;font-size:12px;padding:8px 12px;min-height:44px}.views.swapped #animation-toggle{display:block}#animation-toggle[aria-pressed=true]{background:#d2e4c4;color:#1c2c23}.plan-navigation{position:absolute;left:18px;bottom:105px;display:flex;gap:4px;z-index:3}.plan-navigation button{width:44px;height:44px;min-width:44px;background:#2b3930;padding:8px;font-size:22px}.plan-navigation svg{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:2}.views.swapped .plan-navigation{display:none}.canvas-scale{bottom:160px}.strip-budget{padding:12px;background:#344b3c;border-radius:10px;margin-bottom:20px}.strip-budget strong{font-size:17px}.strip-budget p{margin:5px 0 0;font-size:12px;color:#d0ddcf;line-height:1.45}.tail-actions{display:grid;gap:7px;margin:14px 0}.tail-actions button{min-height:44px;padding:10px 12px;text-align:left;background:#354b3b;font-size:13px}.tail-actions .secondary{background:transparent;color:#bac9bd}.tail-actions .destructive{background:transparent;color:#c4b8ad}.object .continued-path{stroke:var(--point);stroke-width:1.3;fill:none}.scene #scene-overlay{cursor:default}
.floating-grip{min-width:0;overflow:hidden;text-overflow:ellipsis}.floating-bar button{width:44px;min-width:44px}.floating-bar svg{width:26px;height:26px}[data-floating=true]{min-width:200px}.off-point[data-status=reserve]{fill:none;stroke-dasharray:1 2;opacity:.65}
.allocation-controls{margin:0 0 24px!important}.allocation-controls summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:13px;color:#dce9d9}.allocation-controls summary::before{content:'+';font-size:20px;margin-right:10px}.allocation-controls[open] summary::before{content:'−'}.allocation-controls .field{margin-top:10px}.strip-budget{margin-bottom:4px}.floating-bar{box-shadow:0 3px 12px #0003}
.nature-symbol{stroke:#7fa68a;stroke-width:1.3;vector-effect:non-scaling-stroke;fill:#769c791c}.nature-symbol.tree{fill:#80a87916}.tree-inner{fill:none;stroke:#72987c;stroke-opacity:.3;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}.tree-trunk{fill:#a3bba1;pointer-events:none}.nature-symbol.rock{fill:#a1afa324;stroke:#a1aea2}.rock-facet{fill:none;stroke:#a1aea2;stroke-opacity:.4;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}.nature-symbol.block{fill:url(#closed-hatch);stroke:#a0b2a780;stroke-dasharray:4 4}.site-boundary{fill:none;stroke:#79917d;stroke-width:1;stroke-dasharray:8 6;vector-effect:non-scaling-stroke;pointer-events:none}.object.selected .nature-symbol{stroke:#b7dbb1;stroke-width:2}.grid{vector-effect:non-scaling-stroke}
.plan-navigation [data-site],#camera-tools .site-fit{width:auto;min-width:60px;padding:10px;font-size:12px;background:#2b3930;border-radius:12px;min-height:44px}
.motif-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:8px 0;border-top:1px solid #526153;margin-top:8px}.motif-gallery button{display:flex;flex-direction:column;gap:5px;min-width:0;text-align:center;padding:8px 3px!important;font-size:11px!important;line-height:1.3}.motif-gallery svg{width:52px!important;height:52px!important;flex:none!important}.motif-gallery polyline{fill:none;stroke:#9ed5b6;stroke-width:1.5}.add-menu:has(.motif-gallery){width:330px;overflow:auto;max-height:65vh}.strip-count{display:flex;align-items:center;justify-content:space-between;margin:12px 0;gap:8px}.strip-count button{width:44px;height:44px;font-size:24px;background:#354b3b}.strip-count span{font-size:14px;font-variant-numeric:tabular-nums}.mirror-pattern,.strip-directions button{width:100%;min-height:44px;text-align:left;padding:10px 12px;font-size:12px;background:#354438;margin-bottom:6px}.strip-directions button[aria-pressed=true]{background:#4b6050}.strip-start{fill:#23362c;stroke:#d6eacc;stroke-width:1.5;vector-effect:non-scaling-stroke}#camera-tools .walk-view{min-height:44px;padding:8px 12px;font-size:12px;background:#2b3930;border-radius:12px}#camera-tools{max-width:calc(100vw - 16px);flex-wrap:wrap;justify-content:center}@media(max-width:700px){#camera-tools{left:8px;right:8px;transform:none;gap:3px}#camera-tools button{flex-shrink:0}.add-menu:has(.motif-gallery){width:min(330px,calc(100vw - 40px))}}
/* Desktop workspace: both bottom docks share the same baseline. */
.tools{left:auto;right:20px;bottom:20px;transform:none;min-height:56px;box-sizing:border-box;border-radius:16px}.tools #power-trigger[hidden]{display:none!important}.tools .creation-shell,.tools .selection-actions{border-radius:10px}.tools .objects-menu{left:auto;right:0;bottom:70px}.plan-navigation,.views.swapped .plan-navigation{display:flex;position:absolute;left:20px;bottom:20px;z-index:15;gap:4px;min-height:56px;padding:6px;box-sizing:border-box;background:#272d29;border-radius:16px;align-items:center}.plan-navigation button{border-radius:9px}.plan-navigation #grid-trigger{order:4}.plan-navigation [data-site]{order:5}.plan-navigation svg{width:24px;height:24px}#camera-tools{left:20px!important;right:auto!important;bottom:88px!important;transform:none!important;justify-content:flex-start}#camera-tools #camera-fit,#camera-tools .site-fit{display:none}.canvas-scale{bottom:90px;left:24px}.project-menu{position:absolute;right:0;bottom:70px;width:260px;padding:8px;background:#2c332f;border-radius:14px;box-shadow:0 10px 32px #0008}.project-menu[hidden]{display:none}.project-menu button{display:flex;align-items:center;gap:12px;min-height:48px;width:100%;padding:10px 12px;background:transparent;text-align:left;font-size:14px}.project-menu button:hover{background:#405345}.project-menu svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2}.scheme-dialog{width:calc(100vw - 64px);height:calc(100vh - 64px);max-width:none;max-height:none;padding:0;border:0;border-radius:16px;background:#242d27;color:#edf3e9;box-shadow:0 24px 70px #0009}.scheme-dialog::backdrop{background:#07120fcc}.scheme-head,.scheme-footer{display:flex;align-items:center;gap:14px;padding:12px 18px;min-height:48px}.scheme-head strong{flex:1}.scheme-dialog button{min-height:44px;padding:10px 14px;background:#354b3b;font-size:13px}.scheme-viewport{height:calc(100% - 144px);overflow:auto;background:#b6bdb3;cursor:grab;padding:20px;box-sizing:border-box}.scheme-viewport:active{cursor:grabbing}.scheme-viewport img{display:block;margin:auto;max-width:none;user-select:none}.scheme-footer>div{display:flex;gap:4px}.scheme-footer>span{flex:1;font-size:12px;color:#c0cebf}.scheme-empty{padding:40px}.tools .icon:focus-visible,.plan-navigation button:focus-visible,.project-menu button:focus-visible{outline:2px solid #c6e1b9;outline-offset:2px}.inspector{bottom:96px}.scheme-dialog [data-png]{background:#d5e6c9;color:#213323}
.plan-navigation,.views.swapped .plan-navigation{min-height:60px;padding:8px}.tools{min-height:60px}
/* Compact inspector: a single text size, distinct tools, no repeated object title. */
.inspector{top:auto;bottom:96px;max-height:calc(100vh - 116px);height:max-content;width:304px;padding:16px;font-size:15px}
.inspector :is(button,label,span,strong,p,output,select,summary,input){font-size:15px!important;line-height:1.4}
.inspector .panel-tabs{display:flex;align-items:center;gap:4px;margin-bottom:16px;padding:0;border:0}
.inspector .panel-tabs .icon{width:44px;height:44px;flex-shrink:0}.panel-close{margin-left:auto}
.inspector .field{margin-bottom:16px}.inspector .field label{margin-bottom:8px}
.inspector .strip-budget{display:grid;gap:5px;background:transparent;padding:0;margin:0 0 12px}.strip-budget span{color:#bdcbbf}
.auto-allocation{width:100%;min-height:44px;padding:10px 12px;margin:2px 0 12px;text-align:left;background:#354b3b;font-size:13px}.auto-allocation[aria-pressed=true]{background:#cce0bf;color:#25342a}
.inspector .swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.swatches button{height:38px;padding:6px;display:grid;place-items:center;background:transparent;border-radius:50%}.color-disc{display:block;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff20}.swatches button[aria-pressed=true]{outline:2px solid #e7f0df;outline-offset:-2px}.custom-color{display:flex;align-items:center;justify-content:space-between;margin-top:16px}.custom-color input{width:48px;height:36px;padding:2px;border:0;background:none}
.step-options,.shape-modes,.shape-actions{display:flex;gap:4px;margin:12px 0}.step-options button{flex:1;padding:8px 4px;background:#344238;min-height:40px}.step-options button[aria-pressed=true],.shape-modes button[aria-pressed=true]{background:#cce0bf;color:#25342a}.shape-actions>button:not(.icon){flex:1}.inspector .pattern-options{grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:14px}.inspector .pattern-options button{height:44px}.inspector .pattern-options svg{width:36px;height:36px}.budget-link{width:100%;text-align:left;padding:12px;margin-top:10px;background:#344b3c}.budget-link span{display:block;color:#bfd0c0;margin-top:4px}.mirror-pattern{display:flex;align-items:center;gap:10px}.mirror-pattern svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.density-status{color:#e1cb91!important}
.direction-handle{fill:none;stroke:#e6efd9;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px #101d18);pointer-events:none}.density-selection{fill:none;stroke:#e3dc9c;stroke-width:9;stroke-opacity:.35;vector-effect:non-scaling-stroke;pointer-events:none}
#stretch-add{position:fixed;z-index:25;left:50%;bottom:100px;transform:translateX(-50%);padding:14px 20px;border-radius:12px;background:#d7e8c8;color:#24382a;font-size:15px;box-shadow:0 4px 20px #0007}#stretch-add[hidden]{display:none}
#color-trigger{display:none!important}
.density-start{fill:#eadba0;stroke:#263c2b;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}
.object.selected .point.editable{stroke:transparent;stroke-width:5;paint-order:stroke fill;pointer-events:all}
.object.selected .point.editable:hover{stroke:transparent;stroke-width:5;fill:#fff}

/* The drawing surface fills the window; controls float above it. */
.app{height:100dvh;min-height:0}.body,.workspace,.views{position:absolute;inset:0;display:block;min-height:0}.body.details-open{display:block}.planbox,.scene,.views.swapped .scene{position:absolute;inset:0;width:100%;height:100%;border-radius:0}.views:not(.swapped) .scene{inset:auto 20px auto auto}.top{position:fixed;top:14px;right:20px;z-index:24;width:auto;height:48px;padding:4px;border-radius:12px;background:#27332ddd;box-shadow:0 5px 20px #0005}.top .project,#save-status,.view-name{display:none!important}#save-status.error{display:block!important;padding:0 12px;color:#ffd69d}.note{position:fixed;top:17px;left:20px;z-index:24;height:42px;border-radius:11px;background:#27332ddd;padding:6px}.note>span{display:none}.note button{min-height:30px}.planbox #plan,.body.details-open .planbox #plan{position:absolute;inset:0;width:100%;height:100%;padding:0}.views.swapped .planbox #plan,.body.details-open .views.swapped .planbox #plan{left:8px;top:50px;width:calc(100% - 16px);height:calc(100% - 58px)}.inspector{position:fixed;right:20px;top:76px;bottom:auto;max-height:calc(100vh - 180px);z-index:20}.scene[data-floating=true] #camera-tools{display:flex!important;bottom:7px!important;left:8px!important;gap:3px;z-index:7}.scene[data-floating=true] #camera-tools button{width:38px;height:38px;min-height:38px;padding:6px}.scene[data-floating=true] #camera-tools #camera-fit{display:none}.scene[data-floating=true] #animation-toggle{display:grid;top:50px;left:8px;width:38px;height:38px;min-height:38px;padding:6px}.scene[data-floating=true] #animation-toggle svg{width:23px;height:23px}.views.swapped #animation-toggle{display:grid;place-items:center;width:44px;height:44px;padding:8px}.views.swapped #animation-toggle svg{width:26px;height:26px}.floating-grip{display:flex;align-items:center;padding-left:12px;min-height:44px}.floating-grip svg{width:24px;height:24px;stroke:#d9ebd6}.mapping-active{fill:#ffe59a;stroke:#25362b;stroke-width:2;opacity:.94;pointer-events:none;filter:drop-shadow(0 0 4px #f3d36a)}.mapping-label{fill:#ffe6a2;stroke:#14241b;stroke-width:3;paint-order:stroke;pointer-events:none}.matrix-field{display:grid;gap:7px;margin:14px 0}.matrix-field select{width:100%}.matrix-title{font-size:17px;margin:10px 0}.matrix-back{padding:8px 0;color:#d5e8cd}.matrix-transport{display:flex;gap:6px;margin:18px 0}.matrix-transport button{flex:1;min-height:44px;background:#405842;font-size:24px}.matrix-transport button[aria-pressed=true]{background:#e4d596;color:#26372b}.matrix-status{min-height:46px;color:#f2e4b4;line-height:1.5}.source-assignment{display:flex;align-items:center;gap:10px;padding:8px 0}.source-assignment input{width:18px;height:18px}#context-actions{position:fixed;z-index:22;display:flex;gap:3px;padding:4px;border-radius:12px;background:#29392f;box-shadow:0 6px 20px #0008}#context-actions[hidden]{display:none}#context-actions button{width:40px;height:40px}#context-actions svg{width:24px;height:24px}
@media(min-width:701px){.body.details-open .views:not(.swapped) .planbox #plan{width:calc(100% - 340px)}}
.top{left:auto!important;width:max-content}.top .spacer{display:none}.note{right:auto}.scene[data-floating=true] .scene-back{display:none}
.tools .selection-actions{display:none!important}

/* Keep dock menus beside the inspector and make the long motif list legible. */
.tools{z-index:21}
.tools .objects-menu{max-height:min(65vh,calc(100dvh - 110px));overflow-y:auto;scrollbar-width:auto}
@media(min-width:701px){.tools .objects-menu{right:calc(100% + 72px)}}
.tools .add-menu:has(.motif-gallery){max-height:min(65vh,calc(100dvh - 110px));padding-bottom:22px;box-shadow:inset 0 -18px 18px -14px #111a14,0 10px 32px #0008}
.tools .add-menu:has(.motif-gallery)::before{content:"Мотивы ниже ↓";display:block;position:sticky;top:-6px;z-index:1;margin:-6px -6px 5px;padding:9px 12px;background:#405345;color:#e8f3e5;font-size:12px;font-weight:600}

/* Static physical-address mapping, sharing the inspector's existing palette. */
.mapping-object{margin:0;color:#b9c8bd}.mapping-overview{display:block;width:100%;height:150px;background:#17221e;border-radius:8px;margin-top:8px}.mapping-overview text{font-size:11px;fill:#fff;stroke:#17221e;stroke-width:3px;paint-order:stroke}.mapping-legend{margin:5px 0 10px}.mapping-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px}.mapping-grid button{min-height:25px;padding:2px 0;border:1px solid transparent;border-bottom:3px solid var(--pixel-color);border-radius:4px;background:#35453a;color:#fff;font-size:11px;font-variant-numeric:tabular-nums}.mapping-grid button[aria-pressed=true]{outline:2px solid white;outline-offset:0;background:#526b59}.mapping-grid button.mapping-unused{color:#83988c;border-bottom-style:dotted;background:#27332c}.mapping-grid button.mapping-turn{border-top:2px solid #f7ebc1}.mapping-selection{margin:12px 0 8px;color:#efe7c9}.mapping-actions,.mapping-colors{display:flex;align-items:center;gap:8px}.mapping-actions button,.mapping-export{background:#405842;padding:9px;border-radius:6px;min-height:36px}.mapping-actions label,.mapping-colors label{display:flex;gap:8px;align-items:center;font-size:13px}.mapping-actions input,.mapping-colors input{width:30px;height:30px;padding:2px;border:0;background:transparent}.mapping-colors{justify-content:space-between}.mapping-advanced summary{cursor:pointer;padding:10px 0}.mapping-export{width:100%;margin-top:14px}.mapping-grid button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.inspector.mapping-mode{width:min(620px,calc(100vw - 40px));max-height:calc(100dvh - 176px)}.mapping-workspace{display:grid;grid-template-columns:1fr 1fr;gap:20px}.mapping-mode .matrix-title{display:inline-block;margin:6px 10px 4px 0}.mapping-mode .mapping-object{display:inline}.mapping-mode .strip-count{margin:6px 0}.mapping-mode .mapping-grid button{height:27px;min-height:27px;font-size:12px!important}.mapping-mode .mapping-overview{height:130px}.mapping-mode .matrix-field{margin:10px 0;gap:4px}.mapping-mode .detail-note{font-size:12px!important}.mapping-mode .mapping-actions{flex-wrap:wrap}.mapping-mode .mapping-export{margin-top:4px}.mapping-mode .mapping-advanced summary{padding:6px 0}.mapping-mode .panel-tabs{margin-bottom:8px}
.mapping-mode .mapping-overview{height:100px}.mapping-mode .mapping-setup>.detail-note:last-child{margin:8px 0}.mapping-mode .mapping-advanced{margin-top:0}.mapping-mode .panel-tabs{position:sticky;top:-16px;background:#252e27;z-index:2}.mapping-mode .mapping-actions label{white-space:nowrap}
.mapping-mode .mapping-sequence{margin:0 0 6px;font-variant-numeric:tabular-nums}
.mapping-mode .strip-count button{min-height:36px;height:36px}.mapping-mode .mapping-overview{height:90px}

/* One object workspace: list → editor → list. Only its content scrolls. */
.inspector,.inspector.mapping-mode{top:76px;bottom:96px;height:auto;max-height:none;display:flex;flex-direction:column;padding:0;overflow:hidden;box-sizing:border-box}
.inspector[hidden]{display:none}
.object-panel-head{display:flex;align-items:center;gap:8px;flex:none;min-height:58px;padding:7px 10px;border-bottom:1px solid #ffffff10}
.object-panel-title{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.object-panel-head .panel-back{display:flex;align-items:center;gap:2px;background:transparent;padding:0 4px;min-height:44px;flex:none}
.object-panel-head .panel-back span{font-size:13px!important}
.object-panel-head .panel-back svg{width:16px;height:16px}
.object-panel-head .panel-close{width:44px;height:44px;margin:0;flex:none;background:transparent}
.object-panel-head .panel-close svg{width:16px;height:16px}
.object-panel-head svg,.object-actions svg,.object-list-row svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.inspector-content{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:14px 14px 18px}
.inspector .panel-tabs{gap:2px;margin-bottom:14px;position:sticky;top:-14px;background:#252e27;z-index:2;padding:2px 0}
.inspector .panel-tabs .icon{width:44px;height:44px}
.inspector[data-view=list] .inspector-content{padding:8px}
.object-list{display:grid;gap:3px}
.object-list-row{width:100%;display:flex;align-items:center;gap:12px;min-height:64px;padding:10px;text-align:left;background:transparent;border-radius:9px}
.object-list-row:hover,.object-list-row[aria-current=true]{background:#344b3c}
.object-list-row>svg{width:24px;height:24px;color:#c6d6ca}
.object-list-row>svg:last-child{width:14px;height:14px;margin-left:auto;opacity:.65}
.object-list-row>span{min-width:0;display:grid;gap:3px}
.object-list-row strong{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.object-list-row small{font-size:12px;color:#aebfb1}
.object-actions{display:flex;gap:4px;flex:none;padding:10px;border-top:1px solid #ffffff10;background:#252e27;flex-wrap:wrap}
.object-actions button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 10px;background:#344238;flex:1}
.object-actions button svg{width:17px;height:17px}
.object-actions:has([data-object-action=reset]) [data-object-action=duplicate]{flex-basis:100%}
.object-actions .object-delete{background:transparent;color:#dab6ab}
.object-actions button:disabled{opacity:.38;cursor:default}
.inspector :is(button,input,select):focus-visible,#context-actions button:focus-visible{outline:2px solid #c6e1b9;outline-offset:-2px}
#context-actions button{width:44px;height:44px}#context-actions button[hidden]{display:none}#context-actions svg{width:19px;height:19px}
#objects-trigger[aria-expanded=true]{background:#d2e4c4;color:#1c2c23}
@media(min-width:701px){.body.details-open:has(.inspector.mapping-mode) .views:not(.swapped) .planbox #plan{width:calc(100% - 660px)}}
.inspector.mapping-mode .object-actions [data-object-action=duplicate]{flex-basis:0}

/* Creative mapping keeps the picture and direct pixel palette visible while controls scroll. */
.mapping-mode-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:8px 0 12px}
.mapping-mode-picker button{min-height:40px;padding:5px 3px;background:#35463b;border:0;border-radius:7px;font-size:11px;line-height:1.15}
.mapping-mode-picker button[aria-pressed=true]{background:#d5df9f;color:#1f3527;font-weight:700}
.mapping-creative{display:grid;gap:8px}
.mapping-slider{padding:5px 0;border:0;background:transparent}
.mapping-slider label{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;font-weight:650}
.mapping-slider output{min-width:28px;text-align:right;color:#e7ebae;font-variant-numeric:tabular-nums;font-size:15px}
.mapping-slider input[type=range]{width:100%;height:31px;margin:4px 0 0;accent-color:#e6dd9a}
.mapping-slider input[type=range]::-webkit-slider-runnable-track{height:5px;background:#668974;border-radius:6px}
.mapping-slider input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-7px;background:#dce9c6;border:0;box-shadow:none}
.mapping-slider small{display:block;color:#b5c7b2;font-size:10px;line-height:1.3}
.mapping-slider:has(input:disabled){opacity:.55}
.mapping-colors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;justify-content:initial}
.mapping-colors label{display:flex;flex-direction:column;gap:2px!important;font-size:10px!important;color:#cdd8c6}
.mapping-colors input[type=color]{width:100%;height:32px;padding:1px;border:1px solid #8aa083;border-radius:6px;cursor:pointer}
.mapping-pixel-palette{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:8px 0}
.mapping-pixel-palette button{height:36px;min-width:0;border:2px solid #b3c3a3;border-radius:7px;background:var(--pixel-color);box-shadow:inset 0 0 0 2px #1c281d}
.mapping-pixel-palette button:hover:not(:disabled),.mapping-pixel-palette button:focus-visible{outline:2px solid #fff4c0;outline-offset:1px;transform:translateY(-1px)}
.mapping-mode .mapping-actions{justify-content:space-between;gap:6px}
.mapping-mode .mapping-actions button{font-size:11px}
.mapping-mode .mapping-advanced{border-top:1px solid #78907555;margin-top:8px}
.mapping-mode .mapping-advanced summary{font-size:12px;color:#dce9cf}
@media(max-width:700px){.inspector.mapping-mode{width:min(620px,calc(100vw - 24px))}.mapping-workspace{grid-template-columns:1fr}.mapping-mode .mapping-overview{height:110px}.mapping-mode-picker button{font-size:12px}}

/* Mapping is a compact hand-off view. The drawing remains visible while settings scroll. */
.mapping-mode .panel-tabs{margin-bottom:2px}
.mapping-preview-stick{position:sticky;top:0;z-index:3;margin:0 -14px 14px;padding:8px 14px 9px;background:#252e27;box-shadow:0 7px 12px #111a1499;border-bottom:1px solid #70886b55}
.mapping-preview-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:13px}
.mapping-preview-head strong{font-size:15px}
.mapping-preview-head span{color:#dce8d7;font-variant-numeric:tabular-nums}
.mapping-preview-stick .mapping-overview{height:82px;margin:5px 0;background:#17221e}
.mapping-strip-nav{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:5px;font-size:12px}
.mapping-strip-nav button{width:34px;height:29px;background:#3b5542;border-radius:6px;font-size:21px;line-height:1}
.mapping-strip-nav strong{min-width:92px;text-align:center;font-weight:550}
.mapping-panel-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.mapping-panel-body section{min-width:0}
.mapping-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:1px 0 9px;font-size:12px}
.mapping-section-head strong{font-size:13px}
.mapping-section-head span{color:#aebead;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mapping-count-slider{padding:5px 0;border:0;background:transparent}
.mapping-count-slider label{display:flex;justify-content:space-between;gap:8px;font-size:12px;font-weight:650}
.mapping-count-slider output{color:#e7ebae;font-size:15px;font-variant-numeric:tabular-nums}
.mapping-count-slider input[type=range]{width:100%;height:31px;margin:3px 0 0;accent-color:#e6dd9a}
.mapping-count-slider input[type=range]::-webkit-slider-runnable-track{height:5px;background:#668974;border-radius:6px}
.mapping-count-slider input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-7px;background:#dce9c6;border:0;box-shadow:none}
.mapping-direction{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:8px 0}
.mapping-direction button{min-height:36px;background:#35463b;border:0;border-radius:7px;font-size:12px}
.mapping-direction button[aria-pressed=true]{background:#d5df9f;color:#1f3527;font-weight:700}
.mapping-mode .mapping-slider{margin:4px 0;padding:5px 0}
.mapping-mode .mapping-slider small{display:none}
.mapping-mode .mapping-mode-picker{margin:3px 0 7px}
.mapping-mode .mapping-mode-picker button{min-height:34px}
.mapping-mode .mapping-colors{display:flex;gap:6px;margin:5px 0}
.mapping-mode .mapping-colors input[type=color]{width:36px;height:34px;flex:0 0 36px}
.mapping-base-color{display:flex;align-items:center;justify-content:space-between;font-size:12px}
.mapping-base-color input{width:38px;height:34px;padding:1px;border:1px solid #8aa083;border-radius:6px;background:transparent}
.mapping-mode .mapping-grid{gap:2px}
.mapping-mode .mapping-grid button{height:24px;min-height:24px;font-size:10px!important}
.mapping-mode .mapping-selection{margin:9px 0 5px;font-size:12px}
.mapping-mode .mapping-pixel-palette{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:5px 0}
.mapping-mode .mapping-pixel-palette button{height:31px}
.mapping-mode .mapping-actions{margin-top:5px}
.mapping-import-note{margin:4px 0;color:#d7c796;font-size:11px}
@media(max-width:700px){.mapping-panel-body{grid-template-columns:1fr;gap:18px}.mapping-preview-stick .mapping-overview{height:88px}.mapping-mode .mapping-grid button{height:27px;min-height:27px;font-size:11px!important}}

/* Symmetric header controls keep the title centred independently of its length. */
.object-panel-head{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:6px}
.object-list-head{grid-template-columns:auto minmax(0,1fr) 44px}
.object-list-head .panel-reset{align-self:center;min-height:36px;padding:0 6px;border:0;background:none;color:#c3d4c6;font:inherit;cursor:pointer}
.inspector .object-panel-title{font-size:14px!important;text-align:center;width:100%;font-weight:500}
.object-panel-head .panel-back{justify-content:center;width:44px;height:44px;padding:0}
.object-panel-head:has(.object-actions){grid-template-columns:44px minmax(0,1fr) auto 44px;gap:3px;padding-inline:8px}
.object-panel-head:has(.object-actions) .object-panel-title{text-align:left}
.object-panel-head .object-actions{display:flex;align-items:center;gap:1px;min-width:0;padding:0;border:0;background:transparent;flex-wrap:nowrap}
.object-panel-head .object-actions button{width:36px;height:36px;min-height:36px;flex:0 0 36px!important;padding:7px;border-radius:8px;background:transparent;color:#d7e4d8}
.object-panel-head .object-actions button:hover,.object-panel-head .object-actions button:focus-visible{background:#3b4f40}
.object-panel-head .object-actions .object-delete{color:#e2bcb0}
.object-panel-head .object-actions button svg{width:19px;height:19px}
.object-panel-head .panel-close{width:44px;height:44px}
#sequence-panel{display:none;position:absolute;left:328px;top:76px;z-index:12;width:290px;box-sizing:border-box;padding:14px;background:#27332df0;color:#e4ebe6;border-radius:14px;box-shadow:0 8px 28px #0007;font-size:13px}
.views.swapped #sequence-panel:not([hidden]){display:block}
#sequence-panel>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
#sequence-panel strong{font-size:14px}
#sequence-count{white-space:nowrap;color:#b9cbbd;font-variant-numeric:tabular-nums}
.sequence-actions{display:flex;align-items:center;margin-top:10px}
.sequence-actions label{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;white-space:nowrap}
.sequence-actions select{min-height:38px;border:0;border-radius:8px;background:#344b3c;color:#fff}
#sequence-panel :is(button,select):focus-visible{outline:2px solid #c6e1b9;outline-offset:2px}
.tools .add-menu:has(.motif-gallery)::before{display:none}
.canvas-scale[hidden]{display:none!important}
.rotation-handle{fill:#314f3a;stroke:#e5f3d8;stroke-width:2;vector-effect:non-scaling-stroke}
.rotation-mark{fill:none;stroke:#e5f3d8;stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.quick-shapes{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 0;border-bottom:1px solid #526153;margin-bottom:6px}.quick-shapes button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;padding:9px 5px!important;text-align:center;font-size:12px!important;line-height:1.25;background:#35483c;border-radius:9px}.quick-shapes button:hover{background:#46634e}.quick-shapes svg{width:32px!important;height:32px!important;flex:none!important;color:#bfe8c5}.mirror-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;width:100%}.shape-actions{flex-wrap:wrap}.mirror-actions button{min-height:44px;padding:7px 5px;background:#344238;border-radius:8px;font-size:11px;line-height:1.25}.mirror-actions button[aria-pressed=true]{background:#cce0bf;color:#25342a}.shape-actions [data-density-pick]{min-height:40px}

.walk-hint{position:absolute;left:50%;top:72px;transform:translateX(-50%);z-index:8;padding:9px 14px;border-radius:10px;background:#23372ddd;color:#f1f6e9;font-size:13px;line-height:1.35;white-space:nowrap;pointer-events:none;box-shadow:0 4px 18px #0005}.walk-hint[hidden]{display:none}@media(max-width:700px){.walk-hint{top:60px;max-width:calc(100vw - 32px);white-space:normal;text-align:center}}

/* Mapping uses the selected figure on the plan as its only preview. */
.inspector.mapping-mode{width:360px}
@media(min-width:701px){.body.details-open:has(.inspector.mapping-mode) .views:not(.swapped) .planbox #plan{width:calc(100% - 400px)}}
.mapping-panel-body{display:flex;flex-direction:column;gap:10px}
.mapping-panel-body>.mapping-section-head{width:100%;margin:7px 0 0}
.mapping-panel-body .mapping-count-slider,.mapping-panel-body .mapping-slider,.mapping-panel-body .mapping-direction,.mapping-panel-body .mapping-mode-picker,.mapping-panel-body .mapping-creative,.mapping-panel-body .mapping-color-row{width:100%;box-sizing:border-box}
.mapping-strip-nav{width:100%;margin:3px 0 0;justify-content:space-between}
.mapping-strip-nav button{width:40px;height:40px;display:grid;place-items:center}
.mapping-strip-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.mapping-limit-note{margin:-4px 0 3px;color:#aec3ad;font-size:12px!important;line-height:1.3!important}
.mapping-color-row,.object-color-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.object-color-choice{align-items:stretch;flex-direction:column;gap:12px;margin:12px 4px 0}
.mapping-color-row>span,.object-color-choice>span{color:#e5eddb}
.mapping-color-slot{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:42px}
.mapping-colors{display:grid;grid-template-columns:1fr 1fr;gap:3px 12px}
.color-picker{position:relative;display:inline-flex;align-items:center;gap:4px;flex:none}
.color-picker-trigger{width:38px;height:38px;min-height:38px;display:grid;place-items:center;padding:4px;border:0;border-radius:50%;background:#34483a}
.color-picker-disc,.color-picker-swatches span{display:block;width:25px;height:25px;border-radius:50%;background:var(--chosen-color);box-shadow:inset 0 0 0 1px #ffffff55}
.color-picker-popover{position:fixed;left:var(--color-popover-left,0px);top:var(--color-popover-top,0px);z-index:100;width:208px;padding:11px;background:#2b4033;border:1px solid #637e69;border-radius:12px;box-shadow:0 12px 28px #0009;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .12s ease}
.color-picker:is(.is-open,.is-pinned,:hover,:focus-within) .color-picker-popover{visibility:visible;opacity:1;pointer-events:auto}
.color-picker-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.color-picker-swatches button{width:30px;height:30px;min-height:30px;display:grid;place-items:center;padding:2px;border-radius:50%;background:none}
.color-picker-swatches span{width:23px;height:23px}
.color-picker-swatches button:is(:hover,:focus-visible){outline:2px solid #e6f0d9;outline-offset:-1px}
.color-picker-swatches button[aria-pressed=true]{outline:2px solid #e6f0d9;outline-offset:-1px}
.color-picker-custom{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;color:#d7e4d0;font-size:12px}
.color-picker-popover input[type=color]{display:block;width:42px;height:32px;margin:0;padding:2px;border:0;border-radius:7px;background:#3d5746;cursor:pointer}
.color-picker-inline{display:block;width:100%}
.color-picker-inline .color-picker-popover{position:static;width:auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;visibility:visible;opacity:1;pointer-events:auto}
.color-picker-inline .color-picker-swatches{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.color-picker-inline .color-picker-swatches button{width:100%;height:38px;min-height:38px}
.color-picker-inline .color-picker-swatches span{width:27px;height:27px}
.color-picker-inline .color-picker-custom{margin-top:12px;padding-top:10px;border-top:1px solid #ffffff19}
.color-picker-reset{width:28px;height:28px;min-height:28px;padding:0;border-radius:50%;background:#3b4b3c;color:#e8d8c7;font-size:20px!important;line-height:1!important}
.color-picker-trigger:disabled,.color-picker-reset:disabled{opacity:.45}
@media(max-width:700px){.inspector.mapping-mode{width:min(360px,calc(100vw - 24px))}.mapping-panel-body{gap:11px}}
.body.details-open:has(.inspector.mapping-mode) .scene[data-floating=true],.body.details-open:has(.inspector.mapping-mode) .views>.view-action{display:none}
.touch-dialog{width:min(390px,calc(100vw - 32px));padding:22px;border:1px solid #607765;border-radius:16px;background:#26362c;color:#e8f0e3;box-shadow:0 20px 70px #0009}.touch-dialog::backdrop{background:#07120fa8}.touch-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.touch-head strong{font-size:18px}.touch-head button{width:34px;height:34px;padding:0;background:transparent;font-size:25px}.touch-dialog p{margin:14px 0;color:#c3d2c2;font-size:13px;line-height:1.5}.touch-dialog label{display:block;margin:20px 0 7px;font-size:12px}.touch-dialog input{box-sizing:border-box;width:100%;min-height:42px;padding:8px 10px;border:1px solid #728a76;border-radius:8px;background:#1d2a22;color:#f3f7ef;font:inherit}.touch-actions{display:flex;gap:8px;margin-top:14px}.touch-actions button{flex:1;min-height:40px;padding:7px 10px;border-radius:8px;background:#d5df9f;color:#203529}.touch-actions button+button{background:#3b5040;color:#e8f0e3}.touch-actions button:disabled{opacity:.45}.touch-dialog #touch-state{margin-bottom:0;min-height:20px}.touch-dialog :is(button,input):focus-visible{outline:2px solid #d5df9f;outline-offset:2px}
@media(max-width:700px){.inspector.mapping-mode{top:auto;bottom:75px;height:52dvh;max-height:none}.inspector.mapping-mode .inspector-content{padding-top:8px}.inspector.mapping-mode .object-actions{padding:5px 8px}.inspector.mapping-mode .object-actions button{min-height:38px}}
@media(max-width:700px){body .body.details-open .inspector.mapping-mode{top:auto!important;bottom:75px!important;height:52dvh}}

/* The object workspace owns one fixed footprint across every tab. */
@media(min-width:701px){
 .inspector,.inspector.mapping-mode{width:360px;top:76px;bottom:96px;height:auto;max-height:none}
 .body.details-open .views:not(.swapped) .planbox #plan,.body.details-open:has(.inspector.mapping-mode) .views:not(.swapped) .planbox #plan{width:calc(100% - 400px)}
}
.inspector-tabbar{flex:none;padding:7px 12px 5px;border-bottom:1px solid #ffffff12;background:#252e27}
.inspector-tabbar[hidden]{display:none}
.inspector .inspector-tabbar .panel-tabs{position:static;display:flex;justify-content:space-between;gap:2px;margin:0;padding:0;background:transparent}
.inspector .inspector-tabbar .panel-tabs .icon{width:44px;height:44px;flex:none}
.inspector-content{min-height:0;flex:1;overflow:auto}
.range-ruler{position:relative;height:10px;margin:0 12px 1px}
.range-tick{position:absolute;top:0;width:0;height:10px;pointer-events:none}
.range-tick i{display:block;width:2px;height:6px;transform:translateX(-1px);border-radius:2px;background:#8fa994;opacity:.65}
.range-tick.is-active i{height:9px;background:#e7efbf;opacity:1}
.inspector-content .field:has(.range-ruler){margin-bottom:12px}
.inspector-content .field:has(.range-ruler) label{margin-bottom:2px}
.inspector-content :is(.mapping-slider,.mapping-count-slider) input[data-snapped=true]::-webkit-slider-thumb,.inspector-content .field input[data-snapped=true]::-webkit-slider-thumb{box-shadow:0 0 0 3px #e5ecb478}
.inspector-content :is(.mapping-slider,.mapping-count-slider) input[data-snapped=true]::-moz-range-thumb,.inspector-content .field input[data-snapped=true]::-moz-range-thumb{box-shadow:0 0 0 3px #e5ecb478}
.mapping-fixed-count{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:8px 0 13px;font-size:12px;font-weight:650}
.mapping-fixed-count strong{color:#e7ebae;font-size:15px;font-variant-numeric:tabular-nums}
.mapping-mode .mapping-slider{margin:2px 0;padding:3px 0}
#sequence-stop{width:100%;min-height:38px;margin-top:10px;background:#405842;border-radius:8px;color:#edf5e8}
.nature-random{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:46px;margin-top:22px;padding:9px 12px;border-radius:9px;background:#3b5541;color:#e9f3e5;font-size:14px}
.nature-random svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2}
@media(min-width:701px){
 .tools .add-menu.nature-menu{left:-8px;right:auto;bottom:66px;width:168px;max-height:none;padding:5px}
 .tools .add-menu.nature-menu button{min-height:48px}
 .plan-navigation,.views.swapped .plan-navigation{min-height:52px;padding:5px;gap:2px;background:#252d28d9;box-shadow:0 5px 18px #0004}
 .plan-navigation button{width:40px;height:40px;min-width:40px;background:transparent;color:#bacbbd}
 .plan-navigation [data-site]{min-height:40px;min-width:52px;background:transparent;color:#bacbbd}
 .tools .creation-shell{background:#3c5a42}
 .tools #add-trigger,.tools #nature-trigger{color:#f0f8e8}
 .tools #block-trigger{opacity:.78}
}
.top{top:12px;right:16px;height:44px;padding:0;gap:3px;border-radius:0;background:transparent;box-shadow:none}
.top .icon{width:44px;height:44px;border-radius:10px;background:transparent;color:#1b2b21}
.top .icon svg{width:28px;height:28px;filter:drop-shadow(0 0 2px #f0f9e9) drop-shadow(0 1px 1px #f0f9e9)}
.top .icon:hover:not(:disabled),.top .icon:focus-visible{background:#e5f0dfcc;color:#173421}
.top .icon:disabled{opacity:.45}
.top .project-menu{position:absolute;top:50px;right:0;bottom:auto;width:270px;border:1px solid #718974;background:#27352c;color:#eaf3e5;box-shadow:0 12px 32px #0008}
.top .project-menu button{color:inherit}
.top .project-menu button[aria-pressed=true]{background:#405943}
.views.swapped #camera-tools,.scene[data-floating=true] #camera-tools{background:transparent;box-shadow:none}
.views.swapped #camera-tools button,.scene[data-floating=true] #camera-tools button{width:48px;height:48px;min-height:48px;padding:9px;border-radius:10px;background:transparent;color:#17281e}
.views.swapped #camera-tools button svg,.scene[data-floating=true] #camera-tools button svg{width:30px;height:30px;filter:drop-shadow(0 0 2px #f0f8ea) drop-shadow(0 1px 1px #f0f8ea)}
.views.swapped #camera-tools button:hover,.views.swapped #camera-tools button:focus-visible,.scene[data-floating=true] #camera-tools button:hover,.scene[data-floating=true] #camera-tools button:focus-visible{background:#e5f0dfd9;color:#173421}
.scene[data-floating=true] #camera-tools{bottom:4px!important;left:6px!important}

/* The plan camera is a movable viewpoint, with a separate direction handle. */
.plan-camera{cursor:grab;filter:drop-shadow(0 2px 3px #11291bbb)}
.plan-camera:active{cursor:grabbing}
.plan-camera-cone{fill:#e3f6b540;stroke:#416c4c;stroke-width:1.5}
.plan-camera-axis{fill:none;stroke:#d5f0b5;stroke-width:2;stroke-dasharray:3 3}
.plan-camera-hit,.plan-camera-rotate-hit{fill:transparent;pointer-events:all}
.plan-camera-body{fill:#244b31;stroke:#e7f2d9;stroke-width:1.8}
.plan-camera-lens,.plan-camera-rotate-handle{fill:#dff5b5;stroke:#244b31;stroke-width:1.5}
.plan-camera-rotate-hit{cursor:crosshair}
.plan-camera:focus-visible .plan-camera-body{stroke:#f5cf73;stroke-width:3}

/* Keep the floating camera controls above the image, so the preview stays full size. */
.scene[data-floating=true]{overflow:visible}
.scene[data-floating=true] iframe,.scene[data-floating=true] #scene-overlay{top:0!important;left:0;width:100%;height:100%;border-radius:14px}
.scene[data-floating=true] .floating-bar{top:-42px;height:38px;gap:4px;background:transparent;box-shadow:none;color:#e9f3e6;text-shadow:0 1px 3px #06150d}
.scene[data-floating=true] .floating-grip{min-height:38px;padding-left:3px;gap:5px;font-size:13px;font-weight:650}
.scene[data-floating=true] .floating-grip svg{width:17px;height:17px;stroke:currentColor}
.scene[data-floating=true] .floating-bar button{width:auto;min-width:0;height:36px;min-height:36px;padding:0 7px;border-radius:7px;font-size:11px;font-weight:600;background:transparent;color:inherit}
.scene[data-floating=true] .floating-bar button:hover,.scene[data-floating=true] .floating-bar button:focus-visible{background:#e5f0dfcc}
.scene[data-floating=true] #camera-tools,.scene[data-floating=true] #animation-toggle{display:none!important}
.planbox[data-floating=true] .floating-bar{gap:2px}
.planbox[data-floating=true] .floating-grip{gap:5px;min-width:0;padding-left:8px}
.planbox[data-floating=true] .floating-grip svg{width:17px;height:17px;flex:none}
.planbox[data-floating=true] .floating-bar button{width:auto;min-width:0;min-height:44px;padding:0 7px;white-space:nowrap;font-size:11px}
.floating-bar [data-expand]{margin-left:5px;border-left:1px solid #dce9d477;padding-left:11px!important}
.onboarding-dialog{width:480px;height:260px;max-width:calc(100vw - 48px);box-sizing:border-box;padding:30px;border:0;border-radius:16px;background:#222d26;color:#e8eee8;box-shadow:0 24px 70px #0007;font-family:inherit;font-size:14px;line-height:1.55}
.onboarding-dialog::backdrop{background:#07110bc9}
.onboarding-dialog form{height:100%;display:flex;flex-direction:column;align-items:flex-start}
.onboarding-dialog h1{margin:0;font-size:22px;line-height:1.3}
.onboarding-dialog p{margin:20px 0;color:#c3d2c2;font-size:15px;line-height:1.6}
.onboarding-start{margin-top:auto;min-height:46px;padding:10px 18px;border:0;border-radius:9px;background:#c0dec6;color:#16271a;font:inherit;font-weight:600;cursor:pointer}
.onboarding-dialog :focus-visible{outline:2px solid #e5f6e9;outline-offset:3px}
.start-dialog{height:282px}
.start-content{display:flex;flex-direction:column;height:100%}
.start-options{display:grid;gap:7px;margin-top:auto}
.start-options button{min-height:48px;padding:10px 16px;border:0;border-radius:9px;background:#34473a;color:#e8eee8;text-align:left;font:inherit;cursor:pointer}
.start-options button:first-child{background:#c0dec6;color:#16271a;font-weight:600}

/* Quiet first-run surfaces and clearly separated creation groups. */
.onboarding-dialog{width:min(440px,calc(100vw - 40px));height:auto;min-height:225px;padding:28px;background:#27332b;border:0;border-radius:14px}
.onboarding-dialog p{margin:16px 0 30px;line-height:1.5}
.onboarding-start{width:100%;margin-top:0}
.start-dialog{min-height:270px}
.start-options{margin-top:24px}
.start-options button{background:#35453a}
.tools .add-menu:has(.add-section){width:390px;max-height:min(570px,calc(100dvh - 115px));padding:14px;box-sizing:border-box;background:#26332a;overflow:auto}
.add-section+.add-section{margin-top:16px}
.add-section-title{display:block;margin:0 0 8px 2px;color:#c3d3c5;font-size:12px;font-weight:650}
.add-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.tools .add-grid .add-tile{display:grid;place-items:center;width:100%;height:60px;min-height:60px;padding:5px;background:#344a3b;color:#e4f2df;border:0;border-radius:9px;text-align:center}
.tools .add-grid .add-tile:hover:not(:disabled),.tools .add-grid .add-tile:focus-visible{background:#527158;color:#fff;transform:none}
.tools .add-grid .add-tile svg{display:block;width:43px;height:43px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tools .add-grid .add-tile svg polyline{fill:none;stroke:currentColor;stroke-width:1.7}
.add-section-power{border-top:1px solid #4c6251;padding-top:10px}
.tools .add-section-power button{justify-content:center;min-height:48px;background:#3b5643;color:#eef8e8;font-weight:600}
.tools .add-section-power button:hover{background:#527158;color:#fff}
.fill-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:14px 0}
.fill-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;padding:5px 2px;background:#34463a;color:#e2eddf;border:0;border-radius:8px;font-size:12px}
.fill-tabs button svg{width:22px;height:22px;fill:none;stroke:currentColor}
.fill-tabs button[aria-pressed=true],.mapping-mode-picker button[aria-pressed=true]{background:#c9ddc0;color:#223628}
.mirror-actions{display:flex;width:auto}
.mirror-actions button{display:grid;place-items:center;width:44px;min-height:44px;padding:0}
.mirror-actions svg{width:22px;height:22px;fill:none;stroke:currentColor}
.shape-actions{align-items:center}
.shape-actions [data-density-pick]{font-size:12px;padding:7px}
.mapping-mode-picker{gap:5px}
.mapping-mode-picker button{font-size:12px;background:#34463a}
.mapping-mode .mapping-pixel-palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
.mapping-mode .mapping-pixel-palette button{height:38px;background:var(--pixel-color);border:2px solid #17251b;box-shadow:none}
.mapping-mode .mapping-pixel-palette button:hover:not(:disabled),.mapping-mode .mapping-pixel-palette button:focus-visible{transform:none;outline:2px solid #fff;outline-offset:1px}
body:has(.inspector.mapping-mode) #plan .object.selected :is(.point,.off-point),body:has(.inspector.mapping-mode) #scene-overlay .scene-point{opacity:0}
.top .icon,.views.swapped #camera-tools button,.scene[data-floating=true] #camera-tools button{background:#26352de6;color:#ebf3e7}
.top .icon svg,.views.swapped #camera-tools button svg,.scene[data-floating=true] #camera-tools button svg{filter:none}
.top .icon:hover:not(:disabled),.top .icon:focus-visible{background:#dcebd7;color:#163322}
/* World choices stay beside the scene; only confirmation writes the document. */
.inspector[data-view=worlds]{z-index:25}
.world-panel-head{grid-template-columns:minmax(0,1fr) 44px}
.world-panel-head strong{padding-left:8px;font-size:16px;font-weight:600}
.inspector[data-view=worlds] .world-list{display:grid;align-content:start;gap:6px;padding:10px}
.world-row{display:grid;gap:2px;width:100%;min-height:62px;padding:10px 14px;border:0;border-radius:9px;background:#34453a;color:#e8eee8;text-align:left;font:inherit;cursor:pointer}
.world-row[aria-pressed=true]{background:#527058;color:#fff}
.world-row strong{font-size:14px;font-weight:600}.world-row small{font-size:12px;color:#c7d6c9}
.world-confirm{flex:none;min-height:54px;margin:10px;border:0;border-radius:9px;background:#c0dec6;color:#16271a;font:inherit;font-weight:600;cursor:pointer}
.world-confirm:disabled{opacity:.45;cursor:default}
body.world-preview .tools,body.world-preview .top,body.world-preview .planbox,body.world-preview #scene-overlay{pointer-events:none}
body.world-preview .views.swapped .scene{right:400px!important;width:calc(100% - 400px)!important}
.onboarding-dialog,.touch-dialog,.scheme-dialog{margin:auto}
@media(max-width:700px){.tools .add-menu:has(.add-section){width:min(390px,calc(100vw - 30px))}}
.mapping-mode .mapping-pixel-palette{width:100%;box-sizing:border-box}
.fill-tabs button,.mapping-mode-picker button{display:grid;place-items:center;min-height:52px;padding:0}
.fill-tabs button svg,.mapping-mode-picker button svg{width:28px;height:28px}
.fill-tabs button[aria-pressed=true]:hover:not(:disabled),.mapping-mode-picker button[aria-pressed=true]:hover:not(:disabled),.mirror-actions button[aria-pressed=true]:hover:not(:disabled){background:#c9ddc0;color:#223628}
.top .project-menu,.touch-dialog{border:0}
.top .icon svg,.views.swapped #camera-tools button svg,.scene[data-floating=true] #camera-tools button svg{filter:none}
.tools .add-menu:has(.add-section){right:0;left:auto;max-width:calc(100vw - 40px)}
.tools .add-grid .add-tile[aria-pressed=true],.tools .add-grid .add-tile:hover:not(:disabled){color:#f5fff1}
.scheme-head [data-close],.touch-head [data-touch-close]{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;background:transparent;color:#e8eee8}
.scheme-head [data-close]:hover,.touch-head [data-touch-close]:hover{background:#405345}
.scheme-head [data-close] svg,.touch-head [data-touch-close] svg{width:22px;height:22px}
.color-picker-popover{border:0}