.dw-radio-card {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding: 14px;
  overflow: hidden;
  border: 1px solid #f6cf6966;
  border-radius: 18px;
  background: linear-gradient(145deg, #191108e8, #07130be8);
  box-shadow: inset 0 0 28px #0008, 0 12px 30px #0005;
  text-align: center;
}
.dw-radio-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 18%, #f6c35c20, transparent 54%); pointer-events: none; }
.dw-radio-card > * { position: relative; z-index: 1; }
.dw-radio-art-shell { position: relative; width: 100%; }
.dw-radio-card-art { width: 100%; height: auto; display: block; filter: drop-shadow(0 7px 10px #000a); }
.dw-radio-card h3 { margin: 0; color: #ffe89a; font-size: 1.06rem; }
.dw-radio-card p { margin: 0; color: #e4eadc; font-size: .76rem; line-height: 1.45; }
.dw-radio-card-status { color: #9fe374; font-size: .69rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.dw-radio-volume-lever-art { position: absolute; z-index: 5; inset: 0; width: 100%; height: 100%; object-fit: contain; transform: rotate(var(--dw-radio-volume-lever-angle, 0deg)); transform-origin: 18% 51%; transition: transform .2s cubic-bezier(.22, 1.5, .45, 1); pointer-events: none; user-select: none; }
.dw-radio-art-shell.is-adjusting-volume .dw-radio-volume-lever-art { transition: none; }
.dw-radio-volume-control { position: absolute; z-index: 8; left: 5%; top: 34%; width: 8.5%; min-width: 24px; height: 34%; min-height: 32px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: transparent; cursor: ns-resize; touch-action: none; }
.dw-radio-volume-control:focus-visible { outline: 2px solid #ffe06a99; outline-offset: 2px; background: #ffdf730d; }
.dw-radio-power, .dw-radio-next { position: absolute; z-index: 7; top: calc(40.064% - 1px); width: calc(10% + 1px); min-width: 34px; aspect-ratio: 1; display: grid; place-items: center; gap: 0; padding: 0; border: 2px solid #9ea5a4; border-radius: 50%; background: radial-gradient(circle at 38% 30%, #4b4f4e, #0c0e0d 62%, #000); color: #d6d9d7; box-shadow: inset 0 0 0 3px #181b1a, 0 3px 7px #000b; cursor: pointer; }
.dw-radio-power { left: calc(11.681% + 3px); isolation: isolate; }
.dw-radio-power::before { content: ""; position: absolute; z-index: 0; inset: -2px; padding: 2px; border-radius: inherit; background: conic-gradient(from -90deg, #ffda60 0 var(--dw-radio-volume-fill, 42%), transparent var(--dw-radio-volume-fill, 42%) 100%); opacity: 0; filter: drop-shadow(0 0 4px #ffce40cc); pointer-events: none; transition: opacity .16s ease; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; }
.dw-radio-power.is-on::before, .dw-radio-power:hover::before, .dw-radio-power:focus-visible::before { opacity: 1; }
.dw-radio-next { right: calc(11.681% + 3px); }
.dw-radio-power span, .dw-radio-next span { position: relative; z-index: 1; font-size: clamp(.85rem, 2.4vw, 1.45rem); line-height: 1; }
.dw-radio-power:hover, .dw-radio-power:focus-visible { outline: none; filter: brightness(1.2); }
.dw-radio-next:hover:not(:disabled), .dw-radio-next:focus-visible { border-color: #fff0a1; outline: none; filter: brightness(1.2); }
.dw-radio-power.is-on { color: #fff5bd; box-shadow: inset 0 0 0 3px #281f08, 0 0 13px #ffce40cc; }
.dw-radio-next.is-enabled { border-color: #ffda60; color: #fff5bd; box-shadow: inset 0 0 0 3px #281f08, 0 0 13px #ffce40cc; }
.dw-radio-next:disabled { opacity: .58; cursor: default; }
.dw-radio-dial-line { position: absolute; z-index: 4; top: 38%; left: 38.1%; width: 3px; height: 19%; border-radius: 99px; background: #ff2727; box-shadow: 0 0 4px #ff2222, 0 0 9px #ff4b3d; transform: translateX(-50%); transition: left .38s cubic-bezier(.2,.8,.2,1); pointer-events: none; }
.dw-radio-art-shell[data-station="0"] .dw-radio-dial-line { left: 38.1%; }
.dw-radio-art-shell[data-station="1"] .dw-radio-dial-line { left: 45.6%; }
.dw-radio-art-shell[data-station="2"] .dw-radio-dial-line { left: 52.9%; }
.dw-radio-art-shell[data-station="3"] .dw-radio-dial-line { left: 60.2%; }
.dw-radio-art-shell[data-station="4"] .dw-radio-dial-line { left: 68.1%; }
.dw-radio-station-buttons { position: absolute; z-index: 5; inset: 0; pointer-events: none; }
.dw-radio-station-buttons button { position: absolute; top: 62%; width: 6.3%; height: 6.375%; min-height: 0; padding: 0; overflow: hidden; border: 0; border-radius: 4px; background: transparent; box-shadow: none; cursor: pointer; pointer-events: auto; transform: translate(-25px, -11px); }
.dw-radio-station-buttons button::after { content: ""; position: absolute; inset: 27.5% 22.25%; border-radius: 45%; background: radial-gradient(ellipse at center, #fff76e 0%, #ffe41f 32%, #ffc400 58%, #b66e00 80%, transparent 100%); box-shadow: inset 0 0 3px #fffbd5, inset 0 0 7px #ffd900, 0 0 3px #ffc400; opacity: 0; transition: opacity .18s ease; pointer-events: none; }
.dw-radio-card .dw-radio-station-buttons button { transform: translate(-11px, -5px); }
.dw-radio-station-buttons button:nth-child(1) { left: 34.95%; }
.dw-radio-station-buttons button:nth-child(2) { left: 42.45%; }
.dw-radio-station-buttons button:nth-child(3) { left: 49.75%; }
.dw-radio-station-buttons button:nth-child(4) { left: 57.05%; }
.dw-radio-station-buttons button:nth-child(5) { left: 64.95%; }
.dw-radio-player-art .dw-radio-station-buttons button { top: 60.915%; transform: none; }
.dw-radio-player-art .dw-radio-station-buttons button:nth-child(1) { left: 33.269%; }
.dw-radio-player-art .dw-radio-station-buttons button:nth-child(2) { left: 40.562%; }
.dw-radio-player-art .dw-radio-station-buttons button:nth-child(3) { left: 47.985%; }
.dw-radio-player-art .dw-radio-station-buttons button:nth-child(4) { left: 55.322%; }
.dw-radio-player-art .dw-radio-station-buttons button:nth-child(5) { left: 62.527%; }
.dw-radio-station-buttons button:hover, .dw-radio-station-buttons button:focus-visible { outline: none; background: #ffdf7310; }
.dw-radio-art-shell.is-powered .dw-radio-station-buttons button.is-active::after { opacity: 1; }

body.dw-radio-page { min-height: 100vh; margin: 0; overflow: hidden; background: #030704; color: #f4f3e4; font-family: Inter, system-ui, sans-serif; }
.dw-radio-player { min-height: 100vh; display: grid; grid-template-rows: auto minmax(0, 1fr); background: radial-gradient(circle at 50% -10%, #77511a55, transparent 42%), #030704; }
.dw-radio-toolbar { position: relative; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 16px; border-bottom: 1px solid #f6cf6940; background: #08100bd9; box-shadow: 0 4px 18px #0008; }
.dw-radio-brand { min-width: 0; display: flex; align-items: center; gap: 10px; }
.dw-radio-brand img { width: 42px; height: 42px; object-fit: contain; }
.dw-radio-brand strong, .dw-radio-brand small { display: block; }
.dw-radio-brand strong { color: #ffe288; }
.dw-radio-brand small { overflow: hidden; color: #b8c6b3; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.dw-radio-toolbar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.dw-radio-toolbar button, .dw-radio-toolbar a, .dw-radio-tune {
  min-height: 36px; box-sizing: border-box; padding: 8px 12px; border: 1px solid #f6cf6955; border-radius: 999px; background: #132218; color: #f5f4e8; font: inherit; font-size: .76rem; font-weight: 800; text-decoration: none; cursor: pointer;
}
.dw-radio-toolbar button.is-active { background: #d9b755; color: #15200e; }
.dw-radio-stage { position: relative; min-height: 0; overflow: auto; }
.dw-radio-console { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; transition: opacity .35s, visibility .35s; }
.dw-radio-console-inner { width: min(780px, 94vw); display: grid; gap: 18px; justify-items: center; }
.dw-radio-player-art { width: 100%; }
.dw-radio-console-art { width: 100%; height: auto; display: block; filter: drop-shadow(0 20px 30px #000c); }
.dw-radio-now-playing { display: grid; gap: 7px; text-align: center; }
.dw-radio-now-playing small { color: #9fe374; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.dw-radio-now-playing h1 { margin: 0; color: #ffe394; font-family: "Permanent Marker", cursive; font-size: clamp(1.65rem, 5vw, 3rem); font-weight: 400; }
.dw-radio-now-playing p { max-width: 680px; margin: 0; color: #d3ddce; line-height: 1.55; }
.dw-radio-project-link { color: #ffe38a; font-size: .86rem; font-weight: 900; text-decoration: underline; text-underline-offset: 3px; }
.dw-radio-project-link:hover, .dw-radio-project-link:focus-visible { color: #bdf58c; }
.dw-radio-project-link[hidden] { display: none; }
.dw-radio-dogg-track { width: min(680px, 92vw); box-sizing: border-box; display: grid; justify-items: center; gap: 7px; margin-top: 5px; padding: 12px 16px; border: 1px solid #efc65b55; border-radius: 15px; background: #030805b8; box-shadow: inset 0 0 22px #d0a63212; }
.dw-radio-dogg-track[hidden] { display: none; }
.dw-radio-dogg-track > span { color: #9fe374; font-size: .64rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; }
.dw-radio-dogg-track strong { color: #fff1b8; font-size: clamp(.82rem, 2vw, 1rem); line-height: 1.35; }
.dw-radio-dogg-track > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.dw-radio-dogg-track a,
.dw-radio-dogg-track button { padding: 7px 11px; border: 1px solid #f2cf6855; border-radius: 999px; background: #172313; color: #ffe89a; font: 850 .7rem/1 Inter, ui-sans-serif, system-ui, sans-serif; text-decoration: none; cursor: pointer; }
.dw-radio-dogg-track a:hover,
.dw-radio-dogg-track a:focus-visible,
.dw-radio-dogg-track button:hover,
.dw-radio-dogg-track button:focus-visible { border-color: #fff0a1; outline: none; background: #293f20; }
.dw-radio-now-playing > audio { display: none; }
.dw-radio-stok-track { width: min(680px, 92vw); box-sizing: border-box; display: grid; justify-items: center; gap: 8px; margin-top: 5px; padding: 12px 16px; border: 1px solid #efc65b55; border-radius: 15px; background: #030805b8; box-shadow: inset 0 0 22px #d0a63212; }
.dw-radio-stok-track[hidden] { display: none; }
.dw-radio-stok-track > span { color: #9fe374; font-size: .64rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; }
.dw-radio-stok-track strong { color: #fff1b8; font-size: clamp(.82rem, 2vw, 1rem); line-height: 1.35; }
.dw-radio-youtube-player { width: min(480px, 100%); aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid #f2cf6855; border-radius: 12px; background: #000; box-shadow: 0 8px 22px #0009; }
.dw-radio-youtube-player iframe { width: 100%; height: 100%; display: block; border: 0; }
.dw-radio-stok-track button { padding: 7px 11px; border: 1px solid #f2cf6855; border-radius: 999px; background: #172313; color: #ffe89a; font: 850 .7rem/1 Inter, ui-sans-serif, system-ui, sans-serif; cursor: pointer; }
.dw-radio-stok-track button:hover, .dw-radio-stok-track button:focus-visible { border-color: #fff0a1; outline: none; background: #293f20; }
.dw-radio-orb-view { position: absolute; inset: 0; visibility: hidden; opacity: 0; background: #000; transition: opacity .35s, visibility .35s; }
.dw-radio-orb-view iframe { width: 100%; height: 100%; display: block; border: 0; background: #000; }
.dw-radio-player[data-view="orb"] .dw-radio-console { visibility: hidden; opacity: 0; pointer-events: none; }
.dw-radio-player[data-view="orb"] .dw-radio-orb-view { visibility: visible; opacity: 1; }
.dw-radio-orb-status { position: absolute; z-index: 4; top: 14px; left: 16px; margin: 0; padding: 7px 10px; border-radius: 10px; background: #07100dcc; color: #b8c6b3; font-size: .7rem; font-weight: 700; box-shadow: 0 5px 16px #0008; pointer-events: none; }
.dw-radio-activation-note { position: absolute; z-index: 4; top: 14px; left: 50%; width: min(620px, calc(100% - 32px)); box-sizing: border-box; transform: translateX(-50%); margin: 0; padding: 10px 14px; border: 1px solid #ffe17888; border-radius: 12px; background: #07100de8; color: #fff6ce; font-size: .78rem; line-height: 1.45; text-align: center; box-shadow: 0 8px 24px #0009; pointer-events: none; }
.dw-radio-activation-note small { display: block; margin-top: 5px; color: #cfe7f0; font-size: .85em; font-weight: 700; }
.dw-radio-activation-note[hidden] { display: none; }
.dw-radio-credit { position: absolute; z-index: 3; right: 12px; bottom: 12px; max-width: min(420px, calc(100% - 24px)); padding: 8px 12px; border-radius: 12px; background: #000b; color: #eef1e8; font-size: .68rem; line-height: 1.35; pointer-events: none; }

.dw-draw-stage .dw-smoke-orb { position: absolute; z-index: 8; left: 50%; top: 47%; width: clamp(116px, 21%, 245px); aspect-ratio: 1; transform: translate(-50%, -50%) scale(.35); overflow: visible; opacity: 0; pointer-events: none; filter: drop-shadow(0 0 18px #b7e9ff88) drop-shadow(0 18px 28px #000c); transition: opacity .45s, transform .65s ease; }
.dw-smoke-orb img { width: 100%; height: 100%; display: block; object-fit: contain; transform: scale(1.9); animation: dw-orb-float 7s ease-in-out infinite, dw-orb-pulse 4.5s ease-in-out infinite; }
.dw-draw-smoking-session.is-orb-mode .dw-smoke-orb { opacity: .92; transform: translate(-50%, -50%) scale(1); }
.dw-draw-smoking-session.is-orb-mode.is-running .dw-smoke-orb { opacity: .7; transform: translate(-50%, -50%) scale(.72); }
.dw-draw-smoking-session.is-orb-mode .dw-smoke-session-copy { top: 70%; width: min(42%, 370px); }
.cb2-lounge-window-controls [data-cb2-lounge-orb-mode].is-active { border-color: #bcecff; background: #315167; color: #fff; box-shadow: 0 0 18px #8bdfff66; }
@keyframes dw-orb-float { 0%,100% { translate: 0 -5%; rotate: -2deg; } 50% { translate: 0 6%; rotate: 2deg; } }
@keyframes dw-orb-pulse { 0%,100% { filter: brightness(.92) saturate(1); } 50% { filter: brightness(1.16) saturate(1.18); } }
@media (prefers-reduced-motion: reduce) { .dw-smoke-orb img { animation: none; } }
@media (max-width: 720px) {
  .dw-radio-toolbar { align-items: flex-start; }
  .dw-radio-brand small { max-width: 180px; }
  .dw-radio-toolbar-actions { max-width: 170px; }
  .dw-radio-toolbar button, .dw-radio-toolbar a { padding: 7px 9px; font-size: .65rem; }
  .dw-radio-console { padding: 14px; }
  .dw-radio-power, .dw-radio-next { min-width: 28px; }
  .dw-radio-orb-status { top: 8px; left: 8px; }
  .dw-radio-activation-note { top: 48px; width: calc(100% - 16px); }
  .dw-smoke-orb { width: 150px; }
}