:root{--bg:#07070a;--panel:#111118;--card:#181823;--text:#f7f7fb;--muted:#a5a5b3;--hot:#e4004f;--line:#2a2a36}html.light{--bg:#f4f5f8;--panel:#fff;--card:#fff;--text:#111;--muted:#5d6470;--line:#dde1ea}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;background:rgba(8,8,12,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding:12px 18px}.light .top{background:rgba(255,255,255,.92)}.brand{font-size:24px;font-weight:1000;color:var(--text);text-decoration:none;cursor:pointer;white-space:nowrap}.top nav{display:flex;gap:7px;overflow:auto}.top nav button,.top>button,#hero button{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:10px 14px;font-weight:800;white-space:nowrap}.top nav button.active{background:var(--hot);border-color:var(--hot);color:#fff}#q{margin-left:auto;min-width:210px;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:11px 14px}main{width:min(1280px,calc(100% - 28px));margin:20px auto 70px}#hero{min-height:310px;border-radius:18px;background:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.18)),url('https://picsum.photos/seed/cineloopa-live-studio/1600/700') center/cover;display:flex;align-items:center;padding:40px;margin-bottom:22px;box-shadow:0 18px 60px #0008}#hero div{max-width:620px}#hero h1{font-size:clamp(34px,5vw,64px);line-height:.95;margin:10px 0}#hero p{color:#ddd;font-size:18px}.tabs{display:flex;gap:8px;overflow:auto;margin:20px 0}.tabs button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:999px;padding:10px 14px}.tabs button.active{background:var(--hot);color:#fff}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.channel{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;cursor:pointer;min-height:155px;display:flex;flex-direction:column;gap:10px}.channel:hover{outline:2px solid var(--hot)}.channel img{max-width:100%;height:54px;object-fit:contain;align-self:flex-start;background:#fff;border-radius:10px;padding:7px}.channel b{font-size:18px}.channel small{color:var(--muted);line-height:1.35}.badge{display:inline-block;background:#1d7cff;color:#fff;border-radius:7px;font-size:11px;font-weight:1000;padding:4px 7px}.vip{background:var(--hot)}.row{margin:32px 0}.row h2{font-size:25px}.rail{display:flex;gap:14px;overflow:auto;padding-bottom:8px}.movie{min-width:190px;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer}.movie img{width:100%;height:265px;object-fit:cover}.movie div{padding:12px}.guide{display:grid;gap:10px}.prog{display:grid;grid-template-columns:170px 1fr 120px;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px}.empty{padding:30px;background:var(--panel);border:1px dashed var(--line);border-radius:16px;color:var(--muted)}#modal{position:fixed;inset:0;z-index:100;background:#000;display:grid;grid-template-columns:1fr 360px}#modal[hidden]{display:none!important}#video{width:100%;height:100%;background:#000}#modal aside{background:#101017;padding:24px;overflow:auto}#close{position:absolute;right:18px;top:15px;z-index:2;border:0;background:#222;color:white;border-radius:50%;width:42px;height:42px;font-size:28px}#mlogo{max-width:160px;max-height:90px;background:#fff;border-radius:12px;padding:10px}#modal button:not(#close){display:inline-block;margin:8px 6px 8px 0;background:var(--hot);color:white;border:0;border-radius:999px;padding:12px 16px;font-weight:900}#status{white-space:pre-wrap;color:#a8ffbd;background:#050505;border-radius:10px;padding:10px;max-height:160px;overflow:auto}.settings{display:grid;gap:14px}.settings article{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px}footer{width:min(1280px,calc(100% - 28px));margin:40px auto;color:var(--muted);border-top:1px solid var(--line);padding-top:20px}@media(max-width:820px){.top{align-items:flex-start;flex-wrap:wrap}.brand{width:100%}.top nav{width:100%;order:3}.top nav button{font-size:12px;padding:9px 10px}#q{min-width:0;flex:1;margin-left:0}#hero{min-height:220px;padding:22px}#modal{grid-template-columns:1fr;grid-template-rows:52vh 1fr}.prog{grid-template-columns:1fr}.grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr))}.channel img{height:44px}}