/* roulang page: index */
:root{
            --bg:#11100F;
            --bg-2:#181411;
            --panel:#221b17;
            --panel-2:#2b211c;
            --paper:#FFF8EC;
            --paper-2:#f6ecdc;
            --text:#FFF7EA;
            --muted:#D8CBB9;
            --muted-2:#9f8c7a;
            --ink:#221B17;
            --soft-ink:#6E5B4F;
            --accent:#8E2538;
            --accent-2:#E7A53A;
            --teal:#2BB3A3;
            --line:rgba(255,248,236,.12);
            --line-2:rgba(255,248,236,.08);
            --shadow:0 28px 80px rgba(0,0,0,.42);
            --shadow-soft:0 18px 44px rgba(16, 9, 6, .18);
            --radius-xl:34px;
            --radius-lg:24px;
            --radius-md:18px;
            --radius-sm:14px;
            --container:1232px;
            --section-gap:clamp(56px,7vw,110px);
            --ease:cubic-bezier(.2,.7,.1,1);
        }
        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
            color:var(--text);
            background:
                radial-gradient(circle at 15% 15%, rgba(231,165,58,.09), transparent 25%),
                radial-gradient(circle at 85% 8%, rgba(142,37,56,.16), transparent 22%),
                radial-gradient(circle at 70% 85%, rgba(43,179,163,.06), transparent 25%),
                linear-gradient(180deg, #171310 0%, #11100F 34%, #0F0D0C 100%);
            min-height:100vh;
            overflow-x:hidden;
        }
        body::before{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            background:
                linear-gradient(90deg, rgba(255,248,236,.03) 1px, transparent 1px),
                linear-gradient(180deg, rgba(255,248,236,.025) 1px, transparent 1px);
            background-size:120px 120px;
            opacity:.14;
            mask-image:linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.12));
        }
        body::after{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            background:
                radial-gradient(circle at 50% 0%, rgba(231,165,58,.10), transparent 22%),
                radial-gradient(circle at 50% 100%, rgba(142,37,56,.08), transparent 20%);
            opacity:.45;
        }
        img,svg{max-width:100%;display:block}
        a{
            color:inherit;
            text-decoration:none;
            transition:color .22s var(--ease), transform .22s var(--ease), opacity .22s var(--ease);
        }
        a:hover{color:inherit}
        button,input,textarea,select{
            font:inherit;
        }
        ::selection{background:rgba(231,165,58,.32);color:#fff}
        .container, .container-lg, .container-xl, .container-xxl{
            max-width:var(--container);
            position:relative;
            z-index:1;
        }
        .site-main{
            position:relative;
            z-index:1;
            padding-top:92px;
        }
        .site-header{
            position:fixed;
            inset:0 0 auto 0;
            z-index:1035;
            padding:16px 0;
            transition:background .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease), padding .25s var(--ease), backdrop-filter .25s var(--ease);
            background:linear-gradient(180deg, rgba(17,16,15,.64), rgba(17,16,15,.12));
            border-bottom:1px solid transparent;
        }
        .site-header.is-scrolled{
            background:rgba(17,16,15,.92);
            backdrop-filter:blur(16px);
            border-bottom:1px solid rgba(255,248,236,.08);
            box-shadow:0 12px 40px rgba(0,0,0,.28);
            padding:10px 0;
        }
        .brand{
            display:inline-flex;
            align-items:center;
            gap:12px;
            font-weight:800;
            font-size:1.02rem;
            letter-spacing:.01em;
            color:var(--text);
        }
        .brand:hover{transform:translateY(-1px)}
        .brand-mark{
            width:38px;
            height:38px;
            border-radius:13px;
            position:relative;
            flex:0 0 auto;
            background:
                linear-gradient(145deg, rgba(142,37,56,.95), rgba(72,21,31,.92));
            border:1px solid rgba(231,165,58,.28);
            box-shadow:0 14px 30px rgba(0,0,0,.28), 0 0 0 1px rgba(255,248,236,.05) inset;
            overflow:hidden;
        }
        .brand-mark::before,
        .brand-mark::after{
            content:"";
            position:absolute;
            inset:7px 9px;
            border:1px solid rgba(255,248,236,.22);
            border-radius:10px;
        }
        .brand-mark::after{
            inset:11px 13px;
            border-radius:8px;
            border-color:rgba(231,165,58,.42);
        }
        .brand-mark i{
            position:absolute;
            inset:0;
            margin:auto;
            width:8px;
            height:18px;
            background:rgba(255,248,236,.9);
            border-radius:999px;
            box-shadow:-10px 0 0 rgba(255,248,236,.32), 10px 0 0 rgba(255,248,236,.32);
            top:50%;
            transform:translateY(-50%);
        }
        .brand strong{
            font-size:1.02rem;
            line-height:1.1;
        }
        .brand small{
            display:block;
            color:var(--muted);
            font-size:.74rem;
            font-weight:500;
            margin-top:2px;
        }
        .header-actions{
            display:flex;
            align-items:center;
            gap:10px;
        }
        .btn-site{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:8px;
            border-radius:999px;
            padding:12px 18px;
            border:1px solid transparent;
            font-weight:700;
            letter-spacing:.01em;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease), opacity .22s var(--ease);
            user-select:none;
            white-space:nowrap;
        }
        .btn-site:hover{transform:translateY(-2px)}
        .btn-site:active{transform:translateY(1px)}
        .btn-site:focus-visible{
            outline:none;
            box-shadow:0 0 0 4px rgba(231,165,58,.28);
        }
        .btn-hero{
            background:linear-gradient(135deg, #9D3043, #74192B);
            color:#fff;
            box-shadow:0 16px 32px rgba(142,37,56,.28), 0 0 0 1px rgba(231,165,58,.16) inset;
            border-color:rgba(231,165,58,.34);
        }
        .btn-hero:hover{
            color:#fff;
            box-shadow:0 20px 36px rgba(142,37,56,.34), 0 0 0 1px rgba(231,165,58,.22) inset;
        }
        .btn-ghost{
            background:rgba(255,248,236,.04);
            color:var(--text);
            border-color:rgba(255,248,236,.14);
        }
        .btn-ghost:hover{
            color:var(--text);
            border-color:rgba(231,165,58,.32);
            background:rgba(255,248,236,.08);
        }
        .btn-plain{
            background:transparent;
            color:var(--text);
            border-color:rgba(255,248,236,.12);
        }
        .btn-plain:hover{
            border-color:rgba(231,165,58,.28);
            color:#fff;
        }
        .menu-toggle{
            width:48px;
            height:48px;
            padding:0;
            border-radius:16px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            border:1px solid rgba(255,248,236,.12);
            background:rgba(255,248,236,.04);
            color:var(--text);
            box-shadow:none;
        }
        .menu-toggle:hover{
            background:rgba(255,248,236,.08);
            border-color:rgba(231,165,58,.26);
        }
        .menu-toggle .lines{
            position:relative;
            width:20px;
            height:14px;
        }
        .menu-toggle .lines span{
            position:absolute;
            left:0;
            width:100%;
            height:2px;
            border-radius:2px;
            background:linear-gradient(90deg, rgba(255,247,234,.95), rgba(231,165,58,.88));
            transition:transform .25s var(--ease), top .25s var(--ease), opacity .25s var(--ease);
        }
        .menu-toggle .lines span:nth-child(1){top:0}
        .menu-toggle .lines span:nth-child(2){top:6px;width:78%}
        .menu-toggle .lines span:nth-child(3){top:12px}
        .offcanvas.fullscreen-drawer{
            width:100vw;
            max-width:100vw;
            background:
                radial-gradient(circle at 20% 10%, rgba(231,165,58,.16), transparent 18%),
                radial-gradient(circle at 80% 12%, rgba(142,37,56,.22), transparent 22%),
                linear-gradient(180deg, rgba(17,16,15,.98), rgba(16,14,13,.98));
            color:var(--text);
            border-left:none;
        }
        .offcanvas-backdrop.show{
            opacity:.88;
            background:rgba(10,8,7,.86);
        }
        .drawer-top{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding:22px 0 18px;
            border-bottom:1px solid rgba(255,248,236,.08);
        }
        .drawer-top .brand{font-size:1.08rem}
        .drawer-close{
            width:48px;
            height:48px;
            border-radius:16px;
            border:1px solid rgba(255,248,236,.12);
            background:rgba(255,248,236,.04);
            color:var(--text);
        }
        .drawer-close:hover{
            background:rgba(255,248,236,.08);
            border-color:rgba(231,165,58,.28);
        }
        .drawer-body{
            min-height:calc(100vh - 92px);
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            padding:28px 0 22px;
        }
        .drawer-nav{
            display:grid;
            gap:14px;
            margin:0;
            padding:0;
            list-style:none;
        }
        .drawer-link{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
            padding:18px 22px;
            border-radius:24px;
            border:1px solid rgba(255,248,236,.10);
            background:rgba(255,248,236,.03);
            font-size:clamp(1.2rem, 3vw, 2rem);
            font-weight:700;
            letter-spacing:.01em;
            position:relative;
            overflow:hidden;
        }
        .drawer-link::before{
            content:"";
            position:absolute;
            inset:0 auto 0 0;
            width:4px;
            background:linear-gradient(180deg, var(--accent-2), var(--accent));
            transform:scaleY(.25);
            transform-origin:center;
            transition:transform .25s var(--ease);
        }
        .drawer-link:hover,
        .drawer-link:focus-visible{
            color:#fff;
            border-color:rgba(231,165,58,.30);
            background:rgba(255,248,236,.06);
            transform:translateX(4px);
        }
        .drawer-link:hover::before,
        .drawer-link:focus-visible::before{
            transform:scaleY(1);
        }
        .drawer-link .tag{
            font-size:.8rem;
            letter-spacing:.12em;
            text-transform:none;
            color:var(--muted);
            padding-inline:10px;
            border-radius:999px;
            border:1px solid rgba(255,248,236,.10);
            flex:0 0 auto;
        }
        .drawer-note{
            margin-top:24px;
            max-width:760px;
            color:var(--muted);
            line-height:1.9;
            font-size:1rem;
        }
        .hero{
            padding:clamp(34px, 5vw, 64px) 0 clamp(56px, 7vw, 88px);
            position:relative;
        }
        .hero::before{
            content:"";
            position:absolute;
            inset:-10px 0 auto;
            height:320px;
            background:radial-gradient(circle at 28% 40%, rgba(231,165,58,.18), transparent 24%), radial-gradient(circle at 72% 18%, rgba(142,37,56,.18), transparent 22%);
            pointer-events:none;
            filter:blur(10px);
        }
        .hero-grid{
            display:grid;
            grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
            gap:clamp(24px, 4vw, 56px);
            align-items:center;
        }
        .eyebrow{
            display:inline-flex;
            align-items:center;
            gap:10px;
            padding:8px 14px;
            border-radius:999px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            color:var(--muted);
            font-size:.92rem;
            letter-spacing:.02em;
            margin-bottom:18px;
        }
        .eyebrow .dot{
            width:8px;
            height:8px;
            border-radius:50%;
            background:var(--accent-2);
            box-shadow:0 0 0 6px rgba(231,165,58,.12);
        }
        h1{
            font-size:clamp(2.35rem, 5.2vw, 4.6rem);
            line-height:1.1;
            letter-spacing:-.03em;
            font-weight:800;
            margin:0 0 18px;
            color:#fff9ef;
            text-wrap:balance;
        }
        .hero-copy{
            max-width:640px;
            font-size:clamp(1.02rem, 1.55vw, 1.18rem);
            line-height:1.9;
            color:var(--muted);
            margin:0 0 24px;
        }
        .hero-actions{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            align-items:center;
            margin-bottom:24px;
        }
        .hero-pills{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
            margin:0 0 28px;
            padding:0;
            list-style:none;
        }
        .hero-pills li{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:9px 13px;
            border-radius:999px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            color:var(--text);
            font-size:.95rem;
        }
        .hero-pills .mini-dot{
            width:8px;
            height:8px;
            border-radius:50%;
            background:var(--teal);
            box-shadow:0 0 0 6px rgba(43,179,163,.12);
        }
        .hero-meta{
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:14px;
            margin-top:18px;
        }
        .meta-card{
            border-radius:24px;
            padding:16px 18px;
            background:linear-gradient(180deg, rgba(255,248,236,.07), rgba(255,248,236,.035));
            border:1px solid rgba(255,248,236,.09);
            box-shadow:0 18px 36px rgba(0,0,0,.12);
        }
        .meta-card .num{
            display:block;
            font-size:1.55rem;
            line-height:1;
            font-weight:800;
            margin-bottom:6px;
            color:#fff4dd;
        }
        .meta-card .text{
            color:var(--muted);
            font-size:.94rem;
            line-height:1.7;
        }
        .hero-stage{
            position:relative;
            min-height:660px;
            border-radius:36px;
            padding:18px;
            background:
                linear-gradient(150deg, rgba(255,248,236,.07), rgba(255,248,236,.03)),
                linear-gradient(180deg, rgba(27,20,17,.95), rgba(14,12,11,.98));
            border:1px solid rgba(255,248,236,.10);
            box-shadow:var(--shadow), 0 0 0 1px rgba(231,165,58,.08) inset;
            overflow:hidden;
            transform:translateY(6px) rotate(.3deg);
        }
        .hero-stage::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(circle at 50% 12%, rgba(231,165,58,.12), transparent 24%),
                radial-gradient(circle at 30% 70%, rgba(142,37,56,.18), transparent 22%),
                radial-gradient(circle at 78% 32%, rgba(43,179,163,.08), transparent 18%);
            pointer-events:none;
        }
        .hero-stage::after{
            content:"";
            position:absolute;
            inset:14px;
            border:1px solid rgba(255,248,236,.07);
            border-radius:30px;
            pointer-events:none;
        }
        .stage-tag{
            position:absolute;
            top:22px;
            left:22px;
            z-index:2;
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:10px 14px;
            border-radius:999px;
            background:rgba(17,16,15,.62);
            border:1px solid rgba(255,248,236,.12);
            color:var(--text);
            font-size:.86rem;
            backdrop-filter:blur(10px);
        }
        .stage-tag .dot{
            width:9px;
            height:9px;
            border-radius:50%;
            background:var(--accent-2);
            box-shadow:0 0 0 5px rgba(231,165,58,.12);
        }
        .stage-cover{
            position:absolute;
            inset:72px 22px 22px 22px;
            border-radius:30px;
            overflow:hidden;
            border:1px solid rgba(255,248,236,.08);
            background:
                linear-gradient(180deg, rgba(255,248,236,.07), rgba(255,248,236,.02)),
                linear-gradient(160deg, #241916 0%, #141210 55%, #0f0d0c 100%);
            display:grid;
            grid-template-rows:auto 1fr auto;
            gap:18px;
            padding:20px;
        }
        .stage-cover::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(circle at 50% 0%, rgba(231,165,58,.16), transparent 14%),
                radial-gradient(circle at 85% 16%, rgba(142,37,56,.18), transparent 22%),
                linear-gradient(90deg, rgba(255,248,236,.05) 1px, transparent 1px);
            background-size:auto, auto, 22px 100%;
            opacity:.72;
            pointer-events:none;
        }
        .poster-wall{
            position:relative;
            z-index:1;
            display:grid;
            grid-template-columns:1.08fr .92fr;
            gap:14px;
            min-height:360px;
        }
        .poster-main,
        .poster-mini{
            border-radius:26px;
            overflow:hidden;
            border:1px solid rgba(255,248,236,.08);
            box-shadow:0 18px 40px rgba(0,0,0,.26);
            position:relative;
            background:linear-gradient(180deg, rgba(255,248,236,.08), rgba(255,248,236,.02));
        }
        .poster-main{
            background:
                radial-gradient(circle at 35% 28%, rgba(231,165,58,.18), transparent 26%),
                linear-gradient(160deg, #6e2132 0%, #1f1816 60%, #10100f 100%);
        }
        .poster-main .film-line,
        .poster-mini .film-line{
            position:absolute;
            inset:0;
            background:
                linear-gradient(180deg, rgba(255,248,236,.10) 0 0) top/100% 2px no-repeat,
                linear-gradient(180deg, rgba(255,248,236,.10) 0 0) bottom/100% 2px no-repeat;
            opacity:.45;
        }
        .poster-main .big-title{
            position:absolute;
            left:18px;
            bottom:18px;
            right:18px;
            z-index:1;
            color:#fff9ef;
        }
        .poster-main .big-title strong{
            display:block;
            font-size:1.45rem;
            line-height:1.2;
            margin-bottom:8px;
        }
        .poster-main .big-title span{
            display:block;
            color:rgba(255,247,234,.78);
            line-height:1.7;
            font-size:.95rem;
        }
        .poster-mini-grid{
            display:grid;
            grid-template-rows:repeat(2,1fr);
            gap:14px;
        }
        .poster-mini{
            padding:16px;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            background:
                radial-gradient(circle at 75% 10%, rgba(43,179,163,.14), transparent 24%),
                linear-gradient(160deg, #2b1d1a 0%, #181311 58%, #11100f 100%);
        }
        .mini-top{
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:10px;
            position:relative;
            z-index:1;
        }
        .mini-top .ticket{
            font-size:.8rem;
            color:var(--muted);
            letter-spacing:.12em;
        }
        .mini-top .index{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            width:34px;
            height:34px;
            border-radius:12px;
            background:rgba(231,165,58,.14);
            border:1px solid rgba(231,165,58,.28);
            color:#fff4dd;
            font-weight:700;
        }
        .mini-bottom{
            position:relative;
            z-index:1;
        }
        .mini-bottom strong{
            display:block;
            font-size:1.02rem;
            margin-bottom:6px;
        }
        .mini-bottom span{
            color:var(--muted);
            font-size:.88rem;
            line-height:1.6;
            display:block;
        }
        .hero-ribbon{
            position:relative;
            z-index:2;
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:12px;
        }
        .ribbon-item{
            padding:14px 16px;
            border-radius:22px;
            background:rgba(17,16,15,.64);
            border:1px solid rgba(255,248,236,.08);
            color:var(--text);
            backdrop-filter:blur(10px);
        }
        .ribbon-item .label{
            display:block;
            color:var(--muted);
            font-size:.82rem;
            margin-bottom:6px;
            letter-spacing:.08em;
        }
        .ribbon-item strong{
            display:block;
            font-size:1rem;
            line-height:1.55;
        }
        .section{
            padding:var(--section-gap) 0;
            position:relative;
        }
        .section-head{
            margin-bottom:28px;
            display:flex;
            justify-content:space-between;
            align-items:end;
            gap:20px;
        }
        .section-head .left{
            max-width:760px;
        }
        .section-kicker{
            display:inline-flex;
            align-items:center;
            gap:10px;
            margin-bottom:14px;
            color:var(--accent-2);
            font-size:.92rem;
            font-weight:700;
            letter-spacing:.08em;
            text-transform:none;
        }
        .section-kicker::before{
            content:"";
            width:30px;
            height:1px;
            background:linear-gradient(90deg, transparent, var(--accent-2));
        }
        .section-title{
            margin:0 0 10px;
            font-size:clamp(1.8rem, 3vw, 3rem);
            line-height:1.16;
            letter-spacing:-.02em;
            color:#fff8ef;
            font-weight:800;
        }
        .section-desc{
            margin:0;
            color:var(--muted);
            line-height:1.9;
            font-size:clamp(1rem,1.2vw,1.08rem);
        }
        .section-actions{
            display:flex;
            align-items:center;
            gap:10px;
            flex-wrap:wrap;
        }
        .ticket-card{
            position:relative;
            padding:24px;
            border-radius:26px;
            background:linear-gradient(180deg, rgba(255,248,236,.07), rgba(255,248,236,.03));
            border:1px solid rgba(255,248,236,.10);
            box-shadow:var(--shadow-soft);
            overflow:hidden;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease), background .22s var(--ease);
        }
        .ticket-card::before,
        .ticket-card::after{
            content:"";
            position:absolute;
            top:18px;
            width:18px;
            height:18px;
            border-radius:50%;
            background:var(--bg);
            box-shadow:0 0 0 1px rgba(255,248,236,.08) inset;
        }
        .ticket-card::before{left:-9px}
        .ticket-card::after{right:-9px}
        .ticket-card:hover{
            transform:translateY(-5px);
            border-color:rgba(231,165,58,.24);
            box-shadow:0 24px 56px rgba(0,0,0,.30);
            background:linear-gradient(180deg, rgba(255,248,236,.09), rgba(255,248,236,.04));
        }
        .ticket-card h3,
        .ticket-card h4{
            margin:0 0 10px;
            line-height:1.24;
            font-weight:750;
            color:#fff7ee;
        }
        .ticket-card p{
            margin:0;
            color:var(--muted);
            line-height:1.85;
            font-size:1rem;
        }
        .problem-grid{
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:18px;
            align-items:stretch;
        }
        .problem-side{
            display:grid;
            gap:18px;
        }
        .problem-side .lead-box{
            padding:28px;
            border-radius:30px;
            background:
                radial-gradient(circle at 20% 20%, rgba(231,165,58,.16), transparent 20%),
                linear-gradient(160deg, rgba(43,26,20,.96), rgba(18,14,12,.96));
            border:1px solid rgba(255,248,236,.09);
            box-shadow:var(--shadow);
        }
        .problem-side .lead-box h3{
            margin:0 0 12px;
            font-size:clamp(1.4rem, 2vw, 1.9rem);
        }
        .problem-side .lead-box p{
            margin:0;
            color:var(--muted);
            line-height:1.9;
        }
        .problem-wall{
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:14px;
            align-items:end;
        }
        .problem-chip{
            padding:18px 16px;
            min-height:180px;
            border-radius:26px;
            background:linear-gradient(180deg, rgba(255,248,236,.08), rgba(255,248,236,.03));
            border:1px solid rgba(255,248,236,.10);
            position:relative;
            overflow:hidden;
        }
        .problem-chip::before{
            content:"";
            position:absolute;
            inset:auto 18px 16px 18px;
            border-top:1px dashed rgba(255,248,236,.16);
            opacity:.85;
        }
        .problem-chip .chip-icon{
            width:44px;
            height:44px;
            border-radius:16px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            margin-bottom:14px;
            background:rgba(231,165,58,.12);
            border:1px solid rgba(231,165,58,.22);
            color:var(--accent-2);
            font-size:1.2rem;
        }
        .problem-chip strong{
            display:block;
            font-size:1.08rem;
            margin-bottom:8px;
        }
        .problem-chip span{
            color:var(--muted);
            line-height:1.8;
            font-size:.98rem;
            display:block;
        }
        .solution-grid{
            display:grid;
            grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
            gap:22px;
            align-items:start;
        }
        .timeline{
            display:grid;
            gap:14px;
            position:relative;
        }
        .timeline::before{
            content:"";
            position:absolute;
            left:18px;
            top:8px;
            bottom:8px;
            width:1px;
            background:linear-gradient(180deg, rgba(231,165,58,.45), rgba(255,248,236,.08));
        }
        .step{
            position:relative;
            padding-left:52px;
        }
        .step::before{
            content:"";
            position:absolute;
            left:10px;
            top:10px;
            width:17px;
            height:17px;
            border-radius:50%;
            background:linear-gradient(180deg, var(--accent-2), #c67e1f);
            box-shadow:0 0 0 8px rgba(231,165,58,.12);
        }
        .step .step-card{
            padding:20px 22px;
            border-radius:24px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
        }
        .step .step-card strong{
            display:block;
            margin-bottom:7px;
            font-size:1.04rem;
        }
        .step .step-card p{
            margin:0;
            color:var(--muted);
            line-height:1.8;
            font-size:.98rem;
        }
        .search-shell{
            padding:26px;
            border-radius:30px;
            background:
                radial-gradient(circle at 84% 14%, rgba(43,179,163,.12), transparent 16%),
                linear-gradient(180deg, rgba(255,248,236,.07), rgba(255,248,236,.03));
            border:1px solid rgba(255,248,236,.10);
            box-shadow:var(--shadow-soft);
        }
        .search-shell .form-label{
            color:var(--muted);
            font-size:.93rem;
            margin-bottom:10px;
        }
        .search-shell .input-group{
            border-radius:20px;
            overflow:hidden;
            box-shadow:0 0 0 1px rgba(255,248,236,.08);
        }
        .search-shell .form-control{
            background:rgba(17,16,15,.64);
            border:none;
            color:var(--text);
            padding:15px 16px;
            min-height:58px;
        }
        .search-shell .form-control::placeholder{color:#8f7d69}
        .search-shell .form-control:focus{
            box-shadow:none;
            background:rgba(17,16,15,.82);
            color:#fff;
        }
        .search-shell .btn{
            min-width:140px;
        }
        .search-tags{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
            margin-top:16px;
        }
        .search-tags .tag{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:10px 13px;
            border-radius:999px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            color:var(--muted);
            font-size:.9rem;
        }
        .search-tags .tag i{
            width:8px;
            height:8px;
            border-radius:50%;
            background:var(--teal);
            box-shadow:0 0 0 5px rgba(43,179,163,.10);
            display:inline-block;
        }
        .results-grid{
            display:grid;
            grid-template-columns:repeat(4,minmax(0,1fr));
            gap:16px;
        }
        .result-card{
            padding:22px 20px;
            border-radius:26px;
            background:linear-gradient(180deg, rgba(255,248,236,.06), rgba(255,248,236,.03));
            border:1px solid rgba(255,248,236,.09);
            box-shadow:var(--shadow-soft);
            height:100%;
        }
        .result-card .result-num{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            width:54px;
            height:54px;
            border-radius:18px;
            margin-bottom:14px;
            background:rgba(142,37,56,.18);
            border:1px solid rgba(231,165,58,.16);
            color:#fff6ea;
            font-weight:800;
            font-size:1.06rem;
        }
        .result-card:nth-child(2) .result-num,
        .result-card:nth-child(4) .result-num{
            background:rgba(231,165,58,.15);
        }
        .result-card strong{
            display:block;
            margin-bottom:8px;
            font-size:1.04rem;
        }
        .result-card p{
            margin:0;
            color:var(--muted);
            line-height:1.82;
            font-size:.96rem;
        }
        .matrix-grid{
            display:grid;
            grid-template-columns:repeat(6,minmax(0,1fr));
            gap:14px;
        }
        .matrix-card{
            min-height:150px;
            padding:18px 16px;
            border-radius:24px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            box-shadow:var(--shadow-soft);
            display:flex;
            flex-direction:column;
            justify-content:space-between;
        }
        .matrix-card .icon{
            width:42px;
            height:42px;
            border-radius:14px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            background:rgba(231,165,58,.12);
            border:1px solid rgba(231,165,58,.22);
            color:var(--accent-2);
            font-size:1.05rem;
            margin-bottom:12px;
        }
        .matrix-card strong{
            display:block;
            font-size:1rem;
            line-height:1.45;
            margin-bottom:10px;
        }
        .matrix-card span{
            color:var(--muted);
            font-size:.88rem;
            line-height:1.7;
        }
        .feedback-track{
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:16px;
        }
        .feedback-card{
            padding:24px;
            border-radius:28px;
            background:
                linear-gradient(180deg, rgba(255,248,236,.07), rgba(255,248,236,.03));
            border:1px solid rgba(231,165,58,.14);
            box-shadow:var(--shadow-soft);
            position:relative;
            overflow:hidden;
        }
        .feedback-card::after{
            content:"";
            position:absolute;
            inset:0 auto auto 0;
            width:120px;
            height:120px;
            background:radial-gradient(circle, rgba(231,165,58,.08), transparent 70%);
            pointer-events:none;
        }
        .feedback-head{
            display:flex;
            gap:14px;
            align-items:center;
            margin-bottom:16px;
            position:relative;
            z-index:1;
        }
        .avatar{
            width:52px;
            height:52px;
            border-radius:18px;
            display:flex;
            align-items:center;
            justify-content:center;
            background:linear-gradient(145deg, rgba(142,37,56,.92), rgba(231,165,58,.18));
            border:1px solid rgba(255,248,236,.12);
            color:#fff;
            font-weight:800;
            letter-spacing:.03em;
            flex:0 0 auto;
            box-shadow:0 14px 26px rgba(0,0,0,.18);
        }
        .feedback-meta strong{
            display:block;
            font-size:1rem;
            margin-bottom:4px;
        }
        .feedback-meta span{
            display:inline-flex;
            padding:4px 10px;
            border-radius:999px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            color:var(--muted);
            font-size:.82rem;
        }
        .stars{
            color:var(--accent-2);
            letter-spacing:1px;
            font-size:.95rem;
            margin-left:auto;
            white-space:nowrap;
        }
        .feedback-card p{
            margin:0;
            color:var(--text);
            line-height:1.88;
            font-size:.98rem;
        }
        .list-shell{
            padding:28px;
            border-radius:32px;
            background:linear-gradient(180deg, rgba(255,248,236,.03), rgba(255,248,236,.02));
            border:1px solid rgba(255,248,236,.08);
            box-shadow:var(--shadow-soft);
        }
        .list-toolbar{
            display:flex;
            justify-content:space-between;
            align-items:end;
            gap:18px;
            flex-wrap:wrap;
            margin-bottom:22px;
        }
        .list-toolbar .mini-note{
            color:var(--muted);
            line-height:1.8;
            font-size:.96rem;
            max-width:620px;
            margin:0;
        }
        .list-filter{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
        }
        .filter-pill{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:10px 14px;
            border-radius:999px;
            background:rgba(255,248,236,.05);
            border:1px solid rgba(255,248,236,.10);
            color:var(--muted);
            font-size:.9rem;
        }
        .filter-pill.active{
            background:rgba(142,37,56,.18);
            border-color:rgba(231,165,58,.22);
            color:#fff6ea;
        }
        .news-grid{
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:16px;
        }
        .news-card{
            display:flex;
            flex-direction:column;
            gap:14px;
            padding:22px;
            border-radius:28px;
            background:var(--paper);
            color:var(--ink);
            border:1px solid rgba(34,27,23,.08);
            box-shadow:0 20px 60px rgba(35,20,12,.12);
            min-height:100%;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
        }
        .news-card:hover{
            transform:translateY(-5px);
            border-color:rgba(142,37,56,.24);
            box-shadow:0 24px 68px rgba(35,20,12,.18);
        }
        .news-top{
            display:flex;
            justify-content:space-between;
            gap:10px;
            align-items:flex-start;
        }
        .news-title{
            margin:0;
            font-size:1.14rem;
            line-height:1.45;
            font-weight:800;
            color:#231b17;
            display:-webkit-box;
            -webkit-line-clamp:2;
            -webkit-box-orient:vertical;
            overflow:hidden;
        }
        .news-badge{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            padding:7px 10px;
            border-radius:999px;
            background:rgba(142,37,56,.12);
            border:1px solid rgba(142,37,56,.16);
            color:#7c2333;
            font-size:.8rem;
            font-weight:700;
            flex:0 0 auto;
        }
        .news-desc{
            margin:0;
            color:#5f4d41;
            line-height:1.85;
            font-size:.98rem;
            display:-webkit-box;
            -webkit-line-clamp:3;
            -webkit-box-orient:vertical;
            overflow:hidden;
            min-height:5.55em;
        }
        .news-meta{
            margin-top:auto;
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:12px;
            flex-wrap:wrap;
            border-top:1px dashed rgba(34,27,23,.12);
            padding-top:14px;
            color:var(--soft-ink);
            font-size:.88rem;
        }
        .news-link{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color:#8E2538;
            font-weight:700;
        }
        .news-link:hover{
            color:#7A1F31;
        }
        .news-link .arrow{
            transition:transform .2s var(--ease);
        }
        .news-link:hover .arrow{transform:translateX(3px)}
        .empty-state{
            grid-column:1 / -1;
            text-align:center;
            padding:40px 26px;
            border-radius:28px;
            background:rgba(255,248,236,.06);
            border:1px solid rgba(255,248,236,.10);
            color:var(--text);
        }
        .empty-state .icon{
            width:64px;
            height:64px;
            border-radius:22px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            margin-bottom:18px;
            background:rgba(231,165,58,.14);
            border:1px solid rgba(231,165,58,.20);
            color:var(--accent-2);
            font-size:1.4rem;
        }
        .empty-state p{
            margin:0 0 18px;
            color:var(--muted);
            line-height:1.9;
        }
        .faq-shell{
            padding:28px;
            border-radius:32px;
            background:
                radial-gradient(circle at 84% 10%, rgba(231,165,58,.10), transparent 15%),
                linear-gradient(180deg, rgba(255,248,236,.04), rgba(255,248,236,.02));
            border:1px solid rgba(255,248,236,.09);
            box-shadow:var(--shadow-soft);
        }
        .accordion.faq{
            --bs-accordion-bg:transparent;
            --bs-accordion-border-color:transparent;
            --bs-accordion-btn-focus-box-shadow:none;
            --bs-accordion-active-bg:transparent;
            --bs-accordion-active-color:inherit;
            --bs-accordion-btn-color:var(--text);
            --bs-accordion-color:var(--text);
        }
        .accordion.faq .accordion-item{
            border:none;
            background:transparent;
            margin-bottom:14px;
            border-radius:24px;
            overflow:hidden;
        }
        .accordion.faq .accordion-button{
            background:rgba(255,248,236,.05);
            color:var(--text);
            border:1px solid rgba(255,248,236,.10);
            border-radius:24px !important;
            padding:18px 22px;
            font-size:1.02rem;
            font-weight:700;
            box-shadow:none;
        }
        .accordion.faq .accordion-button:not(.collapsed){
            color:#fff;
            background:rgba(142,37,56,.20);
            border-color:rgba(231,165,58,.22);
            box-shadow:none;
        }
        .accordion.faq .accordion-button:focus-visible{
            outline:none;
            box-shadow:0 0 0 4px rgba(231,165,58,.24);
        }
        .accordion.faq .accordion-button::after{
            filter:brightness(0) saturate(100%) invert(90%) sepia(11%) saturate(335%) hue-rotate(346deg) brightness(104%) contrast(93%);
            transition:transform .25s var(--ease);
        }
        .accordion.faq .accordion-button:not(.collapsed)::after{
            transform:rotate(-180deg);
        }
        .accordion.faq .accordion-body{
            padding:18px 22px 22px;
            color:var(--muted);
            line-height:1.88;
            background:rgba(17,16,15,.38);
            border:1px solid rgba(255,248,236,.08);
            border-top:none;
            border-radius:0 0 24px 24px;
        }
        .cta-band{
            position:relative;
            margin:0 0 18px;
            padding:34px;
            border-radius:34px;
            overflow:hidden;
            background:
                radial-gradient(circle at 15% 20%, rgba(231,165,58,.16), transparent 20%),
                radial-gradient(circle at 85% 22%, rgba(142,37,56,.22), transparent 20%),
                linear-gradient(135deg, #1b1412 0%, #0f0d0c 100%);
            border:1px solid rgba(255,248,236,.10);
            box-shadow:var(--shadow);
        }
        .cta-band::before{
            content:"";
            position:absolute;
            inset:-30% -12%;
            background:linear-gradient(110deg, transparent 30%, rgba(231,165,58,.12) 42%, transparent 54%);
            transform:skewX(-12deg);
            pointer-events:none;
        }
        .cta-band .cta-title{
            margin:0 0 10px;
            font-size:clamp(1.6rem, 2.8vw, 2.7rem);
            line-height:1.18;
            font-weight:800;
            color:#fff7ed;
        }
        .cta-band p{
            margin:0;
            color:var(--muted);
            line-height:1.9;
            max-width:760px;
            font-size:1rem;
        }
        .cta-band .actions{
            margin-top:20px;
            display:flex;
            flex-wrap:wrap;
            gap:12px;
        }
        .footer{
            padding:28px 0 34px;
            border-top:1px solid rgba(255,248,236,.08);
            background:
                linear-gradient(180deg, rgba(17,16,15,.4), rgba(10,9,8,.78));
        }
        .footer-inner{
            display:flex;
            justify-content:space-between;
            align-items:flex-start;
            gap:24px;
            flex-wrap:wrap;
        }
        .footer-brand{
            max-width:520px;
        }
        .footer-brand .brand{margin-bottom:14px}
        .footer-brand p{
            margin:0;
            color:var(--muted);
            line-height:1.9;
            font-size:.95rem;
        }
        .footer-links{
            display:grid;
            gap:10px;
            min-width:240px;
        }
        .footer-links a{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color:var(--text);
            font-size:.95rem;
            width:max-content;
        }
        .footer-links a:hover{
            color:var(--accent-2);
        }
        .footer-note{
            margin-top:18px;
            color:var(--muted-2);
            font-size:.9rem;
            line-height:1.8;
        }
        .divider-line{
            height:1px;
            background:linear-gradient(90deg, transparent, rgba(231,165,58,.32), rgba(255,248,236,.10), transparent);
            margin:18px 0 0;
        }
        .text-accent{color:var(--accent-2)}
        .text-soft{color:var(--muted)}
        .badge-soft{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:8px 12px;
            border-radius:999px;
            font-size:.82rem;
            font-weight:700;
            letter-spacing:.01em;
            border:1px solid transparent;
        }
        .badge-soft.badge-red{
            background:rgba(142,37,56,.16);
            color:#ffdede;
            border-color:rgba(142,37,56,.22);
        }
        .badge-soft.badge-amber{
            background:rgba(231,165,58,.15);
            color:#fff0ca;
            border-color:rgba(231,165,58,.24);
        }
        .badge-soft.badge-teal{
            background:rgba(43,179,163,.13);
            color:#d5fff8;
            border-color:rgba(43,179,163,.20);
        }
        .reveal{
            opacity:0;
            transform:translateY(16px);
            transition:opacity .7s var(--ease), transform .7s var(--ease);
        }
        .reveal.is-visible{
            opacity:1;
            transform:none;
        }
        .content-rail{
            padding:0 1px;
        }
        .content-rail h2,
        .content-rail h3,
        .content-rail h4{
            color:#fff8ef;
        }
        .content-rail p,
        .content-rail li{
            color:var(--muted);
            line-height:1.9;
            font-size:1rem;
        }
        .content-rail a{
            color:#f0b054;
            text-decoration:underline;
            text-decoration-color:rgba(231,165,58,.36);
            text-underline-offset:3px;
        }
        .content-rail a:hover{
            color:#ffd58a;
        }
        blockquote{
            margin:24px 0;
            padding:18px 20px;
            border-left:4px solid var(--accent);
            background:rgba(142,37,56,.10);
            border-radius:0 18px 18px 0;
            color:#fff4df;
        }
        figure{
            margin:24px 0;
        }
        figcaption{
            margin-top:10px;
            font-size:.9rem;
            color:var(--muted-2);
            text-align:center;
        }
        table{
            width:100%;
            border-collapse:separate;
            border-spacing:0;
            overflow:hidden;
            border-radius:20px;
        }
        table th, table td{
            padding:14px 16px;
            border-bottom:1px solid rgba(34,27,23,.10);
        }
        table th{
            background:rgba(231,165,58,.12);
            color:#241916;
            font-weight:700;
        }
        table td{
            background:rgba(255,248,236,.82);
            color:#403229;
        }
        .table-responsive{
            border-radius:20px;
            overflow:auto;
            box-shadow:0 20px 48px rgba(35,20,12,.10);
        }
        pre, code{
            border-radius:16px;
        }
        pre{
            padding:18px;
            background:rgba(255,248,236,.08);
            color:#fff2d8;
            overflow:auto;
            border:1px solid rgba(255,248,236,.08);
        }
        code{
            padding:.15rem .38rem;
            background:rgba(231,165,58,.12);
            color:#fff5dd;
        }
        @media (min-width: 1200px){
            .hero-stage{min-height:680px}
        }
        @media (max-width: 1199.98px){
            .hero-grid{grid-template-columns:1fr .92fr}
            .hero-stage{min-height:620px}
            .results-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
            .matrix-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
        }
        @media (max-width: 991.98px){
            .site-main{padding-top:84px}
            .hero-grid,
            .solution-grid,
            .problem-grid{
                grid-template-columns:1fr;
            }
            .hero-stage{order:2}
            .hero-copy{max-width:none}
            .hero-meta{grid-template-columns:repeat(3,minmax(0,1fr))}
            .feedback-track{grid-template-columns:1fr}
            .news-grid{grid-template-columns:1fr}
            .list-toolbar{align-items:flex-start}
            .drawer-body{padding-top:22px}
        }
        @media (max-width: 767.98px){
            .site-header{padding:12px 0}
            .brand strong{font-size:.96rem}
            .brand small{display:none}
            .btn-site{padding:11px 16px}
            .hero{padding:22px 0 56px}
            h1{font-size:clamp(2.1rem, 10vw, 3.3rem)}
            .hero-meta,
            .hero-ribbon,
            .results-grid,
            .matrix-grid{
                grid-template-columns:1fr;
            }
            .hero-stage{min-height:560px; transform:none}
            .poster-wall{grid-template-columns:1fr; min-height:auto}
            .poster-mini-grid{grid-template-columns:1fr 1fr; grid-template-rows:auto}
            .problem-wall{grid-template-columns:1fr}
            .section{padding:56px 0}
            .section-head{flex-direction:column; align-items:flex-start}
            .list-shell,
            .faq-shell,
            .search-shell,
            .cta-band{padding:22px}
            .drawer-link{
                font-size:1.45rem;
                padding:16px 18px;
            }
        }
        @media (max-width: 575.98px){
            .header-actions .btn-hero{display:none}
            .hero-actions .btn-site{flex:1 1 100%}
            .hero-copy,
            .section-desc,
            .section-title,
            .hero-pills li,
            .ribbon-item strong,
            .ribbon-item .label{
                text-wrap:pretty;
            }
            .hero-stage{min-height:520px}
            .poster-mini-grid{grid-template-columns:1fr}
            .footer-inner{flex-direction:column}
            .footer-links{min-width:auto}
            .search-shell .input-group{
                display:flex;
                flex-direction:column;
                box-shadow:none;
            }
            .search-shell .form-control{
                border-radius:18px;
                margin-bottom:10px;
                box-shadow:0 0 0 1px rgba(255,248,236,.08);
            }
            .search-shell .btn{
                width:100%;
                border-radius:18px;
            }
        }

/* roulang page: article */
:root{
            --bg:#11100F;
            --bg-2:#181411;
            --panel:#221b17;
            --panel-2:#2b211c;
            --paper:#FFF8EC;
            --paper-2:#f6ecdc;
            --text:#FFF7EA;
            --muted:#D8CBB9;
            --muted-2:#9f8c7a;
            --ink:#221B17;
            --soft-ink:#6E5B4F;
            --accent:#8E2538;
            --accent-2:#E7A53A;
            --teal:#2BB3A3;
            --line:rgba(255,248,236,.12);
            --line-2:rgba(255,248,236,.08);
            --shadow:0 28px 80px rgba(0,0,0,.42);
            --shadow-soft:0 18px 44px rgba(16, 9, 6, .18);
            --radius-xl:34px;
            --radius-lg:24px;
            --radius-md:18px;
            --radius-sm:14px;
            --container:1232px;
            --section-gap:clamp(56px,7vw,110px);
            --ease:cubic-bezier(.2,.7,.1,1);
        }

        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
            color:var(--text);
            background:
                radial-gradient(circle at 15% 15%, rgba(231,165,58,.09), transparent 25%),
                radial-gradient(circle at 85% 8%, rgba(142,37,56,.16), transparent 22%),
                radial-gradient(circle at 70% 85%, rgba(43,179,163,.06), transparent 25%),
                linear-gradient(180deg, #171310 0%, #11100F 34%, #0F0D0C 100%);
            min-height:100vh;
            overflow-x:hidden;
        }
        body::before{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            background:
                linear-gradient(90deg, rgba(255,248,236,.03) 1px, transparent 1px),
                linear-gradient(180deg, rgba(255,248,236,.025) 1px, transparent 1px);
            background-size:120px 120px;
            opacity:.14;
            mask-image:linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.12));
        }
        body::after{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            background:
                radial-gradient(circle at 50% 0%, rgba(231,165,58,.10), transparent 22%),
                radial-gradient(circle at 50% 100%, rgba(142,37,56,.08), transparent 20%);
            opacity:.45;
        }
        img,svg{max-width:100%;display:block}
        a{
            color:inherit;
            text-decoration:none;
            transition:color .22s var(--ease), transform .22s var(--ease), opacity .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease);
        }
        a:hover{color:inherit}
        button,input,textarea,select{font:inherit}
        ::selection{background:rgba(231,165,58,.35);color:var(--text)}
        .container,.container-lg,.container-xl,.container-xxl{
            max-width:var(--container);
            position:relative;
            z-index:1;
        }
        .site-main{
            position:relative;
            z-index:1;
            padding-top:92px;
        }

        .site-header{
            position:fixed;
            inset:0 0 auto 0;
            z-index:1035;
            padding:16px 0;
            transition:background .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease), padding .25s var(--ease), backdrop-filter .25s var(--ease);
            background:linear-gradient(180deg, rgba(17,16,15,.64), rgba(17,16,15,.12));
            border-bottom:1px solid transparent;
        }
        .site-header.is-scrolled{
            background:rgba(17,16,15,.92);
            backdrop-filter:blur(16px);
            border-bottom:1px solid rgba(255,248,236,.08);
            box-shadow:0 12px 40px rgba(0,0,0,.28);
            padding:10px 0;
        }
        .brand{
            display:inline-flex;
            align-items:center;
            gap:12px;
            font-weight:800;
            font-size:1.02rem;
            letter-spacing:.01em;
            color:var(--text);
        }
        .brand:hover{transform:translateY(-1px)}
        .brand-mark{
            width:38px;
            height:38px;
            border-radius:13px;
            position:relative;
            flex:0 0 auto;
            background:linear-gradient(145deg, rgba(142,37,56,.95), rgba(72,21,31,.92));
            border:1px solid rgba(231,165,58,.28);
            box-shadow:0 14px 30px rgba(0,0,0,.28), 0 0 0 1px rgba(255,248,236,.05) inset;
            overflow:hidden;
        }
        .brand-mark::before,.brand-mark::after{
            content:"";
            position:absolute;
            inset:7px 9px;
            border:1px solid rgba(255,248,236,.22);
            border-radius:10px;
        }
        .brand-mark::after{
            inset:11px 13px;
            border-radius:8px;
            border-color:rgba(231,165,58,.42);
        }
        .brand-mark i{
            position:absolute;
            inset:0;
            margin:auto;
            width:8px;
            height:18px;
            background:rgba(255,248,236,.9);
            border-radius:999px;
            box-shadow:-10px 0 0 rgba(255,248,236,.32), 10px 0 0 rgba(255,248,236,.32);
            top:50%;
            transform:translateY(-50%);
        }
        .brand strong{
            display:block;
            font-size:1.02rem;
            line-height:1.1;
        }
        .brand small{
            display:block;
            color:var(--muted);
            font-size:.74rem;
            font-weight:500;
            margin-top:2px;
        }
        .header-actions{
            display:flex;
            align-items:center;
            gap:10px;
        }
        .btn-site{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:8px;
            border-radius:999px;
            padding:12px 18px;
            border:1px solid transparent;
            font-weight:700;
            letter-spacing:.01em;
            transition:transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease), opacity .22s var(--ease);
            user-select:none;
            white-space:nowrap;
        }
        .btn-site:hover{transform:translateY(-2px)}
        .btn-site:active{transform:translateY(1px)}
        .btn-site:focus-visible,
        .menu-toggle:focus-visible,
        .drawer-close:focus-visible,
        .article-content a:focus-visible{
            outline:3px solid rgba(231,165,58,.62);
            outline-offset:3px;
        }
        .btn-hero,.btn-primary-custom{
            background:
                linear-gradient(180deg, rgba(167,46,66,.98), rgba(126,31,49,.98));
            color:var(--text);
            border-color:rgba(231,165,58,.30);
            box-shadow:0 14px 32px rgba(142,37,56,.32), inset 0 1px 0 rgba(255,248,236,.16);
        }
        .btn-hero:hover,.btn-primary-custom:hover{
            color:var(--text);
            box-shadow:0 18px 42px rgba(142,37,56,.42), 0 0 0 4px rgba(231,165,58,.08);
            border-color:rgba(231,165,58,.52);
        }
        .btn-ghost{
            background:rgba(255,248,236,.05);
            color:var(--text);
            border-color:rgba(255,248,236,.16);
        }
        .btn-ghost:hover{
            background:rgba(255,248,236,.12);
            border-color:rgba(231,165,58,.40);
            color:var(--text);
            box-shadow:0 16px 34px rgba(0,0,0,.24);
        }
        .menu-toggle{
            width:48px;
            height:48px;
            border-radius:999px;
            border:1px solid rgba(255,248,236,.18);
            background:rgba(255,248,236,.07);
            color:var(--text);
            display:inline-flex;
            align-items:center;
            justify-content:center;
            transition:transform .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease);
        }
        .menu-toggle:hover{
            transform:translateY(-2px);
            background:rgba(231,165,58,.12);
            border-color:rgba(231,165,58,.38);
            box-shadow:0 12px 28px rgba(0,0,0,.24);
        }
        .menu-toggle:active{transform:translateY(1px)}
        .lines{
            width:20px;
            display:grid;
            gap:4px;
        }
        .lines span{
            display:block;
            height:2px;
            background:var(--text);
            border-radius:999px;
        }
        .lines span:nth-child(2){width:14px;margin-left:auto}

        .site-drawer{
            width:min(560px, 100vw)!important;
            color:var(--text);
            background:
                radial-gradient(circle at 20% 20%, rgba(231,165,58,.12), transparent 28%),
                radial-gradient(circle at 90% 15%, rgba(142,37,56,.22), transparent 32%),
                linear-gradient(145deg, #1c1612, #100f0e);
            border-left:1px solid rgba(255,248,236,.12);
            box-shadow:-30px 0 80px rgba(0,0,0,.45);
        }
        .offcanvas-backdrop.show{opacity:.72;background:#070605}
        .drawer-head{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            padding:28px 30px 18px;
            border-bottom:1px solid rgba(255,248,236,.10);
        }
        .drawer-close{
            width:44px;
            height:44px;
            border-radius:999px;
            border:1px solid rgba(255,248,236,.18);
            background:rgba(255,248,236,.06);
            color:var(--text);
            display:inline-flex;
            align-items:center;
            justify-content:center;
            font-size:28px;
            line-height:1;
            transition:.22s var(--ease);
        }
        .drawer-close:hover{
            background:rgba(142,37,56,.35);
            border-color:rgba(231,165,58,.32);
            transform:rotate(4deg);
        }
        .drawer-body{
            padding:30px;
            position:relative;
        }
        .drawer-body::before{
            content:"";
            position:absolute;
            top:16px;
            bottom:16px;
            left:38px;
            width:6px;
            border-radius:999px;
            background:repeating-linear-gradient(180deg, rgba(231,165,58,.35) 0 8px, transparent 8px 18px);
            opacity:.28;
        }
        .drawer-kicker{
            margin-left:28px;
            color:var(--accent-2);
            font-size:.86rem;
            font-weight:800;
            letter-spacing:.08em;
        }
        .drawer-nav{
            display:grid;
            gap:14px;
            margin:18px 0 28px;
            padding-left:28px;
        }
        .drawer-link{
            display:flex;
            align-items:center;
            gap:16px;
            padding:18px 20px;
            border:1px solid rgba(255,248,236,.10);
            border-radius:22px;
            background:rgba(255,248,236,.045);
            color:var(--text);
            font-size:1.34rem;
            font-weight:800;
            position:relative;
            overflow:hidden;
        }
        .drawer-link::before{
            content:"01";
            color:var(--accent-2);
            font-size:.82rem;
            letter-spacing:.08em;
            opacity:.9;
        }
        .drawer-link::after{
            content:"";
            position:absolute;
            inset:auto 18px 10px 70px;
            height:1px;
            background:linear-gradient(90deg, rgba(231,165,58,.7), transparent);
            transform:scaleX(0);
            transform-origin:left;
            transition:transform .26s var(--ease);
        }
        .drawer-link:hover,.drawer-link.active{
            background:rgba(142,37,56,.26);
            border-color:rgba(231,165,58,.32);
            transform:translateX(-4px);
        }
        .drawer-link:hover::after,.drawer-link.active::after{transform:scaleX(1)}
        .drawer-note{
            margin:0 0 0 28px;
            padding:18px 20px;
            border-radius:22px;
            background:rgba(255,248,236,.07);
            color:var(--muted);
            line-height:1.8;
            border:1px dashed rgba(231,165,58,.28);
        }

        .section{
            padding:var(--section-gap) 0;
        }
        .kicker{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color:var(--accent-2);
            font-size:.88rem;
            font-weight:800;
            letter-spacing:.06em;
            margin-bottom:14px;
        }
        .kicker::before{
            content:"";
            width:28px;
            height:2px;
            background:linear-gradient(90deg, var(--accent-2), transparent);
        }
        .badge-soft{
            display:inline-flex;
            align-items:center;
            gap:7px;
            border-radius:999px;
            padding:8px 12px;
            color:var(--ink);
            background:var(--accent-2);
            font-size:.82rem;
            line-height:1;
            font-weight:800;
        }
        .badge-teal{
            background:rgba(43,179,163,.15);
            color:#98efe5;
            border:1px solid rgba(43,179,163,.30);
        }
        .badge-dark{
            background:rgba(142,37,56,.14);
            color:#ffe6db;
            border:1px solid rgba(231,165,58,.20);
        }

        .article-hero{
            padding:54px 0 30px;
            position:relative;
        }
        .article-hero::before{
            content:"";
            position:absolute;
            left:0;
            right:0;
            top:-92px;
            height:440px;
            background:
                linear-gradient(110deg, rgba(231,165,58,.12), transparent 38%),
                radial-gradient(circle at 78% 25%, rgba(142,37,56,.28), transparent 32%);
            pointer-events:none;
            opacity:.88;
        }
        .breadcrumb-line{
            display:flex;
            flex-wrap:wrap;
            align-items:center;
            gap:10px;
            color:var(--muted);
            font-size:.92rem;
            margin-bottom:24px;
        }
        .breadcrumb-line a{
            color:var(--text);
            border-bottom:1px solid rgba(231,165,58,.35);
        }
        .breadcrumb-line a:hover{
            color:var(--accent-2);
            border-color:var(--accent-2);
        }
        .breadcrumb-line span.sep{
            width:6px;
            height:6px;
            border-radius:999px;
            background:rgba(231,165,58,.55);
        }
        .article-title-wrap{
            display:grid;
            grid-template-columns:minmax(0, 1.05fr) minmax(280px, .45fr);
            gap:32px;
            align-items:end;
        }
        .article-title-wrap h1{
            font-size:clamp(2.15rem, 5.1vw, 4.55rem);
            line-height:1.12;
            font-weight:850;
            letter-spacing:-.04em;
            margin:0;
            max-width:980px;
        }
        .article-summary{
            color:var(--muted);
            font-size:1.06rem;
            line-height:1.86;
            margin:22px 0 0;
            max-width:860px;
        }
        .article-meta{
            display:flex;
            flex-wrap:wrap;
            align-items:center;
            gap:10px;
            margin-top:24px;
        }
        .meta-pill{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:10px 13px;
            border-radius:999px;
            border:1px solid rgba(255,248,236,.12);
            background:rgba(255,248,236,.06);
            color:var(--muted);
            font-size:.9rem;
        }
        .title-ticket{
            position:relative;
            min-height:220px;
            border-radius:var(--radius-xl);
            border:1px solid rgba(255,248,236,.13);
            background:
                linear-gradient(140deg, rgba(255,248,236,.10), rgba(255,248,236,.03)),
                radial-gradient(circle at 25% 25%, rgba(231,165,58,.18), transparent 35%),
                radial-gradient(circle at 80% 70%, rgba(142,37,56,.28), transparent 36%);
            box-shadow:var(--shadow);
            overflow:hidden;
            padding:24px;
        }
        .title-ticket::before,.title-ticket::after{
            content:"";
            position:absolute;
            top:50%;
            width:38px;
            height:38px;
            border-radius:999px;
            background:var(--bg);
            transform:translateY(-50%);
            box-shadow:0 0 0 1px rgba(255,248,236,.08);
        }
        .title-ticket::before{left:-19px}
        .title-ticket::after{right:-19px}
        .ticket-strip{
            position:absolute;
            inset:18px auto 18px 22px;
            width:9px;
            border-radius:999px;
            background:repeating-linear-gradient(180deg, rgba(255,248,236,.46) 0 8px, transparent 8px 17px);
            opacity:.36;
        }
        .title-ticket-content{
            position:relative;
            padding-left:24px;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            height:100%;
            min-height:172px;
        }
        .ticket-label{
            color:var(--accent-2);
            font-weight:850;
            letter-spacing:.08em;
            font-size:.85rem;
        }
        .ticket-number{
            margin-top:24px;
            font-size:2.25rem;
            line-height:1;
            font-weight:900;
            color:rgba(255,248,236,.92);
        }
        .ticket-desc{
            color:var(--muted);
            line-height:1.7;
            margin:12px 0 0;
            font-size:.94rem;
        }

        .head-visual{
            margin-top:34px;
            border-radius:var(--radius-xl);
            min-height:280px;
            position:relative;
            overflow:hidden;
            border:1px solid rgba(255,248,236,.12);
            background:
                linear-gradient(115deg, rgba(17,16,15,.14), rgba(17,16,15,.88)),
                radial-gradient(circle at 15% 40%, rgba(231,165,58,.35), transparent 28%),
                radial-gradient(circle at 68% 50%, rgba(142,37,56,.34), transparent 32%),
                linear-gradient(135deg, #3a1d18, #17120f 56%, #0c0b0a);
            box-shadow:var(--shadow);
        }
        .head-visual::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                repeating-linear-gradient(90deg, rgba(255,248,236,.11) 0 2px, transparent 2px 38px),
                linear-gradient(90deg, rgba(231,165,58,.18), transparent 45%, rgba(142,37,56,.16));
            opacity:.22;
        }
        .head-visual::after{
            content:"";
            position:absolute;
            inset:26px;
            border:1px dashed rgba(255,248,236,.18);
            border-radius:26px;
            pointer-events:none;
        }
        .poster-wall{
            position:absolute;
            right:34px;
            top:34px;
            bottom:34px;
            width:min(46%, 470px);
            display:grid;
            grid-template-columns:repeat(3, 1fr);
            gap:13px;
            transform:perspective(900px) rotateY(-8deg);
            transform-origin:right center;
        }
        .poster-wall span{
            border-radius:18px;
            background:
                linear-gradient(145deg, rgba(255,248,236,.16), rgba(255,248,236,.04)),
                radial-gradient(circle at 30% 25%, rgba(231,165,58,.24), transparent 35%),
                radial-gradient(circle at 70% 75%, rgba(142,37,56,.26), transparent 38%);
            border:1px solid rgba(255,248,236,.13);
            box-shadow:0 18px 34px rgba(0,0,0,.22);
        }
        .visual-copy{
            position:absolute;
            left:34px;
            bottom:32px;
            width:min(500px, calc(100% - 68px));
        }
        .visual-copy strong{
            font-size:1.45rem;
            line-height:1.25;
            display:block;
            margin-bottom:10px;
        }
        .visual-copy p{
            margin:0;
            color:var(--muted);
            line-height:1.8;
        }

        .article-layout{
            padding:34px 0 var(--section-gap);
        }
        .article-grid{
            display:grid;
            grid-template-columns:minmax(0, 850px) minmax(260px, 1fr);
            gap:34px;
            align-items:start;
        }
        .article-paper{
            background:var(--paper);
            color:var(--ink);
            border-radius:var(--radius-xl);
            box-shadow:var(--shadow-soft);
            border:1px solid rgba(255,248,236,.55);
            overflow:hidden;
            position:relative;
        }
        .article-paper::before{
            content:"";
            position:absolute;
            inset:0 auto 0 0;
            width:12px;
            background:
                radial-gradient(circle at 50% 18px, var(--bg) 0 5px, transparent 6px) 0 0/12px 34px repeat-y;
            opacity:.22;
            pointer-events:none;
        }
        .pull-quote{
            padding:28px 34px 24px 44px;
            background:
                linear-gradient(90deg, rgba(142,37,56,.12), rgba(231,165,58,.10)),
                var(--paper-2);
            border-bottom:1px solid rgba(34,27,23,.08);
            position:relative;
        }
        .pull-quote::before{
            content:"";
            position:absolute;
            left:24px;
            top:28px;
            bottom:24px;
            width:5px;
            border-radius:999px;
            background:linear-gradient(180deg, var(--accent), var(--accent-2));
        }
        .pull-quote p{
            margin:0;
            color:var(--soft-ink);
            font-size:1.03rem;
            line-height:1.85;
            font-weight:600;
        }
        .article-content{
            padding:clamp(28px, 4vw, 48px);
            font-size:17px;
            line-height:1.9;
        }
        .article-content h2{
            margin:2.4em 0 .75em;
            color:var(--ink);
            font-size:clamp(1.55rem, 2.5vw, 2.15rem);
            line-height:1.28;
            font-weight:850;
            letter-spacing:-.02em;
            padding-left:16px;
            border-left:5px solid var(--accent);
        }
        .article-content h2:first-child{margin-top:0}
        .article-content h3{
            margin:2em 0 .7em;
            color:var(--ink);
            font-size:1.35rem;
            line-height:1.38;
            font-weight:820;
        }
        .article-content h4{
            margin:1.7em 0 .6em;
            font-size:1.12rem;
            font-weight:800;
            color:var(--ink);
        }
        .article-content p{
            margin:0 0 1.1em;
            color:var(--soft-ink);
        }
        .article-content strong{color:var(--ink);font-weight:850}
        .article-content a{
            color:var(--accent);
            font-weight:750;
            background:linear-gradient(180deg, transparent 66%, rgba(231,165,58,.24) 0);
            border-radius:4px;
        }
        .article-content a:hover{
            color:#6f1c2d;
            background:linear-gradient(180deg, transparent 40%, rgba(231,165,58,.42) 0);
        }
        .article-content ul,.article-content ol{
            margin:0 0 1.35em;
            padding-left:1.35em;
            color:var(--soft-ink);
        }
        .article-content li{margin:.42em 0}
        .article-content li::marker{color:var(--accent);font-weight:800}
        .article-content blockquote{
            margin:1.8em 0;
            padding:22px 24px 22px 26px;
            border-left:6px solid var(--accent);
            border-radius:0 22px 22px 0;
            background:linear-gradient(90deg, rgba(142,37,56,.12), rgba(231,165,58,.10));
            color:var(--ink);
            font-weight:650;
        }
        .article-content blockquote p{
            margin:0;
            color:var(--ink);
        }
        .article-content img{
            border-radius:22px;
            margin:1.8em auto;
            box-shadow:0 18px 44px rgba(35,20,12,.16);
        }
        .article-content figure{margin:2em 0}
        .article-content figcaption{
            margin-top:10px;
            color:#8a7567;
            font-size:.9rem;
            text-align:center;
        }
        .article-content table{
            width:100%;
            border-collapse:separate;
            border-spacing:0;
            overflow:hidden;
            border:1px solid rgba(34,27,23,.12);
            border-radius:18px;
            margin:1.8em 0;
            color:var(--soft-ink);
            background:#fffdf7;
        }
        .article-content th,.article-content td{
            padding:14px 16px;
            border-bottom:1px solid rgba(34,27,23,.10);
            vertical-align:top;
        }
        .article-content th{
            background:rgba(142,37,56,.10);
            color:var(--ink);
            font-weight:850;
        }
        .article-content tr:last-child td{border-bottom:0}
        .article-content code{
            color:#7d2031;
            background:rgba(142,37,56,.10);
            border:1px solid rgba(142,37,56,.14);
            border-radius:8px;
            padding:.12em .38em;
            font-size:.92em;
        }
        .article-content pre{
            background:#1c1612;
            color:var(--text);
            border-radius:22px;
            padding:20px;
            overflow:auto;
            border:1px solid rgba(231,165,58,.16);
        }
        .article-content pre code{
           background:transparent;
            border:0;
            padding:0;
            color:inherit;
        }
        .article-empty{
            text-align:center;
            padding:70px 28px;
        }
        .empty-icon{
            width:82px;
            height:82px;
            margin:0 auto 22px;
            border-radius:28px;
            background:
                radial-gradient(circle at 35% 30%, rgba(231,165,58,.30), transparent 40%),
                linear-gradient(145deg, rgba(142,37,56,.18), rgba(231,165,58,.12));
            border:1px dashed rgba(142,37,56,.28);
            position:relative;
        }
        .empty-icon::before{
            content:"";
            position:absolute;
            inset:22px 18px;
            border-radius:10px;
            border:2px solid rgba(142,37,56,.55);
        }
        .article-empty h2{
            color:var(--ink);
            margin:0 0 12px;
            font-size:1.85rem;
            font-weight:850;
        }
        .article-empty p{
            color:var(--soft-ink);
            margin:0 auto 24px;
            max-width:520px;
            line-height:1.8;
        }

        .side-stack{
            position:sticky;
            top:104px;
            display:grid;
            gap:18px;
        }
        .side-card{
            border-radius:var(--radius-lg);
            border:1px solid rgba(255,248,236,.12);
            background:
                linear-gradient(160deg, rgba(255,248,236,.09), rgba(255,248,236,.04)),
                rgba(34,27,23,.80);
            box-shadow:0 20px 54px rgba(0,0,0,.26);
            padding:22px;
            overflow:hidden;
        }
        .side-card h2,.side-card h3{
            margin:0 0 14px;
            font-size:1.08rem;
            font-weight:850;
        }
        .side-card p{
            margin:0;
            color:var(--muted);
            line-height:1.75;
            font-size:.94rem;
        }
        .toc-list{
            display:grid;
            gap:10px;
            margin:14px 0 0;
        }
        .toc-list a{
            display:block;
            color:var(--muted);
            padding:10px 12px;
            border-radius:14px;
            border:1px solid rgba(255,248,236,.08);
            background:rgba(255,248,236,.035);
            font-size:.92rem;
            line-height:1.45;
        }
        .toc-list a:hover{
            color:var(--text);
            background:rgba(142,37,56,.22);
            border-color:rgba(231,165,58,.24);
            transform:translateX(3px);
        }
        .progress-card{
            padding:0;
        }
        .progress-head{
            padding:20px 22px 14px;
        }
        .reading-progress{
            height:9px;
            border-radius:999px;
            background:rgba(255,248,236,.08);
            overflow:hidden;
            margin:0 22px 22px;
        }
        .reading-progress span{
            display:block;
            width:0%;
            height:100%;
            border-radius:999px;
            background:linear-gradient(90deg, var(--accent), var(--accent-2));
            transition:width .12s linear;
        }
        .info-lines{
            display:grid;
            gap:10px;
            margin-top:14px;
        }
        .info-line{
            display:flex;
            justify-content:space-between;
            gap:12px;
            color:var(--muted);
            font-size:.92rem;
            padding-top:10px;
            border-top:1px dashed rgba(255,248,236,.12);
        }
        .info-line strong{color:var(--text);font-weight:750;text-align:right}

        .related-section{
            padding:0 0 var(--section-gap);
        }
        .section-head{
            display:flex;
            justify-content:space-between;
            align-items:end;
            gap:24px;
            margin-bottom:24px;
        }
        .section-head h2{
            margin:0;
            font-size:clamp(1.8rem, 3.2vw, 2.7rem);
            line-height:1.22;
            font-weight:850;
            letter-spacing:-.03em;
        }
        .section-head p{
            margin:10px 0 0;
            max-width:660px;
            color:var(--muted);
            line-height:1.8;
        }
        .related-grid{
            display:grid;
            grid-template-columns:repeat(3, minmax(0, 1fr));
            gap:18px;
        }
        .news-card{
            position:relative;
            min-height:260px;
            border-radius:var(--radius-lg);
            padding:24px;
            background:
                linear-gradient(160deg, rgba(255,248,236,.10), rgba(255,248,236,.04)),
                rgba(34,27,23,.78);
            border:1px solid rgba(255,248,236,.12);
            box-shadow:0 22px 58px rgba(0,0,0,.28);
            overflow:hidden;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            transition:transform .24s var(--ease), box-shadow .24s var(--ease), border-color .24s var(--ease);
        }
        .news-card::before{
            content:"";
            position:absolute;
            inset:0 auto 0 0;
            width:8px;
            background:radial-gradient(circle at 50% 16px, var(--bg) 0 5px, transparent 6px) 0 0/8px 28px repeat-y;
            opacity:.45;
        }
        .news-card:hover{
            transform:translateY(-6px);
            border-color:rgba(231,165,58,.34);
            box-shadow:0 30px 78px rgba(0,0,0,.38);
        }
        .news-card h3{
            margin:16px 0 12px;
            font-size:1.25rem;
            line-height:1.38;
            font-weight:850;
        }
        .news-card p{
            margin:0;
            color:var(--muted);
            line-height:1.76;
            font-size:.96rem;
            display:-webkit-box;
            -webkit-line-clamp:3;
            -webkit-box-orient:vertical;
            overflow:hidden;
        }
        .news-meta{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
            margin-top:24px;
            color:var(--muted-2);
            font-size:.88rem;
        }
        .read-link{
            color:var(--accent-2);
            font-weight:800;
        }
        .read-link:hover{
            color:#ffd47a;
            transform:translateX(2px);
        }

        .faq-section{
            padding:0 0 var(--section-gap);
        }
        .accordion{
            display:grid;
            gap:14px;
        }
        .accordion-item{
            color:var(--text);
            background:rgba(255,248,236,.055);
            border:1px solid rgba(255,248,236,.12)!important;
            border-radius:22px!important;
            overflow:hidden;
            box-shadow:none;
        }
        .accordion-button{
            background:transparent;
            color:var(--text);
            padding:20px 22px;
            font-weight:850;
            font-size:1.05rem;
            box-shadow:none!important;
            border:0;
        }
        .accordion-button::after{
            width:1.1rem;
            height:1.1rem;
            filter:invert(91%) sepia(24%) saturate(680%) hue-rotate(343deg) brightness(99%);
        }
        .accordion-button:not(.collapsed){
            color:var(--text);
            background:linear-gradient(90deg, rgba(142,37,56,.24), rgba(231,165,58,.08));
        }
        .accordion-button:focus{
            box-shadow:none;
            border-color:transparent;
        }
        .accordion-button:focus-visible{
            outline:3px solid rgba(231,165,58,.58);
            outline-offset:-3px;
        }
        .accordion-body{
            color:var(--muted);
            padding:0 22px 22px 22px;
            line-height:1.8;
            border-left:5px solid rgba(231,165,58,.55);
            margin-left:22px;
            margin-bottom:18px;
        }

        .article-cta{
            padding:0 0 var(--section-gap);
        }
        .cta-panel{
            position:relative;
            overflow:hidden;
            border-radius:var(--radius-xl);
            padding:clamp(28px, 5vw, 54px);
            background:
                linear-gradient(112deg, rgba(142,37,56,.58), rgba(24,20,17,.92) 52%, rgba(231,165,58,.16)),
                radial-gradient(circle at 18% 40%, rgba(231,165,58,.18), transparent 35%),
                #17120f;
            border:1px solid rgba(255,248,236,.13);
            box-shadow:var(--shadow);
        }
        .cta-panel::before{
            content:"";
            position:absolute;
            left:-12%;
            top:18%;
            width:72%;
            height:46%;
            background:linear-gradient(90deg, rgba(231,165,58,.25), transparent);
            transform:skewY(-10deg);
            opacity:.34;
            filter:blur(2px);
        }
        .cta-panel::after{
            content:"";
            position:absolute;
            inset:22px;
            border:1px dashed rgba(255,248,236,.18);
            border-radius:26px;
            pointer-events:none;
        }
        .cta-content{
            position:relative;
            z-index:1;
            display:flex;
            justify-content:space-between;
            gap:24px;
            align-items:center;
        }
        .cta-content h2{
            margin:0;
            font-size:clamp(1.75rem, 3vw, 2.55rem);
            font-weight:850;
            line-height:1.24;
        }
        .cta-content p{
            color:var(--muted);
            margin:12px 0 0;
            line-height:1.8;
            max-width:740px;
        }
        .cta-actions{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            flex:0 0 auto;
        }

        .site-footer{
            position:relative;
            z-index:1;
            background:
                radial-gradient(circle at 20% 10%, rgba(142,37,56,.18), transparent 28%),
                linear-gradient(180deg, rgba(16,14,13,.86), #0b0a09);
            border-top:1px solid rgba(255,248,236,.10);
            padding:56px 0 24px;
        }
        .footer-inner{
            display:grid;
            grid-template-columns:minmax(0, 1.3fr) .7fr .7fr;
            gap:34px;
            padding-bottom:34px;
        }
        .footer-brand p{
            color:var(--muted);
            line-height:1.85;
            margin:16px 0 18px;
            max-width:620px;
        }
        .footer-domain{
            display:inline-flex;
            border-radius:999px;
            padding:9px 13px;
            background:rgba(255,248,236,.06);
            border:1px solid rgba(255,248,236,.12);
            color:var(--muted);
            font-size:.92rem;
        }
        .footer-links{
            display:grid;
            align-content:start;
            gap:10px;
        }
        .footer-links h3{
            font-size:1rem;
            margin:0 0 8px;
            color:var(--text);
            font-weight:850;
        }
        .footer-links a{
            color:var(--muted);
            line-height:1.5;
        }
        .footer-links a:hover{
            color:var(--accent-2);
            transform:translateX(3px);
        }
        .footer-bottom{
            display:flex;
            justify-content:space-between;
            gap:18px;
            flex-wrap:wrap;
            padding-top:20px;
            border-top:1px solid rgba(255,248,236,.10);
            color:var(--muted-2);
            font-size:.9rem;
        }

        .table-responsive{
            border-radius:18px;
        }

        @media (max-width: 991.98px){
            .site-main{padding-top:84px}
            .article-title-wrap{
                grid-template-columns:1fr;
                align-items:start;
            }
            .title-ticket{min-height:190px}
            .article-grid{
                grid-template-columns:1fr;
            }
            .side-stack{
                position:static;
                grid-template-columns:1fr 1fr;
            }
            .poster-wall{
                opacity:.38;
                width:62%;
                right:22px;
            }
            .related-grid{
                grid-template-columns:1fr 1fr;
            }
            .cta-content{
                flex-direction:column;
                align-items:flex-start;
            }
            .footer-inner{
                grid-template-columns:1fr 1fr;
            }
            .footer-brand{
                grid-column:1 / -1;
            }
        }
        @media (max-width: 767.98px){
            .site-header{padding:10px 0}
            .brand strong{font-size:.92rem}
            .brand small{display:none}
            .brand-mark{width:36px;height:36px}
            .menu-toggle{width:44px;height:44px}
            .article-hero{padding-top:34px}
            .article-summary{font-size:1rem}
            .head-visual{min-height:250px;border-radius:26px}
            .poster-wall{display:none}
            .visual-copy{
                left:24px;
                bottom:24px;
                width:calc(100% - 48px);
            }
            .visual-copy strong{font-size:1.22rem}
            .article-content{
                padding:28px 24px 32px;
                font-size:16px;
            }
            .pull-quote{padding:24px 24px 22px 38px}
            .article-paper::before{width:8px}
            .side-stack{
                grid-template-columns:1fr;
            }
            .section-head{
                display:block;
            }
            .related-grid{
                grid-template-columns:1fr;
            }
            .drawer-head,.drawer-body{padding-left:22px;padding-right:22px}
            .drawer-body::before{left:28px}
            .drawer-nav,.drawer-kicker,.drawer-note{margin-left:22px}
            .drawer-nav{padding-left:22px}
            .drawer-link{font-size:1.16rem}
            .footer-inner{
                grid-template-columns:1fr;
            }
        }
        @media (max-width: 575.98px){
            .site-main{padding-top:72px}
            .article-title-wrap h1{font-size:2.05rem;letter-spacing:-.025em}
            .breadcrumb-line{font-size:.86rem}
            .meta-pill{width:100%;justify-content:center}
            .head-visual{min-height:230px}
            .article-layout{padding-top:22px}
            .article-content h2{font-size:1.45rem}
            .article-content table{
                display:block;
                overflow-x:auto;
                white-space:nowrap;
            }
            .btn-site{
                width:100%;
                padding:12px 16px;
            }
            .header-actions .btn-site{display:none!important}
            .cta-actions,.cta-actions .btn-site{width:100%}
            .footer-bottom{display:grid}
        }

/* 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}