:root {
  --bg0:#0B0E14; --bg1:#131824; --card:#161C29;
  --ink:#F2F4F7; --dim:#8B93A1; --line:rgba(255,255,255,.10);
  --hot:#FF3B30; --ok:#34D399; --warn:#FBBF24;
}
* { box-sizing:border-box; margin:0; padding:0; }

/* .modal/.center/.row2 처럼 display 를 명시한 규칙은 브라우저 기본 [hidden] 스타일을
   덮어써서, hidden 속성이 붙어 있어도 화면에 보인다. 여기서 확실히 눌러준다. */
[hidden] { display:none !important; }
body {
  background:var(--bg0); color:var(--ink); min-height:100vh;
  font-family:'Pretendard',-apple-system,'Segoe UI','Noto Sans KR','Malgun Gothic',sans-serif;
  -webkit-font-smoothing:antialiased;
}
button, input, select, textarea { font:inherit; color:inherit; }

.topbar {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px; border-bottom:1px solid var(--line); position:sticky; top:0;
  background:rgba(11,14,20,.9); backdrop-filter:blur(8px); z-index:10;
}
.brand { display:flex; align-items:center; gap:10px; font-size:17px; letter-spacing:-.02em; }
.dot { width:10px; height:10px; border-radius:50%; background:var(--hot); }
.who { display:flex; align-items:center; gap:12px; font-size:13px; color:var(--dim); }
/*
 * 모바일 헤더.
 *
 * flex 자식은 기본으로 내용보다 작게 눌린다. 한글은 그 상태에서 글자 단위로 줄이 바뀌어
 * "카드뉴스 관리"가 세로 한 줄이 됐다(헤더 높이 187px, 가로 스크롤까지 생김).
 * 눌리지 않게 막고, 좁은 화면에서 덜 중요한 것부터 뺀다.
 */
.topbar > * { min-width:0; }
.brand b { white-space:nowrap; }
.brand .dot { flex:none; }
.who button { white-space:nowrap; flex:none; }
#userEmail { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

@media (max-width:640px) {
  .topbar { padding:12px 14px; gap:10px; }
  .brand { font-size:15px; gap:8px; }
  /* 빌드 번호와 계정은 좁은 화면에서 자리를 못 만든다. 로그아웃·점검 버튼을 살린다. */
  .topbar #appVersion, .topbar #userEmail { display:none; }
  .who { gap:8px; }
  .who button { padding:8px 11px; font-size:13px; }
}


/*
 * 2026-09-17 사장님 지적 — 3패널 작업실(lf-workspace, 296px+1fr+380px)이 이 940px
 * 안에 갇혀서 가운데 스테이지 칸이 실제로 200px 안팎으로 짜부라졌다("작업 공간이
 * 너무 좁다"). 다른 화면(설정·블로그 등)은 카드·폼 위주라 컨테이너를 넓혀도 내용이
 * 늘어지지 않고, 블로그 본문처럼 읽기 폭이 중요한 곳은 이미 자체 max-width(.blog-view
 * 760px)가 있어 영향받지 않는다.
 */
main { max-width:1440px; margin:0 auto; padding:22px; }
.center { display:flex; align-items:center; justify-content:center; min-height:70vh; }
/* 검수 전용 계정용 이메일/비밀번호 로그인(2026-09-18) — 구글 버튼 아래에 둔다. */
.signin-or { margin:14px 0 10px; font-size:12px; text-align:center; }
.signin-email { display:flex; flex-direction:column; gap:10px; }
.signin-label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:#AAB3C0; font-weight:700; text-align:left; }
.signin-label input { background:var(--bg1); border:1px solid var(--line); border-radius:9px;
  padding:9px 12px; color:var(--ink); font:inherit; font-size:14px; }

.card { background:var(--card); border:1px solid var(--line); border-radius:16px; }
.pad { padding:22px; }
h1 { font-size:24px; letter-spacing:-.03em; margin-bottom:8px; }
h3 { font-size:16px; letter-spacing:-.02em; margin-bottom:14px; }
.dim { color:var(--dim); font-size:14px; line-height:1.6; }
.err { color:var(--hot); font-size:13px; margin-top:12px; }

/* 글로벌 스포츠 운영 현황 */
.operations-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px; background:linear-gradient(135deg,#15263a,#142018); }
.operations-hero h1 { margin:4px 0 6px; }
.operations-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.op-kpi { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:17px; display:flex; flex-direction:column; gap:6px; }
.op-kpi b { font-size:22px; letter-spacing:-.04em; }
.op-kpi span { color:var(--dim); font-size:12px; }
.operations-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.operations-list { display:flex; flex-direction:column; gap:8px; }
.ops-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
.ops-row:last-child { border-bottom:0; }
.ops-row b { display:block; font-size:14px; }
.ops-row small { display:block; color:var(--dim); font-size:12px; line-height:1.55; margin-top:3px; }
.ops-row-right { text-align:right; }
.ops-row-right a { color:var(--ok); font-size:12px; text-decoration:none; }
.ops-state { display:inline-flex; border-radius:999px; padding:4px 8px; font-size:11px; font-weight:700; background:rgba(255,255,255,.08); }
.ops-state.done { color:#062c1c; background:var(--ok); }
.ops-state.run { color:#342500; background:var(--warn); }
.ops-state.wait { color:#ccd3df; background:rgba(255,255,255,.12); }
.ops-state.err { color:#fff; background:var(--hot); }
.ops-note { margin:-6px 0 8px; font-size:12px; }
.ops-schedule-row { justify-content:flex-start; align-items:flex-start; }
.ops-step,.ops-roadmap-item > span { flex:none; display:grid; place-items:center; width:25px; height:25px; border-radius:50%; background:#22314a; color:#b9d7ff; font-size:12px; font-weight:800; }
.operations-roadmap { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.ops-roadmap-item { border:1px solid var(--line); border-radius:12px; padding:13px; min-height:104px; display:flex; gap:9px; align-items:flex-start; }
.ops-roadmap-item.done { border-color:rgba(52,211,153,.55); }
.ops-roadmap-item.run { border-color:rgba(251,191,36,.75); background:rgba(251,191,36,.06); }
.ops-roadmap-item.done > span { background:var(--ok); color:#062c1c; }
.ops-roadmap-item.run > span { background:var(--warn); color:#342500; }
.ops-roadmap-item b { display:block; font-size:13px; }
.ops-roadmap-item small { display:block; margin-top:5px; color:var(--dim); font-size:11px; line-height:1.45; }
@media (max-width:900px) { .operations-summary,.operations-roadmap { grid-template-columns:repeat(2,minmax(0,1fr)); } .operations-grid { grid-template-columns:1fr; } }
@media (max-width:560px) { .operations-hero { flex-direction:column; } .operations-summary,.operations-roadmap { grid-template-columns:1fr; } .ops-row { align-items:flex-start; } .ops-row-right { max-width:45%; } }

.settings-acc { overflow:hidden; }
.settings-acc-summary {
  list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 22px; cursor:pointer; user-select:none;
}
.settings-acc-summary::-webkit-details-marker { display:none; }
.settings-acc-title { font-size:16px; font-weight:700; letter-spacing:-.02em; }
.settings-acc-meta { color:var(--dim); font-size:13px; line-height:1.5; text-align:right; }
.settings-acc-summary::after {
  content:'▸'; color:var(--dim); font-size:11px; flex:none; transition:transform .15s ease;
}
.settings-acc[open] .settings-acc-summary::after { transform:rotate(90deg); }
.settings-acc[open] .settings-acc-summary { border-bottom:1px solid var(--line); }
.settings-acc-body > h3:first-child { display:none; }
.settings-acc.needs-attention { border-color:rgba(251,191,36,.42); }
.settings-acc.needs-attention > .settings-acc-summary { background:rgba(251,191,36,.035); }

.settings-home { margin-bottom:16px; background:linear-gradient(145deg,rgba(255,59,48,.08),var(--card) 42%); }
.settings-home-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
/* 좁은 화면에서는 헤더에 계정·빌드번호가 안 들어간다. 설정 화면에서 확인한다. */
.settings-account-line { margin-top:10px; font-size:12px; opacity:.75; }
.settings-account-line:empty { display:none; }
.settings-home-head h1 { margin:4px 0 7px; }
.settings-kicker { color:#FF8B84; font-size:12px; font-weight:800; letter-spacing:.08em; }
.settings-quick-stats {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:20px 0 16px;
}
.settings-stat {
  display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:13px 14px;
  border:1px solid var(--line); background:rgba(255,255,255,.035); text-align:left;
}
.settings-stat:hover { border-color:rgba(255,255,255,.28); }
.settings-stat b { font-size:19px; line-height:1.1; }
.settings-stat span { color:var(--dim); font-size:12px; font-weight:600; }
.settings-stat.warn { border-color:rgba(251,191,36,.36); }
.settings-stat.warn b { color:var(--warn); }
.settings-search { display:block; margin:0; color:var(--dim); font-size:12px; font-weight:700; }
.settings-search input {
  width:100%; margin-top:7px; padding:12px 14px; border-radius:11px;
  background:var(--bg1); border:1px solid var(--line);
}
.settings-search input:focus { outline:2px solid rgba(255,59,48,.35); border-color:var(--hot); }
.settings-filter-row {
  display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px; flex-wrap:wrap;
}
.settings-filters { display:flex; flex-wrap:wrap; gap:7px; }
.settings-filter { padding:8px 12px; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--dim); }
.settings-filter:hover { color:var(--ink); border-color:rgba(255,255,255,.28); }
.settings-filter.on { color:#fff; background:rgba(255,59,48,.17); border-color:rgba(255,59,48,.5); }
.settings-filter span { margin-left:4px; font-size:11px; opacity:.72; }
.settings-empty {
  margin-top:16px; padding:16px; border-radius:11px; border:1px dashed var(--line);
  color:var(--dim); text-align:center; font-size:13px;
}
.country-tabs {
  display:flex; gap:8px; margin:0 0 16px; padding:6px;
  border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.025);
  overflow-x:auto; scrollbar-width:none;
}
.country-tabs::-webkit-scrollbar { display:none; }
.country-tab { flex:none; padding:10px 14px; background:transparent; color:var(--dim); white-space:nowrap; }
.country-tab:hover { color:var(--ink); background:rgba(255,255,255,.06); }
.country-tab.on { color:#fff; background:rgba(255,59,48,.18); box-shadow:inset 0 0 0 1px rgba(255,59,48,.38); }
.jobs-country-tabs { display:flex; gap:8px; margin:0 0 12px; padding:6px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.025); overflow-x:auto; scrollbar-width:none; }
.jobs-country-tabs::-webkit-scrollbar { display:none; }
.jobs-country-tab { flex:none; padding:10px 14px; background:transparent; color:var(--dim); white-space:nowrap; }
.jobs-country-tab:hover { color:var(--ink); background:rgba(255,255,255,.06); }
.jobs-country-tab.on { color:#fff; background:rgba(255,59,48,.18); box-shadow:inset 0 0 0 1px rgba(255,59,48,.38); }
.br-queue-guide { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:0 0 12px; padding:16px 18px; border:1px solid rgba(34,197,94,.32); border-radius:15px; background:linear-gradient(135deg,rgba(34,197,94,.14),rgba(250,204,21,.06) 52%,rgba(59,130,246,.08)); }
.br-queue-guide b { display:block; margin-top:3px; font-size:17px; }
.br-queue-guide p { margin:5px 0 0; }
.br-queue-schedule { display:grid; grid-template-columns:1.2fr repeat(3,1fr); gap:10px; margin:0 0 12px; }
.br-queue-schedule > div { padding:13px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.025); }
.br-queue-schedule .br-schedule-now { border-color:rgba(34,197,94,.34); background:linear-gradient(135deg,rgba(34,197,94,.12),rgba(255,255,255,.025)); }
.br-queue-schedule span { display:block; font-size:11px; color:var(--dim); margin-bottom:5px; }
.br-queue-schedule b { display:block; font-size:14px; }
.br-queue-schedule small { display:block; margin-top:4px; color:var(--dim); line-height:1.35; }
.br-queue-filters { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.br-queue-filter { padding:8px 12px; border:1px solid var(--line); background:rgba(255,255,255,.035); color:var(--dim); }
.br-queue-filter:hover { color:var(--ink); border-color:rgba(255,255,255,.32); }
.br-queue-filter.on { color:#fff; border-color:rgba(34,197,94,.55); background:rgba(34,197,94,.14); }
@media (max-width:720px) { .br-queue-schedule { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .br-queue-guide { align-items:flex-start; flex-direction:column; gap:10px; } .br-queue-schedule { grid-template-columns:1fr; } }
.country-panel-intro {
  margin:0 0 16px; padding:17px 19px; border:1px solid var(--line); border-radius:15px;
  background:linear-gradient(135deg,rgba(59,130,246,.1),rgba(255,255,255,.025));
}
.country-panel-intro b { display:block; margin-bottom:5px; font-size:16px; }
.br-youtube-box { margin-top:10px; background:rgba(255,255,255,.025); }
.global-channel-card { margin:0; }

.settings-sport { margin:0; }
.settings-section-title {
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin:0 0 12px; padding-bottom:9px; border-bottom:1px solid var(--line);
}
.settings-section-title b { font-size:14px; }
.settings-section-title span { color:var(--dim); font-size:12px; text-align:right; }
.settings-field-grid { margin-bottom:16px; }
.settings-token-box { margin:4px 0 20px; }
.settings-check-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:16px; }
.settings-check {
  display:flex; align-items:flex-start; gap:10px; margin:0; padding:11px 12px;
  border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.025); cursor:pointer;
}
.settings-check:hover { border-color:rgba(255,255,255,.25); }
.settings-check input { width:auto; margin:3px 0 0; padding:0; flex:none; accent-color:var(--ok); }
.settings-check span { display:flex; flex-direction:column; gap:3px; min-width:0; }
.settings-check b { font-size:13px; }
.settings-check small { color:var(--dim); font-size:11px; line-height:1.4; font-weight:400; }
.settings-check.compact { align-self:end; min-height:63px; }
.settings-subacc {
  margin:4px 0 18px; border:1px solid var(--line); border-radius:11px; overflow:hidden;
  background:rgba(255,255,255,.018);
}
.settings-subacc > summary { cursor:pointer; padding:12px 14px; font-size:13px; font-weight:700; color:var(--dim); }
.settings-subacc[open] > summary { color:var(--ink); border-bottom:1px solid var(--line); }
.settings-subacc > .row2 { padding:14px; margin:0; }
.local-connector {
  margin:14px 0; padding:16px; border:1px solid rgba(96,165,250,.28); border-radius:14px;
  background:linear-gradient(135deg,rgba(59,130,246,.10),rgba(52,211,153,.035));
}
.local-connector-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px; }
.local-connector-head b { color:var(--ink); font-size:15px; }
.local-connector-head p { margin:5px 0 0; color:var(--dim); font-size:12px; line-height:1.5; }
.connector-badge { flex:none; padding:5px 9px; border-radius:999px; font-size:11px; font-weight:800; }
.connector-badge.idle { color:var(--dim); background:rgba(255,255,255,.07); }
.connector-badge.online { color:var(--ok); background:rgba(52,211,153,.15); }
.connector-badge.waiting { color:var(--warn); background:rgba(251,191,36,.15); }
.connector-badge.offline, .connector-badge.error { color:#ff8a82; background:rgba(255,59,48,.14); }
.connector-status { margin:10px 0 0; line-height:1.55; }
.manual-cookie { margin:12px 0; }
.manual-cookie > label, .manual-cookie > ol, .manual-cookie > button {
  margin-left:14px; margin-right:14px; width:calc(100% - 28px);
}
.manual-cookie > label { margin-top:14px; }
.settings-guide {
  margin:10px 0 14px; border:1px dashed var(--line); border-radius:10px; overflow:hidden;
}
.settings-guide > summary { padding:10px 12px; cursor:pointer; color:var(--dim); font-size:12px; font-weight:700; }
.settings-guide[open] > summary { color:var(--ink); border-bottom:1px dashed var(--line); }
.settings-guide > ol { margin:0 !important; padding:12px 16px 12px 32px !important; }
.settings-save-row { padding-top:2px; }

@media (max-width:640px) {
  .settings-acc-summary { align-items:flex-start; flex-wrap:wrap; }
  .settings-acc-meta { width:calc(100% - 24px); text-align:left; }
  .settings-home-head { flex-direction:column; }
  .settings-quick-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .settings-check-grid { grid-template-columns:1fr; }
  .settings-section-title { align-items:flex-start; flex-direction:column; gap:3px; }
  .settings-section-title span { text-align:left; }
  .country-tabs { margin-left:-2px; margin-right:-2px; }
  .local-connector-head { flex-direction:column; }
}

button { border:none; border-radius:10px; padding:10px 16px; cursor:pointer; font-weight:700; font-size:14px; }
button.primary { background:var(--hot); color:#fff; }
button.ghost { background:rgba(255,255,255,.07); color:var(--ink); }
button.ghost.danger { color:#EF4444; }
button.ghost.danger:hover { background:rgba(239,68,68,.14); }
button.ok { background:var(--ok); color:#06281C; }
button:disabled { opacity:.45; cursor:default; }

.tabs { display:flex; gap:8px; margin-bottom:20px; overflow-x:auto; scrollbar-width:none; }
.tabs::-webkit-scrollbar { display:none; }
.tab { background:transparent; color:var(--dim); padding:8px 14px; border-radius:999px; white-space:nowrap; flex:none; }
.tab.on { background:rgba(255,255,255,.09); color:var(--ink); }
/*
 * 모바일 터치 영역.
 *
 * 데스크톱 기준(35~36px)은 손가락으로 누르기에 작다. 권장은 44px.
 * 헤더는 예외 — 키우면 스크롤할 때마다 화면을 그만큼 잡아먹는다.
 */
@media (max-width:640px) {
  button { min-height:44px; padding:12px 16px; }
  .tab { min-height:42px; padding:10px 15px; }
  .topbar button, .who button { min-height:36px; padding:8px 11px; }
  /* 잡 카드 버튼은 손가락이 자주 가는 자리라 서로 붙지 않게 띄운다 */
  .actions { gap:10px; }
  .chk { min-height:auto; }
}


.toolbar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:20px; }
.toolbar select, .toolbar input[type=date], .toolbar input[type=text] {
  background:var(--card); border:1px solid var(--line); border-radius:10px; padding:9px 12px;
}
.topic-bar {
  margin:-8px 0 20px; padding:16px 18px; border:1px solid var(--line);
  border-radius:14px; background:rgba(255,255,255,.02);
  display:flex; flex-direction:column; gap:12px;
}
.topic-fields {
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px;
}
.topic-fields label { margin:0; font-size:12px; color:var(--dim); font-weight:700; }
.topic-fields input, .topic-fields textarea {
  display:block; width:100%; margin-top:6px; background:var(--bg1);
  border:1px solid var(--line); border-radius:10px; padding:10px 12px; color:var(--ink);
  resize:vertical; min-height:68px;
}
.topic-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
@media (max-width:860px) {
  .topic-fields { grid-template-columns:1fr; }
}
.chk { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--dim);
  white-space:nowrap; margin-bottom:0; flex:none; }
/* label input 의 폭·여백·테두리 규칙이 체크박스에도 먹어서 눌려 보이던 걸 되돌린다 */
.chk input { width:auto; margin:0; padding:0; border:none; background:none; flex:none;
  accent-color:var(--hot); }
.results-now {
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px;
}

.sns-row {
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.sns-row:last-of-type { border-bottom:none; }
.sns-row b { display:block; font-size:15px; margin-bottom:2px; }
.sns-row .dim { font-size:12px; }
.sns-switch {
  display:flex; align-items:center; gap:10px; cursor:pointer; flex:none;
  user-select:none;
}
.sns-switch input {
  width:42px; height:24px; margin:0; accent-color:var(--ok); cursor:pointer;
}
.sns-state { min-width:2.5em; font-size:13px; font-weight:700; }
.sns-state.on { color:var(--ok); }
.sns-state.off { color:var(--dim); }

.stats-h { margin: 8px 0 12px; font-size: 14px; color: var(--dim); font-weight: 700; }
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.stat-card .stat-head {
  display: flex; align-items: center; gap: 12px; min-width: 0;
}
.stat-card .stat-head b { display: block; font-size: 15px; letter-spacing: -.02em; }
.stat-card .stat-head .dim { font-size: 12px; line-height: 1.4; word-break: break-all; }
.stat-avatar {
  width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex: none;
  background: rgba(255,255,255,.08);
}
.stat-avatar.ph {
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: var(--dim);
}
.stat-nums {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px;
}
.stat-nums.one { grid-template-columns: 1fr; }
.stat-k { font-size: 12px; color: var(--dim); margin-bottom: 4px; }
.stat-n { font-size: 26px; font-weight: 800; letter-spacing: -.04em; line-height: 1.15; }
.stat-sub { font-size: 12px; margin-top: 4px; }
.stat-err { margin-top: 12px; font-size: 12px; color: var(--warn); line-height: 1.45; }

.health {
  background:rgba(255,59,48,.10); border:1px solid rgba(255,59,48,.35);
  border-radius:12px; padding:14px 16px; margin-bottom:16px;
  display:flex; flex-direction:column; gap:8px; font-size:13px; line-height:1.6;
}
.health b { color:var(--hot); }

.schedule { margin-bottom:16px; }
.sched-head { font-size:12px; font-weight:700; color:var(--dim); margin-bottom:8px; letter-spacing:.02em; }
.sched-row { display:flex; flex-wrap:wrap; gap:8px; }
.sched-item {
  display:flex; align-items:center; gap:8px; flex:1 1 180px; min-width:160px;
  border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:12px;
  background:rgba(255,255,255,.03);
}
.sched-time { font-weight:800; font-variant-numeric:tabular-nums; color:#fff; }
.sched-label { flex:1; color:var(--dim); min-width:0; }
.sched-state { font-weight:800; white-space:nowrap; }
.sched-item.done { border-color:rgba(52,211,153,.35); }
.sched-item.done .sched-state { color:var(--ok); }
.sched-item.run { border-color:rgba(167,139,250,.45); }
.sched-item.run .sched-state { color:#C4B5FD; }
.sched-item.err { border-color:rgba(255,59,48,.4); }
.sched-item.err .sched-state { color:var(--hot); }
.sched-item.miss { border-color:rgba(251,191,36,.35); }
.sched-item.miss .sched-state { color:var(--warn); }
.sched-item.skip .sched-state,
.sched-item.wait .sched-state { color:var(--dim); }

.hook-picks { display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.hook-btn {
  display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  text-align:left; width:100%; padding:12px 14px; border:1px solid var(--line);
  border-radius:10px;
}
.hook-btn b { font-size:14px; font-weight:700; color:#fff; line-height:1.35; }
.hook-btn:hover { border-color:rgba(255,255,255,.28); }

.overview { display:flex; flex-direction:column; gap:14px; }
.ov-summary h3 { margin-bottom:6px; }
.ov-summary-top {
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.ov-kpi {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:16px;
}
.ov-kpi div {
  background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:12px;
  padding:14px 12px; text-align:center;
}
.ov-kpi b { display:block; font-size:22px; letter-spacing:-.03em; margin-bottom:4px; }
.ov-kpi span { font-size:12px; color:var(--dim); }
.ov-country { margin-top:18px; }
.ov-country-title { font-size:15px; font-weight:800; margin:14px 0 8px; }
.ov-country > .ov-country-title { margin-top:0; }
.ov-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.ov-channel {
  display:flex; flex-direction:column; gap:8px; text-align:left;
  background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px;
}
.ov-channel:hover { border-color:rgba(255,255,255,.28); }
.ov-ch-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ov-ch-top b { font-size:16px; }
.ov-ch-meta { font-size:12px; color:var(--dim); line-height:1.4; }
.ov-ch-stats {
  display:flex; flex-wrap:wrap; gap:8px 12px; font-size:12px; color:var(--dim);
}
.ov-ch-go { font-size:13px; font-weight:700; color:#fff; margin-top:4px; }
.ov-attn {
  display:grid; grid-template-columns:auto 1fr; gap:4px 12px; align-items:center;
  width:100%; text-align:left; background:rgba(255,255,255,.03);
  border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-top:8px;
}
.ov-attn .pill { grid-row:span 2; }
.ov-attn-title { font-size:14px; font-weight:700; }
.ov-attn-sub { font-size:12px; color:var(--dim); grid-column:2; }
.ov-attn:hover { border-color:rgba(255,255,255,.28); }
@media (max-width:640px) {
  .ov-kpi { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.check-row {
  display:flex; gap:12px; align-items:flex-start; padding:10px 0;
  border-bottom:1px solid var(--line);
}
.check-row:last-child { border-bottom:none; }
.check-row b { font-size:14px; }
.update-modal .modal-inner { max-width:420px; }
.update-modal h1 { margin-bottom:8px; }
#updateNotes { white-space:pre-wrap; }
#appVersion { font-size:11px; font-variant-numeric:tabular-nums; }

.hist-row {
  display:flex; gap:12px; align-items:flex-start; padding:14px 16px;
}
.hist-body { flex:1; min-width:0; }
.hist-title {
  display:flex; justify-content:space-between; gap:12px; align-items:baseline;
  margin-bottom:4px;
}
.hist-title b { font-size:14px; }
.hist-meta { font-size:12px; line-height:1.5; }
.hist-meta code {
  font-size:11px; background:rgba(255,255,255,.06); padding:1px 6px; border-radius:6px;
}
.hist-detail {
  margin-top:6px; font-size:13px; color:var(--ink); line-height:1.45;
  word-break:break-word;
}
.hist-detail a { color:var(--accent, #7dd3fc); }
.hist-retry {
  display:flex; align-items:center; gap:10px; margin-top:10px; flex-wrap:wrap;
}
.hist-retry button.primary { font-size:13px; padding:8px 14px; }
.hist-retry button:disabled { opacity:.75; cursor:wait; }
.hist-post {
  margin:8px 0 0; padding:10px 12px; border-radius:10px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  font: inherit; font-size:13px; line-height:1.55; white-space:pre-wrap; word-break:break-word;
  color:var(--ink); max-height:220px; overflow:auto;
}
.retry-note {
  font-size:13px; line-height:1.5; padding:10px 12px; border-radius:10px;
  background:rgba(251,191,36,.10); border:1px solid rgba(251,191,36,.35); color:var(--warn);
}

.job { padding:18px; display:flex; flex-direction:column; gap:12px; }
/* 헤더 전체가 펼침 버튼이다 */
.job-top {
  display:flex; align-items:center; gap:12px; width:100%;
  background:none; border:none; padding:0; text-align:left; cursor:pointer;
}
.job-top:hover .job-title h2 { color:#fff; }
.job-title { flex:1; min-width:0; display:block; }
.job h2 { font-size:17px; letter-spacing:-.025em; line-height:1.35; }
.job .meta { display:block; font-size:13px; color:var(--dim); margin-top:4px; }
.caret {
  flex:none; width:16px; color:var(--dim); font-size:10px; line-height:1;
  transition:transform .12s ease; transform-origin:50% 50%;
}
.caret.open { transform:rotate(90deg); }
.pill { font-size:11px; font-weight:800; padding:5px 10px; border-radius:999px; white-space:nowrap; }
.pill.pending { background:rgba(251,191,36,.16); color:var(--warn); }
.pill.published { background:rgba(52,211,153,.16); color:var(--ok); }
.pill.error { background:rgba(255,59,48,.16); color:var(--hot); }
.pill.processing { background:rgba(167,139,250,.16); color:#C4B5FD; }
.pill.skipped, .pill.discarded { background:rgba(255,255,255,.08); color:var(--dim); }
.pill.rejected { background:rgba(255,59,48,.16); color:var(--hot); }
.actions button:disabled { opacity:.45; cursor:not-allowed; }

.post { border:1px solid var(--line); border-radius:12px; padding:14px; display:flex;
  flex-direction:column; gap:10px; background:rgba(255,255,255,.02); }
.post-head { display:flex; align-items:center; gap:10px; font-size:14px; letter-spacing:-.02em; }

.thumbs { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; }
.thumbs figure { flex:none; display:flex; flex-direction:column; gap:5px; align-items:center; }
.thumbs figcaption { font-size:11px; color:var(--dim); font-weight:700; }
.thumbs img, .thumbs video { height:170px; border-radius:8px; border:1px solid var(--line); flex:none; background:#000; }
.thumb-wrap { position:relative; display:flex; }
.thumb-dl {
  position:absolute; right:6px; bottom:6px; z-index:1;
  font-size:11px; font-weight:700; padding:4px 8px; line-height:1.2;
  border-radius:8px; border:1px solid var(--line);
  background:rgba(11,14,20,.82); color:var(--ink); cursor:pointer;
}
.thumb-dl:hover { background:rgba(11,14,20,.95); }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
a.link { padding:10px 16px; border-radius:10px; text-decoration:none; display:inline-block; font-size:14px; font-weight:700; }
.pill.partial { background:rgba(59,130,246,.16); color:#7DA9FF; }
.channel-pills { display:inline-flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.channel-pills .pill { font-size:11px; }

.scoreline { font-size:13px; color:var(--dim); font-variant-numeric:tabular-nums; line-height:1.7; }

label { display:block; font-size:13px; color:var(--dim); margin-bottom:12px; }
label input, label textarea, label select {
  display:block; width:100%; margin-top:6px; background:var(--bg1);
  border:1px solid var(--line); border-radius:10px; padding:10px 12px; color:var(--ink);
}
label textarea { min-height:220px; resize:vertical; line-height:1.6; font-size:13px; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* 썸네일 확대 보기 */
.thumbs img, .thumbs video { cursor:zoom-in; }
.lightbox {
  position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.92);
  display:flex; align-items:center; justify-content:center; padding:24px 72px;
}
.lb-stage { max-width:100%; max-height:100%; display:flex; align-items:center; justify-content:center; }
.lb-stage img, .lb-stage video {
  max-width:100%; max-height:calc(100vh - 48px); border-radius:10px;
  box-shadow:0 20px 60px rgba(0,0,0,.6); background:#000;
}
.lb-close { position:absolute; top:20px; right:20px; z-index:2; }
.lb-download { position:absolute; top:20px; right:88px; z-index:2; }
.lb-nav {
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  font-size:34px; line-height:1; padding:12px 18px; border-radius:12px;
}
.lb-prev { left:16px; } .lb-next { right:16px; }
.lb-count {
  position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
  font-size:13px; color:var(--dim); font-variant-numeric:tabular-nums;
}

.modal { position:fixed; inset:0; background:rgba(0,0,0,.72); display:flex;
  align-items:flex-start; justify-content:center; padding:24px; overflow-y:auto; z-index:50; }
.modal-inner { background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:24px; max-width:760px; width:100%; position:relative; }
.close { position:absolute; top:16px; right:16px; }

/* 롱폼 레코딩 언어 선택 — prompt 숫자 입력 대신 선택별 결과를 함께 보여 준다. */
.lf-record-modal { max-width:560px; }
.lf-record-modal h1 { margin:0 0 8px; }
.lf-record-choices { display:grid; gap:10px; margin:18px 0 12px; }
.lf-record-choice { display:grid; gap:4px; text-align:left; padding:15px 16px; }
.lf-record-choice b { font-size:15px; }
.lf-record-choice span, .lf-record-footnote { font-size:12px; color:var(--dim); line-height:1.45; }
.lf-record-choice.primary span { color:rgba(255,255,255,.82); }

/* 블로그 본문은 흰 배경 기준으로 쓰인 HTML 이라 어두운 모달에 그대로 넣으면 안 보인다 */
.blog-view { background:#fff; color:#222; border-radius:12px; padding:20px 22px;
  max-height:60vh; overflow:auto; line-height:1.75; }
.blog-view * { max-width:100%; }
.blog-view img { height:auto; border-radius:8px; }
.blog-view a { color:#1a56db; }
.blog-view table { border-collapse:collapse; width:100%; }
.blog-view h1, .blog-view h2, .blog-view h3 { color:#111; }

.rank-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px;
}
.rank-card h3 { margin:0; font-size:15px; }
.rank-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; }
.rank-note { margin:0 0 10px; font-size:12px; min-height:1.4em; }
.rank-ol { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px;
  max-height:420px; overflow:auto; }
.rank-row { display:flex; gap:8px; align-items:baseline; font-size:13px; line-height:1.35; }
.rank-n { width:22px; flex:none; font-variant-numeric:tabular-nums; color:var(--dim); }
.rank-title { color:#fff; text-decoration:none; min-width:0; flex:1; }
a.rank-title:hover { text-decoration:underline; }
.rank-chg { font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rank-chg.up { color:#34d399; }
.rank-chg.down { color:#ff6b6b; }
.rank-chg.same { color:var(--dim); }
.rank-chg.new { color:#fbbf24; }

.aff-divider {
  border:0; border-top:1px solid var(--line); margin:20px 0 16px;
}
#affiliateBannerList { display:flex; flex-direction:column; gap:10px; margin:4px 0 2px; }
.aff-empty {
  padding:22px 16px; text-align:center; color:var(--dim); font-size:13px;
  border:1px dashed var(--line); border-radius:12px; background:rgba(255,255,255,.02);
}
.aff-banner {
  background:var(--bg1); border:1px solid var(--line); border-radius:12px; overflow:hidden;
}
.aff-banner[open] { border-color:rgba(255,255,255,.16); }
.aff-banner-sum {
  list-style:none; display:flex; align-items:center; gap:10px;
  padding:12px 14px; cursor:pointer; user-select:none; min-height:48px;
}
.aff-banner-sum::-webkit-details-marker { display:none; }
.aff-banner-sum::before {
  content:'▸'; color:var(--dim); font-size:11px; flex:none; transition:transform .15s ease;
}
.aff-banner[open] > .aff-banner-sum::before { transform:rotate(90deg); }
.aff-banner-idx {
  flex:none; font-size:12px; font-weight:700; color:var(--dim);
  font-variant-numeric:tabular-nums; min-width:1.6em;
}
.aff-banner-main { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.aff-banner-name {
  font-size:14px; font-weight:700; letter-spacing:-.02em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.aff-banner-tags {
  font-size:12px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.aff-banner-badge {
  flex:none; font-size:11px; font-weight:700; padding:3px 8px; border-radius:999px;
  background:rgba(255,255,255,.06); color:var(--dim);
}
.aff-banner-badge.on { background:rgba(52,211,153,.14); color:var(--ok); }
.aff-banner-badge.off { background:rgba(255,59,48,.12); color:#ff8a82; }
.aff-banner-del {
  flex:none; background:rgba(255,59,48,.12) !important; color:var(--hot) !important;
  padding:7px 12px; font-size:12px;
}
.aff-banner-del:hover { background:rgba(255,59,48,.22) !important; }
.aff-banner-body {
  padding:4px 14px 14px; border-top:1px solid var(--line);
  background:rgba(0,0,0,.18);
}
.aff-banner-body label { margin-top:10px; }
.aff-banner-body textarea {
  min-height:96px; font-family:ui-monospace,Consolas,monospace; font-size:12px;
}

@media (max-width:640px) {
  .row2 { grid-template-columns:1fr; }
  main { padding:16px; }
  .aff-banner-sum { flex-wrap:wrap; }
  .aff-banner-del { margin-left:auto; }
}

/* ── 롱폼 탭 (해외파 대본·자료·레코딩) ── */
.lf-status { font-size:12px; padding:3px 9px; border-radius:999px; background:rgba(255,255,255,.08); white-space:nowrap; }
.lf-status.lf-wait { background:rgba(255,176,32,.18); color:#FFB020; }
.lf-status.lf-busy { background:rgba(96,165,250,.18); color:#60A5FA; }
.lf-status.lf-done { background:rgba(34,197,94,.18); color:#22C55E; }
.lf-status.lf-err { background:rgba(239,68,68,.18); color:#EF4444; }
.lf-status.lf-youtube { background:rgba(255,0,0,.16); color:#FF4D4D; }
.lf-yt-countries { display:flex; flex-wrap:wrap; align-items:center; gap:6px; width:100%; font-size:12px; }
.lf-yt-country { padding:2px 8px; border-radius:999px; border:1px solid rgba(127,127,127,.3); white-space:nowrap; text-decoration:none; }
.lf-yt-country.up { background:rgba(255,0,0,.14); color:#FF4D4D; border-color:rgba(255,77,77,.4); }
.lf-yt-country.made { color:inherit; opacity:.85; }
.lf-yt-country.none { opacity:.4; }
.lf-yt-country small { font-size:10px; opacity:.8; }
.lf-yt-country.up { display:inline-flex; align-items:center; gap:6px; }
.lf-yt-country.up a { color:inherit; text-decoration:none; }
.lf-yt-country.up.unlisted { background:rgba(255,170,0,.14); color:#E0A000; border-color:rgba(224,160,0,.4); }
.lf-yt-country.up.private, .lf-yt-country.up.deleted { background:rgba(127,127,127,.14); color:inherit; border-color:rgba(127,127,127,.4); }
.lf-yt-privacy { font-size:11px; padding:1px 4px; border-radius:6px; background:transparent; color:inherit; border:1px solid currentColor; }
.lf-status.lf-youtube small { font-size:9px; margin-left:1px; }

/* ── 3패널 작업실(2026-09-17, longform-review-workspace.png) ── */
/*
 * 2026-09-18 좌우 크기 조절 — 목록·인스펙터 너비를 --lf-list-w/--lf-inspector-w 로
 * 빼서 드래그(app.js data-lf-resize)로 바꿀 수 있게 했다. 가운데(스토리보드)는 항상
 * 남는 공간을 먹는 1fr — 폭을 못 줄여 카드가 밀려나는 사고를 막는다.
 */
.lf-workspace { display:grid;
  grid-template-columns: var(--lf-list-w, 296px) 6px 1fr 6px var(--lf-inspector-w, 380px);
  grid-template-rows:1fr; min-height:70vh; max-height:calc(100vh - 220px);
  border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--bg0); }
@media (max-width:1100px) { .lf-workspace { grid-template-columns:1fr; max-height:none; } .lf-resize-handle { display:none; } }
.lf-resize-handle { cursor:col-resize; position:relative; background:transparent; }
.lf-resize-handle::after { content:''; position:absolute; top:0; bottom:0; left:2px; width:2px; background:var(--line); }
.lf-resize-handle:hover::after, .lf-resize-handle.on::after { background:var(--hot); width:2px; }

/*
 * 2026-09-18 사장님 실측 — 왼쪽 목록이 안 내려가고, 유튜브·썸네일 버튼이 계획에 따라
 * 어떤 건 보이고 어떤 건 안 보였다. 원인은 여기, 세 칸의 진짜 공통 조상이었다.
 *
 * .lf-workspace 는 그리드고 overflow:hidden 이다. 그리드 아이템은 기본 min-height:auto
 * 라 내용 높이만큼 그냥 늘어나 버려서, 각 칸의 overflow-y:auto 가 한 번도 발동하지
 * 않았다 — 늘어난 만큼을 부모의 overflow:hidden 이 스크롤바 없이 그냥 잘라 버렸다.
 * 그래서 컷 수·검수 이슈·자료 개수가 적은 계획은 안 잘려서 멀쩡해 보이고, 많은
 * 계획만 아래쪽(유튜브·썸네일 버튼 있는 자리)이 통째로 사라졌다 — 아까 인스펙터
 * 안쪽 막대에 flex:none 을 준 것만으로는 못 잡는 자리였다(그건 한 단계 더 안쪽이다).
 *
 * (2026-09-18 추가 조사 — 위 min-height:0 세 줄만으로는 실제로 안 고쳐졌다. 직접
 * Puppeteer로 재현해서 확인함: .lf-workspace 가 grid-template-columns 만 정하고
 * grid-template-rows 를 안 정해서, 행 높이가 auto — 즉 각 칸이 자기 내용 높이만큼
 * 커지고, 그 다음에야 워크스페이스 전체가 overflow:hidden 으로 잘렸다. 그래서
 * .lf-panel-inspector 의 min-height:0 이 있어도 애초에 그 칸 자체가 워크스페이스
 * 높이로 눌리질 않아 overflow-y:auto 가 발동을 못 했다. grid-template-rows:1fr 로
 * 행을 워크스페이스 높이에 강제로 맞춰야 각 칸의 overflow-y:auto 가 실제로 켜진다.)
 */
.lf-panel-list { border-right:1px solid var(--line); overflow-y:auto; min-height:0; background:var(--bg1); }
.lf-panel-stage { overflow-y:auto; min-height:0; padding:18px 20px; }
.lf-panel-inspector { border-left:1px solid var(--line); overflow-y:auto; min-height:0; padding:16px; display:flex; flex-direction:column; gap:12px; }

.lf-list-head { position:sticky; top:0; padding:16px 16px 10px; background:var(--bg1); z-index:1; }
.lf-search { display:block; width:100%; margin:10px 0; background:var(--bg0); border:1px solid var(--line);
  border-radius:9px; padding:9px 12px; color:var(--ink); font:inherit; font-size:13px; }
.lf-filter-row { display:flex; gap:6px; flex-wrap:wrap; }
.lf-filter-pill { font-size:11px; padding:5px 12px; border-radius:999px; border:1px solid transparent;
  background:rgba(255,255,255,.06); color:var(--dim); }
.lf-filter-pill.review { background:rgba(239,68,68,.14); color:#FFB4AF; }
.lf-filter-pill.draft { background:rgba(255,255,255,.08); color:#B8C0CC; }
.lf-filter-pill.done { background:rgba(34,197,94,.14); color:#83E2B4; }
.lf-filter-pill.on { outline:2px solid var(--ink); outline-offset:-2px; }
.lf-list-items { padding:0 10px 12px; display:flex; flex-direction:column; gap:8px; }
/*
 * 목록 정렬(2026-09-18 기획팀 스펙) — 기준 드롭다운 + 방향 토글 한 줄.
 * 기준마다 기본 방향이 달라서 버튼 안에 지금 방향(▲/▼)을 그대로 보여준다.
 */
.lf-sort-row { display:flex; gap:6px; margin-top:8px; }
.lf-sort-select { flex:1; background:var(--bg0); border:1px solid var(--line); border-radius:8px;
  padding:6px 8px; color:var(--ink); font:inherit; font-size:12px; }
.lf-sort-dir { flex:none; min-width:34px; }
/* 고정(핀) 버튼은 항목 <button> 안에 못 넣어(중첩 버튼) 이 셀로 감싸 형제로 얹는다. */
.lf-list-cell { position:relative; }
.lf-list-pin { position:absolute; top:8px; right:8px; width:24px; height:24px; padding:0;
  border-radius:50%; border:1px solid var(--line); background:var(--bg0); color:var(--dim);
  font-size:12px; line-height:1; opacity:.55; }
.lf-list-pin.on { opacity:1; background:rgba(251,191,36,.18); border-color:#FBBF24; color:#FBBF24; }
.lf-list-item { display:flex; flex-direction:column; gap:4px; align-items:stretch; text-align:left;
  padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--card); font:inherit;
  width:100%; padding-right:34px; }
.lf-list-item b { font-size:14px; }
.lf-list-item.selected { border-color:#EF4444; background:rgba(239,68,68,.08); }
.lf-list-item-bar { display:block; height:4px; border-radius:2px; background:rgba(255,255,255,.08); overflow:hidden; }
.lf-list-item-bar span { display:block; height:100%; background:#EF4444; }
.lf-list-empty { padding:16px; }

.lf-stage-head h2 { margin:2px 0 10px; font-size:20px; }
.lf-stage-actions { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.lf-thumb-preview { margin-bottom:12px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#000; }
.lf-thumb-preview img { width:100%; max-width:480px; display:block; }
.lf-thumb-preview .dim { padding:6px 12px; font-size:12px; }
.lf-stage-box { position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--line); background:#000; }
.lf-stage-rec { display:block; width:100%; aspect-ratio:16/9; background:#000; }
.lf-stage-box .lf-cardpreview { margin:0; border:none; border-radius:0; }
.lf-stage-box .lf-cardpreview-wait { background:var(--bg1); }
.lf-stage-caption { padding:8px 12px; font-size:12px; color:#C9D1DC; background:rgba(0,0,0,.6); }
.lf-storyboard-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:18px 0 8px; flex-wrap:wrap; }
.lf-story-nav { display:flex; gap:4px; flex:none; }
/*
 * 2026-09-18 사장님 요청(슬라이드바) + "7번째 컷이 선택이 안 된다" 대응.
 * 스테이지 폭에 5컷 남짓만 들어가 6번째부터는 가로 스크롤 영역으로 밀려나는데, 맥은
 * 스크롤바를 숨겨 둬서 뒤쪽 컷이 있는지조차 안 보였다. 스크롤바를 항상 보이게 한다.
 */
.lf-storyboard { display:flex; gap:10px; overflow-x:auto; padding-bottom:10px; scroll-behavior:smooth;
  scrollbar-width:thin; scrollbar-color:#5A6474 var(--bg1); }
.lf-storyboard::-webkit-scrollbar { height:10px; -webkit-appearance:none; }
.lf-storyboard::-webkit-scrollbar-track { background:var(--bg1); border-radius:5px; }
.lf-storyboard::-webkit-scrollbar-thumb { background:#5A6474; border-radius:5px; border:2px solid var(--bg1); }
.lf-storyboard::-webkit-scrollbar-thumb:hover { background:#6E7A8C; }
/* 셀이 가로 배치의 단위다 — 타일(버튼)과 이동 버튼을 형제로 묶는다(버튼 중첩 방지). */
.lf-story-cell { flex:none; width:118px; display:flex; flex-direction:column; gap:6px; }
.lf-story-tile { position:relative; width:100%; padding:8px; border:1px solid var(--line);
  border-radius:10px; background:var(--card); text-align:left; font:inherit; }
.lf-story-tile.selected { border-color:#EF4444; border-width:2px; background:rgba(239,68,68,.1); }
.lf-story-tile.skipped { opacity:.5; border-style:dashed; }
.lf-story-tile img { display:block; width:100%; height:58px; object-fit:cover; border-radius:6px; background:#000; }
.lf-story-empty { display:flex; align-items:center; justify-content:center; height:58px; border-radius:6px;
  background:var(--bg1); color:var(--dim); font-size:11px; }
.lf-story-label { display:block; margin-top:6px; font-size:11px; color:#BBC4D0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lf-story-warn { position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
  background:#FBBF24; color:#111; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.lf-story-add { flex:none; align-self:center; font-size:11px; padding:0 10px; }
/*
 * 2026-09-17 "보드 안 내용 수정이 안 된다" — 3패널에서 편집이 오른쪽 패널로 옮겨간 걸
 * 화면이 전혀 알려주지 않아, 썸네일을 눌러도 아무 일도 안 나는 것처럼 보였다.
 */
/* 컷 순서 드래그(2026-09-17). 끄는 중인 타일은 흐리게, 놓을 자리는 왼쪽에 빨간 선으로. */
.lf-story-tile[draggable="true"] { cursor:grab; }
.lf-story-tile.dragging { opacity:.4; cursor:grabbing; }
.lf-story-tile.dragover { box-shadow:inset 3px 0 0 0 #EF4444; }
.lf-story-move { display:flex; gap:4px; justify-content:center; }
.lf-story-movebtn { flex:1; padding:2px 0; border-radius:6px; border:1px solid var(--line);
  background:rgba(255,255,255,.06); color:var(--ink); font-size:11px; line-height:1.4; }
.lf-story-movebtn:disabled { opacity:.35; }
/* 배지는 타일 "안쪽"에 둔다 — .lf-storyboard 가 overflow-x:auto 라 밖으로 내밀면 잘린다. */
.lf-story-editing { position:absolute; top:3px; left:3px; right:3px; z-index:1; padding:2px 4px; border-radius:5px;
  background:#EF4444; color:#fff; font-size:10px; font-weight:700; text-align:center;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lf-timeline { display:flex; gap:2px; height:8px; margin-top:14px; border-radius:4px; overflow:hidden; background:#293241; }
.lf-timeline-seg { display:block; height:100%; background:rgba(255,255,255,.14); border:none; padding:0; cursor:pointer; }
.lf-timeline-seg.on { background:#EF4444; }
.lf-timeline-seg.skipped { background:rgba(255,255,255,.05); }

/*
 * 2026-09-18 — 인스펙터(세로 flex + overflow-y:auto)의 직계 자식은 기본 flex-shrink:1 이라,
 * 탭 내용이 길어지면 브라우저가 이 막대들을 0에 가깝게 눌러 버린다. 그래서 버튼이 통째로
 * "사라진" 것처럼 보인다(레코딩 바 → 유튜브·썸네일·계획삭제 바 순으로 같은 사고가 두 번 났다).
 * 처음엔 신고된 막대 하나에만 flex:none 을 줬는데, 그건 증상만 막은 것이라 다음 막대에서
 * 똑같이 터졌다. 크기가 고정인 자식은 전부 안 눌리게 하고, 늘어나고 스크롤되는 건
 * .lf-tab-content 하나만 맡는다.
 */
.lf-inspector-head, .lf-tabs, .lf-issue-panel, .lf-inspector-manage, .lf-thumbtext { flex:none; }
.lf-inspector-head { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.lf-inspector-head b { font-size:16px; }
.lf-tabs { display:flex; gap:4px; padding:4px; border-radius:9px; background:var(--bg1); }
.lf-tab { flex:1; padding:8px 10px; border-radius:7px; font-size:12px; font-weight:700; background:transparent; color:var(--dim); }
.lf-tab.on { background:#2B3546; color:var(--ink); }
/*
 * min-height:0 을 뺐다(2026-09-18, Puppeteer로 실측) — 있으면 대본이 길 때 이 칸이
 * 자기 내용보다 작게 눌리고, 눌린 만큼은 overflow:visible 이라 화면에만 삐져나와
 * 보이지 실제 레이아웃 흐름엔 안 잡힌다. 그러면 바로 다음 형제인 하단 액션 바
 * (.lf-inspector-sticky)의 "원래 자리"가 그 눌린 높이를 기준으로 계산돼서,
 * position:sticky 가 스크롤해도 전혀 안 붙고 그냥 같이 스크롤되며 사라져 버렸다
 * (병원 예고 카드에서 재현). min-height:0 을 빼면 이 칸이 절대 내용보다 작아지지
 * 않아 — 대본이 짧을 때는 flex:1 이 그대로 나머지 공간을 채우고, 길 때는 인스펙터
 * 전체(overflow-y:auto)가 그 실제 높이만큼 스크롤된다 — 액션 바 위치 계산도 항상
 * 정확해서 sticky 가 제대로 붙는다.
 */
.lf-tab-content { flex:1 1 auto; }
.lf-tab-content .lf-say { min-height:120px; }
.lf-inspector-label { display:block; margin-top:10px; font-size:12px; color:#AAB3C0; font-weight:700; }
.lf-inspector-label textarea { margin-top:6px; }
.lf-issue-panel { padding:12px; border-radius:12px; background:rgba(239,68,68,.08); border:1px solid rgba(239,68,68,.35); }
.lf-issue-panel.err { border-color:#EF4444; }
.lf-issue-item { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px;
  margin-top:6px; border-radius:8px; background:rgba(239,68,68,.1); font-size:12px; }
.lf-issue-actions { display:flex; gap:6px; flex-wrap:wrap; }
/*
 * 검수 이슈를 그 자리에서 바로 고친다(2026-09-18 사장님 요청) — 미리보기를 먼저 보여주고
 * "적용"을 한 번 더 눌러야 실제 대사가 바뀐다. 즉시 덮어쓰면 AI 문장이 별로일 때 되돌릴
 * 방법이 없어서, 이 패널의 "사람이 품질을 확인하는 자리"라는 성격에 맞게 한 단계 더 뒀다.
 */
.lf-rewrite-pending { flex-basis:100%; }
.lf-rewrite-pending.err { color:#EF4444; }
.lf-rewrite-preview { flex-basis:100%; display:flex; flex-direction:column; gap:8px; margin-top:4px;
  padding:10px; border-radius:8px; background:var(--bg0); border:1px solid var(--line); }
.lf-rewrite-old, .lf-rewrite-new { font-size:12px; }
.lf-rewrite-old b, .lf-rewrite-new b { display:block; margin-bottom:2px; color:#AAB3C0; font-size:11px; }
.lf-rewrite-old p { color:var(--dim); text-decoration:line-through; }
.lf-rewrite-new p { color:var(--ink); }
.lf-rewrite-btns { display:flex; gap:8px; }
.lf-inspector-manage { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding-top:6px; border-top:1px dashed var(--line); }
/* 썸네일 문구 직접 수정(2026-09-18) — 평소엔 접혀 있다가 펼치면 4칸 입력이 나온다. */
.lf-thumbtext { padding-top:6px; border-top:1px dashed var(--line); }
.lf-thumbtext summary { cursor:pointer; }
.lf-thumbtext-fields { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; }
.lf-thumbtext-fields label { display:block; font-size:12px; color:#AAB3C0; font-weight:700; }
.lf-thumbtext-fields input { display:block; width:100%; margin-top:4px; background:var(--bg0); border:1px solid var(--line);
  border-radius:8px; padding:7px 10px; color:var(--ink); font:inherit; font-size:13px; }
/*
 * 2026-09-17 "롱폼에 레코딩이 사라졌다" — 이 바는 인스펙터(세로 flex, overflow-y:auto)의
 * 마지막 flex 아이템이라 기본 flex-shrink:1 로 눌린다. .lf-assets 를 minmax(0,1fr) 로
 * 고쳐 카드가 줄바꿈되면서 인스펙터 내용이 길어지자, 이 바가 찌그러져 🔴 레코딩 버튼이
 * 화면에서 사라졌다. flex:none 으로 절대 안 눌리게 고정한다.
 */
.lf-inspector-sticky { position:sticky; bottom:0; flex:none; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:12px; margin:0 -16px -16px; background:var(--bg1); border-top:1px solid var(--line); z-index:2; }
.lf-result { padding:14px 0 0; }
.lf-promo { display:flex; gap:16px; align-items:flex-start; padding:14px 0 0; }
.lf-promo video { width:200px; aspect-ratio:9/16; background:#000; border-radius:10px; }
.lf-promo .err-text { color:#ff6b6b; }
.lf-result video { width:100%; max-width:640px; border-radius:10px; background:#000; display:block; margin-bottom:6px; }
.lf-card { border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--bg1); }
.lf-card.skipped { opacity:.62; border-style:dashed; }
.lf-card.skipped .lf-say, .lf-card.skipped .lf-assets { display:none; }
.lf-hint { display:block; width:100%; margin:8px 0 6px; background:rgba(251,191,36,.06);
  border:1px solid rgba(251,191,36,.3); border-radius:10px; padding:8px 10px;
  color:#FBBF24; font:inherit; font-size:13px; line-height:1.5; resize:vertical; }
.lf-say { display:block; width:100%; background:var(--bg0); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; color:var(--ink); font:inherit; font-size:14px; line-height:1.6; resize:vertical; }
.lf-cardactions { display:flex; align-items:center; gap:10px; margin-top:8px; font-size:12px; }
.lf-insert { display:flex; gap:8px; margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); }
.lf-insert input { flex:1; background:var(--bg0); border:1px solid var(--line); border-radius:8px;
  padding:8px 10px; color:var(--ink); font:inherit; font-size:13px; }
.lf-cardpreview { margin-top:10px; border-radius:10px; overflow:hidden; border:1px solid var(--line); background:#000; }
.lf-cardpreview img { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.lf-cardpreview-wait { aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; text-align:center;
  padding:14px; font-size:12px; color:var(--dim); background:var(--bg1); }
/*
 * 2026-09-17 "비주얼 탭 누르면 레이아웃이 깨진다" — grid-template-columns:1fr 1fr 는
 * 트랙의 기본 min-width 가 auto 라, <input type=file> 처럼 안 줄어드는 요소가 셀
 * 안에 있으면 380px짜리 오른쪽 패널을 트랙이 뚫고 나가며 전체가 무너졌다.
 * minmax(0,1fr) 로 트랙이 콘텐츠 크기보다 줄어들 수 있게 한다(잘 알려진 CSS 그리드 함정).
 */
.lf-assets { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; margin-top:10px; align-items:start; }
@media (max-width:720px) { .lf-assets { grid-template-columns:1fr; } }
/* 자유 주제 입력창(2026-09-04) */
#topicInput { background:var(--bg1); border:1px solid var(--line); border-radius:10px;
  padding:11px 14px; color:var(--ink); font:inherit; font-size:14px; }
.topic-req { display:flex; align-items:center; gap:10px; padding:10px 12px; margin-top:8px;
  border:1px solid var(--line); border-radius:10px; font-size:13px; }
.topic-req .dim { flex:1; }
.topic-req.err { border-color:rgba(239,68,68,.4); }
.lf-continuous { margin:10px 0 0; padding:14px 16px; border:1px solid var(--line); border-radius:9px; line-height:1.9; font-size:14px; white-space:pre-wrap; }
/* 여러 장/여러 개 올릴 수 있게 되면서(2026-09-03) 한 칸 안에 여러 lf-asset 을 세로로 쌓는다. */
.lf-gallery { display:flex; flex-direction:column; gap:8px; }
.lf-asset-more { min-height:auto; padding:10px 12px; font-size:12px; }
.lf-asset-error { padding:8px 10px; border-radius:8px; background:rgba(239,68,68,.12); }
.lf-slidesec { display:flex; align-items:center; gap:8px; margin-top:10px; font-size:13px; color:var(--dim); }
.lf-slidesec input { width:64px; background:var(--bg0); border:1px solid var(--line); border-radius:8px;
  padding:6px 8px; color:var(--ink); font:inherit; }
.lf-asset { display:flex; flex-direction:column; gap:8px; padding:14px; border:1px dashed var(--line); border-radius:10px;
  font-size:13px; cursor:pointer; min-height:110px; justify-content:center; align-items:center; text-align:center; }
.lf-asset:hover { border-color:rgba(255,255,255,.3); }
.lf-asset:focus, .lf-asset:focus-visible { outline:none; border-color:var(--hot); background:rgba(255,255,255,.04); }
.lf-asset.busy { opacity:.6; pointer-events:none; }
.lf-asset input[type=file] { font-size:12px; color:var(--dim); max-width:100%; }
/* 사진·영상이 실제로 크게 보여야 적용됐다는 확신이 선다 — 작은 줄(파일명+크기)만으로는
   부족했다(2026-09-03). 박스 폭 전체를 썸네일로 채우고 글자는 그 아래 한 줄로만 둔다. */
.lf-asset.has { padding:0; gap:0; overflow:hidden; align-items:stretch; text-align:left; cursor:default; }
.lf-asset.has.pending { border-color:rgba(96,165,250,.5); opacity:.9; }
.lf-asset.has.auto { border-style:dashed; cursor:pointer; }
.lf-asset.has.auto input[type=file] { display:none; }
.lf-asset .err { font-size:11px; }
.lf-face-icon { color:var(--dim); opacity:.55; }
.lf-thumb { display:block; width:100%; height:150px; object-fit:cover; background:#000; }
img.lf-thumb, .lf-cardpreview img { cursor:zoom-in; }
.lf-move { display:flex; gap:2px; }
.lf-move button { padding:2px 7px; }
.lf-asset-foot { display:flex; align-items:center; gap:8px; padding:8px 12px; }
.lf-asset-hint { padding:6px 12px 0; font-size:12px; color:var(--dim); line-height:1.4; }
.lf-role { display:flex; gap:4px; padding:0 12px; flex-wrap:wrap; }
.lf-find-note { font-size:12px; max-width:420px; }
.lf-find-note.err { color:#e5484d; }
.lf-role button.on { background:var(--accent, #2f6df6); color:#fff; border-color:transparent; opacity:1; }
.lf-asset-tag { flex:1; min-width:0; font-size:12px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
button.small { padding:6px 10px; font-size:12px; }

/* 롱폼 영상 사용 구간 툴 (2026-09-09) — 시작/끝 두 손잡이 슬라이더 */
.lf-trim { display:flex; flex-direction:column; gap:6px; padding:8px 12px 4px; border-top:1px dashed var(--line); }
.lf-trim-head { display:flex; align-items:center; gap:10px; font-size:12px; color:var(--dim); }
.lf-trim-head b { color:var(--fg, #fff); font-variant-numeric:tabular-nums; }
.lf-trim.has .lf-trim-head b { color:var(--accent, #2f6df6); }
.lf-trim-slider { position:relative; height:26px; }
.lf-trim-track { position:absolute; left:0; right:0; top:11px; height:4px; border-radius:2px; background:rgba(255,255,255,.14); }
.lf-trim-fill { position:absolute; top:0; bottom:0; border-radius:2px; background:var(--accent, #2f6df6); }
.lf-trim-slider input[type=range] { position:absolute; left:0; right:0; top:0; width:100%; height:26px; margin:0; background:transparent; -webkit-appearance:none; appearance:none; pointer-events:none; }
.lf-trim-slider input[type=range]::-webkit-slider-runnable-track { background:transparent; height:26px; }
.lf-trim-slider input[type=range]::-moz-range-track { background:transparent; height:26px; }
.lf-trim-slider input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; pointer-events:auto; width:14px; height:22px; margin-top:2px; border-radius:4px; background:#fff; border:2px solid var(--accent, #2f6df6); cursor:ew-resize; box-shadow:0 1px 4px rgba(0,0,0,.5); }
.lf-trim-slider input[type=range]::-moz-range-thumb { pointer-events:auto; width:14px; height:22px; border-radius:4px; background:#fff; border:2px solid var(--accent, #2f6df6); cursor:ew-resize; }
.lf-trim-slider input[data-lf-trim-range=end]::-webkit-slider-thumb { background:var(--accent, #2f6df6); border-color:#fff; }
.lf-trim-slider input[data-lf-trim-range=end]::-moz-range-thumb { background:var(--accent, #2f6df6); border-color:#fff; }
.lf-trim-btns { display:flex; flex-wrap:wrap; gap:4px; }

/* 그림 은행 목록 (2026-09-10) */
.bank-group { margin-bottom: 14px; }
.bank-group-head { margin: 0 0 6px; }
.bank-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.bank-item { border: 1px solid var(--line, #2a2f3a); border-radius: 10px; overflow: hidden; background: var(--card, transparent); display: flex; flex-direction: column; }
.bank-thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.bank-meta { padding: 8px 10px 0; font-size: 12px; line-height: 1.5; min-width: 0; }
.bank-meta > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bank-actions { display: flex; gap: 6px; padding: 8px 10px 10px; }

/* 나라별 스케줄 — 한국 전체 스케줄과 같은 카드를 종목별 묶음으로 (2026-09-28) */
.br-queue-schedule.country-schedule { display:block; margin:0 0 14px; }
.br-queue-schedule.country-schedule > div { padding:0; border:0; background:none; }
.country-schedule .sched-groups { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }
.country-schedule .sched-group {
  display:flex; flex-direction:column; gap:6px; padding:10px; border:1px solid var(--line);
  border-radius:12px; background:rgba(255,255,255,.02);
}
.country-schedule .sched-group-head { font-size:13px; font-weight:800; color:#fff; padding:2px 2px 4px; }
.country-schedule .sched-item { flex:none; min-width:0; }
.country-schedule span { display:inline; margin:0; font-size:inherit; }
.country-schedule .sched-state { font-size:12px; }

/* 롱폼 제작 스케줄 (2026-09-29) */
.lfsch-head { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; margin-bottom:10px; }
.lfsch-form { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.lfsch-form #lfschTopic { flex:2; min-width:220px; }
.lfsch-form #lfschGame { flex:1; min-width:180px; }
.lfsch-rec { display:inline-flex; gap:4px; align-items:center; font-size:13px; white-space:nowrap; }
.lfsch-filter { display:flex; gap:6px; margin:12px 0 8px; }
.lfsch-list { display:flex; flex-direction:column; gap:6px; }
.lfsch-row { display:grid; grid-template-columns:90px 1fr auto; gap:10px; align-items:center; padding:8px 10px; border:1px solid rgba(127,127,127,.25); border-radius:10px; }
.lfsch-row.err { border-color:rgba(255,77,77,.5); }
.lfsch-row.off { opacity:.55; }
.lfsch-when { font-weight:600; font-size:13px; }
.lfsch-main { display:flex; flex-direction:column; gap:3px; min-width:0; }
.lfsch-main b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lfsch-steps { display:flex; flex-wrap:wrap; align-items:center; gap:2px; font-size:11px; }
.lfsch-step { padding:1px 7px; border-radius:999px; opacity:.45; border:1px solid rgba(127,127,127,.35); }
.lfsch-step.done { opacity:.9; background:rgba(46,160,67,.15); border-color:rgba(46,160,67,.45); }
.lfsch-step.now { opacity:1; font-weight:700; border-color:currentColor; }
.lfsch-step.now.busy { color:#2F81F7; }
.lfsch-step.now.ok { color:#2EA043; }
.lfsch-arrow { opacity:.4; }
.lfsch-label { font-size:12px; opacity:.85; }
.lfsch-label.err { color:#FF4D4D; opacity:1; }
.lfsch-acts { display:flex; flex-wrap:wrap; gap:4px; justify-content:flex-end; }
@media (max-width: 720px) {
  .lfsch-row { grid-template-columns:1fr; }
  .lfsch-acts { justify-content:flex-start; }
}

/* 작업 라인 (2026-09-29) */
.lfline-head { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; margin-bottom:10px; }
.lfline-legend { font-size:12px; opacity:.8; margin-left:auto; }
.lfline-board { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(170px, 1fr); gap:8px; overflow-x:auto; padding-bottom:6px; }
.lfline-col { background:rgba(127,127,127,.07); border-radius:10px; padding:8px; display:flex; flex-direction:column; gap:6px; min-height:120px; }
.lfline-col.stuck { background:rgba(255,77,77,.08); }
.lfline-col.done { background:rgba(46,160,67,.07); }
.lfline-col-head { display:flex; align-items:center; gap:6px; font-size:13px; }
.lfline-count { font-size:12px; padding:0 7px; border-radius:999px; background:rgba(127,127,127,.2); }
.lfline-items { display:flex; flex-direction:column; gap:6px; max-height:360px; overflow-y:auto; }
.lfline-item { text-align:left; position:relative; display:flex; flex-direction:column; gap:3px; padding:7px 8px; border-radius:8px; border:1px solid rgba(127,127,127,.25); background:var(--card, rgba(255,255,255,.04)); color:inherit; cursor:pointer; font:inherit; }
.lfline-item b { font-size:12.5px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lfline-item .dim { font-size:11.5px; }
.lfline-item.you { border-color:rgba(224,160,0,.7); }
.lfline-you { font-size:11px; color:#E0A000; font-weight:600; }
.lfline-empty { font-size:12px; opacity:.4; text-align:center; padding:8px 0; }

.lfline-bar { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:8px; font-size:12px; }
.lfline-bar .on { outline:2px solid currentColor; }
.lfline-picked { font-weight:700; }
.lfline-item.picked { outline:2px solid #2F81F7; }
.lfline-item-top { display:flex; gap:6px; align-items:flex-start; }
.lfline-item-top input { margin-top:2px; flex:none; }
.lfline-btns { display:flex; flex-wrap:wrap; gap:4px; margin-top:2px; }
.lfline-btns button { font-size:11px; padding:2px 6px; }
.lfline-col.archive { background:rgba(127,127,127,.12); }

.lf-redraw { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:6px 0; }
.lf-redraw .err { color:#FF4D4D; }

/* 유튜브 내용 복사 창 (2026-09-29) */
.yt-copy-modal { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1000; display:flex; align-items:center; justify-content:center; padding:16px; }
.yt-copy-panel { background:var(--card, #1c1f26); color:inherit; border-radius:14px; padding:16px; width:min(760px, 100%); max-height:90vh; overflow:auto; display:flex; flex-direction:column; gap:12px; box-shadow:0 10px 40px rgba(0,0,0,.35); }
.yt-copy-top { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; }
.yt-copy-top button { margin-left:auto; }
.yt-copy-field { display:flex; flex-direction:column; gap:6px; }
.yt-copy-head { display:flex; gap:8px; align-items:center; }
.yt-copy-head button { margin-left:auto; }
.yt-copy-field textarea { width:100%; background:var(--bg1); border:1px solid var(--line); border-radius:9px; padding:9px 11px; box-sizing:border-box; font:inherit; font-size:13px; line-height:1.55; white-space:pre-wrap; resize:vertical; }
.yt-copy-subs { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
/* 유튜브 업로드 도우미 (2026-09-29) */
.yt-assist-steps { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:10px; }
.yt-assist-steps li { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; }
.yt-assist-steps li > .dim { flex-basis:100%; order:3; font-size:12px; }
.yt-copy-field.done textarea { opacity:.55; }
.yt-copy-field.done .yt-copy-head b::after { content:' ✓'; color:var(--ok, #3fb950); }
.yt-assist-done { display:flex; gap:6px; flex:1 1 280px; }
.yt-assist-done input { flex:1; min-width:0; background:var(--bg1); border:1px solid var(--line); border-radius:9px; padding:6px 10px; }
/* 유튜브 업로드 도우미 — 다른 언어 제목·설명 (2026-10-01) */
.yt-loc-head { margin-top:14px; padding-top:12px; border-top:1px dashed var(--line); display:flex; flex-direction:column; gap:4px; }

/* 레이스 시리즈 (2026-10-05) */
.race-head { display:flex; flex-wrap:wrap; gap:6px 12px; align-items:baseline; margin-bottom:12px; }
.race-list { display:flex; flex-direction:column; gap:14px; }
.race-card { padding:14px; display:flex; flex-direction:column; gap:10px; }
.race-title { display:flex; flex-wrap:wrap; gap:4px 12px; align-items:baseline; }
.race-media { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,.7fr) minmax(0,1fr); gap:12px; align-items:start; }
.race-media video { width:100%; border-radius:10px; background:#000; display:block; }
.race-short video { aspect-ratio:9/16; object-fit:cover; }
.race-thumbs { display:flex; flex-direction:column; gap:8px; }
.race-thumbs img { width:100%; border-radius:8px; display:block; }
.race-chips, .race-actions { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.race-chip { font-size:12px; padding:3px 9px; border-radius:999px; border:1px solid var(--line); color:var(--dim); }
.race-chip.on { color:var(--ink); border-color:#3fb95066; background:#3fb9501a; }
.race-chip a { color:inherit; }
.race-sortbar { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; margin:0 0 12px; }
.race-sortbar select { width:auto; }
.race-todo { display:flex; align-items:center; gap:6px; font-size:13px; }
.race-progress { font-size:12px; font-weight:700; padding:2px 8px; border-radius:999px; background:#fbbf2422; color:#fbbf24; }
.race-progress.all { background:#3fb9501a; color:#3fb950; }
.race-asof { font-size:12px; color:var(--dim); }
.race-asof.old { color:#f87171; }
@media (max-width:760px) { .race-media { grid-template-columns:1fr 1fr; } .race-long { grid-column:1 / -1; } }

/* 업로드 도우미 — 언어 체크박스는 한 줄에 여러 개, 따로 한 줄을 차지한다 */
.yt-copy-subs label.pill { display:inline-flex; align-items:center; gap:4px; margin:0; padding:4px 10px; white-space:nowrap; }
.yt-copy-subs label.pill input { margin:0; width:auto; }
.yt-thumb-langs { display:flex; flex-wrap:wrap; align-items:center; gap:6px; flex-basis:100%; width:100%; margin:6px 0; }
.yt-thumb-langs .dim { flex-basis:100%; }

.lf-view-row { display:flex; gap:6px; margin-top:8px; }
.lf-day-row { align-items:center; flex-wrap:wrap; }
.lfsch-daily { margin-top:8px; align-items:center; flex-wrap:wrap; gap:8px; }
.lfsch-row.daily { border-left:3px solid #FFD84A; }
.lf-day-input { font-size:11px; padding:3px 6px; border-radius:8px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:inherit; }
.lf-day-sum { display:flex; gap:6px; align-items:center; }
.lf-day-c { font-size:10px; padding:1px 7px; border-radius:999px; }
.lf-day-c.review { background:rgba(239,68,68,.16); color:#FFB4AF; }
.lf-day-c.draft { background:rgba(255,255,255,.08); color:#B8C0CC; }
.lf-day-c.done { background:rgba(34,197,94,.16); color:#9FE3B4; }
.lf-day-c.up { background:rgba(255,216,74,.16); color:#FFD84A; }
.lf-date-group { display:flex; flex-direction:column; gap:8px; }
.lf-date-head { display:flex; justify-content:space-between; align-items:center; padding:6px 8px; background:transparent; border:0; border-bottom:1px solid var(--line, #2a2a2a); color:inherit; font-weight:600; font-size:13px; cursor:pointer; text-align:left; }
.lf-date-head:hover { background:rgba(127,127,127,.12); }
.lf-promo-sns { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px; }
.lf-month-head { font-weight:800; }
.lf-month-day { font-size:11px; color:var(--dim); padding:6px 8px 2px; border-top:1px dashed rgba(127,127,127,.25); margin-top:4px; }

/* 선수 데이터베이스 탭 */
.pl-head{display:flex;flex-direction:column;gap:6px}
.pl-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:6px}
.pl-bar input[type=search]{flex:1;min-width:160px}
.pl-chk{display:flex;align-items:center;gap:4px;font-size:13px}
.pl-row{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:10px 12px;margin-top:6px}
.pl-row img,.pl-ph{width:56px;height:56px;border-radius:10px;object-fit:cover;object-position:50% 20%;background:rgba(127,127,127,.18)}
.pl-main{min-width:0}.pl-nm{font-weight:700}.pl-nm small{font-weight:400;opacity:.6;margin-left:6px}
.pl-meta{font-size:13px;margin-top:2px;opacity:.85}.pl-hist{font-size:11px;margin-top:2px}
.pl-tag{display:inline-block;font-size:11px;border-radius:6px;padding:1px 6px;margin-left:6px;border:1px solid currentColor}
.pl-tag.st{color:#b45309}.pl-tag.fx{color:#2563eb}
.pl-more{display:block;margin:14px auto}
.pl-dlg{max-width:420px;width:calc(100% - 32px);border-radius:14px}.pl-dlg label{display:block;font-size:13px;margin-top:8px}.pl-dlg input{width:100%}
@media (max-width:560px){.pl-row{grid-template-columns:48px 1fr}.pl-row img,.pl-ph{width:48px;height:48px}.pl-row button{grid-column:2;justify-self:start}}