/* AMBER 01 / interactive object study */
body.amber-viewer-open{overflow:hidden}
.amber-dialog{color:#e8e5da;background:#202621;border:1px solid #60655b;padding:0;width:min(1180px,calc(100vw - 48px));max-width:none;max-height:calc(100dvh - 40px);margin:auto;overflow:auto;overscroll-behavior:contain;box-shadow:0 35px 110px #0009}
.amber-dialog::backdrop{background:#080b09df;backdrop-filter:blur(9px)}
.amber-dialog[open]{display:flex;flex-direction:column}
.amber-dialog [hidden]{display:none!important}
.amber-dialog-header{display:flex;align-items:center;gap:24px;flex-shrink:0;padding:20px 26px;border-bottom:1px solid #e7e4d324;background:#202621}
.amber-dialog-header p{font:10px/1.3 Arial,sans-serif;letter-spacing:.14em;color:#adb4a5;margin:0 0 5px}
.af-home .amber-dialog-header h2{margin:0;font:24px/1.2 Georgia,serif;letter-spacing:.035em}
.amber-dialog-header h2 span{font:11px/1 Arial,sans-serif;letter-spacing:0;color:#bec4b2;margin-left:12px}
.amber-dialog button{font-family:inherit;font-size:12px;line-height:1.3;border:1px solid #e7e4d337;background:transparent;color:inherit;min-height:40px;padding:9px 15px;cursor:pointer;transition:background .18s,color .18s}
.amber-dialog button:hover{background:#d7cfb81a}
.amber-dialog button:focus-visible,.amber-dialog input:focus-visible,.amber-dialog canvas:focus-visible{outline:2px solid #ebd6a5;outline-offset:-3px}
.amber-dialog button[aria-pressed=true]{background:#d2c9b3;color:#171d18;border-color:#d2c9b3}
.amber-dialog button:disabled{opacity:.4;cursor:default}
.amber-modes{display:flex;margin-left:auto}
.amber-modes button+button{border-left:0}
.amber-close{display:flex;align-items:center;gap:25px}
.amber-close span{font-size:19px;line-height:1}
.amber-viewport{height:min(59vh,620px);min-height:260px;position:relative;flex:1 1 auto;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 47% 40%,#72786a 0%,#4b5448 48%,#30392f 100%)}
.amber-canvas-host,.amber-photo{position:absolute;inset:0;width:100%;height:100%}
.amber-canvas-host canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;position:relative;z-index:1}
.amber-canvas-host canvas:active{cursor:grabbing}
.amber-photo{object-fit:contain;opacity:1;transition:opacity .2s;pointer-events:none;padding:3%}
.amber-viewport[data-ready=true][data-mode=model] .amber-photo{opacity:0}
.amber-viewport[data-mode=photo] .amber-canvas-host{visibility:hidden}
.amber-stage-label{position:absolute;inset:22px 26px auto;display:flex;justify-content:space-between;gap:12px;font:9px/1.5 Arial,sans-serif;letter-spacing:.12em;color:#e0e4d3b0;z-index:2;pointer-events:none}
.amber-loading{position:absolute;left:50%;bottom:68px;transform:translateX(-50%);margin:0;padding:9px 14px;background:#171d18cc;border:1px solid #dfd9c329;font-size:12px;text-align:center;width:max-content;max-width:88%;z-index:3}
.amber-retry{position:absolute;left:50%;top:55%;transform:translateX(-50%);background:#202621!important;z-index:4}
.amber-gesture{position:absolute;bottom:20px;left:15px;right:15px;margin:0;text-align:center;font-size:11px;letter-spacing:.035em;color:#eef1e1c4;z-index:2;pointer-events:none}
.amber-gesture span{padding:0 8px;color:#e4e6d65e}
.amber-toolbar{padding:14px 26px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;border-top:1px solid #e7e4d324}
.amber-presets{display:flex;gap:5px}
.amber-presets button{min-width:50px;padding:9px 12px}
.amber-zoom{display:flex;align-items:center;gap:9px;margin-left:auto}
.amber-zoom label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.amber-zoom button{font:20px/1 Georgia,serif;width:36px;padding:5px;min-height:36px;border:0}
.amber-zoom input{accent-color:#d7c69e;width:86px;min-width:0;cursor:pointer}
.amber-zoom output{font:11px/1.4 Arial,sans-serif;min-width:32px;text-align:right;color:#c9cdbe}
.amber-auto{white-space:nowrap}
.amber-auto span{display:inline-block;font-size:17px;margin-right:5px;vertical-align:-1px}
.amber-dialog-footer{display:flex;justify-content:space-between;gap:20px;padding:0 26px 16px;flex-shrink:0;color:#aab1a2}
.amber-dialog-footer p{font-size:10px;line-height:1.7;margin:0}
.amber-dialog-footer>span{white-space:nowrap;font:9px/1.7 Arial,sans-serif;letter-spacing:.1em}
@media(max-width:800px){
 .amber-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}
 .amber-dialog-header{padding:15px 18px;gap:13px}
 .amber-toolbar{flex-wrap:wrap;justify-content:center;gap:10px;padding:12px 18px}
 .amber-presets{margin-right:auto}
 .amber-zoom{margin-left:0}
 .amber-dialog-footer{padding:0 18px 15px}
 .amber-dialog-footer>span{display:none}
}
@media(max-width:520px){
 .amber-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
 .amber-dialog-header{padding:13px 12px;gap:9px}
 .af-home .amber-dialog-header h2{font-size:20px}
 .amber-dialog-header h2 span{margin-left:6px;font-size:9px}
 .amber-dialog-header p{font-size:8px;letter-spacing:.06em}
 .amber-dialog button{font-size:11px;padding:9px 11px}
 .amber-close{gap:10px}
 .amber-modes button{padding:9px 12px}
 .amber-viewport{height:46vh;min-height:250px}
 .amber-stage-label{inset:17px 15px auto;font-size:8px;letter-spacing:.03em}
 .amber-stage-label span:first-child{max-width:170px}
 .amber-toolbar{gap:10px 7px;padding:12px}
 .amber-presets{width:100%;justify-content:center;margin:0}
 .amber-presets button{flex:1}
 .amber-zoom{gap:3px;margin-right:auto}
 .amber-zoom input{width:58px}
 .amber-zoom button{width:26px}
 .amber-dialog .amber-auto{padding:9px 8px}
 .amber-gesture{font-size:10px;bottom:17px}
 .amber-gesture span{padding:0 3px}
 .amber-dialog-footer{padding:0 12px 12px}
}
@media(max-height:540px) and (min-width:600px){.amber-dialog{max-height:calc(100dvh - 16px)}.amber-dialog-header{padding:9px 18px}.amber-dialog-header p{display:none}.amber-viewport{min-height:150px;height:52vh}.amber-toolbar{padding:8px 18px;gap:8px}.amber-dialog-footer{padding-bottom:8px}.amber-stage-label{inset:10px 18px auto}.amber-gesture{bottom:10px}}
@media(prefers-reduced-motion:reduce){.amber-dialog *{transition:none!important}}

.amber-viewport[data-ready=false] .amber-canvas-host{visibility:hidden}

@media(max-width:360px){.amber-dialog-header{display:grid;grid-template-columns:1fr auto;gap:9px}.amber-dialog-header>div:first-child{grid-column:1;grid-row:1}.amber-dialog-header .amber-modes{grid-column:1;grid-row:2;margin:0;justify-self:start}.amber-dialog .amber-close{grid-column:2;grid-row:1 / 3;align-self:start;white-space:nowrap}.af-home .amber-dialog-header h2{font-size:18px;white-space:nowrap}.amber-dialog-header h2 span{display:none}.amber-dialog-header p{font-size:7px}.amber-dialog-footer p{font-size:9px}}
