:root{
    --primary: #6d5dfc;
    --accent: #22d3ee;
    --bg: #0f1020;
    --text: #e8eaf6;
    --bg-light: #1a1b2e;
    --bg-card: #171829;
    --border-color: #2a2c42;
    --gold: #ffd700;
    --silver: #c0c0c0;
    --bronze: #cd7f32;
    --font-title: 'Inter', sans-serif;
    --font-mono: 'SF Mono', 'Fira Code', 'Roboto Mono', monospace;
  }
  *{ border-radius: 0 !important; }
  body{
    background-color: var(--bg);
    color: var(--text);
    font-family: var(--font-title);
    line-height: 1.7;
  }
  h1,h2,h3,h4,h5,h6{
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #fff;
  }
  .navbar{
    background: rgba(15,16,32,0.95);
    backdrop-filter: blur(12px);
    border-bottom: 2px solid var(--primary);
    padding: 0.8rem 0;
    z-index: 999;
  }
  .navbar-brand{
    font-weight: 900;
    font-size: 1.6rem;
    color: #fff !important;
    letter-spacing: -0.03em;
  }
  .navbar-brand i{
    color: var(--primary);
    margin-right: 8px;
  }
  .nav-link{
    font-weight: 500;
    color: var(--text) !important;
    margin: 0 0.8rem;
    position: relative;
    padding: 0.5rem 0 !important;
  }
  .nav-link::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--primary);
    transition: width 0.3s;
  }
  .nav-link:hover::after, .nav-link.active::after{
    width: 100%;
  }
  .hero-section{
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    border-bottom: 2px solid var(--primary);
    background: radial-gradient(ellipse at 30% 50%, rgba(109,93,252,0.3) 0%, transparent 60%),
                radial-gradient(ellipse at 70% 20%, rgba(34,211,238,0.15) 0%, transparent 50%);
  }
  .hero-title{
    font-size: 4rem;
    font-weight: 900;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
    line-height: 1.2;
    letter-spacing: -0.04em;
    text-shadow: 0 0 30px rgba(109,93,252,0.5);
  }
  .hero-subtitle{
    font-size: 1.2rem;
    color: #aab;
    text-align: center;
    max-width: 600px;
    margin: 1.5rem auto;
    font-weight: 400;
  }
  .float-element{
    position: absolute;
    animation: float 6s ease-in-out infinite;
    opacity: 0.3;
    font-size: 2rem;
    color: var(--accent);
  }
  @keyframes float{
    0%,100%{ transform: translateY(0) rotate(0deg); }
    50%{ transform: translateY(-20px) rotate(10deg); }
  }
  .section{
    padding: 5rem 0;
    position: relative;
  }
  .section-header{
    margin-bottom: 3rem;
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  .section-header h2{
    font-size: 2rem;
    font-weight: 800;
    margin: 0;
    border-left: 4px solid var(--primary);
    padding-left: 1rem;
  }
  .section-header i{
    color: var(--primary);
  }
  .movie-card{
    background: var(--bg-card);
    border: 2px solid var(--border-color);
    box-shadow: 4px 4px 0 0 rgba(109,93,252,0.3);
    transition: all 0.3s ease;
    cursor: pointer;
    height: 100%;
    overflow: hidden;
  }
  .movie-card:hover{
    transform: scale(1.02);
    border-color: var(--primary);
    box-shadow: 6px 6px 0 0 rgba(109,93,252,0.5);
  }
  .movie-card .card-img-wrapper{
    position: relative;
    aspect-ratio: 2/3;
    overflow: hidden;
    background: var(--bg-light);
  }
  .movie-card img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s;
  }
  .movie-card:hover img{
    transform: scale(1.05);
  }
  .rating-badge{
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(0,0,0,0.8);
    color: var(--accent);
    font-family: var(--font-mono);
    font-weight: 700;
    padding: 4px 8px;
    border: 1px solid var(--accent);
    font-size: 0.85rem;
  }
  .card-body{
    padding: 1rem;
  }
  .card-title{
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .card-meta{
    color: #888;
    font-size: 0.8rem;
    display: flex;
    gap: 0.5rem;
    align-items: center;
  }
  .category-tag{
    display: inline-block;
    background: rgba(109,93,252,0.2);
    border: 1px solid var(--primary);
    color: var(--accent);
    padding: 2px 8px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }
  .rank-list{
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .rank-list li{
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 0.8rem 1rem;
    margin-bottom: 0.8rem;
    transition: all 0.2s;
  }
  .rank-list li:hover{
    border-color: var(--primary);
    transform: translateX(5px);
  }
  .rank-number{
    font-family: var(--font-mono);
    font-weight: 900;
    font-size: 1.4rem;
    width: 40px;
    text-align: center;
    color: #666;
  }
  .rank-number.gold{ color: var(--gold); }
  .rank-number.silver{ color: var(--silver); }
  .rank-number.bronze{ color: var(--bronze); }
  .rank-info h5{
    font-weight: 700;
    font-size: 1rem;
    margin: 0;
  }
  .rank-info p{
    font-size: 0.8rem;
    color: #888;
    margin: 0;
  }
  .timeline{
    position: relative;
    padding-left: 2rem;
  }
  .timeline::before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, var(--primary), var(--accent));
  }
  .timeline-item{
    position: relative;
    padding-bottom: 1.5rem;
  }
  .timeline-item::before{
    content: '';
    position: absolute;
    left: -2rem;
    top: 0.4rem;
    width: 12px;
    height: 12px;
    background: var(--bg);
    border: 2px solid var(--primary);
    transform: translateX(-50%);
  }
  .timeline-item h5{
    font-weight: 700;
    color: var(--accent);
  }
  .faq-item{
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 1.5rem;
    margin-bottom: 1rem;
  }
  .faq-item h4{
    color: var(--accent);
    font-weight: 700;
    font-size: 1.1rem;
  }
  .footer{
    background: #0a0b18;
    border-top: 2px solid var(--primary);
    padding: 3rem 0;
  }
  .footer a{
    color: #888;
    text-decoration: none;
    transition: color 0.2s;
  }
  .footer a:hover{
    color: var(--accent);
  }
  .friend-links{
    border: 1px solid var(--border-color);
    background: rgba(26,27,46,0.5);
    padding: 1.5rem;
    margin: 2rem 0;
  }
  .friend-links h5{
    color: var(--accent);
    font-weight: 700;
  }
  .modal-content{
    background: var(--bg-card);
    border: 2px solid var(--primary);
    box-shadow: 8px 8px 0 rgba(0,0,0,0.5);
    border-radius: 0;
  }
  .modal-header{
    border-bottom: 1px solid var(--border-color);
  }
  .modal-body{
    padding: 2rem;
  }
  .modal img{
    width: 100%;
    border: 1px solid var(--border-color);
  }
  .btn-close{
    filter: invert(1);
  }
  .fade-in{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }
  .fade-in.visible{
    opacity: 1;
    transform: translateY(0);
  }
  .stagger-delay-1{ transition-delay: 0.1s; }
  .stagger-delay-2{ transition-delay: 0.2s; }
  .stagger-delay-3{ transition-delay: 0.3s; }
  .stagger-delay-4{ transition-delay: 0.4s; }
  .stagger-delay-5{ transition-delay: 0.5s; }
  .btn-primary-custom{
    background: var(--primary);
    border: 2px solid var(--primary);
    color: #fff;
    font-weight: 700;
    padding: 0.8rem 2rem;
    transition: all 0.2s;
    box-shadow: 3px 3px 0 0 var(--accent);
  }
  .btn-primary-custom:hover{
    background: transparent;
    color: var(--primary);
    box-shadow: 3px 3px 0 0 var(--primary);
  }
  .nav-tabs-custom .nav-link{
    background: transparent;
    border: 1px solid var(--border-color);
    color: var(--text);
    margin-right: 0.5rem;
    font-weight: 600;
  }
  .nav-tabs-custom .nav-link.active{
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
  }
  .badge-custom{
    display: inline-block;
    padding: 4px 12px;
    background: rgba(109,93,252,0.2);
    border: 1px solid var(--primary);
    color: var(--accent);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }

/* --- 子页面追加 --- */
/* 本页专属小范围样式 */
    .guide-hero { padding: 60px 0 30px; }
.guide-section { padding: 30px 0; }
.guide-card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 12px; padding: 28px; margin-bottom: 24px; transition: border-color .3s; }
.guide-card:hover { border-color: var(--primary); }
.guide-card h2 { color: var(--text); font-weight: 700; font-size: 1.5rem; margin-bottom: 16px; }
.guide-card h2 i { color: var(--accent); margin-right: 10px; }
.guide-card h3 { color: var(--text); font-weight: 600; font-size: 1.15rem; margin: 18px 0 10px; }
.guide-card p, .guide-card li { color: rgba(232,234,246,.8); line-height: 1.8; }
.guide-card ul, .guide-card ol { padding-left: 20px; }
.guide-card li { margin-bottom: 6px; }
.guide-card .badge-custom { display: inline-block; background: rgba(109,93,252,.15); color: var(--primary); border-radius: 6px; padding: 2px 10px; font-size: .8rem; font-weight: 600; margin-right: 6px; }
.step-num { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: var(--primary); color: #fff; border-radius: 50%; font-weight: 700; font-size: .9rem; margin-right: 10px; }
.tip-box { background: rgba(34,211,238,.08); border-left: 4px solid var(--accent); padding: 14px 18px; border-radius: 0 8px 8px 0; margin: 16px 0; }
.tip-box p { margin: 0; color: rgba(232,234,246,.85); }
.tip-box strong { color: var(--accent); }
.faq-q { font-weight: 600; color: var(--text); margin-top: 18px; margin-bottom: 6px; }
.faq-q i { color: var(--gold); margin-right: 8px; }
.faq-a { color: rgba(232,234,246,.75); padding-left: 26px; margin-bottom: 8px; }
.guide-card { padding: 20px; }

/* --- 子页面追加 --- */
.disclaimer-section { padding: 80px 0 60px; }
.disclaimer-container { max-width: 900px; margin: 0 auto; }
.disclaimer-hero { background: linear-gradient(135deg, rgba(109, 93, 252, 0.15) 0%, rgba(34, 211, 238, 0.1) 100%); border: 1px solid var(--border-color); border-radius: 16px; padding: 40px; margin-bottom: 40px; }
.disclaimer-hero h1 { color: var(--primary); font-size: 2.2rem; font-weight: 800; margin-bottom: 16px; }
.disclaimer-hero p { color: var(--text); opacity: 0.85; font-size: 1.05rem; line-height: 1.8; }
.disclaimer-block { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 12px; padding: 30px; margin-bottom: 24px; }
.disclaimer-block h2 { color: var(--primary); font-size: 1.5rem; font-weight: 700; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.disclaimer-block h2 i { color: var(--accent); font-size: 1.3rem; }
.disclaimer-block h3 { color: var(--accent); font-size: 1.15rem; font-weight: 600; margin: 20px 0 12px; }
.disclaimer-block p { color: var(--text); line-height: 1.8; margin-bottom: 14px; opacity: 0.9; }
.disclaimer-block ul { list-style: none; padding: 0; margin: 0 0 16px 0; }
.disclaimer-block ul li { color: var(--text); line-height: 1.8; padding: 6px 0 6px 24px; position: relative; opacity: 0.9; }
.disclaimer-block ul li::before { content: '▹'; position: absolute; left: 0; color: var(--primary); }
.disclaimer-block .highlight-box { background: rgba(109, 93, 252, 0.08); border-left: 3px solid var(--primary); padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 20px 0; }
.disclaimer-block .highlight-box p { margin: 0; }
.disclaimer-updated { text-align: center; color: var(--text); opacity: 0.6; font-size: 0.9rem; margin-top: 40px; }
.disclaimer-hero { padding: 28px 20px; }
.disclaimer-hero h1 { font-size: 1.8rem; }
.disclaimer-block { padding: 22px 18px; }
.disclaimer-block h2 { font-size: 1.3rem; }

/* --- 子页面追加 --- */
/* 确保卡片和表单与深色主题融合 */
        .card, .card-body, .list-group-item, .accordion-item, .accordion-button, .accordion-body {
            background: var(--bg-card);
            color: var(--text);
            border-color: var(--border-color);
        }
.form-control, .form-select {
            background: rgba(0,0,0,.35);
            color: var(--text);
            border-color: var(--border-color);
        }
.form-control::placeholder {
            color: rgba(255,255,255,.45);
        }
/* 小标题统一用品牌色点缀 */
        .section-title-light {
            border-left: 4px solid var(--primary);
            padding-left: 0.75rem;
        }
.text-accent {
            color: var(--accent);
        }
.border-soft {
            border: 1px solid var(--border-color);
        }
.bg-card-custom {
            background: var(--bg-card);
        }
/* 覆盖 bootstrap 可能出现的白底 */
        .navbar, .navbar-collapse {
            background-color: transparent !important;
        }
.navbar-toggler-icon {
            filter: invert(1);
        }

/* --- 子页面追加 --- */
/* 覆盖 Bootstrap 可能引入的默认白底，保证风格统一 */
    .card, .card-body, .card-title, .card-text, .card-header, .card-footer,
    .list-group-item, .accordion-item, .accordion-button, .accordion-body,
    .modal-content, .modal-header, .modal-body, .dropdown-menu, .dropdown-item,
    .form-control, .form-select {
      background: var(--bg-card);
      color: var(--text);
      border-color: var(--border-color);
    }
/* 站点地图专用微调 */
    .sitemap-section { margin-bottom: 2.5rem; }
.sitemap-section h2 {
      font-family: var(--font-title);
      font-weight: 700;
      font-size: 1.5rem;
      border-left: 4px solid var(--primary);
      padding-left: 0.75rem;
      margin-bottom: 1.25rem;
      color: var(--text);
    }
.sitemap-link-list {
      list-style: none;
      padding-left: 0;
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
      gap: 0.75rem;
    }
.sitemap-link-list li a {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.6rem 1rem;
      background: var(--bg-light);
      border: 1px solid var(--border-color);
      border-radius: 12px;
      color: var(--text);
      text-decoration: none;
      transition: all .2s ease;
      font-family: var(--font-title);
      font-weight: 500;
    }
.sitemap-link-list li a i {
      color: var(--primary);
      width: 1.2rem;
      text-align: center;
    }
.sitemap-link-list li a:hover {
      border-color: var(--primary);
      background: rgba(109, 93, 252, 0.08);
      color: var(--accent);
      transform: translateX(3px);
    }
.anchor-note {
      font-size: 0.9rem;
      color: var(--text);
      opacity: 0.75;
      font-family: var(--font-title);
      margin-top: 1rem;
    }
.anchor-note a { color: var(--accent); }

/* --- Bootstrap 组件配色适配(程序自动补,避免白底黑字) --- */
.accordion-header { background:transparent !important; }
