/* publish_channel.css — 「채널에 올리기」 창 (218 · 링고 10-14 · 새 파일)
   왼쪽 채널 목록 | 오른쪽 올릴 꾸러미 카드 · 한눈에 · 다크 대비(테마 변수만) · 버티컬 마우스라 단추 크게(높이 40px+) */
.ask-card.pc-card {
  width: min(1240px, calc(100vw - 2rem)); height: min(900px, calc(100vh - 2rem));
  display: flex; flex-direction: column; padding: .9rem 1rem; gap: .6rem;
}
.pc-top { display: flex; align-items: center; gap: .8rem; }
.pc-top .spacer { flex: 1; }
.pc-title { margin: 0; font-size: 1.15rem; }
.pc-body { flex: 1; min-height: 0; display: grid; grid-template-columns: 15rem 1fr; gap: 1rem; }

/* 왼쪽 — 채널 목록 */
.pc-list { display: flex; flex-direction: column; gap: .35rem; overflow: auto; padding-right: .3rem;
  border-right: 1px solid var(--line); }
.pc-ch { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; column-gap: .4rem;
  min-height: 3.1rem; padding: .45rem .7rem; text-align: left; cursor: pointer;
  background: transparent; color: var(--fg); border: 1px solid var(--line); border-radius: 10px; font: inherit; }
.pc-ch:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.pc-ch.on { background: color-mix(in srgb, var(--accent) 24%, var(--panel)); border-color: var(--accent); }
.pc-ch-name { font-weight: 600; font-size: 1rem; }
.pc-ch-kind { grid-row: 2; font-size: .8rem; }
.pc-ch.on .pc-ch-kind { color: var(--fg); }   /* 고른 줄 바탕 위 옅은 글자는 밝은 판에서 3.7:1 이었다 */
.pc-ch-done { grid-row: 1 / span 2; grid-column: 2; display: inline-flex; align-items: center; gap: .2rem; font-size: .8rem;
  color: var(--ok); border: 1px solid color-mix(in srgb, var(--ok) 55%, transparent); border-radius: 999px; padding: .1rem .45rem; }
.pc-edit-table { margin-top: auto; }

/* 오른쪽 — 꾸러미 */
.pc-pane { overflow: auto; min-width: 0; padding-right: .3rem; }
.pc-pack { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; align-items: start; }
.pc-head, .pc-records, .pc-descbox, .pc-memberbox { grid-column: 1 / -1; }
@media (max-width: 1000px) { .pc-pack { grid-template-columns: 1fr; } .pc-body { grid-template-columns: 11rem 1fr; } }
.pc-head { display: flex; flex-direction: column; gap: .45rem; padding: .7rem .9rem; border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line)); }
.pc-head-name { display: flex; align-items: center; gap: .6rem; }
.pc-head h4 { margin: 0; font-size: 1.25rem; }
.pc-hint { margin: 0; color: var(--fg); opacity: .9; }
.pc-sec { border: 1px solid var(--line); border-radius: 12px; padding: .6rem .8rem .7rem; background: var(--panel); min-width: 0; }
.pc-sec-head { display: flex; align-items: center; gap: .5rem; margin-bottom: .45rem; }
.pc-sec-head h4 { margin: 0; font-size: 1rem; }
.pc-sec-head .pc-count { margin-left: .3rem; }
.pc-sec-head > :last-child:not(h4):not(.pc-count) { margin-left: auto; }
.pc-convert { align-self: flex-start; }
.pc-sec-body { display: flex; flex-direction: column; gap: .45rem; }
.pc-row { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* 단추 — 크게 */
.pc-btn { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.5rem; padding: .35rem .9rem; border-radius: 9px;
  border: 1px solid var(--line); background: color-mix(in srgb, var(--fg) 6%, var(--panel)); color: var(--fg);
  font: inherit; font-size: .95rem; cursor: pointer; text-decoration: none; white-space: nowrap; }
.pc-btn:hover:not(:disabled) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 18%, var(--panel)); }
.pc-btn.primary { background: color-mix(in srgb, var(--accent) 86%, #000); border-color: var(--accent); color: var(--on-accent); font-weight: 600; }
.pc-btn.primary:hover:not(:disabled) { background: color-mix(in srgb, var(--accent) 72%, #000); }
.pc-btn:disabled { opacity: .45; cursor: not-allowed; }
.pc-open-upload, .pc-done { min-height: 2.9rem; font-size: 1.02rem; padding: .4rem 1.2rem; }
.pc-done { border-color: color-mix(in srgb, var(--ok) 60%, var(--line)); }

.pc-in { min-height: 2.4rem; padding: .3rem .55rem; border-radius: 8px; border: 1px solid var(--line);
  background: var(--bg); color: var(--fg); font: inherit; }
.pc-title-in { width: 100%; font-size: 1rem; }
.pc-text { width: 100%; box-sizing: border-box; padding: .5rem .6rem; border-radius: 8px; border: 1px solid var(--line);
  background: var(--bg); color: var(--fg); font: inherit; font-size: .92rem; line-height: 1.45; resize: vertical; }
.pc-field { display: flex; align-items: center; gap: .5rem; }
.pc-field > span { min-width: 2.6rem; }
.pc-field > input { flex: 1; }
.pc-done-box { display: flex; flex-direction: column; gap: .4rem; padding: .5rem; border-radius: 10px; border: 1px dashed var(--ok); }
.pc-done-box[hidden] { display: none; }

.pc-count { font-size: .85rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.pc-count.over { color: #ff7a7a; font-weight: 700; }
.pc-ok { color: var(--ok); margin: 0; display: flex; align-items: center; gap: .3rem; }
.pc-why { margin: 0; display: flex; align-items: center; gap: .3rem; font-weight: 600; }
.pc-warn { margin: 0; color: #f2c46d; font-size: .9rem; }
.pc-tag { font-size: .8rem; padding: .1rem .5rem; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }

.pc-tabs { display: flex; gap: .3rem; flex-wrap: wrap; }
.pc-tab { min-height: 2.3rem; padding: .25rem .9rem; border-radius: 8px; border: 1px solid var(--line); background: transparent;
  color: var(--fg); font: inherit; cursor: pointer; }
.pc-tab.on { background: color-mix(in srgb, var(--accent) 86%, #000); border-color: var(--accent); color: var(--on-accent); font-weight: 600; }
.pc-tab.none:not(.on) { color: var(--muted); border-style: dashed; }

.pc-files { display: flex; flex-direction: column; gap: .25rem; max-height: 12rem; overflow: auto; }
.pc-file { display: flex; align-items: center; gap: .5rem; min-height: 2.4rem; padding: .2rem .5rem; border-radius: 8px; cursor: pointer;
  border: 1px solid transparent; }
.pc-file:hover { border-color: var(--line); background: color-mix(in srgb, var(--fg) 5%, transparent); }
.pc-file input { width: 1.15rem; height: 1.15rem; }
.pc-file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.pc-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .45rem; max-height: 15rem; overflow: auto; }
.pc-img { display: flex; flex-direction: column; gap: .2rem; padding: .3rem; border-radius: 8px; border: 2px solid var(--line);
  background: var(--bg); color: var(--fg); cursor: pointer; font: inherit; font-size: .78rem; }
.pc-img.on { border-color: var(--accent); }
.pc-img img { width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: #000; border-radius: 4px; }
.pc-img-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-img-info { display: flex; flex-direction: column; gap: .35rem; }

.pc-subs { display: flex; flex-direction: column; gap: .3rem; }
.pc-sub { display: flex; align-items: center; gap: .5rem; min-height: 2.6rem; }
.pc-sub-lang { width: 3.6rem; }
.pc-dot { width: .7rem; height: .7rem; border-radius: 50%; flex: none; }
.pc-dot.green { background: var(--ok); }
.pc-dot.gray { background: var(--muted); }
.pc-rest { display: flex; align-items: center; gap: .5rem; }

.pc-chtable td { vertical-align: middle; }
.pc-in-url { width: 16rem; } .pc-in-num { width: 5.5rem; } .pc-in-hint { width: 18rem; }
.pc-rec a { color: var(--accent); word-break: break-all; }
:root[data-theme="light"] .pc-count.over { color: #c62828; }
:root[data-theme="light"] .pc-warn { color: #8a5a00; }
:root[data-theme="light"] .pc-ok, :root[data-theme="light"] .pc-ch-done { color: #0b6e53; }
/* 퍼블리시 기록 표(publish.js publishLogInto)의 「올렸어요」 줄 — 좁은 카드에서 세로로 쪼개지지 않게 · 주소는 밝은 글자 */
.publish-log-row.channel td { white-space: nowrap; }
.publish-log-row.channel td[colspan] { white-space: normal; word-break: break-all; }
.publish-log-row.channel a { color: color-mix(in srgb, var(--accent) 55%, var(--fg)); }

/* ── 10-15 · 파일 자리 안내 · 멤버십 끌어 놓기 (publish_channel_files.js) ── */
.pc-place { display: flex; flex-direction: column; gap: .3rem; padding: .4rem .55rem; border: 1px dashed var(--line); border-radius: 8px; }
.pc-place-path { display: block; word-break: break-all; user-select: all; }
.pc-sub .pc-place { flex: 1; min-width: 0; }
.pc-memberbox { position: relative; }
.pc-member-src { display: flex; align-items: center; gap: .5rem; margin: 0; flex-wrap: wrap; }
.pc-member-file { font-weight: 600; }
.pc-drop-cover { display: none; position: absolute; inset: 0; z-index: 2; align-items: center; justify-content: center; pointer-events: none;
  border-radius: 12px; font-weight: 700; font-size: 1.05rem; background: color-mix(in srgb, var(--panel) 82%, var(--accent, #4a9eff)); color: var(--text, inherit); }
.pc-memberbox.pc-dropping { outline: 2px solid var(--accent, #4a9eff); outline-offset: -2px; }
.pc-memberbox.pc-dropping .pc-drop-cover { display: flex; }