/* roulang page: index */
:root{
      --ink:#183d50;
      --primary:#1c526b;
      --primary-dark:#123f55;
      --steel:#6e8995;
      --paper:#ffffff;
      --ground:#f5f8f9;
      --mist:#eaf1f4;
      --line:#d7e2e6;
      --sand:#b87932;
      --sand-pale:#fcf3e8;
      --text:#243942;
      --muted:#61747c;
      --deep:#102f3d;
      --radius:14px;
      --radius-sm:9px;
      --shadow:0 12px 30px rgba(21,55,70,.08);
      --shadow-up:0 18px 38px rgba(21,55,70,.15);
      --container:1220px;
      --ease:180ms ease-out;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--ground);color:var(--text);
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
      font-size:16px;line-height:1.72;letter-spacing:.01em;
    }
    a{color:inherit;text-decoration:none}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    img{max-width:100%;height:auto}
    :focus-visible{outline:3px solid rgba(28,82,107,.38);outline-offset:3px}
    .grid-container{max-width:var(--container);padding-left:24px;padding-right:24px}
    .site-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);position:relative;z-index:20}
    .masthead{padding:25px 0 17px}
    .masthead-row{display:flex;align-items:end;justify-content:space-between;gap:28px}
    .brand-wrap{display:flex;align-items:end;gap:16px;min-width:0}
    .wordmark{font-size:30px;font-weight:850;letter-spacing:-.07em;color:var(--ink);line-height:1.05;white-space:nowrap}
    .edition{padding:0 0 2px 16px;border-left:1px solid var(--line);font-size:12px;color:var(--steel);letter-spacing:.08em;white-space:nowrap}
    .mast-meta{display:flex;align-items:center;gap:12px}
    .age-mark{font-weight:800;font-size:12px;letter-spacing:.08em;color:#8b571f;background:var(--sand-pale);border:1px solid #edd9bd;padding:6px 9px;border-radius:6px}
    .nav-line{border-top:1px solid var(--line)}
    .nav-row{display:flex;align-items:center;justify-content:space-between;min-height:52px}
    .main-nav{display:flex;align-items:stretch;gap:4px}
    .main-nav a{position:relative;padding:14px 14px 12px;font-size:14px;font-weight:700;color:var(--muted);transition:color var(--ease)}
    .main-nav a:after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform var(--ease)}
    .main-nav a:hover,.main-nav a.active{color:var(--primary)}
    .main-nav a:hover:after,.main-nav a.active:after{transform:scaleX(1)}
    .nav-code{font-size:11px;color:var(--steel);letter-spacing:.1em}
    .button{margin:0;border-radius:9px;padding:11px 17px;font-size:14px;font-weight:750;line-height:1.2;transition:transform var(--ease),background var(--ease),box-shadow var(--ease)}
    .button.primary-btn{background:var(--primary);color:#fff}
    .button.primary-btn:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 18px rgba(28,82,107,.23)}
    .button.hollow-btn{background:#fff;color:var(--primary);border:1px solid #b8cbd2}
    .button.hollow-btn:hover{border-color:var(--primary);background:var(--mist);transform:translateY(-2px)}
    .mobile-menu{display:none;color:var(--primary);font-weight:800;font-size:14px;background:transparent;border:0;padding:10px 0}
    .off-canvas{background:var(--paper);padding:28px 24px;color:var(--text)}
    .off-canvas .wordmark{font-size:23px;white-space:normal}
    .off-canvas-menu{margin:28px 0;padding:0;list-style:none;border-top:1px solid var(--line)}
    .off-canvas-menu a{display:block;padding:15px 0;border-bottom:1px solid var(--line);font-weight:750;color:var(--ink)}
    .off-canvas-note{font-size:13px;color:var(--muted);background:var(--mist);padding:14px;border-radius:var(--radius-sm)}
    main{overflow:hidden}
    .section{padding:88px 0;position:relative}
    .section-mist{background:var(--mist)}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
    .eyebrow:before{content:"";width:24px;height:2px;background:var(--sand)}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(36px,4.2vw,52px);letter-spacing:-.065em;line-height:1.18;color:var(--ink);font-weight:850}
    h2{font-size:clamp(27px,2.7vw,34px);line-height:1.28;letter-spacing:-.045em;color:var(--ink);font-weight:830}
    h3{font-size:20px;line-height:1.35;letter-spacing:-.025em;color:var(--ink);font-weight:800}
    .section-lead{font-size:16px;color:var(--muted);max-width:640px;margin-bottom:0}
    .dashboard{padding-top:58px;padding-bottom:72px;background:linear-gradient(110deg,#f8fbfc 0%,#f5f8f9 65%,#edf4f6 100%)}
    .dashboard:before{content:"";position:absolute;inset:0;opacity:.42;pointer-events:none;background-image:linear-gradient(rgba(28,82,107,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(28,82,107,.035) 1px,transparent 1px);background-size:42px 42px}
    .dashboard .grid-container{position:relative}
    .dash-copy{padding:28px 34px 28px 0}
    .dash-copy .intro{font-size:17px;line-height:1.8;max-width:510px;color:var(--muted);margin-bottom:22px}
    .compliance-box{border-left:3px solid var(--sand);background:rgba(255,255,255,.78);padding:14px 16px;margin:24px 0;border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:#5d5142;font-size:14px}
    .action-group{display:flex;gap:11px;flex-wrap:wrap}
    .dash-panel{background:var(--deep);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden;color:#eaf4f7}
    .dash-panel:after{content:"";position:absolute;inset:0;opacity:.18;background-image:radial-gradient(#8fb2bf 1px,transparent 1px);background-size:16px 16px;pointer-events:none}
    .panel-top,.stat-grid,.status-strip{position:relative;z-index:1}
    .panel-top{display:flex;justify-content:space-between;align-items:center;padding:3px 2px 14px;border-bottom:1px solid rgba(203,231,238,.2);font-size:12px;letter-spacing:.1em}
    .live-dot{display:inline-flex;gap:6px;align-items:center;color:#d6ebef}
    .live-dot i{width:7px;height:7px;background:var(--sand);display:inline-block;border-radius:50%}
    .stat-grid{margin-top:12px}
    .stat-card{min-height:126px;padding:18px;border:1px solid rgba(205,231,238,.18);background:rgba(255,255,255,.06)}
    .stat-card.main-stat{background:rgba(84,145,163,.17)}
    .stat-num{font-size:42px;line-height:1;font-weight:850;color:#fff;letter-spacing:-.07em}
    .stat-label{margin-top:12px;font-size:13px;color:#c2d8de}
    .stat-note{font-size:11px;color:#85a9b5;margin-top:4px}
    .status-strip{display:flex;gap:10px;align-items:center;margin-top:12px;padding:13px 4px 2px;color:#b9d0d6;font-size:12px}
    .status-strip b{color:#fff;font-weight:800}
    .progress{height:4px;flex:1;background:rgba(255,255,255,.15);border-radius:4px;overflow:hidden}
    .progress span{display:block;width:72%;height:100%;background:var(--sand)}
    .section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}
    .matrix-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 8px 20px rgba(21,55,70,.045);height:100%;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
    .matrix-card:hover{border-color:#8eafb9;transform:translateY(-4px);box-shadow:var(--shadow)}
    .matrix-card.large{background:var(--ink);color:#e3f0f3;position:relative;overflow:hidden}
    .matrix-card.large h3{color:#fff;font-size:25px}
    .matrix-card.large p{color:#c3d8de}
    .matrix-card.large:before{content:"INDEX / 01";position:absolute;right:20px;top:14px;font-size:11px;letter-spacing:.12em;color:rgba(255,255,255,.34)}
    .index-icon{width:39px;height:39px;border:1px solid #b5cad1;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:14px;font-weight:850;margin-bottom:20px}
    .large .index-icon{border-color:rgba(255,255,255,.35);color:#e6b980}
    .matrix-card p{color:var(--muted);font-size:14px;margin-bottom:18px}
    .mini-list{list-style:none;padding:0;margin:0}
    .mini-list li{padding:8px 0;border-top:1px solid rgba(215,226,230,.9);font-size:13px;color:var(--muted)}
    .mini-list li:before{content:"—";color:var(--sand);margin-right:7px}
    .large .mini-list li{border-color:rgba(255,255,255,.14);color:#c3d8de}
    .text-link{font-size:13px;font-weight:800;color:var(--primary);display:inline-flex;align-items:center;gap:7px}
    .text-link span{transition:transform var(--ease)}
    .text-link:hover span{transform:translateX(4px)}
    .comparison-intro{padding-right:34px}
    .compare-card{padding:28px;border-radius:var(--radius);min-height:100%;border:1px solid var(--line);background:#f8fafb}
    .compare-card.recommended{background:#fff;border:2px solid var(--primary);box-shadow:var(--shadow)}
    .compare-mark{font-size:12px;color:var(--steel);font-weight:850;letter-spacing:.1em}
    .recommended .compare-mark{color:var(--primary)}
    .compare-card h3{margin:15px 0 20px;font-size:24px}
    .compare-list{list-style:none;padding:0;margin:0}
    .compare-list li{padding:13px 0;border-top:1px solid var(--line);font-size:14px;color:var(--muted);display:flex;gap:10px}
    .compare-list i{font-style:normal;color:var(--steel);font-weight:900}
    .recommended .compare-list i{color:var(--sand)}
    .compare-foot{margin-top:20px;padding-top:14px;border-top:2px solid var(--line);font-size:13px;color:var(--muted)}
    .info-band{margin-top:34px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;color:var(--muted);font-size:13px;display:flex;gap:12px;align-items:center}
    .info-band strong{color:var(--primary);letter-spacing:.09em}
    .faq-layout{margin-top:34px}
    .accordion{background:transparent;margin:0}
    .accordion-item{border:1px solid var(--line);margin-bottom:10px;border-radius:var(--radius-sm);overflow:hidden;background:#fff}
    .accordion-title{border:0;color:var(--ink);font-size:16px;font-weight:780;padding:17px 48px 17px 20px;line-height:1.45;transition:background var(--ease)}
    .accordion-title:hover,.accordion-title:focus{background:var(--mist);color:var(--primary)}
    .accordion-title:before{color:var(--primary);font-size:20px;font-weight:400;right:20px;margin-top:-13px}
    .accordion-content{border:0;background:#f4f8f9;color:var(--muted);font-size:14px;padding:0 20px 18px;line-height:1.8}
    .faq-no{display:inline-block;color:var(--sand);font-size:12px;margin-right:9px;letter-spacing:.08em}
    .form-section{padding-bottom:96px}
    .feedback-note{background:var(--ink);color:#d3e4e9;border-radius:var(--radius);padding:38px;height:100%;position:relative;overflow:hidden}
    .feedback-note:before{content:"FEEDBACK / 06";position:absolute;right:-5px;bottom:10px;color:rgba(255,255,255,.1);font-size:22px;font-weight:850;letter-spacing:.04em}
    .feedback-note h2{color:#fff}
    .feedback-note p{color:#c2d5da;max-width:410px}
    .note-points{list-style:none;margin:24px 0 0;padding:0}
    .note-points li{padding:10px 0;border-top:1px solid rgba(255,255,255,.14);font-size:14px}
    .note-points li:before{content:"□";color:#e3af69;margin-right:9px}
    .form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:31px;box-shadow:var(--shadow)}
    label{display:block;font-size:13px;font-weight:760;color:var(--ink);margin-bottom:7px}
    .optional{font-weight:400;color:var(--steel)}
    input,select,textarea{width:100%;margin:0;border:1px solid #cbd9de;border-radius:8px;box-shadow:none;color:var(--text);background:#fff;transition:border var(--ease),box-shadow var(--ease)}
    input,select{height:46px;padding:0 12px}
    textarea{min-height:105px;padding:11px 12px;resize:vertical}
    input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(28,82,107,.12)}
    .field{margin-bottom:16px}
    .check-row{display:flex;align-items:flex-start;gap:9px;margin:4px 0 18px;font-size:13px;color:var(--muted)}
    .check-row input{width:17px;height:17px;margin-top:3px;flex:none}
    .form-help{font-size:12px;color:var(--steel);margin:12px 0 0}
    .inline-success{display:none;margin-top:15px;background:#edf6f4;border-left:3px solid #397969;padding:11px 13px;color:#376357;font-size:14px;border-radius:0 7px 7px 0}
    .site-footer{background:var(--deep);color:#b9d0d6;position:relative;overflow:hidden}
    .site-footer:before{content:"";position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(194,226,234,.45) 1px,transparent 1px),linear-gradient(90deg,rgba(194,226,234,.45) 1px,transparent 1px);background-size:38px 38px}
    .footer-inner{position:relative;padding:54px 0 24px}
    .footer-brand{font-size:24px;color:#fff;font-weight:850;letter-spacing:-.06em;margin-bottom:12px}
    .footer-copy{max-width:530px;font-size:13px;margin:0;color:#b9d0d6}
    .footer-links{display:flex;justify-content:flex-end;gap:24px;flex-wrap:wrap;padding-top:9px}
    .footer-links a{font-size:14px;color:#d8e8ec;transition:color var(--ease)}
    .footer-links a:hover{color:#e6b980}
    .footer-bottom{position:relative;border-top:1px solid rgba(214,234,239,.18);padding-top:18px;margin-top:35px;font-size:12px;color:#8fafb8;display:flex;justify-content:space-between;gap:15px}
    .reveal{border:0;border-radius:14px;padding:28px;box-shadow:var(--shadow-up)}
    .reveal h3{margin-bottom:10px}
    .reveal p{color:var(--muted);font-size:14px}
    .close-button{color:var(--primary)}
    @media(max-width:1024px){
      .wordmark{font-size:26px}.masthead{padding-top:20px}.dashboard{padding-top:42px}
      .dash-copy{padding-right:12px}.section{padding:70px 0}
    }
    @media(max-width:768px){
      .grid-container{padding-left:18px;padding-right:18px}
      .masthead{padding:17px 0 12px}.masthead-row{align-items:center}
      .wordmark{font-size:22px;white-space:normal;letter-spacing:-.06em}.edition,.nav-line{display:none}
      .mast-meta .button{display:none}.mobile-menu{display:block}.main-nav,.nav-code{display:none}
      .dashboard{padding:32px 0 50px}.dash-copy{padding:10px 0 24px}
      .section{padding:58px 0}.section-head{display:block;margin-bottom:25px}.section-head .section-lead{margin-top:12px}
      .comparison-intro{padding-right:0;margin-bottom:22px}.form-section{padding-bottom:62px}
      .feedback-note{padding:29px;margin-bottom:18px}.form-card{padding:23px}
      .footer-links{justify-content:flex-start;padding-top:25px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:6px}
    }
    @media(max-width:480px){
      body{font-size:15px}.age-mark{font-size:11px;padding:5px 7px}
      h1{font-size:34px}.dash-panel{padding:12px}.stat-card{min-height:105px;padding:14px}.stat-num{font-size:33px}
      .action-group .button{width:100%;text-align:center}.matrix-card{padding:22px}.compare-card{padding:22px}
      .footer-brand{font-size:21px}.footer-links{gap:13px 18px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
    }

/* roulang page: category1 */
:root{
 --ink:#183d50;
 --primary:#1c526b;
 --primary-dark:#123f55;
 --steel:#6e8995;
 --paper:#ffffff;
 --ground:#f5f8f9;
 --mist:#eaf1f4;
 --line:#d7e2e6;
 --sand:#b87932;
 --sand-pale:#fcf3e8;
 --text:#243942;
 --muted:#61747c;
 --deep:#102f3d;
 --radius:14px;
 --radius-sm:9px;
 --shadow:0 12px 30px rgba(21,55,70,.08);
 --shadow-up:0 18px 38px rgba(21,55,70,.15);
 --container:1220px;
 --ease:180ms ease-out;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;background:var(--ground);color:var(--text);
 font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
 font-size:16px;line-height:1.72;letter-spacing:.01em;
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;height:auto}
.grid-container{max-width:var(--container);padding-left:24px;padding-right:24px}
.site-header{background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;backdrop-filter:blur(10px)}
.masthead{padding:20px 0 14px}
.masthead-row{display:flex;align-items:end;justify-content:space-between;gap:28px}
.brand-wrap{display:flex;align-items:end;gap:16px;min-width:0}
.brand-mark{display:block;font-size:29px;line-height:1.15;font-weight:900;letter-spacing:-.04em;color:var(--ink);white-space:nowrap}
.brand-caption{font-size:12px;color:var(--steel);border-left:1px solid var(--line);padding:3px 0 3px 16px;white-space:nowrap}
.mast-meta{display:flex;align-items:center;gap:12px}
.age-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid #e4c49d;border-radius:5px;background:var(--sand-pale);color:#8a571d;font-size:11px;font-weight:850;letter-spacing:.07em}
.age-badge:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sand)}
.nav-line{border-top:1px solid var(--line)}
.nav-row{display:flex;align-items:center;justify-content:space-between;min-height:52px}
.main-nav{display:flex;align-items:stretch;gap:4px}
.main-nav a{position:relative;padding:14px 14px 12px;font-size:14px;font-weight:700;color:var(--muted);transition:color var(--ease)}
.main-nav a:after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform var(--ease)}
.main-nav a:hover,.main-nav a.active{color:var(--primary)}
.main-nav a:hover:after,.main-nav a.active:after{transform:scaleX(1)}
.nav-code{font-size:11px;color:var(--steel);letter-spacing:.1em}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:0;border:0;border-radius:9px;padding:11px 17px;font-size:14px;font-weight:750;line-height:1.2;transition:transform var(--ease),background var(--ease),box-shadow var(--ease),border-color var(--ease)}
.button.primary-btn{background:var(--primary);color:#fff}
.button.primary-btn:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 18px rgba(28,82,107,.23)}
.button.hollow-btn{background:#fff;color:var(--primary);border:1px solid #b8cbd2}
.button.hollow-btn:hover{border-color:var(--primary);background:var(--mist);transform:translateY(-2px)}
.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(28,82,107,.28);outline-offset:3px}
.mobile-menu{display:none;color:var(--primary);font-weight:800;font-size:14px;background:transparent;border:0;padding:10px 0}
.off-canvas{background:var(--paper);padding:20px}
.off-canvas-menu{margin:22px 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.off-canvas-menu a{display:block;padding:15px 0;border-bottom:1px solid var(--line);font-weight:750;color:var(--ink)}
.mobile-brand{font-weight:900;font-size:21px;color:var(--ink)}
.mobile-note{font-size:13px;color:var(--muted);margin:18px 0}
main{overflow:hidden}
.section{padding:82px 0;position:relative}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-size:12px;font-weight:850;letter-spacing:.12em}
.eyebrow:before{content:"";width:24px;height:2px;background:var(--sand)}
.page-intro{padding:44px 0 34px;background:linear-gradient(135deg,#fff 0%,#f1f6f7 100%);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-intro:after{content:"";position:absolute;width:480px;height:480px;right:-180px;top:-280px;background-image:radial-gradient(rgba(28,82,107,.18) 1px,transparent 1px);background-size:12px 12px;opacity:.45;transform:rotate(18deg)}
.breadcrumb{position:relative;z-index:1;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:28px}
.breadcrumb span{color:var(--steel)}
.intro-grid{position:relative;z-index:1}
.page-title{font-size:42px;letter-spacing:-.045em;line-height:1.24;color:var(--ink);margin:11px 0 15px;font-weight:900}
.intro-copy{max-width:690px;color:var(--muted);font-size:16px;margin:0}
.title-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:23px}
.tag{display:inline-flex;align-items:center;border:1px solid #bfd2d8;border-radius:5px;padding:4px 8px;font-size:12px;line-height:1.3;font-weight:750;color:var(--primary);background:#fff}
.tag.sand{border-color:#e4c49d;background:var(--sand-pale);color:#8a571d}
.access-note{background:var(--deep);color:#e6f0f2;border-radius:var(--radius);padding:22px 23px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.access-note:after{content:"18+";position:absolute;right:16px;bottom:-24px;color:rgba(255,255,255,.08);font-size:86px;font-weight:900;line-height:1}
.access-note h2{font-size:17px;color:#fff;margin:0 0 8px;position:relative}
.access-note p{font-size:13px;line-height:1.65;margin:0;position:relative;color:#c4d5da}
.index-shell{padding-top:46px}
.filter-panel{position:sticky;top:142px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 20px rgba(21,55,70,.045);overflow:hidden}
.filter-heading{background:var(--ink);color:#fff;padding:18px 20px;display:flex;justify-content:space-between;align-items:center}
.filter-heading h2{font-size:16px;margin:0;color:#fff}
.filter-heading span{font-size:11px;color:#b9d0d8;letter-spacing:.1em}
.filter-body{padding:18px 20px 20px}
.filter-group{border-bottom:1px solid var(--line);padding:0 0 17px;margin:0 0 17px}
.filter-group:last-of-type{margin-bottom:20px}
.filter-label{font-size:12px;font-weight:850;color:var(--steel);letter-spacing:.08em;margin-bottom:10px}
.filter-check{display:flex;align-items:center;gap:9px;color:var(--text);font-size:14px;margin:8px 0;cursor:pointer}
.filter-check input{width:16px;height:16px;margin:0;accent-color:var(--primary)}
.filter-select{height:42px;padding:0 10px;font-size:14px;border:1px solid #cbd9de;border-radius:8px;background:#fff}
.filter-reset{font-size:13px;font-weight:800;color:var(--primary);background:none;border:0;padding:0}
.catalog-top{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:20px;padding-bottom:17px;border-bottom:1px solid var(--line)}
.catalog-title{font-size:26px;line-height:1.35;color:var(--ink);font-weight:900;margin:5px 0 0}
.catalog-summary{font-size:13px;color:var(--muted);text-align:right;margin:0}
.mobile-filter-trigger{display:none}
.catalog-grid .cell{display:flex}
.entry-card{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 7px 18px rgba(21,55,70,.045);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease);display:flex;flex-direction:column}
.entry-card:hover{border-color:#8eafb9;transform:translateY(-4px);box-shadow:var(--shadow-up)}
.entry-card.featured{border-color:#9bb9c3}
.preview{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:#264e5d}
.preview:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.16),transparent 38%),repeating-linear-gradient(90deg,transparent 0 19px,rgba(255,255,255,.05) 20px),linear-gradient(135deg,#173e4f 0%,#54808d 48%,#d1dfe2 49%,#6d8f98 73%,#183d50 74%);opacity:.95}
.preview:after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,255,255,.36);background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 5px)}
.preview-b .preview:before{background:linear-gradient(135deg,#d7e3e5 0 28%,#537783 29% 52%,#193d4e 53% 100%),repeating-linear-gradient(90deg,transparent 0 23px,rgba(255,255,255,.1) 24px)}
.preview-c .preview:before{background:linear-gradient(45deg,#173e4e 0 30%,#7496a0 31% 48%,#d4e1e4 49% 62%,#234e5e 63% 100%)}
.preview-d .preview:before{background:linear-gradient(135deg,#8caab2 0 20%,#284f5f 21% 50%,#e6eef0 51% 65%,#183b4b 66% 100%)}
.preview-e .preview:before{background:linear-gradient(140deg,#e2ecee 0 23%,#65848e 24% 46%,#1a4051 47% 76%,#b7cbd0 77% 100%)}
.preview-f .preview:before{background:linear-gradient(45deg,#1c4050 0 26%,#d5e1e3 27% 43%,#567983 44% 70%,#1d4a5a 71% 100%)}
.preview-no{position:absolute;left:20px;bottom:16px;z-index:2;color:#fff;font-size:28px;font-weight:900;letter-spacing:-.05em}
.preview-time{position:absolute;right:18px;top:17px;z-index:2;padding:3px 7px;font-size:11px;color:#fff;border:1px solid rgba(255,255,255,.55);background:rgba(10,34,43,.34)}
.preview-action{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-42%);opacity:0;transition:opacity var(--ease),transform var(--ease);white-space:nowrap}
.entry-card:hover .preview-action{opacity:1;transform:translate(-50%,-50%)}
.entry-card:hover .preview:after{background:rgba(17,56,70,.12)}
.entry-content{padding:18px 18px 17px;display:flex;flex:1;flex-direction:column}
.entry-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--steel);margin-bottom:10px}
.entry-title{font-size:18px;line-height:1.45;color:var(--ink);margin:0 0 10px;font-weight:850}
.entry-desc{font-size:13px;color:var(--muted);line-height:1.65;margin:0 0 14px}
.entry-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:12px;margin-top:auto;font-size:12px;color:var(--steel)}
.text-link{font-size:13px;font-weight:850;color:var(--primary);display:inline-flex;align-items:center;gap:6px}
.text-link span{transition:transform var(--ease)}
.text-link:hover span{transform:translateX(4px)}
.index-band{margin:68px 0 0;background:var(--mist);border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.index-band:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(28,82,107,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(28,82,107,.05) 1px,transparent 1px);background-size:24px 24px}
.band-inner{position:relative;padding:29px 0}
.band-code{color:var(--sand);font-weight:900;letter-spacing:.1em;font-size:12px}
.band-title{font-size:21px;line-height:1.4;font-weight:900;color:var(--ink);margin:5px 0 0}
.rule-item{padding-left:18px;border-left:2px solid #a7c2ca;font-size:13px;color:var(--muted);min-height:52px}
.rule-item strong{display:block;color:var(--primary);font-size:13px;margin-bottom:2px}
.pager{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:38px}
.page-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--primary);font-size:13px;font-weight:800;transition:all var(--ease)}
.page-btn:hover,.page-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;transform:translateY(-2px)}
.compact-faq{padding:76px 0;background:#fff}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:26px;margin-bottom:28px}
.section-title{font-size:30px;line-height:1.3;letter-spacing:-.03em;color:var(--ink);font-weight:900;margin:8px 0 0}
.section-lead{font-size:15px;color:var(--muted);max-width:570px;margin:0}
.accordion-item{border:1px solid var(--line);margin-bottom:10px;border-radius:var(--radius-sm);overflow:hidden;background:#fff}
.accordion-title{border:0;color:var(--ink);font-size:15px;font-weight:780;padding:16px 47px 16px 18px;line-height:1.48;transition:background var(--ease)}
.accordion-title:hover,.accordion-title:focus{background:var(--mist);color:var(--primary)}
.accordion-title:before{color:var(--primary);font-size:20px;right:19px;margin-top:-13px}
.accordion-content{border:0;background:#f3f7f8;color:var(--muted);font-size:14px;padding:0 19px 18px;line-height:1.75}
.faq-no{display:inline-block;color:var(--sand);font-size:12px;margin-right:8px;letter-spacing:.08em}
.feedback-strip{padding:42px 0;background:var(--deep);position:relative;overflow:hidden}
.feedback-strip:after{content:"FEEDBACK / 01";position:absolute;right:7%;bottom:-10px;color:rgba(255,255,255,.05);font-size:42px;font-weight:900;letter-spacing:.08em}
.feedback-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:26px}
.feedback-title{font-size:24px;line-height:1.35;color:#fff;font-weight:900;margin:0 0 7px}
.feedback-copy{margin:0;color:#c4d5da;font-size:14px}
.site-footer{background:#e8f0f2;border-top:1px solid #d2e0e4;padding:48px 0 20px;position:relative;overflow:hidden}
.site-footer:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(28,82,107,.13) 1px,transparent 1px);background-size:15px 15px;opacity:.3}
.footer-inner{position:relative}
.footer-brand{font-size:24px;font-weight:900;letter-spacing:-.035em;color:var(--ink);margin-bottom:8px}
.footer-copy{max-width:630px;color:var(--muted);font-size:13px;margin:0}
.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px 22px;padding-top:8px}
.footer-links a{font-size:13px;font-weight:750;color:var(--primary);position:relative}
.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}
.footer-bottom{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #cbdade;margin-top:32px;padding-top:18px;color:var(--steel);font-size:11px;letter-spacing:.04em}
@media(max-width:1024px){
 .brand-mark{font-size:24px}
 .brand-caption{display:none}
 .page-title{font-size:37px}
 .filter-panel{top:132px}
 .section{padding:66px 0}
}
@media(max-width:767px){
 .grid-container{padding-left:18px;padding-right:18px}
 .masthead{padding:15px 0 10px}
 .masthead-row{align-items:center}
 .brand-mark{font-size:20px;white-space:normal}
 .mast-meta .button{display:none}
 .nav-row{min-height:46px}
 .main-nav{display:none}
 .nav-code{display:none}
 .mobile-menu{display:block}
 .page-intro{padding:32px 0 28px}
 .page-title{font-size:31px}
 .intro-copy{font-size:15px}
 .access-note{margin-top:25px}
 .index-shell{padding-top:30px}
 .filter-panel{display:none}
 .mobile-filter-trigger{display:inline-flex;margin-bottom:20px}
 .catalog-top{align-items:flex-start}
 .catalog-summary{text-align:left}
 .entry-card:hover{transform:none}
 .preview-action{opacity:1;transform:translate(-50%,-50%)}
 .index-band{margin-top:45px}
 .rule-item{margin-top:16px}
 .section-head{display:block}
 .section-lead{margin-top:13px}
 .compact-faq{padding:58px 0}
 .feedback-inner{display:block}
 .feedback-strip .button{margin-top:20px}
 .footer-links{justify-content:flex-start;margin-top:18px}
 .footer-bottom{display:block}
 .footer-bottom span{display:block;margin-bottom:6px}
}
@media(max-width:520px){
 .age-badge{font-size:10px}
 .page-title{font-size:28px}
 .catalog-title{font-size:23px}
 .catalog-top{display:block}
 .catalog-summary{margin-top:8px}
 .title-meta{gap:7px}
 .button{min-height:44px}
 .preview-no{font-size:25px}
 .entry-content{padding:16px}
 .feedback-title{font-size:21px}
 .footer-brand{font-size:21px}
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}
