/* ═══════════════════════════════════════════════════════════════════════════
   GOKURAKUGAI — DOC PAGES  (assets/css/docs.css)
   about · faq · contact · community-guidelines · banned-words · modmail ·
   privacy-policy · terms-of-service · disclaimer
   Loaded AFTER gkg-core.css.  Each page sets <body class="pg-NAME">.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── TOP BAR ────────────────────────────────────────────────────────────── */
.topbar{position:sticky;top:0;z-index:120;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:var(--nav-h);padding:.5rem var(--gutter);background:var(--nav-bg);border-bottom:2px solid var(--ink-0);
  box-shadow:0 3px 0 var(--red);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
[data-theme="light"] .topbar{border-bottom-color:var(--ink)}
.topbar-left{display:flex;align-items:center;gap:.9rem;min-width:0}
.topbar-home{display:inline-flex;align-items:center;gap:.7rem;font:700 .8rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:var(--text);white-space:nowrap;transition:color .15s}
.topbar-home:hover{color:var(--accent)}
.topbar-home>svg{width:15px;height:15px;flex-shrink:0;transition:transform .15s var(--ease)}
.topbar-home:hover>svg{transform:translateX(-4px)}
.topbar-home .gk-stamps{font-size:.8rem}
.topbar-home .gk-stamp{border-width:1.5px;box-shadow:2px 2px 0 var(--hard-2)}
.topbar-sep{display:none}
.topbar-current{display:inline-block;padding:.45rem 1rem .5rem;background:var(--paper-tape);color:var(--paper-ink);
  font:400 .95rem/1 var(--f-display);letter-spacing:.06em;text-transform:uppercase;clip-path:var(--torn-a);transform:rotate(-1.2deg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}
.theme-btn{position:relative;display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .85rem;min-height:40px;background:var(--surface2);color:var(--text);
  border:2px solid var(--line-strong);cursor:pointer;font-size:0;box-shadow:3px 3px 0 var(--hard);transition:transform .12s var(--ease),box-shadow .12s var(--ease),background .15s;-webkit-tap-highlight-color:transparent}
.theme-btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--hard)}
.theme-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--hard)}
.tb-icon{width:16px;height:16px;flex-shrink:0;display:none;color:var(--gold)}
[data-theme="dark"] .icon-sun{display:block}[data-theme="light"] .icon-moon{display:block}
.tb-label{font:700 .74rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:var(--text)}
@media(max-width:560px){.topbar-home{letter-spacing:.1em;font-size:.72rem}.topbar-home .tb-text{display:none}.topbar-current{font-size:.8rem;max-width:34vw}.tb-label{display:none}.theme-btn{padding:.5rem .65rem}}

/* ── PAGE FRAME ─────────────────────────────────────────────────────────── */
.page{position:relative;z-index:1;display:flex;flex-direction:column;align-items:stretch;width:100%;max-width:var(--maxw);margin:0 auto;padding:1.6rem var(--gutter) 2.5rem}
.doc-layout{display:block;width:100%}
.doc-side{display:none}
.doc{width:100%;min-width:0}
main [id],.doc-section{scroll-margin-top:5.2rem}
.orn{display:none}

/* ── HERO — the "title page" panel ──────────────────────────────────────── */
.hero{position:relative;isolation:isolate;overflow:hidden;margin:0 0 2.2rem;padding:clamp(1.6rem,4vw,3rem) clamp(1.2rem,4vw,3rem) clamp(1.8rem,4vw,3rem);
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1rem,3vw,2.4rem);align-items:center;text-align:left;width:100%;max-width:none;
  background:linear-gradient(135deg,var(--red-dark) 0%,var(--red-deep) 48%,#a3141f 100%);color:#FFF6EA;
  border:3px solid var(--ink-0);box-shadow:8px 8px 0 var(--gold)}
[data-theme="light"] .hero{box-shadow:8px 8px 0 var(--ink);border-color:var(--ink)}
.hero::before,.hero::after{content:none}
.hero-cloud{position:absolute;inset:0;z-index:-2;background:var(--gold);opacity:.13;pointer-events:none;
  -webkit-mask:var(--g-cloud) 0 0/130px 82px repeat;mask:var(--g-cloud) 0 0/130px 82px repeat}
.hero .gk-speed{z-index:-1;opacity:.1}
.hero-corner{position:absolute;right:-2px;bottom:-2px;width:min(42%,360px);height:12px;z-index:0;
  background:repeating-linear-gradient(-45deg,var(--gold) 0 14px,var(--ink-0) 14px 28px);opacity:.95}
.lan{position:absolute;top:-6px;width:30px;aspect-ratio:44/76;background:url("/assets/ui/lantern.svg") center/contain no-repeat;transform-origin:50% 0;
  animation:gk-swing 5s ease-in-out infinite;pointer-events:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45));z-index:1}
.lan-a{right:clamp(.8rem,4vw,3rem)}.lan-b{right:clamp(3.6rem,9vw,7rem);width:22px;animation-delay:-1.8s;opacity:.9}
.hero-kanji{display:flex;gap:.45rem;margin:0;font-size:clamp(1.5rem,4.6vw,2.6rem);opacity:1;letter-spacing:0;color:inherit}
.hero-kanji .gk-stamp{background:#F1E8D8;color:var(--red-deep);border-color:var(--ink-0);box-shadow:4px 4px 0 var(--ink-0)}
.hero-kanji.vert{flex-direction:column}
.hero-body{min-width:0;position:relative}
.hero-kick{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.1rem;margin-bottom:1rem}
.hero-kick .gk-tape{font-size:1rem;background:var(--paper);color:var(--ink)}
.hero-kick .gk-tape.red{background:var(--ink-0);color:#FFF6EA}
.hero-path{font:600 .78rem/1 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,246,234,.78)}
.hero-title{font:400 clamp(2.5rem,8vw,5.6rem)/.95 var(--f-display);text-transform:uppercase;letter-spacing:.005em;color:#FFF6EA;
  background:none;-webkit-text-fill-color:currentColor;margin:0 0 .75rem;text-shadow:4px 4px 0 var(--ink-0);overflow-wrap:anywhere}
.hero-sub{font:700 1.05rem/1.2 var(--f-label);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-l);font-style:normal;margin:0 0 .35rem}
.hero-tag{font:500 .82rem/1.4 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,246,234,.72);margin:0}
.hero-desc{max-width:62ch;margin:.4rem 0 0;font-size:1rem;line-height:1.75;color:rgba(255,246,234,.9)}
.hero-logo{position:absolute;right:clamp(1rem,3vw,2rem);bottom:clamp(1.2rem,3vw,2rem);width:clamp(110px,15vw,190px);max-width:none;margin:0;filter:drop-shadow(3px 3px 0 var(--ink-0));opacity:.95;display:none}
.hero .hero-back{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.1rem;padding:.55rem 1rem;font:700 .76rem/1 var(--f-label);letter-spacing:.17em;text-transform:uppercase;color:#FFF6EA;border:2px solid #FFF6EA;transition:background .15s,color .15s}
.hero .hero-back:hover{background:#FFF6EA;color:var(--red-deep)}
@media(min-width:900px){.hero-logo{display:block}.hero-body{padding-right:clamp(0px,12vw,200px)}}
@media(max-width:620px){.hero{grid-template-columns:1fr;gap:1rem}.hero-kanji{flex-direction:row;font-size:1.5rem}.lan-b{display:none}.hero-corner{width:60%}}

/* ── DOC META / NOTICE / CTA ───────────────────────────────────────────── */
.doc-meta{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 1.2rem}
.doc-meta span{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .85rem;background:var(--surface2);border:2px solid var(--line);
  font:600 .8rem/1.2 var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim)}
.doc-meta svg{width:14px;height:14px;stroke:var(--accent);fill:none;stroke-width:2;flex-shrink:0}
.doc-notice,.notice{display:flex;align-items:flex-start;gap:1rem;margin:0 0 1.6rem;padding:1.1rem 1.3rem;background:var(--paper);color:var(--ink);
  border:2px solid var(--ink-0);border-left:10px solid var(--red);box-shadow:5px 5px 0 var(--hard)}
.doc-notice svg,.notice-icon svg{width:22px;height:22px;flex-shrink:0;margin-top:.15rem;stroke:var(--red);fill:none;stroke-width:2}
.notice-icon{display:inline-flex;flex-shrink:0}
.doc-notice p,.notice p{margin:0;font-size:.98rem;line-height:1.7;color:var(--ink)}
.doc-notice a,.notice a{color:var(--red-deep);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.doc-notice strong,.notice strong{color:#000}
.doc-divider{display:flex;align-items:center;gap:1rem;margin:2.4rem 0 2rem;color:var(--line-strong)}
.doc-divider::before,.doc-divider::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,transparent,currentColor 25%,currentColor 75%,transparent);opacity:.5}
.doc-divider span{display:grid;place-items:center;width:2.3rem;height:2.3rem;background:var(--red);color:#fff;font:400 1.1rem/1 var(--f-jp);border:2px solid var(--ink-0);box-shadow:3px 3px 0 var(--hard-2);transform:rotate(-4deg)}
.doc-cta{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;margin:0 0 1rem;padding:clamp(1.4rem,3vw,2.2rem) clamp(1.3rem,3vw,2.4rem);
  background:linear-gradient(120deg,var(--red-dark),var(--red-deep));border:3px solid var(--ink-0);box-shadow:7px 7px 0 var(--gold);color:#FFF6EA}
[data-theme="light"] .doc-cta{box-shadow:7px 7px 0 var(--ink)}
.doc-cta::before{content:'極楽街';position:absolute;right:-.2em;bottom:-.28em;z-index:-1;font:400 clamp(6rem,16vw,11rem)/1 var(--f-jp);color:#fff;opacity:.07;pointer-events:none;white-space:nowrap}
.doc-cta p{margin:0;font:400 clamp(1.7rem,4.4vw,2.7rem)/1 var(--f-display);text-transform:uppercase;text-shadow:3px 3px 0 var(--ink-0)}

/* ── SIDEBAR ───────────────────────────────────────────────────────────── */
.side-card{background:var(--card-bg);border:2px solid var(--line-strong);box-shadow:5px 5px 0 var(--hard);padding:1.1rem 1.1rem 1rem;margin-bottom:1.3rem}
.side-card-title{display:inline-block;margin:-1.75rem 0 .85rem;padding:.4rem .85rem .45rem;background:var(--red);color:#fff;font:400 .95rem/1 var(--f-display);letter-spacing:.07em;text-transform:uppercase;clip-path:var(--torn-c);transform:rotate(-1.5deg)}
.side-card-title::before{content:none}
.side-nav,.side-links{list-style:none;display:flex;flex-direction:column;gap:.1rem}
.side-nav a,.side-links li a{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;margin:0;border-left:3px solid transparent;font-size:.88rem;line-height:1.35;color:var(--text-dim);transition:color .15s,background .15s,border-color .15s,padding .15s}
.side-nav a:hover,.side-links li a:hover{color:var(--text);border-left-color:var(--red);background:var(--tag-bg);padding-left:.95rem}
.side-nav a.is-active{color:var(--text);border-left-color:var(--red);background:var(--tag-bg);font-weight:700}
.side-links li a[aria-current="page"]{background:var(--red);color:#fff;border-left-color:var(--ink-0);font-weight:700;box-shadow:3px 3px 0 var(--ink-0)}
.side-links li a svg{width:12px;height:12px;flex-shrink:0;opacity:.6;stroke:currentColor;fill:none}
.side-nav--scroll{max-height:46vh;overflow-y:auto;padding-right:.4rem;scrollbar-width:thin;scrollbar-color:var(--red) transparent}
.side-note{font-size:.84rem;line-height:1.65;color:var(--text-muted);padding:.2rem .3rem}
.side-note a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.doc-side-inner{position:sticky;top:5.2rem;padding-top:1.1rem}

@media(min-width:1180px){
  .doc-layout{display:grid;grid-template-columns:268px minmax(0,1fr);gap:3rem;align-items:start}
  .doc-side{display:block}
}

/* ── MOBILE CONTENTS BUTTON (gkg-toc.js) ───────────────────────────────── */
.gkg-toc{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));z-index:90;display:flex;flex-direction:column;align-items:flex-end;gap:.7rem}
.gkg-toc-btn{display:inline-flex;align-items:center;gap:.55rem;min-height:46px;padding:.6rem 1.1rem;cursor:pointer;background:var(--red);color:#fff;border:2px solid var(--ink-0);
  font:700 .82rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;box-shadow:4px 4px 0 var(--ink-0);-webkit-tap-highlight-color:transparent;transition:transform .12s var(--ease),box-shadow .12s var(--ease)}
.gkg-toc-btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink-0)}
.gkg-toc-btn svg{width:16px;height:16px;stroke:currentColor;fill:none}
.gkg-toc-panel{width:min(21rem,calc(100vw - 2rem));max-height:min(62vh,26rem);overflow-y:auto;padding:1.1rem 1.1rem 1rem;background:var(--surface);color:var(--text);border:2px solid var(--line-strong);box-shadow:6px 6px 0 var(--hard);scrollbar-width:thin;scrollbar-color:var(--red) transparent}
.gkg-toc-panel[hidden]{display:none}
.gkg-toc-title{font:400 1rem/1 var(--f-display);letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin:0 0 .7rem}
.gkg-toc-panel ol{list-style:none;display:flex;flex-direction:column;gap:.1rem}
.gkg-toc-panel a{display:block;padding:.55rem .7rem;font-size:.92rem;line-height:1.35;color:var(--text-dim);border-left:3px solid transparent}
.gkg-toc-panel a:hover{color:var(--text);border-left-color:var(--red)}
.gkg-toc-panel a.is-active{color:var(--text);border-left-color:var(--red);font-weight:700;background:var(--tag-bg)}
@media(min-width:1180px){.gkg-toc{display:none}}

/* ── DOC SECTIONS — numbered manga panels ───────────────────────────── */
.doc-section{position:relative;margin:0 0 1.5rem;background:var(--card-bg);border:2px solid var(--line-strong);box-shadow:6px 6px 0 var(--hard)}
.sec-head{display:flex;align-items:stretch;border-bottom:2px solid var(--line-strong);background:var(--surface2)}
.sec-num{display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:5rem;padding:.55rem 1.1rem .55rem 1rem;background:var(--red);color:#fff;
  font:400 1.45rem/1 var(--f-display);letter-spacing:.04em;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);margin-right:-4px}
.sec-title{display:flex;align-items:center;margin:0;padding:.7rem 1.2rem .7rem 1.4rem;font:400 clamp(1.3rem,2.6vw,1.9rem)/1.1 var(--f-display);text-transform:uppercase;letter-spacing:.015em;color:var(--text);overflow-wrap:anywhere}
.sec-body{padding:1.4rem clamp(1.1rem,2.6vw,1.9rem) 1.6rem}
.sec-body>*+*{margin-top:1rem}
.sec-body p{font-size:1.03rem;line-height:1.85;color:var(--text-dim);margin:0}
.sec-body p+p{margin-top:1rem}
.sec-body strong,.sec-body b{color:var(--text);font-weight:700}
.sec-body em{color:var(--text)}
.sec-body h3{font:400 1.3rem/1.1 var(--f-display);text-transform:uppercase;letter-spacing:.02em;color:var(--accent);margin:1.8rem 0 .7rem;padding-bottom:.45rem;border-bottom:2px dashed var(--line)}
.sec-body a{color:var(--accent);font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;transition:color .15s}
.sec-body a:hover{color:var(--accent2)}
.sec-body ul,.doc-list,.link-list{list-style:none;display:flex;flex-direction:column;gap:.55rem;padding:0}
.sec-body ul>li,.doc-list>li{position:relative;padding-left:1.7rem;line-height:1.75;color:var(--text-dim)}
.sec-body ul>li::before,.doc-list>li::before{content:'';position:absolute;left:.15rem;top:.62em;width:.62rem;height:.62rem;background:var(--red);transform:rotate(45deg);box-shadow:2px 2px 0 var(--hard-2)}
.sec-body code,.doc code{font:500 .86em/1 var(--f-mono);padding:.18em .5em;background:var(--surface3);color:var(--text);border:1px solid var(--line)}
.sec-body ol{counter-reset:n;list-style:none;display:flex;flex-direction:column;gap:.8rem;padding:0}
.sec-body ol>li{counter-increment:n;position:relative;padding-left:3.2rem;color:var(--text-dim)}
.sec-body ol>li::before{content:counter(n);position:absolute;left:0;top:0;width:2.2rem;height:2.2rem;display:grid;place-items:center;background:var(--red);color:#fff;font:400 1.15rem/1 var(--f-display);border:2px solid var(--ink-0);box-shadow:3px 3px 0 var(--hard-2)}

/* link list (contact, privacy) */
.link-list>li{padding:.8rem 1rem!important;background:var(--surface2);border:2px solid var(--line);display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;align-items:baseline;justify-content:space-between}
.link-list>li::before{content:none!important}
.link-list li strong{font:700 .86rem/1.2 var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.link-list li a{font-family:var(--f-mono);font-size:.9rem}

/* tables */
.tier-table{width:100%;border-collapse:separate;border-spacing:0;margin:1.2rem 0;border:2px solid var(--line-strong);font-size:.95rem;background:var(--surface)}
.tier-table caption{caption-side:top;text-align:left;padding:.6rem 1rem;background:var(--ink-0);color:#FFF6EA;font:400 1.05rem/1 var(--f-display);letter-spacing:.07em;text-transform:uppercase;border:2px solid var(--line-strong);border-bottom:0}
[data-theme="light"] .tier-table caption{background:var(--ink)}
.tier-table th{background:var(--red);color:#fff;padding:.65rem 1rem;text-align:left;font:700 .78rem/1.1 var(--f-label);letter-spacing:.16em;text-transform:uppercase}
.tier-table td{padding:.75rem 1rem;vertical-align:top;border-top:1px solid var(--line);color:var(--text-dim);line-height:1.6}
.tier-table tbody tr:nth-child(even) td{background:var(--surface2)}
.tier-table td:first-child{color:var(--text)}
.tier-table a{word-break:break-word}
@media(max-width:620px){.tier-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}}

/* ── FOOTER ─────────────────────────────────────────────────────────── */
.foot{position:relative;isolation:isolate;overflow:hidden;margin:3.5rem 0 0;padding:clamp(1.8rem,4vw,2.8rem) clamp(1.2rem,3vw,2.4rem) 0;background:var(--ink-0);color:#EDE2D0;border:3px solid var(--ink-0);box-shadow:8px 8px 0 var(--red);width:100%;max-width:none}
[data-theme="light"] .foot{box-shadow:8px 8px 0 var(--ink)}
.foot::before{content:'';position:absolute;left:0;right:0;top:0;height:46px;z-index:-1;background:var(--red);opacity:.9;-webkit-mask:var(--g-cloud) 0 0/110px 70px repeat;mask:var(--g-cloud) 0 0/110px 70px repeat;-webkit-mask-position:0 -26px;mask-position:0 -26px}
.foot::after{content:'極楽街';position:absolute;right:-.06em;bottom:-.3em;z-index:-1;font:400 clamp(7rem,22vw,17rem)/1 var(--f-jp);color:#fff;opacity:.045;pointer-events:none;white-space:nowrap}
.foot-grid{position:relative;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem 2.4rem;padding:2rem 0 2rem}
.foot-col-title{font:400 1.05rem/1 var(--f-display);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-l);margin:0 0 .9rem;padding-bottom:.6rem;border-bottom:2px solid rgba(237,226,208,.2)}
.foot-col-title [lang=ja]{font-family:var(--f-jp);font-size:.9em;color:var(--red-hot)}
.foot-desc{font-size:.9rem;line-height:1.75;color:#BFB29E;max-width:34ch;margin:0}
.foot-links{list-style:none;display:flex;flex-direction:column;gap:.15rem}
.foot-links a{display:inline-block;padding:.3rem 0;font-size:.92rem;color:#D8CCB8;border-bottom:2px solid transparent;transition:color .15s,border-color .15s,padding .15s}
.foot-links a:hover{color:#fff;border-bottom-color:var(--red);padding-left:.4rem}
.foot-bottom{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:1.2rem 0 1.5rem;border-top:2px solid rgba(237,226,208,.16)}
.foot-brand{font:700 .8rem/1 var(--f-label);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-l)}
.foot-copy{font-size:.82rem;line-height:1.7;color:#A99D8B;margin:0;max-width:78ch}
.foot-copy a{color:#D8CCB8;text-decoration:underline;text-underline-offset:3px}
.foot-copy a:hover{color:#fff}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.foot-grid{grid-template-columns:1fr}.foot-bottom{padding-bottom:4.6rem}}

/* ═══════════════════════════ PAGE PERSONALITIES ═══════════════════════════ */

/* — ABOUT : cover spread — */
.pg-about .hero{padding-top:clamp(3rem,9vw,7rem);padding-bottom:clamp(3.2rem,8vw,6rem);
  background:linear-gradient(95deg,rgba(60,6,12,.94) 0%,rgba(100,12,22,.7) 48%,rgba(100,12,22,.12) 100%),var(--header-bg) center 20%/cover no-repeat,var(--red-deep)}
[data-theme="light"] .pg-about .hero{background:linear-gradient(95deg,rgba(60,6,12,.93) 0%,rgba(100,12,22,.7) 48%,rgba(100,12,22,.15) 100%),url('/assets/images/header-bg-dark.jpg') center 20%/cover no-repeat,var(--red-deep)}
.pg-about .hero-cloud{opacity:.08}
.pg-about .hero-title{font-size:clamp(3rem,10vw,7.4rem)}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem;margin-top:1.4rem}
.stat-box{position:relative;overflow:hidden;padding:1.1rem .8rem 1rem;background:var(--surface2);border:2px solid var(--line-strong);text-align:center;box-shadow:4px 4px 0 var(--hard)}
.stat-box::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.25;background:radial-gradient(circle,var(--tone) 0 1.1px,transparent 1.6px) 0 0/7px 7px;-webkit-mask-image:linear-gradient(160deg,transparent 45%,#000);mask-image:linear-gradient(160deg,transparent 45%,#000)}
.stat-num{font:400 clamp(2.2rem,5vw,3.4rem)/1 var(--f-display);color:var(--accent);text-shadow:3px 3px 0 var(--hard)}
.stat-label{margin-top:.5rem;font:700 .74rem/1.2 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
.feat-grid,.role-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.4rem}
.feat-card,.role-card{position:relative;padding:1.2rem 1.2rem 1.3rem;background:var(--surface2);border:2px solid var(--line-strong);box-shadow:4px 4px 0 var(--hard);transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.feat-card:hover,.role-card:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--hard)}
.feat-icon{display:grid;place-items:center;width:3rem;height:3rem;margin-bottom:.9rem;background:var(--red);border:2px solid var(--ink-0);box-shadow:3px 3px 0 var(--hard-2);transform:rotate(-3deg);color:#fff}
.feat-icon svg{width:22px;height:22px;stroke:currentColor}
.feat-title{font:400 1.35rem/1.1 var(--f-display);text-transform:uppercase;color:var(--text);margin-bottom:.5rem}
.feat-body,.role-desc{font-size:.96rem;line-height:1.75;color:var(--text-dim);margin:0}
.role-badge{display:inline-block;margin-bottom:.8rem;padding:.4rem .95rem .45rem;background:var(--paper-tape);color:var(--paper-ink);font:400 1.05rem/1 var(--f-display);letter-spacing:.05em;text-transform:uppercase;clip-path:var(--torn-b);transform:rotate(-1.2deg)}
.role-card:nth-child(even) .role-badge{background:var(--red);color:#fff;transform:rotate(1deg)}
.cta-block{position:relative;overflow:hidden;isolation:isolate;margin:0 0 1rem;padding:clamp(1.6rem,4vw,3rem);background:linear-gradient(120deg,var(--red-dark),var(--red-deep) 60%,#a3141f);color:#FFF6EA;border:3px solid var(--ink-0);box-shadow:8px 8px 0 var(--gold)}
[data-theme="light"] .cta-block{box-shadow:8px 8px 0 var(--ink)}
.cta-kanji{position:absolute;right:-.1em;top:50%;transform:translateY(-50%);z-index:-1;font:400 clamp(6rem,20vw,15rem)/1 var(--f-jp);color:#fff;opacity:.08;pointer-events:none;white-space:nowrap}
.cta-block h3{font:400 clamp(2rem,5vw,3.4rem)/1 var(--f-display);text-transform:uppercase;text-shadow:4px 4px 0 var(--ink-0);margin:0 0 .8rem}
.cta-block p{max-width:58ch;color:rgba(255,246,234,.92);margin:0 0 1.4rem}
.cta-btns{display:flex;flex-wrap:wrap;gap:1rem}
.cta-block .btn{--b-fg:#FFF6EA;--b-bd:#FFF6EA;--b-sh:var(--ink-0)}
.cta-block .btn:hover{--b-bg:#FFF6EA;--b-fg:var(--red-deep)}
.cta-block .btn-p{--b-bg:var(--ink-0);--b-bd:var(--ink-0);--b-sh:var(--gold)}
.cta-block .btn-p:hover{--b-bg:#fff;--b-fg:var(--red-deep)}
@media(max-width:700px){.stats-row{grid-template-columns:repeat(2,1fr)}.feat-grid,.role-grid{grid-template-columns:1fr}}

/* — FAQ : speech bubbles — */
.faq-toc{display:flex;flex-wrap:wrap;gap:.55rem;margin:0 0 1.8rem;padding:1.1rem;background:var(--surface2);border:2px solid var(--line-strong);box-shadow:5px 5px 0 var(--hard)}
.faq-toc a{display:inline-block;padding:.5rem .85rem;background:var(--surface);border:2px solid var(--line);font:600 .84rem/1.2 var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);transition:all .14s var(--ease)}
.faq-toc a:hover{background:var(--red);border-color:var(--ink-0);color:#fff;transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink-0)}
.pg-faq .sec-body>p{position:relative;margin:0;padding:0}
.pg-faq .sec-body>p+p{margin-top:1.6rem}
.pg-faq .sec-body>p>strong:first-child{position:relative;display:block;width:fit-content;max-width:100%;margin:0 0 1.15rem;padding:.75rem 1.1rem;background:var(--red);color:#fff;
  font:700 1.02rem/1.45 var(--f-body);border:2px solid var(--ink-0);box-shadow:4px 4px 0 var(--hard-2)}
.pg-faq .sec-body>p>strong:first-child::after{content:'';position:absolute;left:1.6rem;bottom:-12px;width:20px;height:20px;background:var(--red);border-right:2px solid var(--ink-0);border-bottom:2px solid var(--ink-0);transform:skewY(0) rotate(45deg) translate(-4px,-4px) scale(.72);transform-origin:center}
.pg-faq .sec-body>p>br:first-of-type{display:none}
.pg-faq .doc-section[id]{scroll-margin-top:5.2rem}

/* — CONTACT : envelope + tape — */
.pg-contact .doc-section{border-width:2px}
.pg-contact .doc-section::before{content:'';position:absolute;top:-1px;right:2rem;width:88px;height:20px;background:var(--paper-tape);opacity:.9;clip-path:var(--torn-b);transform:translateY(-55%) rotate(2deg)}
.pg-contact .sec-body::after{content:'';display:block;height:10px;margin-top:1.4rem;background:repeating-linear-gradient(135deg,var(--red) 0 14px,transparent 14px 20px,var(--paper) 20px 34px,transparent 34px 40px);opacity:.75}
.pg-contact .link-list>li{border-style:dashed}

/* — GUIDELINES : numbered ladder — */
.pg-community-guidelines .doc{counter-reset:rule}
.pg-community-guidelines .doc-section{margin-left:clamp(0px,2.5vw,2.2rem)}
.pg-community-guidelines .doc-section::before{content:'';position:absolute;left:calc(-1 * clamp(0px,2.5vw,2.2rem) - 2px);top:0;bottom:-1.5rem;width:4px;background:repeating-linear-gradient(180deg,var(--red) 0 10px,transparent 10px 16px);opacity:.55}
.pg-community-guidelines .doc-section:last-of-type::before{bottom:0}
.pg-community-guidelines .sec-num{background:var(--ink-0);color:var(--gold-l);box-shadow:inset 0 -4px 0 var(--red)}
.pg-community-guidelines .sec-title{font-size:clamp(1.5rem,3vw,2.2rem)}
@media(max-width:700px){.pg-community-guidelines .doc-section{margin-left:0}.pg-community-guidelines .doc-section::before{display:none}}

/* — MODMAIL : tickets — */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.3rem}
.cat-card{position:relative;padding:1.1rem 1.2rem 1.2rem 1.5rem;background:var(--surface2);border:2px solid var(--line-strong);box-shadow:4px 4px 0 var(--hard)}
.cat-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--red)}
.cat-card p{margin:0;font-size:.95rem;line-height:1.7;color:var(--text-dim)}
.cat-card-title{font:400 1.2rem/1.1 var(--f-display)!important;text-transform:uppercase;color:var(--text)!important;margin-bottom:.45rem!important}
.step-list{list-style:none;counter-reset:n}
.step-list>li{padding:1rem 1.1rem 1rem 4rem!important;background:var(--surface2);border:2px solid var(--line)}
.step-list>li::before{left:.9rem!important;top:1rem!important}
.step-list>li strong{display:block;margin-bottom:.3rem;font:400 1.15rem/1.15 var(--f-display);text-transform:uppercase;color:var(--text);letter-spacing:.02em}
.step-list>li p{font-size:.96rem!important;line-height:1.7!important;margin:0!important}
.mock-ticket{position:relative;margin:.4rem clamp(1.1rem,2.6vw,1.9rem) 1.6rem;background:var(--paper);color:var(--ink);border:2px solid var(--ink-0);box-shadow:6px 6px 0 var(--hard);transform:rotate(-.5deg)}
.mock-ticket::before,.mock-ticket::after{content:'';position:absolute;top:2.9rem;width:22px;height:22px;border-radius:50%;background:var(--card-bg);border:2px solid var(--ink-0)}
.mock-ticket::before{left:-12px}.mock-ticket::after{right:-12px}
.mock-ticket-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;padding:.8rem 1.1rem;background:var(--ink-0);color:#FFF6EA;font:700 .84rem/1.2 var(--f-label);letter-spacing:.15em;text-transform:uppercase;border-bottom:2px dashed rgba(255,246,234,.5)}
.pill{display:inline-block;padding:.25rem .7rem;background:var(--red);color:#fff;font:700 .72rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;border:2px solid #FFF6EA}
.mock-ticket-body{padding:1rem 1.3rem 1.2rem;display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem 1.6rem}
.mock-field{display:flex;flex-direction:column;gap:.1rem;padding:.35rem 0;border-bottom:1px dotted rgba(20,16,15,.35)}
.mock-field b{font:700 .72rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:var(--red-deep)}
.mock-field span{font-family:var(--f-mono);font-size:.88rem;color:var(--ink)}
.mock-caption{grid-column:1/-1;margin:.5rem 0 0;font-size:.82rem;font-style:italic;color:#5A4B40}
.safety{margin-top:1rem;padding:1rem 1.2rem;background:var(--tag-bg);border:2px dashed var(--line-strong)}
@media(max-width:620px){.cat-grid,.mock-ticket-body{grid-template-columns:1fr}}

/* — PRIVACY : ledger / lock — */
.toc{margin:0 0 1.8rem;padding:1.4rem 1.4rem 1.2rem;background:var(--paper);color:var(--ink);border:2px solid var(--ink-0);box-shadow:6px 6px 0 var(--hard);
  background-image:repeating-linear-gradient(180deg,transparent 0 31px,rgba(20,16,15,.14) 31px 32px)}
.toc-title{font:400 1.5rem/1 var(--f-display);text-transform:uppercase;letter-spacing:.04em;color:var(--red-deep);margin:0 0 1rem;padding-bottom:.5rem;border-bottom:3px double var(--ink-0)}
.toc-grid{list-style:none;columns:2;column-gap:2rem}
.toc-grid li{break-inside:avoid;line-height:32px}
.toc-grid a{font-size:.95rem;color:var(--ink);text-decoration:none;font-weight:600;border-bottom:2px solid transparent}
.toc-grid a:hover{color:var(--red);border-bottom-color:var(--red)}
.pg-privacy-policy .hero::before{content:'';position:absolute;right:clamp(1rem,5vw,4rem);top:50%;transform:translateY(-50%);width:clamp(120px,18vw,210px);aspect-ratio:1;z-index:-1;opacity:.16;
  background:url("/assets/ui/doc-lock.svg") center/contain no-repeat}
.pg-privacy-policy .sec-body{background-image:repeating-linear-gradient(180deg,transparent 0 33px,var(--line) 33px 34px);background-size:100% 34px;background-position:0 .6rem;background-color:transparent}
.pg-privacy-policy .sec-body p,.pg-privacy-policy .sec-body li{background:var(--card-bg)}
.pg-privacy-policy .sec-num{font-size:1.3rem;min-width:4.4rem}
@media(max-width:620px){.toc-grid{columns:1}}

/* — TERMS : contract + hanko stamp — */
.pg-terms-of-service .sec-head{border-bottom:3px double var(--line-strong)}
.pg-terms-of-service .sec-num{background:var(--ink-0);color:var(--paper);box-shadow:inset 0 -4px 0 var(--red)}
.pg-terms-of-service .doc-cta::after{content:'承認';position:absolute;right:clamp(1rem,4vw,3rem);top:50%;width:104px;height:104px;margin-top:-52px;display:grid;place-items:center;
  font:400 2.6rem/1 var(--f-jp);color:#FFF6EA;background:var(--red-hot);border:5px double #FFF6EA;border-radius:50%;transform:rotate(-14deg);opacity:.9;box-shadow:0 0 0 4px var(--ink-0)}
@media(max-width:620px){.pg-terms-of-service .doc-cta::after{width:74px;height:74px;margin-top:0;top:1rem;font-size:1.8rem;border-width:4px}}

/* — DISCLAIMER : caution tape — */
.pg-disclaimer .hero-corner,.pg-disclaimer .doc-meta+.affil-notice::before{height:18px}
.pg-disclaimer .hero{border-color:var(--ink-0)}
.affil-notice{position:relative;margin:0 0 1.8rem;padding:2.2rem 1.5rem 1.4rem;background:var(--paper);color:var(--ink);border:3px solid var(--ink-0);box-shadow:6px 6px 0 var(--hard);overflow:hidden}
.affil-notice::before{content:'';position:absolute;left:0;right:0;top:0;height:14px;background:repeating-linear-gradient(-45deg,var(--gold) 0 16px,var(--ink-0) 16px 32px)}
.affil-notice p{color:var(--ink);font-size:1.02rem;line-height:1.8;margin:.8rem 0 0}
.affil-notice strong{color:#000}
.an-label{display:flex;align-items:center;gap:.7rem;font:400 clamp(1.3rem,3vw,1.9rem)/1.05 var(--f-display);text-transform:uppercase;color:var(--red-deep);letter-spacing:.015em}
.an-label svg{width:26px;height:26px;stroke:var(--red);fill:none;stroke-width:2.2;flex-shrink:0}
.dmca-box{position:relative;margin-top:1.4rem;padding:1.3rem 1.3rem 1.2rem;background:var(--surface2);border:2px dashed var(--line-strong)}
.db-label{display:inline-block;margin:-2.1rem 0 .7rem;padding:.4rem .9rem .45rem;background:var(--red);color:#fff;font:400 1rem/1 var(--f-display);letter-spacing:.06em;text-transform:uppercase;clip-path:var(--torn-c);transform:rotate(-1.5deg)}

/* — BANNED WORDS : censor bars — */
.pg-banned-words .hero{background:linear-gradient(135deg,#120a0b 0%,var(--red-dark) 55%,var(--red-deep) 100%)}
.pg-banned-words .hero-title{font-size:clamp(2.3rem,7vw,5rem)}
.pg-banned-words .hero::before{content:'';position:absolute;left:0;right:0;top:50%;height:clamp(18px,3vw,30px);z-index:-1;background:var(--ink-0);opacity:.55;transform:rotate(-2deg)}
.pg-banned-words .hero-kanji{font-size:clamp(1.1rem,3.4vw,1.9rem)}
.legend{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.3rem;margin:0 0 1.6rem;padding:.9rem 1.2rem;background:var(--surface2);border:2px solid var(--line-strong)}
.legend-label{font:400 1.05rem/1 var(--f-display);letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.leg-item{display:inline-flex;align-items:center;gap:.5rem;font:600 .82rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.leg-dot{display:inline-block;width:.9rem;height:.9rem;flex-shrink:0;border:2px solid var(--ink-0);transform:rotate(45deg)}
#bw-loading{padding:2.4rem 1.5rem!important;text-align:center;color:var(--text-muted)!important;font:700 .9rem/1 var(--f-label)!important;letter-spacing:.24em!important;text-transform:uppercase}
#bw-loading::before{content:'';display:block;width:30px;height:52px;margin:0 auto 1rem;background:url("/assets/ui/lantern.svg") center/contain no-repeat;transform-origin:50% 0;animation:gk-swing 1.4s ease-in-out infinite}
.tier{margin:0 0 1.5rem;background:var(--card-bg);border:2px solid var(--line-strong);box-shadow:6px 6px 0 var(--hard)}
details.tier summary{list-style:none}details.tier summary::-webkit-details-marker{display:none}
.tier-header{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:.9rem 1.2rem;cursor:pointer;background:var(--surface2);border-left:12px solid var(--tier-color,var(--red));transition:background .15s;user-select:none}
.tier-header:hover{background:var(--surface3)}
.tier-dot{width:.95rem;height:.95rem;flex-shrink:0;background:var(--tier-color);border:2px solid var(--ink-0);transform:rotate(45deg);border-radius:0;box-shadow:none}
.tier-label{flex:1;min-width:8ch;font:400 1.5rem/1 var(--f-display);text-transform:uppercase;letter-spacing:.02em;color:var(--text)}
.tier-meta{font:700 .8rem/1 var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.tier-penalty{padding:.35rem .7rem;font:700 .74rem/1 var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--ink-0);border:2px solid var(--tier-color)}
.tier-chevron{width:20px;height:20px;flex-shrink:0;stroke:var(--text);fill:none;transition:transform .2s var(--ease)}
.tier[open] .tier-chevron{transform:rotate(180deg)}
.tier-body{padding:1.2rem 1.3rem 1.4rem;border-top:2px solid var(--line-strong)}
.tier-desc{margin:0 0 1.1rem;font-size:.98rem;line-height:1.75;color:var(--text-dim)}
.word-grid{display:flex;flex-wrap:wrap;gap:.55rem}
.word-pill{display:inline-block;padding:.38rem .8rem .42rem;background:var(--ink-0);color:#FFF6EA;font:600 .9rem/1.1 var(--f-mono);border-left:6px solid var(--tier-color,var(--red));transform:rotate(var(--r,0deg));transition:transform .12s var(--ease),background .12s}
.word-pill:nth-child(3n){--r:-.8deg}.word-pill:nth-child(3n+1){--r:.6deg}
.word-pill:hover{transform:rotate(0) translateY(-2px);background:var(--red-deep)}
[data-theme="light"] .word-pill{background:var(--ink)}
.tier-foreign{--tier-color:#6C8EAD}.tier-low{--tier-color:#5DAD6C}.tier-medium{--tier-color:#E2B24A}.tier-high{--tier-color:#E58A32}.tier-severe{--tier-color:#E0303A}
.pg-banned-words .doc>div[style*="padding:1.2rem"]{background:var(--surface2)!important;border:2px solid var(--line-strong)!important;box-shadow:5px 5px 0 var(--hard);padding:1.5rem!important}
.pg-banned-words .doc>div[style*="padding:1.2rem"] p:first-child{font:400 1.4rem/1 var(--f-display)!important;letter-spacing:.04em!important;color:var(--accent)!important}
.pg-banned-words .doc>div[style*="padding:1.2rem"] p:nth-child(2){color:var(--text-dim)!important}
.pg-banned-words .doc>div[style*="padding:1.2rem"] a{background:var(--red)!important;color:#fff!important;border:2px solid var(--ink-0);box-shadow:4px 4px 0 var(--gold);font:700 .84rem/1 var(--f-label)!important;letter-spacing:.17em!important;padding:.8rem 1.4rem!important}
@media(max-width:560px){.tier-penalty{display:none}.tier-label{font-size:1.25rem}}

/* ── PRINT ───────────────────────────────────────────────────────────── */
@media print{
  .topbar,.doc-side,.gkg-toc,.lan,.hero-cloud,.hero-corner{display:none!important}
  .doc-layout{display:block!important}
  body{background:#fff!important;color:#000!important}
  .hero,.doc-section,.doc-cta,.foot{box-shadow:none!important;background:#fff!important;color:#000!important;border:1px solid #000!important}
  .hero-title,.doc-cta p{color:#000!important;text-shadow:none!important}
  .sec-num{background:#000!important;color:#fff!important}
  .sec-body p,.sec-body li{color:#000!important}
}

/* ── buttons inside docs: icon sizing + CTA colours ──────────────────────── */
.btn svg{width:1.15em;height:1.15em;flex-shrink:0;stroke:currentColor}
.btn svg[fill="currentColor"]{stroke:none}
.doc-cta .btn,.cta-block .btn{--b-fg:#FFF6EA;--b-bd:#FFF6EA;--b-sh:var(--ink-0)}
.doc-cta .btn:hover,.cta-block .btn:hover{--b-bg:#FFF6EA;--b-fg:var(--red-deep)}
.doc-cta .btn-p,.cta-block .btn-p{--b-bg:var(--ink-0);--b-bd:var(--ink-0);--b-sh:var(--gold)}
.doc-cta .btn-p:hover,.cta-block .btn-p:hover{--b-bg:#fff;--b-fg:var(--red-deep)}
