:root{--violet:#7C4DFF;--lime:#C6FF00;--brand-tick:#C6FF00;--bg:#0B0B10;--surface:#16161F;--surface-high:#22222E;--text:#F5F5FA;--text2:#B6B6C6;--line:rgba(255,255,255,.1)}
*{box-sizing:border-box;margin:0;padding:0}
html{color-scheme:dark}
body{background:var(--bg);color:var(--text);font-family:"Pretendard","Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--lime)}
.wrap{max-width:720px;margin:0 auto;padding:24px 16px 64px}
header.top{display:flex;align-items:center;gap:10px;padding:8px 0 24px}
header.top .brand{display:inline-flex;align-items:center;gap:10px}
header.top .logo{width:36px;height:36px;flex:none}
/* wordmark: letters in the text colour, tick lime on dark and ink on light (DESIGN.md §7); 2.395:1 */
header.top .wm{height:22px;width:53px;flex:none;color:var(--text)}
header.top a{color:var(--text);text-decoration:none;font-weight:800;font-size:18px}
h1{font-size:28px;font-weight:900;letter-spacing:-.5px;line-height:1.25;margin-bottom:8px}
h2{font-size:18px;font-weight:800;margin:32px 0 8px}
h3{font-size:15px;font-weight:800;margin:20px 0 6px}
p,li{font-size:15px;color:var(--text2)}
ul,ol{padding-left:20px;margin:6px 0}
table{width:100%;border-collapse:collapse;font-size:14px;margin:8px 0}
th,td{border:1px solid var(--line);padding:8px;text-align:left;vertical-align:top;color:var(--text2)}
th{color:var(--text);background:var(--surface)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 22px;border-radius:14px;background:var(--violet);color:#fff;font-weight:800;text-decoration:none;font-size:15px}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.meta{font-size:13px;color:var(--text2)}
.draft{background:#3a2a00;border:1px solid #FFB300;color:#FFD466;border-radius:12px;padding:10px 14px;font-size:13px;margin-bottom:20px}
footer{margin-top:48px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--text2)}
footer a{color:var(--text2);margin-right:12px}
@media (prefers-color-scheme:light){:root{--bg:#FFFFFF;--surface:#F4F4F8;--surface-high:#E9E9F1;--text:#15151C;--text2:#4E4E60;--line:rgba(0,0,0,.1)}html{color-scheme:light}a{color:#5A2BE0}:root{--brand-tick:var(--text)}}