/* roulang page: index */
:root {
            --bg: #f5f3ef;
            --panel: #ffffff;
            --ink: #17191e;
            --muted: #686b73;
            --soft: #92949a;
            --line: #ddd ad4;
            --line: #dddAD4;
            --rose: #d9466d;
            --rose-dark: #b92f55;
            --rose-soft: #fbe8ee;
            --mint: #35b89c;
            --mint-soft: #e2f6f1;
            --purple: #776fa8;
            --dark: #202229;
            --dark-2: #292c35;
            --warning: #d98a32;
            --radius-lg: 20px;
            --radius-md: 15px;
            --radius-sm: 11px;
            --shadow: 0 14px 38px rgba(23, 25, 30, .07);
            --shadow-hover: 0 18px 42px rgba(23, 25, 30, .12);
            --ease: 220ms ease;
        }

        *, *::before, *::after { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--ink);
            background: var(--bg);
            font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
            font-size: 16px;
            line-height: 1.72;
            overflow-x: hidden;
        }
        a { color: inherit; text-decoration: none; transition: color var(--ease), background var(--ease), transform var(--ease), border-color var(--ease); }
        img { display: block; max-width: 100%; height: auto; }
        button, input, select, textarea { font: inherit; }
        button { cursor: pointer; }
        h1, h2, h3, p { margin-top: 0; }
        h1, h2, h3 { color: var(--ink); font-weight: 750; letter-spacing: -.035em; }
        h1 { font-size: clamp(2.25rem, 5vw, 4rem); line-height: 1.13; }
        h2 { font-size: clamp(1.8rem, 3.2vw, 2.65rem); line-height: 1.22; }
        h3 { font-size: 1.22rem; line-height: 1.35; }
        .container { max-width: 1280px; }
        .section { padding: 96px 0; }
        .section-tight { padding: 68px 0; }
        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            color: var(--rose-dark);
            font-size: .77rem;
            font-weight: 800;
            letter-spacing: .13em;
            text-transform: uppercase;
        }
        .eyebrow::before {
            content: "";
            width: 25px;
            height: 2px;
            background: var(--rose);
        }
        .section-heading { max-width: 680px; margin-bottom: 42px; }
        .section-heading p { color: var(--muted); max-width: 620px; margin-bottom: 0; }
        .muted { color: var(--muted); }
        .tiny { color: var(--soft); font-size: .78rem; }
        .mono { font-variant-numeric: tabular-nums; letter-spacing: .05em; }

        .site-header {
            position: sticky;
            z-index: 1000;
            top: 0;
            background: rgba(255,255,255,.9);
            border-bottom: 1px solid rgba(221,218,212,.9);
            backdrop-filter: blur(14px);
        }
        .navbar { min-height: 80px; padding: 14px 0; }
        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            font-size: 1.05rem;
            font-weight: 800;
            white-space: nowrap;
        }
        .brand-mark {
            position: relative;
            display: inline-grid;
            place-items: center;
            width: 34px;
            height: 34px;
            border: 2px solid var(--rose);
            border-radius: 9px;
        }
        .brand-mark::before, .brand-mark::after {
            content: "";
            position: absolute;
            width: 10px;
            height: 10px;
            border: 2px solid var(--mint);
            border-radius: 3px;
        }
        .brand-mark::before { top: -6px; right: -6px; background: var(--bg); }
        .brand-mark::after { bottom: -6px; left: -6px; background: var(--bg); }
        .nav-link {
            position: relative;
            padding: 9px 14px !important;
            color: var(--muted) !important;
            font-size: .93rem;
            font-weight: 700;
        }
        .nav-link:hover, .nav-link.active { color: var(--ink) !important; }
        .nav-link.active::after {
            content: "";
            position: absolute;
            right: 14px;
            bottom: 1px;
            left: 14px;
            height: 3px;
            border-radius: 3px;
            background: var(--rose);
        }
        .nav-action { margin-left: 12px; }

        .btn-main, .btn-dark, .btn-quiet {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 48px;
            padding: 11px 20px;
            border: 1px solid transparent;
            border-radius: var(--radius-sm);
            font-weight: 750;
            transition: transform var(--ease), background var(--ease), box-shadow var(--ease), border-color var(--ease);
        }
        .btn-main { color: #fff; background: var(--rose); box-shadow: 0 8px 18px rgba(217,70,109,.18); }
        .btn-main:hover { color: #fff; background: var(--rose-dark); transform: translateY(-2px); box-shadow: 0 11px 24px rgba(217,70,109,.28); }
        .btn-dark { color: #fff; background: var(--dark); }
        .btn-dark:hover { color: #fff; background: #343742; transform: translateY(-2px); }
        .btn-quiet { color: var(--ink); background: transparent; border-color: #cfcac2; }
        .btn-quiet:hover { color: var(--rose-dark); background: var(--rose-soft); border-color: var(--rose); }
        .btn-main:focus-visible, .btn-dark:focus-visible, .btn-quiet:focus-visible, .nav-link:focus-visible, .brand:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible {
            outline: 3px solid rgba(217,70,109,.28);
            outline-offset: 3px;
        }
        .btn-main:active, .btn-dark:active, .btn-quiet:active { transform: translateY(1px); }
        .btn-main:disabled { opacity: .55; cursor: not-allowed; transform: none; }

        .hero {
            position: relative;
            padding: 84px 0 66px;
            overflow: hidden;
        }
        .hero::before {
            content: "";
            position: absolute;
            z-index: -1;
            top: 0;
            right: -8%;
            width: 48%;
            height: 100%;
            opacity: .55;
            background-image: linear-gradient(rgba(119,111,168,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(119,111,168,.09) 1px, transparent 1px);
            background-size: 30px 30px;
            transform: skewX(-12deg);
        }
        .hero-copy { max-width: 720px; margin: 0 auto 42px; text-align: center; }
        .hero-copy h1 { max-width: 780px; margin: 16px auto 20px; }
        .hero-copy p { max-width: 700px; margin: 0 auto 28px; color: var(--muted); font-size: 1.08rem; }
        .search-shell {
            display: flex;
            max-width: 720px;
            margin: 0 auto 22px;
            padding: 7px;
            background: #fff;
            border: 1px solid #d6d1ca;
            border-radius: 15px;
            box-shadow: var(--shadow);
        }
        .search-shell input {
            flex: 1;
            min-width: 0;
            padding: 10px 16px;
            color: var(--ink);
            background: transparent;
            border: 0;
            outline: 0;
        }
        .search-shell .btn-main { min-height: 44px; padding: 9px 24px; }
        .quick-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px; }
        .quick-link {
            padding: 6px 12px;
            color: var(--muted);
            background: rgba(255,255,255,.72);
            border: 1px solid #d9d4cc;
            border-radius: 99px;
            font-size: .82rem;
        }
        .quick-link:hover { color: var(--rose-dark); border-color: var(--rose); background: var(--rose-soft); }
        .hero-board {
            display: grid;
            grid-template-columns: 1.45fr .8fr .8fr;
            gap: 14px;
            max-width: 1080px;
            margin: 0 auto;
        }
        .board-card {
            position: relative;
            min-height: 154px;
            padding: 24px;
            background: var(--panel);
            border: 1px solid #ddd8d0;
            border-radius: var(--radius-md);
            box-shadow: 0 7px 20px rgba(23,25,30,.04);
        }
        .board-card.main-board { min-height: 218px; grid-row: span 2; background: var(--dark); color: #fff; border-color: var(--dark); }
        .board-card h3 { margin: 7px 0 12px; }
        .main-board h3 { color: #fff; }
        .board-index { color: var(--rose); font-size: .75rem; font-weight: 800; letter-spacing: .13em; }
        .main-board .board-index { color: #ff9eb8; }
        .board-number { display: block; margin-top: 24px; font-size: 3.2rem; font-weight: 800; line-height: 1; }
        .board-list { list-style: none; padding: 0; margin: 18px 0 0; }
        .board-list li { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.13); color: #d7d8dd; font-size: .85rem; }
        .status-dot { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--mint); }
        .stat-value { display: block; margin-top: 12px; font-size: 2rem; font-weight: 800; line-height: 1; }
        .stat-value.rose { color: var(--rose); }
        .stat-value.mint { color: var(--mint); }
        .bar-set { display: flex; align-items: end; gap: 6px; height: 42px; margin-top: 18px; }
        .bar-set i { display: block; width: 12px; background: var(--rose); border-radius: 3px 3px 0 0; }
        .bar-set i:nth-child(1) { height: 38%; opacity: .45; }
        .bar-set i:nth-child(2) { height: 66%; opacity: .65; }
        .bar-set i:nth-child(3) { height: 52%; opacity: .75; }
        .bar-set i:nth-child(4) { height: 88%; }
        .bar-set i:nth-child(5) { height: 73%; opacity: .85; }

        .metric-strip { padding: 25px 0; background: var(--dark); color: #fff; }
        .metric-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
        .metric { padding-right: 20px; border-right: 1px solid rgba(255,255,255,.13); }
        .metric:last-child { border-right: 0; }
        .metric strong { display: block; color: #fff; font-size: 1.55rem; line-height: 1.2; }
        .metric span { color: #aeb1ba; font-size: .83rem; }

        .matrix-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
        .matrix-card {
            position: relative;
            display: flex;
            min-height: 214px;
            flex-direction: column;
            justify-content: space-between;
            padding: 27px;
            background: var(--panel);
            border: 1px solid #ddd8d0;
            border-radius: var(--radius-md);
            transition: transform var(--ease), box-shadow var(--ease), border-color var(--ease);
        }
        .matrix-card:hover { transform: translateY(-4px); border-color: var(--rose); box-shadow: var(--shadow-hover); }
        .matrix-card:nth-child(1) { grid-column: span 6; min-height: 260px; }
        .matrix-card:nth-child(2), .matrix-card:nth-child(3) { grid-column: span 3; }
        .matrix-card:nth-child(4) { grid-column: span 4; }
        .matrix-card:nth-child(5) { grid-column: span 8; }
        .matrix-card h3 { margin: 12px 0 9px; }
        .matrix-card p { color: var(--muted); margin-bottom: 18px; font-size: .93rem; }
        .matrix-no { color: var(--rose); font-size: .78rem; font-weight: 800; letter-spacing: .12em; }
        .matrix-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--rose-dark); font-size: .87rem; font-weight: 750; }
        .tag-row { display: flex; flex-wrap: wrap; gap: 7px; }
        .tag { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 9px; color: var(--purple); background: #efedf7; border-radius: 99px; font-size: .75rem; }
        .tag.mint { color: #207c6a; background: var(--mint-soft); }
        .tag.rose { color: var(--rose-dark); background: var(--rose-soft); }

        .compare-wrap { display: grid; grid-template-columns: 1fr 1.25fr 1.25fr; overflow: hidden; background: #fff; border: 1px solid #ddd8d0; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
        .compare-col { padding: 28px; border-right: 1px solid #e7e2db; }
        .compare-col:last-child { border-right: 0; }
        .compare-col.recommended { background: var(--rose-soft); border-top: 3px solid var(--rose); }
        .compare-col h3 { margin-bottom: 25px; }
        .compare-label { display: flex; align-items: center; min-height: 48px; color: var(--muted); border-bottom: 1px solid #eeeae5; font-size: .9rem; }
        .compare-col:not(:first-child) .compare-label { color: var(--ink); }
        .compare-mark { color: var(--mint); font-weight: 800; }
        .compare-mark.neutral { color: var(--purple); }

        .update-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 26px; align-items: start; }
        .update-list { border-top: 1px solid #d9d4cc; }
        .update-item { display: grid; grid-template-columns: 105px 1fr 25px; gap: 22px; align-items: center; padding: 22px 0; border-bottom: 1px solid #d9d4cc; }
        .update-date { color: var(--rose-dark); font-size: .8rem; font-weight: 800; }
        .update-item h3 { margin-bottom: 5px; font-size: 1.06rem; }
        .update-item p { margin: 0; color: var(--muted); font-size: .9rem; }
        .update-arrow { color: var(--rose); font-size: 1.25rem; }
        .feature-panel { padding: 30px; background: var(--dark); color: #fff; border-radius: var(--radius-lg); }
        .feature-panel h3 { color: #fff; margin: 8px 0 12px; }
        .feature-panel p { color: #c4c6cd; font-size: .92rem; }
        .feature-line { display: flex; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.13); color: #e3e4e8; font-size: .88rem; }
        .feature-line span:last-child { color: #ff9eb8; }

        .faq-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: 60px; }
        .faq-intro p { color: var(--muted); }
        .accordion-item { overflow: hidden; margin-bottom: 11px; background: #eeece8; border: 1px solid #ded9d1 !important; border-radius: var(--radius-sm) !important; }
        .accordion-button { padding: 19px 21px; color: var(--ink); background: transparent; box-shadow: none !important; font-weight: 750; }
        .accordion-button:not(.collapsed) { color: var(--rose-dark); background: #fff; border-left: 3px solid var(--rose); }
        .accordion-button::after { width: 12px; height: 12px; background-size: 12px; }
        .accordion-body { padding: 0 23px 20px; color: var(--muted); background: #fff; font-size: .93rem; }

        .contact-panel { position: relative; overflow: hidden; padding: 55px; color: #fff; background: var(--dark); border-radius: var(--radius-lg); }
        .contact-panel::after { content: ""; position: absolute; inset: 0 0 0 52%; opacity: .2; background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; }
        .contact-panel h2 { color: #fff; }
        .contact-panel p { color: #c2c4ca; }
        .contact-copy { position: relative; z-index: 1; padding-right: 30px; }
        .privacy-note { color: #9da0aa; font-size: .78rem; }
        .form-card { position: relative; z-index: 1; padding: 26px; background: #fff; border-radius: 15px; }
        .form-label { margin-bottom: 6px; color: var(--ink); font-size: .85rem; font-weight: 750; }
        .form-control, .form-select { min-height: 49px; color: var(--ink); background: #faf9f7; border: 1px solid #d8d3cb; border-radius: 10px; }
        textarea.form-control { min-height: 128px; resize: vertical; }
        .form-control:focus, .form-select:focus { border-color: var(--rose); box-shadow: 0 0 0 3px rgba(217,70,109,.12); }
        .form-hint { min-height: 22px; margin-top: 5px; color: var(--muted); font-size: .76rem; }
        .form-message { display: none; padding: 10px 12px; color: #8d5b19; background: #fff3df; border-radius: 9px; font-size: .82rem; }
        .form-message.show { display: block; }

        footer { padding: 62px 0 25px; color: #d8d9de; background: var(--ink); }
        footer .brand { color: #fff; }
        footer .brand-mark { background: transparent; }
        .footer-grid { display: grid; grid-template-columns: 1.4fr .8fr .9fr .9fr; gap: 42px; padding-bottom: 46px; }
        .footer-intro { max-width: 310px; color: #9fa2ab; font-size: .88rem; }
        .footer-title { margin-bottom: 15px; color: #fff; font-size: .85rem; font-weight: 800; }
        .footer-links { display: grid; gap: 8px; color: #aeb0b8; font-size: .86rem; }
        .footer-links a:hover { color: #ff9eb8; }
        .footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 20px; color: #858891; border-top: 1px solid rgba(255,255,255,.12); font-size: .78rem; }
        .back-top { color: #fff; }
        .back-top:hover { color: #ff9eb8; }

        @media (max-width: 991.98px) {
            .navbar-collapse { padding: 15px 0 7px; }
            .nav-link { padding: 12px 0 !important; border-bottom: 1px solid #ebe7e1; }
            .nav-link.active::after { right: auto; bottom: 5px; left: 0; width: 26px; }
            .nav-action { margin: 14px 0 0; }
            .nav-action .btn-main { width: 100%; }
            .hero-board { grid-template-columns: 1.2fr 1fr; }
            .board-card.main-board { grid-row: span 2; }
            .matrix-card:nth-child(1) { grid-column: span 7; }
            .matrix-card:nth-child(2), .matrix-card:nth-child(3) { grid-column: span 5; }
            .matrix-card:nth-child(4), .matrix-card:nth-child(5) { grid-column: span 6; }
            .faq-layout, .update-layout { grid-template-columns: 1fr; gap: 32px; }
            .footer-grid { grid-template-columns: repeat(2, 1fr); }
        }
        @media (max-width: 767.98px) {
            .section { padding: 68px 0; }
            .hero { padding: 60px 0 48px; }
            .hero-copy p { font-size: 1rem; }
            .hero-board { grid-template-columns: 1fr 1fr; }
            .board-card.main-board { grid-column: span 2; grid-row: auto; }
            .metric-row { grid-template-columns: repeat(2, 1fr); gap: 20px; }
            .metric:nth-child(2) { border-right: 0; }
            .matrix-grid { grid-template-columns: 1fr; }
            .matrix-card:nth-child(n) { grid-column: auto; min-height: 190px; }
            .compare-wrap { grid-template-columns: 1fr; }
            .compare-col { border-right: 0; border-bottom: 1px solid #e7e2db; }
            .compare-col:last-child { border-bottom: 0; }
            .update-item { grid-template-columns: 82px 1fr 18px; gap: 12px; }
            .contact-panel { padding: 34px 22px; }
            .contact-copy { padding-right: 0; margin-bottom: 28px; }
            .contact-panel::after { left: 0; opacity: .1; }
            .footer-grid { gap: 28px 20px; }
            .footer-bottom { flex-direction: column; }
        }
        @media (max-width: 520px) {
            .container { padding-right: 16px; padding-left: 16px; }
            .brand { font-size: .91rem; }
            .brand-mark { width: 30px; height: 30px; }
            h1 { font-size: 2.15rem; }
            .search-shell { display: block; padding: 8px; }
            .search-shell input { width: 100%; min-height: 42px; }
            .search-shell .btn-main { width: 100%; }
            .hero-board { display: block; }
            .board-card { margin-top: 12px; min-height: 140px; }
            .board-card.main-board { min-height: 210px; }
            .metric-row { gap: 15px; }
            .metric { padding-right: 10px; }
            .metric strong { font-size: 1.25rem; }
            .section-heading { margin-bottom: 30px; }
            .update-item { grid-template-columns: 1fr 20px; }
            .update-date { grid-column: 1 / -1; }
            .footer-grid { grid-template-columns: 1fr 1fr; }
        }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
        }

/* roulang page: category1 */
:root{
 --bg:#f5f3ef;--panel:#fff;--ink:#17191e;--muted:#686b73;--soft:#92949a;
 --line:#dddAD4;--rose:#d9466d;--rose-dark:#b92f55;--rose-soft:#fbe8ee;
 --mint:#35b89c;--mint-soft:#e2f6f1;--purple:#776fa8;--dark:#202229;
 --dark-2:#292c35;--warning:#d98a32;--radius-lg:20px;--radius-md:15px;
 --radius-sm:11px;--shadow:0 14px 38px rgba(23,25,30,.07);
 --shadow-hover:0 18px 42px rgba(23,25,30,.12);--ease:220ms ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.72;overflow-x:hidden}
a{color:inherit;text-decoration:none;transition:color var(--ease),background var(--ease),transform var(--ease),border-color var(--ease)}
img{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.container{max-width:1280px}
h1,h2,h3,h4{font-weight:800;line-height:1.25;letter-spacing:-.025em}
h1{font-size:clamp(2.25rem,4.2vw,3.6rem);margin:15px 0 18px}
h2{font-size:clamp(1.8rem,3vw,2.5rem);margin:0 0 14px}
h3{font-size:1.25rem;margin:0 0 8px}
p{margin:0 0 1rem}
.muted{color:var(--muted)}
.site-header{position:sticky;z-index:1000;top:0;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(221,218,212,.9);backdrop-filter:blur(14px)}
.navbar{min-height:80px;padding:14px 0}
.brand{display:inline-flex;align-items:center;gap:12px;font-size:1.05rem;font-weight:800;white-space:nowrap}
.brand-mark{position:relative;display:inline-grid;place-items:center;width:34px;height:34px;border:2px solid var(--rose);border-radius:9px}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;width:10px;height:10px;border:2px solid var(--mint);border-radius:3px}
.brand-mark:before{top:-6px;right:-6px;background:var(--bg)}
.brand-mark:after{bottom:-6px;left:-6px;background:var(--bg)}
.nav-link{position:relative;padding:9px 14px!important;color:var(--muted)!important;font-size:.93rem;font-weight:700}
.nav-link:hover,.nav-link.active{color:var(--ink)!important}
.nav-link.active:after{content:"";position:absolute;right:14px;bottom:1px;left:14px;height:3px;border-radius:3px;background:var(--rose)}
.nav-action{margin-left:12px}
.btn-main,.btn-dark,.btn-quiet{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 20px;border:1px solid transparent;border-radius:var(--radius-sm);font-weight:750;transition:transform var(--ease),background var(--ease),box-shadow var(--ease),border-color var(--ease)}
.btn-main{color:#fff;background:var(--rose);box-shadow:0 8px 18px rgba(217,70,109,.18)}
.btn-main:hover{color:#fff;background:var(--rose-dark);transform:translateY(-2px);box-shadow:0 11px 24px rgba(217,70,109,.28)}
.btn-dark{color:#fff;background:var(--dark)}
.btn-dark:hover{color:#fff;background:#343742;transform:translateY(-2px)}
.btn-quiet{color:var(--ink);background:transparent;border-color:#cfcac2}
.btn-quiet:hover{color:var(--rose-dark);background:var(--rose-soft);border-color:var(--rose)}
.btn-main:focus-visible,.btn-dark:focus-visible,.btn-quiet:focus-visible,.nav-link:focus-visible,.brand:focus-visible,input:focus-visible,select:focus-visible,button:focus-visible{outline:3px solid rgba(217,70,109,.28);outline-offset:3px}
.btn-main:active,.btn-dark:active,.btn-quiet:active{transform:translateY(1px)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--rose-dark);font-size:.77rem;font-weight:800;letter-spacing:.13em}
.eyebrow:before{content:"";width:25px;height:2px;background:var(--rose)}
.page-head{position:relative;padding:76px 0 58px;overflow:hidden}
.page-head:after{content:"";position:absolute;z-index:-1;right:-7%;top:0;width:42%;height:100%;opacity:.55;background-image:linear-gradient(rgba(119,111,168,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(119,111,168,.09) 1px,transparent 1px);background-size:30px 30px;transform:skewX(-12deg)}
.page-head p{max-width:690px;color:var(--muted);font-size:1.08rem}
.breadcrumb{margin:0 0 18px;font-size:.84rem;color:var(--muted)}
.breadcrumb-item+.breadcrumb-item:before{color:var(--rose);content:"/"}
.head-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.badge-soft,.tag{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;font-size:.78rem;font-weight:700;color:var(--muted);background:#fff}
.badge-soft.mint,.tag.mint{color:#157d6b;background:var(--mint-soft);border-color:#bce9df}
.badge-soft.rose,.tag.rose{color:var(--rose-dark);background:var(--rose-soft);border-color:#f1b9c9}
.badge-soft.purple{color:#5c5689;background:#eeecf7;border-color:#d5d1e8}
.head-panel{height:100%;padding:25px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow)}
.trace-title{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;font-weight:800}
.trace-list{position:relative;margin:22px 0 0;padding:0;list-style:none}
.trace-list:before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:1px;background:#d8d3cc}
.trace-list li{position:relative;display:flex;gap:14px;align-items:flex-start;padding:0 0 17px;font-size:.86rem}
.trace-dot{position:relative;z-index:1;flex:none;width:13px;height:13px;margin-top:5px;border:3px solid var(--bg);border-radius:50%;background:var(--rose);box-shadow:0 0 0 1px var(--rose)}
.trace-dot.mint{background:var(--mint);box-shadow:0 0 0 1px var(--mint)}
.trace-date{display:block;color:var(--soft);font-size:.75rem;margin-top:3px}
.section{padding:88px 0}
.section-tight{padding:64px 0}
.section-heading{max-width:700px;margin-bottom:34px}
.section-heading p{color:var(--muted);max-width:650px}
.filter-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:0 8px 24px rgba(23,25,30,.04);margin-bottom:26px}
.search-box{position:relative;flex:1 1 280px}
.search-box input{width:100%;height:46px;padding:8px 15px 8px 42px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.search-box span{position:absolute;left:15px;top:8px;color:var(--muted);font-size:1.15rem}
.filter-select{height:46px;min-width:150px;padding:7px 34px 7px 13px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:var(--bg)}
.filter-pills{display:flex;gap:7px;flex-wrap:wrap}
.filter-pill{padding:8px 13px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--muted);font-size:.83rem;font-weight:700}
.filter-pill:hover,.filter-pill.active{color:var(--rose-dark);border-color:var(--rose);background:var(--rose-soft)}
.index-list{display:grid;gap:13px}
.index-item{display:grid;grid-template-columns:82px minmax(0,1fr) 132px 30px;align-items:center;gap:20px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--radius-md);background:rgba(255,255,255,.65);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease),background var(--ease)}
.index-item:hover{background:#fff;border-color:#e9a5b8;box-shadow:var(--shadow-hover);transform:translateY(-3px)}
.index-number{font-size:1.55rem;font-weight:800;color:var(--purple);font-variant-numeric:tabular-nums}
.index-date{display:block;color:var(--soft);font-size:.75rem;margin-top:2px}
.index-title{font-size:1.12rem;font-weight:800;margin-bottom:5px}
.index-summary{display:block;overflow:hidden;color:var(--muted);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.item-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.item-arrow{font-size:1.5rem;color:var(--rose);transition:transform var(--ease)}
.index-item:hover .item-arrow{transform:translateX(5px)}
.abstract-thumb{position:relative;width:132px;height:82px;overflow:hidden;border:1px solid var(--line);border-radius:11px;background:linear-gradient(135deg,#fbe8ee 0 42%,#e2f6f1 42% 68%,#eeecf7 68%)}
.abstract-thumb:before,.abstract-thumb:after{content:"";position:absolute;background:rgba(255,255,255,.78);transform:rotate(-35deg)}
.abstract-thumb:before{width:150px;height:10px;left:-12px;top:22px}
.abstract-thumb:after{width:100px;height:7px;right:-20px;bottom:17px}
.browse-note{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:30px 0;padding:24px 27px;border-radius:var(--radius-lg);background:var(--dark);color:#fff}
.browse-note p{margin:4px 0 0;color:#c6c6ca;font-size:.92rem}
.browse-note .note-mark{display:grid;place-items:center;flex:none;width:45px;height:45px;border-radius:12px;color:var(--rose);background:#343640;font-size:1.3rem}
.browse-note a{flex:none;color:#fff;border-bottom:1px solid var(--rose);font-weight:700}
.empty-state{display:none;padding:30px;border:1px dashed #c9c3bb;border-radius:var(--radius-md);color:var(--muted);text-align:center;background:#fff}
.related-grid{display:grid;grid-template-columns:1.35fr .8fr .8fr;gap:16px}
.related-card{min-height:165px;padding:25px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;box-shadow:0 9px 28px rgba(23,25,30,.04);transition:var(--ease)}
.related-card:first-child{background:var(--rose-soft);border-color:#efb2c3}
.related-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.related-card h3{margin:13px 0 8px}
.related-card p{color:var(--muted);font-size:.9rem}
.pagination{gap:8px;margin:35px 0 0}
.page-link{min-width:38px;text-align:center;border:1px solid var(--line)!important;border-radius:9px!important;color:var(--muted);background:#fff!important}
.page-link:hover{color:var(--rose-dark);background:var(--rose-soft)!important;border-color:var(--rose)!important}
.page-item.active .page-link{color:#fff;background:var(--rose)!important;border-color:var(--rose)!important}
.page-item.disabled .page-link{color:#b6b3ae;background:#ece9e4!important}
.info-strip{padding:25px 28px;border:1px solid #c8e9e1;border-radius:var(--radius-md);background:var(--mint-soft)}
.info-strip strong{display:block;margin-bottom:5px}
.info-strip p{margin:0;color:#416f68;font-size:.92rem}
footer{padding:68px 0 22px;background:var(--ink);color:#fff}
.footer-grid{display:grid;grid-template-columns:1.45fr .85fr .85fr .85fr;gap:38px}
.footer-intro{max-width:290px;color:#aaaab1;font-size:.88rem}
.footer-title{margin:8px 0 15px;color:#fff;font-weight:800}
.footer-links{display:grid;gap:9px;color:#aaaab1;font-size:.88rem}
.footer-links a:hover{color:var(--rose)}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:45px;padding-top:18px;border-top:1px solid #35363d;color:#85868e;font-size:.8rem}
.back-top{color:#fff}.back-top:hover{color:var(--mint)}
.toast-note{position:fixed;right:22px;bottom:22px;z-index:1100;display:none;max-width:320px;padding:14px 17px;border:1px solid #bce9df;border-radius:12px;background:#fff;box-shadow:var(--shadow);color:#286e62;font-size:.88rem}
@media(max-width:991.98px){
 .nav-action{margin:14px 0 4px}.nav-action a{width:100%}.navbar-nav{padding-top:14px;border-top:1px solid var(--line)}
 .nav-link{padding:12px 0!important;border-bottom:1px solid #eeeae5}.nav-link.active:after{right:auto;bottom:0;left:0;width:32px}
 .navbar-toggler{border:1px solid var(--line)!important;padding:7px 11px!important;min-height:42px}
 .page-head{padding:58px 0 42px}.section{padding:70px 0}
}
@media(max-width:767.98px){
 .index-item{grid-template-columns:54px minmax(0,1fr) 24px;gap:12px;padding:19px 16px}
 .index-item .abstract-thumb{grid-column:2;width:100%;height:110px;margin-top:4px}
 .index-item .item-arrow{grid-column:3;grid-row:1}
 .index-number{font-size:1.25rem}.index-title{font-size:1rem}
 .browse-note{align-items:flex-start;flex-wrap:wrap;padding:21px}.related-grid{grid-template-columns:1fr}
 .footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-grid>div:first-child{grid-column:1/-1}
}
@media(max-width:520px){
 .container{padding-right:16px;padding-left:16px}.page-head{padding-top:43px}
 h1{font-size:2.1rem}.filter-bar{align-items:stretch}.search-box,.filter-select{flex-basis:100%;width:100%}
 .filter-pills{width:100%}.filter-pill{flex:1;text-align:center}
 .footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.footer-bottom{display:block}.back-top{display:inline-block;margin-top:10px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* roulang page: category2 */
:root {
      --bg:#f5f3ef;--panel:#fff;--ink:#17191e;--muted:#686b73;--soft:#92949a;
      --line:#dddAD4;--rose:#d9466d;--rose-dark:#b92f55;--rose-soft:#fbe8ee;
      --mint:#35b89c;--mint-soft:#e2f6f1;--purple:#776fa8;--dark:#202229;
      --dark-2:#292c35;--warning:#d98a32;--radius-lg:20px;--radius-md:15px;
      --radius-sm:11px;--shadow:0 14px 38px rgba(23,25,30,.07);
      --shadow-hover:0 18px 42px rgba(23,25,30,.12);--ease:220ms ease
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.72;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:color var(--ease),background var(--ease),transform var(--ease),border-color var(--ease)}
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    h1,h2,h3,h4,p{overflow-wrap:anywhere}
    h1{font-size:clamp(2.25rem,4.2vw,3.55rem);line-height:1.15;font-weight:800;letter-spacing:-.045em}
    h2{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.25;font-weight:800;letter-spacing:-.03em}
    h3{font-size:1.3rem;line-height:1.4;font-weight:800}
    .container{max-width:1280px}
    .section{padding:96px 0}
    .section-tight{padding:66px 0}
    .site-header{position:sticky;z-index:1000;top:0;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(221,218,212,.9);backdrop-filter:blur(14px)}
    .navbar{min-height:80px;padding:14px 0}
    .brand{display:inline-flex;align-items:center;gap:12px;font-size:1.05rem;font-weight:800;white-space:nowrap}
    .brand-mark{position:relative;display:inline-grid;place-items:center;width:34px;height:34px;border:2px solid var(--rose);border-radius:9px}
    .brand-mark:before,.brand-mark:after{content:"";position:absolute;width:10px;height:10px;border:2px solid var(--mint);border-radius:3px}
    .brand-mark:before{top:-6px;right:-6px;background:var(--bg)}
    .brand-mark:after{bottom:-6px;left:-6px;background:var(--bg)}
    .nav-link{position:relative;padding:9px 14px!important;color:var(--muted)!important;font-size:.93rem;font-weight:700}
    .nav-link:hover,.nav-link.active{color:var(--ink)!important}
    .nav-link.active:after{content:"";position:absolute;right:14px;bottom:1px;left:14px;height:3px;border-radius:3px;background:var(--rose)}
    .nav-action{margin-left:12px}
    .btn-main,.btn-dark,.btn-quiet{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 20px;border:1px solid transparent;border-radius:var(--radius-sm);font-weight:750;transition:transform var(--ease),background var(--ease),box-shadow var(--ease),border-color var(--ease)}
    .btn-main{color:#fff;background:var(--rose);box-shadow:0 8px 18px rgba(217,70,109,.18)}
    .btn-main:hover{color:#fff;background:var(--rose-dark);transform:translateY(-2px);box-shadow:0 11px 24px rgba(217,70,109,.28)}
    .btn-dark{color:#fff;background:var(--dark)}
    .btn-dark:hover{color:#fff;background:#343742;transform:translateY(-2px)}
    .btn-quiet{color:var(--ink);background:transparent;border-color:#cfcac2}
    .btn-quiet:hover{color:var(--rose-dark);background:var(--rose-soft);border-color:var(--rose)}
    .btn-main:focus-visible,.btn-dark:focus-visible,.btn-quiet:focus-visible,.nav-link:focus-visible,.brand:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px solid rgba(217,70,109,.28);outline-offset:3px}
    .btn-main:active,.btn-dark:active,.btn-quiet:active{transform:translateY(1px)}
    .btn-main:disabled{opacity:.55;cursor:not-allowed;transform:none}
    .page-head{padding:74px 0 54px;position:relative;overflow:hidden}
    .page-head:after{content:"";position:absolute;right:-5%;top:0;width:42%;height:100%;opacity:.6;background-image:linear-gradient(rgba(119,111,168,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(119,111,168,.1) 1px,transparent 1px);background-size:28px 28px;transform:skewX(-15deg);z-index:-1}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--rose-dark);font-size:.77rem;font-weight:800;letter-spacing:.13em}
    .eyebrow:before{content:"";width:25px;height:2px;background:var(--rose)}
    .crumbs{display:flex;gap:9px;align-items:center;color:var(--soft);font-size:.84rem;margin-bottom:18px}
    .crumbs a:hover{color:var(--rose-dark)}
    .crumbs span{color:#bbb5ad}
    .head-copy{max-width:720px}
    .head-copy h1{margin:14px 0 18px}
    .head-copy p{color:var(--muted);font-size:1.06rem;max-width:680px;margin:0}
    .head-stats{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
    .stat-chip{padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.75)}
    .stat-chip strong{display:block;font-size:1.25rem;line-height:1.2;font-variant-numeric:tabular-nums}
    .stat-chip small{color:var(--muted);font-size:.78rem}
    .dashboard{display:grid;grid-template-columns:minmax(0,1fr) 220px 220px;gap:16px;margin-top:26px}
    .overview-panel,.status-block{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow)}
    .overview-panel{padding:30px;min-height:230px;position:relative;overflow:hidden}
    .overview-panel:after{content:"";position:absolute;right:0;bottom:0;width:38%;height:65%;background:linear-gradient(135deg,transparent 20%,rgba(217,70,109,.08) 20%,rgba(217,70,109,.08) 22%,transparent 22%,transparent 46%,rgba(53,184,156,.12) 46%,rgba(53,184,156,.12) 48%,transparent 48%);pointer-events:none}
    .panel-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}
    .panel-code{font-size:.75rem;color:var(--soft);letter-spacing:.1em;font-weight:800}
    .status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px var(--mint-soft);margin-right:8px}
    .overview-panel h2{font-size:1.65rem;margin:0 0 8px}
    .overview-panel p{color:var(--muted);max-width:570px;margin:0}
    .meter{display:flex;gap:6px;align-items:end;height:55px;margin-top:23px}
    .meter i{display:block;width:12px;background:var(--rose);border-radius:4px 4px 1px 1px;opacity:.82}
    .meter i:nth-child(1){height:28%}.meter i:nth-child(2){height:52%}.meter i:nth-child(3){height:42%}.meter i:nth-child(4){height:76%}.meter i:nth-child(5){height:61%}.meter i:nth-child(6){height:91%}.meter i:nth-child(7){height:70%}
    .status-block{padding:22px;display:flex;flex-direction:column;justify-content:space-between;min-height:230px}
    .status-block small{color:var(--muted);font-size:.8rem}
    .status-value{font-size:2.2rem;font-weight:800;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
    .status-block p{font-size:.88rem;color:var(--muted);margin:0}
    .filter-bar{padding:17px;border:1px solid var(--line);background:#eeeae4;border-radius:var(--radius-md);display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:28px}
    .filter-label{font-size:.83rem;font-weight:800;white-space:nowrap}
    .filter-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
    .filter-control{border:1px solid #cbc5bd;background:#fff;border-radius:10px;padding:9px 13px;color:var(--ink);font-size:.9rem;min-height:42px}
    .filter-control:focus{border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-soft);outline:0}
    .timeline-wrap{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:30px;align-items:start}
    .timeline{position:relative;padding-left:34px}
    .timeline:before{content:"";position:absolute;left:8px;top:12px;bottom:20px;width:1px;background:#c9c4bc}
    .timeline-item{position:relative;padding:0 0 28px}
    .timeline-item:before{content:"";position:absolute;left:-30px;top:12px;width:12px;height:12px;border-radius:50%;background:var(--rose);border:3px solid var(--rose-soft);box-shadow:0 0 0 1px var(--rose)}
    .date-label{display:inline-block;color:var(--rose-dark);font-size:.78rem;font-weight:800;letter-spacing:.06em;margin-bottom:8px}
    .timeline-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:23px 25px;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
    .timeline-card:hover{transform:translateY(-3px);border-color:#e4a0b4;box-shadow:var(--shadow-hover)}
    .timeline-card h3{margin:0 0 8px;font-size:1.2rem}
    .timeline-card p{color:var(--muted);margin:0 0 14px;font-size:.94rem}
    .tag-row{display:flex;gap:7px;flex-wrap:wrap}
    .tag{display:inline-flex;align-items:center;padding:4px 9px;border-radius:7px;background:#f0eeea;color:var(--muted);font-size:.76rem;font-weight:700}
    .tag.rose{background:var(--rose-soft);color:var(--rose-dark)}
    .tag.mint{background:var(--mint-soft);color:#197c6b}
    .arrow-link{display:inline-flex;align-items:center;gap:7px;margin-top:15px;color:var(--rose-dark);font-size:.88rem;font-weight:800}
    .arrow-link:hover{gap:11px;color:var(--rose)}
    .side-panel{position:sticky;top:105px;background:var(--dark);color:#fff;border-radius:var(--radius-lg);padding:26px;overflow:hidden}
    .side-panel:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:22px 22px;opacity:.45}
    .side-panel>*{position:relative}
    .side-panel h3{margin:0 0 8px;font-size:1.2rem}
    .side-panel p{color:#bfc1c8;font-size:.9rem;margin-bottom:21px}
    .tag-cloud{display:flex;gap:8px;flex-wrap:wrap}
    .tag-cloud a{padding:7px 10px;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#f0eef0;font-size:.78rem}
    .tag-cloud a:hover{border-color:var(--mint);color:#fff;background:rgba(53,184,156,.15)}
    .side-nav{margin-top:30px;padding-top:20px;border-top:1px solid rgba(255,255,255,.15)}
    .side-nav a{display:flex;justify-content:space-between;padding:9px 0;color:#c6c7cc;font-size:.88rem}
    .side-nav a:hover{color:#fff}
    .content-band{display:grid;grid-template-columns:2fr 1fr;gap:18px;align-items:stretch}
    .feature-cover{min-height:260px;border-radius:var(--radius-lg);border:1px solid var(--line);background:linear-gradient(145deg,#302d40 0%,#776fa8 48%,#d9466d 100%);position:relative;overflow:hidden;padding:30px;color:#fff}
    .feature-cover:before{content:"06 / SELECTED";position:absolute;right:28px;top:25px;color:rgba(255,255,255,.72);font-size:.73rem;letter-spacing:.14em;font-weight:800}
    .feature-cover:after{content:"";position:absolute;right:-30px;bottom:-75px;width:290px;height:190px;border:1px solid rgba(255,255,255,.35);transform:rotate(-24deg);box-shadow:0 0 0 22px rgba(255,255,255,.08),0 0 0 44px rgba(255,255,255,.05)}
    .feature-cover .eyebrow{color:#fff;position:relative;z-index:1}
    .feature-cover .eyebrow:before{background:var(--mint)}
    .feature-cover h2{position:relative;z-index:1;max-width:520px;margin-top:70px;font-size:clamp(1.7rem,3vw,2.5rem)}
    .feature-list{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px}
    .feature-list h3{margin:0 0 13px}
    .feature-list a{display:block;padding:13px 0;border-top:1px solid var(--line);font-size:.91rem;font-weight:700}
    .feature-list a:first-of-type{border-top:0}
    .feature-list a:hover{color:var(--rose-dark);padding-left:5px}
    .guide-list{border-top:1px solid var(--line)}
    .guide-row{display:grid;grid-template-columns:52px 1fr 100px;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
    .guide-num{color:var(--rose);font-size:.8rem;font-weight:800;letter-spacing:.08em}
    .guide-row strong{display:block;font-size:.98rem}
    .guide-row p{margin:3px 0 0;color:var(--muted);font-size:.88rem}
    .guide-row em{font-style:normal;text-align:right;color:var(--soft);font-size:.78rem}
    .mini-faq{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
    .faq-note{background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);padding:20px}
    .faq-note b{display:flex;gap:10px;margin-bottom:8px;color:var(--rose-dark)}
    .faq-note b span{font-variant-numeric:tabular-nums}
    .faq-note p{color:var(--muted);font-size:.88rem;margin:0}
    footer{padding:66px 0 24px;background:var(--ink);color:#f6f4f1}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:38px}
    .footer-intro{max-width:290px;color:#aeb0b7;font-size:.9rem}
    footer .brand{color:#fff}
    footer .brand-mark{background:var(--ink)}
    .footer-title{font-weight:800;margin-bottom:14px}
    .footer-links{display:grid;gap:9px;color:#b7b8be;font-size:.88rem}
    .footer-links a:hover{color:var(--rose)}
    .footer-bottom{display:flex;justify-content:space-between;gap:15px;margin-top:50px;padding-top:20px;border-top:1px solid #353740;color:#9699a2;font-size:.8rem}
    .back-top:hover{color:var(--mint)}
    @media(max-width:991.98px){
      .nav-action{margin:14px 0 4px}.nav-action .btn-main{width:100%}
      .navbar-nav{padding-top:12px;border-top:1px solid var(--line);margin-top:12px}
      .nav-link{padding:12px 0!important;border-bottom:1px solid #eeeae4}
      .nav-link.active:after{right:auto;left:0;bottom:7px;width:28px}
      .dashboard{grid-template-columns:1fr 1fr}.overview-panel{grid-column:1/-1}
      .timeline-wrap{grid-template-columns:1fr}.side-panel{position:static}
    }
    @media(max-width:767.98px){
      .section{padding:70px 0}.page-head{padding:55px 0 38px}
      .dashboard,.content-band,.mini-faq{grid-template-columns:1fr}
      .overview-panel{grid-column:auto}.status-block{min-height:170px}
      .filter-bar{align-items:stretch;flex-direction:column}.filter-actions{justify-content:flex-start}
      .filter-control{flex:1 1 42%}.feature-cover{min-height:230px}.feature-cover h2{margin-top:56px}
      .guide-row{grid-template-columns:42px 1fr}.guide-row em{grid-column:2;text-align:left}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-grid>div:first-child{grid-column:1/-1}
    }
    @media(max-width:520px){
      .container{padding-right:16px;padding-left:16px}.brand{font-size:.94rem;gap:9px}.brand-mark{width:30px;height:30px}
      h1{font-size:2.15rem}.head-stats{display:grid;grid-template-columns:1fr 1fr}.stat-chip{padding:10px 12px}
      .overview-panel,.status-block,.timeline-card,.side-panel,.feature-list{padding:20px}
      .filter-actions{display:grid;grid-template-columns:1fr 1fr}.filter-control{width:100%}
      .timeline{padding-left:25px}.timeline:before{left:5px}.timeline-item:before{left:-25px}
      .footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.footer-bottom{align-items:flex-start;flex-direction:column;margin-top:35px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}