/* roulang page: index */
:root{
      --plum:#5b234f;
      --plum-dark:#421839;
      --coral:#d9785f;
      --mint:#86a99a;
      --ink:#29242a;
      --muted:#716873;
      --paper:#fffdfc;
      --mist:#f8f4f0;
      --lilac:#eee7ec;
      --line:#ddd3da;
      --shadow:0 12px 30px rgba(72,39,65,.08);
      --radius:8px;
      --max:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--mist);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.75;font-size:15px}
    a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease}
    img{display:block;width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    .grid-container{max-width:var(--max);padding-left:24px;padding-right:24px}
    .topbar{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
    .nav-row{min-height:76px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:12px;min-width:250px}
    .brand-mark{width:38px;height:38px;background:var(--plum);color:#fff;border-radius:7px;display:grid;place-items:center;font-weight:800;font-size:18px}
    .brand-title{font-size:17px;font-weight:800;line-height:1.25;color:var(--plum)}
    .brand-sub{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:3px}
    .desktop-nav{display:flex;align-items:center;gap:4px;flex:1}
    .desktop-nav>a{padding:9px 12px;border-radius:5px;color:var(--muted);font-size:14px}
    .desktop-nav>a:hover,.desktop-nav>a.active{color:var(--plum);background:var(--lilac)}
    .nav-actions{display:flex;gap:8px;align-items:center}
    .icon-btn{height:40px;width:40px;border:1px solid var(--line);background:var(--paper);color:var(--plum);border-radius:5px;cursor:pointer}
    .icon-btn:hover{border-color:var(--plum);background:var(--lilac)}
    .menu-button{display:none}
    .phasebar{border-top:1px solid #f0e9ed;background:#fcfaf9}
    .phase-track{display:flex;align-items:center;gap:0;overflow-x:auto;white-space:nowrap}
    .phase{display:flex;align-items:center;gap:9px;padding:11px 22px 11px 0;margin-right:22px;position:relative;color:var(--muted);font-size:13px}
    .phase:not(:last-child):after{content:"";position:absolute;height:1px;width:22px;background:var(--line);right:-1px;top:50%}
    .phase-dot{width:9px;height:9px;border-radius:50%;background:var(--line);border:2px solid var(--paper);box-shadow:0 0 0 1px var(--line)}
    .phase.preheat .phase-dot{background:#b29aa9}.phase.live{color:var(--coral);font-weight:700}.phase.live .phase-dot{background:var(--coral);box-shadow:0 0 0 1px var(--coral)}.phase.replay .phase-dot{background:var(--mint)}
    .hero{padding:76px 0 62px;background:var(--plum);color:#fff}
    .hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:58px;align-items:center}
    .eyebrow{color:#f0b9a9;text-transform:uppercase;letter-spacing:1.4px;font-size:12px;font-weight:700;margin-bottom:18px}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(36px,5vw,54px);line-height:1.18;letter-spacing:0;font-weight:800;margin-bottom:20px;max-width:700px}
    .hero-copy{font-size:17px;line-height:1.9;color:#f4e8ef;max-width:650px;margin-bottom:28px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .button{border-radius:5px;font-weight:700;min-height:44px;padding:11px 19px;margin:0;transition:transform .2s,background .2s,box-shadow .2s}
    .button.primary{background:var(--coral);color:#fff}.button.primary:hover{background:#bd604e;transform:translateY(-1px)}
    .button.secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}.button.secondary:hover{background:#fff;color:var(--plum)}
    .button.outline{background:transparent;color:var(--plum);border:1px solid var(--plum)}.button.outline:hover{background:var(--plum);color:#fff}
    :focus-visible{outline:3px solid #e9a08d;outline-offset:3px}
    .hero-note{font-size:12px;color:#d8c7d3;margin-top:21px}
    .hero-gallery{display:grid;grid-template-columns:1.18fr .82fr;gap:12px;align-items:end}
    .cover{overflow:hidden;border-radius:7px;background:#3f1837;border:1px solid rgba(255,255,255,.18);position:relative}
    .cover.large{height:330px}.cover.small{height:220px;margin-bottom:38px}
    .cover img{height:100%;object-fit:cover;transition:transform .3s}
    .cover:hover img{transform:scale(1.04)}
    .cover-caption{position:absolute;left:0;right:0;bottom:0;padding:30px 15px 13px;background:linear-gradient(transparent,rgba(25,10,23,.85));font-size:13px}
    section{padding:84px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}
    .section-kicker{font-size:12px;color:var(--coral);font-weight:800;letter-spacing:1px;margin-bottom:7px}
    h2{font-size:32px;line-height:1.3;color:var(--plum);margin-bottom:9px;font-weight:800}
    .section-intro{color:var(--muted);max-width:650px;margin-bottom:0}
    .text-link{color:var(--plum);font-weight:700;border-bottom:1px solid var(--plum);padding-bottom:2px}
    .entry-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:24px}
    .entry-feature{display:grid;grid-template-columns:.9fr 1.1fr;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .entry-feature img{height:100%;min-height:260px;object-fit:cover}
    .entry-body{padding:28px}
    .tag{display:inline-block;padding:4px 9px;border-radius:3px;background:var(--lilac);color:var(--plum);font-size:12px;font-weight:700;margin-right:6px}
    .tag.live{background:#f9dfd8;color:#a14e3d}.tag.done{background:#e2eee9;color:#527768}
    h3{font-size:21px;line-height:1.4;color:var(--ink);margin:15px 0 10px}
    .entry-body p{color:var(--muted);font-size:14px}
    .arrow{font-size:22px;color:var(--coral);float:right}
    .index-list{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:10px 22px}
    .index-item{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
    .index-item:last-child{border-bottom:0}.index-item strong{font-size:15px}.index-meta{font-size:12px;color:var(--muted);white-space:nowrap}
    .metrics{background:var(--lilac);padding:52px 0}
    .metric-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #d7cbd4;border-bottom:1px solid #d7cbd4}
    .metric{padding:25px 20px;border-right:1px solid #d7cbd4}.metric:last-child{border-right:0}
    .metric strong{font-size:38px;color:var(--plum);display:block;line-height:1.2}.metric span{color:var(--muted);font-size:13px}
    .editorial{background:var(--paper)}
    .editorial-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:30px}
    .main-story{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--mist)}
    .main-story img{height:300px;object-fit:cover}.story-text{padding:22px}.story-text p{color:var(--muted);font-size:14px}
    .story-list{display:flex;flex-direction:column;gap:14px}
    .story-item{display:grid;grid-template-columns:118px 1fr;gap:16px;background:var(--mist);border:1px solid var(--line);padding:10px;border-radius:var(--radius)}
    .story-item img{height:88px;object-fit:cover;border-radius:4px}.story-item h3{font-size:16px;margin:4px 0}.story-item small{color:var(--muted)}
    .timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:35px}
    .step{position:relative;padding:0 30px 0 52px;border-top:2px solid var(--line);min-height:150px}.step:before{content:attr(data-step);position:absolute;left:0;top:-17px;width:32px;height:32px;border-radius:50%;background:var(--plum);color:#fff;display:grid;place-items:center;font-weight:800}.step h3{margin-top:28px;font-size:18px}.step p{font-size:14px;color:var(--muted)}
    .rank-section{background:var(--plum);color:#fff}.rank-section h2{color:#fff}.rank-section .section-intro{color:#decdd8}
    .rank-list{border-top:1px solid rgba(255,255,255,.25)}
    .rank-row{display:grid;grid-template-columns:60px 1fr 130px 100px;gap:18px;align-items:center;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.18)}
    .rank-no{font-size:25px;color:#e9a08d;font-weight:800}.rank-title{font-weight:700}.rank-sub{display:block;color:#d5c4d0;font-size:12px;font-weight:400}.rank-stat{color:#eadde4;font-size:13px}.trend{color:#f0b19f;font-size:13px}
    .faq-contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px}
    .accordion{background:transparent;margin:10px 0 0;border:0}.accordion-item{border-bottom:1px solid var(--line)}.accordion-title{color:var(--ink);font-weight:700;padding:20px 34px 20px 0;border:0;background:transparent}.accordion-title:hover{color:var(--plum);background:transparent}.accordion-content{border:0;background:transparent;padding:0 20px 20px 0;color:var(--muted);font-size:14px}
    .form-panel{background:var(--paper);border:1px solid var(--line);padding:28px;border-radius:var(--radius);box-shadow:var(--shadow)}
    label{font-weight:700;color:var(--ink);font-size:13px}input,select,textarea{border:1px solid var(--line)!important;border-radius:4px!important;background:#fff!important;box-shadow:none!important;margin-top:6px}input:focus,select:focus,textarea:focus{border-color:var(--plum)!important}
    textarea{min-height:112px;resize:vertical}.required{color:var(--coral)}
    .cta{padding:55px 0;background:#f1e3e5}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{margin-bottom:4px}.cta p{color:var(--muted);margin:0}
    footer{background:#29242a;color:#eee4eb;padding:48px 0 25px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}.footer-brand{font-size:19px;font-weight:800;color:#fff}.footer-copy{color:#b9aab5;font-size:13px;max-width:360px;margin-top:12px}.footer-title{font-weight:800;color:#fff;margin-bottom:12px}.footer-links{display:flex;flex-direction:column;gap:7px;color:#c7b8c2;font-size:13px}.footer-links a:hover{color:#f0a08d}.copyright{border-top:1px solid #443b43;margin-top:35px;padding-top:18px;color:#998b96;font-size:12px;display:flex;justify-content:space-between;gap:20px}
    @media(max-width:900px){.brand{min-width:auto}.desktop-nav{gap:0}.desktop-nav>a{padding:8px}.hero-grid,.editorial-grid,.faq-contact{grid-template-columns:1fr;gap:34px}.entry-layout{grid-template-columns:1fr}.cover.large{height:300px}.cover.small{height:200px}.timeline{grid-template-columns:1fr;gap:35px}.step{border-top:0;border-left:2px solid var(--line);padding-bottom:8px}.step:before{left:-17px;top:0}.step h3{margin-top:0;padding-top:3px}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:700px){.grid-container{padding-left:18px;padding-right:18px}.nav-row{min-height:68px;gap:12px}.brand-title{font-size:15px}.brand-mark{width:34px;height:34px}.desktop-nav,.nav-actions .icon-btn:first-child{display:none}.menu-button{display:block;margin-left:auto}.phase{margin-right:14px;padding-right:14px}.hero{padding:53px 0 45px}.hero-grid{display:flex;flex-direction:column;align-items:stretch}.hero-copy{font-size:15px}.hero-gallery{max-width:500px}.cover.large{height:250px}.cover.small{height:170px;margin-bottom:22px}section{padding:58px 0}.section-head{display:block}.section-head .text-link{display:inline-block;margin-top:12px}h2{font-size:26px}.entry-feature{grid-template-columns:1fr}.entry-feature img{height:210px;min-height:0}.metric-grid{grid-template-columns:repeat(2,1fr)}.metric{padding:20px 12px}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid #d7cbd4}.metric strong{font-size:30px}.rank-row{grid-template-columns:38px 1fr 70px;gap:10px}.rank-row .rank-stat{display:none}.cta-inner{display:block}.cta .button{margin-top:20px}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:7px}}
    @media(max-width:430px){h1{font-size:32px}.hero-gallery{grid-template-columns:1fr .72fr}.cover.large{height:205px}.cover.small{height:140px}.story-item{grid-template-columns:90px 1fr}.story-item img{height:76px}.form-panel{padding:20px}}

/* roulang page: category2 */
:root{--plum:#5b234f;--plum-dark:#421839;--coral:#d9785f;--mint:#86a99a;--ink:#29242a;--muted:#716873;--paper:#fffdfc;--mist:#f8f4f0;--lilac:#eee7ec;--line:#ddd3da;--shadow:0 12px 30px rgba(72,39,65,.08);--radius:8px;--max:1200px}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--mist);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.75}
    a{color:inherit;text-decoration:none;transition:color .2s,background .2s,border-color .2s,transform .2s}
    img{display:block;width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    h1,h2,h3,p{margin-top:0}
    h1,h2,h3{line-height:1.3;letter-spacing:0}
    .grid-container{max-width:var(--max);padding-left:24px;padding-right:24px}
    .topbar{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
    .nav-row{min-height:76px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:12px;min-width:250px}
    .brand-mark{width:38px;height:38px;background:var(--plum);color:#fff;border-radius:7px;display:grid;place-items:center;font-weight:800;font-size:18px}
    .brand-title{font-size:17px;font-weight:800;line-height:1.25;color:var(--plum)}
    .brand-sub{display:block;color:var(--muted);font-size:11px;margin-top:3px}
    .desktop-nav{display:flex;align-items:center;gap:4px;flex:1}
    .desktop-nav>a{padding:9px 12px;border-radius:5px;color:var(--muted);font-size:14px}
    .desktop-nav>a:hover,.desktop-nav>a.active{color:var(--plum);background:var(--lilac)}
    .nav-actions{display:flex;gap:8px;align-items:center}
    .icon-btn{height:40px;width:40px;border:1px solid var(--line);background:var(--paper);color:var(--plum);border-radius:5px;cursor:pointer}
    .icon-btn:hover,.icon-btn:focus{border-color:var(--plum);background:var(--lilac);outline:3px solid rgba(217,120,95,.2)}
    .menu-button{display:none}
    .phasebar{border-top:1px solid #eee7ea;background:#fcf9f7}
    .phase-track{display:flex;align-items:center;gap:34px;height:42px;overflow:auto;white-space:nowrap}
    .phase{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:7px}
    .phase-dot{width:8px;height:8px;border-radius:50%;background:#bcaeba}
    .phase.live{color:#a14e3d;font-weight:700}.phase.live .phase-dot{background:var(--coral)}
    .phase.replay{color:#527768}.phase.replay .phase-dot{background:var(--mint)}
    .page-hero{padding:62px 0 54px;background:var(--plum);color:#fff}
    .hero-layout{display:grid;grid-template-columns:1fr .86fr;gap:54px;align-items:center}
    .eyebrow,.section-kicker{color:var(--coral);font-size:12px;font-weight:800;letter-spacing:1px}
    .page-hero h1{font-size:clamp(34px,4.5vw,52px);margin:14px 0 18px;max-width:680px}
    .hero-text{font-size:17px;color:#f4e8ef;max-width:650px;margin-bottom:25px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .button{border-radius:5px;font-weight:700;min-height:44px;padding:11px 19px;margin:0;cursor:pointer}
    .button.primary{background:var(--coral);color:#fff}.button.primary:hover{background:#bd604e;transform:translateY(-1px)}
    .button.secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}.button.secondary:hover{background:#fff;color:var(--plum)}
    .hero-note{font-size:12px;color:#d8c7d3;margin:20px 0 0}
    .hero-cover{aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius);border:1px solid rgba(255,255,255,.25)}
    .hero-cover img{height:100%;object-fit:cover;transition:transform .3s}.hero-cover:hover img{transform:scale(1.04)}
    section{padding:76px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}
    .section-head h2{font-size:31px;margin:8px 0 0}.section-intro{color:var(--muted);max-width:650px;margin:0}
    .timeline{display:grid;grid-template-columns:repeat(3,1fr);position:relative;margin-bottom:42px}
    .timeline:before{content:"";position:absolute;left:8%;right:8%;top:17px;height:1px;background:var(--line)}
    .time-node{position:relative;text-align:center}.time-node span{display:grid;place-items:center;width:34px;height:34px;margin:0 auto 12px;border-radius:50%;background:var(--paper);border:1px solid var(--line);color:var(--plum);font-weight:800}
    .time-node.active span{background:var(--coral);border-color:var(--coral);color:#fff}.time-node strong{display:block}.time-node small{color:var(--muted)}
    .feature-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;align-items:stretch}
    .main-feature,.small-feature,.compact-list{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .main-feature img{height:290px;object-fit:cover}.feature-copy{padding:23px}.feature-copy h3{font-size:23px;margin:10px 0}.feature-copy p,.small-copy p{color:var(--muted);font-size:14px}
    .tag{display:inline-block;padding:4px 9px;border-radius:3px;background:var(--lilac);color:var(--plum);font-size:12px;font-weight:700;margin-right:6px}.tag.live{background:#f9dfd8;color:#a14e3d}.tag.done{background:#e2eee9;color:#527768}
    .side-stack{display:grid;gap:22px}.small-feature{display:grid;grid-template-columns:145px 1fr}.small-feature img{height:100%;min-height:145px;object-fit:cover}.small-copy{padding:17px}.small-copy h3{font-size:17px;margin:8px 0}
    .compact-list{padding:5px 22px}.compact-item{display:flex;justify-content:space-between;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}.compact-item:last-child{border:0}.compact-item strong{font-size:14px}.compact-item small{color:var(--muted);white-space:nowrap}
    .info-band{background:var(--lilac);padding:42px 0}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #d7cbd4;border-bottom:1px solid #d7cbd4}.metric{padding:20px 22px;border-right:1px solid #d7cbd4}.metric:last-child{border:0}.metric b{display:block;font-size:30px;color:var(--plum);line-height:1.2}.metric span{color:var(--muted);font-size:13px}
    .faq-contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px}.accordion{background:transparent}.accordion-item{border-bottom:1px solid var(--line)}.accordion-title{color:var(--ink);font-weight:700;padding:20px 34px 20px 0;border:0;background:transparent}.accordion-title:hover{color:var(--plum);background:transparent}.accordion-content{background:transparent;color:var(--muted);padding:0 34px 20px 0}
    .form-panel{background:var(--paper);border:1px solid var(--line);padding:28px;border-radius:var(--radius);box-shadow:var(--shadow)}label{font-weight:700;color:var(--ink)}input,select,textarea{border:1px solid var(--line)!important;border-radius:4px!important;background:#fff!important;box-shadow:none!important;margin-top:6px}input:focus,select:focus,textarea:focus{border-color:var(--plum)!important;box-shadow:0 0 0 3px rgba(91,35,79,.12)!important}textarea{min-height:112px;resize:vertical}
    .cta{padding:52px 0;background:#f1e3e5}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{margin-bottom:5px}.cta p{color:var(--muted);margin:0}
    footer{background:#29242a;color:#eee4eb;padding:48px 0 25px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}.footer-brand{font-size:19px;font-weight:800;color:#fff}.footer-copy{color:#bfb1bb;font-size:13px;max-width:420px}.footer-title{font-weight:700;color:#fff;margin-bottom:12px}.footer-links{display:grid;gap:7px;color:#bfb1bb;font-size:13px}.footer-links a:hover{color:#fff}.copyright{border-top:1px solid rgba(255,255,255,.14);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;color:#9d909a;font-size:12px}
    @media(max-width:768px){.grid-container{padding-left:18px;padding-right:18px}.nav-row{min-height:68px;gap:12px}.brand{min-width:0;flex:1}.brand-title{font-size:14px}.brand-sub{font-size:10px}.desktop-nav{display:none}.menu-button{display:block}.page-hero{padding:48px 0 42px}.hero-layout,.feature-grid,.faq-contact{grid-template-columns:1fr;gap:28px}.page-hero h1{font-size:36px}.hero-text{font-size:15px}.timeline{min-width:570px}.timeline-wrap{overflow:auto}.metrics{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid #d7cbd4}.small-feature{grid-template-columns:120px 1fr}.section-head{display:block}.section-head h2{font-size:25px;margin-bottom:8px}.cta-inner{display:block}.cta .button{margin-top:20px}.footer-grid{grid-template-columns:1fr;gap:25px}.copyright{display:grid;gap:6px}}
    @media(max-width:520px){section{padding:52px 0}.page-hero h1{font-size:31px}.hero-actions .button{width:100%;text-align:center}.main-feature img{height:210px}.small-feature{display:block}.small-feature img{height:170px}.compact-list{padding:5px 15px}.compact-item{display:block}.compact-item small{display:block;margin-top:4px}.metrics{grid-template-columns:1fr}.metric{border-right:0!important;border-bottom:1px solid #d7cbd4}.metric:last-child{border-bottom:0}}

/* roulang page: category1 */
:root{
      --plum:#5b234f;
      --plum-dark:#421839;
      --coral:#d9785f;
      --mint:#86a99a;
      --ink:#29242a;
      --muted:#716873;
      --paper:#fffdfc;
      --mist:#f8f4f0;
      --lilac:#eee7ec;
      --line:#ddd3da;
      --shadow:0 12px 30px rgba(72,39,65,.08);
      --shadow-small:0 5px 18px rgba(72,39,65,.07);
      --radius:8px;
      --max:1200px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--mist);
      color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
      font-size:15px;
      line-height:1.75;
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.3;font-weight:800;letter-spacing:0}
    h1{font-size:clamp(32px,4vw,48px);margin-bottom:18px}
    h2{font-size:32px;margin-bottom:10px}
    h3{font-size:19px;margin-bottom:7px}
    a{
      color:inherit;
      text-decoration:none;
      transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
    }
    img{display:block;width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid rgba(217,120,95,.55);outline-offset:3px}
    .grid-container{max-width:var(--max);padding-left:24px;padding-right:24px}
    .topbar{
      position:sticky;
      top:0;
      z-index:30;
      background:var(--paper);
      border-bottom:1px solid var(--line);
    }
    .nav-row{
      min-height:76px;
      display:flex;
      align-items:center;
      gap:28px;
    }
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      min-width:250px;
    }
    .brand-mark{
      width:38px;
      height:38px;
      display:grid;
      place-items:center;
      flex:none;
      color:#fff;
      background:var(--plum);
      border-radius:7px;
      font-size:18px;
      font-weight:800;
    }
    .brand-title{
      display:block;
      color:var(--plum);
      font-size:17px;
      font-weight:800;
      line-height:1.25;
    }
    .brand-sub{
      display:block;
      color:var(--muted);
      font-size:11px;
      font-weight:500;
      margin-top:3px;
    }
    .desktop-nav{
      display:flex;
      align-items:center;
      gap:4px;
      flex:1;
    }
    .desktop-nav>a{
      padding:9px 12px;
      border-radius:5px;
      color:var(--muted);
      font-size:14px;
    }
    .desktop-nav>a:hover,
    .desktop-nav>a.active{
      color:var(--plum);
      background:var(--lilac);
    }
    .nav-actions{display:flex;gap:8px;align-items:center}
    .icon-btn{
      width:40px;
      height:40px;
      border:1px solid var(--line);
      border-radius:5px;
      background:var(--paper);
      color:var(--plum);
      font-size:21px;
      line-height:1;
    }
    .icon-btn:hover{border-color:var(--plum);background:var(--lilac)}
    .menu-button{display:none}
    .phasebar{
      border-top:1px solid rgba(221,211,218,.65);
      background:#fbf8f6;
    }
    .phase-track{
      min-height:43px;
      display:flex;
      align-items:center;
      gap:28px;
      position:relative;
    }
    .phase-track:before{
      content:"";
      position:absolute;
      left:9px;
      right:9px;
      top:21px;
      height:1px;
      background:var(--line);
      z-index:0;
    }
    .phase{
      position:relative;
      z-index:1;
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding-right:12px;
      background:#fbf8f6;
      color:var(--muted);
      font-size:12px;
      font-weight:700;
    }
    .phase-dot{
      width:9px;
      height:9px;
      display:inline-block;
      border-radius:50%;
      border:2px solid currentColor;
      background:#fbf8f6;
    }
    .phase.preheat{color:#9f7b55}
    .phase.live{color:var(--coral)}
    .phase.replay{color:var(--mint)}
    .phase.live .phase-dot{background:var(--coral);border-color:var(--coral)}
    .inner-hero{
      padding:58px 0 52px;
      background:var(--plum);
      color:#fff;
    }
    .inner-hero-grid{
      display:grid;
      grid-template-columns:1fr 360px;
      gap:50px;
      align-items:center;
    }
    .eyebrow{
      color:#f0b9a9;
      font-size:12px;
      font-weight:800;
      letter-spacing:1px;
      margin-bottom:13px;
    }
    .inner-hero h1{max-width:720px}
    .hero-summary{
      max-width:680px;
      margin-bottom:24px;
      color:#f4e8ef;
      font-size:16px;
    }
    .hero-note{
      margin:18px 0 0;
      color:#d8c7d3;
      font-size:12px;
    }
    .hero-image{
      overflow:hidden;
      border:1px solid rgba(255,255,255,.3);
      border-radius:var(--radius);
      box-shadow:0 18px 35px rgba(31,14,28,.22);
      aspect-ratio:16/10;
      background:var(--plum-dark);
    }
    .hero-image img{height:100%;object-fit:cover}
    .button{
      min-height:44px;
      padding:11px 19px;
      margin:0;
      border-radius:5px;
      font-weight:700;
      transition:transform .2s,background .2s,box-shadow .2s,border-color .2s;
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#bd604e;transform:translateY(-1px)}
    .button.outline{
      color:var(--plum);
      background:transparent;
      border:1px solid var(--plum);
    }
    .button.outline:hover{color:#fff;background:var(--plum)}
    .button.light-outline{
      color:#fff;
      background:transparent;
      border:1px solid rgba(255,255,255,.58);
    }
    .button.light-outline:hover{color:var(--plum);background:#fff}
    .button.small{min-height:38px;padding:8px 13px;font-size:13px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    section{padding:72px 0}
    .section-head{
      display:flex;
      align-items:end;
      justify-content:space-between;
      gap:25px;
      margin-bottom:27px;
    }
    .section-kicker{
      color:var(--coral);
      font-size:12px;
      font-weight:800;
      letter-spacing:1px;
      margin-bottom:6px;
    }
    .section-intro{max-width:680px;color:var(--muted);margin-bottom:0}
    .content-layout{
      display:grid;
      grid-template-columns:260px 1fr;
      gap:28px;
      align-items:start;
    }
    .filter-panel{
      position:sticky;
      top:145px;
      padding:22px;
      background:var(--paper);
      border:1px solid var(--line);
      border-radius:var(--radius);
      box-shadow:var(--shadow-small);
    }
    .filter-panel h2{font-size:20px;margin-bottom:18px}
    .filter-group{
      padding:17px 0;
      border-top:1px solid var(--line);
    }
    .filter-group:first-of-type{border-top:0;padding-top:0}
    .filter-label{
      display:block;
      color:var(--ink);
      font-size:13px;
      font-weight:800;
      margin-bottom:9px;
    }
    .filter-options{display:grid;gap:8px}
    .filter-options label{
      display:flex;
      align-items:center;
      gap:8px;
      color:var(--muted);
      font-size:13px;
      cursor:pointer;
    }
    .filter-options input{
      width:15px;
      height:15px;
      margin:0!important;
      accent-color:var(--plum);
    }
    select{
      width:100%;
      height:42px;
      margin:0!important;
      padding:7px 10px!important;
      border:1px solid var(--line)!important;
      border-radius:4px!important;
      background:#fff!important;
      color:var(--ink);
      box-shadow:none!important;
    }
    select:focus,input:focus,textarea:focus{border-color:var(--plum)!important}
    .filter-actions{display:flex;gap:8px;margin-top:8px}
    .filter-actions .button{flex:1}
    .result-head{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:20px;
      padding-bottom:16px;
      border-bottom:1px solid var(--line);
    }
    .result-count{font-size:14px;color:var(--muted)}
    .result-count strong{color:var(--plum);font-size:18px}
    .sort-control{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}
    .sort-control select{width:145px;height:38px}
    .media-list{display:grid;gap:16px;margin-top:18px}
    .media-row{
      display:grid;
      grid-template-columns:220px 1fr;
      gap:22px;
      padding:14px;
      background:var(--paper);
      border:1px solid var(--line);
      border-radius:var(--radius);
      box-shadow:0 3px 12px rgba(72,39,65,.035);
      transition:border-color .2s,box-shadow .2s,transform .2s;
    }
    .media-row:hover{
      border-color:#bda8b9;
      box-shadow:var(--shadow-small);
      transform:translateY(-2px);
    }
    .media-thumb{
      aspect-ratio:4/3;
      overflow:hidden;
      border-radius:5px;
      background:var(--lilac);
    }
    .media-thumb img{height:100%;object-fit:cover;transition:transform .25s}
    .media-row:hover .media-thumb img{transform:scale(1.035)}
    .media-body{display:flex;flex-direction:column;justify-content:center;padding:4px 7px 4px 0}
    .media-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:9px}
    .tag{
      display:inline-block;
      padding:3px 8px;
      border-radius:3px;
      background:var(--lilac);
      color:var(--plum);
      font-size:12px;
      font-weight:700;
    }
    .tag.live{background:#f9dfd8;color:#a14e3d}
    .tag.done{background:#e2eee9;color:#527768}
    .tag.soft{background:#f0e9de;color:#866b4d}
    .media-date{color:var(--muted);font-size:12px}
    .media-body h3{margin-bottom:7px}
    .media-body h3 a:hover{color:var(--plum)}
    .media-body p{color:var(--muted);font-size:14px;margin-bottom:15px}
    .media-footer{display:flex;align-items:center;justify-content:space-between;gap:15px}
    .status-line{color:var(--muted);font-size:12px}
    .status-line i{
      width:7px;
      height:7px;
      display:inline-block;
      margin-right:5px;
      border-radius:50%;
      background:var(--mint);
    }
    .status-line.current i{background:var(--coral)}
    .pagination-wrap{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:27px}
    .pagination{margin:0}
    .pagination li a,.pagination li button{
      color:var(--plum);
      border-radius:4px;
    }
    .pagination li.current{
      padding:0;
      background:var(--plum);
      border-radius:4px;
    }
    .pagination li.current span{display:block;padding:7px 12px;color:#fff}
    .empty-state{
      display:none;
      padding:36px 22px;
      text-align:center;
      background:var(--paper);
      border:1px dashed var(--line);
      color:var(--muted);
      border-radius:var(--radius);
    }
    .related-band{background:var(--lilac)}
    .related-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .related-entry{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      padding:22px 24px;
      background:var(--paper);
      border:1px solid var(--line);
      border-radius:var(--radius);
    }
    .related-entry:hover{border-color:var(--plum);transform:translateY(-2px)}
    .related-entry p{margin:0;color:var(--muted);font-size:13px}
    .related-arrow{color:var(--coral);font-size:23px}
    .faq-section{background:var(--paper)}
    .faq-list{max-width:850px;margin:0 auto}
    .accordion{background:transparent}
    .accordion-item{border-bottom:1px solid var(--line)}
    .accordion-title{
      padding:19px 38px 19px 0;
      border:0;
      background:transparent;
      color:var(--ink);
      font-weight:700;
      font-size:16px;
    }
    .accordion-title:hover{color:var(--plum);background:transparent}
    .accordion-content{
      padding:0 38px 20px 0;
      border:0;
      background:transparent;
      color:var(--muted);
      font-size:14px;
    }
    .cta{padding:54px 0;background:#f1e3e5}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .cta h2{margin-bottom:5px}
    .cta p{margin:0;color:var(--muted)}
    footer{padding:48px 0 25px;background:#29242a;color:#eee4eb}
    .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
    .footer-brand{font-size:19px;font-weight:800;color:#fff;margin-bottom:10px}
    .footer-copy{max-width:400px;color:#bcb0ba;font-size:13px;margin:0}
    .footer-title{color:#fff;font-size:14px;font-weight:800;margin-bottom:11px}
    .footer-links{display:grid;gap:7px}
    .footer-links a{color:#bcb0ba;font-size:13px}
    .footer-links a:hover{color:#f2b5a5}
    .copyright{
      display:flex;
      justify-content:space-between;
      gap:20px;
      padding-top:24px;
      margin-top:34px;
      border-top:1px solid rgba(255,255,255,.14);
      color:#998d98;
      font-size:12px;
    }
    .feedback-message{
      display:none;
      padding:11px 14px;
      margin-top:14px;
      border-left:3px solid var(--mint);
      background:#e7f0ec;
      color:#527768;
      font-size:13px;
    }
    @media(max-width:900px){
      .nav-row{gap:14px}
      .brand{min-width:0;flex:1}
      .desktop-nav{display:none}
      .menu-button{display:block}
      .inner-hero-grid{grid-template-columns:1fr 300px;gap:28px}
      .content-layout{grid-template-columns:220px 1fr;gap:20px}
      .media-row{grid-template-columns:180px 1fr}
    }
    @media(max-width:767px){
      .grid-container{padding-left:18px;padding-right:18px}
      .nav-row{min-height:68px}
      .brand-title{font-size:15px}
      .brand-sub{font-size:10px}
      .brand-mark{width:34px;height:34px}
      .nav-actions{gap:5px}
      .icon-btn{width:38px;height:38px}
      .phase-track{overflow-x:auto;gap:22px;white-space:nowrap}
      .inner-hero{padding:44px 0 40px}
      .inner-hero-grid{grid-template-columns:1fr;gap:25px}
      .inner-hero h1{font-size:34px}
      .hero-summary{font-size:15px}
      section{padding:52px 0}
      .content-layout{display:block}
      .filter-panel{position:static;margin-bottom:22px}
      .filter-panel h2:after{content:"筛选条件";font-size:12px;color:var(--muted);font-weight:500;margin-left:8px}
      .filter-group{padding:13px 0}
      .result-head{align-items:flex-start;flex-direction:column;gap:10px}
      .sort-control{width:100%;justify-content:space-between}
      .sort-control select{width:170px}
      .media-row{display:block;padding:12px}
      .media-thumb{aspect-ratio:16/9;margin-bottom:16px}
      .media-body{padding:0 4px 5px}
      .media-body p{margin-bottom:13px}
      .pagination-wrap{align-items:flex-start;flex-direction:column}
      .related-grid{grid-template-columns:1fr}
      .section-head{display:block}
      .section-intro{margin-top:8px}
      .cta-inner{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
      .footer-grid>div:first-child{grid-column:1/-1}
      .copyright{align-items:flex-start;flex-direction:column;gap:5px}
    }
    @media(max-width:520px){
      h2{font-size:25px}
      .brand-sub{display:none}
      .nav-actions .icon-btn:nth-child(2){display:none}
      .inner-hero h1{font-size:30px}
      .hero-actions .button{width:100%;text-align:center}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
    }