/* roulang page: index */
:root {
            --brand: #6818d8;
            --brand-dark: #421094;
            --brand-soft: #f0e9ff;
            --accent: #ff3d85;
            --accent-soft: #fff0f6;
            --gold: #ffc95c;
            --ink: #171226;
            --muted: #6f687d;
            --surface: #ffffff;
            --surface-2: #f8f6fc;
            --surface-dark: #171126;
            --border: #e8e2f0;
            --success: #168c67;
            --radius-sm: 12px;
            --radius: 20px;
            --radius-lg: 30px;
            --shadow-sm: 0 8px 24px rgba(44, 24, 75, .08);
            --shadow: 0 20px 55px rgba(48, 22, 89, .13);
            --transition: .25s ease;
        }

        *, *::before, *::after { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--ink);
            background: var(--surface);
            font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, -apple-system, sans-serif;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
            padding-bottom: 78px;
        }
        body, button, input { font-size: 16px; }
        img { display: block; max-width: 100%; }
        a { color: inherit; text-decoration: none; transition: color var(--transition), background var(--transition), transform var(--transition); }
        button, input { font: inherit; }
        button { border: 0; }
        :focus-visible {
            outline: 3px solid rgba(104, 24, 216, .3);
            outline-offset: 3px;
        }
        ::selection { color: #fff; background: var(--brand); }

        .container { max-width: 1180px; }
        .section-space { padding: 92px 0; }
        .section-soft { background: var(--surface-2); }
        .section-dark {
            color: #fff;
            background:
                radial-gradient(circle at 90% 15%, rgba(255, 61, 133, .22), transparent 28%),
                radial-gradient(circle at 10% 90%, rgba(122, 60, 240, .3), transparent 32%),
                var(--surface-dark);
        }
        .section-kicker {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 12px;
            color: var(--brand);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .1em;
        }
        .section-kicker::before {
            width: 24px;
            height: 3px;
            border-radius: 9px;
            background: var(--accent);
            content: "";
        }
        .section-title {
            max-width: 760px;
            margin: 0 0 16px;
            font-size: clamp(2rem, 4vw, 3.25rem);
            font-weight: 900;
            line-height: 1.16;
            letter-spacing: -.04em;
        }
        .section-copy {
            max-width: 760px;
            margin: 0;
            color: var(--muted);
            font-size: 1.04rem;
        }
        .section-dark .section-kicker { color: #d8c6ff; }
        .section-dark .section-copy { color: #c9c1d5; }

        .site-header {
            position: sticky;
            z-index: 1030;
            top: 0;
            background: rgba(255, 255, 255, .94);
            border-bottom: 1px solid var(--border);
            box-shadow: 0 6px 24px rgba(37, 18, 65, .05);
            backdrop-filter: blur(16px);
        }
        .brand-row {
            min-height: 76px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 24px;
        }
        .brand-lockup {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            min-width: 0;
        }
        .logo-mark {
            position: relative;
            width: 44px;
            height: 44px;
            flex: 0 0 44px;
            border-radius: 15px;
            background: linear-gradient(135deg, var(--brand), var(--accent));
            box-shadow: 0 10px 24px rgba(104, 24, 216, .28);
        }
        .logo-mark::before,
        .logo-mark::after {
            position: absolute;
            content: "";
            border-radius: 50%;
            background: #fff;
        }
        .logo-mark::before { width: 15px; height: 15px; left: 9px; top: 9px; opacity: .92; }
        .logo-mark::after { width: 9px; height: 9px; right: 8px; bottom: 8px; opacity: .7; }
        .brand-text {
            overflow: hidden;
            color: var(--ink);
            font-size: 1.03rem;
            font-weight: 900;
            line-height: 1.25;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
        .brand-text small {
            display: block;
            color: var(--muted);
            font-size: .72rem;
            font-weight: 600;
            letter-spacing: .06em;
        }
        .adult-chip {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 9px 14px;
            color: var(--brand-dark);
            background: var(--brand-soft);
            border: 1px solid #ddceff;
            border-radius: 999px;
            font-size: .82rem;
            font-weight: 800;
            white-space: nowrap;
        }
        .adult-chip::before {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: var(--success);
            box-shadow: 0 0 0 4px rgba(22, 140, 103, .12);
            content: "";
        }
        .channel-row {
            border-top: 1px solid #f1edf5;
            background: rgba(250, 248, 253, .92);
        }
        .channel-nav {
            display: flex;
            align-items: center;
            gap: 8px;
            min-height: 51px;
            overflow-x: auto;
            scrollbar-width: none;
        }
        .channel-nav::-webkit-scrollbar { display: none; }
        .channel-link {
            position: relative;
            display: inline-flex;
            align-items: center;
            flex: 0 0 auto;
            padding: 10px 17px;
            color: #625a70;
            border-radius: 12px;
            font-size: .92rem;
            font-weight: 800;
        }
        .channel-link:hover { color: var(--brand); background: var(--brand-soft); }
        .channel-link.active {
            color: #fff;
            background: linear-gradient(135deg, var(--brand), #8b3df1);
            box-shadow: 0 8px 20px rgba(104, 24, 216, .2);
        }

        .hero {
            position: relative;
            overflow: hidden;
            padding: 72px 0 76px;
            background:
                radial-gradient(circle at 8% 20%, rgba(255, 61, 133, .12), transparent 25%),
                radial-gradient(circle at 85% 12%, rgba(104, 24, 216, .16), transparent 30%),
                linear-gradient(180deg, #fff 0%, #faf7ff 100%);
        }
        .hero::after {
            position: absolute;
            right: -150px;
            bottom: -210px;
            width: 500px;
            height: 500px;
            border: 70px solid rgba(104, 24, 216, .045);
            border-radius: 50%;
            content: "";
        }
        .hero-stage {
            position: relative;
            z-index: 1;
            overflow: hidden;
            padding: clamp(24px, 4vw, 50px);
            background: rgba(255, 255, 255, .88);
            border: 1px solid rgba(104, 24, 216, .12);
            border-radius: var(--radius-lg);
            box-shadow: var(--shadow);
        }
        .hero-stage::before {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 5px;
            background: linear-gradient(90deg, var(--brand), var(--accent), var(--gold));
            content: "";
        }
        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 18px;
            padding: 8px 13px;
            color: var(--brand-dark);
            background: var(--brand-soft);
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 900;
        }
        .hero h1 {
            max-width: 820px;
            margin: 0 0 20px;
            font-size: clamp(2.35rem, 6vw, 5rem);
            font-weight: 950;
            line-height: 1.05;
            letter-spacing: -.055em;
        }
        .hero-intro {
            max-width: 780px;
            margin: 0;
            color: var(--muted);
            font-size: clamp(1rem, 2vw, 1.16rem);
        }
        .hero-points {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin: 26px 0 0;
        }
        .hero-point {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 9px 13px;
            color: #51475e;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 999px;
            font-size: .84rem;
            font-weight: 700;
        }
        .hero-point::before {
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: var(--success);
            content: "";
        }
        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 30px;
        }
        .btn-brand,
        .btn-soft,
        .btn-light-custom {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 50px;
            padding: 12px 22px;
            border-radius: 14px;
            font-weight: 900;
            transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
        }
        .btn-brand {
            color: #fff;
            background: linear-gradient(135deg, var(--brand), #903bf2);
            box-shadow: 0 12px 26px rgba(104, 24, 216, .25);
        }
        .btn-brand:hover {
            color: #fff;
            transform: translateY(-2px);
            box-shadow: 0 16px 32px rgba(104, 24, 216, .32);
        }
        .btn-brand:active,
        .btn-soft:active,
        .btn-light-custom:active { transform: translateY(0); }
        .btn-soft {
            color: var(--brand-dark);
            background: var(--brand-soft);
            border: 1px solid #ddceff;
        }
        .btn-soft:hover { color: var(--brand); background: #e7dbff; }
        .btn-light-custom {
            color: var(--brand-dark);
            background: #fff;
            box-shadow: var(--shadow-sm);
        }
        .btn-light-custom:hover {
            color: var(--brand);
            transform: translateY(-2px);
        }
        .guide-layout {
            margin-top: 40px;
        }
        .guide-cover {
            position: relative;
            min-height: 430px;
            overflow: hidden;
            padding: 34px;
            color: #fff;
            background:
                linear-gradient(145deg, rgba(23, 17, 38, .2), rgba(23, 17, 38, .72)),
                linear-gradient(135deg, #7720e6, #ff3d85);
            border-radius: 26px;
            box-shadow: 0 25px 50px rgba(66, 16, 148, .24);
        }
        .guide-cover::before {
            position: absolute;
            top: 40px;
            right: -35px;
            width: 170px;
            height: 170px;
            border: 35px solid rgba(255, 255, 255, .12);
            border-radius: 50%;
            content: "";
        }
        .guide-cover::after {
            position: absolute;
            right: 32px;
            bottom: 28px;
            width: 90px;
            height: 6px;
            border-radius: 99px;
            background: var(--gold);
            box-shadow: 0 16px 0 rgba(255,255,255,.28), 0 32px 0 rgba(255,255,255,.14);
            content: "";
        }
        .cover-label {
            position: relative;
            z-index: 1;
            display: inline-flex;
            padding: 7px 11px;
            color: #381075;
            background: var(--gold);
            border-radius: 999px;
            font-size: .74rem;
            font-weight: 900;
        }
        .guide-cover h2 {
            position: relative;
            z-index: 1;
            max-width: 340px;
            margin: 72px 0 16px;
            font-size: clamp(2rem, 4vw, 3.25rem);
            font-weight: 950;
            line-height: 1.1;
        }
        .guide-cover p {
            position: relative;
            z-index: 1;
            max-width: 330px;
            margin: 0;
            color: rgba(255, 255, 255, .82);
        }
        .guide-sheet {
            height: 100%;
            padding: 30px;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 26px;
        }
        .guide-sheet h2 {
            margin: 0 0 10px;
            font-size: 1.55rem;
            font-weight: 900;
        }
        .guide-sheet > p { margin-bottom: 22px; color: var(--muted); }
        .summary-list {
            display: grid;
            gap: 11px;
            margin: 0 0 25px;
            padding: 0;
            list-style: none;
        }
        .summary-list li {
            display: flex;
            gap: 12px;
            align-items: flex-start;
            padding: 12px 14px;
            background: var(--surface-2);
            border-radius: 13px;
            color: #50475d;
            font-size: .9rem;
            font-weight: 700;
        }
        .summary-list span {
            display: grid;
            width: 25px;
            height: 25px;
            flex: 0 0 25px;
            place-items: center;
            color: #fff;
            background: var(--brand);
            border-radius: 8px;
            font-size: .72rem;
        }
        .lead-form {
            display: grid;
            grid-template-columns: 1fr 1fr auto;
            gap: 10px;
        }
        .lead-form .form-control {
            min-height: 50px;
            padding: 12px 15px;
            color: var(--ink);
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 13px;
            box-shadow: none;
        }
        .lead-form .form-control:focus {
            border-color: var(--brand);
            box-shadow: 0 0 0 4px rgba(104, 24, 216, .1);
        }
        .form-note {
            margin: 11px 0 0;
            color: var(--muted);
            font-size: .76rem;
        }

        .countdown-section {
            padding: 36px 0;
            color: #fff;
            background: linear-gradient(110deg, var(--brand-dark), var(--brand) 55%, #9b35da);
        }
        .countdown-wrap {
            display: grid;
            grid-template-columns: 1.2fr auto;
            align-items: center;
            gap: 34px;
        }
        .countdown-copy h2 {
            margin: 0 0 7px;
            font-size: clamp(1.45rem, 3vw, 2.2rem);
            font-weight: 900;
        }
        .countdown-copy p { margin: 0; color: rgba(255,255,255,.76); }
        .countdown {
            display: flex;
            gap: 10px;
        }
        .time-box {
            min-width: 78px;
            padding: 12px 10px;
            text-align: center;
            background: rgba(255,255,255,.12);
            border: 1px solid rgba(255,255,255,.2);
            border-radius: 15px;
            backdrop-filter: blur(8px);
        }
        .time-box strong {
            display: block;
            font-size: 1.65rem;
            font-weight: 950;
            line-height: 1.15;
        }
        .time-box small { color: rgba(255,255,255,.7); font-size: .7rem; }

        .highlight-wall {
            display: grid;
            grid-template-columns: 1.15fr .85fr .85fr;
            grid-template-rows: auto auto;
            gap: 18px;
            margin-top: 42px;
        }
        .feature-card {
            position: relative;
            overflow: hidden;
            min-height: 220px;
            padding: 28px;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: var(--radius);
            box-shadow: var(--shadow-sm);
            transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
        }
        .feature-card:hover {
            z-index: 1;
            transform: translateY(-5px);
            border-color: #d6c7eb;
            box-shadow: var(--shadow);
        }
        .feature-card.large {
            grid-row: 1 / 3;
            min-height: 458px;
            color: #fff;
            background:
                radial-gradient(circle at 100% 0, rgba(255, 61, 133, .55), transparent 35%),
                linear-gradient(150deg, #201334, #6320bb);
            border: 0;
        }
        .feature-card.accent { background: var(--accent-soft); }
        .feature-card.gold { background: #fff9eb; }
        .feature-icon {
            display: grid;
            width: 47px;
            height: 47px;
            margin-bottom: 24px;
            place-items: center;
            color: var(--brand);
            background: var(--brand-soft);
            border-radius: 15px;
            font-size: 1.25rem;
            font-weight: 900;
        }
        .large .feature-icon {
            color: #301066;
            background: var(--gold);
        }
        .feature-card h3 {
            margin: 0 0 10px;
            font-size: 1.35rem;
            font-weight: 900;
        }
        .feature-card p { margin: 0; color: var(--muted); }
        .feature-card.large p { color: rgba(255,255,255,.76); }
        .data-badges {
            position: absolute;
            right: 28px;
            bottom: 28px;
            left: 28px;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
        }
        .data-badge {
            padding: 16px;
            background: rgba(255,255,255,.1);
            border: 1px solid rgba(255,255,255,.15);
            border-radius: 15px;
        }
        .data-badge strong { display: block; color: var(--gold); font-size: 1.35rem; }
        .data-badge small { color: rgba(255,255,255,.68); }

        .compare-shell {
            margin-top: 42px;
            overflow: hidden;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 26px;
            box-shadow: var(--shadow-sm);
        }
        .compare-grid {
            display: grid;
            grid-template-columns: 1.1fr repeat(3, 1fr);
        }
        .compare-cell {
            min-height: 72px;
            padding: 20px;
            border-right: 1px solid var(--border);
            border-bottom: 1px solid var(--border);
        }
        .compare-cell:nth-child(4n) { border-right: 0; }
        .compare-cell:nth-last-child(-n+4) { border-bottom: 0; }
        .compare-head {
            min-height: 150px;
            background: var(--surface-2);
        }
        .compare-head.recommended {
            color: #fff;
            background: linear-gradient(145deg, var(--brand), #8f3bea);
        }
        .compare-head strong {
            display: block;
            margin-bottom: 7px;
            font-size: 1.1rem;
            font-weight: 900;
        }
        .compare-head p { margin: 0; color: var(--muted); font-size: .84rem; }
        .compare-head.recommended p { color: rgba(255,255,255,.75); }
        .recommend-tag {
            display: inline-flex;
            margin-bottom: 12px;
            padding: 4px 9px;
            color: #4b2478;
            background: var(--gold);
            border-radius: 99px;
            font-size: .68rem;
            font-weight: 900;
        }
        .compare-label { color: #403749; font-weight: 900; }
        .check { color: var(--success); font-weight: 900; }
        .limit { color: var(--muted); }

        .news-layout {
            display: grid;
            grid-template-columns: 1.45fr .75fr;
            gap: 24px;
            margin-top: 40px;
        }
        .news-list {
            overflow: hidden;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: var(--radius);
        }
        .news-item {
            display: grid;
            grid-template-columns: 88px 1fr auto;
            align-items: center;
            gap: 18px;
            padding: 20px;
            border-bottom: 1px solid var(--border);
        }
        .news-item:last-child { border-bottom: 0; }
        .news-item:hover { background: #fbf9fe; }
        .news-date {
            color: var(--brand);
            font-size: .78rem;
            font-weight: 900;
        }
        .news-item h3 {
            margin: 0 0 4px;
            font-size: 1rem;
            font-weight: 900;
        }
        .news-item p { margin: 0; color: var(--muted); font-size: .84rem; }
        .news-arrow {
            display: grid;
            width: 36px;
            height: 36px;
            place-items: center;
            color: var(--brand);
            background: var(--brand-soft);
            border-radius: 11px;
            font-weight: 900;
        }
        .news-item:hover .news-arrow { color: #fff; background: var(--brand); }
        .recommend-panel {
            padding: 28px;
            color: #fff;
            background:
                radial-gradient(circle at 90% 10%, rgba(255,201,92,.3), transparent 30%),
                var(--surface-dark);
            border-radius: var(--radius);
        }
        .recommend-panel h3 { margin: 0 0 10px; font-size: 1.55rem; font-weight: 900; }
        .recommend-panel > p { color: #c7bfd1; }
        .mini-rank {
            display: grid;
            gap: 10px;
            margin: 24px 0;
        }
        .rank-link {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 13px;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.1);
            border-radius: 13px;
        }
        .rank-link:hover { color: #fff; background: rgba(255,255,255,.14); transform: translateX(3px); }
        .rank-no {
            display: grid;
            width: 28px;
            height: 28px;
            flex: 0 0 28px;
            place-items: center;
            color: #36136b;
            background: var(--gold);
            border-radius: 8px;
            font-size: .76rem;
            font-weight: 950;
        }

        .entry-strip {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 14px;
            margin-top: 35px;
        }
        .entry-card {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            padding: 20px;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.12);
            border-radius: 17px;
        }
        .entry-card:hover { color: #fff; background: rgba(255,255,255,.14); transform: translateY(-3px); }
        .entry-card strong { display: block; margin-bottom: 2px; }
        .entry-card small { color: #bbb1c9; }
        .entry-card b { color: var(--gold); font-size: 1.3rem; }

        .cta-panel {
            position: relative;
            overflow: hidden;
            padding: clamp(28px, 6vw, 60px);
            color: #fff;
            background: linear-gradient(120deg, var(--brand-dark), var(--brand) 60%, #b531c4);
            border-radius: var(--radius-lg);
            box-shadow: var(--shadow);
        }
        .cta-panel::after {
            position: absolute;
            right: -50px;
            bottom: -100px;
            width: 270px;
            height: 270px;
            border: 48px solid rgba(255,255,255,.08);
            border-radius: 50%;
            content: "";
        }
        .cta-content { position: relative; z-index: 1; max-width: 790px; }
        .cta-panel h2 {
            margin: 0 0 14px;
            font-size: clamp(2rem, 4vw, 3.5rem);
            font-weight: 950;
            line-height: 1.12;
        }
        .cta-panel p { max-width: 700px; color: rgba(255,255,255,.78); }
        .cta-panel .lead-form { margin-top: 26px; max-width: 850px; }
        .cta-panel .form-note { color: rgba(255,255,255,.65); }

        .accordion {
            margin-top: 38px;
            --bs-accordion-border-width: 0;
            --bs-accordion-btn-focus-box-shadow: none;
        }
        .accordion-item {
            margin-bottom: 12px;
            overflow: hidden;
            background: #fff;
            border: 1px solid var(--border) !important;
            border-radius: 16px !important;
        }
        .accordion-button {
            padding: 20px 22px;
            color: var(--ink);
            background: #fff;
            font-weight: 900;
            box-shadow: none !important;
        }
        .accordion-button:not(.collapsed) {
            color: var(--brand-dark);
            background: var(--brand-soft);
        }
        .accordion-button::after {
            width: 1rem;
            height: 1rem;
            background-size: 1rem;
        }
        .accordion-body {
            padding: 4px 22px 22px;
            color: var(--muted);
            line-height: 1.85;
        }

        .site-footer {
            color: #c9c0d4;
            background: #110c1c;
        }
        .footer-main { padding: 62px 0 42px; }
        .footer-brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 18px;
            color: #fff;
            font-size: 1.04rem;
            font-weight: 900;
        }
        .footer-copy { max-width: 610px; margin: 0; color: #a99fb7; font-size: .9rem; }
        .footer-nav {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 10px;
        }
        .footer-nav a {
            padding: 9px 13px;
            color: #d1c8dc;
            border: 1px solid rgba(255,255,255,.1);
            border-radius: 11px;
            font-size: .84rem;
            font-weight: 800;
        }
        .footer-nav a:hover { color: #fff; background: rgba(255,255,255,.08); }
        .footer-bottom {
            padding: 20px 0;
            color: #857a93;
            border-top: 1px solid rgba(255,255,255,.08);
            font-size: .8rem;
        }
        .footer-bottom-inner {
            display: flex;
            justify-content: space-between;
            gap: 20px;
        }

        .fixed-conversion {
            position: fixed;
            z-index: 1040;
            right: 0;
            bottom: 0;
            left: 0;
            padding: 11px 0;
            color: #fff;
            background: rgba(23, 17, 38, .96);
            border-top: 1px solid rgba(255,255,255,.12);
            box-shadow: 0 -10px 30px rgba(20, 10, 34, .2);
            backdrop-filter: blur(14px);
        }
        .fixed-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
        }
        .fixed-copy strong { display: block; font-size: .92rem; }
        .fixed-copy small { color: #bdb4c9; }
        .fixed-actions { display: flex; gap: 9px; }
        .fixed-actions .btn-brand,
        .fixed-actions .btn-light-custom {
            min-height: 44px;
            padding: 9px 17px;
            font-size: .86rem;
        }

        @media (max-width: 1024px) {
            .section-space { padding: 76px 0; }
            .highlight-wall { grid-template-columns: 1fr 1fr; }
            .feature-card.large { grid-row: auto; grid-column: 1 / 3; min-height: 370px; }
            .compare-cell { padding: 16px 13px; font-size: .86rem; }
            .countdown-wrap { grid-template-columns: 1fr; }
            .news-layout { grid-template-columns: 1fr; }
        }
        @media (max-width: 768px) {
            body { padding-bottom: 92px; }
            .brand-row { min-height: 68px; }
            .brand-text { max-width: 65vw; font-size: .9rem; }
            .adult-chip { display: none; }
            .channel-nav { min-height: 48px; }
            .channel-link { padding: 8px 13px; font-size: .84rem; }
            .hero { padding: 42px 0 52px; }
            .hero-stage { border-radius: 22px; }
            .guide-cover { min-height: 340px; }
            .guide-cover h2 { margin-top: 48px; }
            .lead-form { grid-template-columns: 1fr; }
            .countdown { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); }
            .time-box { min-width: 0; }
            .highlight-wall { grid-template-columns: 1fr; }
            .feature-card.large { grid-column: auto; min-height: 430px; }
            .compare-shell { overflow-x: auto; }
            .compare-grid { min-width: 700px; }
            .entry-strip { grid-template-columns: 1fr; }
            .footer-nav { justify-content: flex-start; margin-top: 28px; }
            .footer-bottom-inner { flex-direction: column; gap: 7px; }
            .fixed-copy small { display: none; }
        }
        @media (max-width: 520px) {
            .section-space { padding: 60px 0; }
            .section-title { font-size: 2rem; }
            .hero h1 { font-size: 2.5rem; }
            .hero-actions { display: grid; }
            .hero-actions a { width: 100%; }
            .guide-cover, .guide-sheet { padding: 23px; border-radius: 19px; }
            .guide-cover { min-height: 315px; }
            .countdown-section { padding: 28px 0; }
            .time-box { padding: 9px 5px; }
            .time-box strong { font-size: 1.25rem; }
            .feature-card { padding: 22px; }
            .data-badges { right: 22px; bottom: 22px; left: 22px; }
            .news-item { grid-template-columns: 1fr auto; gap: 8px 12px; }
            .news-date { grid-column: 1 / 3; }
            .news-item p { display: none; }
            .cta-panel { border-radius: 21px; }
            .fixed-copy { max-width: 150px; line-height: 1.25; }
            .fixed-actions .btn-light-custom { display: none; }
            .fixed-actions .btn-brand { padding-inline: 14px; }
        }

/* roulang page: category1 */
:root {
      --brand:#6818d8;--brand-dark:#421094;--brand-soft:#f0e9ff;
      --accent:#ff3d85;--accent-soft:#fff0f6;--gold:#ffc95c;
      --ink:#171226;--muted:#6f687d;--surface:#fff;--surface-2:#f8f6fc;
      --surface-dark:#171126;--border:#e8e2f0;--success:#168c67;
      --radius-sm:12px;--radius:20px;--radius-lg:30px;
      --shadow-sm:0 8px 24px rgba(44,24,75,.08);
      --shadow:0 20px 55px rgba(48,22,89,.13);--transition:.25s ease
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--surface);font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",system-ui,sans-serif;line-height:1.75;-webkit-font-smoothing:antialiased;padding-bottom:78px}
    body,button,input{font-size:16px}
    img{display:block;max-width:100%}
    a{color:inherit;text-decoration:none;transition:color var(--transition),background var(--transition),transform var(--transition)}
    button,input{font:inherit}button{border:0}
    .container{max-width:1180px}
    .section-space{padding:88px 0}.section-soft{background:var(--surface-2)}
    .section-dark{color:#fff;background:radial-gradient(circle at 90% 15%,rgba(255,61,133,.22),transparent 28%),radial-gradient(circle at 10% 90%,rgba(122,60,240,.3),transparent 32%),var(--surface-dark)}
    .section-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;color:var(--brand);font-size:.78rem;font-weight:800;letter-spacing:.1em}
    .section-kicker:before{width:24px;height:3px;border-radius:9px;background:var(--accent);content:""}
    .section-title{max-width:760px;margin:0 0 16px;font-size:clamp(2rem,4vw,3.25rem);font-weight:900;line-height:1.16;letter-spacing:-.04em}
    .section-copy{max-width:760px;margin:0;color:var(--muted);font-size:1.04rem}
    .section-dark .section-kicker{color:#d8c6ff}.section-dark .section-copy{color:#c9c1d5}
    .site-header{position:sticky;z-index:1030;top:0;background:rgba(255,255,255,.94);border-bottom:1px solid var(--border);box-shadow:0 6px 24px rgba(37,18,65,.05);backdrop-filter:blur(16px)}
    .brand-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand-lockup{display:inline-flex;align-items:center;gap:12px;min-width:0}
    .logo-mark{position:relative;width:44px;height:44px;flex:0 0 44px;border-radius:15px;background:linear-gradient(135deg,var(--brand),var(--accent));box-shadow:0 10px 24px rgba(104,24,216,.28)}
    .logo-mark:before,.logo-mark:after{position:absolute;content:"";border-radius:50%;background:#fff}
    .logo-mark:before{width:15px;height:15px;left:9px;top:9px;opacity:.92}.logo-mark:after{width:9px;height:9px;right:8px;bottom:8px;opacity:.7}
    .brand-text{overflow:hidden;color:var(--ink);font-size:1.03rem;font-weight:900;line-height:1.25;white-space:nowrap;text-overflow:ellipsis}
    .brand-text small{display:block;color:var(--muted);font-size:.72rem;font-weight:600;letter-spacing:.06em}
    .adult-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;color:var(--brand-dark);background:var(--brand-soft);border:1px solid #ddceff;border-radius:999px;font-size:.82rem;font-weight:800;white-space:nowrap}
    .adult-chip:before{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(22,140,103,.12);content:""}
    .channel-row{border-top:1px solid #f1edf5;background:rgba(250,248,253,.92)}
    .channel-nav{display:flex;align-items:center;gap:8px;min-height:51px;overflow-x:auto;scrollbar-width:none}
    .channel-nav::-webkit-scrollbar{display:none}
    .channel-link{position:relative;padding:10px 18px;color:var(--muted);font-size:.92rem;font-weight:800;white-space:nowrap;border-radius:10px}
    .channel-link:hover{color:var(--brand);background:var(--brand-soft)}
    .channel-link.active{color:var(--brand-dark);background:#e9ddff}
    .channel-link.active:after{position:absolute;right:18px;bottom:3px;left:18px;height:3px;border-radius:4px;background:var(--accent);content:""}
    .page-hero{position:relative;overflow:hidden;padding:76px 0 68px;background:radial-gradient(circle at 5% 22%,rgba(255,61,133,.14),transparent 25%),radial-gradient(circle at 86% 0,rgba(104,24,216,.18),transparent 32%),linear-gradient(180deg,#fff 0,#faf7ff 100%)}
    .page-hero:after{position:absolute;right:-170px;bottom:-240px;width:520px;height:520px;border:72px solid rgba(104,24,216,.05);border-radius:50%;content:""}
    .hero-copy{position:relative;z-index:1;padding:18px 0}
    .hero-label{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;margin-bottom:20px;color:var(--brand-dark);background:var(--brand-soft);border:1px solid #dfd0ff;border-radius:999px;font-size:.8rem;font-weight:900}
    .hero-label span{width:8px;height:8px;border-radius:50%;background:var(--accent)}
    .hero-title{max-width:720px;margin:0 0 20px;font-size:clamp(2.35rem,5vw,4.6rem);font-weight:950;line-height:1.08;letter-spacing:-.06em}
    .hero-title em{color:var(--brand);font-style:normal}
    .hero-copy-text{max-width:650px;margin:0;color:var(--muted);font-size:1.12rem}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
    .btn-brand,.btn-light-custom{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 22px;border-radius:12px;font-weight:900;transition:var(--transition)}
    .btn-brand{color:#fff;background:linear-gradient(135deg,var(--brand),#8b42ed);box-shadow:0 12px 24px rgba(104,24,216,.23)}
    .btn-brand:hover{color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px rgba(104,24,216,.3)}
    .btn-light-custom{color:var(--brand-dark);background:#fff;border:1px solid var(--border)}
    .btn-light-custom:hover{color:var(--brand);background:var(--brand-soft);transform:translateY(-2px)}
    .hero-panel{position:relative;z-index:1;padding:25px;background:linear-gradient(145deg,#23143e,#452078);border-radius:var(--radius-lg);box-shadow:var(--shadow);color:#fff}
    .panel-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;color:#d9c9ed;font-size:.83rem}
    .live-dot{display:inline-flex;align-items:center;gap:7px}.live-dot:before{width:8px;height:8px;border-radius:50%;background:#ff739f;box-shadow:0 0 0 5px rgba(255,115,159,.16);content:""}
    .signal-card{padding:21px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:18px}
    .signal-card h2{margin:0 0 8px;font-size:1.45rem;font-weight:900}.signal-card p{margin:0;color:#d8cde6;font-size:.9rem}
    .signal-meta{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.signal-meta span,.mini-badge{padding:5px 9px;color:#f6eaff;background:rgba(255,255,255,.12);border-radius:8px;font-size:.75rem;font-weight:800}
    .meter{height:8px;overflow:hidden;background:rgba(255,255,255,.14);border-radius:9px}.meter i{display:block;width:86%;height:100%;background:linear-gradient(90deg,var(--accent),var(--gold));border-radius:9px}
    .panel-foot{display:flex;justify-content:space-between;margin-top:12px;color:#d8cde6;font-size:.78rem}
    .filter-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:17px 20px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
    .filter-label{font-weight:900}.filter-options{display:flex;gap:8px;flex-wrap:wrap}.filter-tag{padding:8px 13px;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;font-size:.82rem;font-weight:800;cursor:pointer}
    .filter-tag:hover,.filter-tag.selected{color:var(--brand-dark);background:var(--brand-soft);border-color:#d7c2ff}
    .feature-grid{display:grid;grid-template-columns:1.35fr .8fr .8fr;gap:18px;margin-top:28px}
    .feature-card{position:relative;min-height:230px;overflow:hidden;padding:25px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-sm);transition:var(--transition)}
    .feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
    .feature-card.primary{min-height:300px;color:#fff;background:linear-gradient(145deg,#5120a2,#9a347e)}
    .feature-card:before{position:absolute;right:-40px;bottom:-70px;width:210px;height:210px;border:36px solid rgba(255,255,255,.12);border-radius:50%;content:""}
    .feature-card h3{position:relative;z-index:1;margin:42px 0 9px;font-size:1.35rem;font-weight:900}.feature-card p{position:relative;z-index:1;margin:0;color:var(--muted);font-size:.9rem}.feature-card.primary p{color:#e8dff1}
    .card-index{position:relative;z-index:1;display:inline-flex;padding:6px 10px;color:var(--brand-dark);background:var(--brand-soft);border-radius:8px;font-size:.75rem;font-weight:900}.primary .card-index{color:#fff;background:rgba(255,255,255,.17)}
    .selection-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:26px;margin-top:28px}
    .note-card{padding:28px;background:var(--surface-dark);border-radius:var(--radius);color:#fff}
    .note-card h3{margin:0 0 14px;font-size:1.4rem;font-weight:900}.note-card p{margin:0 0 20px;color:#c9c1d5;font-size:.92rem}
    .check-list{padding:0;margin:0;list-style:none}.check-list li{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);color:#ece5f4;font-size:.9rem}.check-list li:last-child{border:0}.check-list b{color:#ff8db2}
    .compact-list{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
    .compact-item{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 22px;border-bottom:1px solid var(--border);transition:var(--transition)}
    .compact-item:last-child{border:0}.compact-item:hover{background:#fcf9ff}.item-title{font-weight:900}.item-sub{display:block;margin-top:4px;color:var(--muted);font-size:.82rem}.status{padding:6px 10px;color:var(--success);background:#e9f8f2;border-radius:8px;font-size:.75rem;font-weight:900;white-space:nowrap}
    .stats-band{padding:25px 0;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}.stat{padding:8px 18px;border-right:1px solid rgba(255,255,255,.12)}.stat:last-child{border:0}.stat strong{display:block;font-size:1.8rem;line-height:1.1;color:#fff}.stat span{color:#bdb2cb;font-size:.78rem}
    .faq-list{max-width:900px;margin-top:30px}.accordion-item{margin-bottom:11px;border:1px solid var(--border)!important;border-radius:14px!important;overflow:hidden;background:#fff;box-shadow:none}.accordion-button{padding:19px 21px;color:var(--ink);font-weight:900;background:#fff;box-shadow:none!important}.accordion-button:not(.collapsed){color:var(--brand-dark);background:var(--brand-soft)}.accordion-body{padding:0 21px 20px;color:var(--muted);font-size:.94rem}
    .cta-box{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px 42px;background:linear-gradient(125deg,#6818d8,#9a32a7);border-radius:var(--radius-lg);color:#fff;box-shadow:var(--shadow)}.cta-box h2{margin:0 0 8px;font-size:clamp(1.7rem,3vw,2.5rem);font-weight:900}.cta-box p{margin:0;color:#eadff7}.cta-box .btn-light-custom{border:0}
    .site-footer{background:var(--surface-dark);color:#fff}.footer-main{padding:58px 0}.footer-brand{display:inline-flex;align-items:center;gap:12px;font-size:1.1rem;font-weight:900}.footer-copy{max-width:660px;margin:18px 0 0;color:#bdb3c8;font-size:.88rem}.footer-nav{display:flex;justify-content:flex-end;gap:22px;flex-wrap:wrap;padding-top:8px;color:#dcd4e5;font-size:.9rem;font-weight:800}.footer-nav a:hover{color:#ff8db2}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:17px 0;color:#a79bb4;font-size:.78rem}.footer-bottom-inner{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
    .fixed-bar{position:fixed;z-index:1040;right:0;bottom:0;left:0;padding:12px 0;background:rgba(23,17,38,.96);box-shadow:0 -8px 25px rgba(23,17,38,.16);backdrop-filter:blur(12px)}.fixed-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}.fixed-bar p{margin:0;color:#eee7f4;font-size:.86rem}.fixed-bar strong{color:#ff8db2}
    :focus-visible{outline:3px solid rgba(255,61,133,.45);outline-offset:3px}
    @media(max-width:991px){.feature-grid{grid-template-columns:1fr 1fr}.feature-card.primary{grid-column:span 2}.selection-layout{grid-template-columns:1fr}.footer-nav{justify-content:flex-start}.hero-panel{margin-top:28px}}
    @media(max-width:767px){.section-space{padding:64px 0}.brand-row{min-height:68px}.adult-chip{display:none}.hero-title{font-size:clamp(2.25rem,12vw,3.5rem)}.page-hero{padding:52px 0}.feature-grid{grid-template-columns:1fr}.feature-card.primary{grid-column:auto}.cta-box{align-items:flex-start;flex-direction:column;padding:30px 24px}.fixed-inner{align-items:flex-start;flex-direction:column;gap:8px}.fixed-bar .btn-brand{width:100%}}
    @media(max-width:520px){.brand-text{font-size:.86rem}.brand-text small{font-size:.61rem}.channel-link{padding:9px 13px}.hero-actions,.hero-actions a{width:100%}.hero-actions a{display:flex}.filter-bar{align-items:flex-start;flex-direction:column}.compact-item{align-items:flex-start;flex-direction:column;gap:8px}.status{align-self:flex-start}.footer-bottom-inner{display:block}.footer-bottom-inner span{display:block;margin:4px 0}}

/* roulang page: category2 */
:root {
      --brand:#6818d8;
      --brand-dark:#421094;
      --brand-soft:#f0e9ff;
      --accent:#ff3d85;
      --accent-soft:#fff0f6;
      --gold:#ffc95c;
      --ink:#171226;
      --muted:#6f687d;
      --surface:#fff;
      --surface-2:#f8f6fc;
      --surface-dark:#171126;
      --border:#e8e2f0;
      --success:#168c67;
      --radius-sm:12px;
      --radius:20px;
      --radius-lg:30px;
      --shadow-sm:0 8px 24px rgba(44,24,75,.08);
      --shadow:0 20px 55px rgba(48,22,89,.13);
      --transition:.25s ease;
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body {
      margin:0;
      color:var(--ink);
      background:var(--surface);
      font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",system-ui,-apple-system,sans-serif;
      line-height:1.75;
      -webkit-font-smoothing:antialiased;
      padding-bottom:78px;
    }
    body,button,input { font-size:16px; }
    a { color:inherit; text-decoration:none; transition:color var(--transition),background var(--transition),transform var(--transition),box-shadow var(--transition); }
    img { display:block; max-width:100%; }
    button,input { font:inherit; }
    button { border:0; }
    :focus-visible { outline:3px solid rgba(255,61,133,.45); outline-offset:3px; }
    .container { max-width:1180px; }
    .section-space { padding:92px 0; }
    .section-soft { background:var(--surface-2); }
    .section-dark {
      color:#fff;
      background:
        radial-gradient(circle at 90% 15%,rgba(255,61,133,.22),transparent 28%),
        radial-gradient(circle at 10% 90%,rgba(122,60,240,.3),transparent 32%),
        var(--surface-dark);
    }
    .section-kicker {
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:12px;
      color:var(--brand);
      font-size:.78rem;
      font-weight:800;
      letter-spacing:.1em;
    }
    .section-kicker::before {
      width:24px;
      height:3px;
      border-radius:9px;
      background:var(--accent);
      content:"";
    }
    .section-title {
      max-width:780px;
      margin:0 0 16px;
      font-size:clamp(2rem,4vw,3.25rem);
      font-weight:900;
      line-height:1.16;
      letter-spacing:-.04em;
    }
    .section-copy { max-width:760px; margin:0; color:var(--muted); font-size:1.04rem; }
    .section-dark .section-kicker { color:#d8c6ff; }
    .section-dark .section-copy { color:#c9c1d5; }

    .site-header {
      position:sticky;
      z-index:1030;
      top:0;
      background:rgba(255,255,255,.94);
      border-bottom:1px solid var(--border);
      box-shadow:0 6px 24px rgba(37,18,65,.05);
      backdrop-filter:blur(16px);
    }
    .brand-row {
      min-height:76px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
    }
    .brand-lockup { display:inline-flex; align-items:center; gap:12px; min-width:0; }
    .logo-mark {
      position:relative;
      width:44px;
      height:44px;
      flex:0 0 44px;
      border-radius:15px;
      background:linear-gradient(135deg,var(--brand),var(--accent));
      box-shadow:0 10px 24px rgba(104,24,216,.28);
    }
    .logo-mark::before,.logo-mark::after {
      position:absolute;
      content:"";
      border-radius:50%;
      background:#fff;
    }
    .logo-mark::before { width:15px;height:15px;left:9px;top:9px;opacity:.92; }
    .logo-mark::after { width:9px;height:9px;right:8px;bottom:8px;opacity:.7; }
    .brand-text {
      overflow:hidden;
      color:var(--ink);
      font-size:1.03rem;
      font-weight:900;
      line-height:1.25;
      white-space:nowrap;
      text-overflow:ellipsis;
    }
    .brand-text small {
      display:block;
      color:var(--muted);
      font-size:.72rem;
      font-weight:600;
      letter-spacing:.06em;
    }
    .adult-chip {
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:9px 14px;
      color:var(--brand-dark);
      background:var(--brand-soft);
      border:1px solid #ddceff;
      border-radius:999px;
      font-size:.82rem;
      font-weight:800;
      white-space:nowrap;
    }
    .adult-chip::before {
      width:8px;
      height:8px;
      border-radius:50%;
      background:var(--success);
      box-shadow:0 0 0 4px rgba(22,140,103,.12);
      content:"";
    }
    .channel-row { border-top:1px solid #f1edf5; background:rgba(250,248,253,.92); }
    .channel-nav {
      display:flex;
      align-items:center;
      gap:8px;
      min-height:51px;
      overflow-x:auto;
      scrollbar-width:none;
    }
    .channel-nav::-webkit-scrollbar { display:none; }
    .channel-link {
      position:relative;
      display:inline-flex;
      align-items:center;
      min-height:51px;
      padding:0 17px;
      color:var(--muted);
      font-size:.92rem;
      font-weight:800;
      white-space:nowrap;
    }
    .channel-link:hover { color:var(--brand); }
    .channel-link.active { color:var(--brand-dark); }
    .channel-link.active::after {
      position:absolute;
      right:17px;
      bottom:0;
      left:17px;
      height:3px;
      border-radius:4px 4px 0 0;
      background:linear-gradient(90deg,var(--brand),var(--accent));
      content:"";
    }

    .hero {
      position:relative;
      overflow:hidden;
      padding:74px 0 78px;
      background:
        radial-gradient(circle at 8% 20%,rgba(255,61,133,.12),transparent 25%),
        radial-gradient(circle at 85% 12%,rgba(104,24,216,.16),transparent 30%),
        linear-gradient(180deg,#fff 0%,#faf7ff 100%);
    }
    .hero::after {
      position:absolute;
      right:-150px;
      bottom:-210px;
      width:500px;
      height:500px;
      border:70px solid rgba(104,24,216,.045);
      border-radius:50%;
      content:"";
    }
    .hero-grid { position:relative; z-index:1; }
    .hero-title {
      max-width:780px;
      margin:0 0 20px;
      font-size:clamp(2.3rem,5vw,4.65rem);
      font-weight:950;
      line-height:1.08;
      letter-spacing:-.065em;
    }
    .hero-title em { color:var(--brand); font-style:normal; }
    .hero-copy { max-width:700px; color:var(--muted); font-size:1.12rem; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
    .btn-brand,.btn-outline-brand {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:50px;
      padding:0 22px;
      border-radius:14px;
      font-weight:850;
      transition:all var(--transition);
    }
    .btn-brand {
      color:#fff;
      background:linear-gradient(135deg,var(--brand),#8d42ef);
      box-shadow:0 12px 26px rgba(104,24,216,.25);
    }
    .btn-brand:hover { color:#fff; transform:translateY(-2px); box-shadow:0 16px 32px rgba(104,24,216,.34); }
    .btn-outline-brand { color:var(--brand-dark); background:#fff; border:1px solid #d9c9f5; }
    .btn-outline-brand:hover { color:var(--brand); background:var(--brand-soft); transform:translateY(-2px); }
    .hero-note { margin-top:18px; color:var(--muted); font-size:.86rem; }
    .hero-panel {
      position:relative;
      overflow:hidden;
      padding:27px;
      background:rgba(255,255,255,.9);
      border:1px solid #e6dff0;
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow);
    }
    .hero-panel::before {
      position:absolute;
      top:-70px;
      right:-50px;
      width:180px;
      height:180px;
      border-radius:50%;
      background:rgba(255,61,133,.1);
      content:"";
    }
    .panel-head { position:relative; display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:24px; }
    .panel-label { color:var(--muted); font-size:.78rem; font-weight:800; letter-spacing:.08em; }
    .live-badge {
      display:inline-flex;
      align-items:center;
      gap:7px;
      padding:7px 10px;
      color:#a32b5c;
      background:var(--accent-soft);
      border-radius:999px;
      font-size:.74rem;
      font-weight:850;
    }
    .live-badge::before { width:7px;height:7px;border-radius:50%;background:var(--accent);content:""; }
    .status-score { position:relative; display:flex; align-items:end; gap:10px; margin-bottom:22px; }
    .status-score strong { color:var(--brand-dark); font-size:3.6rem; line-height:1; letter-spacing:-.08em; }
    .status-score span { color:var(--muted); font-size:.84rem; line-height:1.35; }
    .meter { height:9px; margin:13px 0 21px; overflow:hidden; background:#eee8f5; border-radius:99px; }
    .meter i { display:block; width:86%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--brand),var(--accent)); }
    .panel-list { margin:0; padding:0; list-style:none; }
    .panel-list li { display:flex; justify-content:space-between; gap:15px; padding:12px 0; border-top:1px solid var(--border); color:var(--muted); font-size:.88rem; }
    .panel-list b { color:var(--ink); font-weight:800; text-align:right; }
    .badge-soft {
      display:inline-flex;
      align-items:center;
      padding:6px 10px;
      color:var(--brand-dark);
      background:var(--brand-soft);
      border:1px solid #dfd1fa;
      border-radius:999px;
      font-size:.75rem;
      font-weight:850;
    }

    .timeline-wrap { margin-top:46px; }
    .update-track { position:relative; display:grid; gap:0; margin-top:28px; }
    .update-track::before {
      position:absolute;
      top:24px;
      bottom:24px;
      left:16px;
      width:2px;
      background:linear-gradient(var(--brand),rgba(104,24,216,.08));
      content:"";
    }
    .update-item {
      position:relative;
      display:grid;
      grid-template-columns:42px 1fr auto;
      align-items:start;
      gap:16px;
      padding:0 0 26px;
    }
    .timeline-dot {
      position:relative;
      z-index:1;
      width:34px;
      height:34px;
      border:7px solid #f8f6fc;
      border-radius:50%;
      background:linear-gradient(135deg,var(--brand),var(--accent));
      box-shadow:0 0 0 1px #d7c9ec;
    }
    .update-card {
      padding:19px 21px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow-sm);
    }
    .update-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
    .update-card h3 { margin:0 0 5px; font-size:1.08rem; font-weight:900; }
    .update-card p { margin:0; color:var(--muted); font-size:.91rem; }
    .update-time { padding-top:8px; color:var(--muted); font-size:.78rem; white-space:nowrap; }
    .filter-bar {
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:9px;
      margin:25px 0 32px;
      padding:15px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow-sm);
    }
    .filter-label { margin-right:3px; color:var(--muted); font-size:.84rem; font-weight:800; }
    .filter-btn {
      padding:8px 13px;
      color:var(--muted);
      background:var(--surface-2);
      border:1px solid transparent;
      border-radius:10px;
      font-size:.82rem;
      font-weight:800;
      cursor:pointer;
    }
    .filter-btn:hover,.filter-btn.active { color:var(--brand-dark); background:var(--brand-soft); border-color:#d9c7fb; }
    .feature-strip { display:flex; gap:16px; overflow-x:auto; padding:3px 2px 17px; scrollbar-width:thin; }
    .feature-card {
      flex:0 0 270px;
      min-height:165px;
      padding:22px;
      color:#fff;
      border-radius:var(--radius);
      background:linear-gradient(145deg,#29134b,#6419a6);
      box-shadow:var(--shadow-sm);
    }
    .feature-card:nth-child(2) { background:linear-gradient(145deg,#4a164b,#b62e79); }
    .feature-card:nth-child(3) { background:linear-gradient(145deg,#221d55,#5140bb); }
    .feature-card small { color:#d9c8ef; font-weight:800; }
    .feature-card h3 { margin:19px 0 7px; font-size:1.1rem; font-weight:900; }
    .feature-card p { margin:0; color:#ddd3e8; font-size:.84rem; line-height:1.55; }
    .data-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:28px; }
    .data-card { padding:23px; background:#fff; border:1px solid var(--border); border-radius:var(--radius); }
    .data-card strong { display:block; color:var(--brand-dark); font-size:2rem; line-height:1.1; }
    .data-card span { display:block; margin-top:7px; color:var(--muted); font-size:.86rem; }
    .faq-list { display:grid; gap:12px; margin-top:32px; }
    .faq-list .accordion-item { overflow:hidden; border:1px solid var(--border); border-radius:16px!important; background:#fff; }
    .accordion-button { padding:20px 22px; color:var(--ink); background:#fff; box-shadow:none!important; font-weight:850; }
    .accordion-button:not(.collapsed) { color:var(--brand-dark); background:var(--brand-soft); }
    .accordion-body { padding:0 22px 21px; color:var(--muted); font-size:.94rem; }
    .cta-box {
      position:relative;
      overflow:hidden;
      padding:42px;
      border-radius:var(--radius-lg);
      background:linear-gradient(135deg,var(--brand-dark),var(--brand));
      box-shadow:var(--shadow);
    }
    .cta-box::after { position:absolute; right:-50px; bottom:-90px; width:260px; height:260px; border:45px solid rgba(255,255,255,.1); border-radius:50%; content:""; }
    .cta-box h2 { position:relative; z-index:1; max-width:650px; margin:0 0 12px; color:#fff; font-size:clamp(1.8rem,3vw,2.7rem); font-weight:900; line-height:1.2; }
    .cta-box p { position:relative; z-index:1; max-width:650px; margin:0; color:#e4d9f4; }
    .cta-box .btn-light { position:relative; z-index:1; margin-top:23px; padding:13px 21px; color:var(--brand-dark); border-radius:13px; font-weight:900; }
    .site-footer { background:var(--surface-dark); color:#fff; }
    .footer-main { padding:58px 0 43px; }
    .footer-brand { display:inline-flex; align-items:center; gap:12px; color:#fff; font-weight:900; }
    .footer-brand .logo-mark { width:39px; height:39px; flex-basis:39px; border-radius:13px; }
    .footer-copy { max-width:680px; margin:19px 0 0; color:#aca3ba; font-size:.88rem; }
    .footer-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px 23px; padding-top:11px; }
    .footer-nav a { color:#d3cada; font-size:.9rem; font-weight:750; }
    .footer-nav a:hover { color:#fff; }
    .footer-bottom { border-top:1px solid rgba(255,255,255,.1); }
    .footer-bottom-inner { display:flex; justify-content:space-between; gap:18px; padding:19px 0; color:#968da4; font-size:.78rem; }
    .fixed-bar {
      position:fixed;
      z-index:1040;
      right:0;
      bottom:0;
      left:0;
      padding:11px 0;
      color:#fff;
      background:rgba(23,17,38,.95);
      box-shadow:0 -8px 28px rgba(23,17,38,.18);
      backdrop-filter:blur(12px);
    }
    .fixed-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; }
    .fixed-inner p { margin:0; color:#d7cfdf; font-size:.86rem; }
    .fixed-inner p strong { color:#fff; }
    .fixed-bar .btn-brand { min-height:42px; padding:0 17px; font-size:.88rem; }
    @media (max-width:991px) {
      .section-space { padding:70px 0; }
      .hero { padding:58px 0 66px; }
      .hero-panel { margin-top:34px; }
      .footer-nav { justify-content:flex-start; margin-top:25px; }
    }
    @media (max-width:767px) {
      body { padding-bottom:105px; }
      .brand-row { min-height:68px; }
      .adult-chip { display:none; }
      .brand-text { font-size:.9rem; }
      .brand-text small { font-size:.62rem; }
      .logo-mark { width:39px; height:39px; flex-basis:39px; border-radius:13px; }
      .hero-title { font-size:clamp(2.25rem,11vw,3.5rem); }
      .hero-copy { font-size:1rem; }
      .update-item { grid-template-columns:36px 1fr; gap:11px; }
      .update-time { grid-column:2; padding-top:0; }
      .timeline-dot { width:30px; height:30px; border-width:6px; }
      .update-track::before { left:14px; }
      .data-grid { grid-template-columns:1fr; }
      .cta-box { padding:29px 24px; }
      .footer-bottom-inner { flex-direction:column; gap:5px; }
      .fixed-inner p { font-size:.76rem; line-height:1.45; }
      .fixed-bar .btn-brand { flex:0 0 auto; padding:0 13px; }
    }
    @media (max-width:520px) {
      .hero-actions { display:grid; grid-template-columns:1fr; }
      .hero-actions a { width:100%; }
      .filter-bar { align-items:flex-start; }
      .filter-label { width:100%; }
      .fixed-inner { gap:10px; }
      .fixed-inner p { max-width:62%; }
    }