*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--bg:#fffcf9;--bg-card:#ffffff;--bg-el:#fff3ea;--border:rgba(190,90,20,0.09);--gold:#d4780a;--gold-glow:#d4780a20;--red:#d93535;--text:#1c1410;--muted:#9e8472;--r:14px;--r-sm:8px}body,html{height:100%}body{background:var(--bg);color:var(--text);font-family:Plus Jakarta Sans,system-ui,sans-serif;font-size:15px;line-height:1.5;overflow-x:hidden}#root{min-height:100vh}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:#f4c9a8;border-radius:3px}@keyframes livePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.25)}}@keyframes heartBeat{0%,to{transform:scale(1)}35%{transform:scale(1.45)}70%{transform:scale(.9)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:200%}to{background-position:-200%}}@keyframes glow{0%,to{box-shadow:0 0 0 2px rgba(212,120,10,.3)}50%{box-shadow:0 0 0 3px rgba(212,120,10,.5)}}@keyframes spin{to{transform:rotate(1turn)}}.spin{animation:spin .75s linear infinite}@keyframes featIn{0%{opacity:0;transform:scale(1.012)}to{opacity:1;transform:scale(1)}}.feat-enter{animation:featIn .32s cubic-bezier(.22,1,.36,1) both}.brand{font-family:Fredoka One,system-ui,sans-serif;font-weight:400;letter-spacing:.2px;background:linear-gradient(90deg,#a85e06,#d4780a 40%,#f0942c 60%,#d4780a);background-size:200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 4s linear infinite}.live-dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:livePulse 1.5s infinite;display:inline-block;flex-shrink:0}.fade-up{animation:fadeUp .35s ease both}.live-layout{grid-template-columns:1fr 296px;grid-gap:20px;gap:20px;padding:20px;width:100%}.live-layout,.stream-grid{display:grid;max-width:1400px;margin:0 auto}.stream-grid{grid-template-columns:repeat(auto-fill,minmax(228px,1fr));grid-gap:14px;gap:14px;padding:0 20px 28px}.cat-feed{padding:20px;width:100%;display:flex;flex-direction:column;gap:20px}.cat-feed,.cat-grid{max-width:580px;margin:0 auto}.cat-grid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:3px;gap:3px;padding:12px 20px 28px}.card{background:var(--bg-card);border-radius:var(--r);border:1px solid var(--border);overflow:hidden}.stream-card{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .15s}.stream-card:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(180,80,20,.14)}.stream-card.active-card{border-color:var(--gold)!important;animation:glow 2s ease infinite}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:var(--r-sm);border:none;cursor:pointer;font-family:Plus Jakarta Sans,sans-serif;font-weight:600;font-size:14px;transition:all .15s;text-decoration:none}.btn-gold{background:var(--gold);color:#fff}.btn-gold:hover{filter:brightness(1.08);transform:translateY(-1px)}.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}.btn-ghost:hover{background:var(--bg-el)}.inp{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-family:Plus Jakarta Sans,sans-serif;font-size:14px;padding:9px 13px;outline:none;transition:border-color .2s}.inp:focus{border-color:var(--gold)}.inp::placeholder{color:var(--muted)}.nav-btn{display:flex;align-items:center;gap:7px;padding:7px 14px;border-radius:var(--r-sm);cursor:pointer;color:var(--muted);font-weight:600;font-size:14px;transition:all .15s;border:none;background:none;font-family:Plus Jakarta Sans,sans-serif;white-space:nowrap;text-decoration:none}.nav-btn:hover{color:var(--text);background:var(--bg-el)}.nav-btn.active{color:var(--gold);background:var(--gold-glow)}.badge{font-size:10px;font-weight:800;letter-spacing:.8px;padding:3px 7px;border-radius:4px;white-space:nowrap}.badge-twitch{background:rgba(145,70,255,.15);color:#8a3ff0}.badge-youtube{background:rgba(220,50,50,.15);color:#cc3030}.badge-kick{background:rgba(30,160,30,.15);color:#187a18}.modal-bg{position:fixed;inset:0;background:rgba(40,15,5,.65);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}.modal{background:var(--bg-card);border-radius:18px;border:1px solid var(--border);width:100%;max-width:460px;padding:24px;animation:fadeUp .22s ease;max-height:90vh;overflow-y:auto;box-shadow:0 24px 64px rgba(180,80,20,.15)}.drop{border:2px dashed var(--border);border-radius:var(--r);padding:36px 20px;text-align:center;cursor:pointer;transition:all .2s}.drop.drag,.drop:hover{border-color:var(--gold);background:var(--gold-glow)}@media (max-width:1100px){.live-layout{grid-template-columns:1fr}.sidebar{display:none!important}}@media (max-width:768px){.live-layout{padding:12px;gap:12px}.stream-grid{grid-template-columns:repeat(2,1fr);padding:0 12px 20px;gap:10px}.cat-feed{padding:12px}.cat-grid{padding:8px 12px 20px}.nav-label{display:none}.hero-title{font-size:32px!important}}@media (max-width:480px){.stream-grid{grid-template-columns:1fr}.cat-grid{grid-template-columns:1fr 1fr}}