/* UI text must not wait for production-artwork font downloads. */
@font-face { font-family: 'GGD UI'; src: local('Pretendard Regular'), local('Pretendard-Regular'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'GGD UI'; src: local('Pretendard Medium'), local('Pretendard-Medium'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'GGD UI'; src: local('Pretendard SemiBold'), local('Pretendard-SemiBold'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'GGD UI'; src: local('Pretendard Bold'), local('Pretendard-Bold'); font-weight: 700; font-display: swap; }

/* ===== Design Tokens ===== */
:root,
:root[data-theme="dark"] {
  --bg-base: #0f1115;
  --bg-surface: #181b22;
  --bg-elevated: #21252e;
  --bg-hover: #2a303b;
  --bg-input: #14171d;
  --bg-overlay: rgba(3,6,12,0.72);

  --text-primary: #f1f3f5;
  --text-secondary: #b0b7c3;
  --text-muted: #919ba9;
  --text-bright: #fff;

  --accent: #718cff;
  --accent-hover: #8da2ff;
  --accent-muted: rgba(113,140,255,0.16);

  --border: rgba(255,255,255,0.11);
  --border-strong: rgba(255,255,255,0.2);

  --status-before: #f6c344;
  --status-before-text: #f9d875;
  --status-before-bg: rgba(246,195,68,0.14);
  --status-before-border: rgba(246,195,68,0.38);
  --status-progress: #69a7ff;
  --status-progress-text: #9ec5ff;
  --status-progress-bg: rgba(105,167,255,0.14);
  --status-progress-border: rgba(105,167,255,0.4);
  --status-complete: #48d39a;
  --status-complete-text: #79e4b7;
  --status-complete-bg: rgba(72,211,154,0.14);
  --status-complete-border: rgba(72,211,154,0.38);
  --status-cancel: #ff6b73;
  --status-cancel-text: #ff9ca2;
  --status-cancel-bg: rgba(255,107,115,0.14);
  --status-cancel-border: rgba(255,107,115,0.4);
  --status-neutral: #aab2bf;
  --status-neutral-bg: rgba(170,178,191,0.12);
  --status-neutral-border: rgba(170,178,191,0.3);

  --party-dem: #1b64da;
  --party-dem-bg: rgba(27,100,218,0.1);
  --party-ppp: #e8333a;
  --party-ppp-bg: rgba(232,51,58,0.1);
  --party-logo-surface: #f8f8f9;
  --party-logo-border: rgba(255,255,255,0.16);

  --radius: 8px;
  --radius-lg: 12px;

  --shadow: 0 1px 2px rgba(0,0,0,0.35);
  --shadow-md: 0 6px 20px rgba(0,0,0,0.32);
  --shadow-lg: 0 16px 48px rgba(0,0,0,0.45);

  --ease: 120ms ease;
  --color-scheme: dark;

  /* Compatibility aliases used by the backup dashboard. */
  --bg-primary: var(--bg-surface);
  --bg-secondary: var(--bg-elevated);
  --bg-card: var(--bg-surface);
  --border-color: var(--border);
  --accent-primary: var(--accent);
  --accent-secondary: var(--status-progress);
  --primary: var(--accent);
  --status-active: var(--status-progress);
  --status-cancelled: var(--status-cancel);
  --status-cancelled-text: var(--status-cancel-text);
  --status-cancelled-bg: var(--status-cancel-bg);
  --radius-md: var(--radius);
  --radius-sm: 6px;
  --transition-fast: var(--ease);
  --transition-normal: 180ms ease;
  --shadow-glow: 0 0 0 1px var(--accent-muted), var(--shadow-md);
}

[hidden] { display: none !important; }

/* Shared reference-page navigation and touch targets. */
.page > .back {
  min-height: 44px;
  margin-left: -8px;
  padding: 0 8px;
  font-size: 14px;
}

.page .toc a,
.page .callout a,
.page .info-card a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --bg-base: #f5f7fa;
    --bg-surface: #fff;
    --bg-elevated: #eef1f5;
    --bg-hover: #e7ebf1;
    --bg-input: #fff;
    --bg-overlay: rgba(16,24,40,0.38);

    --text-primary: #222630;
    --text-secondary: #596273;
    --text-muted: #5f6a7c;
    --text-bright: #111318;

    --accent: #3159d9;
    --accent-hover: #2447bd;
    --accent-muted: rgba(49,89,217,0.1);

    --border: #d9dee7;
    --border-strong: #bdc5d1;

    --status-before: #8a5a00;
    --status-before-text: #6d4600;
    --status-before-bg: #fffaf1;
    --status-before-border: #d6ae50;
    --status-progress: #1859b8;
    --status-progress-text: #174c91;
    --status-progress-bg: #f4f7fc;
    --status-progress-border: #91b8ee;
    --status-complete: #0b7351;
    --status-complete-text: #095a40;
    --status-complete-bg: #f2f9f6;
    --status-complete-border: #7fc7aa;
    --status-cancel: #b4232b;
    --status-cancel-text: #912029;
    --status-cancel-bg: #fff7f7;
    --status-cancel-border: #e5a0a5;
    --status-neutral: #596273;
    --status-neutral-bg: #f1f3f6;
    --status-neutral-border: #c9d0da;
    --party-logo-surface: #fff;
    --party-logo-border: rgba(0,0,0,0.12);

    --shadow: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 6px 20px rgba(31,42,61,0.09);
    --shadow-lg: 0 16px 48px rgba(31,42,61,0.14);

    --color-scheme: light;
  }
}

:root[data-theme="light"] {
  --bg-base: #f5f7fa;
  --bg-surface: #fff;
  --bg-elevated: #eef1f5;
  --bg-hover: #e7ebf1;
  --bg-input: #fff;
  --bg-overlay: rgba(16,24,40,0.38);
  --text-primary: #222630;
  --text-secondary: #596273;
  --text-muted: #5f6a7c;
  --text-bright: #111318;
  --accent: #3159d9;
  --accent-hover: #2447bd;
  --accent-muted: rgba(49,89,217,0.1);
  --border: #d9dee7;
  --border-strong: #bdc5d1;
  --status-before: #8a5a00;
  --status-before-text: #6d4600;
  --status-before-bg: #fffaf1;
  --status-before-border: #d6ae50;
  --status-progress: #1859b8;
  --status-progress-text: #174c91;
  --status-progress-bg: #f4f7fc;
  --status-progress-border: #91b8ee;
  --status-complete: #0b7351;
  --status-complete-text: #095a40;
  --status-complete-bg: #f2f9f6;
  --status-complete-border: #7fc7aa;
  --status-cancel: #b4232b;
  --status-cancel-text: #912029;
  --status-cancel-bg: #fff7f7;
  --status-cancel-border: #e5a0a5;
  --status-neutral: #596273;
  --status-neutral-bg: #f1f3f6;
  --status-neutral-border: #c9d0da;
  --shadow: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 6px 20px rgba(31,42,61,0.09);
  --shadow-lg: 0 16px 48px rgba(31,42,61,0.14);
  --color-scheme: light;
}

/* Card colors */
.cc-red { --cc: #ff777d; --cc-bg: rgba(255,119,125,0.12); --cc-border: rgba(255,119,125,0.34); }
.cc-orange { --cc: #f6a15f; --cc-bg: rgba(246,161,95,0.12); --cc-border: rgba(246,161,95,0.34); }
.cc-yellow { --cc: #f3cf60; --cc-bg: rgba(243,207,96,0.12); --cc-border: rgba(243,207,96,0.34); }
.cc-green { --cc: #55d889; --cc-bg: rgba(85,216,137,0.12); --cc-border: rgba(85,216,137,0.34); }
.cc-blue { --cc: #72aaff; --cc-bg: rgba(114,170,255,0.12); --cc-border: rgba(114,170,255,0.34); }
.cc-purple { --cc: #ad8bff; --cc-bg: rgba(173,139,255,0.12); --cc-border: rgba(173,139,255,0.34); }
.cc-pink { --cc: #ed7bc4; --cc-bg: rgba(237,123,196,0.12); --cc-border: rgba(237,123,196,0.34); }
.cc-gray { --cc: #aab2bf; --cc-bg: rgba(170,178,191,0.12); --cc-border: rgba(170,178,191,0.3); }

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) .cc-red { --cc: #b72c34; --cc-bg: #fff0f1; --cc-border: #e5a0a5; }
  :root:not([data-theme]) .cc-orange { --cc: #9a4b10; --cc-bg: #fff3e9; --cc-border: #e9b48d; }
  :root:not([data-theme]) .cc-yellow { --cc: #755d00; --cc-bg: #fff8dc; --cc-border: #d8bd5d; }
  :root:not([data-theme]) .cc-green { --cc: #0b7040; --cc-bg: #eaf8f0; --cc-border: #86c7a2; }
  :root:not([data-theme]) .cc-blue { --cc: #1b58ad; --cc-bg: #edf4ff; --cc-border: #91b8ee; }
  :root:not([data-theme]) .cc-purple { --cc: #6840bd; --cc-bg: #f4efff; --cc-border: #baa4e8; }
  :root:not([data-theme]) .cc-pink { --cc: #a72a79; --cc-bg: #fff0f8; --cc-border: #e4a4ca; }
  :root:not([data-theme]) .cc-gray { --cc: #596273; --cc-bg: #f1f3f6; --cc-border: #c9d0da; }
}

:root[data-theme="light"] .cc-red { --cc: #b72c34; --cc-bg: #fff0f1; --cc-border: #e5a0a5; }
:root[data-theme="light"] .cc-orange { --cc: #9a4b10; --cc-bg: #fff3e9; --cc-border: #e9b48d; }
:root[data-theme="light"] .cc-yellow { --cc: #755d00; --cc-bg: #fff8dc; --cc-border: #d8bd5d; }
:root[data-theme="light"] .cc-green { --cc: #0b7040; --cc-bg: #eaf8f0; --cc-border: #86c7a2; }
:root[data-theme="light"] .cc-blue { --cc: #1b58ad; --cc-bg: #edf4ff; --cc-border: #91b8ee; }
:root[data-theme="light"] .cc-purple { --cc: #6840bd; --cc-bg: #f4efff; --cc-border: #baa4e8; }
:root[data-theme="light"] .cc-pink { --cc: #a72a79; --cc-bg: #fff0f8; --cc-border: #e4a4ca; }
:root[data-theme="light"] .cc-gray { --cc: #596273; --cc-bg: #f1f3f6; --cc-border: #c9d0da; }

/* ===== Reset ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 15px; color-scheme: var(--color-scheme); }
body {
  font-family: 'GGD UI', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  background: var(--bg-base);
  color: var(--text-primary);
  line-height: 1.55;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
body.modal-open { overflow: hidden; }
a { color: var(--accent); text-decoration: none; }
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 3px; }

/* ===== Layout ===== */
.app-container { max-width: 1800px; margin: 0 auto; padding: 0 20px 40px; }

/* ===== Header ===== */
.header {
  position: static; z-index: 100;
  background: transparent;
  border: 0;
  padding: 16px 0 0;
}
.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 1800px; margin: 0 auto; padding: 0 20px;
}
.header-left { display: flex; align-items: center; gap: 10px; }
.header-home-btn {
  display: flex; align-items: center; gap: 4px;
  min-width: 44px; min-height: 44px; justify-content: center;
  padding: 4px 10px; border-radius: 6px;
  font-size: 14px; font-weight: 500; color: var(--text-muted); text-decoration: none;
  transition: background 0.15s, color 0.15s;
  border: 1px solid var(--border);
}
.header-home-btn:hover { background: var(--bg-hover); color: var(--text-bright); border-color: var(--border-strong); }
.header-logo {
  width: 32px; height: 32px; flex: 0 0 32px; object-fit: contain;
}
.header-title { font-size: 17px; font-weight: 700; color: var(--text-bright); }
.header-right { display: flex; align-items: center; gap: 8px; }
/* ===== Upcoming Lives ===== */
.upcoming-section { padding: 10px 0; }
.upcoming-title {
  margin: 0 0 8px; color: var(--text-muted); font-size: 14px;
  font-weight: 700; letter-spacing: 0.02em;
}
.upcoming-lives {
  display: flex; gap: 6px; overflow-x: auto; flex-wrap: wrap;
}
.upcoming-entry { display: flex; align-items: stretch; max-width: 100%; min-width: 0; }
.upcoming-item {
  display: flex; align-items: center; gap: 6px;
  min-height: 44px; margin: 0; padding: 4px 10px; border-radius: 6px;
  background: var(--bg-surface); border: 1px solid var(--border);
  max-width: 100%; color: var(--text-secondary); font: inherit; font-size: 14px;
  text-align: left; white-space: nowrap; cursor: pointer;
}
.upcoming-entry.has-chat .upcoming-item { min-width: 0; border-radius: 6px 0 0 6px; border-right: 0; }
.upcoming-chat {
  position: relative;
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  min-width: 44px; min-height: 44px; padding: 4px 9px;
  border: 1px solid var(--border); border-radius: 0 6px 6px 0;
  background: var(--bg-surface); color: var(--text-primary);
  font-size: 14px; font-weight: 700; text-decoration: none;
}
.upcoming-chat svg { width: 21px; height: 21px; flex: none; }
.upcoming-chat-unread { position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border-radius: 50%; background: #dc2626; box-shadow: 0 0 0 2px var(--bg-surface); }
.upcoming-chat-unread.is-observed { background: #facc15; }
.upcoming-chat-unread[hidden] { display: none; }
.upcoming-chat:hover { border-color: var(--border-strong); background: var(--bg-hover); }
.upcoming-chat:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.upcoming-item:hover { border-color: var(--border-strong); background: var(--bg-hover); }
.upcoming-item:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.upcoming-subject {
  flex: 1 1 220px; min-width: 140px; color: var(--text-bright);
  font-size: 14px; line-height: 1.45; white-space: normal; overflow-wrap: anywhere;
}
.upcoming-date {
  font-weight: 600; color: var(--text-primary); font-size: 14px;
}
.upcoming-dday {
  font-size: 14px; font-weight: 700; color: var(--status-progress-text);
  background: var(--status-progress-bg); border: 1px solid var(--status-progress-border);
  padding: 1px 6px; border-radius: 4px;
}
.upcoming-dday.upcoming-urgent {
  color: var(--status-cancel-text); background: var(--status-cancel-bg);
  border-color: var(--status-cancel-border);
  animation: pulse-live 1.5s infinite;
}
@keyframes pulse-live {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.upcoming-badges {
  display: inline-flex; align-items: center; gap: 3px;
  padding-left: 6px; border-left: 1px solid var(--border-strong);
}
.upcoming-badges .option-badge,
.upcoming-badges .personnel-tag {
  font-size: 14px; padding: 2px 7px;
}
.upcoming-empty {
  font-size: 14px; color: var(--text-secondary); padding: 6px 0;
}

/* ===== Toolbar ===== */
.toolbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 0 14px; gap: 10px; flex-wrap: wrap;
}
.toolbar-left { display: flex; align-items: center; gap: 8px; }
.toolbar-right { display: flex; align-items: center; gap: 6px; }
.toolbar-checks { display: contents; }
.toolbar-filters { display: contents; }

.view-tabs {
  display: flex; border-radius: 6px; padding: 2px;
  background: var(--bg-surface); border: 1px solid var(--border);
}
.view-tab {
  appearance: none; min-height: 44px; padding: 6px 14px; border-radius: 4px; border: none; background: transparent;
  color: var(--text-secondary); font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.2;
  cursor: pointer;
  transition: all var(--ease);
  display: flex; align-items: center; gap: 5px;
}
.view-tab:hover { color: var(--text-primary); background: var(--bg-hover); }
.view-tab.active { background: var(--accent); color: #fff; }
.view-tab:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.view-tab svg { width: 15px; height: 15px; }
.schedule-control-label { font-size: 15px; font-weight: 500; line-height: 1.2; }

/* ===== Buttons ===== */
.btn {
  appearance: none; display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 6px;
  border: 1px solid var(--border-strong); background: var(--bg-surface);
  color: var(--text-primary); font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.2;
  cursor: pointer; transition: all var(--ease); white-space: nowrap;
}
.btn:hover { background: var(--bg-hover); border-color: var(--text-muted); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-hover); }
.btn-danger { background: var(--status-cancel-bg); border-color: var(--status-cancel); color: var(--status-cancel); }
.btn-danger:hover { background: var(--status-cancel); color: #fff; }
.btn svg { width: 15px; height: 15px; }
.btn-sm { min-height: 44px; padding: 6px 10px; font-size: 15px; }

/* ===== Search ===== */
.search-box { position: relative; width: 200px; }
.search-box input {
  width: 100%; min-height: 44px; padding: 8px 12px 8px 34px;
  border-radius: 6px; border: 1px solid var(--border);
  background: var(--bg-input); color: var(--text-primary);
  font-size: 14px; font-family: inherit; transition: border-color var(--ease);
}
.search-box input::placeholder { color: var(--text-muted); }
.search-box input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-muted); }
.search-box svg {
  position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px; color: var(--text-muted);
}

/* ===== Checkbox ===== */
.checkbox-wrap {
  display: flex; align-items: center; gap: 6px; min-height: 44px;
  font-size: 14px; color: var(--text-secondary); cursor: pointer;
  white-space: nowrap; user-select: none;
}
.checkbox-wrap input[type="checkbox"] {
  accent-color: var(--accent); cursor: pointer;
  width: 16px; height: 16px;
}

/* ===== Select ===== */
.select-wrap { position: relative; }
.select-wrap select {
  appearance: none; min-height: 44px; padding: 8px 30px 8px 12px;
  border-radius: 6px; border: 1px solid var(--border);
  background: var(--bg-input); color: var(--text-primary);
  font-size: 14px; font-family: inherit; cursor: pointer;
  color-scheme: var(--color-scheme);
}
.select-wrap select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-muted); }
.toolbar-filters .btn { min-height: 44px; }
.select-wrap::after {
  content: '▾'; position: absolute; right: 8px; top: 50%;
  transform: translateY(-50%); color: var(--text-muted); pointer-events: none; font-size: 10px;
}

/* ===== Data Table ===== */
.table-container {
  background: var(--bg-surface); border-radius: var(--radius-lg);
  border: 1px solid var(--border); overflow: hidden;
}
.table-scroll { overflow-x: auto; }
.data-table { width: 100%; min-width: var(--table-min-width, 1712px); border-collapse: collapse; font-size: 16px; table-layout: fixed; }
.data-table th {
  padding: 8px 10px; text-align: left; font-weight: 600;
  color: var(--text-muted); background: var(--bg-elevated);
  border-bottom: 1px solid var(--border); white-space: nowrap;
  position: sticky; top: 0; z-index: 10;
  font-size: 14px; letter-spacing: 0.02em;
  user-select: none;
}
.data-table th[data-sort] { padding: 0; }
.table-sort-button {
  appearance: none; width: 100%; min-height: 44px; margin: 0;
  padding: 6px 8px; border: 0; background: transparent; color: inherit;
  font: inherit; font-weight: inherit; letter-spacing: inherit; text-align: left;
  white-space: nowrap; cursor: pointer;
}
.table-sort-button:hover { color: var(--text-secondary); background: var(--bg-hover); }
.table-sort-button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.data-table th .sort-icon { display: inline-block; margin-left: 3px; opacity: 0.3; font-size: 14px; }
.data-table th.sorted .sort-icon { opacity: 1; color: var(--accent); }
.data-table th.campaign-column { width: 92px; }
.data-table th.thumbnail-column { width: 132px; }
.data-table th.remarks-column { width: 230px; }
.data-table td {
  padding: 6px 10px; border-bottom: 1px solid var(--border);
  vertical-align: middle; overflow: hidden;
}
.data-table td:first-child { overflow: visible; word-break: break-word; }
.data-table td[data-label="장소"] {
  overflow: visible;
  white-space: normal;
}
.data-table td[data-label="장소"] .inline-cell,
.data-table td[data-label="장소"] .option-badge {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: keep-all;
}
.data-table td[data-label="장소"] .option-badge { min-width: 132px; justify-content: center; }
.data-table td[data-label="위원회"] .option-badge { width: 76px; justify-content: center; }
.data-table td[data-label="날짜"] .inline-cell { padding-left: 0; padding-right: 0; }
.table-date-day,
.table-date-time { display: block; white-space: nowrap; }
.table-date-time { margin-top: 4px; color: var(--text-secondary); font-size: 15px; }
.data-table td[data-label="담당자"] { padding-left: 6px; padding-right: 6px; overflow: visible; }
.data-table td[data-label="담당자"] .personnel-tags {
  display: grid; grid-template-columns: repeat(2, max-content); justify-content: start; gap: 4px;
}
.data-table td[data-label="담당자"] .personnel-tag {
  position: relative; width: max-content; min-width: 0; max-width: 100%;
  box-sizing: border-box; flex: none;
  justify-content: center; padding: 3px 4px; font-size: 14px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.data-table td[data-label="담당자"] .personnel-tag.has-crown {
  grid-column: 1 / -1; order: -1;
  width: max-content; min-width: 0; max-width: 100%;
  padding-left: 20px; gap: 0;
}
.data-table td[data-label="담당자"] .personnel-tag.has-crown .crown-icon {
  position: absolute; left: 6px; top: 50%;
  width: 12px; height: 10px; margin: 0;
  transform: translateY(-50%);
}
.data-table td[data-label="정당"] { padding-left: 5px; padding-right: 5px; overflow: visible; }
.data-table td[data-label="정당"] .inline-cell { padding-left: 0; padding-right: 0; overflow: visible; }
.data-table td[data-label="정당"] .cell-display { display: block; max-width: 100%; }
.data-table td[data-label="지역구"],
.data-table td[data-label="지역구"] .inline-cell,
.data-table td[data-label="지역구"] .cell-display { white-space: nowrap; }
.data-table td[data-label="위원회"] { overflow: visible; }
.data-table td[data-label="위원회"] .inline-cell { padding-left: 0; padding-right: 0; }
.data-table td[data-label="상태"] { overflow: visible; padding-left: 4px; padding-right: 4px; }
.data-table td[data-label="상태"] .inline-cell { padding-left: 0; padding-right: 0; justify-content: center; }
.data-table td[data-label="썸네일"] { padding-left: 10px; padding-right: 10px; }
.data-table td[data-label="비고"] { overflow: visible; }
.data-table td[data-label="비고"] .inline-cell { align-items: flex-start; line-height: 1.45; }
.data-table td[data-label="비고"] .cell-display { overflow-wrap: anywhere; }
.data-table tr { transition: background var(--ease); }
.data-table tbody tr:hover { background: var(--bg-hover); }
.data-table tbody tr:last-child td { border-bottom: none; }

/* Table row status accent */
.data-table tbody tr.row-시작전,
.data-table tbody tr.row-예정 {
  border-left: 3px solid var(--status-before);
  background: var(--status-before-bg);
}
.data-table tbody tr.row-일정확정 {
  border-left: 3px solid var(--status-progress);
  background: var(--status-progress-bg);
}
.data-table tbody tr.row-완료 {
  border-left: 3px solid var(--status-complete);
  background: var(--status-complete-bg);
}
.data-table tbody tr.row-취소,
.data-table tbody tr.row-취소\/연기 {
  border-left: 3px solid var(--status-cancel);
  background: var(--status-cancel-bg);
}

.subject-wrap { display: flex; align-items: center; gap: 4px; position: relative; }
.subject-cell { font-weight: 500; color: var(--text-bright); padding-right: 36px; }
.subject-editable {
  appearance: none; border: 0; border-bottom: 1px dashed transparent; background: transparent;
  color: inherit; font: inherit; text-align: left; cursor: text;
  transition: border-color 0.15s; padding: 8px 4px; display: inline-block;
}
.subject-editable:hover { color: var(--accent); border-bottom-color: var(--accent); }
.subject-editable:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.seq-edit-button {
  appearance: none; min-width: 44px; min-height: 44px; padding: 4px; border: 0;
  border-radius: 5px; background: transparent; color: var(--text-secondary);
  font: inherit; font-weight: 600; cursor: pointer;
}
.seq-edit-button:hover { color: var(--accent); background: var(--bg-hover); }
.seq-edit-button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
/* Row open button (overlays subject cell) */
.row-open-btn {
  position: absolute; right: 0; top: 0; bottom: 0;
  min-height: 44px;
  padding: 0 10px; border-radius: 4px;
  border: none; background: linear-gradient(90deg, transparent, var(--bg-surface) 30%);
  color: var(--text-muted); cursor: pointer;
  display: flex; align-items: center; justify-content: flex-end; gap: 4px;
  opacity: 0; transition: opacity 0.15s, color 0.15s;
  z-index: 2; font-size: 14px; font-weight: 500; font-family: inherit;
  white-space: nowrap;
}
.row-open-btn svg { width: 13px; height: 13px; flex-shrink: 0; }
.row-open-btn:hover { color: var(--accent); }
.data-table tbody tr:hover .row-open-btn { opacity: 1; }
.data-table tbody tr:hover .row-open-btn { background: linear-gradient(90deg, transparent, var(--bg-hover) 30%); }

/* ===== Status Badge ===== */
.status-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 5px;
  font-size: 14px; font-weight: 400; white-space: nowrap;
  justify-content: center;
}
td:has(.status-badge) { text-align: center; }
.status-badge::before { content: ''; width: 5px; height: 5px; border-radius: 50%; }

.status-badge.status-시작전, .status-badge.status-예정 { background: var(--status-before-bg); color: var(--status-before-text); border: 1px solid var(--status-before-border); }
.status-badge.status-시작전::before, .status-badge.status-예정::before { background: var(--status-before); }
.status-badge.status-일정확정 { background: var(--status-progress-bg); color: var(--status-progress-text); border: 1px solid var(--status-progress-border); }
.status-badge.status-일정확정::before { background: var(--status-progress); animation: blink 1.5s ease-in-out infinite; }
.status-badge.status-완료 { background: var(--status-complete-bg); color: var(--status-complete-text); border: 1px solid var(--status-complete-border); }
.status-badge.status-완료::before { background: var(--status-complete); }
.status-badge.status-취소, .status-badge.status-취소\/연기 { background: var(--status-cancel-bg); color: var(--status-cancel-text); border: 1px solid var(--status-cancel-border); }
.status-badge.status-취소::before, .status-badge.status-취소\/연기::before { background: var(--status-cancel); }
@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:0.3; } }

/* ===== Party Badge ===== */
.party-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 96px; height: 40px; padding: 6px 7px; border-radius: 7px;
  font-size: 14px; font-weight: 500; white-space: nowrap;
  overflow: hidden; vertical-align: middle;
}
.party-badge--logo {
  gap: 7px;
  background: var(--party-logo-surface);
  border: 1px solid var(--party-logo-border);
  box-shadow: 0 1px 2px rgba(0,0,0,0.16);
}
.party-badge--text {
  color: var(--text-secondary);
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
}
.party-logo-frame {
  display: inline-flex; align-items: center; justify-content: center;
  height: 26px; overflow: visible; flex: 0 1 auto;
}
.party-logo-frame img { display: block; height: 100%; width: auto; max-width: 100%; object-fit: contain; }
.party-logo--democratic { width: 38px; }
.party-logo--ppp { width: 78px; height: 26px; }
.party-logo--ppp img { width: 62px; height: auto; max-height: 22px; object-position: center; }
.party-logo--institution { width: 25px; flex: 0 0 25px; }
.party-logo--council { width: 80px; flex: 0 0 80px; justify-content: center; }
.party-logo--council img { width: 78px; height: auto; max-width: 100%; max-height: 24px; object-position: center; }
.party-logo--legislative { width: 72px; height: 30px; flex: 0 0 72px; }
.party-logo-divider { width: 1px; height: 18px; background: rgba(0,0,0,0.14); flex: 0 0 1px; }

/* Ad status badges */
.ad-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 5px;
  font-size: 14px; font-weight: 400; white-space: nowrap;
}
.data-table td[data-label="당근 광고"],
.data-table td[data-label="유튜브 광고"] { padding-left: 4px; padding-right: 4px; }
.data-table td[data-label="당근 광고"] .ad-badge,
.data-table td[data-label="유튜브 광고"] .ad-badge { padding-left: 6px; padding-right: 6px; }
.ad-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; }
.ad-badge.ad-미정 { background: var(--status-neutral-bg); color: var(--status-neutral); border: 1px solid var(--status-neutral-border); }
.ad-badge.ad-미정::before { background: var(--status-neutral); }
.ad-badge.ad-진행안함 { background: var(--status-cancel-bg); color: var(--status-cancel-text); border: 1px solid var(--status-cancel-border); }
.ad-badge.ad-진행안함::before { background: var(--status-cancel); }
.ad-badge.ad-시작전 { background: var(--status-before-bg); color: var(--status-before-text); border: 1px solid var(--status-before-border); }
.ad-badge.ad-시작전::before { background: var(--status-before); }
.ad-badge.ad-진행중 { background: var(--status-progress-bg); color: var(--status-progress-text); border: 1px solid var(--status-progress-border); }
.ad-badge.ad-진행중::before { background: var(--status-progress); }
.ad-badge.ad-완료 { background: var(--status-complete-bg); color: var(--status-complete-text); border: 1px solid var(--status-complete-border); }
.ad-badge.ad-완료::before { background: var(--status-complete); }
.popover-option .ad-badge { padding: 2px 8px; font-size: 14px; border-radius: 4px; }

/* ===== Committee Badge ===== */
.committee-badge {
  display: inline-flex; padding: 4px 10px; border-radius: 5px;
  font-size: 15px; font-weight: 400;
  background: var(--accent); color: #fff;
}

.prop-value--long { align-items: stretch; }
.inline-cell--long { min-height: 44px; white-space: pre-wrap; }
.long-text-display { white-space: pre-wrap; overflow-wrap: anywhere; }
.inline-long-textarea {
  width: 100%; min-height: 120px; resize: vertical;
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--bg-primary); color: var(--text-primary);
  padding: 10px; font: inherit; line-height: 1.55;
}

/* ===== Personnel Tags ===== */
.personnel-tags { display: flex; flex-wrap: wrap; gap: 3px; }
.personnel-tags[role="button"] { min-height: 44px; align-items: center; cursor: pointer; border-radius: 4px; }
.personnel-tag {
  display: inline-flex; align-items: center;
  padding: 4px 10px; border-radius: 4px;
  background: rgba(79,110,247,0.15); color: var(--text-bright);
  font-size: 15px; font-weight: 400;
}

/* Team Leader — crown inside badge */
.crown-icon {
  width: 13px; height: 11px; flex-shrink: 0;
  margin-right: 2px; vertical-align: -1px;
}
.has-crown { gap: 2px; }
/* Crown toggle in popover tags */
.sel-tag-leader, .sel-tag-vehicle, .sel-tag-equipment {
  appearance: none; border: 0; background: transparent;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 32px; padding: 0; border-radius: 3px;
  transition: background 0.15s; user-select: none; flex-shrink: 0;
}
.sel-tag-leader .crown-icon { width: 14px; height: 12px; margin: 0; }
.sel-tag-leader .crown-icon path { fill: var(--text-muted); transition: fill 0.15s; }
.sel-tag-leader:hover .crown-icon path { fill: #eab308; }
.sel-tag-leader:hover { background: rgba(234,179,8,0.1); }
.sel-tag-leader.active .crown-icon path { fill: #eab308; }
.sel-tag-leader.active { background: rgba(234,179,8,0.15); }

.vehicle-icon { width: 14px; height: 14px; flex-shrink: 0; margin-right: 1px; color: #2563eb; }
.sel-tag-vehicle .vehicle-icon { margin: 0; filter: grayscale(1); opacity: .55; }
.sel-tag-vehicle:hover, .sel-tag-vehicle.active { background: rgba(37,99,235,0.15); }
.sel-tag-vehicle:hover .vehicle-icon, .sel-tag-vehicle.active .vehicle-icon { filter: none; opacity: 1; }


/* ===== Inline Editing ===== */
.inline-cell {
  padding: 6px 8px; border-radius: 4px; cursor: text;
  transition: background var(--ease); min-height: 44px;
  display: flex; align-items: center;
}
.inline-cell:hover { background: var(--accent-muted); }
.inline-cell[role="button"] { cursor: pointer; }
.inline-placeholder { color: var(--text-muted); font-size: 14px; line-height: 1.4; }
.inline-cell:focus-visible,
.personnel-tags:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
  background: var(--accent-muted);
}
.editing { outline: 2px solid var(--accent); outline-offset: -2px; border-radius: 4px; background: var(--bg-input); }
.editing input, .editing textarea {
  width: 100%; background: transparent; border: none;
  color: var(--text-primary); font-family: inherit; font-size: inherit;
  outline: none; padding: 0; line-height: 1.5; box-sizing: border-box;
}
.inline-cell input[type="datetime-local"] { color-scheme: var(--color-scheme); }
.inline-select {
  appearance: none; background: transparent; border: none;
  color: inherit; font: inherit; cursor: pointer;
  padding: 10px 16px; border-radius: 4px; outline: none;
  line-height: 1.2;
}
.inline-select:focus { outline: 2px solid var(--accent); outline-offset: -2px; }

/* ===== Date Picker Popover ===== */
.datepicker-popover {
  z-index: 1000; background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  padding: 12px; width: min(340px, calc(100vw - 16px)); user-select: none;
}
.dp-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.dp-title { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.dp-nav {
  background: none; border: none; color: var(--text-secondary);
  font-size: 18px; cursor: pointer; width: 44px; height: 44px;
  border-radius: var(--radius); display: flex; align-items: center; justify-content: center;
  transition: background var(--ease);
}
.dp-nav:hover { background: var(--accent-muted); color: var(--text-primary); }
.dp-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px;
  text-align: center; margin-bottom: 10px;
}
.dp-dow {
  font-size: 14px; color: var(--text-muted); font-weight: 500;
  padding: 4px 0;
}
.dp-empty { padding: 4px; }
.dp-day {
  appearance: none; border: 0; background: transparent; font-family: inherit;
  min-height: 44px; font-size: 14px; padding: 6px 0; border-radius: var(--radius);
  cursor: pointer; color: var(--text-primary); transition: background var(--ease);
}
.dp-day:hover { background: var(--accent-muted); }
.dp-today { font-weight: 700; color: var(--accent); }
.dp-selected {
  background: var(--accent) !important; color: #fff !important;
  font-weight: 600;
}
.dp-time {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 0; border-top: 1px solid var(--border);
}
.dp-time-label { font-size: 14px; color: var(--text-secondary); flex-shrink: 0; }
.dp-hour, .dp-minute {
  background: var(--bg-input); border: 1px solid var(--border);
  color: var(--text-primary); border-radius: var(--radius);
  min-height: 44px; padding: 4px 6px; font-size: 14px; font-family: inherit;
  cursor: pointer; outline: none;
}
.dp-hour:focus, .dp-minute:focus { border-color: var(--accent); }
.dp-colon { color: var(--text-secondary); font-weight: 600; }
.dp-actions {
  display: flex; justify-content: flex-end; gap: 6px;
  padding-top: 8px; border-top: 1px solid var(--border); margin-top: 4px;
}
.dp-btn {
  min-height: 44px; padding: 5px 14px; border-radius: var(--radius); font-size: 14px;
  font-weight: 500; cursor: pointer; border: none; transition: background var(--ease);
}
.dp-clear {
  background: var(--bg-input); color: var(--text-secondary);
}
.dp-clear:hover { background: var(--border); }
.dp-confirm {
  background: var(--accent); color: #fff;
}
.dp-confirm:hover { opacity: 0.9; }

/* ===== Calendar ===== */
.calendar-container {
  background: var(--bg-surface); border-radius: var(--radius-lg);
  border: 1px solid var(--border); overflow: hidden;
}
.calendar-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--border);
}
.calendar-title { font-size: 17px; font-weight: 700; color: var(--text-bright); }
.calendar-nav { display: flex; gap: 4px; }
.calendar-nav button {
  min-width: 44px; min-height: 44px; padding: 4px 8px; border-radius: 4px; border: 1px solid var(--border);
  background: var(--bg-surface); color: var(--text-primary);
  cursor: pointer; font-size: 14px; transition: all var(--ease);
}
.calendar-nav button:hover { background: var(--bg-hover); }
.calendar-undated {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 16px; border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
}
.calendar-undated[hidden] { display: none; }
.calendar-undated-label {
  flex: 0 0 auto; padding-top: 5px; color: var(--text-secondary);
  font-size: 14px; font-weight: 700;
}
.calendar-undated-events { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.calendar-undated-event {
  width: auto; max-width: min(520px, 100%); margin: 0; text-align: left;
  font-family: inherit;
}
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
/* ===== Calendar ===== */
.calendar-day-header {
  padding: 10px 6px; text-align: center; font-size: 14px; font-weight: 600;
  color: var(--text-muted); background: var(--bg-elevated);
  border-bottom: 2px solid var(--border);
}
.calendar-day-header:first-child { color: #e55; }
.calendar-day-header:nth-child(7) { color: #48f; }
.calendar-day {
  min-height: 110px; padding: 6px; border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border); transition: background 0.15s;
}
.calendar-day:nth-child(7n) { border-right: none; }
.calendar-day:hover { background: var(--bg-hover); }
.calendar-day.other-month { background: var(--bg-elevated); }
.calendar-day.other-month .calendar-date { color: var(--text-muted); }
.calendar-day.today { background: var(--status-progress-bg); }
.calendar-date {
  font-size: 14px; font-weight: 600; color: var(--text-secondary);
  padding: 2px 6px; margin-bottom: 4px;
}
.calendar-day:nth-child(7n+1) .calendar-date { color: #e55; }
.calendar-day:nth-child(7n) .calendar-date { color: #48f; }
.calendar-day.today .calendar-date {
  background: var(--accent); color: #fff; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; width: 26px; height: 26px;
}
.calendar-event {
  min-height: 44px; padding: 4px 8px; margin-bottom: 3px; border-radius: 4px;
  font-size: 14px; font-weight: 500; cursor: pointer;
  overflow: hidden; white-space: normal; overflow-wrap: anywhere;
  width: 100%; appearance: none; font-family: inherit; text-align: left;
  border: 0; border-left: 3px solid; transition: opacity 0.15s;
}
.calendar-event:hover { opacity: 0.8; }
.calendar-event:focus-visible,
.feed-card-poster-button:focus-visible,
.feed-card-detail:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 2px;
}
.calendar-event .cal-time { font-size: 14px; opacity: 0.7; margin-right: 2px; }
.calendar-event.row-시작전, .calendar-event.row-예정 { background: var(--status-before-bg); border-color: var(--status-before); color: var(--text-bright); }
.calendar-event.row-일정확정 { background: var(--status-progress-bg); border-color: var(--status-progress); color: var(--text-bright); }
.calendar-event.row-완료 { background: var(--status-complete-bg); border-color: var(--status-complete); color: var(--text-bright); }
.calendar-event.row-취소, .calendar-event.row-취소\/연기 { background: var(--status-cancel-bg); border-color: var(--status-cancel); color: var(--text-muted); text-decoration: line-through; }
.calendar-event.default { background: var(--accent-muted); color: var(--accent); border-color: var(--accent); }
.calendar-agenda { display: none; }
.calendar-agenda[hidden] { display: none; }

/* ===== Feed (Cards) ===== */
.feed-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}
.feed-card {
  background: var(--bg-surface); border-radius: var(--radius-lg);
  border: 1px solid var(--border); padding: 0;
  transition: border-color var(--ease), box-shadow var(--ease), transform 0.15s;
  position: relative; overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}
.feed-card:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
/* Feed card status accent - left border instead of top */
.feed-card.row-시작전, .feed-card.row-예정 { border-left: 4px solid var(--status-before); }
.feed-card.row-일정확정 { border-left: 4px solid var(--status-progress); }
.feed-card.row-완료 { border-left: 4px solid var(--status-complete); }
.feed-card.row-취소, .feed-card.row-취소\/연기 { border-left: 4px solid var(--status-cancel); opacity: 0.6; }
.feed-card-body { padding: 16px; }
.feed-card-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
}
.feed-card-date { font-size: 14px; color: var(--text-secondary); font-weight: 500; }
.feed-card-title {
  font-size: 17px; font-weight: 700; color: var(--text-bright);
  margin-bottom: 12px; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.feed-card-title-button {
  appearance: none; display: flex; align-items: center; width: 100%; min-height: 44px;
  padding: 0; border: 0; background: transparent;
  text-align: left; font-family: inherit; cursor: pointer;
}
.feed-card-title-button:hover { color: var(--accent); }
.feed-card-title-button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
.feed-card-poster-button {
  appearance: none; display: block; width: 100%; padding: 0; border: 0;
  background: transparent; cursor: pointer;
}
.feed-card-poster-button:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }
.feed-card-meta {
  display: flex; flex-wrap: wrap; gap: 6px;
  font-size: 14px; color: var(--text-secondary);
}
.feed-card-meta-item { display: flex; align-items: center; gap: 4px; }
.feed-card-meta-item svg { width: 14px; height: 14px; opacity: 0.5; }
.feed-card-ads { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 12px; }
.feed-card-ad { display: flex; align-items: center; gap: 6px; color: var(--text-secondary); font-size: 14px; }
.feed-card-ad .inline-cell { min-height: 0; padding: 0; }
.feed-card-ad .ad-badge { padding: 2px 7px; font-size: 14px; }
.feed-card-personnel {
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border);
  display: flex; flex-wrap: wrap; gap: 4px;
}
.feed-card-poster {
  width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block;
}
.feed-card-poster-button {
  display: block; width: 100%; padding: 0; border: 0; background: none;
  color: inherit; cursor: pointer;
}
.feed-card-detail {
  width: 100%; min-height: 44px; margin-top: 14px; padding: 9px 12px;
  border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--bg-elevated); color: var(--text-bright);
  font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
.feed-card-detail:hover { border-color: var(--accent); color: var(--accent); }

/* ===== Modal ===== */
.modal-overlay {
  position: fixed; inset: 0; background: var(--bg-overlay);
  backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000; opacity: 0; visibility: hidden;
  pointer-events: none;
  transition: all 200ms ease;
  padding: 20px;
}
.modal-overlay.active { opacity: 1; visibility: visible; pointer-events: auto; }
.modal {
  background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); width: 90%; max-width: 640px;
  max-height: 85vh; overflow-y: auto; box-shadow: var(--shadow-lg);
  transform: translateY(12px); transition: transform 250ms ease;
  overscroll-behavior: contain;
}
.modal-overlay.active .modal { transform: translateY(0); }
.modal--wide { width: min(1180px, calc(100vw - 40px)); max-width: 1180px; }
.modal--image { overflow-x: hidden; overflow-y: auto; background: var(--bg-surface); }
.subtitle-editor-modal { z-index: 1200; background: var(--bg-overlay); backdrop-filter: none; }
.modal--subtitle-editor {
  display: grid;
  width: min(1680px, calc(100vw - 32px));
  max-width: 1680px;
  height: min(94dvh, 1080px);
  max-height: 94dvh;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  background: var(--bg-surface);
}
.subtitle-editor-modal__body {
  position: relative;
  min-height: 0;
  background: var(--bg-surface);
}
.subtitle-editor-modal__state {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 24px;
  color: var(--text-primary);
  background: var(--bg-surface);
}
.subtitle-editor-modal__state[hidden] { display: none; }
.subtitle-editor-modal__state .btn { min-width: 120px; min-height: 44px; }
.subtitle-editor-modal__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--bg-surface);
}
.subtitle-editor-modal__frame[hidden] { display: none; }
.modal--image__header {
  display: flex; justify-content: flex-end; padding: 8px;
  background: var(--bg-surface); border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 4;
}
.modal--image__header .modal-close { background: var(--bg-elevated); }
.modal--image .poster-preview-viewport { background: var(--bg-elevated); }
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 4; background: var(--bg-surface);
}
.modal-title { font-size: 16px; font-weight: 700; color: var(--text-bright); }
.modal-close {
  width: 44px; height: 44px; border-radius: 8px; border: none;
  background: transparent; color: var(--text-secondary); cursor: pointer;
  font-size: 16px; display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
}
.modal-close:hover { background: var(--bg-hover); color: var(--text-primary); }
.modal-close:focus-visible,
.modal-delete:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.modal-delete {
  display: inline-flex; width: 44px; height: 44px; padding: 0;
  align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 8px;
  background: transparent; color: var(--text-muted); cursor: pointer;
}
.modal-delete svg { width: 17px; height: 17px; }
.modal-delete:hover, .modal-delete:focus-visible {
  border-color: var(--status-cancel); background: var(--status-cancel-bg); color: var(--status-cancel);
}
.modal-body { padding: 18px; }

.detail-section-nav {
  position: sticky; top: 57px; z-index: 3;
  display: flex; gap: 6px; margin: -18px -18px 14px; padding: 10px 18px;
  overflow-x: auto; border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-surface) 94%, transparent);
  backdrop-filter: blur(14px); scrollbar-width: none;
}
.detail-section-nav::-webkit-scrollbar { display: none; }
.detail-section-nav button {
  flex: 0 0 auto; min-height: 44px; padding: 6px 11px;
  border: 1px solid var(--border); border-radius: 999px;
  background: var(--bg-elevated); color: var(--text-secondary);
  font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}
.detail-section-nav button:hover { border-color: var(--border-strong); color: var(--text-primary); }
.detail-section-nav button.active { border-color: var(--accent); background: var(--accent-muted); color: var(--accent); }
.detail-section-target { scroll-margin-top: 116px; }
.detail-fold { margin: 10px 0; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-secondary); }
.detail-fold > summary { padding: 12px 14px; cursor: pointer; color: var(--text-primary); font-weight: 600; }
.detail-fold > summary:hover { background: var(--bg-hover); border-radius: 10px; }
.detail-fold > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.detail-fold-body { padding: 0 14px 14px; }
.detail-fold-body > .section-divider:first-child { display: none; }
.detail-fold-body .prop-grid { margin-top: 8px; }

.new-event-form { max-width: 520px; margin: 0 auto; padding: 12px 4px 4px; }
.new-event-form__intro { margin-bottom: 22px; }
.new-event-form__intro strong { display: block; color: var(--text-bright); font-size: 18px; }
.new-event-form__intro p { margin: 7px 0 0; color: var(--text-secondary); font-size: 14px; line-height: 1.55; }
.new-event-form__field { display: grid; gap: 8px; color: var(--text-primary); font-size: 14px; font-weight: 600; }
.new-event-form__field input {
  width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--bg-input); color: var(--text-primary);
  font: inherit; font-weight: 400;
}
.new-event-form__field input:focus { outline: 2px solid var(--accent); outline-offset: 2px; border-color: var(--accent); }
.new-event-form__actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 24px; }
.new-event-form__actions .btn { min-height: 44px; }

/* ===== Property Grid ===== */
.prop-grid { display: grid; grid-template-columns: 90px 1fr; gap: 0; }
.prop-grid .prop-label {
  padding: 8px 10px; color: var(--text-muted); font-size: 14px;
  border-bottom: 1px solid var(--border); display: flex; align-items: center;
}
.prop-grid .prop-value {
  padding: 8px 10px; font-size: 14px;
  border-bottom: 1px solid var(--border);
  min-height: 36px; display: flex; align-items: center;
}
.prop-grid .prop-value .inline-cell { flex: 1; }

/* ===== Poster ===== */
.detail-poster-button,
.table-image-button,
.subtitle-thumb__preview {
  margin: 0; padding: 0; border: 0; background: transparent; color: inherit;
  font: inherit; cursor: pointer;
}
.detail-poster-button { display: inline-block; max-width: 100%; }
.table-image-button {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px; line-height: 0;
}
.subtitle-thumb__preview { display: block; width: 100%; min-height: 44px; }
.detail-poster-button:focus-visible,
.table-image-button:focus-visible,
.subtitle-thumb__preview:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 2px;
}
.subtitle-thumb__preview:disabled { cursor: default; }
.detail-poster {
  max-width: 100%; max-height: 300px; border-radius: var(--radius);
  display: block; cursor: pointer; transition: transform var(--ease);
}
.detail-poster:hover { transform: scale(1.01); }
.detail-poster-button,
.table-image-button {
  appearance: none; padding: 0; border: 0; border-radius: 6px;
  background: transparent; cursor: pointer;
}
.detail-poster-button:focus-visible,
.table-image-button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.poster-preview-toolbar {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 0 20px 10px;
}
.poster-preview-toolbar .btn {
  min-width: 44px; background: rgba(15, 23, 42, 0.86);
  border-color: rgba(255, 255, 255, 0.24); color: #fff;
}
#poster-zoom-value {
  min-width: 68px; color: #fff; font-size: 14px; font-weight: 700; text-align: center;
}
.poster-preview-viewport {
  max-height: 72vh; overflow: auto; padding: 0 20px 20px;
  text-align: center; overscroll-behavior: contain;
}
#poster-preview-img {
  display: block; height: auto; margin: 0 auto; border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
}
.poster-preview-error {
  display: flex; min-height: 260px; align-items: center; justify-content: center;
  flex-direction: column; gap: 10px; padding: 24px; border: 1px solid rgba(255,255,255,.24);
  border-radius: 12px; background: rgba(15,23,42,.92); color: #d7dbea; text-align: center;
}
.poster-preview-error[hidden] { display: none; }
.poster-preview-error strong { color: #fff; font-size: 16px; }
.poster-preview-error span { font-size: 14px; line-height: 1.5; }
.poster-preview-error .btn { min-height: 44px; margin-top: 4px; font-size: 14px; }
.subtitle-operation-actions { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.subtitle-operation-actions .btn { min-height:44px; font-size:14px; }
.subtitle-manual-create { display:flex; gap:7px; min-width:0; }
.subtitle-manual-create select { flex:1; min-width:0; min-height:44px; padding:0 10px; font:inherit; font-size:14px; color:var(--text-primary); background:var(--bg-primary); border:1px solid var(--border-color); border-radius:6px; }
.subtitle-operation-actions .subtitle-manual-create .btn { flex:0 0 auto; width:auto; }
.broadcast-operation-section { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.broadcast-operation-section h4 { margin:0 0 5px; }
.broadcast-operation-section p { margin:0; color:var(--text-secondary); font-size:14px; line-height:1.5; }
.event-activity-section { padding-bottom:4px; }
.event-activity-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.event-activity-header h4 { margin:0; font-size:16px; color:var(--text-bright); }
.event-activity-list { display:grid; gap:9px; }
.event-activity-card, .event-version-card { padding:12px 14px; border:1px solid var(--border); border-radius:10px; background:var(--bg-elevated); }
.event-activity-card:focus-visible, .event-version-card:focus-visible, .event-activity-empty:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.event-activity-card__top { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:8px; }
.event-activity-card__top strong, .event-version-card__top strong { color:var(--text-bright); font-size:14px; }
.event-activity-card__top time, .event-version-card__top time { margin-left:auto; color:var(--text-muted); font-size:14px; }
.event-activity-category, .event-version-current { padding:3px 7px; border-radius:999px; background:var(--accent-muted); color:var(--accent); font-size:14px; font-weight:700; }
.event-activity-actor { margin-top:8px; color:var(--text-secondary); font-size:14px; }
.event-activity-target { margin-top:5px; color:var(--text-primary); font-size:14px; font-weight:600; }
.event-activity-card ul { display:grid; gap:4px; margin:8px 0 0; padding-left:18px; color:var(--text-secondary); font-size:14px; line-height:1.5; }
.event-activity-empty, .event-activity-detail-empty { margin:0; color:var(--text-muted); font-size:14px; }
.event-activity-empty { padding:18px; border:1px dashed var(--border); border-radius:10px; text-align:center; }
.event-activity-error { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border:1px solid var(--status-cancel); border-radius:10px; color:var(--status-cancel); font-size:14px; }
.event-activity-error .btn { min-height:44px; font-size:14px; }
.event-version-block + .event-version-block { margin-top:20px; }
.event-version-block h5 { margin:0 0 10px; color:var(--text-secondary); font-size:14px; }
.event-version-list { display:grid; gap:9px; }
.event-version-card__top { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.event-version-card p { margin:8px 0 0; color:var(--text-secondary); font-size:14px; }
.event-version-card .btn { min-height:44px; margin-top:10px; font-size:14px; }
.poster-thumb {
  width: 40px; height: 40px; border-radius: 4px; object-fit: cover;
  cursor: pointer; border: 1px solid var(--border); transition: all var(--ease);
}
.poster-thumb:hover { transform: scale(1.1); border-color: var(--accent); }
.thumbnail-table-thumb {
  display: block; width: 112px; height: 63px; border-radius: 5px; object-fit: cover;
  cursor: pointer; border: 1px solid var(--border); transition: transform var(--ease), border-color var(--ease);
}
.thumbnail-table-thumb:hover { transform: scale(1.06); border-color: var(--accent); }
.thumbnail-table-empty { color: var(--text-muted); }
.poster-upload-btn {
  width: 44px; height: 44px; border-radius: 4px;
  border: 1px dashed var(--border-strong); background: transparent;
  color: var(--text-muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: 14px;
}
.poster-upload-btn:hover { border-color: var(--accent); color: var(--accent); }
.poster-upload-btn.is-pending { width: auto; min-width: 76px; padding: 0 8px; }
[data-poster-upload-event]:disabled { cursor: wait; opacity: 0.6; }

/* ===== Thumbnail Preview ===== */
.subtitle-preview-section { margin-top: 14px; }
.subtitle-preview-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; gap: 8px;
}
.subtitle-preview-header h4 {
  font-size: 14px; font-weight: 600; color: var(--text-bright); margin: 0;
}
.subtitle-preview-header p {
  margin: 2px 0 0; color: var(--text-muted); font-size: 14px; line-height: 1.4;
}
.subtitle-thumb-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
}
.subtitle-thumb {
  display: flex; flex-direction: column; align-items: center;
  background: var(--bg-hover); border: 1px solid var(--border);
  border-radius: 6px; padding: 8px; cursor: default;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.subtitle-thumb--large { grid-column: span 2; }
.subtitle-thumb:hover {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
}
.subtitle-thumb img {
  width: 100%; height: auto; border-radius: 3px;
  background: repeating-conic-gradient(#e8e8e8 0% 25%, #f5f5f5 0% 50%) 50% / 8px 8px;
}
.broadcast-image-error {
  width: 100%; min-height: 96px; padding: 14px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  border: 1px dashed var(--border-strong); border-radius: 6px;
  background: var(--bg-panel); color: var(--text-secondary); text-align: center;
}
.broadcast-image-error[hidden] { display: none; }
.broadcast-image-error strong { color: var(--text-bright); font-size: 14px; }
.broadcast-image-error span { font-size: 14px; }
.broadcast-image-error .btn { min-height: 44px; font-size: 14px; }
.subtitle-thumb.has-image-error { cursor: default; }
.subtitle-thumb-name {
  margin-top: 5px; font-size: 14px; color: var(--text-muted);
  text-align: center; word-break: break-all; line-height: 1.3;
}
.subtitle-thumb__actions {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 8px;
}
.subtitle-thumb__actions .btn { min-height: 44px; font-size: 14px; }
.subtitle-loading {
  text-align: center; padding: 12px; color: var(--text-muted); font-size: 14px;
}
.subtitle-load-error p { margin: 0 0 10px; }
.thumbnail-2026-progress {
  margin: 0 0 10px; padding: 10px 12px; border-radius: 6px;
  background: var(--accent-muted); color: var(--text-bright); font-size: 12px;
}
.thumbnail-2026-summary { margin-bottom: 14px; }
.thumbnail-2026-summary-heading {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 10px; margin-bottom: 8px;
}
.thumbnail-2026-summary-heading strong { color: var(--text-bright); font-size: 13px; }
.thumbnail-2026-summary-heading span { color: var(--text-muted); font-size: 11px; }
.thumbnail-2026-selection-summary {
  margin: 0 0 10px; padding: 9px 10px; border-radius: 6px;
  background: var(--bg-hover); color: var(--text-muted); font-size: 11px; line-height: 1.45;
}
.thumbnail-2026-selection-compare {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px;
}
.thumbnail-2026-selection-compare button {
  min-width: 0; padding: 6px; border: 1px solid var(--border); border-radius: 7px;
  background: var(--bg-hover); color: var(--text-muted); cursor: pointer; text-align: left;
}
.thumbnail-2026-selection-compare button:disabled { cursor: default; opacity: .58; }
.thumbnail-2026-selection-compare button > span {
  display: flex; align-items: baseline; justify-content: space-between; gap: 6px; margin-bottom: 5px;
}
.thumbnail-2026-selection-compare strong { color: var(--text-bright); font-size: 11px; }
.thumbnail-2026-selection-compare small { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.thumbnail-2026-selection-compare img,
.thumbnail-2026-selection-compare em {
  display: grid; place-items: center; width: 100%; aspect-ratio: 16/9; border-radius: 4px;
  background: var(--bg-panel); object-fit: cover; color: var(--text-muted); font-size: 10px; font-style: normal;
}
.thumbnail-2026-candidate-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
}
.thumbnail-2026-candidate {
  position: relative; padding: 6px; border: 1px solid var(--border); border-radius: 7px;
  background: var(--bg-hover); color: var(--text-muted); cursor: pointer; text-align: left;
}
.thumbnail-2026-candidate:hover,
.thumbnail-2026-candidate:focus-visible { border-color: var(--accent); outline: none; }
.thumbnail-2026-candidate.is-recommended { border-color: var(--accent); }
.thumbnail-2026-candidate.is-human-selected { box-shadow: 0 0 0 2px rgba(255,255,255,.72); }
.thumbnail-2026-candidate.is-active { border-color: #19b77d; }
.thumbnail-2026-candidate img { display: block; width: 100%; border-radius: 4px; }
.thumbnail-2026-candidate > span:last-child { display: block; margin-top: 5px; font-size: 11px; }
.thumbnail-2026-badges {
  position: absolute; top: 12px; left: 12px; right: 12px; z-index: 1;
  display: flex; flex-wrap: wrap; gap: 4px;
}
.thumbnail-2026-badges > span {
  display: inline-flex; padding: 3px 6px; border-radius: 4px;
  color: #fff; font-size: 10px; font-weight: 700;
}
.thumbnail-2026-recommended { background: var(--accent); }
.thumbnail-2026-human { background: #fff; color: #17202b !important; }
.thumbnail-2026-active { margin-left: auto; background: #14865f; }
.selected-assets-download {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-bottom: 16px;
}
.selected-assets-download .btn {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.selected-assets-download--compact { position: relative; gap: 8px; }
.broadcast-download-menu { position: relative; }
.broadcast-download-menu > summary { list-style: none; gap: 8px; cursor: pointer; }
.broadcast-download-menu > summary::-webkit-details-marker { display: none; }
.broadcast-download-menu[open] > summary { background: var(--bg-hover); }
.broadcast-download-menu[open] .broadcast-download-menu__chevron { transform: rotate(180deg); }
.broadcast-download-menu__panel {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 20;
  width: 280px; max-width: calc(100vw - 32px); padding: 6px;
  box-sizing: border-box; border: 1px solid var(--border); border-radius: 10px;
  background: var(--bg-surface); box-shadow: 0 8px 24px #0003;
}
.broadcast-download-menu__item {
  display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
  width: 100%; min-height: 56px; padding: 10px 12px;
  border: 0; border-radius: 6px; background: transparent;
  color: var(--text-primary); font: inherit; text-align: left; cursor: pointer;
}
.broadcast-download-menu__item:hover,
.broadcast-download-menu__item:focus-visible { background: var(--bg-hover); }
.broadcast-download-menu__item > span { font-size: 14px; font-weight: 600; }
.broadcast-download-menu__item > small { color: var(--text-secondary); font-size: 12px; }
.broadcast-download-menu__item:disabled { opacity: .6; cursor: wait; }
.broadcast-download-menu__divider { margin: 5px 6px; border-top: 1px solid var(--border); }
.broadcast-download-menu__settings svg { width: 18px; height: 18px; flex: 0 0 18px; }
.broadcast-download-menu__settings { flex-direction: row; align-items: center; gap: 8px; min-height: 44px; }
.thumbnail-current-card {
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-hover);
}
.thumbnail-current-card__header,
.subtitle-assets__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.thumbnail-current-card__header { flex-wrap: wrap; margin-bottom: 12px; }
.thumbnail-current-card__eyebrow {
  color: var(--accent);
  font-size: 14px;
  font-weight: 800;
}
.thumbnail-current-card h5,
.subtitle-assets h5 {
  margin: 3px 0 0;
  color: var(--text-bright);
  font-size: 14px;
}
.thumbnail-current-card__progress {
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--accent-muted);
  color: var(--accent);
  font-size: 14px;
  font-weight: 800;
}
.thumbnail-current-card__youtube {
  margin-left: auto;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--bg-elevated);
  color: var(--text-muted);
  font-size: 14px;
  font-weight: 800;
}
.thumbnail-current-card__youtube.is-applied { background: #daf5e8; color: #18764b; }
.thumbnail-current-card__pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.thumbnail-current-card__preview {
  display: block; width: 100%; padding: 0; color: inherit; text-align: left;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-panel);
  cursor: pointer;
  font: inherit;
}
.thumbnail-current-card__preview:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.thumbnail-current-card__pair img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; }
.thumbnail-current-card__preview .broadcast-image-error { min-height: 120px; border: 0; border-radius: 0; }
.thumbnail-current-card__preview.has-image-error { cursor: pointer; }
.thumbnail-current-card__caption {
  display: block;
  padding: 7px 9px;
  color: var(--text-muted);
  font-size: 14px;
  font-weight: 700;
}
.thumbnail-current-card__downloads {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;
}
.thumbnail-current-card__downloads .btn { min-height: 44px; flex: 1 1 150px; font-size: 14px; }
.thumbnail-current-card__empty { margin: 0; color: var(--text-muted); font-size: 14px; }
.thumbnail-current-card__empty:focus-visible, .subtitle-loading[data-thumbnail-preview-result]:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.thumbnail-current-card__open { width: 100%; min-height: 44px; margin-top: 12px; font-size: 14px; }
.subtitle-assets { padding-top: 14px; border-top: 1px solid var(--border); }
.subtitle-assets__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.subtitle-assets__header h5 { margin: 0; }
.subtitle-assets__header span { color: var(--text-muted); font-size: 14px; }
.subtitle-assets-group + .subtitle-assets-group { margin-top: 16px; }
.subtitle-assets-group__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.subtitle-assets-group__header h6 { margin: 0; font-size: 14px; }
.subtitle-assets-group__header span { color: var(--text-muted); font-size: 14px; }
@media (max-width: 620px) {
  .selected-assets-download--compact .broadcast-download-menu { position: static; }
  .broadcast-download-menu__panel { left: 0; right: auto; }
  .selected-assets-download .btn { width: auto; }
  .thumbnail-current-card__pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .thumbnail-current-card__caption { padding: 6px; font-size: 14px; }
}
.btn-subtitle-gen { background: var(--accent-muted); border-color: var(--accent); color: var(--accent); }
.btn-subtitle-gen:hover { background: var(--accent); color: #fff; }
.btn-subtitle-gen:disabled { opacity: 0.5; cursor: wait; }
.subtitle-regen-panel { padding: 8px 20px 16px; }
.subtitle-regen-input-row {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.subtitle-regen-input {
  flex: 1 1 260px; min-width: 0;
  padding: 8px 12px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.2); background: rgba(0,0,0,0.5);
  color: #fff; font-size: 14px; outline: none;
}
.subtitle-regen-input::placeholder { color: rgba(255,255,255,0.4); }
.subtitle-regen-input:focus { border-color: var(--accent); }
.subtitle-regen-btn {
  white-space: nowrap; padding: 8px 14px; border-radius: 6px;
  background: var(--accent); color: #fff; border: none; cursor: pointer;
  font-size: 14px; font-weight: 600;
}
.subtitle-regen-btn:hover { opacity: 0.9; }
.subtitle-regen-btn:disabled { opacity: 0.5; cursor: wait; }
.subtitle-illust-btn {
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.22);
}

/* ===== Add Row ===== */
.btn-add-row {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; min-height: 44px; padding: 8px; margin-top: 0;
  border: 1px solid var(--border); border-top: none;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  background: var(--bg-surface); color: var(--text-muted);
  font-size: 14px; font-family: inherit; cursor: pointer;
}
.btn-add-row:hover { color: var(--accent); background: var(--bg-hover); }

/* ===== Toast ===== */
.toast-container {
  position: fixed; bottom: 20px; right: 20px; z-index: 2000;
  display: flex; flex-direction: column; gap: 6px;
  pointer-events: none;
}
.toast {
  padding: 10px 16px; border-radius: 6px;
  background: var(--bg-elevated); border: 1px solid var(--border);
  color: var(--text-primary); font-size: 14px; box-shadow: var(--shadow-md);
  animation: toastIn 200ms ease forwards; min-width: 240px;
}
.toast.success { border-color: var(--status-complete); }
.toast.error { border-color: var(--status-cancel); }
@keyframes toastIn { from { opacity:0; transform: translateX(20px); } to { opacity:1; transform: translateX(0); } }
@keyframes toastOut { from { opacity:1; } to { opacity:0; transform: translateX(20px); } }

/* ===== Participant Table ===== */
.section-divider { height: 1px; background: var(--border); margin: 16px 0; }
.source-schedule-section h4 {
  margin-bottom: 10px; font-size: 15px; font-weight: 600; color: var(--text-bright);
}
.participant-section { padding: 4px 0; }
.participant-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px; flex-wrap: wrap; gap: 6px;
}
.participant-header h3 { font-size: 15px; font-weight: 600; color: var(--text-bright); }
.participant-header h3 small { font-size: 14px; font-weight: 400; color: var(--text-muted); }
.participant-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.participant-table th {
  padding: 8px 10px; text-align: left; font-weight: 600;
  color: var(--text-muted); font-size: 14px;
  letter-spacing: 0.03em; border-bottom: 1px solid var(--border);
}
.participant-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); }
.participant-table tr:hover { background: var(--bg-hover); }
.participant-name { font-weight: 600; color: var(--text-bright); }
/* 참여 상태(참여 미확인 등)도 명단 본문과 같은 14px 최소 글자 크기를 지킨다. */
.participant-row td small { font-size: 14px; }
.role-badge {
  display: inline-flex; padding: 3px 8px; border-radius: 4px;
  font-size: 14px; font-weight: 600; white-space: nowrap;
}
.role-badge.role-개회안내 { background: rgba(79,110,247,0.12); color: #6fa3f5; }
.role-badge.role-축사 { background: rgba(229,162,10,0.12); color: #d4a020; }
.role-badge.role-좌장 { background: rgba(139,92,246,0.12); color: #a480ff; }
.role-badge.role-주제발표 { background: rgba(229,64,64,0.12); color: #f06060; }
.role-badge.role-토론자 { background: rgba(15,173,115,0.12); color: #30c080; }
.ocr-status { font-size: 14px; padding: 3px 8px; border-radius: 4px; }
.ocr-status.ocr-done { background: var(--status-complete-bg); color: var(--status-complete); }
.ocr-status.ocr-pending { background: var(--status-before-bg); color: var(--status-before); }
.ocr-status.ocr-failed { background: var(--status-cancel-bg); color: var(--status-cancel); }
.btn-ocr { background: var(--accent-muted); border-color: var(--accent); color: var(--accent); }
.btn-ocr:hover { background: var(--accent); color: #fff; }
.btn-ocr:disabled { opacity: 0.5; cursor: wait; }
.btn-remove-participant {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0;
  background: transparent; border: 1px solid transparent; color: var(--text-muted);
  cursor: pointer; font-size: 14px; border-radius: 6px;
}
.btn-remove-participant:hover,
.btn-remove-participant:focus-visible {
  color: var(--status-cancel); background: var(--status-cancel-bg); border-color: var(--status-cancel);
}
.btn-remove-participant:disabled { cursor: wait; opacity: 0.5; }
.btn-remove-participant.is-pending { width: auto; min-width: 58px; padding: 0 8px; }

/* ===== Color Picker ===== */
.color-picker-wrap { position: relative; display: inline-flex; flex-shrink: 0; }
.color-picker-trigger {
  width: 44px; height: 44px; border-radius: 6px;
  border: 2px dashed var(--border-strong); cursor: pointer;
  transition: all var(--ease); display: flex; align-items: center;
  justify-content: center; font-size: 10px; background: var(--bg-surface);
  color: var(--text-muted);
}
.color-picker-trigger:hover { border-color: var(--accent); background: var(--accent-muted); color: var(--accent); }
.color-picker-trigger.has-color { border: 2px solid rgba(255,255,255,0.15); }
.color-picker-dropdown {
  position: absolute; top: 100%; left: 0;
  margin-top: 4px; background: var(--bg-elevated); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px; display: none;
  grid-template-columns: repeat(3, 1fr); gap: 4px; z-index: 50;
  box-shadow: var(--shadow-lg); min-width: 100px;
}
.color-picker-dropdown.open { display: grid; }
.color-picker-option {
  width: 44px; height: 44px; border-radius: 50%;
  border: 2px solid transparent; cursor: pointer; transition: all var(--ease); padding: 0;
}
.color-picker-option:hover { transform: scale(1.2); }
.color-picker-option:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 2px; }
.color-picker-option.active { border-color: var(--text-bright); box-shadow: 0 0 0 1px var(--bg-elevated); }
.color-picker-option.color-none {
  background: var(--bg-hover); display: flex;
  align-items: center; justify-content: center;
  font-size: 10px; color: var(--text-muted);
}
.color-picker-option.color-red { background: #e54040; }
.color-picker-option.color-orange { background: #e87a20; }
.color-picker-option.color-yellow { background: #c9a000; }
.color-picker-option.color-green { background: #1aab55; }
.color-picker-option.color-blue { background: #2e7cf6; }
.color-picker-option.color-purple { background: #8b5cf6; }
.color-picker-option.color-pink { background: #d946a8; }
.color-picker-option.color-gray { background: #6b7280; }

/* ===== Autocomplete ===== */
.autocomplete-wrap { position: relative; width: 100%; }
.autocomplete-wrap input {
  width: 100%; background: transparent; border: none;
  color: var(--text-primary); font-family: inherit; font-size: inherit;
  outline: none; padding: 0; line-height: 1.5;
}
.autocomplete-dropdown {
  position: absolute; top: 100%; left: -4px; right: -4px;
  margin-top: 3px; background: var(--bg-elevated);
  border: 1px solid var(--border); border-radius: 6px;
  max-height: 160px; overflow-y: auto; z-index: 60;
  box-shadow: var(--shadow-lg); display: none;
}
.autocomplete-dropdown.open { display: block; }
.autocomplete-item {
  display: flex; align-items: center; min-height: 44px;
  padding: 6px 10px; cursor: pointer; font-size: 14px;
  color: var(--text-primary); transition: background var(--ease);
}
.autocomplete-item:hover, .autocomplete-item.highlighted { background: var(--bg-hover); }
.autocomplete-item.selected { color: var(--accent); font-weight: 600; }
.autocomplete-item.new-item {
  color: var(--accent); font-weight: 500; border-top: 1px solid var(--border);
}
.autocomplete-item .match-highlight { font-weight: 700; color: var(--accent); }

/* ===== Personnel Tag Input ===== */
.personnel-input-wrap {
  display: flex; flex-wrap: wrap; gap: 3px; align-items: center; min-height: 44px;
}
.personnel-input-wrap .personnel-tag {
  min-height: 44px; padding: 0 0 0 10px;
}
.personnel-input-wrap .personnel-tag .tag-remove {
  min-width: 44px; min-height: 44px; margin:0; padding:0;
  border:0; border-radius:4px; background:transparent; color:inherit;
  cursor:pointer; opacity:0.55; font:inherit; font-size:14px;
}
.personnel-input-wrap .personnel-tag .tag-remove:hover { opacity: 1; color: var(--status-cancel); }
.personnel-input-wrap .personnel-tag .tag-remove:focus-visible { outline:2px solid var(--accent); outline-offset:1px; opacity:1; }
.personnel-input-wrap input {
  flex: 1; min-width: 70px; border: none; background: transparent;
  color: var(--text-primary); font-family: inherit; font-size: inherit;
  outline: none; padding: 1px 3px; min-height: 44px;
}
.personnel-save-button {
  min-height:44px; padding:7px 12px; border:1px solid var(--accent);
  border-radius:6px; background:var(--accent); color:white; font:inherit;
  font-weight:600; cursor:pointer;
}
.personnel-save-button:disabled { cursor:wait; opacity:0.65; }
.personnel-save-button:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.personnel-save-status { flex-basis:100%; color:var(--status-cancel-text); font-size:14px; line-height:1.45; }
.personnel-save-status:empty { display:none; }

/* ===== Misc ===== */
.empty-state { text-align: center; padding: 50px 16px; color: var(--text-muted); font-size: 14px; }
.empty-state strong { display: block; color: var(--text-primary); font-size: 15px; }
.empty-state p { margin: 6px 0 0; line-height: 1.55; }
.calendar-undated .empty-state { width: 100%; padding: 16px; }
.calendar-empty-state { width: 100%; padding: 8px; color: var(--text-muted); text-align: center; }
.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;
}
.events-load-error { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 16px; padding:14px 16px; border:1px solid var(--status-cancel); border-radius:var(--radius); background:var(--status-cancel-bg); color:var(--text-primary); }
.events-load-error[hidden] { display:none; }
.events-load-error p { margin:0; line-height:1.5; }
.events-load-retry { flex-shrink:0; min-height:44px; padding:8px 14px; border:1px solid var(--border-strong); border-radius:8px; background:var(--bg-elevated); color:var(--text-primary); font:inherit; font-weight:600; cursor:pointer; }
.events-load-retry:hover { border-color:var(--accent); color:var(--accent); }
.events-load-retry:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
@media (max-width:640px) { .events-load-error { align-items:stretch; flex-direction:column; } .events-load-retry { align-self:flex-start; } }
.detail-load-state { min-height:280px; padding:48px 20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--text-muted); text-align:center; }
.detail-load-state strong { color:var(--text-primary); font-size:16px; }
.detail-load-state p { margin:0; line-height:1.55; }
.detail-load-state .events-load-retry { margin-top:8px; }
.detail-load-indicator { width:28px; height:28px; border:3px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:detail-load-spin 0.8s linear infinite; }
.detail-load-state--error { color:var(--text-secondary); }
@keyframes detail-load-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .detail-load-indicator { animation:none; border-top-color:var(--border); background:var(--accent); opacity:0.35; } }
.view-section { display: none; }
.view-section.active { display: block; }
.hidden-input { display: none; }
.form-input, .form-select, .form-textarea {
  width: 100%; padding: 10px 12px; border-radius: 6px;
  border: 1px solid var(--border); background: var(--bg-input);
  color: var(--text-primary); font-size: 14px; font-family: inherit;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  outline: none; border-color: var(--accent);
}
.form-textarea { resize: vertical; min-height: 60px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* ===== Popover Selector (Notion-style) ===== */
.popover-selector {
  position: fixed; z-index: 1100;
  background: var(--bg-elevated); border: 1px solid var(--border-strong);
  border-radius: var(--radius); box-shadow: var(--shadow-lg);
  min-width: 240px; max-width: 300px; max-height: 520px;
  display: flex; flex-direction: column;
  animation: popoverIn 120ms ease;
}
.popover-selector--location { width: min(440px, calc(100vw - 20px)); max-width: 440px; }
.popover-selector--location .popover-option-label { min-width: 0; }
.popover-selector--location .option-badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
@keyframes popoverIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.popover-search {
  padding: 6px 8px; border-bottom: 1px solid var(--border);
}
.popover-search input {
  width: 100%; min-height: 44px; padding: 6px 8px; border-radius: 4px;
  border: 1px solid var(--border); background: var(--bg-input);
  color: var(--text-primary); font-size: 14px; font-family: inherit;
  outline: none;
}
.popover-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.popover-selected-tags {
  display: flex; flex-wrap: wrap; gap: 4px; padding: 5px 8px;
  border-bottom: 1px solid var(--border);
}
.popover-selected-tags:empty { display: none; }
.sel-tag {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 1px 5px; border-radius: 3px; user-select: none;
  font-size: 14px;
}
.sel-tag-x {
  appearance: none; border: 0; background: transparent;
  cursor: pointer; font-size: 14px; color: var(--text-muted);
  min-width: 44px; min-height: 44px; margin-left: 1px; padding: 0 2px; border-radius: 2px;
}
.sel-tag-x:hover { color: var(--status-cancel); background: rgba(0,0,0,0.06); }
.popover-section-label {
  padding: 6px 10px 3px; font-size: 14px; color: var(--text-muted);
  font-weight: 500; user-select: none;
}
.drag-handle {
  cursor: grab; color: var(--text-muted); font-size: 10px;
  user-select: none; padding: 2px 4px; letter-spacing: -1px;
  flex-shrink: 0; opacity: 0.4; transition: opacity 0.15s;
}
.popover-option:hover .drag-handle { opacity: 1; }
.drag-handle:hover { color: var(--text-primary); }
.drag-handle:active { cursor: grabbing; }
.popover-option.dragging {
  opacity: 0.85; background: var(--bg-elevated);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15); z-index: 10;
  position: relative; border-radius: 6px;
}
.drag-placeholder {
  background: rgba(59,130,246,0.06); border-radius: 6px;
  transition: height 0.15s ease;
}
.popover-list {
  overflow-y: auto; flex: 1; max-height: 400px;
  padding: 2px 0;
}
.popover-option {
  appearance: none; border: 0; background: transparent; width: 100%; text-align: left;
  display: flex; align-items: center; gap: 4px;
  padding: 4px 8px; cursor: pointer;
  font-size: 14px; color: var(--text-primary);
  transition: background 0.1s ease;
  min-height: 44px;
}
.popover-option:hover, .popover-option.highlighted {
  background: var(--bg-hover);
}
.popover-option:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.popover-option.selected { font-weight: 500; }
.popover-check {
  width: 14px; text-align: center; font-size: 11px;
  color: var(--accent); flex-shrink: 0;
}
.popover-option.clear-option .popover-check { color: var(--text-muted); }
.popover-option.new-option .popover-check { color: var(--accent); font-weight: 600; }
.venue-selector {
  width: min(720px, calc(100vw - 20px));
  max-width: 720px;
  max-height: min(560px, calc(100vh - 20px));
}
.venue-selector__body {
  display: grid;
  grid-template-columns: minmax(200px, 0.8fr) minmax(360px, 1.5fr);
  min-height: 320px;
  overflow: hidden;
}
.venue-selector__regions {
  overflow-y: auto;
  padding: 6px;
  border-right: 1px solid var(--border);
  background: var(--bg-surface);
}
.venue-selector__region {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-secondary);
  font: inherit;
  font-size: 14px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.venue-selector__region:hover { background: var(--bg-hover); color: var(--text-primary); }
.venue-selector__region.active { background: var(--accent-muted); color: var(--accent); font-weight: 700; }
.venue-selector__places { overflow-y: auto; padding: 6px; }
.venue-selector__place {
  width: 100%;
  min-height: 52px;
  padding: 7px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-primary);
  font: inherit;
  font-size: 14px;
  text-align: left;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  align-items: center;
  cursor: pointer;
}
.venue-selector__place:hover { background: var(--bg-hover); }
.venue-selector__place.selected { background: var(--accent-muted); }
.venue-selector__place-main { grid-column: 1; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-weight: 700; }
.venue-selector__survey { padding: 2px 6px; border-radius: 999px; background: var(--status-complete-bg); color: var(--status-complete-text); font-size: 12px; font-weight: 700; }
.venue-selector__address { grid-column: 1; color: var(--text-secondary); font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.venue-selector__region-hint { grid-column: 1; color: var(--text-muted); font-size: 12px; }
.venue-selector__check { grid-column: 2; grid-row: 1 / span 3; color: var(--accent); font-weight: 800; }
.venue-selector__place--clear { color: var(--text-muted); border-bottom: 1px solid var(--border); border-radius: 0; margin-bottom: 4px; }
.venue-selector__place--new .venue-selector__place-main { color: var(--accent); }
.venue-selector__footer { padding: 8px; border-top: 1px solid var(--border); background: var(--bg-elevated); }
.venue-selector__info {
  min-height: 52px;
  padding: 7px 10px;
  border-radius: 7px;
  color: var(--text-primary);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.venue-selector__info:hover { background: var(--bg-hover); }
.venue-selector__info > span:first-child { min-width: 0; display: grid; gap: 2px; }
.venue-selector__info strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.venue-selector__info small { color: var(--text-muted); font-size: 12px; overflow-wrap: anywhere; }
.venue-selector__info > span:last-child { color: var(--accent); font-size: 13px; font-weight: 700; white-space: nowrap; }
@media (max-width: 560px) {
  .venue-selector {
    left: 8px !important;
    right: 8px;
    top: auto !important;
    bottom: 8px;
    width: auto;
    max-width: none;
    max-height: calc(100dvh - 16px);
  }
  .venue-selector__body { grid-template-columns: 1fr; min-height: 0; flex: 1; }
  .venue-selector__regions { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--border); }
  .venue-selector__region { width: auto; min-width: max-content; }
  .venue-selector__places { min-height: 180px; max-height: none; }
  .venue-selector__info { min-height: 60px; }
}
.popover-empty {
  padding: 16px 10px; text-align: center;
  color: var(--text-muted); font-size: 14px;
}
.popover-empty__action {
  display: flex;
  min-height: 44px;
  margin: 10px auto 0;
  padding: 0 13px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--bg-elevated);
  color: var(--text-primary);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.popover-empty__action:hover { border-color: var(--accent); color: var(--accent); }
.popover-footer {
  padding: 8px 10px; border-top: 1px solid var(--border);
  text-align: right;
}
.popover-color-section {
  padding: 6px 10px; border-top: 1px solid var(--border);
}
.popover-color-label {
  font-size: 14px; color: var(--text-muted); margin-bottom: 6px; font-weight: 500;
}
.popover-color-row {
  display: flex; gap: 5px; flex-wrap: wrap;
}
.popover-color-dot {
  width: 44px; height: 44px; border-radius: 50%;
  border: 2px solid transparent; cursor: pointer;
  transition: all var(--ease); display: flex; align-items: center;
  justify-content: center; font-size: 9px;
}
.popover-color-dot:hover { transform: scale(1.2); }
.popover-color-dot.active { border-color: var(--text-bright); box-shadow: 0 0 0 1px var(--bg-elevated); }
.popover-color-dot.color-none {
  background: var(--bg-hover); color: var(--text-muted);
}
.popover-color-dot.color-red { background: #e54040; }
.popover-color-dot.color-orange { background: #e87a20; }
.popover-color-dot.color-yellow { background: #c9a000; }
.popover-color-dot.color-green { background: #1aab55; }
.popover-color-dot.color-blue { background: #2e7cf6; }
.popover-color-dot.color-purple { background: #8b5cf6; }
.popover-color-dot.color-pink { background: #d946a8; }
.popover-color-dot.color-gray { background: #6b7280; }

/* Option badge with custom color */
.option-badge {
  display: inline-flex; align-items: center;
  padding: 4px 10px; border-radius: 5px;
  font-size: 14px; font-weight: 400; white-space: nowrap;
  background: var(--bg-hover); color: var(--text-bright);
  border: 1px solid var(--border);
}

/* 색을 지정한 배지.
   예전에는 JS가 배경을 항상 흰색 쪽으로 섞은 rgb() 값을 인라인으로 박고
   글자색만 var(--text-bright)를 썼다. 다크 테마에서는 연한 파스텔 배경에
   흰 글자가 얹혀 대비가 1.25:1까지 떨어져 사실상 읽히지 않았다.
   이제 JS는 --badge-accent 원색만 넘기고, 배경은 현재 표면색과 섞어
   두 테마 모두에서 글자가 읽히게 한다. */
.option-badge.is-tinted,
.personnel-tag.is-tinted {
  background: var(--bg-hover);
  border: 1px solid var(--border);
  color: var(--text-bright);
  background: color-mix(in srgb, var(--badge-accent) 18%, var(--bg-surface));
  border-color: color-mix(in srgb, var(--badge-accent) 55%, var(--bg-surface));
}
/* 팝오버에서도 배지 글자를 선택 항목과 같은 크기로 유지한다. */
.popover-option .option-badge,
.popover-option .status-badge {
  padding: 2px 8px; font-size: 14px; border-radius: 4px;
}

/* Popover option layout */
.popover-option-label { flex: 1; }
/* "..." option menu button */
.option-menu-btn {
  appearance: none; border: 0; background: transparent;
  margin-left: auto; flex-shrink: 0; cursor: pointer;
  min-width: 44px; min-height: 44px; padding: 1px 4px; border-radius: 3px; font-size: 14px;
  color: var(--text-muted); letter-spacing: 1px; font-weight: 700;
  opacity: 0; transition: opacity 0.15s, background 0.15s;
  user-select: none;
}
.popover-option:hover .option-menu-btn,
.popover-option:focus-within .option-menu-btn,
.option-menu-btn:focus-visible { opacity: 1; }
.option-menu-btn:hover { background: var(--bg-hover); color: var(--text-primary); }

/* Option submenu (Notion-style) */
.option-submenu {
  position: absolute; z-index: 1300;
  background: var(--bg-elevated); border: 1px solid var(--border-strong);
  border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.18);
  min-width: 220px; padding: 4px 0;
  animation: popoverIn 120ms ease;
}
.submenu-section { padding: 8px 10px; }
.submenu-name-input {
  width: 100%; min-height: 44px; padding: 6px 8px; border-radius: 4px;
  border: 1px solid var(--border); background: var(--bg-input);
  color: var(--text-primary); font-size: 14px; font-family: inherit;
  outline: none;
}
.submenu-name-input:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.submenu-action {
  display: flex; width: 100%; min-height: 44px; align-items: center; gap: 8px;
  padding: 6px 12px; border: 0; background: transparent; cursor: pointer; font: inherit; font-size: 14px; text-align: left;
  color: var(--text-primary); transition: background 0.1s;
}
.submenu-action:hover { background: var(--bg-hover); }
.submenu-delete { color: var(--status-cancel); }
.submenu-delete:hover { background: rgba(220,38,38,0.08); }
.submenu-divider { height: 1px; background: var(--border); margin: 4px 0; }
.submenu-label {
  padding: 6px 12px 2px; font-size: 14px; color: var(--text-muted);
  font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px;
}
.submenu-colors { padding: 2px 0; }
.submenu-color-row {
  display: flex; width: 100%; min-height: 44px; align-items: center; gap: 10px;
  padding: 5px 12px; border: 0; background: transparent; cursor: pointer; font: inherit; font-size: 14px; text-align: left;
  transition: background 0.1s;
}
.submenu-color-row:hover { background: var(--bg-hover); }
.submenu-color-row.active { font-weight: 500; }
.submenu-color-dot {
  width: 18px; height: 18px; border-radius: 4px; flex-shrink: 0;
}
.submenu-color-name { flex: 1; color: var(--text-primary); }
.submenu-color-check { color: var(--accent); font-size: 14px; }

/* Legacy color btn (keep for backward compat) */
.popover-color-btn {
  width: 18px; height: 18px; border-radius: 50%;
  flex-shrink: 0; cursor: pointer; margin-left: auto;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.popover-color-btn:hover { transform: scale(1.2); box-shadow: 0 0 0 2px rgba(0,0,0,0.1); }

/* Mini color palette */
.mini-palette {
  position: absolute;
  background: var(--bg-elevated); border: 1px solid var(--border-strong);
  border-radius: 8px; padding: 6px;
  display: flex; gap: 4px; flex-wrap: wrap; width: 120px;
  box-shadow: var(--shadow-lg); z-index: 1200;
}
.mini-palette-dot {
  width: 20px; height: 20px; border-radius: 50%;
  cursor: pointer; transition: transform var(--ease);
  display: flex; align-items: center; justify-content: center;
  font-size: 9px;
}
.mini-palette-dot:hover { transform: scale(1.25); }
.mini-palette-dot.color-none { background: var(--bg-hover); color: var(--text-muted); border: 1px dashed var(--border-strong); }
.mini-palette-dot.color-red { background: #e54040; }
.mini-palette-dot.color-orange { background: #e87a20; }
.mini-palette-dot.color-yellow { background: #c9a000; }
.mini-palette-dot.color-green { background: #1aab55; }
.mini-palette-dot.color-blue { background: #2e7cf6; }
.mini-palette-dot.color-purple { background: #8b5cf6; }
.mini-palette-dot.color-pink { background: #d946a8; }
.mini-palette-dot.color-gray { background: #6b7280; }

.popover-trigger { cursor: pointer; }
.popover-trigger:hover { background: var(--bg-hover); border-radius: 4px; }

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .subtitle-operation-actions, .broadcast-operation-section { display:grid; grid-template-columns:1fr; width:100%; }
  .subtitle-preview-section--primary > .subtitle-preview-header { flex-direction:column; align-items:stretch; }
  .subtitle-assets__header { align-items:stretch; flex-direction:column; }
  .subtitle-operation-actions .btn, .broadcast-operation-section .btn { width:100%; min-height:44px; }
  .event-activity-card__top { grid-template-columns:auto 1fr; }
  .event-activity-card__top time { grid-column:1 / -1; justify-self:start; }
  .event-activity-error { align-items:stretch; flex-direction:column; }
  .app-container { padding: 0 8px 30px; }

  /* --- Header mobile --- */
  .header { padding: 8px 0 0; }
  .header-inner { min-width: 0; padding: 0 10px; gap: 8px; }
  .header-left { min-width: 0; flex: 0 0 auto; }
  .header-left > div:last-child { display: none; }
  .header-right { min-width: 0; flex-shrink: 1; }
  .header-home-btn { padding: 3px 6px; font-size: 14px; }
  .header-home-btn span { display: none; }

  /* --- Upcoming lives mobile --- */
  .upcoming-section { padding: 4px 0; }
  .upcoming-heading { margin-bottom: 6px; }
  .upcoming-lives { flex-direction: column; overflow-x: visible; gap: 4px; }
  .upcoming-entry { width: 100%; }
  .upcoming-item { flex: 1 1 auto; flex-wrap: wrap; min-width: 0; gap: 3px 5px; font-size: 14px; padding: 4px 7px; }
  .upcoming-dday, .upcoming-date { flex: none; font-size: 14px; }
  .upcoming-date { order: 1; }
  .upcoming-subject { order: 2; flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
  .upcoming-item::after { content: ''; order: 3; flex-basis: 100%; height: 0; }
  .upcoming-badges { order: 4; min-width: 0; padding: 0; border: 0; }
  .upcoming-badges .option-badge, .upcoming-badges .personnel-tag { padding: 1px 5px; }
  .upcoming-badges .option-badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .upcoming-badges:has(.personnel-tag) { flex: 1 1 auto; flex-wrap: wrap; }

  /* --- Toolbar mobile --- */
  .toolbar { flex-direction: column; align-items: stretch; gap: 6px; padding: 6px 0 10px; }
  .toolbar-left { min-width: 0; flex-wrap: wrap; gap: 6px; }
  .toolbar-right {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .toolbar-checks { display: flex; gap: 8px; flex-wrap: wrap; }
  .toolbar-filters { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
  .search-box { width: 100%; }
  .search-box input { min-height: 44px; padding: 7px 12px 7px 30px; font-size: 14px; }
  .view-tabs { width: 100%; min-width: 0; }
  .view-tab {
    min-width: 0; flex: 1; justify-content: center;
    min-height: 44px; padding: 7px 6px; font-size: 15px;
  }
  .view-tab svg { width: 13px; height: 13px; }
  .select-wrap select { min-height: 44px; padding: 6px 24px 6px 8px; font-size: 14px; }
  .checkbox-wrap { min-height: 44px; font-size: 14px; }
  .btn { padding: 6px 10px; font-size: 15px; }
  .toolbar-filters .btn { min-height: 44px; }
  .btn svg { width: 13px; height: 13px; }

  /* --- Table: compact horizontal scroll on mobile --- */
  .table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .data-table { table-layout: auto; font-size: 14px; min-width: 940px; }
  .data-table th { font-size: 14px; padding: 7px 6px; white-space: nowrap; }
  .data-table td { padding: 5px 6px; white-space: nowrap; }
  .data-table td:nth-child(2) { white-space: normal; min-width: 200px; }
  .subject-wrap { align-items: flex-start; }
  .subject-cell { font-size: 14px; padding-right: 0; flex: 1; }
  .status-badge { font-size: 14px; padding: 3px 6px; }
  .status-badge::before { width: 4px; height: 4px; }
  .personnel-tag { font-size: 14px; padding: 3px 7px; }
  .option-badge { font-size: 14px; padding: 3px 7px; }
  .party-badge { width: 96px; min-height: 44px; padding: 4px 6px; font-size: 14px; }
  .party-badge--logo { gap: 5px; }
  .party-logo-frame { height: 23px; }
  .party-logo--democratic { width: 34px; }
  .party-logo--ppp { width: 72px; }
  .party-logo--ppp img { width: 58px; max-height: 20px; }
  .party-logo--institution { width: 22px; flex-basis: 22px; }
  .party-logo--council { width: 72px; flex-basis: 72px; }
  .committee-badge { font-size: 14px; padding: 3px 7px; }
  .inline-cell { padding: 4px 4px; min-height: 44px; font-size: 14px; }
  .subject-editable { min-height: 44px; }
  .poster-thumb { width: 30px; height: 30px; }
  .thumbnail-table-thumb { width: 56px; height: 32px; }
  .table-image-button { min-width: 44px; min-height: 44px; }
  .poster-upload-btn { width: 44px; height: 44px; font-size: 14px; }
  .color-picker-trigger { width: 44px; height: 44px; }

  /* Open button: static in flow, top-right of subject */
  .row-open-btn {
    opacity: 1;
    position: static;
    min-height: 44px;
    padding: 3px 8px; border-radius: 4px;
    background: var(--bg-elevated); border: 1px solid var(--border);
    font-size: 14px; color: var(--text-secondary);
    margin-left: auto; flex-shrink: 0; align-self: flex-start;
  }
  .row-open-btn .open-icon-pc { display: none; }

  /* Add row button */
  .btn-add-row { min-height: 44px; font-size: 14px; padding: 6px; }

  /* --- Calendar mobile --- */
  .calendar-day { min-height: 60px; padding: 4px; }
  .calendar-date { font-size: 14px; padding: 1px 4px; }
  .calendar-event { font-size: 14px; padding: 3px 4px; }
  .calendar-title { font-size: 15px; }
  .calendar-undated { display: block; padding: 8px 10px; }
  .calendar-undated-label { display: block; padding: 0 0 6px; }
  .calendar-undated-events { display: grid; grid-template-columns: minmax(0, 1fr); }
  .calendar-undated-event { width: 100%; max-width: none; }
  .calendar-agenda { display: block; padding: 14px 12px 16px; border-top: 1px solid var(--border); }
  .calendar-agenda__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
  .calendar-agenda__header h3 { margin: 0; color: var(--text-bright); font-size: 15px; }
  .calendar-agenda__header span { color: var(--text-muted); font-size: 14px; }
  .calendar-agenda__list { display: grid; gap: 8px; }
  .calendar-agenda-event {
    display: grid; gap: 4px; width: 100%; min-height: 72px; padding: 10px 12px;
    border: 1px solid var(--border); border-left: 4px solid; border-radius: 9px;
    background: var(--bg-elevated); color: var(--text-primary); text-align: left;
    font: inherit; cursor: pointer;
  }
  .calendar-agenda-event:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
  .calendar-agenda-event__date { color: var(--text-secondary); font-size: 14px; }
  .calendar-agenda-event strong { color: var(--text-bright); font-size: 14px; line-height: 1.4; }
  .calendar-agenda-event__location { color: var(--text-muted); font-size: 14px; }
  .calendar-agenda-event.row-시작전, .calendar-agenda-event.row-예정 { border-left-color: var(--status-before); }
  .calendar-agenda-event.row-일정확정 { border-left-color: var(--status-progress); }
  .calendar-agenda-event.row-완료 { border-left-color: var(--status-complete); }
  .calendar-agenda-event.row-취소, .calendar-agenda-event.row-취소\/연기 { border-left-color: var(--status-cancel); opacity: 0.72; }
  .calendar-agenda-event.default { border-left-color: var(--accent); }

  /* --- Feed mobile --- */
  .feed-container { min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .feed-card { min-width: 0; max-width: 100%; min-height: 118px; border-radius: 14px; }
  .feed-card:active { transform: scale(0.99); }
  .feed-card-title { font-size: 16px; line-height: 1.45; }
  .feed-card-body { min-width: 0; padding: 15px 14px; }
  .feed-card-header { min-width: 0; gap: 10px; align-items: flex-start; }
  .feed-card-header .status-badge { flex-shrink: 0; }
  .feed-card-date {
    min-width: 0; text-align: right; line-height: 1.35;
    white-space: normal; overflow-wrap: anywhere;
  }
  .feed-card-meta { row-gap: 8px; }

  /* --- Notion-like detail sheet on mobile --- */
  #event-modal {
    align-items: flex-end; padding: max(24px, env(safe-area-inset-top)) 0 0;
    backdrop-filter: blur(6px);
  }
  #event-modal .modal {
    width: 100%; max-height: 94vh; max-height: 94dvh;
    border-radius: 18px 18px 0 0; border-bottom: none;
    transform: translateY(36px);
  }
  /* 시트 규칙이 공통 열림 규칙보다 우선하므로 열린 상태도 같은 우선순위로 제자리에 둔다. 없으면 하단 36px가 잘린다. */
  #event-modal.active .modal { transform: translateY(0); }
  #event-modal .modal-header {
    min-height: 60px; padding: 10px 14px 10px 18px;
    border-radius: 18px 18px 0 0;
  }
  .modal-title { font-size: 17px; line-height: 1.35; }
  .modal-close { width: 44px; height: 44px; border-radius: 10px; font-size: 18px; }
  .modal-delete { width: 44px; height: 44px; }
  .modal-body { padding: 8px 0 max(24px, env(safe-area-inset-bottom)); }
  .detail-section-nav { top: 60px; margin: -8px 0 10px; padding: 9px 18px; }
  .detail-section-target { scroll-margin-top: 118px; }
  .new-event-form { padding: 20px 18px 8px; }
  .new-event-form__actions { display: grid; grid-template-columns: 1fr 1fr; }
  .prop-grid { grid-template-columns: 104px minmax(0, 1fr); }
  .prop-grid .prop-label {
    align-items: center; font-size: 14px; padding: 8px 6px 8px 18px;
    text-transform: none;
  }
  .prop-grid .prop-value {
    font-size: 14px; padding: 5px 18px 5px 6px; min-height: 44px;
  }
  .prop-grid .prop-value .inline-cell { min-height: 44px; }
  .detail-poster { max-height: none; width: 100%; border-radius: 0; }
  .subtitle-preview-section { padding: 0 18px; margin-top: 18px; }
  .subtitle-preview-header { align-items: flex-start; margin-bottom: 12px; }
  .subtitle-preview-header h4 { font-size: 15px; }
  .subtitle-preview-header p { font-size: 14px; }
  .subtitle-thumb-grid {
    display: flex; gap: 10px; overflow-x: auto; padding: 0 18px 8px;
    margin: 0 -18px; scroll-snap-type: x proximity; scrollbar-width: thin;
  }
  .subtitle-thumb { flex: 0 0 210px; padding: 8px; border-radius: 10px; scroll-snap-align: start; }
  .subtitle-thumb-name { margin-top: 8px; font-size: 14px; }
  .subtitle-thumb--large { grid-column: span 1; }
  .thumbnail-2026-candidate-grid { grid-template-columns: 1fr; }
  .thumbnail-2026-selection-compare { grid-template-columns: 1fr; }
  .subtitle-regen-panel { padding: 8px 12px 14px; }
  .subtitle-regen-input, .subtitle-regen-btn { min-height: 44px; }
  .section-divider { margin: 20px 18px; }
  .participant-section { padding: 0 18px; }
  #poster-modal { padding: 0; }
  #poster-modal .modal { width: 100%; max-height: 100dvh; }
  .subtitle-editor-modal { padding: 0; }
  .modal--subtitle-editor {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }
  .subtitle-editor-modal__hint { display: none; }
  .poster-preview-toolbar { flex-wrap: wrap; padding: 0 12px 8px; }
  .poster-preview-toolbar .btn { min-height: 44px; }
  .poster-preview-viewport { max-height: 68dvh; padding: 0 12px 16px; }

  /* --- Form mobile --- */
  .form-row { grid-template-columns: 1fr; }

  /* --- Popover mobile --- */
  .popover-selector {
    max-width: calc(100vw - 20px);
    min-width: 200px;
  }
  .sel-tag-x, .option-menu-btn { min-width: 44px; min-height: 44px; }
  .sel-tag-leader, .sel-tag-vehicle, .sel-tag-equipment { width: 28px; height: 44px; }
  .popover-save-btn { min-height: 44px; }
  .option-menu-btn { opacity: 0.6; }
  .option-submenu {
    max-width: calc(100vw - 30px);
    min-width: 180px;
  }

  /* --- Toast mobile --- */
  .toast-container { bottom: 10px; right: 10px; left: 10px; }
  .toast { min-width: auto; font-size: 14px; }
}

/* 웹자보 분석으로 찾았지만 아직 일정에 넣지 않은 참여자.
   분석은 참고용이라 서버가 저장하지 않는다. 예전에는 이 결과를 화면에서
   버려서 운영자가 웹자보를 다시 읽고 한 명씩 손으로 넣어야 했다. */
.found-participants {
  margin-top: 12px; padding: 14px 16px;
  border: 1px solid var(--border); border-left: 3px solid var(--accent);
  border-radius: var(--radius-md, 8px); background: var(--bg-surface);
}
.found-participants-lead { margin: 0 0 10px; font-size: 14px; color: var(--text-primary); }
.found-participants-list { margin: 0 0 12px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.found-participants-list li { display: flex; align-items: baseline; gap: 8px; font-size: 14px; flex-wrap: wrap; }
.found-role {
  flex-shrink: 0; min-width: 56px; padding: 2px 8px; border-radius: 4px;
  background: var(--bg-hover); color: var(--text-secondary);
  font-size: 14px; text-align: center;
}
.found-detail { color: var(--text-muted); font-size: 14px; }
.found-participants-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 640px) {
  .found-participants-actions .btn { min-height: 44px; flex: 1 1 auto; }
}

.subtitle-empty-reason { display: inline-block; margin-top: 6px; color: var(--text-muted); font-size: 14px; }
.subtitle-loading .btn { margin-top: 10px; }
.subtitle-load-error .btn { min-height: 44px; }

/* 역할은 자막 파일명에 쓰이고 이름은 띄어쓰기를 보존해야 하므로
   원문·이름·역할을 구분해 받는다. */
.participant-add-form {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
  margin-top: 10px; padding: 14px; border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px); background: var(--bg-surface);
}
.participant-add-field { display: flex; flex-direction: column; gap: 4px; flex: 1 1 160px; min-width: 0; }
.participant-add-field span { display: flex; align-items: center; gap: 5px; font-size: 14px; color: var(--text-muted); }
.participant-add-field span b { color: var(--status-cancel, #c0392f); font-size: 14px; }
.participant-add-field input,
.participant-add-field select {
  padding: 9px 11px; border-radius: 6px; border: 1px solid var(--border);
  background: var(--bg-input, var(--bg-base)); color: var(--text-primary);
  font-size: 14px; min-height: 44px; width: 100%;
}
.participant-add-actions { display: flex; gap: 6px; flex-shrink: 0; }
@media (max-width: 640px) {
  .participant-add-field { flex: 1 1 100%; }
  .participant-add-field input, .participant-add-field select { min-height: 44px; }
  .participant-add-actions { width: 100%; }
  .participant-add-actions .btn { flex: 1; min-height: 44px; }
}

.empty-state-hidden { margin: 10px 0 0; color: var(--text-muted); font-size: 14px; }
.empty-state-hidden .btn { margin-left: 8px; }
.new-event-setup {
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--bg-elevated);
}

.new-event-setup h3 { margin: 0 0 12px; }

.new-event-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
  padding: 4px;
  border-radius: 10px;
  background: var(--bg-base);
}

.new-event-tabs button {
  min-height: 44px;
  flex: 1;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-secondary);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.new-event-tabs button[aria-selected="true"] {
  background: var(--bg-surface);
  color: var(--text-primary);
  box-shadow: var(--shadow);
}

.new-event-panel > p {
  margin: 10px 0 0;
  color: var(--text-muted);
  font-size: 14px;
}

.detail-subject-editor {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.detail-subject-editor > label,
.new-event-image-upload > label {
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 700;
}

.detail-subject-editor__controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.detail-subject-editor input,
.new-event-image-upload input {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  padding: 9px 11px;
  font: inherit;
}

.detail-subject-editor__status,
.new-event-image-upload__status {
  min-height: 22px;
  color: var(--text-muted);
  font-size: 14px;
}

.detail-subject-editor__status[data-kind="error"],
.new-event-image-upload__status[data-kind="error"] { color: var(--status-cancel-text); }

.detail-subject-editor__status[data-kind="success"],
.new-event-image-upload__status[data-kind="success"] { color: var(--status-complete-text); }

.new-event-image-upload {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: end;
}

.new-event-image-upload .btn { min-height: 44px; }

.new-event-image-upload > label,
.new-event-image-upload__status { grid-column: 1 / -1; }

@media (max-width: 640px) {
  .detail-subject-editor__controls,
  .new-event-image-upload { grid-template-columns: 1fr; }

  .new-event-image-upload > label,
  .new-event-image-upload__status { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }

  *, *::before, *::after {
    animation-delay: 0ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-delay: 0ms !important;
    transition-duration: 0.01ms !important;
  }
}
.event-auto-update-lock { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-bottom: 16px; font-size: 14px; }
.event-auto-update-lock label { display: flex; align-items: center; gap: 8px; }
.event-auto-update-lock__note { color: var(--text-muted); font-size: 13px; }
.thumbnail-current-card .subtitle-operation-actions .thumbnail-current-card__open { width: auto; margin: 0; }

.equipment-icon { width: 16px; height: 16px; flex-shrink: 0; margin-right: 1px; color: #59616c; }
.sel-tag-equipment .equipment-icon { margin: 0; filter: grayscale(1); opacity: .55; }
.sel-tag-equipment:hover, .sel-tag-equipment.active { background: rgba(148,163,184,.22); }
.sel-tag-equipment:hover .equipment-icon, .sel-tag-equipment.active .equipment-icon { filter: none; opacity: 1; }
.site-equipment-toggle { display: flex; align-items: center; gap: 6px; padding: 10px 12px; cursor: pointer; }
.site-equipment-toggle input { width: 16px; height: 16px; }
.site-equipment-badge { display: flex; align-items: center; gap: 3px; color: var(--text-primary); font-size: 12px; flex-basis: 100%; grid-column: 1 / -1; order: 1; }
.upcoming-badges:has(.site-equipment-badge) { flex-wrap: wrap; }

.event-fact-badge {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid var(--border-color, currentColor);
  border-radius: 4px;
  color: var(--text-muted);
  font-size: 11px;
  white-space: nowrap;
}

/* 답사 탐색과 같은 지도·지역색·대표 사진을 사용하는 장소 선택창. */
.venue-selector { width:min(800px,calc(100vw - 20px)); max-width:800px; border-radius:16px; max-height:min(640px,calc(100dvh - 20px)); }
.venue-selector__header { display:flex; align-items:center; gap:12px; padding:14px 16px 6px; }
.venue-selector__header strong { flex:1; font-size:16px; }
.venue-selector__header a { color:var(--text-secondary); font-size:12px; text-decoration:none; }
.venue-selector__header button { min-height:36px; padding:6px 10px; border:1px solid var(--border); border-radius:8px; background:var(--bg-elevated); color:var(--text-primary); cursor:pointer; }
.venue-selector__body { grid-template-columns:230px minmax(0,1fr); min-height:0; height:min(440px,55dvh); }
.venue-selector__region { display:grid; grid-template-columns:44px minmax(0,1fr) auto; font-size:12px; padding:7px; min-height:62px; }
.venue-selector .region-map-icon { width:44px; height:48px; flex:none; }
.venue-selector .atlas-land { fill:var(--border-strong,var(--border)); stroke:var(--bg-elevated); stroke-width:.8; }
.venue-selector .atlas-land-active { fill:var(--region-color,var(--accent)); }
.venue-selector__region.active { color:var(--text-primary); box-shadow:inset 3px 0 var(--region-color); background:var(--bg-hover); }
.venue-selector__places { padding:8px; }
.venue-selector__place { grid-template-columns:72px minmax(0,1fr) 16px; column-gap:12px; padding:10px; margin-bottom:6px; border:1px solid var(--border); border-radius:11px; background:var(--bg-elevated); }
.venue-selector__photo { grid-column:1; grid-row:1 / span 3; position:relative; display:grid; place-items:center; width:72px; height:72px; border-radius:8px; overflow:hidden; background:var(--bg-hover); }
.venue-selector__photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.venue-selector__place-main,.venue-selector__address,.venue-selector__region-hint { grid-column:2; }
.venue-selector__place-main { font-size:13px; line-height:1.4; }
.venue-selector__address { font-size:12px; }
.venue-selector__region-hint { font-size:11px; line-height:1.4; }
.venue-selector__region-hint::before { content:''; display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:5px; background:var(--region-color); }
.venue-selector__check { grid-column:3; color:var(--region-color,var(--accent)); }
.venue-selector__place.selected { border-color:var(--region-color); background:var(--bg-hover); }
.venue-selector__place--clear { display:flex; justify-content:space-between; min-height:36px; padding:6px 10px; background:transparent; border:0; }
@media(max-width:560px) {
 .venue-selector { width:auto; max-height:calc(100dvh - 16px); }
 .venue-selector__body { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); height:min(520px,65dvh); }
 .venue-selector__regions { min-height:76px; padding:6px; }
 .venue-selector__region { grid-template-columns:36px auto auto; min-width:max-content; gap:6px; }
 .venue-selector__region .region-map-icon { width:36px; height:40px; }
 .venue-selector__place { grid-template-columns:60px minmax(0,1fr) 14px; column-gap:8px; }
 .venue-selector__photo { width:60px; height:64px; }
}
.venue-selector__regions[hidden] { display:none; }
.venue-selector__body:has(.venue-selector__regions[hidden]) { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr); }

.venue-selector__placeholder { width:28px; height:28px; color:var(--region-color,var(--text-muted)); }

/* 날짜·시간 선택: 선택값을 확인한 뒤 적용 */
.datepicker-popover{position:fixed;z-index:2100;box-sizing:border-box;max-height:calc(100dvh - 16px);overflow-y:auto;width:min(370px,calc(100vw - 16px));padding:16px}.dp-preview{font-weight:700;font-size:16px;min-height:24px;margin-bottom:12px;color:var(--text-primary)}.dp-shortcuts{display:flex;gap:6px;margin-bottom:10px}.dp-shortcuts button{flex:1;min-height:38px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-input);color:var(--text-primary);font:inherit;cursor:pointer}.dp-shortcuts button:hover{background:var(--accent-muted)}.dp-month-jump{flex:1;min-width:0;text-align:center}.dp-month{width:100%;min-height:44px;border:0;background:var(--bg-input);color:var(--text-primary);font:inherit;border-radius:var(--radius);box-sizing:border-box}.dp-time .dp-hour,.dp-time .dp-minute{width:65px;box-sizing:border-box;font-size:20px;font-weight:600}.dp-time-label{margin-right:auto}.dp-feedback{font-size:13px;color:var(--text-secondary);margin:8px 0}.dp-feedback:empty{display:none}.dp-actions .dp-clear{margin-right:auto;padding:5px 8px;font-size:13px}.dp-cancel{background:var(--bg-input);color:var(--text-primary)}.datepicker-popover button:disabled{opacity:.5;cursor:default}.datepicker-popover button:focus-visible,.datepicker-popover input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* 날짜 선택은 달력, 시간, 최종 적용 순서로 표시한다. */
.dp-backdrop{display:none}.datepicker-popover{width:min(520px,calc(100vw - 24px));border-radius:18px;padding:18px;z-index:2101;overscroll-behavior:contain}.dp-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dp-heading .dp-preview{font-size:17px;margin:0;letter-spacing:-.3px}.dp-close{border:0;font-size:24px;width:44px;height:44px;border-radius:10px;cursor:pointer;flex-shrink:0}.dp-panels{display:grid;grid-template-columns:minmax(0,1fr) 156px;gap:20px}.dp-calendar-panel,.dp-clock-panel{min-width:0}.dp-clock-panel{border-left:1px solid var(--border);padding-left:18px}.dp-clock-title{margin:4px 0 14px;font-size:14px;font-weight:600}.dp-clock-title small{display:block;font-size:12px;font-weight:400;color:var(--text-secondary);margin-top:4px}.dp-clock-panel .dp-time{border:0;padding:0;gap:4px;flex-wrap:wrap}.dp-time .dp-hour,.dp-time .dp-minute{width:50px;min-height:48px;font-size:23px;text-align:center;padding:4px;appearance:textfield}.dp-time input::-webkit-inner-spin-button,.dp-time input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.dp-clock-panel .dp-time>span{font-size:12px;color:var(--text-secondary)}.dp-clock-panel .dp-time-presets{display:grid;grid-template-columns:1fr;margin-top:16px;gap:8px}.dp-time-presets button{min-height:36px;font-size:13px}.dp-grid{gap:0;margin-bottom:0}.dp-header{margin-bottom:4px}.dp-day{font-size:14px}.dp-dow{font-size:12px}.dp-month{font-size:14px;min-width:0}.dp-shortcuts{gap:8px}.dp-shortcuts button{font-size:13px;min-height:36px}.dp-actions{padding-top:12px;margin-top:14px;gap:8px}.dp-actions .dp-confirm{min-width:92px}.dp-actions .dp-clear{color:var(--text-muted);background:transparent;font-size:12px}.dp-heading .dp-close:hover{background:var(--accent-muted)}
@media(max-width:680px){.dp-backdrop{display:block;position:fixed;inset:0;background:#0f172a55;backdrop-filter:blur(2px);z-index:2100;touch-action:none}.datepicker-popover{left:8px!important;right:8px;top:auto!important;bottom:8px;width:calc(100vw - 16px);max-height:calc(100dvh - 24px);padding:16px 20px;border-radius:22px}.dp-heading{margin-bottom:10px}.dp-heading .dp-preview{font-size:18px}.dp-panels{grid-template-columns:1fr;gap:10px}.dp-clock-panel{padding:12px 0 0;border:0;border-top:1px solid var(--border);display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.dp-clock-title{margin:0}.dp-clock-title small{display:inline;margin-left:8px}.dp-clock-panel .dp-time{justify-content:flex-end}.dp-time .dp-hour,.dp-time .dp-minute{width:52px;min-height:44px;font-size:22px}.dp-clock-panel .dp-time-presets{grid-column:1/-1;grid-template-columns:repeat(3,1fr);margin:4px 0 0}.dp-header{margin-bottom:0}.dp-grid .dp-day{min-height:44px}.dp-grid .dp-dow{padding:4px 0}.dp-actions{margin-top:12px}}

/* 일정 상세의 동작 버튼: 같은 크기·간격, 좁은 화면에서도 줄 바꿈. */
#event-modal .btn { min-width: 44px; min-height: 44px; justify-content: center; border-radius: 10px; }
#event-modal .btn svg, .detail-section-nav button svg { width: 18px; height: 18px; flex: 0 0 auto; }
#event-modal .btn:focus-visible, .detail-section-nav button:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 3px;
}
#event-modal .btn:disabled { opacity: .55; cursor: wait; }
#event-modal .btn[aria-busy="true"] svg { animation: detail-action-pulse 1s ease-in-out infinite alternate; }
.detail-section-nav .detail-log-button { margin-left: auto; }
#event-modal .detail-icon-button, .detail-section-nav .detail-icon-button {
  width: 44px; min-width: 44px; padding: 10px; flex: 0 0 44px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
}
#event-modal .subtitle-assets__header { align-items: flex-start; flex-wrap: wrap; }
#event-modal .subtitle-operation-actions { align-items: center; }
#event-modal .subtitle-manual-create { align-items: stretch; padding-left: 8px; border-left: 1px solid var(--border); }
#event-modal .subtitle-manual-create .btn { width: 44px; padding: 10px; }
#event-modal .subtitle-manual-create select { border-radius: 10px; }
#event-modal .thumbnail-current-card__downloads .btn { flex: 0 1 auto; }
#event-modal .subtitle-operation-actions .btn[aria-label="직접 업로드"] { width: 44px; padding: 10px; flex: 0 0 44px; }
@keyframes detail-action-pulse { to { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { #event-modal .btn[aria-busy="true"] svg { animation: none; } }
@media (max-width: 620px) {
  #event-modal .subtitle-operation-actions { display: flex; flex-wrap: wrap; justify-content: flex-start; width: auto; }
  #event-modal .subtitle-operation-actions .btn { width: auto; }
  #event-modal .subtitle-manual-create { padding-left: 0; border-left: 0; }
  #event-modal .subtitle-assets__header > div:first-child { flex: 1 0 100%; }
}

#event-modal .btn .detail-app-icon { width: 24px; height: 24px; object-fit: contain; flex: 0 0 24px; }

.calendar-event-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; font-weight: 600; line-height: 1.35; margin: 2px 0 4px; }
.calendar-event-details { display: flex; flex-wrap: wrap; gap: 3px 5px; min-width: 0; }
.calendar-event-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; min-width: 0; }
.calendar-event-badges .option-badge, .calendar-event-badges .personnel-tag { max-width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: 12px; line-height: 1.4; padding: 2px 5px; }
.calendar-event-badges[aria-label="장소"] { flex: 1 0 100%; }
/* 달력 칸 밖의 일정 목록(모바일 agenda)은 일반 목록처럼 14px을 지킨다. */
.calendar-agenda-event .calendar-event-badges :is(.option-badge, .personnel-tag) { font-size: 14px; }
.calendar-event-badges .option-badge--location { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 768px) {
  .calendar-grid .calendar-event-details { display: none; }
  .calendar-grid .calendar-event-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12px; margin-bottom: 0; }
  .calendar-grid .calendar-event .cal-time { font-size: 11px; }
}