/* V5.0.196 — Rail Spotify iFrame Controller Bridge states. Functional bridge polish only: the existing rail track play glyph can request playback from Spotify's official embed iFrame controller. Visual state only; no rail routing, Spotify OAuth/API/Web Playback SDK/token flow, mobile player, public shell radius, colour authority value, or jacket/sleeve geometry change. */ .bhk-v5-playerRail__spotifyControllerHost { position: absolute; inset: 0; z-index: 2; display: block; width: 100%; height: 100%; pointer-events: auto; } .bhk-v5-playerRail__spotifyControllerHost iframe { position: absolute; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; border: 0 !important; pointer-events: auto !important; } .bhk-v5-playerRail__spotifyTransportVisual.is-spotify-api-ready > iframe[data-bhk-v5-spotify-fallback-iframe] { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } .bhk-v5-playerRail__track.is-spotify-iframe-request .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-loaded .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-playing .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-blocked .bhk-v5-playerRail__trackPlay { opacity: 1; color: var(--v5-proof); border-color: color-mix(in srgb, var(--v5-line-strong) 62%, var(--v5-accent)); background: radial-gradient(circle at 50% 44%, color-mix(in srgb, var(--v5-proof) 8%, transparent), transparent 56%), linear-gradient(180deg, color-mix(in srgb, var(--v5-surface-3) 86%, var(--v5-accent)) 0%, color-mix(in srgb, var(--v5-page) 78%, #000) 100%); box-shadow: 0 0 0 1px color-mix(in srgb, var(--v5-line-strong) 23%, transparent), 0 0 16px color-mix(in srgb, var(--v5-accent) 24%, transparent), inset 0 1px 0 color-mix(in srgb, var(--v5-proof) 16%, transparent), inset 0 -8px 14px rgba(0,0,0,.26); } .bhk-v5-playerRail__track.is-spotify-iframe-request .bhk-v5-playerRail__trackPlay::before, .bhk-v5-playerRail__track.is-spotify-iframe-loaded .bhk-v5-playerRail__trackPlay::before, .bhk-v5-playerRail__track.is-spotify-iframe-playing .bhk-v5-playerRail__trackPlay::before { border-left-color: var(--v5-proof); filter: drop-shadow(0 0 7px color-mix(in srgb, var(--v5-signal) 34%, transparent)); } .bhk-v5-playerRail__track.is-spotify-iframe-playing .bhk-v5-playerRail__trackPlay { border-color: color-mix(in srgb, var(--v5-signal) 46%, var(--v5-line-strong)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--v5-signal) 28%, transparent), 0 0 18px color-mix(in srgb, var(--v5-signal) 22%, transparent), inset 0 1px 0 color-mix(in srgb, var(--v5-proof) 18%, transparent), inset 0 -8px 14px rgba(0,0,0,.26); } .bhk-v5-playerRail__track.is-spotify-iframe-blocked .bhk-v5-playerRail__trackPlay { opacity: .88; border-color: color-mix(in srgb, var(--v5-muted) 54%, var(--v5-line)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--v5-line) 26%, transparent), inset 0 1px 0 color-mix(in srgb, var(--v5-proof) 10%, transparent), inset 0 -8px 14px rgba(0,0,0,.30); } html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__spotifyControllerHost, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__spotifyControllerHost iframe, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__track.is-spotify-iframe-request .bhk-v5-playerRail__trackPlay, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__track.is-spotify-iframe-loaded .bhk-v5-playerRail__trackPlay, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__track.is-spotify-iframe-playing .bhk-v5-playerRail__trackPlay, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__track.is-spotify-iframe-blocked .bhk-v5-playerRail__trackPlay { color: #fff !important; background: #fff !important; background-color: #fff !important; background-image: none !important; border-color: #fff !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; } @media (prefers-reduced-motion: reduce) { .bhk-v5-playerRail__track.is-spotify-iframe-request .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-loaded .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-playing .bhk-v5-playerRail__trackPlay, .bhk-v5-playerRail__track.is-spotify-iframe-blocked .bhk-v5-playerRail__trackPlay { transition: none !important; } } /* V5.0.197 — Rail Spotify Controller Dark Theme Restore. Follow-up to V5.0.196: preserve the working Spotify iFrame Controller Bridge while keeping the rail embed mounted in a black/dark branded surface. The actual dark-theme request is made in JS via EmbedController.loadUri(..., 'dark'); this CSS only keeps the host/gasket from flashing light surfaces. No iframe clipping, scaling, masking, rail routing, Spotify OAuth/API/SDK, mobile player, colour authority value, public shell radius, or jacket/sleeve geometry change. */ .bhk-v5-playerRail__spotifyControllerHost { background: radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--v5-proof) 5%, transparent), transparent 32%), linear-gradient(180deg, color-mix(in srgb, var(--v5-page) 94%, #000) 0%, color-mix(in srgb, var(--v5-page) 88%, #000) 100%) !important; border-radius: var(--v5-spotify-gasket-radius, 12px) !important; overflow: visible !important; } .bhk-v5-playerRail__spotifyControllerHost iframe { background: color-mix(in srgb, var(--v5-page) 92%, #000) !important; border-radius: var(--v5-spotify-gasket-radius, 12px) !important; } html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__spotifyControllerHost, html[data-bhk-v5-mode="default-white"] .bhk-v5-playerRail__spotifyControllerHost iframe { background: #fff !important; background-color: #fff !important; background-image: none !important; border-color: #fff !important; box-shadow: none !important; filter: none !important; }