.vr360-preview { position: relative; width: min(100%, 900px); max-width: 100%; aspect-ratio: 16 / 9; height: auto; max-height: 520px; margin: 1rem 0; background: #111; border-radius: .75rem; overflow: hidden; }
.vr360-preview > canvas { left: 0; top: 0; display: block; }
@media (max-width: 520px) { .vr360-preview { aspect-ratio: 4 / 3; } }
.vr360-hotspot { display: inline-flex; align-items: center; gap: .35rem; max-width: min(14rem, calc(100vw - 2rem)); min-width: 44px; min-height: 44px; overflow: hidden; border: 0; border-radius: 999px; padding: .4rem .65rem; background: #fff; color: #222; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.vr360-hotspot[data-vr-hotspot-type="SCENE_LINK"]::before { content: '→'; font-size: 1.1rem; line-height: 1; }
.vr360-hotspot-list { display: grid; gap: .75rem; margin: .75rem 0; }
.vr360-hotspot-form { display: grid; gap: .75rem; margin-top: .75rem; padding: .75rem; border: 1px solid var(--border, #d7dce5); border-radius: .5rem; }
.vr360-scene-card { display: grid; gap: .75rem; }
.vr360-scene-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.vr360-scene-summary { min-width: 0; }
.vr360-scene-summary h3, .vr360-scene-summary p { margin: 0; }
.vr360-scene-summary p { color: #5e6d76; font-size: .85rem; }
.vr360-scene-card[data-expanded="false"][data-previewable="true"] [data-edit], .vr360-scene-card[data-expanded="false"][data-previewable="true"] [data-delete] { display: none; }
.vr360-scene-card[data-expanded="false"] [data-scene-body] { display: none; }
@media (max-width: 520px) { .vr360-scene-header { align-items: flex-start; } .vr360-scene-header .actions { width: 100%; } .vr360-scene-header .actions button { flex: 1 1 auto; } }