/* ============================================================
 * 黄果短剧网 · app.css
 * 登录页(自包含·浅色) + 普通页组件(深色) + PC/手机模式覆盖
 * 品牌主色：金黄 #ffd21c / #f5a623
 * ============================================================ */
:root{
  --brand:#ff8a1e; --brand-d:#ea580c; --gold:#ffd21c; --gold-d:#f5a623;
  --ink:#1f2430; --ink2:#3a4150; --gray:#6b7280; --gray2:#9ca3af;
  --line:#e6e8ee; --bg:#f6f7fb;
  --radius:16px;
  --sh-sm:0 4px 12px rgba(15,23,42,.08);
  --sh:0 10px 30px rgba(15,23,42,.10);
  --sh-lg:0 18px 50px rgba(15,23,42,.16);
}

/* ============================================================
 * 一、登录页（body.login-body，仅加载本文件，样式自包含）
 * ============================================================ */
.login-body{margin:0;background:var(--bg);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;}
.login-shell{display:grid;grid-template-columns:1.1fr .9fr;min-height:100vh;}
.login-hero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:54px;color:#fff;}
.login-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.login-hero .veil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,14,6,.18),rgba(120,52,8,.82));}
.login-hero .hero-in{position:relative;z-index:2;}
.hero-logo{display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:800;
  background:rgba(255,255,255,.16);padding:8px 16px;border-radius:999px;backdrop-filter:blur(6px);}
.hero-badge{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--brand),var(--brand-d));
  display:inline-flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;}
.login-hero h2{color:#fff;font-size:40px;line-height:1.24;margin:24px 0 14px;font-weight:900;}
.login-hero p{color:rgba(255,255,255,.92);font-size:15px;max-width:500px;line-height:1.8;}
.login-side{display:flex;align-items:center;justify-content:center;padding:40px 28px;background:rgba(255,255,255,.92);}
.login-card{width:100%;max-width:400px;background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:34px 32px;box-shadow:var(--sh-lg);}
.lc-logo{width:62px;height:62px;border-radius:16px;margin:0 auto 14px;
  background:linear-gradient(135deg,var(--brand),var(--brand-d));color:#fff;font-weight:900;font-size:24px;
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(234,88,12,.4);}
.login-card h1{text-align:center;font-size:21px;margin:0;color:var(--ink);}
.lc-sub{text-align:center;color:var(--gray);font-size:13px;margin:8px 0 20px;}
.lc-error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca;border-radius:10px;
  padding:10px 14px;font-size:13px;margin-bottom:16px;line-height:1.7;}
.login-card .field{margin-bottom:14px;}
.login-card .field label{display:block;margin-bottom:7px;font-weight:600;color:var(--ink2);font-size:13px;}
.login-card input[type=password],.login-card input[type=text]{
  width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:11px;padding:11px 14px;
  font-size:14px;font-family:inherit;background:#fff;transition:border .15s,box-shadow .15s;}
.login-card input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(255,138,30,.16);}
.lc-remember{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray);margin:4px 0 18px;cursor:pointer;}
.lc-remember input{width:auto;}
.login-card .btn,.btn{display:inline-block;padding:11px 18px;border-radius:11px;border:1px solid var(--line);
  background:#fff;color:var(--ink2);font-size:14px;font-weight:700;cursor:pointer;text-align:center;
  transition:transform .15s,box-shadow .15s,background .15s;font-family:inherit;}
.login-card .btn-primary{width:100%;padding:12px;font-size:15px;color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--brand),var(--brand-d));box-shadow:0 8px 18px rgba(234,88,12,.32);}
.login-card .btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px);}
.login-tip{margin-top:18px;padding:12px 14px;background:#f8fafc;border-radius:10px;font-size:12px;color:var(--gray);line-height:1.9;}
.login-foot{text-align:center;color:var(--gray2);font-size:12px;margin-top:24px;line-height:2;}
.login-foot a{color:var(--brand-d);text-decoration:none;}
.login-foot a:hover{text-decoration:underline;}

/* ============================================================
 * 二、普通页（深色主题）组件
 * ============================================================ */
/* 真实播放器 */
.hg-real-video{display:block;width:100%;aspect-ratio:16/9;background:#000;border-radius:12px;outline:none;}

/* 首页快捷入口 */
.hg-home__quick{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:22px 0 4px;}
.hg-quick-btn{padding:9px 18px;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;
  font-size:13px;text-decoration:none;border:1px solid rgba(255,255,255,.14);transition:.15s;}
.hg-quick-btn:hover{background:var(--gold);color:#111;border-color:transparent;}

/* 抖音看剧模式入口按钮（醒目高亮） */
.hg-quick-btn--dy{position:relative;font-weight:700;color:#fff;
  background:linear-gradient(90deg,#fe2c55,#ff6a3d);border-color:transparent;
  box-shadow:0 6px 18px rgba(254,44,85,.35);overflow:hidden;}
.hg-quick-btn--dy::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-20deg);animation:hgDyShine 2.6s ease-in-out infinite;}
@keyframes hgDyShine{0%,60%{left:-80%;}100%{left:130%;}}
.hg-quick-btn--dy:hover{background:linear-gradient(90deg,#fe2c55,#ff6a3d);color:#fff;
  transform:translateY(-1px);}

/* 区块框架 */
.hg-board{max-width:1400px;margin:18px auto 60px;}
.hg-board__title{font-size:26px;color:#fff;margin:0;}
.hg-board__sub{color:rgba(255,255,255,.5);font-size:13.5px;margin:8px 0 18px;line-height:1.7;}
.hg-board__toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 8px;}
.hg-board__tb-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-left:auto;}
.hg-chk{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.82);font-size:13.5px;cursor:pointer;}
.hg-chk input{width:auto;}

/* 通用按钮（深色场景） */
.hg-btn{padding:8px 16px;border-radius:9px;border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.06);color:#fff;font-size:13px;cursor:pointer;font-family:inherit;transition:.15s;}
.hg-btn:hover{background:rgba(255,255,255,.14);}
.hg-btn--primary{background:linear-gradient(90deg,var(--gold),var(--gold-d));color:#14110a;border-color:transparent;font-weight:700;}
.hg-btn--primary:hover{filter:brightness(1.06);background:linear-gradient(90deg,var(--gold),var(--gold-d));}
.hg-btn--danger{background:#dc2c2c;color:#fff;border-color:transparent;}
.hg-btn--danger:hover{background:#c62424;}
.hg-dt-search{padding:9px 14px;border-radius:9px;border:1px solid rgba(255,255,255,.15);
  background:rgba(0,0,0,.32);color:#fff;font-size:13px;min-width:250px;font-family:inherit;}
.hg-dt-search::placeholder{color:rgba(255,255,255,.4);}

/* 统计概览 */
.hg-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:12px;margin:6px 0 22px;}
.stat-pill{background:#161616;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:15px;
  display:flex;flex-direction:column;gap:5px;}
.stat-pill .sp-v{font-size:23px;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums;}
.stat-pill .sp-l{font-size:12px;color:rgba(255,255,255,.5);}

/* 标签筛选 */
.hg-tagfilter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 16px;}
.hg-tagfilter__label{font-size:13px;color:rgba(255,255,255,.6);margin-right:2px;}
.hg-tagchip{padding:6px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);color:rgba(255,255,255,.82);font-size:12.5px;cursor:pointer;transition:.15s;}
.hg-tagchip:hover{border-color:var(--gold);color:#fff;}
.hg-tagchip.is-on{background:var(--gold);color:#14110a;border-color:transparent;font-weight:700;}
.hg-tagchip.is-clear{font-weight:600;}

/* 列设置面板 */
.hg-colpanel{background:#161616;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px 18px;margin:10px 0 16px;}
.colpanel-head{display:flex;justify-content:space-between;align-items:center;color:#fff;margin-bottom:6px;}
.colpanel-head .x{background:none;border:0;font-size:22px;color:#999;cursor:pointer;line-height:1;}
.colpanel-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:9px;margin:12px 0;}
.colpanel-list label{color:rgba(255,255,255,.82);font-size:13px;display:flex;gap:8px;align-items:center;cursor:pointer;}
.colpanel-list input{width:auto;}
.colpanel-foot{display:flex;gap:10px;}

/* 活表格 */
.hg-dt-tablewrap{overflow:auto;border-radius:12px;border:1px solid rgba(255,255,255,.09);}
.hg-dt{width:100%;border-collapse:collapse;font-size:13.5px;background:#101010;}
.hg-dt thead th{background:#1c1c1c;color:#fff;text-align:left;padding:11px 12px;font-weight:600;
  white-space:nowrap;position:sticky;top:0;z-index:2;}
.hg-dt .th-sort{cursor:pointer;user-select:none;}
.hg-dt .th-sort:hover{color:var(--gold);}
.hg-dt tbody td{padding:10px 12px;border-top:1px solid rgba(255,255,255,.07);
  color:rgba(255,255,255,.85);vertical-align:middle;}
.hg-dt tbody tr{transition:background .12s;}
.hg-dt tbody tr:hover{background:rgba(255,210,28,.07);}
.hg-dt .colfilter-row th{background:#161616;padding:7px 10px;position:sticky;top:41px;z-index:2;}
.hg-dt .colfilter-row input{width:100%;box-sizing:border-box;padding:6px 8px;font-size:12px;border-radius:7px;
  border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.3);color:#fff;}
.empty-row{text-align:center;color:#888;padding:34px !important;}
.row-nf{opacity:.7;}
.nf-name{color:#f0a0a0;font-size:12.5px;}

/* 单元格元素 */
.hg-dt-cover{width:52px;height:74px;object-fit:cover;border-radius:6px;display:block;background:#222;}
.rank-no{font-weight:800;color:var(--gold);}
.score-no{color:#ff9a3c;font-weight:700;}
.c-desc{max-width:320px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.7;}
.hg-mini-tag{display:inline-block;padding:2px 8px;border-radius:6px;background:rgba(255,255,255,.08);
  font-size:11px;margin:1px 2px;color:rgba(255,255,255,.8);}
.type-badge{padding:3px 10px;border-radius:999px;font-size:11.5px;}
.type-series{background:rgba(61,155,238,.18);color:#7cc0f5;}
.type-standalone{background:rgba(255,138,30,.18);color:#ffb06a;}
.type-notfound{background:rgba(140,140,140,.16);color:#aaa;}
.hg-dt td a{color:var(--gold);text-decoration:none;}
.hg-dt td a:hover{text-decoration:underline;}
.c-rank,.c-score,.c-plays,.c-id,.c-ep_count{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.c-cover{text-align:center;}

/* 分页 */
.hg-dt-pager{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:16px 0;}
.pager-info{font-size:13px;color:rgba(255,255,255,.6);}
.pager-info b{color:#fff;}
.pager-btns{display:flex;gap:6px;flex-wrap:wrap;}
.pager-btns button{min-width:38px;padding:7px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);color:#fff;font-size:13px;cursor:pointer;}
.pager-btns button:hover:not(:disabled){background:rgba(255,255,255,.14);}
.pager-btns button.is-cur{background:var(--gold);color:#14110a;font-weight:700;border-color:transparent;}
.pager-btns button:disabled{opacity:.4;cursor:not-allowed;}
.pager-size{font-size:13px;color:rgba(255,255,255,.6);display:flex;align-items:center;gap:6px;}
.pager-size select{width:auto;padding:6px 8px;border-radius:8px;background:#1c1c1c;color:#fff;border:1px solid rgba(255,255,255,.15);}

/* 观影记录 */
.hg-history{max-width:1300px;margin:18px auto 60px;}
.hg-history__ops{margin:10px 0 16px;}
.hg-dt--history .c-... {}
.hg-history [data-clear-form]{background:#161616;border:1px solid rgba(220,44,44,.4);border-radius:12px;
  padding:18px;margin:10px 0 18px;max-width:480px;}
.hg-history [data-clear-form] .field label{color:rgba(255,255,255,.8);font-size:13px;margin-bottom:7px;display:block;}
.hg-history [data-clear-form] input{padding:10px;border-radius:9px;border:1px solid rgba(255,255,255,.15);
  background:rgba(0,0,0,.3);color:#fff;width:100%;box-sizing:border-box;margin-bottom:12px;}
.hg-history [data-clear-form] .hg-btn{margin-right:8px;}

/* 版权区块 */
.gs-copy{border-top:1px solid rgba(255,255,255,.08);margin-top:14px;padding:28px 16px 10px;}
.gs-copy__inner{max-width:1200px;margin:0 auto;text-align:center;color:rgba(255,255,255,.55);font-size:13px;line-height:2.1;}
.gs-copy a{color:var(--gold);text-decoration:none;}
.gs-copy a:hover{text-decoration:underline;}

/* ============================================================
 * 三、PC / 手机 模式覆盖
 * ============================================================ */
/* PC 模式：强制保持桌面宽版（窄屏真实设备选 PC 时整体横向滚动） */
body[data-mode=pc]{min-width:1180px;}
body[data-mode=pc] .hg-topbar-nav{display:flex;}
.hg-mode-btn.is-active{color:#111;background:var(--gold);font-weight:600;}

/* 手机模式：单列、窄版、导航横滚 */
body[data-mode=mobile]{max-width:100%;}
body[data-mode=mobile] .hg-header__inner{height:auto;flex-wrap:wrap;padding:10px;gap:10px;}
body[data-mode=mobile] .hg-header__logo{order:1;}
body[data-mode=mobile] .hg-header__logo img{height:32px;}
body[data-mode=mobile] .hg-header__search{order:2;flex:1;min-width:0;}
body[data-mode=mobile] .hg-header__search .hg-id-input{width:100%;box-sizing:border-box;}
body[data-mode=mobile] .hg-topbar-nav{order:3;flex:1 1 100%;display:flex;gap:6px;padding-bottom:4px;}
body[data-mode=mobile] .hg-topbar-nav__item{padding:0 12px;height:34px;font-size:13px;}
body[data-mode=mobile] .hg-main{padding:0;}
body[data-mode=mobile] .hg-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
body[data-mode=mobile] .hg-web-play__main{grid-template-columns:1fr;gap:16px;}
body[data-mode=mobile] .hg-web-play__side{min-height:auto;padding:16px;}
body[data-mode=mobile] .hg-web-play__ep-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;}
body[data-mode=mobile] .hg-web-detail__episodes,
body[data-mode=mobile] .hg-web-detail__hero{padding:18px;}
body[data-mode=mobile] .hg-board__toolbar{flex-direction:column;align-items:stretch;}
body[data-mode=mobile] .hg-board__tb-right{margin-left:0;}
body[data-mode=mobile] .hg-dt-search{min-width:0;width:100%;box-sizing:border-box;}
body[data-mode=mobile] .hg-dt{font-size:12px;}
body[data-mode=mobile] .hg-dt th,body[data-mode=mobile] .hg-dt td{padding:7px 8px;}
body[data-mode=mobile] .hg-dt-tablewrap{max-height:70vh;}
body[data-mode=mobile] .hg-home{margin-top:14px;}
body[data-mode=mobile] .hg-home__card{padding:28px 16px;}
body[data-mode=mobile] .hg-home h1{font-size:23px;}

/* 登录页：真实窄屏设备上下堆叠（无论模式） */
@media (max-width:860px){
  .login-shell{grid-template-columns:1fr;}
  .login-hero{min-height:250px;padding:30px;}
  .login-hero h2{font-size:27px;}
  .login-side{padding:24px 16px;}
  .login-card{padding:26px 22px;}
}

/* ============================================================
 * 四、顶部元素居中 / 播放模式切换 / 管理后台
 * ============================================================ */
/* 顶部整组元素（logo·导航·搜索）在宽屏下限制宽度并默认居中 */
.hg-header__inner{max-width:1600px;margin-left:auto;margin-right:auto;}
/* 导航项收紧，保证 13 个导航项在 1440~1920 宽下全部可见（不被滚动裁切） */
.hg-header .hg-topbar-nav{gap:2px;overflow:visible;}
.hg-header .hg-topbar-nav__item{padding:0 9px;}
.hg-header .hg-header__search{flex-basis:280px;width:280px;min-width:180px;}

/* 首页播放模式切换按钮 */
.hg-modeswitch{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:24px 0 4px;}
.hg-mode-tab{padding:10px 26px;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;
  font-size:14px;border:1px solid rgba(255,255,255,.16);cursor:pointer;transition:.15s;font-family:inherit;
  white-space:nowrap;}
.hg-mode-tab:hover{background:rgba(255,255,255,.18);}
.hg-mode-tab.is-active{background:linear-gradient(90deg,var(--gold),var(--gold-d));color:#14110a;
  border-color:transparent;font-weight:700;}

/* 首页查询卡片：标题/说明/输入框/提示文字默认居中 */
.hg-home__card{text-align:center;}
.hg-home__form{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;}
.hg-home__tip{text-align:center;}
/* “进入管理后台”入口（金色描边与模式按钮区分） */
.hg-mode-tab--admin{display:inline-flex;align-items:center;text-decoration:none;
  border-color:rgba(255,210,28,.55);color:var(--gold);}
.hg-mode-tab--admin:hover{background:rgba(255,210,28,.16);}

/* 管理后台 */
.hg-admin{max-width:1100px;margin:18px auto 60px;}
.hg-admin__msg{border-radius:10px;padding:11px 16px;font-size:13.5px;margin:6px 0 18px;line-height:1.7;}
.hg-admin__msg--ok{background:rgba(123,200,98,.14);color:#9be084;border:1px solid rgba(123,200,98,.35);}
.hg-admin__msg--err{background:#fef2f2;color:#dc2626;border:1px solid #fecaca;}
.hg-admin__card{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;
  padding:22px 24px;margin-bottom:18px;}
.hg-admin__card h2{font-size:18px;color:#fff;margin:0 0 10px;}
.hg-admin__hint{color:rgba(255,255,255,.55);font-size:13px;line-height:1.9;margin:6px 0;}
.hg-admin__hint b{color:var(--gold);}
.hg-admin__card a{color:var(--gold);text-decoration:none;}
.hg-admin__card a:hover{text-decoration:underline;}
.hg-admin__modes{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0;}
.hg-admin__urlform{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0 8px;}
.hg-admin__urlinput{flex:1;min-width:260px;padding:11px 14px;border-radius:10px;
  border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.32);color:#fff;font-size:14px;
  font-family:inherit;}
.hg-admin__urlinput:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,210,28,.14);}

/* ============================================================
 * 五、后台数据看板
 * ============================================================ */
.hg-range-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 16px;}
.hg-range-tabs a{padding:6px 15px;border-radius:999px;font-size:13px;text-decoration:none;
  color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);transition:.15s;}
.hg-range-tabs a:hover{background:rgba(255,255,255,.15);}
.hg-range-tabs a.is-active{background:linear-gradient(90deg,var(--gold),var(--gold-d));
  color:#14110a;border-color:transparent;font-weight:700;}
.hg-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 18px;}
.hg-kpi__item{background:#171717;border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:15px 18px;}
.hg-kpi__v{font-size:27px;font-weight:700;color:var(--gold);line-height:1.2;}
.hg-kpi__l{font-size:12.5px;color:rgba(255,255,255,.55);margin-top:4px;}
.hg-dash-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.hg-dash-box{background:#141414;border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px 18px;}
.hg-dash-box h3{font-size:15px;color:#fff;margin:0 0 10px;}
.hg-dash-list{list-style:none;margin:0;padding:0;}
.hg-dash-list li{display:flex;justify-content:space-between;gap:10px;font-size:13px;
  padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.07);}
.hg-dash-list li:last-child{border-bottom:0;}
.hg-dash-list a{color:#fff;text-decoration:none;}
.hg-dash-list a:hover{color:var(--gold);}
.hg-dash-list .n{color:var(--gold);font-weight:600;white-space:nowrap;}
.hg-dash-empty{font-size:12.5px;color:rgba(255,255,255,.4);padding:8px 0;}
.hg-barline{display:flex;align-items:center;gap:10px;font-size:12.5px;padding:4px 0;}
.hg-barline__l{width:96px;color:rgba(255,255,255,.75);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hg-barline__track{flex:1;height:8px;background:rgba(255,255,255,.07);border-radius:6px;overflow:hidden;}
.hg-barline__fill{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-d));border-radius:6px;}
.hg-barline__v{width:58px;text-align:right;color:rgba(255,255,255,.6);white-space:nowrap;}

/* ============================================================
 * 六、分类浏览 · 高级筛选
 * ============================================================ */
.hg-browse{max-width:1400px;margin:18px auto 60px;}
.hg-browse__layout{display:grid;grid-template-columns:268px 1fr;gap:22px;align-items:start;}
.hg-browse__filters{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;
  padding:16px;position:sticky;top:90px;}
.hg-browse__fgroup{margin-bottom:16px;}
.hg-browse__ftitle{display:block;font-size:13px;color:rgba(255,255,255,.62);
  margin-bottom:8px;font-weight:600;}
.hg-browse__chips{display:flex;flex-wrap:wrap;gap:6px;}
.hg-browse__chips--tags{max-height:152px;overflow:hidden;transition:max-height .25s;}
.hg-browse__chips--tags.is-open{max-height:2400px;}
.hg-browse__chip{padding:5px 11px;border-radius:999px;font-size:12px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.13);color:#fff;cursor:pointer;font-family:inherit;transition:.12s;}
.hg-browse__chip:hover{background:rgba(255,255,255,.16);}
.hg-browse__chip.is-on{background:linear-gradient(90deg,var(--gold),var(--gold-d));
  color:#14110a;border-color:transparent;font-weight:600;}
.hg-browse__moretags{margin-top:8px;padding:4px 0;background:none;border:0;color:var(--gold);
  font-size:12px;cursor:pointer;}
.hg-browse select,.hg-browse input[type=text]{width:100%;box-sizing:border-box;background:#1e1e1e;
  border:1px solid rgba(255,255,255,.14);color:#fff;border-radius:8px;padding:8px 10px;
  font-size:13px;font-family:inherit;}
.hg-browse__bar{display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-bottom:14px;font-size:13.5px;color:rgba(255,255,255,.72);}
.hg-browse__bar b{color:var(--gold);}
.hg-browse__sort{display:flex;align-items:center;gap:8px;}
.hg-browse__sort select{width:auto;padding:6px 8px;}
.hg-browse__more{text-align:center;margin-top:24px;}
.hg-browse__more .hg-btn{padding:9px 34px;border-radius:999px;}

/* ============================================================
 * 七、更多榜单 · 排行榜枢纽
 * ============================================================ */
.hg-tophub{max-width:1200px;margin:18px auto 60px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.hg-tophub a{display:block;background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;
  padding:20px;text-decoration:none;color:#fff;transition:.15s;}
.hg-tophub a:hover{border-color:rgba(255,210,28,.5);transform:translateY(-2px);}
.hg-tophub h3{margin:0 0 8px;font-size:16px;}
.hg-tophub p{margin:0;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.7;}

/* ============================================================
 * 八、播放器增强（控制条 / 片头跳过 / 续播提示）
 * ============================================================ */
.hg-web-play__viewport{position:relative;}
.hg-player-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px;
  padding:10px 12px;background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:10px;}
.hg-player-bar button{padding:6px 14px;border-radius:8px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);color:#fff;font-size:12.5px;cursor:pointer;font-family:inherit;}
.hg-player-bar button:hover{background:rgba(255,255,255,.18);}
.hg-player-bar__speed{display:flex;align-items:center;gap:6px;font-size:12.5px;color:rgba(255,255,255,.72);}
.hg-player-bar__speed select{background:#1e1e1e;color:#fff;border:1px solid rgba(255,255,255,.16);
  border-radius:6px;padding:4px;font-family:inherit;}
.hg-intro-skip{position:absolute;right:16px;bottom:56px;padding:9px 18px;border-radius:999px;
  background:rgba(0,0,0,.8);border:1px solid var(--gold);color:var(--gold);font-size:13.5px;
  cursor:pointer;font-family:inherit;}
.hg-resume-toast{position:absolute;right:16px;top:16px;padding:8px 16px;border-radius:999px;
  background:rgba(0,0,0,.72);border:1px solid rgba(255,255,255,.26);color:#fff;font-size:13px;
  cursor:pointer;font-family:inherit;}
.hg-resume-toast--left{right:auto;left:16px;}

/* ============================================================
 * 九、回家的路（官方地址发布页复刻）
 * ============================================================ */
.hg-gohome{max-width:1180px;margin:18px auto 60px;}
.hg-gohome__hero{text-align:center;padding:38px 20px 30px;margin-bottom:28px;border-radius:18px;
  border:1px solid rgba(255,255,255,.08);background:
    radial-gradient(circle at 50% 0,rgba(255,210,28,.13),transparent 62%),#101010;}
.hg-gohome__badge{display:inline-block;padding:6px 16px;border-radius:999px;background:rgba(255,210,28,.14);
  border:1px solid rgba(255,210,28,.5);color:var(--gold);font-size:13px;}
.hg-gohome__hero h1{font-size:30px;color:#fff;margin:14px 0 10px;}
.hg-gohome__hero p{color:rgba(255,255,255,.6);font-size:14px;margin:0;}
.hg-gohome h2{font-size:21px;color:#fff;margin:32px 0 14px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.hg-gohome h2 small{font-size:13px;color:rgba(255,255,255,.45);font-weight:400;}
.hg-line-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.hg-line-card{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;
  padding:18px;display:flex;flex-direction:column;gap:10px;}
.hg-line-card__top{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:rgba(255,255,255,.52);}
.hg-line-card__badge{padding:3px 10px;border-radius:999px;background:rgba(123,200,98,.16);
  color:#7bd35f;font-size:11.5px;}
.hg-line-card__domain{font-size:15.5px;font-weight:600;color:#fff;word-break:break-all;min-height:44px;}
.hg-line-card__ops{display:flex;gap:8px;margin-top:auto;}
.hg-line-card__ops a,.hg-line-card__ops button{flex:1;text-align:center;padding:8px 0;border-radius:9px;
  font-size:13px;text-decoration:none;cursor:pointer;border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);color:#fff;font-family:inherit;}
.hg-line-card__ops .go{background:linear-gradient(90deg,var(--gold),var(--gold-d));color:#14110a;
  border-color:transparent;font-weight:700;}
.hg-perm-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.hg-perm-item{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#141414;
  border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px 18px;}
.hg-perm-item__label{font-size:13.5px;color:rgba(255,255,255,.6);white-space:nowrap;}
.hg-perm-item__url{font-weight:600;color:#fff;word-break:break-all;text-align:right;text-decoration:none;font-size:13.5px;}
.hg-perm-item__url:hover{color:var(--gold);}
.hg-contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.hg-contact-card{display:flex;gap:14px;align-items:center;background:#141414;border:1px solid rgba(255,255,255,.08);
  border-radius:14px;padding:18px;}
.hg-contact-card__ic{width:48px;height:48px;border-radius:12px;background:rgba(255,210,28,.15);
  display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:700;color:var(--gold);flex-shrink:0;}
.hg-contact-card h3{margin:0;font-size:15px;color:#fff;}
.hg-contact-card p{margin:3px 0 9px;font-size:12.5px;color:rgba(255,255,255,.52);word-break:break-all;line-height:1.6;}
.hg-contact-card a{display:inline-block;padding:6px 14px;border-radius:8px;
  background:linear-gradient(90deg,var(--gold),var(--gold-d));color:#14110a;font-size:12.5px;
  text-decoration:none;font-weight:700;}
.hg-steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.hg-step-card{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px;}
.hg-step-card__no{width:30px;height:30px;border-radius:50%;background:rgba(255,210,28,.16);color:var(--gold);
  display:flex;align-items:center;justify-content:center;font-weight:700;margin-bottom:10px;}
.hg-step-card h3{margin:0 0 6px;font-size:15px;color:#fff;}
.hg-step-card p{margin:0;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.7;}
.hg-devices{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.hg-device{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px;}
.hg-device h3{margin:0 0 8px;font-size:15px;color:#fff;}
.hg-device ul{margin:0;padding-left:18px;color:rgba(255,255,255,.6);font-size:12.5px;line-height:1.95;}
.hg-gohome details{background:#141414;border:1px solid rgba(255,255,255,.08);border-radius:12px;
  padding:2px 16px;margin-bottom:10px;}
.hg-gohome summary{cursor:pointer;font-size:14px;color:#fff;padding:11px 0;list-style:none;}
.hg-gohome summary::-webkit-details-marker{display:none;}
.hg-gohome summary::before{content:'Q.';color:var(--gold);font-weight:700;margin-right:8px;}
.hg-gohome details p{font-size:13px;color:rgba(255,255,255,.6);line-height:1.8;margin:0 0 12px;}
.hg-gohome__updated{font-size:12px;color:rgba(255,255,255,.42);margin-top:14px;}

/* ---------------- 响应式：窄屏单列 ---------------- */
@media (max-width:980px){
  .hg-kpi{grid-template-columns:repeat(2,1fr);}
  .hg-dash-cols{grid-template-columns:1fr;}
  .hg-browse__layout{grid-template-columns:1fr;}
  .hg-browse__filters{position:static;}
  .hg-tophub,.hg-line-grid,.hg-steps3,.hg-devices{grid-template-columns:1fr;}
  .hg-perm-list,.hg-contact-grid{grid-template-columns:1fr;}
}
