/* roulang page: index */
:root{
      --ink:#29232d;
      --muted:#766c78;
      --soft:#a59aa5;
      --paper:#fffaf9;
      --surface:#ffffff;
      --mist:#f6eef1;
      --line:#eadde2;
      --plum:#772b55;
      --plum-dark:#54203d;
      --rose:#c4657e;
      --coral:#e49286;
      --sage:#4f8a78;
      --amber:#bd7d3b;
      --radius-sm:10px;
      --radius-md:16px;
      --radius-lg:24px;
      --shadow:0 16px 42px rgba(85,40,62,.09);
      --shadow-hover:0 20px 48px rgba(85,40,62,.16);
      --container:1220px;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
      font-size:15px;
      line-height:1.75;
    }
    a{color:inherit;text-decoration:none}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    img{display:block;max-width:100%}
    .container{width:min(var(--container),calc(100% - 40px));margin:0 auto}
    .topline{
      background:#2f2730;
      color:#e8dfe4;
      font-size:12px;
      letter-spacing:.02em;
    }
    .topline-inner{height:34px;display:flex;align-items:center;justify-content:space-between}
    .topline a{color:#ffd6dc;border-bottom:1px solid rgba(255,214,220,.45)}
    .site-header{
      position:sticky;
      top:0;
      z-index:20;
      background:rgba(255,250,249,.94);
      backdrop-filter:blur(14px);
      border-bottom:1px solid var(--line);
    }
    .brand-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:flex;align-items:center;gap:12px;min-width:250px}
    .brand-mark{
      width:40px;height:40px;border-radius:13px;background:var(--plum);
      color:#fff;display:grid;place-items:center;font-weight:800;font-size:17px;
      box-shadow:0 7px 18px rgba(119,43,85,.22);
    }
    .brand-name{font-size:19px;font-weight:800;letter-spacing:-.04em;line-height:1.25}
    .brand-sub{display:block;color:var(--muted);font-size:11px;font-weight:500;letter-spacing:.08em;margin-top:2px}
    .header-tools{display:flex;align-items:center;gap:9px}
    .tool-link,.menu-toggle{
      border:1px solid var(--line);background:var(--surface);color:var(--muted);
      border-radius:10px;padding:8px 12px;display:inline-flex;align-items:center;gap:7px;
      transition:.2s ease;
    }
    .tool-link:hover,.menu-toggle:hover{border-color:var(--rose);color:var(--plum);transform:translateY(-1px)}
    .tool-link svg,.nav-icon{width:17px;height:17px}
    .nav-strip{border-top:1px solid #f2e7ea}
    .nav-grid{display:flex;gap:8px;padding:10px 0;overflow-x:auto;scrollbar-width:none}
    .nav-grid::-webkit-scrollbar{display:none}
    .nav-item{
      flex:0 0 auto;min-width:108px;border:1px solid transparent;border-radius:12px;
      padding:8px 13px;display:flex;align-items:center;gap:9px;color:var(--muted);
      transition:.2s ease;
    }
    .nav-item:hover{background:#fff0f2;border-color:#f0d7de;color:var(--plum)}
    .nav-item.active{background:#f6e4e9;border-color:#e8c2cd;color:var(--plum);font-weight:700}
    .nav-item small{display:block;font-size:11px;color:var(--soft);line-height:1.2}
    .nav-item.active small{color:#a75b70}
    .hero{padding:58px 0 42px}
    .hero-bento{
      display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);
      gap:18px;
    }
    .hero-main{
      min-height:400px;padding:44px;border-radius:var(--radius-lg);
      background:
        linear-gradient(135deg,rgba(119,43,85,.96),rgba(84,32,61,.98)),
        repeating-linear-gradient(90deg,transparent 0 38px,rgba(255,255,255,.05) 39px 40px);
      color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;
    }
    .hero-main::after{
      content:"";position:absolute;width:250px;height:250px;border:1px solid rgba(255,255,255,.16);
      border-radius:50%;right:-70px;top:-74px;box-shadow:0 0 0 28px rgba(255,255,255,.04),0 0 0 57px rgba(255,255,255,.03);
    }
    .eyebrow,.section-kicker{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
    .eyebrow{color:#f6c8d0;position:relative;z-index:1}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(32px,4.5vw,62px);line-height:1.12;letter-spacing:-.065em;margin:18px 0 18px;max-width:760px;position:relative;z-index:1}
    .hero-copy{color:#f7e8ec;max-width:660px;font-size:16px;line-height:1.85;position:relative;z-index:1}
    .hero-actions{display:flex;gap:11px;flex-wrap:wrap;position:relative;z-index:1;margin-top:28px}
    .btn{
      border:1px solid transparent;border-radius:10px;padding:11px 17px;
      display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:750;
      transition:.2s ease;min-height:44px;
    }
    .btn:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(50,20,35,.13)}
    .btn:active{transform:translateY(0)}
    .btn:focus-visible,.tool-link:focus-visible,.nav-item:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
      outline:3px solid rgba(228,146,134,.55);outline-offset:3px
    }
    .btn-primary{background:var(--coral);color:#301d27}
    .btn-light{background:#fff;color:var(--plum)}
    .btn-outline{background:transparent;border-color:#dcb8c4;color:var(--plum)}
    .hero-foot{display:flex;gap:20px;flex-wrap:wrap;color:#f4d9df;font-size:12px;position:relative;z-index:1}
    .hero-foot span{display:flex;align-items:center;gap:7px}
    .dot{width:7px;height:7px;border-radius:50%;background:#8ad0b9;display:inline-block}
    .dot.amber{background:#f1c177}
    .bento-side{display:grid;grid-template-rows:1fr 1fr;gap:18px}
    .panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow)}
    .status-panel{padding:25px;display:flex;flex-direction:column;justify-content:space-between}
    .panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}
    .panel-heading h3{font-size:16px;margin:0;letter-spacing:-.02em}
    .status-badge,.tag{
      display:inline-flex;align-items:center;border-radius:100px;font-size:11px;font-weight:750;
      padding:4px 9px;white-space:nowrap
    }
    .status-badge{background:#e7f4ee;color:#34745f}
    .tag{background:#f8eaee;color:#8a3b59}
    .tag.neutral{background:#f2eff0;color:var(--muted)}
    .status-line{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #f1e8ea}
    .status-line:last-child{border-bottom:0;padding-bottom:0}
    .status-line strong{font-size:14px}
    .status-line span{font-size:12px;color:var(--muted)}
    .mini-feature{padding:22px;background:#f8ecee;border:1px solid #f0d8de;border-radius:var(--radius-lg);position:relative;overflow:hidden}
    .mini-feature::before{content:"";position:absolute;right:-20px;bottom:-55px;width:150px;height:150px;border-radius:50%;border:22px solid rgba(196,101,126,.12)}
    .mini-feature h3{font-size:22px;line-height:1.3;max-width:220px;margin:14px 0 8px}
    .mini-feature p{font-size:13px;color:#785d68;max-width:240px;margin-bottom:16px}
    .age-note{font-size:11px;color:#866b75;display:flex;gap:7px;align-items:flex-start}
    .section{padding:42px 0}
    .section-header{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}
    .section-kicker{color:var(--rose);margin-bottom:8px}
    h2{font-size:clamp(25px,3vw,38px);line-height:1.2;letter-spacing:-.05em;margin-bottom:8px}
    .section-intro{color:var(--muted);max-width:640px;margin-bottom:0;line-height:1.8}
    .text-link{color:var(--plum);font-weight:750;white-space:nowrap;border-bottom:1px solid #d7a6b5;padding-bottom:3px}
    .metrics{
      display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:12px;
      background:#332b33;border-radius:20px;padding:14px;color:#fff;
    }
    .metric{padding:18px 17px;border-right:1px solid rgba(255,255,255,.13)}
    .metric:last-child{border-right:0}
    .metric-label{color:#cdbec5;font-size:12px}
    .metric-value{font-size:31px;font-weight:800;letter-spacing:-.06em;margin:5px 0 3px}
    .metric-note{font-size:11px;color:#a9d8c7}
    .metric-note.warm{color:#f2c18a}
    .matrix{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
    .feature-card{padding:28px;min-height:280px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);position:relative;overflow:hidden}
    .feature-card.large{background:#fff3f3}
    .feature-card h3{font-size:25px;letter-spacing:-.04em;margin:22px 0 9px}
    .feature-card p{color:var(--muted);font-size:14px;max-width:460px}
    .feature-icon{width:45px;height:45px;border-radius:14px;background:var(--plum);color:#fff;display:grid;place-items:center}
    .feature-icon svg{width:21px;height:21px}
    .feature-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:21px}
    .matrix-stack{display:grid;gap:12px}
    .compact-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:13px;transition:.2s ease}
    .compact-card:hover{border-color:#d8a8b6;box-shadow:var(--shadow);transform:translateX(3px)}
    .compact-num{color:var(--rose);font-weight:850;font-size:20px}
    .compact-card h3{font-size:15px;margin:0 0 2px}
    .compact-card p{margin:0;color:var(--muted);font-size:12px}
    .compact-card .text-link{font-size:12px}
    .compare{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .compare-panel{padding:25px;border-radius:20px;border:1px solid var(--line);background:#fff}
    .compare-panel.highlight{background:#3b3038;color:#fff;border-color:#3b3038}
    .compare-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}
    .compare-title h3{font-size:18px;margin:0}
    .compare-panel.highlight .compare-title small{color:#eab4c1}
    .compare-title small{color:var(--muted)}
    .compare-list{list-style:none;padding:0;margin:0}
    .compare-list li{display:flex;gap:11px;padding:12px 0;border-top:1px solid var(--line);font-size:13px}
    .compare-panel.highlight .compare-list li{border-color:rgba(255,255,255,.14);color:#f2e4e8}
    .check{color:var(--sage);font-weight:900}
    .highlight .check{color:#f2b8a7}
    .update-stream{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}
    .stream-list{border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden}
    .stream-item{display:grid;grid-template-columns:8px 1fr auto;gap:15px;align-items:center;padding:18px 21px;border-bottom:1px solid #f0e7e9}
    .stream-item:last-child{border-bottom:0}
    .stream-bar{height:42px;border-radius:8px;background:#f0c4ca}
    .stream-item:nth-child(2) .stream-bar{background:#d8c2df}
    .stream-item:nth-child(3) .stream-bar{background:#f1d6b0}
    .stream-item:nth-child(4) .stream-bar{background:#b9d9d1}
    .stream-item strong{font-size:14px;display:block}
    .stream-item span{font-size:12px;color:var(--muted)}
    .stream-status{text-align:right;font-size:11px;color:var(--sage);font-weight:750}
    .insight{padding:26px;border-radius:20px;background:#f1e9f0;border:1px solid #e3d3e1}
    .insight h3{font-size:20px;margin:0 0 9px}
    .insight p{color:#705b6d;font-size:13px}
    .insight-list{margin:20px 0 0;padding:0;list-style:none}
    .insight-list li{padding:11px 0;border-top:1px solid #dfcfdd;display:flex;justify-content:space-between;gap:10px;font-size:13px}
    .faq-wrap{display:grid;grid-template-columns:.72fr 1.28fr;gap:30px;align-items:start}
    .faq-aside{padding:25px;border-radius:20px;background:#fff1ef;border:1px solid #f0d4d0}
    .faq-aside h3{font-size:23px;line-height:1.3;margin-bottom:10px}
    .faq-aside p{color:#795f62;font-size:13px;margin-bottom:18px}
    details{background:#fff;border:1px solid var(--line);border-radius:13px;margin-bottom:9px;padding:0 18px}
    summary{list-style:none;cursor:pointer;padding:17px 0;font-weight:750;display:flex;justify-content:space-between;gap:15px}
    summary::-webkit-details-marker{display:none}
    summary::after{content:"＋";color:var(--rose);font-size:19px;line-height:1}
    details[open]{border-color:#dcb2bf;background:#fffafb}
    details[open] summary::after{content:"－"}
    details p{color:var(--muted);font-size:13px;padding:0 25px 17px 0;margin:0;line-height:1.8}
    .feedback-section{padding:42px 0 70px}
    .feedback{
      display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;padding:34px;
      border-radius:24px;background:#f4e7eb;border:1px solid #e8ccd5;
    }
    .feedback-copy h2{margin-bottom:12px}
    .feedback-copy p{color:#755d68;max-width:390px}
    .privacy-tip{font-size:11px;color:#886f78;margin-top:24px}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .field{display:flex;flex-direction:column;gap:6px}
    .field.full{grid-column:1/-1}
    label{font-size:12px;font-weight:750;color:#5e4b56}
    input,select,textarea{
      width:100%;border:1px solid #dbc8ce;background:#fff;border-radius:10px;
      padding:11px 13px;color:var(--ink);transition:.2s ease
    }
    textarea{min-height:95px;resize:vertical}
    input:hover,select:hover,textarea:hover{border-color:#c995a5}
    input:focus,select:focus,textarea:focus{border-color:var(--plum);box-shadow:0 0 0 3px rgba(119,43,85,.1);outline:0}
    .checkline{grid-column:1/-1;display:flex;gap:9px;align-items:flex-start;font-size:12px;color:var(--muted)}
    .checkline input{width:16px;height:16px;margin-top:4px;accent-color:var(--plum)}
    .form-submit{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:3px}
    .form-submit small{font-size:11px;color:var(--muted)}
    .footer{background:#302830;color:#d7cbd1;padding:42px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding-bottom:33px}
    .footer .brand-name{color:#fff}
    .footer .brand-sub{color:#a999a3}
    .footer h3{font-size:13px;color:#fff;margin:4px 0 13px}
    .footer p{font-size:12px;color:#aa9da5;max-width:310px}
    .footer-links{list-style:none;padding:0;margin:0}
    .footer-links li{margin:7px 0;font-size:12px;color:#bcaeb6}
    .footer-links a:hover{color:#ffd0d8}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#998c95;font-size:11px}
    .menu-toggle{display:none}
    @media(max-width:992px){
      .hero-bento,.matrix,.update-stream,.feedback{grid-template-columns:1fr}
      .hero-main{min-height:390px}
      .bento-side{grid-template-columns:1fr 1fr;grid-template-rows:none}
      .metrics{grid-template-columns:repeat(2,1fr)}
      .metric:nth-child(2){border-right:0}
      .metric:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.13)}
      .faq-wrap{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
    }
    @media(max-width:700px){
      .container{width:min(100% - 32px,var(--container))}
      .topline-inner{height:auto;min-height:34px;padding:6px 0}
      .topline-inner span{display:none}
      .brand-row{min-height:68px}
      .brand{min-width:0}
      .brand-name{font-size:16px}
      .brand-sub{font-size:10px}
      .brand-mark{width:36px;height:36px}
      .header-tools .tool-link:not(:first-child){display:none}
      .menu-toggle{display:inline-flex}
      .hero{padding-top:30px}
      .hero-main{padding:29px 24px;min-height:450px}
      h1{font-size:35px}
      .hero-copy{font-size:14px}
      .bento-side{grid-template-columns:1fr}
      .section{padding:31px 0}
      .section-header{display:block}
      .section-header .text-link{display:inline-block;margin-top:12px}
      .metrics{display:flex;overflow-x:auto;border-radius:16px;padding:9px;scrollbar-width:none}
      .metrics::-webkit-scrollbar{display:none}
      .metric{min-width:150px;border-right:1px solid rgba(255,255,255,.13)!important;border-bottom:0!important}
      .metric:last-child{border:0!important}
      .compare{grid-template-columns:1fr}
      .feature-card{min-height:245px;padding:23px}
      .compact-card{grid-template-columns:34px 1fr}
      .compact-card .text-link{grid-column:2}
      .feedback{padding:24px 19px;gap:22px}
      .form-grid{grid-template-columns:1fr}
      .field.full,.checkline,.form-submit{grid-column:auto}
      .form-submit{display:block}
      .form-submit .btn{width:100%;margin-top:12px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:22px}
      .footer-grid>div:first-child{grid-column:1/-1}
    }
    @media(max-width:480px){
      .nav-item{min-width:96px;padding:8px 10px}
      .hero-actions .btn{width:100%}
      .hero-foot{display:block}
      .hero-foot span{margin-top:8px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
    }

/* roulang page: category1 */
:root{
 --ink:#29232d;
 --muted:#766c78;
 --soft:#a59aa5;
 --paper:#fffaf9;
 --surface:#fff;
 --mist:#f6eef1;
 --line:#eadde2;
 --plum:#772b55;
 --plum-dark:#54203d;
 --rose:#c4657e;
 --coral:#e49286;
 --sage:#4f8a78;
 --amber:#bd7d3b;
 --radius-sm:10px;
 --radius-md:16px;
 --radius-lg:24px;
 --shadow:0 16px 42px rgba(85,40,62,.09);
 --shadow-hover:0 20px 48px rgba(85,40,62,.16);
 --container:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;background:var(--paper);color:var(--ink);
 font:15px/1.75 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.container{width:min(var(--container),calc(100% - 40px));margin:0 auto}
.site-header{
 position:sticky;top:0;z-index:20;background:rgba(255,250,249,.95);
 backdrop-filter:blur(14px);border-bottom:1px solid var(--line)
}
.brand-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;min-width:250px}
.brand-mark{
 width:40px;height:40px;border-radius:13px;background:var(--plum);color:#fff;
 display:grid;place-items:center;font-weight:800;font-size:17px;
 box-shadow:0 7px 18px rgba(119,43,85,.22)
}
.brand-name{font-size:19px;font-weight:800;letter-spacing:-.04em;line-height:1.25}
.brand-sub{display:block;color:var(--muted);font-size:11px;font-weight:500;letter-spacing:.08em;margin-top:2px}
.header-tools{display:flex;align-items:center;gap:9px}
.tool-link,.menu-toggle{
 border:1px solid var(--line);background:var(--surface);color:var(--muted);
 border-radius:10px;padding:8px 12px;display:inline-flex;align-items:center;gap:7px;transition:.2s ease
}
.tool-link:hover,.menu-toggle:hover{border-color:var(--rose);color:var(--plum);transform:translateY(-1px)}
.tool-link svg,.nav-icon{width:17px;height:17px}
.nav-strip{border-top:1px solid #f2e7ea}
.nav-grid{display:flex;gap:8px;padding:10px 0;overflow-x:auto;scrollbar-width:none}
.nav-grid::-webkit-scrollbar{display:none}
.nav-item{
 flex:0 0 auto;min-width:108px;border:1px solid transparent;border-radius:12px;
 padding:8px 13px;display:flex;align-items:center;gap:9px;color:var(--muted);transition:.2s ease
}
.nav-item:hover{background:#fff0f2;border-color:#f0d7de;color:var(--plum)}
.nav-item.active{background:#f6e4e9;border-color:#e8c2cd;color:var(--plum);font-weight:700}
.nav-item small{display:block;font-size:11px;color:var(--soft);line-height:1.2}
.nav-item.active small{color:#a75b70}
.hero{padding:42px 0 28px}
.breadcrumb{display:flex;gap:9px;align-items:center;color:var(--soft);font-size:13px;margin-bottom:18px}
.breadcrumb a:hover{color:var(--plum)}
.page-banner{
 display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
 gap:24px;align-items:stretch
}
.banner-copy{
 padding:34px 38px;border-radius:var(--radius-lg);
 background:linear-gradient(110deg,#f7e8ec 0%,#fff4f1 100%);
 border:1px solid #f0d8de;position:relative;overflow:hidden
}
.banner-copy:after{
 content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(119,43,85,.12);
 border-radius:50%;right:-80px;top:-80px;box-shadow:0 0 0 25px rgba(119,43,85,.04),0 0 0 52px rgba(119,43,85,.03)
}
.eyebrow,.section-kicker{color:var(--rose);font-size:12px;font-weight:800;letter-spacing:.14em}
.banner-copy h1{font-size:clamp(30px,4vw,52px);line-height:1.2;letter-spacing:-.055em;margin:12px 0 14px;max-width:720px;position:relative;z-index:1}
.banner-copy p{color:#705d68;max-width:690px;margin:0;position:relative;z-index:1}
.banner-side{
 background:var(--plum-dark);border-radius:var(--radius-lg);padding:27px;color:#fff;
 display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow)
}
.side-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.side-top h2{font-size:17px;margin:0}
.status-badge,.tag{
 display:inline-flex;align-items:center;border-radius:100px;font-size:11px;font-weight:750;
 padding:4px 9px;white-space:nowrap
}
.status-badge{background:#e7f4ee;color:#34745f}
.banner-side .status-badge{background:#e5f2eb;color:#bfe5d2}
.side-number{font-size:46px;font-weight:800;line-height:1;margin:28px 0 8px;letter-spacing:-.06em}
.side-note{color:#e6cbd4;font-size:13px;margin:0}
.section{padding:32px 0}
.section-header{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:20px}
.section-kicker{margin-bottom:7px}
.section-header h2{font-size:27px;line-height:1.3;letter-spacing:-.04em;margin:0}
.section-intro{color:var(--muted);max-width:650px;margin:4px 0 0}
.filter-panel{
 padding:15px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
 box-shadow:0 8px 24px rgba(85,40,62,.05);display:flex;gap:10px;flex-wrap:wrap;align-items:center
}
.search-box{position:relative;flex:1 1 240px}
.search-box svg{position:absolute;left:13px;top:13px;width:18px;color:var(--soft)}
.search-box input,.filter-panel select{
 height:44px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);
 padding:0 13px;transition:.2s;width:100%
}
.search-box input{padding-left:40px}
.filter-panel select{flex:0 1 155px}
.search-box input:hover,.filter-panel select:hover{border-color:#d5a3b2}
.search-box input:focus,.filter-panel select:focus,.feedback-form input:focus,.feedback-form textarea:focus{
 outline:3px solid rgba(228,146,134,.22);border-color:var(--rose)
}
.filter-label{font-size:12px;color:var(--muted);font-weight:700;white-space:nowrap}
.filter-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}
.tag{background:#f8eaee;color:#8a3b59;border:1px solid transparent;transition:.2s}
.tag:hover,.tag.selected{background:var(--plum);color:#fff;border-color:var(--plum)}
.tag.neutral{background:#f2eff0;color:var(--muted)}
.content-layout{display:grid;grid-template-columns:4fr 8fr;gap:20px;margin-top:22px}
.featured{
 background:var(--plum-dark);color:#fff;border-radius:var(--radius-lg);padding:24px;
 min-height:355px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative
}
.featured:after{content:"";position:absolute;width:180px;height:180px;border:1px solid rgba(255,255,255,.12);border-radius:50%;right:-65px;bottom:-65px}
.media-placeholder{
 height:138px;border-radius:14px;background:
 linear-gradient(135deg,rgba(196,101,126,.72),rgba(84,32,61,.88)),
 repeating-linear-gradient(135deg,transparent 0 18px,rgba(255,255,255,.08) 19px 20px);
 display:grid;place-items:center;color:#f8dbe2;position:relative;margin-bottom:18px
}
.media-placeholder:before{content:"播放入口";border:1px solid rgba(255,255,255,.45);border-radius:100px;padding:6px 13px;font-size:12px}
.featured h3{font-size:22px;line-height:1.35;margin:0 0 6px;position:relative;z-index:1}
.featured p{color:#e6cbd4;font-size:13px;margin:0;position:relative;z-index:1}
.meta-line{display:flex;gap:8px;flex-wrap:wrap;color:#dcb8c4;font-size:12px;margin-top:13px;position:relative;z-index:1}
.featured .btn{margin-top:18px;position:relative;z-index:1;align-self:flex-start}
.btn{
 border:1px solid transparent;border-radius:10px;padding:10px 16px;min-height:42px;
 display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:750;transition:.2s
}
.btn:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(50,20,35,.13)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--coral);color:#301d27}
.btn-light{background:#fff;color:var(--plum)}
.btn-outline{background:transparent;border-color:#dcb8c4;color:var(--plum)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn:focus-visible,.tool-link:focus-visible,.nav-item:focus-visible,.tag:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
 outline:3px solid rgba(228,146,134,.55);outline-offset:3px
}
.result-list{display:grid;gap:10px}
.result-item{
 display:grid;grid-template-columns:108px minmax(0,1fr) auto;gap:16px;align-items:center;
 padding:13px;background:var(--surface);border:1px solid var(--line);border-radius:15px;transition:.2s
}
.result-item:hover{border-color:#d9aab8;box-shadow:var(--shadow);transform:translateY(-2px)}
.thumb{
 width:108px;height:78px;border-radius:10px;background:linear-gradient(135deg,#f0c5cd,#8d4966);
 position:relative;overflow:hidden
}
.thumb:after{content:"可浏览";position:absolute;left:8px;bottom:7px;background:rgba(84,32,61,.82);color:#fff;border-radius:6px;padding:2px 6px;font-size:10px}
.result-main h3{font-size:16px;line-height:1.4;margin:0 0 5px}
.result-main p{font-size:12px;color:var(--muted);margin:0}
.result-meta{text-align:right;color:var(--soft);font-size:12px;white-space:nowrap}
.result-meta strong{display:block;color:var(--plum);font-size:13px;margin-bottom:6px}
.pagination{display:flex;justify-content:center;gap:8px;margin-top:26px}
.page-btn{
 min-width:38px;height:38px;border:1px solid var(--line);background:#fff;color:var(--muted);
 border-radius:9px;transition:.2s
}
.page-btn:hover,.page-btn.active{background:var(--plum);color:#fff;border-color:var(--plum)}
.page-btn:disabled{opacity:.45;cursor:not-allowed}
.info-strip{
 margin-top:24px;padding:18px 20px;border-radius:14px;background:#f8f1f2;border:1px solid #eedfe3;
 display:flex;align-items:center;justify-content:space-between;gap:18px
}
.info-strip strong{font-size:15px}.info-strip p{margin:2px 0 0;color:var(--muted);font-size:13px}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 18px}
.faq-item summary{cursor:pointer;padding:16px 0;font-weight:750;list-style:none;display:flex;justify-content:space-between;gap:15px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"＋";color:var(--rose);font-size:20px;line-height:1}
.faq-item[open] summary:after{content:"−"}
.faq-item p{color:var(--muted);font-size:13px;margin:0 0 16px}
.cta{
 margin:34px 0 50px;padding:30px 34px;background:#fff3f1;border:1px solid #f0d8de;
 border-radius:var(--radius-lg);display:flex;justify-content:space-between;align-items:center;gap:25px
}
.cta h2{font-size:25px;line-height:1.3;margin:0 0 6px}
.cta p{color:var(--muted);margin:0;max-width:650px}
.feedback-form{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
.feedback-form input{
 height:43px;border:1px solid var(--line);border-radius:9px;padding:0 12px;background:#fff;min-width:220px
}
.footer{background:#342530;color:#e9dce1;padding:42px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
.footer .brand-name{color:#fff}.footer .brand-sub{color:#cdb8c1}.footer .brand-mark{background:var(--coral);color:#38222d}
.footer p{color:#cdb8c1;font-size:13px;max-width:370px}
.footer h3{font-size:14px;color:#fff;margin:4px 0 13px}
.footer-links{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.footer-links a{color:#cdb8c1;font-size:13px;transition:.2s}
.footer-links a:hover{color:#fff1f2;padding-left:3px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:16px;display:flex;justify-content:space-between;gap:15px;color:#bfaab4;font-size:12px}
@media(max-width:992px){
 .page-banner{grid-template-columns:1fr}.content-layout{grid-template-columns:1fr}
 .featured{min-height:300px}.footer-grid{grid-template-columns:1.4fr 1fr 1fr}
}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 32px))}
 .brand-row{min-height:68px}.brand{min-width:0}.brand-name{font-size:16px}.brand-sub{font-size:10px}
 .header-tools .tool-link span{display:none}.tool-link{padding:9px}
 .banner-copy{padding:28px 24px}.banner-copy h1{font-size:34px}
 .section-header{display:block}.section-header h2{font-size:24px}.section-intro{margin-top:6px}
 .filter-panel{align-items:stretch}.filter-panel select{flex:1 1 140px}
 .faq-grid{grid-template-columns:1fr}.cta{display:block;padding:25px 22px}.cta .btn{margin-top:18px}
 .footer-grid{grid-template-columns:1fr 1fr;gap:25px}
}
@media(max-width:520px){
 .hero{padding-top:26px}.breadcrumb{margin-bottom:12px}
 .banner-copy h1{font-size:29px}.banner-side{padding:22px}.side-number{font-size:38px}
 .result-item{grid-template-columns:78px minmax(0,1fr);gap:11px}.thumb{width:78px;height:68px}
 .result-meta{grid-column:2;text-align:left;display:flex;gap:10px;align-items:center}
 .result-meta strong{margin:0}.info-strip{display:block}
 .footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:5px}
 .feedback-form input,.feedback-form .btn{width:100%}
}

/* roulang page: category2 */
:root{
 --ink:#29232d;
 --muted:#766c78;
 --soft:#a59aa5;
 --paper:#fffaf9;
 --surface:#ffffff;
 --mist:#f6eef1;
 --line:#eadde2;
 --plum:#772b55;
 --plum-dark:#54203d;
 --rose:#c4657e;
 --coral:#e49286;
 --sage:#4f8a78;
 --amber:#bd7d3b;
 --danger:#a94b55;
 --radius-sm:10px;
 --radius-md:16px;
 --radius-lg:24px;
 --shadow:0 16px 42px rgba(85,40,62,.09);
 --shadow-hover:0 20px 48px rgba(85,40,62,.16);
 --container:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;color:var(--ink);background:var(--paper);
 font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
 font-size:15px;line-height:1.75;
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.container{width:min(var(--container),calc(100% - 40px));margin:0 auto}
.site-header{
 position:sticky;top:0;z-index:20;background:rgba(255,250,249,.95);
 backdrop-filter:blur(14px);border-bottom:1px solid var(--line)
}
.brand-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;min-width:250px}
.brand-mark{
 width:40px;height:40px;border-radius:13px;background:var(--plum);color:#fff;
 display:grid;place-items:center;font-weight:800;font-size:17px;
 box-shadow:0 7px 18px rgba(119,43,85,.22)
}
.brand-name{font-size:19px;font-weight:800;letter-spacing:-.04em;line-height:1.25}
.brand-sub{display:block;color:var(--muted);font-size:11px;font-weight:500;letter-spacing:.08em;margin-top:2px}
.header-tools{display:flex;align-items:center;gap:9px}
.tool-link,.menu-toggle{
 border:1px solid var(--line);background:var(--surface);color:var(--muted);
 border-radius:10px;padding:8px 12px;display:inline-flex;align-items:center;gap:7px;
 transition:.2s ease
}
.tool-link:hover,.menu-toggle:hover{border-color:var(--rose);color:var(--plum);transform:translateY(-1px)}
.tool-link svg,.nav-icon{width:17px;height:17px}
.nav-strip{border-top:1px solid #f2e7ea}
.nav-grid{display:flex;gap:8px;padding:10px 0;overflow-x:auto;scrollbar-width:none}
.nav-grid::-webkit-scrollbar{display:none}
.nav-item{
 flex:0 0 auto;min-width:108px;border:1px solid transparent;border-radius:12px;
 padding:8px 13px;display:flex;align-items:center;gap:9px;color:var(--muted);
 transition:.2s ease
}
.nav-item:hover{background:#fff0f2;border-color:#f0d7de;color:var(--plum)}
.nav-item.active{background:#f6e4e9;border-color:#e8c2cd;color:var(--plum);font-weight:700}
.nav-item small{display:block;font-size:11px;color:var(--soft);line-height:1.2}
.nav-item.active small{color:#a75b70}
.btn{
 border:1px solid transparent;border-radius:10px;padding:11px 17px;
 display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:750;
 transition:.2s ease;min-height:44px
}
.btn:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(50,20,35,.13)}
.btn:active{transform:translateY(0)}
.btn:focus-visible,.tool-link:focus-visible,.nav-item:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
 outline:3px solid rgba(228,146,134,.55);outline-offset:3px
}
.btn-primary{background:var(--coral);color:#301d27}
.btn-light{background:#fff;color:var(--plum)}
.btn-outline{background:transparent;border-color:#dcb8c4;color:var(--plum)}
.page-head{padding:38px 0 28px;border-bottom:1px solid var(--line)}
.breadcrumb{display:flex;align-items:center;gap:8px;color:var(--soft);font-size:13px;margin-bottom:20px}
.breadcrumb a{color:var(--plum);font-weight:700}
.breadcrumb span{color:#c8b8bf}
.head-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:35px;align-items:end}
.eyebrow,.section-kicker{
 color:var(--rose);font-size:12px;font-weight:800;letter-spacing:.14em
}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(30px,4vw,50px);line-height:1.2;letter-spacing:-.055em;margin:8px 0 16px;max-width:800px}
.head-summary{color:var(--muted);font-size:16px;max-width:760px;margin-bottom:0}
.update-panel{
 background:var(--plum-dark);color:#fff;border-radius:var(--radius-lg);padding:22px;
 box-shadow:var(--shadow)
}
.update-panel .panel-top{display:flex;justify-content:space-between;gap:12px;align-items:center}
.update-panel .panel-label{color:#e8bdc9;font-size:12px}
.update-number{font-size:38px;font-weight:800;line-height:1.1;margin:20px 0 4px}
.update-panel p{color:#e9d7dd;font-size:13px;margin:0}
.status-badge,.tag{
 display:inline-flex;align-items:center;border-radius:100px;font-size:11px;font-weight:750;
 padding:4px 9px;white-space:nowrap
}
.status-badge{background:#e7f4ee;color:#34745f}
.status-badge.dark{background:rgba(255,255,255,.13);color:#f7d9df}
.tag{background:#f8eaee;color:#8a3b59}
.tag.neutral{background:#f2eff0;color:var(--muted)}
.content-area{padding:34px 0 55px}
.filter-shell{
 background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
 padding:18px;box-shadow:var(--shadow);margin-bottom:28px
}
.filter-top{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}
.filter-top h2{font-size:18px;margin:0;letter-spacing:-.03em}
.filter-status{font-size:12px;color:var(--muted)}
.filter-form{display:grid;grid-template-columns:minmax(220px,1.5fr) 1fr 1fr 1fr auto;gap:10px}
.field{position:relative}
.field input,.field select,.feedback-form input,.feedback-form select,.feedback-form textarea{
 width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;
 color:var(--ink);padding:11px 13px;min-height:44px;transition:.2s ease
}
.field input{padding-left:38px}
.field svg{position:absolute;left:13px;top:14px;width:16px;height:16px;color:var(--soft);pointer-events:none}
.field input:hover,.field select:hover,.feedback-form input:hover,.feedback-form select:hover,.feedback-form textarea:hover{
 border-color:#d7a6b5
}
.field input:focus,.field select:focus,.feedback-form input:focus,.feedback-form select:focus,.feedback-form textarea:focus{
 border-color:var(--rose);box-shadow:0 0 0 3px rgba(196,101,126,.12);outline:0
}
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 1px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{
 border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:100px;
 padding:6px 12px;font-size:12px;white-space:nowrap;transition:.2s ease
}
.chip:hover,.chip.active{border-color:#dfb4c1;background:#f8e8ed;color:var(--plum);font-weight:700}
.result-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(250px,3fr);gap:22px}
.result-main{min-width:0}
.result-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:15px}
.result-heading h2{margin:0;font-size:24px;letter-spacing:-.04em}
.result-heading p{margin:0;color:var(--muted);font-size:13px}
.featured-result{
 display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;padding:16px;
 background:#fff3f3;border:1px solid #f0d8de;border-radius:var(--radius-lg);
 margin-bottom:16px;transition:.2s ease
}
.featured-result:hover,.content-row:hover{border-color:#d9a7b5;box-shadow:var(--shadow-hover);transform:translateY(-2px)}
.media-thumb,.media-small{
 position:relative;overflow:hidden;border-radius:14px;background:
 linear-gradient(145deg,#8a4262,#d6878c 58%,#f2c2b6)
}
.media-thumb{min-height:190px}
.media-thumb::before,.media-small::before{
 content:"";position:absolute;inset:0;background:
 repeating-linear-gradient(135deg,rgba(255,255,255,.15) 0 1px,transparent 1px 12px);
 opacity:.7
}
.media-thumb::after,.media-small::after{
 content:"播放";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
 width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
 background:rgba(255,255,255,.88);color:var(--plum);font-weight:800;font-size:12px
}
.media-small{width:82px;height:72px;flex:0 0 82px}
.media-small::after{width:30px;height:30px;font-size:10px}
.result-copy{display:flex;flex-direction:column;justify-content:center}
.result-meta{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:9px}
.result-copy h3{font-size:22px;line-height:1.35;margin:0 0 7px;letter-spacing:-.035em}
.result-copy p{font-size:13px;color:var(--muted);margin:0 0 15px;line-height:1.7}
.result-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px}
.mini-info{font-size:12px;color:var(--soft)}
.content-list{display:grid;gap:10px}
.content-row{
 display:flex;align-items:center;gap:14px;padding:12px 14px;background:#fff;
 border:1px solid var(--line);border-radius:14px;transition:.2s ease
}
.content-row .row-copy{min-width:0;flex:1}
.row-copy h3{font-size:15px;margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-copy p{font-size:12px;color:var(--muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-aside{text-align:right;flex:0 0 auto}
.row-aside strong{display:block;color:var(--plum);font-size:13px}
.row-aside small{display:block;color:var(--soft);font-size:11px}
.side-stack{display:grid;gap:16px;align-content:start}
.side-card{
 background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px
}
.side-card.soft{background:var(--mist);border-color:#ecd8df}
.side-card h3{font-size:17px;margin:0 0 13px}
.side-card p{font-size:13px;color:var(--muted);line-height:1.75;margin-bottom:15px}
.side-links{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.side-links li a{
 display:flex;justify-content:space-between;align-items:center;gap:10px;
 padding:9px 10px;border-radius:9px;color:var(--muted);font-size:13px;transition:.2s ease
}
.side-links li a:hover{background:#fff;color:var(--plum);padding-left:14px}
.side-links span:last-child{color:var(--soft)}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--sage);margin-right:6px}
.rule-list{display:grid;gap:10px}
.rule-item{display:flex;gap:9px;font-size:12px;color:var(--muted);line-height:1.6}
.rule-item b{color:var(--plum);font-size:13px}
.pagination{
 display:flex;align-items:center;justify-content:space-between;gap:15px;
 border-top:1px solid var(--line);margin-top:25px;padding-top:18px
}
.page-count{font-size:13px;color:var(--muted)}
.page-buttons{display:flex;gap:7px}
.page-button{
 min-width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:#fff;
 color:var(--muted);transition:.2s ease
}
.page-button:hover,.page-button.active{background:#f6e4e9;border-color:#e8c2cd;color:var(--plum);font-weight:750}
.page-button:disabled{opacity:.45;cursor:not-allowed}
.section{padding:42px 0}
.section-header{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}
.section-kicker{margin-bottom:8px}
.section-header h2{font-size:28px;line-height:1.25;letter-spacing:-.045em;margin:0}
.section-intro{color:var(--muted);max-width:640px;margin:7px 0 0;line-height:1.8}
.related-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:16px}
.related-main{
 min-height:190px;border-radius:var(--radius-lg);padding:26px;
 background:var(--plum-dark);color:#fff;display:flex;flex-direction:column;justify-content:space-between
}
.related-main h3{font-size:25px;line-height:1.3;margin:12px 0 5px;max-width:520px}
.related-main p{color:#ead8de;font-size:13px;margin:0;max-width:520px}
.related-side{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.related-link{
 background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px;
 display:flex;flex-direction:column;justify-content:space-between;transition:.2s ease
}
.related-link:hover{border-color:#d7a6b5;transform:translateY(-2px);box-shadow:var(--shadow)}
.related-link strong{font-size:15px;color:var(--plum)}
.related-link span{font-size:12px;color:var(--muted);margin-top:10px}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:30px}
.faq-grid h2{font-size:30px;line-height:1.3;letter-spacing:-.04em;margin:0 0 10px}
.faq-grid>div>p{color:var(--muted);max-width:330px}
.faq-list{display:grid;gap:9px}
details{background:#fff;border:1px solid var(--line);border-radius:13px;padding:0 17px;transition:.2s ease}
details[open]{border-color:#dfb4c1;background:#fffafb}
summary{list-style:none;cursor:pointer;padding:15px 27px 15px 0;font-weight:750;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"＋";position:absolute;right:0;top:13px;color:var(--rose);font-size:20px;font-weight:400}
details[open] summary::after{content:"－"}
details p{color:var(--muted);font-size:13px;margin:-3px 0 16px;line-height:1.8}
.cta-section{padding:28px 0 58px}
.cta-box{
 display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center;
 padding:28px 30px;background:#f8e8ed;border:1px solid #edcfd8;border-radius:var(--radius-lg)
}
.cta-box h2{font-size:25px;margin:0 0 7px;letter-spacing:-.04em}
.cta-box p{color:#795e69;margin:0;font-size:13px}
.feedback-form{
 display:grid;grid-template-columns:1fr 1fr 1.2fr auto;gap:10px;margin-top:18px
}
.feedback-form textarea{min-height:44px;resize:vertical}
.form-note{font-size:11px;color:var(--muted);margin:10px 0 0}
.footer{background:#33252f;color:#eee0e5;padding:42px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:32px}
.footer .brand-name{color:#fff}
.footer .brand-sub{color:#c8aeb9}
.footer p{color:#cdbac2;max-width:330px;font-size:13px;line-height:1.8}
.footer h3{font-size:14px;color:#fff;margin:4px 0 12px}
.footer-links{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.footer-links a{color:#cdbac2;font-size:13px;transition:.2s ease}
.footer-links a:hover{color:#fff0f2;padding-left:3px}
.footer-bottom{
 border-top:1px solid rgba(255,255,255,.13);margin-top:30px;padding-top:16px;
 display:flex;justify-content:space-between;gap:15px;color:#bda9b2;font-size:11px
}
.age-note{
 display:inline-flex;align-items:center;gap:7px;color:#795e69;font-size:12px;
 background:#fff;border:1px solid #edcfd8;border-radius:100px;padding:6px 10px
}
.age-note i{width:7px;height:7px;background:var(--sage);border-radius:50%}
.empty-state{
 display:none;margin-top:14px;padding:26px;text-align:center;border:1px dashed #d9c1c9;
 border-radius:15px;color:var(--muted);background:#fff
}
@media(max-width:1100px){
 .filter-form{grid-template-columns:1fr 1fr 1fr}
 .filter-form .search-field{grid-column:span 3}
 .result-layout{grid-template-columns:1fr}
 .side-stack{grid-template-columns:1fr 1fr}
}
@media(max-width:800px){
 .head-layout,.faq-grid{grid-template-columns:1fr}
 .update-panel{max-width:none}
 .featured-result{grid-template-columns:145px minmax(0,1fr)}
 .related-grid{grid-template-columns:1fr}
 .feedback-form{grid-template-columns:1fr 1fr}
 .feedback-form .btn{grid-column:span 2}
 .footer-grid{grid-template-columns:1.4fr 1fr 1fr}
 .footer-grid>div:last-child{display:none}
}
@media(max-width:576px){
 .container{width:min(var(--container),calc(100% - 32px))}
 .brand-row{min-height:68px}
 .brand{min-width:0;gap:9px}
 .brand-mark{width:36px;height:36px;font-size:15px}
 .brand-name{font-size:15px}
 .brand-sub{font-size:9px}
 .header-tools .tool-link span{display:none}
 .tool-link{padding:9px}
 .nav-item{min-width:102px;padding:8px 10px}
 .page-head{padding:27px 0 23px}
 h1{font-size:31px}
 .head-summary{font-size:14px}
 .filter-form{grid-template-columns:1fr 1fr}
 .filter-form .search-field{grid-column:span 2}
 .filter-form .btn{grid-column:span 2}
 .filter-top{align-items:flex-start;flex-direction:column;gap:4px}
 .featured-result{grid-template-columns:1fr;gap:14px}
 .media-thumb{min-height:150px}
 .result-copy h3{font-size:20px}
 .result-bottom{align-items:flex-start;flex-direction:column}
 .content-row{gap:10px;padding:10px}
 .media-small{width:70px;height:62px;flex-basis:70px}
 .row-aside{display:none}
 .side-stack{grid-template-columns:1fr}
 .pagination{align-items:flex-start;flex-direction:column}
 .related-side{grid-template-columns:1fr}
 .section-header{align-items:flex-start;flex-direction:column;gap:4px}
 .section-header h2{font-size:25px}
 .cta-box{grid-template-columns:1fr;padding:22px}
 .feedback-form{grid-template-columns:1fr}
 .feedback-form .btn{grid-column:auto;width:100%}
 .footer-grid{grid-template-columns:1fr 1fr;gap:22px}
 .footer-grid>div:first-child{grid-column:span 2}
 .footer-bottom{align-items:flex-start;flex-direction:column}
}
