/* 운영자 화면(로그인·총회 목록·총회·해설 검수)과 운영 화면 틀(위 막대 메뉴)의 화면별 모양. ops.css 다음에 읽는다.
   운영 화면 틀(shell.js)이 쓰는 메뉴 모양도 여기 있어서, 다른 운영 화면도 이 파일을 <head>에 둔다(없으면 틀이 붙인다).
   색은 --lm- 변수만. 상태는 색 + 글자 + 아이콘. 줄표·카드 속 카드·장식 그림자를 두지 않는다. */

/* ── 위 막대 메뉴. 지금 화면은 흰 글자와 아래 2px 금색 선(금색은 네이비 위에서만) ── */

.topbar > a:first-child {
  display: flex;
  align-items: center;
  min-height: 40px;
}

/* 로고 옆 '운영'은 메뉴가 아니라 제품 이름표다. 작고 흐린 글자로 로고에 붙이고, 메뉴와는 간격으로 가른다 */
.topbar-brand {
  gap: var(--lm-space-8);
  margin-right: var(--lm-space-16);
  text-decoration: none;
}

.topbar-product {
  color: var(--lm-rail-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

.ops-nav ul {
  display: flex;
  gap: var(--lm-space-4);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ops-nav a {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--rd-topbar);
  padding: 0 var(--lm-space-12);
  color: var(--lm-rail-ink);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: color var(--rd-duration-color) var(--lm-ease-out);
}

.ops-nav a:hover {
  color: var(--lm-rail-ink-strong);
}

.ops-nav a[aria-current="page"] {
  color: var(--lm-rail-ink-strong);
}

.ops-nav a[aria-current="page"]::after {
  content: "";
  position: absolute;
  right: var(--lm-space-12);
  bottom: 0;
  left: var(--lm-space-12);
  height: 2px;
  background: var(--lm-rail-accent);
}

.topbar-account .who {
  display: flex;
  align-items: center;
  gap: var(--lm-space-8);
  color: var(--lm-rail-ink);
}

.topbar-account .who .icon {
  color: var(--lm-rail-muted);
}

/* ── 머리·되돌아가기·부제 ── */

.ops-back {
  display: inline-flex;
  align-items: center;
  gap: var(--lm-space-4);
  margin-bottom: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.ops-back:hover {
  color: var(--lm-primary);
}

.ops-back .icon {
  width: 16px;
  height: 16px;
}

.ops-head h1 {
  font-size: var(--rd-fs-h1);
}

.ops-sub {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-4) var(--lm-space-12);
  margin-top: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 14px;
}

.ops-sub .sep {
  width: 1px;
  height: 12px;
  background: var(--lm-hairline);
}

.ops-head-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
}

/* ── 판: 머리(제목 + 행동) / 몸 ── */

.panel + .panel {
  margin-top: var(--lm-space-24);
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lm-space-12);
  min-height: 56px;
  padding: var(--lm-space-12) var(--lm-space-20);
  border-bottom: 1px solid var(--lm-hairline);
}

.panel-head h2 {
  font-size: var(--rd-fs-h2);
}

.panel-head .count {
  margin-left: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.panel-body {
  padding: var(--lm-space-16) var(--lm-space-20);
}

.panel-body.flush {
  padding: 0;
}

.panel-note {
  color: var(--lm-text-muted);
  font-size: 14px;
  line-height: 1.6;
}

.ops-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  align-items: start;
  gap: var(--lm-space-24);
}

.ops-side .panel + .panel {
  margin-top: var(--lm-space-16);
}

/* ── 작은 단추·글자 단추 ── */

.ops .btn.sm {
  min-height: 32px;
  padding: 0 var(--lm-space-12);
  font-size: 13px;
}

.ops .btn.primary:disabled {
  border-color: var(--lm-border);
  background: var(--lm-bg-subtle);
  color: var(--lm-text-muted);
  opacity: 1;
}

.ops .btn.danger-text {
  color: var(--lm-danger);
}

.btn-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
}

/* ── 입력(운영 밀도) ── */

.ops textarea {
  min-height: 72px;
  line-height: 1.6;
}

.ops .field > label,
.ops .label {
  font-size: 14px;
}

.ops .field .hint {
  color: var(--lm-text-muted);
  font-size: 13px;
  line-height: 1.5;
}

.ops .field-error {
  font-size: 13px;
}

.ops .field-error .icon {
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--lm-space-16) var(--lm-space-20);
}

.form-grid .wide {
  grid-column: 1 / -1;
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-20);
}

.choice-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lm-space-8);
}

.choice {
  display: inline-flex;
  align-items: center;
  gap: var(--lm-space-8);
  min-height: 40px;
  padding: 0 var(--lm-space-12);
  border: 1px solid var(--lm-border-strong);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-surface);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.choice:has(input:checked) {
  border-color: var(--lm-primary);
  background: var(--lm-bg-selected);
}

.choice input {
  margin: 0;
}

.inline-form {
  padding: var(--lm-space-20);
  border-bottom: 1px solid var(--lm-hairline);
  background: var(--lm-bg-page);
}

.inline-form h3 {
  margin-bottom: var(--lm-space-16);
  font-size: 15px;
}

/* ── 알림 줄(상태·오류). 바탕색 + 아이콘 + 글자 ── */

.notice {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  padding: var(--lm-space-12) var(--lm-space-16);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-subtle);
  color: var(--lm-text-strong);
  font-size: 14px;
  line-height: 1.6;
}

.notice .icon {
  width: 18px;
  height: 18px;
  margin-top: 2px;
}

.notice .notice-body {
  flex: 1 1 auto;
  min-width: 0;
}

.notice .notice-body strong {
  display: block;
}

.notice .btn {
  flex: 0 0 auto;
  margin: -4px 0;
}

.notice.info {
  background: var(--lm-trust-soft);
  color: var(--lm-trust);
}

.notice.success {
  background: var(--lm-success-surface);
  color: var(--lm-success-text);
}

.notice.warn {
  background: var(--lm-warning-surface);
  color: var(--lm-warning-text);
}

.notice.error {
  background: var(--lm-danger-surface);
  color: var(--lm-danger);
}

.notice + .notice,
.notice + .panel,
.panel + .notice {
  margin-top: var(--lm-space-16);
}

/* ── 빈 상태 ── */

.empty {
  display: grid;
  justify-items: start;
  gap: var(--lm-space-12);
  padding: var(--lm-space-32) var(--lm-space-20);
}

.empty h3 {
  font-size: 16px;
}

.empty p {
  max-width: 60ch;
  color: var(--lm-text);
  font-size: 14px;
  line-height: 1.7;
}

/* ── 불러오는 중(뼈대 줄) ── */

.skeleton {
  display: grid;
  gap: var(--lm-space-12);
  padding: var(--lm-space-20);
}

.skeleton span {
  display: block;
  height: 14px;
  border-radius: var(--lm-radius-inner);
  background: var(--lm-skeleton);
  animation: rd-pulse var(--lm-duration-skeleton) ease-in-out infinite alternate;
}

.skeleton span:nth-child(2n) {
  width: 72%;
}

.skeleton span:nth-child(3n) {
  width: 48%;
}

@keyframes rd-pulse {
  from {
    opacity: 1;
  }

  to {
    opacity: 0.45;
  }
}

/* ── 표 안 보조 글 ── */

.table .sub {
  display: block;
  margin-top: 2px;
  color: var(--lm-text-muted);
  font-size: 13px;
}

.table td.nowrap {
  white-space: nowrap;
}

/* 자료 표: 근거로 쓰는 곳이 있어 지울 수 없는 자료는 [지우기]를 두지 않고 자료 이름 밑에 까닭(아이콘 + 글자) */
.table .sub.source-in-use {
  display: flex;
  align-items: center;
  gap: var(--lm-space-4);
}

.source-in-use .icon {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
}

.table td.place {
  min-width: 160px;
  max-width: 260px;
}

.table a.row-link {
  color: var(--lm-text-strong);
  font-weight: 700;
  text-decoration: none;
}

.table a.row-link:hover {
  color: var(--lm-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.table .actions-cell {
  text-align: right;
  white-space: nowrap;
}

.mono {
  font-family: "JetBrains Mono", var(--lm-font-mono);
  font-variant-numeric: tabular-nums;
}

/* ── 로그인 ── */

.login-page {
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: var(--lm-space-32) var(--lm-space-16);
}

.login-card {
  width: 100%;
  max-width: 420px;
  padding: var(--lm-space-32);
}

.login-card .brand-logo {
  margin-bottom: var(--lm-space-24);
}

.login-card h1 {
  font-size: 22px;
}

.login-card .lead {
  margin-top: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 14px;
  line-height: 1.6;
}

.login-card form {
  display: grid;
  gap: var(--lm-space-16);
  margin-top: var(--lm-space-24);
}

.login-card .btn.primary {
  width: 100%;
  min-height: 44px;
}

.password-box {
  position: relative;
}

.password-box input {
  padding-right: 76px;
}

.password-box .btn {
  position: absolute;
  top: 50%;
  right: 4px;
  transform: translateY(-50%);
  min-height: 32px;
  padding: 0 var(--lm-space-8);
  border-color: transparent;
  background: transparent;
  color: var(--lm-text-muted);
  font-size: 13px;
}

.rule-list {
  display: grid;
  gap: var(--lm-space-4);
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--lm-text-muted);
  font-size: 13px;
}

.rule-list li {
  display: flex;
  gap: var(--lm-space-8);
}

.rule-list .icon {
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.login-foot {
  margin-top: var(--lm-space-24);
  padding-top: var(--lm-space-16);
  border-top: 1px solid var(--lm-hairline);
  color: var(--lm-text-muted);
  font-size: 13px;
  line-height: 1.6;
}

/* ── 총회 화면 ── */

/* 초점을 옮겨 화면을 그 자리로 옮길 때 위 막대(56px)에 가리지 않게 */
.ops-main [id] {
  scroll-margin-top: calc(var(--rd-topbar) + var(--lm-space-16));
}

/* 발급 직후 열람 코드 판: 머리 아래 한 판에 코드·링크·복사·경고·공개 상태를 모은다 */
.code-reveal-panel {
  margin-bottom: var(--lm-space-24);
  border-color: var(--lm-primary);
}

.code-reveal-panel .panel-head {
  background: var(--lm-trust-soft);
}

.code-reveal {
  display: grid;
  gap: var(--lm-space-16);
}

/* 판 안 간격은 grid gap 하나로(.notice + .notice 바깥 여백을 쓰지 않는다) */
.code-reveal > .notice {
  margin: 0;
}

.reveal-item {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--lm-space-16);
}

.reveal-item .label {
  color: var(--lm-text-muted);
  font-size: 13px;
  font-weight: 600;
}

.reveal-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--lm-space-12);
  padding-top: var(--lm-space-16);
  border-top: 1px solid var(--lm-hairline);
  font-size: 14px;
}

.code-reveal .code {
  color: var(--lm-trust);
  font-family: "JetBrains Mono", var(--lm-font-mono);
  font-size: 32px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.24em;
  line-height: 1.2;
}

.code-reveal .link-text {
  color: var(--lm-text-strong);
  font-size: 14px;
  word-break: break-all;
}

.facts dd.muted {
  color: var(--lm-text-muted);
}

/* 안건 판: 근거 자료·시작 쪽·끝 쪽을 한 줄에 같은 높이로(안내는 줄 아래 한 번) */
.range-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: var(--lm-space-16) var(--lm-space-20);
}

.range-row :is(input, select) {
  height: 48px;
}

.range-hint {
  margin-top: calc(var(--lm-space-8) * -1);
  color: var(--lm-text-muted);
  font-size: 13px;
  line-height: 1.5;
}

/* 안건을 더한 뒤 판을 연 채로 다음 안건을 받을 때 한 줄 */
.form-done {
  display: flex;
  align-items: center;
  gap: var(--lm-space-8);
  margin-bottom: var(--lm-space-16);
  color: var(--lm-success-text);
  font-size: 14px;
  font-weight: 600;
}

.status-options {
  display: grid;
  gap: var(--lm-space-8);
}

.status-option {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px var(--lm-space-8);
  padding: var(--lm-space-12);
  border: 1px solid var(--lm-hairline);
  border-radius: var(--lm-radius);
  cursor: pointer;
}

.status-option:has(input:checked) {
  border-color: var(--lm-primary);
  background: var(--lm-bg-selected);
}

.status-option input {
  grid-row: span 2;
  margin: 3px 0 0;
}

.status-option strong {
  font-size: 14px;
}

.status-option span {
  color: var(--lm-text-muted);
  font-size: 13px;
  line-height: 1.5;
}

.facts {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--lm-space-8) var(--lm-space-16);
  margin: 0;
  font-size: 14px;
}

.facts dt {
  color: var(--lm-text-muted);
}

.facts dd {
  margin: 0;
  color: var(--lm-text-strong);
}

.agenda-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.agenda-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  gap: var(--lm-space-12);
  align-items: start;
  padding: var(--lm-space-16) var(--lm-space-20);
  border-bottom: 1px solid var(--lm-hairline);
}

.agenda-row:last-child {
  border-bottom: 0;
}

.agenda-no {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--lm-radius-pill);
  background: var(--lm-trust);
  color: var(--lm-on-primary);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.agenda-main {
  min-width: 0;
}

.agenda-main .title {
  color: var(--lm-text-strong);
  font-weight: 700;
}

.agenda-main .plain {
  margin-top: 2px;
  color: var(--lm-text);
  font-size: 14px;
}

.agenda-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 13px;
}

.agenda-side {
  display: flex;
  align-items: center;
  gap: var(--lm-space-4);
}

.agenda-row .inline-form {
  grid-column: 1 / -1;
  margin: var(--lm-space-8) calc(var(--lm-space-20) * -1) calc(var(--lm-space-16) * -1);
  border-top: 1px solid var(--lm-hairline);
  border-bottom: 0;
}

.page-viewer {
  border-top: 1px solid var(--lm-hairline);
}

.page-viewer-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--lm-space-8);
  padding: var(--lm-space-12) var(--lm-space-20);
  background: var(--lm-bg-page);
}

.page-viewer-head strong {
  font-size: 14px;
}

.page-nav {
  display: flex;
  align-items: center;
  gap: var(--lm-space-8);
  font-size: 14px;
}

.page-nav .pos {
  min-width: 72px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.page-text {
  max-height: 480px;
  margin: 0;
  padding: var(--lm-space-16) var(--lm-space-20);
  overflow-y: auto;
  font-family: var(--lm-font-ui);
  font-size: 14px;
  line-height: 1.75;
  white-space: pre-wrap;
}

/* ── 검수 화면(세 칸) ── */

.review-list .back {
  display: flex;
  align-items: center;
  gap: var(--lm-space-4);
  padding: 0 var(--lm-space-16) var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.review-list .back:hover {
  color: var(--lm-primary);
}

.review-list .back .icon {
  width: 16px;
  height: 16px;
}

.review-list .meeting-name {
  padding: 0 var(--lm-space-16) var(--lm-space-12);
  border-bottom: 1px solid var(--lm-hairline);
  color: var(--lm-text-strong);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.review-list ol {
  margin: 0;
  padding: var(--lm-space-8) 0;
  list-style: none;
}

.review-list li a {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px var(--lm-space-8);
  padding: var(--lm-space-8) var(--lm-space-16);
  color: var(--lm-text);
  font-size: 14px;
  line-height: 1.45;
  text-decoration: none;
}

.review-list li a:hover {
  background: var(--lm-bg-subtle);
}

.review-list li a[aria-current="page"] {
  background: var(--lm-bg-surface);
  box-shadow: inset 0 0 0 1px var(--lm-hairline);
  color: var(--lm-text-strong);
  font-weight: 700;
}

.review-list .no {
  color: var(--lm-text-muted);
  font-variant-numeric: tabular-nums;
}

.review-list .state {
  grid-column: 2;
  color: var(--lm-text-muted);
  font-size: 12px;
  font-weight: 600;
}

.review-list .state.todo {
  color: var(--lm-warning-text);
}

.review-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--lm-space-16);
  align-items: start;
  padding-bottom: var(--lm-space-16);
  border-bottom: 1px solid var(--lm-hairline);
}

.review-head h1 {
  font-size: 20px;
  line-height: 1.4;
}

.review-head .plain {
  margin-top: var(--lm-space-4);
  color: var(--lm-text);
  font-size: 14px;
}

.review-tally {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lm-space-4) var(--lm-space-16);
  margin-top: var(--lm-space-12);
  color: var(--lm-text-muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.review-tally b {
  color: var(--lm-text-strong);
  font-weight: 700;
}

.review-tally .todo b {
  color: var(--lm-warning-text);
}

.review-actions {
  display: grid;
  justify-items: end;
  gap: var(--lm-space-8);
}

.review-actions .why {
  max-width: 220px;
  color: var(--lm-text-muted);
  font-size: 12px;
  line-height: 1.5;
  text-align: right;
}

.review-center > .notice {
  margin-top: var(--lm-space-16);
}

.field-section {
  padding: var(--lm-space-24) 0 var(--lm-space-8);
}

.field-section + .field-section {
  border-top: 1px solid var(--lm-hairline);
}

.field-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--lm-space-12);
  margin-bottom: var(--lm-space-12);
}

.field-section-head h2 {
  font-size: 16px;
}

/* 운영 라벨 아래 줄에 조합원 화면 제목(한 줄 안에서 끊기지 않게 따로 둔다) */
.field-section-head .member-q {
  display: block;
  margin-top: 2px;
  color: var(--lm-text-muted);
  font-size: 13px;
  font-weight: 500;
}

/* 칸 자리 안내(운영자만): 판정한 갈래가 칸과 어긋날 때 문장 아래 한 줄. 막지 않으므로 경고색을 쓰지 않는다 */
.aspect-hint {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-4);
  color: var(--lm-trust);
  font-size: 13px;
  line-height: 1.5;
}

.aspect-hint .icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

/* 정정 요청(?correction=)으로 열었을 때 가운데 칸 머리 아래 */
.correction-banner {
  display: grid;
  gap: var(--lm-space-12);
  margin-top: var(--lm-space-16);
  padding: var(--lm-space-16);
  border: 1px solid var(--lm-warning-accent);
  border-radius: var(--lm-radius);
  background: var(--lm-warning-surface);
}

.correction-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
}

.correction-head h2 {
  margin-right: var(--lm-space-4);
  font-size: 15px;
}

.correction-banner .facts dd {
  white-space: pre-wrap;
}

.correction-next {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  color: var(--lm-text-strong);
  font-size: 13px;
  line-height: 1.6;
}

.correction-next .icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 3px;
}

.correction-banner > .btn {
  justify-self: start;
}

.field-empty {
  padding: var(--lm-space-12) var(--lm-space-16);
  border: 1px dashed var(--lm-border);
  border-radius: var(--lm-radius);
  color: var(--lm-text-muted);
  font-size: 13px;
}

.sentence-list {
  display: grid;
  gap: var(--lm-space-8);
  margin: 0;
  padding: 0;
  list-style: none;
}

.sentence {
  padding: var(--lm-space-12) var(--lm-space-16);
  border: 1px solid var(--lm-hairline);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-surface);
  cursor: pointer;
  transition: border-color var(--rd-duration-color) var(--lm-ease-out);
}

.sentence:hover {
  border-color: var(--lm-border);
}

.sentence.is-selected {
  border-color: var(--lm-primary);
  box-shadow: inset 0 0 0 1px var(--lm-primary);
}

.sentence.is-failing {
  border-color: var(--lm-danger);
}

.sentence.is-failing.is-selected {
  box-shadow: inset 0 0 0 1px var(--lm-danger);
}

.sentence-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lm-space-8);
  margin-bottom: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 12px;
  font-weight: 600;
}

.sentence-top .page-ref {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
}

.sentence-text {
  color: var(--lm-text-strong);
  font-size: 15px;
  line-height: 1.65;
}

.sentence.is-removed-item .sentence-text {
  color: var(--lm-text-muted);
  text-decoration: line-through;
}

.sentence-quote {
  display: flex;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-8);
  padding-left: var(--lm-space-12);
  border-left: 1px solid var(--lm-border);
  color: var(--lm-text);
  font-size: 13px;
  line-height: 1.6;
}

.sentence-quote.is-none {
  color: var(--lm-text-muted);
}

.sentence-reasons {
  display: grid;
  gap: var(--lm-space-4);
  margin: var(--lm-space-8) 0 0;
  padding: 0;
  list-style: none;
  color: var(--lm-danger);
  font-size: 13px;
  line-height: 1.5;
}

.sentence-reasons li {
  display: flex;
  gap: var(--lm-space-8);
}

.sentence-reasons .icon {
  width: 16px;
  height: 16px;
  margin-top: 1px;
}

.sentence-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-12);
}

.sentence-edit {
  display: grid;
  gap: var(--lm-space-12);
  cursor: default;
}

.sentence-edit .pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  gap: var(--lm-space-12);
}

.live-check {
  display: grid;
  gap: var(--lm-space-8);
  padding: var(--lm-space-12);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-page);
}

.live-check .sentence-reasons {
  margin: 0;
}

.add-sentence {
  margin-top: var(--lm-space-8);
}

/* 원문 쪽(오른쪽 칸) */
.review-source {
  white-space: normal;
}

.source-head {
  display: grid;
  gap: var(--lm-space-8);
  padding-bottom: var(--lm-space-12);
  border-bottom: 1px solid var(--lm-hairline);
}

.source-head select {
  min-height: 36px;
  padding: var(--lm-space-4) var(--lm-space-8);
  font-size: 14px;
}

.source-head .page-nav {
  justify-content: space-between;
}

.source-text {
  margin: 0;
  padding-top: var(--lm-space-16);
  color: var(--lm-text);
  font-family: var(--lm-font-ui);
  font-size: 14px;
  line-height: 1.8;
  white-space: pre-wrap;
}

.source-hint {
  margin-top: var(--lm-space-12);
  color: var(--lm-text-muted);
  font-size: 12px;
  line-height: 1.5;
}

/* ── 확인 창(게시 직전 한 번) ── */

dialog.ops-dialog {
  width: min(640px, calc(100vw - 48px));
  max-height: calc(100dvh - 96px);
  padding: 0;
  border: 1px solid var(--lm-border);
  border-radius: var(--lm-radius-card);
  background: var(--lm-bg-surface);
  color: var(--lm-text);
  box-shadow: var(--lm-shadow-overlay);
}

dialog.ops-dialog[open] {
  display: flex;
  flex-direction: column;
}

dialog.ops-dialog::backdrop {
  background: var(--lm-scrim);
}

.dialog-head {
  padding: var(--lm-space-20) var(--lm-space-24) var(--lm-space-12);
  border-bottom: 1px solid var(--lm-hairline);
}

.dialog-head h2 {
  font-size: 18px;
}

.dialog-body {
  display: grid;
  gap: var(--lm-space-16);
  padding: var(--lm-space-20) var(--lm-space-24);
  overflow-y: auto;
  font-size: 14px;
  line-height: 1.65;
}

.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--lm-space-8);
  padding: var(--lm-space-12) var(--lm-space-24) var(--lm-space-20);
  border-top: 1px solid var(--lm-hairline);
}

.diff-list {
  display: grid;
  gap: var(--lm-space-12);
  margin: 0;
  padding: 0;
  list-style: none;
}

.diff-list li {
  display: grid;
  gap: var(--lm-space-4);
  padding: var(--lm-space-12);
  border: 1px solid var(--lm-hairline);
  border-radius: var(--lm-radius);
}

.diff-list .kind {
  color: var(--lm-text-muted);
  font-size: 12px;
  font-weight: 700;
}

.diff-list .before {
  color: var(--lm-text-muted);
  text-decoration: line-through;
}

.diff-list .after {
  color: var(--lm-text-strong);
}

@media (max-width: 1100px) {
  .ops-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .review {
    grid-template-columns: 220px minmax(0, 1fr) 360px;
  }
}

.notice + .form-grid {
  margin-top: var(--lm-space-20);
}

.btn-row.end {
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.page-nav form {
  flex-wrap: nowrap;
}

.page-nav input[type="number"] {
  width: 72px;
  min-height: 32px;
  padding: var(--lm-space-4) var(--lm-space-8);
  font-size: 13px;
}

.ops-head + .notice {
  margin-bottom: var(--lm-space-24);
}

/* ── 운영 화면 고침 2차(2026-10-04) ── */

/* 오류로 입력 칸에 초점이 갈 때 그 칸의 이름표까지 위 막대(56px) 아래에 보이게 한다(이름표 한 줄과 간격만큼 더 띄운다) */
.ops-main .field :is(input, select, textarea)[id] {
  scroll-margin-top: calc(var(--rd-topbar) + var(--lm-space-48));
}

/* 인용 필수 칸이 비었을 때: 비운 채 게시하면 조합원이 무엇을 읽는지 그 칸 자리에서 알린다 */
.field-empty.is-warn {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  border: 0;
  background: var(--lm-warning-surface);
  color: var(--lm-warning-text);
  line-height: 1.6;
}

.field-empty.is-warn .icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.field-empty.is-warn + .sentence-list {
  margin-top: var(--lm-space-8);
}

/* 게시 창: 문장 없이 게시되는 칸 목록과 확인 칸 */
.empty-fields {
  display: grid;
  gap: var(--lm-space-12);
  padding: var(--lm-space-12) var(--lm-space-16);
  border-radius: var(--lm-radius);
  background: var(--lm-warning-surface);
  color: var(--lm-warning-text);
}

.empty-fields h3 {
  display: flex;
  align-items: center;
  gap: var(--lm-space-8);
  color: inherit;
  font-size: 14px;
}

.empty-fields h3 .icon {
  width: 18px;
  height: 18px;
}

.empty-fields ul {
  display: grid;
  gap: var(--lm-space-8);
  margin: 0;
  padding: 0;
  list-style: none;
}

.empty-fields li {
  display: grid;
  gap: 2px;
}

/* 확인 칸(빈 칸 확인·질문에 맞는 답 확인). 글자를 눌러도 표시된다 */
.confirm-check {
  display: inline-flex;
  align-items: center;
  gap: var(--lm-space-8);
  min-height: 40px;
  color: var(--lm-text-strong);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.empty-fields .confirm-check {
  color: inherit;
}

.confirm-check input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--lm-primary);
}

.confirm-check:has(input[aria-invalid="true"]) {
  color: var(--lm-danger);
}

/* 질문함: 집행부 답이 도착하면 맨 위에 두는 판(열람 코드 판과 같은 강조) */
.arrival-panel {
  margin-bottom: var(--lm-space-24);
  border-color: var(--lm-primary);
}

.arrival-panel .panel-head {
  background: var(--lm-trust-soft);
}

.arrival-panel .panel-body {
  max-width: 880px;
}

.panel-head-actions {
  display: flex;
  align-items: center;
  gap: var(--lm-space-8);
}

/* 근거 답 편집을 접어 두었을 때의 한 줄 */
#answerFoldNote {
  margin: 0;
}

/* 답 바로 위에 두는 조합원 질문(가린 본문) */
.asked-question p {
  padding: var(--lm-space-12) var(--lm-space-16);
  border: 1px solid var(--lm-hairline);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-page);
}

/* 쪽 보기의 쪽 가기 칸 이름표 */
.goto-label {
  color: var(--lm-text-muted);
  font-size: 13px;
  font-weight: 600;
}

/* ── 총회 안내 해설(총회 화면): 안건 줄과 같은 꼴, 번호 원 대신 표시 ── */

.guide-mark {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--lm-hairline);
  border-radius: var(--lm-radius-control);
  background: var(--lm-trust-soft);
  color: var(--lm-trust);
}

.guide-mark .icon {
  width: 16px;
  height: 16px;
}

/* 아직 만들 수 없는 까닭(총회 날 전·자료 없음). 막는 것이 아니라 차례를 알리므로 경고색을 쓰지 않는다 */
.guide-wait {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  margin-top: var(--lm-space-8);
  color: var(--lm-text-muted);
  font-size: 13px;
  line-height: 1.6;
}

.guide-wait .icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.agenda-row .inline-form .confirm-check {
  align-items: flex-start;
  min-height: 0;
  padding-top: var(--lm-space-4);
  line-height: 1.6;
}

.agenda-row .inline-form .confirm-check input {
  margin-top: 3px;
}

/* 자료 올리기: 받는 자료의 범위(법정 공개 자료만). 판 머리 바로 아래 한 줄 */
.source-scope {
  display: flex;
  align-items: flex-start;
  gap: var(--lm-space-8);
  margin-bottom: var(--lm-space-16);
  padding: var(--lm-space-12) var(--lm-space-16);
  border-radius: var(--lm-radius);
  background: var(--lm-bg-subtle);
  color: var(--lm-text-strong);
  font-size: 14px;
  line-height: 1.6;
}

.source-scope .icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 3px;
  color: var(--lm-trust);
}

/* 총회 목록: 총회 이름 아래 할 일 한 줄(원문 확인을 기다리는 정관 기한) */
.table a.todo-link {
  display: inline-flex;
  align-items: center;
  gap: var(--lm-space-4);
  margin-top: var(--lm-space-4);
  color: var(--lm-warning-text);
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.table a.todo-link:hover {
  color: var(--lm-text-strong);
}

.table a.todo-link .icon {
  width: 14px;
  height: 14px;
}

/* 검수 화면 왼쪽 목록: 총회 안내 해설은 번호 자리에 표시 */
.review-list li.is-guide .no {
  display: grid;
  align-items: center;
  height: 1.45em;
  color: var(--lm-trust);
}

.review-list li.is-guide .no .icon {
  width: 16px;
  height: 16px;
}

.review-list li:not(.is-guide) + li.is-guide {
  margin-top: var(--lm-space-8);
  padding-top: var(--lm-space-8);
  border-top: 1px solid var(--lm-hairline);
}
