:root{color-scheme:dark;--bg:#111213;--card:#1b1d1f;--line:#ffffff19;--ink:#faf4ee;--muted:#b4aaa2;--lime:#ff9a5d;--violet:#ffad7b}
body{background:radial-gradient(ellipse at 78% 9%,#7b392326,transparent 32%),radial-gradient(ellipse at 5% 53%,#5b362718,transparent 28%),var(--bg)}
::selection{background:#ff9a5d;color:#211b17}.shell{width:min(1320px,calc(100% - 80px))}
.topbar{height:104px;border-bottom:1px solid var(--line);gap:25px}.brand{gap:12px}.brand-mark{flex:none;width:49px;height:49px;object-fit:cover;object-position:50% 0;background:#211d1c;border:1px solid #ff9a5d80;border-radius:50%}
.brand b{font-size:24px;font-weight:700;letter-spacing:-.045em}.brand-orbit{font-weight:500}.brand small{font-size:12px;font-weight:500}.brand .brand-radio{font-size:7px;letter-spacing:.19em;margin-top:6px;color:var(--muted)}
.topbar nav{color:#d5cbc3;font-size:12px;gap:28px}.topbar nav>a,.nav-button{padding:11px 0}.topbar nav>a:first-child{color:var(--lime)}.small-dot{background:var(--lime);width:5px;height:5px}
.identity{border:1px solid #ffffff26;background:#ffffff06;font-weight:500;padding:12px 17px;font-size:11px;color:var(--ink)}.identity span{color:var(--lime)}
.radio-section{grid-template-columns:1fr 1.12fr;gap:50px;padding:54px 0 48px;align-items:center}.eyebrow{font-size:9px;font-weight:600;letter-spacing:.13em;color:var(--muted)}.line{height:2px;width:24px;background:var(--lime)}
.radio-section h1{font-size:clamp(53px,6.35vw,92px);font-weight:600;line-height:1.03;letter-spacing:-.067em;margin:35px 0 26px}
em{font-family:'Space Grotesk',Arial,sans-serif;font-weight:600;font-style:normal;letter-spacing:-.065em}h1 em{color:var(--lime)}.hero-copy>p{color:var(--muted);font-size:16px;line-height:1.85}
.text-link{font-size:11px;font-weight:600;border:1px solid #ffffff2b;background:#ffffff05;border-radius:30px;padding:13px 20px;margin-top:20px;gap:32px}.text-link span{color:var(--lime);font-size:18px}.hero-caption{font-size:7px;letter-spacing:.09em;color:#bba898;margin-top:38px;gap:14px}
.player-card{position:relative;padding:0;border:0;border-radius:0;background:none;box-shadow:none;min-width:0}.player-top{padding:0 9px;position:relative;z-index:2}.status-pill{border:1px solid #ffffff26;color:var(--muted);font-size:8px;background:#191b1d;padding:8px 12px;letter-spacing:.12em}
.status-pill.online{background:#ff9a5d16;color:#ffad7b;border-color:#ff9a5d44}.status-pill.online i{background:#ff9a5d;box-shadow:0 0 10px #ff9a5d66}.signal-bars i{background:#ff9a5d;width:3px}
.mascot-art{position:relative;isolation:isolate;margin:8px -20px 0;height:395px;min-height:0;display:flex;align-items:center;justify-content:center;overflow:visible;background:radial-gradient(ellipse at 50% 70%,#9c4c2826,transparent 65%)}
.mascot-dj{width:100%;height:100%;display:block;max-height:none;object-fit:contain;object-position:center;transform-origin:50% 85%;filter:drop-shadow(0 20px 15px #0005)}
.mascot-sticker{position:absolute;right:10px;top:15px;z-index:2;background:#fff1e4;color:#33251c;border:0;border-radius:12px;padding:12px 15px;font:700 9px/1.4 'Space Grotesk',Arial,sans-serif;transform:rotate(5deg);box-shadow:0 8px 25px #0004}
.mascot-sticker:after{content:'';position:absolute;left:17px;bottom:-6px;width:12px;height:12px;background:#fff1e4;transform:rotate(45deg)}
.radio-frequency{position:absolute;bottom:6px;left:10px;font:600 6px 'Space Grotesk',sans-serif;letter-spacing:.12em;color:#d6a98a;background:#111213aa;padding:5px 7px;border-radius:5px}
.playing .mascot-dj{animation:radio-bob 3.5s ease-in-out infinite}@keyframes radio-bob{50%{transform:translateY(-3px) rotate(-.3deg)}}
.player-console{position:relative;z-index:3;border:1px solid #ffffff1f;border-radius:20px;padding:20px 22px;background:linear-gradient(120deg,#2c2827,#1c1e20);box-shadow:0 15px 40px #0003;margin-top:8px}
.now-playing h2{font-weight:600;font-size:24px;margin:9px 0 5px}.now-playing p{color:var(--muted);font-size:10px}.now-playing .eyebrow{font-size:7px;color:#ffd0b3}
.player-controls{border-top:1px solid var(--line);margin-top:18px;padding-top:17px;gap:16px}.play-button{background:var(--lime);color:#281b12;border:0;font-weight:700;padding:13px 19px;font-size:11px;box-shadow:0 4px 20px #ff9a5d13}.volume{color:var(--muted)}.volume input{accent-color:var(--lime);width:64px}.listeners{color:var(--muted);font-size:9px}
.section-divider{background:#ffffff03;border:1px solid var(--line);border-radius:12px;padding:16px 23px;color:#d1c2b7;font-size:8px;letter-spacing:.12em}.divider-symbol{color:var(--lime);font-size:20px}
.community{padding:60px 0 65px}.section-heading h2{font-size:46px;font-weight:600;line-height:1.06}.section-heading h2 em{color:var(--lime)}.section-heading>p{color:var(--muted);font-size:12px;max-width:285px;line-height:1.85}
.live-layout{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:25px}.stage-panel,.chat-panel{background:#191b1d;border:1px solid #ffffff1c;border-radius:22px;overflow:hidden;box-shadow:0 12px 40px #0002}
.panel-heading{padding:20px 23px;background:#202022;border-bottom:1px solid var(--line)}.panel-heading h3{font-weight:600;font-size:14px}.panel-heading .subtle{font-size:9px;color:var(--muted)}.panel-heading .small-dot{background:var(--lime)}
.stage-grid{min-height:430px;padding:12px;gap:10px}.stage-empty{min-height:417px;padding:10px 20px 25px;background:radial-gradient(ellipse at 50% 25%,#7539233b,transparent 72%),#151617;border:1px solid #ffffff0c;border-radius:14px;color:var(--ink);overflow:hidden}
.stage-scene{position:relative;width:min(100%,480px);height:235px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}.stage-mascot{width:100%;height:100%;object-fit:contain;background:none;border-radius:0;margin:0;filter:drop-shadow(0 10px 10px #0003)}
.stage-bubble{position:absolute;left:0;top:16px;z-index:1;background:#fff1e4;color:#33251c;border:0;border-radius:12px;padding:11px 13px;font:700 9px/1.4 'Space Grotesk',sans-serif;transform:rotate(-5deg);box-shadow:0 8px 20px #0003}.stage-bubble:after{content:'';position:absolute;right:14px;bottom:-6px;width:12px;height:12px;background:#fff1e4;transform:rotate(45deg)}
.stage-scene-label{position:absolute;right:4px;bottom:0;font:600 6px 'Space Grotesk',sans-serif;color:#d6a98a;letter-spacing:.12em}.stage-empty h3{font-weight:600;font-size:23px;margin:5px 0 10px;letter-spacing:-.03em}.stage-empty p{font-size:11px;line-height:1.8;color:var(--muted);margin-bottom:21px}
.button{border:1px solid #ffffff2b;font-size:10px;font-weight:600;box-shadow:none;padding:12px 18px}.light{background:var(--lime);color:#281b12;border-color:var(--lime)}.outline{color:var(--ink);background:#ffffff04;border-color:#ffffff26}
.icon-button{background:#ffffff04;color:var(--ink);border:1px solid #ffffff26;padding:9px 12px;font-weight:500}.stage-actions{padding:7px 20px 3px;gap:8px}.panel-note{font-size:9px;color:var(--muted);line-height:1.8}.stage-tile{background:#222223;border:1px solid #ffffff15;border-radius:12px}.stage-tile.host-tile{border-color:#ff9a5d66;height:330px}.tile-avatar{color:var(--lime)}.tile-label{color:var(--ink);background:#151617e6}.tile-role{color:var(--lime)}
.chat-panel .panel-heading{background:#202022}.chat-panel .panel-heading h3 span{color:var(--lime)}.chat-panel{max-height:735px}.chat-messages{min-height:410px;padding:18px 20px;scrollbar-color:#5e4c40 transparent}.chat-welcome{height:365px;position:relative}
.chat-welcome img{width:128px;height:128px;object-fit:cover;object-position:50% 0;border-radius:50%;background:radial-gradient(#573524,#211d1c);border:1px solid #ff9a5d66;box-shadow:0 10px 35px #0002}.chat-welcome h4{font-size:20px;font-weight:600;margin:22px 0 9px}.chat-welcome p{font-size:11px;line-height:1.85}
.chat-welcome:after{content:'HAI, ZI!';position:absolute;right:0;top:64px;background:#fff1e4;color:#33251c;padding:8px 10px;font:700 8px 'Space Grotesk',sans-serif;transform:rotate(6deg);border-radius:8px;box-shadow:0 5px 20px #0003}
.chat-message{background:#ffffff06;border:1px solid #ffffff0a;border-radius:11px;padding:10px 12px;margin-bottom:12px;font-size:12px}.message-heading b,.message-heading .host-name{color:#ffc49c;font-size:10px}.message-heading time{color:var(--muted)}.message-text{color:var(--ink)}.message-tools button{color:#bbaba0;font-size:9px;min-height:22px}
.chat-form{border:1px solid #ffffff29;padding:8px 8px 8px 15px;background:#11121366}.chat-form input{color:var(--ink);font-size:11px}.chat-form input::placeholder{color:#a89b90}.chat-form button{background:var(--lime);color:#281b12;flex:none}.chat-join{color:var(--lime);font-size:11px;font-weight:500;margin-top:15px}
.studio{border-top:1px solid var(--line);padding-top:48px}.studio-box,.library{background:#1b1d1f;border:1px solid #ffffff1c;border-radius:19px;box-shadow:0 12px 35px #0002;padding:27px}.studio-box:first-child{background:linear-gradient(125deg,#36271f,#1b1d1f 75%)}.studio h3{font-size:25px;font-weight:600}.studio-box>p{color:var(--muted);font-size:12px}.meter{background:#44362e;height:6px}.meter i{background:var(--lime)}.guest-request{border-bottom:1px solid var(--line);padding-bottom:14px}.guest-request>span{font-size:12px}.track-row{border-top:1px solid var(--line)}.track-number{color:var(--muted)}.track-info strong{font-size:12px;font-weight:500}.track-info small{color:var(--muted);font-size:9px}.track-row button{background:#ff9a5d14;color:#ffc49c;border:1px solid #ff9a5d36}.track-row button.disabled-track{background:#ffffff03;color:var(--muted);border-color:var(--line)}
footer{border-top:1px solid var(--line);padding:30px 0 36px}footer .brand-mark{width:40px;height:40px}footer .brand b{font-size:20px}footer p{font-size:11px;color:var(--muted)}footer>a:last-child{font-size:8px;color:#d1c2b7}
dialog{background:linear-gradient(145deg,#29231f,#1b1d1f 60%);border:1px solid #ffffff26;border-radius:22px;box-shadow:0 25px 100px #0008;padding:33px}dialog::backdrop{background:#080909c9;backdrop-filter:blur(8px)}dialog h2{font-weight:600}dialog h2 em{color:var(--lime)}dialog label{color:#d8c8bc;font-weight:500;font-size:11px}dialog input{background:#11121388;border:1px solid #ffffff26;color:var(--ink);padding:13px 12px}.close-dialog{color:var(--muted)}.form-error{color:#ffb3a4}.toast{background:#ffb782;color:#281b12;border:1px solid #ffd5b5;box-shadow:0 12px 40px #0004}
a:hover,.nav-button:hover{color:var(--lime)}button:hover:enabled,.button:hover{filter:brightness(1.08)}button:active:enabled,.button:active{transform:translateY(1px)}button:disabled{opacity:.45}:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
@media(max-width:1100px){.shell{width:calc(100% - 48px)}.radio-section{gap:32px;grid-template-columns:1fr 1.07fr}.topbar nav{gap:19px}.brand b{font-size:22px}.mascot-art{height:340px;margin-left:-12px;margin-right:-12px}.mascot-sticker{font-size:8px;padding:10px}.player-console{padding:18px}.player-controls{gap:11px}.volume input{width:45px}.listeners{font-size:8px}.live-layout{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.section-heading h2{font-size:40px}.section-heading>p{max-width:230px}.stage-bubble{font-size:8px}}
@media(max-width:760px){.shell{width:calc(100% - 36px)}.topbar{display:grid;grid-template-columns:1fr auto;height:117px;padding:17px 0 12px;gap:8px 14px}.topbar nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:29px;font-size:11px}.topbar nav>a:first-child{display:inline}.topbar .identity{grid-column:2;grid-row:1;padding:8px 11px}.brand b{font-size:21px}.brand-mark{width:43px;height:43px}.brand .brand-radio{font-size:6px}
.radio-section{grid-template-columns:minmax(0,1fr);padding:35px 0 35px;gap:29px}.radio-section h1{font-size:clamp(43px,11.8vw,70px);margin:29px 0 21px}.hero-copy{padding:0}.hero-copy>p{font-size:13px;line-height:1.8}.hero-caption{font-size:6px;margin-top:28px}.text-link{font-size:10px;padding:12px 17px;margin-top:14px}.player-top{padding:0 2px}.status-pill{font-size:7px}.mascot-art{height:285px;margin:10px -9px 0}.mascot-sticker{right:0;top:8px;font-size:7px;padding:9px}.radio-frequency{font-size:5px;bottom:1px}.player-console{padding:18px;border-radius:17px;margin-top:4px}.now-playing h2{font-size:22px}.now-playing p{font-size:9px}.player-controls{gap:10px;padding-top:16px;margin-top:17px}.play-button{font-size:10px;padding:12px 15px}.volume input{width:45px}.listeners{font-size:7px}
.section-divider{font-size:6px;letter-spacing:.08em;padding:12px 11px}.section-divider>span:last-child{font-size:6px}.community{padding:39px 0 43px}.community .section-heading{display:block;margin-bottom:26px}.section-heading h2{font-size:36px;margin-top:15px}.section-heading>p{font-size:11px;max-width:300px;line-height:1.8;margin:17px 0 0}.live-layout{grid-template-columns:minmax(0,1fr);gap:23px}.stage-panel,.chat-panel{border-radius:18px}.panel-heading{padding:17px 17px}.panel-heading h3{font-size:13px}.panel-heading .subtle{font-size:8px}.stage-grid{min-height:390px;padding:10px}.stage-empty{min-height:370px;padding:10px 12px 22px}.stage-scene{height:215px}.stage-bubble{font-size:7px;padding:8px;left:0;top:11px}.stage-scene-label{font-size:5px}.stage-empty h3{font-size:20px}.stage-empty p{font-size:10px}.stage-actions{padding:7px 15px 3px;gap:7px}.stage-actions .button{font-size:9px;padding:11px 13px}.stage-tile.host-tile{height:270px}.stage-tile{height:160px}.chat-panel{max-height:575px}.chat-messages{min-height:300px;max-height:360px}.chat-welcome{height:280px}.chat-welcome img{width:112px;height:112px}.chat-welcome h4{font-size:19px}.chat-welcome:after{top:43px;font-size:7px}.studio-grid{grid-template-columns:minmax(0,1fr)}.studio-box,.library{padding:21px}.studio h3{font-size:23px}.library-heading h3{font-size:21px}.library-heading{gap:10px}.upload-button{font-size:9px;min-width:102px;padding:11px 10px}.track-row{gap:9px}.track-info strong{font-size:11px}.track-info small{font-size:9px}.track-row button{font-size:9px;padding:8px 9px}footer{gap:15px}footer .brand b{font-size:18px}footer p{font-size:9px}footer>a:last-child{font-size:7px}}
@media(max-width:360px){.radio-section h1{font-size:39px}.brand b{font-size:19px}.brand-mark{width:40px;height:40px}.mascot-art{height:245px}.mascot-sticker{font-size:6px}.player-console{padding:16px}.play-button{padding:11px 13px}.volume input{width:31px}.player-controls{gap:8px}.listeners{font-size:6px}.section-heading h2{font-size:32px}.stage-scene{height:195px}.stage-bubble{font-size:6px}.stage-empty h3{font-size:18px}}
/* Central account actions keep their own full-width row at every screen size. */
.central-account-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.central-account-links .button{white-space:normal;text-align:center;font-size:12px;padding:10px 14px}
.topbar:has(#centralHeaderLinks:not([hidden])){height:auto;min-height:104px;flex-wrap:wrap;padding-top:17px;padding-bottom:12px}
#centralHeaderLinks{flex-basis:100%;justify-content:flex-end}
#memberZone>.button{margin:6px 8px 6px 0}
#memberZone p{overflow-wrap:anywhere}
#legacyAccountLogin{margin-top:16px}
#legacyAccountLogin summary{cursor:pointer;padding:10px 0}
@media(max-width:760px){#centralHeaderLinks{grid-column:1/-1;grid-row:3;justify-content:center}.topbar:has(#centralHeaderLinks:not([hidden])){min-height:117px}.central-account-links .button{flex:1 1 145px;min-width:0}#centralGuestLinks .button{flex-basis:100%}}