/* roulang page: index */
:root {
            --ink: #18141e;
            --plum: #28212f;
            --plum-deep: #211a28;
            --coral: #ff665c;
            --coral-dark: #d94f49;
            --lime: #c9f36a;
            --cream: #fff8ec;
            --muted: #bdb3c7;
            --line: #40354b;
            --soft-line: rgba(255,248,236,.12);
            --radius: 14px;
            --shadow: 0 18px 42px rgba(9, 5, 15, .25);
            --max: 1220px;
        }
        * { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }
        body {
            color: var(--cream);
            background: var(--ink);
            font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Arial, sans-serif;
            line-height: 1.7;
            font-size: 15px;
            overflow-x: hidden;
        }
        a { color: inherit; text-decoration: none; }
        button, input { font: inherit; }
        button { border: 0; cursor: pointer; }
        img { max-width: 100%; display: block; }
        :focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
        .container { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; }
        .site-header {
            position: sticky; top: 0; z-index: 20;
            background: rgba(24,20,30,.96);
            border-bottom: 1px solid var(--soft-line);
        }
        .nav-wrap { min-height: 76px; display: flex; align-items: center; gap: 28px; }
        .brand { display: inline-flex; align-items: center; gap: 11px; min-width: 290px; }
        .brand-mark {
            width: 38px; height: 38px; display: grid; place-items: center;
            background: var(--coral); color: var(--ink); border-radius: 9px;
            font-weight: 900; letter-spacing: 0;
            box-shadow: 5px 5px 0 rgba(201,243,106,.7);
        }
        .brand-text { line-height: 1.25; font-weight: 800; color: var(--cream); }
        .brand-text small { display: block; color: var(--muted); font-size: 11px; font-weight: 500; margin-top: 3px; }
        .nav-menu { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex: 1; list-style: none; }
        .nav-menu a {
            position: relative; padding: 10px 12px; color: var(--muted);
            transition: color .2s ease, background .2s ease;
        }
        .nav-menu a:hover, .nav-menu a.active { color: var(--cream); }
        .nav-menu a.active::after {
            content: ""; position: absolute; left: 12px; right: 12px; bottom: 1px;
            height: 3px; background: var(--coral); border-radius: 2px;
        }
        .nav-entry { background: var(--coral); color: var(--ink) !important; border-radius: 8px; font-weight: 800; margin-left: 8px; }
        .nav-entry:hover { background: #ff8177; transform: translateY(-1px); }
        .menu-toggle { display: none; background: transparent; color: var(--cream); font-size: 25px; padding: 8px; }
        .hero {
            min-height: 640px; display: flex; align-items: center;
            padding: 88px 0 78px; position: relative; isolation: isolate;
        }
        .hero::before {
            content: ""; position: absolute; inset: 0; z-index: -2;
            background:
                linear-gradient(90deg, rgba(24,20,30,.98) 0%, rgba(24,20,30,.9) 43%, rgba(24,20,30,.38) 100%),
                repeating-linear-gradient(90deg, transparent 0 90px, rgba(201,243,106,.045) 91px 92px);
        }
        .hero::after {
            content: ""; position: absolute; z-index: -1; right: 0; top: 0; bottom: 0; width: 54%;
            background: linear-gradient(135deg, transparent 0 28%, rgba(255,102,92,.13) 28% 28.5%, transparent 28.5% 62%, rgba(201,243,106,.1) 62% 62.5%, transparent 62.5%),
                        repeating-linear-gradient(0deg, transparent 0 42px, rgba(255,248,236,.06) 43px 44px);
            clip-path: polygon(18% 0,100% 0,100% 100%,0 100%);
        }
        .hero-grid { display: grid; grid-template-columns: minmax(0, .93fr) minmax(420px, 1.07fr); gap: 64px; align-items: center; }
        .eyebrow, .section-kicker { color: var(--lime); font-size: 12px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
        .hero h1 { font-size: clamp(34px, 4.4vw, 64px); line-height: 1.12; letter-spacing: 0; margin: 19px 0 22px; max-width: 650px; }
        .hero h1 span { color: var(--coral); }
        .hero-copy { font-size: 18px; color: var(--muted); max-width: 570px; }
        .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
        .btn {
            display: inline-flex; justify-content: center; align-items: center; gap: 9px;
            min-height: 46px; padding: 0 20px; border-radius: 9px; font-weight: 800;
            transition: transform .2s, background .2s, border-color .2s, box-shadow .2s;
        }
        .btn:hover { transform: translateY(-2px); }
        .btn-primary { background: var(--coral); color: var(--ink); box-shadow: 0 8px 0 rgba(217,79,73,.22); }
        .btn-primary:hover { background: #ff8177; }
        .btn-secondary { background: var(--plum); border: 1px solid var(--line); color: var(--cream); }
        .btn-secondary:hover { border-color: var(--coral); background: #32283c; }
        .hero-note { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 25px; color: var(--muted); font-size: 13px; }
        .hero-note span::before { content: "•"; color: var(--lime); margin-right: 7px; }
        .arcade-panel {
            min-height: 390px; padding: 23px; position: relative; background: var(--plum);
            border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow);
            transform: rotate(1deg);
        }
        .arcade-panel::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 7px; background: var(--coral); border-radius: 18px 0 0 18px; }
        .screen {
            height: 225px; border: 8px solid #17131d; background: #302744; border-radius: 10px;
            padding: 18px; position: relative; overflow: hidden;
        }
        .screen::after {
            content: ""; position: absolute; inset: 0;
            background: repeating-linear-gradient(0deg, transparent 0 8px, rgba(255,248,236,.035) 9px 10px);
            pointer-events: none;
        }
        .screen-top { display: flex; justify-content: space-between; color: var(--lime); font-size: 12px; }
        .screen-title { font-size: 28px; line-height: 1.15; font-weight: 900; margin-top: 29px; max-width: 250px; }
        .screen-title b { color: var(--coral); }
        .screen-line { width: 72%; height: 5px; background: var(--lime); margin-top: 18px; }
        .panel-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
        .panel-tile { background: #33283d; border: 1px solid #4c3d57; padding: 14px; border-radius: 9px; }
        .panel-tile strong { display: block; color: var(--cream); font-size: 17px; }
        .panel-tile span { color: var(--muted); font-size: 12px; }
        .quick { background: var(--plum-deep); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
        .quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
        .quick-item { padding: 25px 20px; border-right: 1px solid var(--line); position: relative; transition: background .2s; }
        .quick-item:last-child { border-right: 0; }
        .quick-item:hover { background: var(--plum); }
        .quick-item::before { content: ""; display: block; width: 25px; height: 4px; background: var(--coral); margin-bottom: 12px; }
        .quick-item:nth-child(2)::before, .quick-item:nth-child(4)::before { background: var(--lime); }
        .quick-num { color: var(--muted); font-size: 12px; }
        .quick-item h3 { font-size: 16px; margin: 4px 0; }
        .quick-item p { color: var(--muted); font-size: 13px; }
        .section { padding: 100px 0; }
        .section.alt { background: var(--plum-deep); }
        .section-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 38px; }
        .section h2 { font-size: clamp(27px, 3vw, 42px); line-height: 1.2; margin-top: 10px; }
        .section-intro { color: var(--muted); max-width: 510px; }
        .theme-layout { display: grid; grid-template-columns: 1.45fr .85fr; gap: 18px; }
        .theme-main, .theme-side > article { background: var(--plum); border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; }
        .theme-main { min-height: 320px; display: flex; flex-direction: column; justify-content: space-between; background-color: #30253a; }
        .theme-main h3 { max-width: 560px; font-size: 31px; line-height: 1.3; margin: 18px 0 12px; }
        .theme-main p, .theme-side p { color: var(--muted); }
        .theme-side { display: grid; gap: 18px; }
        .theme-side > article { padding: 24px; }
        .theme-side h3 { font-size: 20px; margin: 8px 0; }
        .tag { display: inline-block; padding: 4px 9px; background: rgba(201,243,106,.14); color: var(--lime); border-radius: 5px; font-size: 12px; font-weight: 800; }
        .tag.coral { background: rgba(255,102,92,.15); color: #ff9b94; }
        .app-section { background: var(--lime); color: var(--ink); }
        .app-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: center; }
        .device { width: 220px; height: 370px; margin: auto; padding: 13px; border: 8px solid #201a27; border-radius: 30px; background: var(--plum); box-shadow: 14px 16px 0 rgba(24,20,30,.2); transform: rotate(-5deg); }
        .device-screen { height: 100%; border-radius: 18px; padding: 19px 14px; background: #45324c; }
        .device-screen strong { display: block; color: var(--cream); font-size: 23px; line-height: 1.25; margin-top: 38px; }
        .device-block { height: 64px; margin-top: 18px; background: var(--coral); border-radius: 8px; }
        .app-content h2 { font-size: 39px; line-height: 1.2; margin: 10px 0 15px; }
        .app-content p { max-width: 600px; color: #42364a; }
        .download-row { display: flex; align-items: center; gap: 20px; margin-top: 27px; }
        .btn-dark { background: var(--ink); color: var(--cream); }
        .btn-dark:hover { background: #33263e; }
        .qr { width: 82px; height: 82px; display: grid; place-items: center; background: var(--cream); border: 5px solid var(--ink); color: var(--ink); font-size: 11px; text-align: center; line-height: 1.2; }
        .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 30px; }
        .step { border-top: 3px solid var(--ink); padding-top: 12px; }
        .step b { font-size: 24px; margin-right: 8px; }
        .step span { font-size: 13px; }
        .news-layout { display: grid; grid-template-columns: .95fr 1.05fr; gap: 24px; }
        .featured-news { background: var(--coral); color: var(--ink); border-radius: var(--radius); padding: 30px; min-height: 310px; display: flex; flex-direction: column; justify-content: space-between; }
        .featured-news h3 { font-size: 28px; line-height: 1.3; margin: 18px 0; }
        .featured-news p { color: #462f36; }
        .news-list { border-top: 1px solid var(--line); }
        .news-item { display: block; padding: 18px 0; border-bottom: 1px solid var(--line); transition: padding-left .2s, color .2s; }
        .news-item:hover { padding-left: 8px; color: var(--coral); }
        .news-meta { display: flex; gap: 12px; color: var(--muted); font-size: 12px; }
        .news-item h3 { font-size: 17px; line-height: 1.45; margin-top: 5px; }
        .news-item p { color: var(--muted); font-size: 13px; margin-top: 4px; }
        .empty { padding: 30px; background: var(--plum); color: var(--muted); border: 1px dashed var(--line); border-radius: var(--radius); }
        .guide-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
        .guide-card { padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--plum); }
        .guide-card b { display: grid; place-items: center; width: 38px; height: 38px; background: var(--lime); color: var(--ink); border-radius: 8px; font-size: 18px; margin-bottom: 20px; }
        .guide-card h3 { font-size: 17px; margin-bottom: 7px; }
        .guide-card p { color: var(--muted); font-size: 13px; }
        .faq-wrap { max-width: 860px; margin: 0 auto; }
        .faq-item { border-bottom: 1px solid var(--line); }
        .faq-item summary { list-style: none; cursor: pointer; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 17px; font-weight: 700; }
        .faq-item summary::-webkit-details-marker { display: none; }
        .faq-item summary::after { content: "+"; color: var(--coral); font-size: 25px; font-weight: 400; }
        .faq-item[open] summary { color: var(--coral); }
        .faq-item[open] summary::after { content: "−"; }
        .faq-answer { color: var(--muted); padding: 0 42px 22px 0; }
        .cta { padding: 72px 0; background: #30253a; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
        .cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 30px; }
        .cta h2 { font-size: 32px; line-height: 1.25; margin: 9px 0; }
        .cta p { color: var(--muted); }
        .site-footer { padding: 58px 0 25px; background: var(--ink); }
        .footer-grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 40px; padding-bottom: 42px; }
        .footer-title { color: var(--cream); font-weight: 800; margin-bottom: 16px; }
        .footer-grid p, .footer-grid a { color: var(--muted); font-size: 13px; }
        .footer-grid a { display: block; margin: 8px 0; transition: color .2s; }
        .footer-grid a:hover { color: var(--coral); }
        .footer-brand p { max-width: 270px; margin-top: 16px; }
        .copyright { border-top: 1px solid var(--line); padding-top: 20px; color: #887d92; font-size: 12px; display: flex; justify-content: space-between; gap: 20px; }
        .mobile-bar { display: none; }
        @media (max-width: 1024px) {
            .brand { min-width: 250px; }
            .nav-menu { gap: 0; }
            .nav-menu a { padding-left: 8px; padding-right: 8px; font-size: 13px; }
            .hero-grid { gap: 35px; }
            .guide-grid { grid-template-columns: repeat(2, 1fr); }
        }
        @media (max-width: 768px) {
            .container { width: min(var(--max), calc(100% - 32px)); }
            .nav-wrap { min-height: 68px; justify-content: space-between; }
            .brand { min-width: 0; max-width: 270px; }
            .brand-text { font-size: 13px; }
            .brand-text small { font-size: 10px; }
            .menu-toggle { display: block; }
            .nav-menu { display: none; position: absolute; left: 16px; right: 16px; top: 68px; padding: 12px; background: var(--plum); border: 1px solid var(--line); border-radius: 10px; flex-direction: column; align-items: stretch; box-shadow: var(--shadow); }
            .nav-menu.open { display: flex; }
            .nav-menu a { display: block; padding: 13px 14px; }
            .nav-entry { margin: 4px 0 0; text-align: center; }
            .hero { min-height: auto; padding: 60px 0 54px; }
            .hero-grid, .app-grid, .news-layout, .theme-layout { grid-template-columns: 1fr; }
            .hero-grid { gap: 45px; }
            .hero h1 { font-size: 39px; }
            .hero-copy { font-size: 16px; }
            .arcade-panel { min-height: 340px; }
            .quick-grid { grid-template-columns: repeat(2, 1fr); }
            .quick-item:nth-child(2) { border-right: 0; }
            .quick-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
            .section { padding: 68px 0; }
            .section-head { display: block; margin-bottom: 26px; }
            .section-intro { margin-top: 15px; }
            .app-grid { gap: 40px; }
            .app-content h2 { font-size: 31px; }
            .steps { grid-template-columns: 1fr; gap: 12px; }
            .guide-grid { grid-template-columns: 1fr 1fr; }
            .cta-inner { display: block; }
            .cta-actions { margin-top: 22px; }
            .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; gap: 25px; }
            .footer-brand { grid-column: 1 / -1; }
            .mobile-bar { display: flex; position: fixed; z-index: 19; bottom: 0; left: 0; right: 0; background: var(--plum); border-top: 1px solid var(--line); padding: 9px 14px; justify-content: space-around; }
            .mobile-bar a { font-size: 12px; color: var(--muted); text-align: center; }
            .mobile-bar a:first-child { color: var(--lime); }
        }
        @media (max-width: 520px) {
            .hero h1 { font-size: 32px; }
            .hero-actions .btn { width: 100%; }
            .arcade-panel { padding: 16px; transform: none; }
            .screen { height: 205px; }
            .screen-title { font-size: 23px; margin-top: 23px; }
            .quick-item { padding: 18px 14px; }
            .quick-item h3 { font-size: 14px; }
            .theme-main, .theme-side > article, .featured-news { padding: 23px; }
            .theme-main h3 { font-size: 25px; }
            .download-row { align-items: flex-start; flex-wrap: wrap; }
            .guide-grid { grid-template-columns: 1fr; }
            .footer-grid { grid-template-columns: 1fr 1fr; }
            .copyright { display: block; }
            .copyright span { display: block; margin-top: 7px; }
            body { padding-bottom: 54px; }
        }

/* roulang page: category1 */
:root{
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--cream);
            background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            line-height:1.7;
            font-size:15px;
            overflow-x:hidden;
        }
        a{color:inherit;text-decoration:none}
        a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
        button,input{font:inherit}
        button{border:0;cursor:pointer}
        img{max-width:100%;display:block}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{
            position:sticky;top:0;z-index:30;
            background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line)
        }
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{
            width:38px;height:38px;display:grid;place-items:center;
            background:var(--coral);color:var(--ink);border-radius:9px;
            font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)
        }
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
        .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
        .nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:.2s ease}
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active::after{
            content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;
            background:var(--coral);border-radius:2px
        }
        .nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
        .page-hero{
            padding:58px 0 72px;
            background:var(--plum-deep);
            border-bottom:1px solid var(--soft-line);
            position:relative;isolation:isolate
        }
        .page-hero:after{
            content:"";position:absolute;right:0;top:0;width:42%;height:100%;z-index:-1;
            background:repeating-linear-gradient(0deg,transparent 0 46px,rgba(201,243,106,.07) 47px 48px),
            repeating-linear-gradient(90deg,transparent 0 74px,rgba(255,102,92,.07) 75px 76px);
            clip-path:polygon(25% 0,100% 0,100% 100%,0 100%)
        }
        .crumbs{color:var(--muted);font-size:13px;margin-bottom:42px}
        .crumbs a{color:var(--cream)}
        .crumbs span{margin:0 9px;color:var(--coral)}
        .hero-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:80px;align-items:center}
        .eyebrow,.section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.2px}
        h1{font-size:clamp(36px,5vw,62px);line-height:1.14;letter-spacing:0;margin:16px 0 22px;max-width:720px}
        h1 em{font-style:normal;color:var(--coral)}
        .hero-copy{font-size:18px;color:var(--muted);max-width:680px}
        .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
        .btn{
            display:inline-flex;align-items:center;justify-content:center;gap:9px;
            min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;
            transition:transform .2s,background .2s,border-color .2s,box-shadow .2s
        }
        .btn:hover{transform:translateY(-2px)}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{border-color:var(--coral);background:#32283c}
        .entry-board{
            min-height:310px;background:#30253a;border:1px solid var(--line);
            border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);
            transform:rotate(1deg)
        }
        .board-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:17px}
        .board-label{font-weight:800}.status{font-size:12px;color:var(--lime)}
        .status:before{content:"";display:inline-block;width:7px;height:7px;background:var(--lime);border-radius:50%;margin-right:7px}
        .board-screen{margin:24px 0;background:var(--ink);border:1px solid var(--line);padding:21px;min-height:135px}
        .screen-code{font-size:12px;color:var(--muted);display:flex;justify-content:space-between}
        .screen-title{font-size:25px;line-height:1.25;font-weight:900;margin:18px 0 4px}
        .screen-title b{color:var(--coral)}
        .board-lines{display:grid;gap:8px}
        .board-lines i{display:block;height:6px;background:var(--line);width:82%}
        .board-lines i:nth-child(2){width:60%;background:var(--coral)}
        .board-lines i:nth-child(3){width:70%;background:var(--lime)}
        .section{padding:88px 0}
        .section.alt{background:var(--plum-deep)}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
        h2{font-size:clamp(28px,3.4vw,43px);line-height:1.2;margin:9px 0 0}
        .section-intro{color:var(--muted);max-width:520px}
        .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
        .step{background:var(--plum);padding:30px 27px;min-height:205px}
        .step-number{font-size:36px;line-height:1;color:var(--coral);font-weight:900}
        .step:nth-child(2) .step-number{color:var(--lime)}
        .step h3{font-size:19px;margin:22px 0 7px}
        .step p{color:var(--muted);margin:0}
        .entry-columns{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
        .entry-panel{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);padding:30px}
        .entry-panel.large{background:#30253a;min-height:280px}
        .panel-tag{display:inline-block;background:var(--lime);color:var(--ink);font-size:12px;font-weight:900;padding:4px 9px;border-radius:5px}
        .entry-panel h3{font-size:25px;line-height:1.3;margin:18px 0 10px}
        .entry-panel p{color:var(--muted)}
        .link-list{margin:22px 0 0;padding:0;list-style:none}
        .link-list li{border-top:1px solid var(--line);padding:13px 0;display:flex;justify-content:space-between;gap:15px}
        .link-list li span{color:var(--muted);font-size:13px}
        .link-list a{color:var(--cream);font-weight:700}
        .link-list a:hover{color:var(--coral)}
        .notice{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:25px 28px;background:var(--lime);color:var(--ink);border-radius:var(--radius)}
        .notice strong{font-size:19px}.notice p{margin:4px 0 0;font-size:14px}
        .notice .btn{background:var(--ink);color:var(--cream);white-space:nowrap}
        .faq-list{max-width:900px;margin:0 auto;border-top:1px solid var(--line)}
        details{border-bottom:1px solid var(--line);background:transparent}
        summary{list-style:none;cursor:pointer;padding:20px 22px;font-weight:800;position:relative;padding-right:50px}
        summary::-webkit-details-marker{display:none}
        summary:after{content:"+";position:absolute;right:22px;color:var(--coral);font-size:24px;line-height:1}
        details[open]{background:var(--plum);border-left:4px solid var(--coral)}
        details[open] summary:after{content:"−"}
        details p{color:var(--muted);padding:0 48px 22px 22px;margin:0}
        .cta{padding:70px 0;background:#30253a;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
        .cta h2{max-width:680px;margin:0 auto 14px}
        .cta p{color:var(--muted);margin:0 auto 25px}
        .site-footer{background:var(--ink);padding:58px 0 20px}
        .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:35px}
        .footer-brand p,.site-footer p{color:var(--muted);font-size:13px}
        .footer-title{font-weight:800;margin-bottom:15px;color:var(--cream)}
        .site-footer .footer-grid>div:not(.footer-brand) a{display:block;color:var(--muted);font-size:14px;margin:7px 0}
        .site-footer a:hover{color:var(--coral)}
        .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--soft-line);margin-top:43px;padding-top:18px;color:#887d92;font-size:12px}
        @media(max-width:1100px){
            .brand{min-width:245px}.nav-menu{gap:0}.nav-menu a{padding-left:8px;padding-right:8px;font-size:14px}
            .hero-layout{gap:40px}
        }
        @media(max-width:800px){
            .container{width:min(var(--max),calc(100% - 34px))}
            .nav-wrap{min-height:68px;justify-content:space-between}.menu-toggle{display:block}
            .nav-menu{display:none;position:absolute;left:17px;right:17px;top:68px;padding:10px;background:var(--plum);border:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
            .nav-menu.is-open{display:flex}.nav-menu a{padding:13px 14px}.nav-menu a.active::after{left:14px;right:auto;width:34px;bottom:5px}
            .nav-entry{margin:5px 0 0;text-align:center}.hero-layout,.entry-columns{grid-template-columns:1fr}.entry-board{max-width:500px;transform:none}
            .page-hero{padding:42px 0 58px}.crumbs{margin-bottom:28px}
            .steps{grid-template-columns:1fr}.step{min-height:0}
            .section{padding:68px 0}.section-head{display:block}.section-intro{margin-top:15px}
            .footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}
        }
        @media(max-width:520px){
            .brand{min-width:0}.brand-text{font-size:14px}.brand-text small{font-size:10px}
            .brand-mark{width:34px;height:34px}.hero h1{font-size:37px}.hero-copy{font-size:16px}
            .hero-actions .btn{width:100%}.entry-panel{padding:23px}.notice{display:block;padding:22px}.notice .btn{margin-top:17px;width:100%}
            .copyright{display:block}.copyright span{display:block;margin-top:5px}.footer-grid{grid-template-columns:1fr}
        }

/* roulang page: article */
:root {
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--cream);
            background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            font-size:15px;
            line-height:1.75;
            overflow-x:hidden;
        }
        a{color:inherit;text-decoration:none}
        a:focus-visible,button:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
        button,input{font:inherit}
        img{display:block;max-width:100%}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{
            position:sticky;top:0;z-index:20;
            background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line);
        }
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{
            width:38px;height:38px;display:grid;place-items:center;
            background:var(--coral);color:var(--ink);border-radius:9px;
            font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)
        }
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
        .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
        .nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:.2s ease}
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active::after{
            content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;
            background:var(--coral);border-radius:2px
        }
        .nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
        .article-hero{
            padding:72px 0 66px;
            background:
                linear-gradient(110deg,rgba(40,33,47,.95),rgba(24,20,30,.98)),
                repeating-linear-gradient(90deg,transparent 0 100px,rgba(201,243,106,.04) 101px 102px);
            border-bottom:1px solid var(--soft-line)
        }
        .breadcrumb{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin-bottom:30px;flex-wrap:wrap}
        .breadcrumb a{color:var(--cream)}
        .breadcrumb a:hover{color:var(--coral)}
        .crumb-mark{color:var(--coral)}
        .article-label{
            display:inline-flex;align-items:center;gap:8px;
            padding:6px 11px;background:rgba(201,243,106,.12);
            border:1px solid rgba(201,243,106,.35);border-radius:6px;
            color:var(--lime);font-size:12px;font-weight:800
        }
        .article-label::before{content:"";width:7px;height:7px;background:var(--lime);border-radius:50%}
        .article-hero h1{max-width:900px;font-size:clamp(32px,5vw,58px);line-height:1.2;letter-spacing:-1px;margin:20px 0 18px}
        .article-summary{max-width:780px;color:var(--muted);font-size:18px;margin:0}
        .article-meta{display:flex;gap:22px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-top:25px}
        .article-meta strong{color:var(--cream);font-weight:600}
        .article-layout{display:grid;grid-template-columns:minmax(0,820px) 280px;gap:70px;align-items:start;padding:76px 0 92px}
        .article-content{
            min-width:0;color:#e8dfd2;font-size:17px;line-height:1.95
        }
        .article-content>*:first-child{margin-top:0}
        .article-content h2{
            position:relative;color:var(--cream);font-size:30px;line-height:1.35;
            margin:48px 0 18px;padding-left:18px
        }
        .article-content h2::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:4px;background:var(--coral);border-radius:3px}
        .article-content h3{color:var(--cream);font-size:22px;margin:34px 0 12px}
        .article-content p{margin:0 0 22px}
        .article-content a{color:var(--coral);text-decoration:underline;text-underline-offset:3px}
        .article-content ul,.article-content ol{padding-left:28px;margin:16px 0 25px}
        .article-content li{margin:8px 0}
        .article-content blockquote{
            margin:30px 0;padding:20px 24px;background:var(--plum);
            border-left:4px solid var(--lime);border-radius:0 var(--radius) var(--radius) 0;color:var(--muted)
        }
        .article-content img{border-radius:var(--radius);margin:30px auto;box-shadow:var(--shadow)}
        .article-content table{width:100%;border-collapse:collapse;margin:28px 0;background:var(--plum);font-size:15px}
        .article-content th,.article-content td{padding:13px 15px;border:1px solid var(--line);text-align:left}
        .article-content th{color:var(--lime);font-weight:700}
        .article-aside{position:sticky;top:105px}
        .aside-card{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:18px}
        .aside-title{font-weight:800;color:var(--cream);font-size:16px;margin-bottom:15px}
        .aside-title::after{content:"";display:block;width:28px;height:3px;background:var(--coral);margin-top:10px}
        .aside-card p{color:var(--muted);font-size:13px;margin:0 0 18px}
        .aside-links{display:grid;gap:8px}
        .aside-links a{padding:10px 0;color:var(--muted);border-bottom:1px solid var(--soft-line);font-size:14px;transition:.2s}
        .aside-links a:hover{padding-left:6px;color:var(--coral)}
        .download-card{background:var(--lime);color:var(--ink);border:0}
        .download-card .aside-title{color:var(--ink)}
        .download-card .aside-title::after{background:var(--ink)}
        .download-card p{color:#413b2b}
        .btn{
            display:inline-flex;justify-content:center;align-items:center;gap:9px;
            min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;
            transition:transform .2s,background .2s,border-color .2s,box-shadow .2s
        }
        .btn:hover{transform:translateY(-2px)}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{border-color:var(--coral);background:#32283c}
        .download-card .btn{background:var(--ink);color:var(--lime);width:100%}
        .article-bottom{border-top:1px solid var(--line);padding-top:30px;margin-top:55px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
        .tag-list{display:flex;gap:8px;flex-wrap:wrap}
        .tag{padding:5px 10px;border-radius:5px;background:var(--plum);border:1px solid var(--line);color:var(--muted);font-size:12px}
        .related-section{background:var(--plum-deep);padding:75px 0}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}
        .section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.5px}
        .section-head h2{font-size:32px;line-height:1.3;margin:9px 0 0}
        .related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
        .related-card{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);padding:24px;transition:.2s}
        .related-card:hover{transform:translateY(-4px);border-color:var(--coral);box-shadow:var(--shadow)}
        .related-card .card-num{color:var(--coral);font-weight:900;font-size:13px}
        .related-card h3{font-size:18px;line-height:1.45;margin:13px 0 9px}
        .related-card p{color:var(--muted);font-size:14px;margin:0 0 17px}
        .related-card a{color:var(--lime);font-size:13px;font-weight:700}
        .faq-section{padding:82px 0}
        .faq-list{max-width:860px;margin:28px auto 0}
        .faq-item{border-bottom:1px solid var(--line)}
        .faq-item summary{cursor:pointer;list-style:none;padding:20px 8px;font-weight:700;font-size:16px;position:relative}
        .faq-item summary::-webkit-details-marker{display:none}
        .faq-item summary::after{content:"+";position:absolute;right:8px;color:var(--coral);font-size:24px;font-weight:400;line-height:1}
        .faq-item[open] summary{color:var(--coral)}
        .faq-item[open] summary::after{content:"−"}
        .faq-answer{padding:0 40px 20px 8px;color:var(--muted);font-size:14px}
        .cta-band{padding:68px 0;background:var(--coral);color:var(--ink)}
        .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
        .cta-band h2{font-size:31px;line-height:1.3;margin:0 0 8px}
        .cta-band p{margin:0;color:#4b2727}
        .cta-band .btn{background:var(--ink);color:var(--cream)}
        .site-footer{background:#120f17;padding:62px 0 22px;border-top:1px solid var(--soft-line)}
        .footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:36px}
        .footer-brand p{color:var(--muted);font-size:13px;max-width:290px;margin:18px 0 0}
        .footer-title{color:var(--cream);font-weight:800;margin-bottom:15px}
        .footer-grid>div:not(.footer-brand) a{display:block;color:var(--muted);font-size:13px;margin:8px 0;transition:.2s}
        .footer-grid>div:not(.footer-brand) a:hover{color:var(--coral);padding-left:3px}
        .footer-grid>div:not(.footer-brand) p{color:var(--muted);font-size:13px;margin:0 0 12px}
        .copyright{border-top:1px solid var(--soft-line);margin-top:42px;padding-top:19px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#84798d;font-size:12px}
        .empty-state{background:var(--plum);border:1px dashed var(--line);border-radius:var(--radius);padding:54px 30px;text-align:center}
        .empty-state h2{font-size:27px;margin:0 0 12px}
        .empty-state p{color:var(--muted);margin:0 0 22px}
        @media(max-width:1100px){
            .brand{min-width:245px}.nav-menu a{padding:9px 7px;font-size:13px}
            .article-layout{grid-template-columns:minmax(0,1fr) 245px;gap:38px}
        }
        @media(max-width:900px){
            .nav-wrap{position:relative}.menu-toggle{display:block;margin-left:auto}
            .nav-menu{display:none;position:absolute;top:76px;left:0;right:0;padding:12px;background:var(--plum-deep);border:1px solid var(--line);flex-direction:column;align-items:stretch}
            .nav-menu.open{display:flex}.nav-menu a{padding:12px 14px}.nav-entry{margin:5px 0 0;text-align:center}
            .article-layout{grid-template-columns:1fr}.article-aside{position:static;display:grid;grid-template-columns:1fr 1fr;gap:18px}.aside-card{margin:0}
            .related-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}
            .footer-grid>div:last-child{grid-column:2 / -1}
        }
        @media(max-width:650px){
            .container{width:min(var(--max),calc(100% - 32px))}
            .brand{min-width:0}.brand-text{font-size:14px}.brand-text small{font-size:10px}
            .article-hero{padding:48px 0}.article-hero h1{font-size:34px}
            .article-summary{font-size:16px}.article-layout{padding:48px 0 62px}.article-content{font-size:16px}
            .article-content h2{font-size:25px}.article-aside,.related-grid{grid-template-columns:1fr}
            .section-head,.cta-inner{display:block}.section-head .btn,.cta-inner .btn{margin-top:20px}
            .cta-band h2{font-size:27px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}
            .footer-grid>div:last-child{grid-column:auto}.footer-brand{grid-column:1 / -1}
        }
        @media(max-width:420px){
            .brand-mark{width:34px;height:34px}.brand-text small{display:none}
            .article-meta{gap:10px 16px}.copyright{display:block}.copyright span{display:block;margin:5px 0}
        }

/* roulang page: category3 */
:root{
        --ink:#18141e;--plum:#28212f;--plum-deep:#211a28;--coral:#ff665c;--coral-dark:#d94f49;
        --lime:#c9f36a;--cream:#fff8ec;--muted:#bdb3c7;--line:#40354b;
        --soft-line:rgba(255,248,236,.12);--radius:14px;--shadow:0 18px 42px rgba(9,5,15,.25);--max:1220px
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--cream);background:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;line-height:1.7;font-size:15px;overflow-x:hidden}
    a{color:inherit;text-decoration:none} a:hover{color:var(--cream)}
    button,input{font:inherit} button{border:0;cursor:pointer} img{max-width:100%;display:block}
    .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(24,20,30,.97);border-bottom:1px solid var(--soft-line)}
    .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
    .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
    .brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--coral);color:var(--ink);border-radius:9px;font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)}
    .brand-text{line-height:1.25;font-weight:800;color:var(--cream)} .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
    .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
    .nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:.2s}
    .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
    .nav-menu a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;background:var(--coral);border-radius:2px}
    .nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
    .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
    .menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
    .page-hero{padding:82px 0 72px;background:linear-gradient(120deg,var(--ink),#251c2c 62%,#30243a);border-bottom:1px solid var(--soft-line);position:relative;overflow:hidden}
    .page-hero:after{content:"";position:absolute;right:-100px;top:-130px;width:520px;height:430px;border:1px solid rgba(201,243,106,.18);transform:rotate(31deg);box-shadow:-28px 28px 0 rgba(255,102,92,.08)}
    .crumbs{color:var(--muted);font-size:13px;margin-bottom:30px}.crumbs a{color:var(--cream)}.crumbs span{margin:0 9px;color:var(--coral)}
    .eyebrow,.section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.5px}
    h1{font-size:clamp(36px,5vw,64px);line-height:1.14;letter-spacing:-1px;margin:16px 0 20px;max-width:760px}
    h1 em{font-style:normal;color:var(--coral)} .hero-copy{font-size:18px;color:var(--muted);max-width:700px}
    .hero-meta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.badge,.tag{display:inline-flex;align-items:center;padding:5px 11px;border-radius:6px;background:var(--plum);border:1px solid var(--line);color:var(--muted);font-size:12px}.badge.hot{color:var(--ink);background:var(--lime);border-color:var(--lime)}
    .section{padding:88px 0}.section.alt{background:var(--plum-deep)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}.section h2{font-size:clamp(28px,3.5vw,43px);line-height:1.2;margin:10px 0 0}.section-intro{color:var(--muted);max-width:520px}
    .news-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:24px}
    .feature-news,.news-item,.topic-panel,.faq-item{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);transition:.2s}
    .feature-news{padding:34px;min-height:370px;display:flex;flex-direction:column;justify-content:space-between;border-top:4px solid var(--coral)}
    .feature-news:hover,.news-item:hover,.topic-panel:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
    .feature-news h3{font-size:30px;line-height:1.35;margin:18px 0 12px}.feature-news p,.news-item p,.topic-panel p{color:var(--muted)}
    .read-link{color:var(--lime);font-weight:800;margin-top:20px;display:inline-block}
    .news-list{display:grid;gap:12px}.news-item{padding:20px 22px;display:grid;grid-template-columns:78px 1fr;gap:16px;align-items:start}
    .news-date{color:var(--coral);font-weight:900;font-size:14px;line-height:1.35}.news-date small{display:block;color:var(--muted);font-size:11px;font-weight:500}
    .news-item h3{font-size:17px;margin:0 0 5px;line-height:1.45}.news-item p{font-size:13px;margin:0}
    .filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:16px;background:var(--plum);border:1px solid var(--line);border-radius:10px;margin-bottom:28px}
    .filter-bar strong{margin-right:8px;font-size:14px}.tag{cursor:pointer}.tag:hover,.tag.current{background:var(--coral);border-color:var(--coral);color:var(--ink)}
    .topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.topic-panel{padding:25px;min-height:190px}.topic-panel:nth-child(2){border-top:3px solid var(--lime)}.topic-panel:nth-child(3){border-top:3px solid var(--coral)}
    .topic-icon{width:38px;height:38px;display:grid;place-items:center;background:var(--ink);color:var(--lime);border-radius:9px;font-weight:900;margin-bottom:18px}.topic-panel h3{font-size:19px;margin:0 0 8px}.topic-panel p{font-size:14px;margin:0}
    .timeline{position:relative;max-width:850px;margin:0 auto}.timeline:before{content:"";position:absolute;left:94px;top:12px;bottom:12px;width:1px;background:var(--line)}
    .timeline-row{display:grid;grid-template-columns:76px 1fr;gap:38px;position:relative;margin-bottom:24px}.timeline-row:last-child{margin-bottom:0}.timeline-row:after{content:"";position:absolute;left:89px;top:17px;width:11px;height:11px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px var(--plum-deep)}
    .timeline-time{text-align:right;color:var(--lime);font-size:13px;font-weight:800;padding-top:9px}.timeline-card{background:var(--plum);border:1px solid var(--line);border-radius:10px;padding:20px 23px}.timeline-card h3{font-size:18px;margin:0 0 6px}.timeline-card p{color:var(--muted);margin:0;font-size:14px}
    .faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.faq-item{padding:0;overflow:hidden}.faq-item summary{list-style:none;padding:18px 21px;font-weight:800;cursor:pointer;position:relative;padding-right:45px}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"＋";position:absolute;right:20px;color:var(--coral);font-size:20px}.faq-item[open] summary{border-left:4px solid var(--coral);background:#32283c}.faq-item[open] summary:after{content:"−"}.faq-answer{padding:0 22px 20px;color:var(--muted);font-size:14px}
    .cta{padding:58px 0;background:var(--coral);color:var(--ink)}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.cta h2{font-size:34px;line-height:1.25;margin:0 0 8px}.cta p{margin:0;max-width:650px}.cta .btn{background:var(--ink);color:var(--cream)}.cta .btn:hover{background:#30243a}
    .site-footer{background:#120f17;padding:58px 0 22px;border-top:1px solid var(--soft-line)}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:35px}.footer-brand p,.site-footer p{color:var(--muted);font-size:13px}.footer-title{font-weight:800;color:var(--cream);margin-bottom:14px}.site-footer>div a:not(.brand){display:block;color:var(--muted);font-size:13px;margin:7px 0}.site-footer>div a:not(.brand):hover{color:var(--lime)}.copyright{border-top:1px solid var(--soft-line);margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;gap:18px;color:#82778d;font-size:12px}
    .btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}.btn-primary:hover{background:#ff8177}.btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}.btn-secondary:hover{border-color:var(--coral);background:#32283c}
    :focus-visible{outline:3px solid var(--lime);outline-offset:3px}
    @media(max-width:1100px){.brand{min-width:230px}.nav-menu{gap:0}.nav-menu a{padding:9px 7px;font-size:13px}.nav-entry{margin-left:3px}.container{width:min(var(--max),calc(100% - 36px))}}
    @media(max-width:850px){.nav-wrap{min-height:68px}.menu-toggle{display:block;margin-left:auto}.nav-menu{display:none;position:absolute;left:18px;right:18px;top:68px;padding:12px;background:var(--plum);border:1px solid var(--line);border-radius:10px;flex-direction:column;align-items:stretch}.nav-menu.open{display:flex}.nav-menu a{padding:12px 15px}.nav-menu a.active:after{left:15px;right:auto;width:28px}.nav-entry{margin:6px 0 0}.news-layout{grid-template-columns:1fr}.topic-grid,.faq-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:560px){.container{width:calc(100% - 30px)}.page-hero{padding:58px 0 52px}h1{font-size:38px}.section{padding:62px 0}.section-head{display:block}.section-intro{margin-top:15px}.feature-news{padding:25px;min-height:320px}.feature-news h3{font-size:24px}.topic-grid,.faq-grid{grid-template-columns:1fr}.timeline:before{left:10px}.timeline-row{grid-template-columns:28px 1fr;gap:18px}.timeline-row:after{left:5px}.timeline-time{text-align:left;font-size:11px;writing-mode:vertical-rl;padding-top:5px}.cta-inner{display:block}.cta h2{font-size:28px;margin-bottom:18px}.cta .btn{width:100%;margin-top:23px}.footer-grid{grid-template-columns:1fr;gap:24px}.copyright{display:block}.copyright span{display:block;margin-bottom:6px}.news-item{grid-template-columns:65px 1fr;padding:17px}.brand{min-width:0}.brand-text{font-size:14px}.brand-text small{font-size:10px}}

/* roulang page: category2 */
:root {
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        * { box-sizing:border-box; }
        html { scroll-behavior:smooth; }
        body {
            margin:0;
            color:var(--cream);
            background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            line-height:1.7;
            font-size:15px;
            overflow-x:hidden;
        }
        a { color:inherit; text-decoration:none; }
        img { display:block; max-width:100%; }
        button,input { font:inherit; }
        button { border:0; cursor:pointer; }
        .container { width:min(var(--max),calc(100% - 48px)); margin:0 auto; }
        .site-header {
            position:sticky; top:0; z-index:20;
            background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line);
        }
        .nav-wrap { min-height:76px; display:flex; align-items:center; gap:28px; }
        .brand { display:inline-flex; align-items:center; gap:11px; min-width:290px; }
        .brand-mark {
            width:38px; height:38px; display:grid; place-items:center;
            background:var(--coral); color:var(--ink); border-radius:9px;
            font-weight:900; box-shadow:5px 5px 0 rgba(201,243,106,.7);
        }
        .brand-text { line-height:1.25; font-weight:800; color:var(--cream); }
        .brand-text small { display:block; color:var(--muted); font-size:11px; font-weight:500; margin-top:3px; }
        .nav-menu { display:flex; align-items:center; justify-content:flex-end; gap:6px; flex:1; list-style:none; margin:0; padding:0; }
        .nav-menu a { position:relative; padding:10px 12px; color:var(--muted); transition:.2s ease; white-space:nowrap; }
        .nav-menu a:hover,.nav-menu a.active { color:var(--cream); }
        .nav-menu a.active::after { content:""; position:absolute; left:12px; right:12px; bottom:1px; height:3px; background:var(--coral); border-radius:2px; }
        .nav-entry { background:var(--coral); color:var(--ink)!important; border-radius:8px; font-weight:800; margin-left:8px; }
        .nav-entry:hover { background:#ff8177; transform:translateY(-1px); }
        .menu-toggle { display:none; background:transparent; color:var(--cream); font-size:25px; padding:8px; }
        .page-hero { padding:72px 0 64px; background:var(--plum-deep); border-bottom:1px solid var(--soft-line); }
        .breadcrumb { display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:13px; margin-bottom:28px; }
        .breadcrumb a:hover { color:var(--coral); }
        .breadcrumb span { color:var(--line); }
        .hero-layout { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; }
        .eyebrow,.section-kicker { color:var(--lime); font-size:12px; font-weight:800; letter-spacing:1.4px; }
        h1,h2,h3,p { margin-top:0; }
        h1 { font-size:clamp(36px,5vw,64px); line-height:1.12; letter-spacing:-1px; margin:16px 0 22px; }
        h1 em { color:var(--coral); font-style:normal; }
        .lead { max-width:650px; color:var(--muted); font-size:18px; }
        .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
        .btn {
            display:inline-flex; align-items:center; justify-content:center; gap:9px;
            min-height:46px; padding:0 20px; border-radius:9px; font-weight:800;
            transition:transform .2s,background .2s,border-color .2s,box-shadow .2s;
        }
        .btn:hover { transform:translateY(-2px); }
        .btn:focus,.nav-menu a:focus,.faq-question:focus { outline:3px solid rgba(201,243,106,.55); outline-offset:3px; }
        .btn-primary { background:var(--coral); color:var(--ink); box-shadow:0 8px 0 rgba(217,79,73,.22); }
        .btn-primary:hover { background:#ff8177; }
        .btn-secondary { background:var(--plum); border:1px solid var(--line); color:var(--cream); }
        .btn-secondary:hover { border-color:var(--coral); background:#32283c; }
        .platform-board {
            min-height:300px; padding:25px; background:#30253a;
            border:1px solid var(--line); border-radius:var(--radius);
            box-shadow:var(--shadow); position:relative; overflow:hidden;
        }
        .platform-board:before { content:""; position:absolute; width:180px; height:180px; right:-45px; top:-55px; border:22px solid rgba(201,243,106,.16); border-radius:50%; }
        .board-top { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding-bottom:16px; }
        .board-label { color:var(--muted); font-size:12px; letter-spacing:1px; }
        .status { color:var(--lime); font-size:12px; }
        .status:before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; background:var(--lime); border-radius:50%; }
        .board-title { font-size:29px; font-weight:900; line-height:1.25; max-width:310px; margin:35px 0 24px; }
        .board-title b { color:var(--coral); }
        .board-lines { display:grid; gap:10px; }
        .board-line { height:9px; background:var(--line); border-radius:3px; }
        .board-line:nth-child(1) { width:88%; background:var(--coral); }
        .board-line:nth-child(2) { width:68%; }
        .board-line:nth-child(3) { width:76%; background:rgba(201,243,106,.55); }
        .section { padding:92px 0; }
        .section.alt { background:var(--plum-deep); }
        .section-head { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:38px; }
        .section h2 { font-size:clamp(28px,3vw,42px); line-height:1.2; margin:10px 0 0; }
        .section-intro { color:var(--muted); max-width:520px; margin:0; }
        .index-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:18px; }
        .index-main,.index-side article,.feature-card,.step-card,.faq-item {
            background:var(--plum); border:1px solid var(--line); border-radius:var(--radius);
        }
        .index-main { padding:34px; min-height:310px; display:flex; flex-direction:column; justify-content:space-between; background:#30253a; }
        .index-main h3 { font-size:31px; line-height:1.3; max-width:560px; margin:18px 0 12px; }
        .index-main p,.index-side p,.feature-card p,.step-card p { color:var(--muted); }
        .tag { display:inline-flex; align-items:center; width:max-content; padding:5px 9px; border-radius:5px; background:rgba(201,243,106,.14); color:var(--lime); font-size:12px; font-weight:800; }
        .index-side { display:grid; gap:18px; }
        .index-side article { padding:25px; min-height:146px; transition:transform .2s,border-color .2s; }
        .index-side article:hover,.feature-card:hover,.step-card:hover { transform:translateY(-4px); border-color:var(--coral); }
        .index-side h3 { font-size:20px; margin:14px 0 5px; }
        .feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
        .feature-card { padding:26px; min-height:215px; transition:.2s ease; }
        .feature-number { color:var(--coral); font-size:28px; font-weight:900; line-height:1; }
        .feature-card h3 { font-size:19px; margin:20px 0 8px; }
        .feature-card:nth-child(2) .feature-number { color:var(--lime); }
        .feature-card:nth-child(3) .feature-number { color:#f0b56b; }
        .info-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:50px; align-items:start; }
        .info-copy { position:sticky; top:110px; }
        .info-copy h2 { margin-bottom:18px; }
        .info-copy p { color:var(--muted); }
        .info-list { border-top:1px solid var(--line); }
        .info-row { display:grid; grid-template-columns:58px 1fr auto; gap:20px; align-items:center; padding:22px 0; border-bottom:1px solid var(--line); }
        .info-num { color:var(--coral); font-weight:900; font-size:20px; }
        .info-row h3 { font-size:18px; margin:0 0 4px; }
        .info-row p { color:var(--muted); font-size:14px; margin:0; }
        .arrow { color:var(--lime); font-size:20px; }
        .steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; counter-reset:steps; }
        .step-card { padding:24px; min-height:190px; position:relative; transition:.2s ease; }
        .step-card:before { counter-increment:steps; content:counter(steps,decimal-leading-zero); color:var(--lime); font-weight:900; font-size:14px; }
        .step-card h3 { margin:18px 0 8px; font-size:18px; }
        .faq-list { max-width:900px; margin:0 auto; }
        .faq-item { margin-bottom:10px; overflow:hidden; }
        .faq-question { width:100%; display:flex; justify-content:space-between; align-items:center; text-align:left; padding:19px 22px; color:var(--cream); background:transparent; font-weight:800; }
        .faq-question span:last-child { color:var(--coral); font-size:22px; }
        .faq-answer { padding:0 22px 20px; color:var(--muted); max-width:820px; }
        .cta { padding:70px 0; background:var(--coral); color:var(--ink); }
        .cta-layout { display:flex; align-items:center; justify-content:space-between; gap:30px; }
        .cta h2 { font-size:clamp(28px,3.5vw,46px); line-height:1.2; margin:0 0 10px; }
        .cta p { max-width:620px; margin:0; color:#3b2023; }
        .cta .btn-primary { background:var(--ink); color:var(--cream); box-shadow:none; }
        .cta .btn-primary:hover { background:#30253a; }
        .site-footer { padding:58px 0 22px; background:var(--plum-deep); border-top:1px solid var(--soft-line); }
        .footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.15fr; gap:35px; }
        .footer-brand p,.site-footer p { color:var(--muted); font-size:13px; }
        .footer-brand p { max-width:290px; margin:18px 0 0; }
        .footer-title { color:var(--cream); font-weight:800; margin-bottom:15px; }
        .site-footer > .container > div:not(.footer-grid) a,.footer-grid > div:not(.footer-brand) a { display:block; color:var(--muted); font-size:13px; margin:9px 0; transition:color .2s; }
        .site-footer a:hover { color:var(--coral); }
        .copyright { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); margin-top:42px; padding-top:18px; color:#8e8299; font-size:12px; }
        @media (max-width:1100px) {
            .nav-wrap { gap:14px; }
            .brand { min-width:240px; }
            .nav-menu a { padding:9px 7px; font-size:13px; }
            .hero-layout { gap:35px; }
        }
        @media (max-width:768px) {
            .container { width:min(var(--max),calc(100% - 32px)); }
            .nav-wrap { min-height:68px; justify-content:space-between; }
            .brand { min-width:0; }
            .brand-text { font-size:14px; }
            .menu-toggle { display:block; }
            .nav-menu { display:none; position:absolute; left:16px; right:16px; top:68px; padding:12px; background:var(--plum); border:1px solid var(--line); border-radius:10px; flex-direction:column; align-items:stretch; box-shadow:var(--shadow); }
            .nav-menu.open { display:flex; }
            .nav-menu a { padding:12px 14px; }
            .nav-menu a.active::after { left:14px; right:auto; width:28px; bottom:6px; }
            .nav-entry { margin:5px 0 0; text-align:center; }
            .page-hero { padding:50px 0; }
            .hero-layout,.index-grid,.info-layout { grid-template-columns:1fr; }
            .platform-board { min-height:250px; }
            .section { padding:68px 0; }
            .section-head,.cta-layout { display:block; }
            .section-intro { margin-top:16px; }
            .feature-grid { grid-template-columns:1fr 1fr; }
            .steps { grid-template-columns:1fr 1fr; }
            .info-copy { position:static; }
            .footer-grid { grid-template-columns:1fr 1fr; }
        }
        @media (max-width:520px) {
            h1 { font-size:36px; }
            .lead { font-size:16px; }
            .hero-actions .btn { width:100%; }
            .feature-grid,.steps,.footer-grid { grid-template-columns:1fr; }
            .index-main,.index-side article { padding:24px; }
            .index-main h3 { font-size:25px; }
            .info-row { grid-template-columns:38px 1fr 18px; gap:10px; }
            .info-row h3 { font-size:16px; }
            .copyright { display:block; line-height:2; }
            .copyright span { display:block; }
        }

/* roulang page: category4 */
:root{
 --ink:#18141e;--plum:#28212f;--plum-deep:#211a28;--coral:#ff665c;--coral-dark:#d94f49;
 --lime:#c9f36a;--cream:#fff8ec;--muted:#bdb3c7;--line:#40354b;
 --soft-line:rgba(255,248,236,.12);--radius:14px;--shadow:0 18px 42px rgba(9,5,15,.25);
 --max:1220px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--cream);background:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;font-size:15px;line-height:1.7;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
button,input{font:inherit}
button{border:0;cursor:pointer}
img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(24,20,30,.97);border-bottom:1px solid var(--soft-line)}
.nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
.brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--coral);color:var(--ink);border-radius:9px;font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)}
.brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
.brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
.nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
.nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:.2s}
.nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
.nav-menu a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;background:var(--coral);border-radius:2px}
.nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
.nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
.menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
.page-hero{padding:58px 0 66px;background:var(--plum-deep);border-bottom:1px solid var(--soft-line)}
.breadcrumb{display:flex;gap:9px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:28px}
.breadcrumb a:hover{color:var(--lime)}
.breadcrumb strong{color:var(--cream);font-weight:500}
.hero-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.eyebrow,.section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.5px}
.page-hero h1{font-size:clamp(34px,5vw,60px);line-height:1.14;letter-spacing:-1px;margin:16px 0 20px;max-width:700px}
.page-hero h1 em{font-style:normal;color:var(--coral)}
.lead{font-size:18px;color:var(--muted);max-width:650px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
.btn-primary:hover{background:#ff8177}
.btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
.btn-secondary:hover{border-color:var(--coral);background:#32283c}
.device-art{position:relative;min-height:310px;background:#30253a;border:1px solid var(--line);border-radius:18px;padding:24px;overflow:hidden;box-shadow:var(--shadow)}
.device-art:before{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(201,243,106,.28);border-radius:50%;right:-75px;top:-70px}
.device-art:after{content:"";position:absolute;left:0;right:0;bottom:42px;height:1px;background:var(--soft-line);transform:rotate(-14deg)}
.phone{position:absolute;z-index:2;right:54px;top:27px;width:178px;height:288px;border:7px solid #100d15;border-radius:24px;background:var(--ink);box-shadow:12px 14px 0 rgba(201,243,106,.18)}
.phone-notch{width:64px;height:10px;border-radius:0 0 8px 8px;background:#100d15;margin:0 auto 17px}
.phone-screen{padding:14px}
.phone-logo{height:38px;background:var(--coral);border-radius:7px;color:var(--ink);font-size:20px;font-weight:900;display:grid;place-items:center}
.phone-line{height:10px;background:var(--line);margin-top:15px;border-radius:4px}
.phone-line.short{width:64%}
.phone-tile{height:63px;background:var(--plum);border:1px solid var(--line);margin-top:14px;border-radius:8px;padding:10px}
.phone-tile b{display:block;color:var(--lime);font-size:11px}
.art-copy{position:absolute;left:27px;bottom:28px;z-index:3;max-width:220px}
.art-copy b{font-size:24px;display:block;line-height:1.2}
.art-copy span{color:var(--muted);font-size:12px}
.section{padding:88px 0}
.section.alt{background:var(--plum-deep)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
.section h2{font-size:clamp(27px,3vw,42px);line-height:1.2;margin:9px 0 0}
.section-intro{color:var(--muted);max-width:540px}
.download-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}
.download-panel,.step-panel,.device-card,.notice-card{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius)}
.download-panel{padding:32px;min-height:355px;position:relative;overflow:hidden}
.download-panel h3{font-size:27px;line-height:1.3;margin:12px 0}
.download-panel p{color:var(--muted)}
.download-panel .btn{margin-top:17px}
.qr-box{position:absolute;right:27px;bottom:26px;width:112px;height:112px;background:var(--cream);padding:9px;border-radius:8px}
.qr-box:before{content:"";display:block;width:100%;height:100%;background:repeating-linear-gradient(45deg,var(--ink) 0 4px,transparent 4px 9px),repeating-linear-gradient(-45deg,transparent 0 5px,var(--ink) 5px 8px);opacity:.86}
.qr-label{position:absolute;right:29px;bottom:7px;font-size:10px;color:var(--muted)}
.step-panel{padding:28px}
.step-panel h3{font-size:22px;margin:0 0 22px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{border-top:3px solid var(--coral);padding-top:14px}
.step:nth-child(2){border-color:var(--lime)}
.step:nth-child(3){border-color:#a18db8}
.step-number{font-size:27px;font-weight:900;color:var(--lime)}
.step h4{font-size:16px;margin:4px 0 6px}
.step p{font-size:13px;color:var(--muted);margin:0}
.section-label{display:inline-flex;padding:5px 9px;background:rgba(201,243,106,.12);color:var(--lime);border-radius:5px;font-size:12px;font-weight:800}
.device-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.device-card{padding:25px;display:flex;gap:18px;align-items:flex-start;transition:transform .2s,border-color .2s}
.device-card:hover{transform:translateY(-3px);border-color:var(--coral)}
.device-icon{width:46px;height:46px;flex:0 0 46px;border-radius:10px;background:var(--lime);color:var(--ink);display:grid;place-items:center;font-size:22px;font-weight:900}
.device-card:nth-child(2) .device-icon{background:var(--coral)}
.device-card h3{font-size:18px;margin:0 0 5px}
.device-card p{color:var(--muted);font-size:14px;margin:0}
.notice-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:24px}
.notice-card{padding:30px}
.notice-card h3{font-size:23px;margin:0 0 14px}
.notice-card p{color:var(--muted)}
.check-list{list-style:none;padding:0;margin:20px 0 0}
.check-list li{padding:10px 0 10px 27px;border-bottom:1px solid var(--soft-line);position:relative;color:var(--muted)}
.check-list li:before{content:"✓";position:absolute;left:0;color:var(--lime);font-weight:900}
.faq-list{max-width:900px;margin:0 auto}
.faq-item{border:1px solid var(--line);border-radius:10px;background:var(--plum);margin-bottom:11px;overflow:hidden}
.faq-item summary{cursor:pointer;padding:17px 21px;font-size:16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";color:var(--lime);font-size:22px;font-weight:400}
.faq-item[open] summary{border-left:4px solid var(--coral);background:#30283a}
.faq-item[open] summary:after{content:"−";color:var(--coral)}
.faq-answer{padding:0 24px 19px;color:var(--muted);font-size:14px}
.cta{padding:64px 0;background:var(--coral);color:var(--ink)}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}
.cta h2{font-size:clamp(27px,4vw,42px);line-height:1.2;margin:0 0 10px}
.cta p{margin:0;max-width:650px}
.cta .btn-secondary{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.site-footer{background:#120f17;padding:58px 0 22px;border-top:1px solid var(--soft-line)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:34px}
.footer-brand p,.site-footer p{color:var(--muted);font-size:13px}
.footer-title{font-weight:800;color:var(--cream);margin-bottom:13px}
.site-footer a:not(.brand){display:block;color:var(--muted);font-size:13px;margin:8px 0;transition:color .2s}
.site-footer a:not(.brand):hover{color:var(--lime)}
.copyright{border-top:1px solid var(--soft-line);margin-top:40px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;color:#81768b;font-size:12px}
@media(max-width:1100px){
 .nav-wrap{gap:12px}.brand{min-width:250px}.nav-menu a{padding:9px 7px;font-size:13px}.nav-entry{margin-left:2px}
}
@media(max-width:900px){
 .nav-menu{display:none;position:absolute;top:76px;left:0;right:0;padding:14px 24px 22px;background:var(--ink);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}
 .nav-menu.open{display:flex}.nav-menu a{padding:12px}.nav-menu a.active::after{left:0;right:auto;width:4px;height:24px;bottom:10px}.menu-toggle{display:block;margin-left:auto}
 .hero-layout,.download-grid,.notice-wrap{grid-template-columns:1fr}.device-art{max-width:620px}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}
}
@media(max-width:650px){
 .container{width:min(var(--max),calc(100% - 32px))}.brand{min-width:0}.brand-text{font-size:14px}.brand-text small{font-size:10px}
 .brand-mark{width:34px;height:34px}.page-hero{padding:40px 0 48px}.page-hero h1{font-size:36px}.lead{font-size:16px}
 .section{padding:64px 0}.section-head{display:block}.section-intro{margin-top:15px}.device-grid,.steps{grid-template-columns:1fr}.phone{right:35px}.download-panel{min-height:390px}
 .cta-inner{display:block}.cta .hero-actions{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr;gap:26px}.footer-brand{grid-column:1/-1}.copyright{display:block}.copyright span{display:block;margin-bottom:5px}
}
@media(max-width:420px){
 .hero-actions .btn{width:100%}.phone{right:22px;transform:scale(.88);transform-origin:top right}.device-art{min-height:280px}.art-copy{left:20px;bottom:23px}.qr-box{right:20px}
}

/* roulang page: category5 */
:root{
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{margin:0;color:var(--cream);background:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;font-size:15px;line-height:1.7;overflow-x:hidden}
        a{color:inherit;text-decoration:none}
        button,input{font:inherit}
        button{border:0;cursor:pointer}
        img{max-width:100%;display:block}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{position:sticky;top:0;z-index:20;background:rgba(24,20,30,.97);border-bottom:1px solid var(--soft-line)}
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--coral);color:var(--ink);border-radius:9px;font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)}
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
        .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
        .nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:.2s ease}
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;background:var(--coral);border-radius:2px}
        .nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
        .page-intro{padding:68px 0 62px;background:var(--plum-deep);border-bottom:1px solid var(--line)}
        .breadcrumb{display:flex;gap:9px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:25px}
        .breadcrumb a:hover{color:var(--coral)}
        .breadcrumb span{color:var(--coral)}
        .eyebrow,.section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.5px}
        .page-intro h1{font-size:clamp(34px,5vw,60px);line-height:1.14;max-width:800px;margin:16px 0 20px;letter-spacing:-1px}
        .page-intro h1 strong{color:var(--coral);font-weight:900}
        .intro-copy{max-width:720px;color:var(--muted);font-size:17px;margin:0}
        .intro-meta{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}
        .badge{display:inline-flex;align-items:center;min-height:30px;padding:3px 11px;border:1px solid var(--line);border-radius:7px;color:var(--cream);font-size:12px}
        .badge.lime{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:800}
        .section{padding:88px 0}
        .section.alt{background:var(--plum-deep)}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
        .section h2{font-size:clamp(27px,3vw,42px);line-height:1.2;margin:10px 0 0}
        .section-intro{color:var(--muted);max-width:510px;margin:0}
        .faq-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:56px;align-items:start}
        .faq-index{position:sticky;top:105px;padding:25px;background:var(--plum);border:1px solid var(--line);border-radius:var(--radius)}
        .faq-index strong{display:block;font-size:25px;line-height:1.25;margin-bottom:10px}
        .faq-index p{color:var(--muted);font-size:13px;margin:0 0 18px}
        .faq-index a{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--soft-line);color:var(--muted);font-size:13px}
        .faq-index a:hover{color:var(--coral)}
        .faq-group{margin-bottom:32px}
        .faq-group-title{display:flex;align-items:center;gap:12px;font-size:20px;margin:0 0 15px}
        .faq-group-title::before{content:"";width:24px;height:4px;background:var(--coral);display:inline-block}
        .faq-group:nth-child(3) .faq-group-title::before{background:var(--lime)}
        .faq-item{border:1px solid var(--line);border-radius:11px;background:var(--plum);margin-bottom:10px;overflow:hidden;transition:border-color .2s,background .2s}
        .faq-item[open]{border-color:var(--coral);background:#30263a}
        .faq-item summary{list-style:none;min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 20px;font-weight:800;cursor:pointer}
        .faq-item summary::-webkit-details-marker{display:none}
        .faq-item summary::after{content:"+";color:var(--lime);font-size:23px;font-weight:400;flex:0 0 auto}
        .faq-item[open] summary::after{content:"−";color:var(--coral)}
        .faq-answer{padding:0 45px 20px 20px;color:var(--muted);font-size:14px}
        .faq-answer p{margin:0}
        .search-panel{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;align-items:center;justify-content:space-between;gap:25px}
        .search-panel h3{font-size:22px;margin:0 0 5px}
        .search-panel p{color:var(--muted);margin:0}
        .search-form{display:flex;min-width:390px;gap:8px}
        .search-form input{width:100%;background:var(--ink);border:1px solid var(--line);border-radius:8px;padding:11px 14px;color:var(--cream);outline:none}
        .search-form input:focus{border-color:var(--coral);box-shadow:0 0 0 3px rgba(255,102,92,.15)}
        .btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
        .btn:hover{transform:translateY(-2px)}
        .btn:focus-visible,.nav-menu a:focus-visible,.faq-item summary:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{border-color:var(--coral);background:#32283c}
        .btn-lime{background:var(--lime);color:var(--ink)}
        .btn-lime:hover{background:#dcff86}
        .guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
        .guide-card{padding:26px;background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);transition:transform .2s,border-color .2s}
        .guide-card:hover{transform:translateY(-4px);border-color:var(--coral)}
        .guide-no{color:var(--coral);font-size:28px;font-weight:900;line-height:1}
        .guide-card h3{font-size:18px;margin:18px 0 8px}
        .guide-card p{color:var(--muted);font-size:14px;margin:0}
        .cta{padding:68px 0;background:var(--coral);color:var(--ink)}
        .cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}
        .cta h2{font-size:clamp(27px,4vw,44px);line-height:1.2;margin:0 0 9px}
        .cta p{margin:0;max-width:650px;color:#3e2425}
        .cta .btn-primary{background:var(--ink);color:var(--cream);box-shadow:none}
        .cta .btn-primary:hover{background:#30263a}
        .site-footer{padding:58px 0 20px;background:var(--plum-deep);border-top:1px solid var(--line)}
        .footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.25fr;gap:35px}
        .footer-brand p,.site-footer p{color:var(--muted);font-size:13px;margin:17px 0 0}
        .footer-title{font-weight:800;margin-bottom:14px;color:var(--cream)}
        .site-footer> .container>div:not(.footer-brand) a{display:block;color:var(--muted);font-size:13px;padding:4px 0}
        .site-footer a:hover{color:var(--coral)}
        .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--soft-line);margin-top:44px;padding-top:18px;color:#8f8499;font-size:12px}
        @media(max-width:1100px){
            .nav-wrap{gap:14px}.brand{min-width:245px}.nav-menu a{padding:9px 7px;font-size:13px}.nav-entry{margin-left:2px}
            .faq-layout{grid-template-columns:230px minmax(0,1fr);gap:30px}
        }
        @media(max-width:768px){
            .container{width:min(var(--max),calc(100% - 32px))}
            .nav-wrap{min-height:68px;justify-content:space-between}.brand{min-width:0}.brand-text{font-size:13px}.brand-text small{font-size:10px}
            .menu-toggle{display:block}.nav-menu{display:none;position:absolute;left:16px;right:16px;top:68px;padding:12px;background:var(--plum-deep);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);align-items:stretch;flex-direction:column}
            .nav-menu.open{display:flex}.nav-menu a{padding:12px 14px}.nav-menu a.active::after{left:14px;right:auto;width:28px;bottom:6px}.nav-entry{margin:5px 0 0;text-align:center}
            .page-intro{padding:48px 0}.page-intro h1{font-size:38px}.intro-copy{font-size:15px}
            .section{padding:64px 0}.section-head{display:block}.section-intro{margin-top:14px}
            .faq-layout{display:block}.faq-index{position:static;margin-bottom:28px}.guide-grid{grid-template-columns:1fr}
            .search-panel,.cta-inner{display:block}.search-form{min-width:0;margin-top:20px}.cta .btn{margin-top:22px}
            .footer-grid{grid-template-columns:repeat(2,1fr);gap:28px}.footer-brand{grid-column:1/-1}
        }
        @media(max-width:520px){
            .brand-mark{width:34px;height:34px}.brand-text{font-size:12px}.brand-text small{font-size:9px}
            .page-intro h1{font-size:31px;letter-spacing:0}.breadcrumb{font-size:12px;flex-wrap:wrap}
            .faq-item summary{font-size:14px;padding:14px 15px}.faq-answer{padding:0 15px 18px}
            .search-panel{padding:22px}.search-form{display:block}.search-form .btn{width:100%;margin-top:8px}
            .footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:5px}
        }

/* roulang page: article */
:root{
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--cream);
            background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            font-size:15px;
            line-height:1.75;
            overflow-x:hidden;
        }
        a{color:inherit;text-decoration:none}
        img{display:block;max-width:100%}
        button,input{font:inherit}
        button{border:0;cursor:pointer}
        :focus-visible{outline:3px solid var(--lime);outline-offset:3px}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{
            position:sticky;top:0;z-index:50;
            background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line);
        }
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{
            width:38px;height:38px;display:grid;place-items:center;
            border-radius:9px;background:var(--coral);color:var(--ink);
            font-weight:900;box-shadow:5px 5px 0 rgba(201,243,106,.7)
        }
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:500}
        .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1}
        .nav-menu a{
            position:relative;padding:10px 12px;color:var(--muted);
            transition:color .2s ease,background .2s ease,transform .2s ease
        }
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active:after{
            content:"";position:absolute;left:12px;right:12px;bottom:1px;
            height:3px;border-radius:2px;background:var(--coral)
        }
        .nav-entry{
            margin-left:8px;border-radius:8px;background:var(--coral);
            color:var(--ink)!important;font-weight:800
        }
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{display:none;padding:8px;background:transparent;color:var(--cream);font-size:25px}
        .article-hero{
            padding:72px 0 66px;
            background:
                linear-gradient(115deg,rgba(24,20,30,.98),rgba(40,33,47,.72)),
                repeating-linear-gradient(90deg,transparent 0 100px,rgba(201,243,106,.045) 101px 102px);
            border-bottom:1px solid var(--soft-line);
        }
        .crumbs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-bottom:30px}
        .crumbs a{color:var(--lime)}
        .crumbs .slash{color:var(--line)}
        .article-heading{max-width:900px}
        .eyebrow,.section-kicker{
            color:var(--lime);font-size:12px;font-weight:800;
            letter-spacing:1.2px
        }
        .article-heading h1{
            margin:17px 0 20px;
            font-size:clamp(32px,5vw,58px);
            line-height:1.2;letter-spacing:-1px
        }
        .article-lead{max-width:820px;color:var(--muted);font-size:18px;margin:0}
        .article-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:26px;color:var(--muted);font-size:13px}
        .meta-tag{
            display:inline-flex;align-items:center;gap:7px;
            color:var(--ink);background:var(--lime);border-radius:6px;
            padding:3px 10px;font-weight:800
        }
        .meta-tag:before{content:"●";font-size:8px}
        .reading-area{padding:76px 0 96px;background:var(--ink)}
        .article-layout{display:grid;grid-template-columns:minmax(0,800px) 290px;gap:68px;align-items:start}
        .article-body{
            min-width:0;padding:42px 46px;
            background:var(--plum);
            border:1px solid var(--line);
            border-radius:var(--radius);
            box-shadow:var(--shadow)
        }
        .article-body>*:first-child{margin-top:0}
        .article-body p{margin:0 0 24px;color:#e5dce6;font-size:16px;line-height:2}
        .article-body h2{
            position:relative;margin:42px 0 19px;padding-left:18px;
            color:var(--cream);font-size:28px;line-height:1.35
        }
        .article-body h2:before{
            content:"";position:absolute;left:0;top:5px;bottom:5px;
            width:4px;border-radius:3px;background:var(--coral)
        }
        .article-body h3{margin:31px 0 13px;color:var(--lime);font-size:21px}
        .article-body ul,.article-body ol{margin:0 0 25px;padding-left:25px;color:#e5dce6}
        .article-body li{padding:5px 0}
        .article-body a{color:var(--coral);text-decoration:underline;text-underline-offset:3px}
        .article-body blockquote{
            margin:30px 0;padding:20px 24px;
            background:#211a28;border-left:4px solid var(--lime);
            border-radius:8px;color:var(--muted)
        }
        .article-body img{margin:28px auto;border-radius:10px}
        .article-body table{width:100%;margin:28px 0;border-collapse:collapse;color:var(--muted)}
        .article-body th,.article-body td{padding:12px;border:1px solid var(--line);text-align:left}
        .article-body th{color:var(--cream);background:var(--plum-deep)}
        .article-empty{text-align:center;padding:55px 20px}
        .article-empty h2{margin:0 0 10px;padding:0}
        .article-empty h2:before{display:none}
        .article-empty p{margin-bottom:25px}
        .side-stack{display:grid;gap:18px;position:sticky;top:105px}
        .side-card{
            padding:24px;background:var(--plum);
            border:1px solid var(--line);border-radius:var(--radius)
        }
        .side-card h2{margin:0 0 17px;font-size:18px}
        .side-card p{margin:0;color:var(--muted);font-size:13px}
        .side-links{display:grid;gap:4px}
        .side-links a{
            display:flex;justify-content:space-between;gap:10px;
            padding:11px 0;color:var(--muted);
            border-bottom:1px solid var(--soft-line);
            transition:color .2s,padding .2s
        }
        .side-links a:last-child{border-bottom:0}
        .side-links a:hover{padding-left:5px;color:var(--coral)}
        .download-mini{border-top:3px solid var(--lime)}
        .download-mini strong{display:block;margin:12px 0 7px;font-size:18px}
        .download-mini .btn{width:100%;margin-top:18px}
        .btn{
            display:inline-flex;align-items:center;justify-content:center;gap:9px;
            min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;
            transition:transform .2s,background .2s,border-color .2s,box-shadow .2s
        }
        .btn:hover{transform:translateY(-2px)}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{border-color:var(--coral);background:#32283c}
        .article-end{
            display:flex;justify-content:space-between;gap:20px;align-items:center;
            margin-top:32px;padding-top:25px;border-top:1px solid var(--line)
        }
        .article-end p{margin:0;color:var(--muted);font-size:13px}
        .download-strip{
            padding:54px 0;background:var(--lime);color:var(--ink)
        }
        .download-strip .strip-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}
        .download-strip h2{margin:0 0 7px;font-size:30px;line-height:1.25}
        .download-strip p{margin:0;max-width:650px;color:#40354b}
        .download-strip .btn-primary{background:var(--ink);color:var(--cream);box-shadow:none}
        .download-strip .btn-primary:hover{background:#32283c}
        .site-footer{padding:58px 0 25px;background:var(--plum-deep);border-top:1px solid var(--soft-line)}
        .footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.15fr;gap:35px}
        .footer-brand p,.site-footer p{color:var(--muted);font-size:13px;line-height:1.8}
        .footer-brand p{max-width:285px;margin:20px 0 0}
        .footer-title{margin-bottom:15px;color:var(--cream);font-weight:800}
        .site-footer .footer-grid>div>a:not(.brand){
            display:block;padding:4px 0;color:var(--muted);font-size:13px;
            transition:color .2s,transform .2s
        }
        .site-footer .footer-grid>div>a:not(.brand):hover{color:var(--coral);transform:translateX(3px)}
        .copyright{
            display:flex;justify-content:space-between;gap:20px;
            margin-top:45px;padding-top:20px;
            border-top:1px solid var(--soft-line);color:#8f8398;font-size:12px
        }
        @media(max-width:1100px){
            .brand{min-width:245px}.nav-menu{gap:0}.nav-menu a{padding-left:8px;padding-right:8px;font-size:13px}
            .article-layout{grid-template-columns:minmax(0,1fr) 250px;gap:35px}
        }
        @media(max-width:820px){
            .container{width:min(var(--max),calc(100% - 34px))}
            .nav-wrap{min-height:68px}.brand{min-width:0;flex:1}.brand-text{font-size:14px}
            .nav-menu{
                display:none;position:absolute;left:17px;right:17px;top:68px;
                padding:12px;background:var(--plum);border:1px solid var(--line);
                border-radius:12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch
            }
            .nav-menu.open{display:flex}
            .nav-menu a{padding:13px 14px;border-radius:7px}
            .nav-menu a.active:after{left:14px;right:auto;bottom:10px;width:3px;height:22px}
            .nav-entry{margin:5px 0 0;text-align:center}
            .menu-toggle{display:block}
            .article-hero{padding:52px 0 48px}
            .article-layout{display:block}
            .side-stack{position:static;margin-top:28px;grid-template-columns:repeat(2,1fr)}
            .download-strip .strip-inner{align-items:flex-start;flex-direction:column}
            .footer-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media(max-width:560px){
            .container{width:calc(100% - 28px)}
            .brand-mark{width:34px;height:34px}.brand-text small{font-size:10px}
            .article-heading h1{font-size:32px;letter-spacing:-.5px}
            .article-lead{font-size:16px}
            .article-body{padding:27px 21px}
            .article-body p{font-size:15px;line-height:1.9}
            .article-body h2{font-size:24px}
            .side-stack{grid-template-columns:1fr}
            .article-end{align-items:flex-start;flex-direction:column}
            .download-strip h2{font-size:25px}
            .download-strip .btn{width:100%}
            .footer-grid{grid-template-columns:1fr;gap:25px}
            .copyright{align-items:flex-start;flex-direction:column;gap:7px;margin-top:30px}
        }

/* roulang page: category1 */
:root{
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;color:var(--cream);background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            font-size:15px;line-height:1.7;overflow-x:hidden
        }
        a{color:inherit;text-decoration:none}
        a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
        button,input{font:inherit}
        button{border:0;cursor:pointer}
        img{display:block;max-width:100%}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{
            position:sticky;top:0;z-index:30;background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line)
        }
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{
            width:38px;height:38px;display:grid;place-items:center;background:var(--coral);
            color:var(--ink);border-radius:9px;font-weight:900;letter-spacing:0;
            box-shadow:5px 5px 0 rgba(201,243,106,.7)
        }
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
        .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1;list-style:none;margin:0;padding:0}
        .nav-menu a{position:relative;padding:10px 12px;color:var(--muted);transition:color .2s ease,background .2s ease,transform .2s ease}
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;background:var(--coral);border-radius:2px}
        .nav-entry{background:var(--coral);color:var(--ink)!important;border-radius:8px;font-weight:800;margin-left:8px}
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{display:none;background:transparent;color:var(--cream);font-size:25px;padding:8px}
        .page-hero{position:relative;padding:52px 0 58px;background:var(--plum-deep);overflow:hidden}
        .page-hero::before{
            content:"";position:absolute;right:-4%;top:0;width:47%;height:100%;
            background:repeating-linear-gradient(90deg,transparent 0 62px,rgba(201,243,106,.07) 63px 64px),
            repeating-linear-gradient(0deg,transparent 0 42px,rgba(255,248,236,.05) 43px 44px);
            clip-path:polygon(24% 0,100% 0,100% 100%,0 100%)
        }
        .breadcrumb{position:relative;display:flex;gap:9px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:31px}
        .breadcrumb a:hover{color:var(--cream)}
        .breadcrumb .current{color:var(--lime)}
        .hero-layout{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:70px;align-items:end}
        .eyebrow,.section-kicker{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:1.4px}
        h1,h2,h3,p{margin-top:0}
        h1{font-size:clamp(34px,5vw,62px);line-height:1.12;letter-spacing:-1px;margin:17px 0 20px;max-width:760px}
        h1 span{color:var(--coral)}
        .hero-lead{max-width:700px;color:var(--muted);font-size:18px;margin-bottom:28px}
        .hero-actions{display:flex;flex-wrap:wrap;gap:12px}
        .btn{
            display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;
            padding:0 20px;border-radius:9px;font-weight:800;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s
        }
        .btn:hover{transform:translateY(-2px)}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{background:#32283c;border-color:var(--coral)}
        .hero-panel{background:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:var(--shadow);transform:rotate(1.5deg)}
        .panel-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}
        .status-dot{display:inline-flex;align-items:center;gap:7px;color:var(--lime)}
        .status-dot::before{content:"";width:8px;height:8px;background:var(--lime);border-radius:50%}
        .panel-title{font-size:25px;font-weight:900;line-height:1.3;margin:24px 0 20px}
        .panel-title b{color:var(--coral)}
        .route-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-top:1px solid var(--soft-line);color:var(--muted)}
        .route-number{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--coral);color:var(--ink);font-weight:900}
        .route-row:nth-child(3) .route-number{background:var(--lime)}
        .section{padding:92px 0}
        .section.alt{background:var(--plum-deep)}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:37px}
        .section h2{font-size:clamp(27px,3vw,42px);line-height:1.2;margin:10px 0 0}
        .section-intro{max-width:540px;color:var(--muted);margin:0}
        .entry-steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--plum)}
        .step{min-height:205px;padding:25px 22px;border-right:1px solid var(--line);position:relative;transition:background .2s}
        .step:last-child{border-right:0}
        .step:hover{background:#32283c}
        .step-no{font-size:13px;color:var(--coral);font-weight:900;letter-spacing:1px}
        .step h3{font-size:19px;margin:18px 0 8px}
        .step p{color:var(--muted);font-size:14px;margin:0}
        .step::after{content:"↗";position:absolute;right:20px;bottom:18px;color:var(--lime);font-size:20px}
        .choice-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
        .choice-main,.choice-card{background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);padding:32px}
        .choice-main{min-height:300px;position:relative;overflow:hidden}
        .choice-main::after{content:"PG";position:absolute;right:30px;bottom:-40px;color:rgba(201,243,106,.08);font-weight:900;font-size:180px;line-height:1}
        .choice-main h3{position:relative;font-size:29px;max-width:440px;margin:18px 0 12px}
        .choice-main p,.choice-card p{position:relative;color:var(--muted);max-width:570px}
        .choice-side{display:grid;gap:20px}
        .choice-card{padding:25px}
        .choice-card h3{font-size:19px;margin:9px 0}
        .tag{display:inline-flex;align-items:center;padding:5px 9px;border-radius:5px;background:rgba(201,243,106,.14);color:var(--lime);font-size:12px;font-weight:800}
        .tag.coral{background:rgba(255,102,92,.15);color:var(--coral)}
        .guide-band{display:grid;grid-template-columns:.75fr 1.25fr;gap:40px;align-items:center}
        .guide-copy h2{max-width:450px}
        .guide-copy p{color:var(--muted);max-width:480px;margin:20px 0 0}
        .check-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
        .check-list li{display:flex;gap:13px;align-items:flex-start;padding:17px 18px;background:var(--plum);border:1px solid var(--line);border-radius:10px;color:var(--muted)}
        .check-list li::before{content:"✓";display:grid;place-items:center;flex:0 0 25px;height:25px;background:var(--lime);color:var(--ink);border-radius:50%;font-weight:900}
        .info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
        .info-card{padding:24px;background:var(--plum);border:1px solid var(--line);border-radius:var(--radius);transition:transform .2s,border-color .2s,box-shadow .2s}
        .info-card:hover{transform:translateY(-4px);border-color:var(--coral);box-shadow:var(--shadow)}
        .info-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--coral);color:var(--ink);font-size:20px;font-weight:900;margin-bottom:19px}
        .info-card:nth-child(2) .info-icon{background:var(--lime)}
        .info-card:nth-child(3) .info-icon{background:#e4b5ff}
        .info-card h3{font-size:18px;margin-bottom:8px}
        .info-card p{color:var(--muted);font-size:14px;margin:0}
        .faq-list{max-width:920px;margin:0 auto;display:grid;gap:10px}
        .faq-item{background:var(--plum);border:1px solid var(--line);border-radius:10px;overflow:hidden}
        .faq-item summary{cursor:pointer;list-style:none;padding:18px 22px;font-size:16px;font-weight:800;position:relative;padding-right:54px}
        .faq-item summary::-webkit-details-marker{display:none}
        .faq-item summary::after{content:"+";position:absolute;right:21px;color:var(--lime);font-size:22px;line-height:1}
        .faq-item[open] summary{background:#32283c;color:var(--cream);border-left:4px solid var(--coral)}
        .faq-item[open] summary::after{content:"−";color:var(--coral)}
        .faq-answer{padding:0 23px 20px;color:var(--muted);font-size:14px}
        .cta{padding:70px 0;background:var(--coral);color:var(--ink)}
        .cta-box{display:flex;align-items:center;justify-content:space-between;gap:30px}
        .cta h2{font-size:clamp(27px,3.5vw,43px);line-height:1.18;margin:0 0 10px}
        .cta p{margin:0;max-width:650px;color:#422629}
        .cta .btn-primary{background:var(--ink);color:var(--cream);box-shadow:none}
        .cta .btn-primary:hover{background:#302536}
        .cta .btn-secondary{border-color:rgba(24,20,30,.4);color:var(--ink);background:transparent}
        .site-footer{background:var(--ink);padding:66px 0 24px;border-top:1px solid var(--soft-line)}
        .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:38px}
        .footer-brand p{color:var(--muted);max-width:300px;margin:20px 0 0;font-size:14px}
        .footer-title{color:var(--lime);font-weight:800;margin-bottom:15px}
        .footer-grid>div:not(.footer-brand) a{display:block;color:var(--muted);font-size:14px;padding:4px 0;transition:color .2s}
        .footer-grid>div:not(.footer-brand) a:hover{color:var(--coral)}
        .footer-grid>div:not(.footer-brand) p{color:var(--muted);font-size:14px;margin:0 0 10px}
        .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--soft-line);margin-top:45px;padding-top:20px;color:#81768d;font-size:12px}
        @media(max-width:1100px){
            .brand{min-width:245px}.nav-wrap{gap:15px}.nav-menu a{padding-left:8px;padding-right:8px;font-size:14px}
            .nav-menu a.active::after{left:8px;right:8px}.hero-layout{gap:35px}
        }
        @media(max-width:850px){
            .menu-toggle{display:block;margin-left:auto}.nav-menu{display:none;position:absolute;left:24px;right:24px;top:70px;padding:12px;background:var(--plum);border:1px solid var(--line);border-radius:12px;flex-direction:column;align-items:stretch;box-shadow:var(--shadow)}
            .nav-menu.open{display:flex}.nav-menu a{padding:12px 14px}.nav-entry{margin:5px 0 0;text-align:center}.hero-layout,.guide-band{grid-template-columns:1fr}.hero-panel{max-width:530px;transform:none}.entry-steps{grid-template-columns:repeat(2,1fr)}.step:nth-child(2){border-right:0}.step:nth-child(-n+2){border-bottom:1px solid var(--line)}.choice-grid{grid-template-columns:1fr}.info-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}
        }
        @media(max-width:560px){
            .container{width:min(var(--max),calc(100% - 32px))}.nav-wrap{min-height:68px}.brand{min-width:0}.brand-text{font-size:14px}.brand-text small{font-size:10px}.brand-mark{width:34px;height:34px}
            .page-hero{padding:34px 0 42px}.breadcrumb{margin-bottom:23px}h1{font-size:36px;letter-spacing:-.5px}.hero-lead{font-size:16px}.hero-actions .btn{width:100%}
            .section{padding:65px 0}.section-head{display:block;margin-bottom:25px}.section-intro{margin-top:15px}.entry-steps{grid-template-columns:1fr}.step{border-right:0;border-bottom:1px solid var(--line)}.step:last-child{border-bottom:0}.step:nth-child(2){border-bottom:1px solid var(--line)}
            .choice-main,.choice-card{padding:24px}.choice-main h3{font-size:25px}.info-grid{grid-template-columns:1fr}.cta{padding:52px 0}.cta-box{display:block}.cta .hero-actions{margin-top:25px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.copyright{display:block;line-height:2.1}.copyright span{display:block}
        }

/* roulang page: category2 */
:root{
            --ink:#18141e;
            --plum:#28212f;
            --plum-deep:#211a28;
            --coral:#ff665c;
            --coral-dark:#d94f49;
            --lime:#c9f36a;
            --cream:#fff8ec;
            --muted:#bdb3c7;
            --line:#40354b;
            --soft-line:rgba(255,248,236,.12);
            --radius:14px;
            --shadow:0 18px 42px rgba(9,5,15,.25);
            --max:1220px;
        }
        *{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--cream);
            background:var(--ink);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
            line-height:1.7;
            font-size:15px;
            overflow-x:hidden
        }
        a{color:inherit;text-decoration:none}
        a:focus-visible,button:focus-visible,summary:focus-visible{
            outline:3px solid var(--lime);
            outline-offset:3px
        }
        button,input{font:inherit}
        button{border:0;cursor:pointer}
        img{max-width:100%;display:block}
        .container{width:min(var(--max),calc(100% - 48px));margin:0 auto}
        .site-header{
            position:sticky;
            top:0;
            z-index:20;
            background:rgba(24,20,30,.97);
            border-bottom:1px solid var(--soft-line)
        }
        .nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:inline-flex;align-items:center;gap:11px;min-width:290px}
        .brand-mark{
            width:38px;height:38px;display:grid;place-items:center;
            background:var(--coral);color:var(--ink);border-radius:9px;
            font-weight:900;letter-spacing:0;
            box-shadow:5px 5px 0 rgba(201,243,106,.7)
        }
        .brand-text{line-height:1.25;font-weight:800;color:var(--cream)}
        .brand-text small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
        .nav-menu{
            display:flex;align-items:center;justify-content:flex-end;gap:6px;
            flex:1;list-style:none;margin:0;padding:0
        }
        .nav-menu a{
            position:relative;padding:10px 12px;color:var(--muted);
            transition:color .2s ease,background .2s ease,transform .2s ease
        }
        .nav-menu a:hover,.nav-menu a.active{color:var(--cream)}
        .nav-menu a.active::after{
            content:"";position:absolute;left:12px;right:12px;bottom:1px;
            height:3px;background:var(--coral);border-radius:2px
        }
        .nav-entry{
            background:var(--coral);color:var(--ink)!important;
            border-radius:8px;font-weight:800;margin-left:8px
        }
        .nav-entry:hover{background:#ff8177;transform:translateY(-1px)}
        .menu-toggle{
            display:none;background:transparent;color:var(--cream);
            font-size:25px;padding:8px
        }
        .page-hero{
            position:relative;
            padding:78px 0 86px;
            background:
                linear-gradient(105deg,rgba(24,20,30,.98),rgba(40,33,47,.72)),
                repeating-linear-gradient(90deg,transparent 0 100px,rgba(201,243,106,.045) 101px 102px);
            overflow:hidden
        }
        .page-hero:after{
            content:"";position:absolute;right:-90px;top:35px;width:430px;height:290px;
            border:1px solid rgba(255,102,92,.34);
            transform:rotate(-12deg);
            box-shadow:-20px 20px 0 rgba(201,243,106,.08),-40px 40px 0 rgba(255,102,92,.06)
        }
        .breadcrumb{
            display:flex;gap:9px;align-items:center;color:var(--muted);
            font-size:13px;margin-bottom:28px
        }
        .breadcrumb a:hover{color:var(--coral)}
        .breadcrumb span{color:var(--coral)}
        .hero-copy-block{max-width:780px;position:relative;z-index:1}
        .eyebrow,.section-kicker{
            color:var(--lime);font-size:12px;font-weight:800;
            letter-spacing:1.5px
        }
        .page-hero h1{
            font-size:clamp(36px,5vw,64px);line-height:1.12;
            margin:17px 0 22px;letter-spacing:-1px
        }
        .page-hero h1 em{font-style:normal;color:var(--coral)}
        .hero-lead{font-size:18px;color:var(--muted);max-width:700px;margin:0}
        .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:31px}
        .btn{
            display:inline-flex;justify-content:center;align-items:center;gap:9px;
            min-height:46px;padding:0 20px;border-radius:9px;font-weight:800;
            transition:transform .2s,background .2s,border-color .2s,box-shadow .2s
        }
        .btn:hover{transform:translateY(-2px)}
        .btn-primary{background:var(--coral);color:var(--ink);box-shadow:0 8px 0 rgba(217,79,73,.22)}
        .btn-primary:hover{background:#ff8177}
        .btn-secondary{background:var(--plum);border:1px solid var(--line);color:var(--cream)}
        .btn-secondary:hover{border-color:var(--coral);background:#32283c}
        .hero-facts{display:flex;flex-wrap:wrap;gap:20px;margin-top:25px;color:var(--muted);font-size:13px}
        .hero-facts span:before{content:"•";color:var(--lime);margin-right:7px}
        .section{padding:92px 0}
        .section.alt{background:var(--plum-deep)}
        .section-head{
            display:flex;justify-content:space-between;align-items:end;
            gap:30px;margin-bottom:36px
        }
        .section h2{
            font-size:clamp(27px,3vw,42px);line-height:1.2;
            margin:10px 0 0;letter-spacing:-.5px
        }
        .section-intro{color:var(--muted);max-width:540px;margin:0}
        .platform-layout{
            display:grid;grid-template-columns:1.15fr .85fr;gap:18px
        }
        .platform-main,.platform-side article,.index-panel{
            background:var(--plum);border:1px solid var(--line);
            border-radius:var(--radius);box-shadow:var(--shadow)
        }
        .platform-main{padding:38px;min-height:365px;position:relative;overflow:hidden}
        .platform-main:after{
            content:"PG";position:absolute;right:25px;bottom:-34px;
            font-size:170px;font-weight:900;color:rgba(255,102,92,.08);
            line-height:1
        }
        .badge{
            display:inline-flex;align-items:center;min-height:27px;
            padding:0 10px;background:rgba(201,243,106,.14);
            color:var(--lime);border:1px solid rgba(201,243,106,.3);
            border-radius:6px;font-size:12px;font-weight:800
        }
        .platform-main h3{font-size:30px;line-height:1.25;margin:22px 0 12px;position:relative;z-index:1}
        .platform-main p{color:var(--muted);max-width:570px;position:relative;z-index:1}
        .feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin:27px 0;position:relative;z-index:1}
        .feature-list div{padding:12px 14px;border-left:3px solid var(--coral);background:rgba(24,20,30,.42)}
        .feature-list div:nth-child(even){border-color:var(--lime)}
        .feature-list strong{display:block;font-size:14px}
        .feature-list small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
        .platform-side{display:grid;gap:18px}
        .platform-side article{padding:27px;box-shadow:none}
        .platform-side article:nth-child(2){background:#30263a}
        .platform-side h3{font-size:21px;margin:13px 0 7px}
        .platform-side p{color:var(--muted);font-size:14px;margin:0 0 17px}
        .text-link{color:var(--coral);font-weight:800}
        .text-link:hover{color:#ff9b92}
        .index-panel{padding:30px}
        .index-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
        .index-card{
            min-height:188px;padding:23px;background:#211a28;
            border:1px solid var(--line);border-radius:11px;
            transition:transform .2s,border-color .2s,background .2s
        }
        .index-card:hover{transform:translateY(-4px);border-color:var(--coral);background:#30263a}
        .index-number{color:var(--coral);font-size:14px;font-weight:900}
        .index-card h3{font-size:18px;margin:13px 0 8px}
        .index-card p{color:var(--muted);font-size:13px;margin:0}
        .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
        .flow-item{padding:28px 24px;border-right:1px solid var(--line);position:relative}
        .flow-item:last-child{border-right:0}
        .flow-item:before{content:"";display:block;width:28px;height:4px;background:var(--coral);margin-bottom:17px}
        .flow-item:nth-child(even):before{background:var(--lime)}
        .flow-no{color:var(--muted);font-size:12px}
        .flow-item h3{font-size:18px;margin:8px 0}
        .flow-item p{font-size:13px;color:var(--muted);margin:0}
        .compare{
            display:grid;grid-template-columns:1fr 1fr;gap:18px
        }
        .compare-card{padding:30px;border-radius:var(--radius);border:1px solid var(--line);background:var(--plum)}
        .compare-card.highlight{background:var(--coral);color:var(--ink);border-color:var(--coral)}
        .compare-card h3{font-size:22px;margin:0 0 12px}
        .compare-card p{margin:0 0 18px;color:var(--muted)}
        .highlight p{color:#3e2224}
        .check-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
        .check-list li{position:relative;padding-left:24px;color:var(--muted);font-size:14px}
        .highlight .check-list li{color:#3e2224}
        .check-list li:before{content:"✓";position:absolute;left:0;color:var(--lime);font-weight:900}
        .highlight .check-list li:before{color:var(--ink)}
        .faq-list{max-width:900px;margin:0 auto;display:grid;gap:10px}
        .faq-list details{
            border:1px solid var(--line);border-radius:10px;
            background:var(--plum);overflow:hidden
        }
        .faq-list details[open]{border-color:var(--coral)}
        .faq-list summary{
            list-style:none;cursor:pointer;padding:19px 23px;
            font-weight:800;position:relative;padding-right:54px
        }
        .faq-list summary::-webkit-details-marker{display:none}
        .faq-list summary:after{
            content:"+";position:absolute;right:22px;color:var(--lime);
            font-size:22px;top:14px
        }
        .faq-list details[open] summary:after{content:"−";color:var(--coral)}
        .faq-answer{padding:0 23px 21px;color:var(--muted);font-size:14px;max-width:800px}
        .cta{
            padding:55px 0;background:var(--coral);color:var(--ink)
        }
        .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
        .cta h2{font-size:clamp(26px,3vw,40px);line-height:1.2;margin:0 0 10px}
        .cta p{margin:0;max-width:620px;color:#4b292b}
        .cta .btn-secondary{background:var(--ink);border-color:var(--ink);color:var(--cream)}
        .cta .btn-secondary:hover{background:#30263a}
        .site-footer{background:#120f17;padding:62px 0 20px;border-top:1px solid var(--soft-line)}
        .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:40px}
        .footer-brand p{color:var(--muted);font-size:13px;max-width:285px;margin:20px 0 0}
        .site-footer .brand{min-width:0}
        .footer-title{font-weight:800;color:var(--cream);margin-bottom:15px}
        .site-footer> .container:not(.footer-grid) a,.footer-grid>div:not(.footer-brand) a{
            display:block;color:var(--muted);font-size:13px;margin:8px 0;
            transition:color .2s
        }
        .footer-grid a:hover{color:var(--coral)}
        .footer-grid p{color:var(--muted);font-size:13px;margin:0 0 13px}
        .copyright{
            display:flex;justify-content:space-between;gap:20px;
            border-top:1px solid var(--soft-line);margin-top:45px;padding-top:18px;
            color:#81758c;font-size:12px
        }
        @media(max-width:1100px){
            .brand{min-width:245px}
            .nav-wrap{gap:12px}
            .nav-menu{gap:0}
            .nav-menu a{padding-left:8px;padding-right:8px;font-size:14px}
            .nav-menu a.active:after{left:8px;right:8px}
        }
        @media(max-width:900px){
            .nav-menu{
                display:none;position:absolute;left:24px;right:24px;top:70px;
                padding:12px;background:var(--plum);border:1px solid var(--line);
                border-radius:12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch
            }
            .nav-menu.open{display:flex}
            .nav-menu a{padding:13px 15px}
            .nav-menu a.active:after{left:15px;right:auto;width:30px;bottom:5px}
            .nav-entry{margin:4px 0 0;text-align:center}
            .menu-toggle{display:block;margin-left:auto}
            .platform-layout,.compare{grid-template-columns:1fr}
            .index-grid{grid-template-columns:repeat(2,1fr)}
            .footer-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media(max-width:700px){
            .container{width:min(var(--max),calc(100% - 32px))}
            .page-hero{padding:54px 0 62px}
            .page-hero h1{font-size:38px}
            .section{padding:66px 0}
            .section-head{display:block;margin-bottom:26px}
            .section-intro{margin-top:15px}
            .platform-main{padding:26px}
            .feature-list,.index-grid{grid-template-columns:1fr}
            .flow{grid-template-columns:1fr;border-bottom:0}
            .flow-item{border-right:0;border-bottom:1px solid var(--line)}
            .flow-item:last-child{border-bottom:0}
            .cta-inner{display:block}
            .cta .hero-actions{margin-top:24px}
        }
        @media(max-width:520px){
            .brand-text{font-size:14px}
            .brand-text small{font-size:10px}
            .brand-mark{width:34px;height:34px}
            .brand{gap:8px}
            .hero-actions .btn{width:100%}
            .hero-facts{display:block}
            .hero-facts span{display:block;margin:5px 0}
            .platform-main h3{font-size:25px}
            .footer-grid{grid-template-columns:1fr;gap:28px}
            .copyright{display:block;line-height:2}
            .copyright span{display:block}
        }

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