/* ===== 黄豆短剧 · 主题样式 ===== */
:root{
  --primary:#E8B83A;        /* 黄豆色 */
  --primary-dark:#C9951E;
  --accent:#FF6B35;         /* 暖橙 */
  --ink:#2C2416;            /* 深棕文字 */
  --ink-2:#5b4d34;
  --muted:#8a7858;
  --bg:#FFF9E6;             /* 主背景 米黄 */
  --bg-2:#FFF1CC;
  --card:#FFFFFF;
  --border:#F2E2B8;
  --shadow:0 6px 22px -10px rgba(232,184,58,.35), 0 2px 6px rgba(0,0,0,.04);
  --radius:18px;
  --radius-sm:10px;
  --maxw:1200px;
  --danger:#E5484D;
  --gradient:linear-gradient(135deg,#FFE7A5 0%,#F5A623 100%);
}
[data-theme="dark"]{
  --ink:#FFF1D6;
  --ink-2:#D9C8A2;
  --muted:#9c8b6d;
  --bg:#1A140C;
  --bg-2:#241B11;
  --card:#2A2014;
  --border:#3A2D1A;
  --shadow:0 6px 22px -10px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.2);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  font-size:16px;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--ink);line-height:1.25;margin:.2em 0 .4em;font-weight:800;letter-spacing:.01em}
h1{font-size:clamp(28px,5vw,46px)}
h2{font-size:clamp(22px,3.4vw,30px)}
h3{font-size:clamp(18px,2.4vw,22px)}
h4{font-size:18px}
p{margin:.4em 0}
ul,ol{padding-left:1.2em}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* skip link */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--primary);color:#fff;padding:8px 12px;border-radius:0 0 8px 0;z-index:999}
.skip-link:focus{left:0}

/* ===== 顶部 ===== */
.site-header{position:sticky;top:0;background:rgba(255,249,230,.92);backdrop-filter:saturate(150%) blur(10px);border-bottom:1px solid var(--border);z-index:50}
[data-theme="dark"] .site-header{background:rgba(26,20,12,.92)}
.header-inner{display:flex;align-items:center;gap:18px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.brand-text strong{display:block;font-size:18px;color:var(--ink)}
.brand-text small{display:block;font-size:11px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.nav{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
.nav-link{color:var(--ink-2);padding:8px 12px;border-radius:999px;font-weight:600;font-size:14.5px}
.nav-link:hover{background:var(--bg-2);text-decoration:none}
.nav-link.active{background:var(--primary);color:#fff}
.header-tools{display:flex;align-items:center;gap:10px}
.search{display:flex;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:4px 10px}
.search input{background:transparent;border:0;outline:0;width:160px;color:inherit;font-size:14px}
.search button{background:transparent;border:0;cursor:pointer;color:var(--ink-2);font-size:14px}
.theme-toggle{background:var(--card);border:1px solid var(--border);border-radius:999px;width:36px;height:36px;cursor:pointer;font-size:16px}

/* ===== 通用 ===== */
.btn{display:inline-block;padding:11px 22px;border-radius:999px;font-weight:700;border:0;cursor:pointer;font-size:15px;transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-1px);text-decoration:none}
.btn-primary{background:var(--gradient);color:#3a2a05;box-shadow:var(--shadow)}
.btn-ghost{background:transparent;border:1.5px solid var(--border);color:var(--ink)}
.section{padding:48px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.section-head p{color:var(--muted);margin:0}
.section-head .more{white-space:nowrap;font-weight:600}

/* ===== Hero ===== */
.hero{padding:64px 0 32px;background:radial-gradient(120% 80% at 0% 0%,#FFF1CC 0%,transparent 60%),radial-gradient(120% 80% at 100% 0%,#FFE0A5 0%,transparent 60%)}
.eyebrow{display:inline-block;padding:5px 12px;border-radius:999px;background:var(--bg-2);color:var(--primary-dark);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px}
.hero h1 .hl{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.lede{font-size:17px;color:var(--ink-2);max-width:760px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero-stats{list-style:none;padding:0;margin:30px 0 0;display:flex;gap:30px;flex-wrap:wrap}
.hero-stats li{display:flex;flex-direction:column}
.hero-stats b{font-size:26px;background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-stats span{color:var(--muted);font-size:13px}

/* ===== 卡片网格 ===== */
.grid{display:grid;gap:22px}
.grid-cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card-media{position:relative;display:block;aspect-ratio:5/7;background:var(--bg-2);overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.card:hover .card-media img{transform:scale(1.04)}
.tag{position:absolute;left:10px;top:10px;padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;font-weight:700}
.tag-hot{background:var(--danger)}
.card-body{padding:14px 16px 18px}
.card-body h3{margin:0 0 6px;font-size:16px}
.card-body h3 a{color:var(--ink)}
.card-body .meta{color:var(--muted);font-size:12.5px;margin:0 0 6px}
.card-body p{margin:0;font-size:13.5px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ===== 分类 ===== */
.cat-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin:0}
.cat-grid a{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;text-decoration:none;color:inherit;transition:.2s}
.cat-grid a:hover{transform:translateY(-3px);border-color:var(--primary);box-shadow:var(--shadow)}
.cat-grid b{font-size:17px;color:var(--ink)}
.cat-grid span{color:var(--muted);font-size:13px;margin-top:4px}

/* ===== 工具卡 ===== */
.tool-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}
.tool-card h3{margin-top:0;color:var(--primary-dark)}
.tool-card .more{font-weight:600}

/* ===== 资讯列表 ===== */
.news-list{list-style:none;padding:0;margin:0;border-top:1px dashed var(--border)}
.news-list li{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px dashed var(--border)}
.news-list time{color:var(--muted);font-size:13px;min-width:60px;font-variant-numeric:tabular-nums}
.news-list a{flex:1;color:var(--ink);font-weight:600}
.news-list a:hover{color:var(--accent)}
.news-list span{background:var(--bg-2);color:var(--primary-dark);font-size:12px;padding:2px 8px;border-radius:6px}

/* ===== CTA ===== */
.cta-card{display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--gradient);border-radius:var(--radius);padding:32px;color:#3a2a05;box-shadow:var(--shadow)}
.cta-card h2{margin:0 0 6px;color:#3a2a05}
.cta-card p{margin:0;max-width:560px}
.cta-form{display:flex;gap:8px;flex-wrap:wrap}
.cta-form input{padding:12px 16px;border-radius:999px;border:0;background:#fff;min-width:240px;outline:0;font-size:15px}
.cta-form .btn{background:#3a2a05;color:#fff}
.cta-form .btn:hover{background:#000}

/* ===== 分页 ===== */
.pagination{display:flex;gap:8px;justify-content:center;margin:32px 0;flex-wrap:wrap}
.pagination a,.pagination span{padding:8px 14px;border-radius:8px;border:1px solid var(--border);color:var(--ink);font-weight:600}
.pagination .current{background:var(--primary);color:#fff;border-color:var(--primary)}
.pagination a:hover{background:var(--bg-2);text-decoration:none}

/* ===== 面包屑 ===== */
.breadcrumb{font-size:13.5px;color:var(--muted);margin:18px 0 8px}
.breadcrumb a{color:var(--muted)}
.breadcrumb .sep{margin:0 6px;color:var(--border)}

/* ===== 详情页 ===== */
.detail-hero{display:grid;grid-template-columns:280px 1fr;gap:30px;align-items:start}
@media (max-width:720px){.detail-hero{grid-template-columns:1fr}}
.detail-poster{aspect-ratio:5/7;border-radius:var(--radius);overflow:hidden;background:var(--bg-2);box-shadow:var(--shadow)}
.detail-meta{color:var(--ink-2)}
.detail-meta ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;margin:14px 0}
.detail-meta li{display:flex;gap:6px;font-size:14px}
.detail-meta b{color:var(--ink);margin-right:4px}
.tag-row{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.tag-row .tag{position:static;background:var(--bg-2);color:var(--primary-dark);font-size:12.5px}
.section-block{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-top:24px}
.episode-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;list-style:none;padding:0;margin:0}
.episode-list a{display:block;padding:10px;text-align:center;background:var(--bg-2);color:var(--ink);border-radius:8px;font-weight:600;font-size:13.5px}
.episode-list a:hover{background:var(--primary);color:#fff;text-decoration:none}

/* ===== 评论/相关推荐 ===== */
.related{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:18px}

/* ===== Footer ===== */
.site-footer{background:var(--bg-2);border-top:1px solid var(--border);padding:48px 0 24px;margin-top:48px}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:30px}
.foot-grid h3{font-size:15px;color:var(--ink);margin-bottom:10px}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{margin:6px 0;font-size:14px;color:var(--ink-2)}
.foot-grid p{font-size:13.5px;color:var(--ink-2)}
.copyright{font-size:12.5px;color:var(--muted);text-align:center;border-top:1px dashed var(--border);padding-top:18px;margin-top:32px}

/* ===== 文章 ===== */
.article{max-width:780px;margin:0 auto}
.article p{font-size:16px}
.article h2{margin-top:32px}
.article blockquote{border-left:4px solid var(--primary);padding:6px 16px;background:var(--bg-2);margin:18px 0;border-radius:0 8px 8px 0;color:var(--ink-2)}
.article ul li{margin:6px 0}
.article .info{display:flex;gap:16px;color:var(--muted);font-size:13px;margin:6px 0 22px;flex-wrap:wrap}

/* ===== 工具栏：回到顶部 ===== */
.to-top{position:fixed;right:20px;bottom:24px;width:42px;height:42px;border-radius:50%;background:var(--primary);color:#fff;border:0;cursor:pointer;font-size:18px;opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s;box-shadow:var(--shadow);z-index:40}
.to-top.show{opacity:1;pointer-events:auto;transform:translateY(0)}

/* ===== 响应式 ===== */
@media (max-width:880px){
  .nav{display:none}
  .header-inner{gap:10px}
  .search input{width:120px}
}
@media (max-width:560px){
  .header-inner{height:58px}
  .brand-text small{display:none}
  .hero{padding:46px 0 24px}
  .cta-form input{min-width:0;width:100%}
  .section{padding:36px 0}
}


/* ===== 站内搜索页 ===== */
.search-hero{padding:56px 0 32px;background:radial-gradient(120% 80% at 0% 0%,#FFF1CC 0%,transparent 60%),radial-gradient(120% 80% at 100% 0%,#FFE0A5 0%,transparent 60%)}
.search-hero h1{margin-bottom:6px}
.search-hero h1 .hl{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.search-hero p{color:var(--muted);margin:0 0 20px}
.search-big{display:flex;gap:10px;flex-wrap:wrap;max-width:720px}
.search-big input{flex:1;min-width:240px;padding:14px 20px;border-radius:999px;border:2px solid var(--border);background:var(--card);color:inherit;font-size:16px;outline:0}
.search-big input:focus{border-color:var(--primary)}
.hot-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px}
.hot-label{color:var(--muted);font-size:13.5px;font-weight:600}
.chip{padding:6px 14px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--ink-2);font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit}
.chip:hover{border-color:var(--primary);color:var(--ink)}
.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}
.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;padding-bottom:16px;border-bottom:1px dashed var(--border)}
.result-list{display:grid;gap:10px}
.result{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:inherit;transition:.18s}
.result:hover{transform:translateX(3px);border-color:var(--primary);box-shadow:var(--shadow);text-decoration:none}
.r-type{flex:0 0 auto;padding:3px 10px;border-radius:6px;font-size:12px;font-weight:700;margin-top:2px}
.r-短剧{background:#FFE7A5;color:#8A5B00}
.r-资讯{background:#D6EAF8;color:#1B5E8C}
.r-分类{background:#DFF3E4;color:#1E6B3A}
.r-页面{background:#EDE3F7;color:#5B3A8C}
[data-theme="dark"] .r-短剧{background:#4A3A18;color:#F0C86A}
[data-theme="dark"] .r-资讯{background:#1B3A4D;color:#8FC9E8}
[data-theme="dark"] .r-分类{background:#1E3D2A;color:#8FD9A8}
[data-theme="dark"] .r-页面{background:#33244A;color:#C3A5E8}
.r-body{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.r-title{font-size:16.5px;color:var(--ink);line-height:1.4}
.r-tag{font-size:12.5px;color:var(--primary-dark);font-weight:600}
.r-desc{font-size:13.5px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.r-go{flex:0 0 auto;color:var(--muted);font-size:18px;margin-top:2px}
.result mark{background:var(--primary);color:#2C2416;border-radius:3px;padding:0 2px;font-weight:700}
.search-empty{text-align:center;padding:56px 20px;background:var(--card);border:1px dashed var(--border);border-radius:var(--radius)}
.search-empty h3{margin:8px 0 6px}
.sr-status{color:var(--muted);font-size:14px;margin-bottom:12px;font-weight:600}
@media (max-width:560px){
  .search-hero{padding:38px 0 24px}
  .search-big input{min-width:0;width:100%}
  .result{padding:14px}
  .r-go{display:none}
}
