/* roulang page: index */
:root{
      --bg:#171816;--surface:#22231f;--surface-2:#30312c;--paper:#f3f0e7;
      --text:#f7f2e7;--muted:#b9b4a8;--line:rgba(243,240,231,.16);
      --ember:#d97842;--ember-light:#ec925f;--moss:#8b9a78;--brick:#a94d3b;
      --shadow:0 20px 45px rgba(0,0,0,.26);--radius:20px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.85;overflow-x:hidden}
    body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:radial-gradient(rgba(255,255,255,.16) .55px,transparent .7px);background-size:5px 5px;mix-blend-mode:soft-light;z-index:20}
    a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit} button{cursor:pointer} img{max-width:100%;display:block}
    :focus-visible{outline:3px solid #f4bd89;outline-offset:3px}
    .site-shell{position:relative;isolation:isolate}
    .beam{position:absolute;pointer-events:none;width:58vw;height:720px;right:-18vw;top:0;background:linear-gradient(116deg,transparent 22%,rgba(217,120,66,.09) 50%,transparent 75%);transform:skewX(-12deg);filter:blur(8px);z-index:-1}
    .container{width:min(1240px,calc(100% - 64px));margin:auto}
    .skip{position:absolute;left:-999px;top:8px;background:var(--paper);color:var(--bg);padding:8px 12px;border-radius:8px;z-index:100}
    .skip:focus{left:16px}
    .header{position:sticky;top:0;z-index:50;background:rgba(23,24,22,.94);border-bottom:1px solid var(--line);transition:.25s ease}
    .nav-grid{min-height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
    .nav-side{display:flex;align-items:center;gap:22px}.nav-side.right{justify-content:flex-end}
    .nav-link{position:relative;color:#d4cec0;font-size:14px;white-space:nowrap;transition:color .2s}
    .nav-link:hover{color:var(--text)}.nav-link.active{color:var(--text)}
    .nav-link.active:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;background:var(--ember);border-radius:2px}
    .brand{position:relative;text-align:center;font-weight:800;letter-spacing:.04em;line-height:1.2;font-size:17px;color:var(--paper)}
    .brand:before,.brand:after{content:"";position:absolute;top:50%;width:10px;height:10px;border:1px solid var(--ember);transform:translateY(-50%) rotate(45deg)}
    .brand:before{left:-19px}.brand:after{right:-19px}
    .search-btn,.menu-btn{border:1px solid var(--line);background:#292a26;color:var(--text);border-radius:10px;min-height:40px;padding:0 12px;font-size:13px;transition:.2s}
    .search-btn:hover,.menu-btn:hover{border-color:var(--ember);background:#36342e}.menu-btn{display:none}
    .mobile-panel,.search-panel{display:none;border-top:1px solid var(--line);background:#1c1d1a}
    .mobile-panel.open,.search-panel.open{display:block}
    .mobile-panel a{display:block;padding:13px 0;border-bottom:1px solid var(--line);color:#e8e1d4}
    .search-inner{padding:16px 0 20px}.search-box{display:flex;gap:10px}
    .search-box input{width:100%;background:#292a26;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:12px 14px}.search-box input::placeholder{color:#9e998e}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:11px;border:1px solid transparent;font-size:15px;font-weight:700;transition:transform .2s,background .2s,border .2s,box-shadow .2s}
    .btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn-primary{background:var(--ember);color:#fff;box-shadow:0 9px 18px rgba(217,120,66,.2)}.btn-primary:hover{background:var(--ember-light)}.btn-secondary{background:#272824;border-color:var(--line);color:var(--paper)}.btn-secondary:hover{background:#383832;border-color:#d8a47e}.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
    .eyebrow{display:flex;align-items:center;gap:9px;color:#d7a27b;font-size:13px;letter-spacing:.12em}.eyebrow i{display:inline-block;width:26px;height:1px;background:var(--ember)}
    .hero{padding:74px 0 44px;position:relative}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:end}
    h1,h2,h3,p{margin-top:0}.hero h1{font-size:clamp(40px,5.2vw,64px);line-height:1.18;letter-spacing:-.055em;margin:16px 0 20px;font-weight:850}
    .intro{max-width:640px;color:#cac4b7;font-size:17px;line-height:1.9}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:27px}
    .guide-strip{margin-top:42px;padding:13px 16px;border-top:1px dashed rgba(243,240,231,.28);border-bottom:1px dashed rgba(243,240,231,.28);display:flex;gap:18px;align-items:center;overflow:auto;color:#c8c1b4;font-size:13px}.guide-strip span{white-space:nowrap}.guide-strip b{color:var(--ember);font-weight:600}
    .dashboard{position:relative;background:linear-gradient(145deg,#292a25,#1e1f1c);border:1px solid rgba(243,240,231,.2);border-radius:22px;padding:24px;box-shadow:var(--shadow);overflow:hidden}
    .dashboard:after{content:"";position:absolute;right:-80px;bottom:-125px;width:310px;height:310px;border:1px solid rgba(217,120,66,.35);border-radius:50%;box-shadow:0 0 0 27px rgba(217,120,66,.05),0 0 0 55px rgba(217,120,66,.035)}
    .dash-top{display:flex;justify-content:space-between;gap:12px;align-items:center;position:relative;z-index:1}.dash-title{font-size:14px;color:#e6dfd2}.status{color:#bdd09d;border:1px solid rgba(139,154,120,.5);border-radius:99px;padding:3px 9px;font-size:12px}
    .dash-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:19px;position:relative;z-index:1}.metric{min-height:116px;border:1px solid var(--line);border-radius:14px;padding:15px;background:rgba(20,21,19,.38)}.metric small{display:block;color:#a9a397;font-size:12px}.metric strong{display:block;font-size:28px;color:#f1b184;line-height:1.2;margin:8px 0}.metric em{font-style:normal;font-size:12px;color:#c3bdae}
    .bar{height:5px;border-radius:99px;background:#4a4a42;overflow:hidden;margin-top:10px}.bar span{display:block;height:100%;border-radius:inherit;background:var(--ember)}.bar.moss span{background:var(--moss)}
    .dash-foot{position:relative;z-index:1;margin-top:13px;padding-top:13px;border-top:1px dashed var(--line);color:#ada79c;font-size:12px}
    section{position:relative}.section{padding:92px 0}.section-head{display:grid;grid-template-columns:110px minmax(0,1fr);gap:22px;align-items:start;margin-bottom:34px}.section-no{font-size:14px;color:var(--ember);padding-top:8px;letter-spacing:.12em}.section-head h2{font-size:clamp(29px,3.4vw,40px);line-height:1.25;letter-spacing:-.045em;margin-bottom:12px}.section-head p{max-width:680px;margin:0;color:var(--muted);font-size:16px}
    .notice{padding:0 0 10px}.notice-inner{border-left:3px solid var(--moss);padding:17px 22px;background:#20221d;display:flex;gap:20px;justify-content:space-between;align-items:center}.notice-inner p{margin:0;color:#c5c7b9;font-size:14px}.notice-inner b{color:#e2e7d5}
    .matrix{display:grid;grid-template-columns:1.18fr .82fr .82fr;grid-template-rows:195px 195px;gap:16px}.matrix-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--line);border-radius:18px;padding:22px;background:#2a2b26;min-height:0;transition:.22s}.matrix-card:hover{transform:translateY(-5px);border-color:rgba(217,120,66,.8);box-shadow:var(--shadow)}.matrix-card:hover .arrow{transform:translateX(5px)}.matrix-card:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,transparent 5%,rgba(0,0,0,.42) 76%);z-index:0}.matrix-card>*{position:relative;z-index:1}.matrix-card.large{grid-row:span 2;background:linear-gradient(160deg,#8d6247,#34362e 48%,#20211e)}.matrix-card.large:after{content:"";position:absolute;width:74%;aspect-ratio:3/4;right:-12%;top:-8%;border:1px solid rgba(243,240,231,.3);border-radius:120px 120px 20px 20px;transform:rotate(11deg);opacity:.6}.matrix-card.accent{background:linear-gradient(135deg,#3c3a2d,#22231f)}.matrix-card.moss-card{background:linear-gradient(135deg,#334033,#20221f)}.badge{align-self:flex-start;display:inline-flex;width:max-content;border:1px solid rgba(243,240,231,.34);border-radius:99px;padding:3px 8px;font-size:11px;color:#eee7da;background:rgba(23,24,22,.25);margin-bottom:10px}.matrix-card h3{font-size:22px;line-height:1.3;margin:0 0 7px}.matrix-card p{font-size:13px;line-height:1.7;color:#d3ccbf;margin:0}.arrow{display:inline-block;color:#f1ad7c;margin-top:10px;font-size:18px;transition:.2s}
    .compare-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px;position:relative}.compare-card{border-radius:20px;border:1px solid var(--line);padding:30px;min-height:350px}.compare-card.muted-card{background:#292a27;color:#a8a59c}.compare-card.clear-card{background:#2b2a24;border-color:rgba(217,120,66,.45);box-shadow:inset 0 1px rgba(255,255,255,.04),var(--shadow)}.compare-label{font-size:12px;letter-spacing:.11em;color:#a6a196}.clear-card .compare-label{color:#eaa674}.compare-card h3{font-size:27px;line-height:1.3;margin:14px 0}.compare-list{list-style:none;padding:0;margin:24px 0 0}.compare-list li{padding:12px 0;border-top:1px solid rgba(243,240,231,.12);font-size:14px}.compare-list li:before{content:"—";margin-right:9px;color:var(--ember)}.pathline{height:1px;background:linear-gradient(90deg,transparent,var(--ember),transparent);margin:25px 10%;position:relative}.pathline:after{content:"›";position:absolute;right:18%;top:50%;transform:translateY(-55%);color:var(--ember);font-size:25px}
    .insight-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.quote-panel{background:var(--paper);color:#272822;border-radius:20px;padding:34px}.quote-panel blockquote{font-size:25px;line-height:1.55;margin:0}.quote-panel cite{display:block;margin-top:20px;color:#756f62;font-style:normal;font-size:14px}.calendar{border:1px solid var(--line);border-radius:20px;padding:25px;background:#20211e}.calendar h3{font-size:21px;margin-bottom:13px}.calendar p{color:var(--muted);font-size:14px;margin-bottom:18px}.calendar-item{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}.calendar-item time{color:#efad7c;font-size:13px}.calendar-item span{font-size:14px}.calendar-item b{font-size:11px;color:#bdc8a7;font-weight:500}
    .faq-section{background:var(--paper);color:#292a25;padding:92px 0}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:68px}.faq-grid h2{font-size:clamp(30px,3.4vw,40px);line-height:1.25;letter-spacing:-.05em}.faq-grid p{color:#665f54;font-size:16px}.faq-item{border-top:1px solid #d2ccbe}.faq-item:last-child{border-bottom:1px solid #d2ccbe}.faq-question{width:100%;padding:20px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;text-align:left;color:#292a25;background:none;border:0;font-weight:750;font-size:16px}.faq-icon{flex:0 0 auto;width:28px;height:28px;border:1px solid #bdb4a5;border-radius:50%;display:grid;place-items:center;color:var(--ember);font-size:21px;line-height:1;transition:.2s}.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}.faq-answer>div{overflow:hidden}.faq-answer p{margin:0;padding:0 42px 0 0;font-size:14px;line-height:1.9}.faq-item.open .faq-answer{grid-template-rows:1fr}.faq-item.open .faq-answer p{padding-bottom:20px}.faq-item.open .faq-icon{background:var(--ember);color:#fff;border-color:var(--ember);transform:rotate(45deg)}.faq-item.open .faq-question{color:#b7582d}
    .cta-section{padding:95px 0 106px;background:#1d1e1b}.cta-box{position:relative;overflow:hidden;border:1px solid rgba(217,120,66,.38);border-radius:22px;padding:42px;display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;background:#262722;box-shadow:inset 0 1px rgba(255,255,255,.04)}.cta-box:before{content:"06";position:absolute;left:22px;top:-54px;color:rgba(217,120,66,.09);font-size:180px;font-weight:800;line-height:1}.cta-copy{position:relative}.cta-copy h2{font-size:clamp(31px,3.8vw,44px);line-height:1.25;letter-spacing:-.05em;margin:12px 0}.cta-copy p{color:var(--muted);font-size:15px}.form-card{position:relative;background:#1e1f1c;border:1px solid var(--line);border-radius:16px;padding:23px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.field{margin-bottom:13px}.field label{display:block;font-size:13px;color:#d8d1c5;margin-bottom:6px}.field input,.field select,.field textarea{width:100%;background:#2d2e29;border:1px solid #4b4b43;border-radius:9px;padding:11px 12px;color:var(--text);outline:none;transition:.2s}.field textarea{min-height:83px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ember);box-shadow:0 0 0 3px rgba(217,120,66,.16)}.check{display:flex;gap:8px;align-items:flex-start;color:#aba69a;font-size:12px;line-height:1.65;margin:2px 0 15px}.check input{accent-color:var(--ember);margin-top:4px}.form-note{margin:11px 0 0;color:#a9a397;font-size:12px;min-height:20px}
    footer{background:#141512;border-top:1px solid var(--line)}.footer-guide{border-bottom:1px solid var(--line);padding:16px 0;color:#bdb7aa;font-size:13px;display:flex;justify-content:space-between;gap:15px}.footer-main{padding:46px 0 25px;display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:35px}.footer-brand{font-size:21px;font-weight:800;margin-bottom:12px}.footer-text{color:#999489;font-size:13px;max-width:390px}.footer-col h3{font-size:13px;color:#e9e1d4;margin:0 0 12px}.footer-col a{display:block;color:#aaa499;font-size:13px;margin:7px 0}.footer-col a:hover{color:#efaf7f}.footer-bottom{border-top:1px solid var(--line);padding:18px 0;color:#807b71;font-size:12px;display:flex;justify-content:space-between;gap:15px}.top-btn{border:1px solid rgba(217,120,66,.65);color:#efad7b;background:transparent;border-radius:9px;padding:7px 10px;transition:.2s}.top-btn:hover{background:var(--ember);color:#fff}
    @media(max-width:900px){.container{width:min(100% - 40px,1240px)}.nav-side{display:none}.nav-grid{grid-template-columns:1fr auto 1fr}.menu-btn{display:inline-flex;justify-self:start}.search-btn{justify-self:end;font-size:0;width:40px;padding:0}.search-btn:after{content:"⌕";font-size:19px}.hero-grid,.faq-grid,.cta-box{grid-template-columns:1fr;gap:30px}.matrix{grid-template-columns:1fr 1fr;grid-template-rows:220px 190px 190px}.matrix-card.large{grid-row:span 2}.compare-wrap,.insight-grid{grid-template-columns:1fr}.faq-grid{gap:25px}.footer-main{grid-template-columns:1fr 1fr}}
    @media(max-width:620px){.container{width:calc(100% - 32px)}.header .container{width:calc(100% - 24px)}.nav-grid{min-height:67px}.brand{font-size:14px}.brand:before,.brand:after{width:7px;height:7px}.hero{padding:50px 0 30px}.hero h1{font-size:39px}.intro{font-size:16px}.dashboard{padding:17px}.metric strong{font-size:23px}.section,.faq-section{padding:63px 0}.section-head{grid-template-columns:1fr;gap:5px;margin-bottom:24px}.section-no{padding:0}.section-head h2{font-size:29px}.notice-inner{padding:15px;display:block}.notice-inner .btn{margin-top:12px}.matrix{grid-template-columns:1fr;grid-template-rows:auto}.matrix-card,.matrix-card.large{grid-row:auto;min-height:180px}.matrix-card.large{min-height:290px}.compare-card{padding:22px;min-height:0}.quote-panel{padding:25px}.quote-panel blockquote{font-size:21px}.calendar-item{grid-template-columns:57px 1fr}.calendar-item b{display:none}.cta-box{padding:25px}.field-grid{grid-template-columns:1fr}.footer-guide,.footer-bottom{display:block}.footer-guide span{display:block;margin:3px 0}.footer-main{grid-template-columns:1fr;gap:23px;padding-top:34px}.footer-bottom .top-btn{margin-top:10px}.guide-strip{margin-top:28px}.hero-actions .btn{width:100%}}

/* roulang page: category1 */
:root{
 --bg:#171816;--surface:#22231f;--surface-2:#30312c;--paper:#f3f0e7;
 --text:#f7f2e7;--muted:#b9b4a8;--line:rgba(243,240,231,.16);
 --ember:#d97842;--ember-light:#ec925f;--moss:#8b9a78;--brick:#a94d3b;
 --shadow:0 20px 45px rgba(0,0,0,.26);--radius:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.85;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:radial-gradient(rgba(255,255,255,.16) .55px,transparent .7px);background-size:5px 5px;mix-blend-mode:soft-light;z-index:20}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.container{width:min(1240px,calc(100% - 64px));margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(23,24,22,.94);border-bottom:1px solid var(--line);transition:.25s ease}
.header.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.18);background:#191a17}
.nav-grid{min-height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.nav-side{display:flex;align-items:center;gap:22px}
.nav-side.right{justify-content:flex-end}
.nav-link{position:relative;color:#d4cec0;font-size:14px;white-space:nowrap;transition:color .2s}
.nav-link:hover{color:var(--text)}
.nav-link.active{color:var(--text)}
.nav-link.active:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;background:var(--ember);border-radius:2px}
.brand{position:relative;text-align:center;font-weight:800;letter-spacing:.04em;line-height:1.2;font-size:17px;color:var(--paper)}
.brand:before,.brand:after{content:"";position:absolute;top:50%;width:10px;height:10px;border:1px solid var(--ember);transform:translateY(-50%) rotate(45deg)}
.brand:before{left:-19px}.brand:after{right:-19px}
.search-btn,.menu-btn{border:1px solid var(--line);background:#292a26;color:var(--text);border-radius:10px;min-height:40px;padding:0 12px;font-size:13px;transition:.2s}
.search-btn:hover,.menu-btn:hover{border-color:var(--ember);background:#36342e}
.menu-btn{display:none}
.mobile-panel,.search-panel{display:none;border-top:1px solid var(--line);background:#1c1d1a}
.mobile-panel.open,.search-panel.open{display:block}
.mobile-panel a{display:block;padding:13px 0;border-bottom:1px solid var(--line);color:#e8e1d4}
.search-inner{padding:16px 0 20px}.search-box{display:flex;gap:10px}
.search-box input{width:100%;background:#292a26;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.search-box input::placeholder{color:#9e998e}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:11px;border:1px solid transparent;font-size:15px;font-weight:700;transition:transform .2s,background .2s,border .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}
.btn-primary{background:var(--ember);color:#fff;box-shadow:0 9px 18px rgba(217,120,66,.2)}
.btn-primary:hover{background:var(--ember-light)}
.btn-secondary{background:#272824;border-color:var(--line);color:var(--paper)}
.btn-secondary:hover{background:#383832;border-color:#d8a47e}
.btn:focus-visible,.nav-link:focus-visible,.search-btn:focus-visible,.menu-btn:focus-visible,.filter-btn:focus-visible,.faq-btn:focus-visible,.top-btn:focus-visible{outline:3px solid #f0bd95;outline-offset:3px}
.eyebrow{display:flex;align-items:center;gap:9px;color:#d7a27b;font-size:13px;letter-spacing:.12em}
.eyebrow i{display:inline-block;width:26px;height:1px;background:var(--ember)}
.section{padding:94px 0}
.section-no{font-size:13px;letter-spacing:.16em;color:var(--ember)}
.section-title{font-size:clamp(30px,3.5vw,42px);letter-spacing:-.05em;line-height:1.25;margin:10px 0 12px;font-weight:850}
.section-copy{max-width:680px;color:var(--muted);margin:0;font-size:16px}
.archive-hero{position:relative;padding:52px 0 44px;overflow:hidden}
.archive-hero:after{content:"";position:absolute;right:-8%;top:-28%;width:490px;height:680px;border:1px solid rgba(243,240,231,.14);border-radius:48% 48% 16px 16px;transform:rotate(14deg);pointer-events:none}
.breadcrumb{display:flex;flex-wrap:wrap;gap:8px;color:#aaa599;font-size:13px;margin-bottom:38px}
.breadcrumb span{color:var(--ember)}
.archive-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:64px;align-items:center}
.archive-title{font-size:clamp(42px,5vw,62px);line-height:1.18;letter-spacing:-.06em;margin:15px 0 18px;font-weight:850}
.archive-lead{max-width:690px;color:#d0cabc;font-size:17px;margin:0}
.tag-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.tag{display:inline-flex;align-items:center;min-height:29px;padding:3px 10px;border:1px solid rgba(243,240,231,.24);border-radius:99px;color:#ddd6c9;font-size:12px;background:rgba(255,255,255,.025)}
.tag.moss{border-color:rgba(139,154,120,.72);color:#c2cfb3}.tag.hot{border-color:rgba(169,77,59,.8);color:#e2a090}
.cover-index{position:relative;min-height:456px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(145deg,#6b4d3b 0%,#32342c 48%,#1d1e1b 100%);box-shadow:var(--shadow)}
.cover-index:before{content:"";position:absolute;inset:22px;border:1px dashed rgba(243,240,231,.35);border-radius:13px}
.cover-index:after{content:"";position:absolute;left:45px;bottom:52px;width:226px;height:312px;border-radius:120px 120px 16px 16px;border:1px solid rgba(243,240,231,.45);background:linear-gradient(165deg,rgba(243,240,231,.14),rgba(0,0,0,.05));transform:rotate(-9deg)}
.cover-stamp{position:absolute;z-index:2;right:25px;top:29px;border:1px solid rgba(243,240,231,.45);padding:8px 12px;color:#f8eadf;font-size:12px;letter-spacing:.12em}
.cover-caption{position:absolute;z-index:3;left:28px;bottom:25px;color:#f7f2e7}.cover-caption strong{display:block;font-size:31px;line-height:1.15;letter-spacing:-.05em}.cover-caption small{color:#ded5c7}
.filter-wrap{padding:23px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#1d1e1b}
.filter-grid{display:grid;grid-template-columns:repeat(5,1fr) auto;gap:10px;align-items:end}
.filter-label{display:block;color:#a9a397;font-size:12px;margin:0 0 6px}
.filter-btn{display:flex;width:100%;align-items:center;justify-content:space-between;min-height:44px;padding:0 12px;color:#e8e1d5;background:#292a26;border:1px solid var(--line);border-radius:10px;font-size:13px;text-align:left;transition:.2s}
.filter-btn:hover,.filter-btn.selected{border-color:var(--ember);background:#33312b}.filter-btn.selected{color:#f2b285}
.clear-filter{font-size:13px;color:#cfc7b9;padding:11px 4px;white-space:nowrap}.clear-filter:hover{color:var(--ember)}
.editorial-grid{display:grid;grid-template-columns:1.13fr .87fr;gap:22px;margin-top:36px}
.feature-card{position:relative;min-height:520px;display:flex;flex-direction:column;justify-content:flex-end;padding:34px;overflow:hidden;border:1px solid var(--line);border-radius:20px;background:linear-gradient(155deg,#4e5543 0%,#262823 49%,#1b1c1a 100%);box-shadow:var(--shadow)}
.feature-card:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,14,12,.94) 7%,rgba(13,14,12,.1) 72%)}
.feature-card:after{content:"";position:absolute;right:-28px;top:55px;width:42%;height:73%;border:1px solid rgba(243,240,231,.28);border-radius:180px 180px 12px 12px;transform:rotate(16deg)}
.feature-card>*{position:relative;z-index:1}
.feature-card h2{font-size:clamp(29px,3vw,38px);line-height:1.28;letter-spacing:-.045em;margin:6px 0 12px}
.feature-card p{max-width:560px;color:#ddd6c8;margin:0}
.meta-line{display:flex;flex-wrap:wrap;gap:12px;color:#c1bbaf;font-size:13px;margin:20px 0}.meta-line b{color:#f0ad7b;font-weight:600}
.list-panel{border:1px solid var(--line);border-radius:20px;padding:12px 24px;background:#20211e}
.list-head{padding:14px 0 12px;border-bottom:1px solid var(--line);font-size:15px;color:#dcd4c7}
.browse-item{display:grid;grid-template-columns:44px 74px 1fr auto;gap:13px;align-items:center;padding:17px 0;border-bottom:1px solid var(--line);transition:.2s}
.browse-item:last-child{border-bottom:0}.browse-item:hover{padding-left:5px}.browse-item:hover .item-arrow{color:var(--ember);transform:translateX(4px)}
.item-no{font-size:15px;color:#d58b5c}.thumb{height:62px;border-radius:9px;border:1px solid rgba(243,240,231,.12);background:linear-gradient(145deg,#795342,#34392f)}
.thumb.t2{background:linear-gradient(145deg,#314039,#252522)}.thumb.t3{background:linear-gradient(145deg,#5b4b45,#252522)}.thumb.t4{background:linear-gradient(145deg,#4a5140,#1f211e)}
.item-title{font-size:16px;line-height:1.4;margin:0 0 3px;font-weight:700}.item-meta{font-size:12px;color:#aaa599;margin:0}.item-arrow{color:#d5cdbf;font-size:19px;transition:.2s}
.tip-strip{background:var(--paper);color:#292a26;padding:26px 0;position:relative;overflow:hidden}
.tip-strip:before,.tip-strip:after{content:"";position:absolute;left:0;right:0;height:8px;background:radial-gradient(circle at 8px -1px,transparent 8px,#171816 8.5px) repeat-x;background-size:16px 16px}
.tip-strip:before{top:0}.tip-strip:after{bottom:0;transform:rotate(180deg)}
.tip-grid{display:grid;grid-template-columns:150px repeat(3,1fr);gap:20px;align-items:center}.tip-grid strong{font-size:18px}.tip-item{font-size:14px;color:#55544e;border-left:1px solid #c8c3b8;padding-left:17px}
.related-track{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:16px;margin-top:30px}
.related-card{min-height:185px;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;border:1px solid var(--line);border-radius:17px;background:#292a26;transition:.22s}
.related-card:nth-child(2){background:#343126}.related-card:nth-child(3){background:#28342b}.related-card:hover{border-color:var(--ember);transform:translateY(-4px);box-shadow:var(--shadow)}
.related-card h3{font-size:20px;line-height:1.35;margin:8px 0}.related-card p{font-size:13px;color:#c2bbae;margin:0}
.mini-faq{padding-top:30px}.faq-row{border-bottom:1px solid var(--line)}
.faq-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 0;border:0;background:transparent;color:var(--text);font-size:16px;font-weight:700;text-align:left}
.faq-icon{font-size:24px;color:var(--ember);font-weight:400;line-height:1;transition:.2s}.faq-btn[aria-expanded="true"] .faq-icon{transform:rotate(45deg)}
.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease}.faq-answer>div{overflow:hidden}.faq-answer p{color:var(--muted);font-size:14px;margin:0;padding:0 34px 0 0}.faq-row.open .faq-answer{grid-template-rows:1fr}.faq-row.open .faq-answer p{padding-bottom:18px}
footer{border-top:1px solid var(--line);background:#151613;padding:0 0 24px}.footer-guide{display:flex;justify-content:space-between;gap:20px;padding:17px 0;color:#b7b0a3;font-size:13px;border-bottom:1px solid var(--line)}.footer-main{display:grid;grid-template-columns:1.5fr .7fr .9fr;gap:40px;padding:42px 0}.footer-brand{font-size:21px;font-weight:850;letter-spacing:.03em}.footer-text{max-width:520px;margin:12px 0 0;color:#a9a397;font-size:14px}.footer-col h3{font-size:14px;color:#eae2d5;margin:0 0 12px}.footer-col a{display:block;width:max-content;color:#aaa599;font-size:14px;margin:7px 0}.footer-col a:hover{color:var(--ember)}.footer-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8f8b81;font-size:12px}.top-btn{min-height:38px;padding:0 11px;border-radius:9px;border:1px solid rgba(217,120,66,.65);background:transparent;color:#e7ad84;font-size:13px}.top-btn:hover{background:#33261f}
@media(max-width:1024px){.archive-grid{grid-template-columns:1fr 320px;gap:34px}.filter-grid{grid-template-columns:repeat(3,1fr)}.editorial-grid{grid-template-columns:1fr}.feature-card{min-height:430px}.related-track{grid-template-columns:1fr 1fr}.related-card:first-child{grid-column:span 2}}
@media(max-width:768px){.container{width:min(100% - 32px,1240px)}.nav-grid{min-height:68px;grid-template-columns:1fr auto 1fr}.nav-side{display:none}.nav-side.right{display:flex}.nav-side.right .nav-link{display:none}.search-btn{display:none}.menu-btn{display:inline-flex;align-items:center}.brand{font-size:15px}.archive-hero{padding-top:34px}.archive-grid{grid-template-columns:1fr}.cover-index{min-height:300px;max-width:500px}.archive-title{font-size:41px}.filter-grid{grid-template-columns:1fr 1fr}.clear-filter{padding:8px 0}.section{padding:65px 0}.tip-grid{grid-template-columns:1fr;gap:12px}.tip-item{border-left:0;border-top:1px solid #c8c3b8;padding:12px 0 0}.footer-main{grid-template-columns:1fr 1fr}.footer-main>div:first-child{grid-column:span 2}}
@media(max-width:520px){.archive-title{font-size:36px}.archive-lead{font-size:16px}.filter-grid{grid-template-columns:1fr}.feature-card{min-height:430px;padding:24px}.browse-item{grid-template-columns:34px 58px 1fr auto;gap:9px}.thumb{height:54px}.item-title{font-size:14px}.related-track{grid-template-columns:1fr}.related-card:first-child{grid-column:auto}.footer-guide,.footer-bottom{display:block}.footer-guide span{display:block;margin:4px 0}.footer-main{grid-template-columns:1fr;gap:25px}.footer-main>div:first-child{grid-column:auto}.top-btn{margin-top:13px}}

/* roulang page: category2 */
:root{
 --bg:#171816;--surface:#22231f;--surface-2:#30312c;--paper:#f3f0e7;
 --text:#f7f2e7;--muted:#b9b4a8;--line:rgba(243,240,231,.16);
 --ember:#d97842;--ember-light:#ec925f;--moss:#8b9a78;--brick:#a94d3b;
 --shadow:0 20px 45px rgba(0,0,0,.26);--radius:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.85;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:radial-gradient(rgba(255,255,255,.16) .55px,transparent .7px);background-size:5px 5px;mix-blend-mode:soft-light;z-index:20}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.container{width:min(1240px,calc(100% - 64px));margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(23,24,22,.95);border-bottom:1px solid var(--line);transition:.25s ease}
.header.scrolled{box-shadow:0 8px 22px rgba(0,0,0,.18)}
.nav-grid{min-height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.nav-side{display:flex;align-items:center;gap:22px}
.nav-side.right{justify-content:flex-end}
.nav-link{position:relative;color:#d4cec0;font-size:14px;white-space:nowrap;transition:color .2s}
.nav-link:hover{color:var(--text)}
.nav-link.active{color:var(--text)}
.nav-link.active:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;background:var(--ember);border-radius:2px}
.brand{position:relative;text-align:center;font-weight:800;letter-spacing:.04em;line-height:1.2;font-size:17px;color:var(--paper);white-space:nowrap}
.brand:before,.brand:after{content:"";position:absolute;top:50%;width:10px;height:10px;border:1px solid var(--ember);transform:translateY(-50%) rotate(45deg)}
.brand:before{left:-19px}.brand:after{right:-19px}
.search-btn,.menu-btn{border:1px solid var(--line);background:#292a26;color:var(--text);border-radius:10px;min-height:40px;padding:0 12px;font-size:13px;transition:.2s}
.search-btn:hover,.menu-btn:hover{border-color:var(--ember);background:#36342e}
.menu-btn{display:none}
.mobile-panel,.search-panel{display:none;border-top:1px solid var(--line);background:#1c1d1a}
.mobile-panel.open,.search-panel.open{display:block}
.mobile-panel a{display:block;padding:13px 0;border-bottom:1px solid var(--line);color:#e8e1d4}
.search-inner{padding:16px 0 20px}.search-box{display:flex;gap:10px}
.search-box input{width:100%;background:#292a26;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.search-box input::placeholder{color:#9e998e}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:11px;border:1px solid transparent;font-size:15px;font-weight:700;transition:transform .2s,background .2s,border .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}
.btn:focus-visible,.nav-link:focus-visible,.filter-chip:focus-visible,.index-link:focus-visible,.faq-toggle:focus-visible,.top-btn:focus-visible{outline:3px solid #f4bd91;outline-offset:3px}
.btn-primary{background:var(--ember);color:#fff;box-shadow:0 9px 18px rgba(217,120,66,.2)}
.btn-primary:hover{background:var(--ember-light)}
.btn-secondary{background:#272824;border-color:var(--line);color:var(--paper)}
.btn-secondary:hover{background:#383832;border-color:#d8a47e}
.eyebrow{display:flex;align-items:center;gap:9px;color:#d7a27b;font-size:13px;letter-spacing:.12em}
.eyebrow i{display:inline-block;width:26px;height:1px;background:var(--ember)}
.section{padding:96px 0;position:relative}
.section-head{display:grid;grid-template-columns:110px minmax(0,1fr);gap:22px;align-items:start;margin-bottom:34px}
.section-no{font-size:14px;color:var(--ember);padding-top:8px;letter-spacing:.12em}
.section-head h2{font-size:clamp(29px,3.4vw,40px);line-height:1.25;letter-spacing:-.045em;margin:0 0 12px}
.section-head p{max-width:680px;margin:0;color:var(--muted);font-size:16px}
.guide-hero{position:relative;padding:58px 0 64px;overflow:hidden;border-bottom:1px solid var(--line)}
.guide-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 10%,rgba(217,120,66,.10) 52%,transparent 82%);transform:skewY(-4deg)}
.guide-hero:after{content:"";position:absolute;right:-8%;top:16%;width:58%;height:68%;border-top:1px solid rgba(243,240,231,.2);border-bottom:1px solid rgba(243,240,231,.13);background:repeating-linear-gradient(90deg,rgba(243,240,231,.08) 0 2px,transparent 2px 24px);opacity:.65;transform:rotate(-5deg);pointer-events:none}
.breadcrumb{position:relative;z-index:1;display:flex;gap:9px;align-items:center;font-size:13px;color:#aaa598;margin-bottom:34px}.breadcrumb span{color:var(--ember)}
.guide-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(350px,.85fr);gap:56px;align-items:end}
.guide-hero h1{font-size:clamp(40px,5vw,62px);line-height:1.16;letter-spacing:-.055em;margin:16px 0 18px;max-width:760px}
.guide-intro{font-size:17px;color:#d0cabc;max-width:700px;margin:0}
.hero-tag-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:27px}
.hero-tag{padding:6px 11px;border-radius:99px;border:1px solid rgba(243,240,231,.22);font-size:13px;color:#ddd5c7;background:rgba(34,35,31,.55)}
.hero-tag.active{border-color:rgba(217,120,66,.8);color:#ffd5bd;background:rgba(217,120,66,.12)}
.guide-index{border:1px solid rgba(243,240,231,.2);background:#20211e;box-shadow:var(--shadow);padding:20px;border-radius:20px;position:relative;overflow:hidden}
.guide-index:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ember)}
.index-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px dashed rgba(243,240,231,.25);font-size:13px;color:#d2cabb}
.index-top b{color:#f1a778;font-weight:700}
.index-link{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:11px;padding:15px 0;border-bottom:1px solid rgba(243,240,231,.11);transition:.2s}
.index-link:last-child{border-bottom:0}.index-link:hover{padding-left:5px;color:#ffc59e}
.index-num{color:var(--ember);font-size:13px;letter-spacing:.08em}.index-link strong{font-size:15px}.index-link em{font-style:normal;color:#9e998e}
.quick-bar{position:sticky;top:98px;display:flex;gap:8px;flex-wrap:wrap;padding:16px;border:1px solid var(--line);border-radius:16px;background:#20211e}
.quick-bar a{font-size:13px;color:#cfc8ba;border:1px solid rgba(243,240,231,.16);padding:7px 10px;border-radius:99px;transition:.2s}
.quick-bar a:hover{border-color:var(--moss);color:#eaf0df;background:rgba(139,154,120,.12)}
.guide-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:30px;align-items:start}
.masonry-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:start}
.editor-column{display:grid;gap:18px}
.topic-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--surface);transition:.22s}
.topic-card:hover{transform:translateY(-5px);border-color:rgba(217,120,66,.75);box-shadow:var(--shadow)}
.topic-visual{min-height:184px;position:relative;overflow:hidden;background:#363329}
.topic-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(217,120,66,.7),transparent 52%),linear-gradient(30deg,#35382e 0%,#1e201c 68%)}
.topic-visual.moss:before{background:linear-gradient(130deg,rgba(139,154,120,.75),transparent 54%),linear-gradient(30deg,#37372c,#1c201c)}
.topic-visual.paper:before{background:linear-gradient(140deg,rgba(243,240,231,.38),transparent 45%),linear-gradient(30deg,#554336,#22231f)}
.film-mark{position:absolute;right:22px;bottom:-26px;width:130px;height:190px;border:1px solid rgba(243,240,231,.4);border-radius:68px 68px 12px 12px;transform:rotate(15deg)}
.film-mark:after{content:"";position:absolute;inset:15px;border-top:2px solid rgba(243,240,231,.34);border-bottom:2px solid rgba(243,240,231,.34)}
.topic-content{padding:22px}.topic-content h3{font-size:23px;line-height:1.35;margin:10px 0}.topic-content p{color:var(--muted);font-size:14px;margin:0;line-height:1.8}
.card-label{display:inline-flex;padding:3px 8px;border:1px solid rgba(243,240,231,.28);border-radius:99px;font-size:11px;color:#ece5d8}
.topic-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:17px;margin-top:17px;border-top:1px solid var(--line);font-size:13px;color:#bcb5a8}.topic-bottom a{color:#efa574;font-weight:700}.topic-bottom a:hover{color:#ffd5bc}
.slim-card{display:grid;grid-template-columns:58px 1fr;gap:14px;padding:17px;border:1px solid var(--line);border-radius:17px;background:#262722;transition:.22s}
.slim-card:hover{border-color:rgba(217,120,66,.65);transform:translateX(4px)}
.slim-num{width:48px;height:48px;border-radius:12px;background:#34342e;color:var(--ember);display:grid;place-items:center;font-size:13px;font-weight:800}
.slim-card h3{font-size:17px;line-height:1.35;margin:0 0 4px}.slim-card p{font-size:13px;line-height:1.65;color:var(--muted);margin:0}.slim-card a{display:inline-block;color:#e9a170;font-size:13px;margin-top:7px}
.notice-band{margin-top:58px;padding:26px 30px;background:var(--paper);color:#292a25;position:relative;clip-path:polygon(0 0,98.7% 0,100% 13%,100% 87%,98.7% 100%,0 100%,1.3% 87%,1.3% 13%)}
.notice-band:before{content:"";position:absolute;inset:10px;border-top:1px dashed rgba(41,42,37,.32);border-bottom:1px dashed rgba(41,42,37,.32);pointer-events:none}
.notice-content{position:relative;display:grid;grid-template-columns:170px 1fr;gap:30px;align-items:center}.notice-content h2{font-size:21px;line-height:1.35;margin:0}.notice-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 28px;padding:0;margin:0;list-style:none;font-size:14px}.notice-list li:before{content:"✓";color:var(--ember);font-weight:800;margin-right:8px}
.reverse-section{background:var(--paper);color:#292a25}.reverse-section .section-head h2{color:#252620}.reverse-section .section-head p{color:#66645c}
.reverse-grid{display:grid;grid-template-columns:1fr .86fr;gap:60px;align-items:center}.reverse-copy p{font-size:16px;color:#525149;margin:0 0 18px}.steps{border-left:1px solid #beb8aa;padding-left:23px}.step{position:relative;padding:0 0 22px}.step:before{content:"";position:absolute;width:11px;height:11px;border:2px solid var(--ember);background:var(--paper);border-radius:50%;left:-30px;top:7px}.step:last-child{padding-bottom:0}.step strong{font-size:16px}.step p{font-size:14px!important;margin:5px 0 0!important}
.data-strip{background:#252620;color:var(--text);padding:28px;border-radius:20px;box-shadow:0 16px 35px rgba(42,40,32,.14)}.data-strip h3{font-size:20px;margin:0 0 18px}.bar-row{display:grid;grid-template-columns:75px 1fr 38px;gap:11px;align-items:center;margin:13px 0;font-size:13px}.bar{height:8px;background:#45453f;border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;border-radius:99px;background:var(--ember)}.bar.moss i{background:var(--moss)}
.related-wrap{border-top:1px solid var(--line)}.related-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:15px}.related-card{min-height:180px;border:1px solid var(--line);border-radius:18px;padding:22px;background:#242520;display:flex;flex-direction:column;justify-content:space-between;transition:.22s}.related-card:hover{transform:translateY(-4px);border-color:rgba(217,120,66,.75);box-shadow:var(--shadow)}.related-card small{color:var(--ember)}.related-card h3{font-size:20px;line-height:1.35;margin:8px 0}.related-card p{font-size:13px;color:var(--muted);margin:0}.related-card a{color:#efa574;font-size:14px;font-weight:700;margin-top:12px}
.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}.faq-grid h2{font-size:clamp(30px,3.5vw,42px);line-height:1.25;margin:12px 0}.faq-copy p{color:#67645b;font-size:15px}.faq-list{border-top:1px solid rgba(41,42,37,.25)}.faq-item{border-bottom:1px solid rgba(41,42,37,.25)}.faq-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;border:0;padding:20px 0;color:#292a25;text-align:left;font-weight:800;font-size:16px}.faq-icon{font-size:26px;font-weight:400;color:var(--ember);line-height:1;transition:.2s}.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}.faq-answer>div{overflow:hidden}.faq-answer p{margin:0;padding:0 40px 0 0;color:#656158;font-size:14px;line-height:1.8}.faq-item.open .faq-answer{grid-template-rows:1fr}.faq-item.open .faq-answer p{padding-bottom:20px}.faq-item.open .faq-icon{transform:rotate(45deg)}
footer{border-top:1px solid var(--line);background:#141512;padding:0 0 25px}.footer-guide{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line);font-size:13px;color:#b9b4a8}.footer-main{display:grid;grid-template-columns:1.4fr .6fr .8fr;gap:50px;padding:50px 0}.footer-brand{font-size:22px;font-weight:850;letter-spacing:.03em;color:var(--paper);margin-bottom:12px}.footer-text{max-width:530px;color:#aaa598;font-size:14px;margin:0}.footer-col h3{font-size:14px;color:#f0e8dc;margin:0 0 13px}.footer-col a{display:block;color:#aaa598;font-size:14px;margin:8px 0;transition:.2s}.footer-col a:hover{color:#efa574}.footer-bottom{padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:center;color:#8f8b82;font-size:12px}.top-btn{border:1px solid rgba(217,120,66,.65);background:transparent;border-radius:10px;color:#f0aa7a;padding:9px 12px;transition:.2s}.top-btn:hover{background:var(--ember);color:#fff}
@media(max-width:1024px){.guide-grid{grid-template-columns:1fr;gap:30px}.guide-index{max-width:760px}.guide-layout{grid-template-columns:1fr}.quick-bar{position:static}.quick-bar{display:flex}.masonry-grid{grid-template-columns:1fr 1fr}.footer-main{gap:28px}}
@media(max-width:768px){.container{width:min(100% - 32px,1240px)}.nav-grid{min-height:68px;grid-template-columns:1fr auto 1fr;gap:12px}.nav-side{display:none}.nav-side.right{display:flex}.nav-side.right .nav-link,.search-btn{display:none}.menu-btn{display:inline-flex;align-items:center}.brand{font-size:15px}.guide-hero{padding:42px 0 48px}.guide-hero h1{font-size:clamp(36px,10vw,46px)}.section{padding:66px 0}.section-head{grid-template-columns:1fr;gap:5px;margin-bottom:26px}.section-no{padding-top:0}.masonry-grid,.reverse-grid,.faq-grid{grid-template-columns:1fr;gap:28px}.notice-content{grid-template-columns:1fr;gap:15px}.notice-list{grid-template-columns:1fr}.related-row{grid-template-columns:1fr}.footer-main{grid-template-columns:1fr 1fr;padding:38px 0}.footer-main>div:first-child{grid-column:1/-1}.footer-guide,.footer-bottom{flex-direction:column;align-items:flex-start}.topic-visual{min-height:160px}}
@media(max-width:520px){.brand:before,.brand:after{display:none}.hero-tag-row{gap:7px}.guide-index{padding:16px}.index-link{grid-template-columns:34px 1fr auto}.masonry-grid{grid-template-columns:1fr}.notice-band{margin-top:42px;padding:23px}.related-card{min-height:155px}.footer-main{grid-template-columns:1fr}.footer-main>div:first-child{grid-column:auto}.btn{width:100%}.search-box{flex-direction:column}}