@charset "utf-8";
/* ============================================================
   SD Flex 관리자 UI
   상단 중앙 대메뉴 + 좌측 소메뉴 레이아웃
   ============================================================ */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css');

:root {
    --a-brand: #0033A0;
    --a-brand-600: #002B87;
    --a-brand-50: #EEF2FB;
    --a-brand-100: #DCE4F7;
    --a-accent: #3B82F6;
    --a-bg: #F5F7FB;
    --a-surface: #FFFFFF;
    --a-surface-2: #F8F9FB;
    --a-border: #E5E7EB;
    --a-border-2: #D1D5DB;
    --a-text: #111827;
    --a-text-2: #4B5563;
    --a-text-3: #6B7280;
    --a-text-4: #9CA3AF;
    --a-red: #D92D20;
    --a-red-50: #FEF3F2;
    --a-green: #067647;
    --a-green-50: #ECFDF3;
    --a-amber: #B54708;
    --a-amber-50: #FFFAEB;
    --a-radius: 12px;
    --a-radius-sm: 8px;
    --a-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.06);
    --a-shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.12);
    --a-topbar: 64px;
    --a-sidebar: 232px;
    /* 차트 */
    --viz-1: #2a78d6;
    --viz-2: #eb6834;
    --viz-3: #1baf7a;
    --viz-4: #eda100;
    --viz-grid: #EEF0F3;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 14px; -webkit-text-size-adjust: 100%; }
body.adm-body { margin: 0; font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size: 14px; line-height: 1.55; color: var(--a-text); background: var(--a-bg); -webkit-font-smoothing: antialiased; word-break: keep-all; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; padding: 0; }
img { max-width: 100%; vertical-align: middle; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, figure { margin: 0; }
table { border-collapse: collapse; width: 100%; }
input, select, textarea { font: inherit; color: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }

/* ── 상단 바 ─────────────────────────────────────────────── */
.adm-topbar { position: fixed; inset: 0 0 auto 0; height: var(--a-topbar); background: var(--a-surface); border-bottom: 1px solid var(--a-border); z-index: 100; display: grid; grid-template-columns: var(--a-sidebar) 1fr auto; align-items: center; padding: 0 20px 0 0; }
.adm-logo { display: flex; align-items: center; gap: 10px; height: 100%; padding: 0 24px; border-right: 1px solid var(--a-border); }
.adm-logo img { height: 24px; width: auto; }
.adm-logo span { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; color: var(--a-text-3); text-transform: uppercase; padding: 3px 7px; border: 1px solid var(--a-border); border-radius: 999px; }
.adm-mainnav { display: flex; justify-content: center; gap: 4px; }
.adm-mainnav a { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 999px; font-size: 15px; font-weight: 500; color: var(--a-text-2); transition: background 0.15s, color 0.15s; }
.adm-mainnav a:hover { background: var(--a-surface-2); color: var(--a-text); }
.adm-mainnav a.active { background: var(--a-brand); color: #fff; font-weight: 600; }
.adm-mainnav a .badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--a-red); color: #fff; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.adm-mainnav a.active .badge { background: #fff; color: var(--a-brand); }
.adm-mainnav a .badge[hidden], .adm-subnav .count[hidden] { display: none; }
.adm-topbar-right { display: flex; align-items: center; gap: 8px; }
.adm-user { display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 6px; border-radius: 999px; }
.adm-user .avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--a-brand-50); color: var(--a-brand); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.adm-user .name { font-weight: 600; }
.adm-user .role { font-size: 12px; color: var(--a-text-3); }
.adm-menu-toggle { display: none; width: 40px; height: 40px; border-radius: 8px; align-items: center; justify-content: center; }

/* ── 사이드바 ────────────────────────────────────────────── */
.adm-sidebar { position: fixed; top: var(--a-topbar); left: 0; bottom: 0; width: var(--a-sidebar); background: var(--a-surface); border-right: 1px solid var(--a-border); padding: 20px 14px; overflow-y: auto; z-index: 90; }
.adm-sidebar .group-tit { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; color: var(--a-text-4); text-transform: uppercase; padding: 8px 12px 6px; }
.adm-subnav a { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 12px; border-radius: 10px; color: var(--a-text-2); font-weight: 500; transition: background 0.15s, color 0.15s; position: relative; }
.adm-subnav a svg { width: 18px; height: 18px; flex: none; opacity: 0.75; }
.adm-subnav a:hover { background: var(--a-surface-2); color: var(--a-text); }
.adm-subnav a.active { background: var(--a-brand-50); color: var(--a-brand); font-weight: 600; }
.adm-subnav a.active svg { opacity: 1; }
.adm-subnav a .count { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--a-text-3); background: var(--a-surface-2); padding: 1px 8px; border-radius: 999px; }
.adm-subnav a.active .count { background: #fff; color: var(--a-brand); }
.adm-sidebar-foot { position: absolute; left: 14px; right: 14px; bottom: 16px; font-size: 12px; color: var(--a-text-4); padding: 0 12px; }

/* ── 본문 ────────────────────────────────────────────────── */
.adm-main { margin: var(--a-topbar) 0 0 var(--a-sidebar); padding: 28px 32px 60px; min-height: calc(100vh - var(--a-topbar)); }
.adm-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.adm-page-head h1 { font-size: 24px; font-weight: 700; letter-spacing: -0.01em; }
.adm-page-head .desc { margin-top: 4px; color: var(--a-text-3); }
.adm-page-head .actions { display: flex; gap: 8px; }
.adm-crumb { font-size: 12px; color: var(--a-text-4); margin-bottom: 6px; display: flex; gap: 6px; }

/* ── 카드 ────────────────────────────────────────────────── */
.adm-card { background: var(--a-surface); border: 1px solid var(--a-border); border-radius: var(--a-radius); box-shadow: var(--a-shadow); }
.adm-card + .adm-card { margin-top: 20px; }
.adm-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid var(--a-border); }
.adm-card-head h2 { font-size: 16px; font-weight: 700; }
.adm-card-head .sub { font-size: 12px; color: var(--a-text-3); margin-left: 8px; font-weight: 500; }
.adm-card-body { padding: 22px; }
.adm-card-body.flush { padding: 0; }
.adm-grid { display: grid; gap: 20px; }
.adm-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.adm-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.adm-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.adm-grid.cols-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.adm-grid.cols-1-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.adm-grid > .adm-card { margin-top: 0; }

/* ── 통계 타일 ───────────────────────────────────────────── */
.adm-stat { padding: 18px 20px; }
.adm-stat .label { font-size: 13px; color: var(--a-text-3); font-weight: 500; }
.adm-stat .value { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; margin-top: 6px; font-variant-numeric: tabular-nums; }
.adm-stat .value small { font-size: 14px; font-weight: 500; color: var(--a-text-3); margin-left: 4px; }
.adm-stat .delta { margin-top: 6px; font-size: 12px; color: var(--a-text-3); display: flex; align-items: center; gap: 6px; }
.adm-stat .delta b { font-weight: 600; }
.adm-stat .delta.up b { color: var(--a-green); }
.adm-stat .delta.down b { color: var(--a-red); }
.adm-stat .spark { margin-top: 10px; height: 34px; }
.adm-stat.hero .value { font-size: 40px; }

/* ── 버튼 ────────────────────────────────────────────────── */
.adm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; padding: 0 16px; border-radius: var(--a-radius-sm); font-size: 14px; font-weight: 600; border: 1px solid transparent; white-space: nowrap; transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s; }
.adm-btn svg { width: 16px; height: 16px; }
.adm-btn-primary { background: var(--a-brand); color: #fff; }
.adm-btn-primary:hover { background: var(--a-brand-600); }
.adm-btn-secondary { background: var(--a-surface); color: var(--a-text); border-color: var(--a-border-2); }
.adm-btn-secondary:hover { background: var(--a-surface-2); }
.adm-btn-ghost { background: transparent; color: var(--a-text-2); }
.adm-btn-ghost:hover { background: var(--a-surface-2); color: var(--a-text); }
.adm-btn-danger { background: var(--a-red-50); color: var(--a-red); border-color: #FDA29B; }
.adm-btn-danger:hover { background: #FEE4E2; }
.adm-btn-sm { height: 32px; padding: 0 12px; font-size: 13px; border-radius: 7px; }
.adm-btn-xs { height: 26px; padding: 0 9px; font-size: 12px; border-radius: 6px; }
.adm-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.adm-btn-icon { width: 32px; padding: 0; }
.adm-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adm-actions.end { justify-content: flex-end; }
.adm-actions.between { justify-content: space-between; }

/* ── 폼 ─────────────────────────────────────────────────── */
.adm-form-row { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--a-border); align-items: start; }
.adm-form-row:first-child { padding-top: 0; }
.adm-form-row:last-child { border-bottom: 0; padding-bottom: 0; }
.adm-form-row > label, .adm-form-row > .label { font-weight: 600; padding-top: 9px; color: var(--a-text); }
.adm-form-row > label .req, .adm-form-row > .label .req { color: var(--a-red); margin-left: 3px; }
.adm-form-row .help { font-size: 12px; color: var(--a-text-3); margin-top: 6px; }
.adm-form-row .field { min-width: 0; }
.adm-input, .adm-textarea, .adm-select { width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--a-border-2); border-radius: var(--a-radius-sm); background: var(--a-surface); transition: border-color 0.15s, box-shadow 0.15s; }
.adm-textarea { height: auto; min-height: 140px; padding: 10px 12px; resize: vertical; line-height: 1.6; }
.adm-input:hover, .adm-textarea:hover { border-color: var(--a-text-4); }
.adm-input:focus, .adm-textarea:focus { outline: none; border-color: var(--a-brand); box-shadow: 0 0 0 3px var(--a-brand-100); }
.adm-input[readonly] { background: var(--a-surface-2); color: var(--a-text-3); }
.adm-input.is-invalid { border-color: var(--a-red); }
.adm-input-group { display: flex; gap: 8px; }
.adm-input-group .adm-input { flex: 1; }
.adm-input.w-sm { width: 140px; }
.adm-input.w-md { width: 240px; }
.adm-input.w-lg { width: 360px; }
.adm-input.date { width: 150px; }
.adm-error { font-size: 12px; color: var(--a-red); margin-top: 6px; }
.adm-form-foot { display: flex; justify-content: flex-end; gap: 8px; padding-top: 22px; margin-top: 8px; border-top: 1px solid var(--a-border); }
.adm-form-foot .left { margin-right: auto; }

/* 세그먼트 라디오 (select 대체) */
.adm-seg { display: inline-flex; padding: 3px; background: var(--a-surface-2); border: 1px solid var(--a-border); border-radius: 10px; gap: 2px; }
.adm-seg label { position: relative; }
.adm-seg input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.adm-seg span { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 14px; border-radius: 7px; font-size: 13px; font-weight: 500; color: var(--a-text-2); transition: background 0.15s, color 0.15s, box-shadow 0.15s; white-space: nowrap; }
.adm-seg span .n { font-size: 11px; color: var(--a-text-4); }
.adm-seg input:hover + span { color: var(--a-text); }
.adm-seg input:checked + span { background: var(--a-surface); color: var(--a-brand); font-weight: 600; box-shadow: var(--a-shadow); }
.adm-seg input:checked + span .n { color: var(--a-brand); }
.adm-seg input:focus-visible + span { box-shadow: 0 0 0 3px var(--a-brand-100); }
.adm-seg.sm span { height: 28px; padding: 0 11px; font-size: 12px; }
.adm-seg.block { display: flex; }
.adm-seg.block label { flex: 1; }
.adm-seg.block span { width: 100%; }

/* 카드형 라디오 */
.adm-choice { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.adm-choice label { position: relative; display: block; }
.adm-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.adm-choice .box { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border: 1px solid var(--a-border-2); border-radius: 10px; background: var(--a-surface); transition: border-color 0.15s, background 0.15s, box-shadow 0.15s; }
.adm-choice .box b { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.adm-choice .box b::before { content: ''; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--a-border-2); flex: none; transition: border 0.15s, box-shadow 0.15s; }
.adm-choice .box small { font-size: 12px; color: var(--a-text-3); padding-left: 24px; overflow-wrap: anywhere; }
.adm-choice input:hover + .box { border-color: var(--a-text-4); }
.adm-choice input:checked + .box { border-color: var(--a-brand); background: var(--a-brand-50); }
.adm-choice input:checked + .box b::before { border: 5px solid var(--a-brand); }
.adm-choice input:focus-visible + .box { box-shadow: 0 0 0 3px var(--a-brand-100); }
.adm-choice input:disabled + .box { opacity: 0.5; cursor: not-allowed; }

/* 토글 스위치 */
.adm-switch { position: relative; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; }
.adm-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.adm-switch .track { width: 40px; height: 22px; border-radius: 999px; background: var(--a-border-2); position: relative; transition: background 0.2s; flex: none; }
.adm-switch .track::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.2); transition: transform 0.2s; }
.adm-switch input:checked + .track { background: var(--a-brand); }
.adm-switch input:checked + .track::after { transform: translateX(18px); }
.adm-switch input:focus-visible + .track { box-shadow: 0 0 0 3px var(--a-brand-100); }
.adm-switch input:disabled + .track { opacity: 0.4; cursor: not-allowed; }
.adm-switch .txt { font-weight: 500; }
.adm-switch.sm .track { width: 34px; height: 20px; }
.adm-switch.sm .track::after { width: 14px; height: 14px; }
.adm-switch.sm input:checked + .track::after { transform: translateX(14px); }
.adm-switch.busy { opacity: 0.6; pointer-events: none; }

/* 체크박스 */
.adm-check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.adm-check input { width: 18px; height: 18px; accent-color: var(--a-brand); margin: 0; }

/* ── 검색/필터 바 ────────────────────────────────────────── */
.adm-filter { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 14px 22px; border-bottom: 1px solid var(--a-border); background: var(--a-surface-2); border-radius: var(--a-radius) var(--a-radius) 0 0; }
.adm-filter .spacer { flex: 1; }
.adm-filter .adm-input { height: 36px; }
.adm-search { position: relative; }
.adm-search .adm-input { padding-left: 34px; width: 280px; }
.adm-search svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--a-text-4); }

/* ── 테이블 ──────────────────────────────────────────────── */
.adm-table-wrap { overflow-x: auto; }
.adm-table th, .adm-table td { padding: 12px 16px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--a-border); }
.adm-table th { font-size: 12px; font-weight: 600; color: var(--a-text-3); background: var(--a-surface-2); white-space: nowrap; letter-spacing: 0.02em; }
.adm-table tbody tr:hover { background: #FAFBFD; }
.adm-table tbody tr:last-child td { border-bottom: 0; }
.adm-table td.num, .adm-table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.adm-table td.center, .adm-table th.center { text-align: center; }
.adm-table td.muted { color: var(--a-text-3); }
.adm-table td.nowrap, .adm-table th.nowrap { white-space: nowrap; }
.adm-table .title-link { font-weight: 600; color: var(--a-text); }
.adm-table .title-link:hover { color: var(--a-brand); text-decoration: underline; }
.adm-table .sub { display: block; font-size: 12px; color: var(--a-text-3); margin-top: 2px; font-weight: 400; }
.adm-table td.actions { white-space: nowrap; text-align: right; }
.adm-table td.actions .adm-btn + .adm-btn { margin-left: 4px; }
.adm-table .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }
.adm-table tr.is-private td { background: #FCFCFD; }
.adm-empty { padding: 56px 20px; text-align: center; color: var(--a-text-3); }
.adm-empty svg { width: 40px; height: 40px; color: var(--a-border-2); margin-bottom: 10px; }

/* 상태 pill */
.adm-pill { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.adm-pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.adm-pill.blue { background: var(--a-brand-50); color: var(--a-brand); }
.adm-pill.green { background: var(--a-green-50); color: var(--a-green); }
.adm-pill.amber { background: var(--a-amber-50); color: var(--a-amber); }
.adm-pill.red { background: var(--a-red-50); color: var(--a-red); }
.adm-pill.gray { background: var(--a-surface-2); color: var(--a-text-3); }
.adm-pill.plain::before { display: none; }
.adm-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: 5px; font-size: 11px; font-weight: 600; background: var(--a-surface-2); color: var(--a-text-3); border: 1px solid var(--a-border); vertical-align: middle; }
.adm-tag.lock { background: #F9FAFB; }

/* 페이지네이션 */
.adm-pagination { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 18px; }
.adm-pagination a, .adm-pagination span { min-width: 34px; height: 34px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--a-text-2); }
.adm-pagination a:hover { background: var(--a-surface-2); }
.adm-pagination a.active { background: var(--a-brand); color: #fff; font-weight: 600; }
.adm-pagination a.disabled { opacity: 0.35; pointer-events: none; }
.adm-pagination .total { margin-right: auto; font-size: 12px; color: var(--a-text-3); }

/* 첨부 목록 */
.adm-files { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.adm-files li { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--a-border); border-radius: 8px; background: var(--a-surface-2); font-size: 13px; }
.adm-files li .name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.adm-files li .size { color: var(--a-text-3); font-size: 12px; }
.adm-files li .remove { color: var(--a-text-3); width: 24px; height: 24px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; }
.adm-files li .remove:hover { background: var(--a-red-50); color: var(--a-red); }
.adm-dropzone { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px dashed var(--a-border-2); border-radius: 10px; background: var(--a-surface); cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.adm-dropzone:hover, .adm-dropzone.drag { border-color: var(--a-brand); background: var(--a-brand-50); }
.adm-dropzone.is-invalid { border-color: var(--a-red); background: var(--a-red-50); }
.adm-dropzone .ico { width: 36px; height: 36px; border-radius: 8px; background: var(--a-brand-50); color: var(--a-brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.adm-dropzone .ico svg { width: 18px; height: 18px; }
.adm-dropzone b { font-weight: 600; }
.adm-dropzone small { display: block; color: var(--a-text-3); font-size: 12px; margin-top: 2px; }

/* 에디터 */
.adm-editor .ck.ck-editor__main > .ck-editor__editable { min-height: 420px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.adm-editor .ck.ck-toolbar { border-top-left-radius: 8px; border-top-right-radius: 8px; background: var(--a-surface-2); }
.adm-editor .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused { border-color: var(--a-brand); box-shadow: 0 0 0 3px var(--a-brand-100); }

/* Q&A 상세 */
.adm-qna-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px 24px; }
.adm-qna-meta dt { font-size: 12px; color: var(--a-text-3); font-weight: 500; }
.adm-qna-meta dd { margin: 3px 0 0; font-weight: 600; }
.adm-content { line-height: 1.75; color: var(--a-text-2); word-break: break-word; }
.adm-content p + p { margin-top: 0.5em; }
.adm-content img { max-width: 100%; height: auto; }
.adm-content table { border-collapse: collapse; }
.adm-content table td, .adm-content table th { border: 1px solid var(--a-border); padding: 6px 10px; }
.adm-content blockquote { border-left: 3px solid var(--a-brand); padding-left: 12px; margin: 0.8em 0; color: var(--a-text-3); }
.adm-content ul { list-style: disc; padding-left: 1.4em; }
.adm-content ol { list-style: decimal; padding-left: 1.4em; }
.adm-answer { border-left: 3px solid var(--a-brand); }

/* 리스트형 (대시보드) */
.adm-list li { display: flex; align-items: center; gap: 12px; padding: 12px 22px; border-bottom: 1px solid var(--a-border); }
.adm-list li:last-child { border-bottom: 0; }
.adm-list li .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.adm-list li .t:hover { color: var(--a-brand); }
.adm-list li .m { font-size: 12px; color: var(--a-text-3); white-space: nowrap; }
.adm-list.ranked li { counter-increment: rank; }
.adm-list.ranked li::before { content: counter(rank); width: 22px; height: 22px; border-radius: 6px; background: var(--a-surface-2); color: var(--a-text-3); font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.adm-list.ranked li:nth-child(-n+3)::before { background: var(--a-brand-50); color: var(--a-brand); }
.adm-bar { height: 6px; border-radius: 3px; background: var(--a-brand-50); width: 120px; flex: none; overflow: hidden; }
.adm-bar i { display: block; height: 100%; background: var(--viz-1); border-radius: 3px; }

/* ── 차트 ────────────────────────────────────────────────── */
.adm-chart { position: relative; width: 100%; }
.adm-chart svg { width: 100%; height: auto; display: block; overflow: visible; }
.adm-chart .grid line { stroke: var(--viz-grid); stroke-width: 1; }
.adm-chart .axis text { fill: var(--a-text-4); font-size: 11px; font-family: inherit; }
.adm-chart .bar { fill: var(--viz-1); }
.adm-chart .bar.s2 { fill: var(--viz-2); }
.adm-chart .bar.hover { opacity: 0.8; }
.adm-chart .line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.adm-chart .line.s1 { stroke: var(--viz-1); }
.adm-chart .line.s2 { stroke: var(--viz-2); }
.adm-chart .area.s1 { fill: var(--viz-1); opacity: 0.08; }
.adm-chart .dot { stroke: #fff; stroke-width: 2; }
.adm-chart .dot.s1 { fill: var(--viz-1); }
.adm-chart .dot.s2 { fill: var(--viz-2); }
.adm-chart .hit { fill: transparent; }
.adm-chart .crosshair { stroke: var(--a-border-2); stroke-width: 1; pointer-events: none; }
.adm-chart .end-label { font-size: 11px; fill: var(--a-text-2); font-weight: 600; }
.adm-legend { display: flex; gap: 16px; font-size: 12px; color: var(--a-text-2); flex-wrap: wrap; }
.adm-legend span { display: inline-flex; align-items: center; gap: 6px; }
.adm-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.adm-legend i.s1 { background: var(--viz-1); }
.adm-legend i.s2 { background: var(--viz-2); }
.adm-legend i.s3 { background: var(--viz-3); }
.adm-legend i.s4 { background: var(--viz-4); }
.adm-tooltip { position: absolute; pointer-events: none; background: #111827; color: #fff; padding: 8px 10px; border-radius: 8px; font-size: 12px; line-height: 1.5; white-space: nowrap; box-shadow: var(--a-shadow-lg); opacity: 0; transform: translate(-50%, -100%) translateY(-10px); transition: opacity 0.1s; z-index: 10; }
.adm-tooltip.show { opacity: 1; }
.adm-tooltip b { font-weight: 600; display: block; margin-bottom: 2px; color: #D1D5DB; }
.adm-tooltip .row { display: flex; align-items: center; gap: 6px; }
.adm-tooltip .row i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.adm-tooltip .row i.s1 { background: var(--viz-1); }
.adm-tooltip .row i.s2 { background: var(--viz-2); }
.adm-hbar { display: flex; flex-direction: column; gap: 10px; }
.adm-hbar li { display: grid; grid-template-columns: 90px 1fr 60px; align-items: center; gap: 10px; font-size: 13px; }
.adm-hbar li .lbl { color: var(--a-text-2); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-hbar li .track { height: 14px; border-radius: 4px; background: var(--a-surface-2); overflow: hidden; }
.adm-hbar li .track i { display: block; height: 100%; background: var(--viz-1); border-radius: 0 4px 4px 0; }
.adm-hbar li:nth-child(2) .track i { background: var(--viz-2); }
.adm-hbar li:nth-child(3) .track i { background: var(--viz-3); }
.adm-hbar li:nth-child(4) .track i { background: var(--viz-4); }
.adm-hbar li:nth-child(n+5) .track i { background: var(--a-text-4); }
.adm-hbar li .val { text-align: right; font-variant-numeric: tabular-nums; color: var(--a-text-2); }
.adm-hbar li .val small { color: var(--a-text-4); margin-left: 3px; }
.adm-donut { display: flex; align-items: center; gap: 20px; }
.adm-donut svg { width: 120px; height: 120px; flex: none; }
.adm-donut .lg { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.adm-donut .lg span { display: flex; align-items: center; gap: 8px; }
.adm-donut .lg i { width: 10px; height: 10px; border-radius: 3px; }
.adm-donut .lg b { margin-left: auto; padding-left: 16px; font-variant-numeric: tabular-nums; }
.adm-donut .lg small { color: var(--a-text-4); }

/* 번역 관리 */
.adm-tr-table td { vertical-align: top; }
.adm-tr-table .tr-source .src { font-size: 13px; line-height: 1.6; color: var(--a-text); word-break: break-word; white-space: pre-wrap; background: var(--a-surface-2); border: 1px solid var(--a-border); border-radius: 8px; padding: 10px 12px; min-height: 56px; }
.adm-tr-table .tr-text { min-height: 56px; font-size: 13px; line-height: 1.6; padding: 9px 12px; resize: none; overflow: hidden; }
.adm-tr-table tr.is-missing .tr-text { border-color: #FEC84B; background: #FFFCF5; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; background: rgba(0,0,0,0.05); padding: 1px 5px; border-radius: 4px; }

/* ── 토스트 / 알림 ───────────────────────────────────────── */
.adm-toasts { position: fixed; right: 24px; top: calc(var(--a-topbar) + 16px); z-index: 200; display: flex; flex-direction: column; gap: 8px; width: min(380px, calc(100% - 48px)); }
.adm-toast { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; background: var(--a-surface); border: 1px solid var(--a-border); box-shadow: var(--a-shadow-lg); font-size: 13px; animation: adm-toast-in 0.25s ease-out; cursor: pointer; }
.adm-toast::before { content: ''; width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; flex: none; background: var(--a-brand); }
.adm-toast.success::before { background: var(--a-green); }
.adm-toast.error::before { background: var(--a-red); }
.adm-toast.error { border-color: #FDA29B; }
.adm-toast.is-hide { opacity: 0; transform: translateX(10px); transition: opacity 0.4s, transform 0.4s; }
@keyframes adm-toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.adm-note { padding: 12px 14px; border-radius: 8px; background: var(--a-brand-50); color: var(--a-brand); font-size: 13px; line-height: 1.6; }
.adm-note.warn { background: var(--a-amber-50); color: var(--a-amber); }
.adm-note.danger { background: var(--a-red-50); color: var(--a-red); }

/* ── 로그인 ──────────────────────────────────────────────── */
.adm-login-body { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 24px; background: radial-gradient(1200px 600px at 50% -10%, #E3EAFA 0%, var(--a-bg) 60%); }
.adm-login { width: 100%; max-width: 400px; }
.adm-login .adm-card { padding: 36px 32px; }
.adm-login .logo { display: flex; justify-content: center; margin-bottom: 8px; }
.adm-login .logo img { height: 28px; }
.adm-login h1 { text-align: center; font-size: 18px; font-weight: 700; margin: 12px 0 4px; }
.adm-login .desc { text-align: center; color: var(--a-text-3); font-size: 13px; margin-bottom: 24px; }
.adm-login .field { margin-bottom: 14px; }
.adm-login .field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.adm-login .adm-input { height: 44px; }
.adm-login .adm-btn { width: 100%; height: 46px; font-size: 15px; margin-top: 8px; }
.adm-login .foot { text-align: center; margin-top: 18px; font-size: 12px; color: var(--a-text-4); }
.adm-login .alert { padding: 10px 12px; border-radius: 8px; background: var(--a-red-50); color: var(--a-red); font-size: 13px; margin-bottom: 16px; border: 1px solid #FDA29B; }
.adm-login .alert.success { background: var(--a-green-50); color: var(--a-green); border-color: #ABEFC6; }

/* 에러 페이지 */
.adm-error-body { display: flex; align-items: center; justify-content: center; min-height: 100vh; text-align: center; }
.adm-error-code { font-size: 64px; font-weight: 800; color: var(--a-brand); letter-spacing: -0.03em; }
.adm-error-tit { font-size: 20px; font-weight: 700; margin: 8px 0; }
.adm-error-msg { color: var(--a-text-3); margin-bottom: 24px; }

/* 유틸 */
.mt-0 { margin-top: 0 !important; } .mt-8 { margin-top: 8px; } .mt-12 { margin-top: 12px; } .mt-16 { margin-top: 16px; } .mt-20 { margin-top: 20px; } .mt-24 { margin-top: 24px; }
.mb-16 { margin-bottom: 16px; } .mb-20 { margin-bottom: 20px; }
.text-muted { color: var(--a-text-3); } .text-sm { font-size: 12px; } .text-right { text-align: right; } .fw-600 { font-weight: 600; }
.flex { display: flex; align-items: center; gap: 8px; } .flex.wrap { flex-wrap: wrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }
.tabular { font-variant-numeric: tabular-nums; }
.w-100 { width: 100%; }
.adm-kv { display: flex; gap: 6px; font-size: 13px; color: var(--a-text-3); }
.adm-kv b { color: var(--a-text); font-weight: 600; }
.adm-divider { height: 1px; background: var(--a-border); margin: 20px 0; }

/* 대시보드 통계 카드 링크 (답변 대기) */
a.adm-stat-link { display: block; color: inherit; text-decoration: none; transition: border-color 0.15s, box-shadow 0.15s; }
a.adm-stat-link:hover { border-color: var(--a-brand); box-shadow: var(--a-shadow); }
a.adm-stat-link.is-alert .value { color: var(--a-red); }

/* ── 팝업 관리 ───────────────────────────────────────────── */
.adm-popup-thumb { display: block; width: 96px; height: 64px; border-radius: 8px; overflow: hidden; background: var(--a-surface-2); border: 1px solid var(--a-border); }
.adm-popup-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adm-drag-handle { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 28px; border-radius: 6px; color: var(--a-text-4); cursor: grab; font-size: 14px; letter-spacing: -2px; user-select: none; }
.adm-drag-handle:hover { background: var(--a-surface-2); color: var(--a-text-2); }
tr.is-dragging { opacity: 0.4; }
tr.is-drop-target td { box-shadow: inset 0 2px 0 var(--a-brand); }
.adm-popup-upload .adm-popup-preview { margin: 12px 0 0; display: inline-flex; flex-direction: column; gap: 6px; }
.adm-popup-upload .adm-popup-preview img { max-width: min(100%, 360px); max-height: 320px; border-radius: 10px; border: 1px solid var(--a-border); background: repeating-conic-gradient(var(--a-surface-2) 0 25%, var(--a-surface) 0 50%) 0 0 / 16px 16px; display: block; }
.adm-popup-upload .adm-popup-preview figcaption { font-size: 12px; color: var(--a-text-3); }
.adm-popup-period { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.adm-popup-period > div { display: flex; flex-direction: column; gap: 4px; }
.adm-popup-period .adm-input { width: 210px; }
.adm-popup-period .tilde { padding-bottom: 10px; color: var(--a-text-3); }
.adm-popup-period > .adm-popup-quick { flex-direction: row; align-items: center; gap: 4px; padding-bottom: 8px; }
.adm-popup-table td { vertical-align: middle; }
@media (max-width: 768px) {
    .adm-popup-period .adm-input { width: 100%; }
    .adm-popup-period > div { width: 100%; }
    .adm-popup-period .tilde { display: none; }
}

/* ── 콘텐츠: 제품 스펙 / 기술자료 ────────────────────────── */
.adm-file-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 6px 10px 6px 6px; border: 1px solid var(--a-border); border-radius: 8px; background: var(--a-surface-2); color: var(--a-text); text-decoration: none; font-size: 13px; transition: border-color 0.15s, background 0.15s; }
.adm-file-chip:hover { border-color: var(--a-brand); background: var(--a-brand-50); }
.adm-file-chip .badge { flex: none; height: 20px; padding: 0 6px; border-radius: 5px; background: var(--a-brand); color: #fff; font-size: 10px; font-weight: 700; display: inline-flex; align-items: center; letter-spacing: 0.02em; }
.adm-file-chip .name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.adm-file-chip .size { flex: none; color: var(--a-text-3); font-size: 12px; }
.adm-file-current { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.adm-spec-summary { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.adm-spec-summary .adm-tag { height: 22px; gap: 5px; font-weight: 500; white-space: nowrap; max-width: 100%; }
.adm-spec-summary .adm-tag b { font-weight: 600; color: var(--a-text); max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.adm-spec-quick { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.adm-spec-rows { display: flex; flex-direction: column; gap: 8px; }
.adm-spec-row { display: grid; grid-template-columns: 24px 190px minmax(0, 1fr) 32px; gap: 10px; align-items: start; padding: 8px; border: 1px solid var(--a-border); border-radius: 10px; background: var(--a-surface); transition: border-color 0.15s, box-shadow 0.15s; }
.adm-spec-row:hover { border-color: var(--a-border-2); }
.adm-spec-row.is-dragging { opacity: 0.4; }
.adm-spec-row.is-drop-target { box-shadow: 0 -2px 0 var(--a-brand); }
.adm-spec-row .adm-drag-handle { height: 40px; }
.adm-spec-row .adm-textarea { height: auto; min-height: 40px; padding: 9px 12px; line-height: 1.5; resize: vertical; font-family: inherit; }
.adm-spec-row .adm-input { font-weight: 600; }
.adm-spec-remove { width: 32px; height: 40px; border-radius: 8px; color: var(--a-text-3); font-size: 18px; display: inline-flex; align-items: center; justify-content: center; }
.adm-spec-remove:hover { background: var(--a-red-50); color: var(--a-red); }
.adm-spec-preview { border: 1px solid var(--a-border); border-radius: 10px; overflow: hidden; }
.adm-spec-preview .tab { display: inline-flex; margin: 12px 12px 0; padding: 0 16px; height: 34px; align-items: center; border-radius: 999px; background: #0033A0; color: #fff; font-size: 13px; font-weight: 600; }
.adm-spec-preview table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 13px; }
.adm-spec-preview th, .adm-spec-preview td { border-top: 1px solid var(--a-border); padding: 9px 12px; text-align: left; vertical-align: top; }
.adm-spec-preview th { width: 96px; background: var(--a-surface-2); color: var(--a-text-2); font-weight: 600; white-space: nowrap; }
.adm-spec-preview td { color: var(--a-text); }
.adm-spec-preview td.pdf span { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 4px; background: #0033A0; color: #fff; font-size: 11px; font-weight: 600; }
.adm-spec-preview td.empty { color: var(--a-text-4); font-style: italic; }
.adm-sticky { position: sticky; top: 76px; }
.adm-cat-num { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 6px; border-radius: 6px; background: var(--a-brand-50); color: var(--a-brand); font-size: 12px; font-weight: 700; margin-right: 4px; }
.fw-400 { font-weight: 400; }
.adm-doc-add { padding: 14px 20px 18px; border-top: 1px solid var(--a-border); background: var(--a-surface-2); display: grid; gap: 10px; }
.adm-doc-add .adm-dropzone { background: var(--a-surface); }
.adm-doc-add-row { display: flex; gap: 8px; }
.adm-doc-add-row .adm-input { flex: 1; background: var(--a-surface); }
.adm-doc-picked { margin-top: 8px; color: var(--a-brand); font-weight: 500; }
.adm-doc-picked[hidden] { display: none; }
@media (max-width: 1200px) { .adm-sticky { position: static; } }
@media (max-width: 768px) {
    .adm-spec-row { grid-template-columns: 24px minmax(0, 1fr) 32px; }
    .adm-spec-row .adm-spec-values { grid-column: 2 / 3; }
}

/* ── 반응형 ──────────────────────────────────────────────── */
@media (max-width: 1200px) {
    .adm-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .adm-grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .adm-grid.cols-2-1 { grid-template-columns: 1fr; }
}
@media (max-width: 1024px) {
    .adm-topbar { grid-template-columns: auto 1fr auto; }
    .adm-logo { border-right: 0; padding: 0 16px; }
    .adm-mainnav a { padding: 0 12px; font-size: 14px; }
    .adm-sidebar { transform: translateX(-100%); transition: transform 0.2s; box-shadow: none; }
    body.sidebar-open .adm-sidebar { transform: none; box-shadow: var(--a-shadow-lg); }
    .adm-main { margin-left: 0; padding: 20px 16px 48px; }
    .adm-menu-toggle { display: inline-flex; }
    .adm-user .name, .adm-user .role { display: none; }
}
@media (max-width: 768px) {
    .adm-mainnav { gap: 0; overflow-x: auto; }
    .adm-mainnav a { height: 36px; padding: 0 10px; font-size: 13px; }
    .adm-grid.cols-4, .adm-grid.cols-3, .adm-grid.cols-2, .adm-grid.cols-1-1 { grid-template-columns: 1fr; }
    .adm-form-row { grid-template-columns: 1fr; gap: 6px; }
    .adm-form-row > label, .adm-form-row > .label { padding-top: 0; }
    .adm-search .adm-input { width: 100%; }
    .adm-filter { padding: 12px 16px; }
    .adm-card-head, .adm-card-body { padding-left: 16px; padding-right: 16px; }
    .adm-table th, .adm-table td { padding: 10px 12px; }
    .adm-hbar li { grid-template-columns: 70px 1fr 50px; }
}