:root{--bg:#14062a;--accent:#FF6700;--text:#f6f0ff;--muted:#b9a7d6;
--glass:linear-gradient(135deg,#ffffff26,#ffffff0a);
--edge:inset 0 1px 1px #ffffff66,inset 0 -1px 1px #ffffff1a,inset 0 0 18px #ffffff12;
--blur:blur(22px) saturate(180%)}
*{box-sizing:border-box}
body{margin:0;color:var(--text);font-family:system-ui,Segoe UI,Roboto,sans-serif;min-height:100vh;background:var(--bg);position:relative}
/* colourful blobs behind the glass */
body::before{content:"";position:fixed;inset:0;z-index:-1;
background:
radial-gradient(circle at 15% 20%,#FF670066,transparent 35%),
radial-gradient(circle at 85% 15%,#8a2be288,transparent 40%),
radial-gradient(circle at 70% 85%,#4b1d9a99,transparent 45%),
radial-gradient(circle at 20% 90%,#c2410c55,transparent 35%),var(--bg)}
header{display:flex;align-items:center;gap:12px;padding:12px 20px;margin:14px;border-radius:22px;
background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
border:1px solid #ffffff33;box-shadow:var(--edge),0 8px 32px #0006;position:sticky;top:14px;z-index:5;flex-wrap:wrap}
.logo{height:42px;width:auto}
h1{margin:0;font-size:26px;letter-spacing:2px}
h1 span{color:var(--accent);text-shadow:0 0 14px #FF6700aa}
#search{margin-left:auto;padding:10px 16px;border-radius:20px;border:1px solid #ffffff33;background:#ffffff14;color:var(--text);min-width:200px;box-shadow:inset 0 2px 6px #0004;backdrop-filter:blur(8px)}
#search::placeholder{color:var(--muted)}
#search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #FF670055}
main{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px;padding:20px 24px;max-width:1400px;margin:auto}
.card{background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid #ffffff2e;border-radius:24px;padding:10px;display:flex;flex-direction:column;box-shadow:var(--edge),0 10px 30px #0006;transition:transform .25s,box-shadow .25s;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#ffffff30 0%,transparent 35%);pointer-events:none;border-radius:inherit}
.card:hover{transform:translateY(-5px) scale(1.01);box-shadow:var(--edge),0 16px 40px #000a,0 0 24px #FF670044}
.card img{width:100%;aspect-ratio:2/3;object-fit:cover;background:#ffffff14;border-radius:16px;box-shadow:0 4px 14px #0005}
.card h3{margin:12px 6px 2px;font-size:16px}
.card small{margin:0 6px 8px;color:var(--muted)}
.btns{display:flex;flex-direction:column;gap:7px;padding:6px 2px 4px;margin-top:auto}
.btn{display:block;text-align:center;padding:9px;border-radius:14px;border:1px solid #ffffff44;background:linear-gradient(180deg,#ffffff2e,#ffffff0d);color:var(--text);font-weight:600;cursor:pointer;text-decoration:none;font-size:14px;box-shadow:inset 0 1px 1px #ffffff77,0 2px 8px #0004;backdrop-filter:blur(8px);transition:.2s}
.btn:hover:not(.off){background:linear-gradient(180deg,#ff8533cc,#FF6700cc);border-color:#ffb27a;box-shadow:inset 0 1px 1px #fff9,0 0 18px #FF670088}
.btn.primary{background:linear-gradient(180deg,#ff8533dd,#FF6700cc);border-color:#ffb27a;color:#fff}
.btn.off{opacity:.35;color:var(--muted);cursor:not-allowed;pointer-events:none;background:#ffffff0a;box-shadow:none}
.modal{position:fixed;inset:0;background:#0008;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10;padding:16px}
.modal[hidden],[hidden]{display:none!important}
.panel{background:linear-gradient(135deg,#ffffff30,#ffffff0d),#1d0a3a99;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid #ffffff44;border-radius:28px;box-shadow:var(--edge),0 20px 60px #000a;width:min(900px,100%);max-height:92vh;overflow:auto;padding:22px;position:relative}
.panel h2{margin:0 30px 12px 0;color:var(--accent);text-shadow:0 0 14px #FF670088}
.close{position:absolute;top:10px;right:14px;background:#ffffff1a;border:1px solid #ffffff33;border-radius:50%;width:36px;height:36px;line-height:1;color:var(--text);font-size:24px;cursor:pointer}
.close:hover{background:var(--accent)}
.season{margin:14px 0 6px;color:var(--muted);text-transform:uppercase;font-size:13px;letter-spacing:1px}
.ep{display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(135deg,#ffffff1f,#ffffff08);border:1px solid #ffffff22;padding:8px 12px;border-radius:16px;margin-bottom:6px;box-shadow:inset 0 1px 1px #ffffff40}
.ep .btn{padding:6px 14px;white-space:nowrap}
.ep.playing{border-color:var(--accent);box-shadow:0 0 14px #FF670077,inset 0 1px 1px #ffffff40}
video{width:100%;border-radius:18px;background:#000;max-height:60vh;margin-bottom:10px;box-shadow:0 8px 30px #000a}
#empty{text-align:center;color:var(--muted)}
