:root{--brand:#f59e0b;--brand-dark:#b45309;--ink:#111827;--muted:#6b7280;--line:#f3d38a;--soft:#fff7ed;--panel:#ffffff;--shadow:0 18px 45px rgba(146,64,14,.14)}
body{background:linear-gradient(180deg,#fffbeb 0,#fff 38%,#fff7ed 100%);color:var(--ink)}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(253,230,138,.65)}
.header-inner{max-width:80rem;margin:0 auto;padding:0 1rem;height:72px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{display:flex;align-items:center;gap:.7rem;font-weight:900;color:#92400e;white-space:nowrap}
.logo-mark{width:2.4rem;height:2.4rem;border-radius:999px;background:linear-gradient(135deg,#f59e0b,#fb923c);display:grid;place-items:center;color:white;box-shadow:0 10px 24px rgba(245,158,11,.32);font-weight:900}
.nav{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;justify-content:center}
.nav-link{padding:.55rem .85rem;border-radius:999px;color:#4b5563;font-weight:700;font-size:.92rem;transition:.2s}
.nav-link:hover,.nav-link.active{background:#fef3c7;color:#92400e}
.header-search{display:flex;gap:.45rem;min-width:260px}
.header-search input{width:100%;border:1px solid #fde68a;background:#fff;border-radius:999px;padding:.6rem .9rem;outline:none;color:#374151}
.header-search button{border-radius:999px;padding:.6rem .9rem;background:#f59e0b;color:#fff;font-weight:800;white-space:nowrap}
.hero{position:relative;height:560px;overflow:hidden;background:#111827}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 900ms ease;pointer-events:none}
.hero-slide.active{opacity:1;pointer-events:auto}
.hero-slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.02)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.54),rgba(0,0,0,.08));}
.hero-content{position:absolute;inset:0;display:flex;align-items:center;max-width:80rem;margin:0 auto;padding:0 1rem;color:#fff;left:50%;transform:translateX(-50%);width:100%}
.hero-panel{max-width:760px;padding-top:4rem}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(12px);border-radius:999px;padding:.45rem .8rem;font-weight:800;color:#fde68a;margin-bottom:1rem}
.hero h1{font-size:clamp(2.1rem,5vw,4.9rem);line-height:1.02;font-weight:950;letter-spacing:-.05em;text-shadow:0 16px 45px rgba(0,0,0,.55)}
.hero p{margin-top:1rem;font-size:1.12rem;max-width:660px;color:#f9fafb;line-height:1.8;text-shadow:0 6px 25px rgba(0,0,0,.45)}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:900;padding:.8rem 1.15rem;transition:.2s;border:1px solid transparent}
.btn-primary{background:#f59e0b;color:white;box-shadow:0 16px 28px rgba(245,158,11,.26)}
.btn-primary:hover{background:#d97706;transform:translateY(-1px)}
.btn-ghost{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.28);backdrop-filter:blur(10px)}
.btn-ghost:hover{background:rgba(255,255,255,.25)}
.hero-dots{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;gap:.45rem;z-index:3}
.hero-dot{width:.55rem;height:.55rem;border-radius:999px;background:rgba(255,255,255,.55);transition:.2s}
.hero-dot.active{width:2rem;background:#fff}
.section{max-width:80rem;margin:0 auto;padding:4rem 1rem}
.section-wide{padding:4rem 0;background:linear-gradient(90deg,#fef3c7,#ffedd5)}
.section-wide .section{padding-top:0;padding-bottom:0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.section-kicker{display:flex;align-items:center;gap:.7rem;color:#92400e;font-weight:900;margin-bottom:.25rem}
.section-title{font-size:clamp(1.6rem,3vw,2.45rem);font-weight:950;color:#111827;letter-spacing:-.03em}
.section-desc{color:#6b7280;line-height:1.75;max-width:760px;margin-top:.45rem}
.scroll-row{display:flex;gap:1.1rem;overflow-x:auto;padding:.4rem .2rem 1rem;scrollbar-width:none}
.scroll-row::-webkit-scrollbar{display:none}
.scroll-row .movie-card{width:18rem;flex:0 0 auto}
.movie-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1.35rem}
.movie-card{background:#fff;border:1px solid rgba(253,230,138,.7);border-radius:1.25rem;overflow:hidden;box-shadow:0 12px 28px rgba(15,23,42,.07);transition:.22s;position:relative}
.movie-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#facc15}
.poster{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,#fde68a,#f59e0b);overflow:hidden}
.poster img{width:100%;height:100%;object-fit:cover;transition:.5s}
.movie-card:hover .poster img{transform:scale(1.07)}
.poster:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),rgba(0,0,0,0) 58%)}
.badge{display:inline-flex;align-items:center;border-radius:999px;background:#fef3c7;color:#92400e;padding:.28rem .55rem;font-size:.78rem;font-weight:900;border:1px solid #fde68a}
.poster .badge{position:absolute;left:.75rem;bottom:.75rem;z-index:2;background:rgba(245,158,11,.95);color:#fff;border-color:rgba(255,255,255,.35)}
.card-body{padding:1rem}
.card-title{font-size:1.08rem;line-height:1.35;font-weight:950;color:#111827;margin-bottom:.4rem;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.card-title:hover{color:#b45309}
.card-meta{display:flex;flex-wrap:wrap;gap:.4rem;color:#6b7280;font-size:.85rem;margin-bottom:.55rem}
.card-text{color:#4b5563;line-height:1.65;font-size:.92rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tag-row{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.85rem}
.category-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1.2rem}
.category-card{display:block;background:rgba(255,255,255,.86);border:1px solid rgba(253,230,138,.75);border-radius:1.35rem;padding:1.25rem;box-shadow:0 14px 28px rgba(146,64,14,.08);transition:.2s;min-height:150px}
.category-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#f59e0b}
.category-card h2,.category-card h3{font-weight:950;font-size:1.35rem;color:#92400e;margin-bottom:.45rem}
.category-card p{color:#6b7280;line-height:1.75}
.filter-bar{display:flex;gap:.8rem;flex-wrap:wrap;background:rgba(255,255,255,.88);border:1px solid #fde68a;border-radius:1.25rem;padding:1rem;margin:1.5rem 0 2rem;box-shadow:0 14px 28px rgba(15,23,42,.05)}
.filter-bar input,.filter-bar select{border:1px solid #fde68a;border-radius:999px;background:#fff;padding:.75rem 1rem;outline:none;min-width:180px;color:#374151}
.rank-list{display:grid;gap:.8rem}
.rank-item{display:grid;grid-template-columns:auto 92px 1fr auto;gap:1rem;align-items:center;background:#fff;border:1px solid rgba(253,230,138,.75);border-radius:1rem;padding:.75rem;box-shadow:0 10px 24px rgba(15,23,42,.06)}
.rank-num{font-weight:950;color:#b45309;background:#fef3c7;border-radius:999px;width:2.25rem;height:2.25rem;display:grid;place-items:center}
.rank-item img{width:92px;height:58px;object-fit:cover;border-radius:.75rem;background:#fef3c7}
.rank-title{font-weight:950;color:#111827;margin-bottom:.25rem}
.rank-title:hover{color:#b45309}
.rank-meta{color:#6b7280;font-size:.9rem}
.page-hero{background:linear-gradient(135deg,#fff7ed,#fef3c7 48%,#fff);border-bottom:1px solid #fde68a;padding:3.4rem 1rem}
.page-hero-inner{max-width:80rem;margin:0 auto}
.page-hero h1{font-size:clamp(2rem,4vw,3.4rem);font-weight:950;letter-spacing:-.04em;color:#111827}
.page-hero p{max-width:820px;color:#6b7280;line-height:1.85;margin-top:.8rem;font-size:1.08rem}
.breadcrumb{display:flex;flex-wrap:wrap;gap:.35rem;color:#92400e;font-size:.92rem;margin-bottom:.9rem;font-weight:800}
.detail-layout{display:grid;grid-template-columns:1fr;gap:1.6rem;align-items:start}
.player-box{position:relative;background:#050505;border-radius:1.3rem;overflow:hidden;box-shadow:0 26px 58px rgba(0,0,0,.22);border:1px solid rgba(245,158,11,.28)}
.player-box video{width:100%;aspect-ratio:16/9;background:#050505;display:block}
.play-cover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;cursor:pointer;background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.68));z-index:2;transition:.2s}
.play-cover.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.play-button{width:86px;height:86px;border-radius:999px;background:#f59e0b;display:grid;place-items:center;color:white;font-size:2.4rem;box-shadow:0 16px 40px rgba(245,158,11,.35);padding-left:.25rem}
.detail-card{background:#fff;border:1px solid rgba(253,230,138,.78);border-radius:1.35rem;padding:1.25rem;box-shadow:0 14px 32px rgba(15,23,42,.06)}
.detail-card h2{font-size:1.35rem;font-weight:950;margin-bottom:.65rem;color:#111827}
.detail-card p{color:#4b5563;line-height:1.85;margin-bottom:.85rem}
.info-table{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0}
.info-cell{border:1px solid #fde68a;background:#fffbeb;border-radius:1rem;padding:.75rem;color:#6b7280}
.info-cell strong{display:block;color:#92400e;font-size:.85rem;margin-bottom:.15rem}
.footer{border-top:1px solid #fde68a;background:#111827;color:#e5e7eb;margin-top:3rem}
.footer-inner{max-width:80rem;margin:0 auto;padding:2.4rem 1rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer a{color:#fde68a;margin-right:1rem}
.result-empty{background:#fff;border:1px solid #fde68a;border-radius:1.2rem;padding:1.5rem;color:#6b7280}
@media(min-width:640px){.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.movie-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-layout{grid-template-columns:minmax(0,2fr) minmax(320px,1fr)}}
@media(min-width:1280px){.movie-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:900px){.header-inner{height:auto;align-items:flex-start;flex-direction:column;padding-top:.9rem;padding-bottom:.9rem}.nav{justify-content:flex-start}.header-search{min-width:0;width:100%}.hero{height:620px}.hero-content{align-items:flex-end;padding-bottom:5.4rem}.rank-item{grid-template-columns:auto 76px 1fr}.rank-item .btn{display:none}}