/* ═══════════════════════════════════════════════════════════════════════════
   GOKURAKUGAI — HOMEPAGE (index.html)   assets/css/home.css
   Built on gkg-core.css. Sections are laid out like manga pages: panels, caption
   boxes, torn tape, hard offset shadows, screentone, lantern red on ink black.
   Behavioural classes toggled by JS (active/open/visible/show/hidden/loaded…) are kept.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── ad slots ───────────────────────────────────────────────────────────── */
.ad-slot{display:none;background:var(--surface);border-top:2px solid var(--line);border-bottom:2px solid var(--line);padding:.6rem 0 .75rem;text-align:center;margin:0 auto;width:100%;max-width:100%;overflow:hidden}
.ad-slot:has(ins[data-ad-status="filled"]){display:block}
.ad-slot ins.adsbygoogle{display:block!important;width:100%!important;min-width:250px}
.ad-label{font:600 .62rem var(--f-label);letter-spacing:.22em;color:var(--text-muted);text-transform:uppercase;margin-bottom:.3rem;opacity:.7}

/* ── icons ──────────────────────────────────────────────────────────────── */
.icon{width:1.2em;height:1.2em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:middle;flex-shrink:0}
.icon-fill{fill:currentColor;stroke:none}
.icon-sm{width:.95em;height:.95em}.icon-md{width:1.5rem;height:1.5rem}.icon-lg{width:2rem;height:2rem}.icon-xl{width:2.5rem;height:2.5rem}
.icon-accent{color:var(--accent)}

/* ── countdown bar ──────────────────────────────────────────────────────── */
#cd-bar{position:sticky;top:0;z-index:101;display:flex;align-items:center;justify-content:center;gap:1.1rem;flex-wrap:wrap;padding:.5rem 1rem;color:#fff;text-align:center;
  background:repeating-linear-gradient(-45deg,var(--red-dark) 0 14px,var(--red-deep) 14px 28px);border-bottom:3px solid var(--ink-0);box-shadow:0 4px 0 rgba(0,0,0,.35)}
#cd-bar.hidden{display:none}
.cd-label{display:inline-flex;align-items:center;gap:.5rem;font:700 .8rem var(--f-label);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.cd-pulse{width:9px;height:9px;background:var(--gold);transform:rotate(45deg);animation:cdp 1.4s ease-in-out infinite}
@keyframes cdp{50%{opacity:.25;transform:rotate(45deg) scale(.7)}}
.cd-units{display:flex;gap:.45rem;align-items:center}
.cd-unit{display:flex;flex-direction:column;align-items:center;min-width:44px;background:var(--ink-0);border:2px solid var(--gold);padding:.15rem .3rem .1rem;box-shadow:3px 3px 0 rgba(0,0,0,.45)}
.cd-n{font:400 1.45rem/1 var(--f-display);letter-spacing:.03em;color:#fff}
.cd-t{font:600 .55rem var(--f-label);letter-spacing:.18em;color:var(--gold);text-transform:uppercase}
.cd-sep{font:400 1.2rem var(--f-display);color:var(--gold);opacity:.7}
.cd-ev{font:700 .8rem var(--f-label);letter-spacing:.2em;text-transform:uppercase;opacity:.9;white-space:nowrap}
.cd-x{cursor:pointer;color:#fff;background:rgba(0,0,0,.4);border:2px solid rgba(255,255,255,.35);padding:.2rem .4rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
.cd-x:hover{background:var(--ink-0)}

/* ── hero header ────────────────────────────────────────────────────────── */
#hdr{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(380px,56vh,540px);display:flex;align-items:center;justify-content:center;border-bottom:4px solid var(--ink-0)}
.hdr-art{position:absolute;inset:0;z-index:-3;background:var(--header-bg) center 30%/cover no-repeat;transform:scale(1.04)}
#hdr::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(7,5,6,.5),rgba(7,5,6,.15) 40%,rgba(7,5,6,.9))}
[data-theme="light"] #hdr::before{background:linear-gradient(180deg,rgba(242,234,219,.35),rgba(242,234,219,.05) 40%,rgba(242,234,219,.92))}
#hdr::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:30px;z-index:1;background:var(--bg);clip-path:polygon(0 100%,0 55%,6% 30%,13% 62%,21% 25%,30% 58%,39% 28%,48% 64%,57% 24%,66% 60%,75% 30%,84% 62%,92% 28%,100% 56%,100% 100%)}
.hdr-speed{z-index:-1}
.hdr-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.1rem;padding:2.4rem 1rem 3.4rem;text-align:center}
.hdr-kick .gk-stamps{font-size:1.15rem}
.hdr-plate{position:relative;background:var(--paper);border:3px solid var(--ink-0);padding:1.5rem 2.6rem 1.1rem;box-shadow:9px 9px 0 var(--red);transform:rotate(-1deg)}
.hdr-plate::before{content:'';position:absolute;inset:6px;border:1px solid var(--ink);opacity:.45;pointer-events:none}
.glitch-wrap{position:relative;display:inline-block;cursor:pointer;height:84px;min-width:290px}
.logo-en-gl,.logo-jp-gl{max-height:90px;width:auto;display:block;position:absolute;top:0;left:50%;transform:translateX(-50%);filter:none}
.logo-jp-gl{opacity:0}
.gl-r,.gl-b{position:absolute;top:0;left:50%;transform:translateX(-50%);pointer-events:none}
.gl-r img,.gl-b img{max-height:90px;width:auto;display:block;opacity:0;position:relative}
.logo-en-gl{animation:enShow 8s steps(1) infinite}.logo-jp-gl{animation:jpShow 8s steps(1) infinite}
.gl-r img{animation:glR2 8s steps(1) infinite;filter:hue-rotate(175deg) saturate(2.5) drop-shadow(3px 0 0 #ff003c)}
.gl-b img{animation:glB2 8s steps(1) infinite;filter:hue-rotate(-50deg) saturate(2.5) drop-shadow(-3px 0 0 #00a8ff)}
@keyframes enShow{0%,74.9%{opacity:1}75%,89.9%{opacity:0}90%,100%{opacity:1}}
@keyframes jpShow{0%,77.9%{opacity:0}78%,87.9%{opacity:1}88%,100%{opacity:0}}
@keyframes glR2{0%,74.9%,77.9%,89.9%,100%{opacity:0;clip-path:inset(100% 0 0 0)}75%{opacity:.85;clip-path:inset(8% 0 68% 0);transform:translateX(-4px)}75.5%{opacity:.85;clip-path:inset(45% 0 38% 0);transform:translateX(4px)}76%{opacity:.85;clip-path:inset(72% 0 12% 0);transform:translateX(-2px)}77%{opacity:0}88%{opacity:.85;clip-path:inset(15% 0 62% 0);transform:translateX(4px)}88.5%{opacity:.85;clip-path:inset(55% 0 22% 0);transform:translateX(-4px)}89%{opacity:0}}
@keyframes glB2{0%,74.9%,77.9%,89.9%,100%{opacity:0;clip-path:inset(100% 0 0 0)}75%{opacity:.85;clip-path:inset(72% 0 12% 0);transform:translateX(4px)}75.5%{opacity:.85;clip-path:inset(38% 0 45% 0);transform:translateX(-4px)}76%{opacity:.85;clip-path:inset(8% 0 68% 0);transform:translateX(2px)}77%{opacity:0}88%{opacity:.85;clip-path:inset(62% 0 15% 0);transform:translateX(-4px)}88.5%{opacity:.85;clip-path:inset(22% 0 55% 0);transform:translateX(4px)}89%{opacity:0}}
.hdr-tag{font:700 .85rem var(--f-label);letter-spacing:.4em;color:var(--ink);text-transform:uppercase;margin-top:.6rem;padding-left:.4em;white-space:nowrap}
.hdr-cta{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin-top:.3rem}

/* ── navigation ─────────────────────────────────────────────────────────── */
#nav{position:sticky;top:0;z-index:100;background:var(--nav-bg);border-bottom:3px solid var(--red);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.nav-in{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:1rem;padding:0 var(--gutter);min-height:var(--nav-h)}
.nav-brand{display:flex;align-items:center;flex-shrink:0}
.nav-brand .gk-stamps{font-size:.8rem}
.nav-tabs{display:flex;list-style:none;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;align-self:stretch}
.nav-tabs::-webkit-scrollbar{display:none}
.nav-tabs li{position:relative;flex-shrink:0;display:flex}
.nav-tabs li>a,.nav-tabs li>button{display:flex;align-items:center;gap:.3rem;padding:0 1.05rem;font:700 .95rem var(--f-label);letter-spacing:.17em;text-transform:uppercase;color:var(--text-dim);cursor:pointer;background:none;border:0;position:relative;white-space:nowrap;transition:color .15s}
.nav-tabs li>a::after{content:'';position:absolute;left:.7rem;right:.7rem;bottom:-3px;height:5px;background:var(--red);transform:scaleX(0) skewX(-30deg);transform-origin:left;transition:transform .2s var(--ease)}
.nav-tabs li>a:hover{color:var(--text)}
.nav-tabs li>a.active{color:var(--text)}
.nav-tabs li>a.active::after,.nav-tabs li>a:hover::after{transform:scaleX(1) skewX(-30deg)}
.nav-ctrl{display:flex;align-items:center;gap:.8rem;flex-shrink:0}
.tt{display:flex;align-items:center;gap:.35rem;color:var(--text-dim)}
.tt-icon{display:flex;align-items:center}
.tt-track{position:relative;width:42px;height:22px;background:var(--ink);border:2px solid var(--line-strong);cursor:pointer;flex-shrink:0;transform:skewX(-9deg)}
[data-theme="light"] .tt-track{background:var(--paper)}
.tt-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;background:var(--red);transition:transform .25s var(--ease-snap)}
[data-theme="light"] .tt-thumb{transform:translateX(20px)}
.dc-zone{position:relative}
#dc-login-btn{display:flex;align-items:center;gap:.5rem;padding:.55rem 1rem;font:700 .85rem var(--f-label);letter-spacing:.16em;text-transform:uppercase;background:var(--blurple);color:#fff;border:2px solid var(--ink-0);box-shadow:3px 3px 0 var(--hard);cursor:pointer;white-space:nowrap;transition:transform .12s,box-shadow .12s}
#dc-login-btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--hard)}
#dc-login-btn svg{width:17px;height:17px;flex-shrink:0}
#dc-user-wrap{display:none;position:relative}
.dc-btn{display:flex;align-items:center;gap:.5rem;padding:.3rem .65rem .3rem .3rem;background:var(--surface2);border:2px solid var(--line-strong);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.dc-btn:hover{border-color:var(--red);box-shadow:3px 3px 0 var(--hard)}
.dc-av{width:28px;height:28px;border-radius:50%;border:2px solid var(--red);object-fit:cover;flex-shrink:0}
.dc-av-ph{width:28px;height:28px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;color:#fff;font:400 .85rem var(--f-display);flex-shrink:0}
.dc-uname{font:700 .85rem var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text);max-width:95px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dc-dot{width:8px;height:8px;background:var(--ok);border-radius:50%;flex-shrink:0;box-shadow:0 0 6px var(--ok)}
.dc-dd{position:absolute;top:calc(100% + 10px);right:0;width:190px;z-index:400;display:none;background:var(--surface);border:2px solid var(--line-strong);box-shadow:6px 6px 0 var(--hard);overflow:hidden}
.dc-dd.open{display:block;animation:fadeUp .16s ease}
.dc-dd.drop-up{top:auto;bottom:calc(100% + 10px)}
.dc-dd.drop-up.open{animation:fadeDown .16s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.dc-dd-item{display:flex;align-items:center;gap:.65rem;width:100%;padding:.8rem 1rem;background:none;border:0;text-align:left;cursor:pointer;font:700 .85rem var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);transition:background .12s,color .12s}
.dc-dd-item:hover{background:var(--red);color:#fff}
.dc-dd-item svg{width:15px;height:15px;flex-shrink:0}
.dc-dd-sep{height:2px;background:var(--line)}
.dc-dd-item.dc-out{color:var(--accent)}
.dc-dd-item.dc-out:hover{background:var(--bad);color:#fff}

/* ── profile modal ──────────────────────────────────────────────────────── */
#prof-ov{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:var(--modal-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1rem}
#prof-ov.open{display:flex;animation:ovFade .2s ease}
@keyframes ovFade{from{opacity:0}to{opacity:1}}
#prof-modal{width:min(450px,96vw);max-height:min(90vh,720px);overflow-y:auto;margin:auto;flex-shrink:0;background:var(--surface);border:2px solid var(--line-strong);box-shadow:10px 10px 0 var(--hard);position:relative;animation:modalPop .24s var(--ease-snap)}
@keyframes modalPop{from{opacity:0;transform:scale(.94) translateY(14px)}to{opacity:1;transform:none}}
#prof-modal::-webkit-scrollbar{width:5px}
.pm-banner{height:170px;background:linear-gradient(135deg,var(--red-dark),var(--red-deep) 55%,#1a0303);position:relative;overflow:hidden;border-bottom:3px solid var(--ink-0)}
.pm-banner-img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;display:none}
.pm-banner-loading{width:100%;height:100%;background:var(--surface2);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.pm-banner-loading::after{content:'';width:24px;height:24px;border:3px solid var(--line);border-top-color:var(--red);border-radius:50%;animation:spin .7s linear infinite}
.pm-banner-fallback{width:100%;height:100%;position:absolute;inset:0;background:var(--header-bg) center/cover no-repeat;display:none;align-items:center;justify-content:center}
.pm-banner-fallback::before{content:'';position:absolute;inset:0;background:rgba(7,5,6,.62)}
.pm-banner-nobanner{position:relative;z-index:1;font:700 .75rem var(--f-label);letter-spacing:.26em;color:rgba(255,255,255,.55);text-transform:uppercase;border:2px solid rgba(255,255,255,.3);padding:.3rem .8rem}
.pm-close{position:absolute;top:.7rem;right:.7rem;z-index:10;background:var(--ink-0);border:2px solid rgba(255,255,255,.4);color:#fff;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:.85rem;line-height:1;transition:background .15s}
.pm-close:hover{background:var(--red)}
.pm-av-zone{display:flex;align-items:flex-end;justify-content:space-between;padding:0 1.5rem;margin-top:-46px;margin-bottom:.75rem;position:relative;z-index:1}
.pm-av-wrap{position:relative;flex-shrink:0}
.pm-av{width:92px;height:92px;border-radius:50%;background:var(--surface2);border:5px solid var(--surface);outline:3px solid var(--red);overflow:hidden;display:flex;align-items:center;justify-content:center;font:400 2rem var(--f-display);color:var(--accent)}
.pm-av img{width:100%;height:100%;object-fit:cover}
.pm-av-dot{position:absolute;bottom:5px;right:5px;width:19px;height:19px;border-radius:50%;background:var(--ok);border:3px solid var(--surface);display:none}
.pm-member-badge{align-self:flex-start;margin-top:10px;font:700 .75rem var(--f-label);letter-spacing:.14em;text-transform:uppercase;padding:.3rem .75rem;display:inline-flex;align-items:center;gap:.35rem;border:2px solid currentColor}
.pm-badge-yes{background:rgba(87,242,135,.12);color:#4ade80}
.pm-badge-no{background:rgba(237,66,69,.12);color:#f87171}
[data-theme="light"] .pm-badge-yes{color:#15803d;background:rgba(22,163,74,.1)}
[data-theme="light"] .pm-badge-no{color:#b91c1c;background:rgba(185,28,28,.09)}
.pm-body{padding:.2rem 1.5rem 0}
.pm-displayname{font:400 1.7rem/1.05 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.25rem}
.pm-sub{font-size:.85rem;color:var(--text-muted);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.pm-pipe{color:var(--text-muted)}
.pm-uid{font:400 .72rem var(--f-mono);background:var(--surface2);padding:.1rem .4rem;border:1px solid var(--line)}
.pm-status-bar{display:none;align-items:center;gap:.5rem;flex-wrap:wrap;margin:.15rem 0 .8rem;padding:.45rem .7rem;background:var(--surface2);border:2px solid var(--line);font-size:.85rem;color:var(--text-dim)}
.pm-status-bar.visible{display:flex}
.pm-status-indicator{display:inline-flex;align-items:center;gap:.3rem;font:700 .75rem var(--f-label);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.pm-status-indicator::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--psi-color,#747f8d);flex-shrink:0}
.pm-status-indicator.online{--psi-color:#57F287;color:#57F287}.pm-status-indicator.idle{--psi-color:#FEE75C;color:#FEE75C}.pm-status-indicator.dnd{--psi-color:#ED4245;color:#ED4245}
.pm-custom-text{font-size:.85rem;color:var(--text-dim);font-style:italic}
.pm-divider{height:2px;background:var(--line);margin:.9rem 0}
.pm-info-grid{display:flex;flex-direction:column;gap:.9rem;padding-bottom:.2rem}
.pm-info-label{font:700 .72rem var(--f-label);letter-spacing:.2em;color:var(--accent);text-transform:uppercase;margin-bottom:.22rem}
.pm-info-val{font-size:.92rem;color:var(--text-dim);line-height:1.45}
.pm-roles-wrap{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.25rem}
.pm-role-pill{font:700 .75rem var(--f-label);letter-spacing:.08em;text-transform:uppercase;padding:.25rem .6rem;display:inline-flex;align-items:center;gap:.35rem;border:2px solid currentColor}
.pm-role-pill::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}
.pm-footer{border-top:2px solid var(--line);margin-top:1.2rem;padding:.9rem 1.5rem;display:flex}
.pm-logout-btn{display:flex;align-items:center;gap:.5rem;font:700 .85rem var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--ink);border:2px solid var(--line-strong);padding:.55rem 1.1rem;cursor:pointer;transition:background .15s,border-color .15s}
.pm-logout-btn:hover{background:var(--bad);border-color:var(--bad)}

/* ── main shell / section switching ─────────────────────────────────────── */
#content{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:2.8rem var(--gutter) 6rem}
.sec{display:none}
.sec.active{display:block;animation:fi .32s ease}
.subsec{display:none}
.subsec.active{display:block;animation:fi .32s ease}
@keyframes fi{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}

/* section header: kanji stamped behind an Anton title */
.sec-hdr{position:relative;text-align:left;padding:1rem 0 2.2rem;margin-bottom:.4rem;display:grid;gap:.4rem;isolation:isolate}
.sec-hdr .jp{font:400 clamp(2.3rem,8.2vw,6.2rem)/1 var(--f-jp);color:var(--red);opacity:.9;display:block;letter-spacing:.02em;text-shadow:4px 4px 0 var(--ink-0);-webkit-text-stroke:0}
[data-theme="light"] .sec-hdr .jp{text-shadow:4px 4px 0 var(--ink);color:var(--accent-fill)}
.sec-hdr .en{font:400 clamp(1.9rem,5vw,3.4rem)/1 var(--f-display);text-transform:uppercase;letter-spacing:.02em;color:var(--text);display:block;margin-top:-.1em}
.sec-hdr .en::after{content:'';display:block;width:min(260px,52%);height:7px;margin-top:.7rem;background:var(--red);clip-path:polygon(0 0,100% 0,96% 100%,0 100%)}
.sec-hdr .sub{font-size:1.02rem;color:var(--text-dim);max-width:640px;line-height:1.75;margin-top:.5rem}
.sec-hdr-join{padding-top:1.4rem}
.st{font:400 clamp(1.8rem,4vw,2.8rem)/1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.2rem}
.st-jp{font:400 .95rem var(--f-jp);color:var(--accent);letter-spacing:.35em;margin-bottom:1.5rem}
.sdiv{display:flex;align-items:center;gap:.9rem;margin:.4rem 0 2rem}
.sdiv::before,.sdiv::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,transparent,var(--line-strong),transparent);opacity:.6}
.sdiv span{display:block;width:72px;height:28px;font-size:0;background:var(--knot) center/contain no-repeat}
.sdiv-join{margin-top:3rem}
.orn{display:flex;align-items:center;gap:1rem;margin:3rem 0 1.4rem;font:400 clamp(1.3rem,3vw,1.9rem)/1 var(--f-display);text-transform:uppercase;letter-spacing:.03em;color:var(--text)}
.orn::before{content:'';width:14px;height:34px;background:var(--red);transform:skewX(-14deg);flex-shrink:0}
.orn::after{content:'';flex:1;height:2px;background:repeating-linear-gradient(90deg,var(--line-strong) 0 8px,transparent 8px 14px);opacity:.55}
.lede-c{text-align:center;max-width:620px;margin:0 auto 1.6rem;font-size:1rem;color:var(--text-dim);line-height:1.8}
.lede-c.small{font-size:.92rem;color:var(--text-muted)}
.fine-print{text-align:center;margin-top:2rem;font-size:.85rem;color:var(--text-muted)}
.fine-print.box{text-align:left;margin-top:2rem;padding:1rem 1.3rem;background:var(--paper);color:var(--ink);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--hard)}
.fine-print.box a{color:var(--red-deep);text-decoration:underline;font-weight:700}

/* ── buttons used outside .btn base (subnav) ────────────────────────────── */
.qlinks{display:flex;flex-wrap:wrap;gap:1.1rem;margin-top:1.8rem}
.subnav{display:flex;gap:.7rem;margin-bottom:2rem;flex-wrap:wrap}
.sn-btn{position:relative;padding:.7rem 1.5rem;font:700 .9rem var(--f-label);letter-spacing:.18em;text-transform:uppercase;border:0;color:var(--text-dim);background:none;cursor:pointer;isolation:isolate;transition:color .15s}
.sn-btn::before{content:'';position:absolute;inset:0;z-index:-1;border:2px solid var(--line-strong);transform:skewX(-9deg);transition:background .15s}
.sn-btn:hover{color:var(--text)}
.sn-btn.active{color:#fff}
.sn-btn.active::before{background:var(--accent-fill);border-color:var(--ink-0);box-shadow:4px 4px 0 var(--gold)}
[data-theme="light"] .sn-btn.active::before{box-shadow:4px 4px 0 var(--ink)}

/* ── cards & boxes ──────────────────────────────────────────────────────── */
.card{background:var(--surface);border:2px solid var(--line-strong);padding:1.4rem;box-shadow:5px 5px 0 var(--hard)}
.fbox{position:relative;background:var(--paper);color:var(--ink);border:3px solid var(--ink);padding:1.9rem 1.8rem 1.7rem;box-shadow:8px 8px 0 var(--red)}
.fbox::before{content:'';position:absolute;inset:6px;border:1px solid var(--ink);opacity:.35;pointer-events:none}
.fbox h3{font:400 1.7rem/1 var(--f-display);text-transform:uppercase;color:var(--red-deep);margin-bottom:.9rem}
.fbox p{color:#2b201c}
.igrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.9rem;margin-top:1.6rem}
.ic{background:var(--surface);border:2px solid var(--line-strong);padding:1rem 1.1rem;position:relative;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.ic::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--red)}
.ic:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--hard)}
.ic .icl{font:700 .72rem var(--f-label);letter-spacing:.22em;color:var(--accent);text-transform:uppercase;margin-bottom:.3rem}
.ic .icv{font:700 1.08rem/1.3 var(--f-body);color:var(--text)}

/* ── about ──────────────────────────────────────────────────────────────── */
.about-g{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6rem;align-items:start;margin-bottom:1rem}
.about-text .lead{position:relative;font:400 clamp(1.35rem,2.6vw,1.9rem)/1.3 var(--f-jp);color:var(--text);padding:1.4rem 1.2rem 1.2rem 1.6rem;margin-bottom:1.6rem;background:var(--surface);border:2px solid var(--line-strong);box-shadow:6px 6px 0 var(--hard)}
.about-text .lead::before{content:'“';position:absolute;top:-.55rem;left:.6rem;font:400 4.4rem/1 var(--f-display);color:var(--red)}
.about-text p{font-size:1.05rem;line-height:1.9;margin-bottom:1rem;color:var(--text-dim)}
.about-text p strong{color:var(--accent)}
.synopsis{transform:rotate(1deg)}
.synopsis p{font-size:1rem;line-height:1.85}

/* ── rules ──────────────────────────────────────────────────────────────── */
.rules-page-hdr{padding:1rem 0 2rem}
.rules-page-hdr h2{font:400 clamp(2.4rem,6vw,4.4rem)/.95 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:1rem;text-shadow:4px 4px 0 var(--hard)}
.rules-page-hdr p{font-size:1.05rem;color:var(--text-dim);max-width:640px;line-height:1.8}
.rules-card-grid{counter-reset:rule;display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem;margin-bottom:3rem}
.rule-card{counter-increment:rule;position:relative;background:var(--surface);border:2px solid var(--line-strong);padding:1.5rem 1.4rem 1.4rem 5rem;display:block;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.rule-card::before{content:counter(rule,decimal-leading-zero);position:absolute;left:0;top:0;bottom:0;width:3.6rem;display:flex;align-items:flex-start;justify-content:center;padding-top:1rem;background:var(--accent-fill);color:#fff;font:400 1.9rem/1 var(--f-display);border-right:3px solid var(--ink-0)}
.rule-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--hard)}
.rule-card-icon{position:absolute;right:1rem;top:1rem;width:auto;height:auto;color:var(--text-muted);opacity:.5}
.rule-card-body h4{font:400 1.35rem/1.1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.55rem;padding-right:2.2rem}
.rule-card-body p{font-size:.95rem;line-height:1.75;color:var(--text-dim)}
.consequences-box{position:relative;background:var(--paper);color:var(--ink);border:3px solid var(--ink);padding:2rem 1.8rem;margin-bottom:3rem;box-shadow:8px 8px 0 var(--red)}
.consequences-title{font:400 clamp(1.5rem,3vw,2.1rem)/1 var(--f-display);text-transform:uppercase;color:var(--red-deep);margin-bottom:1.6rem}
.consequences-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.cq-item{position:relative;padding:1.2rem 1rem 1rem;border:2px solid var(--ink);background:#fff8ec}
.cq-item:nth-child(2){background:#f6dcb4}.cq-item:nth-child(3){background:var(--red);color:#fff}
.cq-item:nth-child(3) .cq-title,.cq-item:nth-child(3) .cq-body,.cq-item:nth-child(3) .cq-body strong{color:#fff}
.cq-icon{width:auto;height:auto;margin-bottom:.6rem;color:var(--red-deep);display:block}
.cq-item:nth-child(3) .cq-icon{color:var(--gold-l)}
.cq-title{font:400 1.3rem/1 var(--f-display);text-transform:uppercase;color:var(--ink);margin-bottom:.5rem}
.cq-body{font-size:.92rem;line-height:1.7;color:#3a2c26}.cq-body strong{color:var(--ink)}
.strikes-wrap{margin-bottom:3rem}
.strikes-title{font:400 clamp(1.8rem,4vw,2.8rem)/1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:1.2rem}
.strikes-list{display:flex;flex-direction:column;gap:.8rem;counter-reset:sk}
.sk{display:flex;align-items:stretch;background:var(--surface);border:2px solid var(--line-strong);transition:transform .14s var(--ease),box-shadow .14s var(--ease);position:relative;overflow:hidden}
.sk:nth-child(n){margin-left:calc((var(--i,0))*0px)}
.sk:hover{transform:translateX(5px);box-shadow:-6px 0 0 var(--red)}
.sk-num{font:400 1.05rem var(--f-display);letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:1.1rem 1rem;white-space:nowrap;flex:0 0 7.2rem;display:flex;align-items:center;justify-content:center;border-right:3px solid var(--ink-0);background:var(--olive)}
.sk-num.s1{background:#6f7a52}.sk-num.s2{background:#a68a2c}.sk-num.s3{background:#c26a1c}.sk-num.s4{background:#d4402a}.sk-num.s5{background:var(--red)}.sk-num.s6{background:var(--ink-0);color:var(--gold)}
.sk-body{padding:1rem 1.3rem}
.sk-body h4{font:400 1.25rem/1.1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.35rem}
.sk.s5 .sk-body h4{color:var(--accent)}
.sk.s6{background:repeating-linear-gradient(-45deg,var(--surface) 0 16px,var(--surface2) 16px 32px)}
.sk.s6 .sk-body h4{color:var(--red-hot)}
.sk-body p{font-size:.95rem;line-height:1.75;color:var(--text-dim)}
.notice-box{position:relative;margin-bottom:1.6rem;padding:1.3rem 1.5rem 1.3rem 2rem;background:var(--surface);border:2px solid var(--line-strong);overflow:hidden}
.notice-box::before{content:'';position:absolute;left:0;top:0;bottom:0;width:12px;background:repeating-linear-gradient(-45deg,var(--gold) 0 8px,var(--ink-0) 8px 16px)}
.notice-tag{font:700 .8rem var(--f-label);letter-spacing:.24em;color:var(--gold-l);text-transform:uppercase;margin-bottom:.4rem}
[data-theme="light"] .notice-tag{color:var(--accent)}
.notice-body{font-size:1rem;line-height:1.8;color:var(--text-dim)}
.appeal-split{margin-bottom:1.6rem;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--line-strong);background:var(--surface)}
.as-cell{padding:1.4rem 1.6rem}
.as-cell+.as-cell{border-left:2px solid var(--line-strong)}
.as-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.6rem;color:var(--accent)}
.as-tag{font:400 1.25rem var(--f-display);text-transform:uppercase;letter-spacing:.03em}
.as-cell p{font-size:.95rem;color:var(--text-dim);line-height:1.75;margin:0}
.questions-box{position:relative;background:var(--surface);border:2px solid var(--line-strong);padding:2.2rem 1.8rem;text-align:left;box-shadow:6px 6px 0 var(--hard);margin-bottom:1.6rem;overflow:hidden}
.questions-box::after{content:'';position:absolute;right:-30px;top:-30px;width:150px;height:150px;background:var(--red);opacity:.12;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.qb-icon{color:var(--accent);margin-bottom:.8rem;display:flex}
.qb-title{font:400 clamp(1.5rem,3vw,2.1rem)/1.05 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.7rem}
.qb-body{font-size:1rem;color:var(--text-dim);line-height:1.8;max-width:560px;margin:0 0 1.4rem}
.appeal-cta{background:var(--tag-bg)}
.appeal-cta .btn{margin-right:.8rem;margin-top:.3rem}

/* ── gallery ────────────────────────────────────────────────────────────── */
.gal-folders-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.4rem;margin-top:1.4rem}
.gal-folder{position:relative;background:var(--surface);border:2px solid var(--line-strong);padding:1.6rem 1.3rem 1.3rem;cursor:pointer;overflow:hidden;transition:transform .14s var(--ease),box-shadow .14s var(--ease);min-height:170px;display:flex;flex-direction:column;justify-content:flex-end}
.gal-folder::before{content:'';position:absolute;top:0;left:1.3rem;width:46px;height:100%;background:var(--accent-fill);clip-path:polygon(0 0,100% 0,100% 82%,50% 100%,0 82%);opacity:.9}
.gal-folder::after{content:'';position:absolute;inset:0;background:var(--cloud-c);opacity:.07;-webkit-mask:var(--g-cloud) 0 0/110px 70px;mask:var(--g-cloud) 0 0/110px 70px;pointer-events:none}
.gal-folder:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--hard)}
.gal-folder-icon{position:absolute;top:.85rem;left:1.3rem;width:46px;display:flex;justify-content:center;color:#fff;z-index:1}
.gal-folder-icon .icon-xl{width:1.6rem;height:1.6rem;color:#fff}
.gal-folder-name{position:relative;z-index:1;font:400 1.35rem/1.05 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.4rem;padding-left:0}
.gal-folder-count{position:relative;z-index:1;font:700 .8rem var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.gal-folder-view{margin-top:1.8rem}
.gal-folder-header{display:flex;align-items:center;gap:1.2rem;margin-bottom:1.6rem;padding-bottom:1rem;border-bottom:3px solid var(--red);flex-wrap:wrap}
.gal-back-btn{display:flex;align-items:center;gap:.45rem;background:var(--surface);border:2px solid var(--line-strong);color:var(--text);padding:.5rem 1rem;font:700 .85rem var(--f-label);letter-spacing:.16em;cursor:pointer;text-transform:uppercase;transition:background .15s,color .15s}
.gal-back-btn:hover{background:var(--red);border-color:var(--ink-0);color:#fff}
.gal-folder-header h3{font:400 clamp(1.5rem,3vw,2.2rem)/1 var(--f-display);text-transform:uppercase;color:var(--text)}
.gal-folder-empty{text-align:center;padding:4rem 2rem;background:var(--surface);border:2px dashed var(--line-strong)}
.gal-folder-empty .gal-empty-icon{color:var(--accent);opacity:.5;display:flex;justify-content:center;margin-bottom:.85rem}
.gal-folder-empty p{font:400 1.3rem var(--f-display);text-transform:uppercase;color:var(--text-dim);margin-top:.4rem}
.gal-folder-empty .gal-empty-sub{font:400 .95rem var(--f-body);text-transform:none;color:var(--text-muted);margin-top:.5rem}
.gal-images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}
.gal-img-thumb{position:relative;overflow:hidden;border:2px solid var(--line-strong);cursor:pointer;background:var(--surface);transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.gal-img-thumb:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--hard)}
.gal-img-thumb img{width:100%;height:180px;object-fit:cover;display:block;transition:transform .5s}
.gal-img-thumb:hover img{transform:scale(1.06)}
.gal-img-thumb-caption{padding:.6rem .8rem;font:700 .8rem var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);text-overflow:ellipsis;overflow:hidden;white-space:nowrap;border-top:2px solid var(--line-strong)}
.gal-lightbox-ov{position:fixed;inset:0;background:rgba(7,5,6,.95);z-index:2000;display:none;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.gal-lightbox-ov.open{display:flex;animation:fi .2s ease}
.gal-lightbox{position:relative;max-width:92vw;max-height:92vh;display:flex;flex-direction:column;align-items:center}
.gal-lb-close{position:absolute;top:-2.8rem;right:0;background:var(--ink-0);border:2px solid rgba(255,255,255,.5);color:#fff;width:36px;height:36px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.gal-lb-close:hover{background:var(--red)}
.gal-lb-img-wrap{display:flex;align-items:center;justify-content:center}
.gal-lb-img-wrap img{max-width:78vw;max-height:68vh;object-fit:contain;display:block;border:3px solid var(--paper);box-shadow:8px 8px 0 var(--red)}
.gal-lb-prev,.gal-lb-next{position:fixed;top:50%;transform:translateY(-50%);background:var(--ink-0);border:2px solid rgba(255,255,255,.4);color:#fff;width:48px;height:48px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;z-index:10}
.gal-lb-prev{left:1rem}.gal-lb-next{right:1rem}
.gal-lb-prev:hover,.gal-lb-next:hover{background:var(--red)}
.gal-lb-info{margin-top:1.2rem;text-align:center}
.gal-lb-title{font:400 1.3rem var(--f-display);text-transform:uppercase;color:#fff;margin-bottom:.7rem}
.gal-lb-downloads{display:flex;align-items:center;gap:.6rem;justify-content:center;flex-wrap:wrap}
.gal-lb-dl-label{font:700 .8rem var(--f-label);letter-spacing:.18em;color:rgba(255,255,255,.6);text-transform:uppercase}
.gal-lb-dl-btn{padding:.4rem .9rem;font:700 .8rem var(--f-label);letter-spacing:.14em;text-transform:uppercase;border:2px solid var(--gold);color:var(--gold-l);background:transparent;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:.35rem}
.gal-lb-dl-btn:hover{background:var(--gold);color:var(--ink-0)}
.gal-lb-counter{font:700 .8rem var(--f-label);letter-spacing:.16em;color:rgba(255,255,255,.5);margin-top:.5rem}

/* ── characters: trading-card panels ────────────────────────────────────── */
.ch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:1.6rem}
.ch{position:relative;display:grid;grid-template-columns:118px 1fr;gap:1.1rem;background:var(--surface);border:2px solid var(--line-strong);padding:1.1rem;overflow:hidden;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.ch::before{content:'';position:absolute;right:-26px;bottom:-26px;width:110px;height:110px;background:var(--red);opacity:.16;transform:rotate(45deg)}
.ch:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--hard)}
.ch-img{width:118px;height:150px;object-fit:cover;object-position:top;border:3px solid var(--ink-0);outline:2px solid var(--gold);outline-offset:-7px;background:var(--surface2)}
.ch-info{position:relative;z-index:1}
.ch-info h3{font:400 1.7rem/1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.2rem}
.ch-info .ct{font:700 .85rem var(--f-jp);color:var(--accent);margin-bottom:.55rem;letter-spacing:.06em}
.ch-info .ct rt{font-size:.6em;color:var(--accent);user-select:none}
.ch-info p{font-size:.9rem;line-height:1.7;color:var(--text-dim)}
.ch-tag{display:inline-block;padding:.2rem .6rem;background:var(--accent-fill);color:#fff;border:2px solid var(--ink-0);font:700 .72rem var(--f-label);letter-spacing:.16em;text-transform:uppercase;margin-top:.6rem;transform:rotate(-1.5deg)}

/* ── info ───────────────────────────────────────────────────────────────── */
.ls-sec{margin-bottom:2rem}
.ls-sec h3{font:700 .9rem var(--f-label);letter-spacing:.24em;color:var(--accent);text-transform:uppercase;margin-bottom:.9rem;padding-bottom:.45rem;border-bottom:2px solid var(--line)}
.sl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.9rem}
.sl{display:flex;align-items:center;gap:.85rem;padding:.85rem 1rem;background:var(--surface);border:2px solid var(--line-strong);color:var(--text);transition:transform .14s var(--ease),box-shadow .14s var(--ease),background .14s}
.sl:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--hard);background:var(--surface2)}
.sl-ico{color:#fff;background:var(--accent-fill);display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:2px solid var(--ink-0)}
.sl-name{font:400 1.1rem/1 var(--f-display);text-transform:uppercase;color:var(--text)}
.sl-sub{font-size:.8rem;color:var(--text-muted);margin-top:.15rem}
.au-card{display:flex;gap:1.8rem;align-items:center;padding:1.8rem;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--red);margin-bottom:2.5rem}
.au-img{width:150px;height:150px;object-fit:cover;border:3px solid var(--ink);outline:2px solid var(--red);outline-offset:-8px;flex-shrink:0;filter:grayscale(.2) contrast(1.05)}
.au-info h3{font:400 2.1rem/1 var(--f-display);text-transform:uppercase;color:var(--red-deep)}
.au-info .au-jp{font:400 1rem var(--f-jp);color:#5a463c;margin:.2rem 0 .8rem;letter-spacing:.2em}
.au-info p{font-size:.96rem;line-height:1.8;margin-bottom:1rem;color:#2b201c}
.au-links{display:flex;gap:.8rem;flex-wrap:wrap}

/* ── staff ──────────────────────────────────────────────────────────────── */
.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.4rem;margin-bottom:2.2rem}
.sc{position:relative;background:var(--surface);border:2px solid var(--line-strong);overflow:hidden;text-align:left;cursor:pointer;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.sc:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--hard)}
.sc-av-wrap{width:100%;height:170px;overflow:hidden;position:relative;background:var(--surface2);display:flex;align-items:center;justify-content:center;flex-shrink:0;border-bottom:3px solid var(--ink-0)}
.sc-av-wrap::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle,rgba(0,0,0,.35) 0 1px,transparent 1.5px) 0 0/5px 5px;opacity:.5}
.sc-av-wrap img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:saturate(.85);transition:filter .3s,transform .5s}
.sc:hover .sc-av-wrap img{filter:saturate(1.1);transform:scale(1.06)}
.sc-av-initials{font:400 4rem var(--f-display);color:var(--accent);opacity:.8;transition:transform .5s}
.sc:hover .sc-av-initials{transform:scale(1.08)}
.sc-av-live{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;filter:saturate(.85);opacity:0;transition:opacity .45s ease,filter .3s,transform .5s}
.sc-av-live.loaded{opacity:1}
.sc-body{padding:.95rem 1rem 3rem}
.sc-role{display:inline-block;background:var(--accent-fill);color:#fff;font:700 .72rem var(--f-label);letter-spacing:.18em;text-transform:uppercase;padding:.15rem .5rem;margin-bottom:.5rem;transform:rotate(-1deg)}
.sc-name{font:400 1.45rem/1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.2rem}
.sc-handle{font-size:.85rem;color:var(--text-muted)}
.sc-view{position:absolute;bottom:0;left:0;right:0;background:var(--ink-0);color:var(--gold-l);font:700 .8rem var(--f-label);letter-spacing:.2em;text-transform:uppercase;padding:.6rem;text-align:center;border:0;border-top:2px solid var(--gold);cursor:pointer;width:100%;transition:background .15s}
.sc:hover .sc-view{background:var(--red);color:#fff}
.sc-status-dot{position:absolute;bottom:8px;right:8px;width:16px;height:16px;border-radius:50%;border:3px solid var(--surface);background:transparent;box-shadow:inset 0 0 0 2px #80848e;z-index:2;overflow:hidden;transition:background .3s,box-shadow .3s}
.sc-status-dot.online{background:#57F287;box-shadow:none}.sc-status-dot.dnd{background:#ED4245;box-shadow:none}.sc-status-dot.idle{background:#FEE75C;box-shadow:none}
.sc-status-dot.idle::after{content:'';position:absolute;top:-18%;left:-18%;width:75%;height:75%;border-radius:50%;background:var(--surface)}
.sc-status-dot.dnd::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58%;height:23%;background:#fff;border-radius:2px}

/* ── staff modal ────────────────────────────────────────────────────────── */
.dc-modal-ov{display:none;position:fixed;inset:0;z-index:1500;align-items:center;justify-content:center;padding:1rem;background:var(--modal-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overscroll-behavior:contain}
.dc-modal-ov.open{display:flex;animation:dcFade .2s ease}
.dc-modal-ov.open .dc-modal-card{animation:dcPop .26s var(--ease-snap)}
@keyframes dcFade{from{opacity:0}to{opacity:1}}
@keyframes dcPop{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
.dc-modal-card{position:relative;width:100%;max-width:480px;display:flex;max-height:calc(100dvh - 2rem)}
.dc-staff-modal{background:var(--surface);border:2px solid var(--line-strong);box-shadow:10px 10px 0 var(--hard);width:100%;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;position:relative}
.dc-staff-modal::-webkit-scrollbar{width:5px}
.dc-sm-banner{height:165px;position:relative;overflow:hidden;flex-shrink:0;border-bottom:3px solid var(--ink-0)}
.dc-sm-banner-real{width:100%;height:100%;object-fit:cover;display:block}
.dc-sm-banner-fallback{width:100%;height:100%;background:var(--header-bg) center/cover no-repeat;position:relative;display:flex;align-items:center;justify-content:center}
.dc-sm-banner-fallback::before{content:'';position:absolute;inset:0;background:rgba(7,5,6,.62)}
.dc-sm-banner-nobanner{position:relative;z-index:1;font:700 .75rem var(--f-label);letter-spacing:.26em;color:rgba(255,255,255,.55);text-transform:uppercase;border:2px solid rgba(255,255,255,.3);padding:.3rem .8rem}
.dc-sm-banner-loading{width:100%;height:100%;background:var(--surface2);display:flex;align-items:center;justify-content:center}
.dc-sm-banner-loading::after{content:'';width:24px;height:24px;border:3px solid var(--line);border-top-color:var(--red);border-radius:50%;animation:spin .7s linear infinite}
.dc-sm-close{position:absolute;top:.8rem;right:.8rem;z-index:10;padding:0;background:var(--ink-0);border:2px solid rgba(255,255,255,.45);color:#fff;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.dc-sm-close:hover{background:var(--red)}
.dc-sm-avatar-row{display:flex;align-items:flex-end;justify-content:space-between;padding:0 1.3rem;margin-top:-52px;position:relative;z-index:2;margin-bottom:.6rem}
.dc-sm-avatar-wrap{position:relative;flex-shrink:0}
.dc-sm-avatar{width:98px;height:98px;border-radius:50%;border:6px solid var(--surface);outline:3px solid var(--red);overflow:hidden;background:var(--surface2);display:flex;align-items:center;justify-content:center;font:400 2.2rem var(--f-display);color:var(--accent)}
.dc-sm-avatar img{width:100%;height:100%;object-fit:cover}
.dc-sm-status-dot{position:absolute;bottom:6px;right:6px;width:20px;height:20px;border-radius:50%;border:4px solid var(--surface);background:transparent;box-shadow:inset 0 0 0 2.5px #80848e;overflow:hidden}
.dc-sm-status-dot.online{background:#57F287;box-shadow:none}.dc-sm-status-dot.dnd{background:#ED4245;box-shadow:none}.dc-sm-status-dot.idle{background:#FEE75C;box-shadow:none}
.dc-sm-status-dot.idle::after{content:'';position:absolute;top:-18%;left:-18%;width:75%;height:75%;border-radius:50%;background:var(--surface)}
.dc-sm-status-dot.dnd::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58%;height:23%;background:#fff;border-radius:2px}
.dc-sm-status-bar{position:relative;display:none;align-items:center;margin:.6rem 1.3rem .3rem;padding:.6rem .9rem;background:var(--paper);color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--hard);font-size:.88rem;line-height:1.45}
.dc-sm-status-bar::before{content:'';position:absolute;top:-9px;left:26px;width:14px;height:14px;background:var(--paper);border-top:2px solid var(--ink);border-left:2px solid var(--ink);transform:rotate(45deg)}
.dc-sm-status-indicator{display:inline-flex;align-items:center;gap:.3rem;font:700 .75rem var(--f-label);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;margin-right:.5rem}
.dc-sm-status-indicator::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--si-color,#747f8d);flex-shrink:0}
.dc-sm-status-indicator.online{--si-color:#2fb85f;color:#1f8c47}.dc-sm-status-indicator.idle{--si-color:#c9a400;color:#8a6f00}.dc-sm-status-indicator.dnd{--si-color:#ED4245;color:#b42125}.dc-sm-status-indicator.offline{--si-color:#747f8d;color:#5c5c66}
.dc-sm-custom-text{color:var(--ink)}
.dc-sm-badges{display:flex;gap:.4rem;flex-wrap:wrap;align-items:flex-end;padding-bottom:.55rem}
.dc-sm-badge{font:700 .72rem var(--f-label);letter-spacing:.14em;text-transform:uppercase;padding:.25rem .65rem;border:2px solid var(--gold);color:var(--gold-l);background:var(--ink-0)}
.dc-sm-body{padding:.2rem 1.3rem 1.5rem}
.dc-sm-name{font:400 2rem/1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.25rem}
.dc-sm-handle-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.dc-sm-handle{font-size:.9rem;color:var(--text-muted)}
.dc-sm-uid{font:400 .72rem var(--f-mono);color:var(--text-muted);background:var(--surface2);padding:.1rem .45rem;border:1px solid var(--line)}
.dc-sm-divider{height:2px;background:var(--line);margin:.95rem 0}
.dc-sm-label{font:700 .72rem var(--f-label);letter-spacing:.22em;color:var(--accent);text-transform:uppercase;margin-bottom:.35rem;display:block}
.dc-sm-val{font-size:.96rem;color:var(--text-dim);line-height:1.75;white-space:pre-wrap}
.dc-sm-field{margin-bottom:.9rem}.dc-sm-field:last-child{margin-bottom:0}
.dc-sm-meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.dc-sm-meta-item{background:var(--surface2);padding:.6rem .75rem;border:2px solid var(--line)}
.dc-sm-meta-label{font:700 .68rem var(--f-label);letter-spacing:.18em;color:var(--text-muted);text-transform:uppercase;margin-bottom:.18rem}
.dc-sm-meta-val{font-size:.9rem;color:var(--text);font-weight:700}
.dc-sm-roles{display:flex;flex-wrap:wrap;gap:.4rem}
.dc-sm-role,.dc-sm-role-live{font:700 .75rem var(--f-label);letter-spacing:.08em;text-transform:uppercase;padding:.25rem .62rem;border-radius:0;display:inline-flex;align-items:center;gap:.32rem}
.dc-sm-role::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}
.dc-sm-role-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dc-sm-role-admin{background:rgba(226,178,74,.18);color:#E2B24A;border:2px solid rgba(226,178,74,.55)}
.dc-sm-role-mod{background:rgba(88,101,242,.18);color:#9aa4ff;border:2px solid rgba(88,101,242,.5)}
.dc-sm-role-trialmod{background:rgba(120,160,220,.18);color:#9db9ea;border:2px solid rgba(120,160,220,.45)}
.dc-sm-role-founder{background:rgba(212,34,44,.2);color:#ff7a80;border:2px solid rgba(212,34,44,.55)}
.dc-sm-role-member{background:rgba(130,130,160,.15);color:#b3b3cc;border:2px solid rgba(130,130,160,.4)}
.dc-sm-roles-loading{font-size:.9rem;color:var(--text-muted);font-style:italic}
.dc-sm-nav{display:none!important}
@keyframes _smSlideR{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes _smSlideL{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.dc-staff-modal.sm-slide-r{animation:_smSlideR .22s ease forwards}.dc-staff-modal.sm-slide-l{animation:_smSlideL .22s ease forwards}
.th-img-drop{border:3px dashed var(--in-border);background:var(--in-bg);padding:1.5rem 1rem;text-align:center;cursor:pointer;transition:border-color .2s;min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.th-img-drop:hover{border-color:var(--red)}
.th-img-thumb-mini{width:60px;height:60px;object-fit:cover;border:2px solid var(--line)}

/* ── apply / forms / gates ──────────────────────────────────────────────── */
.apply-wrap{max-width:780px;margin:0 auto}
.gate{position:relative;text-align:center;padding:2.8rem 1.6rem;background:var(--surface);border:3px dashed var(--line-strong)}
.gate-ico{color:var(--accent);display:flex;justify-content:center;margin-bottom:.9rem}
.gate h3{font:400 clamp(1.6rem,3.4vw,2.3rem)/1.05 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.6rem}
.gate p{font-size:1rem;color:var(--text-dim);line-height:1.8;max-width:480px;margin:0 auto 1.3rem}
.gate .btn{margin:.3rem .5rem}
.th-readonly{background:var(--surface2)!important;border-color:var(--line)!important;color:var(--text-dim)!important;cursor:default!important;opacity:1!important}
.th-readonly:focus{box-shadow:none!important}
.th-autofill-notice{display:flex;align-items:center;gap:.6rem;font-size:.92rem;color:var(--text);margin-bottom:1.1rem;padding:.65rem .9rem;background:var(--tag-bg);border-left:6px solid var(--red)}
.th-autofill-notice span{color:var(--red)}
.af-intro{margin-bottom:1.8rem;padding:1.2rem 1.5rem}
.af-intro p{font-size:.98rem;line-height:1.75;color:#2b201c}
.af-rule{border-top:2px dashed var(--line-strong);margin:1.4rem 0;opacity:.6}
.af-role-title{font:400 1.5rem/1 var(--f-display);text-transform:uppercase;color:var(--accent);margin-bottom:1.2rem}
.af .fr{margin-bottom:1.3rem}
.af label{display:block;font:700 .8rem var(--f-label);letter-spacing:.14em;color:var(--accent);margin-bottom:.45rem;text-transform:uppercase;line-height:1.5}
.af input,.af select,.af textarea{width:100%;background:var(--in-bg);border:2px solid var(--in-border);color:var(--text);font:400 1rem/1.5 var(--f-body);padding:.8rem 1rem;border-radius:0;transition:border-color .15s,box-shadow .15s}
.af input:focus,.af select:focus,.af textarea:focus{outline:none;border-color:var(--red);box-shadow:4px 4px 0 var(--hard)}
.af select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23D4222C' fill='none' stroke-width='2.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}
.af textarea{min-height:120px;resize:vertical}
.af .fhint{font-size:.85rem;color:var(--text-muted);margin-top:.3rem}
.af .fg{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.apply-ok{display:none;text-align:center;padding:3rem 1.5rem;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--red)}
.apply-ok .ao-ico{color:#1f8c47;display:flex;justify-content:center;margin-bottom:.9rem}
.apply-ok h3{font:400 clamp(1.8rem,4vw,2.6rem)/1 var(--f-display);text-transform:uppercase;color:var(--red-deep);margin-bottom:.6rem}
.apply-ok p{font-size:1rem;color:#2b201c;line-height:1.8;max-width:520px;margin:0 auto}
.form-member-locked input:not(.th-readonly),.form-member-locked select,.form-member-locked textarea,.form-member-locked .th-img-drop,.form-member-locked .th-check-row input,.form-member-locked .th-submit-btn,.form-member-locked button[type=submit]{opacity:.35;pointer-events:none;user-select:none;cursor:not-allowed}
.form-gate-banner{display:none;align-items:center;gap:.7rem;background:var(--tag-bg);border:2px solid var(--red);padding:.9rem 1.1rem;margin-bottom:1rem}
.form-gate-banner.visible{display:flex}
.form-gate-banner span{font-size:.98rem;color:var(--text)}
.form-gate-banner a{color:var(--accent);text-decoration:underline;font-weight:700}

/* ── discord widget ─────────────────────────────────────────────────────── */
.dc-wgt-v2{background:var(--surface);border:2px solid var(--line-strong);box-shadow:5px 5px 0 var(--hard);padding:1.2rem 1.5rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.dc-wgt-v2-left{flex:1;min-width:170px}
.dc-wgt-v2-title{font:400 1.3rem var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.3rem}
.dc-wgt-v2-count{display:flex;align-items:center;gap:.5rem;font-size:.95rem;color:var(--text-dim)}
.dc-wgt-v2-count .od{width:10px;height:10px;border-radius:50%;background:var(--ok);flex-shrink:0;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(87,242,135,.55)}50%{box-shadow:0 0 0 6px rgba(87,242,135,0)}}

/* ── stats & offers ─────────────────────────────────────────────────────── */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-bottom:1rem}
.stat-card{position:relative;background:var(--surface);border:2px solid var(--line-strong);padding:1.5rem 1.2rem 1.3rem;overflow:hidden;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.stat-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle,var(--tone) 0 1.1px,transparent 1.6px) 0 0/7px 7px;opacity:.16;-webkit-mask-image:linear-gradient(200deg,#000,transparent 60%);mask-image:linear-gradient(200deg,#000,transparent 60%);pointer-events:none}
.stat-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--hard)}
.stat-icon{color:var(--accent);margin-bottom:.4rem;position:relative;display:flex}
.stat-val{position:relative;font:400 clamp(2.8rem,5vw,4rem)/1 var(--f-display);color:var(--text);text-shadow:3px 3px 0 var(--hard);margin-bottom:.4rem}
.stat-label{position:relative;font:700 .8rem var(--f-label);letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
.offer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.3rem;margin-bottom:2rem}
.offer-card{position:relative;background:var(--surface);border:2px solid var(--line-strong);padding:1.6rem 1.5rem 1.5rem;transition:transform .14s var(--ease),box-shadow .14s var(--ease);overflow:hidden}
.offer-card:nth-child(odd){transform:rotate(-.4deg)}.offer-card:nth-child(even){transform:rotate(.4deg)}
.offer-card:hover{transform:translate(-3px,-3px) rotate(0);box-shadow:6px 6px 0 var(--hard)}
.offer-card::after{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:var(--red)}
.offer-icon{color:var(--accent);margin-bottom:.6rem}
.offer-card h4{font:400 1.45rem/1.05 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.55rem}
.offer-card p{font-size:.96rem;line-height:1.75;color:var(--text-dim)}
.read-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin-top:1.4rem}
.rc{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--red);transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.rc:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--red)}
.rc-ico{color:var(--red-deep);flex-shrink:0;display:flex;align-items:center}
.rc-title{font:400 1.3rem/1 var(--f-display);text-transform:uppercase;color:var(--ink)}
.rc-sub{font-size:.85rem;color:#4a3a33;margin-top:.15rem}

/* ── back to top / toast ────────────────────────────────────────────────── */
#back-to-top{position:fixed;bottom:1.8rem;right:1.5rem;z-index:500;width:48px;height:48px;background:var(--accent-fill);color:#fff;border:2px solid var(--ink-0);box-shadow:4px 4px 0 var(--gold);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(12px);transition:opacity .25s,transform .25s;pointer-events:none}
[data-theme="light"] #back-to-top{box-shadow:4px 4px 0 var(--ink)}
#back-to-top.visible{opacity:1;transform:none;pointer-events:auto}
#back-to-top:hover{background:var(--red-hot)}
#toast{position:fixed;bottom:5.6rem;right:1.3rem;z-index:2000;background:var(--paper);color:var(--ink);border:3px solid var(--ink);border-left:12px solid var(--ok);padding:.8rem 1.2rem;font:700 .9rem var(--f-label);letter-spacing:.1em;text-transform:uppercase;box-shadow:5px 5px 0 var(--hard);opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;pointer-events:none;max-width:300px}
#toast.show{opacity:1;transform:none}
#toast.err{border-left-color:var(--bad)}

/* ── mobile nav ─────────────────────────────────────────────────────────── */
.mob-bar,.mob-drawer,.mob-drawer-ov{display:none}
.mob-drawer-ov{position:fixed;inset:0;background:rgba(7,5,6,.8);z-index:998}
.mob-drawer-ov.open{display:block}
.mob-drawer{position:fixed;top:0;left:0;width:84%;max-width:380px;height:100%;background:var(--bg);border-right:4px solid var(--red);transform:translateX(-100%);transition:transform .3s var(--ease);z-index:999;flex-direction:column;overflow:visible;background-image:radial-gradient(circle at 100% 0,rgba(212,34,44,.2),transparent 60%)}
.mob-drawer.open{transform:none}
.mob-drawer-hdr{display:flex;justify-content:space-between;align-items:center;padding:1.1rem 1.3rem;border-bottom:3px solid var(--ink-0);background:var(--red-deep)}
.mob-drawer-title{font:400 1.3rem var(--f-display);letter-spacing:.12em;color:#fff;text-transform:uppercase}
.mob-drawer-close{background:var(--ink-0);border:2px solid rgba(255,255,255,.4);color:#fff;width:38px;height:38px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.mob-nav-list{list-style:none;flex:1;overflow-y:auto;overflow-x:visible}
.mob-nav-item{border-bottom:2px solid var(--line);cursor:pointer}
.mob-nav-label,.mob-nav-row{display:flex;justify-content:space-between;align-items:center;padding:1.15rem 1.4rem;font:400 1.55rem var(--f-display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);cursor:pointer}
.mob-nav-item.active{background:var(--tag-bg);box-shadow:inset 8px 0 0 var(--red)}
.mob-nav-item.active .mob-nav-label{color:var(--text)}
.mob-nav-arrow{font-size:1rem;transition:transform .2s}
.mob-nav-item.sub-open .mob-nav-arrow{transform:rotate(180deg)}
.mob-sub-list{display:none;background:var(--surface)}
.mob-sub-item{padding:1rem 2rem;font:700 1rem var(--f-label);letter-spacing:.2em;text-transform:uppercase;border-top:2px solid var(--line);color:var(--text-muted);cursor:pointer}
.mob-sub-item:hover{color:var(--accent)}
.mob-drawer-ctrl{border-top:3px solid var(--ink-0);padding:1.1rem 1.4rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;overflow:visible;position:relative}

/* ── footer ─────────────────────────────────────────────────────────────── */
#ft{position:relative;z-index:1;margin-top:2rem;background:var(--ink-0);color:#EFE4D0;border-top:5px solid var(--red);padding:5rem var(--gutter) 0;overflow:hidden}
#ft::before{content:'';position:absolute;left:0;right:0;top:0;height:46px;background:var(--red);opacity:.9;-webkit-mask:var(--g-cloud) 0 0/80px 50px repeat-x;mask:var(--g-cloud) 0 0/80px 50px repeat-x;opacity:.55}
#ft::after{content:'極楽街';position:absolute;right:-1rem;bottom:-2.6rem;font:400 clamp(9rem,26vw,22rem)/1 var(--f-jp);color:var(--red);opacity:.08;pointer-events:none;white-space:nowrap}
.ft-grid{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr .9fr .9fr 1fr;gap:2.4rem 3rem;padding-bottom:3rem}
.ft-col-brand{font:400 2.1rem/1 var(--f-display);color:var(--paper);letter-spacing:.04em;margin-bottom:.9rem}
.ft-col-desc{font-size:.9rem;color:#b9ab95;line-height:1.75;max-width:260px}
.ft-col-title,.ft-disc-label{font:700 .85rem var(--f-label);letter-spacing:.24em;color:var(--gold-l);text-transform:uppercase;padding-bottom:.6rem;margin-bottom:.9rem;border-bottom:2px solid rgba(255,255,255,.14)}
.ft-disc-label{margin-top:1.5rem}
.ft-col ul{list-style:none}
.ft-col ul li{margin-bottom:.35rem}
.ft-col ul a{font-size:.92rem;color:#d9ccb6;display:flex;align-items:center;gap:.4rem;padding:.12rem 0;transition:color .15s,transform .15s}
.ft-col ul a:hover{color:#fff;transform:translateX(4px)}
.ft-col ul a::before{content:'';width:7px;height:7px;background:var(--red);transform:rotate(45deg);flex-shrink:0}
.ft-disc-btn{display:inline-flex;align-items:center;background:var(--blurple);color:#fff;font:700 .85rem var(--f-label);letter-spacing:.18em;text-transform:uppercase;padding:.7rem 1.2rem;border:2px solid #000;box-shadow:4px 4px 0 var(--red);transition:transform .12s,box-shadow .12s}
.ft-disc-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--red)}
.ft-divider{display:none}
#ft .ad-slot{position:relative;z-index:1;max-width:var(--maxw)}
.ft-bottom{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:1.2rem 0 1.6rem;flex-wrap:wrap;gap:.5rem;border-top:2px solid rgba(255,255,255,.14)}
.ft-copy,.ft-rights{font-size:.82rem;color:#b9ab95}
.ft-rights a{color:#d9ccb6!important;font-size:inherit!important;text-decoration:none!important}
.ft-rights a:hover{color:#fff!important;text-decoration:underline!important}

/* ── responsive ─────────────────────────────────────────────────────────── */
@media(max-width:1100px){.ft-grid{grid-template-columns:1fr 1fr 1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .about-g{grid-template-columns:1fr;gap:2rem}.synopsis{transform:none}
  .rules-card-grid{grid-template-columns:1fr}
  .consequences-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  #nav{display:none!important}
  .mob-bar{display:flex!important;position:sticky;top:var(--cd-bar-h,0px);z-index:500;align-items:center;justify-content:space-between;padding:.6rem 1.1rem;background:var(--nav-bg);border-bottom:3px solid var(--red);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
  .mob-bar-label{font:400 1.2rem var(--f-display);letter-spacing:.18em;color:var(--text);text-transform:uppercase}
  .mob-menu-btn{background:var(--accent-fill);border:2px solid var(--ink-0);box-shadow:3px 3px 0 var(--hard);color:#fff;width:44px;height:44px;cursor:pointer;display:flex;align-items:center;justify-content:center}
  .mob-drawer{display:flex!important}
  .mob-drawer-ov.open{display:block!important}
  #content{padding:2rem var(--gutter) 4rem}
  #hdr{min-height:340px}
  .hdr-plate{padding:1.1rem 1.2rem .8rem}.hdr-tag{letter-spacing:.24em;font-size:.75rem}
  .glitch-wrap{height:66px;min-width:210px}
  .logo-en-gl,.logo-jp-gl,.gl-r img,.gl-b img{max-height:70px}
  .staff-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem}
  .sc-av-wrap{height:150px}
  .ft-grid{grid-template-columns:1fr 1fr}
  .ft-bottom{padding-bottom:5rem}
}
@media(max-width:640px){
  .appeal-split{grid-template-columns:1fr}.as-cell+.as-cell{border-left:0;border-top:2px solid var(--line-strong)}
  .offer-grid{grid-template-columns:1fr}.offer-card:nth-child(n){transform:none}
  .ch-grid{grid-template-columns:1fr}
  .af .fg{grid-template-columns:1fr}
  .au-card{flex-direction:column;align-items:flex-start}
  .sk{flex-direction:column}.sk-num{flex:none;border-right:0;border-bottom:3px solid var(--ink-0);justify-content:flex-start;padding:.5rem 1rem}
  .dc-sm-meta-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .nav-in{padding:0 .3rem}.dc-uname{display:none}
  .staff-grid{grid-template-columns:repeat(2,1fr)}
  #back-to-top{bottom:1rem;right:1rem}
  .stat-val{font-size:2.6rem}
  .ft-grid{grid-template-columns:1fr}
  .cd-ev{display:none}
  .rule-card{padding-left:4.2rem}.rule-card::before{width:3rem;font-size:1.5rem}
  .gal-lb-img-wrap img{max-width:90vw}.gal-lb-prev,.gal-lb-next{width:40px;height:40px}
  .hdr-cta .btn{padding:.7rem 1rem}
}
@media(max-width:380px){.staff-grid{grid-template-columns:1fr 1fr}.cd-unit{min-width:38px}.cd-n{font-size:1.15rem}}