:root { --ink:#11182b; --muted:#61708b; --line:#dce5f1; --indigo:#5146f5; --wash:#f8faff; --mint:#058665; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#fff; font-family:Pretendard,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
.hidden { display:none!important; }
.auth-shell { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; }
.auth-panel { width:min(520px,calc(100% - 48px)); margin:auto; padding:60px 0; }
.brand-mark { width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:var(--indigo);color:#fff;font-weight:800;box-shadow:0 12px 28px #5146f53b;margin-bottom:48px; }
.brand-mark.small { width:34px;height:34px;border-radius:11px;margin:0;font-size:14px; }
.eyebrow { margin:0 0 16px;color:#8b99af;font-size:12px;font-weight:800;letter-spacing:.14em; }
.auth-panel h1 { margin:0;font-size:clamp(48px,6vw,76px);line-height:1.08;letter-spacing:-.065em; }
.auth-copy { margin:24px 0 34px;color:var(--muted);font-size:17px;line-height:1.7; }
.primary-button { width:100%;min-height:54px;border:0;border-radius:14px;background:var(--ink);color:#fff;font-weight:750;cursor:pointer; }
.primary-button:hover { background:var(--indigo); }
.primary-button:disabled { opacity:.6;cursor:wait; }
#verify-form label { display:block;margin-bottom:9px;font-size:13px;font-weight:750; }
#otp { width:100%;height:64px;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;text-align:center;font-size:28px;font-weight:800;letter-spacing:.3em;outline:none; }
#otp:focus { border-color:#9d97fa;box-shadow:0 0 0 4px #f1f0ff; }
.text-button { display:block;margin:16px auto 0;border:0;background:none;color:var(--indigo);font-weight:700;cursor:pointer; }
.message { min-height:42px;color:#596985;font-size:13px;line-height:1.6; }
.bot-note { margin-top:38px;color:#9aa6b8;font-size:12px; }
.auth-visual { position:relative;overflow:hidden;background:linear-gradient(145deg,#f7f8ff,#ecebff); }
.auth-visual::before { content:"";position:absolute;inset:0;background-image:radial-gradient(#b9b5ff 1.5px,transparent 1.5px);background-size:24px 24px;opacity:.35; }
.auth-visual span { position:absolute;left:18%;right:18%;height:22%;border:1px solid #d8d6fa;border-radius:28px;background:#ffffffc9;box-shadow:0 20px 60px #4b43851c; }
.auth-visual span:nth-child(1){top:14%;transform:translateX(5%)}.auth-visual span:nth-child(2){top:39%;transform:translateX(-4%)}.auth-visual span:nth-child(3){top:64%;transform:translateX(7%)}
.portal { width:min(1180px,calc(100% - 48px));margin:0 auto; }
.topbar { min-height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between; }
.brand { display:flex;align-items:center;gap:12px; }
.logout-button { border:1px solid var(--line);border-radius:99px;background:#fff;padding:10px 15px;color:#596985;cursor:pointer; }
.hero { padding:112px 0 88px; }
.hero h1 { max-width:780px;margin:0;font-size:clamp(43px,6.6vw,78px);line-height:1.08;letter-spacing:-.065em; }
.hero>p:last-child { margin:28px 0 0;color:var(--muted);font-size:18px; }
.summary { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.summary>div { min-height:146px;border:1px solid var(--line);border-radius:24px;padding:34px;display:flex;flex-direction:column;justify-content:center; }
.summary strong { font-size:34px; }.summary span { margin-top:7px;color:var(--muted);font-size:14px; }
.directory { padding:112px 0 96px; }.section-title h2 { margin:0;font-size:34px;letter-spacing:-.05em; }
.service-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px; }
.service-card { min-height:410px;border:1px solid var(--line);border-radius:24px;padding:28px;display:flex;flex-direction:column;transition:.2s; }
.service-card:hover { transform:translateY(-4px);border-color:#c5c1ff;box-shadow:0 22px 50px #334a7517; }
.card-top { display:flex;align-items:center;justify-content:space-between;color:#a5b0c2;font-size:13px;font-weight:750; }
.status { color:var(--mint);border:1px solid #c5ecdf;border-radius:99px;background:#f2fcf8;padding:7px 11px; }
.category { margin:26px 0 12px;color:var(--indigo);font-size:13px;font-weight:750; }.service-card h3 { margin:0;font-size:23px;line-height:1.35;letter-spacing:-.04em; }
.description { color:var(--muted);line-height:1.7;margin:16px 0 20px;font-size:15px; }.tags { display:flex;flex-wrap:wrap;gap:8px; }.tags span { padding:7px 10px;border-radius:8px;background:var(--wash);color:#53647f;font-size:12px; }
.card-footer { border-top:1px solid #edf1f7;padding-top:20px;margin-top:auto;display:flex;justify-content:space-between;color:#97a3b5;font-size:13px; }.card-footer a { color:var(--indigo);font-weight:750;text-decoration:none; }
footer { min-height:150px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:#91a0b5;font-size:13px; }
@media(max-width:850px){.auth-shell{grid-template-columns:1fr}.auth-visual{display:none}.summary{grid-template-columns:1fr}.service-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.auth-panel{width:calc(100% - 36px)}.portal{width:calc(100% - 30px)}.hero{padding:76px 0 60px}.hero h1{font-size:42px}.service-grid{grid-template-columns:1fr}.summary>div{min-height:110px}.directory{padding:84px 0 70px}footer{flex-direction:column;align-items:flex-start;justify-content:center;gap:5px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}