:root {
  --ink: #0d0f0f;
  --ink-soft: #151918;
  --panel: #1b201f;
  --panel-soft: #232927;
  --paper: #f2f0e9;
  --paper-soft: #e8e6de;
  --line: rgba(242, 240, 233, .16);
  --line-dark: rgba(13, 15, 15, .16);
  --muted: #a9afa8;
  --muted-dark: #606864;
  --amber: #e5a35f;
  --coral: #dd6d54;
  --jade: #91b7a8;
  --white: #fffdf8;
  --radius: 6px;
  --shadow: 0 18px 55px rgba(0, 0, 0, .22);
  color-scheme: dark;
  font-family: Inter, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 320px; background: var(--ink); }
body { margin: 0; min-width: 320px; background: var(--ink); color: var(--paper); font-size: 15px; line-height: 1.55; }
button, input, textarea, select { font: inherit; letter-spacing: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3, strong { line-height: 1.15; }
.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; }

.app-startup { position: fixed; inset: 0; z-index: 30; display: grid; place-content: center; gap: 18px; background: var(--ink); color: var(--paper); text-align: center; transition: opacity .24s ease, visibility .24s ease; }
.app-startup img { width: 58px; height: 58px; object-fit: contain; margin: 0 auto; }
.app-startup.is-ready { opacity: 0; visibility: hidden; pointer-events: none; }

.app-shell { min-height: 100vh; }
.site-navigation-shell { position: sticky; top: 0; z-index: 20; background: rgba(13, 15, 15, .97); }
.site-header { display: flex; align-items: center; gap: 26px; min-height: 74px; padding: 12px clamp(18px, 4vw, 64px); border-bottom: 1px solid var(--line); background: rgba(13, 15, 15, .97); }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; border: 0; padding: 0; color: var(--paper); background: none; text-align: left; }
.brand img { width: 38px; height: 38px; object-fit: contain; }
.brand span { display: grid; gap: 2px; }
.brand strong { font-size: 16px; font-weight: 700; }
.brand small { color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.primary-nav { display: flex; flex: 1 1 auto; align-items: center; gap: 3px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.primary-nav::-webkit-scrollbar { display: none; }
.nav-item { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; min-height: 40px; border: 0; border-bottom: 2px solid transparent; padding: 0 11px; color: var(--muted); background: transparent; white-space: nowrap; }
.nav-item span { color: #747b75; font-size: 10px; }
.nav-divider { align-self: center; color: var(--line); font-size: 15px; }
.nav-item:hover, .nav-item.active { border-bottom-color: var(--amber); color: var(--paper); }
.nav-item.active span { color: var(--amber); }
.nav-item-core { color: var(--jade); font-weight: 700; }
.nav-item-core:hover, .nav-item-core.active { color: var(--white); }
.header-tools { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.model-plaza-link { display: inline-flex; align-items: center; min-height: 34px; padding: 0 8px; border-bottom: 1px solid transparent; color: var(--jade); font-size: 12px; font-weight: 700; white-space: nowrap; }
.model-plaza-link:hover, .model-plaza-link:focus-visible { border-bottom-color: var(--jade); color: var(--paper); }
.points-button, .quiet-button, .account-button { border: 1px solid transparent; background: transparent; color: var(--muted); }
.points-button { display: inline-flex; align-items: center; gap: 5px; padding: 7px 8px; }
.points-button:hover, .quiet-button:hover, .account-button:hover { color: var(--paper); }
.points-glyph { color: var(--amber); font-size: 14px; }
.points-button strong { color: var(--paper); font-size: 13px; }
.points-button small { color: var(--muted); font-size: 11px; }
.background-tasks-button { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 34px; border: 1px solid transparent; padding: 0 9px; color: var(--muted); background: transparent; font-size: 12px; white-space: nowrap; }
.background-tasks-button:hover, .background-tasks-button:focus-visible { color: var(--paper); }
.background-tasks-glyph { color: var(--jade); font-size: 18px; line-height: 1; }
.background-tasks-button strong { display: grid; place-items: center; min-width: 18px; height: 18px; border-radius: 999px; padding: 0 4px; color: var(--ink); background: var(--amber); font-size: 10px; }
.background-tasks-panel { position: fixed; z-index: 25; top: 78px; right: clamp(14px, 4vw, 64px); width: min(430px, calc(100vw - 28px)); max-height: min(72vh, 620px); overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; color: var(--paper); background: rgba(27, 32, 31, .98); box-shadow: var(--shadow); }
.background-tasks-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.background-tasks-panel-head h2 { margin-top: 6px; font-size: 22px; font-weight: 500; }
.background-tasks-panel-head p:last-child { margin-top: 7px; color: var(--muted); font-size: 12px; }
.background-tasks-list { display: grid; gap: 10px; padding: 13px 0 4px; }
.background-task-item { display: grid; gap: 10px; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; background: rgba(255,255,255,.035); }
.background-task-item.is-active { border-color: rgba(229,163,95,.34); }
.background-task-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.background-task-title strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.background-task-title span { flex: 0 0 auto; color: var(--amber); font-size: 11px; }
.background-task-main p { overflow: hidden; margin-top: 6px; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.background-task-main progress { width: 100%; height: 5px; margin-top: 9px; accent-color: var(--amber); }
.background-task-main small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; }
.background-task-main small.is-error { color: #f0a095; }
.background-task-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.background-task-link { border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.background-task-link:hover { color: var(--white); }
.background-tasks-empty { padding: 26px 5px 20px; color: var(--muted); font-size: 13px; text-align: center; }
.background-tasks-footer { display: flex; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.quiet-button { padding: 8px 10px; }
.account-button { display: inline-flex; align-items: center; gap: 7px; padding: 4px 6px; }
.account-button span:last-child { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-button > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--ink); background: var(--amber); font-size: 12px; font-weight: 700; }

.secondary-nav { border-bottom: 1px solid var(--line); background: var(--ink-soft); }
.secondary-nav-track { display: flex; align-items: center; justify-content: flex-end; gap: 2px; width: min(1500px, 100%); min-width: 0; margin: 0 auto; padding: 0 clamp(18px, 4vw, 64px); overflow-x: auto; scrollbar-width: none; }
.secondary-nav-track::-webkit-scrollbar { display: none; }
.secondary-nav-item { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 38px; border: 0; border-bottom: 2px solid transparent; padding: 0 12px; color: var(--muted); background: transparent; font-size: 12px; white-space: nowrap; }
.secondary-nav-item span { color: #747b75; font-size: 9px; }
.secondary-nav-item:hover, .secondary-nav-item.active { border-bottom-color: var(--jade); color: var(--paper); }
.secondary-nav-item.active span { color: var(--jade); }

.primary-button, .secondary-button, .text-button, .back-button, .icon-button { border: 0; border-radius: var(--radius); transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease; }
.primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 0 18px; color: var(--ink); background: var(--amber); font-weight: 700; }
.primary-button:hover { background: #f0b574; transform: translateY(-1px); }
.primary-button.compact { min-height: 34px; padding: 0 13px; font-size: 13px; }
.secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 42px; border: 1px solid var(--line); padding: 0 15px; color: var(--paper); background: transparent; }
.secondary-button:hover { border-color: rgba(229, 163, 95, .7); color: var(--amber); }
.text-button, .back-button { padding: 4px 0; color: var(--amber); background: transparent; }
.text-button:hover, .back-button:hover { color: var(--white); }
.icon-button { display: grid; place-items: center; width: 34px; height: 34px; color: var(--muted); background: transparent; font-size: 25px; line-height: 1; }
.icon-button:hover { color: var(--paper); background: rgba(255, 255, 255, .08); }
.full-width { width: 100%; }

.app-main { width: min(1500px, 100%); margin: 0 auto; padding: 0 clamp(18px, 4vw, 64px) 80px; }
.page { min-height: calc(100vh - 74px); padding-top: 36px; }
.page[hidden] { display: none; }
.eyebrow { color: var(--amber); font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.lead, .page-header > div > p:last-child { max-width: 650px; color: var(--muted); font-size: 16px; }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding: 14px 0 32px; border-bottom: 1px solid var(--line); }
.page-header h1 { margin-top: 8px; font-size: clamp(30px, 4vw, 56px); font-weight: 500; }
.page-header > div > p:last-child { margin-top: 14px; }
.page-header-filter, .case-tabs { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-button, .case-tabs button { min-height: 34px; border: 1px solid var(--line); border-radius: 999px; padding: 0 13px; color: var(--muted); background: transparent; }
.filter-button.active, .case-tabs button.active, .filter-button:hover, .case-tabs button:hover { border-color: var(--amber); color: var(--ink); background: var(--amber); }

.form-stack input, .form-stack textarea, .brief-form-grid input, .brief-form-grid textarea, .brief-form-grid select, .runner-form input, .runner-form textarea, .runner-form select { width: 100%; border: 1px solid var(--line-dark); border-radius: var(--radius); outline: 0; padding: 13px 14px; color: var(--ink); background: rgba(255, 255, 255, .56); }
.form-stack input:focus, .form-stack textarea:focus, .brief-form-grid input:focus, .brief-form-grid textarea:focus, .brief-form-grid select:focus, .runner-form input:focus, .runner-form textarea:focus, .runner-form select:focus { border-color: var(--coral); box-shadow: 0 0 0 3px rgba(221, 109, 84, .14); }
.brief-form-grid input::placeholder, .brief-form-grid textarea::placeholder { color: #878b85; }
.segmented-control { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 3px; }
.segmented-control button { min-height: 34px; border: 1px solid transparent; border-radius: 999px; padding: 0 11px; color: var(--muted-dark); background: transparent; white-space: nowrap; }
.segmented-control button:hover, .segmented-control button.active { color: var(--ink); border-color: var(--ink); }
.progress-spinner { display: inline-block; width: 17px; height: 17px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.recent-section { padding: 32px 0 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.section-heading h2 { margin-top: 8px; font-size: 28px; font-weight: 500; }
.project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.project-card { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 14px; min-height: 128px; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; background: var(--panel); }
.project-card img { width: 100px; height: 103px; border-radius: 4px; object-fit: cover; }
.project-card-copy { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
.project-card-copy > span { color: var(--amber); font-size: 10px; }
.project-card-copy strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.project-card-copy p { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: 12px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.project-card-actions { display: flex; gap: 8px; margin-top: auto; }
.project-card-actions button { border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.project-card-actions button:hover { color: var(--white); }
.empty-state, .loading-state { display: grid; place-content: center; gap: 7px; min-height: 150px; border: 1px dashed var(--line); border-radius: var(--radius); padding: 26px; color: var(--muted); text-align: center; }
.empty-state strong, .loading-state strong { color: var(--paper); font-size: 15px; }
.empty-state span, .loading-state span { font-size: 13px; }
.project-grid > .empty-state { grid-column: 1 / -1; }

.director-page-header { padding-top: 8px; }
.director-page-tools { display: flex; align-items: end; gap: 10px; }
.project-select { display: grid; gap: 4px; min-width: 230px; color: var(--muted); font-size: 11px; }
.project-select select { min-height: 40px; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 11px; color: var(--paper); background: var(--panel); }
.director-stepper { display: flex; gap: 2px; margin: 24px 0; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: thin; }
.director-stepper button { display: inline-flex; flex: 1 0 122px; align-items: center; justify-content: center; gap: 8px; min-height: 46px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; white-space: nowrap; }
.director-stepper button span { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid currentColor; border-radius: 50%; font-size: 10px; }
.director-stepper button.active { border-bottom-color: var(--amber); color: var(--paper); }
.director-stepper button.active span { color: var(--ink); background: var(--amber); }
.director-empty { display: grid; justify-items: start; gap: 13px; max-width: 650px; margin: 70px auto; padding: 30px 0; }
.empty-number { color: var(--amber); font-size: 14px; }
.director-empty h2 { font-size: 38px; font-weight: 500; }
.director-empty p { color: var(--muted); }
.director-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 18px; align-items: start; }
.director-main-column, .director-side-column { display: grid; gap: 18px; min-width: 0; }
.director-panel, .context-panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.director-panel { padding: clamp(19px, 3vw, 32px); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.panel-heading h2 { margin-top: 7px; font-size: 28px; font-weight: 500; }
.panel-heading h3 { margin-top: 7px; font-size: 17px; font-weight: 600; }
.panel-heading.compact { padding-bottom: 14px; }
.stage-status { flex: 0 0 auto; border: 1px solid var(--line); border-radius: 999px; padding: 4px 9px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.stage-status.ready { color: var(--jade); border-color: rgba(145, 183, 168, .45); }
.stage-status.busy { color: var(--amber); border-color: rgba(229, 163, 95, .45); }
.stage-status.error { color: var(--coral); border-color: rgba(221, 109, 84, .45); }
.stage-status.is-error { color: var(--coral); border-color: rgba(221, 109, 84, .45); }
.stage-status.is-warning { color: var(--amber); border-color: rgba(229, 163, 95, .45); }
.brief-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; padding-top: 22px; }
.brief-form-grid label, .runner-form label, .form-stack label, #ipForm > label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.brief-form-grid .wide { grid-column: 1 / -1; }
.brief-form-grid input, .brief-form-grid textarea, .brief-form-grid select { color: var(--paper); border-color: var(--line); background: var(--panel-soft); }
.brief-form-grid input::placeholder, .brief-form-grid textarea::placeholder { color: #7f8881; }
.brief-form-grid select { min-height: 45px; }
.director-constraint-field { border: 1px solid var(--line); margin: 0; padding: 13px 14px 14px; min-width: 0; }
.director-constraint-field legend { padding: 0 6px; color: var(--muted); font-size: 12px; }
.director-constraint-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px 12px; }
.director-constraint-grid label { display: flex; align-items: center; gap: 7px; color: var(--paper); font-size: 12px; }
.director-constraint-grid input { width: auto; accent-color: var(--coral); }
.skill-catalog-toolbar { display: flex; align-items: flex-start; gap: 12px; }
.skill-catalog-toolbar > button { flex: 0 0 auto; }
.skill-category-filters { flex: 1 1 auto; justify-content: flex-start; min-width: 0; }
.skill-card-orchestration { display: block; margin-top: 8px; color: var(--muted); }
.skill-plan-summary { display: flex; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); background: var(--panel-soft); }
.skill-plan-summary span, .skill-plan-step small { color: var(--muted); }
.skill-plan-steps { display: grid; gap: 8px; padding: 0; margin: 16px 0; list-style: none; }
.skill-plan-step { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-left: 3px solid var(--line); background: rgba(255,255,255,.03); }
.skill-plan-step > span { width: 24px; color: var(--muted); }
.skill-plan-step div { display: grid; gap: 3px; }
.skill-plan-succeeded { border-left-color: #5ebd8a; }
.skill-plan-queued { border-left-color: var(--coral); }
.skill-plan-waiting, .skill-plan-blocked { border-left-color: #d6a85f; }
.stage-status.done { color: var(--jade); border-color: rgba(145, 183, 168, .45); }
.skill-step-action { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 14px 0; }
.skill-step-action small { color: var(--muted); font-size: 11px; word-break: break-all; }
.skill-execution-detail { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
.skill-execution-detail summary { cursor: pointer; color: var(--muted); font-size: 12px; }
.skill-execution-detail pre { max-height: 260px; overflow: auto; margin: 10px 0 0; padding: 12px; white-space: pre-wrap; word-break: break-word; color: var(--muted); background: rgba(0,0,0,.16); font: 11px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
@media (max-width: 900px) { .skill-catalog-toolbar { flex-direction: column; } .skill-catalog-toolbar > button { width: 100%; } .skill-category-filters { justify-content: flex-start; } }
.director-constraint-other { display: grid; gap: 7px; margin-top: 12px; color: var(--muted); font-size: 12px; }
.panel-lead { margin: 17px 0 5px; color: var(--muted); }
.panel-actions, .modal-actions, .runner-actions, .button-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; margin-top: 22px; }
.result-meta { display: flex; flex-wrap: wrap; gap: 8px; min-height: 24px; padding-top: 17px; color: var(--muted); font-size: 12px; }
.result-meta span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; }
.screenplay-editor { width: 100%; min-height: 450px; margin-top: 13px; resize: vertical; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 17px; color: var(--paper); background: #111514; line-height: 1.85; }
.screenplay-editor:focus { border-color: var(--amber); }
.director-screenplay-structure { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.director-screenplay-structure label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }
.director-screenplay-structure label:first-child { grid-column: 1 / -1; }
.director-screenplay-structure textarea { width: 100%; min-width: 0; resize: vertical; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 12px; color: var(--paper); background: #111514; font: inherit; line-height: 1.65; }
.director-screenplay-structure textarea:focus { border-color: var(--amber); }
.director-screenplay-stage-rail { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-top: 16px; border-bottom: 1px solid var(--line); }
.director-screenplay-stage-rail button { display: flex; align-items: center; gap: 7px; min-width: 0; border: 0; border-bottom: 2px solid transparent; padding: 10px 8px; color: var(--muted); background: transparent; font: inherit; font-size: 12px; cursor: pointer; }
.director-screenplay-stage-rail button span { color: var(--muted-dark); font-size: 10px; }
.director-screenplay-stage-rail button.active { border-bottom-color: var(--amber); color: var(--paper); background: rgba(229,163,95,.06); }
.director-screenplay-stage { display: grid; gap: 14px; min-height: 360px; padding-top: 16px; }
.director-screenplay-stage[hidden] { display: none; }
.director-screenplay-stage > label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; }
.director-screenplay-stage > label textarea { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 14px; color: var(--paper); background: #111514; font: inherit; line-height: 1.75; }
.director-episode-board { display: grid; gap: 12px; }
.director-episode-card { display: grid; gap: 12px; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: var(--panel-soft); }
.director-episode-card header { display: grid; grid-template-columns: 42px minmax(0, 1fr) 130px; gap: 10px; align-items: end; }
.director-episode-card header > span { color: var(--amber); font-size: 12px; align-self: center; }
.director-episode-card label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }
.director-episode-card input, .director-episode-card select, .director-episode-card textarea { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 7px; padding: 9px 10px; color: var(--paper); background: #0d1110; font: inherit; line-height: 1.6; }
.director-episode-card textarea { resize: vertical; }
.director-episode-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.director-episode-card footer small { color: var(--muted-dark); }
.director-screenplay-versions { display: grid; gap: 9px; }
.director-screenplay-version { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: var(--radius); padding: 13px; background: var(--panel-soft); }
.director-screenplay-version.current { border-color: rgba(92,184,139,.45); }
.director-screenplay-version > div { display: grid; gap: 4px; min-width: 0; }
.director-screenplay-version strong { color: var(--paper); }
.director-screenplay-version span, .director-screenplay-version small { color: var(--muted); font-size: 11px; }
.sc-primary-actions { display: flex; gap: 8px; align-items: center; }
.director-asset-board { display: grid; grid-template-columns: 1fr; gap: 14px; padding-top: 20px; }
.director-asset-row { display: grid; gap: 8px; min-height: 74px; border: 1px solid var(--line); border-radius: var(--radius); padding: 13px; background: var(--panel-soft); }
.director-asset-row > span { color: var(--amber); font-size: 11px; }
.director-asset-row > div { display: flex; flex-wrap: wrap; gap: 6px; align-content: start; }
.director-asset-cards { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); width: 100%; }
.director-asset-card { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 12px; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: rgba(255,255,255,.025); }
.director-asset-visual { position: sticky; top: 12px; align-self: start; }
.director-asset-card img { width: 88px; height: 116px; border-radius: 6px; object-fit: cover; background: #0c100f; }
.director-asset-placeholder { display: grid; place-items: center; width: 88px; height: 116px; border: 1px dashed var(--line); border-radius: 6px; color: var(--muted-dark); background: #0c100f; font-size: 9px; text-align: center; }
.director-asset-card-body { display: grid; min-width: 0; gap: 8px; }
.director-asset-core { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.director-asset-core > label:nth-child(2), .director-asset-core > label:has(textarea) { grid-column: 1 / -1; }
.director-asset-card-body label { display: grid; gap: 4px; color: var(--muted); font-size: 10px; }
.director-asset-card-body input, .director-asset-card-body textarea { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 5px; padding: 7px 8px; color: var(--paper); background: #111514; font: inherit; font-size: 11px; line-height: 1.45; }
.director-asset-card-body textarea { resize: vertical; }
.director-asset-card-body input:focus, .director-asset-card-body textarea:focus { border-color: var(--amber); outline: 0; }
.director-asset-card-body button { justify-self: start; }
.director-asset-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.director-asset-generation-status { min-height: 16px; margin: 0; color: var(--muted); font-size: 10px; }
.director-asset-generation-status.is-success { color: #86efac; }
.director-asset-generation-status.is-error { color: #fca5a5; }
.director-asset-card strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.director-asset-card p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.director-asset-card p span { display: block; color: var(--amber); font-size: 10px; }
.director-asset-card .is-muted { color: var(--muted-dark); }
.director-asset-row small { color: var(--muted); }
.asset-chip { display: inline-flex; align-items: center; min-height: 25px; border: 1px solid var(--line); border-radius: 999px; padding: 0 8px; color: var(--paper); background: rgba(255,255,255,.04); font-size: 11px; }
.asset-check-card { display: grid; gap: 8px; min-height: 112px; border: 1px solid var(--line); border-radius: var(--radius); padding: 13px; background: var(--panel-soft); }
.asset-check-card img { width: 48px; height: 48px; border-radius: 4px; object-fit: cover; }
.asset-check-card strong { font-size: 14px; }
.asset-check-card small { color: var(--muted); }
.storyboard-list { display: grid; gap: 10px; padding-top: 20px; }
.storyboard-navigator { display: grid; gap: 9px; min-width: 0; }
.storyboard-scene-tabs, .storyboard-shot-tabs, .previs-shot-tabs { display: flex; gap: 7px; min-width: 0; overflow-x: auto; padding: 2px 0 6px; scrollbar-width: thin; }
.storyboard-scene-tab, .storyboard-shot-tab, .previs-shot-tab { flex: 0 0 auto; display: grid; gap: 2px; min-width: 74px; border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; color: var(--muted); background: #111514; text-align: left; }
.storyboard-scene-tab { min-width: 132px; }
.storyboard-scene-tab:hover, .storyboard-shot-tab:hover, .previs-shot-tab:hover, .storyboard-scene-tab.active, .storyboard-shot-tab.active, .previs-shot-tab.active { border-color: var(--amber); color: var(--paper); }
.storyboard-scene-tab.active, .storyboard-shot-tab.active, .previs-shot-tab.active { box-shadow: inset 0 -2px 0 var(--amber); }
.storyboard-scene-tab small, .storyboard-shot-tab small, .previs-shot-tab small { max-width: 150px; overflow: hidden; color: var(--muted-dark); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.storyboard-active-shot { margin-top: 4px; }
.shot-row { display: grid; grid-template-columns: 62px 1fr 140px; gap: 14px; border-bottom: 1px solid var(--line); padding: 14px 0; }
.shot-row:last-child { border-bottom: 0; }
.shot-index { color: var(--amber); font-size: 13px; }
.shot-copy { min-width: 0; }
.shot-copy strong { display: block; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.shot-copy p { margin-top: 6px; color: var(--muted); font-size: 12px; }
.shot-spec { display: grid; align-content: start; justify-items: end; gap: 5px; color: var(--muted); font-size: 11px; text-align: right; }
.storyboard-row { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 13px; align-items: start; border-bottom: 1px solid var(--line); padding: 14px 0; }
.storyboard-row:last-child { border-bottom: 0; }
.storyboard-row-index { color: var(--amber); font-size: 13px; }
.storyboard-row p { margin-top: 5px; color: var(--muted); font-size: 12px; }
.storyboard-row small { display: block; margin-top: 7px; color: var(--muted-dark); font-size: 11px; }
.storyboard-edit-card { grid-template-columns: 42px minmax(0, 1fr); }
.storyboard-edit-fields { display: grid; gap: 9px; min-width: 0; }
.storyboard-edit-fields label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; }
.storyboard-edit-fields input, .storyboard-edit-fields textarea, .storyboard-edit-fields select { width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 8px; color: var(--paper); background: #111514; font: inherit; font-size: 12px; resize: vertical; }
.storyboard-edit-fields input:focus, .storyboard-edit-fields textarea:focus, .storyboard-edit-fields select:focus { border-color: var(--amber); outline: 0; }
.storyboard-edit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-items: end; }
.storyboard-edit-grid .storyboard-edit-wide { grid-column: span 2; }
.storyboard-binding-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.storyboard-binding-grid fieldset { min-width: 0; border: 1px solid var(--line); border-radius: 6px; padding: 9px; }
.storyboard-binding-grid legend { padding: 0 5px; color: var(--muted); font-size: 10px; }
.storyboard-asset-checks { display: flex; flex-wrap: wrap; gap: 6px; }
.storyboard-asset-check { display: inline-flex !important; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 5px !important; border: 1px solid var(--line); border-radius: 999px; padding: 4px 7px; color: var(--paper) !important; }
.storyboard-asset-check input { width: auto; margin: 0; padding: 0; accent-color: var(--amber); }
.storyboard-prompt-details label { margin-top: 9px; }
.storyboard-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.storyboard-edit-fields details { border-top: 1px solid var(--line); padding-top: 8px; }
.storyboard-edit-fields summary { cursor: pointer; color: var(--muted); font-size: 11px; }
.previs-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding-top: 20px; }
.previs-choice { display: grid; gap: 6px; min-height: 75px; border: 1px solid var(--line); border-radius: var(--radius); padding: 13px; color: var(--paper); background: var(--panel-soft); text-align: left; }
.previs-choice:hover, .previs-choice.active { border-color: var(--amber); }
.previs-choice small { color: var(--muted); }
.previs-board, .timeline-board { padding-top: 18px; }
.previs-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.previs-strip figure { min-width: 0; margin: 0; }
.previs-strip figure > div { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 4px; background: var(--panel-soft); }
.previs-strip img { width: 100%; height: 100%; object-fit: cover; }
.previs-strip figure > div > span { position: absolute; top: 6px; left: 6px; z-index: 1; color: var(--white); font-size: 10px; }
.previs-strip figcaption { overflow: hidden; margin-top: 5px; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.previs-workspace { display: grid; gap: 12px; }
.previs-shot-tabs { border-bottom: 1px solid var(--line); }
.previs-shot-tab { min-width: 60px; text-align: center; }
.previs-active-shot { display: grid; gap: 16px; }
.previs-active-shot > header { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.previs-active-shot > header h3 { margin-top: 3px; font-size: 18px; }
.previs-active-shot > header > span, .previs-active-shot > p { color: var(--muted); font-size: 12px; }
.previs-shot-brief { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(300px, 1.35fr) minmax(180px, .8fr); gap: 10px; }
.previs-shot-brief article { display: grid; align-content: start; gap: 6px; min-width: 0; border: 1px solid var(--line); border-radius: 7px; padding: 10px; background: #111514; }
.previs-shot-brief article > span { color: var(--amber); font-size: 10px; }
.previs-shot-brief article > p { margin: 0; color: var(--paper); font-size: 11px; line-height: 1.55; }
.previs-action-sequence { display: grid; gap: 5px; }
.previs-action-sequence p { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 5px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.previs-action-sequence p b { color: var(--paper); }
.previs-action-sequence p.active { color: var(--paper); }
.previs-action-sequence p.active b { color: var(--amber); }
.previs-blocking-status { display: inline-flex; align-items: center; width: fit-content; border: 1px solid rgba(214,166,91,.5); border-radius: 999px; padding: 3px 7px; color: var(--amber); font-size: 10px; }
.previs-blocking-status.ready { border-color: rgba(127,184,163,.6); color: #9fe0bd; }
.previs-blocking-status.pending { border-color: rgba(214,166,91,.6); color: var(--amber); }
.previs-reference-section { display: grid; gap: 9px; border-top: 1px solid var(--line); padding-top: 14px; }
.previs-reference-section h4 { font-size: 12px; }
.previs-reference-list { display: flex; gap: 8px; overflow-x: auto; }
.previs-reference-card { flex: 0 0 200px; display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 9px; margin: 0; border: 1px solid var(--line); border-radius: 6px; padding: 8px; background: #111514; }
.previs-reference-card > img, .previs-reference-card > div { width: 54px; height: 54px; border-radius: 4px; object-fit: cover; background: var(--panel-soft); }
.previs-reference-card > div { display: grid; place-items: center; color: var(--amber); }
.previs-reference-card figcaption { display: grid; align-content: center; gap: 3px; min-width: 0; }
.previs-reference-card strong, .previs-reference-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.previs-reference-card strong { font-size: 12px; }
.previs-reference-card small, .previs-reference-warning { color: var(--muted); font-size: 10px; }
.previs-reference-warning { margin: 0; border-left: 2px solid var(--amber); padding-left: 9px; }
.previs-keyframe-list { display: grid; gap: 12px; }
.previs-keyframe-card { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr); gap: 14px; border: 1px solid var(--line); border-radius: 6px; padding: 12px; background: #111514; }
.previs-keyframe-image { min-width: 0; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 4px; background: #0b0e0d; }
.previs-keyframe-image img { width: 100%; height: 100%; object-fit: cover; }
.previs-keyframe-placeholder { display: grid; place-items: center; align-content: center; gap: 6px; width: 100%; height: 100%; color: var(--muted); }
.previs-keyframe-placeholder span { color: var(--amber); font-size: 20px; }
.previs-keyframe-body { display: grid; align-content: start; gap: 10px; min-width: 0; }
.previs-keyframe-body > header { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.previs-keyframe-body > header > div { display: grid; gap: 3px; }
.previs-keyframe-body header small { color: var(--muted); font-size: 10px; }
.previs-keyframe-body label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; }
.previs-keyframe-body textarea { width: 100%; min-width: 0; resize: vertical; border: 1px solid var(--line); border-radius: 5px; padding: 9px; color: var(--paper); background: #171c1a; font: inherit; line-height: 1.5; }
.previs-keyframe-body textarea:focus { border-color: var(--amber); outline: 0; }
.previs-keyframe-error { color: var(--coral); font-size: 11px; }
.previs-keyframe-actions { display: flex; justify-content: flex-end; }
.previs-wireframe { display: grid; gap: 14px; border: 1px solid var(--line); border-radius: 8px; padding: 14px; background: #0f1312; }
.previs-wireframe-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.previs-wireframe-header h4 { margin: 3px 0 0; font-size: 16px; }
.previs-wireframe-note { margin: -4px 0 0; color: var(--amber); font-size: 11px; line-height: 1.45; }
.previs-export-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.previs-playback-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.previs-playback-controls > label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 10px; }
.previs-playback-controls select { min-height: 30px; border: 1px solid var(--line); border-radius: 5px; padding: 0 7px; color: var(--paper); background: #111514; font: inherit; }
.previs-playback-controls .previs-loop-control input { width: 14px; height: 14px; margin: 0; accent-color: var(--amber); }
.previs-wireframe-grid { display: grid; grid-template-columns: minmax(300px, 1.15fr) minmax(260px, .85fr); gap: 14px; }
.previs-stage-diagram { position: relative; min-height: 390px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background-color: #171c1a; background-image: linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px); background-size: 10% 10%; }
.previs-stage-diagram::before { content: ""; position: absolute; right: 7%; bottom: 8%; left: 7%; height: 56%; border: 1px solid rgba(214,166,91,.24); transform: perspective(420px) rotateX(54deg); transform-origin: bottom; pointer-events: none; }
.previs-stage-axis { position: absolute; z-index: 1; top: 12%; bottom: 12%; left: 50%; border-left: 1px dashed rgba(255,255,255,.22); }
.previs-stage-label { position: absolute; z-index: 5; color: var(--muted-dark); font-size: 10px; letter-spacing: 0; }
.previs-stage-label-entry { left: 12px; top: 12px; }
.previs-stage-label-subject { left: 50%; top: 46%; transform: translate(-50%, -50%); color: var(--amber); }
.previs-stage-label-target { right: 12px; bottom: 12px; }
.previs-stage-paths { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.previs-motion-path path { fill: none; stroke: rgba(214,166,91,.78); stroke-width: .6; stroke-dasharray: 2 1.2; vector-effect: non-scaling-stroke; }
.previs-motion-path circle { fill: var(--amber); stroke: #0d100f; stroke-width: .5; vector-effect: non-scaling-stroke; }
.previs-motion-path.path-1 path { stroke: rgba(127,184,163,.86); }
.previs-motion-path.path-1 circle { fill: #7fb8a3; }
.previs-motion-path.path-2 path { stroke: rgba(162,154,207,.86); }
.previs-motion-path.path-2 circle { fill: #a29acf; }
.previs-motion-path.path-3 path { stroke: rgba(220,135,121,.86); }
.previs-motion-path.path-3 circle { fill: #dc8779; }
.previs-motion-path.pending path { stroke-dasharray: 1.2 1.8; opacity: .62; }
.previs-stage-backdrop { position: absolute; z-index: 1; top: 10%; left: 50%; display: grid; width: min(58%, 430px); min-height: 78px; place-content: center; transform: translateX(-50%); border: 1px solid rgba(255,255,255,.12); padding: 12px; color: var(--paper); background: rgba(13,16,15,.72); text-align: center; }
.previs-stage-backdrop strong { font-size: 12px; }
.previs-stage-backdrop small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.previs-stage-camera { position: absolute; z-index: 6; left: 50%; bottom: 16px; display: grid; gap: 3px; transform: translateX(-50%); color: var(--paper); text-align: center; }
.previs-stage-camera span { font-size: 11px; }
.previs-stage-camera small { max-width: 190px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.previs-actor-token { position: absolute; z-index: 4; display: grid; grid-template-columns: 24px minmax(0, 1fr) 12px; align-items: center; gap: 6px; min-width: 92px; max-width: 148px; transform: translate(-50%, -50%); border: 1px solid rgba(214,166,91,.65); border-radius: 7px; padding: 7px; background: rgba(15,21,18,.94); box-shadow: 0 6px 20px rgba(0,0,0,.24); transition: left .1s linear, top .1s linear; }
.previs-actor-token > span { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; color: #111514; background: var(--amber); font-size: 10px; font-weight: 700; }
.previs-actor-token strong { color: var(--paper); font-size: 12px; }
.previs-actor-token i { position: relative; width: 12px; height: 1px; background: currentColor; transform: rotate(var(--previs-facing, 0deg)); transform-origin: left center; }
.previs-actor-token i::after { content: ""; position: absolute; top: -3px; right: 0; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 5px solid currentColor; }
.previs-actor-placeholder { opacity: .62; border-style: dashed; }
.previs-actor-placeholder i { opacity: .35; }
.previs-actor-1 { border-color: rgba(127,184,163,.65); color: #7fb8a3; }
.previs-actor-1 > span { background: #7fb8a3; }
.previs-actor-2 { border-color: rgba(162,154,207,.65); color: #a29acf; }
.previs-actor-2 > span { background: #a29acf; }
.previs-actor-3 { border-color: rgba(220,135,121,.65); color: #dc8779; }
.previs-actor-3 > span { background: #dc8779; }
.previs-camera-frame { position: absolute; z-index: 3; top: var(--previs-frame-y, 50%); left: var(--previs-frame-x, 50%); width: calc(82% * var(--previs-frame-scale, .76)); aspect-ratio: var(--previs-frame-aspect, 16 / 9); transform: translate(-50%, -50%); border: 2px solid rgba(244,246,250,.82); box-shadow: 0 0 0 999px rgba(0,0,0,.12); pointer-events: none; transition: width .1s linear, top .1s linear, left .1s linear; }
.previs-camera-frame::before, .previs-camera-frame::after { content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255,255,255,.18); }
.previs-camera-frame::before { left: 33.333%; }
.previs-camera-frame::after { right: 33.333%; }
.previs-camera-frame span { position: absolute; top: 7px; right: 8px; color: rgba(255,255,255,.72); font-size: 9px; }
.previs-stage-monitor { position: absolute; z-index: 7; right: 10px; bottom: 10px; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 3px 8px; max-width: 62%; border: 1px solid rgba(255,255,255,.15); padding: 7px 9px; background: rgba(10,13,12,.82); }
.previs-stage-monitor span { color: var(--amber); font-size: 9px; }
.previs-stage-monitor strong { overflow: hidden; color: var(--paper); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.previs-stage-monitor small { grid-column: 1 / -1; color: var(--muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.previs-wireframe-details { display: grid; gap: 9px; align-content: start; }
.previs-wireframe-details article { display: grid; gap: 5px; border: 1px solid var(--line); border-radius: 6px; padding: 10px; background: #111514; }
.previs-wireframe-details article > strong { color: var(--amber); font-size: 11px; }
.previs-wireframe-details p { margin: 0; color: var(--paper); font-size: 11px; line-height: 1.55; }
.previs-wireframe-details ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.previs-wireframe-details li { display: grid; gap: 3px; }
.previs-wireframe-details li b { color: var(--paper); font-size: 11px; }
.previs-wireframe-details li span, .previs-wireframe-muted { color: var(--muted) !important; font-size: 10px !important; }
.previs-wireframe-details .previs-reference-list { max-width: 100%; }
.previs-continuity-badge { justify-self: start; border: 1px solid rgba(127,184,163,.5); border-radius: 999px; padding: 3px 7px; color: #9fe0bd; font-size: 10px; }
.previs-timeline { display: grid; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; }
.previs-timeline > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.previs-timeline > header strong { font-size: 11px; }
.previs-timeline > header span { color: var(--muted); font-size: 10px; }
.previs-timeline-shell { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: #0b0e0d; }
.previs-timeline-track { display: flex; min-width: 100%; overflow-x: auto; }
.previs-timeline-shot { position: relative; flex: var(--previs-shot-grow, 1) 0 76px; display: block; min-width: 76px; min-height: 68px; overflow: hidden; border: 0; border-right: 1px solid var(--line); padding: 8px; color: var(--muted); background: #111514; text-align: left; }
.previs-timeline-shot:hover, .previs-timeline-shot.active { color: var(--paper); background: #1a201e; }
.previs-timeline-shot.active { box-shadow: inset 0 2px 0 var(--amber); }
.previs-timeline-shot > span { color: var(--amber); font-size: 9px; }
.previs-timeline-shot strong, .previs-timeline-shot small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.previs-timeline-shot strong { margin: 4px 0 3px; font-size: 10px; }
.previs-timeline-shot small { font-size: 9px; }
.previs-timeline-shot i { position: absolute; right: auto; bottom: 0; left: 0; width: 0; height: 2px; background: var(--amber); }
.previs-timeline-playhead { position: absolute; z-index: 3; top: 0; bottom: 0; left: 0; width: 1px; background: #f4f6fa; pointer-events: none; }
.previs-timeline-playhead::before { content: ""; position: absolute; top: 0; left: -4px; border-top: 6px solid #f4f6fa; border-right: 4px solid transparent; border-left: 4px solid transparent; }
.previs-timeline input[type="range"] { width: 100%; height: 16px; margin: 0; accent-color: var(--amber); }

/* ===== P0 3D previs proxy editor ===== */
.previs-3d-mount { min-width: 0; }
.previs-3d-editor { display: grid; gap: 10px; border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: #0f1312; }
.previs-3d-header, .previs-3d-timeline-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.previs-3d-header { border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.previs-3d-header h4 { margin: 3px 0; font-size: 16px; }
.previs-3d-header small, .previs-3d-viewport-toolbar span, .previs-3d-tree-note, .previs-3d-inspector-note, .previs-3d-status { color: var(--muted); font-size: 10px; }
.previs-3d-actions, .previs-3d-viewport-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.previs-3d-layout { display: grid; grid-template-columns: 170px minmax(360px, 1fr) 210px; gap: 8px; min-height: 430px; }
.previs-3d-scene-tree, .previs-3d-inspector { min-width: 0; border: 1px solid var(--line); border-radius: 6px; padding: 9px; background: #111514; }
.previs-3d-subtitle { margin: 12px 0 5px; color: var(--muted-dark); font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
.previs-3d-panel-title { display: flex; align-items: center; justify-content: space-between; gap: 7px; margin-bottom: 8px; }
.previs-3d-panel-title strong { color: var(--paper); font-size: 11px; }
.previs-3d-panel-title small { color: var(--muted-dark); font-size: 9px; }
.previs-3d-entity-row { display: grid; grid-template-columns: 8px minmax(0, 1fr); gap: 6px; align-items: center; width: 100%; border: 1px solid transparent; border-radius: 4px; padding: 7px 6px; color: var(--muted); background: transparent; text-align: left; cursor: pointer; }
.previs-3d-entity-row:hover, .previs-3d-entity-row.active { border-color: var(--amber); color: var(--paper); background: #1a201e; }
.previs-3d-entity-row strong, .previs-3d-entity-row small { grid-column: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.previs-3d-entity-row strong { font-size: 11px; }
.previs-3d-entity-row small { color: var(--muted-dark); font-size: 9px; }
.previs-3d-entity-dot { grid-row: 1 / span 2; width: 7px; height: 7px; border-radius: 50%; background: var(--entity-color, var(--amber)); }
.previs-3d-tree-note { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 9px; line-height: 1.45; }
.previs-3d-p2-panel { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 9px; }
.previs-3d-panel-empty { margin: 0; color: var(--muted-dark); font-size: 10px; line-height: 1.45; }
.previs-3d-reference-row, .previs-3d-diagnostic-row { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 7px; align-items: center; width: 100%; margin: 3px 0; border: 1px solid transparent; border-radius: 4px; padding: 5px; color: var(--muted); background: transparent; text-align: left; cursor: pointer; }
.previs-3d-reference-row:hover, .previs-3d-reference-row.active { border-color: var(--amber); background: #1a201e; color: var(--paper); }
.previs-3d-reference-thumb { display: grid; place-items: center; width: 28px; height: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 3px; color: var(--muted-dark); background: #171c1a; font-size: 8px; }
.previs-3d-reference-thumb img { width: 100%; height: 100%; object-fit: cover; }
.previs-3d-reference-row strong, .previs-3d-reference-row small, .previs-3d-diagnostic-row strong, .previs-3d-diagnostic-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.previs-3d-reference-row strong, .previs-3d-diagnostic-row strong { font-size: 9px; }
.previs-3d-reference-row small, .previs-3d-diagnostic-row small { margin-top: 2px; color: var(--muted-dark); font-size: 8px; }
.previs-3d-diagnostic-row { grid-template-columns: 17px minmax(0, 1fr); padding: 5px 4px; }
.previs-3d-diagnostic-row > span:first-child { display: grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; color: #111514; background: var(--amber); font-weight: 700; font-size: 9px; }
.previs-3d-diagnostic-row.error > span:first-child { background: var(--coral); }
.previs-3d-diagnostic-row.info > span:first-child { background: var(--reference); }
.previs-3d-bound-references { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.previs-3d-bound-references span { border: 1px solid var(--line); border-radius: 3px; padding: 3px 4px; color: var(--paper); background: #171c1a; font-size: 8px; }
.previs-3d-inspector-section { border-top: 1px solid var(--line); padding-top: 8px; color: var(--muted); font-size: 9px; }
.previs-3d-inspector-section > strong { color: var(--paper); font-size: 10px; }
.previs-3d-viewport-wrap { position: relative; align-self: start; min-width: 0; height: clamp(360px, 52vh, 560px); overflow: hidden; border: 1px solid var(--line); border-radius: 6px; background: #0b0e0d; }
.previs-3d-viewport-toolbar { position: absolute; z-index: 2; top: 8px; right: 8px; left: 8px; justify-content: flex-end; pointer-events: none; }
.previs-3d-viewport-toolbar button, .previs-3d-viewport-toolbar span { pointer-events: auto; }
.previs-3d-viewport-toolbar span { border: 1px solid var(--line); border-radius: 4px; padding: 6px 7px; background: rgba(15,19,18,.88); }
.previs-3d-viewport-wrap canvas { display: block; width: 100%; height: 100%; min-height: 0; cursor: grab; }
.previs-3d-viewport-wrap .previs-3d-webgl-layer { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; min-height: 0; pointer-events: none; }
.previs-3d-viewport-wrap [data-previs3d-canvas] { position: relative; z-index: 1; background: transparent; }
.previs-3d-viewport-wrap canvas:active { cursor: grabbing; }
.previs-3d-viewport-hint { position: absolute; right: 9px; bottom: 8px; left: 9px; color: rgba(244,246,250,.55); font-size: 9px; pointer-events: none; }
.previs-3d-inspector { display: grid; align-content: start; gap: 10px; }
.previs-3d-inspector fieldset { margin: 0; border: 1px solid var(--line); padding: 8px; }
.previs-3d-inspector legend { padding: 0 4px; color: var(--muted); font-size: 10px; }
.previs-3d-number-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.previs-3d-inspector label { display: grid; gap: 4px; color: var(--muted); font-size: 9px; }
.previs-3d-inspector input[type="number"], .previs-3d-name-field input { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 4px; padding: 6px; color: var(--paper); background: #171c1a; font: inherit; }
.previs-3d-inspector select { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 4px; padding: 6px; color: var(--paper); background: #171c1a; font: inherit; }
.previs-3d-name-field { padding-bottom: 3px; }
.previs-3d-check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 6px !important; }
.previs-3d-check input { accent-color: var(--amber); }
.previs-3d-inspector-empty { padding: 20px 4px; color: var(--muted); font-size: 11px; }
.previs-3d-timeline { display: grid; gap: 7px; border-top: 1px solid var(--line); padding-top: 9px; }
.previs-3d-timeline-head { justify-content: flex-start; flex-wrap: wrap; }
.previs-3d-timeline-head strong { font-size: 11px; }
.previs-3d-timeline-head span { margin-right: auto; color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.previs-3d-timeline input[type="range"] { width: 100%; accent-color: var(--amber); }
.previs-3d-loop { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 10px; }
.previs-3d-loop input { accent-color: var(--amber); }
.previs-3d-timeline-track { display: grid; gap: 4px; max-height: 140px; overflow: auto; }
.previs-3d-track-row { display: grid; grid-template-columns: minmax(140px, 210px) minmax(0, 1fr); align-items: center; gap: 8px; min-height: 24px; color: var(--muted); font-size: 9px; }
.previs-3d-track-row > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.previs-3d-track-lane { position: relative; height: 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 3px; background: repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0, rgba(255,255,255,.03) 1px, transparent 1px, transparent 25%); }
.previs-3d-key { position: absolute; top: 4px; width: 9px; height: 9px; padding: 0; border: 1px solid #f4f6fa; border-radius: 1px; background: var(--amber); transform: translateX(-50%) rotate(45deg); cursor: pointer; }
.previs-3d-key:hover { background: #f4f6fa; }
.previs-3d-playhead { position: absolute; z-index: 2; top: -1px; bottom: -1px; width: 2px; background: var(--coral); box-shadow: 0 0 7px rgba(220,135,121,.7); pointer-events: none; }
.previs-3d-timeline-empty { margin: 0; color: var(--muted-dark); font-size: 10px; }
.previs-3d-status { min-height: 14px; margin: 0; }
.previs-3d-status.success { color: #9fe0bd; }
.previs-3d-status.error { color: var(--coral); }
.previs-full-player { display: grid; gap: 12px; margin: 14px 0; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #121916; }
.previs-full-player h4 { margin: 0 0 4px; }
.previs-full-player [data-previs-current-time] { color: var(--amber); font-variant-numeric: tabular-nums; }
.previs-keyframe-screen { display: grid; gap: 8px; margin: 12px 0 20px; }
.previs-keyframe-screen canvas { display: block; width: 100%; max-height: 72vh; object-fit: contain; border: 1px solid var(--line); border-radius: 8px; background: #0b0e0d; }
.previs-keyframe-screen p { margin: 0; color: var(--paper); font-size: 12px; }
.previs-keyframe-screen small, .previs-secondary-panel summary { color: var(--muted); font-size: 12px; }
.previs-secondary-panel { margin: 14px 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.previs-secondary-panel summary { padding: 4px 0; cursor: pointer; }
.previs-secondary-panel[open] summary { margin-bottom: 12px; }
.previs-export-preview .previs-3d-preview-only { display: block; height: 100%; padding: 0; border: 0; }
.previs-3d-preview-only > header, .previs-3d-preview-only > footer, .previs-3d-preview-only > .previs-3d-status { display: none; }
.previs-3d-preview-only .previs-3d-layout { display: block; height: 100%; min-height: 0; }
.previs-3d-preview-only .previs-3d-layout > aside, .previs-3d-preview-only .previs-3d-viewport-toolbar, .previs-3d-preview-only .previs-3d-viewport-hint { display: none; }
.previs-3d-preview-only .previs-3d-viewport-wrap { height: 100%; border: 0; border-radius: 0; }
.previs-3d-preview-only .previs-3d-viewport-wrap canvas { width: 100%; height: 100%; min-height: 0; }
@media (max-width: 980px) { .previs-3d-layout { grid-template-columns: 145px minmax(280px, 1fr); } .previs-3d-inspector { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); } .previs-3d-inspector .previs-3d-panel-title { grid-column: 1 / -1; } }
@media (max-width: 700px) { .previs-3d-header { display: grid; } .previs-3d-layout { grid-template-columns: 1fr; } .previs-3d-scene-tree, .previs-3d-inspector { display: grid; grid-template-columns: 1fr 1fr; } .previs-3d-panel-title, .previs-3d-tree-note, .previs-3d-inspector-note { grid-column: 1 / -1; } .previs-3d-viewport-wrap { height: clamp(300px, 52vh, 430px); } }
.previs-filmstrip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.previs-filmstrip figure { margin: 0; }
.previs-filmstrip img { width: 100%; aspect-ratio: 9 / 12; border-radius: 4px; object-fit: cover; }
.previs-filmstrip figcaption { overflow: hidden; margin-top: 5px; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.timeline-clip { display: grid; grid-template-columns: 82px 1fr; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); padding: 12px 0; }
.timeline-clip:last-child { border-bottom: 0; }
.timeline-thumb { width: 82px; aspect-ratio: 16 / 9; border-radius: 3px; object-fit: cover; background: var(--panel-soft); }
.timeline-clip strong { display: block; font-size: 13px; }
.timeline-clip small { color: var(--muted); }
.context-panel { padding: 18px; }
.project-context-summary { display: grid; gap: 6px; padding: 17px 0; }
.project-context-summary strong { font-size: 15px; }
.project-context-summary span, .context-panel > p { color: var(--muted); font-size: 12px; }
.context-links { display: grid; gap: 7px; border-top: 1px solid var(--line); padding-top: 14px; }
.context-links button { display: flex; align-items: center; justify-content: space-between; border: 0; padding: 5px 0; color: var(--muted); background: transparent; text-align: left; }
.context-links button:hover { color: var(--amber); }
.collaboration-teaser { background: #151b19; }
.collaboration-teaser-summary { display: grid; gap: 6px; min-height: 58px; padding: 14px 0; color: var(--muted); font-size: 12px; }
.collaboration-teaser-summary span { display: block; }
.collaboration-teaser-summary .is-error { color: var(--coral); }
.modal-dialog.collaboration-dialog { width: min(1080px, calc(100vw - 32px)); max-width: 1080px; }
.collaboration-dialog-inner { display: grid; gap: 0; max-height: min(820px, calc(100vh - 48px)); overflow: auto; }
.collaboration-dialog-heading { position: sticky; top: 0; z-index: 2; margin: 0; padding: 23px 26px 17px; background: var(--panel); }
.collaboration-dialog-heading h2 { margin-bottom: 6px; }
.collaboration-dialog-actions { display: flex; align-items: flex-start; gap: 8px; }
.collaboration-dialog-actions .secondary-button { min-height: 35px; }
.collaboration-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 18px 26px 0; border: 1px solid var(--line); background: var(--line); }
.collaboration-summary > div { display: grid; gap: 5px; min-height: 73px; padding: 13px; background: var(--panel-soft); }
.collaboration-summary b { color: var(--amber); font-size: 22px; font-weight: 500; }
.collaboration-summary span { color: var(--muted); font-size: 11px; }
.collaboration-loading { display: flex; grid-column: 1 / -1; align-items: center; gap: 9px; min-height: 65px; padding: 14px; color: var(--muted); font-size: 12px; background: var(--panel-soft); }
.collaboration-error { margin: 14px 26px 0; border: 1px solid rgba(223, 112, 117, .5); padding: 11px 13px; color: var(--coral); font-size: 12px; }
.collaboration-main-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(270px, .9fr); gap: 1px; margin-top: 18px; background: var(--line); }
.collaboration-section { min-width: 0; padding: 20px 22px; background: var(--panel); }
.collaboration-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; min-height: 37px; margin-bottom: 15px; }
.collaboration-section-heading h3 { margin-top: 5px; font-size: 17px; font-weight: 600; }
.collaboration-section-heading select { min-height: 32px; margin: 0; padding: 0 7px; font-size: 11px; }
.collaboration-invitation-list { display: grid; gap: 8px; }
.collaboration-invitation-row { display: flex; justify-content: space-between; gap: 15px; border: 1px solid rgba(229, 163, 95, .45); padding: 12px; background: rgba(229, 163, 95, .06); }
.collaboration-invitation-row > div { min-width: 0; }
.collaboration-invitation-row strong, .collaboration-invitation-row span { display: block; overflow-wrap: anywhere; }
.collaboration-invitation-row strong { font-size: 12px; }
.collaboration-invitation-row span { margin-top: 5px; color: var(--muted); font-size: 10px; }
.collaboration-invitation-row p { margin-top: 7px; color: var(--paper); font-size: 11px; }
.collaboration-invitation-row footer { display: flex; flex: 0 0 auto; gap: 5px; align-items: center; }
.collaboration-invitation-row footer button { min-height: 29px; }
.collaboration-invite-form { display: grid; grid-template-columns: minmax(0, 1fr) 110px auto; gap: 8px; align-items: end; margin-bottom: 13px; }
.collaboration-invite-form label, .collaboration-comment-form label, .collaboration-review-form label { display: grid; gap: 5px; color: var(--muted); font-size: 10px; }
.collaboration-invite-form input, .collaboration-invite-form select, .collaboration-comment-form select, .collaboration-review-form select { width: 100%; min-height: 35px; margin: 0; padding: 0 8px; font-size: 11px; }
.collaboration-invite-form .collaboration-invite-message { grid-column: 1 / 3; }
.collaboration-invite-form > button { min-height: 35px; padding: 0 10px; }
.collaboration-member-list { display: grid; gap: 1px; border: 1px solid var(--line); background: var(--line); }
.collaboration-member-row { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 9px; align-items: center; min-height: 53px; padding: 8px 10px; background: var(--panel-soft); }
.collaboration-avatar { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid rgba(66, 217, 200, .35); border-radius: 50%; color: var(--jade); background: rgba(66, 217, 200, .1); font-size: 11px; font-weight: 800; }
.collaboration-member-row > div:nth-child(2) { display: grid; min-width: 0; }
.collaboration-member-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.collaboration-member-row small { margin-top: 3px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
.collaboration-member-actions { display: flex; gap: 6px; align-items: center; }
.collaboration-member-actions select { width: 72px; min-height: 29px; margin: 0; padding: 0 4px; font-size: 9px; }
.collaboration-role-pill { border: 1px solid var(--line); padding: 5px 7px; color: var(--muted); font-size: 9px; white-space: nowrap; }
.collaboration-pending-list { padding-top: 11px; }
.collaboration-pending-row { display: flex; justify-content: space-between; gap: 8px; align-items: center; border-top: 1px solid var(--line); padding: 8px 0 0; color: var(--paper); font-size: 10px; }
.collaboration-subhead { margin: 14px 0 7px; color: var(--muted); font-size: 10px; }
.collaboration-activity-list { display: grid; gap: 1px; max-height: 272px; overflow: auto; border: 1px solid var(--line); background: var(--line); }
.collaboration-activity-list article { display: grid; grid-template-columns: 75px minmax(0, 1fr); gap: 8px; padding: 9px; background: var(--panel-soft); }
.collaboration-activity-list article > span { color: var(--muted); font-size: 9px; }
.collaboration-activity-list article div { display: grid; gap: 3px; min-width: 0; }
.collaboration-activity-list strong { overflow-wrap: anywhere; font-size: 10px; }
.collaboration-activity-list small { color: var(--muted); font-size: 9px; overflow-wrap: anywhere; }
.collaboration-comment-form, .collaboration-review-form { display: grid; gap: 9px; }
.collaboration-comment-form textarea, .collaboration-review-form textarea { width: 100%; min-height: 76px; resize: vertical; border-color: var(--line); color: var(--paper); background: var(--panel-soft); font-size: 11px; }
.collaboration-comment-form button, .collaboration-review-form button { justify-self: start; min-height: 32px; padding: 0 11px; }
.collaboration-comment-list, .collaboration-decision-list { display: grid; gap: 8px; margin-top: 15px; }
.collaboration-comment-row, .collaboration-decision-row { border: 1px solid var(--line); padding: 11px; background: var(--panel-soft); }
.collaboration-comment-row.is-resolved { opacity: .72; }
.collaboration-comment-row header, .collaboration-comment-row footer, .collaboration-decision-row > div { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.collaboration-comment-row header span, .collaboration-comment-row footer, .collaboration-decision-row small { color: var(--muted); font-size: 9px; }
.collaboration-comment-row p, .collaboration-decision-row p { margin: 8px 0; color: var(--paper); font-size: 11px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.collaboration-comment-row footer button { min-height: 26px; }
.collaboration-decision-row > div span { color: var(--amber); font-size: 10px; }
.inline-empty { padding: 17px 10px; color: var(--muted); font-size: 10px; text-align: center; }
.assistant-teaser { background: #202825; }
.assistant-mini, .assistant-title { display: flex; align-items: center; gap: 10px; }
.assistant-mini img, .assistant-title img { width: 42px; height: 42px; object-fit: contain; }
.assistant-mini h3 { margin-top: 5px; font-size: 16px; font-weight: 600; }
.assistant-teaser > p { margin: 14px 0; }
.rule-teaser h3 { margin-top: 7px; font-size: 16px; font-weight: 600; }
#directorRulesSummary { display: grid; gap: 8px; margin-top: 15px; color: var(--muted); font-size: 12px; }

.application-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; padding-top: 26px; }
.application-card { display: flex; min-height: 250px; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: var(--panel); }
.application-card:hover { border-color: var(--amber); }
.application-card .app-index { color: var(--amber); font-size: 11px; }
.application-card h2 { margin-top: 26px; font-size: 22px; font-weight: 500; }
.application-card p { margin-top: 10px; color: var(--muted); font-size: 13px; }
.application-card footer { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 22px; }
.application-card footer small { color: var(--muted); }
.application-card .app-category { color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.application-card-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 12px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.application-card-points { display: block; margin-top: 8px; color: var(--jade); font-size: 11px; line-height: 1.45; }
.application-card button { border: 0; padding: 0; color: var(--amber); background: transparent; font-weight: 700; }
.application-card button:hover { color: var(--white); }
.skill-card-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 10px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.skill-card-points { display: block; margin-top: 7px; color: var(--jade); font-size: 11px; line-height: 1.45; }
.directory-result-preview { display: grid; grid-template-columns: minmax(138px, .72fr) minmax(0, 1.28fr); min-width: 0; margin-top: 13px; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; background: #101513; }
.directory-result-media { position: relative; min-width: 0; min-height: 132px; overflow: hidden; background: #0b0f0e; }
.directory-result-media img, .directory-result-media video { width: 100%; height: 100%; min-height: 132px; object-fit: cover; }
.directory-result-play { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; color: var(--white); background: rgba(8,12,11,.55); font-size: 11px; transform: translate(-50%, -50%); pointer-events: none; }
.directory-result-copy { display: grid; align-content: center; gap: 5px; min-width: 0; padding: 12px 13px; }
.directory-result-kicker { color: var(--amber); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.directory-result-copy > strong { color: var(--paper); font-size: 13px; }
.directory-result-copy > p { margin: 0 !important; color: var(--muted); font-size: 10px !important; line-height: 1.5 !important; }
.directory-result-facts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.directory-result-facts > span { display: inline-flex; align-items: baseline; gap: 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 999px; padding: 3px 6px; min-width: 0; }
.directory-result-facts small { color: var(--muted-dark); font-size: 8px; }
.directory-result-facts strong { overflow: hidden; color: var(--muted); font-size: 9px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.directory-result-structure { position: relative; display: grid; align-content: center; gap: 9px; min-height: 132px; padding: 22px; overflow: hidden; background: linear-gradient(135deg, rgba(229,163,95,.15), rgba(82,122,108,.08)); }
.directory-result-structure::after { position: absolute; right: -28px; bottom: -32px; width: 100px; height: 100px; border: 1px solid rgba(229,163,95,.18); border-radius: 50%; content: ""; }
.directory-result-structure span { color: var(--amber); font-size: 10px; font-weight: 750; letter-spacing: .14em; }
.directory-result-structure i { display: block; width: 88%; height: 4px; border-radius: 999px; background: rgba(242,238,229,.16); }
.directory-result-structure i:nth-of-type(2) { width: 64%; }
.directory-result-structure i:nth-of-type(3) { width: 76%; background: rgba(145,183,168,.25); }
.directory-result-structure-audio i { height: 16px; background: repeating-linear-gradient(90deg, rgba(229,163,95,.7) 0 2px, transparent 2px 6px); }
.directory-result-structure-report i:nth-of-type(1), .directory-result-structure-report i:nth-of-type(3) { background: rgba(145,183,168,.42); }
.application-card-preview { position: relative; display: block; height: 150px; margin-top: 13px; }
.application-card-preview .directory-result-media, .application-card-preview .directory-result-structure { width: 100%; height: 100%; min-height: 150px; }
.application-card-preview .directory-result-media img, .application-card-preview .directory-result-media video { min-height: 150px; }
.application-card-preview .directory-result-copy { position: absolute; right: 0; bottom: 0; left: 0; gap: 2px; padding: 24px 11px 9px; background: linear-gradient(transparent, rgba(7,11,10,.92)); }
.application-card-preview .directory-result-copy > p, .application-card-preview .directory-result-facts { display: none; }
.application-card-preview .directory-result-kicker { color: #f2bf82; }
.skill-card-preview { margin-top: 13px; }
@media (max-width: 620px) { .skill-card-preview { grid-template-columns: 1fr; } .skill-card-preview .directory-result-media, .skill-card-preview .directory-result-structure { min-height: 160px; } }
.application-runner { margin-top: 26px; border-top: 1px solid var(--line); padding-top: 25px; }
.runner-topbar { display: flex; align-items: center; justify-content: space-between; }
.runner-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 60px; padding: 36px 0; }
.runner-copy h2 { margin-top: 10px; font-size: clamp(30px, 4vw, 52px); font-weight: 500; }
.runner-copy > p { max-width: 500px; margin-top: 15px; color: var(--muted); }
.skill-chain { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 28px; }
.skill-chain span { border: 1px solid var(--line); border-radius: 999px; padding: 5px 8px; color: var(--muted); font-size: 11px; }
.runner-form { align-self: start; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: var(--panel); }
.runner-form { display: grid; gap: 14px; }
.runner-form input, .runner-form textarea, .runner-form select { min-height: 44px; border-color: var(--line); color: var(--paper); background: var(--panel-soft); }
.runner-form textarea { min-height: 130px; resize: vertical; }
.runner-status { min-height: 22px; color: var(--muted); font-size: 12px; }
.runner-result { border-top: 1px solid var(--line); padding: 25px 0; }
.runner-result h3 { font-size: 19px; font-weight: 600; }
.runner-result pre { overflow: auto; margin: 14px 0 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; color: var(--paper); background: #111514; white-space: pre-wrap; }

.asset-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 24px; border: 1px solid var(--line); background: var(--line); }
.asset-metrics > div { display: grid; gap: 9px; min-height: 100px; padding: 17px; background: var(--panel); }
.asset-metrics span { color: var(--muted); font-size: 12px; }
.asset-metrics strong { color: var(--amber); font-size: 29px; font-weight: 500; }
.production-proof { margin-top: 24px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #121715; }
.production-proof-intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: clamp(22px, 3.5vw, 38px); border-bottom: 1px solid var(--line); background: radial-gradient(circle at 88% 20%, rgba(229,163,95,.13), transparent 32%), #171d1a; }
.production-proof-copy { max-width: 760px; }
.production-proof-copy h2 { max-width: 680px; margin-top: 8px; font-size: clamp(28px, 4vw, 48px); font-weight: 500; line-height: 1.12; }
.production-proof-copy > p:not(.eyebrow) { max-width: 720px; margin-top: 13px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.production-proof-badges { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }
.production-proof-badges span { border: 1px solid rgba(229,163,95,.32); border-radius: 999px; padding: 5px 9px; color: #d8ba96; background: rgba(229,163,95,.06); font-size: 10px; }
.production-proof-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.production-proof-chain { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; background: var(--line); list-style: none; }
.production-proof-card { display: grid; grid-template-rows: auto auto minmax(52px, auto) auto; gap: 11px; min-width: 0; padding: 15px; background: var(--panel); }
.production-proof-card > header { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.production-proof-card > header span { color: var(--amber); font-size: 10px; font-variant-numeric: tabular-nums; }
.production-proof-card > header strong { color: var(--paper); font-size: 13px; }
.production-proof-card > header small { overflow: hidden; margin-left: auto; color: var(--muted-dark); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.production-proof-card > p { color: var(--muted); font-size: 11px; line-height: 1.55; }
.production-proof-card > footer { display: grid; gap: 4px; padding-top: 9px; border-top: 1px solid var(--line); }
.production-proof-card > footer span { color: var(--muted-dark); font-size: 9px; line-height: 1.4; }
.production-proof-visual { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: #0b0f0e; }
.production-proof-visual img, .production-proof-visual video { width: 100%; height: 100%; object-fit: cover; }
.production-proof-script { display: grid; align-content: center; gap: 7px; min-height: 0; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid #d9d0bd; border-radius: 4px; padding: 16px; color: #312c25; background: #f0eadc; font-family: ui-serif, Georgia, "Noto Serif SC", serif; }
.production-proof-script strong { font-size: 14px; }
.production-proof-script span { font-size: 10px; color: #8b5c2d; }
.production-proof-script b { font-size: 10px; }
.production-proof-script p { font-size: 10px; line-height: 1.55; }
@media (max-width: 1080px) { .production-proof-chain { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .production-proof-intro { align-items: flex-start; flex-direction: column; } .production-proof-actions { justify-content: flex-start; } }
@media (max-width: 560px) { .production-proof-chain { grid-template-columns: 1fr; } .production-proof-actions, .production-proof-actions button { width: 100%; } }
.asset-library-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 28px; border-bottom: 1px solid var(--line); padding-bottom: 13px; }
.asset-tabs { display: flex; gap: 2px; overflow-x: auto; }
.asset-tabs button { min-height: 38px; border: 0; border-bottom: 2px solid transparent; padding: 0 12px; color: var(--muted); background: transparent; white-space: nowrap; }
.asset-tabs button.active { border-bottom-color: var(--amber); color: var(--paper); }
.asset-library-toolbar > span { color: var(--muted); font-size: 12px; text-align: right; }
.asset-library-sections { display: grid; min-width: 0; }
.asset-library-section { min-width: 0; padding-top: 24px; }
.asset-library-section + .asset-library-section { margin-top: 24px; border-top: 1px solid var(--line); }
.asset-library-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.asset-library-section-heading h2 { margin: 0; font-size: 20px; font-weight: 500; }
.asset-library-section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.asset-library-section-heading > span { color: var(--muted); font-size: 12px; white-space: nowrap; }
.public-actor-filters { display: grid; gap: 13px; margin-bottom: 18px; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; background: var(--panel); }
.public-actor-search { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.public-actor-search label { color: var(--muted); font-size: 12px; }
.public-actor-search input { flex: 1 1 220px; min-width: 0; max-width: 460px; min-height: 36px; border: 1px solid var(--line); border-radius: 4px; padding: 7px 10px; color: var(--paper); background: var(--panel-soft); }
.public-actor-filter-row { display: flex; align-items: baseline; gap: 16px; }
.public-actor-filter-row > strong { flex: 0 0 52px; color: var(--muted); font-size: 12px; font-weight: 500; }
.public-actor-filter-row > div { display: flex; flex-wrap: wrap; gap: 7px; }
.public-actor-filter-row button { min-height: 33px; border: 1px solid var(--line); border-radius: 5px; padding: 6px 10px; color: var(--muted); background: transparent; font-size: 12px; }
.public-actor-filter-row button span { margin-left: 4px; opacity: .65; font-size: 10px; }
.public-actor-filter-row button.active { border-color: var(--amber); color: var(--amber); background: rgba(201,163,95,.08); }
.public-actor-filter-row button:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.public-actor-filter-note { margin: 0; color: var(--muted-dark); font-size: 11px; line-height: 1.6; }
@media (max-width: 600px) {
  .public-actor-filters { padding: 12px; }
  .public-actor-search label { flex-basis: 100%; }
  .public-actor-search input { flex-basis: 160px; }
  .public-actor-filter-row { flex-direction: column; gap: 7px; }
  .public-actor-filter-row > strong { flex-basis: auto; }
}
.asset-strip, .gen-history-strip { display: grid; grid-auto-flow: column; grid-template-rows: 1fr; align-items: stretch; gap: 14px; overflow-x: auto; overscroll-behavior-inline: contain; padding: 0 0 12px; scroll-snap-type: inline proximity; scrollbar-color: var(--muted-dark) transparent; scrollbar-width: thin; }
.asset-strip { grid-auto-columns: 238px; }
.gen-history-strip { grid-auto-columns: 220px; }
.asset-strip > *, .gen-history-strip > * { min-width: 0; scroll-snap-align: start; }
.asset-strip:focus-visible, .gen-history-strip:focus-visible { outline: 1px solid var(--amber); outline-offset: 4px; }
.asset-library-section-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 6px; }
.asset-library-section-actions button { border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.asset-library-section-actions button:hover { color: var(--white); }
.asset-card-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; color: var(--muted); font-size: 11px; }
.asset-card-meta span { color: var(--muted); font-size: 11px; }
.asset-card-completeness { display: grid; gap: 6px; }
.asset-card-completeness > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; color: var(--muted); font-size: 10px; }
.asset-card-completeness > div strong { margin-left: auto; color: var(--amber); font-size: 13px; font-weight: 650; }
.asset-card-completeness > div > span:last-child { color: var(--muted-dark); }
.asset-card-completeness-track { display: block; height: 4px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.1); }
.asset-card-completeness-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--amber), var(--jade)); }
.asset-card-recent { display: grid; gap: 3px; min-width: 0; border-left: 2px solid var(--jade); padding: 7px 9px; background: rgba(145,183,168,.05); }
.asset-card-recent span { color: var(--muted-dark); font-size: 9px; }
.asset-card-recent strong { overflow: hidden; color: var(--paper); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.asset-card-recent small { overflow: hidden; color: var(--muted); font-size: 9px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.asset-card-recent.is-empty { border-left-color: var(--line); background: transparent; }
.asset-card-recent.is-empty strong { color: var(--muted); font-weight: 500; }
.public-ip-readiness { color: #d8b77d; font-size: 10px; line-height: 1.45; }
.public-ip-readiness.is-ready { color: #8ecf9d; }
.asset-card-actions { display: flex; flex-wrap: wrap; gap: 8px 12px; }
.asset-card-badge { position: absolute; top: 10px; left: 10px; border-radius: 999px; padding: 4px 8px; color: var(--ink); background: var(--amber); font-size: 10px; }
.ip-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ip-form-grid label.wide { grid-column: 1 / -1; }
.ip-form-grid input, .ip-form-grid select, .ip-form-grid textarea { width: 100%; }
.ip-detail-dialog { width: min(760px, calc(100vw - 32px)); max-width: 760px; }
.ip-detail-dialog .modal-actions { flex-wrap: wrap; }
.generation-history { margin-top: 38px; }
.gen-history-actions { display: flex; align-items: center; gap: 8px; }
.gen-history-actions button { border: 0; padding: 0; color: var(--muted); background: transparent; font-size: 12px; }
.gen-history-actions button:hover { color: var(--amber); }
.asset-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.asset-card { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.asset-card-media { position: relative; aspect-ratio: 1 / 1.05; background: var(--panel-soft); }
.asset-card-media img { display: block; width: 100%; height: 100%; object-fit: contain; background: #0c0f0e; }
.public-ip-preview-trigger { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; border: 0; padding: 0; background: transparent; cursor: zoom-in; }
.public-ip-preview-trigger img { display: block; transition: transform .2s ease; }
.public-ip-preview-trigger:hover img { transform: scale(1.015); }
.public-model-media img { object-fit: contain; }
.public-actor-media img { object-fit: contain; }
.public-ip-preview-dialog { width: min(920px, calc(100vw - 32px)); max-width: 920px; padding: 0; border: 1px solid var(--line); background: var(--panel); color: var(--paper); }
.public-ip-preview-dialog::backdrop { background: rgba(7, 10, 9, .82); }
.public-ip-preview { display: grid; gap: 16px; padding: 22px; }
.public-ip-preview-stage { display: grid; place-items: center; min-height: min(64vh, 640px); max-height: 68vh; overflow: hidden; border: 1px solid var(--line); background: #0c0f0e; }
.public-ip-preview-stage img { display: block; width: 100%; height: 100%; max-height: 68vh; object-fit: contain; }
.public-ip-preview-views { display: flex; gap: 10px; overflow-x: auto; }
.public-ip-preview-views button { display: grid; grid-template-columns: 48px auto; align-items: center; gap: 9px; flex: 0 0 auto; min-width: 142px; border: 1px solid var(--line); padding: 6px; color: var(--muted); background: var(--panel-soft); text-align: left; }
.public-ip-preview-views button.active { border-color: var(--amber); color: var(--paper); }
.public-ip-preview-views img { width: 48px; height: 48px; object-fit: contain; background: #0c0f0e; }
.public-ip-preview-description { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.private-ip-detail-trigger { display: block; width: 100%; height: 100%; overflow: hidden; border: 0; padding: 0; background: transparent; cursor: pointer; }
.private-ip-detail-trigger img { display: block; transition: transform .2s ease; }
.private-ip-detail-trigger:hover img { transform: scale(1.015); }
.ip-detail-view { display: grid; gap: 20px; padding: 22px; }
.ip-detail-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
.ip-detail-summary-grid > div { display: grid; gap: 6px; min-width: 0; min-height: 90px; padding: 14px 16px; background: var(--panel); }
.ip-detail-summary-grid span { color: var(--muted); font-size: 10px; }
.ip-detail-summary-grid strong { overflow: hidden; color: var(--amber); font-size: 21px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.ip-detail-summary-grid small { overflow: hidden; color: var(--muted-dark); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.ip-detail-identity { display: grid; grid-template-columns: minmax(180px, 280px) 1fr; gap: 22px; align-items: stretch; }
.ip-detail-portrait { display: grid; place-items: center; min-height: 360px; aspect-ratio: 3 / 4; overflow: hidden; border: 1px solid var(--line); background: var(--panel-soft); color: var(--muted); }
.ip-detail-portrait img { display: block; width: 100%; height: 100%; max-height: none; object-fit: contain; }
.ip-detail-media-trigger { display: grid; place-items: center; width: 100%; height: 100%; min-height: inherit; overflow: hidden; border: 0; padding: 0; color: inherit; background: transparent; cursor: zoom-in; }
.ip-detail-media-trigger img { transition: transform .2s ease; }
.ip-detail-media-trigger:hover img { transform: scale(1.02); }
.ip-detail-facts { display: grid; align-content: start; gap: 14px; }
.ip-detail-facts dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.ip-detail-facts dl div { border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.ip-detail-facts dt { color: var(--muted); font-size: 11px; }
.ip-detail-facts dd { margin: 4px 0 0; color: var(--paper); font-size: 14px; }
.ip-detail-facts p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.ip-detail-completeness { color: var(--amber); font-size: 12px; }
.ip-detail-section { display: grid; gap: 12px; }
.ip-detail-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.ip-detail-section-heading > span { color: var(--amber); font-size: 11px; white-space: nowrap; }
.ip-detail-section-heading > span.is-ready { color: #8ecf9d; }
.ip-detail-section-heading h3, .ip-detail-lora h3 { margin: 0; font-size: 16px; }
.ip-detail-section-heading p, .ip-detail-lora p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.ip-public-profile-panel { border: 1px solid var(--line); padding: 14px; background: rgba(255, 255, 255, .018); }
.ip-public-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.ip-public-tags span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; color: var(--muted); background: rgba(255, 255, 255, .02); font-size: 10px; }
.ip-public-missing { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.ip-public-missing strong { color: var(--paper); }
.ip-public-missing.is-ready, .ip-public-missing.is-ready strong { color: #8ecf9d; }
.ip-public-prompt { border-top: 1px solid var(--line); padding-top: 10px; }
.ip-public-prompt summary { color: var(--amber); font-size: 11px; cursor: pointer; }
.ip-public-prompt label { display: grid; gap: 5px; margin-top: 10px; color: var(--muted); font-size: 10px; }
.ip-public-prompt textarea { width: 100%; resize: vertical; border: 1px solid var(--line); padding: 8px; color: var(--paper); background: rgba(9, 12, 11, .62); font: inherit; font-size: 11px; line-height: 1.55; }
.ip-public-prompt > small { display: block; margin-top: 8px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.ip-detail-media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ip-detail-media-card { display: grid; gap: 8px; min-width: 0; border: 1px solid var(--line); padding: 8px; background: var(--panel-soft); }
.ip-detail-media-card.is-ready { border-color: rgba(229, 176, 76, .44); }
.ip-detail-media-card.is-missing { border-style: dashed; }
.ip-detail-media-image { display: grid; place-items: center; min-height: 220px; aspect-ratio: 4 / 5; overflow: hidden; background: #0c0f0e; color: var(--muted); font-size: 11px; }
.ip-detail-media-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ip-detail-media-card strong { min-height: 2.4em; font-size: 12px; line-height: 1.2; }
.ip-detail-upload { color: var(--amber); font-size: 11px; cursor: pointer; }
.ip-detail-upload input { display: none; }
.ip-detail-media-title { display: grid; gap: 4px; }
.ip-detail-media-title small { min-height: 2.6em; color: var(--muted); font-size: 10px; line-height: 1.45; }
.ip-slot-prompt { display: grid; gap: 7px; border-top: 1px solid var(--line); padding-top: 8px; }
.ip-slot-prompt-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; }
.ip-slot-prompt-heading > span { color: var(--paper); font-weight: 600; }
.ip-slot-ready { color: #8ecf9d; }
.ip-slot-prompt-standard { border: 1px solid var(--line); background: rgba(9, 12, 11, .42); }
.ip-slot-prompt-standard summary { padding: 7px 8px; color: var(--amber); font-size: 10px; cursor: pointer; }
.ip-slot-prompt-standard pre { max-height: 180px; overflow: auto; margin: 0; border-top: 1px solid var(--line); padding: 8px; color: var(--muted); font: inherit; font-size: 10px; line-height: 1.55; white-space: pre-wrap; }
.ip-slot-negative { margin: 0; border-top: 1px solid var(--line); padding: 7px 8px 8px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.ip-slot-negative strong { color: #d9b3a5; font-weight: 500; }
.ip-slot-instruction { display: grid; gap: 4px; color: var(--muted); font-size: 10px; }
.ip-slot-instruction textarea { width: 100%; min-height: 52px; resize: vertical; border: 1px solid var(--line); padding: 7px 8px; color: var(--paper); background: rgba(9, 12, 11, .62); font: inherit; font-size: 11px; line-height: 1.45; }
.ip-slot-instruction textarea:focus { outline: 1px solid var(--amber); outline-offset: 1px; }
.ip-slot-select { display: inline-flex; align-items: center; gap: 4px; color: var(--amber); font-size: 10px; cursor: pointer; }
.ip-slot-select input { accent-color: var(--amber); }
.ip-slot-help, .ip-prompt-dependencies { color: var(--muted); font-size: 10px; line-height: 1.4; }
.ip-enrichment-section { border: 1px solid var(--line); padding: 14px; background: rgba(255, 255, 255, .018); }
.ip-enrichment-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ip-enrichment-route { color: var(--muted); font-size: 11px; }
.ip-enrichment-section .application-status { min-height: 18px; margin: 0; color: var(--muted); font-size: 11px; }
.ip-enrichment-progress { margin-top: 12px; padding: 12px; border: 1px solid var(--line); background: rgba(255, 255, 255, .02); }
.ip-enrichment-progress-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ip-enrichment-progress-heading > div { display: grid; gap: 3px; min-width: 0; }
.ip-enrichment-progress-heading strong { color: var(--text); font-size: 12px; font-weight: 650; }
.ip-enrichment-progress-heading small { color: var(--muted); font-size: 10px; }
.ip-enrichment-progress-track { height: 4px; margin: 10px 0 12px; overflow: hidden; background: rgba(255, 255, 255, .08); }
.ip-enrichment-progress-track span { display: block; height: 100%; background: var(--accent); transition: width .25s ease; }
.ip-enrichment-progress ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 7px; margin: 0; padding: 0; list-style: none; }
.ip-enrichment-action { display: grid; grid-template-columns: 8px minmax(0, 1fr); align-items: start; gap: 8px; min-height: 42px; padding: 8px; border: 1px solid var(--line); background: rgba(0, 0, 0, .08); }
.ip-enrichment-action-state { width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; background: #777; }
.ip-enrichment-action > div { display: grid; gap: 2px; min-width: 0; }
.ip-enrichment-action strong { overflow: hidden; color: var(--text); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.ip-enrichment-action small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.ip-enrichment-action.is-submitting .ip-enrichment-action-state,
.ip-enrichment-action.is-processing .ip-enrichment-action-state { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .14); }
.ip-enrichment-action.is-succeeded .ip-enrichment-action-state { background: #22c55e; }
.ip-enrichment-action.is-failed .ip-enrichment-action-state,
.ip-enrichment-action.is-resumable .ip-enrichment-action-state { background: #ef4444; }
.ip-detail-lora { display: flex; justify-content: space-between; gap: 16px; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 14px 0; }
.ip-detail-page { display: grid; gap: 24px; min-width: 0; padding: 4px 0 28px; }
.ip-detail-page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.ip-detail-page-header h2 { margin: 7px 0 4px; font-size: clamp(24px, 3vw, 34px); font-weight: 500; }
.ip-detail-page-header .modal-lead { margin: 0; color: var(--muted); font-size: 12px; }
.ip-detail-page-actions, .ip-detail-page-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.ip-detail-page-footer { border-top: 1px solid var(--line); padding-top: 16px; }
.back-link { border: 0; padding: 0; color: var(--amber); background: transparent; font: inherit; font-size: 12px; cursor: pointer; }
.back-link:hover { color: var(--paper); }
.ip-detail-media-note { color: var(--muted-dark); font-size: 10px; line-height: 1.4; }
.ip-detail-project-list { display: grid; gap: 8px; }
.ip-detail-project { display: flex; justify-content: space-between; align-items: center; gap: 16px; border: 1px solid var(--line); padding: 12px 14px; background: var(--panel-soft); }
.ip-detail-project > div { display: grid; gap: 4px; min-width: 0; }
.ip-detail-project strong { overflow: hidden; color: var(--paper); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ip-detail-project small { color: var(--muted); font-size: 11px; }
.ip-detail-empty { display: grid; gap: 5px; border: 1px dashed var(--line); padding: 18px; color: var(--muted); }
.ip-detail-empty strong { color: var(--paper); font-size: 13px; }
.ip-detail-empty span { font-size: 12px; }
.ip-detail-editor { display: grid; gap: 20px; }
.ip-detail-editor .ip-detail-page-header { margin-bottom: 2px; }
.ip-image-preview-dialog { width: min(900px, calc(100vw - 28px)); max-width: 900px; padding: 0; border: 1px solid var(--line); color: var(--paper); background: var(--panel); }
.ip-image-preview-dialog::backdrop { background: rgba(7, 10, 9, .84); }
.ip-image-preview-shell { display: grid; gap: 14px; padding: 18px; }
.ip-image-preview-shell .modal-heading { margin-bottom: 0; }
.ip-image-preview-stage { display: grid; place-items: center; min-height: min(68vh, 720px); max-height: 74vh; overflow: hidden; border: 1px solid var(--line); background: #0c0f0e; }
.ip-image-preview-stage img { display: block; width: 100%; height: 100%; max-height: 74vh; object-fit: contain; }
.ip-image-preview-label { margin: 0; color: var(--muted); font-size: 12px; }
@media (max-width: 700px) {
  .ip-detail-page-header { flex-direction: column; }
  .ip-detail-page-actions { width: 100%; }
  .ip-detail-page-actions button { width: 100%; }
  .ip-detail-summary-grid { grid-template-columns: 1fr; }
  .ip-detail-project { align-items: flex-start; flex-direction: column; }
}
.danger-button { border: 1px solid rgba(214, 105, 85, .5); padding: 8px 12px; color: #f19a87; background: transparent; cursor: pointer; }
.danger-button:hover { border-color: #f19a87; color: #ffd3ca; }
.sm-upload-selected { margin: 8px 0 0; color: var(--amber); font-size: 12px; overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .ip-detail-identity { grid-template-columns: 1fr; }
  .ip-detail-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ip-detail-portrait { min-height: 300px; }
  .ip-enrichment-toolbar { align-items: stretch; }
  .ip-enrichment-toolbar > * { width: 100%; }
  .ip-enrichment-progress-heading { align-items: stretch; flex-direction: column; }
}
@media (max-width: 420px) {
  .ip-detail-media-grid { grid-template-columns: 1fr; }
  .application-grid { grid-template-columns: 1fr; }
  .application-card { min-height: 230px; }
}
.asset-card-body { display: grid; gap: 7px; min-height: 114px; padding: 13px; }
.asset-card-body span { color: var(--amber); font-size: 10px; }
.asset-card-body strong { font-size: 16px; }
.asset-card-body p { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.asset-card-body button { justify-self: start; border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.asset-card-body button:hover { color: var(--white); }

.case-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; padding-top: 25px; }
.case-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.case-card-media { position: relative; aspect-ratio: 4 / 5; }
.case-card-media img, .case-card-media video { width: 100%; height: 100%; object-fit: cover; background: #0c0f0e; }
.case-card-media span { position: absolute; top: 11px; left: 11px; border-radius: 999px; padding: 4px 8px; color: var(--ink); background: var(--amber); font-size: 10px; }
.case-card-body { display: grid; gap: 8px; padding: 14px; }
.case-card-body h2 { font-size: 17px; font-weight: 600; }
.case-card-body p { min-height: 38px; color: var(--muted); font-size: 12px; }
.case-card-actions { display: flex; justify-content: space-between; gap: 8px; padding-top: 5px; }
.case-card-actions button { border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.case-card-actions button:hover { color: var(--white); }

.together-page-header { align-items: center; }
.together-commercial-band { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 20px 0 4px; padding: 14px 16px; border: 1px solid rgba(217,164,65,.38); border-radius: 8px; background: rgba(217,164,65,.08); }
.together-commercial-band > div { display: grid; gap: 4px; min-width: 0; }
.together-commercial-band strong { color: var(--amber); font-size: 14px; }
.together-commercial-band span { color: var(--muted); font-size: 12px; line-height: 1.55; }
@media (max-width: 760px) { .together-commercial-band { align-items: flex-start; flex-direction: column; } }
.page-header-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.case-submit-dialog { width: min(720px, calc(100vw - 32px)); max-width: 720px; padding: 0; border: 1px solid var(--line); background: var(--panel); color: var(--paper); }
.case-submit-dialog::backdrop { background: rgba(10, 14, 20, .62); }
.case-submit-form { display: grid; gap: 20px; padding: 26px; }
.case-submit-form .modal-head { margin: 0; }
.case-submit-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .55fr); gap: 14px; }
.case-submit-fields label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.case-submit-fields label.wide, .case-submit-file, .case-submit-consent { grid-column: 1 / -1; }
.case-submit-fields input:not([type="checkbox"]), .case-submit-fields select, .case-submit-fields textarea { width: 100%; border: 1px solid var(--line); background: var(--paper); color: var(--ink); padding: 11px 12px; font: inherit; border-radius: 4px; }
.case-submit-fields textarea { resize: vertical; min-height: 92px; }
.case-submit-file input { padding: 10px; border: 1px dashed var(--line); background: var(--paper); color: var(--ink); }
.case-submit-file small { color: var(--muted); font-size: 11px; }
.case-submit-consent { display: flex !important; align-items: flex-start; gap: 9px !important; line-height: 1.6; }
.case-submit-consent input { margin-top: 3px; accent-color: var(--amber); }
.case-submit-status { min-height: 20px; margin: 0; color: var(--muted); font-size: 13px; }
.case-submit-status.is-error { color: #b64136; }
.case-submit-status.is-success { color: #2e7551; }
.case-submit-form .modal-actions { display: flex; justify-content: flex-end; gap: 10px; }
.together-steps { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.together-steps span { display: inline-flex; align-items: center; gap: 7px; }
.together-steps b { color: var(--amber); font-size: 10px; font-weight: 700; }
.together-steps i { color: var(--line); font-style: normal; }
.play-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .7fr); gap: 28px; align-items: stretch; margin-top: 25px; border-bottom: 1px solid var(--line); background: var(--panel); }
.play-intro-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 4vw, 55px); }
.play-intro-copy h2 { max-width: 500px; margin-top: 11px; font-size: clamp(28px, 4vw, 46px); font-weight: 500; }
.play-intro-copy p:not(.eyebrow) { max-width: 510px; margin-top: 15px; color: var(--muted); }
.play-intro > img { width: 100%; height: 260px; object-fit: cover; }
.play-template-section { padding-top: 33px; }
.play-template-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.play-template-card { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.play-template-card:hover { border-color: var(--amber); }
.play-template-media { position: relative; aspect-ratio: 4 / 5; background: var(--panel-soft); }
.play-template-media img, .play-template-media video { width: 100%; height: 100%; object-fit: cover; background: #0c0f0e; }
.play-template-media > span { position: absolute; top: 10px; left: 10px; border: 1px solid rgba(13, 15, 15, .28); border-radius: 999px; padding: 3px 8px; color: var(--ink); background: var(--amber); font-size: 10px; }
.play-template-body { display: grid; gap: 8px; padding: 14px; }
.play-template-body h3 { overflow: hidden; font-size: 17px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.play-template-body p { min-height: 38px; color: var(--muted); font-size: 12px; }
.play-template-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; color: var(--muted); font-size: 11px; }
.play-template-atom { color: var(--amber); }
.play-template-body button { justify-self: start; margin-top: 5px; border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; font-weight: 700; }
.play-template-body button:hover { color: var(--white); }
.play-template-card.is-selected { border-color: var(--amber); box-shadow: inset 0 -2px 0 var(--amber); }
.remix-panel { display: grid; grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr); gap: 28px; margin-top: 38px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 25px 0; }
.remix-selected { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: start; gap: 15px; }
.remix-selected-media { width: 96px; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; background: var(--panel-soft); }
.remix-selected-media img, .remix-selected-media video { width: 100%; height: 100%; object-fit: cover; background: #0c0f0e; }
.remix-selected h2 { margin-top: 8px; font-size: 25px; font-weight: 500; }
.remix-summary { margin-top: 9px; color: var(--muted); font-size: 12px; }
.remix-selected .text-button { margin-top: 14px; }
.remix-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-self: start; gap: 13px; }
.remix-form label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.remix-form label:nth-of-type(2) { grid-column: 1 / -1; }
.remix-form input, .remix-form select, .remix-form textarea { width: 100%; border-color: var(--line); color: var(--paper); background: var(--panel-soft); }
.remix-form textarea { min-height: 110px; resize: vertical; }
.remix-status { grid-column: 1 / -1; min-height: 20px; color: var(--muted); font-size: 12px; }
.remix-status.is-error { color: var(--coral); }
.remix-status.is-success { color: var(--jade); }
.remix-form .panel-actions { grid-column: 1 / -1; margin-top: 0; }
.generated-section { padding-top: 36px; }
.section-note { color: var(--muted); font-size: 12px; }
.generated-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.generated-card { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 13px; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px; background: var(--panel); }
.generated-card img, .generated-card video { width: 88px; height: 100px; border-radius: 4px; object-fit: cover; background: var(--panel-soft); }
.generated-card-media { width: 88px; height: 100px; overflow: hidden; border-radius: 4px; background: var(--panel-soft); }
.generated-card-media img, .generated-card-media video { width: 100%; height: 100%; border-radius: 0; object-fit: cover; }
.showcase-work-card { grid-template-columns: 88px minmax(0, 1fr); }
.generated-card-copy { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
.generated-card-copy > span { color: var(--jade); font-size: 10px; }
.generated-card-copy strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.generated-card-copy p { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: 12px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.generated-card-copy button { align-self: start; margin-top: auto; border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; }
.case-grid .loading-state { grid-column: 1 / -1; }
.template-library-section { padding-top: 28px; }
.template-library-section + .template-library-section { margin-top: 44px; }
.template-library-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-top: 18px; }
.template-filter-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.template-filter-tabs button { border: 1px solid var(--line); border-radius: 999px; padding: 7px 11px; color: var(--muted); background: transparent; font-size: 11px; cursor: pointer; }
.template-filter-tabs button:hover, .template-filter-tabs button.active { border-color: var(--amber); color: var(--paper); background: rgba(238,178,75,.08); }
.template-library-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.template-library-card { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.template-library-card:hover { border-color: var(--amber); }
.template-library-card-media { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: var(--panel-soft); }
.template-library-card-media img, .template-library-card-media video { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.template-library-card-media video { background: #111514; }
.template-preview-fallback { position: absolute; inset: 0; display: grid; place-content: center; gap: 7px; color: var(--muted); text-align: center; background: var(--panel-soft); }
.template-preview-fallback span { color: var(--amber); font-size: 22px; }
.template-preview-fallback strong { font-size: 12px; font-weight: 500; }
.template-preview-label { position: absolute; z-index: 2; right: 8px; bottom: 8px; border: 1px solid rgba(255,255,255,.22); padding: 3px 6px; color: #fff; background: rgba(10,12,12,.76); font-size: 10px; }
.template-library-card-media.is-missing .template-preview-label { display: none; }
.template-library-card-body { display: grid; gap: 8px; padding: 14px; }
.template-library-card-top, .template-library-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.template-library-card-top { color: var(--amber); font-size: 11px; }
.template-library-card-top .template-kind-badge { border: 1px solid currentColor; border-radius: 999px; padding: 3px 7px; }
.template-library-card-top small, .template-library-phases { color: var(--muted); }
.template-library-card-body h3 { overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.template-library-card-body p { min-height: 36px; color: var(--muted); font-size: 12px; }
.template-library-card-meta { display: flex; flex-wrap: wrap; gap: 6px; color: var(--muted); font-size: 11px; }
.template-library-card-meta span { border: 1px solid var(--line); padding: 3px 6px; }
.template-library-card-direct { border-color: rgba(238,178,75,.42); }
.template-direct-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 22px; border-top: 1px solid var(--line); padding-top: 20px; }
.template-direct-form .wide { grid-column: 1 / -1; }
.template-direct-form label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.template-direct-form textarea { min-height: 150px; resize: vertical; }
.template-direct-form label > small { color: var(--muted-dark); font-size: 10px; line-height: 1.5; }
.template-direct-reference { border: 1px solid var(--line); padding: 12px; background: rgba(255, 255, 255, .018); }
.template-direct-reference > span { color: var(--paper); font-size: 12px; }
.template-direct-reference input[type="file"] { width: 100%; border: 1px dashed var(--line); padding: 10px; color: var(--muted); background: rgba(0, 0, 0, .12); font-size: 11px; }
.template-direct-ip { display: flex; align-items: center; gap: 10px; }
.template-direct-ip img { width: 44px; height: 58px; border: 1px solid var(--line); object-fit: cover; }
.template-direct-ip select { flex: 1; }
.template-direct-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.template-library-phases { min-height: 28px; font-size: 11px; line-height: 1.5; }
.template-library-card-actions { justify-content: flex-start; flex-wrap: wrap; margin-top: 4px; }
.template-detail { margin-top: 42px; border-top: 1px solid var(--line); padding-top: 26px; }
.template-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.template-detail-head h2 { margin-top: 8px; font-size: 28px; font-weight: 500; }
.template-detail-head p { margin-top: 8px; color: var(--muted); }
.template-detail-phases { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.template-detail-phases span { border: 1px solid var(--line); border-radius: 999px; padding: 5px 10px; color: var(--muted); font-size: 11px; }
.template-detail-preview { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(180px, .7fr); align-items: center; gap: 18px; margin: 22px 0 0; border: 1px solid var(--line); padding: 12px; background: var(--panel-soft); }
.template-detail-preview img, .template-detail-preview video { display: block; width: 100%; max-height: 420px; object-fit: contain; background: #0b0e0d; }
.template-detail-preview figcaption { color: var(--muted); font-size: 12px; line-height: 1.7; }
.template-edit-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 24px; }
.template-edit-form label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.template-edit-form .wide { grid-column: 1 / -1; }
.template-edit-form textarea { width: 100%; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; color: var(--paper); background: #111514; font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.template-change-fields { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; border: 1px solid var(--line); padding: 14px; }
.template-change-fields legend { padding: 0 6px; color: var(--muted); font-size: 12px; }
.template-change-fields label { display: flex; align-items: center; gap: 6px; color: var(--paper); font-size: 12px; }
.template-change-fields input { accent-color: var(--amber); }
.template-detail-actions { display: flex; flex-wrap: wrap; grid-column: 1 / -1; justify-content: flex-end; gap: 9px; }
.template-edit-hint, .template-public-detail { grid-column: 1 / -1; color: var(--muted); font-size: 12px; }
.template-public-detail { display: grid; gap: 16px; margin-top: 24px; }
.template-project-reuse select { width: 100%; }
@media (max-width: 720px) {
  .template-direct-form, .template-detail-preview { grid-template-columns: 1fr; }
}
.template-project-reuse small { color: var(--muted); line-height: 1.5; }
.template-run-panel { display: grid; gap: 16px; margin-top: 22px; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; background: var(--panel); }
.template-run-panel.is-empty { color: var(--muted); }
.template-run-panel.is-empty strong { color: var(--paper); }
.template-run-panel > header, .template-run-panel > footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.template-run-panel > header > div { display: grid; gap: 5px; }
.template-run-panel > header > div > strong { font-size: 20px; font-weight: 500; }
.template-run-panel > header > div > span, .template-run-panel > header > small, .template-run-panel > footer > span { color: var(--muted); font-size: 11px; }
.template-run-panel > header > small { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.template-run-panel ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.template-run-step { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-width: 0; border: 1px solid var(--line); padding: 10px; }
.template-run-step-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.template-run-step > div { display: grid; min-width: 0; gap: 2px; }
.template-run-step strong, .template-run-step small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.template-run-step small, .template-run-step em { color: var(--muted); font-size: 10px; font-style: normal; }
.template-run-step.is-reused .template-run-step-dot, .template-run-step.is-succeeded .template-run-step-dot { background: #6fcf97; }
.template-run-step.is-running .template-run-step-dot { background: var(--amber); box-shadow: 0 0 0 4px rgba(238, 178, 75, .14); }
.template-run-step.is-failed .template-run-step-dot { background: #e06b65; }
.template-run-error { border-left: 2px solid #e06b65; padding-left: 10px; color: #f0aaa5; font-size: 12px; }
.template-run-panel > footer { align-items: center; border-top: 1px solid var(--line); padding-top: 13px; }
.template-run-panel > footer > div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.inspiration-wall-section, .inspiration-reference-section { margin-top: 38px; border-top: 1px solid var(--line); padding-top: 28px; }
.inspiration-grid { columns: 5 180px; column-gap: 14px; padding-top: 18px; }
.inspiration-tile { position: relative; display: block; width: 100%; margin: 0 0 14px; overflow: hidden; break-inside: avoid; border: 1px solid var(--line); border-radius: var(--radius); padding: 0; background: var(--panel); cursor: pointer; }
.inspiration-tile-1, .inspiration-tile-4 { aspect-ratio: 4 / 5; }
.inspiration-tile-2, .inspiration-tile-5 { aspect-ratio: 16 / 10; }
.inspiration-tile-3, .inspiration-tile-6 { aspect-ratio: 1 / 1; }
.inspiration-tile-media { position: absolute; inset: 0; display: block; }
.inspiration-tile img, .inspiration-tile video { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease, opacity .25s ease; }
.inspiration-tile-overlay { position: absolute; right: 0; bottom: 0; left: 0; display: grid; gap: 3px; padding: 32px 12px 11px; color: var(--paper); background: linear-gradient(transparent, rgba(8, 11, 10, .86)); text-align: left; opacity: 0; transition: opacity .2s ease; }
.inspiration-tile-overlay strong { overflow: hidden; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.inspiration-tile-overlay small { color: #d7ddd7; font-size: 10px; }
.inspiration-play-mark { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid rgba(255, 255, 255, .55); border-radius: 50%; color: var(--paper); background: rgba(10, 12, 12, .55); transform: translate(-50%, -50%); font-size: 12px; pointer-events: none; }
.inspiration-tile:hover, .inspiration-tile:focus-visible { border-color: var(--amber); }
.inspiration-tile:hover img, .inspiration-tile:hover video, .inspiration-tile:focus-visible img, .inspiration-tile:focus-visible video { transform: scale(1.03); opacity: .82; }
.inspiration-tile:hover .inspiration-tile-overlay, .inspiration-tile:focus-visible .inspiration-tile-overlay { opacity: 1; }
.inspiration-reference-section .section-heading { align-items: end; }
.inspiration-reference-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.inspiration-reference-filters .category-chip { min-height: 30px; border: 1px solid var(--line); border-radius: 999px; padding: 0 10px; color: var(--muted); background: transparent; font-size: 11px; }
.inspiration-reference-filters .category-chip.active, .inspiration-reference-filters .category-chip:hover { border-color: var(--amber); color: var(--ink); background: var(--amber); }
.inspiration-reference-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 20px; }
.inspiration-reference-card { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.inspiration-reference-card,
.marketing-card { content-visibility: auto; contain-intrinsic-size: 320px 520px; }
.inspiration-reference-media { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border: 0; padding: 0; background: var(--panel-soft); cursor: pointer; }
.inspiration-reference-media img, .inspiration-reference-media video { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.inspiration-reference-media:hover img, .inspiration-reference-media:hover video { transform: scale(1.03); }
.inspiration-reference-kind { position: absolute; top: 9px; left: 9px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; padding: 4px 7px; color: var(--paper); background: rgba(9, 12, 11, .72); font-size: 10px; }
.inspiration-reference-copy { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px; }
.inspiration-reference-copy > div { display: grid; min-width: 0; gap: 5px; }
.inspiration-reference-copy span { color: var(--amber); font-size: 10px; }
.inspiration-reference-copy strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.inspiration-rights-note { display: block; color: var(--muted); font-size: 10px; line-height: 1.45; }
.inspiration-rights-note.is-original { color: var(--jade); }
.inspiration-rights-note.is-reference, .inspiration-rights-warning { color: var(--coral); }
.inspiration-rights-warning { margin: 0; font-size: 11px; line-height: 1.6; }
.inspiration-reference-copy .text-button { flex: 0 0 auto; color: var(--amber); font-size: 11px; }
.inspiration-reference-more { grid-column: 1 / -1; display: flex; justify-content: center; padding: 8px 0 4px; }
.inspiration-media-missing { display: grid; place-items: center; height: 100%; color: var(--muted); background: var(--panel-soft); font-size: 12px; }
.inspiration-remix-page { min-height: 600px; }
.inspiration-remix-shell { padding-bottom: 60px; }
.inspiration-remix-workspace { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: 22px; padding-top: 25px; }
.inspiration-remix-source, .inspiration-remix-editor { min-width: 0; border: 1px solid var(--line); background: var(--panel); }
.inspiration-remix-source-media { aspect-ratio: 16 / 10; overflow: hidden; background: #0c0f0e; }
.inspiration-remix-source-media img, .inspiration-remix-source-media video { width: 100%; height: 100%; object-fit: contain; }
.inspiration-remix-source-meta { display: grid; gap: 6px; padding: 15px; }
.inspiration-remix-source-meta span { color: var(--amber); font-size: 11px; }
.inspiration-remix-source-meta strong { font-size: 17px; }
.inspiration-remix-source-meta small { color: var(--muted); font-size: 11px; }
.inspiration-remix-editor { display: grid; align-content: start; gap: 15px; padding: 22px; }
.inspiration-remix-prompt { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.inspiration-remix-prompt textarea { min-height: 230px; resize: vertical; border-color: var(--line); color: var(--paper); background: var(--panel-soft); line-height: 1.65; }
.inspiration-translation-note { color: var(--jade); font-size: 11px; }
.inspiration-shared-section { margin-top: 42px; border-top: 1px solid var(--line); padding-top: 28px; }
.inspiration-shared-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 18px; }
.inspiration-shared-card { display: grid; gap: 8px; min-width: 0; border: 1px solid var(--line); padding: 0 0 10px; color: var(--paper); background: var(--panel); text-align: left; cursor: pointer; }
.inspiration-shared-card img, .inspiration-shared-card video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.inspiration-shared-card strong { overflow: hidden; padding: 0 10px; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.inspiration-remix-not-found { min-height: 460px; }
.legacy-page { display: none !important; }

/* The rebuild applications share one restrained work surface. Each tool gets
   its own input/output contract without inheriting the director dashboard. */
.application-shell { min-width: 0; padding: 6px 0 60px; }
.application-page-header { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 24px; border-bottom: 1px solid var(--line); padding: 18px 0 25px; }
.application-page-back-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px 14px; min-width: 0; }
.application-page-back-actions .back-button { margin-top: 7px; }
.application-page-header .back-button { align-self: start; margin-top: 7px; white-space: nowrap; }
.application-page-heading { min-width: 0; }
.application-page-heading h1 { margin-top: 7px; font-size: clamp(32px, 4vw, 54px); font-weight: 500; }
.application-page-heading > p:last-child { max-width: 720px; margin-top: 10px; color: var(--muted); }
.application-page-badge { align-self: start; border: 1px solid var(--line); border-radius: 999px; padding: 5px 10px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.application-workspace { display: grid; grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr); gap: 18px; align-items: start; padding-top: 22px; }
.application-control-panel, .application-result-panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.application-control-panel { padding: clamp(20px, 3vw, 30px); }
.application-result-panel { min-height: 560px; padding: clamp(20px, 3vw, 30px); background: #171c1a; }
.application-panel-heading { padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.application-panel-heading h2 { margin-top: 7px; font-size: 22px; font-weight: 600; }
.application-panel-heading p:last-child { margin-top: 8px; color: var(--muted); font-size: 12px; }
.application-form { display: grid; gap: 15px; padding-top: 20px; }
.application-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.application-field { display: grid; min-width: 0; gap: 7px; color: var(--muted); font-size: 12px; }
.application-field.wide { grid-column: 1 / -1; }
.application-field input, .application-field textarea, .application-field select { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 11px 12px; color: var(--paper); background: var(--panel-soft); }
.application-field input, .application-field select { min-height: 43px; }
.application-field textarea { resize: vertical; }
.application-field input:focus, .application-field textarea:focus, .application-field select:focus { border-color: var(--amber); box-shadow: 0 0 0 3px rgba(229, 163, 95, .12); }
.application-form-note { color: var(--muted); font-size: 12px; line-height: 1.7; }
.application-form-actions, .application-result-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; padding-top: 5px; }
.application-status { min-height: 20px; color: var(--muted); font-size: 12px; }
.application-status.is-error { color: var(--coral); }
.application-status.is-success { color: var(--jade); }
.director-action-status { display: flex; align-items: center; min-height: 30px; margin: 6px 0 0; line-height: 1.55; }
.director-action-status:not(:empty) { border-left: 2px solid var(--line-strong); padding-left: 10px; }
.director-action-status.is-error { border-left-color: var(--coral); }
.director-action-status.is-success { border-left-color: var(--jade); }
.application-result-empty { display: grid; align-content: center; justify-items: start; min-height: 465px; max-width: 420px; margin: 0 auto; }
.application-result-number { color: var(--amber); font-size: 12px; }
.application-result-empty h2 { margin-top: 10px; font-size: 30px; font-weight: 500; }
.application-result-empty p { margin-top: 10px; color: var(--muted); font-size: 13px; }
.application-result-ready { padding-top: 20px; }
.result-ready-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.result-ready-header small { color: var(--muted); font-size: 11px; text-align: right; }
.application-result-ready textarea { width: 100%; min-height: 450px; margin-top: 14px; resize: vertical; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 16px; color: var(--paper); background: #111514; line-height: 1.8; }
.application-result-ready textarea:focus { border-color: var(--amber); }
.application-result-ready pre, .application-json-details pre { overflow: auto; max-height: 500px; margin: 15px 0 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; color: var(--paper); background: #111514; font-size: 12px; line-height: 1.65; white-space: pre-wrap; }
.application-result-actions { margin-top: 17px; }
.storyboard-recommendation { display: grid; gap: 5px; margin: 14px 0 4px; border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: var(--radius); padding: 12px 14px; color: var(--muted); background: #111514; font-size: 12px; line-height: 1.55; }
.storyboard-recommendation strong { color: var(--paper); font-size: 13px; }
.storyboard-recommendation.is-blocking { border-left-color: #d76d5d; }
.storyboard-recommendation ul { margin: 3px 0 0 17px; padding: 0; }
.application-check { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.application-check input { margin-top: 2px; accent-color: var(--amber); }
.danger-button { color: #a52828; }
.storyboard-shot-list { display: grid; gap: 12px; margin-top: 16px; }
.storyboard-edit-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: #111514; }
.storyboard-edit-card > header { display: flex; gap: 10px; align-items: flex-start; }
.storyboard-edit-card > header > div { display: grid; gap: 3px; flex: 1; min-width: 0; }
.storyboard-edit-card > header strong { color: var(--paper); font-size: 14px; }
.storyboard-edit-card > header small { color: var(--muted); font-size: 11px; }
.storyboard-shot-number { color: var(--amber); font-size: 12px; font-variant-numeric: tabular-nums; }
.storyboard-edit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 13px; }
.storyboard-edit-grid label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; }
.storyboard-edit-grid input, .storyboard-edit-grid textarea { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 5px; padding: 8px 9px; color: var(--paper); background: #171c1a; font: inherit; line-height: 1.45; }
.storyboard-edit-grid textarea { resize: vertical; min-height: 58px; }
.storyboard-edit-grid input:focus, .storyboard-edit-grid textarea:focus { border-color: var(--amber); outline: 0; }
.storyboard-edit-wide { grid-column: span 2; }
.storyboard-assets { display: grid; gap: 4px; align-content: start; border-left: 1px solid var(--line); padding-left: 10px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.storyboard-assets strong { color: var(--paper); font-size: 12px; }
.storyboard-actions { justify-content: flex-start; }
@media (max-width: 780px) { .storyboard-edit-grid { grid-template-columns: 1fr; } .storyboard-edit-wide { grid-column: auto; } .storyboard-assets { border-left: 0; border-top: 1px solid var(--line); padding: 9px 0 0; } }
@media (max-width: 780px) { .previs-keyframe-card { grid-template-columns: 1fr; } .previs-active-shot > header { display: grid; } .previs-wireframe-grid { grid-template-columns: 1fr; } .previs-wireframe-header { display: grid; } .previs-wireframe-note { max-width: none; text-align: left; } .previs-playback-controls { justify-content: flex-start; } .previs-export-actions > button { flex: 1 1 150px; } .previs-stage-diagram { min-height: 320px; } }
@media (max-width: 980px) { .previs-shot-brief { grid-template-columns: 1fr; } }
.application-evidence { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px; color: var(--muted); font-size: 11px; }
.application-evidence span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; }
.application-shot-summary { display: grid; gap: 0; margin-top: 15px; border-top: 1px solid var(--line); }
.application-shot-summary article { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: start; border-bottom: 1px solid var(--line); padding: 13px 0; }
.application-shot-summary article > span { color: var(--amber); font-size: 12px; }
.application-shot-summary article strong { font-size: 14px; }
.application-shot-summary article p { margin-top: 4px; color: var(--muted); font-size: 12px; }
.application-shot-summary article > small { color: var(--muted); font-size: 11px; white-space: nowrap; }
.reverse-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 16px 0; border: 1px solid var(--line); background: var(--line); }
.reverse-result-grid > div { min-width: 0; padding: 14px; background: var(--panel); }
.reverse-result-grid strong { display: block; margin-bottom: 6px; font-size: 12px; }
.reverse-result-grid p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.application-result-label { display: grid; gap: 7px; margin-top: 16px; color: var(--muted); font-size: 12px; }
.application-result-label textarea { width: 100%; min-height: 150px; resize: vertical; }
.application-json-details { margin-top: 15px; color: var(--muted); font-size: 12px; }
.application-json-details summary { cursor: pointer; color: var(--amber); }
.saved-shot-card, .export-plan-grid { margin-top: 16px; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; background: var(--panel-soft); }
.saved-shot-card p, .export-plan-grid span { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; }
.export-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; border: 0; padding: 0; background: transparent; }
.export-plan-grid > div { min-height: 82px; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: var(--panel-soft); }
.application-choice-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.application-choice { display: grid; gap: 5px; min-height: 70px; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; color: var(--paper); background: var(--panel-soft); text-align: left; }
.application-choice:hover, .application-choice.active { border-color: var(--amber); }
.application-choice small { color: var(--muted); font-size: 11px; }
.application-previs-board { min-height: 120px; }
.application-previs-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding-top: 17px; }
.application-previs-strip figure { min-width: 0; margin: 0; }
.previs-frame { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 4px; background: var(--panel-soft); }
.previs-frame img { width: 100%; height: 100%; object-fit: cover; }
.previs-frame span { position: absolute; top: 5px; left: 6px; z-index: 1; color: var(--white); font-size: 10px; }
.application-previs-strip figcaption { overflow: hidden; margin-top: 5px; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.application-board-note { margin-top: 12px; color: var(--muted); font-size: 11px; }
.previs-review-summary { margin: 0 0 18px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.previs-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 15px; }
.previs-metrics > div { display: grid; gap: 5px; min-width: 0; min-height: 68px; align-content: center; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 12px; background: var(--panel-soft); }
.previs-metrics strong { color: var(--muted); font-size: 10px; font-weight: 500; }
.previs-metrics span { color: var(--paper); font-size: 17px; font-variant-numeric: tabular-nums; }
.previs-issue-list { display: grid; gap: 8px; margin: 15px 0 0; padding: 0; list-style: none; }
.previs-issue { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 3px 10px; border-left: 3px solid var(--line); padding: 9px 11px; background: var(--panel-soft); }
.previs-issue strong { font-size: 11px; }
.previs-issue span { min-width: 0; color: var(--paper); font-size: 12px; line-height: 1.55; }
.previs-issue small { grid-column: 2; min-width: 0; color: var(--muted-dark); font-size: 10px; overflow-wrap: anywhere; }
.previs-issue-error { border-left-color: var(--coral); }
.previs-issue-error strong { color: var(--coral); }
.previs-issue-warning { border-left-color: var(--amber); }
.previs-issue-warning strong { color: var(--amber); }

.media-application-shell { padding-bottom: 35px; }
.application-page-header-media { padding-bottom: 20px; }
.media-application-workspace { display: grid; grid-template-columns: 390px minmax(0, 1fr); gap: 18px; padding-top: 20px; }
.media-control-panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: var(--panel); }
.media-panel-section { border-bottom: 1px solid var(--line); padding-bottom: 15px; }
.media-operation-tabs { display: flex; flex-wrap: nowrap; gap: 5px; margin-top: 11px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
.media-operation-tab { min-height: 32px; border: 1px solid var(--line); border-radius: 999px; padding: 0 10px; color: var(--muted); background: transparent; font-size: 12px; }
.media-operation-tab:hover, .media-operation-tab.active { border-color: var(--amber); color: var(--ink); background: var(--amber); }
.media-operation-fixed { display: inline-flex; align-items: center; cursor: default; }
.media-transform-summary { margin: 11px 0 0; color: var(--paper); font-size: 12px; line-height: 1.6; }
.media-authorization { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 9px; align-items: start; border: 1px solid rgba(229, 163, 95, .42); border-radius: var(--radius); padding: 11px 12px; color: var(--paper); background: rgba(229, 163, 95, .07); font-size: 12px; line-height: 1.55; cursor: pointer; }
.media-authorization input { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--amber); }
.media-form { display: grid; gap: 14px; padding-top: 18px; }
.media-field { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.media-field textarea, .media-field input, .media-field select { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 11px 12px; color: var(--paper); background: var(--panel-soft); }
.media-field textarea { min-height: 170px; resize: vertical; line-height: 1.7; }
.media-field textarea:focus, .media-field input:focus, .media-field select:focus { border-color: var(--amber); box-shadow: 0 0 0 3px rgba(229, 163, 95, .12); }
.media-file-note { margin-top: -3px; color: var(--muted-dark); font-size: 11px; }
.media-parameter-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.media-parameter-grid label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; }
.media-parameter-grid select { width: 100%; min-width: 0; min-height: 39px; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 7px; color: var(--paper); background: var(--panel-soft); }
.media-quote { display: grid; gap: 9px; border: 1px solid rgba(229, 163, 95, .42); border-radius: var(--radius); padding: 14px; background: rgba(229, 163, 95, .08); }
.media-quote > div { display: flex; align-items: baseline; gap: 7px; }
.media-quote > div span, .media-quote > p { color: var(--muted); font-size: 11px; }
.media-quote > div strong { color: var(--amber); font-size: 26px; font-weight: 500; }
.media-quote > div small { color: var(--muted); font-size: 11px; }
.media-quote > p { margin: 0; }
.media-smart-route { display: grid; gap: 7px; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 12px; background: var(--panel-soft); }
.media-smart-route > span { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.media-model-status { display: grid; gap: 3px; min-height: 19px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.media-model-status strong { color: var(--amber); font-size: 13px; font-weight: 600; }
.media-model-status small { color: var(--muted); font-size: 11px; }
.media-model-status.unavailable { color: var(--coral); }
.media-cost-hint { margin: -4px 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.media-cost-hint.danger-text { color: var(--coral); }
.media-showcase-note { margin: 0; color: var(--amber); }
.media-generation-reference { display: grid; gap: 8px; border-top: 1px solid var(--line); padding-top: 14px; }
.media-generation-reference > label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
.media-reference-upload { position: relative; display: flex !important; align-items: center; justify-content: space-between; gap: 12px; min-height: 62px; border: 1px dashed rgba(229, 163, 95, .65); border-radius: var(--radius); padding: 11px 12px; color: var(--paper) !important; background: rgba(229, 163, 95, .07); cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.media-reference-upload:hover, .media-reference-upload:focus-within { border-color: var(--amber); background: rgba(229, 163, 95, .13); }
.media-reference-upload-copy { display: grid; gap: 4px; min-width: 0; }
.media-reference-upload-copy strong { color: var(--paper); font-size: 13px; }
.media-reference-upload-copy small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.media-reference-upload-action { flex: 0 0 auto; border: 1px solid var(--amber); border-radius: 999px; padding: 7px 12px; color: var(--ink); background: var(--amber); font-size: 11px; font-weight: 700; }
.media-reference-upload input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.media-generation-reference-required { border-top-color: rgba(229, 163, 95, .55); }
.media-generation-reference-help { margin: 0; color: var(--muted-dark); font-size: 11px; line-height: 1.55; }
.media-generation-reference-help code { color: var(--amber); }
.media-generation-reference-preview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.media-generation-reference-preview > span { grid-column: 1 / -1; color: var(--muted-dark); font-size: 11px; }
.media-generation-reference-preview figure { min-width: 0; margin: 0; }
.media-reference-image-wrap { position: relative; overflow: hidden; aspect-ratio: 1 / 1; border: 1px solid var(--line); border-radius: 4px; background: #0c0f0e; }
.media-reference-image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.media-reference-order-actions { position: absolute; right: 4px; bottom: 4px; left: 4px; display: flex; gap: 3px; justify-content: flex-end; }
.media-reference-order-actions button { width: 24px; height: 24px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 3px; padding: 0; color: var(--white); background: rgba(15, 18, 17, .82); font-size: 13px; }
.media-reference-order-actions button:disabled { opacity: .35; }
.media-generation-reference-preview figcaption { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 5px; padding-top: 5px; color: var(--muted); font-size: 10px; }
.media-generation-reference-preview figcaption span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-reference-token { grid-column: 1 / -1; justify-self: start; border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 10px; }
.media-generation-source-preview { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }
.media-generation-source-preview video { width: 100%; max-height: 180px; border-radius: 4px; background: #0c0f0e; }
.media-generation-advanced { border-top: 1px solid var(--line); padding-top: 12px; }
.media-generation-advanced summary { cursor: pointer; color: var(--muted); font-size: 12px; }
.media-generation-advanced-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding-top: 11px; }
.media-generation-advanced-grid label { display: grid; gap: 6px; min-width: 0; color: var(--muted); font-size: 11px; }
.media-generation-advanced-grid input, .media-generation-advanced-grid select { width: 100%; min-width: 0; min-height: 35px; border: 1px solid var(--line); border-radius: 4px; padding: 0 8px; color: var(--paper); background: var(--panel-soft); }
.media-generation-advanced-grid input[type="range"] { min-height: 20px; padding: 0; accent-color: var(--amber); }
.media-generation-advanced-grid output { justify-self: end; color: var(--amber); font-variant-numeric: tabular-nums; }
.media-result-grid figure { overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: var(--panel); }
.media-result-grid figcaption { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 8px; }
.media-result-grid figcaption span { margin-right: auto; }
.media-result-grid figcaption a { color: var(--amber); font-size: 11px; }
.media-result-waiting.is-error strong, .media-result-waiting.is-error p { color: var(--coral); }
.media-canvas { min-width: 0; min-height: 650px; border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(20px, 3vw, 30px); background: #141917; }
.media-canvas-header { display: flex; align-items: start; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.media-canvas-header h2 { margin-top: 7px; font-size: 22px; font-weight: 500; }
.media-canvas-guidance { max-width: 580px; margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.media-canvas-state { border: 1px solid var(--line); border-radius: 999px; padding: 4px 9px; color: var(--amber); font-size: 11px; }
.media-canvas-content { display: grid; min-height: 510px; place-items: center; padding: 28px 8px 8px; }
.media-source-video-canvas { display: grid; gap: 10px; width: min(680px, 100%); margin: 0 auto 24px; border: 1px solid var(--line); border-radius: 5px; padding: 12px; background: var(--panel); }
.media-source-video-canvas-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.media-source-video-canvas-heading strong { overflow: hidden; color: var(--paper); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.media-source-video-canvas video { width: 100%; max-height: 470px; border-radius: 4px; background: #0d100f; object-fit: contain; }
.media-source-video-selected { color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.media-example-fan { position: relative; display: flex; align-items: center; justify-content: center; width: min(640px, 100%); min-height: 430px; }
.media-example-fan figure { width: 42%; margin: 0; border: 1px solid var(--line); border-radius: 5px; padding: 7px; background: var(--panel); box-shadow: 0 16px 35px rgba(0, 0, 0, .28); }
.media-example-fan figure + figure { margin-left: -13%; }
.media-example-fan figure:nth-child(1) { transform: rotate(-8deg) translateY(18px); }
.media-example-fan figure:nth-child(2) { z-index: 2; transform: translateY(-10px); }
.media-example-fan figure:nth-child(3) { transform: rotate(8deg) translateY(18px); }
.media-example-fan img { width: 100%; aspect-ratio: 4 / 5; border-radius: 3px; object-fit: cover; }
.media-example-fan figcaption { padding: 9px 3px 4px; color: var(--paper); font-size: 12px; text-align: center; }
.media-example-label { position: absolute; top: 0; left: 0; color: var(--amber); font-size: 11px; }
.media-example-video { width: min(680px, 100%); }
.media-example-video video { width: 100%; max-height: 470px; margin-top: 14px; border-radius: 4px; background: #0d100f; object-fit: contain; }
.media-example-video p { margin-top: 10px; color: var(--muted); font-size: 12px; }
.skill-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; padding-top: 25px; }
.skill-category-filters { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
.skill-category-filters button { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 999px; padding: 7px 11px; color: var(--muted); background: transparent; font: inherit; font-size: 12px; cursor: pointer; }
.skill-category-filters button:hover { border-color: rgba(229,163,95,.7); color: var(--paper); }
.skill-category-filters button.active { border-color: var(--amber); color: var(--ink); background: var(--amber); }
.skill-category-filters button small { min-width: 17px; color: var(--muted-dark); font-size: 10px; font-variant-numeric: tabular-nums; }
.skill-category-filters button.active small { color: rgba(24, 22, 19, .72); }
.skill-card { display: grid; gap: 9px; min-width: 0; min-height: 240px; border: 1px solid var(--line); border-radius: var(--radius); padding: 17px; background: var(--panel); }
.skill-card:hover { border-color: var(--amber); }
.skill-card > header { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.skill-card-index { color: var(--amber); letter-spacing: .12em; }
.skill-card-category { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.skill-card-legacy-category { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted-dark); font-size: 9px; }
.skill-card-version { margin-left: auto; white-space: nowrap; }
.skill-card h3 { margin-top: 12px; font-size: 17px; font-weight: 600; }
.skill-card p { color: var(--muted); font-size: 12px; }
.skill-card-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.skill-card-tags span { border: 1px solid var(--line); border-radius: 999px; padding: 3px 7px; color: var(--muted); font-size: 10px; }
.skill-card footer { display: flex; align-items: end; justify-content: space-between; gap: 8px; margin-top: auto; }
.skill-card footer small { color: var(--muted); }
.skill-card.is-installed { border-color: rgba(145, 183, 168, .38); }
.skill-installed-label { color: var(--jade); font-size: 11px; }
.skill-card button { border: 0; padding: 0; color: var(--amber); background: transparent; font-size: 12px; font-weight: 700; }
.skill-card-details { margin-top: 13px; border-top: 1px solid var(--line); padding-top: 10px; }
.skill-card-details summary { color: var(--paper); font-size: 12px; font-weight: 650; cursor: pointer; list-style-position: outside; }
.skill-doc-body { display: grid; gap: 13px; margin-top: 12px; border-left: 2px solid rgba(229, 163, 95, .48); padding-left: 12px; }
.skill-doc-body strong { display: block; margin-bottom: 5px; color: var(--paper); font-size: 11px; }
.skill-doc-method p, .skill-doc-recovery p { color: var(--muted); font-size: 11px; line-height: 1.65; }
.skill-doc-list { display: grid; gap: 5px; margin: 0; padding-left: 17px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.skill-doc-steps { display: grid; gap: 6px; margin: 0; padding: 0; counter-reset: skill-step; list-style: none; }
.skill-doc-steps li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto auto; align-items: center; gap: 7px; min-width: 0; color: var(--muted); font-size: 11px; }
.skill-doc-steps li::before { counter-increment: skill-step; content: counter(skill-step); display: grid; place-items: center; width: 18px; height: 18px; border: 1px solid var(--line); border-radius: 50%; color: var(--amber); font-size: 9px; }
.skill-doc-steps span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.skill-doc-steps code { color: var(--jade); font-size: 10px; overflow-wrap: anywhere; }
.skill-doc-steps em { color: var(--muted); font-size: 9px; font-style: normal; }
.skill-doc-defaults { display: grid; gap: 6px; }
.skill-doc-defaults li { display: grid; grid-template-columns: minmax(96px, auto) minmax(0, 1fr); gap: 8px; align-items: start; }
.skill-doc-defaults code { color: var(--jade); font-size: 10px; overflow-wrap: anywhere; }
.skill-doc-defaults span { color: var(--muted); }
.skill-doc-attribution { border-top: 1px dashed var(--line); padding-top: 9px; color: var(--muted); font-size: 10px !important; line-height: 1.55; }
.media-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%; }
.media-result-grid figure { min-width: 0; margin: 0; }
.media-result-grid img, .media-result-grid video { width: 100%; aspect-ratio: 16 / 10; border-radius: 4px; object-fit: contain; background: #0c0f0e; }
.media-result-grid figcaption { margin-top: 7px; color: var(--muted); font-size: 11px; }
.media-result-waiting { display: grid; justify-items: center; gap: 10px; color: var(--muted); text-align: center; }
.media-result-waiting strong { color: var(--paper); font-size: 16px; }
.media-result-waiting p { font-size: 12px; }
.assistant-confirm { display: grid; gap: 8px; margin-top: 10px; border-top: 1px solid rgba(229, 163, 95, .35); padding-top: 10px; }
.assistant-confirm p { color: var(--paper); font-size: 12px; }
.assistant-confirm .secondary-button, .assistant-confirm .primary-button { justify-self: start; }

.together-header { align-items: center; }
.challenge-date { display: grid; gap: 5px; min-width: 220px; border-left: 2px solid var(--coral); padding-left: 14px; }
.challenge-date span { color: var(--muted); font-size: 11px; }
.challenge-date strong { font-size: 15px; }
.together-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; padding-top: 26px; }
.challenge-feature { display: grid; grid-template-columns: minmax(250px, .9fr) minmax(0, 1.1fr); min-height: 420px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--panel); }
.challenge-image img { width: 100%; height: 100%; object-fit: cover; }
.challenge-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 5vw, 64px); }
.challenge-copy h2 { max-width: 440px; margin-top: 13px; font-size: clamp(28px, 4vw, 50px); font-weight: 500; }
.challenge-copy p:not(.eyebrow) { max-width: 440px; margin-top: 18px; color: var(--muted); }
.challenge-copy .button-row { justify-content: flex-start; }
.together-side { display: grid; align-content: start; gap: 1px; background: var(--line); }
.side-stat, .team-note { display: grid; gap: 7px; padding: 20px; background: var(--panel); }
.side-stat span, .side-stat small, .team-note p { color: var(--muted); font-size: 12px; }
.side-stat strong { color: var(--amber); font-size: 32px; font-weight: 500; }
.team-note { margin-top: 17px; }
.team-note h3 { font-size: 18px; font-weight: 600; }
.team-note .secondary-button { justify-self: start; margin-top: 7px; }

.assistant-launcher { position: fixed; right: 22px; bottom: 22px; z-index: 18; display: grid; place-items: center; width: 68px; height: 68px; border: 1px solid rgba(229, 163, 95, .75); border-radius: 50%; padding: 7px; background: #18201e; box-shadow: 0 10px 35px rgba(0, 0, 0, .36); }
.assistant-launcher:hover { transform: translateY(-3px); }
.assistant-launcher img { width: 100%; height: 100%; object-fit: contain; }
.assistant-panel { position: fixed; right: 22px; bottom: 104px; z-index: 17; display: grid; grid-template-rows: auto auto minmax(100px, 1fr) auto auto; width: min(390px, calc(100vw - 32px)); height: min(650px, calc(100vh - 130px)); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #161b19; box-shadow: var(--shadow); }
.assistant-panel[hidden] { display: none; }
.assistant-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid var(--line); background: #202825; }
.assistant-title small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.assistant-context { min-height: 34px; border-bottom: 1px solid var(--line); padding: 9px 15px; color: var(--muted); font-size: 11px; }
.assistant-messages { display: flex; flex-direction: column; gap: 10px; overflow: auto; padding: 15px; }
.assistant-message { max-width: 87%; border-radius: 5px; padding: 10px 11px; font-size: 13px; white-space: pre-wrap; }
.assistant-message.assistant { align-self: start; color: var(--paper); background: #242b28; }
.assistant-message.user { align-self: end; color: var(--ink); background: var(--amber); }
.assistant-actions { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 15px 8px; }
.assistant-actions button { border: 1px solid var(--line); border-radius: 999px; padding: 5px 8px; color: var(--muted); background: transparent; font-size: 11px; }
.assistant-actions button:hover { border-color: var(--amber); color: var(--amber); }
.assistant-form { display: flex; gap: 8px; border-top: 1px solid var(--line); padding: 12px; }
.assistant-form textarea { min-width: 0; flex: 1; resize: none; border: 1px solid var(--line); border-radius: 4px; outline: 0; padding: 9px; color: var(--paper); background: #0f1312; font-size: 13px; }
.assistant-form textarea:focus { border-color: var(--amber); }
.assistant-form .primary-button { align-self: end; min-height: 38px; padding: 0 12px; }

.modal-dialog { width: min(500px, calc(100vw - 32px)); border: 1px solid var(--line); border-radius: 8px; padding: 0; color: var(--paper); background: var(--panel); box-shadow: var(--shadow); }
.auth-dialog { width: min(940px, calc(100vw - 40px)); }
.auth-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr); min-height: min(680px, calc(100vh - 40px)); }
.auth-showcase { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: 18px; padding: 30px; border-right: 1px solid var(--line); background: #111615; }
.auth-showcase-topline, .auth-showcase-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.auth-showcase-topline { color: var(--muted); font-size: 11px; letter-spacing: .12em; }
.auth-showcase-brand { color: var(--paper); font-size: 12px; font-weight: 800; letter-spacing: .18em; }
.auth-showcase-media { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #151b19; box-shadow: 0 18px 42px rgba(0, 0, 0, .3); }
.auth-showcase-media img, .auth-showcase-media video { width: 100%; height: 100%; object-fit: cover; }
.auth-showcase-media [hidden] { display: none !important; }
.auth-showcase-media video { background: #090d0b; }
.auth-showcase-structure { display: grid; align-content: center; gap: 12px; width: 100%; height: 100%; padding: clamp(24px, 5vw, 52px); color: #312c25; background: linear-gradient(135deg, #f4efe4, #ddd1bb); font-family: ui-serif, Georgia, "Noto Serif SC", serif; }
.auth-showcase-structure > span { color: #9b6430; font-family: ui-sans-serif, system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.auth-showcase-structure > strong { font-size: clamp(22px, 3vw, 34px); font-weight: 600; }
.auth-showcase-structure > div { display: grid; gap: 9px; border-top: 1px solid rgba(49,44,37,.18); padding-top: 14px; }
.auth-showcase-structure p { color: #5c5143; font-size: 12px; line-height: 1.55; }
.auth-showcase-copy { min-height: 128px; }
.auth-showcase-copy h2 { margin: 6px 0 7px; color: var(--paper); font-size: 26px; line-height: 1.2; }
#authShowcaseDescription { max-width: 520px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.auth-showcase-facts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.auth-showcase-facts span { border: 1px solid rgba(229,163,95,.28); border-radius: 999px; padding: 4px 7px; color: #d7b58e; font-size: 9px; }
.auth-showcase-arrow { display: grid; place-items: center; width: 32px; min-height: 32px; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--paper); background: transparent; font-size: 22px; line-height: 1; }
.auth-showcase-arrow:hover, .auth-showcase-arrow:focus-visible { border-color: var(--amber); color: var(--amber); background: rgba(229, 163, 95, .1); }
.auth-showcase-dots { display: flex; align-items: center; justify-content: center; gap: 8px; }
.auth-showcase-dots button { width: 7px; min-height: 7px; padding: 0; border: 0; border-radius: 50%; background: #59635e; }
.auth-showcase-dots button.active { width: 22px; border-radius: 4px; background: var(--amber); }
.auth-form { display: grid; align-content: center; gap: 16px; width: 100%; min-width: 0; padding: 30px; }
.modal-dialog::backdrop { background: rgba(0, 0, 0, .72); backdrop-filter: blur(4px); }
.modal-dialog > form { display: grid; gap: 15px; padding: 25px; }
.modal-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); padding-bottom: 17px; }
.modal-heading h2 { margin-top: 7px; font-size: 25px; font-weight: 500; }
.modal-lead, .form-hint { color: var(--muted); font-size: 12px; }
.auth-tabs { display: flex; gap: 3px; border-bottom: 1px solid var(--line); }
.auth-tabs button { border: 0; border-bottom: 2px solid transparent; padding: 9px 11px; color: var(--muted); background: transparent; }
.auth-tabs button.active { border-bottom-color: var(--amber); color: var(--paper); }
.form-stack { display: grid; gap: 12px; }
.form-stack input, .form-stack textarea, #ipForm > label input, #ipForm > label textarea { min-height: 44px; border-color: var(--line); color: var(--paper); background: var(--panel-soft); }
.form-stack input::placeholder, #ipForm input::placeholder, #ipForm textarea::placeholder { color: #7f8881; }
.code-input { display: flex; gap: 7px; }
.code-input input { min-width: 0; flex: 1; }
.creation-mode { border: 1px solid var(--line); padding: 11px; }
.creation-mode legend { padding: 0 6px; color: var(--muted); font-size: 11px; }
.creation-mode .segmented-control { width: 100%; }
.creation-mode .segmented-control button { flex: 1 1 0; border-color: var(--line); color: var(--muted); background: rgba(255, 255, 255, .03); }
.creation-mode .segmented-control button:hover { border-color: var(--amber); color: var(--paper); background: rgba(229, 163, 95, .1); }
.creation-mode .segmented-control button.active { border-color: var(--amber); color: var(--ink); background: var(--amber); box-shadow: 0 0 0 1px rgba(229, 163, 95, .18); }
.creation-mode-hint { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.consent-line { display: flex !important; grid-template-columns: auto 1fr; align-items: start; gap: 7px !important; }
.consent-line input { width: auto !important; min-height: auto !important; margin-top: 4px; }
.consent-line a { color: var(--amber); }

.site-footer { display: grid; grid-template-columns: minmax(230px, 1fr) minmax(0, 2fr) auto; align-items: start; gap: 28px; border-top: 1px solid var(--line); padding: 28px clamp(18px, 4vw, 64px) 40px; color: var(--muted); }
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-brand img { width: 31px; height: 31px; object-fit: contain; }
.footer-brand span { display: grid; gap: 2px; }
.footer-brand strong { color: var(--paper); font-size: 13px; }
.footer-brand small { font-size: 10px; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.site-footer nav a { font-size: 12px; }
.site-footer nav a:hover { color: var(--amber); }
.footer-compliance { display: grid; justify-items: end; gap: 4px; color: var(--muted); font-size: 11px; text-align: right; }
.footer-compliance a:hover { color: var(--amber); }
.footer-copy { font-size: 11px; white-space: nowrap; }

.public-route-content { min-height: 180px; }

@media (max-width: 1100px) {
  .site-header { gap: 12px; }
  .brand small { display: none; }
  .primary-nav { order: 3; flex-basis: 100%; }
  .site-header { flex-wrap: wrap; }
  .header-tools { margin-left: auto; }
  .application-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-grid, .template-library-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .footer-compliance { justify-items: start; text-align: left; }
}

@media (max-width: 820px) {
  .app-main { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
  .page { padding-top: 22px; }
  .director-workspace, .runner-layout, .together-layout, .remix-panel, .inspiration-remix-workspace { grid-template-columns: 1fr; }
  .director-side-column { order: -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .director-side-column .context-panel { min-width: 0; }
  .asset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .case-grid, .template-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-header-actions { width: 100%; justify-content: flex-start; }
  .inspiration-reference-grid, .inspiration-shared-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .challenge-feature { grid-template-columns: 1fr; }
  .challenge-image { min-height: 280px; }
  .site-footer { grid-template-columns: 1fr; gap: 18px; }
  .footer-copy { white-space: normal; }
}

@media (max-width: 560px) {
  .site-header { padding: 9px 14px; }
  .brand img { width: 33px; height: 33px; }
  .header-tools { gap: 2px; }
  .model-plaza-link { min-height: 32px; padding: 0 5px; font-size: 11px; }
  .points-button small, .quiet-button { display: none; }
  .primary-nav { margin: 0 -14px; padding: 0 14px; }
  .secondary-nav-track { justify-content: flex-start; padding: 0 14px; }
  .secondary-nav-item { min-height: 36px; padding: 0 10px; }
  .nav-item { min-height: 38px; padding: 0 8px; font-size: 12px; }
  .app-main { padding-right: 14px; padding-left: 14px; }
  .segmented-control { width: 100%; }
  .segmented-control button { flex: 1 0 auto; padding: 0 8px; font-size: 12px; }
  .project-grid, .asset-grid, .case-grid, .template-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .application-grid { grid-template-columns: 1fr; }
  .case-submit-form { padding: 20px; }
  .case-submit-fields { grid-template-columns: 1fr; }
  .project-card { grid-template-columns: 1fr; }
  .project-card img { width: 100%; height: auto; aspect-ratio: 1.2 / 1; }
  .section-heading, .page-header, .asset-library-toolbar, .together-header { align-items: flex-start; flex-direction: column; }
  .inspiration-reference-section .section-heading { align-items: flex-start; }
  .inspiration-reference-filters { justify-content: flex-start; }
  .page-header h1 { font-size: 36px; }
  .director-page-tools { width: 100%; align-items: stretch; }
  .project-select { min-width: 0; flex: 1; }
  .director-side-column { grid-template-columns: 1fr; }
  .modal-dialog.collaboration-dialog { width: min(calc(100vw - 18px), 560px); }
  .collaboration-dialog-heading { padding: 18px 16px 14px; }
  .collaboration-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-right: 16px; margin-left: 16px; }
  .collaboration-error { margin-right: 16px; margin-left: 16px; }
  .collaboration-main-grid { grid-template-columns: 1fr; }
  .collaboration-section { padding: 17px 16px; }
  .collaboration-invite-form { grid-template-columns: 1fr; }
  .collaboration-invite-form .collaboration-invite-message { grid-column: auto; }
  .collaboration-invite-form > button { justify-self: start; }
  .collaboration-invitation-row { flex-direction: column; }
  .collaboration-invitation-row footer { justify-content: flex-end; }
  .brief-form-grid, .director-screenplay-structure, .director-asset-board, .previs-choice-grid, .template-edit-form { grid-template-columns: 1fr; }
  .director-screenplay-stage-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 0; }
  .director-screenplay-stage-rail button { border: 1px solid var(--line); border-radius: 7px; }
  .director-episode-card header { grid-template-columns: 36px minmax(0, 1fr); }
  .director-episode-card header label:last-child { grid-column: 2; }
  .director-episode-card footer, .sc-primary-actions { align-items: stretch; flex-direction: column; }
  .director-screenplay-structure label:first-child { grid-column: auto; }
  .director-asset-cards { grid-template-columns: 1fr; }
  .director-asset-card { grid-template-columns: 72px minmax(0, 1fr); }
  .director-asset-card img, .director-asset-placeholder { width: 72px; height: 96px; }
  .director-asset-core { grid-template-columns: 1fr; }
  .director-asset-core > label:nth-child(2), .director-asset-core > label:has(textarea) { grid-column: auto; }
  .template-edit-form .wide, .template-change-fields, .template-detail-actions { grid-column: auto; }
  .template-change-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .template-run-panel > header, .template-run-panel > footer { align-items: stretch; flex-direction: column; }
  .template-run-panel ol { grid-template-columns: 1fr; }
  .template-run-panel > footer > div { justify-content: flex-start; }
  .director-constraint-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brief-form-grid .wide { grid-column: auto; }
  .shot-row { grid-template-columns: 42px minmax(0, 1fr); }
  .shot-spec { grid-column: 2; justify-items: start; text-align: left; }
  .previs-filmstrip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .asset-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .asset-library-toolbar > span { text-align: left; }
  .asset-library-section-heading { align-items: flex-start; flex-direction: column; }
  .asset-library-section-heading > span { white-space: normal; }
  .ip-form-grid { grid-template-columns: 1fr; }
  .ip-form-grid label.wide { grid-column: auto; }
  .case-card-body p { min-height: 0; }
  .challenge-copy { padding: 25px 18px; }
  .challenge-copy h2 { font-size: 32px; }
  .play-intro { grid-template-columns: 1fr; gap: 0; }
  .play-intro > img { height: 220px; }
  .play-template-grid, .generated-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inspiration-grid { columns: 2 140px; }
  .inspiration-reference-grid, .inspiration-shared-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .together-steps { width: 100%; justify-content: space-between; }
  .remix-form { grid-template-columns: 1fr; }
  .remix-form label:nth-of-type(2), .remix-status, .remix-form .panel-actions { grid-column: auto; }
  .assistant-launcher { right: 14px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); width: 50px; height: 50px; }
  .assistant-panel { right: 14px; bottom: calc(72px + env(safe-area-inset-bottom, 0px)); width: calc(100vw - 28px); height: calc(100vh - 92px - env(safe-area-inset-bottom, 0px)); }
  .modal-dialog { width: calc(100vw - 24px); }
}

@media (max-width: 900px) {
  .auth-dialog { width: min(600px, calc(100vw - 28px)); }
  .auth-layout { display: block; min-height: 0; }
  .auth-showcase { display: none; }
  .auth-form { padding: 24px; }
}

@media (max-width: 760px) {
  .auth-dialog { width: min(440px, calc(100vw - 28px)); max-height: calc(100vh - 20px); }
  .auth-form { padding: 16px; }
}

@media (max-width: 820px) {
  .application-page-header { grid-template-columns: 1fr auto; gap: 12px; }
  .application-page-back-actions { grid-column: 1 / -1; }
  .application-page-heading h1 { font-size: 36px; }
  .application-workspace, .media-application-workspace { grid-template-columns: 1fr; }
  .application-result-panel, .media-canvas { min-height: 0; }
  .application-result-empty { min-height: 260px; }
  .media-canvas-content { min-height: 390px; }
  .skill-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .application-page-header { display: flex; flex-wrap: wrap; }
  .application-page-back-actions { flex-basis: 100%; }
  .application-page-badge { margin-left: auto; }
  .application-form-grid, .application-choice-row, .export-plan-grid { grid-template-columns: 1fr; }
  .previs-metrics { grid-template-columns: 1fr; }
  .previs-issue { grid-template-columns: 1fr; }
  .previs-issue small { grid-column: auto; }
  .application-field.wide { grid-column: auto; }
  .application-shot-summary article { grid-template-columns: 28px minmax(0, 1fr); }
  .application-shot-summary article > small { grid-column: 2; }
  .reverse-result-grid { grid-template-columns: 1fr; }
  .media-control-panel { padding: 16px; }
  .media-parameter-grid { grid-template-columns: 1fr; }
  .media-canvas { padding: 16px; }
  .media-canvas-content { padding-right: 0; padding-left: 0; }
  .media-example-fan { min-height: 290px; }
  .media-example-fan figure { width: 48%; }
  .media-example-fan figure + figure { margin-left: -20%; }
  .media-generation-advanced-grid { grid-template-columns: 1fr; }
  .skill-grid { grid-template-columns: 1fr; }
}

/* ===== 账户中心（20260905-account-v1）===== */
.account-shell { max-width: 1080px; margin: 0 auto; padding: 28px 20px 60px; }
.account-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.account-head-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.account-head h2 { margin: 4px 0 6px; font-size: 26px; }
.account-balance-band { display: grid; grid-template-columns: minmax(200px, 1.6fr) repeat(4, minmax(110px, 1fr)); gap: 14px; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(135deg, rgba(145, 183, 168, .12), rgba(229, 163, 95, .06)); margin-bottom: 22px; }
.account-balance-band > div { display: flex; flex-direction: column; gap: 6px; }
.account-balance-band span { font-size: 12px; color: rgba(148, 163, 184, 0.9); }
.account-balance-band strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.account-user-cell { flex-direction: row !important; align-items: center; gap: 12px !important; }
.account-avatar-large { width: 44px; height: 44px; border-radius: var(--radius); display: inline-flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; background: var(--jade); color: var(--ink); flex: none; }
.account-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.account-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px; background: var(--panel); }
.account-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.account-card-head h3 { font-size: 16px; margin: 0; }
.account-project-status { flex: none; padding: 3px 7px; border-radius: 999px; color: #cbd5e1; background: rgba(148, 163, 184, 0.12); font-size: 10px; }
.account-project-status.active { color: #86efac; background: rgba(74, 222, 128, 0.12); }
.account-project-status.rendering { color: #fcd34d; background: rgba(251, 191, 36, 0.12); }
.account-project-status.completed { color: #7dd3fc; background: rgba(56, 189, 248, 0.12); }
.account-plan-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 12px 14px; border-radius: 12px; background: rgba(148, 163, 184, 0.08); margin-bottom: 14px; }
.account-plan-row > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.account-plan-row span { font-size: 11px; color: rgba(148, 163, 184, 0.9); }
.account-plan-row strong { font-size: 14px; }
.account-plan-status { font-size: 11px; color: rgba(148, 163, 184, 0.95); }
.account-plan-status.active { color: #4ade80; }
.account-plan-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.account-plan-card { position: relative; display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 12px 14px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel-soft); color: inherit; cursor: pointer; transition: border-color .15s, transform .15s; }
.account-plan-card:hover:not(:disabled) { border-color: rgba(229, 163, 95, .7); transform: translateY(-1px); }
.account-plan-card.active { border-color: #4ade80; cursor: default; }
.account-plan-card strong { font-size: 14px; }
.account-plan-card span { font-size: 13px; color: #fbbf24; }
.account-plan-card small { font-size: 11px; color: rgba(148, 163, 184, 0.9); line-height: 1.4; }
.account-plan-badge { position: absolute; top: 8px; right: 10px; font-size: 10px; font-style: normal; color: #4ade80; }
.account-recharge-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; margin-bottom: 12px; }
.account-preset-btn { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel-soft); color: inherit; cursor: pointer; transition: border-color .15s; }
.account-preset-btn:hover { border-color: rgba(229, 163, 95, .7); }
.account-preset-btn.selected { border-color: var(--jade); background: rgba(145, 183, 168, .12); }
.account-preset-btn strong { font-size: 15px; }
.account-preset-btn small { font-size: 11px; color: rgba(148, 163, 184, 0.9); }
.account-recharge-custom { display: flex; flex-direction: column; gap: 6px; font-size: 13px; margin-bottom: 10px; }
.account-recharge-custom input { border-radius: 10px; border: 1px solid rgba(148, 163, 184, 0.3); background: rgba(15, 23, 42, 0.6); color: inherit; padding: 10px 12px; font-size: 14px; }
.account-recharge-preview { font-size: 13px; color: rgba(148, 163, 184, 0.95); margin: 0 0 12px; }
.account-recharge-preview strong { color: #fbbf24; font-size: 15px; }
.account-status { font-size: 12px; min-height: 18px; margin: 10px 0 0; color: rgba(148, 163, 184, 0.95); }
.account-status.success { color: #4ade80; }
.account-status.error { color: #f87171; }
#accountAlipayAvailability.available { color: #4ade80; }
.account-order-list { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
.account-order-row { display: grid; grid-template-columns: minmax(0, 1.5fr) auto auto auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel-soft); }
.account-order-row > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.account-order-row strong { font-size: 13px; }
.account-order-row small, .account-order-row time { font-size: 11px; color: rgba(148, 163, 184, 0.85); overflow: hidden; text-overflow: ellipsis; }
.account-order-status { font-size: 11px; padding: 3px 8px; border-radius: 999px; align-self: center; }
.account-order-status.paid { color: #4ade80; background: rgba(74, 222, 128, 0.12); }
.account-order-status.pending { color: #fbbf24; background: rgba(251, 191, 36, 0.12); }
.account-order-status.closed { color: rgba(148, 163, 184, 0.9); background: rgba(148, 163, 184, 0.12); }
.account-password-form { display: flex; flex-direction: column; gap: 10px; }
.account-password-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.account-password-form input { border-radius: 10px; border: 1px solid rgba(148, 163, 184, 0.3); background: rgba(15, 23, 42, 0.6); color: inherit; padding: 10px 12px; font-size: 14px; }
.account-password-form button { align-self: flex-start; }
@media (max-width: 900px) {
  .account-grid { grid-template-columns: 1fr; }
  .account-balance-band { grid-template-columns: repeat(2, 1fr); }
  .account-plan-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .account-shell { padding: 18px 14px 40px; }
  .account-balance-band { grid-template-columns: 1fr 1fr; }
  .account-order-row { grid-template-columns: 1fr auto; }
  .account-projects-head, .account-project-filters { align-items: stretch; flex-direction: column; }
  .account-project-tools, .account-project-filters label { width: 100%; }
  .account-head-actions { width: 100%; justify-content: flex-start; }
  .account-project-tools button { flex: 1; }
}

/* ===== 004 营销工作台 ===== */
.marketing-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.marketing-load-more { grid-column: 1 / -1; display: flex; justify-content: center; padding: 18px 0 6px; }
.marketing-card .case-card-media { aspect-ratio: 4 / 5; }
.marketing-card .case-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; background: #101216; }
.marketing-video { width: 100%; height: 100%; object-fit: cover; display: block; background: #101216; }
.marketing-play-mark { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 999px; background: rgba(10, 12, 16, 0.72); color: #f4f6fa; font-size: 11px; pointer-events: none; }
.marketing-card .case-card-media { position: relative; }
.marketing-card:hover .case-card-media::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: inherit; pointer-events: none; }
.marketing-hint { margin: 18px 2px 0; color: #4f473b; font-size: 13px; }
.marketing-rights-note { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 16px; padding: 12px 14px; border: 1px solid rgba(234, 163, 83, 0.38); border-radius: 6px; background: rgba(234, 163, 83, 0.08); color: rgba(255, 255, 255, 0.72); font-size: 13px; line-height: 1.6; }
.marketing-rights-note strong { flex: 0 0 auto; color: #f0a85a; font-size: 13px; }
.marketing-rights-note span { min-width: 0; }

/* 改写海报模板库：catalog 驱动，交接到统一 image-edit Atom */
.poster-rewrite-library { display: grid; gap: 18px; margin: 0 0 34px; border: 1px solid rgba(255,255,255,.11); border-radius: 18px; padding: 22px; background: linear-gradient(145deg, rgba(214,166,91,.09), rgba(255,255,255,.025) 36%, rgba(127,184,163,.045)); }
.poster-rewrite-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.poster-rewrite-header h2 { margin: 4px 0 7px; font-size: clamp(20px, 2vw, 26px); }
.poster-rewrite-header p:last-child { max-width: 720px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.poster-rewrite-count { flex: 0 0 auto; border: 1px solid rgba(214,166,91,.28); border-radius: 999px; padding: 6px 11px; color: var(--amber); background: rgba(214,166,91,.08); font-size: 11px; }
.poster-rewrite-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px); gap: 10px; }
.poster-rewrite-search input, .poster-rewrite-aspect select { width: 100%; min-height: 42px; border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; color: var(--paper); background: rgba(13,16,15,.74); font: inherit; font-size: 13px; }
.poster-rewrite-search input:focus, .poster-rewrite-aspect select:focus { border-color: var(--amber); outline: 0; box-shadow: 0 0 0 2px rgba(214,166,91,.1); }
.poster-rewrite-aspect { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }
.poster-rewrite-status { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 9px; min-height: 72px; border: 1px dashed var(--line); border-radius: 11px; padding: 16px; color: var(--muted); font-size: 12px; text-align: center; }
.poster-rewrite-status[hidden] { display: none; }
.poster-rewrite-status.is-error { color: var(--coral); border-color: rgba(220,135,121,.38); }
.poster-rewrite-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.poster-rewrite-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: rgba(13,16,15,.72); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.poster-rewrite-card:hover, .poster-rewrite-card:focus-visible { transform: translateY(-3px); border-color: rgba(214,166,91,.58); outline: 0; box-shadow: 0 12px 28px rgba(0,0,0,.24); }
.poster-rewrite-card:has(button:disabled) { pointer-events: none; opacity: .68; }
.poster-rewrite-media { position: relative; overflow: hidden; aspect-ratio: var(--poster-aspect, 3 / 4); min-height: 190px; max-height: 390px; background: #0d100f; }
.poster-rewrite-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.poster-rewrite-card:hover .poster-rewrite-media img { transform: scale(1.018); }
.poster-rewrite-media > span { position: absolute; left: 8px; bottom: 8px; border-radius: 999px; padding: 3px 7px; color: #fff; background: rgba(8,10,10,.76); backdrop-filter: blur(5px); font-size: 10px; }
.poster-rewrite-zoom { position: absolute; z-index: 2; top: 8px; right: 8px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; padding: 5px 8px; color: #fff; background: rgba(8,10,10,.72); backdrop-filter: blur(5px); font: inherit; font-size: 10px; cursor: zoom-in; }
.poster-rewrite-zoom:hover { border-color: #fff; }
.poster-rewrite-body { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px; }
.poster-rewrite-body > div { min-width: 0; }
.poster-rewrite-body small { display: block; margin-bottom: 3px; color: var(--muted-dark); font-size: 9px; letter-spacing: .08em; }
.poster-rewrite-body h3 { overflow: hidden; margin: 0; color: var(--paper); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.poster-rewrite-body button { flex: 0 0 auto; }
.poster-rewrite-footer { display: flex; justify-content: center; }
.poster-rewrite-preview-dialog { width: min(94vw, 1040px); max-height: 94vh; border: 1px solid var(--line); border-radius: 14px; padding: 0; color: var(--paper); background: #111514; box-shadow: 0 28px 90px rgba(0,0,0,.6); }
.poster-rewrite-preview-dialog::backdrop { background: rgba(4,6,6,.82); backdrop-filter: blur(4px); }
.poster-rewrite-preview-shell { display: grid; gap: 12px; padding: 18px; }
.poster-rewrite-preview-stage { display: grid; max-height: calc(94vh - 125px); place-items: center; overflow: auto; border-radius: 8px; background: #080a09; }
.poster-rewrite-preview-stage img { display: block; max-width: 100%; max-height: calc(94vh - 145px); object-fit: contain; }
.poster-rewrite-preview-meta { margin: 0; color: var(--muted); font-size: 11px; text-align: center; }
@media (max-width: 620px) {
  .marketing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .marketing-hint { font-size: 12px; }
  .marketing-rights-note { display: grid; gap: 4px; font-size: 12px; }
  .poster-rewrite-library { padding: 16px 12px; }
  .poster-rewrite-header { align-items: flex-start; flex-direction: column; }
  .poster-rewrite-toolbar { grid-template-columns: 1fr; }
  .poster-rewrite-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .poster-rewrite-media { min-height: 150px; }
  .poster-rewrite-body { align-items: stretch; flex-direction: column; }
  .poster-rewrite-body button { width: 100%; }
}
@media (min-width: 621px) and (max-width: 980px) { .poster-rewrite-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* 006 营销产品库 */
.marketing-products { margin-top: 36px; display: grid; gap: 16px; }
.marketing-products-header h2 { font-size: 20px; margin: 0 0 4px; }
.marketing-products-header p { margin: 0; color: rgba(255,255,255,.62); font-size: 13px; }
.marketing-products-bar { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; }
.marketing-products-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; width: 100%; padding: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.04); }
.marketing-products-form[hidden] { display: none; }
.marketing-products-form label { display: grid; gap: 6px; font-size: 12px; color: rgba(255,255,255,.72); }
.marketing-products-form input[type="text"], .marketing-products-form input:not([type="file"]) { min-width: 200px; padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.3); color: #fff; font-size: 13px; }
.marketing-products-form small { color: rgba(255,255,255,.5); font-size: 11px; }
.marketing-product-status { width: 100%; margin: 0; font-size: 12px; color: #ff9c8a; min-height: 16px; }
.marketing-product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
.marketing-product-card { display: grid; gap: 8px; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.03); }
.marketing-product-card.is-selected { border-color: #7c5cff; box-shadow: 0 0 0 1px #7c5cff inset; }
.marketing-product-card strong { font-size: 14px; }
.marketing-product-media { aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: rgba(255,255,255,.06); display: grid; place-items: center; font-size: 34px; }
.marketing-product-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.marketing-product-actions { display: grid; gap: 6px; }
.marketing-product-actions .primary-button, .marketing-product-actions .secondary-button { padding: 6px 10px; font-size: 12px; }
.marketing-products-tip { margin: 0; font-size: 13px; color: rgba(255,255,255,.55); }
@media (max-width: 640px) {
  .marketing-products-form input:not([type="file"]) { min-width: 0; width: 100%; }
  .marketing-products-form { gap: 8px; }
}

/* 007 产品多图 + 品类推荐 */
.marketing-recommend-band { margin: 0; padding: 10px 14px; border: 1px solid rgba(124,92,255,.35); border-radius: 12px; background: rgba(124,92,255,.12); color: rgba(255,255,255,.85); font-size: 13px; }
.marketing-recommend-band[hidden] { display: none; }
.marketing-product-count { position: absolute; right: 8px; bottom: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(0,0,0,.65); color: #fff; font-size: 11px; font-weight: 600; }
.marketing-product-media { position: relative; }
.marketing-product-category { font-size: 11px; color: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 2px 8px; width: fit-content; }

/* 009 参考图/视频替换画布 demo */
.media-example-image { width: 100%; max-height: 470px; margin-top: 14px; border-radius: 4px; background: #0d100f; object-fit: contain; }

/* 010 专有创作页 remix */
.remix-shell { max-width: 1080px; margin: 0 auto; padding: 22px 20px 40px; }
.remix-head { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.remix-heading h1 { font-size: 22px; margin: 4px 0 0; }
.remix-badge { margin-left: auto; color: var(--muted); font-size: 12px; border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
.remix-workspace { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 20px; align-items: start; }
.remix-source-media { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #0d100f; }
.remix-source-media video, .remix-source-media img { display: block; width: 100%; max-height: 520px; object-fit: contain; }
.remix-source-meta { margin-top: 10px; }
.remix-source-meta strong { display: block; margin-bottom: 4px; }
.remix-source-meta p { color: var(--muted); font-size: 13px; margin: 0; }
.remix-controls { display: flex; flex-direction: column; gap: 16px; }
.remix-field > span { display: block; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.remix-prompt-field textarea { width: 100%; min-height: 110px; resize: vertical; }
.remix-cast-options, .remix-product-options { display: flex; flex-wrap: wrap; gap: 8px; }
.remix-option { border: 1px solid var(--line); background: var(--panel); color: inherit; border-radius: 999px; padding: 7px 14px; font-size: 13px; cursor: pointer; }
.remix-option.is-active { border-color: var(--amber); color: var(--amber); }
.remix-option:hover { border-color: var(--paper); }
.remix-upload { display: inline-flex; align-items: center; gap: 6px; }
.remix-cast-preview { margin-top: 10px; width: 72px; height: 72px; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); }
.remix-actions { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.remix-generate { font-size: 15px; padding: 12px 26px; }
.remix-status { font-size: 13px; margin: 0; color: var(--muted); }
.remix-status.is-error { color: #e5484d; }
.remix-empty { text-align: center; padding: 60px 20px; }
.remix-empty .primary-button { margin-top: 14px; }
@media (max-width: 860px) {
  .remix-workspace { grid-template-columns: 1fr; }
  .remix-head { flex-wrap: wrap; }
}

/* 011 remix 原地生成 + 结果回显 */
.remix-cost-hint { font-size: 12px; color: var(--muted); margin: 0; }
.remix-cost-dialog { border: 1px solid var(--line); background: var(--panel); color: inherit; border-radius: 10px; padding: 0; max-width: 360px; }
.remix-cost-dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
.remix-cost-card { padding: 22px; }
.remix-cost-card h3 { margin: 0 0 14px; font-size: 17px; }
.remix-cost-line { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 8px 0; font-size: 14px; }
.remix-cost-line span { color: var(--muted); }
.remix-cost-note { color: var(--muted); font-size: 12px; margin: 12px 0 16px; }
.remix-cost-actions { display: flex; gap: 10px; justify-content: flex-end; }
.remix-cost-actions .primary-button { padding: 8px 18px; }
.remix-source-media .media-result-grid { display: grid; gap: 10px; }
.remix-source-media .media-result-grid figure { margin: 0; }
.remix-source-media .media-result-grid video, .remix-source-media .media-result-grid img { display: block; width: 100%; max-height: 520px; object-fit: contain; }
.remix-source-media .media-result-grid figcaption { display: flex; align-items: center; gap: 10px; padding: 6px 2px; font-size: 12px; color: var(--muted); }
.remix-source-media .media-result-waiting { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 220px; gap: 8px; padding: 30px 16px; text-align: center; }
.remix-source-media .media-result-waiting p { color: var(--muted); font-size: 13px; margin: 0; }
.remix-save-character { margin-top: 8px; }

/* ===== 014b 生成历史（资产页） ===== */
.generation-history { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--border-subtle, rgba(255,255,255,0.08)); }
.gen-history-grid { display: grid; gap: 12px; margin-top: 20px; }
.generation-history-actions { justify-content: flex-end; padding: 0 0 8px; }
.gen-history-card { background: var(--surface-2, rgba(255,255,255,0.03)); border: 1px solid var(--border-subtle, rgba(255,255,255,0.08)); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.gen-history-media { aspect-ratio: 9/16; background: #000; position: relative; }
.gen-history-media video, .gen-history-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gen-history-empty { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text-muted, #888); font-size: 12px; }
.gen-history-body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; }
.gen-history-body span { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted, #999); }
.gen-history-body strong { font-size: 13px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gen-history-body p { font-size: 12px; color: var(--text-muted, #888); margin: 0; }
.gen-history-body a { font-size: 12px; color: var(--accent, #6c8cff); text-decoration: none; margin-top: 6px; }
@media (max-width: 620px) {
  .asset-strip { grid-auto-columns: min(78vw, 238px); }
  .gen-history-strip { grid-auto-columns: min(78vw, 220px); }
}

/* ===== 015b 登录弹窗忘记密码提示 ===== */
.auth-forgot { margin: 2px 0 0; font-size: 12px; color: var(--text-muted, #9aa3b2); text-align: right; }
.auth-forgot .link-button { background: none; border: none; padding: 0; color: var(--accent, #6c8cff); font-size: 12px; cursor: pointer; text-decoration: underline; }
.auth-forgot-tip { margin: 6px 0 0; font-size: 12px; line-height: 1.6; color: var(--text-muted, #9aa3b2); background: rgba(108,140,255,0.08); border: 1px solid rgba(108,140,255,0.2); border-radius: 8px; padding: 8px 10px; }

/* ==================== 017 应用独立化：app-studio 体系 ==================== */
.app-studio { display: flex; flex-direction: column; gap: 20px; min-height: 60vh; }
.app-studio-body { flex: 1; }

/* --- 剧本写作台 --- */
.studio-writer { display: grid; grid-template-columns: 300px 1fr 280px; gap: 20px; align-items: start; }
.sw-brief, .sw-beats { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; }
.sw-project-context { display: grid; gap: 5px; margin-top: 14px; padding: 12px; border: 1px solid var(--line, #262c3a); border-radius: 8px; background: var(--field, #0d1118); }
.sw-project-context .application-field { gap: 5px; }
.sw-project-context select { width: 100%; min-height: 40px; border: 1px solid var(--line, #262c3a); border-radius: 6px; padding: 8px 10px; color: var(--text, #e8ecf2); background: var(--panel, #141821); }
.sw-project-context small { color: var(--text-faint, #7a8494); font-size: 11px; line-height: 1.45; }
.sw-source-note { display: grid; gap: 4px; padding: 10px 12px; border-left: 2px solid rgba(143,168,246,.62); border-radius: 0 8px 8px 0; background: rgba(108,140,255,.07); }
.sw-source-note strong { color: var(--text, #e8ecf2); font-size: 12px; }
.sw-source-note span { color: var(--text-soft, #aab4c4); font-size: 11px; line-height: 1.5; }
.sw-brief-form { display: grid; gap: 14px; margin-top: 14px; }
.sw-brief-form label { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.sw-brief-form input, .sw-brief-form select, .sw-brief-form textarea { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 10px 12px; color: var(--text, #e8ecf2); font-size: 14px; }
.sw-idea textarea { resize: vertical; }
.sw-brief-subhead { display: grid; gap: 3px; margin-top: 2px; padding-top: 10px; border-top: 1px solid var(--line, #262c3a); color: var(--paper, #e8ecf2); font-size: 12px; }
.sw-brief-subhead small { color: var(--muted-dark, #7a8494); font-size: 10px; line-height: 1.45; }
.sw-brief-tip { margin-top: 16px; padding: 12px; border-radius: 10px; background: rgba(108,140,255,0.07); border: 1px solid rgba(108,140,255,0.18); display: grid; gap: 4px; }
.sw-brief-tip strong { font-size: 13px; color: var(--text, #e8ecf2); }
.sw-brief-tip span { font-size: 12px; color: var(--text-soft, #9aa3b2); }
.sw-desk { background: linear-gradient(180deg, #171c26, #12161e); border: 1px solid #2a3040; border-radius: 14px; padding: 20px; display: grid; gap: 14px; }
.sw-desk-head { display: flex; align-items: baseline; gap: 12px; }
.sw-desk-head h2 { margin: 0; font-size: 18px; }
.sw-desk-state { margin-left: auto; font-size: 12px; color: #7ee2a8; }
.sw-paper { background: #fbf9f2; border-radius: 10px; padding: 4px; }
.sw-paper textarea { width: 100%; border: none; background: transparent; color: #2a2620; font-family: "Noto Serif SC", serif; font-size: 15px; line-height: 1.9; padding: 18px 22px; resize: vertical; border-radius: 8px; }
.sw-desk-actions { display: flex; gap: 10px; justify-content: flex-end; }
.sw-beats-list { display: grid; gap: 10px; margin-top: 14px; }
.sw-beat { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; }
.sw-beat-tag { font-size: 11px; padding: 3px 8px; border-radius: 999px; background: rgba(108,140,255,0.15); color: #9db4ff; }
.sw-beat p { margin: 0; font-size: 13px; line-height: 1.6; color: var(--text-soft, #aab4c4); }

/* --- 分镜镜头板 --- */
.studio-board { display: grid; gap: 20px; }
.sb-operation-tabs, .sq-operation-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.sb-operation-tabs button, .sq-operation-tabs button { flex: 0 0 auto; border: 1px solid var(--line, #262c3a); border-radius: 6px; background: var(--panel, #141821); color: var(--text-soft, #aab4c4); padding: 9px 13px; cursor: pointer; }
.sb-operation-tabs button.active, .sq-operation-tabs button.active { border-color: #8fa8f6; background: rgba(111, 137, 218, .14); color: var(--text, #e8ecf2); }
.sb-bar { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 16px 20px; }
.sb-controls { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; }
.sb-controls .application-field { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.sb-controls input, .sb-controls select, .sb-controls textarea { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 9px 12px; color: var(--text, #e8ecf2); }
.sb-operation-instruction { flex: 1 1 360px; display: grid; gap: 6px; }
.sb-operation-note { display: flex; gap: 12px; align-items: baseline; margin: -8px 2px 0; color: var(--text-soft, #aab4c4); }
.sb-operation-note strong { color: var(--text, #e8ecf2); white-space: nowrap; }
.sb-script-wrap { display: grid; grid-template-columns: minmax(320px, 2fr) 3fr; gap: 20px; align-items: start; }
.sb-script, .sb-line { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; }
.sb-script textarea { width: 100%; margin-top: 14px; background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 14px; color: var(--text, #e8ecf2); font-size: 14px; line-height: 1.8; resize: vertical; }
.sb-line-cards { display: grid; gap: 10px; margin-top: 14px; }
.sb-shot-card { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; background: rgba(255,255,255,0.02); border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 12px 14px; }
.sb-shot-no { font-size: 15px; font-weight: 700; color: #9db4ff; }
.sb-shot-main strong { font-size: 14px; }
.sb-shot-main p { margin: 4px 0 0; font-size: 12.5px; color: var(--text-soft, #9aa3b2); line-height: 1.55; }
.sb-shot-meta { font-size: 11px; color: var(--text-faint, #7a8494); white-space: nowrap; }

/* --- 预演放映室 --- */
.studio-cinema { display: grid; gap: 20px; }
.sc-bar { display: flex; flex-wrap: wrap; gap: 16px; align-items: end; background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 16px 20px; }
.sc-controls .application-field { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.sc-controls select { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 9px 12px; color: var(--text, #e8ecf2); }
.sc-mode { display: flex; gap: 8px; }
.sc-screen { background: radial-gradient(120% 90% at 50% 10%, #1b2130 0%, #0b0e15 70%); border: 1px solid #2a3040; border-radius: 16px; min-height: 420px; padding: 24px; display: grid; align-content: start; gap: 14px; }
.sc-screen-empty { color: var(--text-faint, #7a8494); font-size: 14px; align-self: center; justify-self: center; }

/* --- 电影摄影机 --- */
.studio-deck { display: grid; grid-template-columns: minmax(300px, 380px) 1fr; gap: 20px; align-items: start; }
.deck-form { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; display: grid; gap: 14px; }
.deck-fields { display: grid; gap: 14px; }
.deck-fields .application-field { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.deck-fields input, .deck-fields select, .deck-fields textarea { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 9px 12px; color: var(--text, #e8ecf2); }
.deck-light { grid-column: 1 / -1; }
.deck-monitor { background: #10141c; border: 1px solid #2a3040; border-radius: 8px; min-height: 320px; padding: 24px; }
.deck-monitor-empty { color: var(--text-faint, #7a8494); font-size: 14px; margin-top: 12px; }
.cinema-camera-workspace { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); }
.cinema-camera-form { gap: 18px; border-radius: 8px; }
.cinema-camera-source { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(150px, .5fr); gap: 10px; }
.cinema-camera-source label, .cinema-camera-section label, .cinema-camera-monitor label { display: grid; gap: 6px; min-width: 0; color: var(--text-soft, #aab4c4); font-size: 12px; }
.cinema-camera-source select, .cinema-camera-section input, .cinema-camera-section select, .cinema-camera-section textarea, .cinema-camera-monitor textarea { width: 100%; min-width: 0; border: 1px solid var(--line, #262c3a); border-radius: 6px; padding: 9px 10px; color: var(--text, #e8ecf2); background: var(--field, #0d1118); }
.cinema-camera-section { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 16px; border-top: 1px solid var(--line, #262c3a); padding-top: 16px; }
.cinema-camera-section h3 { margin: 4px 0 0; font-size: 15px; font-weight: 600; }
.cinema-camera-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.cinema-camera-grid .wide { grid-column: 1 / -1; }
.cinema-camera-monitor { position: sticky; top: 92px; display: grid; align-content: start; gap: 14px; }
.cinema-camera-monitor h2 { margin: 0; font-size: 20px; }
.cinema-camera-monitor textarea { min-height: 260px; resize: vertical; line-height: 1.65; }

/* --- 剪辑时间线 --- */
.studio-timeline { display: grid; gap: 20px; }
.st-bar { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 16px 20px; }
.st-controls { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; }
.st-controls .application-field { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.st-controls select { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 9px 12px; color: var(--text, #e8ecf2); }
.st-track-view { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; min-height: 300px; }
.st-track-empty { color: var(--text-faint, #7a8494); font-size: 14px; margin-top: 12px; }

/* --- 反推台 --- */
.studio-bench { display: grid; grid-template-columns: minmax(320px, 420px) 1fr; gap: 20px; align-items: start; }
.studio-bench.vertical { grid-template-columns: minmax(320px, 480px) 1fr; }
.bench-input, .bench-output { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; }
.bench-form { display: grid; gap: 14px; margin-top: 14px; }
.bench-form label:not(.bench-drop) { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.bench-form input:not([hidden]), .bench-form select, .bench-form textarea { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 10px 12px; color: var(--text, #e8ecf2); font-size: 14px; }
.bench-drop { display: grid; place-items: center; min-height: 160px; border: 1.5px dashed #3a4560; border-radius: 12px; cursor: pointer; position: relative; overflow: hidden; }
.bench-drop:hover { border-color: #6c8cff; }
.bench-drop-hint { color: var(--text-faint, #7a8494); font-size: 13px; }
.bench-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #0b0e15; }
.bench-output-empty { color: var(--text-faint, #7a8494); font-size: 14px; margin-top: 12px; }

/* --- 仿写变身台 --- */
.studio-morph { display: grid; gap: 20px; }
.sm-bar { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; }
.sm-controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-top: 14px; }
.sm-controls label { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.sm-controls input, .sm-controls select, .sm-controls textarea { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 10px 12px; color: var(--text, #e8ecf2); font-size: 14px; }
.sm-idea { grid-column: 1 / -1; }
.sm-preview { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 20px; min-height: 260px; }
.sm-preview-empty { color: var(--text-faint, #7a8494); font-size: 14px; margin-top: 12px; }

/* Application outputs stay visible after a run and form the hand-off point for the next tool. */
.app-studio-output { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 22px; }
.app-studio-output .application-panel-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.app-studio-output .application-panel-heading h2 { margin: 0; }
.app-studio-output #applicationResultContent { min-height: 40px; }
.app-studio-output .application-result-ready { padding-top: 0; }
.application-result-editor { width: 100%; min-height: 260px; margin-top: 14px; resize: vertical; border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 14px; color: var(--paper, #f4f0e8); background: #0f1319; line-height: 1.7; }
.application-result-video { display: block; width: min(100%, 860px); max-height: 520px; margin-top: 15px; border-radius: 10px; background: #090b0f; }
.app-studio-output .application-result-actions { justify-content: flex-start; }
.studio-quality { display: grid; gap: 18px; }
.sq-bar { display: flex; align-items: end; gap: 16px; padding: 18px 20px; border: 1px solid var(--line, #262c3a); border-radius: var(--radius, 8px); background: var(--panel, #141821); }
.sq-controls { display: flex; align-items: end; gap: 12px; width: 100%; }
.sq-controls label { flex: 1; }
.sq-scope { padding: 24px; border: 1px solid var(--line, #262c3a); border-radius: var(--radius, 8px); background: var(--panel-soft, #10141d); }
.sq-scope h2 { margin: 4px 0 8px; }
.sq-scope > p:not(.eyebrow) { color: var(--muted, #9ca3af); }
.sq-dimensions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.sq-dimensions span { padding: 10px 12px; border-left: 2px solid var(--amber, #d9a441); color: var(--paper, #eef0ec); background: rgba(255,255,255,.03); }
.quality-dimension-grid span { display: grid; gap: 3px; }
.quality-dimension-grid span small { color: var(--text-soft, #aab4c4); }
.continuity-pair-list { display: grid; gap: 8px; margin: 16px 0; }
.continuity-pair { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--line, #262c3a); border-radius: 6px; }
.continuity-pair > div { display: grid; gap: 4px; }
.continuity-pair small, .continuity-pair > span { color: var(--text-soft, #aab4c4); }
.atomic-asset-builder { display: grid; gap: 16px; margin-bottom: 24px; padding: 20px; border: 1px solid var(--line, #ddd); border-radius: 8px; background: var(--panel, #fff); }
.atomic-asset-builder > header { display: flex; justify-content: space-between; gap: 20px; align-items: start; }
.atomic-asset-builder > header h2 { margin: 4px 0 6px; }
.atomic-asset-builder > header p { margin: 0; }
.atomic-asset-builder > header > span { white-space: nowrap; font-size: 12px; color: var(--text-soft, #6b7280); }
.atomic-asset-builder-form { display: grid; grid-template-columns: minmax(220px, .6fr) minmax(320px, 1.4fr) auto; gap: 12px; align-items: end; }
.atomic-asset-builder-form label { display: grid; gap: 6px; }
.atomic-asset-builder-form textarea { width: 100%; }
.atomic-asset-builder-result { display: flex; gap: 10px; padding: 12px; border-left: 3px solid #3a8a58; background: rgba(58, 138, 88, .08); }
.atomic-audio-shell .application-result-panel audio { width: 100%; }

@media (max-width: 760px) {
  .sb-script-wrap { grid-template-columns: 1fr; }
  .sb-operation-note { display: grid; gap: 4px; }
  .sq-controls { align-items: stretch; flex-direction: column; }
  .sq-dimensions { grid-template-columns: 1fr 1fr; }
  .atomic-asset-builder > header, .atomic-asset-builder-result { display: grid; }
  .atomic-asset-builder-form { grid-template-columns: 1fr; }
}
.quality-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.quality-metrics > div { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--line, #262c3a); border-radius: var(--radius, 8px); background: var(--panel-soft, #10141d); }
.quality-metrics strong { font-size: 20px; color: var(--paper, #eef0ec); }
.quality-metrics span, .quality-issue-list small { color: var(--muted, #9ca3af); font-size: 12px; }
.quality-issue-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.quality-issue { display: grid; grid-template-columns: 100px 1fr auto; gap: 10px; align-items: baseline; padding: 10px 12px; border-left: 3px solid var(--muted, #9ca3af); background: rgba(255,255,255,.03); }
.quality-issue-error { border-left-color: #df6b61; }
.quality-issue-warning { border-left-color: var(--amber, #d9a441); }
@media (max-width: 760px) { .sq-controls { display: grid; align-items: stretch; } .sq-dimensions, .quality-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .quality-issue { grid-template-columns: 1fr; gap: 4px; } }
.st-track-list { display: grid; gap: 8px; margin-top: 14px; }
.st-track-clip { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 48px; border: 1px solid var(--line, #262c3a); border-radius: 9px; padding: 8px 12px; background: #10151d; }
.st-track-clip > span { color: var(--amber, #e0a55a); font-variant-numeric: tabular-nums; }
.st-track-clip small { color: var(--text-faint, #7a8494); }
.edit-timeline-summary { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; color: var(--text-faint, #7a8494); font-size: 12px; }
.edit-timeline-summary span { border: 1px solid var(--line, #262c3a); border-radius: 999px; padding: 4px 8px; }
.edit-track { border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 12px; background: #0f141b; }
.edit-track > header { display: flex; justify-content: space-between; gap: 8px; align-items: center; color: var(--text-soft, #aab4c4); font-size: 12px; }
.edit-track > header span { color: var(--text-faint, #7a8494); font-size: 11px; }
.edit-clip { display: grid; grid-template-columns: minmax(140px, .8fr) minmax(0, 2fr) auto; align-items: center; min-height: 0; }
.edit-clip-heading { display: grid; gap: 2px; min-width: 0; }
.edit-clip-heading strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edit-clip-controls { display: grid; grid-template-columns: repeat(4, minmax(72px, 1fr)); gap: 7px; }
.edit-clip-controls label { display: grid; gap: 3px; color: var(--text-faint, #7a8494); font-size: 10px; }
.edit-clip-controls input, .edit-clip-controls select { width: 100%; min-width: 0; border: 1px solid var(--line, #262c3a); border-radius: 5px; padding: 6px; background: var(--field, #0d1118); color: var(--text, #e8ecf2); font: inherit; font-size: 11px; }
.edit-clip-actions { display: flex; flex-wrap: wrap; gap: 5px; justify-content: flex-end; }
.edit-render-status { display: grid; gap: 8px; border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 14px; background: var(--panel, #141821); }
.edit-render-status span { color: var(--text-faint, #7a8494); font-size: 12px; }
.edit-render-status video { width: min(100%, 760px); max-height: 420px; background: #05070a; }
.edit-delivery-collapsed { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px; border: 1px solid var(--line, #262c3a); border-radius: 12px; background: var(--panel-soft, #10141d); }
.edit-commercial-analytics { display: grid; gap: 14px; min-width: 0; padding: 20px; border: 1px solid var(--line, #262c3a); border-radius: 12px; background: var(--panel, #141821); }
.edit-commercial-analytics > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.edit-commercial-analytics h3 { margin: 0 0 6px; font-size: 20px; }
.edit-commercial-analytics p { margin: 0; color: var(--text-soft, #aab4c4); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.edit-analytics-actions { display: flex; align-items: center; flex-shrink: 0; gap: 8px; }
.edit-analytics-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 0; margin: 0; }
.edit-analytics-metrics > div { display: grid; align-content: start; gap: 6px; min-width: 0; padding: 14px; border-radius: 8px; background: var(--panel-soft, #10141d); }
.edit-analytics-metrics dt, .edit-analytics-metrics small { color: var(--text-soft, #aab4c4); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.edit-analytics-metrics dd { color: var(--text, #e8ecf2); font-size: 24px; font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.edit-commercial-analytics .edit-analytics-scope { padding-top: 12px; border-top: 1px solid var(--line, #262c3a); }
.edit-commercial-analytics :focus-visible { outline: 2px solid var(--amber, #e0a55a); outline-offset: 3px; }
@media (max-width: 900px) { .edit-analytics-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .edit-commercial-analytics { padding: 14px; } .edit-commercial-analytics > header { flex-wrap: wrap; } .edit-analytics-metrics { gap: 8px; } .edit-analytics-metrics > div { padding: 10px; } .edit-analytics-metrics dd { font-size: 20px; } }
.edit-delivery-collapsed p, .edit-delivery-header p, .edit-delivery-note { margin: 0; color: var(--text-soft, #aab4c4); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.edit-delivery-collapsed button { flex-shrink: 0; }
.edit-delivery-panel { display: grid; gap: 18px; min-width: 0; padding: 22px; border: 1px solid var(--line, #262c3a); border-radius: 14px; background: var(--panel, #141821); }
.edit-delivery-header { display: flex; align-items: flex-start; gap: 20px; justify-content: space-between; }
.edit-delivery-header h3 { margin: 4px 0 8px; font-size: 22px; }
.edit-delivery-header .icon-button { flex-shrink: 0; }
.edit-delivery-form { display: grid; gap: 18px; }
.edit-delivery-form fieldset { min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--line, #262c3a); border-radius: 10px; }
.edit-delivery-form legend { padding: 0 6px; color: var(--text, #e8ecf2); font-size: 14px; font-weight: 600; }
.edit-delivery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.edit-delivery-grid label { display: grid; align-content: start; min-width: 0; gap: 6px; color: var(--text-soft, #aab4c4); font-size: 12px; }
.edit-delivery-grid label.wide { grid-column: 1 / -1; }
.edit-delivery-grid input:not([type=checkbox]), .edit-delivery-grid select, .edit-delivery-grid textarea { width: 100%; min-width: 0; max-width: 100%; border: 1px solid var(--line, #262c3a); border-radius: 7px; padding: 9px 10px; background: var(--field, #0d1118); color: var(--text, #e8ecf2); font: inherit; }
.edit-delivery-grid label.edit-delivery-check { display: flex; align-items: center; gap: 8px; }
.edit-delivery-check input { width: 16px; height: 16px; }
.edit-delivery-grid small { color: var(--text-faint, #7a8494); font-size: 11px; }
.edit-delivery-actions, .edit-delivery-downloads { display: flex; flex-wrap: wrap; gap: 8px; }
.edit-delivery-note { margin-top: 10px; }
.edit-delivery-feedback { margin: 0; color: var(--text-soft, #aab4c4); font-size: 12px; line-height: 1.7; }
.edit-delivery-feedback:empty { display: none; }
.edit-delivery-feedback.is-error { color: #df8c82; }
.edit-delivery-empty { padding: 14px; border: 1px dashed var(--line, #262c3a); border-radius: 8px; color: var(--text-soft, #aab4c4); font-size: 12px; }
.edit-delivery-readiness { display: grid; gap: 12px; min-width: 0; }
.delivery-permission-list { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.delivery-permission { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 12px; padding: 10px 12px; border-left: 3px solid var(--text-faint, #7a8494); border-radius: 4px; background: rgba(255,255,255,.025); font-size: 12px; color: var(--text-soft, #aab4c4); overflow-wrap: anywhere; }
.delivery-permission.is-allowed { border-left-color: #81b899; }
.delivery-permission.is-blocked { border-left-color: #d9a441; }
.delivery-permission ul { padding-left: 18px; margin: 0; line-height: 1.7; }
.edit-delivery-facts { display: grid; gap: 8px; margin: 0; padding: 0; font-size: 12px; }
.edit-delivery-facts > div { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 12px; }
.edit-delivery-facts dt { color: var(--text-faint, #7a8494); }
.edit-delivery-facts dd { margin: 0; color: var(--text-soft, #aab4c4); overflow-wrap: anywhere; }
.edit-delivery-files { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.edit-delivery-files li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 10px; font-size: 12px; overflow-wrap: anywhere; }
.edit-delivery-files code { grid-column: 1 / -1; color: var(--text-faint, #7a8494); font-size: 10px; overflow-wrap: anywhere; }
.edit-delivery-panel :focus-visible { outline: 2px solid var(--amber, #e0a55a); outline-offset: 3px; }
.edit-delivery-archives { display: grid; gap: 12px; min-width: 0; padding-top: 18px; border-top: 1px solid var(--line, #262c3a); }
.edit-delivery-archives > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.edit-delivery-archives h4 { margin: 0; font-size: 16px; }
.delivery-archive-create { display: flex; align-items: flex-end; gap: 12px; }
.delivery-archive-create label { display: grid; flex: 1; min-width: 0; gap: 6px; color: var(--text-soft, #aab4c4); font-size: 12px; }
.delivery-archive-create input { width: 100%; min-width: 0; border: 1px solid var(--line, #262c3a); border-radius: 7px; padding: 9px 10px; background: var(--field, #0d1118); color: var(--text, #e8ecf2); font: inherit; }
.delivery-archive-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.delivery-archive-list > li { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--line, #262c3a); border-radius: 8px; }
.delivery-archive-list > li > div { display: grid; gap: 5px; min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
.delivery-archive-list small, .delivery-archive-list code { color: var(--text-faint, #7a8494); font-size: 11px; }
.delivery-archive-list button, .delivery-archive-create button { flex-shrink: 0; }
.delivery-archive-detail { display: grid; gap: 12px; min-width: 0; padding: 14px; border: 1px solid var(--line, #262c3a); border-radius: 10px; background: var(--panel-soft, #10141d); }
@media (max-width: 640px) { .delivery-archive-create, .edit-delivery-archives > header, .delivery-archive-list > li { display: grid; } .delivery-archive-create button, .delivery-archive-list button { width: 100%; } }
@media (max-width: 640px) { .edit-delivery-collapsed { display: grid; padding: 12px; } .edit-delivery-panel { padding: 14px; } .edit-delivery-grid { grid-template-columns: minmax(0, 1fr); } .delivery-permission, .edit-delivery-facts > div { grid-template-columns: minmax(0, 1fr); gap: 4px; } .edit-delivery-downloads button { flex: 1 1 130px; } .edit-delivery-actions button { flex: 1 1 130px; } }
@media (max-width: 820px) { .edit-clip { grid-template-columns: 1fr; gap: 9px; } .edit-clip-actions { justify-content: flex-start; } .edit-clip-controls { grid-template-columns: repeat(2, minmax(90px, 1fr)); } }

/* ==================== Tool 工具页（skill 工具化） ==================== */
.tool-page { display: grid; gap: 20px; }
.tool-head { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: start; background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 24px; }
.tool-head-main h1 { margin: 8px 0 6px; font-size: 24px; }
.tool-badge { font-size: 11px; letter-spacing: 2px; padding: 3px 10px; border-radius: 999px; background: linear-gradient(120deg, #6c8cff, #9d6cff); color: #fff; font-weight: 700; }
.tool-desc { margin: 0; color: var(--text-soft, #aab4c4); font-size: 14px; line-height: 1.7; max-width: 640px; }
.tool-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.tool-cat { font-size: 12px; padding: 3px 10px; border-radius: 999px; background: rgba(108,140,255,0.14); color: #9db4ff; }
.tool-meta span:not(.tool-cat) { font-size: 12px; padding: 3px 10px; border-radius: 999px; background: rgba(255,255,255,0.05); color: var(--text-soft, #9aa3b2); }
.tool-meta .tool-legacy-cat { color: var(--muted-dark, #7a8494); font-size: 10px; }
.tool-documentation { margin-top: 16px; max-width: 760px; border-top: 1px solid var(--line, #262c3a); padding-top: 10px; }
.tool-documentation summary { cursor: pointer; color: var(--text-soft, #aab4c4); font-size: 12px; }
.tool-documentation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.tool-documentation-grid section { min-width: 0; border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 10px 11px; background: rgba(255,255,255,0.02); }
.tool-documentation-grid small { display: block; color: var(--muted-dark, #7a8494); font-size: 10px; }
.tool-documentation-grid p, .tool-documentation-grid ol { margin: 5px 0 0; color: var(--text-soft, #aab4c4); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.tool-documentation-grid ol { padding-left: 18px; }
.tool-head-side { width: 260px; display: grid; gap: 8px; }
.tool-head-side label { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.tool-head-side select { background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 9px 12px; color: var(--text, #e8ecf2); }
.tool-head-side small { font-size: 12px; color: var(--text-faint, #7a8494); line-height: 1.5; }
.tool-work { display: grid; grid-template-columns: minmax(340px, 460px) 1fr; gap: 20px; align-items: start; }
.tool-input, .tool-output { background: var(--panel, #141821); border: 1px solid var(--line, #262c3a); border-radius: 14px; padding: 22px; }
.tool-form { display: grid; gap: 14px; margin-top: 14px; }
.tool-field { display: grid; gap: 6px; font-size: 13px; color: var(--text-soft, #aab4c4); }
.tool-field textarea, .tool-field input, .tool-field select { width: 100%; background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 8px; padding: 10px 12px; color: var(--text, #e8ecf2); font-size: 14px; line-height: 1.7; }
.tool-field textarea { resize: vertical; }
.tool-variant-screenplay .tool-form, .tool-variant-storyboard .tool-form, .tool-variant-media .tool-form, .tool-variant-marketing .tool-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tool-variant-screenplay .tool-field-premise, .tool-variant-storyboard .tool-field-script, .tool-variant-media .tool-field-prompt, .tool-variant-marketing .tool-field-prompt, .tool-variant-marketing .tool-field-constraints, .tool-form .full-width { grid-column: 1 / -1; }
.tool-variant-asset .tool-input { border-left: 3px solid #55a57a; }
.tool-variant-quality .tool-input { border-left: 3px solid #d9a441; }
.tool-note { margin-top: 14px; font-size: 12px; color: var(--text-faint, #7a8494); line-height: 1.6; padding-top: 12px; border-top: 1px dashed var(--line, #262c3a); }
.tool-loading, .tool-missing { padding: 80px 20px; text-align: center; color: var(--text-soft, #9aa3b2); }
.tool-output-empty { color: var(--text-faint, #7a8494); font-size: 14px; margin-top: 12px; }
.tool-result-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.tool-result-head small { color: var(--text-faint, #7a8494); }
.tool-result-editor { width: 100%; background: var(--field, #0d1118); border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 14px; color: var(--text, #e8ecf2); font-size: 14px; line-height: 1.8; resize: vertical; font-family: inherit; }
.tool-result-actions { display: flex; gap: 10px; margin-top: 12px; }
.tool-relay { margin-top: 20px; padding-top: 16px; border-top: 1px dashed var(--line, #262c3a); }
.tool-relay h3 { margin: 6px 0 10px; font-size: 14px; }
.tool-relay-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.tool-relay-card { text-align: left; background: rgba(255,255,255,0.03); border: 1px solid var(--line, #262c3a); border-radius: 10px; padding: 12px 14px; cursor: pointer; display: grid; gap: 4px; transition: border-color .15s, transform .15s; color: var(--text, #e8ecf2); }
.tool-relay-card:hover { border-color: #6c8cff; transform: translateY(-1px); }
.tool-relay-card strong { font-size: 13.5px; }
.tool-relay-card small { font-size: 11.5px; color: var(--text-faint, #7a8494); }

/* --- 皮肤 --- */
.skin-adv .tool-badge { background: linear-gradient(120deg, #ff8a5c, #ff5c7a); }
.skin-drama .tool-badge { background: linear-gradient(120deg, #b06cff, #6c8cff); }
.skin-script .tool-badge { background: linear-gradient(120deg, #5cc8ff, #5c8aff); }
.skin-board .tool-badge { background: linear-gradient(120deg, #ffd05c, #ff9a5c); }
.skin-asset .tool-badge { background: linear-gradient(120deg, #7ee2a8, #5cc8ff); }
.skin-post .tool-badge { background: linear-gradient(120deg, #9db4ff, #c86cff); }
.skin-video .tool-badge { background: linear-gradient(120deg, #ff5ca8, #b05cff); }
.skin-adv.tool-page .tool-head { border-color: rgba(255,138,92,0.3); }
.skin-drama.tool-page .tool-head { border-color: rgba(176,108,255,0.3); }
.skin-script.tool-page .tool-head { border-color: rgba(92,200,255,0.3); }
.skin-board.tool-page .tool-head { border-color: rgba(255,208,92,0.3); }
.skin-asset.tool-page .tool-head { border-color: rgba(126,226,168,0.3); }
.skin-post.tool-page .tool-head { border-color: rgba(157,180,255,0.3); }
.skin-video.tool-page .tool-head { border-color: rgba(255,92,168,0.3); }

/* --- 移动端 390 --- */
@media (max-width: 900px) {
  .studio-writer { grid-template-columns: 1fr; }
  .sb-script-wrap { grid-template-columns: 1fr; }
  .studio-deck { grid-template-columns: 1fr; }
  .cinema-camera-monitor { position: static; }
  .studio-bench, .studio-bench.vertical { grid-template-columns: 1fr; }
  .tool-head { grid-template-columns: 1fr; }
  .tool-head-side { width: auto; }
  .tool-work { grid-template-columns: 1fr; }
  .tool-documentation-grid { grid-template-columns: 1fr; }
  .tool-variant-screenplay .tool-form, .tool-variant-storyboard .tool-form, .tool-variant-media .tool-form, .tool-variant-marketing .tool-form { grid-template-columns: 1fr; }
  .tool-variant-screenplay .tool-field-premise, .tool-variant-storyboard .tool-field-script, .tool-variant-media .tool-field-prompt, .tool-variant-marketing .tool-field-prompt, .tool-variant-marketing .tool-field-constraints, .tool-form .full-width { grid-column: auto; }
}

@media (max-width: 640px) {
  .cinema-camera-source, .cinema-camera-section { grid-template-columns: 1fr; }
  .cinema-camera-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 420px) {
  .cinema-camera-grid { grid-template-columns: 1fr; }
  .cinema-camera-grid .wide { grid-column: auto; }
}

.tool-missing-actions { display: flex; gap: 10px; justify-content: center; margin-top: 16px; }

/* ===== 018 商品套图 ===== */
.set-template-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; margin-bottom: 18px; }
.set-template-card { position: relative; padding: 12px 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(255,255,255,.03); cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.set-template-card:hover { border-color: rgba(255,255,255,.3); }
.set-template-card.is-selected { border-color: #7c5cff; background: rgba(124,92,255,.12); }
.set-template-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.set-template-head strong { font-size: 14px; }
.set-template-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: rgba(124,92,255,.18); color: #b8a6ff; white-space: nowrap; }
.set-template-card p { margin: 0 0 8px; font-size: 12px; opacity: .72; line-height: 1.5; }
.set-template-slots { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.set-template-slots span { font-size: 10px; padding: 1px 6px; border-radius: 4px; background: rgba(255,255,255,.08); opacity: .8; }
.set-template-count { font-size: 11px; color: #9d8cff; font-weight: 600; }
.set-form .set-input-block { margin-bottom: 14px; }
.set-input-label { margin: 0 0 4px; font-size: 13px; font-weight: 600; }
.set-required-mark { font-size: 10px; color: #ffb35c; margin-left: 6px; }
.set-input-help { margin: 0 0 8px; font-size: 12px; opacity: .6; }
.set-picker-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.set-select { flex: 1 1 180px; min-width: 160px; padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,.16); background: rgba(0,0,0,.35); color: inherit; font-size: 13px; }
.set-upload-label { cursor: pointer; }
.set-selected-note { margin: 8px 0 0; font-size: 12px; opacity: .85; }
.set-selected-note.is-empty { opacity: .45; }
.set-quote-note { margin: 10px 0 0; font-size: 12px; opacity: .8; }
.set-progress-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.set-progress-head span { font-size: 13px; color: #9d8cff; font-weight: 600; }
.set-slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.set-slot-card { margin: 0; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; overflow: hidden; background: rgba(255,255,255,.03); }
.set-slot-card.is-succeeded { border-color: rgba(72,199,142,.45); }
.set-slot-card.is-failed { border-color: rgba(255,99,99,.5); }
.set-slot-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.set-slot-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; aspect-ratio: 1; background: rgba(124,92,255,.06); }
.set-slot-placeholder span { font-size: 11px; opacity: .55; letter-spacing: .05em; }
.set-slot-placeholder strong { font-size: 13px; }
.set-slot-card.is-processing .set-slot-placeholder, .set-slot-card.is-queued .set-slot-placeholder, .set-slot-card.is-submitting .set-slot-placeholder { animation: setPulse 1.6s ease-in-out infinite; }
@keyframes setPulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
.set-slot-card figcaption { padding: 8px 10px; display: flex; flex-direction: column; gap: 3px; }
.set-slot-label { font-size: 11px; opacity: .75; }
.set-slot-status { font-size: 11px; color: #9d8cff; }
.is-succeeded .set-slot-status { color: #48c78e; }
.is-failed .set-slot-status { color: #ff6363; }
.set-slot-card figcaption a { font-size: 11px; color: #7ab8ff; }
.set-actions-row { margin-top: 12px; display: flex; gap: 8px; }
@media (max-width: 620px) {
  .set-template-grid { grid-template-columns: 1fr 1fr; }
  .set-slot-grid { grid-template-columns: 1fr 1fr; }
  .set-picker-row { flex-direction: column; align-items: stretch; }
}


/* ===== 027 商品套图 hedaAI 化：品类快选 + dropzone ===== */
.ps-cat-row { display: flex; flex-wrap: wrap; gap: 8px; }
.ps-cat-chip { padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); color: inherit; font-size: 13px; cursor: pointer; transition: all .15s ease; }
.ps-cat-chip:hover { border-color: rgba(255,255,255,.3); }
.ps-cat-chip.is-on { background: var(--paper, #f5f2ea); color: #141414; border-color: var(--paper, #f5f2ea); font-weight: 600; }
.set-input-help-inline { font-size: 12px; opacity: .55; margin-left: 6px; font-weight: 400; }
.ps-dropzone { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 120px; border: 1.5px dashed rgba(255,255,255,.22); border-radius: 14px; background: rgba(255,255,255,.02); cursor: pointer; transition: all .15s ease; text-align: center; padding: 18px; }
.ps-dropzone:hover, .ps-dropzone.has-files { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.05); }
.ps-dropzone.has-files { min-height: 64px; padding: 12px; }
.ps-dropzone-main { font-size: 15px; font-weight: 600; }
.ps-dropzone-sub { font-size: 12px; opacity: .55; }
.ps-thumb-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; align-items: center; }
.ps-thumb { position: relative; width: 72px; height: 72px; border-radius: 10px; overflow: hidden; border: 1px solid rgba(255,255,255,.15); }
.ps-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ps-thumb-x { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; border-radius: 50%; border: 0; background: rgba(0,0,0,.65); color: #fff; font-size: 12px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ps-thumb-x:hover { background: rgba(200,40,40,.85); }
.ps-thumb-count { font-size: 12px; opacity: .6; margin-left: 2px; }

/* ===== P0/P1 atom visibility ===== */
.application-card header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.application-card .app-tier { border: 1px solid rgba(229,163,95,.45); border-radius: 999px; padding: 3px 7px; color: var(--amber); font-size: 10px; font-weight: 700; letter-spacing: .06em; }
.application-card-P1 .app-tier { border-color: rgba(122,184,255,.45); color: #7ab8ff; }
.application-card-contract { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 13px; }
.application-card-contract span, .application-card-atom { border: 1px solid var(--line); border-radius: 999px; padding: 3px 7px; color: var(--muted); font-size: 10px; }
.application-card-atom { display: inline-block; margin-top: 9px; border: 0; padding: 0; color: var(--muted-dark); overflow-wrap: anywhere; }
.application-card-prompt .app-tier { border-color: rgba(122, 214, 174, .5); color: var(--jade); }
.style-constitution-preview, .style-constitution-result-grid, .style-constitution-layers, .style-constitution-rx { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.style-constitution-preview { margin-top: 2px; }
.style-constitution-preview > div, .style-constitution-result-grid > section, .style-constitution-layers > section, .style-constitution-rx > section { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 12px; background: var(--panel-soft); }
.style-constitution-preview small, .style-constitution-result-grid small, .style-constitution-layers small, .style-constitution-rx small { display: block; color: var(--muted-dark); font-size: 10px; letter-spacing: .04em; }
.style-constitution-preview p, .style-constitution-result-grid p, .style-constitution-layers p, .style-constitution-rx p { margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.style-constitution-result-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 15px 0 8px; }
.style-constitution-result-grid strong { display: block; margin-top: 5px; color: var(--paper); font-size: 13px; }
.style-constitution-layers, .style-constitution-rx { margin-top: 8px; }
.style-constitution-layers > section:first-child { border-left: 3px solid var(--jade); }
.style-constitution-layers > section:nth-child(2) { border-left: 3px solid var(--amber); }
.style-constitution-layers > section:nth-child(3) { border-left: 3px solid var(--coral); }
.style-constitution-rx { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.style-constitution-rx > section:first-child { border-left: 3px solid var(--jade); }
.style-constitution-rx > section:last-child { border-left: 3px solid var(--coral); }
.media-style-field { border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 12px; background: rgba(122, 214, 174, .035); }
.media-style-field small { color: var(--muted-dark); font-size: 10px; line-height: 1.45; }
.application-contract-bar { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding: 12px 0 13px; color: var(--muted); font-size: 11px; }
.application-tier-chip, .application-stage-chip, .application-atom-chip { border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; white-space: nowrap; }
.application-tier-chip.p0 { border-color: rgba(229,163,95,.5); color: var(--amber); }
.application-tier-chip.p1 { border-color: rgba(122,184,255,.5); color: #7ab8ff; }
.application-stage-chip { color: var(--paper); }
.application-atom-chip { color: var(--muted-dark); }
.application-next-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.application-next-chip { border: 1px solid rgba(229,163,95,.35); border-radius: 999px; padding: 4px 8px; color: var(--amber); background: transparent; font: inherit; font-size: 10px; cursor: pointer; }
.application-next-chip:hover { border-color: var(--amber); color: var(--paper); }
.application-next-chip.is-muted { border-color: var(--line); color: var(--muted-dark); }
.sw-stage-rail { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin: 14px 0 16px; }
.sw-stage { display: grid; gap: 3px; min-width: 0; border: 0; border-top: 2px solid var(--line); padding: 8px 7px 0; text-align: left; background: transparent; cursor: pointer; }
.sw-stage span { color: var(--muted-dark); font-size: 10px; }
.sw-stage strong { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.sw-stage small { color: var(--muted-dark); font-size: 10px; }
.sw-stage.done { border-top-color: var(--jade); }
.sw-stage.done strong { color: var(--paper); }
.sw-stage.current { border-top-color: var(--amber); }
.sw-stage.current strong { color: var(--amber); }
.sw-stage.active { background: rgba(229,163,95,.08); border-radius: 8px 8px 0 0; }
.sw-stage.active strong { color: var(--amber); }
.sw-stage-content { min-height: 380px; }
.sw-stage-view { display: grid; gap: 16px; min-height: 360px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.018); }
.sw-stage-view-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; }
.sw-stage-view-head strong { color: var(--paper); font-size: 18px; }
.sw-stage-view-head small { margin-left: auto; color: var(--muted-dark); font-size: 11px; }
.sw-stage-kicker { color: var(--amber); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.sw-stage-view > p { max-width: 70ch; margin: 0; color: var(--text-soft, #aab4c4); line-height: 1.8; }
.sw-stage-help { padding: 10px 12px; border-left: 2px solid var(--amber); background: rgba(229,163,95,.06); font-size: 12px; }
.sw-fact-grid, .sw-contract-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sw-fact-grid span, .sw-contract-grid span { display: grid; gap: 5px; min-width: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 9px; background: rgba(0,0,0,.12); }
.sw-fact-grid small, .sw-contract-grid small { color: var(--muted-dark); font-size: 10px; }
.sw-fact-grid b, .sw-contract-grid b { overflow: hidden; color: var(--paper); font-size: 12px; font-weight: 500; line-height: 1.5; text-overflow: ellipsis; }
.sw-stage-editor { width: 100%; resize: vertical; background: var(--field, #0d1118); border: 1px solid var(--line); border-radius: 9px; padding: 12px; color: var(--paper); font-size: 14px; line-height: 1.7; }
.sw-outline-list, .sw-episode-list { display: grid; gap: 8px; max-height: 520px; overflow: auto; }
.sw-outline-list article, .sw-episode-list article { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: start; padding: 11px 12px; border: 1px solid var(--line); border-radius: 9px; background: rgba(0,0,0,.12); }
.sw-outline-list article > span, .sw-episode-list article > span { color: var(--amber); font-size: 11px; font-variant-numeric: tabular-nums; }
.sw-outline-list strong, .sw-episode-list strong { color: var(--paper); font-size: 13px; }
.sw-outline-list p, .sw-episode-list p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.sw-outline-list small, .sw-episode-list small { max-width: 140px; color: var(--muted-dark); font-size: 10px; text-align: right; }
.sw-episode-editor-list article { grid-template-columns: 34px minmax(0, 1fr) minmax(180px, .45fr); }
.sw-episode-editor-list label { display: grid; gap: 5px; color: var(--muted-dark); font-size: 10px; }
.sw-episode-editor-list article > div { display: grid; gap: 9px; min-width: 0; }
.sw-episode-editor-list input, .sw-episode-editor-list textarea { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: 7px; padding: 8px 9px; background: var(--field, #0d1118); color: var(--paper); font: inherit; font-size: 12px; line-height: 1.55; }
.sw-stage-empty { color: var(--muted-dark); font-size: 13px; }
.sw-workspace-nav { display: grid; gap: 5px; margin: 12px 0 18px; }
.sw-workspace-nav button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; border: 1px solid transparent; border-radius: 8px; padding: 9px 10px; background: transparent; color: var(--muted); font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
.sw-workspace-nav button.active, .sw-workspace-nav button:hover { border-color: var(--line); background: rgba(255,255,255,.035); color: var(--paper); }
.sw-workspace-nav button small, .sw-workspace-nav button b { color: var(--muted-dark); font-size: 10px; font-weight: 500; }
.sw-entity-stack { display: grid; gap: 14px; }
.sw-entity-stack section { display: grid; gap: 8px; }
.sw-entity-stack header, .sw-coach header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sw-entity-stack header strong, .sw-coach header strong { color: var(--paper); font-size: 12px; }
.sw-entity-stack header small, .sw-coach-status { color: var(--muted-dark); font-size: 10px; }
.sw-entity-stack p { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 12px; }
.sw-entity-dot { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: rgba(126,226,168,.12); color: var(--jade); font-size: 10px; }
.sw-entity-summary, .sw-entity-empty { line-height: 1.6; }
.sw-coach { display: grid; gap: 9px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.sw-coach ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sw-coach li { display: flex; gap: 7px; align-items: center; color: var(--muted-dark); font-size: 11px; }
.sw-coach li.is-ok { color: var(--jade); }
.sw-coach li span { width: 12px; color: inherit; }
.sw-coach p { margin: 0; color: var(--muted-dark); font-size: 11px; line-height: 1.55; }
.sw-job-progress, .p1-job-progress { display: grid; gap: 7px; margin: 0 0 14px; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 12px; background: var(--panel-soft); }
.sw-job-progress > div { display: flex; justify-content: space-between; gap: 10px; color: var(--paper); font-size: 12px; }
.sw-job-progress > div span { color: var(--amber); font-variant-numeric: tabular-nums; }
.sw-job-progress progress, .p1-job-progress progress { width: 100%; height: 5px; accent-color: var(--amber); }
.sw-job-progress small, .p1-job-progress p { color: var(--muted); font-size: 11px; line-height: 1.5; }
.artifact-overview { display: grid; gap: 11px; margin: 15px 0 17px; border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: var(--radius); padding: 13px 14px; background: #111514; }
.artifact-overview-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.artifact-overview-head strong { color: var(--paper); font-size: 13px; }
.artifact-overview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.artifact-overview-grid > div { display: grid; gap: 3px; min-width: 0; }
.artifact-overview-grid small { color: var(--muted-dark); font-size: 10px; }
.artifact-overview-grid strong { overflow: hidden; color: var(--paper); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.artifact-gate-row, .storyboard-coverage-strip, .edit-artifact-summary, .replacement-slot-row { display: flex; flex-wrap: wrap; gap: 6px; }
.artifact-gate-row span, .storyboard-coverage-strip span, .edit-artifact-summary span, .replacement-slot-row span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; color: var(--muted); font-size: 10px; }
.artifact-next-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.artifact-next-actions small { width: 100%; color: var(--muted-dark); font-size: 10px; }
.storyboard-coverage-strip { margin: 12px 0 2px; }
.quality-dimension-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 15px 0 5px; }
.quality-dimension-grid span { border: 1px solid var(--line); padding: 7px 8px; color: var(--muted); font-size: 10px; text-align: center; }
.camera-intent-grid, .imitation-plan-grid, .reverse-image-identity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 14px; }
.camera-intent-grid span, .imitation-plan-grid > div, .reverse-image-identity-grid > div { min-width: 0; border: 1px solid var(--line); padding: 10px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.imitation-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.imitation-plan-grid > div { display: grid; gap: 5px; }
.imitation-plan-grid strong, .reverse-image-identity-grid strong { color: var(--paper); font-size: 11px; }
.imitation-plan-grid span, .reverse-image-identity-grid p, .reverse-image-identity-grid small { color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.reverse-image-identity-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.reverse-image-identity-grid p { margin: 6px 0 3px; color: var(--paper); }
.reverse-image-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.reverse-image-columns > section { border-top: 2px solid var(--line); padding-top: 8px; color: var(--paper); font-size: 11px; }
.reverse-image-columns > section:nth-child(1) { border-color: var(--jade); }
.reverse-image-columns > section:nth-child(2) { border-color: var(--amber); }
.reverse-image-columns > section:nth-child(3) { border-color: var(--coral); }
.reverse-image-columns ul { display: grid; gap: 4px; margin: 7px 0 0 15px; padding: 0; color: var(--muted); line-height: 1.45; }
.replacement-slot-row { margin: 12px 0; }
.edit-artifact-summary { margin: 13px 0; }
.action-choreography-result { display: grid; gap: 14px; }
.action-phase-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.action-phase-card { min-width: 0; border-top: 2px solid var(--line); padding: 9px 8px 8px; background: var(--panel-soft); }
.action-phase-card:nth-child(1), .action-phase-card:nth-child(2) { border-top-color: var(--jade); }
.action-phase-card:nth-child(3), .action-phase-card:nth-child(4) { border-top-color: var(--amber); }
.action-phase-card:nth-child(5) { border-top-color: var(--coral); }
.action-phase-card:nth-child(6) { border-top-color: #7ab8ff; }
.action-phase-card small, .action-unit-grid small { display: block; color: var(--muted-dark); font-size: 10px; }
.action-phase-card strong { display: block; margin-top: 4px; color: var(--paper); font-size: 13px; }
.action-phase-card p { margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.action-result-summary { display: flex; flex-wrap: wrap; gap: 6px; }
.action-result-summary span { border: 1px solid var(--line); border-radius: 999px; padding: 5px 9px; color: var(--muted); font-size: 10px; }
.action-unit-list { display: grid; gap: 8px; max-height: 620px; overflow: auto; padding-right: 2px; }
.action-unit-card { border: 1px solid var(--line); border-left: 3px solid var(--amber); background: #111514; padding: 11px 12px; }
.action-unit-card header { display: flex; align-items: flex-start; gap: 9px; }
.action-unit-card header > span { color: var(--amber); font-size: 12px; font-variant-numeric: tabular-nums; }
.action-unit-card header div { display: grid; gap: 3px; min-width: 0; flex: 1; }
.action-unit-card header strong { color: var(--paper); font-size: 12px; }
.action-unit-card header small { color: var(--muted-dark); font-size: 10px; }
.action-unit-card header em { color: var(--muted-dark); font-size: 10px; font-style: normal; }
.action-unit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.action-unit-grid p { min-width: 0; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.action-unit-grid p small { margin-bottom: 3px; }
@media (max-width: 780px) {
  .action-phase-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .action-unit-grid { grid-template-columns: 1fr; }
  .style-constitution-preview, .style-constitution-result-grid, .style-constitution-layers, .style-constitution-rx { grid-template-columns: 1fr; }
  .application-next-chips { width: 100%; margin-left: 0; }
  .artifact-overview-grid, .quality-dimension-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .camera-intent-grid, .imitation-plan-grid, .reverse-image-identity-grid, .reverse-image-columns { grid-template-columns: 1fr; }
  .sw-stage-rail { gap: 4px; }
  .sw-stage { padding-left: 3px; }
  .sw-stage strong { font-size: 11px; }
  .sw-fact-grid, .sw-contract-grid { grid-template-columns: 1fr; }
  .sw-outline-list article, .sw-episode-list article { grid-template-columns: 28px 1fr; }
  .sw-outline-list article small, .sw-episode-list article small { grid-column: 2; max-width: none; text-align: left; }
  .sw-episode-editor-list article > label { grid-column: 2; }
}


/* ===== ECOM STUDIO (电商素材生产线) ===== */
.ecom-launch { box-shadow: 0 6px 18px rgba(13, 148, 136, 0.35); }
.ecom-studio { color: #26211a; }
.ecom-studio h2, .ecom-studio h3 { color: #26211a; }
.ecom-studio .ecom-field { color: #3a332a; }
.ecom-studio .ecom-field input { color: #26211a; }
.ecom-studio .ecom-choice strong, .ecom-studio .ecom-task-card strong { color: #26211a; }
.ecom-studio .ecom-choice small, .ecom-studio .ecom-task-card small { color: #524b40; }
.ecom-studio .ecom-step { color: #524b40; }
.ecom-studio .ecom-step-arrow { color: #6f6659; }
.ecom-studio { margin: 24px 0 32px; border: 1px solid var(--border-soft, #d8d2c8); border-radius: 16px; background: var(--surface-raised, #faf8f4); overflow: hidden; }
.ecom-studio-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding: 20px 24px; border-bottom: 1px solid var(--border-soft, #d8d2c8); flex-wrap: wrap; }
.ecom-studio-header h2 { margin: 4px 0 6px; font-size: 20px; }
.ecom-studio-header p:last-child { margin: 0; color: var(--text-muted, #524b40); font-size: 13px; max-width: 640px; }
.ecom-studio-body { padding: 20px 24px 24px; }
.ecom-steps { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.ecom-step { padding: 4px 12px; border-radius: 999px; font-size: 13px; color: var(--text-muted, #524b40); border: 1px solid var(--border-soft, #d8d2c8); background: transparent; }
.ecom-step.is-active { color: #fff; background: var(--brand-ink, #1a1a1a); border-color: var(--brand-ink, #1a1a1a); }
.ecom-step-arrow { color: var(--text-muted, #6f6659); }
.ecom-panel { border: 1px solid var(--border-soft, #e2dccf); border-radius: 12px; padding: 18px 20px; background: #fff; }
.ecom-panel h3 { margin: 0 0 14px; font-size: 16px; }
.ecom-panel h4 { margin: 0 0 8px; font-size: 13px; color: var(--text-muted, #524b40); font-weight: 600; }
.ecom-panel-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 18px; }
.ecom-product-source { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-bottom: 14px; }
.ecom-choice { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--border-soft, #d8d2c8); border-radius: 10px; cursor: pointer; }
.ecom-choice:has(input:checked) { border-color: var(--brand-ink, #1a1a1a); box-shadow: 0 0 0 1px var(--brand-ink, #1a1a1a) inset; }
.ecom-choice input { margin-top: 3px; }
.ecom-choice strong { display: block; font-size: 14px; }
.ecom-choice small { color: var(--text-muted, #524b40); }
.ecom-product-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 14px; }
.ecom-product-pick { display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid var(--border-soft, #d8d2c8); border-radius: 10px; background: #fff; cursor: pointer; text-align: left; position: relative; }
.ecom-product-pick img { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.ecom-product-pick.is-selected { border-color: var(--brand-ink, #1a1a1a); box-shadow: 0 0 0 1px var(--brand-ink, #1a1a1a) inset; }
.ecom-product-pick span { font-size: 13px; font-weight: 600; }
.ecom-product-pick small { display: block; color: var(--text-muted, #4f473b); font-weight: 400; }
.ecom-product-pick em { position: absolute; top: 6px; right: 8px; font-style: normal; font-weight: 700; }
.ecom-upload-zone { margin-bottom: 14px; }
.ecom-drop { display: block; border: 1.5px dashed var(--border-soft, #c9c1b4); border-radius: 10px; padding: 18px; text-align: center; cursor: pointer; color: var(--text-muted, #524b40); font-size: 13px; }
.ecom-drop:hover { border-color: var(--brand-ink, #1a1a1a); }
.ecom-upload-previews { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.ecom-upload-thumb { position: relative; margin: 0; }
.ecom-upload-thumb img { width: 72px; height: 72px; border-radius: 8px; object-fit: cover; }
.ecom-upload-thumb button { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; border: none; background: #d64545; color: #fff; font-size: 12px; line-height: 1; cursor: pointer; }
.ecom-field { display: block; margin: 10px 0; font-size: 13px; font-weight: 600; }
.ecom-field input { display: block; width: 100%; margin-top: 6px; padding: 9px 12px; border: 1px solid var(--border-soft, #c9c1b4); border-radius: 8px; font-size: 14px; font-weight: 400; }
.ecom-field small { display: block; margin-top: 4px; color: var(--text-muted, #4f473b); font-weight: 400; }
.ecom-task-grid { display: grid; gap: 16px; }
.ecom-task-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.ecom-task-card { display: block; padding: 12px 14px; border: 1px solid var(--border-soft, #d8d2c8); border-radius: 10px; cursor: pointer; background: #fff; }
.ecom-task-card:has(input:checked) { border-color: var(--brand-ink, #1a1a1a); box-shadow: 0 0 0 1px var(--brand-ink, #1a1a1a) inset; }
.ecom-task-card input { position: absolute; opacity: 0; pointer-events: none; }
.ecom-task-card strong { display: block; font-size: 14px; margin-bottom: 4px; }
.ecom-task-card small { display: block; color: var(--text-muted, #524b40); font-size: 12px; margin-bottom: 4px; }
.ecom-task-card em { display: block; color: #6a5d3a; font-size: 11px; font-style: normal; }
.ecom-params-row { margin-bottom: 14px; }
.ecom-chip-group, .ecom-count-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.ecom-params-row small { display: block; margin-top: 6px; color: var(--text-muted, #4f473b); }
.ecom-confirm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 0 0 12px; }
.ecom-confirm-grid div { border: 1px solid var(--border-soft, #e2dccf); border-radius: 8px; padding: 8px 12px; }
.ecom-confirm-grid dt { font-size: 11px; color: var(--text-muted, #4f473b); font-weight: 600; }
.ecom-confirm-grid dd { margin: 2px 0 0; font-size: 13px; }
.ecom-confirm-prompt dt { font-size: 12px; color: var(--text-muted, #524b40); font-weight: 600; margin-bottom: 6px; }
.ecom-confirm-prompt dd { margin: 0; }
.ecom-confirm-prompt textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--border-soft, #c9c1b4); border-radius: 8px; font-size: 13px; line-height: 1.6; resize: vertical; font-family: inherit; }
.ecom-confirm-error { color: #d64545; font-size: 13px; font-weight: 600; }
.ecom-confirm-note { color: var(--text-muted, #4f473b); font-size: 12px; }
.ecom-delivery { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.ecom-delivery-card { border: 1px solid var(--border-soft, #e2dccf); border-radius: 10px; padding: 12px; background: #fff; }
.ecom-delivery-card header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.ecom-delivery-card header strong { font-size: 13px; flex: 1; }
.ecom-delivery-index { font-size: 11px; color: var(--text-muted, #6f6659); font-weight: 700; }
.ecom-delivery-state { font-size: 12px; font-weight: 600; color: var(--text-muted, #524b40); }
.ecom-delivery-card.is-succeeded .ecom-delivery-state { color: #2e7d43; }
.ecom-delivery-card.is-failed .ecom-delivery-state, .ecom-delivery-card.is-timeout .ecom-delivery-state { color: #d64545; }
.ecom-delivery-media { width: 100%; border-radius: 8px; display: block; margin-bottom: 10px; }
.ecom-delivery-error { color: #d64545; font-size: 12px; margin: 0 0 8px; }
.ecom-delivery-card a { font-size: 12px; }
.ecom-status { margin: 14px 0 0; font-size: 13px; color: var(--text-muted, #524b40); min-height: 18px; }
.ecom-status.is-error { color: #d64545; font-weight: 600; }
.ecom-hint { font-size: 13px; color: var(--text-muted, #4f473b); background: transparent; }
@media (max-width: 720px) {
  .ecom-studio-header { padding: 16px; }
  .ecom-studio-body { padding: 14px 16px 18px; }
  .ecom-product-source { grid-template-columns: 1fr; }
  .ecom-task-cards { grid-template-columns: 1fr 1fr; }
  .ecom-delivery { grid-template-columns: 1fr; }
}

/* ===== ecom v3：chip 选中态 + 对比度增强（20260914-ecom-v3） ===== */
.ecom-studio .chip,
.ecom-chip-group .chip,
.ecom-count-chips .chip {
  appearance: none;
  border: 1.5px solid #b9b0a2;
  background: #fff;
  color: #3d362c;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  padding: 8px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: border-color .12s ease, background-color .12s ease, color .12s ease, box-shadow .12s ease;
}
.ecom-studio .chip:hover { border-color: #1a1a1a; }
.ecom-studio .chip:focus-visible { outline: 2px solid #1a1a1a; outline-offset: 2px; }
.ecom-studio .chip.is-active {
  background: var(--brand-ink, #1a1a1a);
  border-color: var(--brand-ink, #1a1a1a);
  color: #fff;
  box-shadow: 0 1px 4px rgba(26, 26, 26, .28);
}
.ecom-studio .chip.is-active::after { content: " ✓"; }
/* 选项卡类（任务卡/商品卡/来源选择）选中态加强 */
.ecom-task-card:has(input:checked) { background: #f4f1ea; }
.ecom-choice:has(input:checked) { background: #f4f1ea; }
.ecom-task-card strong, .ecom-choice strong { color: #26211a; }
.ecom-studio small { color: #4f473b; }
.ecom-studio .ecom-confirm-prompt textarea { color: #26211a; background: #fff; }
.ecom-studio .ecom-field input { color: #26211a; background: #fff; }
.ecom-studio-header > div > p:last-child { color: #524b40; }
.ecom-panel h4 { color: #3d362c; }
.ecom-status { color: #3d362c; }

/* ===== v5 Higgsfield 式零门槛模板（20260914-templates-v5 追加）===== */
.remix-advanced { border: 1px solid #e5e0d5; border-radius: 12px; padding: 0; background: #faf8f4; overflow: hidden; }
.remix-advanced > summary { cursor: pointer; padding: 12px 16px; font-size: 13px; font-weight: 600; color: #6f6659; list-style: none; display: flex; align-items: center; gap: 8px; user-select: none; }
.remix-advanced > summary::-webkit-details-marker { display: none; }
.remix-advanced > summary::before { content: "▸"; transition: transform .18s ease; font-size: 11px; }
.remix-advanced[open] > summary::before { transform: rotate(90deg); }
.remix-advanced[open] > summary { border-bottom: 1px solid #e5e0d5; }
.remix-advanced-body { padding: 12px 16px 16px; display: grid; gap: 8px; }
.remix-advanced-body > span { font-size: 12px; color: #8a8175; font-weight: 600; }
.remix-advanced-body textarea { width: 100%; }
.remix-generate-xl { padding: 14px 28px; font-size: 15px; width: 100%; justify-content: center; }
.remix-cost-hint { text-align: center; }
.remix-cast-field .remix-option,
.remix-product-field .remix-option { font-size: 13px; }
.remix-cast-preview { border-radius: 10px; }

@media (max-width: 720px) {
  .remix-advanced-body { padding: 10px 12px 12px; }
  .remix-generate-xl { padding: 13px 20px; }
}

/* ===== v6 Higgsfield 式上传槽（20260914-templates-v6 追加）===== */
.remix-slot { position: relative; display: flex; align-items: center; justify-content: center; min-height: 148px; border: 1.5px dashed #cfc6b8; border-radius: 14px; background: #faf8f4; cursor: pointer; transition: border-color .15s ease, background .15s ease; overflow: hidden; }
.remix-slot:hover { border-color: #9a8f7e; background: #f3efe7; }
.remix-slot.is-filled { border-style: solid; border-color: #e5e0d5; background: #fff; cursor: default; }
.remix-slot-empty { display: grid; gap: 6px; justify-items: center; padding: 24px 16px; text-align: center; }
.remix-slot-empty strong { font-size: 14px; color: #5c5449; }
.remix-slot-empty small { font-size: 12px; color: #9a9184; }
.remix-slot-empty::before { content: "⬆"; font-size: 20px; color: #b3a894; line-height: 1; }
.remix-slot-preview { width: 100%; max-height: 220px; object-fit: contain; display: block; }
.remix-slot-clear { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border-radius: 50%; border: none; background: rgba(28, 25, 23, .55); color: #fff; font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.remix-slot-clear:hover { background: rgba(28, 25, 23, .8); }
.remix-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.remix-chip { font-size: 12px; padding: 4px 10px; border-radius: 999px; }

@media (max-width: 720px) {
  .remix-slot { min-height: 120px; }
  .remix-slot-preview { max-height: 180px; }
}

/* P5 (2026-09-15): 创作模板编辑器 - 分镜节拍 + 版本历史 */
.template-beats-editor, .template-versions { border: 1px solid rgba(15,23,42,.12); border-radius: 14px; padding: 16px 18px; margin: 14px 0; background: rgba(15,23,42,.03); }
.template-beats-editor summary, .template-versions summary { cursor: pointer; font-weight: 700; font-size: 14px; margin-bottom: 8px; }
.template-beats-hint { font-size: 12px; opacity: .72; margin: 0 0 10px; }
.template-beat-row { border: 1px dashed rgba(15,23,42,.18); border-radius: 10px; padding: 10px 12px; margin: 10px 0; display: grid; gap: 8px; }
.template-beat-row legend { font-size: 12px; font-weight: 700; opacity: .8; padding: 0 6px; }
.template-beat-row textarea, .template-beat-row input { width: 100%; }
.template-versions-slot:empty { display: none; }
.tpl-version-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tpl-version-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 8px 10px; border-radius: 8px; background: rgba(15,23,42,.04); font-size: 13px; }
.tpl-version-row strong { min-width: 34px; }
.tpl-version-current { font-size: 11px; padding: 1px 8px; border-radius: 999px; background: rgba(22,163,74,.14); color: #15803d; }
.tpl-version-summary { flex: 1 1 240px; opacity: .82; }
.tpl-version-row small { opacity: .55; font-size: 12px; }

/* skill execution media cards (2026-09-16) */
.skill-media-card { margin: 12px 0; padding: 12px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 10px; background: rgba(255, 255, 255, 0.04); display: grid; gap: 8px; }
.skill-media-card video { width: 100%; max-height: 360px; border-radius: 8px; background: #000; }
.skill-media-card audio { width: 100%; }
.skill-media-card figcaption { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: rgba(255, 255, 255, 0.72); }
.skill-media-card figcaption span { font-weight: 600; color: rgba(255, 255, 255, 0.9); }
.skill-media-card figcaption a { color: #7fd0ff; text-decoration: none; margin-left: auto; }
.skill-media-card figcaption a:hover { text-decoration: underline; }

/* Atomic application directory: category-first browsing with compact cards. */
.application-catalog-toolbar { display: grid; gap: 13px; margin-top: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 18px 0 15px; }
.application-catalog-toolbar h2 { margin-top: 5px; color: var(--paper); font-size: 18px; font-weight: 600; }
.application-category-filters { display: flex; flex-wrap: wrap; gap: 7px; }
.application-category-filters button { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 999px; padding: 7px 11px; color: var(--muted); background: transparent; font: inherit; font-size: 12px; cursor: pointer; }
.application-category-filters button:hover { border-color: rgba(229,163,95,.7); color: var(--paper); }
.application-category-filters button.active { border-color: var(--amber); color: var(--ink); background: var(--amber); }
.application-category-filters button small { min-width: 17px; color: var(--muted-dark); font-size: 10px; font-variant-numeric: tabular-nums; }
.application-category-filters button.active small { color: rgba(24, 22, 19, .72); }
.application-catalog-summary { min-height: 16px; margin: 0; color: var(--muted-dark); font-size: 11px; }
.application-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 18px; }
.application-card { min-height: 214px; padding: 17px; }
.application-card header { align-items: flex-start; justify-content: space-between; }
.application-card-kicker { display: flex; align-items: center; gap: 8px; }
.application-card .app-index { font-variant-numeric: tabular-nums; }
.application-card .app-tier { padding: 3px 7px; }
.application-card .app-category-chip { border: 1px solid rgba(229,163,95,.35); border-radius: 999px; padding: 3px 8px; color: var(--amber); font-size: 10px; white-space: nowrap; }
.application-card-body { min-width: 0; }
.application-card h2 { margin-top: 17px; font-size: 18px; }
.application-card p { display: -webkit-box; overflow: hidden; margin-top: 8px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-height: 1.6; }
.application-card-contract { margin-top: 11px; }
.application-card-contract span { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }
.application-card footer { padding-top: 17px; }
.application-card footer button { white-space: nowrap; }
.application-card-open { color: var(--amber); font-weight: 700; text-decoration: none; white-space: nowrap; }
.application-card-open:hover { color: var(--white); }
@media (max-width: 1100px) { .application-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .application-catalog-toolbar { margin-top: 18px; } .application-grid { grid-template-columns: 1fr; } .application-card { min-height: 196px; } }

/* Project production hub: one projectId indexes every story, asset and media Artifact. */
.projects-page { padding-top: 24px; }
.projects-page-header { align-items: center; }
.project-hub-mount { min-height: 560px; padding-top: 22px; }
.project-hub-guest, .project-index-empty { min-height: 420px; border: 1px solid var(--line); background: radial-gradient(circle at 50% 0, rgba(229,163,95,.12), transparent 52%), var(--panel); }
.project-index { display: grid; gap: 20px; }
.project-attach-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid rgba(229,163,95,.38); border-left: 3px solid var(--amber); padding: 14px 16px; background: rgba(229,163,95,.06); }
.project-attach-banner > div { display: grid; gap: 4px; min-width: 0; }
.project-attach-banner strong { overflow: hidden; color: var(--paper); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.project-attach-banner span { color: var(--muted); font-size: 11px; }
.project-index-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--line); }
.project-index-summary > div { display: grid; gap: 6px; min-height: 96px; padding: 20px; background: var(--panel); }
.project-index-summary span { color: var(--muted); font-size: 12px; }
.project-index-summary strong { color: var(--white); font-size: 28px; font-weight: 500; }
.project-index-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.project-index-toolbar label { flex: 1 1 520px; max-width: 680px; }
.project-index-toolbar input, .project-folder-tools input { width: 100%; border: 1px solid var(--line); border-radius: 8px; outline: 0; padding: 11px 13px; color: var(--paper); background: var(--panel); }
.project-index-toolbar input:focus, .project-folder-tools input:focus { border-color: var(--amber); box-shadow: 0 0 0 3px rgba(229,163,95,.1); }
.project-index-toolbar > span { color: var(--muted); font-size: 12px; }
.project-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.project-card-grid .project-card { display: block; min-height: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; padding: 0; background: var(--panel); transition: transform .18s ease, border-color .18s ease; }
.project-card-grid .project-card:hover { border-color: rgba(229,163,95,.52); transform: translateY(-2px); }
.project-card-cover { position: relative; display: block; width: 100%; height: 210px; overflow: hidden; border: 0; padding: 0; color: inherit; background: #080a0a; text-align: left; }
.project-card-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.project-card:hover .project-card-cover img { transform: scale(1.025); }
.project-card-cover .account-project-status { position: absolute; top: 12px; right: 12px; backdrop-filter: blur(14px); }
.project-card-placeholder { display: grid; width: 100%; height: 100%; place-content: center; gap: 7px; background: radial-gradient(circle at 30% 20%, rgba(229,163,95,.18), transparent 38%), linear-gradient(145deg, #252b29, #111414); text-align: center; }
.project-card-placeholder span { color: var(--amber); font-family: Georgia, serif; font-size: 54px; }
.project-card-placeholder small { color: var(--muted); font-size: 9px; letter-spacing: .18em; }
.project-card-body { display: grid; gap: 13px; padding: 17px; }
.project-card-body > div:first-child { display: grid; gap: 6px; min-width: 0; }
.project-card-body > div:first-child strong { overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
.project-card-body > div:first-child small { color: var(--muted); font-size: 11px; }
.project-card-body > p { display: -webkit-box; min-height: 44px; overflow: hidden; color: var(--muted); font-size: 13px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.project-card-stage { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; border-left: 2px solid var(--amber); padding: 8px 10px; background: rgba(229,163,95,.055); }
.project-card-stage > div { display: grid; gap: 3px; min-width: 0; }
.project-card-stage span { color: var(--muted-dark); font-size: 9px; }
.project-card-stage strong { overflow: hidden; color: var(--paper); font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.project-card-stage > small { max-width: 120px; color: var(--amber); font-size: 9px; line-height: 1.35; text-align: right; }
.project-card-progress { display: grid; gap: 7px; }
.project-card-progress > span { height: 4px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.09); }
.project-card-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--amber), var(--coral)); }
.project-card-progress small { color: var(--muted); font-size: 10px; }
.project-card-body footer { display: flex; align-items: center; gap: 8px; padding-top: 2px; }
.project-card-body footer .primary-button, .project-card-body footer .secondary-button { min-height: 36px; padding: 0 12px; font-size: 12px; }
.project-card-body footer .primary-button { flex: 1; }

/* Site IA refresh: keep the four user goals primary and group the full catalog below. */
.secondary-nav-menu { width: min(1500px, 100%); margin: 0 auto; }
.secondary-nav-menu > summary { display: none; }
.secondary-nav-track { justify-content: flex-start; gap: 18px; }
.secondary-nav-group { display: flex; align-items: center; gap: 2px; min-width: 0; }
.secondary-nav-group + .secondary-nav-group { border-left: 1px solid var(--line); padding-left: 14px; }
.secondary-nav-group-label { padding: 0 8px; color: var(--jade); font-size: 10px; font-weight: 700; white-space: nowrap; }
.secondary-nav-item { padding-right: 9px; padding-left: 9px; }
.ip-workbench-header { padding-bottom: 22px; }
.ip-workbench-header h1 { font-size: clamp(32px, 4vw, 50px); }
.production-proof { margin-top: 18px; }
.production-proof-intro { background: linear-gradient(110deg, #171d1a 0%, #171d1a 62%, #1b2925 100%); }
.production-proof-copy h2 { max-width: 700px; }
.application-catalog-toolbar { grid-template-columns: minmax(0, 1fr) minmax(260px, .75fr); align-items: end; }
.application-search { grid-column: 2; grid-row: 1; }
.application-search input { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: var(--radius); outline: 0; padding: 0 13px; color: var(--paper); background: var(--panel); }
.application-search input:focus { border-color: var(--jade); box-shadow: 0 0 0 3px rgba(145,183,168,.12); }
.application-search input::placeholder { color: var(--muted-dark); }
.application-category-filters, .application-catalog-summary { grid-column: 1 / -1; }
.application-search-empty { grid-column: 1 / -1; min-height: 220px; }
.application-scenario-programs { display: grid; gap: 14px; margin: 22px 0 6px; }
.application-scenario-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.application-scenario-heading h2 { margin-top: 4px; color: var(--paper); font-size: 20px; font-weight: 600; }
.application-scenario-heading p:not(.eyebrow) { margin-top: 5px; color: var(--muted); font-size: 12px; }
.application-scenario-heading > span { color: var(--jade); font-size: 11px; }
.application-scenario-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.application-scenario-card { display: grid; align-content: start; gap: 13px; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 16px; background: linear-gradient(110deg, rgba(145,183,168,.07), transparent 48%), var(--panel); }
.application-scenario-card > header { display: grid; gap: 5px; }
.application-scenario-index { color: var(--jade); font-size: 10px; font-weight: 650; }
.application-scenario-card h3 { color: var(--white); font-size: 16px; font-weight: 650; }
.application-scenario-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin: 0; }
.application-scenario-card dl > div { display: grid; gap: 3px; min-width: 0; }
.application-scenario-card dt { color: var(--muted-dark); font-size: 10px; }
.application-scenario-card dd { margin: 0; color: var(--paper); font-size: 11px; line-height: 1.5; }
.application-scenario-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; counter-reset: scenario-step; }
.application-scenario-steps li { min-width: 0; border-top: 1px solid var(--line); padding-top: 7px; counter-increment: scenario-step; }
.application-scenario-steps li::before { content: counter(scenario-step, decimal-leading-zero); display: block; margin-bottom: 5px; color: var(--muted-dark); font-size: 9px; }
.application-scenario-steps a { color: var(--paper); font-size: 10px; line-height: 1.45; text-decoration: none; }
.application-scenario-steps a:hover { color: var(--amber); }
.application-scenario-steps li > span { color: var(--paper); font-size: 10px; line-height: 1.45; }
.application-scenario-prerequisite { margin: 0; font-size: 10px; }
.application-scenario-prerequisite a { color: var(--jade); text-decoration: none; }
.application-scenario-prerequisite a:hover { color: var(--paper); }
.application-scenario-card > button { justify-self: start; }
.application-scenario-progress { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; grid-column: 1 / -1; border-left: 2px solid var(--jade); padding: 6px 0 6px 10px; color: var(--muted); font-size: 11px; }
.application-scenario-progress strong { color: var(--paper); font-weight: 600; }
.application-scenario-progress button { min-height: 30px; margin-left: auto; border: 1px solid var(--line); border-radius: 6px; padding: 0 9px; color: var(--jade); background: transparent; font: inherit; cursor: pointer; }
.application-scenario-progress button:hover { border-color: var(--jade); color: var(--paper); }
.project-ip-context { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.project-ip-context-label { margin-right: 2px; color: var(--muted-dark); font-size: 10px; }
.project-ip-binding { display: inline-flex; align-items: center; gap: 6px; max-width: 210px; border: 1px solid var(--line); border-radius: 6px; padding: 4px 8px 4px 4px; color: var(--paper); background: rgba(255,255,255,.025); font-size: 10px; }
.project-ip-binding img, .project-ip-binding > span:first-child { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; overflow: hidden; border-radius: 4px; color: var(--ink); background: var(--jade); font-size: 12px; object-fit: cover; }
.project-ip-binding > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-ip-empty { color: var(--muted-dark); font-size: 10px; }
.project-ip-context > button { border: 0; padding: 0; color: var(--jade); background: transparent; font: inherit; font-size: 10px; cursor: pointer; }
.project-card-ip { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: -5px; }
.project-card-ip > span:first-child { color: var(--muted-dark); font-size: 10px; }
.project-card-ip .project-ip-binding { max-width: 150px; padding: 3px 6px 3px 3px; }
.project-card-ip .project-ip-binding img, .project-card-ip .project-ip-binding > span:first-child { width: 19px; height: 19px; flex-basis: 19px; font-size: 10px; }
.project-card-next { display: grid; gap: 7px; border-top: 1px solid var(--line); padding-top: 11px; }
.project-card-next > span { color: var(--jade); font-size: 11px; font-weight: 650; }
.project-card-next .primary-button { width: 100%; min-height: 38px; }
.project-card-body footer { justify-content: flex-start; }
.project-card-body footer .secondary-button { flex: 0 0 auto; }
.project-card-attach-ip { flex: 1 1 auto; min-width: 0; }
.project-card-attach-disabled { color: var(--muted-dark); font-size: 10px; }

.materials-library-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 22px; }
.materials-library-card { display: grid; align-content: start; gap: 10px; min-width: 0; min-height: 190px; border: 1px solid var(--line); border-top: 2px solid var(--jade); border-radius: 6px; padding: 18px; color: var(--paper); background: var(--panel); text-align: left; transition: border-color .18s ease, background .18s ease; }
.materials-library-card:hover, .materials-library-card:focus-visible { border-color: var(--jade); background: var(--panel-soft); }
.materials-library-card > strong { color: var(--white); font-size: 18px; font-weight: 650; }
.materials-library-card > span:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.6; }
.materials-library-card > .materials-library-action { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 5px; color: var(--amber); font-size: 12px; font-weight: 650; }
.materials-library-card:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }

@media (max-width: 820px) {
  .secondary-nav-menu { display: grid; justify-content: end; padding: 0 14px; }
  .secondary-nav-menu > summary { display: inline-flex; justify-self: end; align-items: center; gap: 7px; min-height: 34px; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 10px; color: var(--muted); font-size: 11px; list-style: none; cursor: pointer; }
  .secondary-nav-menu > summary::-webkit-details-marker { display: none; }
  .secondary-nav-menu[open] { gap: 5px; padding-bottom: 8px; }
  .secondary-nav-menu[open] .secondary-nav-track { display: grid; gap: 5px; padding: 0; }
  .secondary-nav-group { flex-wrap: wrap; }
  .secondary-nav-group + .secondary-nav-group { border-top: 1px solid var(--line); border-left: 0; padding: 4px 0 0; }
  .application-catalog-toolbar { grid-template-columns: 1fr; }
  .application-search { grid-column: 1; grid-row: auto; }
  .application-category-filters, .application-catalog-summary { grid-column: 1; }
  .materials-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .materials-library-grid { grid-template-columns: 1fr; }
  .materials-library-card { min-height: 165px; }
  .application-scenario-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .application-scenario-grid { grid-template-columns: 1fr; }
  .application-scenario-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 10px; }
  .application-scenario-progress { align-items: flex-start; flex-direction: column; }
  .application-scenario-progress button { margin-left: 0; }
}

@media (max-width: 560px) {
  .nav-item span { display: none; }
  .nav-item { padding-right: 11px; padding-left: 11px; }
  .production-proof-intro { padding: 20px 16px; }
  .project-card-body footer { flex-wrap: wrap; }
  .project-card-body footer .secondary-button { min-height: 34px; }
}
.danger-text { margin-left: auto; color: #ef8b7c; font-size: 11px; }

/* Cross-column orientation: each section exposes its job and the next handoff. */
.column-journey { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 15px; }
.column-journey span { display: inline-flex; align-items: center; min-height: 24px; border: 1px solid var(--line); border-radius: 999px; padding: 0 9px; color: var(--muted-dark); background: rgba(255,255,255,.02); font-size: 10px; letter-spacing: .01em; }
.column-journey span + span::before { content: "→"; margin-right: 7px; color: var(--muted-dark); }
.column-journey span.is-active { border-color: rgba(229,163,95,.5); color: var(--amber); background: rgba(229,163,95,.08); }
.ip-workbench-header .column-journey { margin-top: 14px; }
.account-head .column-journey { margin-top: 12px; }
.application-page-header .column-journey { margin-top: 12px; }

.ip-library-overview { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, .8fr); gap: 16px; margin-top: 20px; border: 1px solid var(--line); border-radius: 12px; padding: 20px; background: linear-gradient(112deg, rgba(145,183,168,.09), rgba(229,163,95,.04) 52%, transparent); }
.ip-library-overview-copy { display: grid; align-content: start; gap: 7px; }
.ip-library-overview-copy h2 { color: var(--paper); font-size: 21px; font-weight: 600; }
.ip-library-overview-copy p { max-width: 650px; color: var(--muted); font-size: 12px; line-height: 1.65; }
.ip-library-overview-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 7px; }
.ip-library-overview-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--line); }
.ip-library-overview-stats > div { display: grid; gap: 4px; min-height: 68px; padding: 12px; background: rgba(11,15,14,.55); }
.ip-library-overview-stats span { color: var(--muted-dark); font-size: 10px; }
.ip-library-overview-stats strong { color: var(--paper); font-size: 21px; font-weight: 550; }

.application-context-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; grid-column: 1 / -1; border-left: 2px solid var(--jade); padding: 9px 11px; color: var(--muted); background: rgba(145,183,168,.06); font-size: 11px; }
.application-context-banner strong { color: var(--paper); font-weight: 650; }
.application-context-banner button { flex: 0 0 auto; border: 0; padding: 0; color: var(--jade); background: transparent; font: inherit; cursor: pointer; }

.director-workflow-summary { display: grid; gap: 8px; margin-top: 13px; border-top: 1px solid var(--line); padding-top: 13px; }
.director-workflow-summary > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.director-workflow-summary span { color: var(--muted-dark); font-size: 10px; }
.director-workflow-summary strong { color: var(--paper); font-size: 11px; font-weight: 600; text-align: right; }

.case-card-meta, .template-library-card-meta { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; color: var(--muted-dark); font-size: 10px; }
.case-card-meta span, .template-library-card-meta span { border: 1px solid var(--line); border-radius: 999px; padding: 3px 7px; }
.case-card-actions { align-items: center; }
.case-card-actions small { color: var(--muted-dark); font-size: 10px; }
.inspiration-tile-overlay small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 760px) {
  .column-journey { gap: 5px; }
  .column-journey span { font-size: 9px; }
  .column-journey span + span::before { margin-right: 5px; }
  .ip-library-overview { grid-template-columns: 1fr; }
  .application-context-banner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 520px) {
  .column-journey { display: grid; grid-template-columns: 1fr; gap: 4px; }
  .column-journey span { justify-content: space-between; border-radius: 6px; padding: 0 8px; }
  .column-journey span + span::before { content: ""; margin: 0; }
  .ip-library-overview { padding: 16px; }
  .ip-library-overview-stats strong { font-size: 18px; }
}

.project-workspace { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 710px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #101313; box-shadow: 0 22px 70px rgba(0,0,0,.22); }
.project-sidebar { display: flex; min-width: 0; flex-direction: column; border-right: 1px solid var(--line); padding: 14px 12px; background: #151918; }
.project-back-button { align-self: flex-start; border: 0; padding: 8px 7px; color: var(--muted); background: transparent; font-size: 12px; }
.project-back-button:hover { color: var(--amber); }
.project-sidebar-title { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; margin: 10px 4px 17px; }
.project-sidebar-cover { width: 42px; height: 42px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--ink); }
.project-sidebar-cover img { width: 100%; height: 100%; object-fit: cover; }
.project-sidebar-cover .project-card-placeholder span { font-size: 20px; }
.project-sidebar-cover .project-card-placeholder small { display: none; }
.project-sidebar-title > div:last-child { display: grid; min-width: 0; gap: 4px; }
.project-sidebar-title strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.project-sidebar-title small { color: var(--muted); font-size: 10px; }
.project-sidebar-progress { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 8px; margin: 0 4px 16px; border: 1px solid var(--line); border-radius: 7px; padding: 10px; background: rgba(255,255,255,.025); }
.project-sidebar-progress > div:first-child { display: grid; gap: 3px; min-width: 0; }
.project-sidebar-progress > div:first-child span { color: var(--muted-dark); font-size: 9px; }
.project-sidebar-progress > div:first-child strong { overflow: hidden; color: var(--paper); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.project-sidebar-progress > span { align-self: end; color: var(--amber); font-size: 10px; font-weight: 650; }
.project-sidebar-progress > div:last-child { grid-column: 1 / -1; height: 3px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.09); }
.project-sidebar-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--amber), var(--coral)); }
.project-brief-link, .project-folder-nav button { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 7px; width: 100%; min-height: 43px; border: 0; border-radius: 7px; padding: 7px 8px; color: var(--muted); background: transparent; text-align: left; }
.project-brief-link:hover, .project-brief-link.active, .project-folder-nav button:hover, .project-folder-nav button.active { color: var(--paper); background: rgba(255,255,255,.07); }
.project-brief-link > span, .project-folder-nav button > span { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid var(--line); border-radius: 6px; color: var(--amber); font-size: 10px; }
.project-brief-link > div { display: grid; gap: 2px; }
.project-brief-link strong, .project-folder-nav strong { font-size: 12px; font-weight: 600; }
.project-brief-link small { color: var(--muted); font-size: 9px; }
.project-sidebar-label { display: flex; align-items: center; justify-content: space-between; margin: 18px 7px 7px; color: #737a75; font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.project-folder-nav { display: grid; gap: 2px; }
.project-folder-nav button small { min-width: 24px; border-radius: 999px; padding: 2px 6px; color: var(--muted); background: rgba(255,255,255,.06); font-size: 9px; text-align: center; }
.project-folder-nav button.active > span { border-color: var(--amber); background: rgba(229,163,95,.12); }
.project-sidebar-actions { display: grid; gap: 7px; margin-top: auto; padding: 18px 3px 2px; }
.project-sidebar-actions .secondary-button { min-height: 36px; font-size: 11px; }
.project-workspace-main { min-width: 0; padding: 0 22px 28px; }
.project-workspace-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 90px; border-bottom: 1px solid var(--line); }
.project-workspace-header > div:first-child { display: grid; gap: 4px; min-width: 0; }
.project-workspace-header span { color: var(--muted); font-size: 10px; }
.project-workspace-header h2 { overflow: hidden; font-size: 24px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.project-workspace-header-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.project-workspace-header-meta > span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 7px; color: var(--muted); font-size: 9px; }
.project-workspace-header-meta .project-workspace-status { color: var(--paper); background: rgba(255,255,255,.04); }
.project-workspace-header-meta .project-workspace-status.active, .project-workspace-header-meta .project-workspace-status.rendering { border-color: rgba(229,163,95,.45); color: var(--amber); background: rgba(229,163,95,.08); }
.project-workspace-header-meta .project-workspace-status.completed { border-color: rgba(145,183,168,.45); color: var(--jade); background: rgba(145,183,168,.08); }
.project-workspace-header > div:last-child { display: flex; gap: 8px; }
.project-workspace-header .primary-button, .project-workspace-header .secondary-button { min-height: 38px; font-size: 12px; }
.project-hub-loading { display: grid; min-height: 520px; place-content: center; justify-items: center; gap: 12px; color: var(--muted); }
.project-hub-error { margin: 18px 0 0; border: 1px solid rgba(229,163,95,.32); border-radius: 8px; padding: 10px 12px; color: #e7bf92; background: rgba(229,163,95,.08); font-size: 12px; }

.project-overview { display: grid; gap: 25px; padding-top: 22px; }
.project-overview-hero { display: grid; grid-template-columns: minmax(0, 1fr) 150px; align-items: center; gap: 28px; border: 1px solid var(--line); border-radius: 12px; padding: 25px; background: radial-gradient(circle at 85% 15%, rgba(229,163,95,.11), transparent 36%), var(--panel); }
.project-overview-hero-copy { min-width: 0; }
.project-overview-hero h2 { margin-top: 7px; font-size: 29px; font-weight: 500; }
.project-overview-hero p:not(.eyebrow) { max-width: 740px; margin-top: 11px; color: var(--muted); }
.project-overview-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.project-overview-meta span { border: 1px solid var(--line); border-radius: 999px; padding: 5px 9px; color: var(--muted); font-size: 10px; }
.project-overview-focus { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--line); }
.project-overview-focus > div { display: grid; gap: 4px; min-width: 0; padding: 11px 12px; background: rgba(255,255,255,.025); }
.project-overview-focus span { color: var(--muted-dark); font-size: 9px; }
.project-overview-focus strong { overflow: hidden; color: var(--paper); font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.project-overview-focus small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.project-progress-ring { --progress: 0; display: grid; width: 124px; height: 124px; place-content: center; justify-self: center; border-radius: 50%; background: radial-gradient(circle, var(--panel) 57%, transparent 59%), conic-gradient(var(--amber) calc(var(--progress) * 1%), rgba(255,255,255,.08) 0); text-align: center; }
.project-progress-ring strong { color: var(--white); font-size: 24px; font-weight: 500; }
.project-progress-ring span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.project-pipeline { display: grid; gap: 16px; }
.project-pipeline .section-heading { align-items: center; }
.project-pipeline .section-heading .primary-button { min-height: 38px; font-size: 12px; }
.project-pipeline-stages { display: grid; grid-template-columns: repeat(8, minmax(92px, 1fr)); gap: 8px; overflow-x: auto; padding-bottom: 3px; }
.project-pipeline-stage { position: relative; display: grid; gap: 7px; min-height: 105px; border: 1px solid var(--line); border-radius: 9px; padding: 13px 11px; color: var(--muted); background: var(--panel); text-align: left; }
.project-pipeline-stage::after { content: ""; position: absolute; top: 31px; left: calc(100% + 1px); width: 8px; border-top: 1px solid var(--line); }
.project-pipeline-stage:last-child::after { display: none; }
.project-pipeline-stage > span { color: #737a75; font-size: 9px; }
.project-pipeline-stage strong { color: var(--paper); font-size: 12px; }
.project-pipeline-stage small { font-size: 9px; }
.project-pipeline-stage.is-ready { border-color: rgba(145,183,168,.42); background: rgba(145,183,168,.07); }
.project-pipeline-stage.is-ready > span, .project-pipeline-stage.is-ready small { color: var(--jade); }
.project-pipeline-stage.is-next { border-color: var(--amber); box-shadow: 0 0 0 2px rgba(229,163,95,.1); }
.project-pipeline-stage.is-next > span, .project-pipeline-stage.is-next small { color: var(--amber); }
.project-quick-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.project-quick-actions button { display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 10px; min-height: 76px; border: 1px solid var(--line); border-radius: 9px; padding: 13px; color: var(--paper); background: var(--panel); text-align: left; }
.project-quick-actions button:hover { border-color: rgba(229,163,95,.55); }
.project-quick-actions button > span { display: grid; grid-row: 1 / 3; width: 34px; height: 34px; place-items: center; border-radius: 7px; color: var(--amber); background: rgba(229,163,95,.1); font-size: 11px; }
.project-quick-actions strong { align-self: end; font-size: 12px; }
.project-quick-actions small { color: var(--muted); font-size: 9px; }
.project-latest-assets { display: grid; gap: 16px; }
.project-folder-view { display: grid; gap: 18px; padding-top: 22px; }
.project-folder-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.project-folder-heading h2 { margin-top: 6px; font-size: 28px; font-weight: 500; }
.project-folder-heading p:last-child { margin-top: 6px; color: var(--muted); font-size: 11px; }
.project-folder-tools { display: flex; align-items: center; gap: 8px; }
.project-folder-tools label { width: min(300px, 34vw); }
.project-view-switch { display: flex; gap: 3px; }
.project-view-switch button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: transparent; }
.project-view-switch button.active { border-color: var(--amber); color: var(--ink); background: var(--amber); }
.project-asset-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.project-asset-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.project-asset-media { height: 165px; overflow: hidden; background: #080a0a; }
.project-asset-media > img, .project-asset-media > video { width: 100%; height: 100%; object-fit: cover; }
.project-asset-placeholder { display: grid; width: 100%; height: 100%; place-content: center; justify-items: center; gap: 6px; background: radial-gradient(circle at 50% 30%, rgba(229,163,95,.12), transparent 45%), #101313; }
.project-asset-placeholder span { color: var(--amber); font-family: Georgia, serif; font-size: 31px; }
.project-asset-placeholder small { color: var(--muted); font-size: 9px; }
.project-asset-audio { display: grid; width: 100%; height: 100%; place-content: center; gap: 12px; padding: 14px; }
.project-asset-audio > span { color: var(--amber); font-size: 34px; text-align: center; }
.project-asset-audio audio { width: 100%; max-width: 230px; }
.project-asset-body { display: grid; gap: 8px; padding: 12px; }
.project-asset-kicker { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--amber); font-size: 9px; text-transform: uppercase; }
.project-asset-kicker small { overflow: hidden; max-width: 90px; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.project-asset-body > strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.project-asset-body > p { display: -webkit-box; min-height: 36px; overflow: hidden; color: var(--muted); font-size: 10px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.project-asset-body footer { min-height: 29px; padding-top: 2px; }
.project-asset-body .secondary-button { min-height: 29px; padding: 0 9px; font-size: 9px; }
.project-asset-grid.is-list { grid-template-columns: 1fr; }
.project-asset-grid.is-list .project-asset-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); }
.project-asset-grid.is-list .project-asset-media { height: 112px; }
.project-asset-grid.is-list .project-asset-body { align-content: center; }

@media (max-width: 1260px) {
  .project-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-asset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .project-pipeline-stages { grid-template-columns: repeat(8, 115px); }
}
@media (max-width: 900px) {
  .project-index-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-workspace { grid-template-columns: 1fr; }
  .project-sidebar { border-right: 0; border-bottom: 1px solid var(--line); }
  .project-folder-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .project-sidebar-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; }
  .project-overview-hero { grid-template-columns: minmax(0, 1fr) 125px; }
  .project-overview-focus { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .project-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-asset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .project-card-grid { grid-template-columns: 1fr; }
  .project-index-toolbar, .project-folder-heading, .project-workspace-header { align-items: stretch; flex-direction: column; }
  .project-attach-banner { align-items: stretch; flex-direction: column; }
  .project-attach-banner .secondary-button { width: 100%; }
  .project-workspace-main { padding: 0 13px 20px; }
  .project-workspace-header { padding: 14px 0; }
  .project-workspace-header > div:last-child { display: grid; grid-template-columns: 1fr 1fr; }
  .project-folder-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-overview-hero { grid-template-columns: 1fr; }
  .project-overview-focus { grid-template-columns: 1fr; }
  .project-overview-focus > div { padding: 9px 11px; }
  .project-progress-ring { justify-self: start; }
  .project-quick-actions, .project-asset-grid { grid-template-columns: 1fr; }
  .project-folder-tools { width: 100%; }
  .project-folder-tools label { width: auto; flex: 1; }
  .project-asset-grid.is-list .project-asset-card { grid-template-columns: 112px minmax(0, 1fr); }
}

/* Cover studio: a focused composition surface that hands off to image-generate. */
.cover-contract-badge, .cover-ratio, .cover-atom-tag { display: inline-flex; align-items: center; min-height: 30px; border: 1px solid rgba(229,163,95,.42); border-radius: 999px; padding: 0 11px; color: var(--amber); background: rgba(229,163,95,.08); font-size: 10px; white-space: nowrap; }
.cover-studio-mount { padding-top: 24px; }
.cover-studio-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr); gap: 18px; align-items: start; }
.cover-studio-form, .cover-studio-preview { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.cover-studio-form { display: grid; gap: 23px; padding: clamp(18px, 3vw, 30px); }
.cover-studio-preview { position: sticky; top: 18px; display: grid; gap: 16px; padding: clamp(18px, 3vw, 28px); }
.cover-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.cover-section-heading h2 { margin-top: 6px; font-size: 24px; font-weight: 500; }
.cover-section-heading h3 { margin-top: 5px; font-size: 16px; font-weight: 500; }
.cover-section-heading > div > p:last-child { max-width: 620px; margin-top: 8px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.cover-section-heading.compact { align-items: center; }
.cover-section-heading.compact small { color: var(--muted); font-size: 10px; }
.cover-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.cover-form-grid label, .cover-prompt-label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; }
.cover-form-grid label.wide { grid-column: 1 / -1; }
.cover-form-grid input, .cover-form-grid select, .cover-form-grid textarea, .cover-prompt-label textarea { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 5px; outline: 0; padding: 10px 11px; color: var(--paper); background: var(--panel-soft); font: inherit; line-height: 1.55; }
.cover-form-grid textarea { min-height: 118px; resize: vertical; }
.cover-form-grid input:focus, .cover-form-grid select:focus, .cover-form-grid textarea:focus { border-color: var(--amber); box-shadow: 0 0 0 3px rgba(229,163,95,.1); }
.cover-style-section, .cover-reference-section { display: grid; gap: 12px; border-top: 1px solid var(--line); padding-top: 20px; }
.cover-style-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.cover-style-card { display: grid; min-width: 0; gap: 6px; border: 1px solid var(--line); border-radius: 6px; padding: 7px; color: var(--muted); background: var(--panel-soft); text-align: left; transition: border-color .16s ease, transform .16s ease; }
.cover-style-card:hover { border-color: rgba(229,163,95,.62); transform: translateY(-1px); }
.cover-style-card.active { border-color: var(--amber); box-shadow: 0 0 0 2px rgba(229,163,95,.11); color: var(--paper); }
.cover-style-card strong { overflow: hidden; color: var(--paper); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.cover-style-card small { min-height: 27px; font-size: 9px; line-height: 1.4; }
.cover-style-swatch { position: relative; display: flex; align-items: flex-end; justify-content: space-between; height: 72px; overflow: hidden; border-radius: 4px; padding: 7px; color: var(--cover-accent); background: var(--cover-swatch); }
.cover-style-swatch::before { content: ""; position: absolute; top: 10px; right: 11px; width: 28px; height: 38px; border-radius: 16px 16px 8px 8px; background: var(--cover-accent); opacity: .78; }
.cover-style-swatch::after { content: ""; position: absolute; right: 7px; bottom: 8px; left: 7px; border-top: 2px solid var(--cover-accent); opacity: .7; }
.cover-style-swatch b { position: relative; z-index: 1; font-family: Georgia, serif; font-size: 18px; font-weight: 600; }
.cover-form-help { margin: 0; color: var(--muted-dark); font-size: 10px; line-height: 1.55; }
.cover-reference-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.cover-reference-card { position: relative; display: grid; min-width: 0; gap: 5px; margin: 0; border: 1px solid var(--line); border-radius: 5px; padding: 5px; background: var(--panel-soft); }
.cover-reference-thumb { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 3px; background: #0b0d0d; }
.cover-reference-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cover-reference-card figcaption { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 5px; min-width: 0; font-size: 9px; }
.cover-reference-card figcaption strong { color: var(--amber); }
.cover-reference-card figcaption span { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.cover-reference-card figcaption small { grid-column: 1 / -1; color: var(--jade); font-size: 8px; }
.cover-reference-remove { position: absolute; top: 7px; right: 7px; display: grid; width: 21px; height: 21px; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: var(--white); background: rgba(12,15,14,.82); font-size: 14px; line-height: 1; }
.cover-reference-empty { grid-column: 1 / -1; border: 1px dashed var(--line); padding: 18px 12px; color: var(--muted-dark); font-size: 10px; text-align: center; }
.cover-upload-button { display: flex; align-items: center; justify-content: center; min-height: 38px; border: 1px dashed rgba(229,163,95,.5); border-radius: 5px; color: var(--amber); background: rgba(229,163,95,.05); cursor: pointer; font-size: 11px; }
.cover-upload-button input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.cover-preview-wrap { display: grid; place-items: center; padding: 14px; border: 1px solid var(--line); background: #0d1110; }
.cover-preview-frame { display: grid; width: min(270px, 78%); aspect-ratio: 3 / 4; padding: 12px; color: var(--cover-preview-accent); background: var(--cover-preview-bg); box-shadow: 0 18px 40px rgba(0,0,0,.24); }
.cover-preview-safe { display: grid; align-content: space-between; min-height: 100%; border: 1px dashed color-mix(in srgb, var(--cover-preview-accent) 54%, transparent); padding: 17px 14px; }
.cover-preview-safe .cover-preview-kicker { font-size: 9px; letter-spacing: .08em; opacity: .8; }
.cover-preview-safe strong { align-self: center; max-height: 3.3em; overflow: hidden; color: var(--cover-preview-accent); font-family: Georgia, serif; font-size: clamp(22px, 3vw, 32px); line-height: 1.12; overflow-wrap: anywhere; }
.cover-preview-safe small { max-height: 3em; overflow: hidden; color: var(--cover-preview-accent); font-size: 10px; line-height: 1.45; opacity: .84; }
.cover-preview-safe em { color: var(--cover-preview-accent); font-size: 9px; font-style: normal; opacity: .68; }
.cover-selected-style { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 9px; border-left: 2px solid var(--amber); padding-left: 10px; }
.cover-selected-style span { color: var(--muted); font-size: 10px; }
.cover-selected-style strong { color: var(--paper); font-size: 12px; }
.cover-selected-style small { grid-column: 2; color: var(--muted); font-size: 10px; }
.cover-prompt-label textarea { min-height: 205px; color: var(--paper); background: #101514; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; line-height: 1.65; resize: vertical; }
.cover-handoff-note { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.cover-generate-button { min-height: 44px; }
@media (max-width: 1100px) { .cover-studio-grid { grid-template-columns: 1fr; } .cover-studio-preview { position: static; } .cover-style-grid { grid-template-columns: repeat(5, minmax(94px, 1fr)); overflow-x: auto; } }
@media (max-width: 650px) { .cover-form-grid { grid-template-columns: 1fr; } .cover-form-grid label.wide { grid-column: auto; } .cover-reference-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cover-style-grid { grid-template-columns: repeat(5, 104px); } .cover-preview-frame { width: min(250px, 88%); } }

body[data-active-route="home"] .app-main { width: 100%; max-width: none; margin: 0; padding: 0; }
body[data-active-route="home"] .public-route-content { min-height: 0; }
.aidir-home { --home-ink: #121716; --home-paper: #f5f2ec; --home-muted: #c0c7c1; --home-coral: #ee866b; --home-jade: #a4d5c2; color: var(--home-paper); background: var(--home-ink); }
.aidir-home * { box-sizing: border-box; }
.aidir-home a { color: inherit; text-decoration: none; }
.aidir-home a:hover { color: var(--home-coral); }
.aidir-home button, .aidir-home textarea { font: inherit; }
.aidir-home-wrap { width: min(1320px, calc(100% - 64px)); margin: 0 auto; }
.aidir-home-hero { position: relative; display: grid; align-items: center; min-height: min(720px, calc(100svh - 150px)); overflow: hidden; isolation: isolate; padding: 56px 0 30px; background: #202823; }
.aidir-home-hero-media { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 39%; }
.aidir-home-hero-shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(8, 12, 10, .58) 0%, rgba(8, 12, 10, .34) 46%, rgba(8, 12, 10, .2) 100%); }
.aidir-home-hero-toggle { position: absolute; right: max(32px, calc((100% - 1320px) / 2)); bottom: 22px; z-index: 1; min-height: 32px; border: 1px solid rgba(245, 242, 236, .45); border-radius: 4px; padding: 0 10px; color: var(--home-paper); background: rgba(9, 14, 11, .5); font-size: 11px; cursor: pointer; }
.aidir-home-hero-toggle:hover { border-color: var(--home-jade); color: var(--home-jade); }
.aidir-home-hero-inner { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .8fr); align-items: center; gap: 54px; width: min(1320px, calc(100% - 64px)); margin: 0 auto; }
.aidir-home-copy { max-width: 700px; }
.aidir-home-kicker, .aidir-home-label { margin: 0 0 14px; color: var(--home-jade); font-size: 12px; font-weight: 700; text-transform: uppercase; }
.aidir-home-title { max-width: 720px; margin: 0; font-size: 68px; line-height: 1.08; font-weight: 700; }
.aidir-home-lede { max-width: 610px; margin: 22px 0 26px; color: #e1e4dc; font-size: 17px; line-height: 1.75; }
.aidir-home-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.aidir-home-action { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 10px; border: 1px solid rgba(245, 242, 236, .45); border-radius: 4px; padding: 0 18px; font-size: 14px; font-weight: 700; }
.aidir-home-action-primary { border-color: var(--home-coral); color: #171716 !important; background: var(--home-coral); }
.aidir-home-action-primary:hover { border-color: #ff9d82; background: #ff9d82; }
.aidir-home-action-secondary { background: rgba(15, 21, 17, .38); }
.aidir-home-composer { width: min(500px, 100%); justify-self: end; border-left: 1px solid rgba(245, 242, 236, .48); padding: 3px 0 3px 24px; }
.aidir-home-composer-head { display: grid; gap: 5px; margin-bottom: 15px; }
.aidir-home-composer-head strong { font-size: 19px; }
.aidir-home-composer-head span { color: var(--home-muted); font-size: 12px; }
.aidir-home-modes { display: inline-flex; gap: 6px; margin-bottom: 10px; border-bottom: 1px solid rgba(245, 242, 236, .36); }
.aidir-home-modes button { min-height: 38px; border: 0; border-bottom: 2px solid transparent; padding: 0 11px; color: #d4dbd3; background: transparent; cursor: pointer; }
.aidir-home-modes button[aria-pressed="true"] { border-bottom-color: var(--home-coral); color: var(--home-paper); font-weight: 700; }
.aidir-home-label { display: block; margin: 0 0 8px; color: var(--home-muted); font-size: 12px; font-weight: 500; }
.aidir-home-composer textarea { display: block; width: 100%; min-height: 108px; resize: vertical; border: 1px solid rgba(245, 242, 236, .42); border-radius: 4px; outline: 0; padding: 12px; color: var(--home-paper); background: rgba(9, 14, 11, .48); line-height: 1.6; }
.aidir-home-composer textarea:focus { border-color: var(--home-jade); box-shadow: 0 0 0 2px rgba(164, 213, 194, .24); }
.aidir-home-composer textarea::placeholder { color: #c1c9c1; opacity: .82; }
.aidir-home-composer-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; }
.aidir-home-composer-foot small { max-width: 210px; color: var(--home-muted); font-size: 11px; line-height: 1.5; }
.aidir-home-generate { min-height: 42px; flex: 0 0 auto; border: 0; border-radius: 4px; padding: 0 14px; color: #171716; background: var(--home-coral); font-weight: 700; cursor: pointer; }
.aidir-home-generate:hover { background: #ff9d82; }
.aidir-home-generate:focus-visible, .aidir-home-modes button:focus-visible, .aidir-home-action:focus-visible { outline: 2px solid var(--home-jade); outline-offset: 3px; }
.aidir-home-proofline { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 50px; border-top: 1px solid rgba(245, 242, 236, .32); padding: 16px 0 0; color: #e1e4dc; font-size: 12px; }
.aidir-home-proofline span::before { margin-right: 8px; color: var(--home-jade); content: "•"; }
.aidir-home-section { border-bottom: 1px solid rgba(245, 242, 236, .1); padding: 72px 0; }
.aidir-home-section-head { max-width: 710px; margin-bottom: 30px; }
.aidir-home-section-head h2 { margin: 0; font-size: 42px; line-height: 1.15; }
.aidir-home-section-head > p:last-child { margin: 14px 0 0; color: var(--home-muted); line-height: 1.75; }
.aidir-home-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(245, 242, 236, .2); border-bottom: 1px solid rgba(245, 242, 236, .2); }
.aidir-home-flow article { min-height: 208px; padding: 23px 24px 23px 0; }
.aidir-home-flow article + article { border-left: 1px solid rgba(245, 242, 236, .2); padding-left: 24px; }
.aidir-home-flow-number { color: var(--home-jade); font-size: 12px; }
.aidir-home-flow h3 { margin: 22px 0 9px; font-size: 23px; }
.aidir-home-flow p { max-width: 330px; margin: 0; color: var(--home-muted); font-size: 14px; line-height: 1.7; }
.aidir-home-flow a { display: inline-flex; gap: 8px; margin-top: 17px; color: var(--home-coral); font-size: 13px; font-weight: 700; }
.aidir-home-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.aidir-home-case { min-width: 0; overflow: hidden; border: 1px solid rgba(245, 242, 236, .18); border-radius: 4px; background: #19201d; }
.aidir-home-case-media { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #263129; }
.aidir-home-case video.aidir-home-case-media { object-fit: contain; background: #0c120f; }
.aidir-home-case-copy { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 15px; }
.aidir-home-case-copy h3 { margin: 0 0 6px; font-size: 17px; }
.aidir-home-case-copy p { margin: 0; color: var(--home-muted); font-size: 12px; line-height: 1.55; }
.aidir-home-case-copy > span { flex: 0 0 auto; color: var(--home-jade); font-size: 10px; }
.aidir-home-case-cta { display: inline-flex; gap: 8px; margin-top: 13px; color: var(--home-coral) !important; font-size: 12px; font-weight: 700; }
.aidir-home-case-cta:focus-visible { outline: 2px solid var(--home-jade); outline-offset: 3px; }
.aidir-home-capabilities { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(245, 242, 236, .2); border-left: 1px solid rgba(245, 242, 236, .2); }
.aidir-home-capabilities a { display: flex; min-height: 108px; flex-direction: column; justify-content: space-between; border-right: 1px solid rgba(245, 242, 236, .2); border-bottom: 1px solid rgba(245, 242, 236, .2); padding: 15px; }
.aidir-home-capabilities a:hover { color: var(--home-paper); background: #1b2521; }
.aidir-home-capabilities a span:first-child { color: var(--home-jade); font-size: 11px; }
.aidir-home-capabilities a strong { font-size: 15px; }
.aidir-home-close { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid rgba(245, 242, 236, .24); border-bottom: 1px solid rgba(245, 242, 236, .24); padding: 24px 0; }
.aidir-home-close h2 { margin: 0; font-size: 32px; }
.aidir-home-close p { margin: 8px 0 0; color: var(--home-muted); }
@media (prefers-reduced-motion: reduce) {
  .aidir-home-hero-media { display: none; }
  .aidir-home-hero { background: #202823 url("/assets/template-library/home-hero-ip-key-visual.jpg") center / cover no-repeat; }
  .aidir-home-hero-toggle { display: none; }
}
@media (max-width: 850px) {
  .background-tasks-button > span:not(.background-tasks-glyph) { display: none; }
  .background-tasks-panel { top: 70px; right: 14px; }
  .aidir-home-hero { min-height: calc(100svh - 195px); padding-top: 44px; }
  .aidir-home-hero-inner { grid-template-columns: 1fr; gap: 28px; }
  .aidir-home-composer { width: min(620px, 100%); justify-self: start; }
  .aidir-home-title { font-size: 56px; }
  .aidir-home-capabilities { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aidir-home-cases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  body[data-active-route="home"] .app-main { padding-bottom: 0; }
  .aidir-home-wrap, .aidir-home-hero-inner { width: calc(100% - 32px); }
  .aidir-home-hero { min-height: 0; padding: 52px 0 18px; }
  .aidir-home-hero-inner { gap: 25px; }
  .aidir-home-title { font-size: 40px; }
  .aidir-home-lede { margin: 14px 0 18px; font-size: 14px; line-height: 1.6; }
  .aidir-home-action { min-height: 42px; padding: 0 12px; font-size: 12px; }
  .aidir-home-hero-toggle { right: 16px; bottom: 12px; }
  .aidir-home-composer { border-top: 1px solid rgba(245, 242, 236, .4); border-left: 0; padding: 16px 0 0; }
  .aidir-home-composer-head { margin-bottom: 8px; }
  .aidir-home-composer-head strong { font-size: 16px; }
  .aidir-home-composer textarea { min-height: 82px; }
  .aidir-home-composer-foot { align-items: stretch; flex-direction: column; gap: 8px; }
  .aidir-home-composer-foot small { max-width: none; }
  .aidir-home-generate { width: 100%; }
  .aidir-home-proofline { display: none; }
  .aidir-home-section { padding: 48px 0; }
  .aidir-home-section-head h2 { font-size: 29px; }
  .aidir-home-flow, .aidir-home-cases { grid-template-columns: 1fr; }
  .aidir-home-flow article { min-height: auto; border-bottom: 1px solid rgba(245, 242, 236, .2); padding: 18px 0; }
  .aidir-home-flow article + article { border-left: 0; padding-left: 0; }
  .aidir-home-flow article:last-child { border-bottom: 0; }
  .aidir-home-flow h3 { margin-top: 12px; }
  .aidir-home-case-copy { flex-direction: column; }
  .aidir-home-close { align-items: stretch; flex-direction: column; gap: 16px; }
  .aidir-home-close h2 { font-size: 25px; }
}
.media-visual-review { display: grid; gap: 16px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border, #343942); }
.media-review-compare { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: start; gap: 16px; }
.media-review-compare > div { min-width: 0; }
.media-review-reference-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.media-review-reference-grid figure, .media-review-generated { margin: 0; min-width: 0; }
.media-review-reference-grid img, .media-review-generated img, .media-review-generated video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: #080a0e; border-radius: 6px; }
.media-review-generated { margin-top: 10px; }
.media-review-generated figcaption, .media-review-reference-grid figcaption { padding-top: 6px; font-size: 13px; }
.media-review-actions { display: grid; gap: 12px; min-width: 0; }
.media-review-actions textarea { width: 100%; box-sizing: border-box; }
.media-review-actions > div { display: flex; flex-wrap: wrap; gap: 10px; }
.media-review-actions .application-check { display: flex; align-items: flex-start; gap: 8px; line-height: 1.5; }
.media-review-actions .application-check input { flex: 0 0 auto; margin-top: 4px; }
@media (max-width: 760px) { .media-review-compare { grid-template-columns: minmax(0, 1fr); } .media-review-actions > div > button { flex: 1 1 auto; white-space: normal; } }
/* Final delivery review keeps the rendered film beside its project references. */
.director-final-review { display: grid; gap: 18px; }
.final-review-compare { display: grid; grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr); align-items: start; gap: 20px; }
.final-review-film { margin: 0; min-width: 0; }
.final-review-film video { display: block; width: 100%; max-height: 65vh; background: #080a0e; border-radius: 12px; }
.final-review-film figcaption { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 10px; }
.final-review-compare aside { display: grid; gap: 12px; min-width: 0; }
.final-review-checklist { display: grid; gap: 12px; margin: 0; padding: 16px; border: 1px solid var(--border, #343942); border-radius: 12px; }
.final-review-checklist legend { padding: 0 6px; font-weight: 600; }
.final-review-checklist textarea { width: 100%; box-sizing: border-box; }
.final-review-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 760px) { .final-review-compare { grid-template-columns: minmax(0, 1fr); } .final-review-compare aside .media-review-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Series is a production index, so the hierarchy stays dense and scannable. */
.private-ip-filters { display: grid; grid-template-columns: 2fr repeat(4, minmax(120px, 1fr)) auto; align-items: end; gap: 12px; padding: 16px; margin-bottom: 20px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.private-ip-filters label { display: grid; gap: 6px; font-size: 12px; color: var(--muted); }
.private-ip-filters input, .private-ip-filters select { box-sizing: border-box; min-width: 0; width: 100%; }
.private-ip-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin: 16px 0; color: var(--muted); font-size: 13px; }
.ip-taxonomy-editor { padding: 16px; margin: 18px 0; border: 1px solid var(--line); border-radius: 10px; }
.ip-taxonomy-editor legend { padding: 0 8px; }
@media (max-width: 1000px) { .private-ip-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .private-ip-filters { grid-template-columns: minmax(0, 1fr); } .private-ip-pagination { flex-wrap: wrap; } }
.series-project-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 16px; margin: 0 0 16px; border: 1px solid var(--border, #343942); border-radius: 10px; color: var(--muted, #a5acae); font-size: 13px; }
.series-project-breadcrumb a { color: var(--accent, #d8a85d); text-decoration: none; }
.series-project-breadcrumb a:hover { text-decoration: underline; }
.series-project-breadcrumb [aria-current="page"] { color: var(--text, #f3f4f5); }
.series-project-return { margin-left: auto; }
.series-context-error { padding: 10px 16px; margin-bottom: 12px; color: var(--muted, #a5acae); }
@media (max-width: 760px) { .series-project-return { margin-left: 0; flex-basis: 100%; } }
.series-page { padding-top: 24px; }
.series-page-header { align-items: center; }
.series-create-panel { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 24px; padding: 24px; margin: 18px 0 30px; border: 1px solid var(--border, #343942); border-radius: 12px; background: var(--surface, #171b1c); }
.series-create-panel h2 { margin: 4px 0 8px; }
.series-create-panel p { color: var(--muted, #a5acae); }
.series-create-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.series-create-form label { display: grid; gap: 6px; font-size: 13px; color: var(--muted, #a5acae); }
.series-create-form label.wide, .series-create-form .series-create-status { grid-column: 1 / -1; }
.series-create-form input, .series-create-form textarea { width: 100%; box-sizing: border-box; }
.series-create-status { min-height: 20px; margin: 0; }
.series-list-mount { display: grid; gap: 16px; }
.series-add-panel { padding: 14px 20px; border-top: 1px solid var(--border, #343942); }
.series-season .series-add-panel { padding: 14px 0 0; margin-top: 12px; }
.series-add-panel summary { cursor: pointer; color: var(--accent, #d8a85d); font-size: 14px; }
.series-add-panel form { margin-top: 14px; }
.series-card { border: 1px solid var(--border, #343942); border-radius: 12px; overflow: hidden; background: var(--surface, #171b1c); }
.series-card-head { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; padding: 18px 20px; border-bottom: 1px solid var(--border, #343942); }
.series-card-head h2 { margin: 2px 0 4px; }
.series-card-head p { margin: 0; color: var(--muted, #a5acae); }
.series-production-board { padding: 16px 20px 18px; border-bottom: 1px solid color-mix(in srgb, var(--border, #343942) 80%, transparent); background: color-mix(in srgb, var(--surface, #171b1c) 92%, #fff 2%); }
.series-production-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.series-production-head h3 { margin: 2px 0 4px; font-size: 16px; }
.series-production-head p { margin: 0; color: var(--muted, #a5acae); line-height: 1.5; }
.series-production-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.series-production-metrics > div { display: grid; gap: 3px; min-width: 0; padding: 10px 12px; border-left: 2px solid var(--border, #343942); }
.series-production-metrics small, .series-production-metrics span, .series-production-episode small, .series-production-task-details small { color: var(--muted, #a5acae); }
.series-production-metrics strong { font-size: 17px; overflow-wrap: anywhere; }
.series-production-impact { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0 0 14px; padding: 10px 12px; border-left: 2px solid var(--accent, #d8a85d); background: color-mix(in srgb, var(--accent, #d8a85d) 6%, transparent); color: var(--muted, #c4c9ca); }
.series-production-impact > div { display: grid; gap: 2px; min-width: 220px; }
.series-production-impact strong { color: var(--text, #f3f4f5); }
.series-production-impact details { margin-left: auto; }
.series-production-impact summary { cursor: pointer; color: var(--accent, #d8a85d); }
.series-production-impact ul { margin: 8px 0 0; padding-left: 18px; }
.series-production-impact.is-error { border-left-color: #ef9b93; color: #ef9b93; }
.series-production-episodes { display: grid; gap: 6px; }
.series-production-episode { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-top: 1px solid color-mix(in srgb, var(--border, #343942) 75%, transparent); }
.series-production-episode > div:first-child { min-width: 0; }
.series-production-episode strong, .series-production-episode small { display: block; overflow-wrap: anywhere; }
.series-production-episode small { margin-top: 3px; line-height: 1.45; }
.series-production-episode-meta { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.series-production-task-details { margin-top: 12px; border-top: 1px solid color-mix(in srgb, var(--border, #343942) 75%, transparent); padding-top: 10px; }
.series-production-task-details summary { cursor: pointer; color: var(--muted, #c4c9ca); }
.series-production-task-details ul { display: grid; gap: 6px; padding: 10px 0 0; margin: 0; list-style: none; }
.series-production-task-details li { display: grid; grid-template-columns: max-content max-content minmax(0, 1fr); gap: 8px; align-items: center; }
.series-production-task-details li small { overflow-wrap: anywhere; }
@media (max-width: 760px) { .series-production-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .series-production-episode { align-items: flex-start; flex-direction: column; } .series-production-episode-meta { justify-content: flex-start; } .series-production-task-details li { grid-template-columns: max-content minmax(0, 1fr); } .series-production-task-details li small { grid-column: 1 / -1; } }
.series-season { padding: 16px 20px 18px; border-bottom: 1px solid color-mix(in srgb, var(--border, #343942) 70%, transparent); }
.series-season:last-child { border-bottom: 0; }
.series-season-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.series-season-head strong { font-size: 15px; }
.series-episode-list { display: grid; gap: 8px; }
.series-episode { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--border, #343942); border-radius: 8px; background: color-mix(in srgb, var(--surface, #171b1c) 80%, #fff 3%); }
.series-episode-index { color: var(--accent, #d8a85d); font-variant-numeric: tabular-nums; }
.series-episode small, .series-empty { color: var(--muted, #a5acae); }
.series-episode > div > strong, .series-episode > div > small { display: block; overflow-wrap: anywhere; }
.series-episode > div > small { margin-top: 4px; line-height: 1.5; }
.series-episode-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
@media (max-width: 760px) { .series-create-panel { grid-template-columns: minmax(0, 1fr); padding: 18px; } .series-create-form { grid-template-columns: minmax(0, 1fr); } .series-create-form label.wide, .series-create-form .series-create-status { grid-column: auto; } .series-episode { grid-template-columns: 1fr; } .series-episode-actions { justify-content: flex-start; } }

.series-source-panel { margin: 24px 0 32px; padding: 24px; border: 1px solid var(--border, #343942); border-radius: 12px; background: var(--surface, #171b1c); }
.series-source-heading, .series-source-bible-heading, .series-source-document > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.series-source-heading h2, .series-source-document h3, .series-source-bible-heading h3 { margin: 4px 0 8px; }
.series-source-heading p, .series-source-document p, .series-source-bible-heading p, .series-source-import small { color: var(--muted, #a5acae); line-height: 1.65; }
.series-source-heading > div { max-width: 760px; }
.series-source-heading label, .series-source-import label, .series-source-document-actions label, .series-source-search-form label, .series-source-bible-heading label, .series-source-bible-item label, .series-source-bible-summary:has(textarea) { display: grid; gap: 8px; color: var(--muted, #a5acae); font-size: 13px; }
.series-source-heading select { min-width: 200px; max-width: 300px; }
.series-source-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 14px; }
.series-source-tabs button { padding: 10px 16px; border: 1px solid var(--border, #343942); border-radius: 8px; background: transparent; color: var(--muted, #a5acae); cursor: pointer; }
.series-source-tabs button[aria-pressed="true"] { border-color: var(--accent, #d8a85d); color: var(--accent, #d8a85d); background: color-mix(in srgb, var(--accent, #d8a85d) 8%, transparent); }
.series-source-notice { min-height: 24px; padding: 12px 14px; margin-bottom: 16px; border-left: 2px solid var(--accent, #d8a85d); color: var(--muted, #a5acae); line-height: 1.6; background: color-mix(in srgb, var(--surface, #171b1c) 90%, #fff 3%); overflow-wrap: anywhere; }
.series-source-import { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.series-source-import .wide, .series-source-import-status { grid-column: 1 / -1; }
.series-source-import input, .series-source-import textarea, .series-source-bible-item textarea, .series-source-bible-summary textarea { box-sizing: border-box; width: 100%; }
.series-source-import-status { min-height: 18px; margin: 0; color: var(--muted, #a5acae); }
.series-source-document-list { display: grid; gap: 16px; margin-top: 20px; }
.series-source-document { padding: 18px; border: 1px solid var(--border, #343942); border-radius: 10px; }
.series-source-document-actions, .series-source-bible-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.series-source-document-actions small, .series-source-bible-actions small, .series-card-source small { color: var(--muted, #a5acae); }
.series-source-progress { display: grid; gap: 8px; padding: 14px 0; }
.series-source-progress progress { width: 100%; height: 8px; accent-color: var(--accent, #d8a85d); }
.series-source-progress small, .series-source-progress > span { color: var(--muted, #a5acae); font-size: 13px; }
.series-source-progress .is-error { color: #ef9b93; margin: 0; overflow-wrap: anywhere; }
.series-source-bible-summary { margin: 20px 0; color: var(--text, #f3f4f5); line-height: 1.7; white-space: pre-wrap; }
.series-source-bible-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.series-source-bible-grid > section { min-width: 0; padding: 16px; border: 1px solid var(--border, #343942); border-radius: 10px; }
.series-source-bible-grid > section > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.series-source-bible-grid h4 { margin: 0 0 12px; font-size: 15px; }
.series-source-bible-item { padding: 14px 0; border-top: 1px solid var(--border, #343942); overflow-wrap: anywhere; }
.series-source-bible-item p { white-space: pre-wrap; line-height: 1.7; }
.series-source-bible-item label { margin-bottom: 12px; }
.series-source-bible-item small { display: block; margin-top: 6px; color: var(--muted, #a5acae); }
.series-source-provenance { margin-bottom: 8px; }
.series-source-evidence { display: block; width: fit-content; max-width: 100%; margin: 8px 0; padding: 8px 10px; text-align: left; color: var(--accent, #d8a85d); background: color-mix(in srgb, var(--accent, #d8a85d) 5%, transparent); border: 1px solid var(--border, #343942); border-radius: 6px; cursor: pointer; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.series-source-search-form { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 14px; }
.series-source-search-hit { padding: 16px 0; border-bottom: 1px solid var(--border, #343942); overflow-wrap: anywhere; }
.series-source-search-hit p { white-space: pre-wrap; line-height: 1.7; color: var(--muted, #a5acae); }
.series-card-source { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--border, #343942); }
.series-source-reader { width: min(1000px, calc(100vw - 32px)); height: min(820px, calc(100dvh - 32px)); padding: 22px; box-sizing: border-box; border: 1px solid var(--border, #343942); border-radius: 12px; background: var(--surface, #171b1c); color: var(--text, #f3f4f5); }
.series-source-reader::backdrop { background: rgba(0, 0, 0, .75); }
.series-source-reader > header { display: flex; justify-content: space-between; gap: 20px; }
.series-source-reader h2 { margin: 6px 0; }
.series-source-reader label { display: flex; align-items: center; gap: 14px; margin: 16px 0; font-size: 13px; }
.series-source-reader select { flex: 1; min-width: 0; }
.series-source-reader textarea { width: 100%; height: calc(100% - 210px); min-height: 140px; box-sizing: border-box; padding: 14px; resize: none; line-height: 24px; white-space: pre; overflow: auto; color: var(--text, #f3f4f5); }
.series-source-reader > p { font-size: 12px; color: var(--muted, #a5acae); }
@media (max-width: 760px) { .series-source-panel { padding: 18px; } .series-source-heading, .series-source-bible-heading, .series-source-document > header { flex-direction: column; gap: 12px; } .series-source-heading label { width: 100%; } .series-source-heading select { max-width: 100%; } .series-source-import, .series-source-bible-grid, .series-source-search-form { grid-template-columns: minmax(0, 1fr); } .series-source-import .wide, .series-source-import-status { grid-column: auto; } .series-source-document-actions { align-items: stretch; flex-direction: column; } .series-source-tabs button { flex: 1; padding-inline: 10px; } .series-source-reader { padding: 16px; } }

.series-create-form input, .series-create-form textarea, .series-create-form select, .series-source-panel input:not([type=file]), .series-source-panel textarea, .series-source-panel select, .series-source-reader textarea, .series-source-reader select { min-width: 0; border: 1px solid var(--line); border-radius: 7px; padding: 10px 12px; color: var(--paper); background: #111514; outline: 0; line-height: 1.65; }
.series-create-form input:focus, .series-create-form textarea:focus, .series-create-form select:focus, .series-source-panel input:focus, .series-source-panel textarea:focus, .series-source-panel select:focus, .series-source-reader select:focus { border-color: var(--amber); box-shadow: 0 0 0 2px rgba(229, 163, 95, .12); }
.series-source-panel input[type=file] { max-width: 100%; padding: 8px 0; }
.series-source-panel textarea { resize: vertical; }
.series-source-reader textarea { resize: none; }

/* Series reading, identity variants and reusable production sets. */
.series-source-joint { border: 1px solid var(--line); border-radius: 12px; padding: 18px; background: #141918; }
.series-source-joint > header, .ip-asset-sets > header, .ip-set-detail > header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.series-source-joint h3, .ip-asset-sets h2 { margin: 0 0 8px; }
.series-source-joint p, .ip-asset-sets p, .ip-impact-note { color: var(--muted); line-height: 1.7; }
.series-source-volume-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.series-source-volume-options > label { display: flex; align-items: flex-start; gap: 10px; border: 1px solid var(--line); padding: 12px; border-radius: 7px; }
.series-source-panel .series-source-volume-options input[type=checkbox], .ip-set-replace input[type=checkbox] { flex: 0 0 auto; width: 17px; height: 17px; margin: 3px 0 0; padding: 0; accent-color: var(--amber); }
.series-source-volume-options span { min-width: 0; overflow-wrap: anywhere; }
.series-source-volume-options small { display: block; margin-top: 4px; color: var(--muted); }
.series-source-search-filters { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.series-source-search-hit > small { display: block; color: var(--amber); margin-bottom: 8px; }
.series-volume-coverage { display: grid; gap: 8px; list-style: none; padding: 0; }
.series-volume-coverage li { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 13px; }
.ip-production-section { border: 1px solid var(--line); border-radius: 12px; padding: 22px; margin: 20px 0; }
.ip-production-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px; }
.ip-production-grid > section { min-width: 0; }
.ip-production-grid h4 { margin: 18px 0 14px; }
.ip-variant-list { display: grid; gap: 12px; max-height: 560px; overflow: auto; }
.ip-variant-card { background: #151a19; border: 1px solid var(--line); border-radius: 8px; padding: 15px; overflow-wrap: anywhere; }
.ip-variant-card.is-stale { border-color: #947243; }
.ip-variant-card > header, .ip-variant-card > footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.ip-variant-card p { color: var(--muted); white-space: pre-wrap; }
.ip-variant-card header span, .ip-variant-card footer span, .ip-variant-form small, .ip-set-editor small, .ip-set-detail small, .ip-production-status { font-size: 12px; color: var(--muted); }
.ip-variant-card dl { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.ip-variant-card dl div { min-width: 0; }
.ip-variant-card dt { font-size: 11px; color: var(--muted); }
.ip-variant-card dd { margin: 3px 0 0; font-size: 13px; }
.ip-variant-stale { display: block; color: #e2b874; margin: 12px 0; line-height: 1.7; }
.ip-variant-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.ip-variant-form > button { margin-top: 16px; }
.ip-variant-form select[multiple] { min-height: 80px; }
.ip-production-section input, .ip-production-section select, .ip-production-section textarea, .ip-asset-sets input, .ip-asset-sets select, .ip-asset-sets textarea, .public-ip-facet-form input, .public-ip-facet-form select { box-sizing: border-box; min-width: 0; width: 100%; border: 1px solid var(--line); padding: 10px 12px; background: #111514; color: var(--paper); border-radius: 7px; line-height: 1.6; }
.ip-production-section input:focus, .ip-production-section select:focus, .ip-production-section textarea:focus, .ip-asset-sets input:focus, .ip-asset-sets select:focus, .public-ip-facet-form input:focus, .public-ip-facet-form select:focus { outline: 2px solid #b17943; outline-offset: 2px; }
.ip-relation-form { display: grid; gap: 12px; border-top: 1px solid var(--line); padding-top: 16px; }
.ip-relation-list, .ip-usage-list { padding: 0; list-style: none; display: grid; gap: 8px; }
.ip-relation-list li, .ip-usage-list li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; overflow-wrap: anywhere; }
.ip-usage-list li span { color: var(--muted); }
.ip-relation-graph { width: 100%; min-height: 130px; max-height: 480px; }
.ip-relation-graph rect { fill: #1b221e; stroke: #56614f; }
.ip-relation-graph line { stroke: #897951; }
.ip-relation-graph text { fill: var(--paper); font-size: 13px; }
.ip-identity-diff form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; align-items: end; }
.ip-diff-list { max-height: 400px; overflow: auto; }
.ip-diff-list dt { font-size: 12px; color: var(--muted); margin-bottom: 7px; }
.ip-diff-list dd { margin: 0 0 16px; overflow-wrap: anywhere; }
.ip-diff-list del, .ip-diff-list ins { display: block; padding: 8px; text-decoration: none; font-size: 12px; }
.ip-diff-list del { background: #402a27; color: #e5c0ba; }
.ip-diff-list ins { background: #213b2d; color: #bcdfc5; }
.ip-asset-sets { width: 100%; padding: 20px; border: 1px solid var(--line); border-radius: 12px; }
.ip-asset-sets > header > div:last-child { display: flex; gap: 10px; }
.ip-set-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ip-set-card { border: 1px solid var(--line); border-radius: 8px; padding: 16px; display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.ip-set-card > div { min-width: 0; }
.ip-set-card strong, .ip-set-card small { display: block; overflow-wrap: anywhere; }
.ip-set-card small { margin-top: 5px; color: var(--muted); }
.ip-set-card p { margin-bottom: 0; }
.ip-set-editor, .ip-set-detail { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 22px; }
.ip-set-item-list { display: grid; gap: 12px; margin: 20px 0; }
.ip-set-item { display: grid; grid-template-columns: 1fr 1fr 1.4fr 1fr auto; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; }
.ip-set-item > strong { overflow-wrap: anywhere; }
.ip-set-add { display: flex; gap: 12px; align-items: end; }
.ip-set-add label { flex: 1; }
.ip-set-editor footer { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 20px; }
.ip-set-detail form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: end; }
.ip-set-detail li { line-height: 1.85; color: var(--muted); }
.ip-set-replace, .ip-set-detail form > small { grid-column: 1 / -1; }
.ip-set-replace { display: flex; gap: 10px; align-items: start; font-size: 13px; }
.ip-set-replace input { width: 17px; }
.public-ip-facet-form { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr auto auto; align-items: end; gap: 12px; margin: 20px 0; }
.public-ip-facet-form > small { grid-column: 1 / -1; color: var(--muted); }
.ip-public-rights { display: grid; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; margin: 16px 0; }
.ip-public-rights span, .ip-public-rights p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }

/* Public assets: inspect rights and evidence before reuse. */
.public-market { min-width: 0; }
.public-market-header h2 { margin: 0 0 10px; font-size: 25px; }
.public-market-header p, .public-market p { color: var(--muted); line-height: 1.7; }
.public-market-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0; }
.public-market-tabs button { border: 1px solid var(--line); padding: 10px 16px; background: transparent; color: var(--muted); border-radius: 7px; }
.public-market-tabs button.active { color: var(--paper); border-color: var(--amber); background: #302319; }
.public-market-notice { min-height: 22px; }
.public-market-notice.is-error, .public-market-warning { color: #eeb08b !important; }
.public-market-success { color: #a8d8b1 !important; }
.public-market-filters { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 10px; }
.public-market label { display: grid; gap: 7px; font-size: 13px; color: var(--muted); }
.public-market input, .public-market select, .public-market textarea { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 7px; padding: 10px 12px; background: #111514; color: var(--paper); line-height: 1.5; }
.public-market input:focus, .public-market select:focus, .public-market textarea:focus { outline: 2px solid #b17943; outline-offset: 2px; }
.public-market .public-market-check { display: flex; align-items: flex-start; gap: 9px; padding: 9px 0; }
.public-market .public-market-check input { width: 17px; height: 17px; padding: 0; margin: 2px 0; flex: 0 0 auto; accent-color: var(--amber); }
.public-market-list-heading, .public-market-pagination { display: flex; justify-content: space-between; align-items: center; margin: 22px 0; gap: 12px; color: var(--muted); font-size: 13px; }
.public-market-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.public-market-card { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #151a19; }
.public-market-cover { display: flex; justify-content: center; align-items: center; padding: 0; width: 100%; aspect-ratio: 4 / 3; border: 0; background: #202824; color: var(--muted); }
.public-market-cover img { width: 100%; height: 100%; object-fit: cover; }
.public-market-card-body { padding: 18px; }
.public-market-card-body > small { color: var(--amber); }
.public-market-card-body h3 { margin: 10px 0; }
.public-market-card-body h3 button { font-size: 19px; font-weight: 600; color: var(--paper); text-align: left; }
.public-market-card-body p { min-height: 42px; font-size: 13px; }
.public-market-card-stats { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12px; color: var(--muted); }
.public-market-card footer { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.public-market-detail > header { display: flex; justify-content: space-between; margin: 8px 0 24px; color: var(--muted); }
.public-market-detail-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr); gap: 28px; }
.public-market-detail-grid > div, .public-market-detail-grid > aside { min-width: 0; }
.public-market-detail-grid > aside { padding: 22px; border: 1px solid var(--line); border-radius: 10px; background: #151a19; }
.public-market-detail-cover { width: 100%; max-height: 560px; object-fit: contain; border-radius: 10px; background: #121614; }
.public-market-detail h2 { font-size: 27px; }
.public-market-detail form { display: grid; gap: 13px; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 24px; }
.public-market-license h3, .public-market-quality h3, .public-market-examples h3 { font-size: 17px; margin: 0 0 18px; }
.public-market-license dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.public-market-license dt { font-size: 12px; color: var(--muted); }
.public-market-license dd { margin: 5px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.public-market-license p { white-space: pre-wrap; font-size: 13px; overflow-wrap: anywhere; }
.public-market-quality { padding: 22px 0; border-top: 1px solid var(--line); margin-top: 24px; }
.public-market-quality > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.public-market-quality > div > div { display: grid; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; }
.public-market-quality span, .public-market-quality small { color: var(--muted); font-size: 12px; }
.public-market-examples { margin-top: 28px; }
.public-market-examples figure { margin: 18px 0; }
.public-market-examples video { max-width: 100%; width: 100%; background: #111; border-radius: 10px; }
.public-market-examples figcaption { margin-top: 8px; font-size: 12px; color: var(--muted); }
.public-market-submit { display: grid; gap: 18px; margin: 24px 0 36px; padding: 24px; border: 1px solid var(--line); border-radius: 10px; }
.public-market-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.public-market-submission, .public-market-queue article { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.public-market-submission > div { flex: 1; min-width: 180px; }
.public-market-submission span { color: var(--amber); margin-left: 15px; font-size: 12px; }
.public-market-submission small, .public-market-queue small { display: block; margin-top: 8px; color: var(--muted); }
.public-market-revenue-list { display: grid; gap: 14px; margin-top: 24px; }
.public-market-revenue-list article { padding: 20px; border: 1px solid var(--line); border-radius: 10px; }
.public-market-revenue-list article > div { display: flex; justify-content: space-between; gap: 12px; }
.public-market-revenue-list small, .public-market-revenue-list span { font-size: 12px; color: var(--muted); }
@media (max-width: 1100px) { .public-market-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .public-market-detail-grid { grid-template-columns: minmax(0, 1fr); } .public-market-filters > label { flex: 1 1 160px; } .public-market-submit { padding: 18px; } }
@media (max-width: 480px) { .public-market-grid { grid-template-columns: minmax(0, 1fr); } .public-market-form-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 980px) { .public-ip-facet-form { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ip-set-item { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ip-production-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .series-source-volume-options, .series-source-search-filters, .ip-set-cards, .public-ip-facet-form, .ip-set-detail form, .ip-identity-diff form { grid-template-columns: minmax(0, 1fr); } .ip-production-section, .ip-asset-sets { padding: 16px; } .series-source-joint > header, .ip-asset-sets > header, .ip-set-detail > header, .ip-set-add { flex-direction: column; align-items: stretch; } .ip-set-card { flex-direction: column; } .ip-set-item { grid-template-columns: minmax(0, 1fr); } .ip-set-replace, .ip-set-detail form > small { grid-column: auto; } }
