:root{
  --bg:#0a0612; --card:#140d20; --line:#2a1f3d;
  --text:#e8e4f0; --muted:#9a90b0; --cyan:#22d3ee; --magenta:#e879f9;
}
*{box-sizing:border-box}
body{
  margin:0; padding:0; background:var(--bg); color:var(--text);
  font:16px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif;
  -webkit-text-size-adjust:100%;
}
.wrap{max-width:760px; margin:0 auto; padding:32px 20px 80px}
header{border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:28px}
.brand{
  font-size:13px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--cyan); font-weight:700; text-decoration:none; display:inline-block;
}
h1{font-size:26px; line-height:1.35; margin:14px 0 6px}
h2{font-size:18px; margin:34px 0 10px; color:#fff}
h3{font-size:15px; margin:22px 0 6px; color:var(--cyan)}
.meta{color:var(--muted); font-size:13px; margin:0}
p,li{color:var(--text)}
ul{padding-left:20px}
li{margin:6px 0}
a{color:var(--cyan)}
code{background:#1d1430; padding:2px 6px; border-radius:5px; font-size:.9em; color:var(--magenta)}
table{width:100%; border-collapse:collapse; margin:12px 0; font-size:14px; display:block; overflow-x:auto}
th,td{border:1px solid var(--line); padding:9px 11px; text-align:left; vertical-align:top}
th{background:#1a1129; color:#fff; font-weight:700; white-space:nowrap}
.note{
  background:var(--card); border:1px solid var(--line); border-left:3px solid var(--magenta);
  border-radius:10px; padding:14px 16px; margin:18px 0;
}
.note p{margin:0; font-size:14px; color:var(--muted)}
.note strong{color:var(--text)}
.langbar{display:flex; gap:8px; margin:18px 0 0}
.langbar button{
  background:transparent; border:1px solid var(--line); color:var(--muted);
  padding:6px 14px; border-radius:999px; font:inherit; font-size:13px; cursor:pointer;
}
.langbar button[aria-pressed="true"]{border-color:var(--cyan); color:var(--cyan); background:#0f1a24}
footer{margin-top:56px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:13px}
footer a{margin-right:16px}