:root{
            --main:#10b981;
            --accent:#fbbf24;
            --bg:#0a1410;
            --text:#ecfdf5;
            --card-bg:#10241b;
            --radius-card:14px;
            --radius-btn:50px;
            --shadow:0 8px 24px rgba(0,0,0,0.4);
            --font-mono:'SF Mono', 'Fira Code', monospace;
        }
        *{font-family:'Inter',sans-serif;}
        body{
            background-color:var(--bg);
            color:var(--text);
            overflow-x:hidden;
        }
        h1,h2,h3,h4,h5,.navbar-brand{
            font-weight:900;
            letter-spacing:-0.02em;
        }
        .text-mono{
            font-family:var(--font-mono);
        }
        .bg-glass{
            background: rgba(10,20,16,0.7);
            backdrop-filter: blur(8px);
            border-bottom:1px solid rgba(16,185,129,0.2);
        }
        /* 导航 */
        .navbar-brand{
            font-size:1.7rem;
            font-weight:900;
            color:var(--main) !important;
            text-shadow:0 0 15px rgba(16,185,129,0.3);
        }
        .nav-link{
            color:var(--text) !important;
            font-weight:500;
            padding:0.5rem 1rem !important;
            border-radius:var(--radius-btn);
            transition:0.2s;
        }
        .nav-link:hover{
            background:rgba(16,185,129,0.15);
            color:var(--main) !important;
        }
        .btn-hero{
            border-radius:var(--radius-btn);
            background:var(--main);
            border:none;
            padding:0.6rem 1.8rem;
            font-weight:600;
            color:#06251a;
        }
        /* hero parallax */
        .hero-section{
            position:relative;
            min-height:420px;
            background:linear-gradient(145deg,#0f2a1f, #0a1410 60%);
            overflow:hidden;
            display:flex;
            align-items:center;
            justify-content:center;
        }
        .hero-section::before{
            content:'';
            position:absolute;
            top:-50%; left:-20%;
            width:90%; height:200%;
            background-image:radial-gradient(circle at 30% 40%, rgba(16,185,129,0.2) 0%, transparent 40%),
            radial-gradient(circle at 70% 70%, rgba(251,191,36,0.1) 0%, transparent 30%);
            transform:scale(1.2);
            animation:heroFloat 14s infinite alternate;
            z-index:0;
        }
        @keyframes heroFloat{
            0%{transform:translate(0,0) scale(1);}
            100%{transform:translate(-3%,5%) scale(1.1);}
        }
        .hero-content{
            position:relative;
            z-index:2;
            text-align:center;
        }
        .stat-number{
            font-size:3rem;
            font-weight:900;
            color:var(--accent);
            font-family:var(--font-mono);
        }
        .stat-label{
            font-weight:500;
            color:rgba(236,253,245,0.7);
        }
        /* 海报卡片 */
        .movie-card{
            background:var(--card-bg);
            border-radius:var(--radius-card);
            overflow:hidden;
            border:1px solid rgba(255,255,255,0.03);
            box-shadow:var(--shadow);
            transition: transform 0.2s ease, box-shadow 0.2s;
            cursor:pointer;
            height:100%;
            position:relative;
        }
        .movie-card:hover{
            transform: translateY(-6px);
            box-shadow:0 12px 28px rgba(0,0,0,0.7);
        }
        .poster-wrap{
            position:relative;
            aspect-ratio:2/3;
            overflow:hidden;
            background:#0d1f16;
        }
        .poster-wrap img{
            width:100%;
            height:100%;
            object-fit:cover;
            transition: transform 0.4s, opacity 0.4s;
            opacity:0.85;
            background: linear-gradient(145deg, #183a2c, #0e231a);
        }
        .movie-card:hover .poster-wrap img{
            transform: scale(1.05);
            opacity:1;
        }
        .play-overlay{
            position:absolute;
            inset:0;
            background:rgba(0,0,0,0.3);
            display:flex;
            align-items:center;
            justify-content:center;
            opacity:0;
            transition: opacity 0.25s;
        }
        .movie-card:hover .play-overlay{
            opacity:1;
        }
        .play-btn{
            width:60px;
            height:60px;
            background:rgba(16,185,129,0.9);
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            color:#fff;
            font-size:1.6rem;
            padding-left:5px;
            box-shadow:0 0 20px rgba(16,185,129,0.5);
        }
        .card-body{
            padding:0.7rem 0.8rem;
        }
        .card-title{
            font-size:0.95rem;
            font-weight:700;
            margin-bottom:2px;
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
        }
        .meta-sm{
            font-size:0.75rem;
            color:rgba(236,253,245,0.6);
            font-family:var(--font-mono);
        }
        .badge-cat{
            background:rgba(16,185,129,0.2);
            color:var(--main);
            border-radius:30px;
            padding:2px 8px;
            font-size:0.7rem;
            font-weight:600;
        }
        /* 区块标题 */
        .section-header{
            font-weight:900;
            font-size:1.8rem;
            margin-bottom:1.2rem;
            border-left:6px solid var(--main);
            padding-left:14px;
        }
        .section-header i{
            color:var(--accent);
        }
        /* 对比表格 */
        .compare-table{
            background:rgba(16,185,129,0.05);
            border-radius:18px;
            padding:1rem;
        }
        .compare-table table{
            --bs-table-bg: transparent;
            color:var(--text);
        }
        .compare-table td, .compare-table th{
            border-color:rgba(255,255,255,0.1);
        }
        /* 编号清单 */
        .guide-list{
            counter-reset: guide;
            list-style:none;
            padding-left:0;
        }
        .guide-list li{
            counter-increment: guide;
            margin-bottom:1rem;
            padding-left:2.2rem;
            position:relative;
        }
        .guide-list li::before{
            content:counter(guide);
            position:absolute;
            left:0;
            top:0;
            width:28px;
            height:28px;
            background:var(--main);
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:0.8rem;
            font-weight:700;
            color:#06251a;
        }
        /* 友链 */
        .friend-links a{
            color:var(--text);
            text-decoration:none;
            padding:4px 12px;
            background:rgba(255,255,255,0.03);
            border-radius:30px;
            margin:3px;
            display:inline-block;
            transition:0.2s;
        }
        .friend-links a:hover{
            background:var(--main);
            color:#06251a;
        }
        footer{
            border-top:1px solid rgba(255,255,255,0.06);
        }
        /* 弹窗(翻转) */
        .movie-card{
            perspective:1000px;
            transform-style:preserve-3d;
        }
        .flip-card-inner{
            transition: transform 0.5s;
            transform-style:preserve-3d;
            position:relative;
            width:100%;
            height:100%;
        }
        .movie-card.flipped .flip-card-inner{
            transform: rotateY(180deg);
        }
        .flip-card-front, .flip-card-back{
            backface-visibility: hidden;
            width:100%;
            height:100%;
        }
        .flip-card-back{
            position:absolute;
            inset:0;
            transform: rotateY(180deg);
            background: var(--card-bg);
            border-radius:var(--radius-card);
            padding:1rem;
            overflow-y:auto;
            font-size:0.75rem;
            display:flex;
            flex-direction:column;
        }
        .flip-card-back .detail-title{
            font-weight:800;
            margin-bottom:4px;
        }
        .flip-card-back .detail-plot{
            margin-top:6px;
            flex:1;
            color:rgba(236,253,245,0.8);
            font-size:0.7rem;
        }
        .close-flip{
            align-self:flex-end;
            background:none;
            border:none;
            color:var(--accent);
            font-size:1.2rem;
            cursor:pointer;
        }
        /* 图片渐显 */
        .lazy-fade{
            animation: fadeIn 0.6s;
        }
        @keyframes fadeIn{
            from{opacity:0;}to{opacity:1;}
        }

/* --- 子页面追加 --- */
.guide-hero { padding: 120px 0 60px; background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(251, 191, 36, 0.05) 100%); }
.guide-hero h1 { font-size: 2.8rem; font-weight: 800; margin-bottom: 1rem; }
.guide-hero p { font-size: 1.1rem; opacity: 0.8; max-width: 600px; margin: 0 auto; }
.guide-section { padding: 60px 0; }
.guide-section:nth-child(even) { background: rgba(16, 185, 129, 0.03); }
.guide-card { background: var(--card-bg); border-radius: var(--radius-card); padding: 2rem; margin-bottom: 2rem; box-shadow: var(--shadow); transition: transform 0.3s ease; }
.guide-card:hover { transform: translateY(-5px); }
.guide-card h3 { color: var(--main); font-weight: 700; margin-bottom: 1rem; font-size: 1.4rem; }
.guide-card h4 { color: var(--accent); font-weight: 600; margin-bottom: 0.8rem; font-size: 1.1rem; }
.guide-card p { line-height: 1.8; opacity: 0.85; margin-bottom: 1rem; }
.guide-card ul, .guide-card ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.guide-card li { margin-bottom: 0.5rem; line-height: 1.8; opacity: 0.85; }
.guide-tip { background: rgba(251, 191, 36, 0.1); border-left: 4px solid var(--accent); padding: 1rem 1.5rem; border-radius: 8px; margin: 1.5rem 0; }
.guide-tip p { margin-bottom: 0; }
.step-number { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: var(--main); color: #fff; border-radius: 50%; font-weight: 700; margin-right: 12px; flex-shrink: 0; }
.step-item { display: flex; align-items: flex-start; margin-bottom: 1.2rem; }
.step-content { flex: 1; }
.step-content p { margin-bottom: 0.3rem; }
.faq-item { border: 1px solid var(--border-color); border-radius: 10px; padding: 1.5rem; margin-bottom: 1rem; }
.faq-item h4 { color: var(--main); font-weight: 600; margin-bottom: 0.8rem; }
.device-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; margin-top: 1.5rem; }
.device-card { text-align: center; padding: 1.5rem; background: rgba(16, 185, 129, 0.05); border-radius: 12px; }
.device-card i { font-size: 2.5rem; color: var(--main); margin-bottom: 1rem; }
.device-card h5 { font-weight: 600; margin-bottom: 0.5rem; }
.device-card p { font-size: 0.9rem; opacity: 0.7; }
.video-quality { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 20px; font-weight: 600; font-size: 0.9rem; background: rgba(16, 185, 129, 0.15); color: var(--main); margin-right: 8px; }
.video-quality.high { background: rgba(251, 191, 36, 0.15); color: var(--accent); }

/* --- Bootstrap 组件配色适配(程序自动补,避免白底黑字) --- */
.table { color:#ecfdf5 !important; border-color:rgba(255,255,255,.12) !important; --bs-table-bg:transparent !important; --bs-table-color:#ecfdf5 !important; }
