:root { color-scheme: dark; font-family: "Nunito Sans", Arial, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; overflow: hidden; background: #1b070a; }
button, a { font: inherit; }
.tour-shell, #panorama { width: 100vw; height: 100vh; }
#panorama { background: #350f15; }
.topbar { position: fixed; z-index: 4; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; align-items: flex-start; padding: 28px 32px; pointer-events: none; background: linear-gradient(180deg, rgba(16, 4, 6, .52), transparent); }
.brand { display: inline-flex; flex-direction: column; color: #fff; text-decoration: none; letter-spacing: .18em; line-height: 1; }
.brand-mark { font-weight: 800; font-size: 1.18rem; }
.brand-subtitle { margin-top: 4px; font-size: .44rem; font-weight: 700; letter-spacing: .29em; }
.project-name { color: #fff; font-size: .75rem; font-weight: 800; letter-spacing: .18em; text-align: right; }
.project-name span { display: block; color: #ff0230; margin-top: 4px; }
.intro-card { position: fixed; z-index: 3; left: 32px; bottom: 38px; width: min(310px, calc(100vw - 130px)); color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.55); pointer-events: none; }
.eyebrow { margin: 0 0 7px; font-size: .67rem; font-weight: 800; letter-spacing: .18em; color: #ff516c; }
.intro-card h1 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.3rem); line-height: 1.05; }
.intro-card p:last-child { margin: 9px 0 0; font-size: .93rem; line-height: 1.35; }
.scene-picker { position: fixed; z-index: 6; right: 32px; bottom: 38px; width: min(264px, calc(100vw - 64px)); }
.scene-toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 15px 18px; color: #fff; background: #350f15; border: 1px solid rgba(255,255,255,.22); border-radius: 5px; box-shadow: 0 10px 30px rgba(0,0,0,.28); font-weight: 800; text-align: left; cursor: pointer; }
.chevron { width: 9px; height: 9px; border-right: 2px solid white; border-bottom: 2px solid white; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.scene-toggle[aria-expanded="true"] .chevron { transform: rotate(225deg) translate(-2px,-2px); }
.scene-list { position: absolute; bottom: calc(100% + 8px); width: 100%; padding: 6px; background: rgba(53,15,21,.96); border: 1px solid rgba(255,255,255,.18); border-radius: 5px; box-shadow: 0 14px 32px rgba(0,0,0,.35); }
.scene-option { display: block; width: 100%; padding: 11px 12px; color: #fff; background: transparent; border: 0; border-radius: 3px; text-align: left; font-size: .9rem; font-weight: 700; cursor: pointer; }
.scene-option:hover, .scene-option:focus-visible, .scene-option.active { outline: none; background: #ff0230; }
.scene-arrows { position: fixed; z-index: 4; left: 50%; top: 50%; width: calc(100% - 52px); display: flex; justify-content: space-between; transform: translate(-50%,-50%); pointer-events: none; }
.scene-arrows button, .help-button { display: grid; place-items: center; color: #350f15; background: rgba(255,255,255,.78); border: 0; border-radius: 4px; box-shadow: 0 2px 12px rgba(0,0,0,.15); cursor: pointer; transition: background .16s ease, transform .16s ease; }
.scene-arrows button { width: 47px; height: 47px; font-size: 3rem; font-family: Arial, sans-serif; line-height: 0; padding-bottom: 5px; pointer-events: auto; }
.scene-arrows button:hover, .help-button:hover { background: #fff; transform: scale(1.05); }
.help-button { position: fixed; z-index: 6; right: 32px; top: 96px; width: 30px; height: 30px; font-weight: 800; }
.help-popover { position: fixed; z-index: 7; top: 133px; right: 32px; width: 245px; padding: 12px 14px; color: #fff; background: rgba(53,15,21,.94); border: 1px solid rgba(255,255,255,.2); border-radius: 5px; font-size: .82rem; line-height: 1.35; }
.pnlm-controls-container, .pnlm-about-msg, .pnlm-load-box { font-family: "Nunito Sans", Arial, sans-serif; }
.pnlm-fullscreen-toggle-button { border-radius: 4px 0 0 0; }
@media (max-width: 640px) { .topbar { padding: 20px; } .project-name { font-size: .61rem; } .intro-card { left: 20px; bottom: 24px; max-width: 218px; } .intro-card p:last-child { font-size: .78rem; } .scene-picker { right: 20px; bottom: 24px; width: 190px; } .scene-arrows { width: calc(100% - 24px); } .scene-arrows button { width: 40px; height: 40px; } .help-button { right: 20px; top: 77px; } .help-popover { right: 20px; top: 116px; } }