:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#080b11;color:#f7f9fc}
*{box-sizing:border-box}
body{min-height:100vh;margin:0;background:radial-gradient(circle at 12% 0,#14243b 0,transparent 32%),#080b11}
button{font:inherit}
header{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 24px;border-bottom:1px solid #263044;background:#0c111bcc}
.brand{display:flex;align-items:center;gap:10px;color:#f7f9fc;text-decoration:none;font-weight:900}.brand>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#53fc18,#9146ff);color:#061006;font-size:20px}
.viewer-account{display:flex;align-items:center;gap:12px;color:#a9b4c5;font-size:14px}.viewer-account form{margin:0}.viewer-account button,#refresh-channels{border:1px solid #36425a;border-radius:9px;padding:8px 11px;background:#151d2a;color:#eef3fb;cursor:pointer}.deck-drops-link,.sticker-rewards-link{border:1px solid #53fc1857;border-radius:9px;padding:8px 11px;color:#dfffd5;background:#142019;text-decoration:none;font-weight:900}.deck-drops-link:hover,.sticker-rewards-link:hover{border-color:#53fc18;background:#1a2c1d}
main{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);min-height:calc(100vh - 68px)}
aside{padding:28px 22px;border-right:1px solid #263044;background:#0c111bdd}.directory-heading,.stream-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.eyebrow{margin:0 0 5px;color:#53fc18;font-size:11px;font-weight:900;letter-spacing:.12em}h1,h2,h3{margin:0}h1{font-size:23px}.intro{color:#9ba7b9;line-height:1.55;font-size:14px}
.channel-list{display:grid;gap:10px;margin-top:22px}.channel-card{width:100%;display:grid;grid-template-columns:42px 1fr auto;gap:11px;align-items:center;padding:12px;border:1px solid #2a3549;border-radius:13px;background:#111824;color:#f7f9fc;text-align:left;cursor:pointer}.channel-card:hover,.channel-card.is-active{border-color:#53fc18;background:#142019}.avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#263349;color:#53fc18;font-weight:1000;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.channel-copy{display:grid;min-width:0}.channel-copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-copy small{color:#8f9caf}.live-dot{color:#53fc18;font-size:11px;font-weight:900}.empty{color:#8f9caf}
.watch-area{padding:clamp(18px,3vw,44px);min-width:0}.empty-player{min-height:460px;display:grid;place-content:center;gap:8px;text-align:center;border:1px dashed #334057;border-radius:18px;color:#a5b0c1}.empty-player b{font-size:24px;color:#eef3fb}.stream-heading{margin-bottom:16px}.platform-tabs{display:flex;gap:8px}.platform-tabs button{padding:8px 12px;border:1px solid #344059;border-radius:9px;background:#151d2a;color:#cbd4e2;cursor:pointer;text-transform:capitalize}.platform-tabs button.is-active{border-color:#53fc18;color:#071008;background:#53fc18;font-weight:900}
.player-shell{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #334057;border-radius:16px;background:#000;box-shadow:0 24px 70px #0008}.player-shell iframe{width:100%;height:100%;border:0}.sticker-target{position:absolute;inset:0;pointer-events:none;cursor:crosshair}.sticker-target.is-placing{pointer-events:auto;background:#53fc1808;outline:2px solid #53fc18;outline-offset:-2px}.sticker-preview{position:absolute;translate:-50% -50%;font-size:clamp(36px,6vw,78px);filter:drop-shadow(0 4px 8px #000);animation:sticker-pop 2s ease forwards;pointer-events:none}.sticker-preview img{display:block;width:clamp(84px,12vw,180px);height:clamp(84px,12vw,180px);object-fit:contain}@keyframes sticker-pop{0%{scale:.2;opacity:0}20%,75%{scale:1;opacity:1}100%{scale:.8;opacity:0}}
.sticker-card{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:18px;padding:18px;border:1px solid #2a3549;border-radius:15px;background:#101722}.sticker-card p{margin:5px 0 0;color:#9ba7b9;font-size:14px}.sticker-card p.is-error{color:#ff6b7a}.sticker-palette{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px;max-width:460px}.sticker-palette button{width:46px;height:42px;border:1px solid #354159;border-radius:10px;background:#1a2332;color:white;font-size:22px;cursor:pointer}.sticker-palette button:hover,.sticker-palette button.is-selected{border-color:#53fc18;background:#1b3020}.sticker-palette button:disabled{cursor:not-allowed;opacity:.4}.sticker-palette button img{display:block;width:36px;height:36px;margin:auto;object-fit:contain}.sticker-rewards-link{white-space:nowrap;font-size:12px}
.effect-picker{display:grid;gap:5px}.effect-picker>small{color:#75839a;font-size:8px;font-weight:900;letter-spacing:.1em}.effect-picker>div{display:flex;gap:5px}.effect-picker button{padding:7px 9px;border:1px solid #344158;border-radius:8px;color:#aeb9c8;background:#151d2a;cursor:pointer;font-size:9px;font-weight:900}.effect-picker button.is-selected{border-color:#36d8ff;color:#d9f9ff;background:#102630}
.viewer-chat{margin-top:18px;padding:16px;border:1px solid #2a3549;border-radius:15px;background:#0d141f}.chat-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}.chat-heading h3{font-size:18px}.chat-heading>span{padding:5px 8px;border:1px solid #53fc1848;border-radius:999px;color:#8aff66;background:#142019;font-size:10px;font-weight:900}.chat-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px;padding:4px;border:1px solid #28344a;border-radius:10px;background:#080d15}.chat-tabs button{padding:8px;border:1px solid transparent;border-radius:7px;color:#8e9bae;background:transparent;cursor:pointer;font-size:11px;font-weight:900}.chat-tabs button.is-active{border-color:#53fc1845;color:#e5ffdc;background:#17251a}.chat-description{margin:10px 2px;color:#7e8ba0;font-size:11px}.chat-messages{height:250px;display:flex;flex-direction:column;gap:7px;overflow-y:auto;padding:10px;border:1px solid #253146;border-radius:10px;background:#080d15}.chat-message{padding:8px 9px;border-radius:9px;background:#111925}.chat-message header{min-height:0;display:flex;align-items:center;padding:0;border:0;background:transparent}.chat-message b{color:#7eeaff;font-size:10px}.chat-message time{margin-left:7px;color:#57657a;font-size:8px}.chat-delete{margin-left:auto;padding:3px 7px;border:1px solid #ff536e66;border-radius:6px;color:#ff8798;background:#2b1118;cursor:pointer;font-size:8px;font-weight:900}.chat-delete:hover{border-color:#ff536e;background:#3a141e}.chat-message p{margin:3px 0 0;color:#d8e0eb;font-size:12px;line-height:1.35;overflow-wrap:anywhere}.chat-form{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:8px}.chat-form input{min-width:0;padding:10px;border:1px solid #344158;border-radius:9px;color:white;background:#101722}.chat-form button{padding:9px 14px;border:0;border-radius:9px;color:#071006;background:#53fc18;cursor:pointer;font-weight:900}.chat-status{min-height:14px;margin:6px 2px 0;color:#ff8290;font-size:9px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1200px){.watch-area{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}.empty-player,#active-player{grid-column:1;grid-row:1}.viewer-chat{grid-column:2;grid-row:1;margin-top:0;position:sticky;top:18px}.chat-messages{height:min(48vh,430px)}}
@media(max-width:820px){main{grid-template-columns:1fr}aside{border-right:0;border-bottom:1px solid #263044}.channel-list{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.watch-area{padding:18px}.sticker-card{align-items:flex-start;flex-direction:column}.sticker-palette{justify-content:flex-start}header{padding:12px 16px}.viewer-account>span{display:none}}