:root {
  --primary: #f97316;
  --accent: #facc15;
  --bg: #1a1410;
  --text: #fff7ed;
  --text-dim: rgba(255,247,237,0.6);
  --card-bg: rgba(255,247,237,0.05);
  --card-border: rgba(255,247,237,0.1);
  --shadow: rgba(0,0,0,0.4);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg);
  color: var(--text);
  overflow-x: hidden;
}
h1,h2,h3,h4,h5,h6 { font-weight:900; letter-spacing:-0.03em; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; display:block; }

/* ===== NAV ===== */
.navbar-custom {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  padding: 16px 0;
  transition: all 0.4s cubic-bezier(.4,0,.2,1);
  background: transparent;
}
.navbar-custom.scrolled {
  background: rgba(26,20,16,0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 10px 0;
  box-shadow: 0 10px 40px var(--shadow);
}
.navbar-inner {
  display:flex; align-items:center; justify-content:space-between;
  max-width:1440px; margin:0 auto; padding:0 24px;
}
.brand {
  font-size:28px; font-weight:900; color:var(--text);
  display:flex; align-items:center; gap:8px; letter-spacing:-0.02em;
}
.brand i { color: var(--primary); font-size:24px; }
.nav-links { display:flex; gap:32px; align-items:center; }
.nav-links a {
  color: var(--text); font-weight:500; font-size:14px;
  opacity:0.75; transition: all 0.2s;
  position:relative; letter-spacing:0.02em;
}
.nav-links a:hover { opacity:1; color:var(--accent); }
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px;
  background:var(--accent); transition:width 0.3s;
}
.nav-links a:hover::after { width:100%; }
.mobile-toggle {
  display:none; background:none; border:none; color:var(--text);
  font-size:24px; cursor:pointer;
}
@media (max-width: 992px) {
  .nav-links {
    position:fixed; top:60px; right:-100%; flex-direction:column;
    background:rgba(26,20,16,0.98); padding:24px; border-radius:16px;
    transition:right 0.4s ease; gap:20px; min-width:200px;
    backdrop-filter: blur(20px); border:1px solid var(--card-border);
  }
  .nav-links.open { right:16px; }
  .mobile-toggle { display:block; }
}

/* ===== HERO / BANNER ===== */
.hero-section {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(26,20,16,0.7), rgba(26,20,16,0.3)),
              url('{随机图片}') center/cover no-repeat;
  position:relative; padding:120px 0 80px;
}
.hero-content {
  text-align:center; max-width:900px; padding:0 24px;
  position:relative; z-index:2;
}
.hero-title {
  font-size: clamp(3rem, 8vw, 5rem);
  font-weight:900; line-height:1.1; margin-bottom:24px;
  text-shadow: 0 8px 40px rgba(0,0,0,0.6);
  letter-spacing:-0.04em;
}
.hero-title .highlight {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-sub {
  font-size:20px; color:var(--text); opacity:0.85;
  font-weight:300; margin-bottom:40px; letter-spacing:0.02em;
  line-height:1.8; max-width:700px; margin-left:auto; margin-right:auto;
}
.btn-custom {
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 40px; border-radius:50px; font-weight:700; font-size:16px;
  color:var(--bg); background: linear-gradient(135deg, var(--primary), #fb923c);
  border:none; cursor:pointer; transition: all 0.4s ease;
  position:relative; overflow:hidden;
}
.btn-custom::before {
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.3), transparent);
  transition: left 0.5s;
}
.btn-custom:hover::before { left:100%; }
.btn-custom:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(249,115,22,0.3); }
.hero-scroll {
  position:absolute; bottom:40px; left:50%; transform:translateX(-50%);
  color:var(--text); opacity:0.6; font-size:14px; letter-spacing:0.2em;
  text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:8px;
}

/* ===== SECTION ===== */
.section-padding { padding: 100px 0; }
.section-header {
  margin-bottom: 56px; position:relative;
}
.section-tag {
  display:inline-block; background: rgba(249,115,22,0.15);
  color:var(--primary); padding:8px 20px; border-radius:50px;
  font-size:13px; font-weight:700; letter-spacing:0.1em;
  margin-bottom:16px; border:1px solid rgba(249,115,22,0.3);
}
.section-title {
  font-size: clamp(2.2rem, 5vw, 3.2rem);
  font-weight:900; margin-bottom:16px;
}
.section-desc { color:var(--text-dim); font-size:16px; max-width:600px; line-height:1.8; }

/* ===== CATEGORY ===== */
.category-grid {
  display:grid; grid-template-columns: repeat(6, 1fr); gap:24px;
}
.category-card {
  background: var(--card-bg); border:1px solid var(--card-border);
  border-radius: 20px; padding:32px 16px; text-align:center;
  transition: all 0.3s ease; cursor:pointer;
}
.category-card:hover {
  transform: translateY(-8px); background: rgba(249,115,22,0.1);
  border-color: var(--primary); box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}
.category-card i {
  font-size:36px; margin-bottom:16px; display:block;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.category-card span { font-weight:600; font-size:15px; }
@media (max-width:768px) {
  .category-grid { grid-template-columns: repeat(3, 1fr); gap:12px; }
}

/* ===== MOVIE CARDS ===== */
.movie-grid {
  display:grid; grid-template-columns: repeat(4, 1fr); gap:24px;
}
@media (max-width: 992px) { .movie-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px) { .movie-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .movie-grid { grid-template-columns: repeat(2, 1fr); gap:12px; } }

.movie-card {
  background: var(--card-bg); border:1px solid var(--card-border);
  border-radius: 16px; overflow:hidden; cursor:pointer;
  transition: all 0.4s cubic-bezier(.4,0,.2,1);
  position:relative;
}
.movie-card:hover {
  transform: translateY(-12px) scale(1.02);
  box-shadow: 0 30px 60px rgba(0,0,0,0.5);
  border-color: rgba(249,115,22,0.4);
}
.movie-poster {
  position:relative; aspect-ratio: 2/3; overflow:hidden;
  background: linear-gradient(135deg, rgba(249,115,22,0.1), rgba(250,204,21,0.1));
}
.movie-poster img {
  width:100%; height:100%; object-fit:cover;
  transition: transform 0.6s ease;
}
.movie-card:hover .movie-poster img { transform: scale(1.08); }
.movie-poster::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:60%;
  background: linear-gradient(to top, rgba(26,20,16,0.9), transparent);
}
.quality-badge {
  position:absolute; top:12px; right:12px; z-index:3;
  background: rgba(26,20,16,0.85); backdrop-filter: blur(8px);
  color:var(--accent); padding:4px 12px; border-radius:50px;
  font-size:12px; font-weight:800; letter-spacing:0.05em;
  border:1px solid rgba(250,204,21,0.3);
}
.rating-badge {
  position:absolute; bottom:12px; right:12px; z-index:3;
  background: linear-gradient(135deg, var(--primary), #fb923c);
  color:#fff; padding:4px 10px; border-radius:50px;
  font-size:14px; font-weight:800;
  display:flex; align-items:center; gap:4px;
}
.movie-info { padding:16px; }
.movie-title {
  font-size:16px; font-weight:700; margin-bottom:8px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.movie-meta { display:flex; gap:12px; font-size:12px; color:var(--text-dim); }
.movie-meta span { white-space:nowrap; }

/* ===== RANKING ===== */
.ranking-list { display:flex; flex-direction:column; gap:16px; }
.ranking-item {
  display:flex; align-items:center; gap:20px;
  background: var(--card-bg); border:1px solid var(--card-border);
  padding:16px 24px; border-radius:16px;
  transition: all 0.3s ease;
}
.ranking-item:hover {
  background: rgba(249,115,22,0.08);
  border-color: var(--primary);
  transform: translateX(8px);
}
.rank-num {
  font-size:32px; font-weight:900;
  font-family: 'JetBrains Mono', 'Courier New', monospace;
  color:var(--primary); min-width:50px;
}
.rank-poster {
  width:80px; height:110px; border-radius:12px; overflow:hidden; flex-shrink:0;
}
.rank-poster img { width:100%; height:100%; object-fit:cover; }
.rank-info { flex:1; }
.rank-title { font-weight:700; font-size:18px; margin-bottom:4px; }
.rank-meta { color:var(--text-dim); font-size:14px; display:flex; gap:16px; }
.rank-score { color:var(--accent); font-weight:800; font-size:16px; }

/* ===== FEATURED TABLE ===== */
.comparison-table { 
  width:100%; border-collapse:separate; border-spacing:0 12px;
}
.comparison-table th, .comparison-table td {
  padding:20px 24px; background: var(--card-bg);
  border:1px solid var(--card-border);
  font-size:15px;
}
.comparison-table th:first-child { border-radius:16px 0 0 16px; }
.comparison-table th:last-child { border-radius:0 16px 16px 0; }
.comparison-table td:first-child { border-radius:16px 0 0 16px; }
.comparison-table td:last-child { border-radius:0 16px 16px 0; }
.comparison-table thead th {
  font-weight:800; color:var(--primary); font-size:16px;
}
.comparison-table td {
  color:var(--text); font-weight:400;
}
.check-icon { color: var(--accent); margin-right:8px; }
.times-icon { color: var(--text-dim); margin-right:8px; }

/* ===== FAQ ===== */
.faq-item {
  background: var(--card-bg); border:1px solid var(--card-border);
  border-radius:16px; padding:32px; margin-bottom:16px;
  transition: all 0.3s;
}
.faq-item:hover { border-color: var(--primary); }
.faq-q {
  font-size:18px; font-weight:700; margin-bottom:12px;
  display:flex; align-items:center; gap:12px;
}
.faq-q i { color: var(--primary); }
.faq-a { color: var(--text-dim); line-height:1.8; }

/* ===== MOOD PICKER ===== */
.mood-tags { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:40px; }
.mood-tag {
  padding:12px 24px; border-radius:50px; cursor:pointer;
  background: var(--card-bg); border:1px solid var(--card-border);
  color: var(--text); font-weight:600; font-size:14px;
  transition: all 0.3s;
}
.mood-tag:hover, .mood-tag.active {
  background: linear-gradient(135deg, var(--primary), #fb923c);
  border-color: transparent; color: var(--bg);
  transform: scale(1.05);
}

/* ===== FOOTER ===== */
.footer {
  background: rgba(26,20,16,0.8); border-top:1px solid var(--card-border);
  padding:80px 0 40px;
  margin-top:80px;
}
.footer-brand { font-size:24px; font-weight:900; margin-bottom:16px; }
.footer-desc { color:var(--text-dim); max-width:400px; line-height:1.8; font-size:14px; }
.footer-links { display:flex; gap:24px; flex-wrap:wrap; }
.footer-links a {
  color:var(--text-dim); font-size:14px; transition:color 0.2s;
}
.footer-links a:hover { color:var(--accent); }
.footer-bottom {
  border-top:1px solid var(--card-border); margin-top:48px; padding-top:24px;
  display:flex; justify-content:space-between; align-items:center;
  font-size:13px; color:var(--text-dim); flex-wrap:wrap; gap:16px;
}

/* ===== FRIENDLY LINKS ===== */
.friendly-links {
  padding:60px 0; border-top:1px solid var(--card-border);
}
.friendly-links h3 { font-size:18px; font-weight:700; margin-bottom:24px; display:flex; align-items:center; gap:8px; }
.friendly-links h3 i { color:var(--primary); }
.friendly-links-content { color:var(--text-dim); font-size:14px; line-height:2; }

/* ===== MODAL ===== */
.modal-overlay {
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:2000;
  background: rgba(26,20,16,0.97); backdrop-filter: blur(20px);
  display:none; align-items:center; justify-content:center;
  padding:40px 24px;
}
.modal-overlay.active { display:flex; }
.modal-content {
  max-width:800px; width:100%; position:relative;
  background: rgba(255,247,237,0.05);
  border:1px solid rgba(255,247,237,0.15);
  border-radius:24px; padding:40px;
  backdrop-filter: blur(10px);
}
.modal-close {
  position:absolute; top:16px; right:16px; width:44px; height:44px;
  border-radius:50%; background:rgba(255,255,255,0.1);
  border:none; color:var(--text); font-size:20px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: all 0.3s;
}
.modal-close:hover { background: var(--primary); transform: rotate(90deg); }
.modal-title { font-size:32px; font-weight:900; margin-bottom:24px; }
.modal-meta { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.modal-tag {
  padding:6px 16px; border-radius:50px; font-size:13px; font-weight:600;
  background: rgba(249,115,22,0.15); color:var(--primary);
}
.modal-score {
  font-size:48px; font-weight:900; color:var(--accent);
  font-family:'Courier New', monospace; margin:24px 0;
  display:flex; align-items:center; gap:12px;
}
.modal-plot { color:var(--text-dim); line-height:1.9; margin-bottom:24px; font-size:15px; }
.modal-cast { color:var(--text); font-size:14px; font-weight:500; }
.modal-cast span { color:var(--text-dim); font-weight:400; }

/* ===== BACK TO TOP ===== */
.back-to-top {
  position:fixed; bottom:40px; right:40px; z-index:999;
  width:56px; height:56px; border-radius:50%;
  background: linear-gradient(135deg, var(--primary), #fb923c);
  border:none; color:#fff; font-size:20px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform: translateY(20px); pointer-events:none;
  transition: all 0.4s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 10px 30px rgba(249,115,22,0.3);
}
.back-to-top.visible {
  opacity:1; transform: translateY(0); pointer-events:auto;
}
.back-to-top:hover { transform: translateY(-4px) scale(1.05); }

/* ===== UTILS ===== */
.mono { font-family: 'Courier New', monospace; }
.text-primary-custom { color: var(--primary); }
.text-accent-custom { color: var(--accent); }
.bg-dark-custom { background: var(--bg); }
.num-list { counter-reset: item; list-style:none; }
.num-list li { counter-increment: item; position:relative; padding-left:48px; margin-bottom:16px; line-height:1.8; color:var(--text-dim); }
.num-list li::before {
  content: counter(item);
  position:absolute; left:0; top:0;
  width:32px; height:32px; border-radius:50%;
  background: linear-gradient(135deg, var(--primary), #fb923c);
  color:#fff; font-weight:700; font-size:14px;
  display:flex; align-items:center; justify-content:center;
}

@media (max-width: 768px) {
  .section-padding { padding:60px 0; }
  .hero-section { min-height:auto; padding:120px 0 60px; }
  .hero-title { font-size:2.8rem; }
  .modal-content { padding:24px; }
  .modal-title { font-size:24px; }
}

/* --- 子页面追加 --- */
/* 本页专属样式 */
        .about-hero {
            padding: 80px 0 40px;
            background: radial-gradient(ellipse at top, rgba(249,115,22,0.12), transparent 70%);
        }
.about-section {
            padding: 50px 0;
        }
.about-section + .about-section {
            border-top: 1px solid var(--card-border);
        }
.about-icon {
            width: 56px;
            height: 56px;
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(249,115,22,0.15);
            color: var(--primary);
            font-size: 24px;
            margin-bottom: 20px;
            border: 1px solid rgba(249,115,22,0.3);
        }
.about-content {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
            margin-top: 30px;
        }
.about-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 16px;
            padding: 28px;
            transition: all 0.3s ease;
        }
.about-card:hover {
            transform: translateY(-6px);
            border-color: rgba(249,115,22,0.4);
            box-shadow: 0 12px 32px var(--shadow);
        }
.about-card h3 {
            font-size: 18px;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 12px;
            line-height: 1.4;
        }
.about-card p {
            font-size: 14px;
            color: var(--text-dim);
            line-height: 1.8;
            margin: 0;
        }
.about-card i {
            color: var(--primary);
            font-size: 22px;
            margin-bottom: 16px;
            display: inline-block;
        }
.about-story {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 16px;
            padding: 40px;
            margin-top: 30px;
        }
.about-story p {
            color: var(--text-dim);
            font-size: 15px;
            line-height: 2;
            margin-bottom: 16px;
        }
.about-story p:last-child {
            margin-bottom: 0;
        }
.about-story strong {
            color: var(--primary);
        }
.about-stats {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            margin-top: 30px;
        }
.stat-item {
            text-align: center;
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 24px 16px;
        }
.stat-number {
            font-size: 32px;
            font-weight: 800;
            color: var(--primary);
            margin-bottom: 6px;
            font-family: 'Inter', sans-serif;
        }
.stat-label {
            font-size: 13px;
            color: var(--text-dim);
        }
.about-list {
            list-style: none;
            padding: 0;
            margin: 20px 0 0;
        }
.about-list li {
            padding: 10px 0;
            color: var(--text-dim);
            font-size: 15px;
            line-height: 1.8;
            display: flex;
            gap: 12px;
            align-items: flex-start;
        }
.about-list li i {
            color: var(--primary);
            margin-top: 4px;
            flex-shrink: 0;
        }
.about-content {
                grid-template-columns: 1fr;
                gap: 20px;
            }
.about-stats {
                grid-template-columns: repeat(2, 1fr);
            }
.about-story {
                padding: 24px;
            }
.about-hero {
                padding: 60px 0 30px;
            }
.about-stats {
                grid-template-columns: 1fr;
            }

/* --- 子页面追加 --- */
.disclaimer-section {
            padding: 60px 0;
        }
.disclaimer-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 30px;
            margin-bottom: 24px;
            backdrop-filter: blur(8px);
            transition: all .3s ease;
        }
.disclaimer-card:hover {
            border-color: rgba(249, 115, 22, .3);
            box-shadow: 0 8px 30px var(--shadow);
        }
.disclaimer-card h2 {
            color: var(--primary);
            font-size: 1.5rem;
            font-weight: 700;
            margin-bottom: 16px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
.disclaimer-card h2 i {
            font-size: 1.2rem;
            color: var(--accent);
        }
.disclaimer-card p, .disclaimer-card li {
            color: var(--text-dim);
            line-height: 1.8;
            font-size: .95rem;
        }
.disclaimer-card ul {
            padding-left: 20px;
            margin-bottom: 12px;
        }
.disclaimer-card ul li {
            margin-bottom: 8px;
        }
.disclaimer-card strong {
            color: var(--text);
        }
.alert-box {
            background: linear-gradient(135deg, rgba(249,115,22,.15), rgba(250,204,21,.1));
            border: 1px solid rgba(249,115,22,.3);
            border-radius: 8px;
            padding: 16px 20px;
            margin-bottom: 24px;
            color: var(--text);
            font-size: .95rem;
            display: flex;
            align-items: flex-start;
            gap: 12px;
        }
.alert-box i {
            color: var(--primary);
            font-size: 1.3rem;
            margin-top: 2px;
        }
.disclaimer-section {
                padding: 40px 0;
            }
.disclaimer-card {
                padding: 20px;
            }
.disclaimer-card h2 {
                font-size: 1.2rem;
            }

/* --- 子页面追加 --- */
/* 本页专属补充样式 */
        .action-hero {
            background: linear-gradient(135deg, rgba(249,115,22,0.15) 0%, rgba(26,20,16,0.9) 100%);
            border-bottom: 1px solid var(--card-border);
        }
.action-hero .hero-title {
            text-shadow: 0 4px 30px rgba(249,115,22,0.3);
        }
.tag-pill {
            display: inline-block;
            padding: 0.25rem 0.9rem;
            border-radius: 20px;
            background: rgba(249,115,22,0.15);
            color: var(--accent);
            border: 1px solid rgba(249,115,22,0.3);
            font-size: 0.8rem;
            font-weight: 600;
            margin: 0.2rem 0.3rem;
        }
.feature-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 14px;
            padding: 1.6rem 1.4rem;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            height: 100%;
        }
.feature-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 8px 30px var(--shadow);
        }
.feature-card .icon-circle {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--primary), var(--accent));
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
            color: #1a1410;
            margin-bottom: 1rem;
        }
.pick-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 1.5rem;
            transition: background 0.3s ease;
        }
.pick-card:hover {
            background: rgba(255,247,237,0.08);
        }
.pick-number {
            font-size: 2.5rem;
            font-weight: 900;
            color: var(--primary);
            opacity: 0.7;
            line-height: 1;
            margin-bottom: 0.5rem;
        }
.highlight-text {
            color: var(--accent);
            font-weight: 600;
        }
.list-check {
            color: var(--primary);
            margin-right: 0.5rem;
        }
.tip-box {
            background: rgba(249,115,22,0.06);
            border-left: 3px solid var(--primary);
            padding: 1rem 1.2rem;
            border-radius: 0 10px 10px 0;
            margin: 1.5rem 0;
        }

/* --- 子页面追加 --- */
/* Page-specific styles for slice-of-life category */
        .category-hero {
            background: linear-gradient(135deg, rgba(249,115,22,0.15) 0%, rgba(250,204,21,0.05) 50%, rgba(26,20,16,0.8) 100%);
            border-bottom: 1px solid var(--card-border);
            padding: 80px 0 60px;
            position: relative;
            overflow: hidden;
        }
.category-hero::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -20%;
            width: 500px;
            height: 500px;
            background: radial-gradient(circle, rgba(249,115,22,0.1) 0%, transparent 70%);
            border-radius: 50%;
            pointer-events: none;
        }
.category-hero-content {
            max-width: 800px;
            margin: 0 auto;
            text-align: center;
            position: relative;
            z-index: 1;
        }
.category-hero-tag {
            display: inline-block;
            background: rgba(249,115,22,0.15);
            color: var(--accent);
            padding: 8px 20px;
            border-radius: 50px;
            font-size: 0.85rem;
            font-weight: 600;
            letter-spacing: 1px;
            margin-bottom: 20px;
            border: 1px solid rgba(249,115,22,0.3);
        }
.category-hero h1 {
            font-size: 2.8rem;
            font-weight: 800;
            color: var(--text);
            margin-bottom: 20px;
            line-height: 1.2;
        }
.category-hero h1 .highlight {
            color: var(--primary);
        }
.category-hero p {
            color: var(--text-dim);
            font-size: 1.1rem;
            line-height: 1.8;
            max-width: 650px;
            margin: 0 auto;
        }
.movie-tags {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }
.movie-tags span {
            background: rgba(255,255,255,0.1);
            color: var(--text-dim);
            padding: 2px 8px;
            border-radius: 4px;
            font-size: 0.7rem;
        }
.feature-box {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 30px;
            height: 100%;
            transition: transform 0.3s ease;
        }
.feature-box:hover {
            transform: translateY(-3px);
        }
.feature-icon {
            font-size: 2rem;
            color: var(--primary);
            margin-bottom: 15px;
        }
.feature-title {
            font-size: 1.1rem;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 10px;
        }
.feature-text {
            color: var(--text-dim);
            font-size: 0.9rem;
            line-height: 1.6;
        }
.recommendation-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 25px;
            margin-bottom: 20px;
            transition: transform 0.3s ease;
        }
.recommendation-card:hover {
            transform: translateX(5px);
        }
.recommendation-number {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--primary);
            opacity: 0.3;
            margin-right: 20px;
            line-height: 1;
        }
.recommendation-title {
            font-size: 1.1rem;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 8px;
        }
.recommendation-desc {
            color: var(--text-dim);
            font-size: 0.9rem;
            line-height: 1.6;
        }
.cta-box {
            background: linear-gradient(135deg, rgba(249,115,22,0.2) 0%, rgba(250,204,21,0.1) 100%);
            border: 1px solid rgba(249,115,22,0.3);
            border-radius: 16px;
            padding: 50px;
            text-align: center;
            margin-top: 50px;
        }
.cta-title {
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--text);
            margin-bottom: 15px;
        }
.cta-desc {
            color: var(--text-dim);
            font-size: 1rem;
            margin-bottom: 25px;
        }
.category-hero {
                padding: 60px 0 40px;
            }
.category-hero h1 {
                font-size: 2rem;
            }
.cta-box {
                padding: 30px 20px;
            }
.cta-title {
                font-size: 1.4rem;
            }

/* --- 子页面追加 --- */
.mystery-feature { border-left: 3px solid var(--primary); padding-left: 1rem; }
.mystery-tip { background: rgba(249,115,22,0.08); border: 1px solid rgba(249,115,22,0.25); border-radius: 12px; padding: 1.25rem; }
.mystery-tip i { color: var(--primary); }
.section-divider { border-top: 1px solid var(--card-border); margin: 3rem 0; }

/* --- 子页面追加 --- */
/* 恋爱番页面专属样式 */
        .romance-hero {
            background: linear-gradient(135deg, rgba(249,115,22,0.15) 0%, rgba(250,204,21,0.08) 50%, rgba(26,20,16,0.3) 100%);
            padding: 60px 0 40px;
            border-bottom: 1px solid var(--card-border);
        }
.romance-hero .hero-title {
            font-size: 2.8rem;
            font-weight: 900;
            margin-bottom: 12px;
            background: linear-gradient(90deg, #f97316, #facc15);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
.romance-hero .hero-sub {
            font-size: 1.2rem;
            color: var(--text-dim);
            max-width: 700px;
            margin: 0 auto;
        }
.romance-featured-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 16px;
            overflow: hidden;
            transition: all 0.3s ease;
            height: 100%;
        }
.romance-featured-card:hover {
            transform: translateY(-4px);
            border-color: rgba(249,115,22,0.4);
            box-shadow: 0 10px 30px var(--shadow);
        }
.romance-featured-card .featured-poster {
            height: 220px;
            background-size: cover;
            background-position: center;
            position: relative;
        }
.romance-featured-card .featured-body {
            padding: 20px;
        }
.romance-featured-card .featured-tag {
            display: inline-block;
            background: rgba(249,115,22,0.15);
            color: var(--primary);
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 0.8rem;
            font-weight: 600;
            margin-bottom: 10px;
        }
.romance-featured-card .featured-title {
            font-size: 1.2rem;
            font-weight: 700;
            margin-bottom: 8px;
            color: var(--text);
        }
.romance-featured-card .featured-desc {
            font-size: 0.9rem;
            color: var(--text-dim);
            line-height: 1.6;
        }
.romance-list-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 16px;
            margin-bottom: 16px;
            transition: all 0.3s ease;
            display: flex;
            gap: 16px;
        }
.romance-list-card:hover {
            border-color: rgba(249,115,22,0.4);
            transform: translateX(4px);
        }
.romance-list-card .list-poster {
            width: 100px;
            height: 140px;
            border-radius: 8px;
            background-size: cover;
            background-position: center;
            flex-shrink: 0;
        }
.romance-list-card .list-info {
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
.romance-list-card .list-title {
            font-size: 1.05rem;
            font-weight: 700;
            margin-bottom: 6px;
        }
.romance-list-card .list-meta {
            font-size: 0.85rem;
            color: var(--text-dim);
            margin-bottom: 8px;
        }
.romance-list-card .list-desc {
            font-size: 0.88rem;
            color: var(--text-dim);
            line-height: 1.5;
        }
.romance-list-card .sweetness {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            color: #facc15;
            font-size: 0.8rem;
            margin-top: 8px;
        }
.romance-list-card .sweetness i {
            font-size: 0.7rem;
        }
.romance-tips {
            background: linear-gradient(135deg, rgba(249,115,22,0.08), rgba(250,204,21,0.05));
            border: 1px solid rgba(249,115,22,0.2);
            border-radius: 16px;
            padding: 30px;
            margin: 40px 0;
        }
.romance-tips h3 {
            color: var(--primary);
            font-weight: 700;
            margin-bottom: 16px;
        }
.romance-tips ul {
            padding-left: 20px;
            color: var(--text-dim);
            line-height: 2;
        }
.romance-tips li::marker {
            color: var(--primary);
        }
.sweetness-bar {
            display: inline-block;
            padding: 3px 10px;
            border-radius: 20px;
            font-size: 0.75rem;
            font-weight: 600;
            background: rgba(250,204,21,0.15);
            color: #facc15;
            margin-left: 8px;
        }
.romance-hero .hero-title {
                font-size: 2rem;
            }
.romance-list-card {
                flex-direction: column;
            }
.romance-list-card .list-poster {
                width: 100%;
                height: 180px;
            }

/* --- 子页面追加 --- */
.contact-hero {
            background: linear-gradient(135deg, rgba(249,115,22,0.15) 0%, rgba(250,204,21,0.08) 50%, rgba(26,20,16,0.95) 100%);
            padding: 80px 0 60px;
            border-bottom: 1px solid var(--card-border);
        }
.contact-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 24px;
            margin-top: 40px;
        }
.contact-card {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 30px 24px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
.contact-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 12px 30px var(--shadow);
        }
.contact-icon {
            width: 60px;
            height: 60px;
            border-radius: 50%;
            background: rgba(249,115,22,0.15);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
            font-size: 24px;
            color: var(--primary);
        }
.contact-card h3 {
            color: var(--text);
            font-size: 1.15rem;
            font-weight: 700;
            margin-bottom: 12px;
        }
.contact-card p {
            color: var(--text-dim);
            font-size: 0.9rem;
            line-height: 1.7;
            margin-bottom: 16px;
        }
.contact-link {
            color: var(--primary);
            font-weight: 600;
            text-decoration: none;
            font-size: 0.95rem;
            transition: color 0.3s;
        }
.contact-link:hover {
            color: var(--accent);
        }
.contact-form-wrap {
            margin-top: 60px;
        }
.contact-form {
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 16px;
            padding: 40px;
        }
.contact-form .form-control {
            background: rgba(0,0,0,0.3);
            border: 1px solid var(--card-border);
            color: var(--text);
            padding: 12px 16px;
            border-radius: 8px;
            font-size: 0.95rem;
        }
.contact-form .form-control:focus {
            background: rgba(0,0,0,0.4);
            border-color: var(--primary);
            box-shadow: 0 0 0 0.2rem rgba(249,115,22,0.1);
            color: var(--text);
        }
.contact-form .form-control::placeholder {
            color: rgba(255,247,237,0.4);
        }
.contact-form label {
            color: var(--text);
            font-weight: 600;
            font-size: 0.9rem;
            margin-bottom: 8px;
        }
.contact-form .form-select {
            background-color: rgba(0,0,0,0.3);
            border: 1px solid var(--card-border);
            color: var(--text);
        }
.contact-form .form-select option {
            background-color: var(--bg);
            color: var(--text);
        }
.contact-form .form-select:focus {
            border-color: var(--primary);
            box-shadow: 0 0 0 0.2rem rgba(249,115,22,0.1);
        }
.faq-item h4 {
            color: var(--text);
            font-size: 1rem;
            font-weight: 600;
            margin-bottom: 8px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
.faq-item h4 i {
            color: var(--primary);
            font-size: 0.9rem;
        }
.faq-item p {
            color: var(--text-dim);
            font-size: 0.9rem;
            line-height: 1.7;
            padding-left: 28px;
            margin-bottom: 0;
        }
.contact-info-text {
            color: var(--text-dim);
            font-size: 0.95rem;
            line-height: 1.8;
            text-align: center;
            margin-top: 30px;
        }
.contact-info-text a {
            color: var(--primary);
            text-decoration: none;
        }
.contact-info-text a:hover {
            color: var(--accent);
        }

/* --- 子页面追加 --- */
/* 科幻番页面专属微调 —— 保持全站视觉一致,仅补充必要细节 */
    .sci-fi-hero {
      background: radial-gradient(circle at 20% 30%, rgba(249,115,22,0.15), transparent 50%),
                  linear-gradient(135deg, #1a1410 0%, #1a1410 100%);
      border-bottom: 1px solid var(--card-border);
    }
.sci-fi-hero .hero-title {
      font-size: 2.8rem;
      letter-spacing: -0.02em;
    }
.sci-fi-tag {
      display: inline-block;
      background: rgba(249,115,22,0.12);
      border: 1px solid rgba(249,115,22,0.4);
      color: var(--accent);
      padding: 0.2rem 0.8rem;
      border-radius: 20px;
      font-size: 0.8rem;
      font-weight: 600;
      margin-right: 0.4rem;
      margin-bottom: 0.4rem;
    }
.spec-list {
      list-style: none;
      padding-left: 0;
    }
.spec-list li {
      padding: 0.3rem 0;
      border-bottom: 1px dashed rgba(255,247,237,0.1);
      color: var(--text-dim);
      font-size: 0.95rem;
    }
.spec-list li i {
      color: var(--primary);
      margin-right: 8px;
      width: 18px;
    }
.rank-number {
      font-weight: 800;
      color: var(--accent);
      font-size: 1.2rem;
      min-width: 2rem;
    }