.viewer-symbols { position:absolute; width:0; height:0; overflow:hidden; }
.viewer-legacy-chrome { display:none !important; }
[hidden] { display:none !important; }
.viewer-stage, .viewer-engine { position:absolute; inset:0; width:100%; height:100%; }
.viewer-stage { position:fixed; height:100vh; height:100dvh; background:#17191b; }
.viewer-ui { position:fixed; inset:0; height:100vh; height:100dvh; z-index:30; pointer-events:none; color:var(--keob-ink); padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
.viewer-ui * { box-sizing:border-box; }
.viewer-ui { font-family:var(--keob-font); }
.viewer-ui button, .viewer-ui input, .viewer-ui a { pointer-events:auto; }
.viewer-ui button { min-width:var(--keob-target); min-height:var(--keob-target); border:0; border-radius:var(--keob-radius); background:var(--keob-surface); color:var(--keob-ink); font:inherit; cursor:pointer; padding:10px 14px; }
.viewer-ui button:hover, .viewer-ui button[aria-expanded="true"], .viewer-ui button[aria-pressed="true"] { background:#e9e9e9; }
.viewer-ui button:disabled { cursor:wait; opacity:.55; }
.viewer-ui :focus-visible, #panorama:focus-visible { outline:3px solid var(--keob-focus); outline-offset:3px; }
.viewer-ui svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.viewer-header { position:absolute; top:calc(12px + env(safe-area-inset-top)); left:calc(12px + env(safe-area-inset-left)); right:calc(12px + env(safe-area-inset-right)); display:flex; align-items:center; gap:18px; color:#fff; text-shadow:0 1px 4px #000; }
#viewer-brand { display:flex; align-items:center; min-height:44px; padding:8px 12px; background:rgba(34,34,34,.88); border-radius:var(--keob-radius); }
#viewer-brand img { width:170px; max-width:100%; height:24px; object-fit:contain; }
.viewer-tour-title { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.viewer-dock { position:absolute; bottom:calc(16px + env(safe-area-inset-bottom)); left:calc(16px + env(safe-area-inset-left)); right:calc(16px + env(safe-area-inset-right)); display:flex; flex-direction:column; align-items:center; gap:8px; }
.viewer-scene-title { margin:0; max-width:100%; padding:7px 14px; border-radius:var(--keob-radius); color:#fff; background:rgba(34,34,34,.88); font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.viewer-toolbar { display:flex; padding:4px; gap:2px; background:var(--keob-surface); border-radius:8px; box-shadow:0 3px 20px #0003; pointer-events:auto; }
.viewer-toolbar button { display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; }
.viewer-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.25); pointer-events:auto; }
.viewer-panel { position:absolute; right:calc(16px + env(safe-area-inset-right)); bottom:calc(135px + env(safe-area-inset-bottom)); width:400px; max-width:calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)); max-height:calc(100% - 155px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); display:flex; flex-direction:column; background:var(--keob-surface); border-radius:12px; box-shadow:0 8px 40px #0004; pointer-events:auto; overflow:hidden; animation:viewer-open .16s ease-out; }
.viewer-panel-heading { display:flex; align-items:center; justify-content:space-between; flex:none; padding:12px 12px 10px 20px; border-bottom:1px solid var(--keob-border); }
.viewer-panel h2 { font-size:19px; font-weight:400; margin:0; }
.viewer-panel-heading button { display:grid; place-items:center; padding:10px; }
.viewer-panel-body { padding:16px 20px 20px; overflow:auto; overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; }
.viewer-scenes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.viewer-scenes button { padding:0; overflow:hidden; text-align:left; border:2px solid transparent; background:#f3f3f3; }
.viewer-scenes button[aria-current="true"] { border-color:var(--keob-ink); }
.viewer-scenes img { display:block; width:100%; height:auto; aspect-ratio:2/1; object-fit:cover; background:#ddd; }
.viewer-scenes span { display:block; padding:9px; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
#viewer-details p { margin:0 0 16px; line-height:1.6; overflow-wrap:anywhere; white-space:pre-line; }
.viewer-facts { display:flex; flex-wrap:wrap; gap:12px; padding:12px 0; border-top:1px solid var(--keob-border); border-bottom:1px solid var(--keob-border); margin-bottom:16px; }
.viewer-contact { display:inline-flex; align-items:center; min-height:44px; color:var(--keob-ink); text-decoration:underline; }
#viewer-share label { display:block; font-size:14px; margin-bottom:10px; }
#viewer-share input { width:100%; min-height:44px; border:1px solid var(--keob-border); padding:10px; border-radius:var(--keob-radius); font:inherit; color:var(--keob-ink); margin-bottom:12px; }
#viewer-copy { width:100%; background:var(--keob-ink); color:#fff; }
.viewer-options { display:flex; flex-direction:column; gap:6px; }
.viewer-options button { width:100%; text-align:left; border:1px solid var(--keob-border); }
.viewer-options fieldset { border:0; margin:12px 0 0; padding:0; }
.viewer-options legend { margin-bottom:8px; font-size:14px; }
.viewer-status { position:absolute; top:calc(76px + env(safe-area-inset-top)); left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)); padding:12px 16px; background:var(--keob-surface); border-radius:var(--keob-radius); font-size:14px; box-shadow:0 2px 12px #0003; pointer-events:auto; }
#viewer-retry { margin-left:8px; text-decoration:underline; }
@keyframes viewer-open { from { transform:translateY(10px); opacity:0; } to { transform:translateY(0); opacity:1; } }
@media(max-width:767px), (max-height:450px) {
    .viewer-header { top:env(safe-area-inset-top); gap:0; }
    #viewer-brand { padding:4px 10px; min-height:44px; }
    #viewer-brand img { width:140px; height:22px; }
    .viewer-tour-title, .viewer-desktop { display:none !important; }
    .viewer-dock { bottom:calc(8px + env(safe-area-inset-bottom)); left:calc(8px + env(safe-area-inset-left)); right:calc(8px + env(safe-area-inset-right)); gap:6px; }
    .viewer-toolbar { width:100%; max-width:430px; }
    .viewer-toolbar button { flex:1; min-width:0; flex-direction:column; gap:4px; font-size:12px; padding:9px 2px; min-height:60px; }
    .viewer-panel { bottom:calc(114px + env(safe-area-inset-bottom)); left:calc(8px + env(safe-area-inset-left)); right:calc(8px + env(safe-area-inset-right)); width:auto; max-width:none; max-height:calc(100% - 130px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius:14px; }
    .viewer-panel-body { padding:12px 16px 16px; }
    .viewer-status { top:calc(54px + env(safe-area-inset-top)); }
}
@media(max-height:450px) {
    .viewer-header { display:none; }
    .viewer-dock { flex-direction:row; gap:8px; bottom:calc(5px + env(safe-area-inset-bottom)); }
    .viewer-scene-title { max-width:25%; }
    .viewer-toolbar { width:auto; flex:1; }
    .viewer-toolbar button { min-height:44px; flex-direction:row; }
    .viewer-panel { bottom:calc(64px + env(safe-area-inset-bottom)); max-height:calc(100% - 76px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:reduce) { .viewer-panel { animation:none; } }
