/* roulang page: index */
:root{
            --bg:#121110;
            --bg-2:#171513;
            --bg-3:#1d1a18;
            --surface:#221f1d;
            --surface-2:#2a2623;
            --surface-3:#312b28;
            --text:#f4efe7;
            --muted:#c2b8af;
            --weak:#8f857b;
            --line:rgba(242,163,58,.16);
            --line-2:rgba(255,255,255,.08);
            --accent:#f2a33a;
            --accent-2:#d17d4b;
            --accent-3:#9d6b59;
            --danger:#c24d3b;
            --success:#81b98d;
            --shadow:0 18px 50px rgba(0,0,0,.38);
            --shadow-soft:0 10px 26px rgba(0,0,0,.22);
            --radius-sm:12px;
            --radius:20px;
            --radius-lg:28px;
            --radius-xl:34px;
            --container:1180px;
            --container-tight:820px;
            --gap:24px;
            --gap-lg:36px;
            --section:92px;
            --ease:cubic-bezier(.2,.8,.2,1);
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            min-height:100vh;
            font-family:PingFang SC, Microsoft YaHei, Noto Sans SC, Arial, sans-serif;
            color:var(--text);
            background:
                radial-gradient(1200px 520px at 18% -10%, rgba(242,163,58,.10), transparent 58%),
                radial-gradient(1000px 420px at 92% 0%, rgba(157,107,89,.10), transparent 52%),
                linear-gradient(180deg, #181513 0%, #121110 48%, #10100f 100%);
            overflow-x:hidden;
            line-height:1.75;
        }
        body::before{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            opacity:.18;
            background:
                linear-gradient(135deg, rgba(255,255,255,.02) 0 1px, transparent 1px 18px),
                linear-gradient(45deg, rgba(255,255,255,.015) 0 1px, transparent 1px 18px);
            mix-blend-mode:screen;
        }
        img{
            display:block;
            max-width:100%;
            height:auto;
        }
        a{
            color:inherit;
            text-decoration:none;
            transition:color .22s var(--ease), background-color .22s var(--ease), border-color .22s var(--ease), transform .22s var(--ease), box-shadow .22s var(--ease), opacity .22s var(--ease);
        }
        a:hover{color:#ffd28a}
        button, input, textarea, select{
            font:inherit;
        }
        button{
            border:0;
            background:none;
            color:inherit;
            cursor:pointer;
        }
        ::selection{
            background:rgba(242,163,58,.24);
            color:var(--text);
        }
        :focus-visible{
            outline:3px solid rgba(242,163,58,.65);
            outline-offset:2px;
        }
        .container{
            width:min(var(--container), calc(100% - 40px));
            margin:0 auto;
        }
        .container-tight{
            width:min(var(--container-tight), calc(100% - 40px));
            margin:0 auto;
        }
        .section{
            position:relative;
            padding:var(--section) 0;
        }
        .section::before{
            content:"";
            position:absolute;
            left:50%;
            top:0;
            transform:translateX(-50%);
            width:min(100%, var(--container));
            height:1px;
            background:linear-gradient(90deg, transparent, rgba(242,163,58,.14), transparent);
        }
        .eyebrow{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:7px 12px;
            border:1px solid rgba(242,163,58,.18);
            border-radius:999px;
            color:#ffd191;
            background:rgba(242,163,58,.06);
            font-size:13px;
            letter-spacing:.02em;
        }
        .eyebrow::before{
            content:"";
            width:8px;
            height:8px;
            border-radius:999px;
            background:var(--accent);
            box-shadow:0 0 0 6px rgba(242,163,58,.12);
        }
        .section-head{
            display:flex;
            align-items:flex-end;
            justify-content:space-between;
            gap:20px;
            margin-bottom:26px;
        }
        .section-title{
            margin:12px 0 0;
            font-size:clamp(26px, 3vw, 36px);
            line-height:1.15;
            letter-spacing:-.02em;
        }
        .section-subtitle{
            margin:12px 0 0;
            max-width:70ch;
            color:var(--muted);
            font-size:16px;
            line-height:1.85;
        }
        .section-link{
            display:inline-flex;
            align-items:center;
            gap:10px;
            color:#ffe0b0;
            font-weight:700;
            white-space:nowrap;
        }
        .section-link::after{
            content:"→";
            transition:transform .22s var(--ease);
        }
        .section-link:hover::after{
            transform:translateX(4px);
        }

        .topbar{
            position:relative;
            z-index:30;
            background:linear-gradient(90deg, rgba(242,163,58,.12), rgba(157,107,89,.10));
            border-bottom:1px solid rgba(242,163,58,.18);
        }
        .topbar-inner{
            min-height:46px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding:10px 0;
            color:#f2e9dd;
            font-size:13px;
            line-height:1.6;
        }
        .topbar-note{
            display:flex;
            align-items:center;
            gap:10px;
            flex-wrap:wrap;
        }
        .topbar-badge{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-width:42px;
            padding:4px 10px;
            border-radius:999px;
            background:rgba(242,163,58,.16);
            color:#ffd08a;
            font-weight:800;
            letter-spacing:.04em;
        }

        .site-header{
            position:sticky;
            top:0;
            z-index:40;
            background:rgba(18,17,16,.64);
            backdrop-filter:blur(16px);
            border-bottom:1px solid rgba(255,255,255,.07);
            transition:background .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
        }
        .site-header.is-scrolled{
            background:rgba(16,15,14,.92);
            box-shadow:0 10px 24px rgba(0,0,0,.18);
            border-color:rgba(255,255,255,.05);
        }
        .header-inner{
            min-height:74px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
        }
        .brand{
            display:flex;
            align-items:center;
            gap:12px;
            min-width:max-content;
            color:var(--text);
        }
        .brand-mark{
            width:38px;
            height:38px;
            border-radius:13px;
            background:
                radial-gradient(circle at 30% 30%, rgba(255,255,255,.25), transparent 36%),
                linear-gradient(135deg, rgba(242,163,58,.98), rgba(209,125,75,.95));
            color:#1b150f;
            display:grid;
            place-items:center;
            font-weight:900;
            font-size:14px;
            box-shadow:0 10px 26px rgba(242,163,58,.18);
        }
        .brand-text{
            display:flex;
            flex-direction:column;
            gap:2px;
            line-height:1.1;
        }
        .brand-name{
            font-size:18px;
            font-weight:900;
            letter-spacing:.02em;
        }
        .brand-sub{
            color:var(--weak);
            font-size:12px;
        }
        .site-nav{
            display:flex;
            align-items:center;
            gap:6px;
            flex-wrap:wrap;
            justify-content:center;
        }
        .nav-link{
            position:relative;
            padding:12px 14px;
            color:#ddd3c8;
            border-radius:999px;
            font-size:14px;
            font-weight:600;
        }
        .nav-link::after{
            content:"";
            position:absolute;
            left:14px;
            right:14px;
            bottom:7px;
            height:2px;
            border-radius:999px;
            background:linear-gradient(90deg, transparent, rgba(242,163,58,.95), transparent);
            transform:scaleX(0);
            transform-origin:center;
            transition:transform .22s var(--ease);
        }
        .nav-link:hover{
            background:rgba(255,255,255,.03);
            color:#fff2da;
        }
        .nav-link:hover::after,
        .nav-link.is-active::after{
            transform:scaleX(1);
        }
        .nav-link.is-active{
            color:#fff2da;
            background:rgba(242,163,58,.08);
        }
        .header-actions{
            display:flex;
            align-items:center;
            gap:10px;
            min-width:max-content;
        }
        .nav-toggle{
            display:none;
            align-items:center;
            justify-content:center;
            gap:8px;
            min-width:52px;
            height:46px;
            padding:0 14px;
            border-radius:14px;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.03);
            color:var(--text);
            font-weight:700;
        }
        .nav-toggle .bars{
            width:16px;
            height:12px;
            position:relative;
            display:inline-block;
        }
        .nav-toggle .bars::before,
        .nav-toggle .bars::after,
        .nav-toggle .bars span{
            content:"";
            position:absolute;
            left:0;
            right:0;
            height:2px;
            border-radius:999px;
            background:#f0e8dc;
        }
        .nav-toggle .bars::before{top:0}
        .nav-toggle .bars span{top:5px}
        .nav-toggle .bars::after{bottom:0}

        .btn{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:10px;
            min-height:48px;
            padding:0 18px;
            border-radius:16px;
            border:1px solid transparent;
            font-weight:800;
            letter-spacing:.01em;
            line-height:1;
            white-space:nowrap;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease), background-color .22s var(--ease), color .22s var(--ease), opacity .22s var(--ease);
        }
        .btn:hover{
            transform:translateY(-2px);
        }
        .btn:active{
            transform:translateY(0);
        }
        .btn-primary{
            background:linear-gradient(135deg, #f2a33a, #df8538);
            color:#20150d;
            box-shadow:0 14px 28px rgba(242,163,58,.14);
        }
        .btn-primary:hover{
            box-shadow:0 18px 32px rgba(242,163,58,.20);
            color:#1b130d;
        }
        .btn-secondary{
            background:rgba(255,255,255,.03);
            border-color:rgba(242,163,58,.26);
            color:#ffe3bc;
        }
        .btn-secondary:hover{
            border-color:rgba(242,163,58,.44);
            background:rgba(242,163,58,.06);
            color:#fff1da;
        }
        .btn-ghost{
            background:transparent;
            border-color:rgba(255,255,255,.10);
            color:#eadfd2;
        }
        .btn-ghost:hover{
            border-color:rgba(242,163,58,.32);
            background:rgba(255,255,255,.02);
            color:#fff1da;
        }
        .btn-block{width:100%}

        .hero{
            position:relative;
            padding:34px 0 34px;
        }
        .hero::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(860px 360px at 18% 12%, rgba(242,163,58,.12), transparent 60%),
                radial-gradient(720px 300px at 86% 0%, rgba(157,107,89,.12), transparent 55%);
            pointer-events:none;
        }
        .hero-grid{
            position:relative;
            display:grid;
            grid-template-columns:1.04fr .96fr;
            gap:32px;
            align-items:center;
        }
        .hero-copy{
            padding:14px 0;
        }
        .hero-title{
            margin:18px 0 0;
            font-size:clamp(34px, 5vw, 60px);
            line-height:1.08;
            letter-spacing:-.04em;
        }
        .hero-lead{
            margin:18px 0 0;
            max-width:34em;
            color:var(--muted);
            font-size:clamp(16px, 1.6vw, 18px);
            line-height:1.9;
        }
        .badge-row{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
            margin-top:22px;
        }
        .badge{
            display:inline-flex;
            align-items:center;
            gap:8px;
            min-height:34px;
            padding:0 12px;
            border-radius:999px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            color:#eadfd2;
            font-size:13px;
        }
        .badge strong{
            color:#ffd18b;
        }
        .hero-actions{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            margin-top:28px;
        }
        .hero-panel{
            display:grid;
            gap:16px;
        }
        .hero-art{
            position:relative;
            border-radius:var(--radius-xl);
            overflow:hidden;
            border:1px solid rgba(255,255,255,.08);
            background:var(--surface);
            box-shadow:var(--shadow);
            min-height:450px;
        }
        .hero-art img{
            width:100%;
            height:100%;
            object-fit:cover;
            object-position:center;
            filter:saturate(.92) contrast(.98);
        }
        .hero-art::after{
            content:"";
            position:absolute;
            inset:0;
            background:
                linear-gradient(180deg, rgba(10,9,9,.08) 0%, rgba(10,9,9,.34) 48%, rgba(10,9,9,.72) 100%),
                linear-gradient(135deg, rgba(242,163,58,.10), transparent 34%);
        }
        .hero-stamp{
            position:absolute;
            top:18px;
            right:18px;
            z-index:2;
            width:74px;
            height:74px;
            border-radius:50%;
            border:1px solid rgba(255,210,138,.42);
            background:rgba(18,17,16,.66);
            color:#ffd68f;
            display:grid;
            place-items:center;
            font-size:24px;
            font-weight:900;
            backdrop-filter:blur(6px);
            box-shadow:0 12px 26px rgba(0,0,0,.28);
        }
        .hero-caption{
            position:absolute;
            left:18px;
            right:18px;
            bottom:18px;
            z-index:2;
            display:flex;
            flex-direction:column;
            gap:10px;
        }
        .hero-caption p{
            margin:0;
            color:#f6f1e8;
            font-size:15px;
        }
        .hero-mini-grid{
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:14px;
        }
        .mini-card{
            padding:16px 16px 15px;
            border-radius:18px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            box-shadow:var(--shadow-soft);
        }
        .mini-card strong{
            display:block;
            margin-bottom:6px;
            color:#ffe2b2;
            font-size:15px;
        }
        .mini-card span{
            color:var(--muted);
            font-size:13px;
            line-height:1.7;
        }

        .trust-grid{
            display:grid;
            grid-template-columns:repeat(4, minmax(0, 1fr));
            gap:16px;
        }
        .trust-card{
            padding:22px 20px;
            border-radius:22px;
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
            box-shadow:var(--shadow-soft);
            transition:transform .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease), background-color .22s var(--ease);
            min-height:160px;
        }
        .trust-card:hover{
            transform:translateY(-3px);
            border-color:rgba(242,163,58,.24);
            box-shadow:0 18px 34px rgba(0,0,0,.26);
        }
        .trust-icon{
            width:44px;
            height:44px;
            border-radius:14px;
            display:grid;
            place-items:center;
            background:rgba(242,163,58,.08);
            border:1px solid rgba(242,163,58,.15);
            color:#ffd08a;
            font-size:20px;
            margin-bottom:14px;
        }
        .trust-title{
            margin:0;
            font-size:18px;
            line-height:1.25;
        }
        .trust-text{
            margin:10px 0 0;
            color:var(--muted);
            font-size:14px;
            line-height:1.75;
        }

        .split-grid{
            display:grid;
            grid-template-columns:1.02fr .98fr;
            gap:28px;
            align-items:center;
        }
        .notice-steps{
            position:relative;
            padding:18px;
            border-radius:var(--radius-lg);
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
            box-shadow:var(--shadow-soft);
        }
        .notice-list{
            list-style:none;
            margin:0;
            padding:0;
            display:grid;
            gap:14px;
        }
        .notice-item{
            display:grid;
            grid-template-columns:56px 1fr;
            gap:14px;
            align-items:flex-start;
            padding:16px;
            border-radius:20px;
            border:1px solid rgba(255,255,255,.07);
            background:rgba(255,255,255,.02);
        }
        .step-no{
            width:56px;
            height:56px;
            border-radius:18px;
            display:grid;
            place-items:center;
            background:linear-gradient(135deg, rgba(242,163,58,.22), rgba(157,107,89,.10));
            border:1px solid rgba(242,163,58,.18);
            color:#ffd08a;
            font-weight:900;
            font-size:18px;
        }
        .notice-body h3{
            margin:0;
            font-size:18px;
            line-height:1.3;
        }
        .notice-body p{
            margin:8px 0 0;
            color:var(--muted);
            font-size:14px;
            line-height:1.78;
        }
        .step-tag{
            display:inline-flex;
            align-items:center;
            margin-top:12px;
            padding:6px 10px;
            border-radius:999px;
            background:rgba(242,163,58,.08);
            border:1px solid rgba(242,163,58,.16);
            color:#ffd694;
            font-size:12px;
            font-weight:700;
            letter-spacing:.02em;
        }
        .media-card{
            position:relative;
            overflow:hidden;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,255,255,.08);
            background:var(--surface);
            box-shadow:var(--shadow);
            min-height:390px;
        }
        .media-card img{
            width:100%;
            height:100%;
            object-fit:cover;
            object-position:center;
            filter:saturate(.92) contrast(.98);
        }
        .media-card::after{
            content:"";
            position:absolute;
            inset:0;
            background:
                linear-gradient(180deg, rgba(10,9,9,.08) 0%, rgba(10,9,9,.18) 54%, rgba(10,9,9,.68) 100%),
                linear-gradient(135deg, rgba(242,163,58,.08), transparent 38%);
        }
        .media-copy{
            position:absolute;
            left:20px;
            right:20px;
            bottom:20px;
            z-index:1;
            display:flex;
            flex-direction:column;
            gap:10px;
        }
        .media-label{
            display:inline-flex;
            align-items:center;
            width:max-content;
            gap:8px;
            padding:6px 10px;
            border-radius:999px;
            background:rgba(18,17,16,.58);
            border:1px solid rgba(255,255,255,.10);
            color:#ffe0b0;
            font-size:12px;
            font-weight:700;
        }
        .media-title{
            margin:0;
            font-size:24px;
            line-height:1.22;
        }
        .media-copy p{
            margin:0;
            color:#efe7dc;
            font-size:14px;
            line-height:1.75;
            max-width:36ch;
        }

        .grade-grid{
            display:grid;
            grid-template-columns:.92fr 1.08fr;
            gap:28px;
            align-items:center;
        }
        .grade-panel{
            display:grid;
            gap:16px;
        }
        .grade-box{
            padding:22px;
            border-radius:var(--radius-lg);
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
            box-shadow:var(--shadow-soft);
        }
        .grade-box h3{
            margin:0;
            font-size:22px;
            line-height:1.25;
        }
        .grade-box p{
            margin:10px 0 0;
            color:var(--muted);
            font-size:15px;
            line-height:1.8;
        }
        .tag-matrix{
            display:grid;
            grid-template-columns:repeat(3, minmax(0, 1fr));
            gap:12px;
        }
        .tag-chip{
            min-height:54px;
            padding:12px 14px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:14px;
            border-radius:16px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            color:#efe7dc;
            font-size:14px;
            font-weight:600;
        }
        .tag-chip span{
            color:#ffd18b;
            font-size:13px;
            font-weight:800;
        }

        .latest-grid{
            display:grid;
            grid-template-columns:.88fr 1.12fr;
            gap:28px;
            align-items:start;
        }
        .latest-aside{
            position:sticky;
            top:106px;
            display:grid;
            gap:16px;
        }
        .latest-note{
            padding:22px;
            border-radius:var(--radius-lg);
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
            box-shadow:var(--shadow-soft);
        }
        .latest-note h3{
            margin:0;
            font-size:22px;
            line-height:1.25;
        }
        .latest-note p{
            margin:10px 0 0;
            color:var(--muted);
            font-size:15px;
            line-height:1.8;
        }
        .news-list{
            display:grid;
            gap:14px;
        }
        .news-card{
            border-radius:22px;
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
            box-shadow:var(--shadow-soft);
            overflow:hidden;
            transition:transform .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease), background-color .22s var(--ease);
        }
        .news-card:hover{
            transform:translateY(-3px);
            border-color:rgba(242,163,58,.26);
            box-shadow:0 18px 34px rgba(0,0,0,.28);
        }
        .news-card-link{
            display:block;
            color:inherit;
        }
        .news-card--lead .news-card-link{
            display:grid;
            grid-template-columns:220px 1fr;
            gap:0;
            align-items:stretch;
        }
        .news-thumb{
            position:relative;
            min-height:100%;
            background:var(--surface);
        }
        .news-thumb img{
            width:100%;
            height:100%;
            object-fit:cover;
        }
        .news-thumb::after{
            content:"";
            position:absolute;
            inset:0;
            background:linear-gradient(180deg, rgba(10,9,9,.04), rgba(10,9,9,.36));
        }
        .news-content{
            padding:20px 20px 18px;
        }
        .news-meta{
            display:flex;
            flex-wrap:wrap;
            gap:8px 12px;
            align-items:center;
        }
        .news-tag,
        .news-time{
            display:inline-flex;
            align-items:center;
            min-height:28px;
            padding:0 10px;
            border-radius:999px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            color:#d9cec1;
            font-size:12px;
        }
        .news-tag{
            color:#ffe1b2;
            border-color:rgba(242,163,58,.16);
            background:rgba(242,163,58,.08);
        }
        .news-title{
            margin:14px 0 0;
            font-size:20px;
            line-height:1.35;
        }
        .news-summary{
            margin:10px 0 0;
            color:var(--muted);
            font-size:14px;
            line-height:1.8;
            display:-webkit-box;
            -webkit-line-clamp:3;
            -webkit-box-orient:vertical;
            overflow:hidden;
        }
        .news-link{
            display:inline-flex;
            align-items:center;
            gap:8px;
            margin-top:14px;
            color:#ffd391;
            font-weight:800;
        }
        .news-link::after{
            content:"→";
            transition:transform .22s var(--ease);
        }
        .news-card:hover .news-link::after{
            transform:translateX(4px);
        }
        .news-card:not(.news-card--lead) .news-card-link{
            padding:18px 20px;
        }
        .news-empty{
            display:grid;
            place-items:center;
            min-height:180px;
            padding:28px;
            border-radius:22px;
            border:1px dashed rgba(255,255,255,.12);
            background:rgba(255,255,255,.02);
            color:#d7cdc1;
            font-weight:700;
            letter-spacing:.01em;
        }

        .faq-list{
            display:grid;
            gap:14px;
            max-width:var(--container-tight);
        }
        details.faq-item{
            border-radius:20px;
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
            overflow:hidden;
            box-shadow:var(--shadow-soft);
            transition:border-color .22s var(--ease), transform .22s var(--ease);
        }
        details.faq-item:hover{
            transform:translateY(-2px);
            border-color:rgba(242,163,58,.22);
        }
        details.faq-item[open]{
            border-color:rgba(242,163,58,.26);
        }
        summary.faq-question{
            list-style:none;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding:18px 20px;
            cursor:pointer;
            font-size:17px;
            font-weight:800;
            line-height:1.4;
        }
        summary.faq-question::-webkit-details-marker{display:none}
        summary.faq-question::after{
            content:"+";
            width:28px;
            height:28px;
            flex:0 0 28px;
            border-radius:10px;
            display:grid;
            place-items:center;
            background:rgba(242,163,58,.08);
            border:1px solid rgba(242,163,58,.16);
            color:#ffd28a;
            font-size:20px;
            line-height:1;
            transition:transform .22s var(--ease), background-color .22s var(--ease);
        }
        details.faq-item[open] summary.faq-question::after{
            transform:rotate(45deg);
            background:rgba(242,163,58,.12);
        }
        .faq-answer{
            padding:0 20px 18px;
            color:var(--muted);
            font-size:15px;
            line-height:1.85;
        }
        .faq-answer p{
            margin:0;
        }

        .confirm-card{
            position:relative;
            padding:30px;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,255,255,.08);
            background:
                radial-gradient(700px 220px at 10% 0%, rgba(242,163,58,.12), transparent 60%),
                linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
            box-shadow:var(--shadow);
            overflow:hidden;
        }
        .confirm-card::before{
            content:"18+";
            position:absolute;
            right:-4px;
            top:-8px;
            font-size:120px;
            line-height:1;
            font-weight:900;
            color:rgba(255,255,255,.04);
            letter-spacing:-.06em;
            pointer-events:none;
        }
        .confirm-grid{
            display:grid;
            grid-template-columns:1fr .72fr;
            gap:26px;
            align-items:center;
        }
        .confirm-form{
            display:grid;
            gap:14px;
        }
        .confirm-copy h2{
            margin:10px 0 0;
            font-size:clamp(26px, 3vw, 36px);
            line-height:1.2;
        }
        .confirm-copy p{
            margin:12px 0 0;
            color:var(--muted);
            font-size:15px;
            line-height:1.85;
            max-width:56ch;
        }
        .confirm-row{
            display:flex;
            align-items:flex-start;
            gap:12px;
            padding:14px 16px;
            border-radius:18px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
        }
        .confirm-row input{
            width:18px;
            height:18px;
            margin-top:3px;
            accent-color:var(--accent);
            flex:0 0 auto;
        }
        .confirm-row span{
            color:#f0e7db;
            font-size:14px;
            line-height:1.7;
        }
        .confirm-actions{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            margin-top:4px;
        }
        .confirm-note{
            padding:22px;
            border-radius:22px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
        }
        .confirm-note h3{
            margin:0;
            font-size:20px;
            line-height:1.3;
        }
        .confirm-note ul{
            margin:12px 0 0;
            padding:0;
            list-style:none;
            display:grid;
            gap:10px;
        }
        .confirm-note li{
            position:relative;
            padding-left:18px;
            color:var(--muted);
            font-size:14px;
            line-height:1.75;
        }
        .confirm-note li::before{
            content:"";
            position:absolute;
            left:0;
            top:.72em;
            width:8px;
            height:8px;
            border-radius:50%;
            background:var(--accent);
            box-shadow:0 0 0 5px rgba(242,163,58,.12);
        }

        .footer{
            position:relative;
            margin-top:12px;
            padding:42px 0 28px;
            background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
            border-top:1px solid rgba(255,255,255,.08);
        }
        .footer-grid{
            display:grid;
            grid-template-columns:1.18fr .82fr .82fr 1fr;
            gap:22px;
        }
        .footer-brand .brand{
            margin-bottom:14px;
        }
        .footer-brand p{
            margin:0;
            color:var(--muted);
            font-size:14px;
            line-height:1.85;
            max-width:32ch;
        }
        .footer-title{
            margin:0 0 14px;
            font-size:16px;
            line-height:1.25;
        }
        .footer-links{
            display:grid;
            gap:10px;
        }
        .footer-links a{
            color:#d8cdc0;
            font-size:14px;
        }
        .footer-links a:hover{
            color:#ffe2b2;
        }
        .footer-note{
            color:var(--muted);
            font-size:14px;
            line-height:1.8;
            display:grid;
            gap:8px;
        }
        .footer-meta{
            margin-top:24px;
            padding-top:16px;
            border-top:1px solid rgba(255,255,255,.08);
            display:flex;
            flex-wrap:wrap;
            justify-content:space-between;
            gap:10px 18px;
            color:#a79e95;
            font-size:13px;
        }
        .footer-meta strong{
            color:#f1e7da;
        }

        @media (max-width: 1180px){
            .trust-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
            .split-grid,
            .grade-grid,
            .latest-grid,
            .confirm-grid{
                grid-template-columns:1fr;
            }
            .latest-aside{
                position:static;
            }
            .footer-grid{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }
        }
        @media (max-width: 920px){
            .hero-grid{
                grid-template-columns:1fr;
            }
            .hero-art{
                min-height:360px;
            }
            .site-nav{
                gap:2px;
            }
            .nav-link{
                padding:11px 12px;
            }
            .tag-matrix{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }
            .news-card--lead .news-card-link{
                grid-template-columns:1fr;
            }
            .news-thumb{
                min-height:220px;
            }
        }
        @media (max-width: 768px){
            .section{
                padding:68px 0;
            }
            .topbar-inner{
                align-items:flex-start;
                flex-direction:column;
            }
            .header-inner{
                flex-wrap:wrap;
                min-height:auto;
                padding:14px 0;
            }
            .site-nav{
                order:3;
                width:100%;
                display:none;
                flex-direction:column;
                align-items:stretch;
                gap:6px;
                padding:10px;
                border-radius:20px;
                border:1px solid rgba(255,255,255,.08);
                background:rgba(18,17,16,.96);
                box-shadow:var(--shadow);
            }
            .site-nav.is-open{
                display:flex;
            }
            .nav-link{
                width:100%;
                border-radius:14px;
                padding:14px 14px;
                background:rgba(255,255,255,.02);
            }
            .nav-toggle{
                display:inline-flex;
            }
            .header-actions{
                margin-left:auto;
            }
            .nav-cta{
                display:none;
            }
            .section-head{
                align-items:flex-start;
                flex-direction:column;
            }
            .hero-title{
                font-size:clamp(32px, 8vw, 44px);
            }
            .hero-lead{
                max-width:none;
            }
            .hero-actions{
                flex-direction:column;
            }
            .hero-actions .btn{
                width:100%;
            }
            .hero-mini-grid{
                grid-template-columns:1fr;
            }
            .trust-grid{
                grid-template-columns:1fr;
            }
            .notice-item{
                grid-template-columns:1fr;
            }
            .step-no{
                width:46px;
                height:46px;
                border-radius:14px;
            }
            .media-card{
                min-height:320px;
            }
            .tag-matrix{
                grid-template-columns:1fr;
            }
            .confirm-card{
                padding:22px;
            }
            .footer-grid{
                grid-template-columns:1fr;
            }
            .footer-meta{
                flex-direction:column;
                align-items:flex-start;
            }
        }
        @media (max-width: 520px){
            .container,
            .container-tight{
                width:min(calc(100% - 28px), 100%);
            }
            .brand-name{
                font-size:16px;
            }
            .brand-sub{
                display:none;
            }
            .eyebrow,
            .badge,
            .step-tag,
            .news-tag,
            .news-time,
            .section-link{
                font-size:12px;
            }
            .section-title{
                font-size:26px;
            }
            .hero-art{
                min-height:300px;
            }
            .hero-stamp{
                width:62px;
                height:62px;
                font-size:20px;
            }
            .hero-caption p{
                font-size:14px;
            }
            .media-title{
                font-size:20px;
            }
            .summary,
            .section-subtitle,
            .hero-lead,
            .confirm-copy p,
            .footer-brand p{
                font-size:14px;
            }
            summary.faq-question{
                padding:16px 16px;
                font-size:16px;
            }
            .faq-answer{
                padding:0 16px 16px;
            }
            .news-content{
                padding:16px;
            }
            .news-card:not(.news-card--lead) .news-card-link{
                padding:16px;
            }
            .confirm-actions .btn{
                width:100%;
            }
        }

/* roulang page: article */
:root{
            --bg:#121110;
            --bg-2:#171513;
            --bg-3:#1d1a18;
            --surface:#221f1d;
            --surface-2:#2a2623;
            --surface-3:#312b28;
            --text:#f4efe7;
            --muted:#c2b8af;
            --weak:#8f857b;
            --line:rgba(242,163,58,.16);
            --line-2:rgba(255,255,255,.08);
            --accent:#f2a33a;
            --accent-2:#d17d4b;
            --accent-3:#9d6b59;
            --danger:#c24d3b;
            --success:#81b98d;
            --shadow:0 18px 50px rgba(0,0,0,.38);
            --shadow-soft:0 10px 26px rgba(0,0,0,.22);
            --radius-sm:12px;
            --radius:20px;
            --radius-lg:28px;
            --radius-xl:34px;
            --container:1180px;
            --container-tight:820px;
            --gap:24px;
            --gap-lg:36px;
            --section:92px;
            --ease:cubic-bezier(.2,.8,.2,1);
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            min-height:100vh;
            font-family:PingFang SC, Microsoft YaHei, Noto Sans SC, Arial, sans-serif;
            color:var(--text);
            background:
                radial-gradient(1200px 520px at 18% -10%, rgba(242,163,58,.10), transparent 58%),
                radial-gradient(1000px 420px at 92% 0%, rgba(157,107,89,.10), transparent 52%),
                linear-gradient(180deg, #181513 0%, #121110 48%, #10100f 100%);
            overflow-x:hidden;
            line-height:1.75;
        }
        body::before{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            opacity:.18;
            background:
                linear-gradient(135deg, rgba(255,255,255,.02) 0 1px, transparent 1px 18px),
                linear-gradient(45deg, rgba(255,255,255,.015) 0 1px, transparent 1px 18px);
            mix-blend-mode:screen;
        }
        img{
            display:block;
            max-width:100%;
            height:auto;
        }
        a{
            color:inherit;
            text-decoration:none;
            transition:color .22s var(--ease), background-color .22s var(--ease), border-color .22s var(--ease), transform .22s var(--ease), box-shadow .22s var(--ease), opacity .22s var(--ease);
        }
        a:hover{color:#ffd28a}
        button, input, textarea, select{
            font:inherit;
        }
        button{
            border:0;
            background:none;
            color:inherit;
            cursor:pointer;
        }
        ::selection{
            background:rgba(242,163,58,.28);
            color:#fff7ef;
        }
        .container{
            width:min(var(--container), calc(100% - 40px));
            margin:0 auto;
        }
        .container-tight{
            width:min(var(--container-tight), calc(100% - 40px));
            margin:0 auto;
        }
        .section{
            position:relative;
            padding:var(--section) 0;
        }
        .section::before{
            content:"";
            position:absolute;
            left:50%;
            top:0;
            transform:translateX(-50%);
            width:min(100%, var(--container));
            height:1px;
            background:linear-gradient(90deg, transparent, rgba(242,163,58,.14), transparent);
        }
        .eyebrow{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:7px 12px;
            border:1px solid rgba(242,163,58,.18);
            border-radius:999px;
            color:#ffd191;
            background:rgba(242,163,58,.06);
            font-size:13px;
            letter-spacing:.02em;
        }
        .eyebrow::before{
            content:"";
            width:8px;
            height:8px;
            border-radius:999px;
            background:var(--accent);
            box-shadow:0 0 0 6px rgba(242,163,58,.12);
        }
        .section-head{
            display:flex;
            align-items:flex-end;
            justify-content:space-between;
            gap:20px;
            margin-bottom:26px;
        }
        .section-title{
            margin:12px 0 0;
            font-size:clamp(26px, 3vw, 36px);
            line-height:1.15;
            letter-spacing:-.02em;
        }
        .section-subtitle{
            margin:12px 0 0;
            max-width:70ch;
            color:var(--muted);
            font-size:16px;
            line-height:1.85;
        }
        .section-link{
            display:inline-flex;
            align-items:center;
            gap:10px;
            color:#ffe0b0;
            font-weight:700;
            white-space:nowrap;
        }
        .section-link::after{
            content:"→";
            transition:transform .22s var(--ease);
        }
        .section-link:hover::after{
            transform:translateX(4px);
        }
        .topbar{
            position:relative;
            z-index:30;
            background:linear-gradient(90deg, rgba(242,163,58,.12), rgba(157,107,89,.10));
            border-bottom:1px solid rgba(242,163,58,.18);
        }
        .topbar-inner{
            min-height:46px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding:10px 0;
            color:#f2e9dd;
            font-size:13px;
            line-height:1.6;
        }
        .topbar-note{
            display:flex;
            align-items:center;
            gap:10px;
            flex-wrap:wrap;
        }
        .topbar-badge{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-width:42px;
            padding:4px 10px;
            border-radius:999px;
            background:rgba(242,163,58,.16);
            color:#ffd08a;
            font-weight:800;
            letter-spacing:.04em;
        }
        .site-header{
            position:sticky;
            top:0;
            z-index:40;
            background:rgba(18,17,16,.64);
            backdrop-filter:blur(16px);
            border-bottom:1px solid rgba(255,255,255,.07);
            transition:background .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
        }
        .site-header.is-scrolled{
            background:rgba(16,15,14,.92);
            box-shadow:0 10px 28px rgba(0,0,0,.22);
            border-bottom-color:rgba(242,163,58,.16);
        }
        .header-inner{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
            min-height:76px;
        }
        .brand{
            display:inline-flex;
            align-items:center;
            gap:12px;
            min-width:0;
        }
        .brand-mark{
            display:inline-grid;
            place-items:center;
            width:44px;
            height:44px;
            border-radius:14px;
            background:
                linear-gradient(145deg, rgba(242,163,58,.96), rgba(209,125,75,.90));
            color:#20160b;
            font-weight:900;
            letter-spacing:.04em;
            box-shadow:0 14px 26px rgba(242,163,58,.18);
            flex:0 0 auto;
        }
        .brand-text{
            display:flex;
            flex-direction:column;
            min-width:0;
        }
        .brand-name{
            font-size:18px;
            font-weight:800;
            line-height:1.1;
            letter-spacing:.01em;
            white-space:nowrap;
        }
        .brand-sub{
            margin-top:4px;
            font-size:12px;
            color:var(--weak);
            line-height:1.2;
            white-space:nowrap;
        }
        .site-nav{
            display:flex;
            align-items:center;
            gap:8px;
            padding:8px;
            border:1px solid rgba(255,255,255,.06);
            border-radius:999px;
            background:rgba(255,255,255,.02);
        }
        .nav-link{
            position:relative;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:40px;
            padding:0 14px;
            border-radius:999px;
            color:#ddd4cb;
            font-size:14px;
            letter-spacing:.01em;
            white-space:nowrap;
        }
        .nav-link:hover{
            color:#fff3dd;
            background:rgba(242,163,58,.08);
        }
        .nav-link.is-active{
            color:#20160b;
            background:linear-gradient(145deg, #f2a33a, #d17d4b);
            box-shadow:0 10px 20px rgba(242,163,58,.18);
        }
        .header-actions{
            display:flex;
            align-items:center;
            gap:12px;
            flex:0 0 auto;
        }
        .nav-toggle{
            display:none;
            align-items:center;
            gap:10px;
            min-height:44px;
            padding:0 14px;
            border:1px solid rgba(255,255,255,.09);
            border-radius:999px;
            color:var(--text);
            background:rgba(255,255,255,.03);
        }
        .nav-toggle:hover{
            border-color:rgba(242,163,58,.28);
            background:rgba(242,163,58,.06);
        }
        .nav-toggle:focus-visible,
        .btn:focus-visible,
        .nav-link:focus-visible,
        .brand:focus-visible,
        .footer-links a:focus-visible,
        .accordion-btn:focus-visible,
        .toc-link:focus-visible,
        .link-card:focus-visible{
            outline:3px solid rgba(242,163,58,.36);
            outline-offset:3px;
        }
        .bars{
            position:relative;
            width:18px;
            height:12px;
            display:inline-block;
        }
        .bars span,
        .bars::before,
        .bars::after{
            content:"";
            position:absolute;
            left:0;
            width:100%;
            height:2px;
            border-radius:999px;
            background:#f1eadf;
            transition:transform .2s var(--ease), top .2s var(--ease), opacity .2s var(--ease);
        }
        .bars::before{top:0}
        .bars span{top:5px}
        .bars::after{top:10px}
        .btn{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:10px;
            min-height:44px;
            padding:0 18px;
            border-radius:999px;
            border:1px solid transparent;
            font-weight:800;
            letter-spacing:.01em;
            white-space:nowrap;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), background-color .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease), opacity .22s var(--ease);
        }
        .btn:hover{
            transform:translateY(-2px);
        }
        .btn:active{
            transform:translateY(0);
        }
        .btn-primary{
            color:#20160b;
            background:linear-gradient(145deg, #f2a33a, #dd8b45);
            box-shadow:0 14px 26px rgba(242,163,58,.16);
        }
        .btn-primary:hover{
            box-shadow:0 18px 30px rgba(242,163,58,.22);
            color:#20160b;
        }
        .btn-ghost{
            color:#fff1d9;
            border-color:rgba(242,163,58,.22);
            background:rgba(242,163,58,.04);
        }
        .btn-ghost:hover{
            color:#fff7ec;
            border-color:rgba(242,163,58,.36);
            background:rgba(242,163,58,.09);
        }
        .btn-weak{
            color:#dccfc4;
            border-color:rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
        }
        .btn-weak:hover{
            color:#fff3df;
            border-color:rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
        }
        .page-main{
            position:relative;
        }
        .article-hero{
            padding-top:34px;
            padding-bottom:28px;
        }
        .article-hero-card{
            position:relative;
            overflow:hidden;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,255,255,.08);
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                radial-gradient(1000px 340px at 16% 0%, rgba(242,163,58,.10), transparent 52%),
                radial-gradient(700px 280px at 94% 12%, rgba(157,107,89,.12), transparent 46%),
                rgba(34,31,29,.72);
            box-shadow:var(--shadow);
        }
        .article-hero-card::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                linear-gradient(135deg, rgba(242,163,58,.06) 0 12%, transparent 12% 22%, rgba(255,255,255,.02) 22% 24%, transparent 24% 100%),
                linear-gradient(180deg, rgba(255,255,255,.02), transparent 30%);
            pointer-events:none;
        }
        .article-hero-inner{
            position:relative;
            z-index:1;
            display:grid;
            grid-template-columns:minmax(0, 1.35fr) minmax(280px, .8fr);
            gap:28px;
            padding:28px;
            align-items:stretch;
        }
        .breadcrumbs{
            display:flex;
            align-items:center;
            flex-wrap:wrap;
            gap:8px;
            color:var(--muted);
            font-size:13px;
        }
        .breadcrumbs a{
            color:#f0dfc8;
        }
        .breadcrumbs a:hover{
            color:#ffd59a;
        }
        .crumb-sep{
            color:rgba(255,255,255,.28);
        }
        .article-kicker{
            display:flex;
            flex-wrap:wrap;
            align-items:center;
            gap:10px;
            margin-top:16px;
        }
        .kicker-tag{
            display:inline-flex;
            align-items:center;
            gap:8px;
            min-height:32px;
            padding:0 12px;
            border-radius:999px;
            border:1px solid rgba(242,163,58,.18);
            background:rgba(242,163,58,.06);
            color:#ffd08a;
            font-size:13px;
            font-weight:700;
        }
        .article-title{
            margin:16px 0 0;
            font-size:clamp(30px, 4.2vw, 56px);
            line-height:1.12;
            letter-spacing:-.03em;
        }
        .article-summary{
            margin:18px 0 0;
            max-width:62ch;
            color:var(--muted);
            font-size:16px;
            line-height:1.88;
        }
        .article-meta{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
            margin-top:20px;
        }
        .meta-item{
            display:inline-flex;
            align-items:center;
            gap:8px;
            min-height:34px;
            padding:0 12px;
            border-radius:999px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            color:#eee4d8;
            font-size:13px;
            white-space:nowrap;
        }
        .meta-item time{
            color:#fff2de;
        }
        .meta-item.is-accent{
            border-color:rgba(242,163,58,.22);
            background:rgba(242,163,58,.08);
            color:#ffd48f;
        }
        .hero-visual{
            display:flex;
            flex-direction:column;
            gap:16px;
            min-width:0;
        }
        .hero-cover{
            position:relative;
            overflow:hidden;
            border-radius:24px;
            border:1px solid rgba(255,255,255,.08);
            background:#1d1a18;
            box-shadow:var(--shadow-soft);
            min-height:240px;
        }
        .hero-cover img{
            width:100%;
            height:100%;
            min-height:240px;
            object-fit:cover;
        }
        .hero-cover::after{
            content:"";
            position:absolute;
            inset:0;
            background:linear-gradient(180deg, rgba(18,17,16,.04), rgba(18,17,16,.46));
        }
        .hero-stack{
            display:grid;
            grid-template-columns:repeat(2, minmax(0, 1fr));
            gap:12px;
        }
        .stack-card{
            padding:16px;
            border-radius:18px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            color:#e8ded2;
            box-shadow:var(--shadow-soft);
        }
        .stack-card strong{
            display:block;
            color:#fff4df;
            font-size:14px;
            margin-bottom:6px;
        }
        .stack-card span{
            display:block;
            color:var(--muted);
            font-size:13px;
            line-height:1.65;
        }
        .hero-badge{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            width:68px;
            height:68px;
            border-radius:999px;
            background:
                radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), transparent 38%),
                linear-gradient(145deg, #f2a33a, #ca7147);
            color:#25190e;
            font-weight:900;
            font-size:24px;
            letter-spacing:.04em;
            box-shadow:0 16px 30px rgba(242,163,58,.18);
        }
        .article-layout{
            display:grid;
            grid-template-columns:minmax(0, 1fr) 320px;
            gap:28px;
            align-items:start;
        }
        .article-panel{
            position:relative;
            min-width:0;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,255,255,.08);
            background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)), rgba(34,31,29,.84);
            box-shadow:var(--shadow);
            overflow:hidden;
        }
        .article-panel::before{
            content:"";
            position:absolute;
            inset:0;
            pointer-events:none;
            background:linear-gradient(180deg, rgba(242,163,58,.04), transparent 18%);
        }
        .article-panel-inner{
            position:relative;
            z-index:1;
            padding:30px 30px 34px;
        }
        .article-content{
            max-width:820px;
            color:var(--text);
            font-size:16.5px;
            line-height:1.88;
        }
        .article-content > :first-child{
            margin-top:0;
        }
        .article-content > :last-child{
            margin-bottom:0;
        }
        .article-content p{
            margin:0 0 18px;
            color:#efe7de;
        }
        .article-content h2,
        .article-content h3{
            scroll-margin-top:120px;
            position:relative;
            margin:34px 0 16px;
            color:#fff3df;
            letter-spacing:-.02em;
        }
        .article-content h2{
            padding-left:16px;
            font-size:clamp(22px, 2.2vw, 30px);
            line-height:1.25;
        }
        .article-content h3{
            padding-left:14px;
            font-size:20px;
            line-height:1.3;
        }
        .article-content h2::before,
        .article-content h3::before{
            content:"";
            position:absolute;
            left:0;
            top:.2em;
            bottom:.2em;
            width:4px;
            border-radius:999px;
            background:linear-gradient(180deg, #f2a33a, #d17d4b);
        }
        .article-content a{
            color:#ffd28d;
            text-decoration:underline;
            text-decoration-color:rgba(242,163,58,.38);
            text-underline-offset:3px;
        }
        .article-content a:hover{
            color:#ffe1b5;
            text-decoration-color:rgba(242,163,58,.66);
        }
        .article-content ul,
        .article-content ol{
            margin:0 0 20px 1.2em;
            padding:0;
            color:#efe7de;
        }
        .article-content li{
            margin:8px 0;
        }
        .article-content blockquote{
            margin:24px 0;
            padding:18px 18px 18px 20px;
            border-left:4px solid rgba(242,163,58,.8);
            border-radius:16px;
            background:rgba(242,163,58,.06);
            color:#f3e8d8;
            box-shadow:inset 0 0 0 1px rgba(242,163,58,.10);
        }
        .article-content blockquote p:last-child{
            margin-bottom:0;
        }
        .article-content hr{
            margin:28px 0;
            border:0;
            border-top:1px solid rgba(255,255,255,.08);
            opacity:1;
        }
        .article-content img{
            width:100%;
            margin:18px 0 24px;
            border-radius:20px;
            border:1px solid rgba(255,255,255,.08);
            box-shadow:var(--shadow-soft);
            object-fit:cover;
        }
        .article-content figure{
            margin:18px 0 24px;
        }
        .article-content figcaption{
            margin-top:10px;
            color:var(--weak);
            font-size:13px;
            line-height:1.7;
        }
        .article-content table{
            display:block;
            width:100%;
            margin:20px 0 26px;
            border-collapse:separate;
            border-spacing:0;
            overflow-x:auto;
            -webkit-overflow-scrolling:touch;
            border:1px solid rgba(255,255,255,.08);
            border-radius:18px;
            background:rgba(255,255,255,.02);
        }
        .article-content thead{
            background:rgba(242,163,58,.06);
        }
        .article-content th,
        .article-content td{
            padding:14px 16px;
            border-bottom:1px solid rgba(255,255,255,.08);
            white-space:nowrap;
            text-align:left;
            color:#f0e8dd;
        }
        .article-content th{
            color:#ffe0b2;
            font-weight:700;
        }
        .article-content code{
            padding:2px 6px;
            border-radius:8px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.04);
            color:#ffd89a;
        }
        .article-content pre{
            margin:22px 0;
            padding:18px;
            overflow:auto;
            border-radius:18px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(15,14,13,.9);
            color:#f6eede;
            box-shadow:var(--shadow-soft);
        }
        .article-content pre code{
            padding:0;
            border:0;
            background:none;
            color:inherit;
        }
        .article-content strong{
            color:#fff7ea;
        }
        .article-content em{
            color:#ffe5bf;
        }
        .article-content .wp-block-image,
        .article-content .aligncenter{
            text-align:center;
        }
        .article-content .wp-block-image img{
            margin-left:auto;
            margin-right:auto;
        }
        .article-content .is-style-note,
        .article-content .note-box{
            margin:20px 0;
            padding:16px 18px;
            border-radius:18px;
            border:1px solid rgba(242,163,58,.14);
            background:rgba(242,163,58,.05);
            color:#f1e6d8;
        }
        .sidebar{
            position:relative;
            min-width:0;
        }
        .sticky-stack{
            position:sticky;
            top:112px;
            display:grid;
            gap:16px;
        }
        .sticky-card{
            padding:20px;
            border-radius:24px;
            border:1px solid rgba(255,255,255,.08);
            background:rgba(34,31,29,.84);
            box-shadow:var(--shadow-soft);
        }
        .section-mini{
            display:inline-flex;
            align-items:center;
            gap:8px;
            margin-bottom:14px;
            color:#ffd69b;
            font-size:13px;
            font-weight:800;
            letter-spacing:.02em;
        }
        .section-mini::before{
            content:"";
            width:8px;
            height:8px;
            border-radius:999px;
            background:var(--accent);
            box-shadow:0 0 0 6px rgba(242,163,58,.10);
        }
        .toc-list{
            list-style:none;
            margin:0;
            padding:0;
            display:grid;
            gap:8px;
        }
        .toc-item{
            margin:0;
        }
        .toc-link{
            display:flex;
            gap:10px;
            align-items:flex-start;
            padding:10px 12px;
            border-radius:14px;
            color:#efe4d7;
            background:rgba(255,255,255,.02);
            border:1px solid rgba(255,255,255,.06);
        }
        .toc-link:hover{
            transform:translateX(2px);
            border-color:rgba(242,163,58,.22);
            background:rgba(242,163,58,.05);
            color:#fff3e1;
        }
        .toc-level{
            flex:0 0 auto;
            min-width:22px;
            height:22px;
            border-radius:999px;
            display:inline-grid;
            place-items:center;
            font-size:12px;
            font-weight:800;
            color:#20160b;
            background:linear-gradient(145deg, #f2a33a, #d17d4b);
        }
        .toc-text{
            font-size:14px;
            line-height:1.55;
        }
        .aside-fallback{
            margin:10px 0 0;
            color:var(--weak);
            font-size:13px;
            line-height:1.7;
        }
        .note-list{
            list-style:none;
            margin:0;
            padding:0;
            display:grid;
            gap:10px;
        }
        .note-list li{
            position:relative;
            padding-left:18px;
            color:#e8ddd1;
            font-size:14px;
            line-height:1.7;
        }
        .note-list li::before{
            content:"";
            position:absolute;
            left:0;
            top:.72em;
            width:8px;
            height:8px;
            border-radius:999px;
            background:var(--accent);
            box-shadow:0 0 0 6px rgba(242,163,58,.09);
        }
        .tip-image{
            overflow:hidden;
            border-radius:20px;
            border:1px solid rgba(255,255,255,.08);
            background:#1d1a18;
        }
        .tip-image img{
            width:100%;
            aspect-ratio:1.52/1;
            object-fit:cover;
        }
        .tip-caption{
            margin-top:12px;
            color:var(--muted);
            font-size:13px;
            line-height:1.7;
        }
        .continue-section{
            padding-top:0;
        }
        .continue-grid{
            display:grid;
            grid-template-columns:repeat(3, minmax(0, 1fr));
            gap:16px;
        }
        .link-card{
            display:flex;
            flex-direction:column;
            gap:12px;
            min-height:168px;
            padding:22px;
            border-radius:24px;
            border:1px solid rgba(255,255,255,.08);
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                rgba(34,31,29,.84);
            box-shadow:var(--shadow-soft);
        }
        .link-card:hover{
            transform:translateY(-3px);
            border-color:rgba(242,163,58,.22);
            box-shadow:0 18px 32px rgba(0,0,0,.28);
        }
        .link-card-title{
            margin:0;
            font-size:18px;
            line-height:1.3;
            color:#fff3df;
        }
        .link-card-desc{
            margin:0;
            color:var(--muted);
            font-size:14px;
            line-height:1.8;
        }
        .link-card-action{
            margin-top:auto;
            display:inline-flex;
            align-items:center;
            gap:8px;
            font-weight:800;
            color:#ffd08a;
        }
        .link-card-action::after{
            content:"→";
            transition:transform .22s var(--ease);
        }
        .link-card:hover .link-card-action::after{
            transform:translateX(4px);
        }
        .cta-shell{
            position:relative;
            overflow:hidden;
            border-radius:var(--radius-xl);
            border:1px solid rgba(242,163,58,.16);
            background:
                radial-gradient(600px 220px at 8% 0%, rgba(242,163,58,.14), transparent 60%),
                radial-gradient(640px 260px at 92% 8%, rgba(157,107,89,.12), transparent 52%),
                rgba(34,31,29,.88);
            box-shadow:var(--shadow);
        }
        .cta-shell::before{
            content:"18+";
            position:absolute;
            right:-20px;
            top:-8px;
            font-size:140px;
            font-weight:900;
            letter-spacing:-.08em;
            color:rgba(255,255,255,.04);
            pointer-events:none;
        }
        .cta-inner{
            position:relative;
            z-index:1;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:24px;
            padding:30px;
        }
        .cta-copy{
            max-width:720px;
        }
        .cta-title{
            margin:0;
            font-size:clamp(24px, 2.8vw, 36px);
            line-height:1.18;
            letter-spacing:-.02em;
        }
        .cta-text{
            margin:12px 0 0;
            color:var(--muted);
            font-size:16px;
            line-height:1.88;
        }
        .cta-actions{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            align-items:center;
            justify-content:flex-end;
            flex:0 0 auto;
        }
        .empty-wrap{
            padding:84px 0 96px;
        }
        .empty-state{
            display:grid;
            place-items:center;
            gap:14px;
            min-height:320px;
            padding:34px;
            text-align:center;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,255,255,.08);
            background:rgba(34,31,29,.86);
            box-shadow:var(--shadow);
        }
        .empty-icon{
            display:inline-grid;
            place-items:center;
            width:72px;
            height:72px;
            border-radius:22px;
            background:rgba(242,163,58,.10);
            border:1px solid rgba(242,163,58,.18);
            color:#ffd592;
            font-size:32px;
            font-weight:900;
        }
        .empty-state h1,
        .empty-state h2{
            margin:4px 0 0;
            font-size:clamp(24px, 3vw, 34px);
            line-height:1.2;
        }
        .empty-state p{
            margin:0;
            max-width:52ch;
            color:var(--muted);
            font-size:16px;
            line-height:1.86;
        }
        .footer{
            margin-top:0;
            padding:44px 0 28px;
            background:linear-gradient(180deg, rgba(18,17,16,.2), rgba(18,17,16,.92));
            border-top:1px solid rgba(255,255,255,.07);
        }
        .footer-grid{
            display:grid;
            grid-template-columns:1.2fr .8fr .8fr .8fr;
            gap:24px;
            padding:18px 0 28px;
        }
        .footer-brand .brand{
            margin-bottom:14px;
        }
        .footer-brand p{
            margin:0;
            color:var(--muted);
            font-size:14px;
            line-height:1.9;
        }
        .footer-title{
            margin:0 0 14px;
            font-size:16px;
            color:#fff3df;
        }
        .footer-links{
            display:grid;
            gap:10px;
        }
        .footer-links a{
            color:#dbcfc3;
            font-size:14px;
        }
        .footer-links a:hover{
            color:#ffd79c;
        }
        .footer-note{
            display:grid;
            gap:10px;
            color:var(--muted);
            font-size:14px;
            line-height:1.8;
        }
        .footer-meta{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding-top:18px;
            border-top:1px solid rgba(255,255,255,.07);
            color:#bcb1a7;
            font-size:13px;
            line-height:1.7;
        }
        .footer-meta strong{
            color:#fff0da;
        }
        .sr-only{
            position:absolute;
            width:1px;
            height:1px;
            padding:0;
            margin:-1px;
            overflow:hidden;
            clip:rect(0,0,0,0);
            white-space:nowrap;
            border:0;
        }
        @media (max-width: 1199.98px){
            .article-layout{
                grid-template-columns:minmax(0, 1fr) 300px;
            }
            .continue-grid{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }
            .footer-grid{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }
        }
        @media (max-width: 991.98px){
            .topbar-inner{
                flex-direction:column;
                align-items:flex-start;
                gap:8px;
            }
            .header-inner{
                min-height:70px;
            }
            .site-nav{
                position:absolute;
                left:20px;
                right:20px;
                top:calc(100% + 12px);
                display:none;
                flex-direction:column;
                align-items:stretch;
                gap:6px;
                padding:12px;
                border-radius:24px;
                background:rgba(21,19,18,.98);
                box-shadow:var(--shadow);
            }
            .site-nav.is-open{
                display:flex;
            }
            .nav-link{
                justify-content:flex-start;
                width:100%;
                min-height:46px;
                padding:0 14px;
            }
            .nav-toggle{
                display:inline-flex;
            }
            .header-actions{
                gap:10px;
            }
            .nav-cta{
                display:none;
            }
            .article-hero-inner{
                grid-template-columns:1fr;
            }
            .hero-visual{
                max-width:520px;
            }
            .article-layout{
                grid-template-columns:1fr;
            }
            .sidebar{
                order:2;
            }
            .sticky-stack{
                position:relative;
                top:auto;
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }
            .cta-inner{
                flex-direction:column;
                align-items:flex-start;
            }
            .cta-actions{
                justify-content:flex-start;
            }
        }
        @media (max-width: 767.98px){
            .container,
            .container-tight{
                width:min(calc(100% - 28px), var(--container));
            }
            .section{
                padding:64px 0;
            }
            .article-hero{
                padding-top:22px;
                padding-bottom:20px;
            }
            .article-hero-inner,
            .article-panel-inner,
            .cta-inner{
                padding:20px;
            }
            .article-title{
                font-size:clamp(28px, 8vw, 38px);
            }
            .article-summary{
                font-size:15px;
            }
            .hero-stack{
                grid-template-columns:1fr;
            }
            .hero-cover,
            .hero-cover img{
                min-height:210px;
            }
            .article-content{
                font-size:16px;
            }
            .continue-grid{
                grid-template-columns:1fr;
            }
            .footer-grid{
                grid-template-columns:1fr;
            }
            .footer-meta{
                flex-direction:column;
                align-items:flex-start;
            }
            .sticky-stack{
                grid-template-columns:1fr;
            }
            .btn{
                width:100%;
            }
            .cta-actions .btn{
                width:100%;
            }
            .cta-shell::before{
                right:-28px;
                top:2px;
                font-size:110px;
            }
        }
        @media (max-width: 575.98px){
            .brand-mark{
                width:40px;
                height:40px;
                border-radius:12px;
            }
            .brand-name{
                font-size:16px;
            }
            .brand-sub{
                font-size:11px;
            }
            .topbar-inner{
                font-size:12px;
            }
            .article-meta{
                gap:8px;
            }
            .meta-item{
                min-height:32px;
                font-size:12px;
                padding:0 10px;
            }
            .section-title{
                font-size:26px;
            }
            .sticky-card{
                padding:18px;
            }
            .link-card{
                min-height:unset;
            }
        }

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}