/* SPDX-FileCopyrightText: 2026 Marko Sun
   SPDX-License-Identifier: LicenseRef-Hanama-Proprietary */
.stage3d-tool-icon{display:grid;place-items:center;width:20px;height:20px;font:600 24px/1 Georgia,serif;transform:rotate(45deg)}
.stage3d-dialog{width:min(980px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #cdd7c8;border-radius:18px;background:#f8f9f4;color:#293b2d;box-shadow:0 28px 90px #18291b52;overflow:auto}
.stage3d-dialog::backdrop{background:#1a2c21a8;backdrop-filter:blur(5px)}
.stage3d-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px 14px;border-bottom:1px solid #dfe5da}
.stage3d-head .eyebrow{margin:0 0 4px;color:#7b8b78;font:600 10px/1.2 var(--sans);letter-spacing:.2em}
.stage3d-head h2{margin:0;font:500 clamp(19px,2vw,25px)/1.2 var(--serif,serif)}
.stage3d-head .icon-button{flex:none;width:44px;height:44px}
.stage3d-body{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:22px;padding:18px 22px 22px}
.stage3d-visual{min-width:0;align-self:start}
#stage3d-canvas{display:block;width:100%;max-width:660px;aspect-ratio:1;height:auto;border:1px solid #dce2d8;border-radius:12px;cursor:grab;touch-action:none;background:#f1f0e9}
#stage3d-canvas:active{cursor:grabbing}
.stage3d-views{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:10px}
.stage3d-views button,.stage3d-depth+input+button{min-height:40px;padding:7px 12px;border:1px solid #ced8c9;border-radius:8px;background:#fff;color:#425b43;font:500 12px/1.25 var(--sans);cursor:pointer}
.stage3d-views button[aria-pressed=true]{border-color:#627c5a;background:#405b3e;color:#fff}
.stage3d-inspector{display:flex;flex-direction:column;gap:12px;min-width:0}
.stage3d-intro,.stage3d-note{margin:0;color:#526451;font:400 13px/1.6 var(--sans)}
.stage3d-check{min-height:44px;padding:10px 12px;border-radius:8px;background:#edf2e9;color:#405b3e;font:500 12px/1.5 var(--sans)}
.stage3d-check[data-warning=true]{background:#f4eadf;color:#77563e}
.stage3d-map-wrap{display:flex;align-items:center;flex-direction:column;gap:5px}
#stage3d-map{width:176px;height:176px;border:1px solid #dce2d8;border-radius:50%;cursor:pointer;touch-action:manipulation}
.stage3d-map-wrap small{color:#758474;font:11px/1.35 var(--sans);text-align:center}
.stage3d-depth{display:flex;justify-content:space-between;gap:8px;color:#405340;font:500 12px/1.4 var(--sans)}
#stage3d-depth{width:100%;height:32px;accent-color:#58704f}
#stage3d-depth:disabled{opacity:.4}
#stage3d-depth-reset{align-self:flex-start}
#stage3d-depth-reset:disabled{opacity:.45;cursor:default}
.stage3d-note{margin-top:auto;padding-top:10px;border-top:1px solid #dfe5da;font-size:11px;color:#71806d}
@media(max-width:700px){
 .stage3d-dialog{width:100vw;max-height:100dvh;height:100dvh;border:0;border-radius:0}
 .stage3d-head{padding:12px 16px 10px}
 .stage3d-body{display:block;padding:12px 16px 24px}
 #stage3d-canvas{width:min(100%,calc(100dvh - 355px));min-width:min(100%,260px);margin:auto}
 .stage3d-views{margin:8px 0 14px}
 .stage3d-views button{flex:1 1 20%;min-width:58px;min-height:44px;padding:7px 5px}
 .stage3d-inspector{display:grid;grid-template-columns:1fr 120px;gap:8px 12px}
 .stage3d-intro,.stage3d-check,.stage3d-depth,.stage3d-inspector>input,.stage3d-inspector>button,.stage3d-note{grid-column:1}
 .stage3d-map-wrap{grid-column:2;grid-row:1/6;align-self:center}
 #stage3d-map{width:120px;height:120px}
 .stage3d-map-wrap small{font-size:10px}
 .stage3d-note{grid-column:1/-1}
}
@media(max-width:390px){.stage3d-inspector{grid-template-columns:1fr 100px}#stage3d-map{width:100px;height:100px}}
@media(prefers-reduced-motion:reduce){.stage3d-dialog::backdrop{backdrop-filter:none}}