/* 입찰판정시스템 — Indigo Deck DS 토큰 (claude.ai/design 프로젝트에서 이식) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');

:root {
  --indigo-900:#1F1655; --indigo-800:#2A1F75; --indigo-700:#3B2E8C; --indigo-600:#4F40A8;
  --indigo-500:#6A5BC4; --indigo-400:#8C80D6; --indigo-300:#B5ADE5; --indigo-200:#D8D5F0;
  --indigo-100:#ECEAF8; --indigo-050:#F6F5FC;
  --ink-900:#1A1B2E; --ink-500:#5A5D78; --ink-400:#8B8EA8; --ink-200:#E2E3ED; --ink-100:#F1F2F8;
  --success:#2BB673; --success-bg:#E4F6EE; --warning:#F2A93B; --warning-bg:#FCEFD8;
  --danger:#E5484D; --danger-bg:#FBE4E5;
  --fg-1:var(--ink-900); --fg-2:var(--ink-500); --fg-3:var(--ink-400);
  --border-1:var(--ink-200); --border-2:var(--indigo-200);
  --r-xs:4px; --r-sm:8px; --r-md:12px; --r-lg:16px;
  --shadow-1:0 1px 2px rgba(31,22,85,.06); --shadow-3:0 12px 32px rgba(31,22,85,.12);
  --shadow-focus:0 0 0 3px rgba(107,91,196,.35);
  --font-body:'Noto Sans KR',system-ui,-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
* { box-sizing:border-box }
html,body { margin:0; font-family:var(--font-body); color:var(--fg-1);
  background:var(--indigo-050); font-size:14px; line-height:1.55;
  -webkit-font-smoothing:antialiased }
a { color:var(--indigo-700); text-decoration:none }
a:hover { color:var(--indigo-800) }
table { border-collapse:collapse; width:100% }
h1,h2,h3,h4,h5 { margin:0; letter-spacing:-0.01em }
button { font-family:inherit; cursor:pointer }
input,select { font-family:inherit }

/* ---- 셸 ---- */
.shell { min-height:100vh; display:grid; grid-template-columns:236px 1fr }
.side { background:var(--indigo-900); color:#fff; padding:20px 0 32px;
  display:flex; flex-direction:column; gap:22px; position:sticky; top:0; height:100vh; overflow:auto }
.side .brand { padding:0 20px; display:flex; align-items:center; gap:10px }
.side .brand .mark { width:28px; height:28px; border-radius:8px; background:var(--indigo-400);
  display:flex; align-items:center; justify-content:center; font-weight:900; font-size:13px; color:var(--indigo-900) }
.side .brand .t1 { font-weight:900; font-size:15px; display:block; line-height:1.15 }
.side .brand .t2 { font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--indigo-300) }
.side .grp { display:flex; flex-direction:column; gap:4px; padding:0 12px }
.side .grp .cap { font-size:10px; font-weight:700; letter-spacing:.14em; color:var(--indigo-400); padding:8px 8px 4px }
.navbtn { display:block; width:100%; text-align:left; border:0; border-radius:var(--r-sm);
  padding:9px 12px; font-size:13px; font-weight:700; color:var(--indigo-200); background:transparent }
.navbtn:hover { background:var(--indigo-800); color:#fff }
.navbtn.on { background:var(--indigo-700); color:#fff }
.main { min-width:0; display:flex; flex-direction:column }
.topbar { height:60px; background:#fff; border-bottom:1px solid var(--border-1);
  display:flex; align-items:center; justify-content:space-between; padding:0 28px;
  position:sticky; top:0; z-index:5 }
.topbar .left,.topbar .right { display:flex; align-items:center; gap:10px }
.vline { width:1px; height:16px; background:var(--border-1) }
.chip { font-size:12px; font-weight:700; color:var(--indigo-700); background:var(--indigo-100);
  border-radius:999px; padding:3px 10px }
.avatar { width:28px; height:28px; border-radius:999px; background:var(--indigo-700); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700 }
.content { padding:26px 28px 48px; display:flex; flex-direction:column; gap:18px; max-width:1440px }
.eyebrow { font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-3) }
.h-title { font-size:26px; font-weight:900; letter-spacing:-0.02em; margin-top:2px }
.sub { font-size:13px; color:var(--fg-2); margin:4px 0 0 }

/* ---- 조직 스위처 ---- */
.orgsw { position:relative }
.orgsw>button { display:flex; align-items:center; gap:9px; height:38px; padding:0 12px;
  border:1px solid var(--border-1); border-radius:var(--r-sm); background:#fff }
.orgsw>button:hover { background:var(--indigo-100); border-color:var(--indigo-200) }
.orgsw .menu { display:none; position:absolute; top:44px; left:0; width:322px; background:#fff;
  border:1px solid var(--border-1); border-radius:var(--r-md); box-shadow:var(--shadow-3);
  padding:8px; z-index:20 }
.orgsw.open .menu { display:block }
.orgsw .menu button { display:flex; width:100%; gap:9px; align-items:center; text-align:left;
  border:0; background:transparent; border-radius:var(--r-sm); padding:8px }
.orgsw .menu button:hover { background:var(--indigo-100) }

/* ---- 카드/버튼/테이블 ---- */
.card { background:#fff; border:1px solid var(--border-1); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:14px 16px }
.cards4 { display:grid; grid-template-columns:repeat(4,1fr); gap:12px }
.stat .cap { font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--fg-3) }
.stat .num { font-family:var(--font-mono); font-size:30px; font-weight:900; letter-spacing:-0.02em; margin-top:2px }
.stat .d { font-size:12px; color:var(--fg-2) }
.stat.ok { border-left:3px solid var(--success) } .stat.ok .cap,.stat.ok .num { color:var(--success) }
.stat.warn { border-left:3px solid var(--warning) } .stat.warn .cap,.stat.warn .num { color:var(--warning) }
.stat.bad { border-left:3px solid var(--danger) } .stat.bad .cap,.stat.bad .num { color:var(--danger) }
.btn { height:34px; padding:0 14px; border-radius:var(--r-sm); border:1px solid var(--border-1);
  background:#fff; font-size:13px; font-weight:700; color:var(--fg-1); display:inline-flex; align-items:center }
.btn:hover { background:var(--indigo-100); border-color:var(--indigo-200) }
.btn.primary { border-color:var(--indigo-700); background:var(--indigo-700); color:#fff }
.btn.primary:hover { background:var(--indigo-800) }
.tbl th { text-align:left; font-size:11px; font-weight:700; letter-spacing:.06em;
  color:var(--indigo-800); background:var(--indigo-100); padding:9px 12px;
  border-bottom:1px solid var(--border-2); white-space:nowrap }
.tbl th.r, .tbl td.r { text-align:right }
.tbl td { padding:10px 12px; border-bottom:1px solid var(--border-1); font-size:13px }
.tbl td.mono { font-family:var(--font-mono); font-size:12px; color:var(--fg-2); white-space:nowrap }
.tbl td.amt { font-family:var(--font-mono); text-align:right; white-space:nowrap }
.badge { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700;
  border-radius:999px; padding:4px 11px }
.badge .dot { width:7px; height:7px; border-radius:999px }
.badge.ok { background:var(--success-bg); color:#1B7A4B } .badge.ok .dot { background:var(--success) }
.badge.warn { background:var(--warning-bg); color:#9A6410 } .badge.warn .dot { background:var(--warning) }
.badge.bad { background:var(--danger-bg); color:#B02A2E } .badge.bad .dot { background:var(--danger) }
.badge.na { background:var(--ink-100); color:var(--fg-2) } .badge.na .dot { background:var(--ink-400) }

/* ---- 폼 ---- */
.field label { display:block; font-size:12px; font-weight:700; color:var(--fg-2); margin:14px 0 5px }
.field input[type=text],.field input[type=email],.field input[type=password],.field input[type=number],.field select {
  width:100%; height:40px; border:1px solid var(--border-1); border-radius:var(--r-xs);
  padding:0 12px; font-size:14px; background:#fff }
.field input:focus { outline:none; border-color:var(--indigo-500); box-shadow:var(--shadow-focus) }
.checks { display:flex; flex-wrap:wrap; gap:6px }
.checks label { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700;
  border:1px solid var(--border-1); border-radius:999px; padding:5px 12px; cursor:pointer; background:#fff }
.checks input { accent-color:var(--indigo-700) }
.checks label:has(input:checked) { background:var(--indigo-100); color:var(--indigo-700); border-color:var(--indigo-200) }

/* ---- 인증 페이지 ---- */
.authwrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--indigo-050) }
.authcard { width:400px; background:#fff; border:1px solid var(--border-1); border-radius:var(--r-lg);
  box-shadow:var(--shadow-3); padding:32px }
.err { background:var(--danger-bg); color:#B02A2E; font-size:13px; font-weight:700;
  border-radius:var(--r-sm); padding:10px 14px; margin:12px 0 }
.notice-info { background:var(--indigo-100); border:1px solid var(--indigo-200);
  border-radius:var(--r-md); padding:14px 18px; font-size:13px }
.formula { background:#fff; border:2px solid var(--indigo-700); border-radius:var(--r-lg); padding:22px 24px }
.formula .f { font-family:var(--font-mono); font-size:20px; font-weight:700; margin:10px 0 4px }
.abox { border-radius:var(--r-md); padding:16px 18px; border:1px solid }
.abox.good { border-color:var(--success); background:var(--success-bg); color:#14603A }
.abox.badx { border-color:var(--danger); background:var(--danger-bg); color:#8E2226 }
.abox .amt { font-family:var(--font-mono); font-size:24px; font-weight:900; margin-top:6px }