/* ==========================================================================
   ADMIN CONSOLE — 명리 관리 (admin-mingli.css)
   명리 작업 흐름, 결정·미결(.ag-*), 개념 폴더(.mc-*), 설계 보드(.mb-*)·흐름도(.mf-*), AI추천(.nudge-*), 가중치 튜닝(.tune-*), 리포트 페이지 조립(.rc-*), 문장 탭 요약
   admin.css 스택의 일부 — 로드 순서는 admin.css 머리 주석 참조. 규칙 순서를 바꾸지 않는다.
   ========================================================================== */

/* --------------------------------------------------------------------------
   명리 작업 흐름 — 층 막대(① 설계·정책 › ② 개념·구성 › ③ 해석 관리 › ④ 리포트 구성)
   -------------------------------------------------------------------------- */
/* 명리 관리 상위 단계(①~④) — 상단 제목 자리의 붙은 세그먼트. 하위 탭(.admin-subtabs)과 모양을 달리해 층을 구분한다. */
.topbar-title h2[hidden], .topbar-flow[hidden] { display: none; }
.topbar-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.flow-step { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; margin-right: -9px; border: 1px solid var(--border-box-purple); background: var(--bg-card-inner); color: var(--text-sub); font-size: 11pt; font-weight: 700; text-decoration: none; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%, 10px 50%); padding-left: 20px; }
.flow-step:first-child { clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); padding-left: 14px; border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.flow-step b { color: var(--neon-cyan); }
.flow-step:hover { color: var(--text-pure); background: color-mix(in srgb, var(--neon-cyan) 12%, var(--bg-card-inner)); }
.flow-step.is-current { color: #fff; font-size: 12.5pt; background: linear-gradient(90deg, color-mix(in srgb, var(--neon-pink) 70%, #2a1450), color-mix(in srgb, var(--neon-purple, #a86bff) 70%, #2a1450)); }
.flow-step.is-current b { color: #fff; }
@media (max-width: 768px) {
  .topbar-left, .topbar-title { min-width: 0; max-width: 100%; }
  .topbar-flow { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .flow-step { flex: none; padding: 6px 10px 6px 16px; font-size: 10.5pt; }
  .flow-step.is-current { font-size: 11pt; }
}

/* ① 설계·정책 › 결정·미결 — 미결 카드, 보류 표, 결정사항 주제 상자 */
.ag-section .panel-header { margin-bottom: 10px; }
.ag-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 10px; }
.ag-card { min-width: 0; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); border-radius: 10px; background: var(--bg-card-inner); }
.ag-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--text-pure); font-size: 11pt; font-weight: 700; line-height: 1.5; }
.ag-track { margin-top: 10px; }
.ag-track-head { margin: 0 0 2px; color: var(--text-pure); font-size: 11pt; font-weight: 800; }
.ag-card .lo-fold { margin-top: 8px; }
.ag-example { display: block; margin: 6px 0 0; padding: 7px 9px; border-left: 3px solid color-mix(in srgb, var(--neon-cyan) 55%, transparent); border-radius: 4px; background: color-mix(in srgb, var(--bg-card-inner) 80%, var(--neon-cyan) 5%); color: var(--text-sub); font-size: 11pt; line-height: 1.55; }
.ag-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; color: var(--text-sub); font-size: 11pt; line-height: 1.6; }
.ag-list b { color: var(--text-pure); }
.ag-topics { columns: 320px 3; column-gap: 10px; }
.ag-topic { break-inside: avoid; margin-bottom: 10px; min-width: 0; padding: 10px 12px; border: 1px solid var(--border-box-purple); border-radius: 10px; background: var(--bg-card-inner); }
.ag-topic.is-locked { border-color: color-mix(in srgb, var(--neon-pink) 45%, var(--border-box-purple)); }
.ag-topic-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 6px; color: var(--neon-cyan); font-size: 11pt; font-weight: 800; }
.ag-row { display: grid; grid-template-columns: 1.2em 1fr; gap: 4px; padding: 3px 0; font-size: 11pt; line-height: 1.55; color: var(--text-sub); border-top: 1px dashed color-mix(in srgb, var(--border-box-purple) 60%, transparent); }
.ag-row:first-of-type { border-top: 0; }
.ag-row b { color: var(--text-pure); font-weight: 700; }
.ag-row .ag-pos { display: block; color: var(--neon-lime); }
.ag-row .ag-meta { display: block; margin-top: 2px; color: var(--text-mute, #8d78a8); font-size: 10.5pt; }
.ag-row .ag-points { margin: 6px 0 0; padding: 0; list-style: none; }
.ag-row .ag-points li { margin: 3px 0; line-height: 1.45; color: var(--text-sub); }
.ag-row .ag-statement { margin: 6px 0 0; line-height: 1.5; }
.ag-structure { margin: 0 0 16px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--border-box-purple) 70%, transparent); border-radius: 10px; }
ol.ag-open-list { margin: 8px 0 16px; padding: 0 0 0 1.6em; }
.ag-open-item { margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px dashed color-mix(in srgb, var(--border-box-purple) 55%, transparent); }
.ag-open-item:last-child { border-bottom: 0; margin-bottom: 0; }
.ag-open-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; margin: 0 0 4px; }
.ag-open-where { margin: 0 0 4px; color: var(--text-mute, #8d78a8); font-size: 10.5pt; }
.ag-frame-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 6px 14px; margin: 10px 0 0; padding: 0; list-style: none; color: var(--text-sub); font-size: 11pt; line-height: 1.6; }
.ag-frame-rules b { color: var(--neon-cyan); }
.ag-frame { margin-top: 10px; }
.ag-category > summary .lo-badge { font-size: 10.5pt; padding: 1px 8px; }
.ag-item { border-top: 1px dashed color-mix(in srgb, var(--border-box-purple) 60%, transparent); }
.ag-item:first-of-type { border-top: 0; }
.ag-item > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 7px 0; cursor: pointer; list-style: none; color: var(--text-sub); font-size: 11pt; line-height: 1.5; }
.ag-item > summary::-webkit-details-marker { display: none; }
.ag-item > summary .lo-badge { font-size: 10.5pt; padding: 1px 8px; }
.ag-item > summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.ag-item-body { padding: 0 0 10px 12px; border-left: 2px solid color-mix(in srgb, var(--neon-cyan) 35%, transparent); }
.ag-origin { margin: 6px 0 0; color: var(--text-mute, #8d78a8); font-size: 10.5pt; line-height: 1.55; }
.ag-row .ag-gates { margin-top: 6px; }
.ag-row .ag-gates .ag-list { margin: 4px 0 0; }
.ag-row.is-locked .ag-pos { color: var(--neon-pink); }
.ag-policy-view-switch { width: fit-content; margin: 10px 0; }
.ag-policy-view-switch .admin-subtab:disabled { opacity: .45; cursor: not-allowed; }
.ag-policy-tree { display: flex; flex-direction: column; gap: 10px; }
.ag-tree-node { min-width: 0; border: 1px solid var(--border-box-purple); border-radius: 10px; background: var(--bg-card-inner); }
.ag-tree-node > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; color: var(--text-pure); font-size: 11pt; font-weight: 800; line-height: 1.5; cursor: pointer; }
.ag-tree-node > summary::marker { content: ''; }
.ag-tree-node > summary::before { content: '▶'; flex: 0 0 auto; color: var(--neon-cyan); font-size: 9pt; }
.ag-tree-node[open] > summary::before { content: '▼'; }
.ag-tree-node[open] > summary { border-bottom: 1px solid color-mix(in srgb, var(--border-box-purple) 65%, transparent); }
.ag-tree-depth-0 { border-color: color-mix(in srgb, var(--neon-cyan) 45%, var(--border-box-purple)); }
.ag-tree-depth-0 > summary { color: var(--neon-cyan); }
.ag-tree-depth-1 > summary { color: var(--neon-lime); }
.ag-tree-label { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.ag-tree-body { display: flex; flex-direction: column; gap: 7px; padding: 9px 10px 10px 18px; }
.ag-tree-body > .ag-tree-node { margin-left: 8px; }
.ag-tree-body > .ag-row { margin-left: 8px; padding: 7px 8px; border: 0; border-left: 2px solid color-mix(in srgb, var(--neon-cyan) 45%, var(--border-box-purple)); }
.ag-tree-warning { display: block; margin-top: 4px; color: var(--neon-yellow); font-size: 11pt; }
@media (max-width: 640px) {
  .ag-policy-view-switch { width: 100%; }
  .ag-policy-view-switch .admin-subtab { flex: 1 1 auto; }
  .ag-tree-body { padding-left: 8px; }
  .ag-tree-body > .ag-tree-node, .ag-tree-body > .ag-row { margin-left: 3px; }
}

/* ② 개념·구성 › 개념 폴더·의존 관계 — 선반(묶음 상자 + 폴더 칩), 고른 폴더 카드, 깊이별 줄 */
/* 2단 전환 기준은 창 너비가 아니라 탭 콘텐츠의 실제 가용 폭이다 — 사이드바 접힘에 따라 달라지기 때문.
   컨테이너 쿼리를 모르는 브라우저에서는 지금까지처럼 한 열로 쌓인다. */
#subtab-concepts-folders { container-type: inline-size; }
.mc-layout { display: grid; gap: 12px; align-items: start; }
@container (min-width: 900px) {
  .mc-layout { grid-template-columns: minmax(240px, 300px) minmax(0, 1fr); }
  .mc-shelf-panel { position: sticky; top: calc(112px / var(--admin-zoom, 1)); max-height: calc((100vh - 140px) / var(--admin-zoom, 1)); max-height: calc((100dvh - 140px) / var(--admin-zoom, 1)); overflow-y: auto; }
  /* 한 열이라 세로로 길어진다 — 여백만 줄이고 글자·클릭 영역은 그대로 둔다. */
  .mc-shelf-panel .mc-shelf { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .mc-shelf-panel .mc-group { padding: 7px 9px; }
  .mc-shelf-panel .mc-group-head { margin-bottom: 4px; }
  /* 좁은 선반이 스크롤될 때 분류 탭은 위에 남긴다. 위 여백을 없애 폴더가 탭 위로 비치지 않게 한다. */
  .mc-shelf-panel .mc-shelf-views { position: sticky; top: 0; z-index: 2; margin: 0 -22px 8px; padding: 0 22px 8px; background: var(--bg-card); }
  .mc-shelf-panel .mc-shelf-view { flex: 1 1 0; min-width: 0; padding: 5px 3px; }
  .mc-shelf-panel .mc-group, .mc-shelf-panel .mc-chip { scroll-margin-top: 48px; }
  .mc-card { min-width: 0; }
}
.mc-shelf-views { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0 0 10px; }
.mc-shelf-badges { margin-top: 12px; padding-top: 12px; border-top: 1px solid color-mix(in srgb, var(--border-box-purple) 65%, transparent); }
.mc-shelf-view { flex: 0 0 auto; padding: 5px 10px; border: 1px solid var(--border-box-purple); border-radius: 8px; background: transparent; color: var(--text-sub); font: 700 10pt/1.3 var(--font-main); text-align: center; white-space: nowrap; cursor: pointer; }
.mc-shelf-view:hover { border-color: var(--neon-cyan); color: var(--text-pure); }
.mc-shelf-view[aria-selected="true"] { border-color: var(--neon-cyan); background: color-mix(in srgb, var(--neon-cyan) 18%, var(--bg-card-inner)); color: var(--text-pure); }
.mc-shelf-view:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.mc-shelf { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.mc-group { min-width: 0; padding: 10px 12px; border: 1px solid var(--border-box-purple); border-radius: 10px; background: var(--bg-card-inner); }
.mc-group-head { margin: 0 0 6px; color: var(--neon-cyan); font-size: 11pt; font-weight: 800; }
.mc-chip-row { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.mc-chip { display: inline-flex; align-items: center; gap: 4px; padding: 5px 11px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--bg-card-inner) 80%, transparent); color: var(--text-pure); font-size: 11pt; font-weight: 700; cursor: pointer; }
.mc-chip:hover { border-color: var(--neon-cyan); }
.mc-chip:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.mc-chip.is-selected { border-color: var(--neon-pink); background: color-mix(in srgb, var(--neon-pink) 20%, var(--bg-card-inner)); }
.mc-chip.is-material { border-color: var(--neon-cyan); color: var(--neon-cyan); }
.mc-chip.is-user { border-color: var(--neon-pink); color: var(--neon-pink); }
.mc-chip.is-ref { border-style: dashed; color: var(--text-sub); }
.mc-chip.is-dim { opacity: .45; }
.mc-card .panel-header { margin-bottom: 8px; }
.mc-keywords { margin-bottom: 8px; }
.mc-definition { margin: 0 0 8px; color: var(--text-pure); font-size: 11pt; line-height: 1.7; }
.mc-note { margin: 0 0 6px; padding: 6px 10px; border-left: 3px solid var(--neon-yellow); background: var(--bg-card-inner); color: var(--text-sub); font-size: 11pt; line-height: 1.6; }
.mc-note.is-engine { border-left-color: var(--neon-cyan); }
.mc-note.is-warn { border-left-color: var(--neon-hotpink); }
.mc-subs { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.mc-sub { padding: 7px 10px; border: 1px solid var(--border-box-purple); border-radius: 8px; background: var(--bg-card-inner); }
.mc-sub-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: 0; color: var(--text-pure); font-size: 11pt; }
.mc-sub-note { margin: 4px 0 0; color: var(--text-sub); font-size: 11pt; line-height: 1.6; }
.mc-members { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; }
.mc-member-group { min-width: 0; padding: 8px 10px; border: 1px solid var(--border-box-purple); border-radius: 10px; background: var(--bg-card-inner); }
.mc-member-list { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.mc-member { padding: 2px 8px; border-radius: 8px; background: color-mix(in srgb, var(--neon-cyan) 8%, transparent); color: var(--text-pure); font-size: 11pt; line-height: 1.6; }
.mc-links, .mc-flow { display: flex; flex-direction: column; gap: 6px; }
.mc-link-row { display: grid; grid-template-columns: 11em minmax(0, 1fr); gap: 8px; align-items: start; }
.mc-link-label { color: var(--text-sub); font-size: 11pt; font-weight: 700; padding-top: 5px; }
.mc-flow-center { align-self: flex-start; padding: 6px 14px; border: 2px solid var(--neon-pink); border-radius: var(--radius-pill); color: var(--text-pure); font-size: 11pt; font-weight: 800; }
.mc-role { color: var(--text-muted); font-size: 11pt; }
.mc-jump { display: inline-block; margin-top: 8px; color: var(--neon-lime); font-size: 11pt; font-weight: 700; }
.mc-toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--text-sub); font-size: 11pt; }
.mc-depths { display: flex; flex-direction: column; gap: 8px; }
.mc-depth-row { display: grid; grid-template-columns: 3.5em minmax(0, 1fr); gap: 8px; align-items: start; padding: 8px 0; border-top: 1px dashed color-mix(in srgb, var(--border-box-purple) 60%, transparent); }
.mc-depth-row:first-child { border-top: 0; }
.mc-depth-label { color: var(--neon-cyan); font-size: 11pt; font-weight: 800; padding-top: 5px; }
@media (max-width: 640px) { .mc-link-row { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

/* ① 설계·정책 › 설계 보드 — 왼쪽 폴더 선반, 오른쪽 공통 칸(넓게) + 서비스 칸 격자 */
.mb-layout { display: grid; grid-template-columns: minmax(240px, 300px) minmax(0, 1fr); gap: 12px; align-items: start; }
/* 선반은 화면 높이에 맞춰 두고 안에서 스크롤한다 — 길게 늘어지면 오른쪽 칸이 화면 밖으로 나가 끌어 넣을 수 없다 */
.mb-shelf { position: sticky; top: calc(112px / var(--admin-zoom, 1)); align-self: start; display: flex; flex-direction: column; gap: 8px; padding: 0 10px 10px; border: 1px solid var(--border-box-purple); border-radius: 12px; background: var(--bg-card-inner); max-height: calc((100vh - 132px) / var(--admin-zoom, 1)); overflow-y: auto; overscroll-behavior: contain; }
.mb-shelf-head { position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 -10px; padding: 10px 10px 6px; color: var(--text-sub); font-size: 11pt; font-weight: 800; background: var(--bg-card-inner); border-radius: 11px 11px 0 0; }
/* 폴더로 포커스가 옮겨도 붙어 있는 머리 뒤에 숨지 않게, 머리 높이만큼 위에서 멈춘다. */
.mb-shelf-group, .mb-node, .mb-node .mb-node-toggle, .mb-chip, .mb-sub-node { scroll-margin-top: var(--mb-shelf-head, 0px); }
.mb-shelf-head p { margin: 0; }
.mb-shelf-views { display: flex; flex-wrap: nowrap; gap: 4px; width: 100%; }
.mb-shelf-view { flex: 1 1 0; min-width: 0; padding: 5px 3px; border: 1px solid var(--border-box-purple); border-radius: 8px; background: transparent; color: var(--text-sub); font: 700 10pt/1.3 var(--font-main); text-align: center; white-space: nowrap; cursor: pointer; }
.mb-shelf-view:hover { border-color: var(--neon-cyan); color: var(--text-pure); }
.mb-shelf-view[aria-selected="true"] { border-color: var(--neon-cyan); background: color-mix(in srgb, var(--neon-cyan) 18%, var(--bg-card-inner)); color: var(--text-pure); }
.mb-shelf-view:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.mb-shelf-group { min-width: 0; }
/* 폴더 구조도 — 대카테고리 한 줄 아래에 중카테고리를 들여 쓴다. 드래그는 대카테고리 줄만 된다. */
.mb-node { min-width: 0; margin-top: 4px; }
.mb-node-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.mb-tree-line { color: var(--text-muted); font-size: 11pt; }
.mb-node-toggle { padding: 2px 6px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text-sub); font-size: 11pt; cursor: pointer; }
.mb-node-toggle:hover { border-color: var(--border-box-purple); color: var(--text-pure); }
.mb-node-subs { margin: 2px 0 6px 18px; padding-left: 8px; border-left: 1px dashed color-mix(in srgb, var(--border-box-purple) 70%, transparent); }
.mb-sub-node { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; margin: 2px 0; color: var(--text-sub); font-size: 11pt; line-height: 1.5; }
.mb-sub-name { color: var(--text-pure); font-weight: 700; }
.mb-chip.is-unadopted { border-style: dashed; color: var(--text-muted); }
.mb-lens { cursor: help; margin-left: 2px; }
.mb-chip { user-select: none; -webkit-user-select: none; display: inline-flex; align-items: center; gap: 2px; padding: 5px 10px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--bg-card-inner) 70%, transparent); color: var(--text-pure); font-size: 11pt; font-weight: 700; cursor: grab; }
.mb-chip:hover { border-color: var(--neon-cyan); }
.mb-chip:focus-visible, .mb-add:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.mb-chip.is-picked { border-color: var(--neon-lime); background: color-mix(in srgb, var(--neon-lime) 16%, var(--bg-card-inner)); }
.mb-chip-count { color: var(--text-muted); font-weight: 600; }
.mb-columns { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.mb-service-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.mb-column { min-width: 0; padding: 10px 12px; border: 1px solid var(--border-box-purple); border-radius: 12px; background: var(--bg-card-inner); transition: border-color .15s ease, background .15s ease; }
.mb-column.is-inherit { border-color: color-mix(in srgb, var(--neon-cyan) 50%, var(--border-box-purple)); }
/* 가중치 AI추천 — 왼쪽 관점 고르기, 오른쪽 추천 결과(자동 계산). 좁은 화면은 한 열. */
.nudge-layout { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.6fr); gap: 18px; align-items: start; }
.nudge-step { margin: 0 0 8px; font-size: 11pt; font-weight: 800; color: var(--text-pure); }
.nudge-rules { margin-top: 10px; font-size: 10pt; color: var(--text-muted); }
.nudge-rules > summary { cursor: pointer; font-weight: 700; color: var(--text-sub); }
.nudge-rules ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.55; }
.nudge-output-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.nudge-output-head .nudge-step { margin: 0; }
.nudge-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.nudge-stale { margin: 0 0 6px; font-size: 10pt; color: var(--neon-yellow); }
.nudge-empty { margin: 0; font-size: 10.5pt; color: var(--text-muted); }
.nudge-domain { border-top: 1px dashed var(--border-box-purple); padding: 6px 0; }
.nudge-domain > summary { cursor: pointer; font-weight: 700; font-size: 11pt; color: var(--text-pure); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nudge-domain > summary .nudge-apply-one { margin-left: auto; padding: 4px 12px; font-size: 10pt; }
@media (max-width: 992px) { .nudge-layout { grid-template-columns: minmax(0, 1fr); } }
.nudge-rows { display: grid; gap: 6px; margin-top: 6px; }
.nudge-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr) minmax(0, 1.6fr); gap: 8px; align-items: center; font-size: 10.5pt; color: var(--text-sub); }
.nudge-row.is-off { opacity: .6; }
@media (max-width: 760px) { .nudge-row { grid-template-columns: minmax(0, 1fr) auto; } .nudge-row > .tune-chips { grid-column: 1 / -1; } }
.mb-add.is-locked { color: var(--neon-amber, #ffcc66); border-color: color-mix(in srgb, var(--neon-amber, #ffcc66) 55%, transparent); cursor: not-allowed; }
.mb-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 16px); z-index: 1200; max-width: min(92vw, 640px);
  padding: 12px 18px; border-radius: 12px; font-size: 11pt; line-height: 1.5; color: var(--text-pure);
  background: color-mix(in srgb, var(--bg-card-inner, #1a0f38) 92%, transparent); border: 1px solid var(--border-box-purple);
  box-shadow: 0 10px 30px rgba(0,0,0,.45); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; overflow-wrap: anywhere; }
.mb-toast.is-show { opacity: 1; transform: translate(-50%, 0); }
.mb-toast.is-warn { border-color: var(--neon-amber, #ffcc66); background: color-mix(in srgb, var(--neon-amber, #ffcc66) 14%, var(--bg-card-inner, #1a0f38)); }
.mb-toast.is-info { border-color: var(--neon-cyan); }
/* 고르거나 끄는 동안 칸마다 놓을 수 있는지(녹색)·없는지(빨강)를 테두리 발광과 위쪽 문구로 알린다. 테두리 두께는 그림자 링으로 키워 배치가 흔들리지 않는다. */
.mb-column { --mb-ok: var(--neon-lime); --mb-no: #ff4d6d; }
html[data-theme="light"] .mb-column, body.theme-bubblegum .mb-column { --mb-no: #c0143c; }
.mb-column.is-placeable, .mb-column.is-unplaceable { position: relative; }
.mb-column.is-placeable::before, .mb-column.is-unplaceable::before { content: attr(data-place-reason); display: block; position: sticky; top: calc(108px / var(--admin-zoom, 1)); z-index: 3; margin: 0 0 6px; padding: 4px 8px; border-radius: 8px; background: var(--bg-card-inner); font-size: 10.5pt; font-weight: 800; letter-spacing: .01em; }
.mb-column.is-placeable { border-color: var(--mb-ok); background: color-mix(in srgb, var(--mb-ok) 6%, var(--bg-card-inner));
  box-shadow: 0 0 0 2px var(--mb-ok), 0 0 16px 3px color-mix(in srgb, var(--mb-ok) 60%, transparent), inset 0 0 14px color-mix(in srgb, var(--mb-ok) 18%, transparent); animation: mb-glow-ok 1.6s ease-in-out infinite; }
.mb-column.is-placeable::before { color: var(--mb-ok); }
.mb-column.is-unplaceable { border-color: var(--mb-no); background: color-mix(in srgb, var(--mb-no) 6%, var(--bg-card-inner)); cursor: not-allowed;
  box-shadow: 0 0 0 2px var(--mb-no), 0 0 16px 3px color-mix(in srgb, var(--mb-no) 60%, transparent), inset 0 0 14px color-mix(in srgb, var(--mb-no) 18%, transparent); animation: mb-glow-no 1.6s ease-in-out infinite; }
.mb-column.is-unplaceable::before { color: var(--mb-no); }
.mb-column.is-placeable.is-over { background: color-mix(in srgb, var(--mb-ok) 16%, var(--bg-card-inner)); }
.mb-column.is-unplaceable.is-over { background: color-mix(in srgb, var(--mb-no) 16%, var(--bg-card-inner)); }
@keyframes mb-glow-ok { 50% { box-shadow: 0 0 0 2px var(--mb-ok), 0 0 26px 6px color-mix(in srgb, var(--mb-ok) 75%, transparent), inset 0 0 20px color-mix(in srgb, var(--mb-ok) 26%, transparent); } }
@keyframes mb-glow-no { 50% { box-shadow: 0 0 0 2px var(--mb-no), 0 0 26px 6px color-mix(in srgb, var(--mb-no) 75%, transparent), inset 0 0 20px color-mix(in srgb, var(--mb-no) 26%, transparent); } }
@media (prefers-reduced-motion: reduce) { .mb-column.is-placeable, .mb-column.is-unplaceable { animation: none; } }
.mb-column-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--text-pure); font-size: 11pt; }
.mb-column-note { margin: 4px 0 0; color: var(--text-muted); font-size: 11pt; line-height: 1.5; }
.mb-zone { display: flex; flex-wrap: wrap; gap: 6px; min-height: 44px; margin-top: 8px; padding: 6px; border-radius: 8px; background: color-mix(in srgb, var(--bg-card-inner) 60%, transparent); }
.mb-placed { display: inline-flex; flex-wrap: nowrap; white-space: nowrap; align-items: center; gap: 4px; padding: 3px 4px 3px 10px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); color: var(--text-pure); font-size: 11pt; font-weight: 700; cursor: grab; }
.mb-placed.is-design { border-style: dashed; }
.mb-placed .lo-badge { padding: 1px 8px; }
.mb-icon { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; border: 0; border-radius: 50%; background: transparent; color: var(--text-sub); font-size: 11pt; text-decoration: none; cursor: pointer; }
.mb-icon:hover { background: color-mix(in srgb, var(--neon-pink) 18%, transparent); color: var(--text-pure); }
.mb-add { margin-top: 8px; padding: 4px 10px; border: 1px dashed var(--border-box-purple); border-radius: 8px; background: transparent; color: var(--neon-lime); font-size: 11pt; cursor: pointer; }
.mb-add:disabled { color: var(--text-muted); cursor: default; }
.mb-picks { display: flex; flex-wrap: wrap; gap: 4px; flex-basis: 100%; margin: -2px 0 2px 14px; }
.mb-pick { display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px 2px 8px; border: 1px dashed color-mix(in srgb, var(--neon-cyan) 45%, var(--border-box-purple)); border-radius: var(--radius-pill); color: var(--text-sub); font-size: 11pt; }
.mb-pick.is-inherited { border-style: dotted; color: var(--text-muted); padding-right: 8px; }
.mb-pick.is-computed { border-radius: 12px; border-style: solid; border-color: color-mix(in srgb, var(--neon-cyan) 55%, var(--border-box-purple)); color: var(--text-pure); padding-right: 4px; cursor: help; }
.mb-header-tools { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.mb-header-tools .admin-zoom { margin-left: 0; }
.mb-ai-btn { white-space: nowrap; }
.admin-dialog:has(.mb-rec-list) { max-width: min(760px, 100%); }
.mb-rec-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.mb-rec { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; padding: 8px 10px; border: 1px solid var(--border-box-purple); border-radius: 10px; }
.mb-rec.is-disabled { opacity: .6; }
.mb-rec-title { font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; }
.mb-rec-why, .mb-rec-reason { grid-column: 2; margin: 0; font-size: 10.5pt; color: var(--text-muted); line-height: 1.5; overflow-wrap: anywhere; }
.mb-rec-reason { color: var(--neon-amber, #ffcc66); }
.mb-rec-section { margin: 4px 0 0; font-weight: 800; }
.mb-advice details { border: 1px solid var(--border-box-purple); border-radius: 10px; padding: 6px 10px; }
.mb-advice summary { cursor: pointer; font-weight: 700; line-height: 1.5; }
.mb-advice ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.55; font-size: 10.5pt; }
@media (max-width: 560px) { .mb-header-tools { margin-left: 0; width: 100%; justify-content: space-between; } }
.mb-pick.is-design.is-open { border-width: 2px; color: var(--neon-amber, #ffcc66); }
.mb-pick.is-design { border-radius: 12px; border-color: color-mix(in srgb, var(--neon-amber, #ffcc66) 55%, var(--border-box-purple)); }
.mb-pick.is-removed { border-radius: 12px; border-style: dashed; border-color: color-mix(in srgb, var(--neon-pink) 55%, var(--border-box-purple)); color: var(--text-muted); text-decoration: line-through; padding-right: 4px; }
.mb-pick.is-removed .mb-icon { text-decoration: none; }
.mb-icon:disabled { opacity: .35; cursor: not-allowed; }
.mb-pick-count { min-width: 18px; margin-left: 3px; padding: 0 5px; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--neon-cyan) 18%, transparent); color: var(--text-sub); font-size: 9.5pt; text-align: center; }
.mb-placed.is-inherited { border-style: dotted; color: var(--text-muted); cursor: default; padding-right: 10px; }
.mb-pick .mb-icon { min-width: 22px; min-height: 22px; }
.mb-sub-node[draggable="true"] { cursor: grab; user-select: none; -webkit-user-select: none; }
.mb-sub-node[draggable="true"]:hover .mb-sub-name { color: var(--neon-cyan); }
.mb-shelf-guide { margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--border-subtle, rgba(255,255,255,0.18)); }
.mb-shelf-guide-title { margin: 0 0 6px; font-weight: 700; }
.mb-shelf-guide-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.mb-shelf-legend { margin: 4px 0 0; font-size: 11pt; color: var(--text-sub); }
.mb-sub-node.is-fixed { opacity: 0.72; cursor: default; }
.mb-sub-node.is-fixed .mb-sub-name { font-style: italic; }
.mb-sub-toggle { margin-left: 4px; padding: 0 6px; font-size: 10pt; }
.mb-sub-node.is-child { padding-left: 1.4em; font-size: 10.5pt; }
.mb-sub-node.is-picked { border-radius: 8px; background: color-mix(in srgb, var(--neon-lime) 16%, transparent); }
.mb-sub-node:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 2px; }
.mb-warn { margin: 6px 0 0; color: var(--neon-yellow); font-size: 11pt; line-height: 1.5; }
.mb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
@media (max-width: 900px) { .mb-layout { grid-template-columns: minmax(0, 1fr); } .mb-shelf { position: static; max-height: none; padding-top: 10px; } .mb-shelf-head { position: static; } .mb-shelf-group, .mb-node, .mb-node .mb-node-toggle, .mb-chip, .mb-sub-node { scroll-margin-top: 0; } }

/* ① 설계·정책 › 설계 보드 하단 — 🔀 프로세스 흐름도(보기 전용). 세 레인을 나란히 두고 갈림길은 따로 모은다 */
.mf-section { margin-top: 14px; }
/* 확대·축소 — 좁은 화면에서 가로 보드를 한눈에 보려고 배율을 줄인다(줄이면 글자도 함께 작아진다) */
.admin-zoom { display: inline-flex; align-items: center; gap: 2px; margin-left: auto; padding: 2px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); background: var(--bg-card-inner); }
.admin-zoom-btn { min-width: 30px; height: 26px; padding: 0 6px; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-sub); font-size: 11pt; font-weight: 700; cursor: pointer; }
.admin-zoom-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--neon-cyan) 16%, transparent); color: var(--text-pure); }
.admin-zoom-btn:disabled { color: color-mix(in srgb, var(--text-muted) 60%, transparent); cursor: default; }
.admin-zoom-btn.is-level { min-width: 52px; color: var(--text-pure); }
.admin-zoom-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--neon-cyan) 45%, transparent); outline-offset: 1px; }
.mf-tabs { display: flex; flex-wrap: nowrap; gap: 6px; margin: 10px 0; padding-bottom: 4px; overflow-x: auto; }
.mf-tab { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; padding: 5px 12px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--bg-card-inner) 70%, transparent); color: var(--text-sub); font-size: 11pt; font-weight: 700; cursor: pointer; }
.mf-tab:hover { border-color: var(--neon-cyan); color: var(--text-pure); }
.mf-tab.is-active { border-color: var(--neon-cyan); background: color-mix(in srgb, var(--neon-cyan) 14%, var(--bg-card-inner)); color: var(--text-pure); }
.mf-headline { margin: 0 0 10px; color: var(--text-pure); font-size: 11pt; line-height: 1.6; }
/* 가로 칸반 — 왼쪽에서 오른쪽으로 흐른다. 열 안에서는 카드가 쌓이고, 열과 열 사이에 → 가 선다 */
.mf-board { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 8px; padding-bottom: 8px; overflow-x: auto; }
.mf-col { flex: 0 0 auto; width: 250px; display: flex; flex-direction: column; min-width: 0; padding: 8px 10px; border: 1px solid var(--border-box-purple); border-radius: 12px; background: var(--bg-card-inner); }
/* 재료 단계 열은 카드가 한둘뿐이라 좁게 둔다 — 흐름이 한 화면에 더 들어온다 */
.mf-col.is-stage { width: 170px; }
.mf-col-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; color: var(--text-pure); font-size: 11pt; }
.mf-col-note { margin: 2px 0 0; color: var(--text-muted); font-size: 11pt; line-height: 1.45; }
.mf-col-body { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.mf-flow-arrow { flex: 0 0 auto; margin-top: 18px; color: var(--neon-cyan); font-size: 15pt; font-weight: 800; }
.mf-card { padding: 6px 8px; border: 1px solid color-mix(in srgb, var(--border-box-purple) 80%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--bg-card-inner) 60%, transparent); }
.mf-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; color: var(--text-pure); font-size: 11pt; }
.mf-card-line { margin: 2px 0 0; color: var(--text-muted); font-size: 11pt; line-height: 1.45; }
.mf-card.is-node { border-color: color-mix(in srgb, var(--neon-cyan) 40%, var(--border-box-purple)); }
.mf-card.is-design { border-style: dashed; }
.mf-card.is-item.is-narrative { border-style: dashed; }
.mf-card.is-outcome { border-color: color-mix(in srgb, var(--neon-cyan) 45%, var(--border-box-purple)); }
.mf-card.is-outcome.is-last { border-color: color-mix(in srgb, var(--neon-lime) 45%, var(--border-box-purple)); }
.mf-card.is-node.is-waiting { border-color: color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); }
.mf-card.is-node.is-hub { border-width: 2px; }
.mf-card.is-branch { border-style: dashed; border-color: color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); }
.mf-card.is-step.is-branching { border-style: dashed; border-color: color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); }
.mf-card.is-linked, .mf-use.is-linked { border-color: var(--neon-lime); background: color-mix(in srgb, var(--neon-lime) 16%, transparent); }
.mf-step-no { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; border-radius: 50%; background: color-mix(in srgb, var(--neon-cyan) 22%, transparent); color: var(--text-pure); font-size: 11pt; font-weight: 700; }
.mf-uses { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.mf-use { display: inline-flex; align-items: center; padding: 2px 8px; border: 1px solid color-mix(in srgb, var(--border-box-purple) 80%, transparent); border-radius: var(--radius-pill); color: var(--text-sub); font-size: 11pt; }
.mf-use.is-narrative { border-style: dashed; }
.mf-use.is-unplaced { color: var(--neon-yellow); border-color: color-mix(in srgb, var(--neon-yellow) 50%, transparent); }
.mf-case { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; margin: 3px 0 0; color: var(--text-sub); font-size: 11pt; line-height: 1.45; }
.mf-case-mark { color: var(--neon-yellow); }
.mf-compute { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--border-box-purple); border-radius: 12px; background: color-mix(in srgb, var(--bg-card-inner) 70%, transparent); }
.mf-section-head { margin: 0 0 4px; color: var(--text-pure); font-size: 11pt; font-weight: 800; }
/* 계산 순서 — 단계마다 한 열. 좁게 세워 열일곱 단계가 한 줄로 흐른다 */
.mf-col.is-step-col { width: 185px; position: relative; }
.mf-col.is-step-col.is-branching { border-style: dashed; border-color: color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); }
.mf-caution { margin: 0 0 8px; padding: 6px 10px; border: 1px dashed color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); border-radius: 8px; color: var(--neon-yellow); font-size: 11pt; line-height: 1.5; }
.mf-kind-head { margin: -2px 0 6px; color: var(--neon-cyan); font-size: 11pt; font-weight: 800; }
.mf-fold { margin-top: 6px; }
.mf-fold summary { color: var(--neon-yellow); font-size: 11pt; cursor: pointer; }
.mf-card.is-clickable { cursor: pointer; }
.mf-card.is-clickable:hover, .mf-card.is-clickable:focus-visible { border-color: var(--neon-cyan); background: color-mix(in srgb, var(--neon-cyan) 10%, transparent); }
.mf-card.is-sub { flex: 0 0 280px; }
.mf-card.is-sub.is-waiting { border-color: color-mix(in srgb, var(--neon-yellow) 45%, var(--border-box-purple)); border-style: dashed; }
.mf-board.is-wrap { flex-wrap: wrap; overflow-x: visible; }
.mf-close { margin-left: auto; padding: 2px 8px; border: 1px solid var(--border-box-purple); border-radius: var(--radius-pill); background: transparent; color: var(--text-sub); font-size: 11pt; cursor: pointer; }
.mf-section-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
@media (max-width: 720px) { .mf-board { flex-wrap: wrap; overflow-x: visible; } .mf-col { flex: 1 1 100%; } .mf-flow-arrow { align-self: flex-start; transform: rotate(90deg); } }
/* 가중치 반영 칸 — 잠금 안내와 반영 상태 한 줄 */
.logic-hold-note { margin: 0 0 10px; padding: 8px 12px; border-left: 3px solid color-mix(in srgb, var(--neon-yellow) 60%, transparent); border-radius: 4px; background: color-mix(in srgb, var(--bg-card-inner) 85%, var(--neon-yellow) 5%); }
.logic-hold-note p { margin: 2px 0; }
.logic-state-note { margin: 0 0 6px; }
.logic-state-note.is-dirty { color: var(--neon-amber, #ffcc66); }

/* 서비스 가중치 튜닝 카드 — 왼쪽 ⚖️ 비중, 오른쪽 🎯 점수(1~10단계). 좁은 폭에서는 위아래로 쌓는다. */
.tune-list { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.tune-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
  gap: 10px 20px;
  padding: 12px 14px;
  background: var(--bg-card-inner);
  border: 1px solid var(--border-box-purple);
  border-left: 5px solid var(--item-hue, var(--neon-purple));
  border-radius: 10px;
}
@media (max-width: 760px) { .tune-item { grid-template-columns: minmax(0, 1fr); } }
.tune-col { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tune-col + .tune-col { border-left: 1px dashed var(--border-box-purple); padding-left: 20px; }
@media (max-width: 760px) { .tune-col + .tune-col { border-left: 0; padding-left: 0; border-top: 1px dashed var(--border-box-purple); padding-top: 10px; } }
.tune-col > .tune-chip { align-self: flex-start; }
.tune-col-head { font-size: 11pt; font-weight: 800; color: var(--text-muted); }
.tune-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 6px; }
.tune-chip {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 12px;
  font-size: 11pt;
  line-height: 1.6;
  color: var(--text-sub);
  background: color-mix(in srgb, var(--neon-purple) 16%, transparent);
  border: 1px solid color-mix(in srgb, var(--neon-purple) 35%, transparent);
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
.tune-chip[title] { cursor: help; }
.tune-chip.is-index { color: var(--text-pure); font-weight: 700; }
.tune-chip.is-scored { color: var(--neon-yellow); border-color: color-mix(in srgb, var(--neon-yellow) 45%, transparent); }
.tune-rule { font-size: 11pt; color: var(--text-muted); }
.tune-rule > summary { cursor: pointer; width: fit-content; }
.tune-rule > p { margin: 6px 0 0; line-height: 1.6; }
.tune-switch { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 11pt; color: var(--text-sub); cursor: pointer; }
.tune-chip.is-off { color: var(--text-muted); border-style: dashed; background: transparent; }
.tune-switch > span:first-of-type { font-weight: 800; color: var(--text-pure); }
.tune-switch input { width: 18px; height: 18px; accent-color: var(--neon-yellow); }

/* 서비스 항목 비중을 한 줄로 쌓은 100% 막대 — 색은 카드 왼쪽 선과 같다. */
.tune-stack { display: flex; height: 26px; margin: 6px 0 12px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border-box-purple); }
.tune-seg {
  display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden;
  font-size: 10pt; font-weight: 800; color: #1a0b2e; white-space: nowrap;
  background: var(--item-hue); border-right: 1px solid rgba(0, 0, 0, 0.25);
}
.tune-seg:last-child { border-right: 0; }
.tune-seg.is-off { background: repeating-linear-gradient(45deg, var(--item-hue) 0 4px, transparent 4px 8px); color: var(--text-sub); opacity: 0.6; }

/* 경우마다 1~10단계 막대. 칸을 누르면 그 단계까지 채워진다. */
.tune-levels {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, 220px) 2em;
  align-items: center;
  gap: 6px 10px;
  font-size: 11pt;
  color: var(--text-sub);
}
.tune-scale-head { font-size: 10pt; color: var(--text-muted); }
.tune-level-name { overflow-wrap: anywhere; }
.tune-level-name small { display: block; font-size: 9.5pt; line-height: 1.35; color: var(--text-muted); }
.tune-level-out { font-weight: 800; color: var(--neon-yellow); text-align: right; font-family: var(--font-display); line-height: 1.1; }
.tune-level-out small { display: block; font-size: 9pt; font-weight: 600; color: var(--text-sub); font-family: inherit; }
details.tune-domain > summary { cursor: pointer; list-style: none; }
details.tune-domain > summary::-webkit-details-marker { display: none; }
details.tune-domain > summary .panel-title::before { content: '▸'; margin-right: 8px; color: var(--text-muted); transition: transform .15s; display: inline-block; }
details.tune-domain[open] > summary .panel-title::before { transform: rotate(90deg); }
details.tune-domain:not([open]) > summary { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.tune-cell-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.tune-cell-chips .tune-chip { font-size: 9.5pt; padding: 1px 7px; }
.tune-folder-head { border-bottom: 1px dashed var(--border-box-purple); padding-bottom: 3px; }
.tune-folder-subs { margin: 0 0 6px; }
.tune-folder-subs .tune-chip { font-size: 10pt; padding: 1px 8px; }
.tune-case-note { margin: 0; font-size: 10pt; line-height: 1.45; color: var(--text-sub); }
.tune-case-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 2px 0 0; font-size: 10pt; color: var(--text-muted); }
.tune-chip.is-warn { color: var(--neon-amber, #ffcc66); border-color: color-mix(in srgb, var(--neon-amber, #ffcc66) 55%, transparent); }
.lv-bar { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; height: 18px; cursor: pointer; border-radius: 4px; }
.lv-bar:focus-visible { outline: 2px solid var(--neon-yellow); outline-offset: 2px; }
.lv-bar > button { padding: 0; border: 0; border-radius: 2px; background: color-mix(in srgb, var(--neon-purple) 22%, transparent); cursor: pointer; }
.lv-bar > button.is-on { background: var(--neon-yellow); }
.lv-bar > button:hover { outline: 1px solid var(--neon-yellow); }
.tune-levels.is-off .lv-bar > button.is-on { background: var(--text-muted); }
.tune-levels.is-off .tune-level-out { color: var(--text-muted); }
@media (max-width: 760px) {
  .tune-levels { grid-template-columns: minmax(0, 1fr) 2em; }
  .tune-levels > .tune-scale-head, .tune-levels > span:first-child { display: none; }
  .tune-level-name { grid-column: 1 / -1; margin-top: 4px; }
}

/* ④ 리포트 페이지 조립 — 선반(프레임·콘텐츠)은 rl-shelf, 캔버스는 장 탭 + 구역 카드 */
.rc-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.rc-state { font-size: 10.5pt; font-weight: 700; color: var(--text-pure); padding: 4px 10px; border-radius: var(--radius-pill); border: 1px solid var(--border-box-purple); }
.rc-history { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; font-size: 11pt; color: var(--text-sub); }
.rc-shelf-tabs { display: flex; gap: 6px; }
.rc-shelf-tab { flex: 1; min-height: 32px; border-radius: 10px; border: 1px solid var(--border-box-purple); background: transparent; color: var(--text-sub); font-weight: 700; cursor: pointer; }
.rc-shelf-tab.is-active { border-color: var(--neon-pink); color: var(--text-pure); background: color-mix(in srgb, var(--neon-pink) 14%, transparent); }
.rc-frame { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 10px; margin-bottom: 8px; border: 1px solid var(--border-box-purple); border-radius: 10px; background: color-mix(in srgb, var(--bg-card-inner) 70%, transparent); cursor: grab; }
.rc-frame strong { font-size: 11pt; color: var(--text-pure); }
.rc-frame span { grid-column: 1; font-size: 10pt; color: var(--text-muted); }
.rc-add { grid-column: 2; grid-row: 1 / span 2; align-self: center; min-height: 28px; padding: 2px 10px; border-radius: var(--radius-pill); border: 1px solid var(--neon-cyan); background: transparent; color: var(--text-pure); font-weight: 700; cursor: pointer; white-space: nowrap; }
.rc-item { display: flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid var(--border-box-purple); border-left: 3px solid var(--neon-purple, #a970ff); border-radius: 8px; font-size: 11pt; color: var(--text-pure); cursor: grab; }
.rc-item > span { flex: 1; min-width: 0; }
.rc-item.is-picked { border-color: var(--neon-lime); background: color-mix(in srgb, var(--neon-lime) 16%, var(--bg-card-inner)); }
.rc-canvas { min-width: 0; }
.rc-chapters { margin-bottom: 12px; }
/* 장은 최대 6개(＋ 장 칸 포함 6칸) — 칸 수를 고정해 장을 골라도 자리가 움직이지 않는다. */
.rc-chapter-tabs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
@media (max-width: 640px) { .rc-chapter-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rc-chapter { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; padding: 7px 10px; border-radius: 12px; border: 1px solid var(--border-box-purple); background: transparent; color: var(--text-sub); cursor: pointer; font: inherit; font-size: 11pt; text-align: left; }
.rc-chapter:hover { border-color: var(--neon-cyan); }
.rc-chapter.is-active { border-color: var(--neon-pink); background: color-mix(in srgb, var(--neon-pink) 16%, transparent); color: var(--text-pure); cursor: default; }
.rc-chapter-add { align-items: center; justify-content: center; border-style: dashed; }
.rc-chapter-num { font-weight: 800; white-space: nowrap; }
.rc-chapter-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rc-chapter-edit { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding: 8px 10px; border-radius: 12px; border: 1px dashed color-mix(in srgb, var(--neon-pink) 45%, transparent); }
.rc-chapter-edit .rc-chapter-title { flex: 1; min-width: 0; }
.rc-mini:disabled { opacity: 0.35; cursor: default; }
.rc-mini { min-width: 30px; min-height: 30px; border-radius: 8px; border: 1px solid var(--border-box-purple); background: transparent; color: var(--text-sub); cursor: pointer; }
.rc-mini.is-danger:hover { border-color: var(--neon-hotpink); color: var(--neon-hotpink); }
.rc-slots { display: flex; flex-direction: column; gap: 6px; }
.rc-slot { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 8px; background: color-mix(in srgb, var(--neon-cyan) 7%, transparent); font-size: 11pt; color: var(--text-pure); }
.rc-slot > span { flex: 1; min-width: 0; }
.rc-slot.is-text textarea { flex: 1; resize: vertical; }
.rc-tier { font-size: 10pt; }
.rc-x { border: 0; background: transparent; color: var(--text-sub); font-size: 13pt; cursor: pointer; }
.rc-x:hover { color: var(--neon-hotpink); }
.rc-drop { margin-top: 6px; padding: 8px; border: 1px dashed var(--border-box-purple); border-radius: 8px; text-align: center; font-size: 10.5pt; color: var(--text-muted); }
.rc-drop.is-ready { border-color: var(--neon-lime); color: var(--text-pure); cursor: copy; }
.rc-auto { margin: 4px 0 0; font-size: 10.5pt; color: var(--text-muted); }
.admin-dialog:has(.rc-preview-frame) { max-width: min(1180px, 100%); width: 100%; }
.rc-preview-bar { display: flex; gap: 8px; margin-bottom: 8px; }
.rc-preview-frame { width: 100%; height: 68vh; border: 1px solid var(--border-box-purple); border-radius: 12px; background: #0c0528; }

/* ✍️ 문장 탭 — 항목 요약(진행 막대·분류·범위·점검 칩) */
.frag-group > .s1-map-block-summary { flex-wrap: wrap; row-gap: 6px; }
.frag-group-meta { flex: 1 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 5px 6px; padding-left: calc(1.1em + 10px); }
.frag-meter { flex: 0 0 96px; display: flex; gap: 2px; height: 8px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--border-box-purple) 55%, transparent); }
.frag-meter i { display: block; min-width: 4px; }
.frag-meter .is-approved { background: var(--neon-lime, #9dff6e); }
.frag-meter .is-draft { background: var(--neon-yellow, #ffd166); }
.frag-meter .is-other { background: var(--neon-pink); }
.frag-chip { display: inline-flex; align-items: center; padding: 1px 9px; border: 1px solid var(--border-box-purple); border-radius: 999px; background: var(--bg-card-inner); color: var(--text-sub); font-size: 9.5pt; font-weight: 600; line-height: 1.6; white-space: nowrap; }
.frag-chip.is-ok { border-color: color-mix(in srgb, var(--neon-lime, #9dff6e) 55%, var(--border-box-purple)); color: var(--neon-lime, #9dff6e); }
.frag-chip.is-warn { border-color: color-mix(in srgb, var(--neon-yellow, #ffd166) 60%, var(--border-box-purple)); color: var(--neon-yellow, #ffd166); }
.frag-chip.is-muted { color: var(--text-muted); font-weight: 500; }
.frag-badge-row .frag-chip { font-size: 9pt; }
@media (max-width: 760px) { .frag-group-meta { padding-left: 0; } }
/* 하위 개념 묶음과 휴업 — 개념 폴더(.mc-)와 설계 보드 선반(.mb-) */
.mc-sub-group { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 8px 0 0; color: var(--text-pure); font-size: 11pt; }
.mc-sub-group-note { color: var(--text-muted); }
.mc-sub.is-dormant { border-style: dashed; opacity: 0.72; }
.mb-sub-group { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 6px 0 2px; color: var(--text-sub); font-size: 11pt; font-weight: 700; }
.mb-sub-node.is-dormant { opacity: 0.6; cursor: not-allowed; user-select: none; -webkit-user-select: none; }
.mb-sub-node.is-dormant .mb-sub-name { text-decoration: line-through; text-decoration-thickness: 1px; }
.mc-cycle { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.mc-cycle-rule { margin: 0; color: var(--text-sub); font-size: 11pt; line-height: 1.5; }
.mc-guk-wrap { max-width: 100%; overflow-x: auto; }
.mc-guk-table { border-collapse: collapse; font-size: 11pt; white-space: nowrap; }
.mc-guk-table th, .mc-guk-table td { padding: 3px 8px; border: 1px solid var(--border-box-purple); text-align: center; }
.mc-guk-table thead th { background: var(--bg-card-inner); color: var(--text-pure); }
.mc-guk-table tbody th { text-align: left; color: var(--text-pure); }
.mc-guk-table tr.is-live td:last-child { color: var(--neon-lime); }
.mc-guk-table tr.is-leader th, .mc-guk-table tr.is-leader td { font-weight: 800; color: var(--text-pure); background: color-mix(in srgb, var(--neon-cyan) 10%, transparent); }
.mc-guk-table .mc-guk-group { text-align: center; color: var(--text-sub); }

/* 접는 패널(AI추천·밸런스) — 머리 한 줄에 상태 뱃지만 두고, 펼치면 본문. */
details.fold-panel > summary { cursor: pointer; list-style: none; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
details.fold-panel > summary::-webkit-details-marker { display: none; }
details.fold-panel > summary .panel-title::before { content: '▸'; margin-right: 8px; color: var(--text-muted); transition: transform .15s; display: inline-block; }
details.fold-panel[open] > summary .panel-title::before { transform: rotate(90deg); }
details.fold-panel:not([open]) > summary { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
details.fold-panel[open] > summary { margin-bottom: 12px; }
.fold-status { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; }
.fold-status .lo-badge, .fold-status .tag-status { font-size: 10.5pt; padding: 2px 10px; }
.weight-layer-legend { margin: 0 0 10px; }
@media (max-width: 760px) {
  details.fold-panel > summary .fold-status { flex-wrap: nowrap; flex: 1 1 100%; }
  #nudge-summary > * { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9.5pt; }
  #nudge-summary #nudge-sum-lens { display: none; }
  details.fold-panel > summary .fold-hint { display: none; }
}
.fold-hint { margin-left: auto; font-size: 10pt; color: var(--text-muted); }
details.fold-panel[open] .fold-hint { display: none; }
.tune-group > .panel-header { flex-wrap: wrap; gap: 6px 12px; }
.tune-group .fold-hint { margin-left: 0; }

/* 가중치 밸런스 — 도메인 카드별로 "이모지 · 이름 · 층 … %" 한 줄. */
.weight-balance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.weight-balance-grid .weight-service-box { gap: 4px; line-height: 1.5; }
.weight-row-head { display: flex; align-items: baseline; gap: 6px; font-size: 11pt; color: var(--text-sub); margin-bottom: 2px; min-width: 0; }
.weight-row-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.weight-row-layer { flex: 0 0 auto; font-size: 10pt; }
.weight-row-head strong { flex: 0 0 auto; margin-left: auto; }

/* 도메인 5개를 한 박스 안에 묶는다 — 안쪽은 구분선만 있는 접힘 줄. */
.tune-domain-list { display: flex; flex-direction: column; }
.tune-domain-list > details.tune-domain { border-top: 1px dashed var(--border-box-purple); padding: 10px 0; }
.tune-domain-list > details.tune-domain:first-child { border-top: 0; padding-top: 0; }
.tune-domain-list > details.tune-domain:last-child { padding-bottom: 0; }
.tune-domain-list > details.tune-domain > summary.panel-header { margin: 0; padding: 0; border: 0; background: none; }
.tune-domain-list > details.tune-domain[open] > summary.panel-header { margin-bottom: 12px; }

/* 도메인별 조정 카드의 순서 표시 — 구성 막대의 번호와 같은 색·번호로 이어진다. */
.tune-order { color: var(--item-hue, var(--neon-cyan)); font-weight: 800; }

#subtab-logic-policy, #subtab-logic-policy * { font-size: 11pt !important; }
