/* roulang page: index */
:root{
  --wine:#651d2c;
  --wine-deep:#43131e;
  --wine-soft:#8d4050;
  --ink:#201d1e;
  --muted:#746b6b;
  --paper:#f7f1ea;
  --paper-2:#fffaf5;
  --line:#e4d8cf;
  --copper:#b87952;
  --dark:#282124;
  --white:#fffdf9;
  --radius:14px;
  --shadow:0 14px 34px rgba(55,33,32,.10);
  --container:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;background:var(--paper);color:var(--ink);line-height:1.75;font-size:15px}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(247,241,234,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.navbar{height:78px;display:flex;align-items:center;gap:30px}
.logo{display:flex;align-items:center;gap:12px;font-weight:800;font-size:19px;letter-spacing:.02em;white-space:nowrap}
.logo-mark{width:28px;height:28px;border:2px solid var(--wine);border-radius:7px;position:relative}
.logo-mark:before,.logo-mark:after{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--wine)}
.logo-mark:before{top:8px}.logo-mark:after{bottom:8px}
.nav-links{display:flex;align-items:center;gap:24px;margin-left:auto}
.nav-links a{color:var(--muted);font-weight:600;padding:26px 0;border-bottom:2px solid transparent;transition:.2s}
.nav-links a:hover,.nav-links a.active{color:var(--wine);border-color:var(--wine)}
.nav-tools{display:flex;align-items:center;gap:10px}
.nav-btn,.menu-toggle{min-height:42px;padding:0 16px;border-radius:9px;background:var(--wine);color:#fff;font-weight:700;transition:.2s}
.nav-btn:hover,.menu-toggle:hover{background:var(--wine-deep);transform:translateY(-2px)}
.menu-toggle{display:none}
.hero{min-height:640px;background:linear-gradient(90deg,rgba(31,20,23,.9),rgba(31,20,23,.45)),url('/assets/images/backpic/back-1.jpg') center/cover;display:flex;align-items:center;color:#fff}
.hero-content{max-width:720px;padding:90px 0}
.eyebrow,.section-kicker{color:var(--copper);font-size:12px;letter-spacing:.18em;font-weight:800;text-transform:uppercase}
.hero h1{font-size:clamp(42px,6vw,72px);line-height:1.12;margin:18px 0 24px;letter-spacing:-.04em}
.hero p{font-size:18px;color:#eadfda;max-width:620px}
.hero-actions{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 21px;border-radius:9px;font-weight:800;transition:.2s}
.btn-primary{background:var(--wine-soft);color:#fff}
.btn-dark{background:#fff;color:var(--ink)}
.btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.16)}
.btn:focus,.nav-btn:focus,.menu-toggle:focus,input:focus,summary:focus{outline:3px solid rgba(184,121,82,.45);outline-offset:3px}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}
.badge,.tag{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700}
.badge{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28)}
.tag{background:#f0e4da;color:var(--wine)}
.section{padding:86px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.section-head h2{font-size:32px;line-height:1.25;letter-spacing:-.03em}
.section-head p{color:var(--muted);max-width:560px}
.text-link{color:var(--wine);font-weight:800;border-bottom:1px solid var(--wine);white-space:nowrap}
.index-strip{background:var(--dark);color:#fff;padding:26px 0}
.index-row{display:flex;align-items:center;gap:24px;overflow:auto}
.index-title{font-weight:800;white-space:nowrap;color:#e9c9b6}
.index-tags{display:flex;gap:10px;white-space:nowrap}
.index-tags a{padding:8px 14px;border:1px solid rgba(255,255,255,.2);border-radius:99px;color:#e5d9d5;transition:.2s}
.index-tags a:hover{background:var(--wine);border-color:var(--wine)}
.feature-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
.feature-card,.small-card,.archive-card,.info-card,.rank-item,.person-card,.safety-card,.topic-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.feature-card{display:grid;grid-template-columns:44% 56%;min-height:380px}
.feature-card img{height:100%;min-height:300px}
.card-copy{padding:30px}
.card-copy h3{font-size:25px;line-height:1.35;margin:12px 0}
.card-copy p,.small-card p,.archive-card p,.topic-card p{color:var(--muted)}
.small-stack{display:grid;gap:22px}
.small-card{display:grid;grid-template-columns:130px 1fr;min-height:178px}
.small-card img{height:100%}
.small-card .card-copy{padding:20px}
.small-card h3{font-size:18px;line-height:1.4;margin:8px 0}
.archive-band{background:var(--dark);color:#fff;border-radius:var(--radius);padding:30px;display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.archive-item{padding:18px 20px;border-left:3px solid var(--wine-soft)}
.archive-item strong{display:block;font-size:26px;color:#f0c5ae}
.archive-item span{color:#cbbdb9;font-size:13px}
.update-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px}
.update-intro{padding:32px;background:url('/assets/images/backpic/back-3.webp') center/cover;border-radius:var(--radius);color:#fff;min-height:310px;display:flex;flex-direction:column;justify-content:end}
.update-intro h3{font-size:28px;line-height:1.3}
.update-list{border-top:1px solid var(--line)}
.update-item{display:grid;grid-template-columns:88px 1fr auto;gap:18px;align-items:center;padding:19px 0;border-bottom:1px solid var(--line)}
.update-date{font-size:13px;color:var(--wine);font-weight:800}
.update-item h3{font-size:17px}
.update-item p{font-size:13px;color:var(--muted);margin-top:3px}
.topic-grid{display:grid;grid-template-columns:1.35fr .65fr .65fr;gap:16px}
.topic-card{padding:25px;min-height:190px;position:relative}
.topic-card.large{min-height:300px;background:linear-gradient(160deg,rgba(67,19,30,.83),rgba(67,19,30,.35)),url('/assets/images/backpic/back-5.jpg') center/cover;color:#fff;display:flex;flex-direction:column;justify-content:end}
.topic-card.large p{color:#eadfda}
.topic-card h3{font-size:21px;margin:12px 0 7px}
.ranking{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.rank-item{display:flex;align-items:center;gap:16px;padding:17px 20px}
.rank-no{font-size:27px;font-weight:900;color:var(--wine);width:30px}
.rank-item img{width:58px;height:76px;border-radius:7px}
.rank-item h3{font-size:16px}.rank-item small{color:var(--muted)}
.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.person-card{padding:16px}
.person-card img{height:180px;border-radius:9px;margin-bottom:13px}
.person-card h3{font-size:17px}.person-card p{font-size:13px;color:var(--muted)}
.search-panel{background:#eee2d9;border-radius:var(--radius);padding:30px}
.search-form{display:flex;gap:10px;margin:22px 0}
.search-form input{flex:1;min-height:48px;border:1px solid var(--line);border-radius:9px;padding:0 16px;background:#fff;color:var(--ink)}
.filter-tags{display:flex;gap:8px;flex-wrap:wrap}
.safety-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.safety-card{padding:23px}
.safety-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f0ddd3;color:var(--wine);font-weight:900;margin-bottom:13px}
.safety-card h3{font-size:17px;margin-bottom:6px}.safety-card p{color:var(--muted);font-size:13px}
.news-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.news-card{padding:23px;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);transition:.2s}
.news-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#c9a99a}
.news-meta{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:12px}
.news-card h3{font-size:19px;margin:11px 0 7px}.news-card p{color:var(--muted);font-size:14px}
.empty-state{padding:38px;text-align:center;border:1px dashed #c9b8ad;border-radius:var(--radius);color:var(--muted);grid-column:1/-1}
.feature-banner{background:var(--wine-deep);color:#fff;border-radius:var(--radius);padding:42px 48px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.feature-banner h2{font-size:30px;line-height:1.3}.feature-banner p{color:#e8d4ce;margin-top:8px}
.faq-list{max-width:820px;margin:auto;border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line);padding:20px 0}
summary{cursor:pointer;font-weight:800;list-style:none;position:relative;padding-right:30px}
summary:after{content:"＋";position:absolute;right:0;color:var(--wine);font-size:22px;line-height:1}
details[open] summary:after{content:"－"}
details p{color:var(--muted);padding:14px 30px 0 0}
.closing{padding:58px 0;text-align:center;background:#efe3da}
.closing h2{font-size:31px;margin-bottom:12px}
.closing p{color:var(--muted);margin-bottom:22px}
.site-footer{background:var(--dark);color:#eee;padding:56px 0 22px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;padding-bottom:38px}
.site-footer .logo{color:#fff}.footer-note{color:#b9aaa6;margin-top:15px;max-width:340px;font-size:13px}
.site-footer h3{font-size:14px;color:#e7bda9;margin-bottom:13px}
.site-footer li{list-style:none;margin:7px 0;color:#b9aaa6;font-size:13px}
.site-footer a:hover{color:#fff}
.copyright{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;color:#978986;font-size:12px;display:flex;justify-content:space-between;gap:15px}
.age-layer{position:fixed;inset:0;z-index:50;background:rgba(27,18,20,.78);display:grid;place-items:center;padding:20px}
.age-box{max-width:460px;background:var(--paper-2);border-radius:16px;padding:36px;box-shadow:0 25px 80px rgba(0,0,0,.3);text-align:center}
.age-box h2{font-size:27px;margin-bottom:12px}.age-box p{color:var(--muted);font-size:14px}
.age-actions{display:flex;gap:10px;justify-content:center;margin-top:25px}.age-layer.hidden{display:none}
@media(max-width:1024px){
 .nav-links{gap:14px}.feature-grid,.update-layout{grid-template-columns:1fr}
 .people-grid,.safety-grid{grid-template-columns:repeat(2,1fr)}
 .topic-grid{grid-template-columns:1fr 1fr}.topic-card.large{grid-column:1/-1}
}
@media(max-width:768px){
 .container{width:min(100% - 32px,600px)}.navbar{height:68px}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:15px 20px;background:var(--paper-2);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}
 .nav-links.open{display:flex}.nav-links a{padding:13px 4px}.nav-tools .nav-btn{display:none}.menu-toggle{display:block}
 .hero{min-height:560px}.hero-content{padding:70px 0}.hero p{font-size:16px}
 .section{padding:58px 0}.section-head{display:block}.section-head h2{font-size:27px;margin-bottom:8px}
 .feature-card{grid-template-columns:1fr}.feature-card img{height:260px}.archive-band{grid-template-columns:repeat(2,1fr)}
 .update-item{grid-template-columns:70px 1fr}.update-item .text-link{display:none}
 .ranking,.news-list{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}
 .feature-banner{display:block;padding:32px}.feature-banner .btn{margin-top:20px}
}
@media(max-width:520px){
 .container{width:min(100% - 24px,480px)}.logo{font-size:16px}.logo-mark{width:24px;height:24px}
 .hero h1{font-size:42px}.hero-actions .btn{width:100%}.small-card{grid-template-columns:100px 1fr}.small-card .card-copy{padding:15px}
 .topic-grid,.people-grid,.safety-grid{grid-template-columns:1fr}.topic-card.large{grid-column:auto}.search-form{display:block}.search-form .btn{width:100%;margin-top:10px}
 .footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:7px}
 .age-box{padding:27px 20px}.age-actions{display:block}.age-actions .btn{width:100%;margin-top:8px}
}

/* roulang page: category1 */
:root{
      --wine:#651d2c;
      --wine-deep:#43131e;
      --wine-soft:#8d4050;
      --ink:#201d1e;
      --muted:#746b6b;
      --paper:#f7f1ea;
      --paper-2:#fffaf5;
      --line:#e4d8cf;
      --copper:#b87952;
      --dark:#282124;
      --white:#fffdf9;
      --radius:14px;
      --shadow:0 14px 34px rgba(55,33,32,.10);
      --container:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;background:var(--paper);color:var(--ink);line-height:1.75;font-size:15px}
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(247,241,234,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
    .navbar{height:78px;display:flex;align-items:center;gap:30px}
    .logo{display:flex;align-items:center;gap:12px;font-weight:800;font-size:19px;letter-spacing:.02em;white-space:nowrap}
    .logo-mark{width:28px;height:28px;border:2px solid var(--wine);border-radius:7px;position:relative}
    .logo-mark:before,.logo-mark:after{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--wine)}
    .logo-mark:before{top:8px}.logo-mark:after{bottom:8px}
    .nav-links{display:flex;align-items:center;gap:24px;margin-left:auto}
    .nav-links a{color:var(--muted);font-weight:600;padding:26px 0;border-bottom:2px solid transparent;transition:.2s}
    .nav-links a:hover,.nav-links a.active{color:var(--wine);border-color:var(--wine)}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .nav-btn,.menu-toggle{min-height:42px;padding:0 16px;border-radius:9px;background:var(--wine);color:#fff;font-weight:700;transition:.2s}
    .nav-btn:hover,.menu-toggle:hover{background:var(--wine-deep);transform:translateY(-2px)}
    .menu-toggle{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 21px;border-radius:9px;font-weight:800;transition:.2s}
    .btn-primary{background:var(--wine);color:#fff}
    .btn-primary:hover{background:var(--wine-deep);color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px rgba(67,19,30,.2)}
    .btn-dark{background:var(--dark);color:#fff}
    .btn-dark:hover{background:var(--wine);color:#fff;transform:translateY(-2px)}
    .btn-outline{border:1px solid var(--wine);color:var(--wine);background:transparent}
    .btn-outline:hover{background:var(--wine);color:#fff;transform:translateY(-2px)}
    .btn:focus,.nav-btn:focus,.menu-toggle:focus,input:focus,summary:focus{outline:3px solid rgba(184,121,82,.45);outline-offset:3px}
    .page-band{background:var(--dark);color:#fff;padding:74px 0 68px;position:relative;overflow:hidden}
    .page-band:after{content:"";position:absolute;right:-100px;top:-150px;width:440px;height:440px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 38px rgba(255,255,255,.03),0 0 0 76px rgba(255,255,255,.025)}
    .band-content{position:relative;z-index:1;max-width:790px}
    .eyebrow,.section-kicker{color:var(--copper);font-size:12px;letter-spacing:.18em;font-weight:800}
    .page-band h1{font-size:clamp(38px,5.6vw,64px);line-height:1.15;letter-spacing:-.04em;margin:16px 0 18px}
    .page-band p{font-size:17px;color:#e5d9d5;max-width:720px;margin:0}
    .band-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
    .badge,.tag{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700}
    .badge{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#f7ece7}
    .tag{background:#f0e4da;color:var(--wine)}
    .section{padding:76px 0}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
    .section-head h2{font-size:31px;line-height:1.25;letter-spacing:-.03em;margin:6px 0 0}
    .section-head p{color:var(--muted);max-width:570px;margin:0}
    .filter-panel{background:#eee2d9;border:1px solid var(--line);border-radius:var(--radius);padding:27px}
    .filter-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
    .filter-item label{display:block;font-size:12px;font-weight:800;color:var(--wine);margin-bottom:7px}
    .filter-item select,.filter-item input{width:100%;height:46px;border:1px solid var(--line);border-radius:9px;padding:0 12px;background:var(--paper-2);color:var(--ink)}
    .filter-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px}
    .filter-note{color:var(--muted);font-size:13px}
    .archive-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:22px}
    .archive-card,.record-row,.info-card,.timeline,.safety-card,.feature-strip{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
    .archive-card{overflow:hidden;display:grid;grid-template-columns:42% 58%}
    .archive-card img{height:100%;min-height:360px}
    .card-copy{padding:28px}
    .card-copy h3{font-size:25px;line-height:1.35;margin:12px 0}
    .card-copy p,.record-row p,.info-card p,.safety-card p{color:var(--muted)}
    .meta-line{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px;margin:18px 0}
    .record-stack{display:grid;gap:14px}
    .record-row{display:grid;grid-template-columns:112px 1fr;min-height:175px;overflow:hidden}
    .record-row img{height:100%;min-height:175px}
    .record-row .copy{padding:19px 20px}
    .record-row h3{font-size:19px;line-height:1.35;margin:6px 0}
    .record-row p{font-size:13px;margin:4px 0 0}
    .feature-strip{display:grid;grid-template-columns:1fr 1fr;gap:0;overflow:hidden;background:var(--dark);color:#fff}
    .feature-strip img{height:250px}
    .feature-strip .strip-copy{padding:32px}
    .strip-copy p{color:#d8c8c3}
    .strip-copy h3{font-size:25px;line-height:1.35;margin:9px 0 12px}
    .info-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
    .info-card{padding:23px;box-shadow:none}
    .info-icon{width:38px;height:38px;display:grid;place-items:center;background:#f0e4da;color:var(--wine);border-radius:10px;font-weight:800;margin-bottom:15px}
    .info-card h3{font-size:17px;margin:0 0 7px}
    .timeline{padding:28px 30px;box-shadow:none}
    .timeline-item{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}
    .timeline-item:last-child{border-bottom:0}
    .timeline-year{font-size:24px;font-weight:800;color:var(--wine)}
    .timeline-item h3{font-size:18px;margin:0 0 3px}
    .timeline-item p{margin:0;color:var(--muted);font-size:14px}
    .safety-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
    .safety-card{padding:22px;box-shadow:none}
    .safety-card h3{font-size:17px;margin:0 0 7px}
    .faq-wrap{max-width:850px;margin:auto}
    details{background:var(--paper-2);border:1px solid var(--line);border-radius:10px;margin-bottom:10px;padding:0 20px}
    summary{cursor:pointer;list-style:none;font-weight:800;padding:18px 0;position:relative;padding-right:28px}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";position:absolute;right:0;color:var(--wine);font-size:22px;line-height:1}
    details[open] summary:after{content:"−"}
    details p{color:var(--muted);font-size:14px;padding:0 0 18px;margin:0}
    .closing{background:#eee2d9;text-align:center;padding:65px 20px}
    .closing h2{font-size:30px;margin:0 0 12px}
    .closing p{color:var(--muted);max-width:600px;margin:0 auto 24px}
    .site-footer{background:var(--dark);color:#fff;padding:58px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
    .site-footer .logo{color:#fff;margin-bottom:15px}
    .site-footer .logo-mark{border-color:#d99b7a}
    .site-footer .logo-mark:before,.site-footer .logo-mark:after{background:#d99b7a}
    .footer-note{color:#cbbdb9;max-width:330px;font-size:13px}
    .site-footer h3{font-size:15px;margin:0 0 13px;color:#f0c5ae}
    .site-footer ul{list-style:none;padding:0;margin:0}
    .site-footer li{margin:7px 0}
    .site-footer li a{color:#cbbdb9;font-size:13px;transition:.2s}
    .site-footer li a:hover{color:#fff}
    .copyright{border-top:1px solid rgba(255,255,255,.13);margin-top:38px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;color:#ad9d99;font-size:12px}
    .age-layer{position:fixed;inset:0;background:rgba(32,20,23,.72);z-index:50;display:grid;place-items:center;padding:20px}
    .age-box{max-width:450px;background:var(--paper-2);border-radius:16px;padding:34px;box-shadow:0 20px 70px rgba(0,0,0,.28);text-align:center}
    .age-box h2{margin:0 0 10px;font-size:26px}
    .age-box p{color:var(--muted);font-size:14px;margin-bottom:22px}
    .age-actions{display:flex;gap:10px;justify-content:center}
    .is-hidden{display:none}
    @media(max-width:1024px){
      .nav-links{gap:15px}
      .filter-row{grid-template-columns:repeat(3,1fr)}
      .info-grid,.safety-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      .container{width:min(100% - 32px,var(--container))}
      .navbar{height:68px}
      .nav-links{display:none;position:absolute;top:68px;left:0;right:0;background:var(--paper-2);padding:15px 20px;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
      .nav-links.open{display:flex}
      .nav-links a{padding:13px 0}
      .menu-toggle{display:block}
      .nav-btn{display:none}
      .page-band{padding:55px 0}
      .section{padding:55px 0}
      .section-head{display:block}
      .section-head p{margin-top:10px}
      .archive-layout,.feature-strip{grid-template-columns:1fr}
      .archive-card{grid-template-columns:1fr}
      .archive-card img{height:300px;min-height:0}
      .feature-strip img{height:230px}
      .filter-row{grid-template-columns:1fr 1fr}
      .filter-bottom{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr 1fr}
      .copyright{flex-direction:column}
    }
    @media(max-width:520px){
      .logo{font-size:16px}
      .filter-row,.info-grid,.safety-grid,.footer-grid{grid-template-columns:1fr}
      .record-row{grid-template-columns:92px 1fr}
      .record-row img{min-height:150px}
      .record-row .copy{padding:14px}
      .record-row h3{font-size:16px}
      .timeline-item{grid-template-columns:75px 1fr;gap:12px}
      .timeline-year{font-size:19px}
      .age-actions{flex-direction:column}
      .age-actions .btn{width:100%}
    }

/* roulang page: article */
:root{
      --wine:#651d2c;
      --wine-deep:#43131e;
      --wine-soft:#8d4050;
      --ink:#201d1e;
      --muted:#746b6b;
      --paper:#f7f1ea;
      --paper-2:#fffaf5;
      --line:#e4d8cf;
      --copper:#b87952;
      --dark:#282124;
      --white:#fffdf9;
      --radius:14px;
      --shadow:0 14px 34px rgba(55,33,32,.10);
      --container:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;
      background:var(--paper);
      color:var(--ink);
      line-height:1.75;
      font-size:15px;
    }
    a{color:inherit;text-decoration:none}
    a:hover{color:var(--wine)}
    img{display:block;width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .site-header{
      position:sticky;top:0;z-index:20;
      background:rgba(247,241,234,.94);
      backdrop-filter:blur(14px);
      border-bottom:1px solid var(--line)
    }
    .navbar{height:78px;display:flex;align-items:center;gap:30px}
    .logo{
      display:flex;align-items:center;gap:12px;
      font-weight:800;font-size:19px;letter-spacing:.02em;white-space:nowrap
    }
    .logo-mark{
      width:28px;height:28px;border:2px solid var(--wine);
      border-radius:7px;position:relative
    }
    .logo-mark:before,.logo-mark:after{
      content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--wine)
    }
    .logo-mark:before{top:8px}.logo-mark:after{bottom:8px}
    .nav-links{display:flex;align-items:center;gap:24px;margin-left:auto}
    .nav-links a{
      color:var(--muted);font-weight:600;padding:26px 0;
      border-bottom:2px solid transparent;transition:.2s
    }
    .nav-links a:hover,.nav-links a.active{color:var(--wine);border-color:var(--wine)}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .nav-btn,.menu-toggle{
      min-height:42px;padding:0 16px;border-radius:9px;
      background:var(--wine);color:#fff;font-weight:700;transition:.2s
    }
    .nav-btn:hover,.menu-toggle:hover{background:var(--wine-deep);transform:translateY(-2px);color:#fff}
    .menu-toggle{display:none}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;
      min-height:48px;padding:0 21px;border-radius:9px;
      font-weight:800;transition:.2s
    }
    .btn-primary{background:var(--wine-soft);color:#fff}
    .btn-dark{background:var(--dark);color:#fff}
    .btn-outline{border:1px solid var(--line);color:var(--wine);background:transparent}
    .btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.16);color:#fff}
    .btn-outline:hover{background:var(--wine);border-color:var(--wine)}
    .btn:focus,.nav-btn:focus,.menu-toggle:focus,input:focus,summary:focus{
      outline:3px solid rgba(184,121,82,.45);outline-offset:3px
    }
    .article-banner{
      color:#fff;
      background:
        linear-gradient(90deg,rgba(38,25,28,.92),rgba(38,25,28,.62)),
        url('/assets/images/backpic/back-4.webp') center/cover;
      padding:72px 0 76px
    }
    .banner-inner{max-width:900px}
    .eyebrow,.section-kicker{
      color:var(--copper);font-size:12px;letter-spacing:.18em;
      font-weight:800;text-transform:uppercase
    }
    .article-banner h1{
      max-width:850px;margin:16px 0 22px;
      font-size:clamp(34px,5vw, sixtypx);
      font-size:clamp(36px,5.5vw,64px);
      line-height:1.18;letter-spacing:-.04em
    }
    .article-banner p{max-width:760px;color:#eadfda;font-size:17px;margin:0}
    .meta-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}
    .badge,.tag{
      display:inline-flex;align-items:center;border-radius:99px;
      padding:4px 10px;font-size:12px;font-weight:700
    }
    .badge{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:#fff}
    .tag{background:#f0e4da;color:var(--wine)}
    .article-layout{
      display:grid;grid-template-columns:minmax(0,790px) 300px;
      gap:54px;align-items:start;padding:78px 0 92px
    }
    .breadcrumb{
      display:flex;gap:8px;align-items:center;flex-wrap:wrap;
      color:var(--muted);font-size:13px;margin-bottom:24px
    }
    .breadcrumb a{color:var(--wine);font-weight:700}
    .reading-card{
      background:var(--paper-2);border:1px solid var(--line);
      border-radius:var(--radius);padding:clamp(24px,4vw,52px);
      box-shadow:var(--shadow)
    }
    .reading-card h2,.reading-card h3{
      color:var(--wine-deep);line-height:1.35;margin:30px 0 14px
    }
    .reading-card h2{font-size:28px}
    .reading-card h3{font-size:21px}
    .reading-card p{margin:0 0 18px;color:#40393a}
    .reading-card ul,.reading-card ol{padding-left:24px;margin:12px 0 24px}
    .reading-card li{margin:7px 0}
    .reading-card blockquote{
      margin:28px 0;padding:18px 22px;
      border-left:4px solid var(--wine-soft);
      background:#f2e7df;color:#5e4b49
    }
    .reading-card img{border-radius:10px;margin:25px 0 8px;max-height:480px}
    .reading-card figure{margin:26px 0}
    .reading-card figcaption{font-size:12px;color:var(--muted);text-align:center}
    .article-notice{
      display:flex;gap:13px;align-items:flex-start;
      margin-top:26px;padding:18px 20px;
      border:1px solid #dec8b9;border-radius:10px;background:#fbefe6;
      color:#614a45;font-size:13px
    }
    .article-notice strong{color:var(--wine-deep);display:block;margin-bottom:3px}
    .side-stack{display:grid;gap:18px;position:sticky;top:104px}
    .side-card{
      background:var(--paper-2);border:1px solid var(--line);
      border-radius:var(--radius);padding:23px;box-shadow:0 8px 20px rgba(55,33,32,.06)
    }
    .side-card h2{font-size:19px;margin:0 0 16px;color:var(--wine-deep)}
    .side-card p{color:var(--muted);font-size:13px;margin:0}
    .data-list{margin:0;padding:0;list-style:none}
    .data-list li{
      display:flex;justify-content:space-between;gap:12px;
      padding:10px 0;border-bottom:1px solid var(--line);
      font-size:13px
    }
    .data-list li:last-child{border-bottom:0}
    .data-list span:first-child{color:var(--muted)}
    .data-list span:last-child{font-weight:700;text-align:right}
    .cover-box{overflow:hidden;border-radius:10px;margin-bottom:17px;position:relative}
    .cover-box img{height:260px}
    .cover-label{
      position:absolute;left:12px;bottom:12px;
      background:rgba(40,33,36,.82);color:#fff;border-radius:99px;
      padding:4px 10px;font-size:12px
    }
    .article-nav{
      display:flex;justify-content:space-between;gap:14px;
      margin-top:28px;padding-top:25px;border-top:1px solid var(--line)
    }
    .article-nav a{
      color:var(--wine);font-weight:800;font-size:14px
    }
    .section{padding:80px 0}
    .section-head{
      display:flex;align-items:end;justify-content:space-between;
      gap:20px;margin-bottom:27px
    }
    .section-head h2{font-size:31px;line-height:1.25;letter-spacing:-.03em;margin:0}
    .section-head p{color:var(--muted);max-width:560px;margin:0}
    .reading-strip{background:var(--dark);color:#fff}
    .reading-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
    .reading-strip h2{font-size:32px;line-height:1.3;margin:12px 0}
    .reading-strip p{color:#d9ccca;margin:0}
    .strip-note{border-left:2px solid var(--wine-soft);padding:8px 0 8px 24px;color:#eadfda}
    .site-footer{background:var(--dark);color:#fff;padding:58px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px}
    .site-footer .logo{color:#fff}
    .site-footer .logo-mark{border-color:#d8a187}
    .site-footer .logo-mark:before,.site-footer .logo-mark:after{background:#d8a187}
    .footer-note{color:#cbbdb9;max-width:340px;font-size:13px;margin-top:18px}
    .site-footer h3{font-size:14px;margin:2px 0 14px;color:#f0c5ae}
    .site-footer ul{list-style:none;padding:0;margin:0}
    .site-footer li{margin:8px 0}
    .site-footer li a{color:#cbbdb9;font-size:13px;transition:.2s}
    .site-footer li a:hover{color:#fff;padding-left:3px}
    .copyright{
      display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
      margin-top:42px;padding-top:19px;border-top:1px solid rgba(255,255,255,.14);
      color:#a99c99;font-size:12px
    }
    .age-layer{
      position:fixed;inset:0;z-index:50;background:rgba(26,18,20,.72);
      display:flex;align-items:center;justify-content:center;padding:20px
    }
    .age-layer[hidden]{display:none}
    .age-box{
      width:min(470px,100%);background:var(--paper-2);
      border-radius:16px;border:1px solid var(--line);
      padding:34px;box-shadow:0 24px 70px rgba(0,0,0,.25)
    }
    .age-box h2{margin:0 0 12px;color:var(--wine-deep);font-size:27px}
    .age-box p{color:var(--muted);font-size:14px}
    .age-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
    @media(max-width:1024px){
      .nav-links{gap:15px}.navbar{gap:18px}
      .article-layout{grid-template-columns:minmax(0,1fr) 260px;gap:28px}
      .footer-grid{grid-template-columns:1.4fr 1fr 1fr}
      .footer-grid>div:last-child{grid-column:2}
    }
    @media(max-width:768px){
      .container{width:min(100% - 32px,var(--container))}
      .navbar{height:68px}
      .menu-toggle{display:inline-flex;align-items:center;justify-content:center}
      .nav-links{
        display:none;position:absolute;left:16px;right:16px;top:76px;
        padding:10px 18px;background:var(--paper-2);
        border:1px solid var(--line);border-radius:12px;
        box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0
      }
      .nav-links.is-open{display:flex}
      .nav-links a{padding:13px 4px;border-bottom:1px solid var(--line)}
      .nav-links a:last-child{border-bottom:0}
      .nav-btn{display:none}
      .article-banner{padding:54px 0 58px}
      .article-layout{display:block;padding:45px 0 60px}
      .side-stack{position:static;margin-top:25px}
      .reading-grid{grid-template-columns:1fr}
      .section{padding:58px 0}
      .footer-grid{grid-template-columns:1fr 1fr;gap:26px}
      .footer-grid>div:last-child{grid-column:auto}
    }
    @media(max-width:520px){
      .logo{font-size:16px}.logo-mark{width:25px;height:25px}
      .article-banner h1{font-size:35px}
      .article-banner p{font-size:15px}
      .reading-card{padding:22px 18px}
      .reading-card h2{font-size:24px}
      .article-nav{display:grid;grid-template-columns:1fr}
      .article-nav a:last-child{text-align:left}
      .reading-strip h2{font-size:26px}
      .footer-grid{grid-template-columns:1fr}
      .copyright{display:block}.copyright span{display:block;margin:5px 0}
      .age-box{padding:26px 22px}
      .age-actions .btn{width:100%}
    }

/* roulang page: category3 */
:root{
      --wine:#651d2c;--wine-deep:#43131e;--wine-soft:#8d4050;
      --ink:#201d1e;--muted:#746b6b;--paper:#f7f1ea;--paper-2:#fffaf5;
      --line:#e4d8cf;--copper:#b87952;--dark:#282124;--white:#fffdf9;
      --radius:14px;--shadow:0 14px 34px rgba(55,33,32,.10);--container:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;font-size:15px;line-height:1.75}
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(247,241,234,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
    .navbar{height:78px;display:flex;align-items:center;gap:30px}
    .logo{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
    .logo-mark{width:28px;height:28px;border:2px solid var(--wine);border-radius:7px;position:relative}
    .logo-mark:before,.logo-mark:after{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--wine)}
    .logo-mark:before{top:8px}.logo-mark:after{bottom:8px}
    .nav-links{display:flex;align-items:center;gap:24px;margin-left:auto}
    .nav-links a{padding:26px 0;border-bottom:2px solid transparent;color:var(--muted);font-weight:600;transition:.2s}
    .nav-links a:hover,.nav-links a.active{color:var(--wine);border-color:var(--wine)}
    .nav-tools{display:flex;gap:10px;align-items:center}
    .nav-btn,.menu-toggle{min-height:42px;padding:0 16px;border-radius:9px;background:var(--wine);color:#fff;font-weight:700;transition:.2s}
    .nav-btn:hover,.menu-toggle:hover{background:var(--wine-deep);transform:translateY(-2px)}
    .menu-toggle{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 21px;border-radius:9px;font-weight:800;transition:.2s}
    .btn-primary{background:var(--wine);color:#fff}.btn-primary:hover{background:var(--wine-deep)}
    .btn-dark{background:var(--dark);color:#fff}.btn-dark:hover{background:#171315}
    .btn-light{background:var(--white);border:1px solid var(--line);color:var(--wine)}
    .btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.14)}
    .btn:focus,.nav-btn:focus,.menu-toggle:focus,input:focus,summary:focus{outline:3px solid rgba(184,121,82,.45);outline-offset:3px}
    .page-intro{padding:72px 0 48px;background:var(--dark);color:#fff}
    .intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:end}
    .eyebrow,.section-kicker{color:var(--copper);font-size:12px;letter-spacing:.18em;font-weight:800}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(38px,5.5vw,66px);line-height:1.12;letter-spacing:-.045em;margin:16px 0 20px}
    .intro-copy{max-width:680px;color:#e6d8d3;font-size:17px}
    .editor-note{border-left:3px solid var(--copper);padding:18px 20px;background:rgba(255,255,255,.07);color:#eadfda}
    .meta-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
    .badge,.tag{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700}
    .badge{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#f5e9e3}
    .tag{background:#f0e4da;color:var(--wine)}
    .section{padding:78px 0}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
    .section-head h2{font-size:31px;line-height:1.25;letter-spacing:-.03em;margin:8px 0}
    .section-head p{color:var(--muted);max-width:580px;margin-bottom:0}
    .update-board{display:grid;grid-template-columns:1.35fr .65fr;gap:20px}
    .lead-update,.mini-update,.timeline-card,.safety-card,.filter-panel,.empty-state{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
    .lead-update{display:grid;grid-template-columns:43% 57%;overflow:hidden;min-height:300px}
    .lead-update img{height:100%;min-height:280px}
    .card-copy{padding:28px}
    .card-copy h3{font-size:24px;line-height:1.35;margin:12px 0}
    .card-copy p,.mini-update p,.timeline-card p,.safety-card p{color:var(--muted)}
    .mini-stack{display:grid;gap:20px}
    .mini-update{padding:22px}
    .mini-update h3{font-size:18px;line-height:1.4;margin:10px 0 5px}
    .mini-update small{color:var(--copper);font-weight:700}
    .filter-panel{padding:25px;background:#eee2d9;box-shadow:none}
    .filter-line{display:flex;align-items:center;gap:15px;flex-wrap:wrap}
    .filter-line strong{font-size:15px;white-space:nowrap}
    .filter-tags{display:flex;gap:8px;flex-wrap:wrap}
    .filter-tags button{padding:8px 14px;border:1px solid var(--line);border-radius:99px;background:var(--paper-2);color:var(--muted);transition:.2s}
    .filter-tags button:hover,.filter-tags button.active{background:var(--wine);border-color:var(--wine);color:#fff}
    .news-layout{display:grid;grid-template-columns:1fr 320px;gap:42px}
    .news-list{border-top:1px solid var(--line)}
    .news-item{display:grid;grid-template-columns:120px 1fr auto;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
    .news-item img{height:105px;border-radius:10px}
    .news-item h3{font-size:19px;line-height:1.4;margin:8px 0}
    .news-item p{color:var(--muted);font-size:14px;margin:0}
    .news-meta{color:var(--copper);font-size:12px;font-weight:700}
    .read-link{color:var(--wine);font-weight:800;white-space:nowrap}
    .read-link:hover{text-decoration:underline}
    .empty-state{padding:38px;text-align:center;color:var(--muted)}
    .empty-icon{width:52px;height:52px;border:2px solid var(--copper);border-radius:50%;margin:0 auto 16px;position:relative}
    .empty-icon:after{content:"";position:absolute;width:22px;height:2px;background:var(--copper);left:13px;top:23px;transform:rotate(-35deg)}
    .side-panel{background:var(--dark);border-radius:var(--radius);padding:26px;color:#fff;height:max-content}
    .side-panel h3{font-size:21px;margin:12px 0}
    .side-panel p{color:#d9cbc6;font-size:14px}
    .side-list{list-style:none;padding:0;margin:20px 0 0}
    .side-list li{border-top:1px solid rgba(255,255,255,.15);padding:13px 0;color:#eadfda}
    .side-list span{display:block;color:var(--copper);font-size:12px}
    .timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
    .timeline-card{padding:22px;position:relative;min-height:180px}
    .timeline-card:before{content:"";display:block;width:34px;height:3px;background:var(--wine-soft);margin-bottom:20px}
    .timeline-card strong{font-size:13px;color:var(--copper)}
    .timeline-card h3{font-size:18px;margin:10px 0 6px}
    .topic-strip{background:linear-gradient(110deg,rgba(67,19,30,.94),rgba(67,19,30,.72)),url('/assets/images/backpic/back-7.webp') center/cover;color:#fff;padding:46px 0}
    .strip-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .strip-inner h2{font-size:29px;margin:8px 0}
    .strip-inner p{color:#e8dcd7;margin:0;max-width:670px}
    .safety-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
    .safety-card{padding:23px}
    .safety-card h3{font-size:17px;margin:12px 0 7px}
    .safety-icon{width:38px;height:38px;border-radius:10px;background:#f0e4da;color:var(--wine);display:grid;place-items:center;font-weight:800}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:18px 0}
    summary{cursor:pointer;font-size:17px;font-weight:800;list-style:none;display:flex;justify-content:space-between;gap:20px}
    summary:after{content:"+";color:var(--wine);font-size:22px}
    details[open] summary:after{content:"−"}
    details p{color:var(--muted);max-width:780px;padding-top:12px;margin-bottom:0}
    .bottom-cta{background:#eee2d9;padding:48px 0}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
    .cta-inner h2{font-size:30px;margin:8px 0}
    .cta-inner p{color:var(--muted);margin:0}
    .site-footer{background:var(--dark);color:#fff;padding:62px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:35px}
    .footer-note{color:#cdbfba;max-width:300px;margin-top:18px;font-size:14px}
    .site-footer h3{font-size:15px;margin:4px 0 14px;color:#fff}
    .site-footer ul{list-style:none;padding:0;margin:0}
    .site-footer li{margin:8px 0}
    .site-footer li a{color:#cdbfba;font-size:14px}
    .site-footer li a:hover{color:#fff}
    .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.14);margin-top:42px;padding-top:20px;color:#b9aaa5;font-size:12px}
    .age-note{position:fixed;right:22px;bottom:22px;z-index:15;background:var(--paper-2);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:12px;padding:13px 16px;color:var(--muted);font-size:12px}
    @media(max-width:1024px){
      .nav-links{gap:14px}.nav-links a{font-size:14px}
      .update-board,.news-layout{grid-template-columns:1fr}
      .timeline{grid-template-columns:repeat(2,1fr)}.safety-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 32px))}
      .navbar{height:68px}.menu-toggle{display:block}.nav-tools .nav-btn{display:none}
      .nav-links{display:none;position:absolute;left:16px;right:16px;top:76px;padding:12px 18px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}
      .nav-links.open{display:flex}.nav-links a{padding:13px 4px}
      .intro-grid,.lead-update{grid-template-columns:1fr}.lead-update img{height:250px}
      .page-intro{padding:52px 0 38px}.section{padding:58px 0}
      .section-head,.strip-inner,.cta-inner{display:block}.section-head p{margin-top:12px}
      .strip-inner .btn,.cta-inner .btn{margin-top:20px}.news-item{grid-template-columns:88px 1fr}.news-item .read-link{grid-column:2}
      .news-item img{height:100px}.footer-grid{grid-template-columns:1fr 1fr}.copyright{display:block}.copyright span{display:block;margin-top:6px}
    }
    @media(max-width:520px){
      h1{font-size:40px}.intro-copy{font-size:15px}.timeline,.safety-grid{grid-template-columns:1fr}
      .news-item{grid-template-columns:1fr}.news-item img{height:180px}.news-item .read-link{grid-column:auto}
      .footer-grid{grid-template-columns:1fr}.age-note{left:16px;right:16px;bottom:16px;text-align:center}
    }

/* roulang page: category2 */
:root{
  --wine:#651d2c;
  --wine-deep:#43131e;
  --wine-soft:#8d4050;
  --ink:#201d1e;
  --muted:#746b6b;
  --paper:#f7f1ea;
  --paper-2:#fffaf5;
  --line:#e4d8cf;
  --copper:#b87952;
  --dark:#282124;
  --white:#fffdf9;
  --radius:14px;
  --shadow:0 14px 34px rgba(55,33,32,.10);
  --container:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;background:var(--paper);color:var(--ink);line-height:1.75;font-size:15px}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(247,241,234,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.navbar{height:78px;display:flex;align-items:center;gap:30px}
.logo{display:flex;align-items:center;gap:12px;font-weight:800;font-size:19px;letter-spacing:.02em;white-space:nowrap}
.logo-mark{width:28px;height:28px;border:2px solid var(--wine);border-radius:7px;position:relative}
.logo-mark:before,.logo-mark:after{content:"";position:absolute;left:5px;right:5px;height:2px;background:var(--wine)}
.logo-mark:before{top:8px}.logo-mark:after{bottom:8px}
.nav-links{display:flex;align-items:center;gap:24px;margin-left:auto}
.nav-links a{color:var(--muted);font-weight:600;padding:26px 0;border-bottom:2px solid transparent;transition:.2s}
.nav-links a:hover,.nav-links a.active{color:var(--wine);border-color:var(--wine)}
.nav-tools{display:flex;align-items:center;gap:10px}
.nav-btn,.menu-toggle{min-height:42px;padding:0 16px;border-radius:9px;background:var(--wine);color:#fff;font-weight:700;transition:.2s}
.nav-btn:hover,.menu-toggle:hover{background:var(--wine-deep);transform:translateY(-2px)}
.menu-toggle{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 21px;border-radius:9px;font-weight:800;transition:.2s}
.btn-primary{background:var(--wine);color:#fff}
.btn-dark{background:var(--dark);color:#fff}
.btn-outline{border:1px solid var(--wine);color:var(--wine);background:transparent}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.14)}
.btn:focus,.nav-btn:focus,.menu-toggle:focus,input:focus,summary:focus{outline:3px solid rgba(184,121,82,.45);outline-offset:3px}
main{overflow:hidden}
.archive-header{padding:72px 0 54px;background:var(--dark);color:var(--white);position:relative}
.archive-header:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(40,33,36,.96),rgba(40,33,36,.68)),url('/assets/images/backpic/back-3.webp') center/cover;z-index:0}
.archive-header .container{position:relative;z-index:1}
.eyebrow,.section-kicker{color:var(--copper);font-size:12px;letter-spacing:.18em;font-weight:800}
.archive-header h1{font-size:clamp(36px,5vw,62px);line-height:1.15;letter-spacing:-.04em;margin:15px 0 17px}
.archive-header p{max-width:720px;color:#eadfda;font-size:17px;margin:0}
.archive-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.badge,.tag{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700}
.badge{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.27);color:#fff}
.tag{background:#f0e4da;color:var(--wine)}
.section{padding:76px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.section-head h2{font-size:31px;line-height:1.25;letter-spacing:-.03em;margin:0}
.section-head p{color:var(--muted);max-width:590px;margin:0}
.filter-panel{background:#eee2d9;border:1px solid var(--line);border-radius:var(--radius);padding:25px 28px;box-shadow:var(--shadow)}
.filter-panel h2{font-size:21px;margin:0 0 18px}
.filter-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.filter-row label{font-size:13px;font-weight:800;color:var(--muted);margin-right:3px}
.filter-chip{min-height:38px;padding:0 14px;border:1px solid #d7c5b9;border-radius:99px;background:var(--paper-2);color:var(--ink);transition:.2s}
.filter-chip:hover,.filter-chip.active{background:var(--wine);border-color:var(--wine);color:#fff}
.featured-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:22px}
.featured-card,.work-card,.data-card,.timeline,.article-card,.safety-card,.faq-wrap{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.featured-card{display:grid;grid-template-columns:44% 56%;min-height:360px}
.featured-card img{height:100%;min-height:300px}
.card-copy{padding:29px}
.card-copy h3{font-size:26px;line-height:1.35;margin:12px 0}
.card-copy p,.work-card p,.article-card p,.data-card p,.safety-card p{color:var(--muted)}
.mini-stack{display:grid;gap:16px}
.work-card{display:grid;grid-template-columns:124px 1fr;min-height:164px}
.work-card img{height:100%;min-height:164px}
.work-card .card-copy{padding:20px}
.work-card h3{font-size:18px;line-height:1.4;margin:8px 0}
.work-card p{font-size:13px;margin:0}
.timeline{padding:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--dark);color:#fff}
.timeline-item{padding:12px 20px;border-left:3px solid var(--wine-soft)}
.timeline-item strong{display:block;font-size:27px;color:#efc2aa}
.timeline-item span{display:block;color:#d2c3be;font-size:13px;margin-top:5px}
.timeline-item p{font-size:13px;color:#bdb0ad;margin:9px 0 0}
.info-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:22px;align-items:stretch}
.data-card{padding:30px}
.data-card h3{font-size:23px;margin:0 0 13px}
.data-card dl{display:grid;grid-template-columns:90px 1fr;margin:20px 0 0}
.data-card dt,.data-card dd{padding:10px 0;border-bottom:1px solid var(--line);margin:0}
.data-card dt{font-weight:800;color:var(--wine)}
.data-card dd{color:var(--muted)}
.cover-panel{min-height:330px;border-radius:var(--radius);background:linear-gradient(160deg,rgba(67,19,30,.77),rgba(40,33,36,.42)),url('/assets/images/backpic/back-6.webp') center/cover;color:#fff;padding:31px;display:flex;flex-direction:column;justify-content:end}
.cover-panel h3{font-size:28px;line-height:1.3;margin:12px 0}
.cover-panel p{color:#eadfda;max-width:440px}
.news-list{border-top:1px solid var(--line)}
.news-item{display:grid;grid-template-columns:92px 1fr auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.news-item time{font-size:13px;color:var(--wine);font-weight:800}
.news-item h3{font-size:17px;margin:0 0 3px}
.news-item p{font-size:13px;color:var(--muted);margin:0}
.text-link{color:var(--wine);font-weight:800;border-bottom:1px solid var(--wine);white-space:nowrap}
.more-row{margin-top:25px;text-align:center}
.safety-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.safety-card{padding:22px}
.safety-card h3{font-size:17px;margin:0 0 7px}
.safety-card p{font-size:13px;margin:0}
.faq-wrap{padding:10px 25px}
details{border-bottom:1px solid var(--line);padding:17px 0}
details:last-child{border-bottom:0}
summary{cursor:pointer;font-weight:800;list-style:none;position:relative;padding-right:30px}
summary::-webkit-details-marker{display:none}
summary:after{content:"＋";position:absolute;right:0;color:var(--wine);font-size:20px}
details[open] summary:after{content:"－"}
details p{color:var(--muted);font-size:14px;margin:10px 0 0}
.cta-band{padding:50px 0;background:var(--wine-deep);color:#fff}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.cta-inner h2{font-size:29px;margin:0 0 8px}
.cta-inner p{color:#e6d7d2;margin:0}
.site-footer{background:var(--dark);color:#fff;padding:58px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.footer-note{color:#bdb2af;max-width:300px;font-size:13px;margin-top:17px}
.site-footer h3{font-size:15px;margin:4px 0 14px}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin:8px 0}
.site-footer li a{color:#bdb2af;font-size:13px;transition:.2s}
.site-footer li a:hover{color:#efc2aa}
.copyright{border-top:1px solid rgba(255,255,255,.13);margin-top:38px;padding-top:19px;display:flex;justify-content:space-between;gap:15px;color:#988e8d;font-size:12px}
.empty-state{padding:28px;text-align:center;border:1px dashed var(--line);border-radius:var(--radius);color:var(--muted);background:rgba(255,250,245,.55)}
@media(max-width:1024px){
  .navbar{gap:18px}.nav-links{gap:15px}.nav-links a{font-size:14px}
  .featured-grid,.info-grid{grid-template-columns:1fr}
  .timeline{grid-template-columns:repeat(2,1fr);gap:12px}
  .safety-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .container{width:min(100% - 32px,var(--container))}
  .navbar{height:70px}.menu-toggle{display:inline-flex;align-items:center;justify-content:center}
  .nav-tools .nav-btn{display:none}
  .nav-links{display:none;position:absolute;top:70px;left:0;right:0;margin:0;padding:16px;background:var(--paper-2);border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}
  .nav-links.open{display:flex}.nav-links a{padding:13px 15px;border-bottom:1px solid var(--line)}
  .archive-header{padding:55px 0 43px}.section{padding:55px 0}
  .section-head{display:block}.section-head h2{font-size:27px;margin-bottom:10px}
  .featured-card{grid-template-columns:1fr}.featured-card img{height:280px}
  .news-item{grid-template-columns:1fr;gap:5px}.news-item .text-link{justify-self:start;margin-top:6px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:25px}.copyright{display:block}.copyright span{display:block;margin-top:5px}
}
@media(max-width:520px){
  .logo{font-size:16px}.logo-mark{width:25px;height:25px}
  .filter-panel{padding:20px 16px}.filter-row{gap:8px}
  .filter-row label{width:100%;margin-top:8px}
  .timeline{grid-template-columns:1fr;padding:21px 17px}
  .data-card{padding:23px}.cover-panel{min-height:280px;padding:24px}
  .safety-grid,.footer-grid{grid-template-columns:1fr}
  .cta-inner{display:block}.cta-inner .btn{margin-top:22px}
  .copyright{font-size:11px}
}