:root { color-scheme: light; --ink:#17212b; --muted:#64717d; --line:#dfe5e8; --navy:#12304a; --blue:#1e6c91; --paper:#f4f7f8; --white:#fff; --amber:#a65f00; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Pretendard","Noto Sans KR",Arial,sans-serif; }
body.modal-open { overflow:hidden; }
.topbar { position:relative; min-height:112px; display:flex; justify-content:space-between; align-items:center; gap:32px; padding:24px clamp(24px,5vw,72px); color:white; background:linear-gradient(125deg,#102c43,#184b67 65%,#1c7088); }
.topbar h1 { margin:4px 0 0; font-size:clamp(24px,3vw,36px); letter-spacing:-.04em; }
.eyebrow { margin:0; color:#77a8bf; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.topbar .eyebrow { color:#a7d4e5; }
.topbar-logout { position:absolute; top:12px; right:clamp(24px,5vw,72px); color:#c9deea; text-decoration:none; font-size:12px; font-weight:700; letter-spacing:.02em; opacity:.92; }
.topbar-logout:hover { color:#fff; text-decoration:underline; }
nav { display:flex; gap:8px; flex-wrap:wrap; align-items:center; } nav a { color:#d8ebf2; text-decoration:none; padding:9px 13px; border-radius:8px; } nav a.active, nav a:hover { background:rgba(255,255,255,.14); color:#fff; }
main { max-width:1420px; margin:0 auto; padding:28px clamp(18px,4vw,52px) 72px; }
.notice { display:flex; gap:18px; align-items:center; padding:14px 18px; margin-bottom:20px; background:#fff8e8; border:1px solid #edd7a8; border-left:5px solid #d28b24; border-radius:10px; color:#68440e; }
.notice-success { background:#e9f7ef; border-color:#b6e1c5; border-left-color:#25845a; color:#175133; }
.notice-error { background:#fff1f1; border-color:#efc0c0; border-left-color:#b53a3a; color:#7a2020; }
.notice span { font-size:14px; }
.summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.summary-grid article { background:var(--white); border:1px solid var(--line); border-radius:12px; padding:18px 20px; box-shadow:0 5px 16px rgba(17,42,57,.05); }
.summary-grid span { display:block; color:var(--muted); font-size:13px; } .summary-grid strong { display:block; margin-top:6px; color:var(--navy); font-size:30px; }
.panel { background:var(--white); border:1px solid var(--line); border-radius:14px; box-shadow:0 8px 24px rgba(17,42,57,.06); overflow:hidden; margin-top:18px; }
.panel-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; padding:22px 24px 16px; border-bottom:1px solid var(--line); }
.panel-heading h2 { margin:4px 0 0; font-size:20px; letter-spacing:-.03em; }.date,.muted { color:var(--muted); font-size:13px; }
.button-link { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 14px; border-radius:8px; border:1px solid #cad4d9; color:#41505c; background:white; font-weight:800; text-decoration:none; }
.panel-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.button-link-primary { border-color:#1d6f92; background:#1f6f94; color:#fff; cursor:pointer; }
.filter-bar { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:18px 24px; border-bottom:1px solid var(--line); background:#fbfcfd; }
.filter-bar label { display:grid; gap:7px; color:#41505c; font-size:13px; font-weight:700; }
.filter-bar select { width:100%; border:1px solid #cad4d9; border-radius:8px; padding:11px 12px; background:white; color:var(--ink); font:inherit; }
.filter-actions { display:flex; align-items:end; gap:10px; }
.filter-actions button,.filter-actions a { min-height:42px; padding:0 14px; border-radius:8px; font-weight:800; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.filter-actions button { border:0; color:white; background:var(--blue); cursor:pointer; }
.filter-actions a { border:1px solid #cad4d9; color:#41505c; background:white; }
.table-wrap { overflow:auto; } .evidence-table-scroll { max-height:560px; overflow:auto; } table { width:100%; border-collapse:collapse; min-width:980px; } th { padding:12px 16px; color:#536270; background:#f8fafb; text-align:left; font-size:12px; } .evidence-table-scroll th { position:sticky; top:0; z-index:1; } td { padding:15px 16px; border-top:1px solid #edf0f2; font-size:14px; vertical-align:middle; } td small { display:block; color:var(--muted); margin-top:4px; }.empty { text-align:center; padding:42px; color:var(--muted); }
.badge { display:inline-block; padding:6px 9px; border-radius:999px; font-size:11px; font-weight:800; background:#e9eef1; }.status-approved { color:#12633c; background:#e3f5ea; }.status-in_review { color:#175b7d; background:#e3f2f8; }.status-changes_requested { color:#8a4300; background:#fff0dc; }.status-draft { color:#7a5311; background:#fff2d9; }.status-missing { color:#8e1f2c; background:#fde8eb; }
.badge-official { color:#175b7d; background:#e3f2f8; }
.badge-internal { color:#5c4a10; background:#f7edd0; }
.detail-link { color:var(--blue); font-weight:700; text-decoration:none; }.form-panel form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:22px 24px 26px; }.form-panel label { display:grid; gap:7px; color:#41505c; font-size:13px; font-weight:700; }.form-panel input,.form-panel select,.form-panel textarea { width:100%; border:1px solid #cad4d9; border-radius:8px; padding:11px 12px; background:white; color:var(--ink); font:inherit; }.form-panel textarea { resize:vertical; min-height:92px; }.file-field { grid-column:span 2; }.full-width { grid-column:1 / -1; }.file-field small { color:var(--muted); font-weight:400; }.form-panel button { align-self:end; min-height:42px; border:0; border-radius:8px; color:white; background:var(--blue); font-weight:800; cursor:pointer; }
@media (max-width:840px) { .topbar { align-items:flex-start; flex-direction:column; }.topbar-logout { top:10px; right:24px; }.summary-grid { grid-template-columns:repeat(2,1fr); }.filter-bar,.form-panel form { grid-template-columns:1fr; }.filter-actions { align-items:stretch; }.file-field { grid-column:auto; } }
.plan-summary dl { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:18px 24px 10px; margin:0; }.plan-summary dl div { padding:12px; background:#f7f9fa; border-radius:8px; }.plan-summary dt { color:var(--muted); font-size:12px; }.plan-summary dd { margin:5px 0 0; font-weight:800; }.support-text { margin:0; padding:0 24px 24px; color:#465864; }.progress { height:9px; margin:8px 24px 24px; background:#e7edef; border-radius:99px; overflow:hidden; }.progress span { display:block; height:100%; background:linear-gradient(90deg,#1d7891,#30a678); border-radius:99px; }
.phase-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.phase-panel { margin-top:0; }.checklist { list-style:none; padding:0; margin:0; }.checklist-scroll { max-height:320px; overflow:auto; }.checklist li { display:grid; grid-template-columns:28px 1fr auto; gap:10px; align-items:start; padding:14px 18px; border-top:1px solid #edf0f2; }.check-icon { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:#55707d; background:#edf2f4; font-weight:900; }.item-complete .check-icon { color:white; background:#25845a; }.checklist small { display:block; margin-top:4px; color:var(--muted); }.checklist p { margin:7px 0 0; color:#465864; font-size:13px; }.status-complete { color:#12633c; background:#e3f5ea; }.status-pending { color:#73520a; background:#fff3d5; }.status-not_applicable { color:#52606b; background:#edf1f3; }.status-closed { color:#fff; background:#394956; }.lock-state { font-size:24px!important; }
.snapshot-panel { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:22px 24px; }.snapshot-panel h2 { margin:4px 0; }.snapshot-panel p { margin:0; color:var(--muted); }.snapshot-panel code { max-width:54%; overflow-wrap:anywhere; color:#24495d; }.empty-state { padding:44px; text-align:center; }.empty-state h2 { margin:8px 0; }.primary-link { display:inline-block; margin-top:14px; padding:11px 16px; border-radius:8px; background:var(--blue); color:white; text-decoration:none; font-weight:800; }
.docs-panel { overflow:hidden; }
.docs-frame-wrap { padding:0; background:#fff; }
.docs-frame { display:block; width:100%; min-height:calc(100vh - 260px); border:0; background:#fff; }
.modal-backdrop { position:fixed; inset:0; z-index:30; display:grid; place-items:center; padding:24px; background:rgba(10,22,35,.52); }
.modal-backdrop[hidden] { display:none !important; }
.modal-sheet { width:min(1120px,100%); max-height:min(88vh,920px); overflow:auto; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 20px 60px rgba(10,22,35,.28); }
.modal-heading { position:sticky; top:0; background:#fff; z-index:2; }
.modal-close { min-height:40px; padding:0 14px; border:1px solid #cad4d9; border-radius:8px; background:#fff; color:#41505c; font:inherit; font-weight:800; cursor:pointer; }
.visual-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding:22px 24px 0; }
.visual-summary-grid article { padding:0; background:#fff; border:0; }
.visual-summary-chip { display:grid; grid-template-columns:160px 1fr; border-radius:0; overflow:hidden; border:1px solid #d7e1e6; }
.visual-summary-chip span,.visual-summary-chip strong { display:grid; place-items:center; min-height:58px; padding:0 16px; font-size:16px; font-weight:800; }
.visual-summary-chip span { color:#fff; background:#476fbf; }
.visual-summary-chip strong { color:#fff; background:#5f84cb; font-size:24px; }
.visual-summary-grid span { display:block; color:var(--muted); font-size:13px; }
.visual-summary-grid strong { display:block; margin-top:6px; color:var(--navy); font-size:28px; }
.visual-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding:22px 24px 24px; }
.visual-panel { padding:20px; border:1px solid #e0e8ec; border-radius:12px; background:#fff; }
.visual-panel h3 { margin:0 0 16px; font-size:18px; }
.visual-panel-wide { grid-column:1 / -1; }
.stat-table { display:grid; gap:1px; background:#d7e1e6; border:1px solid #d7e1e6; }
.stat-table-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.stat-table-head { display:grid; place-items:center; min-height:74px; padding:12px; text-align:center; background:#476fbf; color:#fff; font-weight:800; font-size:26px; }
.stat-table-value { display:grid; place-items:center; min-height:68px; padding:12px; text-align:center; background:#dfe6f8; color:#24344c; font-weight:800; font-size:24px; }
.stat-table-fields .stat-table-head { min-height:62px; font-size:20px; }
.stat-table-fields .stat-table-value { min-height:58px; font-size:22px; }
.trend-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; }
.trend-strip-card { padding:16px 18px; border:1px solid #d7e1e6; background:#f7f9fe; border-radius:10px; }
.trend-strip-card strong { display:block; color:#36538a; font-size:18px; }
.trend-strip-card span { display:block; margin-top:6px; color:#52606b; font-size:14px; }
@media (max-width:840px) { .phase-grid { grid-template-columns:1fr; }.plan-summary dl { grid-template-columns:repeat(2,1fr); }.snapshot-panel { align-items:flex-start; flex-direction:column; }.snapshot-panel code { max-width:100%; }.visual-summary-grid,.visual-grid { grid-template-columns:1fr; }.visual-summary-chip { grid-template-columns:1fr; } .stat-table-three, .stat-table-fields { grid-template-columns:1fr !important; } }

.period-filter-grid { display:grid; grid-template-columns:1fr 1fr auto; gap:16px; align-items:end; }
.period-inline { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.quick-range-actions { display:flex; gap:8px; align-items:end; flex-wrap:wrap; }
.quick-range-actions button { min-height:42px; padding:0 14px; border-radius:8px; border:1px solid #cad4d9; background:#fff; color:#41505c; font-weight:800; cursor:pointer; }
.visual-condition-panel { margin-top:0; }
.condition-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.condition-grid div { padding:14px 16px; border:1px solid #d7e1e6; border-radius:10px; background:#f8fbfc; }
.condition-grid span { display:block; color:var(--muted); font-size:12px; }
.condition-grid strong { display:block; margin-top:6px; color:#24344c; font-size:16px; }
.selection-pill-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.selection-pill { margin-top:0 !important; padding:8px 12px; border-radius:999px; background:#e9f1fb; color:#234062 !important; font-size:14px !important; font-weight:800; line-height:1; }
.search-condition-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(220px,1fr); gap:16px; align-items:end; }
.search-field-group { min-width:0; }
.search-word-inline { display:grid; grid-template-columns:180px minmax(0,1fr); gap:8px; }
.image-like-period-grid { grid-template-columns:minmax(0,2fr) auto; }
.period-inline-image { grid-template-columns:160px 1fr 1fr 140px; }
.image-like-quick-actions { justify-content:flex-start; }
.button-submit-primary { border-color:#1d6f92 !important; background:#1f6f94 !important; color:#fff !important; }
.content-stats-search form { gap:10px; }
.stats-filter-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(220px,1fr); gap:16px; align-items:end; }
.stats-period-row { grid-template-columns:minmax(0,2fr) auto; }
.content-stats-result { display:grid; gap:22px; margin-top:22px; }
.content-stats-result .visual-panel { margin-top:0; }
.stats-summary-strip { padding:0; }
.stats-summary-strip .visual-summary-chip { grid-template-columns:140px 1fr; }
.stats-summary-strip .visual-summary-chip span { color:#fff; font-size:12px; font-weight:900; background:#476fbf; }
.stats-summary-strip .visual-summary-chip strong { color:#092d4b; font-size:18px; font-weight:900; background:#6388cd; }
.content-stats-result .stat-table-head { min-height:40px; padding:8px; font-size:13px; }
.content-stats-result .stat-table-value { min-height:38px; padding:8px; font-size:12px; }
.content-stats-result .stat-table-fields .stat-table-head { min-height:38px; font-size:13px; }
.content-stats-result .stat-table-fields .stat-table-value { min-height:36px; font-size:12px; }
.stats-dot { display:inline-block; width:9px; height:9px; margin-right:6px; border-radius:50%; background:#000; vertical-align:0; }
.content-stats-result h3 { display:flex; align-items:center; gap:0; font-size:14px; }

@media (max-width:840px) {
  .search-condition-grid,
  .stats-filter-row,
  .stats-period-row,
  .period-filter-grid,
  .condition-grid { grid-template-columns:1fr; }
  .search-word-inline,
  .period-inline-image { grid-template-columns:1fr; }
}