.onset-panel-root {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: 52px minmax(0, 1fr) auto;
  color: var(--ink);
  background: #f5f7f6;
}

.onset-panel-root.onset-vfx-mode { display: block; }
.onset-vfx-page {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto 52px minmax(0, 1fr) auto;
}
.onset-vfx-page.onset-vfx-empty { grid-template-rows: auto minmax(0, 1fr); }
.onset-vfx-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.onset-vfx-heading h1 { margin: 2px 0 4px; font-size: 20px; line-height: 1.2; }
.onset-vfx-heading p:last-child { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.onset-vfx-heading-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.onset-vfx-page > .panel-runtime-state { min-height: 0; overflow: auto; }
@media (max-width: 1000px) {
  .onset-vfx-heading { align-items: start; flex-direction: column; }
  .onset-vfx-heading-actions { flex-wrap: wrap; }
}

.panel-context-bar {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(140px, 1fr) minmax(170px, 1.25fr) minmax(150px, 1fr) 36px;
  gap: 0;
  min-width: 0;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.panel-context-bar > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  border-right: 1px solid var(--line-soft);
}

.panel-context-bar span { color: var(--muted); font-size: 10px; }
.panel-context-bar strong { min-width: 0; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.panel-context-bar > button { align-self: center; justify-self: end; }

.panel-three-column {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 232px minmax(560px, 1fr) 292px;
  overflow: hidden;
}

.panel-context-list,
.panel-health-rail {
  min-height: 0;
  overflow: auto;
  background: #fff;
}

.panel-context-list { border-right: 1px solid var(--line); }
.panel-health-rail { border-left: 1px solid var(--line); }
.panel-context-list > header,
.panel-health-rail section > header,
.panel-section > header,
.panel-action-editor > header {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.panel-context-list > header { padding: 10px 12px 6px; }
.panel-context-list h2,
.panel-health-rail h2,
.panel-section h2 { margin: 1px 0 0; font-size: 13px; line-height: 1.25; }
.panel-context-list > header > strong { min-width: 28px; padding: 4px 6px; border-radius: 4px; color: var(--muted); background: var(--soft); text-align: center; font-size: 10px; }

.panel-list-search {
  height: 34px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 10px 8px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
}
.panel-list-search input { min-width: 0; width: 100%; border: 0; outline: 0; font-size: 10px; }
.panel-context-rows { padding: 0 6px 12px; }
.panel-context-row {
  width: 100%;
  min-height: 76px;
  display: grid;
  gap: 5px;
  padding: 9px 10px;
  border: 0;
  border-left: 3px solid transparent;
  border-bottom: 1px solid var(--line-soft);
  color: var(--ink);
  background: #fff;
  text-align: left;
  cursor: pointer;
}
.panel-context-row:hover { background: #f7faf9; }
.panel-context-row.active { border-left-color: var(--accent); background: #edf7f4; }
.panel-context-row > span { min-width: 0; display: flex; justify-content: space-between; gap: 5px; }
.panel-context-row > span strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.panel-context-row > small { color: var(--muted); font-size: 9px; }
.panel-context-row footer { display: flex; gap: 4px; }
.panel-context-row footer span { padding: 2px 5px; border-radius: 3px; color: #52605c; background: #eef2f0; font-family: var(--font-data); font-size: 8px; }

.panel-composite {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 12px;
}
.panel-section {
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}
.panel-section > header { min-height: 54px; padding: 8px 12px; border-bottom: 1px solid var(--line-soft); }
.panel-section > header > div:first-child { margin-right: auto; }

.overview-field-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.overview-field {
  min-width: 0;
  min-height: 66px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 10px 12px;
  border-right: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}
.overview-field:nth-child(3n) { border-right: 0; }
.overview-field:nth-last-child(-n+3) { border-bottom: 0; }
.overview-field > span:first-child { color: var(--muted); font-size: 9px; }
.overview-field .field-value { min-width: 0; overflow: hidden; font-size: 11px; line-height: 1.45; text-overflow: ellipsis; }

.segmented-control { height: 30px; display: inline-flex; padding: 2px; border: 1px solid var(--line); border-radius: 5px; background: #f4f6f5; }
.segmented-control button { min-width: 62px; padding: 0 8px; border: 0; border-radius: 3px; color: var(--muted); background: transparent; font-size: 9px; cursor: pointer; }
.segmented-control button.active { color: var(--ink); background: #fff; box-shadow: 0 1px 2px rgba(20, 37, 31, 0.12); }

.onset-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px 10px 2px; }
.onset-card { min-width: 0; padding: 9px; border: 1px solid var(--line); border-radius: 5px; background: #fbfcfb; }
.onset-card > header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 8px; margin-bottom: 9px; }
.camera-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 4px; color: #fff; background: #1f5a4e; font-family: var(--font-data); font-size: 11px; }
.onset-card > header div { min-width: 0; display: grid; gap: 3px; }
.onset-card > header strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.onset-card > header small { color: var(--muted); font-size: 8px; }
.onset-card > div { min-height: 27px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--line-soft); font-size: 9px; }
.onset-card > div > span:first-child { color: var(--muted); }
.onset-card footer { display: flex; justify-content: flex-end; gap: 6px; margin-top: 8px; }

.take-group-stack { padding: 8px 10px 10px; }
.take-group { margin-top: 8px; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.take-group > header { height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; background: #f2f5f3; }
.take-group > header strong { font-size: 10px; }
.take-group > header span { color: var(--muted); font-size: 9px; }
.take-table { min-width: 560px; }
.take-table-head,
.take-table-row { display: grid; grid-template-columns: minmax(150px, 1.3fr) 58px 52px minmax(120px, 1fr) 88px; align-items: center; gap: 8px; padding: 0 9px; }
.take-table-head { height: 28px; color: var(--muted); background: #fafbfa; font-size: 8px; }
.take-table-row { width: 100%; min-height: 34px; border: 0; border-top: 1px solid var(--line-soft); color: var(--ink); background: #fff; text-align: left; cursor: pointer; }
.take-table-row:hover { background: #f3f9f7; }
.take-table-row .field-value { min-width: 0; overflow: hidden; font-family: var(--font-data); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }

.plate-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 10px; }
.plate-row { min-width: 0; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); background: #fff; text-align: left; cursor: pointer; }
.plate-type { width: 36px; height: 30px; display: grid; place-items: center; border-radius: 4px; color: #3f6258; background: #e9f2ef; font-family: var(--font-data); font-size: 9px; }
.plate-row > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.plate-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.plate-row small { color: var(--muted); font-size: 8px; }

.artifact-collection { display: grid; gap: 8px; padding: 0 10px 10px; }
.artifact-collection.gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.artifact-collection.list { grid-template-columns: 1fr; }
.artifact-card { min-width: 0; position: relative; display: grid; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.artifact-card.gallery { grid-template-rows: 74px auto; }
.artifact-card.list { grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; }
.artifact-preview { min-height: 54px; display: grid; place-items: center; border-radius: 3px; color: #d8e4e0; background: #283934; font-family: var(--font-data); font-size: 13px; }
.artifact-copy { min-width: 0; display: grid; gap: 3px; }
.artifact-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.artifact-copy small,
.artifact-copy p { margin: 0; overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.future-action { min-height: 48px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border-top: 1px solid var(--line-soft); background: #fafbfa; }
.future-action strong { font-size: 10px; }
.future-action span { color: var(--muted); font-size: 9px; }

.panel-health-rail { padding-bottom: 20px; }
.panel-health-rail > section { padding: 0 11px 12px; border-bottom: 1px solid var(--line); }
.relation-health-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.relation-state { min-width: 0; display: grid; gap: 3px; padding: 7px; border: 1px solid var(--line); border-top: 3px solid #a8b4b0; border-radius: 4px; background: #fafbfa; }
.relation-state[data-relation-state="confirmed"] { border-top-color: #2e8a74; }
.relation-state[data-relation-state="candidate"] { border-top-color: #d29a31; }
.relation-state[data-relation-state="conflict"] { border-top-color: #c84c4c; }
.relation-state span,
.relation-state small { color: var(--muted); font-size: 7px; }
.relation-state strong { font-family: var(--font-data); font-size: 13px; }
.panel-quick-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.panel-quick-actions button { min-height: 48px; display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 6px; padding: 6px; border: 1px solid var(--line); border-radius: 4px; color: var(--ink); background: #fff; text-align: left; cursor: pointer; }
.panel-quick-actions button:hover { border-color: #7ca397; background: #f2f8f6; }
.panel-quick-actions span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 3px; color: #245d50; background: #e5f1ed; font-family: var(--font-data); font-size: 9px; }
.panel-quick-actions strong { font-size: 9px; line-height: 1.3; }
.candidate-stack { display: grid; gap: 7px; }
.relation-candidate { padding: 8px; border: 1px solid #e3c98d; border-radius: 4px; background: #fffbf0; }
.relation-candidate header { display: flex; align-items: center; gap: 6px; }
.relation-candidate header strong { min-width: 0; overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.relation-candidate p { margin: 7px 0; color: #665d48; font-size: 8px; line-height: 1.4; }
.relation-candidate footer { display: flex; justify-content: space-between; color: var(--muted); font-size: 7px; }
.relation-candidate code { max-width: 90px; overflow: hidden; text-overflow: ellipsis; }
.panel-boundary { margin: 11px; padding: 10px !important; border: 1px solid #cad8d3 !important; border-radius: 5px; background: #f1f6f4; }
.panel-boundary strong { font-size: 10px; }
.panel-boundary p { margin: 6px 0 0; color: #52635d; font-size: 8px; line-height: 1.5; }

.panel-action-editor { margin: 11px; padding: 0 !important; border: 1px solid #7fa99d !important; border-radius: 5px; background: #fff; box-shadow: 0 4px 14px rgba(24, 54, 45, 0.12); }
.shooting-create-page { width: min(100%, 760px); margin: 24px auto; padding: 12px; overflow-y: auto; }
.shooting-create-page > header { padding: 10px 12px; }
.shooting-create-page > header h2 { margin: 4px 0; font-size: 22px; }
.shooting-create-page > header p { margin: 4px 0; }
.shooting-create-page .panel-action-editor { margin: 0; }
.shooting-create-page .panel-action-form { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; padding: 16px; }
.shooting-create-page fieldset.panel-action-form { min-width: 0; margin: 0; border: 0; }
.shooting-create-page .shooting-input-preset { grid-column: 1 / -1; max-width: 280px; font-weight: 600; color: var(--ink); }
.shooting-create-page .shooting-input-description { grid-column: 1 / -1; margin: -7px 0 0; color: var(--muted); font-size: 11px; }
.shooting-create-page .shooting-input-more { grid-column: 1 / -1; justify-self: start; }
.shooting-create-page .shooting-input-unavailable { grid-column: 1 / -1; margin: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 4px; color: var(--muted); background: var(--surface-muted, #f6f8f7); font-size: 11px; line-height: 1.45; }
.shooting-create-page .preview-summary dl { display: grid; gap: 4px; margin: 8px 0 0; }
.shooting-create-page .preview-summary dl div { display: grid; grid-template-columns: 150px 1fr; gap: 8px; }
.shooting-create-notice { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line); background: #fffbef; color: var(--ink); font-size: 12px; }
.panel-action-editor > header { padding: 7px 9px; border-bottom: 1px solid var(--line); }
.panel-action-editor h3 { margin: 2px 0 0; font-size: 11px; }
.panel-action-form { display: grid; gap: 8px; padding: 9px; }
.panel-action-form label { display: grid; gap: 4px; color: var(--muted); font-size: 8px; }
.panel-action-form input,
.panel-action-form select,
.panel-action-form textarea { min-width: 0; width: 100%; padding: 7px 8px; border: 1px solid var(--line); border-radius: 4px; color: var(--ink); background: #fff; font: inherit; font-size: 9px; }
.panel-action-form textarea { min-height: 58px; resize: vertical; }
.panel-action-form fieldset { display: grid; gap: 4px; padding: 7px; border: 1px solid var(--line); border-radius: 4px; }
.panel-action-form legend { padding: 0 4px; color: var(--muted); font-size: 8px; }
.panel-action-form .check-row { display: flex; grid-template-columns: auto 1fr; align-items: center; gap: 6px; }
.panel-action-form .check-row input { width: auto; }
.panel-action-editor > footer { display: flex; justify-content: flex-end; gap: 6px; padding: 8px 9px; border-top: 1px solid var(--line); }
.action-error { margin: 0 9px 8px; padding: 8px; border: 1px solid #e3a6a6; border-radius: 4px; color: #842c2c; background: #fff5f5; }
.action-error strong { font-size: 9px; }
.action-error p { margin: 4px 0 0; font-size: 8px; line-height: 1.4; }
.preview-summary { margin: 0 9px 8px; padding: 8px; border: 1px solid #dfc784; border-radius: 4px; background: #fffbef; }
.preview-summary > strong { font-size: 9px; }
.changeset { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 7px; }
.changeset > div { display: grid; gap: 2px; padding: 5px; border-radius: 3px; background: rgba(255, 255, 255, 0.7); }
.changeset span { color: var(--muted); font-size: 7px; }
.changeset strong { font-family: var(--font-data); font-size: 11px; }

.panel-bottom-commit {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  border-top: 1px solid #d8c27f;
  background: #fff9e9;
  box-shadow: 0 -4px 14px rgba(33, 45, 40, 0.08);
}
.panel-bottom-commit > span { min-width: 0; display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 8px; }
.panel-bottom-commit strong { font-size: 10px; }
.panel-bottom-commit small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.panel-bottom-commit.committed { border-top-color: #80b5a5; background: #eef8f4; }
.panel-bottom-commit.error { border-top-color: #dc9b9b; background: #fff2f2; }

.panel-runtime-state { min-height: 360px; display: grid; place-content: center; justify-items: center; gap: 8px; padding: 40px; text-align: center; }
.panel-runtime-state strong { font-size: 15px; }
.panel-runtime-state p { max-width: 520px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.panel-runtime-state > div { display: flex; gap: 8px; }
.panel-runtime-state.error strong { color: #923535; }
.panel-empty { grid-column: 1 / -1; display: grid; place-items: center; gap: 6px; min-height: 120px; padding: 18px; color: var(--muted); text-align: center; }
.panel-empty.compact { min-height: 82px; }
.panel-empty strong { color: var(--ink); font-size: 10px; }
.panel-empty p { margin: 0; font-size: 9px; }
.status-badge { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.status-badge.success { color: #1c6c59; background: #e6f4ef; }
.status-badge.warning { color: #8a6218; background: #fff1cf; }
.status-badge.danger { color: #9a3636; background: #fde7e7; }

.onset-panel-root .field-value,
.onset-panel-root .take-table-row .field-value,
.onset-panel-root .relation-state strong,
.onset-panel-root .changeset strong {
  font-size: var(--data-font-size);
  font-weight: var(--data-font-weight);
}

html[data-theme-preset="dark_onset"] .onset-panel-root,
html[data-theme-preset="dark_onset"] .panel-composite { background: var(--bg); }
html[data-theme-preset="dark_onset"] .panel-context-bar,
html[data-theme-preset="dark_onset"] .panel-context-list,
html[data-theme-preset="dark_onset"] .panel-health-rail,
html[data-theme-preset="dark_onset"] .panel-list-search,
html[data-theme-preset="dark_onset"] .panel-context-row,
html[data-theme-preset="dark_onset"] .panel-section,
html[data-theme-preset="dark_onset"] .segmented-control button.active,
html[data-theme-preset="dark_onset"] .take-table-row,
html[data-theme-preset="dark_onset"] .plate-row,
html[data-theme-preset="dark_onset"] .artifact-card,
html[data-theme-preset="dark_onset"] .panel-quick-actions button,
html[data-theme-preset="dark_onset"] .panel-action-editor,
html[data-theme-preset="dark_onset"] .panel-action-form textarea {
  color: var(--ink);
  background: var(--surface);
}
html[data-theme-preset="dark_onset"] .panel-context-row:hover,
html[data-theme-preset="dark_onset"] .take-table-row:hover,
html[data-theme-preset="dark_onset"] .panel-quick-actions button:hover { background: var(--grid-hover); }
html[data-theme-preset="dark_onset"] .panel-context-row.active { background: var(--grid-selected); }
html[data-theme-preset="dark_onset"] .segmented-control,
html[data-theme-preset="dark_onset"] .take-group > header,
html[data-theme-preset="dark_onset"] .take-table-head,
html[data-theme-preset="dark_onset"] .future-action,
html[data-theme-preset="dark_onset"] .relation-state,
html[data-theme-preset="dark_onset"] .panel-boundary { background: var(--surface-soft); }
html[data-theme-preset="dark_onset"] .onset-card { background: var(--surface-soft); }
html[data-theme-preset="dark_onset"] .panel-context-row footer span { color: var(--text); background: var(--surface-strong); }
html[data-theme-preset="dark_onset"] .relation-candidate,
html[data-theme-preset="dark_onset"] .preview-summary { color: var(--text); background: var(--amber-soft); }
html[data-theme-preset="dark_onset"] .relation-candidate p,
html[data-theme-preset="dark_onset"] .panel-boundary p { color: var(--text); }

/* T16-S1G: Scene/Shot focus layout, scoped to the onset VFX workspace. */
.onset-vfx-page { grid-template-rows: auto auto minmax(0, 1fr) auto; overflow: hidden; }
.onset-vfx-heading { align-items: center; padding: 8px 14px; }
.onset-vfx-heading > div:first-child { min-width: 0; }
.onset-vfx-heading h1 { font-size: 18px; }
.onset-vfx-heading-actions { flex-wrap: wrap; justify-content: flex-end; }
.onset-page-settings { position: relative; }
.onset-page-settings summary { list-style: none; cursor: pointer; }
.onset-page-settings summary::-webkit-details-marker { display: none; }
.onset-page-settings > div { position: absolute; z-index: 65; top: calc(100% + 5px); right: 0; width: 230px; display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; box-shadow: var(--shadow); font-size: 11px; }
.onset-page-settings label { display: flex; align-items: center; gap: 7px; }
.onset-work-area { position: relative; min-width: 0; min-height: 0; display: grid; grid-template-columns: 224px minmax(0, 1fr); overflow: hidden; }
.onset-work-area.list-hidden { grid-template-columns: minmax(0, 1fr); }
.onset-work-main { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: auto; padding: 8px; }
.onset-focus-tabs { display: flex; gap: 4px; padding: 3px 4px 8px; border-bottom: 1px solid var(--line); }
.onset-focus-tabs button { min-height: 30px; padding: 0 12px; border: 0; border-radius: 4px; color: var(--muted); background: transparent; cursor: pointer; }
.onset-focus-tabs button.active { color: var(--ink); background: #eaf4f0; font-weight: 650; }
.onset-work-main > .panel-section { margin-top: 8px; }

/* The approved on-set page has one compact mode bar and one scene navigator. */
.onset-vfx-page > .onset-vfx-heading { gap: 18px; min-height: 53px; padding: 8px 14px; }
.onset-vfx-heading > h1 { margin: 0; white-space: nowrap; }
.onset-vfx-heading > .onset-focus-tabs { padding: 0; border: 0; }
.onset-vfx-heading > .onset-vfx-heading-actions { margin-left: auto; gap: 8px; }
.onset-work-menu { position: relative; font-size: 12px; }
.onset-work-menu > summary { list-style: none; padding: 5px 9px; cursor: pointer; }
.onset-work-menu > summary::-webkit-details-marker { display: none; }
.onset-work-menu > div { position: absolute; right: 0; top: calc(100% + 5px); min-width: 195px; z-index: 65; display: grid; gap: 5px; padding: 9px; background: var(--panel, #fff); border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 8px 20px #173b3020; }
.onset-work-menu > div > button { text-align: left; padding: 7px 8px; border: 0; background: transparent; color: var(--ink); cursor: pointer; }
.onset-work-menu > div > button:hover { background: var(--soft); }
.onset-work-menu label { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.onset-work-navigator { display: flex; align-items: center; gap: 7px; margin: 0 12px 8px; padding: 6px; background: var(--panel, #fff); border: 1px solid var(--line); border-radius: 6px; min-height: 45px; }
.onset-work-navigator > button { white-space: nowrap; padding: 6px 9px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel, #fff); color: var(--ink); cursor: pointer; font-size: 12px; }
.onset-work-navigator > button:disabled { opacity: .4; cursor: default; }
.onset-context-picker { display: flex; align-items: center; gap: 8px; min-width: 180px; border: 1px solid var(--line); padding: 3px 8px; border-radius: 4px; font-size: 12px; }
.onset-context-picker > span { white-space: nowrap; color: var(--muted); }
.onset-context-picker > select { border: 0; background: transparent; color: var(--ink); padding: 3px; min-width: 90px; max-width: 240px; }
.onset-navigation-state { margin-left: auto; color: var(--muted); font-size: 11px; }
.onset-work-main { display: block; padding: 0 12px 10px; }
.onset-work-area.with-list { grid-template-columns: 210px minmax(0, 1fr); }
.onset-directory-options { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 2px 9px 6px; }
.onset-directory-options label { display: grid; gap: 3px; font-size: 10px; color: var(--muted); }
.onset-directory-options select { min-width: 0; width: 100%; padding: 4px; font-size: 11px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel, #fff); color: var(--ink); }
.onset-day-group { margin: 0 7px 6px; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.onset-day-group > summary { display: flex; align-items: center; justify-content: space-between; gap: 5px; padding: 8px; background: var(--soft); cursor: pointer; font-size: 12px; }
.onset-day-group > summary > span { font-size: 10px; color: var(--muted); }
.onset-day-group[open] > summary { border-bottom: 1px solid var(--line); }
.onset-day-group .panel-context-row { border-radius: 0; margin: 0; width: 100%; padding: 7px; }
.onset-day-picker, .onset-context-picker { display: flex; align-items: center; gap: 7px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.onset-day-picker > span, .onset-context-picker > span { font-size: 11px; font-weight: 700; color: var(--muted); white-space: nowrap; }
.onset-day-picker select { min-width: 116px; border: 0; background: transparent; color: var(--ink); }
.onset-navigator-divider { height: 26px; border-left: 1px solid var(--line); margin: 0 4px; }
.onset-work-navigator { flex-wrap: wrap; }
.onset-preparation { display: grid; gap: 12px; }
.onset-preparation .panel-section { margin: 0; }
.onset-preparation-guide { border-left: 3px solid var(--accent); padding: 12px 16px; background: #edf7f4; border-radius: 5px; }
.onset-preparation-guide h2, .onset-preparation h2 { margin: 0; font-size: 15px; }
.onset-preparation p { margin: 6px 0; font-size: 12px; color: var(--muted); }
.onset-preparation-guide small { display: block; color: var(--muted); }
.onset-preparation-position-list > div, .onset-preparation-group { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border-top: 1px solid var(--line); font-size: 12px; }
.onset-preparation-position-list > div > span { flex: 1; }
.onset-preparation-group > div { display: grid; gap: 4px; flex: 1; }
.onset-preparation-group span { color: var(--muted); }
.onset-preparation-groups footer { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 12px; border-top: 1px solid var(--line); }
.onset-preparation-groups footer small { color: var(--muted); }
.onset-bulk-take-row { display: grid; grid-template-columns: 70px 90px minmax(120px,1fr); gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--line); align-items: end; }
.onset-context-loading { min-height: 180px; margin-top: 0; }
@media (max-width: 1000px) { .onset-work-navigator { flex-wrap: wrap; } .onset-navigation-state { display: none; } .onset-work-area.with-list { grid-template-columns: 185px minmax(0, 1fr); } .onset-context-picker { min-width: 150px; } }
@media (max-width: 760px) { .onset-vfx-page > .onset-vfx-heading { flex-wrap: wrap; flex-direction: row; gap: 8px; } .onset-work-area.with-list { grid-template-columns: minmax(0, 1fr); } .onset-work-main { padding: 6px; } .onset-work-navigator { margin: 0 6px 6px; } }
.onset-camera-list { display: flex; gap: 6px; overflow-x: auto; padding: 8px 10px; border-bottom: 1px solid var(--line-soft); }
.onset-camera-choice { min-width: 155px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 7px; padding: 7px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); background: #fff; text-align: left; cursor: pointer; }
.onset-camera-choice.active { border-color: var(--accent); background: #edf7f4; box-shadow: inset 0 0 0 1px var(--accent); }
.onset-camera-choice > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.onset-camera-choice strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.onset-camera-choice small, .onset-camera-choice > span:last-child { color: var(--muted); font-size: 9px; }
.onset-relation-drawer { position: fixed; z-index: 60; top: calc(var(--topbar-height, 52px) + 104px); right: 8px; bottom: 12px; width: min(370px, 34vw); min-width: 300px; overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface, #fff); box-shadow: var(--shadow); }
.onset-relation-drawer > header { position: sticky; top: -10px; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 7px 2px; background: var(--surface, #fff); }
.onset-relation-drawer h2 { margin: 0; font-size: 14px; }
.onset-relation-drawer .panel-health-rail { display: block; overflow: visible; border: 0; }
.onset-relation-drawer .panel-action-editor { position: static; width: auto; box-shadow: none; }
.onset-capture-existing-editor { position: fixed; z-index: 66; top: 110px; right: 16px; bottom: 66px; width: min(460px, calc(100vw - 32px)); overflow: auto; border-radius: 8px; background: var(--surface, #fff); box-shadow: var(--shadow); }
.onset-relation-drawer .panel-references { margin-top: 10px; }
.onset-work-area .panel-context-list { min-width: 0; }
@media (max-width: 1280px) {
  .onset-work-area { grid-template-columns: 205px minmax(0, 1fr); }
  .onset-work-area.list-hidden { grid-template-columns: minmax(0, 1fr); }
  .onset-relation-drawer { width: min(350px, 36vw); }
  .panel-three-column { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 820px) {
  .onset-vfx-page { overflow: auto; }
  .onset-vfx-heading { align-items: flex-start; }
  .onset-work-area { grid-template-columns: minmax(0, 1fr); overflow: visible; }
  .onset-work-area .panel-context-list { max-height: 180px; }
  .onset-work-main { overflow: visible; }
  .onset-relation-drawer { top: 8px; right: 8px; bottom: 8px; width: calc(100vw - 32px); min-width: 0; }
  .take-table { min-width: 0; }
  .take-table-head, .take-table-row { grid-template-columns: minmax(90px, 1.2fr) 42px 38px minmax(70px, 1fr) 60px; gap: 4px; padding: 0 5px; }
}

@media (max-width: 1280px) {
  .panel-three-column { grid-template-columns: 210px minmax(540px, 1fr); }
  .panel-health-rail { display: none; }
  .onset-panel-root.action-open .panel-health-rail { position: fixed; top: var(--topbar-height); right: 0; bottom: 0; width: 320px; display: block; padding-top: 4px; z-index: 59; box-shadow: var(--shadow); }
  .onset-panel-root.action-open .panel-health-rail > section:not(.panel-action-editor) { display: none; }
  .panel-context-bar { grid-template-columns: repeat(3, minmax(130px, 1fr)) 36px; }
  .panel-context-bar > div:nth-child(4) { display: none; }
  .artifact-collection.gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .onset-panel-root { grid-template-rows: auto minmax(0, 1fr) auto; }
  .panel-context-bar { grid-template-columns: 1fr 1fr 36px; padding: 5px; }
  .panel-context-bar > div { min-height: 38px; padding: 0 7px; }
  .panel-context-bar > div:nth-child(3),
  .panel-context-bar > div:nth-child(4) { display: none; }
  .panel-three-column { grid-template-columns: 1fr; overflow: auto; }
  .panel-context-list { max-height: 220px; border-right: 0; border-bottom: 1px solid var(--line); }
  .panel-composite { overflow: visible; padding: 8px; }
  .overview-field-grid,
  .onset-card-grid,
  .plate-strip,
  .artifact-collection.gallery { grid-template-columns: 1fr; }
  .overview-field { border-right: 0; }
  .panel-section > header { align-items: flex-start; flex-wrap: wrap; }
  .panel-bottom-commit > span { grid-template-columns: auto 1fr; }
  .panel-bottom-commit small { grid-column: 1 / -1; }
}

/* Shooting Dailies: day summary and single-record reading. */
.shooting-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 28px; border-bottom:1px solid var(--line, #dce3df); }
.shooting-heading h1 { margin:4px 0 0; font-size:24px; }
.panel-reader-control-bar { display:flex; align-items:center; justify-content:flex-end; gap:10px; min-width:0; padding:8px; border:1px solid var(--line, #dce3df); border-radius:10px; background:var(--surface-soft, #f5f7f6); box-shadow:0 1px 2px rgba(18,43,35,.035); }
.panel-reader-mode-status { min-width:74px; display:grid; gap:2px; padding:3px 13px 3px 7px; border-right:1px solid var(--line, #dce3df); }
.panel-reader-mode-status small { color:var(--muted, #5c6d66); font-size:9px; font-weight:700; letter-spacing:.06em; }
.panel-reader-mode-status strong { max-width:150px; overflow:hidden; color:var(--ink, #183028); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.panel-reader-control-navigation { min-width:0; }
.panel-reader-control-actions { display:flex; align-items:center; gap:7px; padding-left:10px; border-left:1px solid var(--line, #dce3df); }
.panel-reader-control-bar .button { min-height:40px; padding:8px 12px; border-radius:7px; white-space:nowrap; }
.panel-reader-control-bar [aria-pressed="true"] { border-color:color-mix(in srgb, var(--accent, #147d68) 46%, var(--line, #dce3df)); background:var(--selected, #e6f3ee); color:var(--accent, #147d68); }
.panel-page-refresh { display:inline-flex; align-items:center; gap:7px; }
.panel-page-refresh .vds-icon { width:16px; height:16px; }
.panel-page-refresh[aria-busy="true"] .vds-icon { animation:panel-refresh-spin .8s linear infinite; }
@keyframes panel-refresh-spin { to { transform:rotate(360deg); } }
.panel-reader-control-bar :is(button, select, input):focus-visible { outline:3px solid color-mix(in srgb, var(--accent, #147d68) 24%, transparent); outline-offset:2px; }
.panel-data-navigator { display:flex; align-items:center; gap:7px; min-width:0; }
.panel-data-navigator-primary, .panel-data-navigator-options { display:flex; align-items:center; gap:6px; min-width:0; }
.panel-data-navigator-step { padding-inline:10px !important; }
.panel-data-navigator-current { min-width:176px; display:grid; grid-template-columns:minmax(0,1fr) auto 36px; grid-template-rows:auto auto; align-items:center; gap:1px 8px; min-height:40px; padding:4px 5px 4px 10px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface, #fff); }
.panel-data-navigator-current small { grid-column:1 / 3; color:var(--muted, #5c6d66); font-size:9px; font-weight:700; }
.panel-data-navigator-current strong { min-width:0; overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.panel-data-navigator-current em { color:var(--muted, #5c6d66); font-size:10px; font-style:normal; white-space:nowrap; }
.panel-data-navigator-current-date { position:relative; grid-column:3; grid-row:1 / 3; width:34px; height:34px; overflow:hidden; border-left:1px solid var(--line, #dce3df); }
.panel-data-navigator-current-date input { position:absolute; inset:0; width:34px; height:34px; padding:0; border:0; background:transparent; color:transparent; cursor:pointer; }
.panel-data-navigator-current-date input::-webkit-datetime-edit { display:none; }
.panel-data-navigator-current-date input::-webkit-calendar-picker-indicator { width:18px; height:18px; margin:8px; padding:0; cursor:pointer; opacity:.72; }
.panel-data-navigator-sort { display:block; color:var(--muted, #5c6d66); }
.panel-data-navigator-sort select { width:132px; min-height:40px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface, #fff); color:var(--text, #21302a); padding:7px 30px 7px 9px; font:inherit; font-size:11px; }
.panel-hub-back { margin:0 0 12px; }
.onset-panel-root.panel-hub-mode { display:block; overflow:hidden; }
.panel-hub { min-height:100%; padding:30px; overflow-y:auto; }
.panel-hub-heading { max-width:840px; display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:24px; border-bottom:1px solid var(--line, #dce3df); }
.panel-hub-heading h1 { margin:6px 0 10px; font-size:28px; }
.panel-hub-heading p:last-child { margin:0; color:var(--muted, #5c6d66); line-height:1.7; }
.panel-hub-group { margin-top:30px; }
.panel-hub-group > header h2 { margin:5px 0 16px; font-size:18px; }
.panel-hub-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 520px)); gap:16px; }
.panel-workspace-card { display:grid; grid-template-columns:56px minmax(0,1fr) auto; align-items:center; gap:18px; width:100%; min-height:160px; padding:22px; border:1px solid var(--line, #dce3df); border-radius:6px; background:var(--surface, #fff); color:inherit; text-align:left; cursor:pointer; }
.panel-workspace-card:hover { border-color:var(--accent, #147d68); background:var(--selected, #e6f3ee); }
.panel-workspace-mark { display:grid; place-items:center; align-self:stretch; border-right:1px solid var(--line, #dce3df); color:var(--muted, #5c6d66); font-size:12px; line-height:1.4; }
.panel-workspace-mark b { color:var(--accent, #147d68); font-size:18px; }
.panel-workspace-copy { min-width:0; display:flex; flex-direction:column; gap:5px; }
.panel-workspace-copy > small { color:var(--accent, #147d68); font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.panel-workspace-copy strong { font-size:19px; }
.panel-workspace-copy p { margin:4px 0; color:var(--muted, #5c6d66); line-height:1.55; }
.panel-workspace-copy em { color:var(--muted, #5c6d66); font-size:12px; font-style:normal; }
.panel-workspace-open { color:var(--accent, #147d68); white-space:nowrap; font-size:13px; }
.panel-hub-empty { margin-top:28px; padding:24px 0; color:var(--muted, #5c6d66); }
.shooting-workspace { display:grid; grid-template-columns:248px minmax(0,1fr); min-height:calc(100vh - 190px); }
.shooting-workspace.days-collapsed { grid-template-columns:minmax(0,1fr); }
.shooting-workspace.days-collapsed .shooting-days { display:none; }
.shooting-days { padding:20px 12px; border-right:1px solid var(--line, #dce3df); }
.shooting-days h2 { margin:0 10px 14px; font-size:14px; }
.shooting-day { display:flex; flex-direction:column; gap:6px; width:100%; padding:12px; margin-bottom:6px; border:1px solid transparent; background:transparent; border-radius:4px; text-align:left; color:inherit; cursor:pointer; }
.shooting-day.active { background:var(--selected, #e6f3ee); border-color:var(--accent, #147d68); }
.shooting-day small { color:var(--muted, #5c6d66); }
.shooting-workspace > main { min-width:0; padding:28px; }
.shooting-summary > header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.shooting-summary h2, .shooting-reader h2 { margin:6px 0; font-size:24px; overflow-wrap:anywhere; }
.shooting-summary-controls { display:flex; align-items:flex-end; gap:14px; color:var(--muted, #5c6d66); font-size:12px; }
.shooting-group-picker { display:grid; gap:5px; }
.shooting-group-picker > span { font-size:10px; }
.shooting-group-picker select { min-width:132px; padding:8px 30px 8px 10px; border:1px solid var(--line, #dce3df); border-radius:4px; background:var(--surface, #fff); color:inherit; }
.shooting-summary-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,380px); align-items:start; gap:20px; }
.shooting-unit-stack { min-width:0; }
.shooting-unit-group { margin-top:18px; border:1px solid var(--line, #dce3df); border-radius:6px; overflow:hidden; background:var(--surface, #fff); }
.shooting-unit-stack .shooting-unit-group:first-child { margin-top:0; }
.shooting-unit-group > header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 16px; background:var(--surface-soft, #f5f7f6); border-bottom:1px solid var(--line, #dce3df); }
.shooting-unit-group > header h3 { margin:3px 0 0; font-size:15px; }
.shooting-unit-group > header > span { color:var(--muted, #5c6d66); font-size:12px; }
.shooting-unit-group .shooting-log { padding-left:16px; padding-right:16px; }
.shooting-log { width:100%; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:20px 8px; color:inherit; background:transparent; border:0; border-bottom:1px solid var(--line, #dce3df); text-align:left; cursor:pointer; }
.shooting-log:hover { background:var(--selected, #e6f3ee); }
.shooting-log.selected { box-shadow:inset 3px 0 0 var(--accent, #147d68); }
.shooting-log > span:first-child { min-width:0; }
.shooting-log strong { font-size:17px; overflow-wrap:anywhere; }
.shooting-log p { margin:8px 0; line-height:1.6; overflow-wrap:anywhere; white-space:pre-wrap; }
.shooting-log-vfx { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; color:var(--muted, #5c6d66); }
.shooting-log-vfx small { color:var(--accent, #147d68); font-weight:700; }
.shooting-log small { color:var(--muted, #5c6d66); }
.shooting-read-link { white-space:nowrap; color:var(--accent, #147d68); font-size:13px; }
.shooting-properties { position:sticky; top:0; overflow:hidden; border:1px solid var(--line, #dce3df); border-radius:6px; background:var(--surface, #fff); }
.shooting-properties > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:16px; border-bottom:1px solid var(--line, #dce3df); background:var(--surface-soft, #f5f7f6); }
.shooting-properties > header h3 { margin:4px 0 0; font-size:17px; overflow-wrap:anywhere; }
.shooting-properties > header > small { color:var(--muted, #5c6d66); white-space:nowrap; }
.shooting-properties dl { margin:0; padding:4px 16px; }
.shooting-properties dl > div { padding:13px 0; border-bottom:1px solid var(--line, #dce3df); }
.shooting-properties dl > div:last-child { border-bottom:0; }
.shooting-properties dt { margin-bottom:6px; color:var(--muted, #5c6d66); font-size:11px; }
.shooting-properties dd { margin:0; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.shooting-properties footer { display:flex; flex-wrap:wrap; gap:8px; padding:14px 16px; border-top:1px solid var(--line, #dce3df); }
.shooting-properties .panel-empty { margin:0; padding:24px 18px; }
.shooting-back { margin-bottom:24px; }
.shooting-reader { max-width:960px; }
.shooting-reader-top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.shooting-reader-top .shooting-back { margin-bottom:0; }
.shooting-reader-nav { display:flex; align-items:center; gap:8px; }
.shooting-reader-nav span { min-width:54px; color:var(--muted, #5c6d66); font-size:12px; text-align:center; }
.shooting-reader dl { margin:28px 0; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.shooting-reader dl > div { min-width:0; padding-bottom:20px; border-bottom:1px solid var(--line, #dce3df); }
.shooting-reader dt { font-size:12px; color:var(--muted, #5c6d66); margin-bottom:10px; }
.shooting-reader dd { margin:0; font-size:15px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.shooting-reader footer { display:flex; gap:20px; align-items:center; }
@media(max-width:850px) {
  .panel-hub { padding:22px 16px; }
  .panel-hub-grid { grid-template-columns:minmax(0,1fr); }
  .panel-workspace-card { grid-template-columns:46px minmax(0,1fr); }
  .panel-workspace-open { grid-column:2; }
  .shooting-heading { padding:20px 16px; flex-wrap:wrap; }
  .panel-reader-control-bar { width:100%; justify-content:flex-start; flex-wrap:wrap; }
  .panel-reader-mode-status { flex:1; }
  .panel-reader-control-navigation { order:3; width:100%; padding-top:8px; border-top:1px solid var(--line, #dce3df); }
  .panel-data-navigator { width:100%; }
  .panel-data-navigator-primary { flex:1; }
  .panel-data-navigator-step { flex:1 1 auto; }
  .panel-data-navigator-current { flex:2 1 176px; }
  .panel-data-navigator-options { flex:1 1 132px; }
  .panel-data-navigator-sort, .panel-data-navigator-sort select { width:100%; }
  .shooting-workspace { grid-template-columns:minmax(0,1fr); }
  .shooting-workspace.days-collapsed .shooting-days { display:flex; }
  .shooting-days { display:flex; gap:8px; overflow-x:auto; border-right:0; border-bottom:1px solid var(--line, #dce3df); }
  .shooting-days h2 { display:none; }
  .shooting-day { flex:0 0 200px; }
  .shooting-workspace > main { padding:20px 16px; }
  .shooting-summary > header { align-items:flex-start; flex-direction:column; }
  .shooting-summary-controls { width:100%; justify-content:space-between; }
  .shooting-summary-grid { grid-template-columns:minmax(0,1fr); }
  .shooting-properties { position:static; }
  .shooting-reader dl { grid-template-columns:1fr; }
  .shooting-reader-top { align-items:flex-start; flex-direction:column; }
  .shooting-log { gap:12px; }
}
.onset-panel-root.shooting-mode { display:flex; flex-direction:column; overflow:hidden; }
.shooting-mode .shooting-heading { flex:none; }
.shooting-mode .shooting-workspace { flex:1; min-height:0; overflow:hidden; }
.shooting-mode .shooting-days, .shooting-mode .shooting-workspace > main { min-height:0; overflow-y:auto; }
.shooting-pending { color:var(--warning, #805616); font-size:12px; }
@media(max-width:850px) {
  .shooting-mode .shooting-workspace { grid-template-rows:100px minmax(0,1fr); }
  .shooting-mode .shooting-days { padding:10px; overflow-y:hidden; min-width:0; }
  .shooting-day { margin-bottom:0; }
}
.onset-panel-root:not(.shooting-mode) { grid-template-rows:auto auto minmax(0,1fr) auto; }
.onset-panel-root > .shooting-back { justify-self:start; margin:8px 16px; }

.panel-view-switcher { display:inline-flex; align-items:center; gap:4px; padding:3px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface, #fff); }
.panel-view-switcher button { min-width:52px; padding:7px 11px; border:0; border-radius:5px; background:transparent; color:var(--muted, #5c6d66); cursor:pointer; }
.panel-view-switcher button.active, .panel-view-switcher button[aria-pressed="true"] { background:var(--selected, #e6f3ee); color:var(--accent, #147d68); font-weight:700; }
.shooting-view-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--line, #dce3df); }
.shooting-view-header h2 { margin:5px 0; font-size:25px; }
.shooting-view-header p:last-child { margin:0; color:var(--muted, #5c6d66); font-size:12px; }
.shooting-summary-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.shooting-summary-metrics article { display:grid; gap:5px; min-width:0; padding:14px 16px; border:1px solid var(--line, #dce3df); border-radius:8px; background:var(--surface-soft, #f5f7f6); }
.shooting-summary-metrics article:nth-child(2) { background:var(--selected, #e6f3ee); }
.shooting-summary-metrics article:last-child { background:var(--warning-bg, #fff3da); }
.shooting-summary-metrics span, .shooting-summary-metrics small { color:var(--muted, #5c6d66); font-size:11px; }
.shooting-summary-metrics strong { font-size:26px; }
.shooting-summary-main { display:grid; grid-template-columns:minmax(0,1fr) minmax(270px,340px); gap:14px; margin-top:14px; }
.shooting-progress-panel, .shooting-attention-panel { border:1px solid var(--line, #dce3df); border-radius:8px; background:var(--surface, #fff); }
.shooting-progress-panel > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 16px 10px; }
.shooting-progress-panel h3, .shooting-attention-panel h3, .shooting-related-summary h3 { margin:0; font-size:15px; }
.shooting-progress-panel > header small { color:var(--muted, #5c6d66); }
.shooting-progress-panel > div { padding:0 14px 14px; }
.shooting-unit-progress { display:grid; grid-template-columns:90px minmax(0,1fr) 52px 64px; align-items:center; gap:12px; width:100%; padding:12px; margin-top:8px; border:0; border-radius:6px; background:var(--surface-soft, #f5f7f6); color:inherit; text-align:left; cursor:pointer; }
.shooting-unit-progress:first-child { background:var(--selected, #e6f3ee); }
.shooting-unit-progress span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shooting-unit-progress em { color:var(--accent, #147d68); font-style:normal; font-weight:700; }
.shooting-unit-progress small { color:var(--warning, #805616); text-align:right; }
.shooting-attention-panel { padding:15px; }
.shooting-attention-panel > button { display:grid; gap:4px; width:100%; margin-top:9px; padding:10px 11px; border:0; border-radius:6px; background:var(--warning-bg, #fff3da); color:inherit; text-align:left; cursor:pointer; }
.shooting-attention-panel > button:nth-of-type(2) { background:var(--danger-bg, #fceeee); }
.shooting-attention-panel > button small { color:var(--muted, #5c6d66); }
.shooting-related-summary { margin-top:14px; }
.shooting-related-summary > header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:9px; }
.shooting-related-summary > header small { color:var(--muted, #5c6d66); }
.shooting-related-summary > div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.shooting-related-summary article { display:grid; gap:4px; padding:12px 14px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface-soft, #f5f7f6); }
.shooting-related-summary article span, .shooting-related-summary article small { color:var(--muted, #5c6d66); font-size:11px; }
.shooting-related-summary article strong { font-size:17px; }
.shooting-summary-selection { max-width:420px; margin:14px 0 0 auto; }
.shooting-list-filters { display:grid; grid-template-columns:minmax(220px,1fr) repeat(4,auto) auto; align-items:center; gap:8px; margin-bottom:14px; }
.shooting-list-filters input, .shooting-list-filters select { min-width:0; padding:9px 10px; border:1px solid var(--line, #dce3df); border-radius:6px; background:var(--surface, #fff); color:inherit; }
.shooting-list-filters > span { color:var(--muted, #5c6d66); font-size:12px; text-align:right; }
.shooting-list-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; align-items:start; }
.shooting-list-layout.has-properties { grid-template-columns:minmax(0,1fr) minmax(300px,380px); }
.shooting-list-table { min-width:0; overflow:hidden; border:1px solid var(--line, #dce3df); border-radius:8px; background:var(--surface, #fff); }
.shooting-list-header, .shooting-list-row { display:grid; grid-template-columns:58px 92px 112px minmax(220px,1fr) 190px 82px 52px; align-items:center; gap:10px; }
.shooting-list-header { padding:11px 13px; border-bottom:1px solid var(--line, #dce3df); background:var(--surface-soft, #f5f7f6); color:var(--muted, #5c6d66); font-size:11px; font-weight:700; }
.shooting-list-row { width:100%; min-height:64px; padding:10px 13px; border:0; border-bottom:1px solid var(--line, #dce3df); background:var(--surface, #fff); color:inherit; text-align:left; cursor:pointer; }
.shooting-list-row:nth-child(even) { background:var(--surface-soft, #f5f7f6); }
.shooting-list-row:hover, .shooting-list-row.selected { background:var(--selected, #e6f3ee); }
.shooting-list-row:last-child { border-bottom:0; }
.shooting-list-row > span, .shooting-list-row > strong, .shooting-list-row > em { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shooting-list-row > span:nth-child(4) { display:grid; gap:4px; }
.shooting-list-row b, .shooting-list-row small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shooting-list-row small { color:var(--muted, #5c6d66); font-weight:400; }
.shooting-list-row em { color:var(--accent, #147d68); font-style:normal; font-weight:700; }
.shooting-list-row i { color:var(--accent, #147d68); font-size:12px; font-style:normal; white-space:nowrap; }
.shooting-mode.shooting-reader-mode .shooting-heading { gap:16px; padding:15px 24px; }
.shooting-mode.shooting-reader-mode .shooting-heading h1 { font-size:21px; }
.shooting-reader-mode .panel-hub-back { margin-bottom:6px; }
.shooting-reader-mode .panel-reader-control-bar { padding:5px; gap:6px; }
.shooting-reader-mode .panel-reader-control-actions { gap:5px; padding-left:6px; }
.shooting-reader-mode .panel-reader-control-bar .button { min-height:36px; padding:6px 9px; }
.panel-reader-more-actions { position:relative; flex:none; }
.panel-reader-more-actions > summary { display:flex; align-items:center; min-height:36px; padding:6px 9px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface, #fff); color:var(--ink, #183028); font-size:12px; font-weight:700; list-style:none; white-space:nowrap; cursor:pointer; }
.panel-reader-more-actions > summary::-webkit-details-marker { display:none; }
.panel-reader-more-actions > summary::after { content:"⌄"; margin-left:7px; color:var(--muted, #5c6d66); }
.panel-reader-more-actions > summary:focus-visible { outline:3px solid color-mix(in srgb, var(--accent, #147d68) 24%, transparent); outline-offset:2px; }
.panel-reader-more-actions[open] > summary { border-color:var(--accent, #147d68); color:var(--accent, #147d68); }
.panel-reader-more-actions > div { position:absolute; z-index:12; top:calc(100% + 6px); right:0; display:grid; gap:5px; min-width:180px; padding:8px; border:1px solid var(--line, #dce3df); border-radius:8px; background:var(--surface, #fff); box-shadow:0 12px 28px rgba(18,43,35,.16); }
.panel-reader-more-actions > div .button { justify-content:flex-start; width:100%; text-align:left; }
.shooting-mode.shooting-reader-mode .shooting-workspace > main { padding:18px 24px; }
.shooting-continuous-reader { width:min(100%, 1280px); margin:0 auto; outline:none; }
.shooting-continuous-reader:focus-visible { border-radius:8px; box-shadow:0 0 0 3px color-mix(in srgb, var(--accent, #147d68) 24%, transparent); }
.shooting-continuous-reader > .shooting-view-header { align-items:center; gap:12px; margin-bottom:12px; padding-bottom:10px; }
.shooting-continuous-reader > .shooting-view-header h2 { margin:2px 0 3px; font-size:22px; }
.panel-query-grouping { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; margin:0 0 10px; padding:10px 12px; border:1px solid var(--line, #dce3df); border-radius:8px; background:var(--surface, #fff); }
.panel-reader-query-row { grid-column:1 / -1; display:grid; grid-template-columns:minmax(240px,1fr) auto minmax(180px,220px); align-items:end; gap:10px; }
.panel-reader-search, .panel-current-group { display:grid; gap:5px; min-width:0; color:var(--muted, #5c6d66); font-size:11px; font-weight:700; }
.panel-reader-search input, .panel-current-group select, .panel-group-levels select, .panel-condition-row input, .panel-condition-row select { min-width:0; height:36px; padding:7px 9px; border:1px solid var(--line, #dce3df); border-radius:6px; background:var(--surface, #fff); color:inherit; }
.panel-reader-scope { display:flex; align-items:center; height:36px; padding:3px; border:1px solid var(--line, #dce3df); border-radius:7px; background:var(--surface-soft, #f5f7f6); }
.panel-reader-scope button { height:28px; padding:0 11px; border:0; border-radius:5px; background:transparent; color:var(--muted, #5c6d66); font-size:12px; font-weight:700; cursor:pointer; }
.panel-reader-scope button.active { background:var(--surface, #fff); color:var(--accent, #147d68); box-shadow:0 1px 4px rgba(18,43,35,.11); }
.panel-reader-scope button:disabled { opacity:.45; cursor:not-allowed; }
.panel-query-conditions { grid-column:2; grid-row:2; align-self:end; border-top:0; padding:0 0 7px; }
.panel-query-conditions summary { width:max-content; color:var(--accent, #147d68); font-size:12px; font-weight:700; cursor:pointer; }
.panel-query-conditions[open] { grid-column:1 / -1; grid-row:auto; padding:7px 0 0; border-top:1px solid var(--line, #dce3df); }
.panel-query-conditions > div { display:grid; gap:7px; margin-top:7px; }
.panel-condition-row { display:grid; grid-template-columns:minmax(140px,.8fr) minmax(110px,.55fr) minmax(180px,1fr); gap:8px; }
.panel-group-levels { grid-column:1; grid-row:2; display:grid; grid-template-columns:auto repeat(3,minmax(120px,1fr)); align-items:end; gap:8px; border-top:1px solid var(--line, #dce3df); padding-top:7px; }
.panel-group-levels > span { align-self:center; color:var(--muted, #5c6d66); font-size:11px; font-weight:700; }
.panel-group-levels label { display:grid; gap:5px; color:var(--muted, #5c6d66); font-size:10px; }
.shooting-reader-toolbar { position:sticky; top:0; z-index:3; display:flex; align-items:center; gap:11px; min-height:44px; margin:0 0 12px; padding:7px 11px; border:1px solid color-mix(in srgb, var(--accent, #147d68) 32%, var(--line, #dce3df)); border-radius:7px; background:color-mix(in srgb, var(--surface, #fff) 97%, transparent); box-shadow:0 4px 14px rgba(18, 43, 35, .08); backdrop-filter:blur(8px); }
.shooting-reader-toolbar .shooting-reader-day-chip { flex:none; max-width:180px; overflow:hidden; padding:5px 9px; border-radius:4px; background:var(--accent, #147d68); color:#fff; font-size:12px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.shooting-reader-toolbar strong { flex:none; min-width:54px; color:var(--accent, #147d68); }
.shooting-reader-toolbar [data-shooting-reader-group] { flex:1; min-width:0; overflow:hidden; color:var(--ink, #183028); font-size:12px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.shooting-reader-toolbar small { flex:none; color:var(--muted, #5c6d66); font-size:11px; white-space:nowrap; }
.shooting-reader-empty-day { margin:0 0 12px; padding:9px 12px; border:1px solid color-mix(in srgb, var(--accent, #147d68) 30%, var(--line, #dce3df)); border-radius:6px; background:color-mix(in srgb, var(--selected, #e6f3ee) 46%, var(--surface, #fff)); color:var(--ink, #183028); font-size:12px; }
.shooting-reader-stream { display:grid; gap:12px; min-width:0; padding-bottom:28px; }
.shooting-reader-leaf { display:grid; gap:9px; min-width:0; }
.panel-reader-group-boundary { scroll-margin-top:58px; }
.shooting-reader-group-heading { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:baseline; gap:10px; margin-top:6px; padding:7px 11px; border-left:3px solid var(--line, #dce3df); color:var(--muted, #5c6d66); }
.shooting-reader-group-heading span { min-width:62px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.shooting-reader-group-heading strong { color:var(--ink, #183028); font-size:15px; overflow-wrap:anywhere; }
.shooting-reader-group-heading small { font-size:11px; }
.shooting-reader-group-heading.level-1 { margin-top:22px; padding:13px 16px; border:1px solid color-mix(in srgb, var(--accent, #147d68) 38%, var(--line, #dce3df)); border-top:3px solid var(--accent, #147d68); border-left:5px solid var(--accent, #147d68); border-radius:7px 7px 0 0; background:color-mix(in srgb, var(--selected, #e6f3ee) 76%, var(--surface, #fff)); box-shadow:0 4px 12px rgba(18,43,35,.05); }
.shooting-reader-group-heading.level-1 span { color:var(--accent, #147d68); }
.shooting-reader-group-heading.level-1 strong { font-size:20px; }
.shooting-reader-group-heading.level-2 { margin-left:16px; border-left-color:color-mix(in srgb, var(--accent, #147d68) 55%, var(--line, #dce3df)); }
.shooting-reader-group-heading.level-3 { margin-left:32px; padding-block:6px; }
.shooting-reader-group-footer { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; min-height:42px; margin:10px 0 30px; padding:9px 15px; border:1px solid color-mix(in srgb, var(--accent, #147d68) 30%, var(--line, #dce3df)); border-left:5px solid var(--accent, #147d68); border-radius:0 0 7px 7px; color:var(--muted, #5c6d66); background:color-mix(in srgb, var(--selected, #e6f3ee) 54%, var(--surface, #fff)); }
.shooting-reader-group-footer span { font-size:10px; font-weight:800; letter-spacing:.06em; }
.shooting-reader-group-footer strong { overflow:hidden; color:var(--ink, #183028); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.shooting-reader-group-footer small { font-size:11px; }
.shooting-reader-card { min-width:0; overflow:hidden; scroll-margin-top:62px; border:1px solid var(--line, #dce3df); border-left:3px solid transparent; border-radius:8px; background:var(--surface, #fff); transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.shooting-reader-card.active, .shooting-reader-card[aria-current="true"] { border-color:var(--accent, #147d68); border-left-color:var(--accent, #147d68); background:color-mix(in srgb, var(--selected, #e6f3ee) 32%, var(--surface, #fff)); box-shadow:0 8px 22px rgba(18, 43, 35, .08); }
.shooting-reader-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:12px 16px 10px; border-bottom:1px solid var(--line, #dce3df); background:var(--surface-soft, #f5f7f6); }
.shooting-reader-card > header > div { min-width:0; display:grid; gap:5px; }
.shooting-reader-card > header span, .shooting-reader-card > header small { color:var(--muted, #5c6d66); font-size:11px; }
.shooting-reader-card > header strong { font-size:17px; overflow-wrap:anywhere; }
.shooting-reader-card > header em { color:var(--accent, #147d68); font-size:11px; font-style:normal; font-weight:700; white-space:nowrap; }
.shooting-reader-content { display:grid; grid-template-columns:minmax(0,1fr); gap:0 20px; padding:0 16px; }
.shooting-reader-content.has-vfx { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); }
.shooting-reader-content section { min-width:0; padding:12px 0; }
.shooting-reader-content section + section { border-left:1px solid var(--line, #dce3df); padding-left:20px; }
.shooting-reader-content span { color:var(--muted, #5c6d66); font-size:11px; font-weight:700; }
.shooting-reader-content p { margin:6px 0 0; font-size:14px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.shooting-reader-card > footer { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:8px 16px; border-top:1px solid var(--line, #dce3df); color:var(--muted, #5c6d66); font-size:11px; }

@media(max-width:1100px) {
  .shooting-reader-mode .panel-reader-control-bar { flex-wrap:wrap; }
  .shooting-reader-mode .panel-reader-control-actions { border-left:0; }
  .shooting-summary-metrics, .shooting-related-summary > div { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .shooting-list-filters { grid-template-columns:minmax(220px,1fr) repeat(2,auto); }
  .shooting-list-layout.has-properties { grid-template-columns:minmax(0,1fr); }
  .shooting-list-header, .shooting-list-row { grid-template-columns:52px 78px 100px minmax(180px,1fr) 76px 48px; }
  .shooting-list-header > span:nth-child(5), .shooting-list-row > span:nth-child(5) { display:none; }
}

@media(max-width:850px) {
  .shooting-mode.shooting-reader-mode .shooting-heading { padding:12px 16px; }
  .shooting-reader-mode .panel-reader-mode-status { display:none; }
  .shooting-mode.shooting-reader-mode .shooting-workspace > main { padding:14px 16px; }
  .shooting-continuous-reader > .shooting-view-header { flex-direction:row; align-items:center; }
  .shooting-continuous-reader > .shooting-view-header h2 { font-size:20px; }
  .panel-query-grouping { grid-template-columns:minmax(0,1fr); }
  .panel-query-conditions, .panel-query-conditions[open] { grid-column:1; grid-row:auto; padding:6px 0 0; border-top:1px solid var(--line, #dce3df); }
  .panel-group-levels { grid-column:1; grid-row:auto; display:flex; align-items:end; gap:8px; overflow-x:auto; }
  .panel-group-levels > span { flex:none; align-self:center; }
  .panel-group-levels label { flex:0 0 150px; }
  .shooting-view-header { align-items:flex-start; flex-direction:column; }
  .shooting-summary-metrics, .shooting-related-summary > div { grid-template-columns:minmax(0,1fr); }
  .shooting-summary-main { grid-template-columns:minmax(0,1fr); }
  .shooting-list-filters { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .shooting-list-filters input { grid-column:1 / -1; }
  .shooting-list-header { display:none; }
  .shooting-list-row { grid-template-columns:54px 72px minmax(0,1fr) 48px; }
  .shooting-list-row > span:nth-child(3), .shooting-list-row > span:nth-child(5), .shooting-list-row > em { display:none; }
  .shooting-reader-toolbar { gap:8px; overflow:hidden; }
  .shooting-reader-toolbar .shooting-reader-day-chip { max-width:120px; }
  .shooting-reader-toolbar small { display:none; }
  .panel-reader-query-row { grid-template-columns:minmax(0,1fr) auto; align-items:end; }
  .panel-current-group { grid-column:1 / -1; }
  .panel-reader-scope { width:max-content; }
  .panel-condition-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .panel-condition-row input { grid-column:1 / -1; }
  .shooting-reader-group-heading.level-2 { margin-left:8px; }
  .shooting-reader-group-heading.level-3 { margin-left:16px; }
  .shooting-reader-card > header { flex-direction:column; gap:9px; padding:15px 16px 12px; }
  .shooting-reader-content, .shooting-reader-content.has-vfx { grid-template-columns:minmax(0, 1fr); padding:0 16px; }
  .shooting-reader-content section + section { border-left:0; border-top:1px solid var(--line, #dce3df); padding-left:0; }
  .shooting-reader-card > footer { align-items:flex-start; flex-direction:column; padding:11px 16px; }
}

@media(max-width:560px) {
  .shooting-continuous-reader > .shooting-view-header { flex-wrap:wrap; }
  .shooting-reader-toolbar [data-shooting-reader-group] { display:none; }
  .panel-reader-query-row { grid-template-columns:minmax(0,1fr); }
  .panel-current-group { grid-column:1; }
}

@media (prefers-reduced-motion: reduce) {
  .shooting-reader-stream { scroll-behavior:auto; }
  .shooting-reader-card { transition:none; }
}