:root{
  --bg:#f8fafc;
  --paper:#ffffff;
  --ink:#111827;
  --muted:#64748b;
  --soft:#e5e7eb;
  --deep:#0f172a;
  --deep-2:#1f2937;
  --accent:#111827;
  --radius:18px;
  --shadow:0 20px 45px rgba(15,23,42,.10);
}
body{background:linear-gradient(135deg,#f8fafc 0%,#f9fafb 45%,#f5f5f4 100%);color:var(--ink)}
.site-shell{min-height:100vh;background:linear-gradient(135deg,#f8fafc 0%,#f9fafb 48%,#f5f5f4 100%)}
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);backdrop-filter:blur(16px);border-bottom:1px solid rgba(229,231,235,.9);box-shadow:0 6px 20px rgba(15,23,42,.04)}
.nav-wrap{max-width:1280px;margin:0 auto;padding:0 20px;height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;color:#111827;text-decoration:none}
.brand-mark{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,#111827,#374151);display:grid;place-items:center;color:#fff;font-weight:900;box-shadow:0 10px 22px rgba(17,24,39,.22)}
.brand-text{display:flex;flex-direction:column;line-height:1.1}.brand-title{font-size:20px;font-weight:800;letter-spacing:-.02em}.brand-subtitle{font-size:12px;color:#6b7280;margin-top:2px}.desktop-nav{display:flex;align-items:center;gap:22px}.desktop-nav a,.mobile-nav a{font-weight:650;color:#374151;text-decoration:none;position:relative}.desktop-nav a:after{content:"";position:absolute;left:0;right:auto;bottom:-6px;width:0;height:2px;background:#111827;transition:.25s}.desktop-nav a:hover:after,.desktop-nav a.active:after{width:100%}.desktop-nav a:hover,.desktop-nav a.active{color:#111827}.nav-toggle{display:none;border:0;background:#f3f4f6;border-radius:12px;padding:9px;font-size:20px}.mobile-nav{display:none;border-top:1px solid #e5e7eb;padding:12px 20px 18px;background:#fff}.mobile-nav a{display:block;padding:12px 14px;border-radius:12px}.mobile-nav a:hover{background:#f9fafb}.mobile-nav.open{display:block}
.main{max-width:1280px;margin:0 auto;padding:0 20px}.hero{max-width:1280px;margin:0 auto;padding:34px 20px 28px}.hero-panel{position:relative;overflow:hidden;border-radius:32px;background:linear-gradient(135deg,#0f172a 0%,#1f2937 48%,#111827 100%);box-shadow:var(--shadow);min-height:560px;color:white}.hero-panel:before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.22),transparent 30%),radial-gradient(circle at 78% 22%,rgba(148,163,184,.28),transparent 36%),radial-gradient(circle at 50% 100%,rgba(255,255,255,.12),transparent 30%);pointer-events:none}.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,520px);gap:34px;align-items:center;padding:56px}.hero-copy{max-width:680px}.eyebrow{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.10);padding:8px 14px;border-radius:999px;font-size:14px;color:#e5e7eb;backdrop-filter:blur(10px);margin-bottom:20px}.hero h1{font-size:clamp(34px,5vw,64px);line-height:1.05;font-weight:900;letter-spacing:-.04em;margin:0 0 18px}.hero-lead{font-size:18px;line-height:1.8;color:#d1d5db;max-width:620px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 20px;font-weight:800;text-decoration:none;transition:.2s}.btn-dark{background:#111827;color:#fff}.btn-dark:hover{background:#1f2937;transform:translateY(-1px)}.btn-light{background:white;color:#111827}.btn-light:hover{background:#f3f4f6;transform:translateY(-1px)}.btn-ghost{border:1px solid rgba(255,255,255,.22);color:#fff;background:rgba(255,255,255,.08)}.btn-ghost:hover{background:rgba(255,255,255,.16)}.hero-search{display:flex;gap:10px;max-width:580px;margin-top:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px;backdrop-filter:blur(12px)}.hero-search input{flex:1;min-width:0;background:transparent;color:#fff;outline:none;padding:0 14px}.hero-search input::placeholder{color:#cbd5e1}.hero-search button{border:0;background:#fff;color:#111827;font-weight:850;border-radius:999px;padding:10px 18px}.hero-stage{position:relative}.hero-slide{display:none}.hero-slide.active{display:block;animation:fadeIn .45s ease}.hero-card{position:relative;border-radius:28px;overflow:hidden;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);box-shadow:0 25px 50px rgba(0,0,0,.28);min-height:420px}.hero-card img{width:100%;height:420px;object-fit:cover;background:linear-gradient(135deg,#1f2937,#111827)}.hero-card img.img-missing{visibility:hidden}.hero-card:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.86),rgba(0,0,0,.20),rgba(0,0,0,.08))}.hero-info{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:28px}.hero-title{font-size:30px;font-weight:900;margin-bottom:8px}.hero-desc{color:#d1d5db;line-height:1.65}.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.pill{font-size:12px;font-weight:800;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.14);color:#f8fafc;border:1px solid rgba(255,255,255,.13)}.hero-dots{display:flex;gap:10px;justify-content:center;margin-top:18px}.hero-dot{width:10px;height:10px;border-radius:999px;border:0;background:#94a3b8;opacity:.65}.hero-dot.active{width:26px;background:#fff;opacity:1}.section{padding:26px 0}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:18px}.section-title{font-size:28px;font-weight:900;letter-spacing:-.03em;color:#111827}.section-desc{color:#64748b;margin-top:5px}.more-link{font-weight:800;color:#374151;text-decoration:none}.more-link:hover{color:#111827}.movie-row{display:flex;gap:18px;overflow-x:auto;padding:4px 2px 18px;scrollbar-width:none}.movie-row::-webkit-scrollbar{display:none}.movie-card{display:block;text-decoration:none;color:inherit}.movie-row .movie-card{width:188px;flex:0 0 188px}.movie-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px}.poster{position:relative;aspect-ratio:2/3;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#e5e7eb,#cbd5e1);box-shadow:0 12px 24px rgba(15,23,42,.12);transition:.28s}.movie-card:hover .poster{transform:translateY(-4px);box-shadow:0 22px 40px rgba(15,23,42,.20)}.poster img{width:100%;height:100%;object-fit:cover;transition:.45s}.poster img.img-missing{visibility:hidden}.movie-card:hover .poster img{transform:scale(1.055)}.poster:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.62),transparent 52%);opacity:0;transition:.25s}.movie-card:hover .poster:after{opacity:1}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.92);width:48px;height:48px;border-radius:999px;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);display:grid;place-items:center;color:white;opacity:0;transition:.25s;z-index:2;font-size:20px}.movie-card:hover .play{opacity:1;transform:translate(-50%,-50%) scale(1)}.badge{position:absolute;left:10px;top:10px;z-index:3;background:rgba(17,24,39,.78);color:#fff;font-size:12px;font-weight:800;border-radius:999px;padding:5px 8px;backdrop-filter:blur(8px)}.movie-title{font-weight:850;margin-top:10px;color:#111827;line-height:1.35;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.movie-meta{font-size:13px;color:#6b7280;margin-top:4px}.movie-one{font-size:13px;color:#64748b;line-height:1.55;margin-top:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.category-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}.category-card{display:block;text-decoration:none;color:inherit;background:#fff;border:1px solid #e5e7eb;border-radius:22px;padding:18px;box-shadow:0 12px 26px rgba(15,23,42,.07);transition:.25s}.category-card:hover{transform:translateY(-4px);box-shadow:0 24px 46px rgba(15,23,42,.12)}.category-card h3{font-weight:900;font-size:19px}.category-card p{color:#64748b;font-size:14px;line-height:1.65;margin-top:8px}.mini-posters{display:flex;margin-top:14px}.mini-posters img{width:38px;height:54px;object-fit:cover;border-radius:8px;background:#e5e7eb;border:2px solid white;margin-right:-9px;box-shadow:0 8px 18px rgba(15,23,42,.14)}.mini-posters img.img-missing{visibility:hidden}.rank-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.rank-item{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:12px;text-decoration:none;color:inherit;box-shadow:0 8px 20px rgba(15,23,42,.06);transition:.2s}.rank-item:hover{transform:translateY(-2px);box-shadow:0 18px 35px rgba(15,23,42,.10)}.rank-no{width:38px;height:38px;border-radius:13px;background:#111827;color:#fff;display:grid;place-items:center;font-weight:900}.rank-thumb{width:72px;height:96px;object-fit:cover;border-radius:12px;background:#e5e7eb}.rank-thumb.img-missing{visibility:hidden}.rank-title{font-weight:900}.rank-desc{font-size:13px;color:#64748b;margin-top:5px;line-height:1.5}.page-hero{background:linear-gradient(135deg,#111827,#374151);color:white;border-radius:30px;padding:42px;margin:34px 0 30px;box-shadow:var(--shadow);position:relative;overflow:hidden}.page-hero:after{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 80% 0,rgba(255,255,255,.20),transparent 28%);pointer-events:none}.page-hero>*{position:relative}.page-hero h1{font-size:clamp(32px,4vw,50px);font-weight:950;letter-spacing:-.04em}.page-hero p{color:#d1d5db;line-height:1.8;max-width:760px;margin-top:12px}.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 26px}.filter-input{flex:1;min-width:240px;border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:13px 18px;outline:none;box-shadow:0 8px 20px rgba(15,23,42,.05)}.filter-input:focus{border-color:#111827}.filter-chip{border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:10px 14px;font-weight:800;color:#374151}.filter-chip.active,.filter-chip:hover{background:#111827;color:white;border-color:#111827}.detail-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:34px;align-items:start}.detail-poster{border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#e5e7eb,#cbd5e1);box-shadow:var(--shadow);aspect-ratio:2/3}.detail-poster img{width:100%;height:100%;object-fit:cover}.detail-poster img.img-missing{visibility:hidden}.detail-title{font-size:clamp(34px,5vw,58px);font-weight:950;line-height:1.08;letter-spacing:-.045em}.detail-meta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.detail-pill{background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:8px 12px;font-weight:800;color:#374151}.detail-one{font-size:18px;color:#334155;line-height:1.8;margin:20px 0}.content-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:24px;box-shadow:0 12px 30px rgba(15,23,42,.06);margin-top:22px}.content-card h2{font-size:24px;font-weight:950;margin-bottom:12px}.content-card p{color:#334155;line-height:1.9;white-space:pre-line}.player-box{background:#0f172a;border-radius:28px;padding:18px;box-shadow:var(--shadow);margin-top:28px}.player-box h2{color:white;font-size:22px;font-weight:900;margin:6px 8px 16px}.video-frame{width:100%;aspect-ratio:16/9;border-radius:20px;background:#000;overflow:hidden;display:block}.video-frame video{width:100%;height:100%;display:block;background:#000}.breadcrumb{font-size:14px;color:#64748b;margin:28px 0 0}.breadcrumb a{color:#374151;font-weight:800;text-decoration:none}.tag-row{display:flex;flex-wrap:wrap;gap:8px}.tag{display:inline-flex;border:1px solid #e5e7eb;background:#fff;border-radius:999px;color:#374151;font-weight:760;padding:7px 10px;font-size:13px}.site-footer{margin-top:60px;background:linear-gradient(135deg,#111827,#1f2937,#0f172a);color:#d1d5db}.footer-wrap{max-width:1280px;margin:0 auto;padding:48px 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.footer-title{font-size:22px;font-weight:900;color:white}.footer-text{color:#9ca3af;line-height:1.8;margin-top:12px}.footer-links{display:grid;gap:9px;margin-top:12px}.footer-links a{color:#d1d5db;text-decoration:none}.footer-links a:hover{color:white}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:22px;color:#9ca3af;font-size:14px}.empty-state{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:28px;color:#64748b;text-align:center}.site-map-list{columns:3;column-gap:30px}.site-map-list a{display:block;color:#374151;text-decoration:none;margin-bottom:8px;font-weight:650;break-inside:avoid}.site-map-list a:hover{color:#111827}.hidden-by-filter{display:none!important}@keyframes fadeIn{from{opacity:.5;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:1100px){.hero-grid{grid-template-columns:1fr;padding:38px}.movie-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-layout{grid-template-columns:260px 1fr}.rank-list{grid-template-columns:1fr}}
@media (max-width:760px){.desktop-nav{display:none}.nav-toggle{display:block}.nav-wrap{height:64px}.brand-title{font-size:17px}.hero{padding:20px 14px}.main{padding:0 14px}.hero-panel{border-radius:24px;min-height:auto}.hero-grid{padding:28px 18px;gap:24px}.hero-search{border-radius:20px;flex-direction:column}.hero-search button{width:100%}.hero-card,.hero-card img{min-height:360px;height:360px}.hero h1{font-size:34px}.hero-lead{font-size:16px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.movie-row .movie-card{width:155px;flex-basis:155px}.category-grid{grid-template-columns:1fr}.section-title{font-size:23px}.section-head{align-items:flex-start;flex-direction:column}.page-hero{border-radius:24px;padding:28px 20px;margin-top:22px}.detail-layout{grid-template-columns:1fr}.detail-poster{max-width:320px}.footer-grid{grid-template-columns:1fr}.rank-item{align-items:flex-start}.site-map-list{columns:1}.filter-input{min-width:100%}}