:root{--bg:#ffffff;--ink:#16181d;--muted:#666b75;--faint:#9a9ea7;--line:#e4e6ea;--accent:#2445c4;--nam:#d9480f;--sem:#1c6fd1;--gap:#2b8a3e;--bub:#5f3dc4;--neung:#c2255c}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#121418;--ink:#eceef2;--muted:#a3a8b2;--faint:#6f7480;--line:#2a2e36;--accent:#8ea6ff;--nam:#ff8a4c;--sem:#6fa8ff;--gap:#69db7c;--bub:#b197fc;--neung:#f783ac}}
:root[data-theme="dark"]{--bg:#121418;--ink:#eceef2;--muted:#a3a8b2;--faint:#6f7480;--line:#2a2e36;--accent:#8ea6ff;--nam:#ff8a4c;--sem:#6fa8ff;--gap:#69db7c;--bub:#b197fc;--neung:#f783ac}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.75 "Pretendard Variable",Pretendard,system-ui,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
@media (max-width:560px){.wrap{padding:0 18px}}

.top{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:-.2px;text-decoration:none}
.logo svg{width:22px;height:22px}
.top nav{display:flex;gap:22px;font-size:14.5px}
.top nav a{text-decoration:none;color:var(--muted)}.top nav a:hover{color:var(--ink)}
@media (max-width:560px){.top nav a.hide-s{display:none}}

/* hero */
.hero{padding:88px 0 72px;border-bottom:1px solid var(--line)}
@media (max-width:560px){.hero{padding:48px 0 44px}}
h1{font-size:clamp(34px,6.2vw,68px);line-height:1.18;letter-spacing:-.045em;font-weight:700;margin:0;max-width:15.5ch;text-wrap:balance}
.lead{font-size:clamp(16.5px,1.9vw,19px);color:var(--muted);margin:28px 0 0;max-width:38em;line-height:1.7}

/* index of tools */
.index{display:grid;grid-template-columns:repeat(5,1fr);gap:0 24px;margin-top:64px}
@media (max-width:1060px){.index{grid-template-columns:repeat(3,1fr);gap:36px 28px}}
@media (max-width:720px){.index{grid-template-columns:repeat(2,1fr);gap:36px 28px}}
@media (max-width:480px){.index{grid-template-columns:1fr;gap:30px}}
.col h2{display:flex;align-items:baseline;gap:8px;font-size:15px;font-weight:700;margin:0 0 4px;letter-spacing:0}
.col h2::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);flex:none;transform:translateY(-1px)}
.col h2 a{text-decoration:none}.col h2 a:hover{text-decoration:underline}
.col .dom{font-size:13px;color:var(--faint);margin:0 0 14px}
.col ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.col li{border-bottom:1px solid var(--line)}
.col li a{display:block;padding:9px 0;font-size:15px;text-decoration:none;color:var(--ink)}
.col li a:hover{color:var(--c)}
.c-nam{--c:var(--nam)}.c-sem{--c:var(--sem)}.c-gap{--c:var(--gap)}.c-bub{--c:var(--bub)}.c-neung{--c:var(--neung)}

/* sections */
section{padding:88px 0;border-bottom:1px solid var(--line)}
@media (max-width:560px){section{padding:56px 0}}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px}
@media (max-width:800px){.split{grid-template-columns:1fr;gap:20px}}
.split > h2{font-size:clamp(22px,2.6vw,28px);line-height:1.35;letter-spacing:-.03em;margin:0;font-weight:700}
.body p{margin:0 0 16px;max-width:40em}
.muted{color:var(--muted)}

.apps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
@media (max-width:800px){.apps{grid-template-columns:1fr;gap:24px}}
.app h3{font-size:18px;margin:0 0 6px;letter-spacing:-.01em}
.app h3 small{font-weight:500;color:var(--faint);font-size:14px;margin-left:6px}
.app p{margin:0 0 8px;color:var(--muted);font-size:15px}
.app .go{display:inline-block;margin:0 0 6px;font-size:15px;font-weight:600;color:var(--accent);text-decoration:none}.app .go:hover{text-decoration:underline}
.app .state{display:block;font-size:13px;color:var(--faint)}

.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 40px;margin:0}
@media (max-width:640px){.rules{grid-template-columns:1fr;gap:22px}}
.rules dt{font-weight:700;font-size:17px;margin:0 0 4px}
.rules dd{margin:0;color:var(--muted);font-size:15.5px}

.contact{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
@media (max-width:640px){.contact{grid-template-columns:1fr;gap:32px}}
.contact h3{font-size:16px;margin:0 0 8px}
.contact p{margin:0 0 12px;color:var(--muted);font-size:15px}
.contact ul{list-style:none;margin:0;padding:0}
.contact li{margin:0 0 4px}
.mail{font-size:clamp(20px,2.4vw,26px);font-weight:700;letter-spacing:-.02em;text-decoration:none;border-bottom:2px solid var(--accent);color:var(--ink)}
dl.info{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin:0;font-size:15px}
dl.info dt{color:var(--faint)}dl.info dd{margin:0}
