@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Noto+Sans+KR:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg:#111111;--bg-2:#171717;--bg-3:#1d1d1d;
  --fg:#f2f0ed;--fg-2:#9a9793;--fg-3:#6b6866;
  --rule:#2b2b2b;
  --coral:#E08B83;--coral-deep:#c9695f;
  --sage:#8FB3A3;--amber:#C9A961;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--fg);font-family:'Noto Sans KR',sans-serif;line-height:1.75;-webkit-font-smoothing:antialiased;}
.wrap{max-width:980px;margin:0 auto;padding:0 24px;}

/* 헤더 */
.masthead{border-bottom:1px solid var(--rule);position:sticky;top:0;background:rgba(17,17,17,.94);backdrop-filter:blur(6px);z-index:20;}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 24px;flex-wrap:wrap;}
.mark{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;}
.mark img{height:26px;display:block;}
.mark .role{font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--fg-2);letter-spacing:.1em;border-left:1px solid var(--rule);padding-left:11px;}
.nav{display:flex;gap:18px;flex-wrap:wrap;}
.nav a{font-size:.87rem;color:var(--fg-2);text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent;}
.nav a:hover,.nav a:focus-visible{color:var(--coral);border-bottom-color:var(--coral);}

/* 히어로 */
.hero{padding:88px 0 64px;border-bottom:1px solid var(--rule);text-align:center;}
.hero .logo{width:min(72%,420px);display:block;margin:0 auto 44px;}
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.16em;color:var(--sage);margin-bottom:20px;}
.hero h1{font-family:'Gowun Batang',serif;font-size:clamp(1.8rem,4.6vw,2.75rem);font-weight:700;line-height:1.38;margin:0 auto 30px;max-width:17em;}
.hero p.blurb{font-size:1.03rem;color:var(--fg-2);max-width:37em;margin:0 auto 34px;}
.stat{display:flex;justify-content:center;gap:34px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:var(--fg-3);letter-spacing:.06em;}
.stat b{color:var(--sage);font-weight:500;}

/* 밴드 */
.band{padding:64px 0;border-bottom:1px solid var(--rule);}
.band-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:12px;flex-wrap:wrap;}
.band-head h2{font-family:'Gowun Batang',serif;font-size:1.5rem;font-weight:700;}
.band-head .more{font-family:'IBM Plex Mono',monospace;font-size:.77rem;color:var(--fg-2);text-decoration:none;letter-spacing:.05em;}
.band-head .more:hover,.band-head .more:focus-visible{color:var(--coral);}
.band-lede{font-size:.96rem;color:var(--fg-2);max-width:42em;margin-bottom:30px;}

/* 분류 지도 */
.map{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);}
.cell{background:var(--bg-2);padding:24px 22px 26px;display:block;text-decoration:none;color:inherit;transition:background .15s;}
a.cell:hover,a.cell:focus-visible{background:var(--bg-3);}
.cell .count{font-family:'IBM Plex Mono',monospace;font-size:.71rem;letter-spacing:.08em;color:var(--sage);}
.cell h3{font-family:'Gowun Batang',serif;font-size:1.18rem;font-weight:700;margin:7px 0;}
.cell p{font-size:.89rem;color:var(--fg-2);line-height:1.7;}
.cell.soon{background:#131313;}
.cell.soon .count{color:var(--fg-3);}
.cell.soon h3{color:var(--fg-2);}
.cell.soon p{color:var(--fg-3);}

/* 문서 목록 */
.docs{display:grid;grid-template-columns:repeat(auto-fit,minmax(292px,1fr));gap:36px;}
.docs section h3{font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.1em;color:var(--sage);border-bottom:1px solid var(--rule);padding-bottom:9px;margin-bottom:4px;}
.docs ul{list-style:none;}
.docs li{border-bottom:1px solid var(--rule);}
.docs a{display:block;padding:13px 2px;text-decoration:none;color:var(--fg);font-size:.95rem;line-height:1.55;}
.docs a:hover,.docs a:focus-visible{color:var(--coral);}

/* 판정 */
.verdicts{list-style:none;}
.verdicts li{border-top:1px solid var(--rule);}
.verdicts li:last-child{border-bottom:1px solid var(--rule);}
.verdicts a{display:grid;grid-template-columns:132px 1fr;gap:20px;padding:20px 4px;text-decoration:none;color:inherit;align-items:start;}
.verdicts a:hover .title,.verdicts a:focus-visible .title{color:var(--coral);}
.tag{font-family:'IBM Plex Mono',monospace;font-size:.71rem;letter-spacing:.06em;padding-top:5px;border-top:2px solid;display:inline-block;white-space:nowrap;}
.t-false{color:var(--coral);border-color:var(--coral-deep);}
.t-none{color:var(--amber);border-color:var(--amber);}
.t-err{color:var(--sage);border-color:var(--sage);}
.verdicts .title{font-family:'Gowun Batang',serif;font-size:1.08rem;font-weight:700;line-height:1.5;display:block;}
.verdicts .desc{margin-top:6px;font-size:.9rem;color:var(--fg-2);display:block;}

/* 원칙 */
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(226px,1fr));gap:26px;}
.rules div h3{font-family:'IBM Plex Mono',monospace;font-size:.73rem;letter-spacing:.08em;color:var(--sage);margin-bottom:8px;}
.rules div p{font-size:.92rem;color:var(--fg-2);}

/* 푸터 */
footer{padding:44px 0 64px;}
footer .wrap{display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap;align-items:flex-end;}
footer .sig{font-family:'Gowun Batang',serif;font-size:1.05rem;}
footer .sig span{color:var(--fg-2);font-size:.85rem;}
footer p.fine{font-size:.85rem;color:var(--fg-2);line-height:1.8;}

@media (max-width:640px){
  .verdicts a{grid-template-columns:1fr;gap:9px;}
  .hero{padding:58px 0 48px;}
  .hero .logo{margin-bottom:34px;}
  .band{padding:48px 0;}
  .masthead{position:static;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important;}}
