
:root{
  --ink:#1d1526; --ink-2:#4b4157; --line:#ecdfe9; --bg:#fffafd; --card:#ffffff;
  --rose:#e0397f; --rose-dk:#b81f61; --plum:#7b3fa0; --amber:#f5a259;
  --lift:0 1px 2px rgba(59,20,48,.05),0 8px 26px rgba(103,32,79,.07);
  --r:16px; --maxw:min(100%, 1120px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(15.5px,.55vw + 14.4px,17px);line-height:1.68;overflow-wrap:anywhere}
img{max-width:100%;height:auto;display:block}
a{color:var(--rose-dk);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible{outline:3px solid var(--plum);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(14px,3vw,26px)}
h1,h2,h3{line-height:1.22;margin:0 0 .5em;letter-spacing:-.012em}
h1{font-size:clamp(1.65rem,3.1vw + .55rem,2.7rem)}
h2{font-size:clamp(1.28rem,1.5vw + .78rem,1.78rem);margin-top:1.9em}
h3{font-size:clamp(1.06rem,.7vw + .84rem,1.24rem);margin-top:1.5em}
p,ul,ol{margin:0 0 1.05em}
ul,ol{padding-left:1.25em}
li{margin:.36em 0}
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,250,253,.93);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.head-in{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-block:11px}
.brand{font-weight:800;font-size:1.16rem;color:var(--ink);letter-spacing:-.02em;
  display:inline-flex;align-items:center;gap:.4em}
.brand-mark{color:var(--rose)}
.topnav{margin-left:auto}
.topnav ul{display:flex;flex-wrap:wrap;gap:clamp(9px,1.5vw,20px);list-style:none;margin:0;padding:0}
.topnav a{color:var(--ink-2);font-weight:600;font-size:.94rem}
.topnav a[aria-current]{color:var(--rose-dk)}
main{display:block;padding-block:clamp(20px,3vw,38px)}
.crumbs{font-size:.86rem;color:var(--ink-2);margin-bottom:1.1em}
.crumbs .sep{opacity:.5;margin-inline:.15em}
.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));
  gap:clamp(18px,3vw,42px);align-items:center;margin-block:clamp(6px,2vw,22px)}
.hero-art{border-radius:var(--r);overflow:hidden;box-shadow:var(--lift);background:#2a1730}
.hero-copy p{color:var(--ink-2);font-size:1.03rem}
.gate{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(18px,3vw,26px);box-shadow:var(--lift);text-align:center;margin-block:clamp(14px,2vw,24px)}
.gate p{margin:0 0 .9em;font-weight:700;font-size:1.1rem}
.gate-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;padding:.82em 2.1em;border-radius:999px;font-weight:700;
  text-align:center;text-decoration:none;transition:transform .12s ease,filter .12s ease}
.btn:hover{filter:brightness(.94);text-decoration:none;transform:translateY(-1px)}
.btn-yes{background:linear-gradient(135deg,var(--rose),var(--plum));color:#fff}
.btn-no{background:#fff;color:var(--ink);border:2px solid var(--line)}
.btn-join{background:linear-gradient(135deg,var(--rose),var(--plum));color:#fff;
  box-shadow:0 6px 18px rgba(224,57,127,.24)}
.cta-band{text-align:center;margin:clamp(22px,3.5vw,38px) 0;padding:clamp(18px,3vw,26px);
  background:linear-gradient(135deg,#fff2f8,#f6eeff);border:1px solid var(--line);border-radius:var(--r)}
.cta-sub{margin:.75em 0 0;font-size:.92rem;color:var(--ink-2)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(15px,2.2vw,20px);box-shadow:var(--lift)}
.grid{display:grid;gap:clamp(12px,2vw,18px);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.toc{background:#fff6fb;border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(14px,2vw,18px);margin-block:1.4em}
.toc ul{margin:.4em 0 0;columns:2;column-gap:26px}
@media (max-width:700px){.toc ul{columns:1}}
.thread{margin-top:1.4em;display:grid;gap:14px}
.post{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--lift);display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr)}
.post-user{padding:16px;border-right:1px solid var(--line);background:#fffafc;text-align:center}
.post-user img{width:76px;height:76px;border-radius:14px;object-fit:cover;margin:0 auto .6em;
  border:1px solid var(--line);background:#f6eef4}
.uname{font-weight:700;font-size:.95rem;display:block;margin-bottom:.25em}
.ustat{font-size:.78rem;color:var(--ink-2);line-height:1.5}
.post-main{padding:0;min-width:0}
.post-bar{display:flex;justify-content:space-between;gap:10px;align-items:center;
  padding:9px 16px;background:#fdf4f9;border-bottom:1px solid var(--line);
  font-size:.82rem;color:var(--ink-2)}
.post-no{font-weight:700;color:var(--ink)}
.post-body{padding:16px}
.post-body p:last-child{margin-bottom:0}
@media (max-width:820px){
  .post{grid-template-columns:1fr}
  .post-user{display:flex;align-items:center;gap:12px;text-align:left;
    border-right:0;border-bottom:1px solid var(--line);padding:12px 16px}
  .post-user img{width:48px;height:48px;margin:0}
}
.tagrow{display:flex;flex-wrap:wrap;gap:8px;margin:.7em 0 0}
.tag{display:inline-block;padding:3px 11px;border-radius:999px;background:#fdeef6;
  border:1px solid var(--line);font-size:.79rem;color:var(--ink-2)}
.meta-row{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--ink-2);font-size:.88rem}
.linklist{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.linklist a{font-weight:600}
.colwrap{columns:3;column-gap:26px}
@media (max-width:900px){.colwrap{columns:2}}
@media (max-width:560px){.colwrap{columns:1}}
.tblwrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.94rem}
th,td{text-align:left;padding:.55em .7em;border-bottom:1px solid var(--line)}
.site-foot{margin-top:clamp(34px,5vw,60px);border-top:1px solid var(--line);
  background:#fff4fa;padding-block:clamp(20px,3vw,30px)}
.footlinks{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;margin-bottom:.9em}
.footlinks a{color:var(--ink-2);font-weight:600;font-size:.9rem}
.fine{text-align:center;color:var(--ink-2);font-size:.84rem;margin:0}
.notice{background:#fff6ee;border:1px solid #f4dcc4;border-radius:var(--r);
  padding:clamp(13px,2vw,17px);font-size:.93rem}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important;
    scroll-behavior:auto!important}
}

.lander{max-width:min(100%,1000px);margin-inline:auto}
.lander h1{text-align:center;margin-block:clamp(14px,3vw,30px) .4em;
  background:linear-gradient(120deg,var(--rose),var(--plum));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.lander .hero{margin-top:clamp(18px,3vw,34px)}
.lander .hero-copy h2{margin-top:1.2em;font-size:clamp(1.12rem,1vw + .9rem,1.4rem)}
