/* GoatPhim – giao diện "mực & vàng cũ". Tải sau các <style> trong index.html nên ghi đè được mà không đụng tới JS. */
:root{
  --bg:#0c0e10;--panel:#14181b;--line:#252b2f;--text:#efece4;--mute:#8f9a9a;
  --accent:#d9a441;--seal:#c0392b;--seal-hi:#e2553f;--jade:#5cc2a0;
  --ff:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs:"Noto Serif",Georgia,"Times New Roman",serif;
}
body{font-family:var(--ff);line-height:1.5;
  background:radial-gradient(900px 380px at 78% -140px,#16262200 0,#162622 0,#0c0e1000 70%),var(--bg)}
input,select,button{font-family:var(--ff)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input:focus-visible,select:focus-visible{outline:0;border-color:var(--accent)}
.card:focus-visible{outline-offset:6px;border-radius:12px}

/* thanh trên */
.nav{background:#0c0e10e6;border-bottom-color:var(--line)}
.logo{font-family:var(--fs);font-weight:800;letter-spacing:-.01em}
.lg{background:var(--seal);border-radius:7px;box-shadow:inset 0 0 0 2px #ffffff22;transform:rotate(-4deg)}
#cnt{background:#0e211b;color:var(--jade);border-color:#1d4a3b;border-radius:6px}
.sbtn,.apb,.asb{border-radius:10px}
.apb{background:var(--accent)}
.sbtn{border-radius:10px}

/* tab loại phim */
.tabs2{border-bottom-color:var(--line)}
.tab{font-weight:600;font-size:14.5px;color:#9aa5a5}
.tab.act{color:var(--accent)}
.tab.act:after{width:100%;height:2px;border-radius:0}
.tab.tabtop,.tab.tabtop.act{color:var(--accent)}

/* thể loại (cột trái) */
.gside{background:transparent;border:0;padding:0}
.gside h2{color:var(--mute);font-weight:700;font-size:12.5px}
#gq{background:var(--panel);border-radius:8px}
.gi{border-radius:8px;font-weight:600;padding:10px 14px;color:#9aa5a5}
.gi:hover{background:#1a1f23}
.gi.act{background:#d9a44120;color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}

/* hàng chọn sắp xếp */
.tbar select{background:var(--panel);border-radius:8px}

/* banner hạng 1 */
.hero{border-radius:14px;min-height:190px;border-color:var(--line)}
.hero:before{background:linear-gradient(90deg,#0c0e10 28%,#0c0e10b8 58%,#0c0e1030)}
.hi{padding:20px 24px;max-width:560px}
.hk{color:var(--seal-hi);letter-spacing:.04em;font-weight:700}
.hi h2{font-family:var(--fs);font-size:28px;font-weight:800;line-height:1.2}
.hi p{-webkit-line-clamp:2;font-size:13.5px;color:#cfd2cc}
.hb{background:var(--accent);border-radius:6px;padding:8px 16px;font-size:13px}

/* hàng "đang đứng top" */
.trh h2{font-family:var(--fs);font-size:18px}
.tc{border-radius:10px;background:linear-gradient(135deg,#25301f,#14181b)}
.tc .bd{background:var(--seal);border:1px solid #ffffff2a;border-radius:5px}
.tc .rk2{border-radius:5px}

/* thẻ phim */
.wrap main{gap:22px 16px}
.card .p{border-radius:10px;border-color:var(--line);transition:transform .18s,border-color .18s}
.card .p:after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(to top,#000b,#0000);pointer-events:none}
.card:hover .p{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 10px 24px #0009}
.hv,.dr,.crown{z-index:1}
.hv,.dr{border-radius:5px;font-weight:600;border-color:#ffffff1f}
.dr{color:#f2efe6;border-color:#ffffff1f}
.card h3{font-size:14.5px;font-weight:700;margin:10px 2px 4px;color:var(--text)}
.sn{color:var(--accent);font-weight:600}
.up{border-radius:5px;background:#181c20;color:#bfc6c4;font-weight:700}
.up.now{background:#2a2108;border-color:#5a4410;color:var(--accent)}

/* con dấu hạng 1-3: điểm nhấn duy nhất của trang */
.crown{left:8px;top:8px;min-width:30px;height:30px;padding:0 6px;border-radius:4px;display:flex;align-items:center;justify-content:center;
  font-family:var(--fs);font-size:16px;font-weight:800;color:#ffe9d2;background:var(--seal);
  box-shadow:inset 0 0 0 2px #ffffff30,0 3px 10px #0009;transform:rotate(-3deg)}
.crown.c2,.crown.c3{background:#14181bf0;color:var(--accent);box-shadow:inset 0 0 0 1.5px #d9a44199,0 3px 10px #0009}
.crown.c3{color:#c98a5a;box-shadow:inset 0 0 0 1.5px #c98a5a99,0 3px 10px #0009}
.rank{background:var(--seal);color:#ffe9d2;border-radius:6px;font-family:var(--fs)}
.card:nth-child(n+4) .rank{background:#242a2e;color:var(--text)}

/* bảng Top phim hay */
.tbox{border-radius:12px;background:var(--panel)}
.tbox h2{font-family:var(--fs);font-size:18px}
.tr{border-radius:8px}
.tn{font-family:var(--fs);color:#566066}
.tn.g1{color:var(--seal-hi)}.tn.g2{color:#cfd3d0}.tn.g3{color:#c98a5a}
.tp2{border-radius:5px}
.lk{color:var(--accent)}

/* cửa sổ chi tiết phim */
.mbox{border-radius:14px;background:var(--panel)}
.ban:before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,#0c0e1000 35%,var(--panel) 100%)}
.ban .gt{position:relative;z-index:1}.mx{z-index:2}
.gt span{border-radius:5px;background:#0c0e10cc;color:var(--accent);border:1px solid #d9a44166;font-weight:700;letter-spacing:.02em;text-transform:none;font-size:12px}
.mb h2{font-family:var(--fs);font-size:26px;font-weight:800}
.tot{color:var(--accent)}
.sec{color:var(--mute);letter-spacing:0;font-size:13px}
.sec.live{font-family:var(--fs);font-size:18px}
.sec.live::before{background:var(--seal-hi);box-shadow:0 0 0 0 #e2553faa}
.sg.lv .sc{border-color:#d9a44155;background:linear-gradient(160deg,#241c08,#101214 60%);box-shadow:none}
.sc{border-radius:10px;background:#101214}
.lb{border-radius:8px;background:#181c20}
.lb.on{color:var(--accent);border-color:var(--accent)}
.sl a{border-radius:6px}
.more{color:var(--accent)}

/* đăng nhập */
.amd{border-radius:16px;background:#14181b;box-shadow:0 24px 64px #000}
.amd h2{font-family:var(--fs)}
.atabs{border-radius:10px;background:var(--bg)}.atabs button{border-radius:7px}
.amd input{border-radius:10px}
.asub{background:var(--accent);border-radius:10px}
.ag{border-radius:10px}

/* chat */
.czb{background:var(--accent);box-shadow:0 8px 24px #000a}
.czp{border-radius:14px}
.czm.me .czbub{background:#14402f}
.czs{background:#2f8f6b}
.czo{background:#0e211b;color:var(--jade);border-color:#1d4a3b}.czo i{background:var(--jade)}

/* chân trang + thanh dưới (điện thoại) */
#ft{background:#0a0c0e}
.ftw .tg b{color:var(--accent)}
.bnav button.on{color:var(--accent)}

@media(max-width:700px){
  .gi{border-radius:8px;background:var(--panel)}
  .gi.act{background:var(--accent);color:#1a1100;box-shadow:none;border-color:transparent}
  .card h3{font-size:15px}
  .wrap main{gap:20px 12px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.hv,.dr{white-space:nowrap}

.lgi{background:none;box-shadow:none;transform:none}

/* Hộp xem phim: rộng hơn, video to hơn */
.mbox{width:min(1100px,100%)}
.mb{padding:4px 28px 28px}
/* Ảnh bìa giữ nguyên khung 16:9 như poster ngoài trang chủ (không bị cắt) */
/* Poster tràn viền modal, hiện đầy đủ, không phủ gradient */
.ban{height:auto;aspect-ratio:16/9;background-position:center;background-size:contain;background-repeat:no-repeat;background-color:var(--panel);width:100%;margin:0;border-radius:0}
.ban:before{display:none}
.mbox{overflow-x:hidden}
@media(min-width:900px){.mx{right:14px;top:14px}}
@media(max-width:600px){.mb{padding:4px 14px 20px}}

/* Ẩn thanh tiêu đề + nhãn "AI" của YouTube: đẩy iframe lên và cắt phần đầu (chỉ khi không ở chế độ xoay ngang) */
.vw:not(.vwl) iframe[src*="youtube.com"]{inset:auto;left:0;top:-20%;width:100%;height:120%}

/* Trang chạy full chiều ngang màn hình (bỏ giới hạn 1380px) */
header,.nv,.wrap,.ftw{max-width:none}
.wrap main{max-width:none}
@media(min-width:1150px){.wrap{padding:0 32px;grid-template-columns:240px minmax(0,1fr) 320px}.nv,.ftw,header{padding-left:32px;padding-right:32px}}