html{background:#0b1020}

:root{--bg:#0b1020;--card:#141b34;--line:rgba(255,224,138,.18);--gold:#ffe08a;--txt:#e8ecf8;--mut:#9aa6c8}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#1d2750 0%,var(--bg) 60%) fixed;color:var(--txt);font-family:"Be Vietnam Pro",system-ui,sans-serif;min-height:100vh}
.fly{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.fly i{position:absolute;width:3px;height:3px;border-radius:50%;background:#e7ff9c;box-shadow:0 0 8px 3px rgba(220,255,140,.55);opacity:0;animation:fl 9s linear infinite}
@keyframes fl{0%{opacity:0;transform:translate(0,0)}15%{opacity:.9}50%{transform:translate(30px,-60px);opacity:.3}85%{opacity:.9}100%{opacity:0;transform:translate(-20px,-130px)}}
header{text-align:center;padding:64px 20px 28px;position:relative}
h1{font-family:"Playfair Display",Georgia,serif;font-size:clamp(34px,6vw,58px);margin:0;color:#fff1cc;text-shadow:0 3px 0 rgba(0,0,0,.45)}
header p{margin:12px auto 0;max-width:520px;color:var(--mut);font-size:16px;line-height:1.55}
.rule{width:140px;height:2px;background:var(--gold);opacity:.7;margin:20px auto 0}
main{max-width:1060px;margin:0 auto;padding:12px 20px 70px;position:relative}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px}
.card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s,border-color .18s}
.card:hover,.card:focus-visible{transform:translateY(-4px);border-color:rgba(255,224,138,.6);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 1px rgba(255,224,138,.15);outline:none}
.cv{aspect-ratio:16/9;background:linear-gradient(135deg,#27346b,#3a2a5e);display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",serif;font-size:44px;color:rgba(255,241,204,.85)}
.cv img{width:100%;height:100%;object-fit:cover;display:block;image-rendering:pixelated}
.bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.tag{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.card h3{margin:0;font-size:20px}
.card p{margin:0;color:var(--mut);font-size:14px;line-height:1.55;flex:1}
.ctl{font-size:12px;color:#7f8bb0}
.play{margin-top:6px;align-self:flex-start;background:var(--gold);color:#2a1d05;font-weight:700;font-size:14px;padding:9px 20px;border-radius:999px}
.soon{border-style:dashed;align-items:center;justify-content:center;text-align:center;min-height:240px;color:var(--mut);background:transparent;font-size:15px;gap:6px}
.soon:hover{transform:none;box-shadow:none;border-color:var(--line)}
footer{text-align:center;color:#7f8bb0;font-size:12.5px;padding:0 20px 36px;line-height:1.7;position:relative}
footer a{color:var(--gold)}
.ad-slot{display:none;margin:28px 0;min-height:90px}.ad-slot.on{display:block}
.info{margin-top:46px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.info section{background:rgba(20,27,52,.6);border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.info h2{margin:0 0 10px;font-size:19px;color:#fff1cc}.info p,.info li{color:var(--mut);font-size:14.5px;line-height:1.65;margin:0 0 8px}
.info ul{margin:0;padding-left:18px}.info b{color:var(--txt)}
footer nav{margin-bottom:8px}footer nav a{margin:0 8px}
