/* roulang page: index */
:root{
  --ink:#121713;--panel:#1c241d;--panel2:#283128;--paper:#e8e1d1;
  --mint:#7ee4b1;--pink:#e66c9b;--amber:#e9bd5a;--text:#f2eee3;
  --muted:#b8b9a9;--line:#3d5145;--deep:#0b0f0c;--shadow:5px 5px 0 #080b08;
  --shadow-mint:5px 5px 0 #4caa81;--max:1200px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.85;font-size:16px}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.17;z-index:-1;background-image:linear-gradient(rgba(126,228,177,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(126,228,177,.04) 1px,transparent 1px);background-size:24px 24px}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;background:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px)}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:12px;z-index:100;background:var(--paper);color:var(--deep);padding:8px 12px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(18,23,19,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{font-weight:800;letter-spacing:-.04em;display:flex;align-items:center;gap:10px;font-size:17px;white-space:nowrap}.pixel-play{width:23px;height:23px;background:var(--mint);color:var(--deep);display:grid;place-items:center;box-shadow:3px 3px 0 var(--pink);font-size:11px}
.nav-links{display:flex;align-items:center;gap:8px}.nav-links a{padding:10px 12px;color:var(--muted);font-size:14px;border-bottom:2px solid transparent;transition:.18s}.nav-links a:hover,.nav-links a.active{color:var(--mint);border-color:var(--mint)}
.nav-side{display:flex;align-items:center;gap:10px}.badge{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);padding:5px 8px;color:var(--muted);font-size:12px;line-height:1.3}.dot{width:7px;height:7px;background:var(--mint);display:inline-block}.btn{min-height:44px;border:2px solid var(--mint);padding:9px 16px;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-weight:700;line-height:1.2;transition:transform .18s,box-shadow .18s,border-color .18s}.btn-primary{color:var(--deep);background:var(--mint);box-shadow:4px 4px 0 #4d9f7c}.btn-secondary{color:var(--text);background:transparent;box-shadow:4px 4px 0 #503545;border-color:var(--pink)}.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #000}.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.statusbar{border-bottom:1px solid var(--line);background:#101510;color:var(--muted);font-size:12px}.status-inner{display:flex;gap:22px;align-items:center;min-height:34px;white-space:nowrap;overflow:auto}.status-inner strong{color:var(--mint);font-weight:600}.age-link{margin-left:auto;color:var(--amber)}
.hero{position:relative;min-height:620px;display:grid;align-items:end;overflow:hidden;border-bottom:2px solid var(--line);background:#101611}.hero-art{position:absolute;inset:0;background:radial-gradient(circle at 73% 42%,rgba(230,108,155,.24),transparent 21%),radial-gradient(circle at 35% 70%,rgba(126,228,177,.17),transparent 28%),linear-gradient(115deg,rgba(8,12,9,.88),rgba(17,25,18,.6));}.hero-art:before{content:"";position:absolute;right:7%;top:12%;width:46%;height:70%;border:2px solid rgba(126,228,177,.35);background:linear-gradient(135deg,transparent 10%,rgba(232,225,209,.05) 10% 12%,transparent 12% 45%,rgba(230,108,155,.11) 45% 48%,transparent 48%),repeating-linear-gradient(90deg,transparent 0 50px,rgba(126,228,177,.12) 50px 53px);box-shadow:-18px 18px 0 rgba(230,108,155,.12)}.hero-art:after{content:"▶  ARCHIVE / 18+";position:absolute;right:10%;top:20%;color:var(--paper);font-family:monospace;letter-spacing:3px;font-size:13px;border:1px solid var(--paper);padding:10px 14px}
.hero-content{position:relative;padding:96px 0 78px;max-width:770px}.eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--mint);font-family:monospace;font-size:13px;letter-spacing:1px}.hero h1{font-size:clamp(34px,5vw,54px);line-height:1.2;letter-spacing:-.055em;margin:15px 0 18px;max-width:760px}.hero p{max-width:720px;color:#d5d4c8;margin:0 0 25px;font-size:17px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-data{margin-top:42px;display:grid;grid-template-columns:1.15fr .85fr 1.3fr .7fr;gap:8px}.metric{border:2px solid var(--line);background:rgba(28,36,29,.88);padding:14px;min-height:108px}.metric:nth-child(2){border-color:#77515f}.metric:nth-child(3){border-color:#4b8169}.metric strong{display:block;color:var(--paper);font-family:monospace;font-size:22px;line-height:1.2;margin:8px 0}.metric small{color:var(--muted);font-size:12px;line-height:1.5;display:block}
section{padding:86px 0}.section-head{max-width:720px;margin-bottom:32px}.kicker{font-family:monospace;color:var(--pink);font-size:12px;letter-spacing:1px}.section-head h2{font-size:clamp(27px,3vw,38px);line-height:1.28;letter-spacing:-.045em;margin:7px 0 10px}.section-head p{color:var(--muted);margin:0}.matrix{background:var(--paper);color:#20271f}.matrix .section-head p{color:#4d554b}.matrix-grid{display:grid;grid-template-columns:1.35fr .8fr;gap:18px}.feature{border:2px solid #354237;padding:22px;background:#f0eadc;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:285px}.feature.large{grid-row:span 2;background:#213027;color:var(--text);border-color:var(--mint)}.feature h3{font-size:22px;line-height:1.35;margin:15px 0 8px}.feature p{margin:0;color:inherit;opacity:.78}.cover{height:94px;border:1px solid currentColor;position:relative;background:repeating-linear-gradient(90deg,transparent 0 15px,rgba(126,228,177,.17) 15px 18px),linear-gradient(135deg,#314638,#172019)}.cover:after{content:"▶";position:absolute;right:15px;bottom:10px;font-size:28px;color:var(--mint)}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.tag{border:1px solid currentColor;padding:3px 7px;font-size:12px;line-height:1.3}.feature .arrow{margin-top:auto;color:var(--mint);font-weight:bold}.path-section{background:var(--panel)}.path-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.path{padding:24px;border:2px solid var(--line);background:var(--deep);position:relative}.path.recommended{border-color:var(--mint);box-shadow:var(--shadow-mint)}.path h3{font-size:21px;margin:8px 0}.path p{color:var(--muted);margin:0}.path ul{list-style:none;padding:0;margin:18px 0 0}.path li{border-top:1px solid var(--line);padding:9px 0;font-size:14px;color:#d7d6c9}.path li:before{content:"□";color:var(--mint);margin-right:8px}.news-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.news-list,.notice-card{border:2px solid var(--line);background:var(--panel);padding:22px}.news-list h3,.notice-card h3{margin:0 0 10px;font-size:21px}.news-item{display:grid;grid-template-columns:80px 1fr auto;gap:14px;align-items:center;border-top:1px solid var(--line);padding:15px 0}.news-item time{font-family:monospace;color:var(--mint);font-size:12px}.news-item p{margin:2px 0 0;color:var(--muted);font-size:14px;line-height:1.65}.text-link{color:var(--mint);font-size:14px;font-weight:700}.notice-card{background:#2b2428;border-color:#6c4d5b}.notice-card p{color:#d2c4c9}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:2px solid var(--line)}.step{padding:20px;border-right:1px solid var(--line);min-height:190px;background:var(--panel)}.step:last-child{border:0}.step b{display:block;font-family:monospace;color:var(--mint);font-size:24px}.step h3{margin:12px 0 5px;font-size:18px}.step p{color:var(--muted);font-size:14px;margin:0}.voices{background:#e7dfd0;color:#1b251c}.voices .section-head p{color:#4f584e}.bubble-grid{display:grid;grid-template-columns:1.1fr .9fr 1fr;gap:18px;align-items:start}.bubble{border:2px solid #354237;background:#f5efe2;padding:18px;box-shadow:4px 4px 0 #9b9489}.bubble:nth-child(2){margin-top:35px;background:#213027;color:var(--text);border-color:var(--mint)}.bubble:nth-child(3){background:#f1dce5;border-color:#79495e}.bubble p{margin:0 0 12px}.person{font-size:13px;color:#637060}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}.faq{border:2px solid var(--line);background:var(--panel)}.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;gap:10px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"＋";color:var(--mint);font-size:21px;line-height:1}.faq[open]{border-color:var(--mint);background:#202d23}.faq[open] summary:after{content:"－"}.faq p{padding:0 18px 17px;margin:0;color:var(--muted);font-size:15px}.form-panel{border:2px solid var(--mint);box-shadow:var(--shadow-mint);background:#172019;display:grid;grid-template-columns:.8fr 1.2fr}.form-intro{padding:34px;border-right:1px solid var(--line);background:linear-gradient(135deg,#243c2d,#172019)}.form-intro h2{font-size:30px;line-height:1.3;margin:12px 0}.form-intro p{color:var(--muted)}.form-code{font-family:monospace;color:var(--mint);font-size:13px}.form-body{padding:30px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{margin-bottom:15px}.field label{display:block;font-size:14px;margin-bottom:6px;color:#d9d8cd}input,select,textarea{width:100%;color:var(--text);border:2px solid var(--line);background:#101610;padding:10px 11px;border-radius:0}textarea{min-height:94px;resize:vertical}.checks{font-size:13px;color:var(--muted);margin:14px 0}.checks label{display:flex;gap:8px;align-items:flex-start;margin:8px 0}.checks input{width:auto;margin-top:5px;accent-color:var(--mint)}.form-note{font-size:12px;color:var(--muted);margin:12px 0 0}.footer{background:#0b0f0c;border-top:2px solid var(--line);padding:52px 0 22px}.footer-grid{display:grid;grid-template-columns:1.45fr .8fr .95fr 1.2fr;gap:28px}.footer h3{font-size:14px;color:var(--mint);margin:0 0 12px}.footer p,.footer li{font-size:13px;color:var(--muted);margin:0 0 8px}.footer ul{padding:0;list-style:none}.footer a:hover{color:var(--mint)}.copyright{border-top:1px solid var(--line);margin-top:28px;padding-top:18px;color:#727c70;font-family:monospace;font-size:12px;display:flex;justify-content:space-between;gap:10px}.mobile-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--text);min-width:44px;min-height:44px}
@media(max-width:960px){.nav-links{display:none}.mobile-toggle{display:block}.hero{min-height:570px}.hero-data{grid-template-columns:1fr 1fr}.matrix-grid,.news-grid,.form-panel{grid-template-columns:1fr}.feature.large{grid-row:auto}.form-intro{border-right:0;border-bottom:1px solid var(--line)}.timeline{grid-template-columns:1fr 1fr}.step:nth-child(2){border-right:0}.step:nth-child(-n+2){border-bottom:1px solid var(--line)}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){section{padding:58px 0}.nav-side .badge{display:none}.status-inner{gap:14px}.hero-content{padding:74px 0 56px}.hero-art:before{width:64%;opacity:.65}.hero-art:after{right:7%;top:15%;font-size:10px}.path-grid,.faq-grid{grid-template-columns:1fr}.bubble-grid{grid-template-columns:1fr 1fr}.bubble:nth-child(2){margin-top:20px}.news-item{grid-template-columns:62px 1fr}.news-item .text-link{grid-column:2}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.container{width:min(100% - 28px,var(--max))}.logo{font-size:14px}.nav{gap:10px}.nav-side{display:none}.status-inner{font-size:11px}.status-inner span:nth-child(2){display:none}.hero{min-height:610px}.hero h1{font-size:31px}.hero p{font-size:15px}.hero-art:before{right:-7%;width:83%;top:10%}.hero-data{grid-template-columns:1fr 1fr}.metric{padding:11px;min-height:92px}.metric strong{font-size:18px}.hero-actions .btn{width:100%}.matrix-grid,.field-grid,.bubble-grid,.footer-grid{grid-template-columns:1fr}.feature{min-height:230px}.timeline{grid-template-columns:1fr}.step,.step:nth-child(2){border-right:0;border-bottom:1px solid var(--line)}.step:last-child{border-bottom:0}.bubble:nth-child(2){margin-top:0}.copyright{display:block}.copyright span{display:block;margin:5px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* roulang page: category2 */
:root{
 --ink:#121713;--panel:#1c241d;--panel2:#283128;--paper:#e8e1d1;
 --mint:#7ee4b1;--pink:#e66c9b;--amber:#e9bd5a;--text:#f2eee3;
 --muted:#b8b9a9;--line:#3d5145;--deep:#0b0f0c;--shadow:5px 5px 0 #080b08;
 --shadow-mint:5px 5px 0 #4caa81;--max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--text);background:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.85;font-size:16px}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.17;z-index:-1;background-image:linear-gradient(rgba(126,228,177,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(126,228,177,.04) 1px,transparent 1px);background-size:24px 24px}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;background:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(18,23,19,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font-weight:800;letter-spacing:-.04em;display:flex;align-items:center;gap:10px;font-size:17px;white-space:nowrap}
.pixel-play{width:22px;height:22px;display:inline-grid;place-items:center;color:var(--deep);background:var(--mint);font-size:11px;line-height:1;box-shadow:2px 2px 0 #4caa81}
.nav-links{display:flex;align-items:center;gap:8px}
.nav-links a{padding:10px 12px;color:var(--muted);font-size:14px;border-bottom:2px solid transparent;transition:.18s}
.nav-links a:hover,.nav-links a.active{color:var(--mint);border-color:var(--mint)}
.nav-side{display:flex;align-items:center;gap:10px}
.badge{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);padding:5px 8px;color:var(--muted);font-size:12px;line-height:1.3}
.badge .dot{width:7px;height:7px;background:var(--mint);display:inline-block;box-shadow:0 0 0 2px rgba(126,228,177,.12)}
.btn{min-height:44px;border:2px solid var(--mint);padding:9px 16px;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-weight:700;line-height:1.2;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s}
.btn-primary{color:var(--deep);background:var(--mint);box-shadow:4px 4px 0 #4d9f7c}
.btn-secondary{color:var(--text);background:transparent;box-shadow:4px 4px 0 #503545;border-color:var(--pink)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #000}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:20px}
.status-strip{border-bottom:1px solid var(--line);background:#0d120e;color:var(--muted);font-size:12px}
.status-inner{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:18px;overflow:hidden}
.status-left{display:flex;align-items:center;gap:8px;white-space:nowrap}
.status-dot{width:7px;height:7px;background:var(--mint);box-shadow:0 0 0 3px rgba(126,228,177,.12)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}
section{padding:84px 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--mint);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:1px}
.eyebrow:before{content:"";width:12px;height:12px;border:2px solid var(--mint);display:inline-block}
.section-head{max-width:720px;margin-bottom:30px}
.section-head h2{font-size:clamp(27px,3.2vw,38px);line-height:1.28;letter-spacing:-.045em;margin:8px 0 10px}
.section-head p{color:var(--muted);margin:0}
.archive-head{position:relative;overflow:hidden;background:var(--deep);border-bottom:2px solid var(--line)}
.archive-head:before{content:"";position:absolute;inset:0;opacity:.5;background:linear-gradient(90deg,rgba(126,228,177,.1) 1px,transparent 1px),linear-gradient(rgba(126,228,177,.08) 1px,transparent 1px);background-size:32px 32px}
.archive-head:after{content:"STATUS / 18+ / GUIDE";position:absolute;right:6%;top:34px;border:1px solid rgba(232,225,209,.36);padding:7px 10px;color:rgba(232,225,209,.75);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;letter-spacing:1px}
.head-inner{position:relative;padding:60px 0 64px;max-width:880px}
.breadcrumb{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px;margin-bottom:20px}
.breadcrumb span{color:var(--pink)}
.head-title{font-size:clamp(34px,5vw,52px);line-height:1.2;letter-spacing:-.06em;margin:13px 0 15px}
.head-copy{max-width:730px;color:#d8d8cc;margin:0;font-size:17px}
.head-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:22px 0}
.head-actions{display:flex;flex-wrap:wrap;gap:12px}
.topic-rail{background:var(--paper);color:#1b241d}
.topic-rail .section-head p{color:#526056}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:2px solid #304036;background:#e8e1d1;box-shadow:var(--shadow)}
.step{position:relative;min-height:230px;padding:24px 21px;border-right:1px solid #536255}
.step:last-child{border-right:0}
.step:not(:last-child):after{content:"→";position:absolute;right:-13px;top:27px;z-index:2;width:24px;text-align:center;background:var(--paper);color:#bd4c7c;font-weight:800;font-size:18px}
.step-num{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#207450;font-size:13px;font-weight:800}
.step h3{font-size:20px;line-height:1.35;margin:12px 0 8px}
.step p{color:#445146;margin:0;font-size:14px;line-height:1.75}
.step-mark{position:absolute;bottom:20px;right:20px;width:30px;height:30px;border:2px solid #b85a7f;background:linear-gradient(135deg,transparent 42%,#b85a7f 43% 57%,transparent 58%)}
.mosaic-section{background:var(--panel)}
.mosaic{display:grid;grid-template-columns:1.15fr .85fr .85fr;grid-template-rows:repeat(2,minmax(205px,auto));gap:16px}
.topic-card{position:relative;overflow:hidden;border:2px solid var(--line);background:#202a21;padding:21px;min-height:205px;display:flex;flex-direction:column;box-shadow:4px 4px 0 #0b0f0c;transition:.2s}
.topic-card:hover{transform:translate(-2px,-2px);border-color:var(--mint);box-shadow:6px 6px 0 #08110b}
.topic-card.big{grid-row:span 2;border-color:var(--mint);padding:26px;background:#1a271e}
.topic-card.pink{border-color:#8e4a68;background:#2c2227}
.topic-card.paper{background:var(--paper);color:#1c251e;border-color:#65705e}
.topic-card:before{content:"";position:absolute;right:-24px;bottom:-30px;width:155px;height:155px;opacity:.3;background:repeating-linear-gradient(90deg,var(--mint) 0 8px,transparent 8px 19px),repeating-linear-gradient(0deg,var(--pink) 0 5px,transparent 5px 18px);transform:rotate(-18deg)}
.cover{position:relative;z-index:1;width:100%;aspect-ratio:16/8;border:1px solid rgba(232,225,209,.3);margin-bottom:19px;background:linear-gradient(135deg,#263a2b 0 20%,#111a13 20% 42%,#5f3150 42% 49%,#172219 49% 100%)}
.cover:after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;display:grid;place-items:center;background:var(--paper);color:#172019;border:2px solid var(--deep);font-size:17px}
.cover.small{aspect-ratio:4/3;background:linear-gradient(45deg,#b9ae92 0 14%,#334637 14% 31%,#1a211b 31% 54%,#a0446d 54% 61%,#1a211b 61%)}
.cover.small:after{width:34px;height:34px;font-size:13px}
.card-label{position:relative;z-index:1;display:flex;gap:7px;align-items:center;color:var(--mint);font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.paper .card-label{color:#2e7252}
.topic-card h3{position:relative;z-index:1;margin:10px 0 7px;font-size:22px;line-height:1.35}
.topic-card p{position:relative;z-index:1;margin:0;color:var(--muted);font-size:14px;line-height:1.75}
.paper p{color:#465148}
.card-arrow{position:relative;z-index:1;margin-top:auto;padding-top:15px;color:var(--mint);font-weight:800;font-size:14px}
.paper .card-arrow{color:#206d4d}
.rules-section{background:#151d16}
.rule-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:22px;align-items:start}
.signal-panel{border:2px solid var(--line);background:var(--panel);padding:24px;box-shadow:var(--shadow)}
.signal-panel h3{margin:0 0 16px;font-size:22px}
.signal-list{list-style:none;padding:0;margin:0}
.signal-list li{display:grid;grid-template-columns:14px 1fr auto;gap:11px;align-items:center;padding:13px 0;border-top:1px solid var(--line);font-size:14px}
.signal-list li:first-child{border-top:0}
.light{width:10px;height:10px;background:var(--mint);box-shadow:0 0 0 3px rgba(126,228,177,.12)}
.light.amber{background:var(--amber);box-shadow:0 0 0 3px rgba(233,189,90,.12)}
.light.pink{background:var(--pink);box-shadow:0 0 0 3px rgba(230,108,155,.12)}
.progress{height:8px;border:1px solid var(--line);background:#111611;margin:20px 0 8px}
.progress b{display:block;height:100%;width:76%;background:repeating-linear-gradient(90deg,var(--mint) 0 12px,#57a980 12px 16px)}
.progress-note{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}
.faq-stack{display:grid;gap:11px}
.faq{border:2px solid var(--line);background:var(--panel)}
.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;gap:10px;line-height:1.55}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"＋";color:var(--mint);font-size:21px;line-height:1}
.faq[open]{border-color:var(--mint);background:#202d23}
.faq[open] summary:after{content:"－"}
.faq p{padding:0 18px 17px;margin:0;color:var(--muted);font-size:15px}
.faq-section{background:var(--paper);color:#1b241d}
.faq-section .section-head p{color:#526056}
.faq-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.faq-section .faq{background:#f3eee2;border-color:#65705e}
.faq-section .faq[open]{background:#dce9dc;border-color:#34835e}
.faq-section .faq p{color:#465148}
.faq-section .faq summary:after{color:#287653}
.cta-panel{padding:0 0 84px;background:var(--paper);color:#19221b}
.cta-inner{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;border:2px solid #34483a;background:#dde4d8;padding:29px 31px;box-shadow:5px 5px 0 #6e806f}
.cta-inner h2{font-size:28px;line-height:1.3;letter-spacing:-.04em;margin:0 0 8px}
.cta-inner p{margin:0;color:#4c594f}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.footer{padding:55px 0 0;border-top:2px solid var(--line);background:#0b100c}
.footer-grid{display:grid;grid-template-columns:1.15fr .8fr .9fr 1.35fr;gap:28px;padding-bottom:38px}
.footer h3{font-size:14px;color:var(--paper);margin:0 0 12px}
.footer p{color:var(--muted);font-size:13px;line-height:1.75;margin:0}
.footer ul{list-style:none;padding:0;margin:0}
.footer li{margin:7px 0}
.footer li a{color:var(--muted);font-size:13px}
.footer li a:hover{color:var(--mint)}
.copyright{min-height:55px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:15px;color:#899187;font-size:12px}
.mobile-panel{display:none}
@media(max-width:960px){
 .nav{gap:14px}.nav-links a{padding:10px 7px}.nav-side .badge{display:none}
 .mosaic{grid-template-columns:1fr 1fr}.topic-card.big{grid-row:span 2}.mosaic .topic-card:last-child{grid-column:span 2}
 .rule-layout{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
 body{font-size:15px}.container{width:min(var(--max),calc(100% - 30px))}
 .site-header{position:sticky}.nav{min-height:63px}.logo{font-size:15px;max-width:235px;overflow:hidden}
 .menu-toggle{display:block}.nav-links,.nav-side{display:none}
 .mobile-panel{position:fixed;inset:0 0 0 auto;z-index:80;width:min(350px,92vw);padding:22px;background:#151d16;border-left:2px solid var(--mint);transform:translateX(105%);transition:transform .2s;box-shadow:-8px 0 0 rgba(0,0,0,.35)}
 .mobile-panel.open{transform:translateX(0)}.mobile-panel nav{display:grid;gap:7px;margin-top:28px}.mobile-panel nav a{padding:12px;border-bottom:1px solid var(--line);color:var(--muted)}.mobile-panel nav a.active{color:var(--mint)}
 .mobile-close{float:right;width:44px;height:44px;background:transparent;color:var(--text);border:1px solid var(--line);font-size:22px}
 .mobile-panel .btn{width:100%;margin-top:23px}
 .status-inner{justify-content:flex-start;white-space:nowrap;overflow:auto}.status-inner span:last-child{display:none}
 .archive-head:after{display:none}.head-inner{padding:43px 0 48px}.head-title{font-size:34px}.head-copy{font-size:15px}
 section{padding:56px 0}.steps{grid-template-columns:1fr;box-shadow:var(--shadow)}.step{min-height:0;padding:20px 20px 24px;border-right:0;border-bottom:1px solid #536255}.step:last-child{border-bottom:0}.step:not(:last-child):after{content:"↓";right:19px;top:auto;bottom:-15px}
 .mosaic{grid-template-columns:1fr}.topic-card.big,.mosaic .topic-card:last-child{grid-column:auto;grid-row:auto}.topic-card.big{min-height:280px}
 .faq-columns{grid-template-columns:1fr}.cta-inner{grid-template-columns:1fr;padding:25px}.cta-actions{justify-content:flex-start}.footer-grid{grid-template-columns:1fr;gap:22px}.copyright{padding:15px 0;align-items:flex-start;flex-direction:column}
}
@media(max-width:560px){
 .head-actions,.cta-actions{display:grid;grid-template-columns:1fr}.btn{width:100%}.head-meta{margin:18px 0}.section-head h2{font-size:27px}.topic-card h3{font-size:20px}.cta-inner h2{font-size:24px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* roulang page: category1 */
:root{
 --ink:#121713;--panel:#1c241d;--panel2:#283128;--paper:#e8e1d1;
 --mint:#7ee4b1;--pink:#e66c9b;--amber:#e9bd5a;--text:#f2eee3;
 --muted:#b8b9a9;--line:#3d5145;--deep:#0b0f0c;--shadow:5px 5px 0 #080b08;
 --shadow-mint:5px 5px 0 #4caa81;--max:1200px;--danger:#c55e83;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;color:var(--text);background:var(--ink);
 font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
 line-height:1.85;font-size:16px;
}
body:before{
 content:"";position:fixed;inset:0;pointer-events:none;opacity:.17;z-index:-1;
 background-image:linear-gradient(rgba(126,228,177,.05) 1px,transparent 1px),
 linear-gradient(90deg,rgba(126,228,177,.04) 1px,transparent 1px);
 background-size:24px 24px;
}
body:after{
 content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;
 background:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px);
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{color:inherit;cursor:pointer}
img{max-width:100%;display:block}
ul{padding:0;margin:0;list-style:none}
p{margin-top:0}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.skip-link{
 position:fixed;left:14px;top:-80px;z-index:100;background:var(--paper);
 color:var(--deep);padding:10px 14px;border:2px solid var(--mint);
}
.skip-link:focus{top:14px}
.site-header{
 position:sticky;top:0;z-index:50;background:rgba(18,23,19,.94);
 backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{
 font-weight:800;letter-spacing:-.04em;display:flex;align-items:center;
 gap:10px;font-size:17px;white-space:nowrap;
}
.pixel-play{
 width:27px;height:27px;display:inline-grid;place-items:center;color:var(--deep);
 background:var(--mint);border:2px solid var(--paper);box-shadow:3px 3px 0 #315e48;
 font-size:12px;
}
.nav-links{display:flex;align-items:center;gap:8px}
.nav-links a{
 min-height:44px;padding:10px 12px;color:var(--muted);font-size:14px;
 border-bottom:2px solid transparent;transition:.18s;
}
.nav-links a:hover,.nav-links a.active{color:var(--mint);border-color:var(--mint)}
.nav-side{display:flex;align-items:center;gap:10px}
.badge{
 display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);
 padding:5px 8px;color:var(--muted);font-size:12px;line-height:1.3;
}
.status-dot{
 width:8px;height:8px;background:var(--mint);display:inline-block;
 box-shadow:0 0 0 3px rgba(126,228,177,.12);
}
.btn{
 min-height:44px;border:2px solid var(--mint);padding:9px 16px;display:inline-flex;
 justify-content:center;align-items:center;gap:8px;font-weight:700;line-height:1.2;
 transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;
}
.btn-primary{color:var(--deep);background:var(--mint);box-shadow:4px 4px 0 #4d9f7c}
.btn-secondary{color:var(--text);background:transparent;box-shadow:4px 4px 0 #503545;border-color:var(--pink)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #000}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}
.btn[disabled],.btn.disabled{cursor:not-allowed;opacity:.45;transform:none;box-shadow:none}
.btn-danger{border-color:var(--danger);background:var(--danger);color:var(--deep)}
.btn-loading{pointer-events:none;background:var(--amber);border-color:var(--amber);color:var(--deep)}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,summary:focus-visible{
 outline:3px solid var(--amber);outline-offset:3px;
}
.menu-toggle{
 display:none;width:46px;height:44px;border:2px solid var(--line);background:var(--panel);
 align-items:center;justify-content:center;
}
.menu-toggle span,.menu-toggle span:before,.menu-toggle span:after{
 width:20px;height:2px;background:var(--mint);display:block;position:relative;
}
.menu-toggle span:before,.menu-toggle span:after{content:"";position:absolute;left:0}
.menu-toggle span:before{top:-7px}.menu-toggle span:after{top:7px}
.activity-bar{border-top:1px solid rgba(61,81,69,.5);background:var(--deep)}
.activity-inner{
 min-height:34px;display:flex;align-items:center;justify-content:space-between;
 gap:20px;font:12px/1.3 monospace;color:var(--muted);white-space:nowrap;
}
.activity-inner strong{color:var(--mint);font-weight:600}
.page-hero{
 position:relative;padding:60px 0 48px;border-bottom:2px solid var(--line);
 overflow:hidden;background:#101611;
}
.page-hero:before{
 content:"";position:absolute;inset:0;pointer-events:none;
 background:radial-gradient(circle at 82% 35%,rgba(230,108,155,.19),transparent 22%),
 linear-gradient(120deg,transparent 58%,rgba(126,228,177,.07) 58% 59%,transparent 59%);
}
.archive-frame{
 position:absolute;right:6%;top:44px;width:330px;height:190px;border:2px solid rgba(126,228,177,.22);
 box-shadow:-12px 12px 0 rgba(230,108,155,.09);
 background:repeating-linear-gradient(90deg,transparent 0 42px,rgba(126,228,177,.08) 42px 45px);
}
.archive-frame:after{
 content:"INDEX / 01";position:absolute;right:16px;bottom:14px;color:var(--muted);
 border:1px solid var(--line);padding:6px 10px;font:12px monospace;letter-spacing:2px;
}
.breadcrumb{position:relative;display:flex;gap:9px;align-items:center;color:var(--muted);font-size:13px}
.breadcrumb a:hover{color:var(--mint)}
.hero-copy{position:relative;max-width:810px;margin-top:24px}
.eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--mint);font:13px monospace;letter-spacing:1px}
.page-hero h1{
 margin:12px 0 15px;font-size:clamp(34px,4.7vw,50px);line-height:1.2;
 letter-spacing:-.052em;
}
.page-hero p{max-width:750px;margin:0;color:#d5d4c8;font-size:17px}
.hero-meta{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.hero-meta .badge{background:rgba(28,36,29,.75)}
.filter-strip{
 position:relative;margin-top:32px;padding:15px;border:2px solid var(--line);
 background:rgba(28,36,29,.9);box-shadow:var(--shadow);
}
.filter-strip-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:11px}
.filter-strip-head strong{font-size:14px}
.filter-chips{display:flex;gap:8px;flex-wrap:wrap}
.filter-chip{
 min-height:39px;padding:7px 11px;border:1px solid var(--line);background:var(--panel2);
 color:var(--muted);font-size:13px;transition:.18s;
 clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%);
}
.filter-chip:hover,.filter-chip.active{border-color:var(--mint);color:var(--deep);background:var(--mint)}
.filter-chip:disabled{opacity:.38;cursor:not-allowed}
main section{padding:78px 0}
.section-head{max-width:760px;margin-bottom:30px}
.section-head .eyebrow{margin-bottom:6px}
.section-head h2{
 font-size:clamp(27px,3vw,37px);line-height:1.28;letter-spacing:-.045em;
 margin:5px 0 10px;
}
.section-head p{color:var(--muted);margin:0}
.archive-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px;align-items:start}
.filter-sidebar{
 position:sticky;top:132px;border:2px solid var(--line);background:var(--panel);
 box-shadow:var(--shadow);padding:19px;
}
.filter-sidebar h2{font-size:18px;margin:0 0 7px}
.filter-sidebar>p{color:var(--muted);font-size:13px;line-height:1.65;margin-bottom:18px}
.filter-group{padding:17px 0;border-top:1px solid var(--line)}
.filter-group h3{margin:0 0 10px;color:var(--paper);font-size:14px}
.filter-list{display:flex;flex-wrap:wrap;gap:7px}
.filter-list button{
 min-height:38px;border:1px solid var(--line);background:var(--panel2);
 color:var(--muted);padding:6px 9px;font-size:12px;
 transition:background .18s,border-color .18s,color .18s;
}
.filter-list button:hover,.filter-list button.active{
 background:#23392c;color:var(--mint);border-color:var(--mint);
}
.filter-list button:disabled{opacity:.35;cursor:not-allowed}
.filter-reset{
 width:100%;margin-top:15px;min-height:42px;border:2px solid var(--pink);
 color:var(--paper);background:transparent;font-weight:700;
}
.filter-reset:hover{background:rgba(230,108,155,.12)}
.mobile-filter-button{display:none;margin-bottom:18px;width:100%}
.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.archive-card{
 position:relative;border:2px solid var(--line);background:var(--panel);
 box-shadow:var(--shadow);overflow:hidden;transition:.2s;
}
.archive-card:hover{transform:translateY(-3px);border-color:var(--mint);box-shadow:7px 7px 0 #080b08}
.archive-card.featured{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;border-color:var(--mint)}
.pixel-cover{
 aspect-ratio:4/3;position:relative;overflow:hidden;border-bottom:2px solid var(--line);
 background:
 linear-gradient(135deg,transparent 0 28%,rgba(230,108,155,.55) 28% 47%,transparent 47%),
 repeating-linear-gradient(90deg,#18251c 0 43px,#26392d 43px 47px),
 linear-gradient(#243429,#121713);
}
.featured .pixel-cover{aspect-ratio:16/8;border-bottom:0;border-right:2px solid var(--line)}
.pixel-cover:before{
 content:"";position:absolute;inset:16px;border:2px solid rgba(232,225,209,.55);
 background:linear-gradient(90deg,transparent 45%,rgba(126,228,177,.18) 45% 56%,transparent 56%);
}
.pixel-cover:after{
 content:attr(data-code);position:absolute;left:27px;bottom:24px;
 color:var(--paper);font:700 13px monospace;letter-spacing:2px;
 background:rgba(11,15,12,.78);border:1px solid var(--paper);padding:7px 10px;
}
.cover-jp{
 background:
 linear-gradient(38deg,transparent 0 40%,rgba(230,108,155,.53) 40% 58%,transparent 58%),
 repeating-linear-gradient(90deg,#17231b 0 38px,#2b352b 38px 41px);
}
.cover-kr{
 background:
 linear-gradient(145deg,transparent 0 31%,rgba(233,189,90,.42) 31% 48%,transparent 48%),
 repeating-linear-gradient(0deg,#1b281f 0 35px,#304035 35px 39px);
}
.cover-new{
 background:
 linear-gradient(25deg,transparent 0 35%,rgba(126,228,177,.42) 35% 61%,transparent 61%),
 repeating-linear-gradient(90deg,#17231b 0 52px,#30382f 52px 56px);
}
.cover-topic{
 background:
 linear-gradient(135deg,rgba(230,108,155,.34) 0 22%,transparent 22% 60%,rgba(126,228,177,.24) 60%),
 repeating-linear-gradient(0deg,#18251c 0 44px,#2b362d 44px 47px);
}
.card-body{padding:20px}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.card-tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{border:1px solid currentColor;padding:3px 7px;font-size:12px;line-height:1.3;color:var(--muted)}
.tag.mint{color:var(--mint)}.tag.pink{color:var(--pink)}.tag.amber{color:var(--amber)}
.card-state{font:11px monospace;color:var(--mint);white-space:nowrap}
.archive-card h3{font-size:21px;line-height:1.4;margin:14px 0 8px}
.archive-card p{color:var(--muted);font-size:14px;line-height:1.75;margin:0 0 17px}
.card-points{border-top:1px solid var(--line);padding-top:12px;margin-bottom:16px}
.card-points li{font-size:13px;color:#d5d4c8;padding:3px 0 3px 17px;position:relative}
.card-points li:before{content:"■";position:absolute;left:0;color:var(--mint);font-size:7px;top:8px}
.text-link{display:inline-flex;min-height:44px;align-items:center;color:var(--mint);font-size:14px;font-weight:700}
.text-link:hover{color:var(--paper)}
.text-link span{transition:transform .18s;margin-left:7px}
.text-link:hover span{transform:translateX(4px)}
.archive-footer{
 display:flex;align-items:center;justify-content:space-between;gap:18px;
 margin-top:28px;padding-top:20px;border-top:1px solid var(--line);
}
.pagination{display:flex;gap:7px;flex-wrap:wrap}
.page-link{
 width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);
 background:var(--panel);color:var(--muted);font:13px monospace;transition:.18s;
}
.page-link:hover,.page-link.current{color:var(--deep);background:var(--mint);border-color:var(--mint)}
.page-link.disabled{opacity:.35;pointer-events:none}
.guide-band{background:var(--paper);color:#1b241d;border-top:2px solid var(--deep);border-bottom:2px solid var(--deep)}
.guide-band .section-head p{color:#515a50}
.guide-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}
.guide-panel{
 border:2px solid #354237;background:#f0eadc;padding:27px;box-shadow:5px 5px 0 #a49e91;
}
.guide-panel.dark{background:#213027;color:var(--text);border-color:#385846}
.guide-panel h3{font-size:22px;margin:0 0 10px}
.guide-panel p{color:#535c52;margin-bottom:18px}
.guide-panel.dark p{color:var(--muted)}
.guide-steps{counter-reset:step}
.guide-steps li{
 counter-increment:step;display:grid;grid-template-columns:42px 1fr;gap:12px;
 padding:13px 0;border-top:1px solid rgba(53,66,55,.35);
}
.guide-steps li:before{
 content:"0" counter(step);font:700 13px monospace;color:#1b241d;
 background:var(--mint);width:38px;height:30px;display:grid;place-items:center;
}
.guide-steps strong{display:block;line-height:1.45}
.guide-steps span{display:block;font-size:13px;color:#596158;margin-top:3px}
.rule-list li{
 padding:12px 0;border-top:1px solid var(--line);display:flex;gap:11px;
 color:var(--muted);font-size:14px;
}
.rule-list li:before{content:"◆";color:var(--pink);font-size:10px;margin-top:4px}
.faq-section{background:var(--panel)}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.faq{border:2px solid var(--line);background:#182019}
.faq summary{
 cursor:pointer;list-style:none;padding:16px 18px;font-weight:700;
 display:flex;justify-content:space-between;gap:10px;min-height:58px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"＋";color:var(--mint);font-size:21px;line-height:1}
.faq[open]{border-color:var(--mint);background:#202d23}
.faq[open] summary:after{content:"－"}
.faq p{padding:0 18px 17px;margin:0;color:var(--muted);font-size:15px}
.status-panel{
 border:2px solid var(--mint);background:#172019;box-shadow:var(--shadow-mint);
 display:grid;grid-template-columns:1fr 1.3fr auto;gap:24px;align-items:center;padding:27px;
}
.status-panel h2{font-size:23px;line-height:1.35;margin:4px 0 0}
.status-code{color:var(--mint);font:12px monospace;letter-spacing:1px}
.signal-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.signal{
 border:1px solid var(--line);background:var(--panel);padding:11px;
 font-size:12px;color:var(--muted);
}
.signal strong{display:block;color:var(--paper);font-size:13px;margin-bottom:3px}
.signal i{width:7px;height:7px;display:inline-block;background:var(--mint);margin-right:6px}
.footer{border-top:2px solid var(--line);padding:55px 0 0;background:var(--deep)}
.footer-grid{display:grid;grid-template-columns:1.35fr .7fr .8fr 1.35fr;gap:34px}
.footer p{color:var(--muted);font-size:14px;line-height:1.75}
.footer h3{margin:0 0 12px;font-size:15px;color:var(--paper)}
.footer li{margin:7px 0}
.footer li a{color:var(--muted);font-size:14px}
.footer li a:hover{color:var(--mint)}
.copyright{
 margin-top:40px;padding:18px 0;border-top:1px solid var(--line);
 color:#858d82;font:12px monospace;display:flex;justify-content:space-between;gap:18px;
}
.filter-backdrop{display:none}
@media (max-width:1024px){
 .nav-side .badge{display:none}
 .archive-layout{grid-template-columns:220px minmax(0,1fr);gap:20px}
 .status-panel{grid-template-columns:1fr 1.2fr}
 .status-panel .btn{grid-column:1/-1}
 .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
 .container{width:min(100% - 28px,var(--max))}
 .nav{min-height:64px}
 .nav-links{
  display:none;position:absolute;left:14px;right:14px;top:66px;padding:12px;
  background:var(--panel);border:2px solid var(--mint);box-shadow:var(--shadow);
  flex-direction:column;align-items:stretch;
 }
 .nav-links.open{display:flex}
 .nav-links a{display:flex;align-items:center;border:1px solid transparent}
 .nav-links a.active{background:#23392c;border-color:var(--mint)}
 .menu-toggle{display:flex}
 .nav-side .btn{display:none}
 .activity-inner{overflow-x:auto;justify-content:flex-start}
 .activity-inner span:last-child{display:none}
 .page-hero{padding:45px 0 38px}
 .archive-frame{opacity:.35;right:-100px}
 .page-hero h1{font-size:clamp(30px,8vw,39px)}
 .filter-strip{overflow:hidden}
 .filter-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px}
 main section{padding:58px 0}
 .archive-layout{display:block}
 .filter-sidebar{
  display:none;position:fixed;z-index:80;inset:78px 14px 16px;top:78px;
  overflow:auto;max-width:420px;margin:auto;
 }
 .filter-sidebar.open{display:block}
 .filter-backdrop.open{display:block;position:fixed;inset:0;background:rgba(3,7,4,.78);z-index:70}
 .mobile-filter-button{display:flex}
 .archive-card.featured{display:block}
 .featured .pixel-cover{border-right:0;border-bottom:2px solid var(--line)}
 .guide-grid,.faq-grid{grid-template-columns:1fr}
 .status-panel{grid-template-columns:1fr}
 .signal-list{grid-template-columns:1fr 1fr 1fr}
 .status-panel .btn{grid-column:auto}
}
@media (max-width:560px){
 body{font-size:15px}
 .logo{font-size:14px}
 .logo .pixel-play{width:25px;height:25px}
 .nav-side{gap:7px}
 .hero-meta{display:grid;grid-template-columns:1fr 1fr}
 .archive-grid{grid-template-columns:1fr}
 .archive-card.featured{grid-column:auto}
 .archive-footer{align-items:flex-start;flex-direction:column}
 .pagination{width:100%}
 .page-link{flex:1;min-width:44px}
 .guide-panel{padding:21px}
 .signal-list{grid-template-columns:1fr}
 .status-panel{padding:21px}
 .status-panel .btn{width:100%}
 .footer-grid{grid-template-columns:1fr;gap:26px}
 .copyright{flex-direction:column}
 .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*:before,*:after{animation:none!important;transition:none!important}
 body:after{display:none}
}