:root{
            --main:#06b6d4;
            --accent:#ec4899;
            --bg:#0c0a1a;
            --text:#e0f2fe;
            --card-bg:#151227;
            --line:#2c2a42;
            --radius:8px;
            --shadow:0 6px 18px rgba(0,0,0,.35);
        }
        *{font-family:'Inter',system-ui,-apple-system,sans-serif;}
        body{
            background: var(--bg);
            color: var(--text);
            font-size: .9rem;
            line-height: 1.5;
        }
        h1,h2,h3,h4,.hero-title{
            font-weight: 700;
            letter-spacing: .5px;
        }
        /* 手写圆体感标题 */
        .font-cursive{
            font-family: 'Comic Neue','Segoe Print', cursive;
            font-weight: 700;
            letter-spacing: 1px;
        }
        /* 导航 */
        .navbar-piao{
            background: #0e0c1f !important;
            border-bottom: 1px solid var(--line);
        }
        .navbar-brand{
            font-size: 1.5rem;
            font-weight: 800;
            color: var(--main) !important;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .navbar-brand i{color: var(--accent); font-size: 1.4rem;}
        .nav-link{
            color: #cbd5f5 !important;
            font-weight: 500;
        }
        .nav-link:hover{color: var(--main) !important;}
        /* 标签云 hero */
        .tag-hero{
            padding: 1.2rem 0 .8rem;
            border-bottom: 1px solid var(--line);
        }
        .tag-cloud{
            display: flex;
            flex-wrap: wrap;
            gap: .5rem .7rem;
            justify-content: center;
        }
        .tag-cloud span{
            background: #171330;
            padding: .25rem .9rem;
            border-radius: 30px;
            font-size: .8rem;
            color: #b5c8ff;
            border: 1px solid #2e2a50;
            transition: .2s;
            cursor: default;
        }
        .tag-cloud span:hover{
            border-color: var(--main);
            color: var(--main);
            transform: scale(1.05);
        }
        /* 左右布局 */
        .layout-wrap{
            display: flex;
            gap: 1.2rem;
            max-width: 1500px;
            margin: 1rem auto;
            padding: 0 1rem;
        }
        .sidebar-filter{
            flex: 0 0 190px;
            background: #0f0d20;
            padding: 1rem .8rem;
            border-radius: 10px;
            border: 1px solid var(--line);
            height: fit-content;
            position: sticky;
            top: 70px;
        }
        .sidebar-filter h5{
            color: var(--main);
            border-bottom: 1px solid var(--line);
            padding-bottom: .5rem;
        }
        .filter-group{
            margin-bottom: 1.2rem;
        }
        .filter-group .ftitle{
            font-size: .75rem;
            color: #a9b7e6;
            letter-spacing: 1px;
            margin-bottom: .3rem;
        }
        .filter-group a{
            display: block;
            padding: .2rem 0;
            color: #c8d6ff;
            text-decoration: none;
            font-size: .85rem;
            border-radius: 4px;
        }
        .filter-group a:hover{color: var(--accent); padding-left: 4px; background: #1a1730;}
        .main-content{
            flex: 1;
            min-width: 0;
        }
        /* 区块样式 */
        .section-title{
            display: flex;
            align-items: center;
            gap: 10px;
            margin: 1.5rem 0 1rem;
        }
        .section-title i{color: var(--accent);}
        .section-title h2{
            font-size: 1.3rem;
            margin: 0;
            color: #fff;
            border-left: 4px solid var(--main);
            padding-left: 10px;
        }
        /* 卡片网格 */
        .movie-grid{
            display: grid;
            grid-template-columns: repeat(auto-fill,minmax(150px,1fr));
            gap: 1rem;
        }
        .movie-card{
            background: var(--card-bg);
            border-radius: var(--radius);
            overflow: hidden;
            border: 1px solid var(--line);
            transition: transform .25s, box-shadow .25s, border-color .25s;
            cursor: pointer;
            position: relative;
        }
        .movie-card:hover{
            transform: scale(1.02) translateY(-4px);
            box-shadow: var(--shadow);
            border-color: var(--main);
        }
        .poster-wrap{
            position: relative;
            aspect-ratio: 2/3;
            background: #1b1733;
        }
        .poster-wrap img{
            width: 100%; height: 100%;
            object-fit: cover;
            display: block;
        }
        .badge-quality{
            position: absolute;
            top: 8px;
            right: 8px;
            background: rgba(0,0,0,.7);
            color: #fff;
            font-size: .7rem;
            padding: 2px 8px;
            border-radius: 4px;
            backdrop-filter: blur(2px);
            border: 1px solid rgba(6,182,212,.6);
        }
        .card-info{
            padding: .6rem .6rem .8rem;
        }
        .card-info .title{
            font-weight: 600;
            font-size: .9rem;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-bottom: 2px;
        }
        .card-meta{
            display: flex;
            justify-content: space-between;
            font-size: .75rem;
            color: #a0b0d9;
        }
        .score{color: #ffb547; font-weight: 600;}
        .year{color: #8c9cc7;}
        /* 步骤条 */
        .steps-wrapper{
            display: flex;
            gap: .5rem;
            background: #121024;
            padding: 1rem;
            border-radius: 10px;
            margin: 1.5rem 0;
            border: 1px solid var(--line);
        }
        .step-item{
            flex: 1;
            text-align: center;
            padding: .6rem .2rem;
            border-right: 1px dashed #3b3660;
        }
        .step-item:last-child{border-right: none;}
        .step-num{
            background: var(--main);
            color: #000;
            width: 24px; height: 24px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 800;
            font-size: .9rem;
            margin-bottom: .3rem;
        }
        /* 榜单 */
        .rank-list{
            background: #100e22;
            border-radius: 10px;
            padding: .8rem 1rem;
        }
        .rank-item{
            display: flex;
            align-items: center;
            gap: 10px;
            padding: .5rem 0;
            border-bottom: 1px solid #262344;
        }
        .rank-num{
            font-weight: 800;
            color: var(--accent);
            width: 25px;
            font-size: 1.1rem;
        }
        /* 友情链接 */
        .friend-links{
            border-top: 1px solid var(--line);
            margin-top: 2rem;
            padding: 1.2rem 0;
        }
        .friend-links a{
            color: #a9b7ff;
            margin-right: 15px;
            text-decoration: underline dotted;
        }
        /* 弹窗 */
        .modal-mask{
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0,0,0,.7);
            backdrop-filter: blur(3px);
            z-index: 999;
            align-items: center;
            justify-content: center;
        }
        .modal-mask.show{display: flex;}
        .detail-modal{
            background: #16132b;
            max-width: 680px;
            width: 94%;
            border-radius: 14px;
            padding: 1.2rem;
            display: flex;
            gap: 1rem;
            border: 1px solid #3a355a;
            position: relative;
            box-shadow: 0 20px 40px rgba(0,0,0,.6);
        }
        .modal-left img{width: 140px; border-radius: 8px; display: block;}
        .modal-right{flex:1}
        .modal-close{
            position: absolute;
            right: 12px;
            top: 8px;
            font-size: 1.6rem;
            color: #aaa;
            cursor: pointer;
            background: none;
            border: none;
            line-height: 1;
        }
        .modal-close:hover{color: var(--accent)}
        .modal-meta span{
            background: #2c284a;
            padding: 2px 8px;
            border-radius: 20px;
            font-size: .75rem;
            margin-right: 5px;
        }
        /* 心情选片 */
        .mood-tags{
            display: flex;
            gap: .5rem;
            flex-wrap: wrap;
            margin: 1rem 0;
        }
        .mood-tag{
            padding: .3rem 1.2rem;
            background: #1e1a3a;
            border-radius: 30px;
            font-weight: 500;
            cursor: pointer;
            border: 1px solid var(--line);
        }
        .mood-tag:hover, .mood-tag.active{background: var(--main); color: #000;}
        /* 数字滚动 */
        .count-up{display: inline-block;}
        .footer-piao{
            background: #0d0b1c;
            padding: 2rem 0 1rem;
            border-top: 1px solid var(--line);
            margin-top: 2rem;
            text-align: center;
        }
        /* 移动端 */
        @media (max-width: 992px) {
            .layout-wrap{flex-direction: column;}
            .sidebar-filter{
                position: static;
                width: 100%;
                display: flex;
                flex-wrap: wrap;
                gap: 10px;
            }
            .filter-group{margin-bottom: .5rem; padding-right: 10px;}
        }

/* --- 子页面追加 --- */
/* 本页专属小样式 */
        .about-hero { padding: 80px 0 40px; text-align: center; }
.about-hero h1 { font-size: 2.6rem; font-weight: 800; }
.about-hero p.lead { color: rgba(224,242,254,.7); max-width: 700px; margin: 12px auto 0; }
.about-section { padding: 50px 0; }
.about-section h2 { color: var(--main); font-weight: 700; margin-bottom: 18px; font-size: 1.7rem; }
.about-section h3 { color: var(--accent); font-weight: 600; margin: 24px 0 10px; font-size: 1.2rem; }
.about-section p, .about-section li { color: var(--text); opacity: .9; line-height: 1.8; }
.about-section ul { padding-left: 20px; }
.feature-card { background: var(--card-bg); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; margin-bottom: 20px; transition: .3s; }
.feature-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--main); }
.feature-card i { font-size: 2rem; color: var(--accent); margin-bottom: 14px; }
.feature-card h4 { color: var(--text); font-weight: 600; margin-bottom: 10px; }
.feature-card p { margin: 0; }
.stat-box { background: var(--card-bg); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; text-align: center; }
.stat-box .num { font-size: 2rem; font-weight: 800; color: var(--main); }
.stat-box .label { color: rgba(224,242,254,.7); font-size: .9rem; }
.timeline { border-left: 3px solid var(--main); padding-left: 24px; margin-left: 10px; }
.timeline-item { position: relative; margin-bottom: 28px; }
.timeline-item::before { content: ''; position: absolute; left: -31px; top: 6px; width: 12px; height: 12px; background: var(--accent); border-radius: 50%; border: 2px solid var(--bg); }
.timeline-item .date { color: var(--accent); font-weight: 600; font-size: .9rem; }
.timeline-item p { margin-top: 6px; }

/* --- 子页面追加 --- */
/* 本页专属样式 */
        .disclaimer-section {
            background: var(--card-bg);
            border: 1px solid var(--line);
            border-radius: var(--radius);
            box-shadow: var(--shadow);
            padding: 30px;
            margin-bottom: 30px;
        }
.disclaimer-section h2 {
            color: var(--main);
            font-size: 1.5rem;
            font-weight: 700;
            margin-bottom: 18px;
            padding-left: 16px;
            border-left: 4px solid var(--accent);
        }
.disclaimer-section p {
            color: var(--text);
            line-height: 1.8;
            font-size: 0.95rem;
            margin-bottom: 14px;
        }
.disclaimer-section ul {
            padding-left: 20px;
            margin-bottom: 14px;
        }
.disclaimer-section ul li {
            color: var(--text);
            line-height: 1.8;
            font-size: 0.95rem;
            margin-bottom: 6px;
        }
.disclaimer-section .highlight {
            color: var(--accent);
            font-weight: 600;
        }
.disclaimer-section .info-box {
            background: rgba(6, 182, 212, 0.08);
            border: 1px solid rgba(6, 182, 212, 0.3);
            border-radius: 6px;
            padding: 16px 20px;
            margin: 16px 0;
        }
.disclaimer-section .info-box p {
            margin-bottom: 6px;
        }
.update-time {
            display: inline-block;
            background: rgba(236, 72, 153, 0.15);
            color: var(--accent);
            padding: 4px 14px;
            border-radius: 20px;
            font-size: 0.85rem;
            font-weight: 500;
            margin-bottom: 20px;
        }
.contact-list {
            list-style: none;
            padding-left: 0 !important;
        }
.contact-list li {
            padding: 8px 0;
            border-bottom: 1px dashed var(--line);
        }
.contact-list li:last-child {
            border-bottom: none;
        }
.contact-list i {
            color: var(--main);
            margin-right: 10px;
            width: 20px;
        }
.back-home {
            display: inline-block;
            margin-top: 10px;
            color: var(--main);
            text-decoration: none;
            font-weight: 600;
            transition: color 0.3s;
        }
.back-home:hover {
            color: var(--accent);
        }
.back-home i {
            margin-right: 6px;
        }

/* --- Bootstrap 组件配色适配(程序自动补,避免白底黑字) --- */
.accordion-item { background:rgba(255,255,255,.04) !important; color:#e0f2fe !important; border-color:rgba(255,255,255,.12) !important; }
.accordion-button { background:rgba(255,255,255,.04) !important; color:#e0f2fe !important; }
.accordion-body { background:transparent !important; color:#e0f2fe !important; }
.accordion-header { background:transparent !important; }
.accordion-button::after { filter: invert(1) grayscale(1) brightness(2); }
