/* roulang page: index */
:root{
            --ink:#241f29;
            --muted:#746d79;
            --paper:#fffaf7;
            --soft:#f7efed;
            --line:#eadeda;
            --coral:#e85d58;
            --rose:#c94373;
            --plum:#713d71;
            --deep:#302437;
            --mint:#dcefe7;
            --yellow:#f8dfaa;
            --radius-xl:30px;
            --radius-lg:22px;
            --radius-md:14px;
            --shadow:0 18px 45px rgba(62,37,53,.10);
            --shadow-sm:0 8px 24px rgba(62,37,53,.07);
            --ease:all .28s ease;
        }
        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.75}
        a{color:inherit;text-decoration:none;transition:var(--ease)}
        a:hover{color:var(--coral)}
        img{max-width:100%;display:block}
        button,input{font:inherit}
        .container{max-width:1200px;padding-left:22px;padding-right:22px}
        .site-header{position:sticky;top:0;z-index:20;background:rgba(255,250,247,.92);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:var(--ease)}
        .site-header.scrolled{border-color:var(--line);box-shadow:0 8px 25px rgba(48,36,55,.06)}
        .command-bar{min-height:76px;display:flex;align-items:center;gap:28px}
        .brand{display:flex;align-items:center;gap:10px;font-weight:800;white-space:nowrap;letter-spacing:-.03em}
        .brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--coral),var(--plum));position:relative;box-shadow:0 7px 16px rgba(201,67,115,.23)}
        .brand-mark:after{content:"";position:absolute;left:13px;top:9px;border-left:10px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}
        .brand-text{font-size:17px}
        .main-nav{display:flex;align-items:center;gap:5px;margin-left:18px}
        .main-nav a{padding:9px 13px;border-radius:10px;color:var(--muted);font-size:14px}
        .main-nav a:hover,.main-nav a.active{background:#f5e5e3;color:var(--ink)}
        .nav-tools{margin-left:auto;display:flex;align-items:center;gap:10px}
        .search-box{display:flex;align-items:center;width:180px;height:40px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:0 11px;color:var(--muted)}
        .search-box span{font-size:17px;margin-right:8px}
        .search-box input{width:100%;border:0;outline:0;background:transparent;font-size:13px;color:var(--ink)}
        .search-box kbd{font-size:10px;border:1px solid var(--line);border-radius:5px;padding:1px 4px;color:#a0959d;background:#fff}
        .btn-brand,.btn-soft{display:inline-flex;align-items:center;justify-content:center;border-radius:11px;padding:11px 18px;font-weight:700;font-size:14px;transition:var(--ease)}
        .btn-brand{color:#fff;background:linear-gradient(110deg,var(--coral),var(--rose));box-shadow:0 10px 22px rgba(201,67,115,.22);border:0}
        .btn-brand:hover{color:#fff;transform:translateY(-2px);box-shadow:0 14px 27px rgba(201,67,115,.3)}
        .btn-brand:active,.btn-soft:active{transform:translateY(1px)}
        .btn-soft{background:#fff6f3;border:1px solid #efd6d2;color:var(--rose)}
        .btn-soft:hover{background:#f9e6e1;color:var(--plum)}
        :focus-visible{outline:3px solid rgba(232,93,88,.4);outline-offset:3px}
        .hero{padding:42px 0 78px}
        .hero-stage{position:relative;min-height:500px;border-radius:var(--radius-xl);overflow:hidden;background:var(--deep);display:flex;align-items:flex-end}
        .hero-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 18%,rgba(232,93,88,.85),transparent 34%),linear-gradient(120deg,#302437 25%,#55334e 62%,#9d4f68)}
        .hero-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,17,29,.88) 10%,rgba(40,25,40,.46) 58%,rgba(41,25,39,.16))}
        .hero-content{position:relative;z-index:2;max-width:650px;padding:58px 64px;color:#fff}
        .eyebrow{display:inline-flex;align-items:center;gap:8px;color:#ffd9c9;font-size:12px;font-weight:700;letter-spacing:.12em;margin-bottom:17px}
        .eyebrow i{width:7px;height:7px;background:#ffb09a;border-radius:50%;display:block}
        h1,h2,h3{line-height:1.23;letter-spacing:-.045em;margin:0 0 18px;font-weight:800}
        h1{font-size:clamp(36px,5vw,58px)}
        h2{font-size:clamp(29px,4vw,40px)}
        h3{font-size:21px}
        .hero-copy{font-size:17px;color:#f4e9e9;max-width:600px;margin-bottom:27px}
        .hero-actions{display:flex;gap:11px;flex-wrap:wrap}
        .hero-actions .btn-soft{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34);color:#fff}
        .hero-actions .btn-soft:hover{background:rgba(255,255,255,.22)}
        .hero-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
        .badge-chip{display:inline-flex;align-items:center;padding:5px 10px;border-radius:8px;font-size:12px;font-weight:700;background:#f7e5df;color:var(--rose)}
        .badge-chip.dark{background:rgba(255,255,255,.13);color:#ffe3d8}
        .badge-chip.green{background:var(--mint);color:#397261}
        .badge-chip.gold{background:var(--yellow);color:#826322}
        .preview-panel{position:absolute;z-index:3;right:58px;top:60px;width:285px;border:1px solid rgba(255,255,255,.23);border-radius:22px;background:rgba(29,20,32,.72);padding:18px;color:#fff;box-shadow:0 22px 50px rgba(17,10,22,.28)}
        .preview-art{height:150px;border-radius:15px;background:linear-gradient(145deg,#f39b7d,#b33d68 52%,#46325e);position:relative;overflow:hidden;margin-bottom:15px}
        .preview-art:after{content:"内容预览";position:absolute;right:14px;bottom:12px;color:#fff;font-size:12px;background:rgba(28,18,31,.48);padding:4px 8px;border-radius:6px}
        .play-dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:#fff;box-shadow:0 7px 20px rgba(0,0,0,.2)}
        .play-dot:after{content:"";position:absolute;left:20px;top:14px;border-left:13px solid var(--rose);border-top:9px solid transparent;border-bottom:9px solid transparent}
        .preview-panel strong{font-size:16px}.preview-panel small{color:#d8cbd3}
        .section{padding:82px 0}
        .section-head{max-width:680px;margin-bottom:32px}
        .section-head p{color:var(--muted);margin:0;font-size:16px}
        .section-kicker{color:var(--coral);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}
        .pain-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px}
        .index-card,.solution-card,.quote-card,.directory-card,.result-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
        .pain-list{padding:10px 25px}
        .pain-item{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:17px;padding:22px 0;border-bottom:1px solid var(--line)}
        .pain-item:last-child{border-bottom:0}
        .num{font-size:24px;font-weight:800;color:#d6b6b1}
        .pain-item h3{font-size:18px;margin-bottom:4px}.pain-item p{margin:0;color:var(--muted);font-size:14px}
        .mini-note{padding:32px;background:linear-gradient(145deg,#f8e5e0,#f7eef1);border-radius:var(--radius-lg);display:flex;flex-direction:column;justify-content:center}
        .mini-note p{color:var(--muted);margin:0 0 18px}
        .solution-layout{display:grid;grid-template-columns:280px 1fr;gap:24px}
        .side-index{padding:24px;background:var(--deep);color:#fff;border-radius:var(--radius-lg);height:max-content;position:sticky;top:100px}
        .side-index h3{font-size:18px}.side-index a{display:block;padding:11px 13px;border-radius:9px;color:#cbbbc5;font-size:14px}.side-index a.active,.side-index a:hover{background:#5a3654;color:#fff}
        .solution-card{padding:30px;display:grid;grid-template-columns:68px 1fr auto;gap:20px;align-items:start;margin-bottom:14px}
        .step-icon{width:54px;height:54px;border-radius:16px;background:#fae3de;color:var(--coral);display:grid;place-items:center;font-weight:800;font-size:20px}
        .solution-card h3{margin-bottom:5px}.solution-card p{margin:0;color:var(--muted);font-size:14px}
        .results{background:#f6eeeb}
        .result-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:24px;align-items:stretch}
        .result-feature{background:var(--deep);color:#fff;border-radius:var(--radius-lg);padding:34px;position:relative;overflow:hidden}
        .result-feature:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-70px;bottom:-80px;background:linear-gradient(135deg,var(--coral),var(--plum));opacity:.65}
        .result-feature p{color:#dfd1da;max-width:390px}.progress-line{height:9px;border-radius:9px;background:#594954;overflow:hidden;margin:20px 0 10px}.progress-line span{display:block;width:78%;height:100%;background:linear-gradient(90deg,var(--coral),#f2a17d);border-radius:inherit}
        .result-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.result-card{padding:24px}.result-card b{font-size:28px;color:var(--rose);display:block}.result-card span{color:var(--muted);font-size:13px}.news-list{margin-top:28px;border-top:1px solid var(--line)}.news-list a{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}.news-list time{font-size:12px;color:#a59aa1;white-space:nowrap}
        .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.quote-card{padding:27px}.quote-mark{font-size:38px;line-height:1;color:var(--coral)}.quote-card p{min-height:88px;font-size:15px}.quote-foot{border-top:1px solid var(--line);padding-top:14px;color:var(--muted);font-size:13px;display:flex;justify-content:space-between}
        .cta{padding:0 0 82px}.cta-box{border-radius:var(--radius-xl);padding:52px 60px;background:linear-gradient(110deg,#472d4a,#a54868 70%,#e47768);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:25px;position:relative;overflow:hidden}.cta-box:after{content:"";position:absolute;right:8%;width:240px;height:240px;border:1px solid rgba(255,255,255,.2);border-radius:50%}.cta-box p{color:#f6dfe2;max-width:630px;margin:0}.cta-box .btn-soft{background:#fff;color:var(--plum);border:0;position:relative;z-index:1}
        .faq-wrap{max-width:850px}.accordion-item{border:1px solid var(--line)!important;border-radius:14px!important;overflow:hidden;margin-bottom:12px;background:#fff}.accordion-button{font-weight:700;color:var(--ink);background:#fff;padding:20px 22px;box-shadow:none!important}.accordion-button:not(.collapsed){color:var(--rose);background:#fff7f4}.accordion-button:after{background-size:14px}.accordion-body{color:var(--muted);font-size:14px;padding:0 22px 21px}
        footer{background:#2b2130;color:#d8cbd4;padding:52px 0 25px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}.footer-brand{color:#fff}.footer-copy{color:#a99aa7;font-size:13px;max-width:350px}.footer-title{color:#fff;font-size:14px;font-weight:700;margin-bottom:14px}.footer-links a{display:block;color:#bcaeb8;font-size:13px;margin:8px 0}.footer-links a:hover{color:#ffad9b}.copyright{border-top:1px solid #473847;margin-top:35px;padding-top:18px;color:#938691;font-size:12px;display:flex;justify-content:space-between;gap:15px}
        @media(max-width:991px){.main-nav{margin-left:0}.nav-tools .search-box{width:145px}.preview-panel{right:28px}.hero-content{padding:48px}.solution-layout{grid-template-columns:220px 1fr}.pain-grid,.result-layout{grid-template-columns:1fr}}
        @media(max-width:767px){.command-bar{min-height:68px;gap:10px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.brand-text{font-size:15px}.main-nav{order:3;width:100%;overflow-x:auto;justify-content:flex-start}.nav-tools{margin-left:auto}.nav-tools .search-box{display:none}.nav-tools .btn-brand{padding:9px 12px}.hero{padding:20px 0 52px}.hero-stage{min-height:620px;align-items:flex-end}.hero-content{padding:30px 25px}.hero-copy{font-size:15px}.preview-panel{top:25px;left:25px;right:25px;width:auto}.section{padding:55px 0}.pain-list{padding:5px 18px}.pain-item{grid-template-columns:35px 1fr;gap:10px}.pain-item .badge-chip{grid-column:2;width:max-content}.solution-layout{grid-template-columns:1fr}.side-index{position:static}.solution-card{grid-template-columns:52px 1fr;padding:21px}.solution-card .badge-chip{grid-column:2}.result-stats{grid-template-columns:1fr 1fr}.quotes{grid-template-columns:1fr}.quote-card p{min-height:auto}.cta{padding-bottom:55px}.cta-box{padding:35px 25px;display:block}.cta-box .btn-soft{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-grid>div:first-child{grid-column:1/-1}.copyright{display:block}.copyright span{display:block;margin-top:6px}}
        @media(max-width:420px){h1{font-size:34px}.hero-stage{min-height:650px}.result-stats{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}}

/* roulang page: category1 */
:root{
      --ink:#241f29;
      --muted:#746d79;
      --paper:#fffaf7;
      --soft:#f7efed;
      --line:#eadeda;
      --coral:#e85d58;
      --rose:#c94373;
      --plum:#713d71;
      --deep:#302437;
      --mint:#dcefe7;
      --yellow:#f8dfaa;
      --radius-xl:30px;
      --radius-lg:22px;
      --radius-md:14px;
      --shadow:0 18px 45px rgba(62,37,53,.10);
      --shadow-sm:0 8px 24px rgba(62,37,53,.07);
      --ease:all .28s ease;
    }

    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--paper);
      color:var(--ink);
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    img{display:block;max-width:100%}
    button,input,select{font:inherit}
    button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{
      outline:3px solid rgba(232,93,88,.3);
      outline-offset:3px;
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{font-weight:800;letter-spacing:-.035em;line-height:1.25}
    h1{font-size:clamp(38px,5vw,56px);margin-bottom:18px}
    h2{font-size:clamp(28px,3.4vw,38px);margin-bottom:12px}
    h3{font-size:20px;margin-bottom:8px}
    .container{max-width:1200px;padding-left:22px;padding-right:22px}
    .site-header{
      position:sticky;top:0;z-index:20;
      background:rgba(255,250,247,.93);
      backdrop-filter:blur(14px);
      border-bottom:1px solid transparent;
      transition:var(--ease);
    }
    .site-header.scrolled{border-color:var(--line);box-shadow:0 8px 25px rgba(48,36,55,.06)}
    .command-bar{min-height:72px;display:flex;align-items:center;gap:18px}
    .brand{display:flex;align-items:center;gap:10px;font-weight:800;white-space:nowrap;letter-spacing:-.03em}
    .brand-mark{
      width:34px;height:34px;border-radius:11px;
      background:linear-gradient(135deg,var(--coral),var(--plum));
      position:relative;box-shadow:0 7px 16px rgba(201,67,115,.23);
      flex:0 0 auto;
    }
    .brand-mark:after{
      content:"";position:absolute;left:13px;top:9px;
      border-left:10px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent;
    }
    .brand-text{font-size:17px}
    .main-nav{display:flex;align-items:center;gap:5px;margin-left:18px}
    .main-nav a{padding:9px 13px;border-radius:10px;color:var(--muted);font-size:14px}
    .main-nav a:hover,.main-nav a.active{background:#f5e5e3;color:var(--ink)}
    .nav-tools{margin-left:auto;display:flex;align-items:center;gap:10px}
    .search-box{
      display:flex;align-items:center;width:180px;height:40px;
      border:1px solid var(--line);border-radius:11px;background:#fff;
      padding:0 11px;color:var(--muted);
    }
    .search-box span{font-size:17px;margin-right:8px}
    .search-box input{width:100%;border:0;outline:0;background:transparent;font-size:13px;color:var(--ink)}
    .search-box kbd{font-size:10px;border:1px solid var(--line);border-radius:5px;padding:1px 4px;color:#a0959d;background:#fff}
    .btn-brand,.btn-soft{
      display:inline-flex;align-items:center;justify-content:center;
      border-radius:11px;padding:11px 18px;font-weight:700;font-size:14px;
      transition:var(--ease);white-space:nowrap;
    }
    .btn-brand{color:#fff;background:linear-gradient(110deg,var(--coral),var(--rose));box-shadow:0 10px 22px rgba(201,67,115,.22);border:0}
    .btn-brand:hover{color:#fff;transform:translateY(-2px);box-shadow:0 14px 27px rgba(201,67,115,.3)}
    .btn-brand:active,.btn-soft:active{transform:translateY(1px)}
    .btn-soft{background:#fff6f3;border:1px solid #efd6d2;color:var(--rose)}
    .btn-soft:hover{background:#f9e6e1;color:var(--plum)}
    .breadcrumb-wrap{padding:31px 0 14px}
    .breadcrumb{margin:0;--bs-breadcrumb-divider:"·";font-size:13px;color:var(--muted)}
    .breadcrumb a:hover{color:var(--coral)}
    .page-intro{padding:26px 0 42px}
    .eyebrow,.section-kicker{
      color:var(--coral);font-weight:800;font-size:12px;
      letter-spacing:.12em;text-transform:uppercase;
    }
    .eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px}
    .eyebrow i{width:7px;height:7px;background:var(--coral);border-radius:50%;display:block}
    .intro-grid{display:grid;grid-template-columns:1fr 360px;gap:36px;align-items:end}
    .page-intro p{max-width:700px;color:var(--muted);font-size:17px;margin-bottom:0}
    .intro-status{
      background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
      padding:20px 22px;box-shadow:var(--shadow-sm);
    }
    .status-line{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
    .status-line:last-child{margin-bottom:0}
    .status-label{font-size:13px;color:var(--muted)}
    .badge-chip{
      display:inline-flex;align-items:center;padding:5px 10px;border-radius:8px;
      font-size:12px;font-weight:700;background:#f7e5df;color:var(--rose);white-space:nowrap
    }
    .badge-chip.green{background:var(--mint);color:#397261}
    .badge-chip.gold{background:var(--yellow);color:#826322}
    .badge-chip.dark{background:rgba(255,255,255,.13);color:#ffe3d8}
    .filter-panel{
      background:var(--deep);border-radius:var(--radius-lg);padding:23px 25px;
      margin-bottom:26px;box-shadow:var(--shadow);
    }
    .filter-panel .form-label{font-size:12px;color:#d9cbd4;margin-bottom:6px}
    .filter-control{
      width:100%;height:45px;border:1px solid rgba(255,255,255,.18);
      border-radius:10px;background:#463346;color:#fff;padding:0 13px;font-size:14px;
    }
    .filter-control::placeholder{color:#bbaab6}
    .filter-control:focus{border-color:#ff9a8d;box-shadow:0 0 0 3px rgba(255,154,141,.15);outline:0}
    .filter-panel .btn-brand{height:45px}
    .content-layout{display:grid;grid-template-columns:255px 1fr;gap:25px;align-items:start}
    .directory-card{
      padding:22px;position:sticky;top:96px;background:#fff;
    }
    .directory-title{font-size:13px;font-weight:800;margin-bottom:13px}
    .directory-list{list-style:none;padding:0;margin:0}
    .directory-list li{margin-bottom:5px}
    .directory-list a{
      display:flex;justify-content:space-between;align-items:center;
      padding:11px 12px;border-radius:10px;color:var(--muted);font-size:14px;
    }
    .directory-list a span{font-size:11px;color:#ab9ca5}
    .directory-list a:hover,.directory-list a.active{background:#f8e9e5;color:var(--rose);font-weight:700}
    .directory-note{border-top:1px solid var(--line);margin-top:18px;padding-top:17px;color:var(--muted);font-size:12px}
    .index-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:15px}
    .index-heading h2{font-size:25px;margin:0}
    .index-heading p{margin:0;color:var(--muted);font-size:13px}
    .entry-list{display:flex;flex-direction:column;gap:14px}
    .entry-card{
      display:grid;grid-template-columns:154px 1fr auto;gap:20px;align-items:center;
      padding:16px;background:#fff;border:1px solid var(--line);
      border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:var(--ease);
    }
    .entry-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#e9beb8}
    .entry-cover{
      min-height:105px;border-radius:15px;position:relative;overflow:hidden;
      background:linear-gradient(135deg,#f2b49e,#c34d72 54%,#5b355f);
    }
    .entry-cover.two{background:linear-gradient(135deg,#e8d0a3,#c66b68 52%,#713d71)}
    .entry-cover.three{background:linear-gradient(135deg,#d6eee4,#8c6687 55%,#302437)}
    .entry-cover.four{background:linear-gradient(135deg,#f6d6c4,#e85d58 55%,#713d71)}
    .entry-cover:after{
      content:"";position:absolute;inset:auto 12px 12px auto;width:27px;height:27px;
      border-radius:50%;background:rgba(255,255,255,.85);
    }
    .entry-cover:before{
      content:"";position:absolute;right:21px;bottom:19px;z-index:1;
      border-left:8px solid var(--rose);border-top:6px solid transparent;border-bottom:6px solid transparent;
    }
    .entry-number{position:absolute;left:13px;top:10px;color:#fff;font-size:12px;font-weight:800}
    .entry-body h3{font-size:19px;margin-bottom:7px}
    .entry-body p{font-size:14px;color:var(--muted);margin-bottom:12px;line-height:1.6}
    .entry-tags{display:flex;flex-wrap:wrap;gap:7px}
    .entry-side{text-align:right;min-width:85px}
    .entry-side small{display:block;color:#a0959d;font-size:11px;margin-top:9px}
    .featured-strip{
      margin-top:32px;background:linear-gradient(110deg,#fff0e9,#f8e7ef);
      border:1px solid #f0d5d3;border-radius:var(--radius-xl);
      padding:27px 30px;display:flex;justify-content:space-between;align-items:center;gap:25px;
    }
    .featured-strip h2{font-size:24px;margin-bottom:7px}
    .featured-strip p{color:var(--muted);font-size:14px;margin:0}
    .featured-mark{width:92px;height:72px;border-radius:17px;background:linear-gradient(135deg,var(--coral),var(--plum));position:relative;flex:0 0 auto}
    .featured-mark:after{content:"";position:absolute;left:39px;top:25px;border-left:14px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent}
    .browse-note{padding:68px 0 74px}
    .note-box{max-width:820px;border-left:4px solid var(--coral);padding:8px 0 8px 23px}
    .note-box h2{font-size:26px;margin-bottom:8px}
    .note-box p{color:var(--muted);margin-bottom:0}
    .faq-section{padding:74px 0 86px;background:var(--soft)}
    .faq-wrap{max-width:820px}
    .accordion-item{background:#fff;border:1px solid var(--line)!important;border-radius:15px!important;margin-bottom:10px;overflow:hidden}
    .accordion-button{font-weight:700;color:var(--ink);background:#fff;padding:20px 22px;box-shadow:none!important}
    .accordion-button:not(.collapsed){color:var(--rose);background:#fff8f5}
    .accordion-button:after{background-size:14px}
    .accordion-body{color:var(--muted);font-size:14px;padding:0 22px 20px}
    .action-section{padding:74px 0}
    .action-card{
      position:relative;overflow:hidden;border-radius:var(--radius-xl);padding:45px 52px;
      color:#fff;background:var(--deep);display:flex;justify-content:space-between;
      align-items:center;gap:28px;
    }
    .action-card:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-80px;top:-120px;background:linear-gradient(135deg,var(--coral),var(--plum));opacity:.7}
    .action-card > *{position:relative;z-index:1}
    .action-card h2{max-width:620px;margin-bottom:10px}
    .action-card p{color:#dfd1da;margin:0;max-width:610px}
    .action-buttons{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}
    .action-card .btn-soft{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff}
    .action-card .btn-soft:hover{background:rgba(255,255,255,.22)}
    footer{background:#241d29;color:#fff;padding:54px 0 23px}
    .footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr;gap:35px}
    .footer-brand{color:#fff}
    .footer-copy{color:#b9acb6;max-width:360px;font-size:14px}
    .footer-title{font-size:13px;font-weight:800;color:#fff;margin-bottom:13px}
    .footer-links{display:flex;flex-direction:column;gap:8px}
    .footer-links a{font-size:13px;color:#b9acb6}
    .footer-links a:hover{color:#ffaaa0}
    .copyright{display:flex;justify-content:space-between;gap:15px;border-top:1px solid rgba(255,255,255,.12);margin-top:37px;padding-top:18px;color:#91818e;font-size:12px}
    @media (max-width:991px){
      .command-bar{flex-wrap:wrap;padding-top:12px;padding-bottom:12px}
      .main-nav{order:3;width:100%;margin-left:0}
      .nav-tools{margin-left:auto}
      .intro-grid{grid-template-columns:1fr}
      .content-layout{grid-template-columns:210px 1fr}
      .entry-card{grid-template-columns:125px 1fr}
      .entry-side{grid-column:2;text-align:left;margin-top:-10px}
      .action-card{display:block}
      .action-buttons{margin-top:24px}
    }
    @media (max-width:767px){
      .container{padding-left:18px;padding-right:18px}
      .brand-text{font-size:15px}
      .command-bar{gap:10px}
      .main-nav{overflow-x:auto;white-space:nowrap;padding-bottom:2px}
      .main-nav a{font-size:13px;padding:8px 10px}
      .nav-tools{width:100%;margin-left:0;order:4}
      .search-box{flex:1;width:auto}
      .nav-tools .btn-brand{padding-left:14px;padding-right:14px}
      .breadcrumb-wrap{padding-top:22px}
      .page-intro{padding-top:17px;padding-bottom:30px}
      .page-intro p{font-size:15px}
      .intro-status{padding:17px}
      .filter-panel{padding:18px}
      .content-layout{display:block}
      .directory-card{position:static;margin-bottom:22px}
      .directory-list{display:grid;grid-template-columns:1fr 1fr;gap:3px}
      .directory-note{display:none}
      .index-heading{display:block}
      .index-heading p{margin-top:5px}
      .entry-card{grid-template-columns:96px 1fr;gap:14px;padding:12px}
      .entry-cover{min-height:88px}
      .entry-body h3{font-size:17px}
      .entry-body p{font-size:13px;margin-bottom:8px}
      .entry-side{grid-column:2;display:flex;align-items:center;gap:9px;margin-top:-8px}
      .entry-side small{margin:0}
      .featured-strip{display:block;padding:23px}
      .featured-mark{margin-bottom:17px}
      .browse-note,.faq-section,.action-section{padding:52px 0}
      .action-card{padding:31px 24px}
      .action-card h2{font-size:28px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:27px}
      .footer-grid>div:first-child{grid-column:1/-1}
      .copyright{display:block}
      .copyright span{display:block;margin-top:5px}
    }
    @media (max-width:520px){
      h1{font-size:35px}
      .intro-status{font-size:14px}
      .entry-card{grid-template-columns:1fr}
      .entry-cover{min-height:130px}
      .entry-side{grid-column:1;margin-top:-2px}
      .directory-list{grid-template-columns:1fr}
      .featured-strip h2{font-size:21px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
    }

/* roulang page: category2 */
:root{
 --ink:#241f29;
 --muted:#746d79;
 --paper:#fffaf7;
 --soft:#f7efed;
 --line:#eadeda;
 --coral:#e85d58;
 --rose:#c94373;
 --plum:#713d71;
 --deep:#302437;
 --mint:#dcefe7;
 --yellow:#f8dfaa;
 --white:#ffffff;
 --radius-xl:30px;
 --radius-lg:22px;
 --radius-md:14px;
 --shadow:0 18px 45px rgba(62,37,53,.10);
 --shadow-sm:0 8px 24px rgba(62,37,53,.07);
 --ease:all .28s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 min-width:320px;
 background:var(--paper);
 color:var(--ink);
 font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
 font-size:16px;
 line-height:1.75;
 overflow-x:hidden;
}
a{color:inherit;text-decoration:none;transition:var(--ease)}
a:hover{color:var(--coral)}
a:focus-visible,button:focus-visible,input:focus-visible,.accordion-button:focus-visible{
 outline:3px solid rgba(232,93,88,.32);
 outline-offset:3px;
}
img{max-width:100%;display:block}
button,input{font:inherit}
button{cursor:pointer}
.container{max-width:1200px;padding-left:22px;padding-right:22px}
.visually-hidden{
 position:absolute!important;
 width:1px!important;
 height:1px!important;
 padding:0!important;
 margin:-1px!important;
 overflow:hidden!important;
 clip:rect(0,0,0,0)!important;
 white-space:nowrap!important;
 border:0!important;
}
.site-header{
 position:sticky;
 top:0;
 z-index:50;
 background:rgba(255,250,247,.92);
 backdrop-filter:blur(14px);
 border-bottom:1px solid transparent;
 transition:var(--ease);
}
.site-header.scrolled{
 border-color:var(--line);
 box-shadow:0 8px 25px rgba(48,36,55,.06);
}
.command-bar{
 min-height:76px;
 display:flex;
 align-items:center;
 gap:12px;
}
.brand{
 display:flex;
 align-items:center;
 gap:10px;
 font-weight:800;
 white-space:nowrap;
 letter-spacing:-.03em;
}
.brand:hover{color:var(--ink)}
.brand-mark{
 width:34px;
 height:34px;
 flex:0 0 34px;
 border-radius:11px;
 background:linear-gradient(135deg,var(--coral),var(--plum));
 position:relative;
 box-shadow:0 7px 16px rgba(201,67,115,.23);
}
.brand-mark:after{
 content:"";
 position:absolute;
 left:13px;
 top:9px;
 border-left:10px solid #fff;
 border-top:8px solid transparent;
 border-bottom:8px solid transparent;
}
.brand-text{font-size:17px}
.main-nav{
 display:flex;
 align-items:center;
 gap:5px;
 margin-left:18px;
}
.main-nav a{
 padding:9px 13px;
 border-radius:10px;
 color:var(--muted);
 font-size:14px;
 font-weight:700;
}
.main-nav a:hover,.main-nav a.active{
 background:#f5e5e3;
 color:var(--ink);
}
.nav-tools{
 margin-left:auto;
 display:flex;
 align-items:center;
 gap:10px;
}
.search-box{
 display:flex;
 align-items:center;
 width:180px;
 height:40px;
 border:1px solid var(--line);
 border-radius:11px;
 background:#fff;
 padding:0 11px;
 color:var(--muted);
 transition:var(--ease);
}
.search-box:focus-within{
 border-color:#dc9a95;
 box-shadow:0 0 0 4px rgba(232,93,88,.11);
}
.search-box span{font-size:17px;margin-right:8px}
.search-box input{
 width:100%;
 min-width:0;
 border:0;
 outline:0;
 background:transparent;
 font-size:13px;
 color:var(--ink);
}
.search-box input::placeholder{color:#a49aa4}
.search-box kbd{
 font-size:10px;
 border:1px solid var(--line);
 border-radius:5px;
 padding:1px 4px;
 color:#a0959d;
 background:#fff;
 line-height:1.35;
}
.btn-brand,.btn-soft,.btn-linkline{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 border-radius:11px;
 padding:11px 18px;
 font-weight:800;
 font-size:14px;
 line-height:1.4;
 transition:var(--ease);
}
.btn-brand{
 color:#fff;
 background:linear-gradient(110deg,var(--coral),var(--rose));
 box-shadow:0 10px 22px rgba(201,67,115,.22);
 border:1px solid transparent;
}
.btn-brand:hover{
 color:#fff;
 transform:translateY(-2px);
 box-shadow:0 14px 27px rgba(201,67,115,.30);
}
.btn-soft{
 background:#fff6f3;
 border:1px solid #efd6d2;
 color:var(--rose);
}
.btn-soft:hover{
 background:#f9e6e1;
 color:var(--plum);
 transform:translateY(-2px);
}
.btn-linkline{
 padding:0;
 color:var(--rose);
 border-radius:0;
}
.btn-linkline:hover{color:var(--plum);transform:translateX(3px)}
.btn-brand:active,.btn-soft:active{transform:translateY(1px);box-shadow:none}
.badge-chip{
 display:inline-flex;
 align-items:center;
 width:max-content;
 padding:5px 10px;
 border-radius:8px;
 font-size:12px;
 line-height:1.35;
 font-weight:800;
 background:#f7e5df;
 color:var(--rose);
}
.badge-chip.green{background:var(--mint);color:#397261}
.badge-chip.gold{background:var(--yellow);color:#826322}
.badge-chip.dark{background:rgba(255,255,255,.13);color:#ffe3d8}
.badge-chip.plum{background:#eee1ee;color:var(--plum)}
.page-shell{padding:30px 0 0}
.breadcrumbs{
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 gap:8px;
 margin:0 0 22px;
 color:var(--muted);
 font-size:13px;
}
.breadcrumbs a:hover{color:var(--coral)}
.breadcrumbs span:last-child{color:var(--ink);font-weight:700}
.crumb-sep{color:#b6abb1}
.guide-heading{
 display:flex;
 align-items:flex-end;
 justify-content:space-between;
 gap:30px;
 margin-bottom:34px;
}
.guide-heading-copy{max-width:770px}
.section-kicker{
 margin-bottom:10px;
 color:var(--coral);
 font-weight:800;
 font-size:12px;
 letter-spacing:.12em;
 text-transform:uppercase;
}
h1,h2,h3,p{margin-top:0}
h1{
 margin-bottom:15px;
 font-size:clamp(34px,4.2vw,54px);
 line-height:1.2;
 letter-spacing:-.055em;
 font-weight:850;
}
h2{
 margin-bottom:12px;
 font-size:clamp(27px,3vw,37px);
 line-height:1.28;
 letter-spacing:-.045em;
 font-weight:850;
}
h3{
 margin-bottom:8px;
 font-size:20px;
 line-height:1.38;
 font-weight:800;
 letter-spacing:-.025em;
}
.heading-note{margin:0;color:var(--muted);font-size:16px}
.heading-status{
 display:flex;
 flex-wrap:wrap;
 justify-content:flex-end;
 gap:8px;
 padding-bottom:8px;
}
.feature-guide{
 position:relative;
 display:grid;
 grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr);
 min-height:340px;
 overflow:hidden;
 border-radius:var(--radius-xl);
 color:#fff;
 background:var(--deep);
 box-shadow:var(--shadow);
}
.feature-guide:before{
 content:"";
 position:absolute;
 width:440px;
 height:440px;
 top:-220px;
 right:4%;
 border-radius:50%;
 background:radial-gradient(circle,rgba(250,193,150,.85),rgba(201,67,115,.22) 43%,transparent 69%);
}
.feature-guide:after{
 content:"";
 position:absolute;
 width:240px;
 height:240px;
 left:44%;
 bottom:-145px;
 border-radius:50%;
 background:linear-gradient(135deg,var(--coral),var(--plum));
 opacity:.6;
}
.feature-main{
 position:relative;
 z-index:1;
 padding:42px 46px;
}
.feature-main p{
 max-width:570px;
 color:#ecdfe5;
 margin-bottom:26px;
}
.feature-main h2{font-size:clamp(28px,3.3vw,41px);margin-bottom:14px}
.feature-meta{
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 gap:9px;
}
.guide-steps-mini{
 position:relative;
 z-index:1;
 display:flex;
 flex-direction:column;
 justify-content:center;
 gap:12px;
 padding:35px;
 background:rgba(255,255,255,.07);
 border-left:1px solid rgba(255,255,255,.15);
}
.mini-row{
 display:grid;
 grid-template-columns:34px 1fr;
 gap:11px;
 align-items:center;
 padding:10px 0;
 border-bottom:1px solid rgba(255,255,255,.14);
}
.mini-row:last-child{border-bottom:0}
.mini-no{
 display:flex;
 align-items:center;
 justify-content:center;
 width:34px;
 height:34px;
 border-radius:10px;
 font-size:12px;
 font-weight:900;
 color:#ffe2d3;
 background:rgba(255,255,255,.12);
}
.mini-row b{display:block;font-size:14px}
.mini-row span{display:block;color:#dbccd5;font-size:12px;line-height:1.55}
.section{padding:82px 0}
.content-layout{
 display:grid;
 grid-template-columns:minmax(0,1fr) 270px;
 gap:44px;
 align-items:start;
}
.chapter-stream{min-width:0}
.section-intro{margin-bottom:28px}
.section-intro p{margin:0;color:var(--muted);max-width:680px}
.stream-item{
 position:relative;
 display:grid;
 grid-template-columns:95px minmax(0,1fr);
 gap:23px;
 padding:0 0 34px;
 margin-bottom:34px;
 border-bottom:1px solid var(--line);
}
.stream-item:last-child{margin-bottom:0}
.stream-index{
 position:relative;
 padding-top:4px;
 font-size:13px;
 font-weight:900;
 color:var(--rose);
 letter-spacing:.08em;
}
.stream-index:after{
 content:"";
 position:absolute;
 top:36px;
 left:13px;
 width:1px;
 height:calc(100% + 33px);
 background:linear-gradient(var(--coral),transparent);
}
.stream-item:last-child .stream-index:after{display:none}
.stream-card{
 display:grid;
 grid-template-columns:172px minmax(0,1fr);
 overflow:hidden;
 background:var(--white);
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 box-shadow:var(--shadow-sm);
 transition:var(--ease);
}
.stream-card:hover{
 transform:translateY(-4px);
 border-color:#e5bbb5;
 box-shadow:var(--shadow);
}
.preview-block{
 position:relative;
 min-height:174px;
 overflow:hidden;
 background:#e9d9d7;
}
.preview-block:before,.preview-block:after{
 content:"";
 position:absolute;
 border-radius:50%;
}
.preview-block:before{
 width:180px;height:180px;
 right:-66px;top:-51px;
 background:linear-gradient(135deg,#f59075,#b94570);
}
.preview-block:after{
 width:95px;height:95px;
 left:-28px;bottom:-35px;
 background:#713d71;
}
.preview-lines{
 position:absolute;
 z-index:2;
 left:24px;
 bottom:24px;
 width:85px;
}
.preview-lines i{
 display:block;
 height:7px;
 margin-top:7px;
 border-radius:8px;
 background:rgba(255,255,255,.82);
}
.preview-lines i:nth-child(2){width:68%}
.preview-lines i:nth-child(3){width:46%}
.play-symbol{
 position:absolute;
 z-index:2;
 top:23px;
 left:23px;
 display:flex;
 align-items:center;
 justify-content:center;
 width:39px;
 height:39px;
 padding-left:2px;
 border:1px solid rgba(255,255,255,.62);
 border-radius:12px;
 color:#fff;
 background:rgba(48,36,55,.26);
 font-size:16px;
}
.stream-body{padding:22px 23px}
.stream-body p{margin:0 0 14px;color:var(--muted);font-size:14px}
.stream-tags{display:flex;flex-wrap:wrap;gap:7px}
.directory-wrap{position:relative}
.quick-directory{
 position:sticky;
 top:101px;
 padding:20px;
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 background:#fff;
 box-shadow:var(--shadow-sm);
}
.directory-title{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:10px;
 padding-bottom:13px;
 margin-bottom:7px;
 border-bottom:1px solid var(--line);
 font-size:15px;
 font-weight:850;
}
.quick-directory a{
 display:flex;
 gap:10px;
 align-items:center;
 padding:10px 9px;
 margin:2px 0;
 border-radius:10px;
 color:var(--muted);
 font-size:13px;
 font-weight:700;
}
.quick-directory a span{
 color:var(--coral);
 font-size:11px;
 font-weight:900;
}
.quick-directory a:hover,.quick-directory a.active{
 color:var(--ink);
 background:#f8e8e4;
}
.directory-hint{
 padding:14px 9px 0;
 margin:9px 0 0;
 border-top:1px solid var(--line);
 color:var(--muted);
 font-size:12px;
 line-height:1.65;
}
.related-section{padding-top:8px}
.related-band{
 display:grid;
 grid-template-columns:.9fr 1.1fr;
 gap:20px;
 align-items:stretch;
 padding:26px;
 border:1px solid #ead8d6;
 border-radius:var(--radius-xl);
 background:#f9efec;
}
.related-copy{padding:9px 10px}
.related-copy p{margin:0;color:var(--muted);font-size:14px}
.related-links{
 display:flex;
 flex-direction:column;
 gap:10px;
}
.related-link{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:15px;
 padding:15px 17px;
 border:1px solid var(--line);
 border-radius:var(--radius-md);
 background:#fff;
 font-weight:800;
 font-size:14px;
}
.related-link small{display:block;color:var(--muted);font-weight:500;font-size:12px}
.related-link b{color:var(--rose);font-size:18px}
.related-link:hover{
 color:var(--ink);
 transform:translateX(4px);
 border-color:#dfaaa6;
 box-shadow:var(--shadow-sm);
}
.tip-section{padding-bottom:16px}
.tip-panel{
 display:grid;
 grid-template-columns:1.05fr .95fr;
 overflow:hidden;
 border:1px solid var(--line);
 border-radius:var(--radius-xl);
 background:#fff;
 box-shadow:var(--shadow-sm);
}
.tip-copy{padding:36px 40px}
.tip-copy p{margin:0;color:var(--muted)}
.tip-list{
 display:grid;
 gap:1px;
 background:var(--line);
}
.tip-row{
 display:grid;
 grid-template-columns:36px 1fr;
 gap:12px;
 align-items:center;
 padding:17px 22px;
 background:#fcf7f5;
}
.tip-row strong{
 display:flex;
 justify-content:center;
 align-items:center;
 width:30px;
 height:30px;
 border-radius:9px;
 color:var(--rose);
 background:#f5dfde;
 font-size:13px;
}
.tip-row span{font-size:14px;font-weight:700}
.action-section{padding:66px 0 82px}
.action-card{
 position:relative;
 overflow:hidden;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:30px;
 padding:39px 43px;
 border-radius:var(--radius-xl);
 color:#fff;
 background:linear-gradient(112deg,#512d4f,#843a63 58%,#d65b62);
 box-shadow:var(--shadow);
}
.action-card:after{
 content:"";
 position:absolute;
 width:260px;
 height:260px;
 right:-60px;
 top:-155px;
 border:30px solid rgba(255,225,206,.16);
 border-radius:50%;
}
.action-copy{position:relative;z-index:1;max-width:700px}
.action-copy h2{font-size:clamp(27px,3vw,38px);margin-bottom:9px}
.action-copy p{margin:0;color:#f4dfe2}
.action-buttons{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px}
.action-card .btn-brand{
 color:var(--rose);
 background:#fff;
 box-shadow:none;
}
.action-card .btn-brand:hover{color:var(--plum);background:#fff6f3}
.action-card .btn-soft{
 color:#fff;
 background:transparent;
 border-color:rgba(255,255,255,.5);
}
.action-card .btn-soft:hover{background:rgba(255,255,255,.14);color:#fff}
.faq-section{padding:0 0 82px}
.faq-shell{max-width:890px}
.faq-head{margin-bottom:24px}
.faq-head p{margin:0;color:var(--muted)}
.accordion{--bs-accordion-bg:transparent;--bs-accordion-border-color:transparent;--bs-accordion-btn-focus-box-shadow:none}
.accordion-item{
 overflow:hidden;
 margin-bottom:12px;
 border:1px solid var(--line)!important;
 border-radius:var(--radius-md)!important;
 background:#fff;
 box-shadow:0 5px 16px rgba(62,37,53,.04);
}
.accordion-button{
 padding:18px 20px;
 color:var(--ink);
 background:#fff;
 font-weight:800;
 font-size:16px;
}
.accordion-button:not(.collapsed){
 color:var(--plum);
 background:#fcf3f1;
 box-shadow:none;
}
.accordion-button:after{
 width:22px;
 height:22px;
 background-size:15px;
 border-radius:7px;
 background-color:#f5dfde;
}
.accordion-body{
 padding:0 20px 20px;
 color:var(--muted);
 font-size:14px;
}
footer{
 margin-top:0;
 padding:56px 0 24px;
 color:#d9cbd3;
 background:var(--deep);
}
.footer-grid{
 display:grid;
 grid-template-columns:1.55fr .8fr .8fr;
 gap:44px;
 padding-bottom:38px;
}
.footer-brand{color:#fff}
.footer-brand:hover{color:#fff}
.footer-copy{max-width:380px;margin-bottom:0;color:#cbbbc5;font-size:14px}
.footer-title{
 margin-bottom:12px;
 color:#fff0f1;
 font-weight:850;
 font-size:14px;
}
.footer-links{display:flex;flex-direction:column;gap:8px}
.footer-links a{color:#cbbbc5;font-size:14px}
.footer-links a:hover{color:#ffb8aa}
.copyright{
 display:flex;
 justify-content:space-between;
 gap:15px;
 padding-top:20px;
 border-top:1px solid rgba(255,255,255,.12);
 color:#a99aa4;
 font-size:12px;
}
@media (max-width:991px){
 .command-bar{flex-wrap:wrap;padding:13px 0}
 .main-nav{order:3;width:100%;margin-left:0;overflow-x:auto;padding-bottom:1px}
 .main-nav a{white-space:nowrap}
 .nav-tools{margin-left:auto}
 .feature-guide{grid-template-columns:1fr}
 .guide-steps-mini{display:grid;grid-template-columns:repeat(3,1fr);border-left:0;border-top:1px solid rgba(255,255,255,.14)}
 .mini-row{border-bottom:0;border-right:1px solid rgba(255,255,255,.14)}
 .mini-row:last-child{border-right:0}
 .content-layout{grid-template-columns:1fr;gap:28px}
 .quick-directory{position:relative;top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
 .directory-title,.directory-hint{grid-column:1/-1}
 .quick-directory a{margin:0}
 .related-band,.tip-panel{grid-template-columns:1fr}
 .tip-list{border-top:1px solid var(--line)}
}
@media (max-width:767px){
 body{font-size:15px}
 .container{padding-left:18px;padding-right:18px}
 .site-header{position:relative}
 .command-bar{min-height:68px}
 .brand-text{font-size:15px}
 .brand-mark{width:31px;height:31px;border-radius:10px}
 .brand-mark:after{left:12px;top:8px;border-left-width:9px;border-top-width:7px;border-bottom-width:7px}
 .nav-tools{width:100%;order:4}
 .search-box{width:100%;flex:1}
 .nav-tools .btn-brand{padding:10px 13px;white-space:nowrap}
 .page-shell{padding-top:24px}
 .guide-heading{display:block;margin-bottom:25px}
 .heading-status{justify-content:flex-start;padding-top:14px;padding-bottom:0}
 .feature-main{padding:33px 27px}
 .guide-steps-mini{grid-template-columns:1fr;padding:22px 27px}
 .mini-row{border-right:0;border-bottom:1px solid rgba(255,255,255,.14)}
 .mini-row:last-child{border-bottom:0}
 .section{padding:58px 0}
 .stream-item{grid-template-columns:1fr;gap:9px;padding-bottom:27px;margin-bottom:27px}
 .stream-index:after{display:none}
 .stream-card{grid-template-columns:1fr}
 .preview-block{min-height:142px}
 .stream-body{padding:20px}
 .quick-directory{grid-template-columns:1fr 1fr;padding:16px}
 .quick-directory a{padding:9px 7px}
 .related-band{padding:18px}
 .tip-copy{padding:28px 24px}
 .tip-row{padding:15px 18px}
 .action-section{padding:50px 0 58px}
 .action-card{display:block;padding:30px 26px}
 .action-buttons{margin-top:22px}
 .faq-section{padding-bottom:58px}
 .footer-grid{grid-template-columns:1fr;gap:28px}
 .copyright{flex-direction:column;gap:3px}
}
@media (max-width:520px){
 h1{font-size:32px}
 h2{font-size:27px}
 .main-nav a{padding:8px 10px;font-size:13px}
 .nav-tools .btn-brand{display:none}
 .feature-main{padding:29px 23px}
 .feature-meta{gap:7px}
 .badge-chip{font-size:11px}
 .quick-directory{grid-template-columns:1fr}
 .related-link{padding:13px}
 .accordion-button{padding:16px;font-size:15px}
 .accordion-body{padding:0 16px 17px}
}