/* ==========================================================================
   운영 콘솔 · 사내 훈련 허브
   styles.css 의 토큰(--surface, --line, --ink*, --accent*, --r*)만 사용합니다.
   테두리로 구획하고, 그림자·발광·블러는 오버레이에만 씁니다.
   ========================================================================== */

.operations-page { background: var(--bg); }
.operations-topbar { background: color-mix(in srgb, var(--bg) 92%, transparent); }
.operations-breadcrumb { display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 13px; }
.operations-breadcrumb strong { color: var(--ink); font-weight: 600; }
.operations-breadcrumb i { width: 3px; height: 3px; border-radius: 50%; background: var(--line-strong); }

.operations-shell { width: min(1600px, calc(100% - clamp(32px, 4vw, 80px))); margin: 0 auto; padding: 24px 0 64px; }

/* ── 화면 머리말 ─────────────────────────────────────────────────────────── */

.operations-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--line-strong); }
.operations-kicker { display: inline-flex; align-items: center; gap: 7px; color: var(--ink-3); font-size: 12.5px; font-weight: 600; }
.operations-kicker i { display: none; }
.operations-hero h1 { margin: 12px 0 0; font-size: clamp(28px, 2.5vw, 40px); font-weight: 560; line-height: 1.3; letter-spacing: -.045em; text-wrap: balance; }
.operations-hero-copy > p { max-width: 74ch; margin-top: 12px; color: var(--ink-2); font-size: 16px; line-height: 1.7; }
.operations-hero-meta { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.operations-hero-meta span {
  height: 26px; padding: 0 10px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 12.5px;
}
.operations-health { margin-top: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--ink-3); font-size: 12.5px; }
.operations-health span { display: inline-flex; align-items: center; gap: 7px; }
.operations-health span i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.operations-health b { color: var(--ink-2); font-weight: 600; }
.operations-health strong { color: var(--ink-3); font-weight: 400; }
.operations-health strong::before { content: "·"; margin-right: 8px; color: var(--line-strong); }

/* ── 지표 카드 ───────────────────────────────────────────────────────────── */

.operations-metrics { margin-top: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--surface); }
.operations-metrics article { min-width: 0; padding: 26px 28px; border-right: 1px solid var(--line); }
.operations-metrics article:last-child { border-right: 0; }
.operations-metrics article small { display: block; color: var(--ink-2); font-size: 14px; }
.operations-metrics article strong { display: block; margin: 12px 0 6px; font-size: clamp(32px, 2.8vw, 44px); font-weight: 520; line-height: 1.15; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.operations-metrics article em { color: var(--ink-3); font-size: 12px; font-style: normal; }
.operations-metrics article > button {
  width: 100%; min-height: 40px; margin-top: 12px; padding-top: 10px; display: flex; align-items: center; justify-content: space-between;
  color: var(--accent); border-top: 1px solid var(--line); font-size: 14px; font-weight: 550; cursor: pointer;
}
.operations-metrics article > button svg { width: 13px; height: 13px; }

/* ── 탭 ─────────────────────────────────────────────────────────────────── */

.operations-tabs {
  position: sticky; z-index: 20; top: var(--topbar-h);
  margin: 24px 0 20px; padding: 6px; display: flex; flex-wrap: wrap; gap: 4px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
}
.operations-tabs button {
  min-height: 40px; padding: 8px 12px; display: inline-flex; align-items: center; gap: 8px;
  color: var(--ink-2); border-radius: 8px; font-size: 14px; font-weight: 500;
}
.operations-tabs button:hover { color: var(--ink); background: var(--surface-3); }
.operations-tabs button.active { color: #edf8f5; background: #173747; font-weight: 550; }
.operations-tabs svg { display: none; }
.operations-tabs button span {
  min-width: 18px; height: 18px; padding: 0 5px; display: grid; place-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: 5px; font-size: 12px; font-variant-numeric: tabular-nums;
}
.operations-tabs button.active span { color: #c4f4e2; background: #325565; }

.operations-view { display: none; }
.operations-view.is-active { display: block; }

/* ── 패널 공통 ───────────────────────────────────────────────────────────── */

.ops-panel, .ops-state-map { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.ops-panel > header, .ops-state-map > header {
  min-height: 64px; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-bottom: 1px solid var(--line);
}
.ops-panel > header h2, .ops-state-map h2 { margin: 0; font-size: 18px; font-weight: 550; }
.ops-panel > header > small, .ops-panel > header > span, .ops-state-map > header > span { color: var(--ink-3); font-size: 12.5px; }
.ops-panel > header button:not(.ops-primary) {
  display: inline-flex; align-items: center; gap: 6px; color: var(--accent); font-size: 13px; font-weight: 600; white-space: nowrap;
}
.ops-panel > header button svg { width: 13px; height: 13px; }
.ops-panel-note { margin: 0; padding: 16px 22px; color: var(--ink-2); background: var(--surface-2); border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.75; }

.ops-empty { padding: 40px 20px; display: grid; justify-items: center; gap: 4px; text-align: center; }
.ops-empty strong { font-size: 18px; font-weight: 550; }
.ops-empty p { max-width: 46ch; color: var(--ink-3); font-size: 16px; line-height: 1.75; }

.ops-primary {
  min-height: 44px; padding: 8px 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  color: #fff; background: var(--accent); border-radius: 9px; font-size: 14px; font-weight: 550;
}
.ops-primary:hover { background: var(--accent-hover); }
.ops-primary svg { width: 15px; height: 15px; }
.ops-primary.compact { min-height: 38px; padding: 6px 12px; font-size: 14px; }
.ops-primary.is-busy, .ops-primary[disabled] { opacity: .55; pointer-events: none; }
.secure-chip {
  height: 24px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px;
  color: var(--accent); background: var(--accent-soft); border-radius: var(--r-sm); font-size: 12px; font-weight: 600;
}
.secure-chip svg { width: 12px; height: 12px; }

/* ── 목록 행 공통 ────────────────────────────────────────────────────────── */

/* 최소 높이는 비었거나 불러오는 중일 때만 잡습니다. 줄이 한 개뿐인데 180px를 잡으면
   그만큼이 흰 여백으로 남습니다. */
.ops-content-list, .ops-report-list, .ops-user-list, .ops-invite-list, .ops-audit-list,
.ops-review-stack, .ops-activity-list, .ops-backup-list, .ops-release-check-list,
.ops-release-history, .ops-evidence-ledger, .ops-drill-timeline {
  min-height: 0;
}
.ops-content-list:has(.ops-empty), .ops-report-list:has(.ops-empty), .ops-user-list:has(.ops-empty),
.ops-invite-list:has(.ops-empty), .ops-audit-list:has(.ops-empty), .ops-review-stack:has(.ops-empty),
.ops-activity-list:has(.ops-empty), .ops-backup-list:has(.ops-empty), .ops-release-check-list:has(.ops-empty),
.ops-release-history:has(.ops-empty), .ops-evidence-ledger:has(.ops-empty), .ops-drill-timeline:has(.ops-empty),
.ops-content-list:has(.load-note), .ops-report-list:has(.load-note), .ops-user-list:has(.load-note),
.ops-invite-list:has(.load-note), .ops-audit-list:has(.load-note), .ops-review-stack:has(.load-note),
.ops-activity-list:has(.load-note), .ops-backup-list:has(.load-note), .ops-release-check-list:has(.load-note),
.ops-release-history:has(.load-note), .ops-evidence-ledger:has(.load-note), .ops-drill-timeline:has(.load-note) {
  min-height: 180px;
}

.ops-queue-item, .ops-content-row, .ops-user-row, .ops-invite-row, .ops-audit-row,
.ops-activity-entry, .ops-backup-row, .ops-release-check, .ops-release-history-row,
.ops-release-external-row, .ops-evidence-row, .ops-drill-row {
  padding: 13px 16px; border-bottom: 1px solid var(--line);
}
.ops-queue-item:last-child, .ops-content-row:last-child, .ops-user-row:last-child,
.ops-invite-row:last-child, .ops-audit-row:last-child, .ops-activity-entry:last-child,
.ops-backup-row:last-child, .ops-release-check:last-child, .ops-release-history-row:last-child,
.ops-release-external-row:last-child, .ops-evidence-row:last-child, .ops-drill-row:last-child { border-bottom: 0; }
.ops-queue-item:hover, .ops-content-row:hover, .ops-user-row:hover, .ops-invite-row:hover,
.ops-audit-row:hover, .ops-backup-row:hover { background: var(--surface-2); }

.ops-type-token, .ops-user-avatar, .ops-gate-number, .backup-mark, .ops-queue-rank {
  display: grid; place-items: center; flex: 0 0 auto;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm);
  font-size: 12px; font-style: normal; font-weight: 600; letter-spacing: 0;
}
.ops-type-token { width: 34px; height: 34px; }
.ops-user-avatar { width: 36px; height: 36px; color: var(--accent); background: var(--accent-soft); font-size: 13px; }
.ops-gate-number, .ops-queue-rank { width: 26px; height: 22px; color: var(--ink-3); background: none; font-variant-numeric: tabular-nums; }
.backup-mark { width: 38px; height: 24px; font-size: 11px; }
.ops-mini-label { padding: 2px 6px; color: var(--ink-2); background: var(--surface-3); border-radius: 4px; font-size: 11.5px; }

.ops-row-actions, .my-work-list article > div:last-child, .ops-invite-row > button, .ops-backup-row > div:last-child { display: flex; flex-wrap: wrap; gap: 6px; }
.ops-row-actions button, .my-work-list button, .ops-report-target button,
.ops-invite-row > button, .ops-backup-row > div:last-child button, .ops-user-controls > button,
.ops-evidence-row aside button, .ops-version-timeline button {
  height: 28px; padding: 0 10px; display: inline-flex; align-items: center; gap: 5px;
  color: var(--ink-2); background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-sm); font-size: 12.5px; font-weight: 500; white-space: nowrap;
}
.ops-row-actions button:hover, .my-work-list button:hover, .ops-report-target button:hover,
.ops-invite-row > button:hover, .ops-backup-row > div:last-child button:hover,
.ops-user-controls > button:hover, .ops-evidence-row aside button:hover { color: var(--ink); border-color: var(--line-strong); }
.ops-row-actions button.approve, .my-work-list button.approve { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
.ops-row-actions button.danger, .my-work-list button.danger,
.ops-backup-row > div:last-child button.danger { color: var(--danger); background: var(--danger-soft); border-color: var(--danger-line); }
.ops-row-actions button[disabled], .ops-user-controls > button[disabled] { opacity: .5; pointer-events: none; }
.ops-backup-row > div:last-child button svg, .ops-row-actions button svg { width: 13px; height: 13px; }

/* ── 개요 ────────────────────────────────────────────────────────────────── */

/* 왼쪽은 검토 대기 몇 줄, 오른쪽은 계속 쌓이는 이력입니다. 긴 쪽에 넓은 칸을 줍니다. */
.operations-overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; }
/* 왼쪽은 검토 대기 + 공간 현황을 세로로 쌓아, 오른쪽 긴 이력 옆의 빈 칸을 채웁니다. */
.ops-overview-stack { display: grid; gap: 22px; align-content: start; min-width: 0; }
.operations-overview-grid > .ops-overview-stack { grid-column: 1; align-self: start; }
.operations-overview-grid > .ops-activity-panel { grid-column: 2; grid-row: auto; align-self: start; }
.ops-review-stack:has(.ops-empty), .ops-review-stack:has(.load-note) { min-height: 180px; }

.ops-queue-item { display: grid; grid-template-columns: 26px 34px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; cursor: pointer; }
.ops-queue-item div { min-width: 0; }
.ops-queue-item small { display: block; color: var(--ink-3); font-size: 12px; }
.ops-queue-item strong { display: block; margin: 1px 0; font-size: 13.5px; }
.ops-queue-item p { overflow: hidden; color: var(--ink-2); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.ops-queue-item time { color: var(--ink-3); font-size: 12px; white-space: nowrap; }
.ops-queue-item > button {
  width: 28px; height: 28px; display: grid; place-items: center;
  color: var(--accent); background: var(--accent-soft); border: 1px solid var(--accent-line); border-radius: var(--r-sm);
}
.ops-queue-item > button svg { width: 14px; height: 14px; }

.ops-activity-entry { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: baseline; gap: 11px; }
.ops-activity-entry > i { width: 6px; height: 6px; margin-top: 5px; border-radius: 50%; background: var(--accent); }
.ops-activity-entry strong { display: block; font-size: 13px; }
.ops-activity-entry p { overflow: hidden; color: var(--ink-3); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.ops-activity-entry p span { color: var(--ink-2); }
.ops-activity-entry time { color: var(--ink-3); font-size: 12px; white-space: nowrap; }

.ops-state-map { --ink: #eff7f6; --ink-2: #c8dce3; --ink-3: #b6ced9; --line: #335562; margin-top: 0; color: var(--ink); background: #143746; border-color: #335562; }
.ops-state-track { padding: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 14px; }
.ops-state-track > button { position: relative; min-width: 0; min-height: 118px; padding: 20px 18px 28px; display: flex; align-items: center; gap: 10px; text-align: left; color: #f0f8f6; background: #1d4253; border: 1px solid #426473; border-radius: 12px; }
.ops-state-track > button::after { content: ''; position: absolute; bottom: 14px; left: 18px; right: 18px; height: 4px; border-radius: 4px; background: linear-gradient(to right, #b5eed7 var(--state-share, 0%), #416474 var(--state-share, 0%)); }
.ops-state-track > button:hover { background: #2a5262; border-color: #b5eed7; }
.ops-state-track > button > i { display: none; }
.ops-state-track > button > i.pending { background: var(--amber); }
.ops-state-track > button > i.published { background: var(--accent); }
.ops-state-track > button > i.archived { background: var(--ink-3); }
.ops-state-track > button > svg { width: 14px; height: 14px; flex: 0 0 auto; margin-left: auto; color: var(--ink-3); }
.ops-state-track > button:focus-visible, .operations-metrics article > button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ops-state-track > button:focus-visible { outline-color: #b5eed7; }
.ops-state-track span { display: grid; }
.ops-state-track strong { color: #c2f3df; font-size: 34px; line-height: 1.2; font-weight: 500; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ops-state-track small { margin-top: 8px; color: #c3d8e1; font-size: 14px; }

/* ── 도구 막대 ───────────────────────────────────────────────────────────── */

.ops-toolbar { flex-wrap: wrap; gap: 14px; }
.ops-toolbar-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ops-toolbar-controls label {
  width: 220px; height: 32px; padding: 0 10px; display: flex; align-items: center; gap: 7px;
  background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--r-sm);
}
.ops-toolbar-controls label svg { width: 14px; height: 14px; flex: 0 0 auto; color: var(--ink-3); }
.ops-toolbar-controls label input { width: 100%; background: none; border: 0; outline: 0; font-size: 13px; }
/* background 단축속성을 쓰면 styles.css가 그린 화살표(background-image)까지 지워집니다.
   색만 바꾸도록 longhand로 둡니다. */
.ops-toolbar-controls > input, .ops-toolbar-controls select {
  height: 32px; padding: 0 10px; color: var(--ink); background-color: var(--surface-2);
  border: 1px solid var(--line-strong); border-radius: var(--r-sm); outline: 0; font-size: 13px;
}
.ops-toolbar-controls > input { width: 150px; }
.ops-toolbar-controls select { min-width: 118px; }
.ops-toolbar-controls label:focus-within, .ops-toolbar-controls > input:focus, .ops-toolbar-controls select:focus { border-color: var(--accent); }
.operations-table-panel { min-height: 400px; }

/* ── 콘텐츠 검토 ─────────────────────────────────────────────────────────── */

.ops-content-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto auto; align-items: center; gap: 14px; }
.ops-row-main { min-width: 0; }
.ops-row-main > div { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ops-row-main strong { display: block; margin: 4px 0 1px; font-size: 13.5px; }
.ops-row-main p { overflow: hidden; color: var(--ink-2); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.ops-row-main small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 12px; }
.ops-row-signal { display: flex; gap: 14px; }
.ops-row-signal span { display: grid; justify-items: center; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ops-row-signal small { color: var(--ink-3); font-size: 11.5px; font-weight: 400; }

.lifecycle-chip {
  height: 21px; padding: 0 8px; display: inline-flex; align-items: center; gap: 5px;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 11.5px; font-weight: 600;
}
.lifecycle-chip i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.lifecycle-chip.published { color: var(--accent); background: var(--accent-soft); }
.lifecycle-chip.pending { color: var(--amber); background: var(--amber-soft); }
.lifecycle-chip.rejected, .lifecycle-chip.deleted { color: var(--danger); background: var(--danger-soft); }

/* ── 신고함 ─────────────────────────────────────────────────────────────── */

.ops-report-row { display: grid; gap: 10px; }
.ops-report-row > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ops-report-row > header > div { display: flex; flex-wrap: wrap; gap: 6px; }
.ops-report-row > header time { color: var(--ink-3); font-size: 12px; }
.report-reason, .report-status {
  height: 21px; padding: 0 8px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 11.5px; font-weight: 600;
}
.report-reason.security, .report-reason.harassment { color: var(--danger); background: var(--danger-soft); }
.report-status.open { color: var(--amber); background: var(--amber-soft); }
.report-status.resolved { color: var(--accent); background: var(--accent-soft); }
.ops-report-target { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 11px; }
.ops-report-target > i {
  width: 30px; height: 30px; display: grid; place-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 12px; font-style: normal; font-weight: 700;
}
.ops-report-target small { display: block; color: var(--ink-3); font-size: 12px; }
.ops-report-target strong { display: block; margin: 1px 0 5px; font-size: 13.5px; }
.ops-report-row > p { color: var(--ink-2); font-size: 13px; }
.ops-report-meta { display: flex; flex-wrap: wrap; gap: 14px; color: var(--ink-3); font-size: 12px; }
.ops-report-meta b { color: var(--ink-2); }
.ops-report-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; }
.ops-report-controls label { display: grid; gap: 4px; }
.ops-report-controls label > span { color: var(--ink-3); font-size: 12px; }
.ops-report-controls select, .ops-report-controls input {
  height: 32px; padding: 0 10px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-sm); outline: 0; font-size: 13px;
}
.ops-report-controls .report-note { flex: 1; min-width: 220px; }
.ops-report-controls .report-note input { width: 100%; }
.ops-report-controls select:focus, .ops-report-controls input:focus { border-color: var(--accent); }

/* ── 사용자와 초대 ───────────────────────────────────────────────────────── */

.ops-user-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 14px; }
.ops-user-row.is-deactivated { opacity: .58; }
.ops-user-identity { min-width: 0; }
.ops-user-identity strong { display: block; font-size: 13.5px; }
.ops-user-identity span { display: block; overflow: hidden; color: var(--ink-2); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.ops-user-identity small { display: block; margin-top: 2px; color: var(--ink-3); font-size: 12px; }
.ops-user-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; }
.ops-user-controls label { display: grid; gap: 4px; }
.ops-user-controls label > span { color: var(--ink-3); font-size: 12px; }
.ops-user-controls select {
  height: 30px; padding: 0 9px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-sm); outline: 0; font-size: 12.5px;
}
.ops-access-toggle { align-self: end; }
.ops-access-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.ops-access-toggle > span {
  height: 30px; padding: 0 10px; display: inline-flex; align-items: center; gap: 6px;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line);
  border-radius: var(--r-sm); font-size: 12.5px; cursor: pointer;
}
.ops-access-toggle i { width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong); }
.ops-access-toggle input:checked ~ span { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
.ops-access-toggle input:checked ~ span i { background: var(--accent); }

.ops-invite-layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 16px; align-items: start; }
.ops-invite-create form { padding: 16px; display: grid; gap: 12px; }
.ops-invite-create label { display: grid; gap: 5px; }
.ops-invite-create label > span { color: var(--ink-2); font-size: 12.5px; font-weight: 500; }
.ops-invite-create input, .ops-invite-create select {
  height: 34px; padding: 0 10px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-sm); outline: 0; font-size: 13px;
}
.ops-invite-create input:focus, .ops-invite-create select:focus { border-color: var(--accent); }
.ops-invite-create form > p { margin: 0; color: var(--ink-3); font-size: 12px; }

.ops-invite-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 13px; }
.ops-invite-row.is-inactive { opacity: .58; }
.ops-invite-icon { width: 28px; height: 28px; display: grid; place-items: center; color: var(--ink-2); }
.ops-invite-icon svg { width: 20px; height: 20px; }
.ops-invite-row span { display: flex; align-items: center; gap: 7px; }
.ops-invite-row strong { font-size: 13.5px; }
.ops-invite-row b {
  height: 20px; padding: 0 7px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: 4px; font-size: 11px; font-weight: 600;
}
.ops-invite-row b.active { color: var(--accent); background: var(--accent-soft); }
.ops-invite-row p { color: var(--ink-2); font-size: 12.5px; }
.ops-invite-row small { display: block; margin-top: 2px; color: var(--ink-3); font-size: 12px; }
.invite-secret { padding: 16px; color: var(--ink); background: var(--accent-soft); border: 1px solid var(--accent-line); border-radius: var(--r); }
.invite-secret code {
  display: block; margin: 12px 0; padding: 12px; overflow-wrap: anywhere;
  background: var(--surface); border: 1px solid var(--accent-line); border-radius: var(--r-sm);
  font-family: var(--mono); font-size: 13px;
}
.invite-secret p, .invite-secret small { color: var(--ink-2); font-size: 12.5px; }

/* ── 감사 로그 ───────────────────────────────────────────────────────────── */

.ops-audit-summary {
  padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  color: var(--ink-2); background: var(--surface-2); border-bottom: 1px solid var(--line); font-size: 12.5px;
}
.ops-audit-summary small { color: var(--ink-3); font-size: 12px; }
.ops-audit-row { display: grid; grid-template-columns: 150px 8px minmax(0, 1fr) auto; align-items: baseline; gap: 12px; }
.ops-audit-row time { color: var(--ink-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.ops-audit-row > i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.ops-audit-row strong { display: block; font-size: 13px; }
.ops-audit-row p { color: var(--ink-3); font-size: 12.5px; }
.ops-audit-row p span, .ops-audit-row p b { color: var(--ink-2); font-weight: 500; }
.ops-audit-row code {
  display: block; margin-top: 4px; overflow: hidden; color: var(--ink-3);
  font-family: var(--mono); font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap;
}
.ops-audit-row > small { color: var(--ink-3); font-size: 12px; }

/* ── 릴리스 판정 ─────────────────────────────────────────────────────────── */

.ops-release-hero, .ops-resilience-hero {
  margin-bottom: 16px; padding: 20px 22px; display: grid; grid-template-columns: minmax(0, 1fr) 148px;
  align-items: center; gap: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
}
.ops-release-copy h2, .ops-resilience-copy h2 { margin: 4px 0 0; font-size: 18px; }
.ops-release-copy > p, .ops-resilience-copy > p { max-width: 72ch; margin-top: 6px; color: var(--ink-2); font-size: 13.5px; }
.ops-release-meta, .ops-resilience-meta { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.ops-release-meta span, .ops-resilience-meta span {
  height: 26px; padding: 0 10px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 12.5px;
}
.ops-release-score, .ops-resilience-ring {
  padding: 13px 15px; display: grid; justify-items: start;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r);
}
.ops-release-score small, .ops-resilience-ring small { color: var(--ink-3); font-size: 12px; font-weight: 600; }
.ops-release-score strong, .ops-resilience-ring strong { font-size: 27px; line-height: 1.15; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ops-release-score > span { color: var(--ink-3); font-size: 12px; }
.ops-release-score > i, .ops-resilience-score > b {
  margin-top: 9px; height: 22px; padding: 0 8px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 11.5px; font-style: normal; font-weight: 600;
}
.ops-release-hero[data-status="passed"] .ops-release-score > i { color: var(--accent); background: var(--accent-soft); }
.ops-release-hero[data-status="failed"] .ops-release-score > i { color: var(--danger); background: var(--danger-soft); }
.ops-release-hero[data-status="conditional"] .ops-release-score > i,
.ops-release-hero[data-status="warning"] .ops-release-score > i { color: var(--amber); background: var(--amber-soft); }
.ops-release-refresh { margin-top: 10px; display: inline-flex; align-items: center; gap: 6px; color: var(--accent); font-size: 12.5px; font-weight: 600; }
.ops-release-refresh svg { width: 13px; height: 13px; }

.ops-release-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.ops-release-side { display: grid; gap: 16px; }
.ops-release-check { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: start; gap: 12px; }
.ops-release-check > span { color: var(--ink-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.ops-release-check strong { display: block; font-size: 13.5px; }
.ops-release-check p { color: var(--ink-2); font-size: 12.5px; }
.ops-release-check small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 12px; }
.ops-release-check > i, .ops-release-external-row > span, .ops-release-history-row > b, .ops-resilience-gate > i {
  height: 22px; padding: 0 8px; display: inline-flex; align-items: center; flex: 0 0 auto;
  color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); font-size: 11.5px; font-style: normal; font-weight: 600;
}
.ops-release-check.passed > i, .ops-release-external-row.passed > span,
.ops-release-history-row.passed > b, .ops-resilience-gate.passed > i { color: var(--accent); background: var(--accent-soft); }
.ops-release-check.failed > i, .ops-release-external-row.failed > span,
.ops-release-history-row.failed > b, .ops-resilience-gate.failed > i { color: var(--danger); background: var(--danger-soft); }
.ops-release-check.warning > i, .ops-release-history-row.conditional > b,
.ops-resilience-gate.pending > i, .ops-resilience-gate.conditional > i { color: var(--amber); background: var(--amber-soft); }

.ops-release-kpis { padding: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ops-release-kpis > article, .ops-recovery-targets article {
  padding: 11px 13px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.ops-release-kpis small, .ops-recovery-targets small { display: block; color: var(--ink-3); font-size: 12px; font-weight: 600; }
.ops-release-kpis strong, .ops-recovery-targets strong { display: block; margin: 2px 0 1px; font-size: 18px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ops-release-kpis span, .ops-recovery-targets span { color: var(--ink-3); font-size: 12px; }

.ops-release-external-row { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.ops-release-external-row > i { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }
.ops-release-external-row.passed > i { background: var(--accent); }
.ops-release-external-row.failed > i { background: var(--danger); }
.ops-release-external-row strong { display: block; font-size: 13px; }
.ops-release-external-row p { color: var(--ink-3); font-size: 12.5px; }

.ops-release-history-panel { margin-top: 16px; }
.ops-release-history-row { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto auto auto; align-items: center; gap: 12px; }
.ops-release-history-row > i { width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong); }
.ops-release-history-row.passed > i { background: var(--accent); }
.ops-release-history-row.failed > i { background: var(--danger); }
.ops-release-history-row strong { display: block; font-size: 13px; font-family: var(--mono); }
.ops-release-history-row p { color: var(--ink-3); font-size: 12.5px; }
.ops-release-history-row > span { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ops-release-history-row > small { color: var(--ink-3); font-size: 12px; }

/* ── 복구 태세 ───────────────────────────────────────────────────────────── */

.ops-resilience-actions { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ops-resilience-secondary, .ops-resilience-ghost {
  height: 34px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  color: var(--ink-2); background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-sm); font-size: 13px; font-weight: 500;
}
.ops-resilience-secondary:hover, .ops-resilience-ghost:hover { color: var(--ink); border-color: var(--line-strong); }
.ops-resilience-ghost { width: 34px; padding: 0; }
.ops-resilience-secondary svg, .ops-resilience-ghost svg { width: 14px; height: 14px; }
.ops-resilience-score { display: grid; justify-items: start; }
.ops-resilience-hero[data-status="passed"] .ops-resilience-score > b { color: var(--accent); background: var(--accent-soft); }

.ops-resilience-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.ops-resilience-side, .ops-resilience-ledgers { display: grid; gap: 16px; }
.ops-resilience-ledgers { margin-top: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ops-resilience-matrix { padding: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ops-resilience-gate {
  padding: 12px 13px; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: start; gap: 10px;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.ops-resilience-gate small { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-resilience-gate strong { display: block; margin: 2px 0 1px; font-size: 13.5px; }
.ops-resilience-gate p { color: var(--ink-2); font-size: 12.5px; }
.ops-resilience-gate footer { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.ops-resilience-gate footer span {
  height: 20px; padding: 0 7px; display: inline-flex; align-items: center;
  color: var(--ink-3); background: var(--surface-3); border-radius: 4px; font-size: 11.5px;
}
.ops-recovery-targets > div:not(.load-note) { padding: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ops-recovery-latest > div:not(.load-note) { padding: 14px 16px; }
.ops-recovery-result { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 11px; }
.ops-recovery-result > span { width: 30px; height: 30px; display: grid; place-items: center; color: var(--accent); background: var(--accent-soft); border-radius: var(--r-sm); }
.ops-recovery-result > span svg { width: 15px; height: 15px; }
.ops-recovery-result small { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-recovery-result strong { display: block; margin: 2px 0 1px; font-size: 13.5px; }
.ops-recovery-result p { color: var(--ink-2); font-size: 12.5px; }
.ops-recovery-result footer { margin-top: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ops-recovery-result footer b {
  height: 21px; padding: 0 8px; display: inline-flex; align-items: center;
  color: var(--accent); background: var(--accent-soft); border-radius: 4px; font-size: 11.5px;
}
.ops-recovery-result footer code, .ops-evidence-row code, .ops-drill-row code, .ops-backup-row code {
  color: var(--ink-3); font-family: var(--mono); font-size: 11.5px;
}

.ops-evidence-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: start; gap: 11px; }
.ops-evidence-row > span { width: 30px; height: 30px; display: grid; place-items: center; color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-sm); }
.ops-evidence-row.passed > span { color: var(--accent); background: var(--accent-soft); }
.ops-evidence-row > span svg { width: 15px; height: 15px; }
.ops-evidence-row b { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-evidence-row strong { display: block; margin: 2px 0 0; font-size: 13.5px; }
.ops-evidence-row p { color: var(--ink-2); font-size: 12.5px; }
.ops-evidence-row aside { display: grid; justify-items: end; gap: 5px; }
.ops-evidence-row aside i {
  height: 21px; padding: 0 8px; display: inline-flex; align-items: center;
  color: var(--ink-2); background: var(--surface-3); border-radius: 4px; font-size: 11.5px; font-style: normal; font-weight: 600;
}
.ops-evidence-row.passed aside i { color: var(--accent); background: var(--accent-soft); }
.ops-evidence-row.revoked aside i { color: var(--danger); background: var(--danger-soft); }
.ops-evidence-row aside small, .ops-evidence-row aside em { color: var(--ink-3); font-size: 12px; font-style: normal; }

.ops-drill-row { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.ops-drill-row > i { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }
.ops-drill-row.passed > i { background: var(--accent); }
.ops-drill-row.failed > i { background: var(--danger); }
.ops-drill-row span { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-drill-row strong { display: block; margin: 2px 0 1px; font-size: 13.5px; }
.ops-drill-row p { color: var(--ink-3); font-size: 12.5px; }
.ops-drill-row aside { display: grid; justify-items: end; gap: 3px; }
.ops-drill-row aside b { font-size: 12.5px; font-variant-numeric: tabular-nums; }

/* ── 시스템 ─────────────────────────────────────────────────────────────── */

.ops-system-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.ops-system-grid { padding: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ops-system-card {
  padding: 12px 13px; display: grid; grid-template-columns: 24px minmax(0, 1fr) 8px; align-items: start; gap: 10px;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.ops-system-card > span { color: var(--ink-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.ops-system-card small { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-system-card strong { display: block; margin: 2px 0 1px; font-size: 14px; }
.ops-system-card p { color: var(--ink-2); font-size: 12.5px; }
.ops-system-card > i { width: 7px; height: 7px; margin-top: 5px; border-radius: 50%; background: var(--accent); }
.ops-system-card.is-warning > i { background: var(--amber); }
.ops-runtime-issues { margin: 0 12px 12px; padding: 12px 14px; color: var(--amber); background: var(--amber-soft); border: 1px solid var(--amber-line); border-radius: var(--r-sm); }
.ops-runtime-issues strong { display: block; margin-bottom: 5px; font-size: 13px; }
.ops-runtime-issues ul { margin: 0; padding-left: 17px; font-size: 12.5px; }

.ops-backup-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.ops-backup-row strong { display: block; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ops-backup-row small { display: block; color: var(--ink-3); font-size: 12px; }

/* ── 운영 대화상자 ───────────────────────────────────────────────────────── */

.operations-dialog { position: fixed; z-index: 6000; inset: 0; display: none; place-items: center; padding: 20px; }
.operations-dialog.open { display: grid; }
.operations-dialog-backdrop { position: absolute; inset: 0; background: rgba(12, 18, 16, .5); }
.operations-dialog-panel {
  position: relative; width: min(660px, 100%); max-height: calc(100vh - 48px); overflow: auto;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-pop);
}
.operations-dialog-panel > header {
  position: sticky; z-index: 2; top: 0; padding: 16px 20px; display: flex; align-items: start; justify-content: space-between; gap: 12px;
  background: var(--surface); border-bottom: 1px solid var(--line);
}
.operations-dialog-panel > header span { display: block; margin-bottom: 2px; color: var(--ink-3); font-size: 12px; font-weight: 600; }
.operations-dialog-panel > header h2 { margin: 0; font-size: 17px; }
.operations-dialog-panel > header button { width: 30px; height: 30px; display: grid; place-items: center; color: var(--ink-3); border-radius: var(--r-sm); }
.operations-dialog-panel > header button:hover { color: var(--ink); background: var(--surface-3); }
.operations-dialog-panel > header button svg { width: 15px; height: 15px; }
.operations-dialog-body { padding: 18px 20px; display: grid; gap: 14px; }
.operations-dialog-panel > footer {
  position: sticky; bottom: 0; padding: 13px 20px; display: flex; justify-content: flex-end; gap: 8px;
  background: var(--surface); border-top: 1px solid var(--line);
}
.ops-dialog-cancel, .ops-dialog-confirm { height: 34px; padding: 0 15px; border-radius: var(--r-sm); font-size: 13px; font-weight: 600; }
.ops-dialog-cancel { color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); }
.ops-dialog-cancel:hover { color: var(--ink); border-color: var(--line-strong); }
.ops-dialog-confirm { color: #fff; background: var(--accent); }
.ops-dialog-confirm:hover { background: var(--accent-hover); }
.ops-dialog-confirm.danger { background: var(--danger); }
.ops-dialog-confirm.approve { background: var(--accent); }
.ops-dialog-copy { color: var(--ink-2); font-size: 13px; }
.ops-dialog-summary { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: start; gap: 11px; }
.ops-dialog-summary strong { display: block; font-size: 14px; }
.ops-dialog-summary p { color: var(--ink-2); font-size: 12.5px; }
.ops-dialog-field { display: grid; gap: 5px; }
.ops-dialog-field > span { color: var(--ink-2); font-size: 12.5px; font-weight: 500; }
.ops-dialog-field > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ops-dialog-field input, .ops-dialog-field select, .ops-dialog-field textarea, .ops-edit-form input, .ops-edit-form textarea {
  width: 100%; padding: 9px 11px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-sm); outline: 0; font-size: 13px; resize: vertical;
}
.ops-dialog-field input:focus, .ops-dialog-field select:focus, .ops-dialog-field textarea:focus,
.ops-edit-form input:focus, .ops-edit-form textarea:focus { border-color: var(--accent); }
.ops-dialog-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ops-checkline { display: flex; align-items: center; gap: 9px; color: var(--ink-2); font-size: 13px; }
.ops-edit-form { display: grid; gap: 12px; }
.ops-edit-form label { display: grid; gap: 5px; }
.ops-edit-form label > span { color: var(--ink-2); font-size: 12.5px; font-weight: 500; }
.ops-change-preview { padding: 12px; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); font-size: 12.5px; }

.ops-version-heading { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.ops-version-heading strong { display: block; margin: 6px 0 2px; font-size: 15px; }
.ops-version-heading p { color: var(--ink-2); font-size: 12.5px; }
.ops-version-timeline { display: grid; }
.ops-version-timeline article {
  padding: 12px 0; display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: start; gap: 11px;
  border-bottom: 1px solid var(--line);
}
.ops-version-timeline article:last-child { border-bottom: 0; }
.ops-version-timeline > article > i { width: 7px; height: 7px; margin-top: 6px; border-radius: 50%; background: var(--accent); }
.ops-version-timeline span { display: block; color: var(--ink-3); font-size: 11.5px; font-weight: 600; }
.ops-version-timeline strong { display: block; margin: 2px 0 1px; font-size: 13.5px; }
.ops-version-timeline p { color: var(--ink-2); font-size: 12.5px; }
.ops-version-timeline small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 12px; }

.my-work-summary { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.my-work-summary span { font-size: 13.5px; }
.my-work-summary p { margin-top: 3px; color: var(--ink-2); font-size: 12.5px; }
.my-work-list article {
  padding: 12px 0; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px;
  border-bottom: 1px solid var(--line);
}
.my-work-list article:last-child { border-bottom: 0; }
.my-work-list strong { display: block; margin: 4px 0 1px; font-size: 13.5px; }
.my-work-list small { color: var(--ink-3); font-size: 12px; }

/* ── 다크 모드 보정 ─────────────────────────────────────────────────────── */

body.soft-dark .ops-primary, body.soft-dark .ops-dialog-confirm { color: #0d1614; }
body.soft-dark .operations-dialog-backdrop { background: rgba(0, 0, 0, .65); }

/* ── 반응형 ─────────────────────────────────────────────────────────────── */

@media (max-width: 1180px) {
  .operations-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operations-metrics article:nth-child(even) { border-right: 0; }
  .operations-metrics article:nth-child(n+3) { border-top: 1px solid var(--line); }
  .operations-overview-grid, .ops-invite-layout, .ops-release-layout,
  .ops-resilience-layout, .ops-system-layout, .ops-resilience-ledgers { grid-template-columns: minmax(0, 1fr); }
  .operations-page .operations-overview-grid > :is(.ops-panel, .ops-state-map, .ops-overview-stack) { grid-column: 1; grid-row: auto; }
  .ops-resilience-matrix, .ops-system-grid { grid-template-columns: minmax(0, 1fr); }
  .ops-audit-row { grid-template-columns: 130px 8px minmax(0, 1fr); }
  .ops-audit-row > small { display: none; }
}

@media (max-width: 900px) {
  .operations-hero { align-items: start; flex-direction: column; gap: 14px; }
  .operations-shell { width: calc(100% - 32px); padding: 20px 0 48px; }
  .operations-metrics article { padding: 22px; }
  .operations-tabs { position: static; overflow-x: auto; flex-wrap: nowrap; }
  .operations-tabs button { white-space: nowrap; }
  .ops-release-hero, .ops-resilience-hero { grid-template-columns: minmax(0, 1fr); }
  .ops-state-track { grid-template-columns: 1fr 1fr; }
  .ops-toolbar-controls label, .ops-toolbar-controls > input, .ops-toolbar-controls select { width: 100%; }
  .ops-queue-item { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .ops-queue-item > .ops-queue-rank { display: none; }
  .ops-content-row, .ops-user-row { grid-template-columns: 34px minmax(0, 1fr); }
  .ops-content-row .ops-row-signal, .ops-content-row .ops-row-actions,
  .ops-user-row .ops-user-controls { grid-column: 1 / -1; }
  .ops-audit-row { grid-template-columns: minmax(0, 1fr); }
  .ops-audit-row > i { display: none; }
  .ops-release-kpis, .ops-recovery-targets > div:not(.load-note), .ops-dialog-grid,
  .ops-dialog-field > div, .ops-invite-create form > div { grid-template-columns: minmax(0, 1fr); }
  .ops-evidence-row, .ops-drill-row { grid-template-columns: minmax(0, 1fr); }
  .ops-evidence-row aside, .ops-drill-row aside { justify-items: start; }
}

/* 훈련 과제 부여 */
.ops-assignment-list { min-height: 200px; }
.ops-assignment-row {
  padding: 18px 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto;
  align-items: center; gap: 16px;
}
.ops-assignment-row + .ops-assignment-row { border-top: 1px solid var(--line); }
.ops-assignment-row:hover { background: var(--surface-2); }
.ops-assignment-row span { display: block; color: var(--ink-2); font-size: 14px; }
.ops-assignment-row strong { display: block; margin: 6px 0; color: var(--ink); font-size: 16px; font-weight: 550; line-height: 1.5; }
.ops-assignment-row small { color: var(--ink-3); font-size: 13px; }
.ops-assignment-rate {
  min-height: 30px; padding: 4px 10px; display: inline-flex; align-items: center;
  color: var(--accent); background: var(--accent-soft); border-radius: var(--r-sm);
  font-size: 14px; font-style: normal; font-weight: 550; font-variant-numeric: tabular-nums;
}
.ops-assignment-rate.pending { color: var(--amber); background: var(--amber-soft); }
.ops-assignment-rate.failed { color: var(--danger); background: var(--danger-soft); }
.ops-invite-create form > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ops-invite-create textarea {
  padding: 9px 11px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-sm); outline: 0; font-size: 13px; resize: vertical;
}
.ops-invite-create textarea:focus { border-color: var(--accent); }