/* 《겨레말큰사전》 이관·정합성 검증 관리자 — 시연용 프로토타입 공통 스타일
   (제안서 화면 설계안 목업 common.css 기반. 색·레이아웃·문구 유지, 고정 1440×900 → 유동 레이아웃) */
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;font-family:"Malgun Gothic","맑은 고딕","Apple SD Gothic Neo",sans-serif;color:#1f2937;background:#eef1f5;font-size:13px}
body{overflow-x:auto}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
a{color:inherit}
.app{display:flex;min-width:1024px;min-height:100vh}
.side{width:224px;flex:none;background:#1F2A44;color:#cbd5e1;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{padding:22px 20px 18px;border-bottom:1px solid rgba(255,255,255,.08);display:block;text-decoration:none}
.brand .t{color:#fff;font-weight:700;font-size:15px;letter-spacing:-.2px}
.brand .s{font-size:11px;color:#94a3b8;margin-top:4px}
.nav{padding:14px 12px;flex:1;overflow:auto}
.nav .g{font-size:10px;color:#64748b;letter-spacing:.08em;padding:12px 10px 6px;text-transform:uppercase}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:#cbd5e1;font-size:13px;text-decoration:none;cursor:pointer}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav a.on{background:#2E5E8C;color:#fff;font-weight:700}
.nav a i{width:18px;height:18px;border-radius:5px;background:rgba(255,255,255,.12);display:inline-block;flex:none}
.nav a.on i{background:rgba(255,255,255,.35)}
.side .foot{padding:14px 20px;font-size:11px;color:#94a3b8;border-top:1px solid rgba(255,255,255,.08);line-height:1.5}
.side .foot .demo-note{margin-top:8px;font-size:10px;color:#64748b}
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.top{height:58px;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;padding:0 28px;gap:16px;flex:none}
.top h1{font-size:17px;font-weight:700;color:#111827;white-space:nowrap}
.top .crumb{font-size:12px;color:#6b7280;white-space:nowrap}
.top .sp{flex:1}
.top .env{font-size:11px;background:#fef3c7;color:#92400e;padding:4px 10px;border-radius:999px;font-weight:700;white-space:nowrap}
.top .env.demo{background:#dbeafe;color:#1e40af}
.top .user{display:flex;align-items:center;gap:8px;font-size:12px;color:#374151;white-space:nowrap}
.top .user b{width:28px;height:28px;border-radius:50%;background:#2E5E8C;display:inline-block}
.content{padding:22px 28px;flex:1}
.row{display:flex;gap:16px}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px 20px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.card h3{font-size:13px;font-weight:700;color:#111827;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.card h3 small{font-weight:400;color:#6b7280;font-size:11px;text-align:right}
.kpi{flex:1}
.kpi .l{font-size:12px;color:#6b7280}
.kpi .v{font-size:28px;font-weight:800;color:#111827;margin-top:6px;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.kpi .v small{font-size:13px;font-weight:600;color:#6b7280;margin-left:4px}
.kpi .d{font-size:11px;margin-top:6px}
.ok{color:#047857}.warn{color:#b45309}.bad{color:#b91c1c}.mut{color:#6b7280}
.pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.pill.ok{background:#d1fae5;color:#065f46}.pill.warn{background:#fef3c7;color:#92400e}.pill.bad{background:#fee2e2;color:#991b1b}.pill.info{background:#dbeafe;color:#1e40af}.pill.gray{background:#f3f4f6;color:#374151}
table{width:100%;border-collapse:collapse;font-size:12px}
th{background:#f8fafc;color:#475569;font-weight:700;text-align:left;padding:9px 10px;border-bottom:1px solid #e5e7eb;font-size:11px;white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr.click{cursor:pointer}
tr.click:hover td{background:#f8fafc}
.num{text-align:right;font-variant-numeric:tabular-nums}
.bar{height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;background:#2E5E8C;border-radius:999px;transition:width .3s}
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:8px;font-size:12px;font-weight:700;border:1px solid #d1d5db;background:#fff;color:#374151;cursor:pointer;white-space:nowrap;line-height:1.3;text-decoration:none}
.btn:hover{background:#f8fafc}
.btn.p{background:#2E5E8C;border-color:#2E5E8C;color:#fff}
.btn.p:hover{background:#27507a}
.btn.r{background:#C8412B;border-color:#C8412B;color:#fff}
.btn.r:hover{background:#b33a26}
.btn.on{background:#1F2A44;border-color:#1F2A44;color:#fff}
.btn:disabled,.btn.dis{opacity:.45;cursor:not-allowed}
.btn.sm{padding:4px 8px;font-size:11px}
.btn select{border:none;background:transparent;font-weight:700;font-size:12px;color:#374151;outline:none;cursor:pointer;padding:0}
.input{display:flex;align-items:center;gap:8px;border:1px solid #d1d5db;border-radius:8px;padding:8px 12px;background:#fff;font-size:13px;color:#111827}
.input span{color:#9ca3af}
.input input{border:none;outline:none;flex:1;font-size:14px;color:#111827;background:transparent;min-width:0}
.input input::placeholder{color:#9ca3af}
.tag{display:inline-block;background:#eef2f7;color:#1F2A44;padding:2px 7px;border-radius:5px;font-size:11px;font-weight:700;margin-right:4px}
.mono{font-family:Consolas,"D2Coding",monospace}
.label{font-size:11px;color:#6b7280;font-weight:700;letter-spacing:.02em}
.oh{font-family:"함초롬바탕","HCR Batang","HANBatang",serif}
.link{color:#2E5E8C;cursor:pointer;text-decoration:none}
.link:hover{text-decoration:underline}

/* 토스트 (우측 하단) */
.toast-wrap{position:fixed;right:24px;bottom:24px;display:flex;flex-direction:column;gap:8px;z-index:1000}
.toast{background:#1F2A44;color:#fff;padding:10px 14px;border-radius:10px;font-size:12px;box-shadow:0 8px 24px rgba(16,24,40,.25);max-width:420px;opacity:0;transform:translateY(8px);transition:all .25s;line-height:1.5}
.toast.show{opacity:1;transform:none}
.toast.ok{border-left:4px solid #4ade80}.toast.warn{border-left:4px solid #fbbf24}.toast.info{border-left:4px solid #7dd3fc}

/* 모달 */
.modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;z-index:900}
.modal-bg.show{display:flex}
.modal{background:#fff;border-radius:14px;width:640px;max-width:calc(100vw - 40px);box-shadow:0 20px 60px rgba(16,24,40,.35);overflow:hidden}
.modal .mh{padding:16px 20px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}
.modal .mh b{font-size:14px;color:#111827}
.modal .mh small{color:#6b7280;font-size:11px;margin-left:8px;font-weight:400}
.modal .mb{padding:18px 20px;font-size:12px;max-height:70vh;overflow:auto}
.modal .mf{padding:12px 20px;border-top:1px solid #e5e7eb;display:flex;gap:8px;justify-content:flex-end;background:#f8fafc}
.modal textarea{width:100%;border:1px solid #d1d5db;border-radius:8px;padding:10px;font-size:12px;line-height:1.6;min-height:96px;resize:vertical;font-family:Consolas,"D2Coding",monospace}
.modal select{border:1px solid #d1d5db;border-radius:8px;padding:6px 8px;font-size:12px;background:#fff;width:100%}
.x{cursor:pointer;color:#6b7280;font-size:16px;line-height:1;padding:2px 6px;border-radius:6px}
.x:hover{background:#f1f5f9}

/* 요약 모달 통계 */
.sumgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 14px}
.sumgrid .s{border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px}
.sumgrid .s .l{font-size:11px;color:#6b7280}
.sumgrid .s .v{font-size:20px;font-weight:800;margin-top:4px;font-variant-numeric:tabular-nums}

/* 필드 매핑 카드 (규칙 수정 모달) */
.mapcard{border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;margin-bottom:12px;background:#fafbfc}
.mapcard .mt{font-size:11px;color:#6b7280;font-weight:700;margin-bottom:8px;letter-spacing:.02em}
.maprow{display:grid;grid-template-columns:1fr 28px 1fr;gap:8px;align-items:center;margin-bottom:8px}
.maprow .src{border:1px solid #d1d5db;border-radius:8px;padding:7px 10px;background:#fff;font-family:Consolas,"D2Coding",monospace;font-size:11.5px}
.maprow .arr{text-align:center;color:#94a3b8;font-weight:700}
.maphead{display:grid;grid-template-columns:1fr 28px 1fr;gap:8px;font-size:11px;color:#6b7280;font-weight:700;margin-bottom:6px}

/* 초기 로딩 시 깜빡임 방지 */
[hidden]{display:none!important}

/* 시연/설계만 구분 */
.nav a .lbl{flex:1;min-width:0}
.navtag{flex:none;font-size:9px;line-height:1;padding:3px 6px;border-radius:999px;font-weight:700;letter-spacing:.02em}
.navtag.ok{background:#0f9d6a;color:#fff}
.navtag.soon{background:rgba(255,255,255,.10);color:#94a3b8;border:1px solid rgba(255,255,255,.18)}
.nav a.na{color:#7f8ba3;cursor:not-allowed}
.nav a.na i{background:transparent;border:1px dashed rgba(255,255,255,.3)}
.nav a.na:hover{background:rgba(255,255,255,.03);color:#94a3b8}
.navlegend{margin:14px 6px 4px;padding:10px;border-top:1px solid rgba(255,255,255,.08);font-size:10px;color:#94a3b8;line-height:1.9}
.navlegend span{display:flex;align-items:center;gap:6px}
