/* A black stage gives the prismatic pass its light and depth. */
.pass.page {inset:0;background:#020408;color:#f4fff6;overflow:hidden;}
.pass-display {position:absolute;inset:0;}
#pass {touch-action:none;cursor:grab;}
#pass.pass-dragging,#pass.pass-dragging #passCanvas {cursor:grabbing;}
#passCanvas {display:block;width:100%;height:100%;touch-action:none;cursor:grab;}
#passCanvas:active {cursor:grabbing;}
.pass-fallback-art {display:none;position:absolute;width:auto;height:61%;max-width:70%;object-fit:contain;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-5deg);border-radius:14px;box-shadow:0 0 80px #a4ffd925;}
.pass-fallback .pass-fallback-art {display:block;}
.pass-fallback #passCanvas,.pass-fallback #profilePassCanvas {display:none;}
.pass-caption {position:absolute;left:35px;bottom:122px;color:#8da399;pointer-events:none;}
.pass-caption h1 {font-size:14px;font-weight:500;letter-spacing:.025em;margin:0 0 7px;color:#e1fce9;}
.pass-caption p {font-size:10px;margin:0;letter-spacing:.045em;}

.pass-edition {position:absolute;right:34px;bottom:126px;font-size:10px;text-align:right;color:#90a197;line-height:1.8;}
body[data-page='0'] .page-counter {color:#a7b3ac;}
body[data-page='0'] .topbar,body[data-page='0'] .bottom {background:transparent;}
body[data-page='0'] .bottom {background:#08090a;border:1px solid #ffffff20;}
body[data-page='0'] .wordmark,body[data-page='0'] .menu-button {background:#08090a;border:1px solid #ffffff1c;}
.fan-panel {width:382px;background:#090a0c;color:#f4fff6;border-color:#ffffff22;box-shadow:0 25px 80px #0009,0 0 0 5px #ffffff06;max-height:calc(100dvh - 225px);}
.fan-panel-header {margin-bottom:12px;color:#b7c9bf;}
.fan-panel-header .mono {font-size:10px;}
.fan-status i {border-color:#ddffa0;}
.profile-pass-stage {height:190px;position:relative;overflow:hidden;border:1px solid #d1ffde22;border-radius:8px;background:#020408;}
#profilePassCanvas {width:100%;height:100%;display:block;}
.profile-pass-stage .pass-fallback-art {height:88%;top:50%;}
.profile-pass-label {position:absolute;left:13px;bottom:12px;font-size:9px;color:#c4ddcd;}
.fan-intro h2 {font-size:34px;margin:19px 0 10px;letter-spacing:-.04em;}
.fan-intro p {font-size:16px;color:#b2c4b8;line-height:1.4;}
.fan-benefits {gap:7px 12px;margin:16px 0 20px;font-size:12px;color:#d8ebdf;}
.fan-benefits li:before {color:#eaff7b;}
.page-menu .fan-signup {background:#eaff7b;border-color:#eaff7b;font-size:12px;padding:17px 14px;}
.page-menu .fan-signup:hover {background:#b9ffe2;border-color:#b9ffe2;}
.fan-login,.page-menu .fan-login a {font-size:12px;}
.fan-destination {font-size:9px;color:#8d9f93;margin-top:9px;}
.page-menu .fan-utilities button,.page-menu .fan-utilities .film-toggle {font-size:8px;color:#a9b8ad;}
.page-menu .fan-utilities .film-toggle span {color:#eaff7b;}
.slide-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.slide-thumb:nth-child(4) {--panel:3;}
.mini-pass {display:grid;place-items:center;padding:15px;background:radial-gradient(ellipse at center,#23302b,#030807 75%);}
.mini-pass img {width:auto;max-width:80%;height:100%;max-height:130px;object-fit:contain;filter:none;transform:rotate(-9deg);border-radius:5px;box-shadow:0 0 20px #aaffbf30;}
.mini-world>div,.mini-joy>div {font-size:15px;padding:10px;}
@media(max-width:900px){.pass-caption,.pass-edition {display:none;}.slide-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.mini-pass img{max-height:150px}.mini-world>div,.mini-joy>div{font-size:18px;}}
@media(max-width:700px){.fan-panel{width:350px;max-height:calc(100dvh - 198px);}.profile-pass-stage{height:170px;}.fan-intro h2{font-size:30px;}.slide-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}#overviewDialog{padding:20px;}.mini{aspect-ratio:1.25;padding:0;}.mini-pass{padding:12px;}.mini-pass img{max-height:115px;}.mini-world>div,.mini-joy>div{font-size:13px;padding:7px;}.mini-power{padding:9px;}.mini-cards span{font-size:19px;}.mini-cards span:nth-child(4){font-size:12px;}.slide-thumb>.mono{font-size:7px;}.dialog-header h2{font-size:34px;}}
@media(max-height:700px){.profile-pass-stage{height:145px;}.fan-intro h2{font-size:28px;margin-top:15px;}.fan-intro p{font-size:15px;}.fan-benefits{margin:12px 0;}}
@media print {.pass.page{display:none!important}}

/* Keep joining and account controls visible when the viewport is short. */
.fan-panel {display:flex;flex-direction:column;overflow:hidden;}
.fan-panel[hidden] {display:none;}
.fan-panel-body {min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#41564a transparent;}
.fan-panel-header,.fan-actions,.fan-utilities {flex-shrink:0;}
.fan-actions {padding-top:8px;background:#090a0c;}
.fan-panel .fan-utilities {margin-top:14px;padding-top:10px;}
.fan-panel .fan-utilities button {min-height:24px;}

/* A close crop of the same live 3D object, with direct and keyboard interaction. */
.profile-pass-stage {height:180px;flex-shrink:0;}
#profilePassCanvas {cursor:grab;touch-action:pan-y;outline-offset:-4px;}
#profilePassCanvas:active {cursor:grabbing;}
#profilePassCanvas:focus-visible {outline:2px solid #eaff7b;}
.profile-pass-stage .pass-fallback-art {width:94%;height:auto;max-width:none;top:13px;left:50%;transform:translateX(-50%) rotate(-4deg);border-radius:0;}
.fan-intro h2 {font-size:35px;line-height:1.05;letter-spacing:-.04em;margin:21px 0 12px;}
.fan-intro p {font-size:16px;line-height:1.45;margin:0 0 12px;color:#c0cec5;}
.fan-actions {padding-top:13px;}
.page-menu .fan-signup {font-size:12px;letter-spacing:0;min-height:53px;}
.page-menu .fan-signup:active {transform:translateY(1px);background:#d4ff9d;}
.fan-login {margin:14px 0 3px;}
.page-menu .sound-controls {gap:20px;padding-top:10px;margin-top:13px;min-height:48px;}
.page-menu .sound-toggle {display:flex;gap:8px;align-items:center;min-height:32px;color:#cad9d0;font-size:10px;white-space:nowrap;}
.sound-toggle svg {width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.sound-toggle .sound-waves {display:none;}
.sound-toggle[aria-pressed=true] .sound-waves {display:block;}
.sound-toggle[aria-pressed=true] .sound-cross {display:none;}
.sound-toggle[aria-pressed=true] #soundState {color:#eaff7b;}
#soundState {color:#86968c;font-size:9px;}
.sound-volume {display:flex;align-items:center;gap:9px;min-width:0;}
.sound-volume input {width:90px;min-width:50px;accent-color:#eaff7b;cursor:pointer;height:24px;}
.sound-volume output {font-size:9px;color:#a9b8ad;width:31px;text-align:right;}
.visually-hidden {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
@media(max-width:700px){.profile-pass-stage{height:170px}.fan-intro h2{font-size:30px}.fan-intro p{font-size:15px}.page-menu .sound-controls{gap:12px}.sound-volume input{width:75px}}
@media(max-height:700px){.profile-pass-stage{height:145px}.fan-intro h2{font-size:29px;margin:16px 0 10px}.fan-intro p{font-size:15px;margin-bottom:10px}}
@media(max-height:850px){.profile-pass-stage{height:115px}.fan-intro h2{font-size:29px;margin:14px 0 9px}.fan-intro p{font-size:14px;line-height:1.4;margin-bottom:8px}.fan-actions{padding-top:8px}}
.fan-panel-body {display:flex;flex-direction:column;}
.profile-pass-stage {flex:0 1 180px;min-height:90px;height:auto;}
#profilePassCanvas {position:absolute;inset:0;}
.fan-intro {flex-shrink:0;}

/* Neutral near-black navigation across every channel. */
body[data-page] .wordmark,body[data-page] .menu-button,body[data-page] .bottom{background:#08090a;}
.fan-panel,.fan-actions{background:#090a0c;}

body[data-page="0"] .page-counter{display:none;}

/* Persistent controls remain outside the room treatment. */

#passCanvas:focus {outline:none;}
#passCanvas:focus-visible {outline:1px solid #ffffff50;outline-offset:-6px;}
body.analog-on.pass-gpu-post[data-page="0"] main {filter:none;}