:root{color-scheme:dark;--bg: #0b0f14;--surface: #121821;--surface-2: #161f2b;--text: #e6eef8;--muted: #9bb0c5;--accent: #f6a04d;--accent-soft: rgba(246, 160, 77, .15);--border: #1e2937;--shadow: 0 12px 30px rgba(0, 0, 0, .35);font-family:Space Grotesk,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;padding:0;background:radial-gradient(circle at 15% 25%,rgba(140,90,255,.25),transparent 35%),radial-gradient(circle at 85% 20%,rgba(246,160,77,.18),transparent 40%),radial-gradient(circle at 50% 80%,rgba(140,90,255,.18),transparent 45%),#07090f;background-repeat:no-repeat;background-attachment:fixed;min-height:100vh}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app{max-width:1100px;margin:0 auto;padding:48px 24px 80px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0003}.main{padding-left:32px;display:flex;flex-direction:column;gap:24px}.header{display:flex;flex-direction:column;gap:20px;margin-bottom:36px}.brand{display:flex;align-items:center;gap:12px}.brand-badge{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#f6a04d,#f17b2c);box-shadow:var(--shadow)}.brand h1{font-size:28px;letter-spacing:.4px;margin:0}.tabs{display:flex;flex-wrap:wrap;gap:10px}.tab{padding:8px 14px;border-radius:999px;background:var(--surface);border:1px solid transparent;color:var(--muted);font-size:14px;cursor:pointer;transition:all .2s ease}.tab:hover{color:var(--text);border-color:var(--accent-soft)}.tab.active{background:var(--accent-soft);color:var(--accent);border-color:#f6a04d66}.cards{margin-top:32px;display:grid;gap:28px;overflow:visible}.card{animation:fadeInUp .5s ease forwards;opacity:0;margin:0 8px;padding:20px;border-radius:16px;background:linear-gradient(180deg,#0f1621bf,#0b111abf);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 40px #00000080,0 0 30px #f6a04d0a;transition:all .25s ease;position:relative;overflow:visible}.card:before{content:"";position:absolute;left:0;top:20%;height:60%;width:2px;background:linear-gradient(to bottom,transparent,rgba(246,160,77,.8),transparent);opacity:.6}.card:hover:before{opacity:1}.card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.06),transparent 80%);opacity:0;transition:opacity .3s ease}.card:hover:after{opacity:1}.card:hover{transform:translateY(-8px) scale(1.01);border-color:#f6a04d80;box-shadow:0 20px 60px #0009,0 0 40px #f6a04d26}.card:hover .card-title{color:#f6a04d;text-shadow:0 0 6px rgba(246,160,77,.4)}.card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.card-title{margin:0;transition:color .2s ease;font-size:18px;font-weight:600}.card-meta{font-size:13px;color:var(--muted)}.card-actions{margin-top:12px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}.button{padding:12px 20px;border-radius:12px;font-size:15px;font-weight:500;border:1px solid rgba(246,160,77,.4);background:linear-gradient(135deg,#7f648f33,#c8973733);color:var(--accent);cursor:pointer;transition:all .2s ease}.button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #f6a04d40;background:linear-gradient(135deg,#7f648f59,#c8973759)}.button:disabled{cursor:not-allowed;opacity:.45}.idle-actions{display:flex;flex-direction:column;gap:24px;align-items:center;justify-content:center;padding:48px 0}@media (max-width: 720px){.app{padding:36px 18px 64px}.card-header{flex-direction:column}}.source-dropdown{position:relative;z-index:10}.source-button{background:none;border:none;color:orange;cursor:pointer}.source-menu{position:absolute;top:30px;right:0;background:#111;border:1px solid #333;border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:6px;min-width:120px;z-index:99999}.source-item{color:#fff;text-decoration:none;padding:4px 8px}.source-item:hover{background:#222}.source-dropdown{position:relative;z-index:100}.source-menu:hover{pointer-events:auto}.source-menu{isolation:isolate}.dropdown-open .card:not(.active-dropdown){pointer-events:none}.card.active-dropdown{pointer-events:auto;z-index:999}.back-button{margin-bottom:16px;background:transparent;border:1px solid var(--border);color:var(--text);padding:8px 14px;border-radius:10px;cursor:pointer;transition:.2s ease}.back-button:hover{border-color:#f6a04d;color:#f6a04d}.top-block{border:1px solid rgba(246,160,77,.25);border-radius:20px;padding:24px;background:linear-gradient(180deg,#f6a04d0f,#f6a04d05);box-shadow:0 10px 40px #f6a04d14}.top-item{display:flex;align-items:flex-start;gap:12px;position:relative}.top-item .card{border:1px solid rgba(246,160,77,.35);background:linear-gradient(180deg,#141923,#0f141e);box-shadow:0 8px 30px #f6a04d1f;width:100%}.top-item .card:hover{transform:translateY(-2px);border-color:#f6a04d99;box-shadow:0 12px 40px #f6a04d40}.top-rank{font-size:18px;font-weight:700;color:#f6a04d;background:#f6a04d1a;border:1px solid rgba(246,160,77,.3);border-radius:8px;padding:4px 8px;min-width:36px;text-align:center}.top-cards{display:flex;flex-direction:column;gap:16px}.top-block{margin-left:8px;margin-right:8px;padding:32px;margin-bottom:24px}.top-block .card{border:1px solid rgba(246,160,77,.4);box-shadow:0 0 40px #f6a04d1a}.brand{display:flex;align-items:center;gap:14px;margin-bottom:20px}.logo{width:56px;height:56px;object-fit:cover;border-radius:14px;box-shadow:0 0 16px #f6a04d66,0 0 32px #f6a04d33}.brand-title{font-size:32px;font-weight:700;background:linear-gradient(135deg,#f6a04d,#ffcc80);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:.5px}.logo:hover{transform:scale(1.08);transition:.2s}body.dropdown-open:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:100;pointer-events:none}.button.primary{padding:14px 26px;font-size:16px;box-shadow:0 0 20px #f6a04d33,0 6px 20px #0006}.live-indicator{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;margin-bottom:8px}.live-dot{width:8px;height:8px;border-radius:50%;background:#0f8;box-shadow:0 0 8px #0f89;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fadeInUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;color:var(--muted)}.empty-state p{font-size:18px;color:var(--text);margin-bottom:8px}.empty-state span{font-size:14px;opacity:.7}.empty-category{margin-top:24px;padding:32px;border-radius:16px;background:#ffffff05;border:1px solid rgba(246,160,77,.15);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.empty-category p{font-size:20px;font-weight:600;margin-bottom:8px;color:#e6eef8}.empty-category span{font-size:14px;color:#9bb0c5}.empty-category:before{content:"● Live";display:block;margin-bottom:12px;font-size:12px;color:#4ade80}.app-layout{display:grid;grid-template-columns:350px 1fr;min-height:100vh;background:transparent}.sidebar{position:relative;padding:60px 50px;border-right:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;gap:28px}.sidebar:after{content:"";position:absolute;top:0;right:0;width:1px;height:100%;background:linear-gradient(to bottom,transparent,rgba(246,160,77,.6),transparent);box-shadow:0 0 12px #f6a04d66,0 0 24px #f6a04d33;opacity:.8}.btn-main{width:100%;padding:22px 30px;font-size:1.1rem;border-radius:15px;border:none;cursor:pointer;margin-bottom:0;text-align:left;transition:all .3s ease;background:linear-gradient(135deg,#a87e58,#d3a478);color:#fff}.btn-secondary{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;margin-top:32px}.page-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100}.dropdown-area{position:relative;z-index:101}.niches-menu{position:absolute;top:100%;left:0;width:100%;background:#1a1a1c;border-radius:15px;padding:10px;box-shadow:0 10px 40px #00000080;border:1px solid #333}.menu-item{width:100%;padding:15px;background:none;border:none;color:#ccc;text-align:left;cursor:pointer;border-radius:10px}.menu-item:hover{background:#ffffff0d;color:#fff}.top-action-bar{display:flex;justify-content:space-between;align-items:center;padding:30px 50px}.time-tab{background:#1a1a1c;border:1px solid #333;color:#666;padding:10px 20px;margin-left:10px;border-radius:25px;cursor:pointer}.time-tab.active{border-color:#d4a373;color:#d4a373}.icon{margin-left:8px;transition:transform .25s ease}.icon.open{transform:rotate(180deg)}
