/* 쇼츠팩토리 자체 디자인 토큰 — 20261026-alalshow-sf5-viewfinder-tone: 값은 tokens.css(뷰트랩 분석기 톤)와 같게 */
:root {
  --bg: #f8f8f8;
  --surface: #ffffff;
  --ink: #404040;
  --muted: #6b6b6b;
  --line: #ededed;
  --accent: #2375e8;
  --accent-ink: #ffffff;
  --good: #009711;
  --warn: #e97d13;
  --bad: #d61f1f;
  --radius: 8px;
  --gap: 16px;
  font-family: var(--font-body);
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); }
a { color: inherit; }


.muted { color: var(--muted); }


.empty-state { text-align: center; padding: 80px 16px; }
.empty-code { font-size: calc(var(--text-2xl) * 2); font-weight: 700; line-height: 1.2; color: var(--brand); margin: 0; }

.job-list { display: grid; gap: 12px; margin-top: 20px; }
.job-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; }
.job-head { display: flex; justify-content: space-between; margin-bottom: 8px; font-weight: 600; }
.job-status { color: var(--muted); }
.job-card[data-state="done"] .job-status, .job-card[data-state="succeeded"] .job-status { color: var(--good); }
.job-card[data-state="error"] .job-status, .job-card[data-state="failed"] .job-status { color: var(--bad); }
.bar { height: 8px; background: var(--line); border-radius: 999px; overflow: hidden; }
.bar-fill { height: 100%; width: 0; background: var(--accent); transition: width 0.4s ease; }
.job-step { margin-top: 6px; font-size: 13px; color: var(--muted); min-height: 18px; }

.inline { display: inline; margin: 0; }

/* 카드·폼 */
.stack { display: flex; flex-direction: column; gap: 12px; }
/* (묶음 D) 칸 이름표 굵기 500 — 분석기 이름표 (Noto Sans KR에 600이 없어 700처럼 굵게 보였다) */
.field { display: flex; flex-direction: column; gap: 6px; font-weight: 500; font-size: var(--text-md); }
.field small { color: var(--muted); font-weight: 400; }
.field-error, .form-error { color: var(--bad); font-size: 13px; font-weight: 500; margin: 0; }
.form-ok { color: var(--good); font-size: 13px; margin: 0; }
.check { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.inline-form { display: flex; gap: 8px; }
.plain-list { margin: 0; padding-left: 18px; }
.btn-kakao { background: #fee500; border-color: #fee500; color: #191919; }
.danger-zone summary { list-style: none; display: inline-block; }
.danger-zone details[open] summary { margin-bottom: 12px; }

/* 로그인 화면 */
.page-auth { display: flex; justify-content: center; }
.auth-card { width: 100%; max-width: 400px; background: var(--paper); border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-1); padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-3); }
.auth-card h1 { margin: 0; font-size: var(--text-2xl); }
.divider { display: flex; align-items: center; gap: 10px; color: var(--text-muted); font-size: var(--text-sm); }
.divider::before, .divider::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
.fine { color: var(--muted); font-size: 12px; text-align: center; margin: 0; }

/* sf5-byok-keys — 내 API 키 (PF-KEY-01) */
.key-cards { display: grid; gap: 0; margin-top: 0; max-width: 640px; }
.key-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.key-badge-good { --t-bg: var(--good-bg); --t-ink: var(--good-ink); --t-line: var(--good-line); }
.key-badge-warn { --t-bg: var(--warn-bg); --t-ink: var(--warn-ink); --t-line: var(--warn-line); }
.key-badge-muted { --t-bg: var(--muted-bg); --t-ink: var(--muted-ink); --t-line: var(--muted-line); }
.key-link { color: var(--brand-ink); font-weight: 500; text-decoration: none; white-space: nowrap; }
.key-link:hover { text-decoration: underline; }
.key-mask-line { margin: 0; font-size: var(--text-md); color: var(--text-muted); }
.key-mask { font-family: var(--font-mono); color: var(--text); margin-left: 6px; }
.key-actions { display: flex; gap: 8px; }
.key-delete summary { list-style: none; display: inline-block; }
.key-delete summary::-webkit-details-marker { display: none; }
.key-confirm { margin-top: 12px; padding: 12px 18px; border: 1px solid var(--danger-line); background: var(--danger-bg); border-radius: var(--radius-md); display: flex; flex-direction: column; gap: 10px; }
.key-confirm p { margin: 0; font-size: var(--text-md); }
.key-confirm form { margin: 0; }
.key-note { margin-top: 8px; font-size: 13px; }
/* 20261020-alalshow-sf5-link-page — 내 링크 페이지 (편집 GR-LNK-01 · 공개 GR-LNK-02)
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 테마 4종 색(만든 사람이 고른 색)은 그대로, 글꼴 Noto Sans KR · 둥글기(링크 버튼 6 · 안내 8) ·
   글자(이름 20/700 · 소개 14)만 분석기 값 (없는 링크 페이지 = 묶음 D lp-plain). 편집 화면은 분석기 칸·버튼·입력칸 */
/* 색 테마 4종 (자체 색): 모래 · 솔잎 · 산호 · 먹물 */
.theme-sand  { --lp-bg: #f3ebdd; --lp-surface: #fffaf1; --lp-ink: #3b2f20; --lp-muted: #7d6c55; --lp-accent: #a8743d; --lp-accent-ink: #ffffff; --lp-note-bg: #e8dcc6; --lp-note-ink: #5a4528; }
.theme-pine  { --lp-bg: #e3eee6; --lp-surface: #f6fbf7; --lp-ink: #16372a; --lp-muted: #4f6e60; --lp-accent: #2c6a4e; --lp-accent-ink: #ffffff; --lp-note-bg: #cfe1d5; --lp-note-ink: #1f4a37; }
.theme-coral { --lp-bg: #fde9e2; --lp-surface: #fff8f5; --lp-ink: #4a1d14; --lp-muted: #8f584a; --lp-accent: #e0583f; --lp-accent-ink: #ffffff; --lp-note-bg: #f8d3c6; --lp-note-ink: #7a2a1b; }
.theme-ink   { --lp-bg: #16171b; --lp-surface: #22242a; --lp-ink: #f1f1f3; --lp-muted: #a3a6b0; --lp-accent: #eceef2; --lp-accent-ink: #16171b; --lp-note-bg: #2b2d34; --lp-note-ink: #d6d8de; }

/* 공개 화면: 휴대폰 우선 한 열 (360~430px), 가로 스크롤 없음 */
.lp-root { background: var(--lp-bg); }
.lp-body { margin: 0; min-height: 100vh; background: var(--lp-bg); color: var(--lp-ink); font-family: var(--font-body); font-size: var(--text-md); overflow-x: hidden; }
.lp { width: 100%; max-width: 440px; margin: 0 auto; padding: var(--space-4) var(--space-4) 40px; display: flex; flex-direction: column; gap: var(--space-4); color: var(--lp-ink); background: var(--lp-bg); overflow-wrap: anywhere; word-break: keep-all; }
.lp-disclosure { margin: 0; padding: 10px 12px; border-radius: var(--radius-md); background: var(--lp-note-bg); color: var(--lp-note-ink); font-size: var(--text-sm); line-height: 1.5; }
.lp-profile { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); text-align: center; padding-top: var(--space-2); }
.lp-avatar { position: relative; width: 88px; height: 88px; border-radius: 50%; overflow: hidden; background: var(--lp-accent); color: var(--lp-accent-ink); display: flex; align-items: center; justify-content: center; font-size: 36px; font-weight: 700; flex: none; }
.lp-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lp-name { margin: var(--space-1) 0 0; font-size: var(--text-2xl); font-weight: 700; line-height: 30px; }
.lp-intro { margin: 0; color: var(--lp-muted); font-size: var(--text-md); line-height: 1.5; white-space: pre-line; }
.lp-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.lp-link { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: var(--space-3) var(--space-4); border-radius: var(--radius-btn); background: var(--lp-accent); color: var(--lp-accent-ink); font-size: var(--text-lg); font-weight: 500; line-height: 24px; text-align: center; text-decoration: none; box-shadow: var(--shadow-1); }
.lp-link[aria-disabled="true"] { cursor: default; }
.lp-missing { text-align: center; padding-top: 72px; align-items: center; }
.lp-missing-mark { margin: 0; font-size: 48px; font-weight: 700; color: var(--lp-accent); }

/* 편집 화면 */
.lnk-note { margin: 0 0 var(--space-4); }
.lnk-publish { display: flex; flex-direction: column; gap: var(--space-2); }
.lnk-publish p { margin: 0; }
.lnk-url-row { display: flex; align-items: center; gap: var(--space-2) var(--space-3); flex-wrap: wrap; }
.lnk-url { font-weight: 500; overflow-wrap: anywhere; }
.lnk-url a { color: var(--brand-ink); }
.lnk-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: var(--space-4); align-items: start; }
.lnk-form .field { max-width: 720px; }
.lnk-form textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-size: var(--text-md); resize: vertical; }
.field-error:empty { display: none; }
/* 주소 칸: 앞글자(고정 주소)와 입력이 한 칸 — 분석기 입력칸(35px · 5px · 1px 선 · 초점 파랑) */
.lnk-slug { display: flex; align-items: stretch; min-height: var(--btn-h); border: 1px solid var(--input-line); border-radius: var(--radius-sm); overflow: hidden; background: var(--paper); }
.lnk-slug:focus-within { border-color: var(--brand); box-shadow: 0 0 0 2px var(--brand-line); }
.lnk-slug .lnk-prefix { padding: 0 0 0 12px; color: var(--text-muted); font-weight: 400; font-size: var(--text-md); white-space: nowrap; align-self: center; }
:root .page .lnk-slug input { flex: 1; min-width: 80px; min-height: calc(var(--btn-h) - 2px); border: 0; border-radius: 0; padding-left: 2px; }
:root .page .lnk-slug input:focus { box-shadow: none; }
.lnk-themes { border: 0; padding: 0; margin: 0; min-width: 0; }
.lnk-themes legend { font-weight: 500; font-size: var(--text-md); margin-bottom: 6px; padding: 0; }
.lnk-theme-row { display: flex; gap: var(--space-2); flex-wrap: wrap; }
/* 색 테마 칩 = 분석기 흰 35px 버튼 (고른 것 = 파랑 바탕 흰 글, 동그라미 견본은 테마 색 그대로) */
.theme-chip { position: relative; display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font-size: var(--text-md); font-weight: 400; line-height: 21px; cursor: pointer; }
.theme-chip:hover { background: var(--brand-bg-soft); }
.theme-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.theme-chip:has(input:checked) { background: var(--brand); color: var(--paper); }
.theme-chip:has(input:checked) .theme-swatch { box-shadow: 0 0 0 1px var(--paper); }
.theme-chip:has(input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 2px; }
.theme-swatch { width: 18px; height: 18px; border-radius: 50%; background: var(--lp-bg); border: 5px solid var(--lp-accent); }
.lnk-list { display: flex; flex-direction: column; gap: var(--space-3); }
.lnk-list-head { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.lnk-count { font-weight: 500; font-size: var(--text-md); padding: 3px 8px; border-radius: var(--radius-btn); background: var(--muted-bg); color: var(--muted-ink); }
.lnk-count.is-full { background: var(--warn-bg); color: var(--warn-ink); }
.lnk-full { color: var(--warn-ink); font-size: var(--text-sm); font-weight: 500; }
.lnk-rows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
/* 링크 한 줄 = 칸 안의 칸: 흐린 바탕만 (테두리·그림자 없음) */
.lnk-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: var(--space-3); align-items: start; padding: var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--ground); }
.lnk-num { font-weight: 700; color: var(--text-muted); padding-top: 7px; text-align: center; }
.lnk-row-fields { display: flex; flex-direction: column; gap: 6px; max-width: 720px; }
.lnk-row-fields input { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.lnk-row-side { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); }
.lnk-clicks { font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); }
.lnk-row-actions { display: flex; gap: var(--space-1); }
.btn-ghost-danger { color: var(--danger-ink); }
.lnk-actions { display: flex; justify-content: flex-end; padding-top: var(--space-1); }
.lnk-preview-col { position: sticky; top: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); }
.lnk-preview-title { margin: 0; font-size: var(--text-lg); font-weight: 700; }
/* 미리보기 틀: 검은 휴대폰 테두리 대신 분석기 칸(흰 · 8px · 그림자) — 안은 공개 화면 그대로 */
.lnk-phone { border: 0; border-radius: var(--radius-md); overflow: hidden; height: 640px; overflow-y: auto; background: var(--paper); box-shadow: var(--shadow-1); }
.lnk-phone #link-preview { min-height: 100%; display: flex; flex-direction: column; }
.lnk-phone .lp { flex: 1; }
.lnk-preview-hint { margin: 0; font-size: var(--text-xs); }
@media (max-width: 900px) {
  .lnk-layout { grid-template-columns: minmax(0, 1fr); }
  .lnk-preview-col { position: static; }
}
@media (max-width: 640px) {
  :root .page .lnk-slug input { min-height: calc(var(--tap) - 2px); }
  .lnk-url a { display: inline-flex; align-items: center; min-height: var(--tap); }
}

/* sf5-quota-trial */
.flash-area:empty { display: none; }
.flash-area { margin-bottom: 16px; }
.flash { margin: 0; padding: 12px 18px; border-radius: var(--radius-md); font-size: var(--text-md); }
.flash-warn { background: var(--warn-bg); border: 1px solid var(--warn-line); color: var(--warn-ink); }
.quota-aside { width: 260px; flex: 0 0 260px; padding: 28px 0 28px 24px; }
.badge.tone-good { background: var(--good-bg); color: var(--good-ink); }
.badge.tone-warn { background: var(--warn-bg); color: var(--warn-ink); }
.badge.tone-danger { background: var(--danger-bg); color: var(--danger-ink); }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D): 남은 횟수 표는 공용 표 모양(.kit-table — 머리 50 #EFEFEF 500) 그대로, 숫자 칸만 오른쪽 */
.quota-table { margin-bottom: var(--space-3); }
.quota-table td:nth-child(n+2):nth-child(-n+4), .quota-table th:nth-child(n+2):nth-child(-n+4) { text-align: right; font-variant-numeric: tabular-nums; }
.quota-hint { font-size: 13px; }
.quota-btn { display: inline-flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.quota-note { color: var(--warn); font-size: 13px; }
.dev-row { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.dev-row select, .field select { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.radio-row { border: 0; padding: 0; margin: 0; display: flex; gap: 16px; align-items: center; }
.radio-row legend { font-weight: 500; font-size: var(--text-md); margin-bottom: 6px; }
.demo-result { border-top: 1px solid var(--rule); padding-top: 12px; }
.demo-result p { margin: 0 0 4px; }
code { font-family: var(--font-mono); background: var(--muted-bg); padding: 1px 6px; border-radius: var(--radius-sm); }
/* 20261020-alalshow-sf5-web-shell */



/* 알림·튜토리얼 자리 */
.flash:empty, .tutorial-slot:empty { display: none; }
.flash { margin-bottom: 16px; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D): 사용 안내는 어두운 띠 대신 분석기 알림 칸 (info 바탕 · 1px 선 · 8px) */
.tutorial { background: var(--info-bg); color: var(--text); border: 1px solid var(--info-line); border-radius: var(--radius-md); padding: 16px 18px; margin-bottom: var(--space-4); display: flex; flex-direction: column; gap: var(--space-1); }
.tutorial h2 { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.tutorial-kicker { margin: 0; font-size: var(--text-xs); font-weight: 500; color: var(--info-ink); }
.tutorial-body { margin: 0 0 6px; color: var(--text); }
.tutorial-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }

/* 스튜디오 홈 */
.home-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 20px; }
.home-head p { margin: 0; }
.auto-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--space-3) var(--space-5); }
.auto-card h2 { font-size: var(--text-lg); }
.auto-card p { margin: 4px 0 0; }
.step-strip { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--space-2); }
.step-chip { text-align: center; padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font-size: var(--text-md); font-weight: 400; line-height: 21px; }
.setup-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.setup-head p { margin: 4px 0 0; }
.progress-badge { font-size: var(--text-sm); font-weight: 500; padding: 3px 8px; border-radius: var(--radius-lg); background: var(--info-bg); color: var(--info-ink); white-space: nowrap; }
.progress-badge[data-done="true"] { background: var(--good-bg); color: var(--good-ink); }
.setup-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.setup-card { border: 1px solid var(--rule); border-radius: var(--radius-md); padding: var(--space-4); display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.setup-card-head { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 8px; }
.setup-card h3 { margin: 0; font-size: var(--text-md); font-weight: 700; }
.setup-summary { margin: 0; color: var(--text-muted); font-size: var(--text-md); }
.status-chip { font-size: var(--text-xs); font-weight: 500; padding: 2px 8px; border-radius: var(--radius-lg); background: var(--muted-bg); color: var(--muted-ink); }
.setup-card[data-status="ready"] .status-chip { background: var(--good-bg); color: var(--good-ink); }
.setup-card[data-status="todo"] .status-chip { background: var(--brand-bg); color: var(--brand-ink); }
.setup-card[data-status="check"] .status-chip { background: var(--warn-bg); color: var(--warn-ink); }
.setup-card[data-status="broken"] .status-chip { background: var(--danger-bg); color: var(--danger-ink); }

/* 준비 중 */
.coming-soon { text-align: center; padding: 72px 16px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.coming-soon h1 { margin: 0; font-size: var(--text-2xl); }
.coming-soon p { margin: 0 0 8px; }
.page-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; padding: 3px 10px; border-radius: var(--radius-lg); background: var(--bg); border: 1px solid var(--line); color: var(--muted); }

/* 제작 기본값 */
.settings-form { display: flex; flex-direction: column; margin-top: 16px; }
.settings-card { display: flex; flex-direction: column; gap: 12px; scroll-margin-top: 16px; }
.field-group { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.field-group legend { font-weight: 500; font-size: var(--text-md); margin-bottom: 6px; }
.field select, .field input { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); font-family: inherit; }
.field select:disabled { background: var(--bg); color: var(--muted); }
.field-note { color: var(--muted); font-size: 12px; font-weight: 400; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.field-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; }
.field-label { font-weight: 500; }
.voice-names { color: var(--muted); }
.status-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.status-list li { display: flex; align-items: center; gap: 10px; }
.status-name { width: 96px; font-weight: 500; font-size: var(--text-md); }
.status-list .btn { margin-left: auto; }
.settings-actions { display: flex; gap: 10px; padding: 4px 0 64px; }
.notice-ok { background: var(--good-bg); border: 1px solid var(--good-line); color: var(--good-ink); border-radius: var(--radius-md); padding: 12px 18px; margin: 0 0 14px; font-size: var(--text-md); font-weight: 500; }

/* 참고 대본 */
.ref-panel { position: fixed; top: 0; right: 0; bottom: 0; width: 380px; max-width: 100vw; z-index: 40; background: var(--surface); border-left: 1px solid var(--line); box-shadow: -12px 0 32px rgba(29, 31, 36, 0.12); overflow-y: auto; }
.ref-panel[hidden] { display: none; }
.ref-panel-inner { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.ref-head { display: flex; justify-content: space-between; align-items: center; }
.ref-head h2 { margin: 0; font-size: 18px; }
.ref-sub { margin: 0; font-size: 13px; }
.ref-tabs { display: flex; gap: 6px; }
.ref-tab { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius-lg); padding: 6px 12px; font-size: 13px; cursor: pointer; }
.ref-tab[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.ref-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ref-open { width: 100%; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 10px 12px; font-size: 14px; cursor: pointer; }
.ref-open:hover { background: var(--bg); }
.ref-more { padding-top: 6px; }
.ref-empty { color: var(--muted); font-size: 14px; line-height: 1.6; }
.ref-view:empty { display: none; }
.ref-item { border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: var(--brand-bg-soft); }
.ref-item h3 { margin: 0; font-size: 16px; }
.ref-meta { margin: 2px 0 8px; font-size: 12px; }
.ref-body { white-space: pre-wrap; font-family: inherit; font-size: 14px; line-height: 1.6; margin: 0 0 10px; }
.ref-item-actions { display: flex; gap: 8px; }

/* 공통 상태 표시 */
.state-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
/* (묶음 D) 공통 상태 칸: 분석기 알림 칸 모양 (8px · 1px 색조 선 · 색조 바탕 — 디자인 값만) */
.state-sample h2 { font-size: var(--text-sm); color: var(--text-muted); margin-bottom: 10px; }
.state-box { border-radius: var(--radius-md); padding: 12px 18px; border: 1px solid var(--rule); background: var(--paper); display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.state-box .bar { width: 100%; }
.state-msg { margin: 0; font-weight: 500; font-size: var(--text-md); }
.state-box[data-state="processing"] { border-color: var(--info-line); background: var(--info-bg); }
.state-box[data-state="review"] { border-color: var(--warn-line); background: var(--warn-bg); }
.state-box[data-state="failed"] { border-color: var(--danger-line); background: var(--danger-bg); }
.state-box[data-state="failed"] .state-msg { color: var(--danger-ink); }
.state-box[data-state="quota"] { border-color: var(--info-line); background: var(--info-bg); }
.state-box[data-state="disconnected"] { background: var(--ground); }

/* 20261020-alalshow-sf5-admin-console — 관리자 콘솔 (AD-ADM-01~06) */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.admin-tabs { display: flex; gap: 4px; margin: 18px 0 20px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.admin-tab { padding: 10px 14px; text-decoration: none; font-weight: 600; font-size: 14px; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.admin-tab:hover { color: var(--ink); }
.admin-tab[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }
.admin-panel { display: flex; flex-direction: column; gap: 14px; }
.admin-toolbar { display: flex; gap: 8px; align-items: center; }
.admin-toolbar input, .admin-toolbar select { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: 14px; background: var(--paper); min-width: 260px; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D): 관리자 표 = 분석기 표 (머리 50 #EFEFEF 500 14px · 칸 안쪽 12px · 줄 아래 1px #EDEDED · 바깥 테두리 없음) */
.admin-table { width: 100%; border-collapse: collapse; background: var(--paper); border: 0; }
.admin-table th, .admin-table td { padding: var(--space-3); border-bottom: 1px solid var(--rule); text-align: left; font-size: var(--text-md); line-height: 21px; vertical-align: middle; }
.admin-table thead th { height: 50px; padding: 0 var(--space-3); border-bottom: 0; background: var(--table-head); color: var(--text); font-weight: 500; font-size: var(--text-md); }
.admin-table thead th:first-child { border-top-left-radius: var(--radius-md); }
.admin-table thead th:last-child { border-top-right-radius: var(--radius-md); }
.admin-table tbody th { font-weight: 500; }
.admin-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.admin-user + .admin-user tr:first-child td { border-top: 1px solid var(--line); }
.admin-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.admin-inline { display: inline-flex; gap: 6px; align-items: center; margin: 0; }
.admin-inline select { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.admin-row-msg td { background: var(--paper-3); }
.admin-temp-pw { margin: 0; border: 1px solid var(--warn-line); background: var(--warn-bg); box-shadow: none; }
.admin-temp-pw h2 { font-size: var(--text-lg); margin-bottom: 6px; }
.admin-temp-pw p { margin: 0; font-family: var(--font-mono); font-size: var(--text-md); }
.admin-empty { background: var(--paper); border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-1); padding: var(--space-6); text-align: center; color: var(--text-muted); margin: 0; }
.admin-note { margin: 0; font-size: var(--text-sm); }
.admin-pager { display: flex; gap: 12px; align-items: center; justify-content: center; }
.admin-form { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.admin-form-row { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-start; }
.admin-form-row .field { min-width: 180px; }
.admin-form-row .field select { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.admin-grow { flex: 1; }
.admin-form-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.admin-flash { margin: 0; }
.admin-confirm { display: flex; flex-direction: column; gap: 10px; padding: 12px 18px; border: 1px solid var(--danger-line); background: var(--danger-bg); border-radius: var(--radius-md); }
.admin-confirm p { margin: 0; font-size: var(--text-md); font-weight: 500; }
.admin-confirm-actions { display: flex; gap: 8px; }
.admin-limits td { width: 22%; }
.admin-num { width: 100%; max-width: 120px; min-height: var(--btn-h); padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font-size: var(--text-md); text-align: right; font-variant-numeric: tabular-nums; }
.admin-num[aria-invalid="true"] { border-color: var(--danger-ink); background: var(--danger-bg); }
.admin-limits .field-error { display: block; margin-top: 4px; }
.badge.tone-muted { background: var(--muted-bg); color: var(--muted); }
.badge.tone-info { background: var(--info-bg); color: var(--info-ink); }
.admin-table .badge { white-space: nowrap; }
.admin-user td:not(:nth-child(2)):not(.admin-actions), #code-table td, #code-table th, #channel-table td:not(:nth-child(3)), #usage-table td, #audit-table td:first-child { white-space: nowrap; }
.admin-user td:nth-child(2) { word-break: break-all; }
/* 20261019-alalshow-sf5-script-gen — AI 대본 (MK-SCR-01) */
.script-input { margin-bottom: 0; }
.script-section-title { margin: 0 0 var(--space-3); font-size: var(--text-lg); }
.script-result:empty { min-height: 60px; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 A): 칩·탭 = 분석기 작업 줄 버튼 모양(흰 바탕 + 그림자 35px · 고른 것 = 파랑 바탕 흰 글) · 점선 상자 → 흐린 바탕 */
.script-empty { margin: 0; padding: var(--space-5) var(--space-4); border: 0; border-radius: var(--radius-md); background: var(--ground); color: var(--text-muted); text-align: center; }
.seg-tabs { display: flex; gap: var(--space-1); flex-wrap: wrap; margin-bottom: var(--space-3); }
.seg-sub { margin-bottom: 16px; }
.seg-tab, .voice-tab, .ref-tab, .ers-tab { display: inline-flex; align-items: center; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); font-size: var(--text-md); font-weight: 400; line-height: 21px; white-space: nowrap; cursor: pointer; }
.seg-tab:hover, .voice-tab:hover, .ref-tab:hover, .ers-tab:hover { background: var(--brand-bg-soft); }
.seg-tab[aria-selected="true"], .voice-tab[aria-selected="true"], .ref-tab[aria-selected="true"], .ers-tab[aria-selected="true"] { background: var(--brand); color: var(--paper); }
/* 칸 안 입력·글칸은 읽기 좋은 폭까지 (칸은 전체 폭) */
.script-form .field, .script-form .script-photo-drop, .script-form .char-counter, .script-form .detail-reader { max-width: 960px; }
.script-form textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-size: var(--text-md); font-weight: 400; resize: vertical; background: var(--paper); }
.script-form input[type="file"] { font-weight: 400; font-size: var(--text-md); }
.script-mode-note { margin: 0; font-size: 13px; }
.char-counter { color: var(--text-muted); font-size: var(--text-xs); margin-top: -6px; text-align: right; }
.topic-chips { border: 0; padding: 0; margin: 0; }
.topic-chips legend { font-weight: 500; font-size: var(--text-md); margin-bottom: var(--space-2); }
.topic-row { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.topic-chip { position: relative; display: inline-flex; align-items: center; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font-size: var(--text-md); font-weight: 400; line-height: 21px; cursor: pointer; }
.topic-chip:hover { background: var(--brand-bg-soft); }
.topic-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.topic-chip:has(input:checked) { background: var(--brand); color: var(--paper); }
.topic-chip:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.topic-hints { margin: -4px 0 0; font-size: 12px; line-height: 1.5; }
.script-panel { margin-bottom: 0; display: flex; flex-direction: column; gap: 12px; }
.script-panel-head { display: flex; flex-direction: column; gap: 2px; }
.script-title { margin: 0; font-size: 18px; line-height: 1.4; }
.script-meta { margin: 0; font-size: 12px; }
.script-summary { margin: 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); font-size: var(--text-md); }
.script-images { display: flex; gap: 8px; }
.script-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: var(--radius-btn); border: 1px solid var(--rule); }
.script-images-expired { margin: 0; font-size: 13px; }
.script-lines { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--text-md); line-height: 1.6; }
.script-line[data-dialogue="true"] .line-text { color: var(--brand-ink); }
.stage-tag { font-size: var(--text-xs); font-weight: 500; color: var(--brand-ink); white-space: nowrap; }
.dialogue-tag { display: inline-block; margin-left: 4px; padding: 1px 6px; border-radius: var(--radius-lg); background: var(--brand-bg); color: var(--brand-ink); font-size: var(--text-xs); font-weight: 500; vertical-align: 1px; }
.script-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.script-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.script-job .state-box, .script-failure .state-box { width: 100%; }
.script-attempt-note:empty, .script-not-charged:empty { display: none; }
.script-attempt-note, .script-not-charged { margin: 8px 0 0; font-size: 13px; }
.script-failure[data-tone="warn"] .state-box { border-color: var(--warn-line); background: var(--warn-bg); }
.script-failure[data-tone="warn"] .state-msg { color: var(--warn-ink); }
.script-history-card { margin-top: 0; }
.script-history-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.script-history-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--space-3); align-items: center; padding: var(--space-3) 0; border-top: 1px solid var(--rule); }
.script-history-item:first-child { border-top: 0; }
.hist-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.hist-label { font-weight: 500; font-size: var(--text-md); overflow-wrap: anywhere; }
.hist-ref { font-size: var(--text-xs); color: var(--text-muted); overflow-wrap: anywhere; }
.hist-date { font-size: 12px; white-space: nowrap; }
.script-history-empty { margin: 0; font-size: 14px; }

/* 20261019-alalshow-sf5-scene-image — 실사 장면 이미지 (MK-IMG-01) */
.page-scene .page-head { margin-bottom: 12px; }
.scene-key { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 6px; }
.scene-key .state-box { flex: 1; min-width: 280px; }
.scene-note { font-size: 13px; margin: 0 0 16px; }
.scene-cast-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.scene-cast h2, .scene-options h2, .scene-script h2 { margin-bottom: 10px; }
.scene-cast-list { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
/* 묶음 A: 칸 안 줄은 흐린 바탕 하나 (선·그림자 겹치지 않게) · 칩은 작업 줄 버튼 모양 · 표는 분석기 표 */
.scene-cast-item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--ground); }
.scene-thumb { width: 40px; height: 40px; border-radius: var(--radius-btn); object-fit: cover; flex: none; background: var(--rule); }
.scene-thumb-empty { display: inline-block; }
.scene-cast-text { flex: 1; font-size: var(--text-md); overflow-wrap: anywhere; }
.scene-cast-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.scene-expired { color: var(--warn-ink); font-weight: 500; }
.scene-pin-note { font-size: 12px; margin: 8px 0 0; }
.scene-cast-form { margin-top: var(--space-2); padding: var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--ground); }
.scene-choices { border: 0; padding: 0; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.scene-choices legend { font-weight: 500; font-size: var(--text-md); margin-bottom: var(--space-2); width: 100%; }
.scene-toggles { display: flex; flex-direction: column; gap: 6px; }
.scene-script textarea { width: 100%; max-width: 960px; min-height: 160px; padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-size: var(--text-md); line-height: 1.5; resize: vertical; }
.scene-sub { font-size: var(--text-md); margin: var(--space-4) 0 var(--space-2); }
.scene-line-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.scene-line-no { display: inline-block; min-width: 22px; font-weight: 700; color: var(--muted); }
.scene-empty { font-size: var(--text-md); margin: 4px 0; }
.scene-form-errors { margin: 4px 0; }
.scene-actions { display: flex; gap: 8px; margin: 8px 0 24px; }
.scene-run-wrap h2 { font-size: var(--text-lg); margin: 0 0 var(--space-3); }
.scene-progress { margin-bottom: 10px; }
.scene-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.scene-summary { font-weight: 500; margin-right: auto; }
.scene-notice { display: inline-block; margin: 0 0 10px; }
.scene-table, .clip-table, .tpl-table { width: 100%; border-collapse: collapse; background: var(--paper); font-size: var(--text-md); }
.scene-table th, .clip-table th, .tpl-table th { height: 50px; padding: 0 var(--space-3); border-bottom: 0; background: var(--table-head); color: var(--text); font-size: var(--text-md); font-weight: 500; line-height: 21px; text-align: left; vertical-align: middle; }
.scene-table th:first-child, .clip-table th:first-child, .tpl-table th:first-child { border-top-left-radius: var(--radius-md); }
.scene-table th:last-child, .clip-table th:last-child, .tpl-table th:last-child { border-top-right-radius: var(--radius-md); }
.scene-table td, .clip-table td, .tpl-table td { padding: var(--space-3); border-bottom: 1px solid var(--rule); text-align: left; vertical-align: top; font-size: var(--text-md); line-height: 21px; }
.scene-no { width: 40px; font-weight: 500; }
.scene-en { display: block; color: var(--text-muted); font-size: var(--text-xs); margin-top: 4px; }
.scene-img { display: block; max-width: 120px; max-height: 120px; border-radius: var(--radius-btn); border: 1px solid var(--rule); }
.scene-file { display: block; color: var(--text-muted); font-size: var(--text-xs); margin-top: 4px; }
.scene-line-msg { margin: 6px 0 0; font-size: var(--text-sm); color: var(--text-muted); max-width: 260px; }
.scene-row[data-status="refused"] .scene-line-msg { color: var(--warn-ink); }
.scene-row[data-status="failed"] .scene-line-msg { color: var(--danger-ink); }
.scene-row-actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.scene-downloads { margin-top: 10px; }
.scene-dl-list { display: flex; flex-wrap: wrap; gap: 8px; }
.scene-dl { font-size: var(--text-sm); color: var(--brand-ink); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 20261019-alalshow-sf5-voice-audio — 목소리 MK-VOC-01 · 무음 정리 MK-AUD-01 */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.voice-layout { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 16px; align-items: start; margin-top: 16px; }
/* 묶음 A: 목소리 칩 = 작업 줄 버튼 모양 · 목록 줄은 1px 선 하나 · 끌어다 놓는 자리는 알림 칸 모양 */
.voice-card h2 { margin: 0 0 var(--space-3); font-size: var(--text-lg); }
.voice-tabs { display: flex; gap: var(--space-1); flex-wrap: wrap; margin-bottom: var(--space-3); }
.voice-search input { width: 100%; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); margin-bottom: var(--space-3); font-family: inherit; }
.voice-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow-y: auto; }
.voice-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-2) var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); }
.voice-item[aria-current="true"] { border-color: var(--brand); background: var(--brand-bg-soft); }
.voice-item-name { font-weight: 500; font-size: var(--text-md); }
.voice-empty { padding: 8px 2px; font-size: var(--text-md); }
.voice-notice { margin: 0 0 10px; white-space: normal; }
.voice-form { display: flex; flex-direction: column; gap: 12px; }
#voice-form-body { display: flex; flex-direction: column; gap: 12px; }
.voice-chosen { margin: 0; font-size: var(--text-lg); }
.voice-chosen strong { color: var(--brand-ink); font-weight: 500; margin-left: 6px; }
.voice-dialogue { gap: 10px; }
.voice-summary { margin: 0; padding: var(--space-3); border-radius: var(--radius-md); background: var(--ground); font-weight: 500; font-size: var(--text-md); }
.voice-actions { padding: 0; }
.voice-test-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.field textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); font-family: inherit; resize: vertical; }
.voice-test-result { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.voice-player audio { width: 100%; max-width: 480px; }
.voice-player-note { margin: 4px 0 0; font-size: var(--text-sm); }
.voice-alert { padding: 8px 0; }
.field-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.voice-cleanup-now { margin: 0 0 8px; }
.audio-form { display: flex; flex-direction: column; margin-top: 16px; }
.audio-drop { display: flex; align-items: center; gap: var(--space-3); max-width: 960px; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); position: relative; }
.audio-file-input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.audio-file-state { margin-top: 10px; }
.audio-file-line { margin: 0; font-size: var(--text-md); }
.audio-values { display: flex; flex-direction: column; gap: 10px; }
.audio-preset-save { align-items: flex-end; }
.audio-summary { font-size: var(--text-xl); font-weight: 700; margin: 0 0 var(--space-3); }
.audio-result-slot { display: flex; flex-direction: column; gap: 12px; padding-bottom: 64px; }

/* 20261020-alalshow-sf5-media-download
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 꼬리표 6px · 권리 확인은 info 알림 칸 · 표는 분석기 표(머리 50 #EFEFEF 500 14px · 칸 안쪽 12px · 줄 1px) */
.dl-page { display: flex; flex-direction: column; gap: var(--space-4); }
.dl-page .page-head p { margin: 0; }
.dl-page > .card { margin-bottom: 0; }
.dl-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.dl-badge { display: inline-block; padding: 3px 8px; border: 1px solid transparent; border-radius: var(--radius-lg); background: var(--info-bg); color: var(--info-ink); font-size: var(--text-sm); font-weight: 500; }
.dl-badge[data-tone="good"] { background: var(--good-bg); color: var(--good-ink); }
.dl-badge[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.dl-badge[data-tone="danger"] { background: var(--danger-bg); color: var(--danger-ink); }
.dl-badge[data-tone="muted"] { background: var(--muted-bg); color: var(--muted-ink); }
.dl-help-link { font-size: var(--text-sm); color: var(--text-muted); }
.dl-form { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; }
.dl-form .field { max-width: 960px; }
.dl-form textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font-size: var(--text-md); line-height: 21px; font-family: var(--font-mono); resize: vertical; min-height: 120px; }
.dl-consent { display: flex; gap: var(--space-2); align-items: flex-start; max-width: 960px; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--text); font-size: var(--text-md); line-height: 1.5; cursor: pointer; }
.dl-consent input { margin-top: 3px; accent-color: var(--brand); }
.dl-actions-main { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.dl-board { margin: 0; }
.dl-board-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.dl-board-head h2 { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.dl-msg { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--space-3); }
.dl-msg:empty { display: none; }
.dl-msg .flash { margin: 0; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); }
.dl-msg .flash-warn { border-color: var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); }
.dl-rejected { display: flex; flex-direction: column; gap: 2px; }
.dl-rejected code { font-size: var(--text-xs); word-break: break-all; }
.dl-table { width: 100%; border-collapse: collapse; background: var(--paper); font-size: var(--text-md); line-height: 21px; }
.dl-table th { height: 50px; padding: 0 var(--space-3); background: var(--table-head); color: var(--text); font-size: var(--text-md); font-weight: 500; text-align: left; white-space: nowrap; }
.dl-table th:first-child { border-top-left-radius: var(--radius-md); }
.dl-table th:last-child { border-top-right-radius: var(--radius-md); }
.dl-table td { padding: var(--space-3); border-bottom: 1px solid var(--rule); vertical-align: middle; }
.dl-empty td { color: var(--text-muted); text-align: center; padding: var(--space-5) var(--space-3); }
.dl-platform { font-weight: 500; white-space: nowrap; }
.dl-link span { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-muted); word-break: break-all; }
.dl-state { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); }
.dl-reason, .dl-note { font-size: var(--text-xs); color: var(--text-muted); line-height: 1.45; }
.dl-row[data-status="failed"] .dl-reason { color: var(--danger-ink); }
.dl-bridge-open { font-size: var(--text-xs); }
.dl-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dl-footer { font-size: var(--text-sm); margin: 0; }

/* 20261019-alalshow-sf5-template-render — 템플릿·렌더 (MK-RND-01) */
/* 묶음 A: 본문 전체 폭(공통 틀) · 표는 분석기 표(scene-table 묶음) · 칸 안 줄은 1px 선 하나 */
.render-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); margin-bottom: var(--space-4); }
.render-head p { margin: 0; }
.render-grid { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: 16px; align-items: start; }
.render-side { position: sticky; top: 16px; }
.tpl-form { display: flex; flex-direction: column; gap: 14px; }
.tpl-form h2, .make-card h2, .preview-card h2 { margin-bottom: 4px; }
.mode-group { display: flex; flex-direction: column; gap: 6px; }
.preset-select { max-width: 280px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.tpl-table td { vertical-align: middle; }
.tpl-pick { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.tpl-thumb { border-radius: var(--radius-sm); border: 1px solid var(--rule); object-fit: cover; background: var(--ground); }
.tpl-id { font-family: var(--font-mono); font-size: var(--text-sm); font-weight: 500; }
.tpl-name { color: var(--text-muted); }
.tpl-row:has(input:checked) { background: var(--brand-bg-soft); }
.badge-fixed, .badge-preset-intro { display: none; }
#tpl-form:has(input[name="body_mode"][value="fixed"]:checked) .tpl-row:has(input[name="body_id"]:checked) .badge-fixed { display: inline-block; }
#tpl-form:has(input[name="body_mode"][value="preset"]:checked) .tpl-row[data-kind="intro"]:has(input:checked) .badge-preset-intro { display: inline-block; }
.upload-row { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 10px; }
.upload-btn { position: relative; cursor: pointer; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.upload-row .field-error, #sfx-upload-msg { margin-top: 6px; }
.upload-row .field-error:empty, #sfx-upload-msg:empty { display: none; }
.color-row { display: flex; align-items: center; gap: 8px; }
.color-row input { flex: 1; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.swatch { width: 28px; height: 28px; border-radius: var(--radius-btn); border: 1px solid var(--rule); flex-shrink: 0; }
.slider-group { gap: 4px; }
.slider-row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 40px; align-items: center; gap: var(--space-3); font-size: var(--text-md); }
.slider-row label { font-weight: 500; }
.slider-row input[type="range"] { width: 100%; accent-color: var(--accent); }
.slider-row output { font-variant-numeric: tabular-nums; font-weight: 500; text-align: right; }
#layout-error:empty { display: none; }
.tpl-actions { display: flex; gap: 10px; }
.preset-list h3 { margin: 0 0 var(--space-2); font-size: var(--text-lg); display: flex; gap: var(--space-3); align-items: baseline; }
.preset-count { font-size: var(--text-xs); font-weight: 500; }
.preset-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.preset-item { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); }
.preset-name { flex: 1; font-weight: 500; font-size: var(--text-md); }
.preview-pane { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 10px 0; }
.preview-shot { margin: 0; display: flex; flex-direction: column; gap: 6px; align-items: center; }
.preview-shot img { width: 100%; height: auto; aspect-ratio: 9 / 16; border-radius: var(--radius-md); border: 1px solid var(--rule); background: var(--ground); }
.preview-shot figcaption { font-size: var(--text-xs); color: var(--text-muted); font-weight: 500; }
.preview-note { font-size: var(--text-xs); margin: 0; }
.make-card { margin-top: 16px; }
.make-form { display: flex; flex-direction: column; gap: 14px; }
.make-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.quota-badge { display: inline-block; font-size: var(--text-sm); font-weight: 500; padding: 3px 8px; border-radius: var(--radius-lg); background: var(--muted-bg); color: var(--muted-ink); }
#make-error:empty { display: none; }
.render-status:empty { display: none; }
.render-card { margin-top: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.render-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-2); }
.render-steps li { text-align: center; padding: var(--space-2) 6px; border-radius: var(--radius-md); background: var(--ground); border: 1px solid transparent; font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); }
.render-steps li[data-done="true"] { background: var(--good-bg); color: var(--good-ink); border-color: var(--good-line); }
.render-steps li[aria-current="step"] { background: var(--brand-bg); color: var(--brand-ink); border-color: var(--brand-line); }
.render-progress-text { margin: 0; font-size: var(--text-md); font-weight: 500; }
.render-fail { color: var(--danger-ink); }
.render-result { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.render-video { width: 240px; aspect-ratio: 9 / 16; border-radius: var(--radius-md); background: #000; }
.render-summary { margin: 0; font-size: var(--text-xl); font-weight: 700; }
.render-detail { margin: 4px 0 var(--space-3); font-size: var(--text-sm); }
.render-actions { display: flex; gap: 8px; flex-wrap: wrap; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 C · 영상 다시 만들기): 양식 칸이 1408px로 퍼지지 않게 효과음 줄 · 내 채널 칸 960px까지, 파일 올리기 버튼은 글자 폭 */
.page-render .make-form .field-grid, .page-render .post-brand { max-width: 960px; }
.page-render .upload-btn { align-self: flex-start; }
/* 휴대폰: 글자 위치 밀대·게시글형 소리 안내 링크도 누름 칸 44px (보이는 모양은 그대로) */
@media (max-width: 640px) {
  .page-render .slider-row input[type="range"] { min-height: var(--tap); }
  .page-render .post-sound-hint a { display: inline-flex; align-items: center; min-height: var(--tap); }
}

/* 20261020-alalshow-sf5-hot-keywords — 핫 키워드 (DS-HOT-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 칸은 흰 바탕+그림자, 순위·종류 꼬리표 6px, 제목 16px/700, 종류 색은 디자인 값 색조 */
.trends-head { margin-bottom: var(--space-4); }
.trend-slot { margin: var(--space-2) 0 var(--space-3); font-size: var(--text-md); font-weight: 500; color: var(--text); }
.trend-notice { margin: 0 0 var(--space-4); }
.trend-empty { text-align: center; padding: var(--space-5) var(--space-4); color: var(--text-muted); font-size: var(--text-md); }
.trend-empty p { margin: 0; }
.trend-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-4); }
.trend-card { margin: 0; padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.trend-card-head { display: flex; align-items: center; gap: 10px; }
.trend-rank { flex-shrink: 0; width: 32px; height: 32px; border-radius: var(--radius-btn); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: var(--text-lg); background: var(--muted-bg); color: var(--text); font-variant-numeric: tabular-nums; }
.trend-card[data-rank="1"] .trend-rank, .trend-card[data-rank="2"] .trend-rank, .trend-card[data-rank="3"] .trend-rank { background: var(--brand); color: var(--paper); }
.trend-keyword { margin: 0; font-size: var(--text-lg); font-weight: 700; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.trend-kind { flex-shrink: 0; display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-xs); font-weight: 500; background: var(--info-bg); color: var(--info-ink); }
.trend-kind[data-kind="drama"] { background: var(--info-bg); color: var(--info-ink); }
.trend-kind[data-kind="variety"] { background: var(--warn-bg); color: var(--warn-ink); }
.trend-kind[data-kind="movie"] { background: var(--muted-bg); color: var(--muted-ink); }
.trend-kind[data-kind="music"] { background: var(--good-bg); color: var(--good-ink); }
.trend-kind[data-kind="celebrity"] { background: var(--danger-bg); color: var(--danger-ink); }
.trend-stats { margin: 0; font-size: var(--text-md); color: var(--text-muted); display: flex; gap: 6px; }
.trend-views { color: var(--text); font-weight: 700; }
.trend-thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.trend-thumb { display: block; aspect-ratio: 16 / 9; border-radius: var(--radius-btn); overflow: hidden; background: var(--muted-bg); }
.trend-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.trend-thumb-empty { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; font-size: var(--text-xs); color: var(--text-muted); text-decoration: underline; }
.trend-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
/* 묶인 영상 창은 공용 대화창 #trend-dialog (sf5-ui-migrate-discover) — 예전 오른쪽 서랍 규칙은 지웠다 */
.trend-panel-inner { display: flex; flex-direction: column; gap: var(--space-3); }
.trend-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.trend-panel-title { margin: 0 0 var(--space-1); font-size: var(--text-lg); font-weight: 700; }
.trend-panel-sub { margin: 0; font-size: var(--text-sm); display: flex; align-items: center; gap: 6px; }
.trend-video-list { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; }
.trend-video { display: flex; flex-direction: column; gap: 2px; }
.trend-video-title { color: var(--text); font-weight: 500; font-size: var(--text-md); text-decoration: none; overflow-wrap: anywhere; }
.trend-video-title:hover { color: var(--brand); text-decoration: underline; }
.trend-video-meta { font-size: var(--text-xs); color: var(--text-muted); }
.trend-ost { align-self: flex-start; }

/* 20261020-alalshow-sf5-script-trainer — 대본 트레이너 (GR-TRN-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 분석기 톤 — 칸 안 줄·보기는 1px 선 하나(그림자 겹치지 않음), 단계 버튼은 흰 35px 버튼, 둥글기 6·8, 글자 14 */
.trainer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.trainer-remaining { font-size: var(--text-md); white-space: nowrap; }
.trainer-remaining[data-remaining="0"] { background: var(--warn-bg); color: var(--warn-ink); }
.trainer-levels a.seg-tab, .trainer-modes a.seg-tab { text-decoration: none; }
.trainer-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--space-4); align-items: start; }
.trainer-main { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.trainer-picker-wrap { position: relative; }
.trainer-picker summary { list-style: none; }
.trainer-picker summary::-webkit-details-marker { display: none; }
.trainer-picker[open] .trainer-picker-toggle { background: var(--brand-bg-soft); color: var(--brand-ink); }
.trainer-picker-list { list-style: none; margin: var(--space-2) 0 0; padding: var(--space-2); background: var(--paper); border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: 2px; max-height: 360px; overflow: auto; }
.trainer-picker-link { display: flex; align-items: center; gap: var(--space-2); padding: 7px 12px; border-radius: var(--radius-btn); text-decoration: none; font-size: var(--text-md); line-height: 21px; }
.trainer-picker-link:hover { background: var(--ground); }
.trainer-picker-link[aria-current="true"] { background: var(--brand-bg); color: var(--brand-ink); font-weight: 500; }
.picker-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.trainer-script { margin-bottom: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.trainer-script-head { display: flex; align-items: center; gap: var(--space-2) var(--space-3); flex-wrap: wrap; }
.trainer-script-title { font-size: var(--text-lg); }
.trainer-premise { margin: 0; font-size: var(--text-md); }
.trainer-work { display: flex; flex-direction: column; gap: var(--space-3); }
.trainer-alert { margin: 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); color: var(--warn-ink); font-size: var(--text-md); font-weight: 500; }
.trainer-lines, .trainer-picks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.trainer-line-btn { width: 100%; display: flex; align-items: baseline; gap: var(--space-2); text-align: left; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-btn); background: var(--paper); font: inherit; font-size: var(--text-md); line-height: 1.5; color: var(--text); cursor: pointer; }
.trainer-line-btn:hover { border-color: var(--brand-line); background: var(--brand-bg-soft); }
.is-focus > .trainer-line-btn { border-color: var(--brand); background: var(--brand-bg-soft); box-shadow: 0 0 0 2px var(--brand-line); }
.line-n { font-weight: 700; color: var(--text-muted); min-width: 22px; }
.line-text { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.stage-chip { flex: none; padding: 2px 8px; border-radius: var(--radius-btn); background: var(--info-bg); color: var(--info-ink); font-size: var(--text-xs); font-weight: 500; line-height: 18px; white-space: nowrap; }
.stage-chip.is-pending { background: var(--brand); color: var(--paper); }
.trainer-question { margin: var(--space-1) 0 0; font-weight: 500; font-size: var(--text-md); }
.stage-buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); }
/* 단계 버튼 = 분석기 작업 줄 버튼 (흰 바탕 · 그림자 · 35px · 6px) */
.stage-btn { min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font: inherit; font-size: var(--text-md); font-weight: 400; line-height: 21px; cursor: pointer; color: var(--text); }
.stage-btn:hover { background: var(--brand-bg-soft); color: var(--brand-ink); }
.choice-list { display: flex; flex-direction: column; gap: var(--space-2); }
.choice-btn { text-align: left; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-btn); background: var(--paper); font: inherit; font-size: var(--text-md); line-height: 1.5; cursor: pointer; color: var(--text); }
.choice-btn:hover { border-color: var(--brand); background: var(--brand-bg-soft); }
.trainer-actions { display: flex; align-items: center; gap: var(--space-2) var(--space-3); flex-wrap: wrap; }
.trainer-score { margin: 0; font-size: var(--text-xl); font-weight: 700; }
.trainer-counts { margin: 0; font-size: var(--text-sm); }
.grade-list, .feedback-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.grade-item, .feedback-item { padding: 10px 12px; border-radius: var(--radius-md); border: 1px solid var(--rule); font-size: var(--text-md); line-height: 1.5; display: flex; flex-direction: column; gap: 2px; }
.grade-item[data-correct="true"], .feedback-item[data-verdict="fits"] { border-color: var(--good-line); background: var(--good-bg); }
.grade-item[data-correct="false"], .feedback-item[data-verdict="off"] { border-color: var(--danger-line); background: var(--danger-bg); }
.feedback-item[data-verdict="partial"] { border-color: var(--warn-line); background: var(--warn-bg); }
.grade-detail { color: var(--text-muted); font-size: var(--text-sm); }
.trainer-field input { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); font-weight: 400; background: var(--paper); }
.trainer-field input[aria-invalid="true"] { border-color: var(--danger-ink); }
.trainer-write { max-width: 960px; }
.trainer-note { margin: 0; font-size: var(--text-sm); }
.trainer-feedback-job .state-box { width: 100%; }
.trainer-job-badge { align-self: flex-start; }
.trainer-side { display: flex; flex-direction: column; gap: 0; }
.definition-list { margin: var(--space-3) 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--text-sm); line-height: 1.5; }
.definition-n { display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center; border-radius: 50%; background: var(--brand); color: var(--paper); font-size: 11px; font-weight: 700; margin-right: 2px; }
.trainer-history-list { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: flex; flex-direction: column; font-size: var(--text-md); }
.trainer-history-item { padding: var(--space-2) 0; border-top: 1px solid var(--rule); }
.trainer-history-item:first-child { border-top: 0; }
.trainer-history-item a { text-decoration: none; }
.trainer-history-item a:hover { color: var(--brand); }
.trainer-history-empty { margin: var(--space-2) 0 0; font-size: var(--text-sm); }
@media (max-width: 640px) {
  .trainer-picker-link, .trainer-history-item a { min-height: var(--tap); }
  .trainer-history-item a { display: inline-flex; align-items: center; }
}
@media (max-width: 960px) { .trainer-layout { grid-template-columns: minmax(0, 1fr); } }

/* 20261020-alalshow-sf5-production-planner — 제작 플래너 (GR-PLN-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 분석기 톤 — 항목 표는 분석기 표 모양(머리 50px #EFEFEF 500 14px · 칸 안쪽 12px · 줄 아래 1px),
   시간 고르기는 흰 35px 버튼(고른 것 = 파랑), 안내 색은 색조 디자인 값, 둥글기 6·8 */
.pln-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.pln-count { font-size: var(--text-md); padding: 4px 10px; white-space: nowrap; }
.pln-incoming { margin-bottom: var(--space-4); }
.pln-flash { border-radius: var(--radius-md); background: var(--info-bg); border: 1px solid var(--info-line); color: var(--info-ink); }
.pln-flash[data-tone="ok"] { background: var(--good-bg); border-color: var(--good-line); color: var(--good-ink); font-weight: 500; }
.pln-flash[data-tone="warn"], .pln-incoming .flash-warn { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn-ink); }
.pln-time h2, .pln-focus h2, .pln-batch h2 { margin: 0 0 var(--space-3); font-size: var(--text-lg); font-weight: 700; }
.pln-time-form { display: flex; flex-direction: column; gap: 6px; }
.pln-presets { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.pln-custom { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-md); font-weight: 400; color: var(--text-muted); }
.pln-custom input { width: 84px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); text-align: right; }
.pln-start { margin-left: var(--space-1); }
.pln-remaining { margin-top: var(--space-3); display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.pln-remaining-text { margin: 0; font-size: var(--text-2xl); font-weight: 700; line-height: 30px; }
.pln-remaining[data-state="none"] .pln-remaining-text { font-size: var(--text-md); font-weight: 400; line-height: 21px; color: var(--text-muted); }
span.pln-remaining-text { font-size: var(--text-md); line-height: 21px; }
.pln-started { margin: 0; font-size: var(--text-sm); }
.pln-message { margin: 0 0 var(--space-3); padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); font-size: var(--text-md); font-weight: 500; background: var(--info-bg); color: var(--info-ink); }
.pln-message[data-tone="warn"] { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn-ink); }
.pln-focus { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; }
.pln-focus h2 { margin: 0; }
.pln-table-card { padding: 0; overflow: hidden; }
.pln-table { width: 100%; border-collapse: collapse; background: var(--paper); }
.pln-table th, .pln-table td { padding: var(--space-3); border-bottom: 1px solid var(--rule); text-align: left; font-size: var(--text-md); line-height: 21px; vertical-align: top; }
.pln-table th { height: 50px; padding-block: 0; border-bottom: 0; background: var(--table-head); color: var(--text); font-weight: 500; vertical-align: middle; }
.pln-table th:not(:first-child), .pln-cell-td, .pln-act { text-align: center; width: 92px; }
.pln-row[data-focus="true"] { background: var(--brand-bg-soft); }
.pln-row[data-focus="true"] .pln-num { background: var(--brand); border-color: var(--brand); color: var(--paper); }
.pln-memo summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: var(--space-2); }
.pln-memo summary::-webkit-details-marker { display: none; }
.pln-num { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--ground); border: 1px solid var(--rule); font-size: var(--text-xs); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.pln-memo-text { font-weight: 500; border-bottom: 1px solid var(--input-line); }
.pln-memo-summary:hover .pln-memo-text { color: var(--brand); border-bottom-color: var(--brand); }
.pln-memo-form { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--space-2); max-width: 720px; }
.pln-memo-form input { flex: 1; min-width: 180px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); }
.pln-memo-error { width: 100%; }
.pln-from { display: inline-block; margin: 6px 0 0 30px; font-size: var(--text-xs); font-weight: 500; color: var(--brand-ink); background: var(--brand-bg); border-radius: var(--radius-btn); padding: 2px 8px; }
.pln-script { margin: 6px 0 0 30px; font-size: var(--text-sm); }
.pln-script-link { color: var(--text); font-weight: 500; }
.pln-script-link[data-missing="true"] { color: var(--text-muted); font-weight: 400; }
.pln-make-link { margin-left: var(--space-2); color: var(--brand-ink); font-weight: 500; text-decoration: none; }
.pln-make-link:hover { text-decoration: underline; }
.pln-cell { display: inline-block; min-width: 52px; padding: 3px 8px; border-radius: var(--radius-btn); font-size: var(--text-sm); font-weight: 500; line-height: 20px; background: var(--muted-bg); color: var(--muted-ink); }
.pln-cell[data-tone="good"] { background: var(--good-bg); color: var(--good-ink); }
.pln-cell[data-tone="info"] { background: var(--info-bg); color: var(--info-ink); box-shadow: inset 0 0 0 1px var(--info-line); }
.pln-cell[data-cell="skipped"] { background: transparent; box-shadow: inset 0 0 0 1px var(--rule); }
.pln-act form { margin: 0; }
.pln-complete { font-size: var(--text-sm); font-weight: 700; color: var(--good-ink); }
.pln-resize { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; padding: var(--space-3); }
.pln-resize form { margin: 0; }
.pln-size { font-size: var(--text-sm); }
.pln-batch-form { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.pln-batch-btn { min-width: 88px; }
.pln-recommended { box-shadow: 0 0 0 1px var(--brand-line), var(--shadow-1); }
.pln-rec { margin-left: 6px; font-size: var(--text-xs); font-weight: 500; color: var(--brand-ink); background: var(--brand-bg); border-radius: var(--radius-btn); padding: 2px 8px; }
.pln-done-title { color: var(--good-ink); }
.pln-batch-error { margin-top: var(--space-2); }
.pln-scope { margin: var(--space-2) 0 var(--space-1); font-size: var(--text-sm); }
.pln-next { margin: 0 0 64px; font-size: var(--text-sm); }
.pln-script .pln-job-link { font-weight: 500; }
/* 휴대폰: 항목 덩어리(qa-platform) 안 단계 이름은 흐린 12px 400, [끝냄]은 누름 칸 44px */
@media (max-width: 760px) {
  .page-planner .pln-table .pln-cell-td::before { font-size: var(--text-xs); font-weight: 400; color: var(--text-muted); }
  .page-planner .pln-table .pln-row { border-bottom-color: var(--rule); }
}
@media (max-width: 640px) {
  .page-planner .pln-table .pln-advance, .page-planner .pln-memo-summary { min-height: var(--tap); }
}

/* 20261020-alalshow-sf5-appeal-script — 재사용 정지 항소 대본 (GR-APL-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 분석기 톤 — 규칙 칸 왼쪽 띠 없앰, 예시는 칸 안 흐린 바탕(그림자 겹치지 않음),
   조사 체크는 흰 35px 버튼 모양(고른 것 = 파랑), 빈 결과는 점선 대신 흐린 바탕, 양식 칸 폭 960px까지, 글자 14 */
.appeal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.appeal-remaining { font-size: var(--text-md); white-space: nowrap; }
.appeal-rules { display: flex; flex-direction: column; gap: var(--space-3); }
.appeal-rule-list { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: var(--text-md); line-height: 1.5; }
.appeal-example-slot:empty { display: none; }
.appeal-example.card { margin: var(--space-1) 0 0; padding: var(--space-4); background: var(--ground); box-shadow: none; display: flex; flex-direction: column; gap: var(--space-3); }
.appeal-example-note { margin: 0; font-weight: 700; color: var(--brand-ink); }
.appeal-example-who { margin: 0; font-size: var(--text-sm); }
.appeal-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.appeal-input { margin-bottom: var(--space-4); }
.appeal-form { max-width: 960px; }
.appeal-section-title { margin: 0 0 var(--space-3); font-size: var(--text-lg); font-weight: 700; }
.appeal-group { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.appeal-group legend { font-weight: 700; font-size: var(--text-md); margin-bottom: var(--space-2); padding: 0; }
.appeal-form textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-size: var(--text-md); font-weight: 400; resize: vertical; background: var(--paper); }
.appeal-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.appeal-check { min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font-weight: 400; line-height: 21px; cursor: pointer; }
.appeal-check:hover { background: var(--brand-bg-soft); }
.appeal-check:has(input:checked) { background: var(--brand); color: var(--paper); }
.appeal-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.appeal-guide { margin: 0; font-size: var(--text-sm); line-height: 1.5; }
.appeal-submit .quota-note { color: var(--warn-ink); background: var(--warn-bg); padding: 4px 10px; border-radius: var(--radius-btn); font-weight: 500; }
.appeal-empty { margin: 0; padding: var(--space-5) var(--space-4); border: 0; border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-1); text-align: center; }
.appeal-empty .empty { justify-content: center; }
.appeal-panel { margin-bottom: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.appeal-panel-head { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.appeal-title { margin: 0; font-size: var(--text-lg); font-weight: 700; line-height: 1.4; }
.appeal-length { margin: 0; }
.appeal-sections { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-3); max-width: 960px; }
.appeal-sec { border-top: 1px solid var(--rule); padding-top: var(--space-3); }
.appeal-sec-head { margin: 0 0 var(--space-1); font-size: var(--text-md); font-weight: 700; color: var(--brand-ink); }
.appeal-sec-text { margin: 0; font-size: var(--text-md); line-height: 1.6; white-space: pre-line; }
.appeal-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: flex-start; }
.appeal-failure { display: flex; flex-direction: column; gap: 6px; }
.appeal-not-charged { margin: 0; font-size: var(--text-sm); }
.appeal-no-provider { display: block; border-radius: var(--radius-md); padding: 12px 18px; }
@media (max-width: 900px) {
  .appeal-layout, .appeal-checks, .appeal-tools { grid-template-columns: minmax(0, 1fr); }
}
/* 재심·대본 구조 연습의 꼬리표: 공용 규칙의 옛 직접 색 대신 알림 색조 */
:is(.page-appeal, .page-trainer) .badge.tone-info { background: var(--info-bg); color: var(--info-ink); }

/* 20261020-alalshow-sf5-viral-gallery — 떡상 갤러리 (DS-GAL-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 탭 줄(글 탭 · 고른 탭 파랑 + 아래 1px) · 칩(흰 바탕+그림자 · 고른 칩 파랑) ·
   쪽 번호는 35px 버튼 · [재생·분석] 표는 분석기 표 · 빈 화면은 흰 칸 (점선·베이지 없음) */
.page-gallery { max-width: 1180px; }
.gal-head { margin-bottom: var(--space-4); }
.gal-main { display: flex; flex-direction: column; gap: var(--space-3); }
.gal-locked { margin: 0; }
/* 탭 줄 아래 선은 안쪽 그림자 — 고른 탭의 파란 아래 1px가 같은 줄에 겹친다 (휴대폰 가로 밀기 칸에서도 잘리지 않게 음수 여백 없이) */
.gal-tabs { display: flex; flex-wrap: wrap; gap: var(--space-1); box-shadow: inset 0 -1px 0 var(--rule); }
.gal-tab { display: inline-flex; align-items: center; gap: 0.3em; padding: var(--space-2) var(--space-3); border-bottom: 1px solid transparent; text-decoration: none; font-weight: 500; font-size: var(--text-md); line-height: 21px; color: var(--text-muted); white-space: nowrap; }
.gal-tab:hover { color: var(--brand); }
.gal-tab[aria-current="page"] { color: var(--brand); border-bottom-color: var(--brand); }
.gal-filters { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); margin: 0; }
.gal-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gal-chip { display: inline-flex; align-items: center; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); text-decoration: none; font-size: var(--text-md); font-weight: 400; line-height: 21px; color: var(--text); white-space: nowrap; }
.gal-chip:hover { background: var(--brand-bg-soft); color: var(--brand); }
.gal-chip[aria-current="true"], .gal-chip[aria-current="true"]:hover { background: var(--brand); color: var(--paper); }
.gal-search { display: flex; gap: var(--space-2); align-items: center; margin-top: var(--space-1); }
.gal-search input[name="q"] { flex: 1; max-width: 420px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font-size: var(--text-md); }
.gal-q-error { margin-top: -2px; }
.gal-range { margin: 0; font-size: var(--text-md); font-weight: 500; }
.gal-empty { background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); padding: var(--space-6) var(--space-4); text-align: center; color: var(--text-muted); margin: 0; }
.gal-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--space-4); }
.gal-card { position: relative; background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); overflow: hidden; display: flex; flex-direction: column; }
.gal-card .gal-flash { position: absolute; top: 8px; left: 8px; right: 8px; z-index: 2; }
.gal-flash:empty { display: none; }
.gal-flash .flash { margin: 0; box-shadow: var(--shadow-2); }
.flash-ok { background: var(--good-bg); border: 1px solid var(--good-line); color: var(--good-ink); }
.gal-thumb { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--muted-bg); display: block; }
.gal-thumb-empty { display: flex; align-items: center; justify-content: center; background: var(--muted-bg); }
.gal-thumb-empty span { color: var(--text-faint); font-weight: 700; letter-spacing: 0.2em; font-size: var(--text-sm); }
.gal-card-body { padding: var(--space-3); display: flex; flex-direction: column; gap: 6px; flex: 1; }
.gal-title { margin: 0; font-size: var(--text-md); font-weight: 500; line-height: 1.4; }
.gal-meta { margin: 0; font-size: var(--text-sm); }
.gal-badges { margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.gal-badges .badge { font-size: var(--text-xs); padding: 3px 8px; }
.gal-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 6px; }
.gal-no-script { margin: 0; font-size: var(--text-xs); }
.gal-pager { display: flex; flex-wrap: wrap; gap: var(--space-1); justify-content: center; margin: var(--space-2) 0 var(--space-5); }
.gal-page { display: inline-flex; align-items: center; justify-content: center; min-width: var(--btn-h); min-height: var(--btn-h); padding: 7px 10px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); text-align: center; text-decoration: none; font-size: var(--text-md); font-weight: 400; line-height: 21px; color: var(--text); }
a.gal-page:hover { background: var(--brand-bg-soft); color: var(--brand); }
.gal-page[aria-current="page"], .gal-page[aria-current="page"]:hover { background: var(--brand); color: var(--paper); }
.gal-page[aria-disabled="true"] { color: var(--text-muted); opacity: 0.5; }
.gal-detail:empty { display: none; }
.gal-detail { margin-top: 18px; }
.gal-panel { display: flex; flex-direction: column; gap: var(--space-4); }
.gal-panel-head { display: flex; justify-content: space-between; gap: var(--space-3); align-items: flex-start; }
.gal-panel-title { margin: 0 0 var(--space-1); font-size: var(--text-lg); font-weight: 700; }
.gal-panel-head p { margin: 0; }
.gal-panel-grid { display: grid; grid-template-columns: minmax(200px, 260px) 1fr; gap: var(--space-5); align-items: start; }
.gal-embed { width: 100%; aspect-ratio: 9 / 16; border: 0; border-radius: var(--radius-md); background: var(--text); }
.gal-views { width: 100%; border-collapse: collapse; background: var(--paper); font-size: var(--text-md); line-height: 21px; }
.gal-views th { height: 50px; padding: 0 var(--space-3); background: var(--table-head); color: var(--text); font-weight: 500; text-align: right; }
.gal-views th:first-child { border-top-left-radius: var(--radius-md); }
.gal-views th:last-child { border-top-right-radius: var(--radius-md); }
.gal-views td { padding: 10px var(--space-3); border-bottom: 1px solid var(--rule); text-align: right; font-variant-numeric: tabular-nums; }
.gal-views th:first-child, .gal-views td:first-child { text-align: left; }
.gal-baseline { font-weight: 700; margin: var(--space-3) 0 6px; }
.gal-script h3 { margin: 0 0 var(--space-2); font-size: var(--text-lg); }
.gal-lines { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: var(--text-md); line-height: 1.5; }
.gal-stage { display: inline-block; padding: 1px 8px; border-radius: var(--radius-lg); background: var(--brand-bg); color: var(--brand-ink); font-size: var(--text-xs); font-weight: 500; }
@media (max-width: 760px) {
  .gal-panel-grid { grid-template-columns: 1fr; }
}

/* 20261020-alalshow-sf5-my-materials
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 소재 카드·채널 결과는 흰 칸+그림자(테두리 없음), 결과 안 카드는 1px 선 하나,
   그룹 탭은 칩(흰 바탕+그림자 · 고른 그룹 파랑), 펼친 칸(새 그룹·옮기기)은 8px + 그림자 */
.saved-form { background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); padding: var(--space-4) 20px; margin: var(--space-4) 0; display: grid; gap: var(--space-2); }
.saved-fields { display: grid; gap: var(--space-2); max-width: 960px; }
.saved-form .field { display: grid; gap: var(--space-1); font-size: var(--text-md); font-weight: 500; }
.saved-form input[type="text"], .saved-form textarea, .saved-pop-form input[type="text"] { width: 100%; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-weight: 400; background: var(--paper); }
.saved-form-row { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.saved-form .field-inline { display: flex; align-items: center; gap: var(--space-2); }
.saved-select { min-height: var(--btn-h); padding: 6px 10px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; background: var(--paper); }
.saved-hint { margin: 0; font-size: var(--text-sm); }
.saved-scan:empty { display: none; }
.saved-scan { margin: 0 0 var(--space-4); }
.saved-scan-box { background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); padding: var(--space-4) 20px; }
.saved-scan-head h2 { margin: 0 0 var(--space-1); font-size: var(--text-lg); font-weight: 700; }
.saved-scan-head p { margin: 0; }
.saved-cache-note { margin-top: 6px !important; font-size: var(--text-sm); color: var(--warn-ink); font-weight: 500; }
.saved-scan-msg { margin: 10px 0 0; }
.saved-scan-list, .saved-list { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; gap: var(--space-3); }
.saved-main { margin-top: var(--space-2); }
.saved-notice { margin: 0 0 var(--space-3); }
.saved-toolbar { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); flex-wrap: wrap; }
.saved-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.saved-tab { display: inline-flex; align-items: center; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); text-decoration: none; font-size: var(--text-md); font-weight: 400; line-height: 21px; white-space: nowrap; }
.saved-tab:hover { background: var(--brand-bg-soft); color: var(--brand); }
.saved-tab[aria-current="page"], .saved-tab[aria-current="page"]:hover { background: var(--brand); color: var(--paper); }
.saved-group-tools { display: flex; gap: 6px; align-items: flex-start; flex-wrap: wrap; }
.saved-pop, .saved-move { position: relative; }
.saved-pop > summary, .saved-move > summary { list-style: none; }
.saved-pop > summary::-webkit-details-marker, .saved-move > summary::-webkit-details-marker { display: none; }
.saved-pop-form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 260px; display: grid; gap: var(--space-2); padding: var(--space-3); background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-2); }
.saved-pop-form .field { display: grid; gap: var(--space-1); font-size: var(--text-sm); font-weight: 500; }
.saved-card, .saved-scan-card { display: grid; grid-template-columns: 72px 1fr; gap: 14px; background: var(--paper); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); }
.saved-card { box-shadow: var(--shadow-1); }
.saved-scan-card { border: 1px solid var(--rule); }
.saved-thumb { display: block; width: 72px; height: 128px; border-radius: var(--radius-btn); overflow: hidden; background: var(--muted-bg); }
.saved-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.saved-thumb-empty { display: flex; align-items: center; justify-content: center; height: 100%; font-size: var(--text-xs); font-weight: 700; color: var(--text-muted); }
.saved-body { min-width: 0; display: grid; gap: var(--space-1); align-content: start; }
.saved-title { margin: 0; font-size: var(--text-lg); font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.saved-title a { text-decoration: none; }
.saved-title a:hover { color: var(--brand); }
.saved-meta, .saved-memo, .saved-failed, .saved-badges { margin: 0; font-size: var(--text-sm); }
.saved-meta { color: var(--text-muted); }
.saved-memo { background: var(--ground); border-radius: var(--radius-btn); padding: 6px 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.saved-actions { display: flex; gap: 6px; align-items: center; margin-top: var(--space-1); flex-wrap: wrap; }
.saved-move-menu { position: absolute; left: 0; top: calc(100% + 4px); z-index: 20; list-style: none; margin: 0; padding: 6px; min-width: 160px; background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-2); }
.saved-move-option { width: 100%; text-align: left; padding: 7px 12px; border: 0; background: transparent; border-radius: var(--radius-btn); font: inherit; line-height: 21px; cursor: pointer; }
.saved-move-option:hover { background: var(--ground); color: var(--brand); }
.saved-take { display: flex; gap: 6px; align-items: center; }
.saved-empty { margin: var(--space-5) 0; padding: var(--space-6) var(--space-4); text-align: center; color: var(--text-muted); background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); }
.saved-dialog { border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-2); padding: 20px 24px; max-width: 360px; }
.saved-dialog::backdrop { background: rgba(20, 20, 24, 0.35); }
.saved-dialog p { margin: 0 0 14px; font-weight: 500; }
.saved-dialog-actions { display: flex; gap: var(--space-2); justify-content: flex-end; }
/* 20261020-alalshow-sf5-china-search — 중국 소재 검색 (SR-CN-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 플랫폼 고르기는 칩(흰 바탕+그림자 35px · 고른 것 파랑),
   검색칸은 공용 입력칸(35 · 5px), 권리 확인은 info 알림 칸, 빈 결과는 흰 칸, 베이지 바탕 없음 */
.cn-page { display: flex; flex-direction: column; gap: var(--space-4); }
.cn-page .page-head p { margin: 0; }
.cn-page > .card, .cn-page .cnt-tools > .card { margin-bottom: 0; }
.cn-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.cn-badge { display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-sm); font-weight: 500; background: var(--info-bg); color: var(--info-ink); }
.cn-badge[data-tone="good"] { background: var(--good-bg); color: var(--good-ink); }
.cn-badge[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.cn-badge[data-tone="danger"] { background: var(--danger-bg); color: var(--danger-ink); }
.cn-form { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; }
.cn-tabs { display: inline-flex; flex-wrap: wrap; gap: 6px; align-self: flex-start; }
.cn-tab { position: relative; display: inline-flex; flex-direction: column; cursor: pointer; }
.cn-tab input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.cn-tab span { display: inline-block; font-size: var(--text-md); font-weight: 400; color: var(--text); }
.cn-tab .cn-tab-face { min-height: var(--btn-h); padding: 7px 12px; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); line-height: 21px; }
.cn-tab:hover .cn-tab-face { background: var(--brand-bg-soft); color: var(--brand); }
.cn-tab input:checked + .cn-tab-face, .cn-tab:hover input:checked + .cn-tab-face { background: var(--brand); color: var(--paper); }
.cn-tab input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 1px; }
.cn-search-row { display: flex; gap: var(--space-2); align-items: flex-start; flex-wrap: wrap; max-width: 960px; }
.cn-keyword { flex: 1 1 280px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font-size: var(--text-md); }
.cn-msg:empty { display: none; }
.cn-msg .flash { margin: 0; }
.cn-trace-link { font-weight: 700; }
.cn-consent { display: flex; gap: var(--space-2); align-items: flex-start; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--text); font-size: var(--text-md); line-height: 1.5; cursor: pointer; }
.cn-consent input { margin-top: 3px; accent-color: var(--brand); }
.cn-consent em { font-style: normal; color: var(--text-muted); }
.cn-results-head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--space-3); }
.cn-pbadge { display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-xs); font-weight: 500; background: var(--brand-bg); color: var(--brand-ink); }
.cn-pbadge[data-platform="douyin"] { background: var(--muted-bg); color: var(--text); }
.cn-pbadge[data-platform="bilibili"] { background: var(--info-bg); color: var(--info-ink); }
.cn-empty { padding: 28px; text-align: center; color: var(--text-muted); background: var(--paper); border-radius: var(--radius-md); box-shadow: var(--shadow-1); }
.cn-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--space-4); }
.cn-card { margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.cn-thumb { position: relative; aspect-ratio: 1 / 1; background: var(--muted-bg); display: flex; align-items: center; justify-content: center; }
.cn-thumb-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cn-thumb-empty { font-size: var(--text-sm); color: var(--text-muted); }
.cn-card-badge { position: absolute; top: 8px; left: 8px; }
.cn-card-body { padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); }
.cn-title { margin: 0; font-size: var(--text-md); line-height: 1.4; font-weight: 500; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cn-meta { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
.cn-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.cn-orig { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cn-orig-msg { font-size: var(--text-xs); color: var(--danger-ink); line-height: 1.45; }
.cn-note { margin: 0; font-size: var(--text-xs); color: var(--good-ink); }
.cn-note:empty { display: none; }
.cn-note .flash { margin: 0; font-size: var(--text-xs); padding: 6px 8px; }
.cn-footer { font-size: var(--text-sm); margin: 0; }

/* 20261020-alalshow-sf5-subtitle-erase — 자막 지우기 (SR-ERS-01) */
.ers-page { display: flex; flex-direction: column; gap: 14px; }
.ers-page .page-head p { margin: 0; }
.ers-top { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; }
.ers-key { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; padding: 14px 16px; flex: 1 1 320px; }
/* 묶음 A: 글자 방법 탭은 작업 줄 버튼 모양(베이지 바탕 → 없음) · 단계 꼬리표 · 처리 방식 칸은 1px 선 하나 */
.ers-key h2 { font-size: var(--text-lg); margin-right: 4px; }
.ers-remaining { display: flex; align-items: center; }
.ers-badge { display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-sm); font-weight: 500; background: var(--info-bg); color: var(--info-ink); }
.ers-badge[data-tone="good"] { background: var(--good-bg); color: var(--good-ink); }
.ers-badge[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.ers-badge[data-tone="danger"] { background: var(--danger-bg); color: var(--danger-ink); }
.ers-badge[data-tone="muted"] { background: var(--muted-bg); color: var(--muted-ink); }
.ers-form-card { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.ers-input { display: flex; flex-direction: column; gap: 10px; }
.ers-tabs { display: inline-flex; flex-wrap: wrap; gap: var(--space-1); align-self: flex-start; }
.ers-input input[type="url"] { max-width: 960px; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); font-family: var(--font-mono); }
.ers-upload-form { margin: 0; }
.ers-upload:empty { display: none; }
.ers-uploaded { margin: 0; font-size: var(--text-md); }
.ers-limits { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
.ers-form { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.ers-form .btn-primary { align-self: flex-start; }
.ers-msg:empty { display: none; }
.ers-msg .flash, .ers-upload .flash { margin: 0; }
.ers-current:empty { display: none; }
.ers-card { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.ers-card-head { display: flex; align-items: center; gap: 10px; }
.ers-steps { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; counter-reset: ers; }
.ers-steps li { counter-increment: ers; font-size: var(--text-sm); padding: 3px 8px; border-radius: var(--radius-lg); background: var(--muted-bg); color: var(--muted-ink); }
.ers-steps li::before { content: counter(ers) ". "; }
.ers-steps li[data-state="done"] { background: var(--good-bg); color: var(--good-ink); }
.ers-steps li[data-state="current"] { background: var(--brand); color: var(--paper); font-weight: 500; }
.ers-progress-text { margin: 0; font-weight: 500; }
.ers-meta { margin: 0; font-size: var(--text-sm); }
.ers-meta:empty { display: none; }
.ers-fail { display: flex; flex-direction: column; gap: 4px; color: var(--danger-ink); }
.ers-fail p { margin: 0; }
.ers-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ers-side { margin: 0; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.ers-side figcaption { font-weight: 500; font-size: var(--text-md); }
.ers-video { width: 100%; max-height: 420px; background: #111; border-radius: var(--radius-md); }
.ers-recent { margin: 0; }
.ers-recent h2 { margin-bottom: var(--space-3); }
.ers-recent-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ers-recent-row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--rule); font-size: var(--text-md); }
.ers-recent-row[data-status="failed"] .ers-recent-line { color: var(--danger-ink); }
.ers-empty { margin: 0; font-size: var(--text-md); }
@media (max-width: 720px) { .ers-compare { grid-template-columns: 1fr; } }

/* 20261020-alalshow-sf5-youtube-upload
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 완성 영상·올린 기록 표는 공용 표(kit-table = 분석기 표 모양) 그대로 — 옛 머리 규칙(#FAFAFA·600·13px·안쪽 9px)을 지웠다.
   제목·설명·태그 양식 칸은 960px까지 (칸 자체는 전체 폭) */
.page-upload .upl-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.upl-conn-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: var(--space-3) 0; font-weight: 500; }
.upl-conn-notice { margin: var(--space-3) 0 0; }
.upl-table { margin-top: 0; }
.upl-table td { vertical-align: middle; }
.upl-table .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.upl-table tr[aria-current="true"] td { background: var(--brand-bg-soft); }
.upl-form { display: flex; flex-direction: column; gap: var(--space-3); }
.upl-form h2 { margin-top: var(--space-2); }
.page-upload .upl-form > :is(.field, .upl-desc, .field-note, .field-error, .msg, .upl-picked) { max-width: 960px; }
.upl-form > p.field-note { margin: 0; }
.upl-card > p { margin: 0 0 var(--space-2); }
.upl-picked { margin: 0; }
.upl-desc { display: flex; flex-direction: column; gap: var(--space-2); }
.upl-desc .btn { align-self: flex-start; }
.upl-desc textarea { min-height: 150px; }
.upl-submit-row { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); margin-top: 6px; }
.upl-card .bar { margin: var(--space-3) 0 6px; }
.upl-progress { font-variant-numeric: tabular-nums; margin: 0; font-weight: 500; }
.upl-card .notice { margin-top: 8px; }
.fake-google-scopes { font-size: 13px; color: var(--muted); word-break: break-all; }
.fake-google form { display: flex; flex-direction: column; gap: 8px; }

/* 20261020-alalshow-sf5-product-trace — 제품 영상찾기 (SR-TRC-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 분석기 톤 — 카드 제목 16px · 진행 칸은 칸 안의 흐린 바탕(점선 없음) · 안내 줄은 색조 디자인 값 · 제품 이름 20px/700 */
.trace-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); margin-bottom: 18px; }
.trace-remaining { font-size: var(--text-md); padding: 6px 12px; white-space: nowrap; }
.trace-not-ready { display: block; margin: 0 0 var(--space-4); }
.trace-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-4); align-items: start; }
.trace-wide { grid-column: 1 / -1; }
.trace-card h2 { margin: 0 0 var(--space-3); font-size: var(--text-lg); font-weight: 700; }
.trace-find, .trace-kw-form, .trace-find-form { display: flex; flex-direction: column; gap: var(--space-3); }
.trace-kw-form, .trace-find-form { max-width: 960px; }
.trace-find .quota-btn, .trace-kw-actions .quota-btn { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); }
.trace-result { min-height: 112px; }
.trace-empty { margin: 0; font-size: var(--text-md); }
.trace-running { border-radius: var(--radius-md); background: var(--ground); padding: var(--space-3) var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); }
.trace-running-head { display: flex; align-items: center; gap: var(--space-2); }
.trace-progress-text { margin: 0; font-weight: 500; font-size: var(--text-md); }
.trace-steps { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; flex-wrap: wrap; font-size: var(--text-xs); }
.trace-steps li { padding: 3px 8px; border-radius: var(--radius-lg); background: var(--muted-bg); color: var(--muted-ink); }
.trace-steps li[data-state="current"] { background: var(--brand); color: var(--paper); font-weight: 500; }
.trace-steps li[data-state="done"] { background: var(--good-bg); color: var(--good-ink); }
.trace-found { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); }
.trace-product { margin: 0; font-size: var(--text-2xl); font-weight: 700; line-height: 30px; }
.trace-alts { margin: 0; padding-left: 18px; font-size: var(--text-md); }
.trace-found[data-confidence="low"] .trace-alts { background: var(--warn-bg); border-radius: var(--radius-btn); padding: 8px 10px 8px 26px; }
.trace-evidence { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
.trace-message { margin: 0; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); font-size: var(--text-md); font-weight: 500; background: var(--info-bg); color: var(--info-ink); }
.trace-failed { border-color: var(--danger-line); background: var(--danger-bg); color: var(--danger-ink); }
.trace-kw-actions { display: flex; align-items: center; gap: 10px; }
.trace-link-bar { display: flex; flex-wrap: wrap; gap: 6px; }
.trace-link { text-decoration: none; }
.trace-link:disabled { background: var(--ground); box-shadow: none; }
.trace-link-notes { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-1) 14px; font-size: var(--text-xs); color: var(--text-muted); }
.trace-find-actions { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.trace-find-msg { font-size: var(--text-md); font-weight: 500; color: var(--good-ink); }
.trace-find-msg[data-tone="bad"] { color: var(--danger-ink); }
.trace-find-count { margin-left: auto; font-size: var(--text-xs); }
.trace-find-empty { margin: var(--space-3) 0 0; font-size: var(--text-md); }
.trace-find-list { margin: var(--space-3) 0 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.trace-find-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-2) 0; border-bottom: 1px solid var(--rule); font-size: var(--text-md); }
.trace-find-line { color: var(--text); text-decoration: none; overflow-wrap: anywhere; }
.trace-find-line:hover { color: var(--brand); text-decoration: underline; }
@media (max-width: 860px) { .trace-grid { grid-template-columns: minmax(0, 1fr); } }

/* 20261020-alalshow-sf5-capcut-export — 캡컷 내보내기 (MK-CAP-01) · 캡컷 연동 카드 (PF-SET-01)
   20261026-alalshow-sf5-viewfinder-tone (묶음 C): 완성 영상 표는 공용 표(분석기 표 모양) 그대로 — 옛 머리 규칙(흐린 600 13px · 안쪽 8px)을 지웠다.
   진행 단계·결과·안내는 색조 디자인 값(직접 색 없음) · 둥글기 6·8, 내 컴퓨터 고르기는 고른 것 = 파랑 버튼, 설치 단계는 칸 안 흐린 바탕 줄 */
.capcut-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--gap); flex-wrap: wrap; }
.capcut-renders { margin: 0 0 var(--space-4); }
.capcut-renders td { vertical-align: middle; }
.capcut-pick form > .btn { margin-right: 10px; }
.capcut-card h2 { display: flex; flex-wrap: wrap; gap: var(--space-1) 10px; align-items: baseline; margin-bottom: var(--space-3); }
.capcut-card-title { font-size: var(--text-md); font-weight: 400; }
.capcut-steps { display: flex; flex-wrap: wrap; gap: var(--space-1); list-style: none; padding: 0; margin: 0 0 var(--space-3); }
.capcut-steps li { padding: 3px 10px; border-radius: var(--radius-btn); border: 1px solid var(--rule); background: var(--ground); font-size: var(--text-sm); line-height: 20px; color: var(--text-muted); }
.capcut-steps li[aria-current="step"] { border-color: var(--brand); background: var(--brand); color: var(--paper); font-weight: 500; }
.capcut-steps li[data-done="true"] { color: var(--good-ink); border-color: var(--good-line); background: var(--good-bg); }
.capcut-progress-text { margin: var(--space-2) 0 0; font-size: var(--text-sm); color: var(--text-muted); }
.capcut-summary { margin: 0 0 var(--space-2); font-weight: 500; }
.capcut-issues { margin: var(--space-2) 0; padding-left: 18px; color: var(--danger-ink); font-size: var(--text-md); }
.capcut-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0 var(--space-2); }
.capcut-disclaimer { font-size: var(--text-xs); margin: var(--space-2) 0 0; }
.capcut-result { margin-top: var(--space-3); padding: 12px 18px; border-radius: var(--radius-md); border: 1px solid var(--rule); background: var(--ground); }
.capcut-result h3 { margin: 0 0 var(--space-1); font-size: var(--text-md); }
.capcut-result p { margin: 0; font-weight: 500; }
.capcut-result[data-tone="good"] { border-color: var(--good-line); background: var(--good-bg); color: var(--good-ink); }
.capcut-result[data-tone="warn"] { border-color: var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); }
.capcut-result[data-tone="danger"] { border-color: var(--danger-line); background: var(--danger-bg); color: var(--danger-ink); }
.capcut-open-link { display: inline-block; margin-top: 6px; font-size: var(--text-sm); }
.capcut-notice { margin: 0; padding: 12px 18px; border-radius: var(--radius-md); font-size: var(--text-md); font-weight: 500; background: var(--ground); border: 1px solid var(--rule); }
.capcut-notice[data-tone="danger"] { background: var(--danger-bg); border-color: var(--danger-line); color: var(--danger-ink); }
.capcut-notice[data-tone="warn"] { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn-ink); }
.capcut-verdict, .capcut-delivery .key-badge, .capcut-bridge .key-badge, .capcut-badge { font-size: var(--text-sm); padding: 3px 8px; white-space: normal; }
.capcut-os { display: inline-flex; gap: var(--space-1); }
.capcut-install-steps { margin: var(--space-3) 0; padding-left: 0; list-style: none; display: grid; gap: var(--space-2); font-size: var(--text-md); }
/* 설치 단계 한 줄 = 칸 안의 칸: 흐린 바탕 · 8px (테두리·그림자 없음) */
.capcut-install-steps li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); padding: 10px 12px; border-radius: var(--radius-md); background: var(--ground); }
.capcut-install-steps code { background: var(--paper); border: 1px solid var(--rule); border-radius: var(--radius-sm); padding: 4px 8px; font-size: var(--text-xs); word-break: break-all; }
.capcut-device { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--rule); }
.capcut-device h3 { margin: 0 0 var(--space-1); font-size: var(--text-md); }
.capcut-device p { margin: 0; font-size: var(--text-md); }
.capcut-top-badges { display: flex; gap: var(--space-2); margin-bottom: var(--space-3); }
/* 캡컷으로 보내기의 접은 설치 안내 안: 연동 카드는 칸 안의 칸 — 그림자·바깥 여백 없이, 버튼 줄 아래 빈 64px 없앰 */
.capcut-guide .capcut-bridge { margin: 0; padding: 0; box-shadow: none; }
.page-capcut .capcut-bridge .settings-actions { padding: 0; }
.page-capcut .capcut-bridge > p { margin: 0; }
.page-capcut .capcut-card > p { margin: 0 0 var(--space-2); }

/* 20261020-alalshow-sf5-source-cut-edit — 영상소스 담기·AI 컷 편집 (MK-CLP-01) */
.clip-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
/* 묶음 A: 표는 분석기 표(scene-table 묶음) · 눌린 단추는 파랑(components .btn[aria-pressed]) · 장면 칸은 흐린 바탕 */
.clip-badge { display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-sm); font-weight: 500; background: var(--info-bg); color: var(--info-ink); white-space: nowrap; }
.clip-badge[data-tone="good"] { background: var(--good-bg); color: var(--good-ink); }
.clip-badge[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.clip-badge[data-tone="danger"] { background: var(--danger-bg); color: var(--danger-ink); }
.clip-badge[data-tone="muted"] { background: var(--muted-bg); color: var(--muted-ink); }
.clip-remaining { font-size: var(--text-sm); }
.clip-source { display: flex; flex-wrap: wrap; gap: var(--space-5); margin: 0 0 var(--space-4); }
.clip-source dt { font-size: var(--text-xs); color: var(--text-muted); }
.clip-source dd { margin: 2px 0 0; font-weight: 500; }
.clip-toggle { display: inline-flex; gap: var(--space-1); }
.clip-paras td { vertical-align: middle; }
.clip-toggle .btn[aria-pressed="true"] { background: var(--brand); color: var(--paper); }
.clip-collect { display: flex; flex-direction: column; gap: 14px; }
.clip-block { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-2); padding-top: var(--space-3); border-top: 1px solid var(--rule); }
.clip-block:first-of-type { border-top: 0; padding-top: 0; }
.clip-block .field { flex: 1 1 320px; max-width: 960px; display: flex; flex-direction: column; gap: 6px; font-size: var(--text-md); font-weight: 500; }
.clip-block textarea, .clip-kw input[type="text"] { width: 100%; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-weight: 400; }
.clip-check { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-md); }
.clip-auto-state { font-size: var(--text-xs); color: var(--text-muted); }
.clip-msg { flex-basis: 100%; font-size: var(--text-sm); }
.clip-msg:empty { display: none; }
.clip-msg p { margin: 2px 0; }
.clip-msg[data-tone="warn"] { color: var(--warn-ink); }
.clip-msg[data-tone="good"] { color: var(--good-ink); }
.clip-find, .clip-kw { flex-wrap: wrap; }
.clip-kw { display: flex; align-items: flex-end; gap: 8px; flex: 1 1 360px; }
.clip-search { flex-basis: 100%; }
.clip-hits { list-style: none; margin: 0 0 var(--space-2); padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: var(--text-md); }
.clip-hit-kind { font-weight: 500; }
.clip-name { max-width: 260px; overflow-wrap: anywhere; }
.clip-state { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.clip-state .state-box { width: 100%; min-width: 180px; }
.clip-error { color: var(--danger-ink); font-size: var(--text-xs); }
.clip-note { color: var(--warn-ink); font-size: var(--text-xs); }
.clip-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.clip-scenes { background: var(--ground); border-radius: var(--radius-md); padding: var(--space-3); }
.clip-scenes-title { margin: 0 0 6px; font-weight: 500; font-size: var(--text-sm); }
.clip-scene-list, .clip-cands { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: var(--text-sm); }
.clip-scene, .clip-cand label { display: flex; align-items: center; gap: 10px; }
.clip-scene img, .clip-cand img { width: 54px; height: 96px; object-fit: cover; border-radius: var(--radius-btn); background: var(--rule); flex: none; }
.clip-cand span { display: flex; flex-direction: column; gap: 2px; }
.clip-main-actions, .clip-review-actions, .clip-pick-actions, .clip-confirmed, .clip-review-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-3); }
.clip-review-row[hx-get] { cursor: pointer; }
.clip-review-row:hover { background: var(--ground); }
.clip-review-row.is-open { background: var(--brand-bg-soft); }
.clip-pick { margin-top: var(--space-3); display: flex; flex-direction: column; gap: var(--space-3); box-shadow: none; border: 1px solid var(--rule); }
.clip-pick h3 { margin: 0; font-size: var(--text-lg); }
.clip-pick .field { display: flex; flex-direction: column; gap: 4px; font-size: var(--text-md); font-weight: 500; max-width: 220px; }
.clip-pick input[type="number"] { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; }
.clip-session-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
@media (max-width: 760px) { .clip-head { flex-direction: column; } .clip-name { max-width: 160px; } }

/* 20261020-alalshow-sf5-auto-video: 쇼츠 자동 제작 MK-AUTO-01 (제작 요청 · 진행·확인 지점 · 내 작업 전체) */
/* 묶음 A: 고르기 줄 = 작업 줄 버튼 모양(라디오는 그대로 보임 · 고른 것 = 파랑 바탕 흰 글) · 전체 작업 표는 공용 표(K10) 그대로 */
.auto-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.auto-badges .capcut-top-badges:empty { display: none; }
.auto-settings-badge { text-decoration: none; }
.auto-form { display: flex; flex-direction: column; gap: var(--space-4); }
.auto-tabs { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-2); }
.auto-tab { display: inline-flex; align-items: center; gap: 6px; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); font-size: var(--text-md); line-height: 21px; cursor: pointer; }
.auto-tab:hover { background: var(--brand-bg-soft); }
.auto-tab input { margin: 0; accent-color: var(--brand); }
.auto-tab:has(input:checked) { background: var(--brand); color: var(--paper); }
.auto-tab:has(input:checked) input { accent-color: var(--paper); }
.auto-tab:has(input:disabled) { opacity: 0.5; cursor: not-allowed; }
.auto-form textarea { padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; line-height: 1.6; resize: vertical; }
.auto-form .auto-input > .field, .auto-form .auto-input > .field-note, .auto-form .detail-reader, .auto-form .script-photo-drop { max-width: 960px; }
.auto-input[hidden], .auto-voice-file[hidden], .auto-warn[hidden] { display: none; }
.auto-submit, .auto-pager, .auto-cp-actions, .auto-stop, .auto-status-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.auto-banner { border-radius: var(--radius-md); padding: 12px 18px; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.auto-banner p { margin: 0; font-weight: 500; }
.auto-banner[data-tone="danger"] { background: var(--danger-bg); color: var(--danger-ink); }
.auto-banner[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.auto-voice-note { color: var(--info-ink); font-size: var(--text-md); font-weight: 500; }
.auto-checkpoint { display: flex; flex-direction: column; gap: var(--space-3); }
.auto-script-lines { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: var(--space-2); max-width: 960px; }
.auto-msg { margin: 0; font-size: var(--text-md); }
.auto-msg[data-tone="warn"] { color: var(--warn-ink); }
.auto-msg[data-tone="good"] { color: var(--good-ink); }
.auto-video { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.auto-video video { background: #111; border-radius: var(--radius-md); max-width: 100%; height: auto; }
.auto-passed-list, .auto-record-list { margin: var(--space-3) 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; font-size: var(--text-md); }
.auto-records summary { cursor: pointer; font-size: var(--text-lg); font-weight: 700; }
.auto-table td { vertical-align: middle; }
.auto-deleted { font-size: var(--text-sm); }

/* 20261020-alalshow-sf5-admin-ops — 관리자 수집 · 유튜브 할당량 (AD-ADM-07·08) */
.yt-budget-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.yt-title { font-size: 16px; margin: 0; }
.yt-budget td.yt-cap { width: 24%; }
.yt-budget .yt-total th, .yt-budget .yt-total td { background: var(--ground); font-weight: 700; }
.yt-budget .field-error { display: block; margin-top: 4px; text-align: left; }
.yt-line { margin: 10px 0 0; font-size: var(--text-md); }
.yt-reserve { margin-top: 12px; }
.yt-reserve .field { display: flex; flex-direction: column; gap: 6px; font-size: var(--text-md); font-weight: 500; }
.collect-section { display: flex; flex-direction: column; gap: 12px; }
.collect-title { font-size: var(--text-lg); margin: 0; }
.collect-subtitle { font-size: var(--text-md); margin: 6px 0 0; color: var(--text-muted); }
.collect-keywords { width: 100%; max-width: 520px; padding: 8px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-weight: 400; line-height: 1.5; resize: vertical; }
.collect-keywords[aria-invalid="true"] { border-color: var(--danger-ink); background: var(--danger-bg); }
.collect-warn { color: var(--warn-ink); font-weight: 500; }
.collect-note { margin: 0; font-size: var(--text-sm); color: var(--text); }
#trend-run-line { margin: 0; font-weight: 600; }

/* 20261020-alalshow-sf5-security-hardening */
/* htmx 기본 표시기 스타일 (CSP 때문에 htmx가 <style>을 넣지 않게 끄고 여기에 둔다) */
.htmx-indicator { opacity: 0; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; transition: opacity 200ms ease-in; }
/* 내 소재함 카드 출처 줄 */
.saved-source { margin: 0; font-size: 12px; }

/* 20261020-alalshow-sf5-erase-local — 자막 지우기 처리 방식·가릴 영역 (SR-ERS-01) */
.ers-modes, .ers-effects { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.ers-modes { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.ers-modes legend, .ers-effects legend { font-weight: 500; font-size: var(--text-md); margin-bottom: var(--space-2); padding: 0; }
.ers-choice { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); cursor: pointer; }
.ers-choice:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; background: var(--brand-bg-soft); }
.ers-choice input { margin-top: 3px; accent-color: var(--brand); }
.ers-choice-text { display: flex; flex-direction: column; gap: 2px; font-size: var(--text-md); }
.ers-choice-text .muted { font-size: var(--text-sm); }
.ers-mode[data-disabled] { cursor: not-allowed; background: var(--ground); }
.ers-mode[data-disabled] strong { color: var(--text-muted); }
.ers-mode-note { font-size: var(--text-sm); font-weight: 500; color: var(--warn-ink); }
.ers-mode-line { margin: 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); font-size: var(--text-md); font-weight: 500; }
.ers-local { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--ground); }
.ers-local[hidden] { display: none; }
.ers-local h3 { margin: 0; font-size: var(--text-lg); }
.ers-local-help { margin: 0; font-size: var(--text-sm); }
.ers-local-grid { display: grid; grid-template-columns: minmax(160px, 220px) minmax(0, 1fr); gap: 16px; align-items: start; }
.ers-frame { position: relative; width: 100%; aspect-ratio: 9 / 16; background: var(--text); border-radius: var(--radius-md); overflow: hidden; cursor: crosshair; touch-action: none; user-select: none; }
.ers-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; }
.ers-region-box { position: absolute; border: 2px dashed #ffd166; background: rgba(255, 209, 102, 0.28); pointer-events: none; }
.ers-frame-note { position: absolute; left: 10px; right: 10px; bottom: 10px; margin: 0; font-size: 12px; color: #d8dbe2; text-align: center; pointer-events: none; }
.ers-local-controls { display: flex; flex-direction: column; gap: 10px; }
.ers-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.ers-region-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ers-region-fields .field { display: flex; flex-direction: column; gap: 4px; font-size: var(--text-sm); }
.ers-region-fields input { width: 100%; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); }
.ers-region-summary { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
.ers-band-color { display: flex; align-items: center; gap: var(--space-2); font-size: var(--text-md); }
.ers-band-color select { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); }
@media (max-width: 720px) { .ers-local-grid { grid-template-columns: 1fr; } .ers-region-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 20261020-alalshow-sf5-keyless-ux — 꺼진 기능 안내 카드 · 갤러리 링크 담기 · 수동 업로드 · 외부 서비스 표 */
.keyless-notes { display: grid; gap: 12px; margin: 0 0 16px; }
/* 20261027-alalshow-sf5-notice-tone: 분석기 알림 칸(.notice 값) — 연파랑 바탕 · 1px 테두리 · 둥글기 8 · 그림자 없음 (옛 노란 바탕 · 왼쪽 4px 띠) */
.keyless-note { border: 1px solid var(--info-line); background: var(--info-bg); box-shadow: none; padding: 12px 18px; display: grid; gap: 8px; }
.keyless-note .keyless-title { font-size: 16px; margin: 0; color: var(--info-ink); }
.keyless-note p { margin: 0; }
.keyless-label { display: inline-block; font-size: 12px; font-weight: 700; color: var(--info-ink); background: var(--paper); border-radius: var(--radius-lg); padding: 2px 8px; margin-right: 6px; }
.keyless-links { display: flex; flex-wrap: wrap; gap: 8px; }
.keyless-enable { font-size: 13px; }
.gal-keyless { display: grid; gap: 12px; margin: 12px 0; }
.gal-kw, .gal-link { display: grid; gap: 8px; }
.gal-kw { grid-template-columns: 1fr auto; align-items: end; }
.gal-link h2 { font-size: 16px; margin: 0; }
.gal-link-msg-slot:empty { display: none; }
.upl-manual { display: grid; gap: 10px; }
.upl-manual-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.upl-copy-row { display: grid; grid-template-columns: 1fr auto; gap: var(--space-2); align-items: end; max-width: 960px; }
.upl-copy-row textarea { width: 100%; }
.upl-manual-steps { margin: 0; padding-left: 0; list-style: none; display: grid; gap: 4px; font-size: 14px; }
.saved-scan-off { display: grid; gap: 8px; }
.admin-services { display: grid; gap: 14px; }
.admin-services-table td { vertical-align: top; }
.service-how { font-size: 12px; white-space: normal; word-break: break-all; }
.admin-trial { display: grid; gap: 8px; max-width: 420px; justify-items: start; }
.admin-trial .field { justify-self: stretch; }
.admin-trial h2 { font-size: 16px; margin: 0; }

/* 20261020-alalshow-sf5-cn-fallback — 중국 소재 검색 [바로가기·링크로 받기] 탭
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 상태 줄은 색조 알림 칸(8px), 검색 방식 탭은 글 탭 줄(고른 탭 파랑 + 아래 1px), 양식 칸 최대 폭 960px */
.cn-mode { margin: 0; padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); font-size: var(--text-md); font-weight: 500; line-height: 1.5; }
.cn-mode[data-state="ready"] { border-color: var(--good-line); background: var(--good-bg); color: var(--good-ink); }
.cn-mode[data-state="degraded"] { border-color: var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); }
.cn-page-tabs { display: flex; flex-wrap: wrap; gap: var(--space-1); box-shadow: inset 0 -1px 0 var(--rule); }
.cn-page-tab { display: inline-flex; align-items: center; padding: var(--space-2) var(--space-3); border-bottom: 1px solid transparent; font-size: var(--text-md); font-weight: 500; line-height: 21px; color: var(--text-muted); text-decoration: none; white-space: nowrap; }
.cn-page-tab:hover { color: var(--brand); }
.cn-page-tab[aria-current="page"] { color: var(--brand); border-bottom-color: var(--brand); }
.cnt-tools { display: flex; flex-direction: column; gap: var(--space-4); }
.cnt-download { display: flex; flex-direction: column; gap: var(--space-4); }
.cnt-card { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; }
.cnt-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cnt-card-head h2 { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.cnt-field { display: flex; flex-direction: column; gap: 6px; max-width: 960px; font-size: var(--text-md); font-weight: 500; }
.cnt-field input, .cnt-field textarea { padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; font-weight: 400; }
.cnt-field textarea { resize: vertical; line-height: 1.5; }
.cnt-row { display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; }
.cnt-msg:empty { display: none; }
.cnt-msg .flash { margin: 0; }
.cnt-links { display: flex; flex-direction: column; gap: 6px; }
.cnt-shortcuts { display: flex; flex-wrap: wrap; gap: 6px; }
.cnt-links-note, .cnt-links-reason, .cnt-support { margin: 0; font-size: var(--text-sm); line-height: 1.5; }
.cnt-links-reason { color: var(--warn-ink); }
.cnt-empty { margin: 0; padding: 18px; text-align: center; }
.cnt-items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-3); }
.cnt-item { margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.cnt-item-head { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.cnt-item-title { margin: 0; font-size: var(--text-md); font-weight: 700; }
.cnt-item-link { margin: 0; font-size: var(--text-sm); word-break: break-all; }
.cnt-item-reason { margin: 0; font-size: var(--text-sm); color: var(--danger-ink); line-height: 1.45; }
.cnt-item-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cnt-inline { display: inline; margin: 0; }
.cnt-clips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 0; }
.cnt-clips select { padding: 6px 8px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font: inherit; font-size: var(--text-sm); max-width: 220px; }
.cnt-no-sessions { margin: 0; font-size: var(--text-sm); }
.cnt-note { margin: 0; font-size: var(--text-sm); color: var(--good-ink); }
.cnt-note:empty { display: none; }
.cnt-note-link { font-weight: 700; }
/* 20261020-alalshow-sf5-template-pack — 템플릿 고르기 격자 (MK-RND-01 ②): 썸네일 카드 + 색·아이콘 거르기 */
/* 묶음 A: 칩(장면 사진 고르기 · 템플릿 거르기) = 작업 줄 버튼 모양, 고른 것 = 파랑 바탕 흰 글 · 템플릿 카드는 1px 선 하나 */
.tpl-filter { display: flex; flex-direction: column; gap: var(--space-2); margin: 4px 0 var(--space-3); }
.chip-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1); }
.chip-row-label { font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); min-width: 44px; }
.chip { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); font-size: var(--text-md); font-weight: 400; line-height: 21px; cursor: pointer; user-select: none; }
.chip:hover { background: var(--brand-bg-soft); }
.chip input { margin: 0; accent-color: var(--brand); }
.chip:has(input:checked) { background: var(--brand); color: var(--paper); }
.chip:has(input:checked) input { accent-color: var(--paper); }
.chip:has(input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 2px; }
.swatch-dot { width: 12px; height: 12px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.12); display: inline-block; }
.tpl-grid { display: flex; flex-direction: column; gap: var(--space-4); }
.tpl-count { margin: 0; font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); }
.tpl-count-empty { color: var(--warn-ink); }
.tpl-section-head { margin: 0 0 4px; font-size: var(--text-md); }
.tpl-intro-note { margin: 0 0 var(--space-2); font-size: var(--text-xs); }
.tpl-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: var(--space-3); }
.tpl-card { display: flex; flex-direction: column; gap: 4px; padding: var(--space-2); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); transition: border-color 120ms ease, box-shadow 120ms ease; }
.tpl-card[hidden] { display: none; }
.tpl-card:hover { border-color: var(--brand-line); }
.tpl-card:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 2px var(--brand-line); background: var(--brand-bg-soft); }
.tpl-card .tpl-pick { flex-direction: column; align-items: stretch; gap: 3px; position: relative; }
.tpl-card .tpl-pick input[type="radio"] { position: absolute; top: 6px; left: 6px; margin: 0; accent-color: var(--accent); width: 16px; height: 16px; }
.tpl-card .tpl-thumb { width: 100%; height: auto; aspect-ratio: 9 / 16; border-radius: var(--radius-btn); }
.tpl-card .tpl-name { color: var(--text); font-size: var(--text-sm); font-weight: 500; line-height: 1.3; }
.tpl-card .tpl-id { font-size: var(--text-xs); color: var(--text-muted); font-weight: 400; }
.tpl-tags { display: inline-flex; align-items: center; gap: 4px; font-size: var(--text-xs); color: var(--text-muted); }
.tpl-badges { display: flex; flex-wrap: wrap; gap: 4px; min-height: 0; }
.tpl-badges .key-badge { font-size: var(--text-xs); padding: 2px 6px; }
/* 20261020-alalshow-sf5-legal-pages — 법적 고지 화면 (PF-LGL-01~04) · 모든 화면 바닥글 · 가입 동의 링크 */
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D): 바닥글 = 흰 띠 · 위 1px 선 · 12px 흐린 글 · 본문과 같은 x16 (링크 줄 + 도움말 한 줄, 사업자 정보는 다음 줄) */
.site-footer { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; border-top: 1px solid var(--rule); background: var(--paper); color: var(--text-muted); padding: var(--space-4) var(--space-4) var(--space-5); font-size: var(--text-xs); line-height: 18px; }
.site-footer-links { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-bottom: 0; }
.site-footer-link { color: var(--text-muted); text-decoration: none; font-size: var(--text-xs); }
.site-footer-link:hover { color: var(--brand-ink); text-decoration: underline; }
.site-footer-privacy { font-weight: 700; color: var(--brand-ink); }
.site-footer-biz { flex-basis: 100%; margin: 0; display: flex; flex-wrap: wrap; gap: 2px 14px; }
.lp-body .site-footer { max-width: 440px; margin: 0 auto; background: transparent; border-top-color: rgba(0, 0, 0, 0.12); color: inherit; opacity: 0.8; text-align: center; padding: 16px; }
.lp-body .site-footer-links, .lp-body .site-footer-biz { justify-content: center; }
.lp-body .site-footer-link { color: inherit; }
.page-legal { max-width: 860px; }
.legal { display: flex; flex-direction: column; gap: 16px; }
.legal-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.legal-tab { padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); text-decoration: none; font-size: var(--text-md); font-weight: 400; }
.legal-tab[aria-current="page"] { background: var(--brand); color: var(--paper); }
.legal-head h1 { margin: 0; font-size: var(--text-2xl); }
.legal-meta { margin: 0; color: var(--text-muted); font-size: var(--text-sm); }
/* 문서 칸(.legal.card) 안: 목차는 흐린 바탕 하나, 본문은 칸에 바로 (칸 안 칸에 테두리·그림자 겹치지 않게) */
.legal-toc { background: var(--ground); border: 0; border-radius: var(--radius-md); padding: 12px 18px; }
.legal-toc-title { margin: 0 0 6px; font-weight: 700; font-size: var(--text-md); }
.legal-toc-list { margin: 0; padding-left: 20px; columns: 2; column-gap: 28px; font-size: var(--text-sm); line-height: 1.8; }
.legal-toc-list a { text-decoration: none; }
.legal-toc-list a:hover { text-decoration: underline; }
.legal-body { background: none; border: 0; border-radius: 0; padding: 0; line-height: 1.75; font-size: var(--text-md); word-break: keep-all; overflow-wrap: anywhere; }
.legal-body h2 { font-size: var(--text-lg); margin: 26px 0 8px; scroll-margin-top: 16px; }
.legal-body h2:first-child { margin-top: 0; }
.legal-body h3 { font-size: var(--text-md); margin: 18px 0 6px; }
.legal-body p { margin: 0 0 10px; }
.legal-body ul, .legal-body ol { margin: 0 0 10px; padding-left: 22px; }
.legal-body li { margin: 2px 0; }
.legal-body a { color: var(--brand-ink); }
.legal-note { background: var(--info-bg); border: 1px solid var(--info-line); border-radius: var(--radius-md); padding: 12px 18px; color: var(--info-ink); }
.legal-table { overflow-x: auto; margin: 0 0 14px; }
.legal-table table { border-collapse: collapse; width: 100%; font-size: var(--text-sm); line-height: 1.55; }
.legal-table th, .legal-table td { border: 0; border-bottom: 1px solid var(--rule); padding: 8px 12px; text-align: left; vertical-align: top; }
.legal-table th { background: var(--table-head); font-weight: 500; white-space: nowrap; }
.legal-missing { color: var(--warn-ink); font-weight: 700; }
.check a { color: var(--brand-ink); font-weight: 500; }
.fine a { color: inherit; font-weight: 500; }
@media (max-width: 720px) { .legal-toc-list { columns: 1; } .site-footer { padding: var(--space-4); } }

/* 20261020-alalshow-sf5-discover-gaps — 영상자료 담기 · 쪽 번호 생략 · 제품 영상찾기 채우기 · 설치 안내 · 한 폴더로 모으기 */
.basket-add { display: inline-flex; margin: 0; }
.basket-flash { margin: 0; font-size: 13px; }
.basket-flash-link { margin-left: 6px; font-weight: 600; }
.gal-gap { border-color: transparent; background: transparent; color: var(--muted); cursor: default; min-width: 20px; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 B): 넘겨받은 영상 줄은 칸 안의 흐린 바탕(테두리·파란 바탕 없음), 받기 안내 제목은 칸 제목 16px */
.trace-prefill { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--ground); }
.trace-prefill-thumb { width: 54px; height: 96px; object-fit: cover; border-radius: var(--radius-btn); flex: none; }
.trace-prefill-note { margin: 0; font-size: var(--text-sm); color: var(--text); }
.trace-source { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--rule); font-size: var(--text-sm); }
.trace-source-label { font-weight: 500; }
.trace-source-link { word-break: break-all; }
.trace-basket-flash { flex-basis: 100%; }
.trace-basket-flash:empty, .trace-find-flash:empty, .dl-collect-msg:empty { display: none; }
.trace-find-item { flex-wrap: wrap; }
.trace-find-flash { flex-basis: 100%; }
.dl-guide { margin: 0 0 var(--space-4); }
.dl-guide-summary { cursor: pointer; font-size: var(--text-lg); font-weight: 700; }
.dl-guide-body { margin-top: var(--space-3); }
.dl-guide-points { margin: 6px 0 12px; padding-left: 20px; }
.dl-guide-body .capcut-bridge { margin: 0 0 10px; box-shadow: none; }
.dl-guide-after { margin: 0; font-size: var(--text-sm); }
.dl-collect { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; }
.dl-collect-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dl-collect-bar:empty { display: none; }
.dl-collect-hint, .dl-collect-last { font-size: var(--text-xs); color: var(--text-muted); }
.dl-collect-last { color: var(--good-ink); }
.dl-collect-msg { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dl-collect-msg .flash { margin: 0; }
.dl-collect-wait { font-size: var(--text-xs); }
/* 20261020-alalshow-sf5-gallery-growth — 관리자 수집 탭 "갤러리 늘리기" 구역 · 갤러리 유튜브 탭 머리 늘어나는 정도 줄 */
.grow-lines { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.grow-lines li { padding: 6px 12px; border: 0; border-radius: var(--radius-sm); background: var(--ground); overflow-wrap: anywhere; }
#grow-runs td, #grow-runs th { white-space: nowrap; }
.gal-growth { margin: 2px 0 0; font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); overflow-wrap: anywhere; }

/* 20261020-alalshow-sf5-ux-polish — 화면 다듬기: 공통 모양 맞추기 · 초점 테두리 · 휴대폰(760px 이하) 메뉴·한 열 배치 */
/* 공통: 입력 칸·버튼도 자체 글꼴, 본문 칸이 넓은 표에 밀려 넘치지 않게 */
.page img, .page video, .page iframe { max-width: 100%; }
.page pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.page-head { margin-bottom: 20px; }
.page-head p { margin: 0; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 A): 파일 고르기 단추 = 보조 버튼 (흰 바탕 · 그림자 · 테두리 없음 · 6px · 14px/400) */
input[type="file"]::file-selector-button { min-height: var(--btn-h); font: inherit; font-size: var(--text-md); font-weight: 400; line-height: 21px; padding: 7px 12px; margin-right: var(--space-3); border-radius: var(--radius-btn); border: 0; background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); cursor: pointer; }
input[type="file"]::file-selector-button:hover { background: var(--brand-bg-soft); }
/* 파일 칸 자체는 글칸 테두리 없이 (단추 + 고른 파일 이름만) */
.page .field input[type="file"] { padding: 0; border: 0; background: none; }
/* 키보드 초점: 자체 강조색 테두리 (마우스 클릭에는 나오지 않음) */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* 갤러리 필터 접기 (넓은 화면에서는 늘 펼친 채, 제목 줄 숨김) */
.gal-filters-wrap { padding: 0; margin: 0; }
.gal-filters-wrap > .gal-filters { border: 0; background: none; }
.gal-filters-toggle { display: none; }

@media (max-width: 760px) {
  /* 닫힌 메뉴 서랍 (서랍 모양·위치는 components.css 공용 틀) */
  html[data-nav="closed"] .sidebar { display: none; }
  /* 제목 줄·머리말: 오른쪽 배지·버튼은 아래로 */
  .page-head, .home-head, .setup-head, .key-card-head, .auto-head, .script-head, .render-head, .trainer-head, .appeal-head, .pln-head, .saved-head, .trends-head, .trace-head, .upl-head, .clip-head { flex-wrap: wrap; }
  /* 여러 열 격자 → 한 열 */
  .field-grid, .setup-cards, .state-gallery { grid-template-columns: minmax(0, 1fr); }
  .auto-card { grid-template-columns: minmax(0, 1fr); }
  .step-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* 표는 자기 칸 안에서만 가로로 밀기 */
  .page table { display: block; position: relative; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .page code { overflow-wrap: anywhere; }
  .inline-form, .gal-search, .dev-row { flex-wrap: wrap; }
  .inline-form input, .gal-search input[name="q"] { min-width: 0; flex: 1 1 180px; }
  .btn { min-height: 40px; }
  .btn-small { min-height: 36px; }
  .admin-tabs { flex-wrap: nowrap; overflow-x: auto; }
  .admin-tab { white-space: nowrap; }
  .gal-tabs { flex-wrap: nowrap; overflow-x: auto; }
  .gal-tab { white-space: nowrap; }
  .gal-filters-toggle { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 10px 16px; font-weight: 700; font-size: 14px; cursor: pointer; list-style: none; }
  .gal-filters-toggle::-webkit-details-marker { display: none; }
  .gal-filters-toggle::after { content: "펼치기 ▾"; color: var(--muted); font-size: 13px; font-weight: 600; }
  .gal-filters-wrap[open] > .gal-filters-toggle { border-bottom: 1px solid var(--line); }
  .gal-filters-wrap[open] > .gal-filters-toggle::after { content: "접기 ▴"; }
  .gal-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; }
  .gal-chip { white-space: nowrap; }
  .ref-panel { width: 100vw; }
  .auth-card { margin-top: 16px; padding: 22px 18px; }
}
/* ux-polish: 사이드바가 있는 중간 폭(태블릿)에서도 고정 폭 두 열이 본문을 밀어내지 않게 */
@media (max-width: 1100px) {
  .render-grid { grid-template-columns: minmax(0, 1fr); }
  .render-side { position: static; }
}
@media (max-width: 900px) {
  .voice-layout, .trainer-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  /* 표: 칸이 한 글자 폭으로 찌그러지지 않게 최소 폭을 두고, 넘치면 표 안에서만 가로로 밀기 */
  .page table th, .page table td { min-width: 5.5em; word-break: keep-all; overflow-wrap: normal; }
  .page table td code { overflow-wrap: normal; word-break: break-all; }
  .page .admin-user td:nth-child(2) { word-break: normal; white-space: nowrap; }
  .page .admin-services-table td:nth-child(3), .page .admin-services-table td:nth-child(4) { min-width: 200px; }
  .page .admin-toolbar input, .page .admin-toolbar select { min-width: 0; flex: 1 1 160px; }
  /* 템플릿·렌더: 글자 위치 칸은 이름 한 줄 + 막대·값 한 줄 */
  .slider-row { grid-template-columns: minmax(0, 1fr) 44px; row-gap: 2px; }
  .slider-row label { grid-column: 1 / -1; }
  .render-result { grid-template-columns: minmax(0, 1fr); }
  .render-video { width: 100%; max-width: 280px; }
  .tpl-cards { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); }
  /* 자막 지우기: 9:16 미리보기 틀이 화면을 다 덮지 않게 */
  .ers-frame { max-width: 260px; margin: 0 auto; }
  /* 링크 편집: 링크 줄의 버튼은 아래 줄로 */
  .lnk-row { grid-template-columns: 24px minmax(0, 1fr); }
  .lnk-row-side { grid-column: 2; flex-direction: row; justify-content: space-between; align-items: center; }
  .lnk-row-fields input { width: 100%; min-width: 0; }
  .lnk-phone { height: 560px; }
  /* 갤러리 자세히 보기·소재 카드 */
  .saved-card, .saved-scan-card { grid-template-columns: 56px minmax(0, 1fr); }
}
/* 20261020-alalshow-sf5-auto-gaps: 자동 제작 제품 사진 · 이전 카피 대본 · 작업 효과음 · ④ 효과음 자리 · 직접 고치기 창 */
.auto-images { margin-top: 8px; }
.auto-copies { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.auto-copies h3 { font-size: var(--text-md); margin: 0; }
.auto-copy-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.auto-copy { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); font-size: var(--text-md); }
.auto-sfx-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.auto-sfx-row input[type="number"] { width: 110px; }
.auto-sfx-audio { height: 36px; max-width: 280px; }
.auto-sfx-note, .auto-download-note { font-size: var(--text-sm); margin: 0; }
.auto-sfx-places { display: flex; flex-direction: column; gap: 4px; }
.auto-sfx-places h3 { font-size: var(--text-md); margin: 0; }
.auto-sfx-places p { margin: 0; font-weight: 500; }
.auto-sfx-place-list { margin: 0; padding-left: 20px; font-size: var(--text-sm); color: var(--text-muted); columns: 2; }
.auto-edit { border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-2); padding: 20px; max-width: 640px; width: calc(100% - 32px); color: var(--text); }
.auto-edit::backdrop { background: rgba(20, 20, 30, 0.45); }
.auto-edit-form { display: flex; flex-direction: column; gap: 12px; }
.auto-edit-form h2 { margin: 0; font-size: var(--text-xl); }
.auto-edit-lines { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 46vh; overflow-y: auto; }
.auto-edit-line input { width: 100%; }
/* 20261020-alalshow-sf5-home-gaps — 홈 템플릿 카드 · 안내 단계 점 · 화면 안내(coach) · 캡컷 설치 단계 · 한도 힌트 · 미리 보기 · 도움말 */
.tutorial-dots { display: inline-flex; gap: 6px; align-items: center; margin-right: 6px; }
.tutorial-dot { width: 12px; height: 12px; padding: 0; border-radius: 50%; border: 1px solid var(--text-faint); background: transparent; cursor: pointer; }
.tutorial-dot[aria-current="step"] { background: var(--brand); border-color: var(--brand); }
.tutorial-go { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.tutorial-go form { margin: 0; }
/* 묶음 A: 첫 방문 안내(점선 상자) → 분석기 알림 칸 · 화면 안내 말풍선(어두운 칸) → 흰 칸 + 그림자 */
.coach-invite { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); padding: 12px 18px; margin-bottom: var(--space-4); border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); }
.coach-invite-text { margin: 0; font-weight: 500; }
.coach-invite-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; }
.coach { background: var(--paper); color: var(--text); border: 1px solid var(--brand-line); border-radius: var(--radius-md); padding: var(--space-4) 18px; margin-bottom: var(--space-4); max-width: 360px; box-shadow: var(--shadow-2); }
.coach.coach-floating { position: absolute; z-index: 40; margin: 0; }
.coach-kicker { margin: 0; font-size: var(--text-xs); font-weight: 500; color: var(--brand-ink); }
.coach-title { margin: 2px 0 4px; font-size: var(--text-lg); }
.coach-body { margin: 0 0 var(--space-3); color: var(--text-muted); font-size: var(--text-md); }
.coach-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0; }
.coach .btn-ghost { color: var(--text-muted); }
.coach .tutorial-dot { border-color: var(--text-faint); }
.coach-target { outline: 3px solid var(--accent); outline-offset: 4px; border-radius: 8px; }
.auto-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.home-tpl { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 8px; }
.home-tpl-thumbs { display: flex; gap: 4px; }
.home-tpl-thumb { width: 45px; height: 80px; border-radius: var(--radius-sm); border: 1px solid var(--rule); object-fit: cover; background: var(--ground); }
.home-tpl-now { margin: 0; font-size: var(--text-sm); font-weight: 500; }
.home-tpl-pick { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0; }
.home-tpl-pick select { max-width: 100%; }
.settings-render-note { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.silence-winner { margin: 8px 0 0; font-size: 13px; }
.capcut-steps-progress { margin: 6px 0; font-weight: 600; }
.capcut-install-steps li[data-done="true"] > span:first-child { color: var(--muted); }
.capcut-step-check { display: inline-flex; gap: 6px; align-items: center; margin-left: 6px; }
.step-done { color: var(--good); font-weight: 700; font-size: 13px; }
.step-auto { font-size: 13px; }
.demo-layout { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: var(--gap); align-items: start; }
.demo-video { width: 100%; max-width: 270px; aspect-ratio: 9 / 16; height: auto; border-radius: var(--radius-md); background: #000; }
/* 단계 이름 앞에 번호가 이미 있다 — 목록 번호는 감춘다 */
.demo-stage-list { display: grid; gap: 8px; margin: 0; padding-left: 0; list-style: none; }
.demo-stage-name { margin-right: 6px; }
.help-faq, .help-contact { margin-top: var(--gap); }
.faq-item { border-top: 1px solid var(--rule); padding: 10px 0; }
.faq-q { cursor: pointer; font-weight: 500; }
.faq-a { margin: 8px 0 0; color: var(--text-muted); line-height: 1.6; }
.contact-list { list-style: none; padding: 0; display: grid; gap: 8px; }
.contact-name { display: inline-block; min-width: 96px; font-weight: 500; }
@media (max-width: 720px) {
  .demo-layout { grid-template-columns: 1fr; }
}
/* 20261020-alalshow-sf5-make-gaps — 키 받는 법 카드 · 안내 페이지 · 대본 예시/크게 보기 창 · 사진 넣는 자리 · 무음 슬라이더 · 미리 듣기 */
/* 묶음 A: 키 받는 법 = 알림 칸 모양 · 예시 창 = 공용 대화창 값 · 사진 넣는 자리(점선) = 알림 칸 모양 */
.key-guide { border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); padding: 0; }
.key-guide-summary { cursor: pointer; padding: 12px 18px; color: var(--info-ink); font-weight: 500; font-size: var(--text-md); list-style-position: inside; }
.key-guide-summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--radius); }
.key-guide-body { padding: 0 16px 14px; display: flex; flex-direction: column; gap: 8px; }
.key-guide-need { margin: 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); color: var(--warn-ink); font-weight: 500; font-size: var(--text-md); }
.key-guide-why { margin: 0; font-size: 14px; }
.key-guide-steps { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 1.5; }
.key-guide-step-title { display: block; }
.key-guide-step-body { color: var(--ink); }
.key-guide-sub { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
.key-guide-costs { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.6; }
.key-guide-links { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; font-weight: 600; }
.key-guide-link { color: var(--brand-ink); }
.key-card .key-guide { margin: 4px 0; }
.scene-key + .key-guide, .page-scene .key-guide { margin: 0 0 12px; }
.ers-guide { padding: 0; border: 0; background: transparent; margin-bottom: 12px; }
.scene-notice-guide { margin: 6px 0 10px; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D): 안내 목차는 분석기 작업 줄 버튼 모양 (흰 바탕 · 그림자 · 35px · 6px) */
.page-guide .guide-toc { display: flex; flex-wrap: wrap; gap: var(--space-1); margin: 0 0 var(--space-4); font-size: var(--text-md); font-weight: 400; }
.page-guide .guide-toc a { display: inline-flex; align-items: center; min-height: var(--btn-h); padding: 7px 12px; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); line-height: 21px; text-decoration: none; }
.page-guide .guide-toc a:hover { background: var(--brand-bg-soft); color: var(--brand); }
.page-guide .guide-section { margin-bottom: 16px; scroll-margin-top: 16px; }
.page-guide .guide-section h2 { margin: 0 0 10px; font-size: var(--text-lg); }
.guide-items { margin: 8px 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 1.55; }
.guide-items strong { display: block; }
.guide-foot { font-size: 13px; }
.script-dialog { border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-2); padding: 18px 22px 20px; width: min(860px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto; color: var(--ink); background: var(--surface); }
.script-dialog::backdrop { background: rgba(20, 20, 24, 0.45); }
.script-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.script-dialog-head h2 { margin: 0; font-size: var(--text-xl); }
.script-example { border-top: 1px solid var(--line); padding: 14px 0 6px; display: flex; flex-direction: column; gap: 8px; }
.script-example h3 { margin: 0; font-size: 16px; }
.script-example h4 { margin: 0 0 4px; font-size: 13px; color: var(--muted); }
.script-example-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; }
.script-example-input { margin: 0; padding: var(--space-3); border-radius: var(--radius-md); background: var(--ground); white-space: pre-wrap; font-family: inherit; font-size: 13px; line-height: 1.55; }
.script-example-fill { align-self: flex-start; }
.script-wide-lines, .script-example-lines { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.script-wide-lines { font-size: 18px; line-height: 1.7; margin: 8px 0 14px; }
.script-example-lines { font-size: 14px; line-height: 1.55; }
.wide-stage { font-size: 0.75em; font-weight: 500; color: var(--brand-ink); white-space: nowrap; }
.script-wide-line[data-dialogue="true"] .wide-text, .script-example-line[data-dialogue="true"] .wide-text { color: var(--brand-ink); }
.script-copy-src[hidden] { display: none; }
.script-photo-drop { border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); padding: 12px 18px; display: flex; flex-direction: column; gap: 4px; }
.script-photo-drop .field-note { color: var(--info-ink); }
.script-photo-drop.is-dragover, .audio-drop.is-dragover { border-color: var(--accent); background: var(--brand-bg); }
.script-photo-hint { margin: 0; }
.script-photo-state { margin: 0; font-size: var(--text-sm); font-weight: 500; }
.script-photo-state:empty { display: none; }
.audio-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.audio-value-field { gap: 4px; }
.audio-slider { width: 100%; accent-color: var(--accent); margin: 4px 0 0; }
.audio-slider-hint { margin: 0; }
.audio-preview { display: block; width: 100%; max-width: 480px; margin: 0 0 12px; }
@media (max-width: 720px) {
  .script-example-cols { grid-template-columns: 1fr; }
  .audio-head { flex-direction: column; }
}

/* 20261020-alalshow-sf5-cn-keyless-plus — 중국 소재 검색 플랫폼별 상태 · 꺼진 플랫폼 단추 · 받은 원본 안내 */
.cn-platforms { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.cn-platform { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-sm); color: var(--text-muted); }
.cn-platform[data-tone="good"] .cn-platform-text { color: var(--good-ink); font-weight: 500; }
.cn-platform[data-tone="warn"] .cn-platform-text { color: var(--warn-ink); }
.cn-tab[data-off] { cursor: not-allowed; }
.cn-tab[data-off] input { cursor: not-allowed; }
.cn-tab[data-off] span { opacity: 0.5; }
.cn-tab-note { display: block; padding: var(--space-1) var(--space-1) 0; font-size: var(--text-xs); color: var(--text-muted); text-align: center; }
.cnt-platform-note { margin: 0; font-size: var(--text-sm); line-height: 1.5; }
.cnt-item-hint { margin: 0; padding: var(--space-2) 10px; font-size: var(--text-sm); line-height: 1.5; color: var(--warn-ink); background: var(--warn-bg); border-radius: var(--radius-btn); }

/* 20261020-alalshow-sf5-qa-platform — 첫 주소 소개 화면 · 휴대폰 플래너 항목 덩어리 · 작은 누름 영역 · 오류 안내 줄 */
.page-landing { display: flex; flex-direction: column; gap: 24px; }
.landing-hero { max-width: 720px; padding: 0; }
.landing-kicker { margin: 0 0 var(--space-2); font-size: var(--text-sm); font-weight: 500; color: var(--brand-ink); }
.landing-hero h1 { margin: 0 0 10px; font-size: var(--text-2xl); line-height: 30px; }
.landing-lead { margin: 0 0 18px; font-size: var(--text-lg); line-height: 1.6; color: var(--text); }
.landing-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.landing-actions .btn { justify-content: center; }
.landing-note { margin: 12px 0 0; font-size: var(--text-sm); }
.landing-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.landing-point { margin: 0; }
.landing-point-title { margin: 0 0 6px; font-size: var(--text-lg); }
.landing-point p { margin: 0; font-size: var(--text-md); line-height: 1.55; }
.landing-help { margin: 0; font-size: var(--text-md); }
#flash .flash[data-qa-flash] { margin: 0 0 12px; }
/* 안내 단계 점(12px)은 보이는 크기는 그대로 두고 누르는 자리만 넓힌다 */
.tutorial-dot { position: relative; }
.tutorial-dot::after { content: ""; position: absolute; inset: -8px -3px; }
.topbar .topnav form.inline .link-btn { min-height: 40px; padding: 0 6px; }
@media (max-width: 760px) {
  .landing-hero h1 { font-size: var(--text-2xl); }
  .landing-list { grid-template-columns: 1fr; }
  .landing-actions .btn { flex: 1 1 140px; }
  .home-tpl-pick select { min-height: 40px; }
  /* 제작 플래너: 표가 화면보다 넓어 [끝냄]이 잘렸다 → 항목마다 한 덩어리 (항목 · 단계 칩 3개 · 끝냄) */
  .page table.pln-table { display: block; overflow: visible; }
  .pln-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pln-table tbody { display: block; }
  .pln-table .pln-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 8px 6px; align-items: end; padding: 12px 14px; border-bottom: 1px solid var(--line); }
  .pln-table .pln-row > td { display: block; width: auto; padding: 0; border: 0; text-align: left; }
  .pln-table .pln-row > td.pln-item { grid-column: 1 / -1; }
  .pln-table .pln-cell-td::before { content: attr(data-label); display: block; margin-bottom: 2px; font-size: 11px; font-weight: 600; color: var(--muted); }
  .pln-table .pln-cell { min-width: 0; }
  .pln-table .pln-act { text-align: right; }
  .pln-table .pln-advance { min-height: 36px; }
}

/* 20261020-alalshow-sf5-qa-make — 실제 사용 점검: 장면 결과 표의 상태·버튼이 한 글자씩 꺾이지 않게, 컷 편집 확인 줄 [장면 고르기] */
.scene-table .scene-badge { white-space: nowrap; }
.scene-table td:last-child { width: 1%; }
.scene-row-actions .btn { white-space: nowrap; }
.clip-review-pick { margin-left: 8px; white-space: nowrap; }
/* 긴 선택지(렌더 입력 "대본 제목 · 38.1초 — 장면 이미지 7장 …")가 휴대폰에서 화면을 703px로 넓히던 문제:
   fieldset 기본 min-width(min-content)와 select 고유 너비가 부모를 밀어냈다 */
fieldset { min-width: 0; }
select { max-width: 100%; }
.make-form .field select { width: 100%; }
.clip-review-hint { margin: 6px 0 0; font-size: 13px; color: var(--muted); }

/* 20261026-alalshow-sf5-cut-review-fill: 컷 편집 확인 한 번에 채우기 칸 (확정 거절 안내 옆에도 같은 칸) */
.clip-fill { margin-top: var(--space-3); padding: var(--space-3); border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); display: flex; flex-direction: column; gap: var(--space-2); }
.clip-fill .clip-review-hint, .clip-fill .clip-msg { margin: 0; color: var(--warn-ink); }
.clip-fill-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.clip-fill-actions .btn { min-height: var(--tap); }
.clip-fill-note { flex-basis: 100%; font-size: var(--text-xs); }

/* 20261020-alalshow-sf5-qa-discover: 중국 소재 검색 — 플랫폼 고르기(자체 글자 배지, 공식 로고 아님) · 결과 위 권리 확인(따라옴) ·
   잠긴 [원본 받기] 이유 · 한국어→중국어 검색어 줄 */
.cn-tab .cn-tab-face { display: inline-flex; align-items: center; gap: 6px; }
.cn-tab .cn-tab-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: var(--radius-btn);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: var(--paper);
  flex: none;
}
.cn-tab .cn-tab-label { padding: 0; font-size: inherit; font-weight: inherit; color: inherit; border-radius: 0; }
.cn-tab .cn-tab-mark[data-platform="xiaohongshu"] { background: #e2384f; }
.cn-tab .cn-tab-mark[data-platform="douyin"] { background: #20222c; }
.cn-tab .cn-tab-mark[data-platform="bilibili"] { background: #2c96d8; }
.cn-tab input:not(:checked) + .cn-tab-face .cn-tab-mark { opacity: 0.75; }
.cn-tab[data-off] .cn-tab-mark { filter: grayscale(1); }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 B): 따라오는 권리 확인 칸도 info 알림 칸 바탕 (+ 아래 결과 위에 뜨므로 그림자 하나) */
.cn-consent-sticky { position: sticky; top: 8px; z-index: 6; background: var(--info-bg); box-shadow: var(--shadow-1); }
.cn-consent-flash { outline: 2px solid var(--brand); outline-offset: 2px; animation: cn-consent-flash 1.4s ease-out; }
@keyframes cn-consent-flash {
  0% { background: var(--brand-line); }
  60% { background: var(--brand-line); }
  100% { background: var(--info-bg); }
}
/* 카드마다 반복하던 '권리 확인에 체크하면 받을 수 있어요'(cn-consent-jump)는 지웠다 — 결과 위 권리 확인 칸 한 번 (sf5-ui-migrate-discover) */
.cn-orig-btn:disabled { pointer-events: none; }
.cn-translated {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0 0 var(--space-3);
  padding: 12px 18px;
  background: var(--info-bg);
  border: 1px solid var(--info-line);
  border-radius: var(--radius-md);
}
.cn-translated-from { font-weight: 500; }
.cn-translated-zh { flex: 0 1 16em; min-width: 8em; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); font: inherit; }
.cn-translated-hint { flex-basis: 100%; font-size: var(--text-xs); }
@media (max-width: 760px) {
  .cn-translated-zh { flex: 1 1 100%; }
}

/* 20261020-alalshow-sf5-cn-card-ko: 중국 소재 검색 카드 제목 — 한국어(크게) + 원래 중국어(작게 흐리게) */
.cn-titles { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cn-title-ko { font-size: var(--text-md); }
.cn-title-zh {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cn-ko-wait { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.cn-ko-wait::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  animation: cn-ko-pulse 1s ease-in-out infinite;
}
@keyframes cn-ko-pulse {
  0% { opacity: 0.25; }
  50% { opacity: 1; }
  100% { opacity: 0.25; }
}
.cn-ko-load { display: none; }
/* 20261020-alalshow-sf5-gallery-v2 — 떡상 갤러리 2차: 머리 줄(지금 뜨는 이슈 띠 · 자동 수집 반영) · 쓰임새별 탭 · 숨길 키워드 · 묶음 필터 줄 · 썸네일 격자 · 더 보기 메뉴 · 재생·분석 겹침 창
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 지금 뜨는 이슈 띠는 어두운 띠 → info 알림 칸(이름은 흰 꼬리표), 숨길 키워드는 칸 안의 흐린 바탕(점선 없음),
   격자 카드는 흰 칸+그림자(사진 위 · 글 아래), 더 보기 메뉴는 8px + 그림자 */
.page-gallery { max-width: none; }
.gal-hot { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: 0 0 var(--space-2); padding: 12px 18px; border: 1px solid var(--info-line); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-ink); text-decoration: none; font-size: var(--text-md); }
.gal-hot:hover { border-color: var(--brand); }
.gal-hot-tag { font-weight: 700; color: var(--info-ink); white-space: nowrap; }
.gal-hot-names { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; min-width: 0; }
.gal-hot-name { padding: 2px 8px; border-radius: var(--radius-lg); background: var(--paper); color: var(--text); font-size: var(--text-sm); overflow-wrap: anywhere; }
.gal-hot-go { margin-left: auto; color: var(--brand-ink); font-weight: 500; white-space: nowrap; }
.gal-hot:hover .gal-hot-go { text-decoration: underline; }
.gal-fresh { margin: 0 0 var(--space-3); font-size: var(--text-sm); font-weight: 400; color: var(--text-muted); overflow-wrap: anywhere; }
.gal-tab-count { color: inherit; font-weight: 400; font-variant-numeric: tabular-nums; }
.gal-tab[aria-current="page"] .gal-tab-count { color: var(--brand); }
.gal-tab-hint { margin: 0; font-size: var(--text-sm); }
/* 묶음 필터 줄 */
.gal-filters { gap: 10px; }
.gal-group { display: flex; align-items: center; gap: 10px; min-width: 0; }
.gal-group-label { flex: 0 0 auto; min-width: 4.6em; font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); white-space: nowrap; }
.gal-group .gal-chips { flex: 1 1 auto; min-width: 0; }
.gal-filters .gal-chip { font-size: var(--text-sm); }
.gal-sortbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.gal-sortbar .gal-group { flex: 0 1 auto; }
.gal-sortbar .gal-search { flex: 1 1 280px; margin-top: 0; }
/* 숨길 키워드: 필터 칸 안의 흐린 바탕 줄 (그림자·테두리 겹치지 않게) */
.gal-hide { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 10px var(--space-3); border-radius: var(--radius-md); background: var(--ground); }
.gal-hide-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; flex: 1 1 auto; min-width: 0; }
.gal-hide-chip { display: inline-flex; align-items: center; gap: 2px; min-height: 30px; padding: 2px 3px 2px 10px; border: 1px solid var(--rule); border-radius: var(--radius-lg); background: var(--paper); font-size: var(--text-sm); font-weight: 500; max-width: 100%; }
.gal-hide-word { overflow-wrap: anywhere; }
.gal-hide-remove { display: inline; margin: 0; }
.gal-hide-x { border: 0; background: none; padding: 2px 7px; border-radius: var(--radius-lg); font: inherit; font-size: var(--text-md); line-height: 1; color: var(--text-muted); cursor: pointer; }
.gal-hide-x:hover { background: var(--brand-bg); color: var(--brand-ink); }
.gal-hide-new { flex: 1 1 220px; min-width: 0; max-width: 420px; }
.gal-hide-add { display: flex; gap: 6px; margin: 0; }
.gal-hide-add input { flex: 1 1 auto; min-width: 0; padding: 6px 12px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); font-size: var(--text-md); background: var(--paper); }
.gal-hide-btn { flex: 0 0 auto; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); font: inherit; font-size: var(--text-md); line-height: 21px; cursor: pointer; }
.gal-hide-btn:hover { background: var(--brand-bg-soft); color: var(--brand); }
.gal-hide-hint { flex-basis: 100%; margin: 0; font-size: var(--text-xs); }
.gal-hide-error { flex-basis: 100%; }
.gal-rangebar { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) 14px; }
.gal-hidden-note { margin: 0; font-size: var(--text-sm); }
/* 썸네일 격자: 1280px 6칸 · 넓으면 9칸까지 · 휴대폰 2칸
   20261026-alalshow-sf5-viewfinder-tone: 사이드바 칸(236px)이 없어져 본문이 넓어졌다 → 최소 폭 150 → 170px로 1280px 6칸 유지
   (묶음 B: 칸 사이 12px — 1280px 본문 1248px에 7칸(170×7+12×6=1262)은 안 들어가 6칸 그대로) */
.gal-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: var(--space-3); }
.gal-card { overflow: visible; gap: 0; }
.gal-card .gal-flash { top: 6px; left: 6px; right: 6px; z-index: 4; }
.gal-thumb-btn { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: var(--radius-md) var(--radius-md) 0 0; overflow: hidden; background: var(--text); cursor: pointer; }
.gal-thumb-btn .gal-thumb { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; transition: transform 0.2s ease; }
.gal-thumb-btn .gal-thumb-empty { display: flex; }
.gal-thumb-btn:hover .gal-thumb { transform: scale(1.03); }
.gal-ov { position: absolute; padding: 2px 6px; border-radius: var(--radius-btn); background: rgba(17, 18, 22, 0.72); color: var(--paper); font-size: var(--text-xs); font-weight: 500; line-height: 1.45; font-variant-numeric: tabular-nums; }
.gal-ov-mult { top: 6px; left: 6px; background: var(--brand); font-weight: 700; }
.gal-ov-mult.tone-good { background: var(--brand); }
.gal-ov-mult.tone-muted { background: rgba(17, 18, 22, 0.72); }
.gal-ov-date { top: 6px; right: 6px; }
.gal-ov-views { right: 6px; bottom: 6px; font-weight: 700; }
.gal-card-body { padding: 10px var(--space-3) var(--space-3); gap: var(--space-1); }
.gal-title { font-size: var(--text-md); font-weight: 500; line-height: 1.4; min-height: 2.8em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.gal-sub { display: flex; align-items: center; gap: var(--space-1); min-width: 0; }
.gal-channel { flex: 1 1 auto; min-width: 0; margin: 0; overflow: hidden; color: var(--text-muted); font-size: var(--text-xs); white-space: nowrap; text-overflow: ellipsis; }
.gal-avg { margin: 0; font-size: var(--text-xs); color: var(--text-muted); }
.gal-avg .gal-mult { color: var(--brand-ink); font-weight: 700; }
.gal-tags { display: flex; flex-wrap: wrap; gap: 2px 6px; margin: 0; color: var(--text-muted); font-size: var(--text-xs); }
.gal-tags:empty { display: none; }
.gal-tags .gal-gone { color: var(--warn-ink); font-weight: 500; }
.gal-badge-wait { align-self: flex-start; margin: 0; padding: 1px 8px; border-radius: var(--radius-lg); background: var(--muted-bg); color: var(--muted-ink); font-size: var(--text-xs); font-weight: 500; }
.gal-card .gal-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-1); margin-top: var(--space-2); padding-top: 0; }
.gal-card .gal-actions .btn-small { min-height: 32px; padding: 5px 4px; font-size: var(--text-sm); line-height: 20px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 더 보기 메뉴 (소재함에 담기 · 영상자료 담기) */
.gal-more { position: relative; flex: 0 0 auto; }
.gal-more-btn { display: grid; place-items: center; width: 28px; height: 24px; border-radius: var(--radius-btn); color: var(--text-muted); font-weight: 700; cursor: pointer; list-style: none; }
.gal-more-btn::-webkit-details-marker { display: none; }
.gal-more-btn:hover, .gal-more[open] > .gal-more-btn { background: var(--ground); color: var(--brand); }
.gal-more-menu { position: absolute; top: calc(100% + 4px); right: 0; z-index: 6; display: flex; flex-direction: column; min-width: 160px; padding: var(--space-2); border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-2); }
.gal-more-menu form { margin: 0; }
.gal-more-item { display: block; width: 100%; padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: none; color: var(--text); font: inherit; font-size: var(--text-md); line-height: 21px; text-align: left; white-space: nowrap; cursor: pointer; }
.gal-more-item:hover { background: var(--ground); color: var(--brand); }
/* [재생·분석] 창은 공용 대화창 #gal-detail-dialog (sf5-ui-migrate-discover) — 예전 겹침 창 규칙은 지웠다 */
@media (min-width: 1760px) {
  .gal-grid { grid-template-columns: repeat(9, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .gal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .gal-group { flex-direction: column; align-items: stretch; gap: var(--space-1); }
  .gal-group-label { flex: none; }
  .gal-sortbar .gal-group { flex: 1 1 100%; }
  .gal-hot-go { margin-left: 0; }
  .gal-card-body { padding: var(--space-2) 10px 10px; }
}
/* 20261020-alalshow-sf5-my-tools: 사이드바 "내 도구" — 스레드 홍보 글 쓰기 · 나레이션 파일 만들기 */
.threads-head, .narration-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 8px 16px; }
.threads-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 16px; align-items: start; }
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 C): 스레드 — 말투·길이 고르기는 흰 35px 버튼(고른 것 = 파랑), 글 본문은 칸 안 흐린 바탕, 양식 칸 폭 960px까지 */
.threads-section-title { margin: 0 0 var(--space-3); font-size: var(--text-lg); font-weight: 700; }
.threads-form { max-width: 960px; }
.threads-choices { border: 0; margin: 0; padding: 0; min-width: 0; }
.threads-choices legend { font-weight: 500; margin-bottom: 6px; padding: 0; }
.threads-choice-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.threads-choice { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); line-height: 21px; cursor: pointer; max-width: 100%; }
.threads-choice:hover { background: var(--brand-bg-soft); }
.threads-choice:has(input:checked) { background: var(--brand); color: var(--paper); }
.threads-choice:has(input:checked) small { color: var(--paper); }
.threads-choice-label { font-weight: 500; }
.threads-choice small { flex-basis: 100%; font-size: var(--text-xs); line-height: 18px; }
.threads-posts { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.threads-post { margin: 0; }
.threads-post-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); }
.threads-post-title { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.threads-post-text { margin: 0 0 var(--space-3); padding: var(--space-3) var(--space-4); max-width: 960px; white-space: pre-wrap; overflow-wrap: anywhere; word-break: keep-all; font: inherit; font-size: var(--text-md); line-height: 1.6; background: var(--ground); border: 0; border-radius: var(--radius-md); }
.threads-post-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.threads-post-actions form.inline { display: inline; margin: 0; }
.threads-save-msg { margin: 0; }
.threads-actions { margin-top: 12px; }
.threads-summary { margin: 0 0 8px; }
.threads-not-charged { margin: 6px 0 0; }
.narration-card { margin-bottom: 16px; }
.narration-form textarea { min-height: 12em; }
.narration-form .field, .narration-form .char-counter { max-width: 960px; }
.char-counter[data-over] { color: var(--warn-ink); font-weight: 700; }
.narration-msg:empty { display: none; }
.narration-voice { margin: 0; overflow-wrap: anywhere; }
.narration-cleanup { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }
.narration-audio { width: 100%; max-width: 520px; display: block; margin: 0 0 8px; }
.narration-meta { margin: 0 0 8px; overflow-wrap: anywhere; }
.narration-downloads { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; }
.narration-recent-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.narration-recent-item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--space-3); padding: var(--space-3) 0; border-top: 1px solid var(--rule); }
.narration-recent-item:first-child { border-top: 0; }
.narration-recent-date { color: var(--text-muted); font-size: var(--text-sm); }
.narration-recent-text { flex: 1 1 12em; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .threads-layout { grid-template-columns: minmax(0, 1fr); }
  .threads-choice { flex: 1 1 100%; }
}

/* 20261020-alalshow-sf5-cn-preview: 중국 소재 검색 [바로 보기] 겹침 창 — 플랫폼 공식 플레이어(빌리빌리 16:9 · 더우인 9:16) · 샤오홍슈 영상(9:16) · 연결 안내 */
.cn-pv[hidden] { display: none; }
.cn-pv { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; padding: 12px; }
.cn-pv-backdrop { position: absolute; inset: 0; background: rgba(12, 13, 16, 0.72); }
.cn-pv-box { position: relative; display: flex; flex-direction: column; gap: 10px; width: min(calc(100vw - 24px), 440px); max-height: calc(100vh - 24px); overflow-y: auto; padding: var(--space-3) var(--space-4) var(--space-4); border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-2); }
.cn-pv[data-shape="wide"] .cn-pv-box { width: min(calc(100vw - 24px), 900px); }
.cn-pv-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cn-pv-heading { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.cn-pv-body { display: flex; flex-direction: column; gap: 8px; min-height: 48px; }
.cn-pv-content { display: flex; flex-direction: column; gap: 8px; }
.cn-pv-title { margin: 0; display: flex; align-items: baseline; gap: 6px; font-weight: 500; overflow-wrap: anywhere; word-break: keep-all; }
.cn-pv-title-text { min-width: 0; }
.cn-pv-stage { position: relative; margin: 0 auto; background: #000; border-radius: var(--radius-md); overflow: hidden; }
.cn-pv-stage[data-shape="tall"] { width: min(100%, calc((100vh - 230px) * 9 / 16), 405px); aspect-ratio: 9 / 16; }
.cn-pv-stage[data-shape="wide"] { width: 100%; aspect-ratio: 16 / 9; }
.cn-pv-frame, .cn-pv-video { display: block; width: 100%; height: 100%; border: 0; background: #000; }
.cn-pv-video { object-fit: contain; }
.cn-pv-stage[data-failed="1"] .cn-pv-video { visibility: hidden; }
.cn-pv-loading, .cn-pv-msg, .cn-pv-failed { margin: 0; }
.cn-pv-msg, .cn-pv-failed { padding: 12px 18px; border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); color: var(--warn-ink); }
.cn-pv-note { margin: 0; font-size: var(--text-sm); }
.cn-pv-links { margin: 0; }
html.cn-pv-open { overflow: hidden; }
@media (max-width: 480px) {
  .cn-pv { padding: 12px; align-items: flex-start; }
  .cn-pv-box { padding: 10px; }
  .cn-pv-stage[data-shape="tall"] { width: min(100%, calc((100vh - 220px) * 9 / 16)); }
}
/* 20261020-alalshow-sf5-sns-tabs — 떡상 갤러리 SNS 탭: 글 카드(스레드·X) · 릴스 표지 배지 · 반응 수 줄 · [재생·분석] 글 본문 · 빈 SNS 탭 안내
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 글 카드 윗부분은 어두운 그라데이션 → 흐린 바탕 + 본문 글자색, 글 본문은 칸 안 흐린 바탕(선 없음), 빈 탭 안내는 흰 칸 */
.gal-sns-tile { text-align: left; color: var(--text); font: inherit; }
.gal-sns-text-first { display: flex; flex-direction: column; gap: 6px; padding: 30px 10px; background: var(--brand-bg-soft); box-shadow: inset 0 -1px 0 var(--rule); }
.gal-sns-text-first.gal-sns-x { background: var(--ground); }
.gal-sns-head { display: flex; align-items: center; gap: 6px; min-width: 0; }
.gal-sns-badge { flex: 0 0 auto; padding: 1px 7px; border-radius: var(--radius-lg); background: var(--paper); color: var(--text); font-size: var(--text-xs); font-weight: 700; }
.gal-sns-threads .gal-sns-badge { background: var(--brand-bg); color: var(--brand-ink); }
.gal-sns-author { min-width: 0; overflow: hidden; color: var(--text-muted); font-size: var(--text-xs); font-weight: 500; white-space: nowrap; text-overflow: ellipsis; }
.gal-sns-text { flex: 1 1 auto; min-height: 0; overflow: hidden; color: var(--text); font-size: var(--text-sm); line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; word-break: keep-all; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; }
.gal-sns-tile:hover .gal-sns-text { color: var(--brand-ink); }
.gal-sns-text-first .gal-ov-date, .gal-sns-text-first .gal-ov-views { background: var(--paper); color: var(--text-muted); }
.gal-ov-badge { left: 6px; bottom: 6px; font-weight: 700; }
.gal-sns-cover-empty[hidden], .gal-sns-post-cover[hidden] { display: none; }
.gal-sns-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--space-2); margin: 0; font-size: var(--text-xs); color: var(--text-muted); font-variant-numeric: tabular-nums; }
.gal-sns-metric { white-space: nowrap; }
.gal-sns-metric-label { color: var(--text-muted); font-weight: 500; }
.gal-sns-open { margin-left: auto; color: var(--brand-ink); font-weight: 500; text-decoration: none; white-space: nowrap; }
.gal-sns-open:hover { text-decoration: underline; }
/* [재생·분석] 글 본문 */
.gal-sns-post { display: flex; flex-direction: column; gap: 10px; padding: var(--space-4); border-radius: var(--radius-md); background: var(--ground); color: var(--text); min-width: 0; }
.gal-sns-post-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px var(--space-2); }
.gal-sns-post .gal-sns-badge { background: var(--brand); color: var(--paper); }
.gal-sns-post .gal-sns-author { color: var(--text); font-size: var(--text-sm); }
.gal-sns-post-date { margin-left: auto; font-size: var(--text-xs); }
.gal-sns-post-cover { position: relative; display: block; max-width: 280px; aspect-ratio: 9 / 16; border-radius: var(--radius-md); overflow: hidden; background: var(--text); }
.gal-sns-post-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal-sns-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: rgba(17, 18, 22, 0.6); color: var(--paper); font-size: 20px; }
.gal-sns-post-title { margin: 0; font-size: var(--text-sm); font-weight: 500; color: var(--text-muted); }
.gal-sns-post-text { max-height: 340px; overflow-y: auto; font-size: var(--text-md); line-height: 1.65; overflow-wrap: anywhere; word-break: keep-all; }
.gal-sns-post-text p { margin: 0 0 var(--space-1); }
.gal-sns-post-metrics { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.gal-sns-post-metrics li { padding: 3px 10px; border-radius: var(--radius-lg); background: var(--paper); font-size: var(--text-sm); }
.gal-sns-post-open { align-self: flex-start; }
/* 빈 SNS 탭 안내 */
.gal-sns-empty { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-1); padding: 20px; }
.gal-sns-empty-title { margin: 0; font-size: var(--text-lg); font-weight: 700; }
.gal-sns-empty-lines { margin: 0; padding-left: 18px; display: grid; gap: var(--space-1); font-size: var(--text-md); line-height: 1.55; overflow-wrap: anywhere; }
.gal-sns-empty-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-1) 0 0; }
/* 관리자 수집 탭: SNS 다시 수집 줄 */
.collect-sns { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 10px; }
.collect-sns .admin-note { margin: 0; }
@media (max-width: 760px) {
  .gal-sns-text-first { padding: 28px 8px; }
  .gal-sns-text { font-size: var(--text-xs); -webkit-line-clamp: 6; }
  .gal-sns-post-cover { max-width: 100%; }
  .gal-sns-open { margin-left: 0; }
}
/* 20261020-alalshow-sf5-shop-focus — 지금 뜨는 이슈 쇼핑 보기 줄·쇼핑 근거 배지·빈 안내 · 잘 터진 영상 모음 유튜브 탭 쇼핑 거르기 전환 줄
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 보기 줄은 흰 칸+그림자(쇼핑 보기면 info 알림 칸), 꼬리표 6px */
.trend-focus { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin: 0 0 var(--space-4); padding: 12px 18px; border: 1px solid transparent; border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-1); }
.trend-focus-line { margin: 0; font-weight: 500; flex: 1 1 14em; min-width: 0; overflow-wrap: anywhere; }
.trend-focus[data-view="shop"] { border-color: var(--info-line); background: var(--info-bg); color: var(--info-ink); box-shadow: none; }
.trend-shop { margin: 0; }
.trend-shop-badge { display: inline-block; padding: 3px 8px; border-radius: var(--radius-lg); font-size: var(--text-xs); font-weight: 500; background: var(--brand-bg); color: var(--brand-ink); overflow-wrap: anywhere; }
.trend-kind[data-kind="product"] { background: var(--brand-bg); color: var(--brand-ink); }
.trend-shop-empty { margin: 0 0 var(--space-4); }
.trend-shop-empty p { margin: 0 0 var(--space-3); }
.trend-shop-empty-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; }
.gal-shop-note { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) 10px; margin: var(--space-1) 0 0; color: var(--text-muted); font-size: var(--text-md); }
.gal-shop-text { overflow-wrap: anywhere; }
.gal-shop-toggle { font-weight: 500; color: var(--brand-ink); }
@media (max-width: 760px) {
  .trend-focus { padding: 10px var(--space-3); }
  .trend-focus-toggle { flex: 1 1 100%; text-align: center; }
}
/* 20261021-alalshow-sf5-post-format-render — 템플릿·렌더 게시글형 카드 (만들 형식 · 내 채널 칸 · 정지 화면 미리보기) */
.post-card { margin-bottom: 16px; }
.post-card h2 { margin-bottom: 8px; }
/* 묶음 A: 만들 형식 카드는 넓은 화면에서 여러 칸 (1408px에 두 칸이면 칸마다 빈 곳이 컸다) */
.post-formats { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-3); }
.post-format { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: var(--space-3); row-gap: 4px; align-items: start; padding: var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); cursor: pointer; min-width: 0; }
.post-format:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); background: var(--brand-bg-soft); }
.post-format input { grid-row: 1; margin-top: 3px; }
.post-format .tpl-thumb { grid-column: 2; grid-row: 1; width: 72px; height: auto; aspect-ratio: 9 / 16; }
.post-format-name { grid-column: 2; font-weight: 500; }
.post-format-note { grid-column: 2; font-size: var(--text-sm); overflow-wrap: anywhere; }
.post-brand .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.post-brand .field input, .post-brand .field select { width: 100%; min-width: 0; box-sizing: border-box; }
.post-preview { grid-template-columns: repeat(2, minmax(0, 180px)); justify-content: start; }
@media (max-width: 760px) {
  .post-formats, .post-brand .field-grid { grid-template-columns: minmax(0, 1fr); }
  .post-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* 20261021-alalshow-sf5-post-format-flow: 형식 고르기 · 게시글형 대본 확인 · 구절별 미디어 · 게시글형 설정 */
.auto-formats .auto-format-note { margin: 6px 0 0; font-size: var(--text-sm); overflow-wrap: anywhere; }
.auto-post-head { display: grid; grid-template-columns: repeat(auto-fit, minmax(12em, 1fr)); gap: 8px 12px; margin: 0 0 12px; }
.auto-post-phrases .auto-post-phrase { display: grid; gap: 2px; }
.auto-post-media { overflow-wrap: anywhere; font-size: 12px; }
.auto-post-media-list { margin: 12px 0; }
.auto-post-media-list h3 { margin: 0 0 6px; font-size: var(--text-md); }
.auto-post-media-list ol { margin: 0; padding-left: 1.4em; display: grid; gap: 2px; font-size: var(--text-sm); }
.post-set-link { margin: 16px 0; }
.post-set-link h2 { margin: 0 0 6px; font-size: var(--text-lg); }
.post-set-form { display: grid; gap: 12px; }
.post-set-form fieldset { display: grid; gap: 6px; }
.post-set-form .field-error:empty { display: none; }
.post-set-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.post-set-note { margin: 12px 0; overflow-wrap: anywhere; }
/* 20261020-alalshow-sf5-qa-sweep2: 카카오 계정 연결 안내·옮기기 제안 · 유튜브 테스트 사용자 안내 · 자동 제작 키 카드 ·
   자막 지우기 끌어다 놓기 · 올리는 중 표시 · 갤러리 휴대폰 검색칸 · 바닥글 도움말 · 관리자 서비스 메모 */
/* 20261027-alalshow-sf5-notice-tone: 카카오 새 계정 안내도 분석기 알림 칸 (옛 연노랑 바탕) — 카카오 노랑은 로그인 버튼에만 */
.kakao-link-notice { margin: 0 0 16px; border: 1px solid var(--info-line); background: var(--info-bg); box-shadow: none; padding: 12px 18px; }
.kakao-link-notice h2 { margin: 0 0 6px; font-size: 16px; }
.kakao-link-notice p { margin: 0 0 6px; }
.kakao-link-notice-steps { margin: 0 0 8px; padding-left: 20px; }
.kakao-link-notice-actions, .kakao-move-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.kakao-link-notice-actions form.inline, .kakao-move-actions form.inline { display: inline; margin: 0; }
.kakao-move-offer { border-color: var(--brand-line); }
.upl-testing { margin: 8px 0; color: var(--ink); }
.upl-blocked { margin: 8px 0; }
.auto-key-inline { margin-top: 10px; }
.auto-key-inline .key-card { margin: 0; }
.ers-drop { border: 2px dashed var(--line); border-radius: 12px; padding: 12px; }
.ers-drop.is-dragover { border-color: var(--accent); background: var(--brand-bg-soft); }
.ers-drop-hint, .ers-file-name { margin: 4px 0 0; }
.ers-file-name:empty { display: none; }
.ers-uploading, .audio-uploading { margin: 6px 0 0; font-weight: 600; color: var(--accent); }
.audio-file-clear, .script-photo-clear { margin-left: 8px; }
.gal-search-mobile { display: none; }
@media (max-width: 760px) {
  .gal-search-mobile { display: flex; flex-wrap: wrap; margin: 0 0 10px; }
  .gal-search-mobile input[name="q"] { min-width: 0; flex: 1 1 160px; }
  .gal-filters-wrap .gal-search { display: none; }
}
.site-footer-help { margin-bottom: 6px; }
.lp-body .site-footer-help { display: none; }
.admin-service-notes { margin: 12px 0; padding-left: 20px; font-size: 13px; line-height: 1.6; }
.admin-service-notes li { margin-bottom: 6px; }
[data-photo-clear][hidden], [data-audio-clear][hidden] { display: none; }
/* 20261021-alalshow-sf5-post-format-flow: 게시글형을 고르면 목소리 믹싱 칸 대신 게시글형 음량 안내 */
#auto-form:has(input[name="format"][value="post"]:checked) .auto-voice-mix { display: none; }
/* 20261021-alalshow-sf5-post-format-flow (3차 감사): ① "고쳐 주세요" 칸 · 고칠 구절 표시 · ② 내 영상이 필요한 구절 미리 보기 · ④ 맞는 장면이 없는 구절 */
.auto-post-fix { margin: 0 0 var(--space-3); padding: 12px 18px; border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); color: var(--warn-ink); }
.auto-post-fix p { margin: 0 0 6px; }
.auto-post-fix ul { margin: 0 0 var(--space-2); padding-left: 1.2em; font-size: var(--text-sm); overflow-wrap: anywhere; }
.auto-post-phrase[data-issue] input { border-color: var(--warn-dot); background: var(--warn-bg); }
.auto-post-media-list li.needs-source { color: var(--warn-ink); font-weight: 500; }
.auto-post-needs { margin: 8px 0 12px; }
.auto-post-needs h3 { margin: 0 0 6px; font-size: var(--text-md); }
.auto-post-needs ol { margin: 6px 0 0; padding-left: 1.4em; font-size: var(--text-sm); overflow-wrap: anywhere; }

/* 20261022-alalshow-sf5-post-presets — 게시글형 추천 세트 카드 (설정 · 렌더 카드) · 한 번에 쇼츠 만들기 "이 분야 추천 세트" */
.post-presets { display: grid; gap: 6px; margin: 4px 0 8px; min-width: 0; }
.post-presets-title { margin: 0; font-size: 15px; }
.post-presets-lead, .post-preset-note { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.post-preset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.post-preset-grid li { min-width: 0; }
.post-preset { display: grid; gap: 2px; width: 100%; min-width: 0; padding: 6px; border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.post-preset:hover, .post-preset:focus-visible { border-color: var(--accent); }
.post-preset.is-on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.post-preset-thumb { display: block; width: 100%; height: auto; aspect-ratio: 216 / 103; border-radius: 6px; border: 1px solid var(--line); }
.post-preset-name { font-weight: 700; font-size: 14px; overflow-wrap: anywhere; }
.post-preset-meta { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.post-preset-form { display: none; }
.auto-brand-hint:empty { display: none; }
.auto-brand-hint { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: var(--space-3); align-items: start; margin: var(--space-2) 0 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); }
.auto-brand-hint-thumb { width: 108px; height: auto; border-radius: 6px; border: 1px solid var(--line); }
.auto-brand-hint-body { display: grid; gap: 4px; min-width: 0; }
.auto-brand-hint-body p { margin: 0; overflow-wrap: anywhere; }
.auto-brand-hint-why, .auto-brand-hint-note { font-size: 12px; }
@media (max-width: 760px) {
  .post-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .auto-brand-hint { grid-template-columns: 72px minmax(0, 1fr); }
  .auto-brand-hint-thumb { width: 72px; }
}
/* 20261022-alalshow-sf5-sound-variety: 게시글형 소리 고르기 — 목소리 카드 · 배경음 · 크기 · 효과음 3자리 · ▶ 미리 듣기 (게시글형 설정 · 목소리 화면 · 만들기 폼) */
.post-sound-slot:empty { display: none; }
.post-sound { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.post-sound h2 { margin: 0; font-size: 18px; }
.post-sound .ps-intro { margin: 0; font-size: 13px; }
.ps-group { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ps-head { margin: 0; font-size: 15px; }
.ps-head small { font-weight: 400; }
.ps-voice-list, .ps-bgm-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.ps-voice, .ps-bgm { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); }
.ps-voice.is-on, .ps-bgm.is-on { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; background: var(--brand-bg-soft); }
.ps-voice-pick, .ps-bgm-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; cursor: pointer; }
.ps-voice-name { font-weight: 700; }
.ps-voice-who { font-size: 13px; }
.ps-badge { display: inline-block; padding: 1px 6px; border-radius: var(--radius-lg); font-size: var(--text-xs); font-weight: 500; background: var(--brand-bg); color: var(--brand-ink); }
.ps-badge-mine { background: var(--good-bg); color: var(--good-ink); }
.ps-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; font-size: 12px; }
.ps-tag { display: inline-block; padding: 1px 6px; border-radius: var(--radius-lg); border: 1px solid var(--rule); background: var(--ground); font-size: var(--text-xs); }
.ps-rec { color: var(--muted); font-size: 12px; }
.ps-note { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.ps-play { align-self: flex-start; }
.ps-play.is-playing { background: var(--brand-bg); color: var(--brand-ink); }
.ps-nudge { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; border: 0; margin: 0; padding: 0; }
.ps-nudge legend { font-weight: 600; font-size: 14px; margin-bottom: 4px; }
.ps-sfx-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.ps-sfx-field { min-width: 0; }
.ps-sfx-field select { min-width: 140px; }
.ps-sfx-row .field-error { flex-basis: 100%; margin: 0; }
.ps-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ps-saved { color: var(--good); font-weight: 600; }
.post-sound-hint { margin: 8px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.post-sound-make { display: none; }
#auto-form:has(input[name="format"][value="post"]:checked) .post-sound-make { display: flex; }
#auto-form:has(input[name="format"][value="post"]:checked) #auto-sfx { display: none; }
@media (max-width: 600px) {
  .ps-voice-list, .ps-bgm-list { grid-template-columns: minmax(0, 1fr); }
}
/* 20261022-alalshow-sf5-layout-templates — 화면 배치 카드 6장 (한 번에 쇼츠 만들기 · 게시글형 설정) · 형식 배지 */
.layout-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 10px 0 4px; min-width: 0; }
.layout-card { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; column-gap: var(--space-2); row-gap: 4px; align-items: start; padding: var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); cursor: pointer; min-width: 0; }
.layout-card:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); background: var(--brand-bg-soft); }
.layout-card input { grid-row: 1; grid-column: 1; margin-top: 3px; }
.layout-thumb { grid-column: 2; grid-row: 1; width: 64px; height: auto; aspect-ratio: 9 / 16; border-radius: 6px; border: 1px solid var(--line); object-fit: cover; background: var(--bg); }
.layout-name { grid-column: 1 / -1; font-weight: 500; }
.layout-look { grid-column: 1 / -1; font-size: var(--text-xs); overflow-wrap: anywhere; }
.layout-guide { grid-column: 1 / -1; display: none; font-size: var(--text-sm); overflow-wrap: anywhere; }
.layout-card:has(input:checked) .layout-guide { display: block; }
#auto-form .auto-layouts { display: none; }
#auto-form:has(input[name="format"][value="post"]:checked) .auto-layouts { display: grid; }
@media (max-width: 480px) {
  .layout-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* 20261022-alalshow-sf5-layout-fields-edit — ① 대본 확인 배치 칸 (랭킹·리뷰·비교·속보·채팅) · 칸 옆 오류 · ④ 배치 칸 한 줄 */
.auto-post-head .field-error { grid-column: 1 / -1; }
.auto-layout-fields { display: grid; gap: var(--space-2) var(--space-3); margin: 0 0 var(--space-3); padding: var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--ground); min-width: 0; }
.auto-layout-fields legend { float: left; width: 100%; margin-bottom: var(--space-2); padding: 0; font-weight: 500; }
.auto-layout-fields .field { min-width: 0; }
.auto-layout-fields select { max-width: 100%; }
.auto-ly-note { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.auto-ly-rank { display: grid; grid-template-columns: minmax(5.5em, auto) minmax(0, 1fr) minmax(0, 1fr); gap: 4px var(--space-3); align-items: end; padding-top: var(--space-2); border-top: 1px solid var(--rule); }
.auto-ly-said, .auto-ly-rank .field-error { grid-column: 1 / -1; }
.auto-ly-said { font-size: 12px; }
.auto-ly-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(9em, 1fr)); gap: 6px 10px; min-width: 0; }
.auto-ly-chips .field-error { grid-column: 1 / -1; }
.auto-post-form input[aria-invalid="true"], .auto-layout-fields select[aria-invalid="true"] { border-color: var(--danger-ink); background: var(--danger-bg); }
.auto-post-phrase .field-error { margin: 0; }
.auto-post-layout-note { margin: 8px 0 0; font-size: 13px; overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .auto-ly-rank { grid-template-columns: minmax(0, 1fr); }
}

/* 20261023-alalshow-sf5-ui-migrate-make-flow — 한 번에 쇼츠 만들기 흐름: 만들기 폼(첫 카드 · 더 고르기 · 오류 요약 · 최근 작업) ·
   작업 화면(단계 줄 상태 · 진행 한 줄 · 보내기 카드) · 전체 작업(줄 누르기) · 계획 보드 · 미리 보기. 값은 디자인 값(tokens.css)만. */
.page-auto .auto-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
#auto-form .auto-examples { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: var(--space-2) 0 0; }
.auto-examples-label { font-size: var(--text-sm); }
.auto-more { border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--paper); min-width: 0; }
.auto-more > summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); min-height: var(--tap); padding: var(--space-2) var(--space-4); list-style: none; }
.auto-more > summary::-webkit-details-marker { display: none; }
.auto-more > summary::before { content: "▸"; color: var(--text-muted); }
.auto-more[open] > summary::before { content: "▾"; }
.auto-more-label { font-size: var(--text-lg); font-weight: 500; }
.auto-more > summary .muted { font-size: var(--text-sm); overflow-wrap: anywhere; }
.auto-more-body { display: flex; flex-direction: column; gap: var(--space-4); padding: 0 var(--space-4) var(--space-4); min-width: 0; }
.auto-err-summary, .auto-precheck { flex-basis: 100%; }
.auto-err-summary { margin: 0; }
#auto-form:has(input[name="format"][value="post"]:checked) .auto-voice-where-template { display: none; }
#auto-form:has(input[name="voice"][value="file"]:checked) #ps-voices { display: none; }
.auto-voice-where { margin: 0; font-size: var(--text-sm); }
.auto-recent-list { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.auto-recent-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.auto-recent-link { font-weight: 700; overflow-wrap: anywhere; }
.auto-recent-foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0; }
/* 작업 화면 */
.auto-panel { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.auto-panel .kit-step { flex-wrap: wrap; }
.auto-panel .kit-step-state { flex-basis: 100%; font-size: var(--text-xs); color: var(--text-muted); }
.auto-panel .kit-step[data-status="awaiting_review"] .kit-step-state { color: var(--warn-ink); font-weight: 700; }
.auto-panel .kit-step[data-status="failed"] .kit-step-state { color: var(--danger-ink); font-weight: 700; }
.auto-panel .kit-step[data-status="running"] .kit-step-state { color: var(--info-ink); font-weight: 700; }
.auto-progress .kit-job-bar { margin: 0; }
.auto-cp-hint { margin: 0; }
.auto-banner.msg { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.auto-uploads h3 { margin: var(--space-3) 0 var(--space-2); font-size: var(--text-md); }
.auto-post-media-list > summary { cursor: pointer; font-weight: 700; min-height: var(--tap); display: flex; align-items: center; gap: var(--space-2); list-style: none; }
.auto-post-media-list > summary::-webkit-details-marker { display: none; }
.auto-post-media-list > summary::before { content: "▸"; color: var(--text-muted); }
.auto-post-media-list[open] > summary::before { content: "▾"; }
/* 묶음 A: 확인 카드 안 영상 담기 칸은 칸 안 칸 — 그림자 대신 1px 선 하나 */
.auto-sources .card { box-shadow: none; border: 1px solid var(--rule); }
/* ⑥ 유튜브 폼을 연 뒤: 바깥 [유튜브에 올리기]와 서비스 전체 남은 업로드 수는 숨긴다 (점검 C#144 — 같은 이름 버튼 둘) */
.auto-send-actions:has(~ .auto-deliver-out #auto-yt) [data-send="youtube"] { display: none; }
.auto-yt #upl-left, .auto-yt .upl-shop-note { display: none; }
/* 휴대폰 ② 영상 파일 칸이 카드 밖으로 나가던 문제 (점검 C#139) */
.auto-checkpoint, .auto-sources, .auto-sources .card { min-width: 0; max-width: 100%; }
.auto-sources input[type="file"] { max-width: 100%; min-width: 0; }
/* 전체 작업 */
.auto-job-row[data-row-href] { cursor: pointer; }
.auto-job-row[data-row-href]:hover td { background: var(--ground); }
.auto-job-link { font-weight: 700; overflow-wrap: anywhere; }
.auto-job-actions { white-space: nowrap; }
.auto-job-actions .btn + .btn { margin-left: var(--space-1); }
.auto-pager { margin-top: var(--space-3); }
.auto-pager:empty { display: none; }
/* 계획 보드 */
.pln-job-link { font-size: var(--text-sm); font-weight: 600; }
.pln-count-row { margin: 0 0 var(--space-3); }
/* 미리 보기 */
.page-demo .demo-other { margin-top: var(--space-3); }
.page-demo .demo-other > summary { cursor: pointer; min-height: var(--tap); display: flex; align-items: center; }
@media (max-width: 640px) {
  .auto-more > summary { padding: var(--space-2) var(--space-3); }
  .auto-more-body { padding: 0 var(--space-3) var(--space-3); }
  .auto-job-actions { white-space: normal; }
}

/* 20261023-alalshow-sf5-ui-migrate-make-tools — 만들기 도구 9개 공용 틀 이관: 접는 칸(세부 조정·꾸미기·자세히)·잠긴 입력·넘겨 받은 안내 (디자인 값만) */
.voice-more, .audio-more, .scene-options, .scene-cast-more, .render-decor, .capcut-guide { padding: var(--space-3) var(--space-4); }
.voice-more-summary, .audio-more-summary, .scene-more-summary, .render-more-summary, .capcut-guide-summary, .capcut-install-summary {
  cursor: pointer; min-height: var(--tap); display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); font-weight: 700; overflow-wrap: anywhere;
}
.voice-more-summary .muted, .audio-more-summary .muted, .scene-more-summary .muted, .render-more-summary .muted, .capcut-guide-summary .muted { font-weight: 400; font-size: var(--text-sm); }
.voice-more[open] > summary, .audio-more[open] > summary, .scene-options[open] > summary, .scene-cast-more[open] > summary,
.render-decor[open] > summary, .capcut-guide[open] > summary { margin-bottom: var(--space-3); }
.voice-more-note { margin: 0 0 var(--space-3); font-size: var(--text-sm); }
.audio-sub, .voice-more .voice-card, #voice-presets, #voice-cleanup { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--rule); }
.render-more, .capcut-more, .render-seed { margin-top: var(--space-2); font-size: var(--text-sm); }
.render-more > summary, .capcut-more > summary, .render-seed > summary, .capcut-manual > summary, .topic-hints-more > summary { cursor: pointer; min-height: var(--tap); display: flex; align-items: center; }
.topic-hints-more .topic-hints { margin: var(--space-1) 0 0; }
.post-brand-more { margin: var(--space-3) 0; }
.script-example-row { margin: 0 0 var(--space-2); display: flex; justify-content: flex-end; }
.script-tabs { flex-wrap: wrap; }
.scene-form[data-locked] .scene-script, .scene-form[data-locked] .scene-options { opacity: .7; }
.scene-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.scene-key { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); margin-bottom: var(--space-3); }
/* 묶음 A: 키 상태 줄은 왼쪽부터 (가운데로 몰리던 것), 받는 법·안내 칸은 한 줄 전체 */
.scene-key > :is(.key-guide, .msg, .keyless-note) { align-self: stretch; }
.clip-top { margin-bottom: var(--space-3); }
.clip-match-why { margin: var(--space-2) 0 0; }
.clip-session-date { font-size: var(--text-sm); }
.make-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.capcut-bridge-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-3); }
.capcut-manual { margin-top: var(--space-3); }
.capcut-manual code { display: block; margin: var(--space-2) 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); background: var(--muted-bg); overflow-wrap: anywhere; }
.upl-links { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.key-back { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-4); }
.auto-handoff { margin: 0 0 var(--space-3); }
.narration-to-make { font-weight: 600; }

/* 20261023-alalshow-sf5-detail-image-reader — 상세 이미지 카드 (만들기·대본 쓰기의 제품 정보 칸 아래) · 휴대폰은 한 줄씩 */
.detail-reader { margin: 12px 0 4px; min-width: 0; }
/* 묶음 A: 상세 이미지 카드는 칸 안 칸 — 흐린 바탕 하나(점선·그림자 없음) */
.detail-reader .detail-card { margin: 0; padding: var(--space-4); border: 0; border-radius: var(--radius-md); background: var(--ground); box-shadow: none; }
.detail-reader .detail-card h2 { font-size: var(--text-lg); margin: 0 0 4px; }
.detail-note { margin: 0 0 var(--space-3); font-size: var(--text-sm); overflow-wrap: anywhere; }
.detail-body { min-width: 0; }
.detail-upload, .detail-result { gap: 10px; min-width: 0; }
.detail-upload input[type="file"] { max-width: 100%; }
.detail-msg:empty { display: none; }
.detail-result-title { margin: 4px 0 0; font-size: var(--text-lg); }
.detail-tiles { font-weight: 400; font-size: var(--text-xs); }
.detail-edit { gap: 8px; min-width: 0; }
.detail-edit .field { min-width: 0; }
.detail-edit input, .detail-edit textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
.detail-edit input[aria-invalid="true"], .detail-edit textarea[aria-invalid="true"] { border-color: var(--danger-ink); }
.detail-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.detail-evidence { margin: 0; padding-left: 18px; font-size: var(--text-xs); }
.detail-list { margin: 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); border: 1px solid var(--rule); background: var(--paper); font-size: var(--text-sm); }
.detail-list[data-tone="warn"] { background: var(--warn-bg); color: var(--warn-ink); }
.detail-list h4 { margin: 0 0 4px; font-size: var(--text-sm); }
.detail-list ul { margin: 0; padding-left: 18px; }
.detail-list li { overflow-wrap: anywhere; }
.detail-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.detail-fold { display: grid; gap: var(--space-2); min-width: 0; }
.detail-fold > summary { cursor: pointer; min-height: var(--tap); display: flex; align-items: center; font-weight: 500; overflow-wrap: anywhere; }
textarea.detail-filled { outline: 2px solid var(--good); outline-offset: 1px; }
@media (max-width: 600px) {
  .detail-row { grid-template-columns: minmax(0, 1fr); }
  .detail-actions .btn { flex: 1 1 100%; }
}
/* 20261023-alalshow-sf5-voice-remove — SR-VRM-01 영상 목소리 지우기 (원본 고르기 · 결과 재생 · 받기 · 최근 결과). 색·간격은 디자인 값만 */
.vr-upload-form { padding-bottom: var(--space-4); margin-bottom: var(--space-4); border-bottom: 1px solid var(--rule); }
.vr-picks { display: grid; gap: var(--space-2); margin: 0; padding: var(--space-3); border: 1px solid var(--rule); border-radius: var(--radius-md); min-width: 0; }
.vr-picks legend { padding: 0 var(--space-1); font-weight: 700; }
.vr-pick-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-1); }
.vr-pick { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); min-height: var(--tap); overflow-wrap: anywhere; }
.vr-pick-name { font-weight: 600; overflow-wrap: anywhere; }
.vr-pick-title { margin: var(--space-2) 0 0; font-size: var(--text-sm); }
.vr-player { display: block; width: 100%; max-width: 360px; max-height: 70vh; aspect-ratio: 9 / 16; border-radius: var(--radius-md); background: var(--ground); }
.vr-audio { display: block; width: 100%; max-width: 480px; }
.vr-summary { margin: var(--space-2) 0; font-weight: 600; overflow-wrap: anywhere; }
.vr-downloads { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.vr-recent-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.vr-recent-item { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--rule); }
.vr-recent-item:first-child { border-top: 0; }
.vr-recent-line { flex: 1 1 16em; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .vr-player { max-width: 100%; }
  .vr-downloads .btn { width: 100%; }
  .vr-downloads li { flex: 1 1 100%; }
}
/* 20261023-alalshow-sf5-ui-migrate-discover — 소재 찾기 7개 화면(잘 터진 영상 모음 · 지금 뜨는 이슈 · 소재 스크랩 · 영상 속 제품 찾기 ·
   중국 플랫폼 검색 · 영상·음원 저장 · 영상 글자 지우기)을 공용 틀로 옮기며 더한 규칙. 색·간격은 디자인 값(var(--…))만. */
/* 공용 대화창 닫기 버튼은 한 줄 (휴대폰에서 '닫/기'로 쪼개졌다) */
.kit-dialog-close, .gal-close { white-space: nowrap; flex-shrink: 0; }
/* 결과 카드 안 다음 단계는 작은 버튼 */
.saved-next .next-steps, .trend-next .next-steps, .trace-found .next-steps, .ers-card .next-steps, .dl-next .next-steps { padding-top: var(--space-1); }
.saved-next .next-step, .trend-next .next-step, .trend-panel-inner .next-step { min-height: 30px; padding: 4px 10px; font-size: var(--text-sm); line-height: 20px; }
.saved-next .next-steps-title, .trend-next .next-steps-title { font-size: var(--text-xs); }

/* 잘 터진 영상 모음 — [재생·분석] 대화창은 넓게, 휴대폰은 화면 전체 */
#gal-detail-dialog.kit-dialog { width: min(1000px, calc(100% - 32px)); }
#gal-detail-dialog .gal-panel { border: 0; padding: 0; }
.gal-first-run { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.gal-first-run .empty { flex: 1 1 320px; }
.gal-hide-tip { margin-top: var(--space-1); font-size: var(--text-sm); }
.gal-hide-tip > summary { cursor: pointer; color: var(--text-muted); }
.gal-hide-tip p { margin: var(--space-1) 0 0; }
.gal-locked .msg, .gal-save-flash .msg { font-size: var(--text-sm); }
.gal-script-title { margin: 0 0 var(--space-2); font-size: var(--text-md); }
@media (max-width: 640px) {
  #gal-detail-dialog.kit-dialog { width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; border-radius: 0; }
}

/* 지금 뜨는 이슈 — 묶인 영상 대화창 · 순위 안내 · 빈 화면 */
#trend-dialog.kit-dialog { width: min(520px, calc(100% - 32px)); }
.trend-overall { margin: calc(var(--space-1) * -1) 0 0; font-size: var(--text-xs); }
.trend-empty { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.trend-empty .empty { flex: 1 1 320px; }
.trend-next { margin-top: var(--space-2); }

/* 소재 스크랩 — 그룹 칸 정렬 · 출처 줄 · 채널 찾기 결과 닫기 · 메모 고치기 */
.saved-form .saved-group-field { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); }
/* 입력 양식은 공용 카드(K2) 안 — 양식 자체 테두리는 겹치지 않게 */
.saved-input-card .saved-form { border: 0; padding: 0; margin: 0; background: none; box-shadow: none; }
.saved-source { margin: 0; font-size: var(--text-xs); }
.saved-scan-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.saved-memo-edit textarea { width: 100%; min-width: 220px; }
.saved-search-note { margin-top: 0; }
.saved-failed-text { color: var(--warn-ink); font-weight: 500; }
@media (max-width: 760px) {
  /* 20261026-alalshow-sf5-viewfinder-tone (묶음 B): 좁은 화면 썸네일 칸(56px)에 썸네일도 맞춘다 (72px 그대로면 제목 위로 겹쳤다) */
  .saved-thumb { width: 56px; height: 100px; }
  /* 칩 줄이 가로로 밀릴 때 칩 그림자가 잘리지 않게 안쪽 여백 */
  .gal-chips { padding: var(--space-1); margin: calc(var(--space-1) * -1); }
}

/* 영상 속 제품 찾기 — 접힌 검색어·모아두기 */
.trace-more > summary.trace-more-summary { cursor: pointer; font-size: var(--text-lg); font-weight: 700; padding: var(--space-1) 0; }
.trace-more[open] > summary.trace-more-summary { margin-bottom: var(--space-3); }
.trace-more-part + .trace-more-part { margin-top: var(--space-4); }
.trace-more-part h2 { font-size: var(--text-md); margin: 0 0 var(--space-2); }

/* 중국 플랫폼 검색 — 상태 한 줄 · 더 보기 · 휴대폰 탭 한 줄 · 결과 두 줄 */
.cn-status { display: flex; flex-direction: column; gap: var(--space-1); }
.cn-status-line { margin: 0; font-size: var(--text-sm); }
.cn-status-more > summary { cursor: pointer; font-size: var(--text-sm); color: var(--text-muted); }
.cn-status-more[open] > summary { margin-bottom: var(--space-2); }
.cn-more { position: relative; display: inline-block; }
.cn-more > summary { list-style: none; cursor: pointer; }
.cn-more > summary::-webkit-details-marker { display: none; }
.cn-more-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 6; display: flex; flex-direction: column; min-width: 170px; padding: var(--space-2); border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-2); }
.cn-more-item { display: block; padding: 7px 12px; border-radius: var(--radius-btn); color: var(--text); text-decoration: none; font-size: var(--text-md); line-height: 21px; white-space: nowrap; }
.cn-more-item:hover { background: var(--ground); color: var(--brand); }
.cn-tab-label, .cn-tab-face { white-space: nowrap; }
.cn-prefill-note { margin: var(--space-1) 0 0; }
@media (max-width: 640px) {
  /* 칩 그림자가 가로 밀기 칸 끝에서 잘리지 않게 안쪽 여백 4px */
  .cn-tabs { flex-wrap: nowrap; overflow-x: auto; padding: var(--space-1); margin: calc(var(--space-1) * -1); }
  .cn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
  .cn-grid .cn-actions .btn { padding: 6px 8px; font-size: var(--text-xs); }
}

/* 영상·음원 저장 — 머리 줄 · 줄마다 카드(휴대폰) · 다음 단계 */
.dl-board-head { flex-wrap: wrap; justify-content: flex-start; }
.dl-board-head h2 { margin-right: auto; }
.dl-support { margin: 0; }
.dl-bridge-help { margin-bottom: var(--space-2); }
.dl-next { margin-top: var(--space-3); }
@media (max-width: 640px) {
  /* 20261026-alalshow-sf5-viewfinder-tone (묶음 B): 받을 목록 칸 안의 줄 카드는 1px 선 하나 (칸 그림자와 겹치지 않게) */
  .page .dl-table.table-stack tr { box-shadow: none; border: 1px solid var(--rule); }
  .page .dl-table.table-stack td { text-align: left; flex-wrap: wrap; }
  .page .dl-table.table-stack .dl-actions { justify-content: flex-start; flex-wrap: wrap; }
  .page .dl-table.table-stack .dl-link span { overflow-wrap: anywhere; }
}

/* 영상 글자 지우기 — 세로 영상 상자 · 링크 탭에서는 올린 파일 숨김 */
.ers-side .ers-video { width: auto; max-width: 100%; max-height: 520px; aspect-ratio: auto; display: block; margin: 0 auto; }
.ers-input:has(input[name="input_kind"][value="link"]) + .ers-upload { display: none; }
.ers-band-color[hidden] { display: none; }
#gal-detail-dialog .gal-detail { margin-top: 0; }
/* 20261023-alalshow-sf5-ui-migrate-rest — 홈·설정·게시글형 설정·키·계정·로그인·안내·도움말·관리자·소개·법적·404/500·스레드·링크·연습·재심
   (공용 틀 위 화면 고유 모양만, 값은 디자인 값 var(--…)). */
/* 바닥글 "운영자 정보 준비 중"은 덜 눈에 띄게 (점검 A1) */
.site-footer-pending { font-weight: 400; color: var(--text-muted); }
/* 홈: 6단계 띠는 링크 (점검 A22) · 선택 카드 */
.page-home .step-strip { margin-top: var(--space-2); }
.page-home .step-item { display: flex; }
.page-home .step-chip { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1); min-height: var(--btn-h); color: var(--text); text-decoration: none; cursor: pointer; }
.page-home .step-chip:hover { background: var(--brand-bg-soft); color: var(--brand); }
@media (max-width: 640px) { .page-home .step-chip { min-height: var(--tap); padding: 6px; word-break: keep-all; } }
.page-home .step-no { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--muted-bg); font-size: var(--text-xs); }
.page-home .step-strip-note { grid-column: 1 / -1; margin: var(--space-1) 0 0; }
.page-home .setup-card[data-optional="true"] { background: var(--ground); }
/* sf5-final-check(AF): 선택 카드의 "선택" 표시는 할 일 색(주황)이 아닌 흐린 색 */
.page-home .setup-card[data-optional="true"][data-status="todo"] .status-chip { background: var(--muted-bg); color: var(--muted-ink); }
.page-home .setup-optional { margin: 0; }
/* 제작 기본값: 접은 고급 값 · 버튼 옆 결과 · 다른 화면 요약 줄 */
.page-settings .settings-more > summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); min-height: var(--tap); }
.page-settings .settings-more-title { display: inline; margin: 0; font-size: var(--text-lg); }
.page-settings details.settings-more:not(.card) { margin-top: var(--space-3); }
.page-settings .settings-actions { flex-direction: column; align-items: stretch; gap: var(--space-2); padding: var(--space-2) 0 var(--space-5); }
.page-settings .settings-buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.page-settings .settings-link-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.page-settings .settings-link-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.page-settings .settings-link-name { font-weight: 700; }
/* 게시글형 설정: 기존 템플릿이면 게시글형 칸은 잠김 표시 (점검 A49) · 색 고르기 */
.post-only-group { display: grid; gap: 12px; }
.post-only-group[data-inactive="true"] { opacity: 0.45; }
.post-color-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-2) var(--space-4); }
.post-color input[type="color"] { width: 64px; height: var(--btn-h); padding: 2px; border: 1px solid var(--input-line); border-radius: var(--radius-sm); background: var(--paper); }
@media (max-width: 640px) { .post-color input[type="color"] { height: var(--tap); } }
.post-set-actions { display: grid; gap: var(--space-2); justify-items: start; }
.post-set-actions .kit-error-summary, .post-set-actions .msg { justify-self: stretch; }
.post-sound-settings { border: 1px solid var(--rule); border-radius: var(--radius-md); padding: var(--space-4); }
/* 내 API 키: 다른 설정 화면과 같은 폭 (점검 A54) */
.page-keys .key-cards { max-width: none; }
/* 로그인·가입: 머리와 카드를 세로로 가운데 */
.page-auth { flex-direction: column; align-items: center; }
.page-auth .kit-head, .page-auth .auth-notice { width: 100%; max-width: 400px; }
.page-auth .auth-card { margin-top: var(--space-3); }
/* 소개: 위쪽 바 시작 버튼 */
.landing-topnav { display: flex; gap: var(--space-2); margin-left: auto; }
.page-landing .kit-head h1 { font-size: var(--text-2xl); line-height: 30px; }
/* 404 · 500 */
.status-page { text-align: center; padding: var(--space-6) var(--space-4); }
.status-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); }
/* 사용 안내 자료: 처음 시작하기 */
.guide-start-steps { margin: 0; padding-left: var(--space-5); display: grid; gap: var(--space-3); }
.guide-start-step p { margin: var(--space-1) 0 var(--space-2); }
.guide-key-needs { margin: 0 0 var(--space-3); padding-left: var(--space-5); display: grid; gap: var(--space-2); }
/* 도움말: FAQ 링크 · 문의 버튼 */
.faq-link { margin: var(--space-1) 0 0; font-size: var(--text-sm); }
.help-contact .contact-list { list-style: none; padding: 0; display: grid; gap: var(--space-2); }
/* 관리자: 탭 줄 · 비밀번호 초기화 확인 · 휴대폰 */
.page-admin .admin-tabs { display: block; margin: 0 0 var(--space-4); border-bottom: 0; }
.admin-pw-confirm > summary { list-style: none; }
.admin-pw-confirm .admin-confirm { margin-top: var(--space-2); }
.page-admin .admin-panel { max-width: 100%; overflow-x: auto; }
.page-admin .admin-form .btn, .page-admin .admin-services-table .btn { width: auto; }
@media (max-width: 640px) {
  .page-admin .admin-actions { display: grid; gap: var(--space-2); justify-items: start; text-align: left; }
}
/* 링크 모음: 공개 상태 버튼 · 공개 화면 바닥 한 줄 */
.lnk-publish-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.lp-footer { max-width: 440px; margin: 0 auto; padding: var(--space-4); text-align: center; font-size: var(--text-xs); opacity: 0.7; }
.lp-footer a { color: inherit; }
@media (max-width: 640px) {
  .page-link .lnk-slug { flex-wrap: wrap; }
  .page-link .lnk-prefix { flex-basis: 100%; padding: 6px 12px 0; font-size: var(--text-xs); }
}
/* 스레드: 지난 글 */
/* 20261026-alalshow-sf5-viewfinder-tone (묶음 C): 지난 글·지난 대본은 줄마다 아래 1px 선 (분석기 표 줄처럼) */
.threads-history-list, .appeal-history-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.threads-history-item, .appeal-history-item { padding: var(--space-2) 0; border-bottom: 1px solid var(--rule); }
.threads-history-item:last-child, .appeal-history-item:last-child { border-bottom: 0; }
.threads-history-item a { text-decoration: none; }
.threads-history-item a:hover { color: var(--brand); }
@media (max-width: 640px) { .threads-history-item a { display: inline-flex; align-items: center; min-height: var(--tap); } }
.threads-history-item[aria-current="true"] a, .appeal-history-item[aria-current="true"] .appeal-history-label { font-weight: 700; }
.appeal-history-item { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
/* 대본 구조 연습: 채점 줄의 문장 원문 · 단계 설명 접기 */
.grade-text { display: block; margin-top: 2px; color: var(--text); }
.trainer-definitions > summary { cursor: pointer; list-style: none; }
.trainer-definitions-title { display: inline; margin: 0; }
/* 재심: 접은 선택 칸 · 규칙 */
.appeal-more { border-top: 1px solid var(--rule); padding-top: var(--space-3); }
.appeal-more-summary { cursor: pointer; font-weight: 700; min-height: var(--tap); display: flex; align-items: center; }
.appeal-rules > summary { cursor: pointer; }
.appeal-rules-title { display: inline; margin: 0; }

/* 20261026-alalshow-sf5-viewfinder-tone (묶음 D) — 홈·설정·계정·관리자·공개 화면을 분석기 톤으로 (디자인 값만).
   양식 칸 안 입력은 읽기 좋은 폭까지만(칸 자체는 전체 폭), 칸 안 칸은 흐린 바탕 또는 1px 선 하나. */
.page-settings .settings-card > .field, .page-settings .field-grid { max-width: 960px; }
.page-settings .settings-card > .field { max-width: 720px; }
.page-post-settings .post-set-brand .field, .page-post-settings .post-set-brand .post-color-row { max-width: 720px; }
.page-keys .key-card .field, .page-account .card .field { max-width: 720px; }
.page-quota #quota-code-form .field { max-width: 480px; }
/* 접는 칸 제목: 펼침 표시 (분석기 "검색 내역 ▾"처럼) */
.page-settings .settings-more > summary::before { content: "▸"; color: var(--text-muted); font-size: var(--text-xs); }
.page-settings .settings-more[open] > summary::before { content: "▾"; }
.page-settings details.settings-card:not([open]) { gap: 0; }
.page-settings .settings-more > summary { align-items: center; }
/* 키 받는 법 (내 API 키 · 사용 안내): 칸 안 칸 = 흐린 바탕 하나, 꼭 알 점은 주의 색조 */
:is(.page-keys, .page-guide) .key-guide { border: 0; border-radius: var(--radius-md); background: var(--ground); }
:is(.page-keys, .page-guide) .key-guide-summary { font-size: var(--text-md); }
:is(.page-keys, .page-guide) .key-guide-need { border: 1px solid var(--warn-line); border-radius: var(--radius-md); background: var(--warn-bg); font-weight: 500; }
/* 게시글형 설정: 고르기 칸 둥글기 8 · 고른 칸 = 파랑 선, 어두운 꼬리표 → 흐린 꼬리표 */
.page-post-settings :is(.ps-voice, .ps-bgm, .post-preset, .layout-card) { border-color: var(--rule); border-radius: var(--radius-md); }
.page-post-settings :is(.ps-voice.is-on, .ps-bgm.is-on, .post-preset.is-on, .layout-card:has(input:checked)) { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; }
.page-post-settings .ps-badge { background: var(--muted-bg); color: var(--muted-ink); font-weight: 500; }
.page-post-settings .ps-badge-mine { background: var(--good-bg); color: var(--good-ink); }
.page-post-settings :is(.ps-tag, .layout-thumb, .post-preset-thumb) { border-color: var(--rule); }
.page-post-settings :is(.ps-head, .post-presets-title) { font-size: var(--text-md); }
.page-post-settings .post-sound h2 { font-size: var(--text-lg); }
/* 관리자: 표 아래 안내와 간격 */
.page-admin .kit-table-wrap + .admin-note, .page-admin .admin-table + .admin-note { margin-top: var(--space-2); }
/* 바닥글: 도움말 줄은 링크 줄 옆, 링크 페이지 바닥은 가운데 */
.site-footer-help { margin-bottom: 0; }
.lp-body .site-footer { justify-content: center; }
/* 없는 링크 페이지 (/l/…): 베이지 테마 대신 분석기 톤 — 흐린 바탕 · 파란 404 (자체 화면이라 위쪽 바는 없다) */
.lp-plain { --lp-bg: var(--ground); --lp-surface: var(--paper); --lp-ink: var(--text); --lp-muted: var(--text-muted); --lp-accent: var(--brand); --lp-accent-ink: var(--paper); --lp-note-bg: var(--info-bg); --lp-note-ink: var(--info-ink); }
.lp-plain .lp-missing-mark { font-size: calc(var(--text-2xl) * 2); font-weight: 700; }
.lp-plain .lp-name { font-size: var(--text-2xl); font-weight: 700; letter-spacing: 0; }
.lp-plain .lp-intro { font-size: var(--text-md); }
.lp-plain .lp-footer { color: var(--text-muted); opacity: 1; }
.lp-plain .lp-footer .site-footer-privacy { color: var(--brand-ink); font-weight: 700; }
/* 20261024-alalshow-sf5-erase-combo: 영상 글자·목소리 지우기 — 무엇을 지울까요 · 접는 글자 방법 · 받은 파일 고르기 · 둘 다 카드 */
.ers-remove { border: 0; margin: 0; padding: 0; display: grid; gap: var(--space-2); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); min-width: 0; }
.ers-remove legend { font-weight: 500; font-size: var(--text-md); margin-bottom: var(--space-2); padding: 0; }
.ers-remove-choice { min-height: var(--tap); }
.ers-text-opts { border: 1px solid var(--rule); border-radius: var(--radius-md); }
.ers-text-opts-summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); min-height: var(--tap); padding: var(--space-2) var(--space-3); font-weight: 500; }
.ers-text-opts[open] > .ers-text-opts-summary { border-bottom: 1px solid var(--rule); }
.ers-text-opts-off { font-weight: 400; font-size: var(--text-sm); }
.ers-text-fields { border: 0; margin: 0; padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.ers-text-fields:disabled { opacity: 0.55; }
.ers-text-fields .ers-key { padding: 0; flex: none; }
.ers-picks { border: 1px solid var(--rule); border-radius: var(--radius-md); margin: 0; padding: var(--space-2) var(--space-3); display: grid; gap: var(--space-2); min-width: 0; }
.ers-picks legend { font-size: var(--text-sm); color: var(--text-muted); padding: 0 var(--space-1); }
.ers-pick-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-1); }
.ers-pick { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1); font-size: var(--text-md); }
.ers-pick-name { font-weight: 500; }
.ers-link-note, .ers-upload-note, .ers-kept, .ers-quality { margin: 0; }
.ers-parts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); counter-reset: ers-part; }
.ers-parts li { counter-increment: ers-part; font-size: var(--text-sm); padding: 3px 8px; border: 1px solid var(--rule); border-radius: var(--radius-lg); }
.ers-parts li::before { content: counter(ers-part) ". "; font-weight: 500; }
.ers-parts li[data-state="done"] { background: var(--good-bg); color: var(--good-ink); border-color: var(--good-line); }
.ers-parts li[data-state="current"] { background: var(--info-bg); color: var(--info-ink); border-color: var(--info-line); }
.ers-parts li[data-state="failed"] { background: var(--danger-bg); color: var(--danger-ink); border-color: var(--danger-line); }
.ers-part-note { font-weight: 400; }
.ers-removed { margin: 0; font-weight: 500; color: var(--good-ink); }
/* 지우기 화면의 권리 확인 줄 (공용 .dl-consent 점선 → 1px 선 하나) */
.ers-consent { border: 1px solid var(--rule); border-radius: var(--radius-md); background: var(--ground); }
.ers-downloads { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.ers-audio { width: 100%; }

/* 20261024-alalshow-sf5-copy-names: 사이드바 홈 한 줄(묶음 위) · 사용자 메뉴 지금 화면 표시(점검 A33) */

/* 20261024-alalshow-sf5-final-check (재점검 B·E): 찾기·키우기 화면 깨짐·휴대폰 손보기 */
/* 링크 모음 [저장하고 공개하기] 줄: 오류 요약은 한 줄 전체, 버튼은 글자 그대로, 안내는 버튼 아래 (한 줄에 셋이 끼어 버튼이 세로로 길어졌다) */
.lnk-actions { flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.lnk-actions .kit-error-summary { flex-basis: 100%; margin: 0; }
.lnk-actions #link-save { white-space: nowrap; }
.lnk-actions .field-note { flex-basis: 100%; margin: 0; text-align: right; word-break: keep-all; }
/* 공개 링크 페이지 바닥 글: 낱말 중간에서 끊지 않는다 */
.lp-body .site-footer { word-break: keep-all; }
/* 제작 계획 보드: 띄어쓰기 없는 긴 메모(링크)가 표를 밀어 [끝냄] 칸이 카드 밖으로 숨던 것 */
.pln-memo-summary, .pln-memo-text { min-width: 0; overflow-wrap: anywhere; }
/* 영상·음원 저장 표: 형식 칸("영상"·"mp3")이 글자마다 줄바뀜되던 것 */
.dl-table td.dl-mode { white-space: nowrap; }
/* [내 PC로 받기]가 연동 앱 없음으로 막힌 줄: 안내 아래 이 화면 설치 안내 링크 */
.dl-row-guide { display: inline-block; font-size: 13px; font-weight: 700; }
@media (max-width: 1023.98px) {
  /* 중국 플랫폼 검색 권리 확인 칸: 위쪽 바가 붙어 있는 폭에서는 그 아래에 붙는다 (위쪽 바 밑으로 숨었다) */
  html[data-nav] .cn-consent-sticky { top: calc(var(--topbar-h) + var(--space-2)); }
  /* 갤러리 쪽 넘김 뒤 목록 맨 위로 갈 때 위쪽 바에 가리지 않게 */
  html[data-nav] #gallery-main { scroll-margin-top: calc(var(--topbar-h) + var(--space-2)); }
  /* 위쪽 바 로고(스튜디오 홈으로)도 누름 칸 44px */
  html[data-nav] .topbar .brand { display: inline-flex; align-items: center; min-height: var(--tap); }
}
@media (max-width: 640px) {
  /* 누름 칸 44px: 찾기·키우기 화면의 탭·단계 버튼·접는 제목 */
  .page-gallery .gal-tab, .page-saved .saved-tab, .page-cn .cn-page-tab, .page-trainer .stage-btn { display: inline-flex; align-items: center; column-gap: 0.3em; min-height: var(--tap); }
  .page-download .dl-guide-summary, .page-cn .cn-status-summary, .page-trace .trace-more > summary.trace-more-summary,
  .page-trainer .trainer-definitions > summary, .page-appeal .appeal-rules > summary { min-height: var(--tap); padding-block: var(--space-2); box-sizing: border-box; }
  .page-download .dl-row-guide { display: inline-flex; align-items: center; min-height: var(--tap); }
  .page-gallery .gal-card .gal-actions .btn-small, .page-gallery .gal-search input[name="q"], .page-cn .cn-keyword, .page-cn .cn-tab .cn-tab-face,
  .page-planner .pln-custom input, .page-threads .threads-choice { min-height: var(--tap); }
  .page-gallery .gal-more-btn { width: var(--tap); height: var(--tap); }
  .page-gallery .gal-page { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); min-height: var(--tap); }
}

/* 20261024-alalshow-sf5-final-check (고치기 1) */
/* 재점검 BE-31 · AF-A07: 휴대폰(640px 아래) 누름 칸 44px — 대본 쓰기·지우기 탭, 체크·라디오 줄(라벨 전체가 누름 칸, 모양은 그대로),
   키 안내 제목·링크, 유튜브·캡컷 배지 링크, 바닥글·목차·질문 링크, 관리자 숫자 칸. 글자·색은 그대로 두고 높이만 tokens.css --tap으로. */
@media (max-width: 640px) {
  .seg-tab, .ers-tab, .page .admin-num { min-height: var(--tap); }
  a.seg-tab { display: inline-flex; align-items: center; }
  .page .check, .page .ps-voice-pick, .page .ps-bgm-pick, .page .auto-tab, .page .topic-chip, .page .theme-chip, .page-gallery .gal-hot { min-height: var(--tap); box-sizing: border-box; }
  .page .key-guide-summary, .page .faq-q, .page .guide-more > summary { min-height: var(--tap); box-sizing: border-box; }
  .page .faq-q, .page .guide-more > summary { padding-block: var(--space-3); }
  .page .key-guide-link, .page-guide .guide-toc a, .legal-toc-list a, .site-footer-link, .site-footer-help a,
  .page a.key-badge, .page a.kit-badge, .page a[href="/app/upload/history"],
  .topbar .brand, .topnav .topnav-user, .topbar .topnav form.inline .link-btn { display: inline-flex; align-items: center; min-height: var(--tap); }
  .legal-toc-list { line-height: 1.4; }
}

/* 20261026-alalshow-sf5-output-quality-scenarios ④: 요즘 잘 터진 쇼핑 검색어 칩 (지금 뜨는 이슈 · 잘 터진 영상 모음 머리) — 디자인 값만
   20261026-alalshow-sf5-viewfinder-tone (묶음 B): 칸은 흰 바탕+그림자(테두리 없음), 빈 안내 카드 안에서는 info 알림 칸(그림자 겹치지 않게),
   칩은 분석기 작업 줄 버튼 모양(흰 바탕+그림자 35px · 6px · 14px — 휴대폰은 누름 칸 44px) */
.kw-ideas { margin: 0 0 var(--space-4); padding: var(--space-4) 20px; border: 1px solid transparent; border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-1); }
.kw-ideas[data-prominent] { margin: var(--space-3) 0; padding: 12px 18px; border-color: var(--info-line); background: var(--info-bg); box-shadow: none; }
.kw-ideas-title { margin: 0; font-size: var(--text-lg); font-weight: 700; color: var(--text); }
.kw-ideas-note { margin: var(--space-1) 0 var(--space-3); font-size: var(--text-sm); color: var(--text-muted); overflow-wrap: anywhere; }
.kw-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.kw-chip { display: inline-flex; align-items: center; gap: 6px; min-height: var(--btn-h); padding: 7px 12px; border: 0; border-radius: var(--radius-btn); background: var(--paper); box-shadow: var(--shadow-1); color: var(--text); text-decoration: none; font-size: var(--text-md); font-weight: 400; line-height: 21px; white-space: nowrap; }
.kw-chip:hover, .kw-chip:focus-visible { background: var(--brand-bg-soft); color: var(--brand); }
.kw-chip-count { color: var(--text-muted); font-weight: 400; font-size: var(--text-xs); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  .kw-chip { min-height: var(--tap); }
}