/* TITAIB workspace bridge. Canonical palette and type live in tokens.css. */
:root,
:root[data-theme="dark"],
:root[data-theme="light"] {
  --color-bg:var(--ui-canvas);
  --color-bg-raised:var(--ui-canvas-raised);
  --color-surface:var(--ui-surface);
  --color-surface-raised:var(--ui-surface-raised);
  --color-surface-hover:var(--ui-surface-hover);
  --color-surface-deep:var(--ui-canvas-raised);
  --color-surface-deeper:var(--ui-canvas);
  --color-surface-faint:color-mix(in srgb,var(--ui-text) 2%,transparent);
  --color-surface-soft:color-mix(in srgb,var(--ui-text) 4%,transparent);
  --color-surface-subtle:color-mix(in srgb,var(--ui-text) 3%,transparent);
  --color-surface-chip:color-mix(in srgb,var(--ui-text) 6%,transparent);
  --color-highlight-soft:color-mix(in srgb,var(--ui-text) 4%,transparent);
  --color-border:var(--ui-border);
  --color-border-soft:var(--ui-border);
  --color-border-strong:var(--ui-border-strong);
  --color-text:var(--ui-text);
  --color-text-soft:var(--ui-text-soft);
  --color-text-muted:var(--ui-text-dim);
  --color-text-faint:var(--ui-text-muted);
  --color-accent:var(--ui-accent);
  --color-accent-hover:var(--ui-accent-hover);
  --color-accent-soft:var(--accent-soft);
  --color-accent-cyan:var(--ui-accent);
  --color-accent-violet:var(--ui-text-soft);
  --color-success:var(--ui-success);
  --color-warning:var(--ui-warning);
  --color-danger:var(--ui-danger);
  --radius-page:10px;
  --radius-card:8px;
  --radius-control:5px;
  --radius-chip:5px;
}

body {background:var(--bg); color:var(--ink); font-family:var(--sans)}
.wrap {width:min(1320px,calc(100% - 40px))}

/* One clear edge for navigation, with surface changes reserved for work areas. */
header {
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.brand-block {align-items:center; gap:10px}
.brand-mark {width:24px; height:24px; flex:none; color:var(--accent)}
.logo {font:750 19px/1 var(--sans); letter-spacing:-.035em; color:var(--ink)}
.logo span:empty {display:none}
.tagline {color:var(--ink-muted); font-family:var(--sans)}
.workspace-theme-toggle {border-color:var(--line); border-radius:var(--radius-sm)}
.timeframe-switcher {border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--bg-soft)}
.timeframe-btn.active {
  color:var(--accent);
  border-color:var(--line-strong);
  background:var(--panel-2);
  box-shadow:none;
}
.main-tabs {border:1px solid var(--line); border-radius:var(--radius-md); background:var(--bg-soft)}
.main-tabs .tab-btn.active,
.main-tabs .tab-btn[data-main-tab="ai"].active {
  color:var(--ink);
  background:var(--panel-2);
  box-shadow:inset 0 -1px var(--accent);
}
.section-tabs .tab-btn.active {color:var(--ink); background:var(--panel-2); box-shadow:inset 1px 0 var(--accent)}
.tab-btn.active {color:var(--ink); border-color:var(--line-strong); background:var(--panel-2); box-shadow:inset 0 -1px var(--accent)}
.strategy-composer-workspace #launchPanel > .launch-heading,
.result-metric strong {color:var(--ink-strong)}
.global-engine-row {padding:0; border:0; background:transparent}

/* Canvas, quiet controls zone, and distinct run surfaces. */
.panel,
.strategy-composer-workspace {
  border-color:var(--line);
  border-radius:var(--radius-md);
  box-shadow:none;
}
.panel {background:var(--panel)}
.strategy-library-panel {border:0; background:transparent}
.strategy-composer-workspace {background:var(--bg-soft)}
.strategy-composer-workspace,
.ai-page,
.profile-page {background-image:none}
.strategy-composer-workspace > .panel {border:0; border-radius:0; background:transparent}
.strategy-composer-workspace [data-research-panel="launch"] > #launchPanel {
  padding:var(--space-6) 0 0;
  margin:var(--space-6) 0 0;
  border:0;
  border-top:1px solid var(--line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.launch-empty {align-items:flex-start; text-align:left; padding:4px 0 var(--space-4)}
.launch-empty-actions {justify-content:flex-start}
.results-toolbar,
.section-searchbar,
.strat-bulk {
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
}
.results-section {
  padding:0 var(--space-6) var(--space-6);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.results-section :is(.job,.job-card,.favorite-result-card) {
  padding:var(--space-5);
  margin:0 0 var(--space-3);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--panel);
  box-shadow:none;
}
.results-section :is(.job,.job-card,.favorite-result-card):first-child {padding-top:var(--space-5)}
.results-section :is(.job,.job-card,.favorite-result-card):hover {
  border-color:var(--line-strong);
  background:var(--panel);
}
.result-metric-grid {border-block-color:var(--line); gap:var(--space-4)}
.result-metric span {color:var(--ink-dim); font-size:12px}
.result-metric strong {font-variant-numeric:tabular-nums}
.result-verdict-label {font-size:11px; color:var(--ink-dim)}
.result-verdict strong {font-size:19px}

#launchPanel .launch-strategy,
:root[data-theme="light"] #launchPanel .launch-strategy {
  border-color:var(--line);
  border-radius:var(--radius-md);
  background:var(--panel);
  box-shadow:none;
}
#launchPanel .launch-param-workspace > *,
:root[data-theme="light"] #launchPanel .launch-param-workspace > * {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
#launchPanel .launch-param-workspace > * + * {padding-left:var(--space-4); border-left:1px solid var(--line)}
#launchPanel .launch-mode-switch label:has(input:checked) {
  color:var(--accent);
  border-color:var(--line-strong);
  background:var(--accent-soft);
  box-shadow:none;
}
#launchPanel .launch-param,
#launchPanel .launch-single-param,
#launchPanel .param-source-item {
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
}
#launchPanel .launch-param:has(.launch-param-check:checked),
#launchPanel .launch-single-param:has(.launch-single-param-radio:checked) {
  border-color:var(--accent);
  background:var(--accent-soft);
}
#launchPanel .launch-param:hover,
#launchPanel .launch-single-param:hover {background:var(--color-surface-soft)}
#launchPanel .launch-set-favorite.is-saved:disabled {opacity:1; color:var(--ok); border-color:var(--line-strong)}
#launchPanel .launch-set-feedback:not([hidden]) {margin-top:var(--space-2)}
#launchPanel .param-source-item.is-removable .param-source-preview {padding-inline-end:0}
#launchPanel .param-source-item.is-removable .param-source-preview > summary {padding-inline-end:132px}
#launchPanel .param-source-actions {
  position:absolute;
  inset-block-start:7px;
  inset-inline-end:9px;
  display:flex;
  gap:4px;
}
#launchPanel .param-source-actions .b-mini {min-height:24px; padding:4px 6px; font-size:10px}
#launchPanel .launch-result-empty {margin:var(--space-2) 0 var(--space-3); line-height:1.45}
@media(max-width:560px) {
  #launchPanel .param-source-item.is-removable .param-source-preview > summary {padding-inline-end:0}
  #launchPanel .param-source-actions {position:static; margin-top:var(--space-2); justify-content:flex-start}
}
.launch-generation-state {
  border-color:var(--line-strong);
  background:var(--panel);
}
.launch-generation-spinner span {background:var(--accent)}
.launch-strategy-generation-error .launch-generation-state {
  border-color:var(--bad);
  background:var(--bad-bg);
}

.pset,
.runrow,
:is(#strategiesBox,#favoriteStrategiesRecentBox,#favoriteStrategiesHubBox) .strat-inline {
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
}
.badge,
.coin-mini,
.job-meta-chip,
.job-param-set-pill,
.coin-chip,
.p-chip,
.param-source-chip {border-radius:var(--radius-chip)}
.badge {font-size:11px; letter-spacing:.02em}
.b-running,.b-done {border-color:var(--line-strong); animation:none}
.b-failed {border-color:var(--bad)}
.job-error,
.v-APPROVED,
.v-BORDERLINE,
.v-REJECTED,
.v-NO_PROFITABLE_PARAMS,
.verdict.v-NO_PROFITABLE_PARAMS {border-left-width:1px}

/* Bright color belongs to action, selection and outcome; routine controls stay quiet. */
button:not(.ghost):not(.tab-btn):not(.timeframe-btn):not(:disabled) {box-shadow:none}
button:not(.ghost):not(.tab-btn):not(.timeframe-btn):hover {box-shadow:none}
.ai-launcher,
.ai-launcher:hover {
  color:var(--ink);
  border:1px solid var(--line-strong);
  border-radius:var(--radius-md);
  background:var(--panel-2);
  box-shadow:0 10px 28px #00000030;
  transform:none;
}
.ai-launcher svg {color:var(--accent)}
button {border-radius:var(--radius-control); font-family:var(--sans)}
button.ghost {color:var(--ink-soft); border-color:var(--line); background:transparent}
button.ghost:hover {color:var(--ink); border-color:var(--line-strong); background:var(--panel-2)}
button:disabled {opacity:.48}
input,textarea,select {color:var(--ink); border-color:var(--line); border-radius:var(--radius-control); background:var(--bg-soft)}
input::placeholder,textarea::placeholder {color:var(--ink-muted)}
input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-color:var(--line-strong);
  box-shadow:none;
}
input[type=checkbox],input[type=radio] {accent-color:var(--accent)}
select {background-image:none; appearance:auto}
.console-out,.ptable,code,pre {font-variant-numeric:tabular-nums}

/* Expanded Engine config shows every public field without a tiny textarea. */
.launch-engine-input,
.strategy-detail-section .engine-input,
#globalEngineJson {
  block-size:clamp(300px,36vh,360px);
  min-block-size:300px;
  font-family:var(--mono);
  font-size:13px;
  line-height:1.55;
  tab-size:2;
  resize:vertical;
}
.global-engine-editor {
  width:min(760px,calc(100vw - 32px));
  max-height:min(82vh,880px);
  overflow-y:auto;
}
.engine-config-guide {margin-block:var(--space-4) var(--space-5)}
.engine-config-guide h4 {
  margin:0 0 var(--space-2);
  color:var(--ink);
  font:650 14px/1.35 var(--sans);
}
.engine-config-guide > p {
  max-width:85ch;
  margin:0 0 var(--space-3);
  color:var(--ink-soft);
  font-size:13px;
  line-height:1.5;
}
.engine-config-guide dl {margin:0}
.engine-config-guide-row {
  display:grid;
  grid-template-columns:minmax(210px,28%) minmax(0,1fr);
  gap:var(--space-4);
  align-items:start;
  padding-block:var(--space-2);
  border-bottom:1px solid var(--line);
}
.engine-config-guide-row:first-child {border-top:1px solid var(--line)}
.engine-config-guide dt {display:flex; flex-wrap:wrap; gap:4px var(--space-2); align-items:baseline; min-width:0}
.engine-config-guide dt code {overflow-wrap:anywhere; color:var(--ink); font:600 12px/1.45 var(--mono)}
.engine-config-guide dt span {color:var(--ink-muted); font-size:11px}
.engine-config-guide dd {margin:0; color:var(--ink-soft); font-size:13px; line-height:1.45}

/* Results controls: two compact rows, with retention policy beside the tabs. */
.results-section .section-sticky-controls {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--space-2) var(--space-4);
  align-items:center;
  padding-bottom:0;
  margin-bottom:var(--space-3);
}
.results-section .results-view-switcher {
  margin:0;
  padding:0;
  border:0;
}
.results-section .retention-note {
  justify-self:end;
  margin:0;
  text-align:end;
}
.results-section .section-sticky-controls > .results-view-pane {grid-column:1 / -1; min-width:0}
.results-section .results-toolbar {
  gap:var(--space-2);
  padding:0 0 var(--space-3);
  border-bottom:1px solid var(--line);
}
.results-section :is(.results-search-field,.results-filter-field) {gap:3px}
.results-section :is(.results-search-field input,.results-filter-field select) {
  min-height:34px;
  padding:6px 10px;
  font-size:13px;
}
@media(min-width:1101px) {
  .results-section .results-toolbar:not(.results-toolbar-favorites) {
    grid-template-columns:minmax(220px,1.25fr) minmax(175px,.9fr) minmax(160px,.8fr) auto auto;
  }
  .results-section .results-toolbar-favorites {
    grid-template-columns:minmax(220px,1.25fr) minmax(175px,.9fr) auto;
  }
}
@media(max-width:1100px) and (min-width:721px) {
  .results-section .results-toolbar {grid-template-columns:repeat(2,minmax(0,1fr))}
  .results-section .results-toolbar > .results-search-field {grid-column:1 / -1}
}
@media(max-width:720px) {
  .results-section .section-sticky-controls {grid-template-columns:minmax(0,1fr); gap:6px}
  .results-section .retention-note {justify-self:start; text-align:start}
  .results-section .results-toolbar {grid-template-columns:repeat(2,minmax(0,1fr))}
  .results-section .results-toolbar > .results-search-field {grid-column:1 / -1}
}
@media(max-width:360px) {
  .results-section .results-toolbar {grid-template-columns:minmax(0,1fr)}
  .results-section .results-toolbar > .results-search-field {grid-column:auto}
}

/* Use the same compact control rhythm in strategy and favorites sections. */
.strategy-library-panel .section-sticky-controls {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--space-2) var(--space-4);
  align-items:center;
  padding-bottom:0;
  margin-bottom:var(--space-3);
}
.strategy-library-panel :is(.strategies-view-switcher,.favorites-view-switcher) {
  margin:0;
  padding:0;
  border:0;
}
.strategy-library-panel .retention-note {
  justify-self:end;
  margin:0;
  text-align:end;
}
.strategy-library-panel [data-section-pane="mine"] .section-sticky-controls > .strategies-view-pane {
  grid-column:1 / -1;
}
.strategy-library-panel .section-searchbar,
.strategy-library-panel .results-toolbar {
  gap:var(--space-2);
  padding:0 0 var(--space-3);
  border-bottom:1px solid var(--line);
}
.strategy-library-panel :is(.results-search-field,.results-filter-field) {gap:3px}
.strategy-library-panel :is(.results-search-field input,.results-filter-field select) {
  min-height:34px;
  padding:6px 10px;
  font-size:13px;
}
.strategy-library-panel [data-section-pane="favorites"] .section-sticky-controls > .favorites-view-pane {
  min-width:0;
}
.strategy-library-panel [data-section-pane="favorites"] :is(.section-searchbar,.results-toolbar) {
  padding:0;
  border:0;
}
.strategy-library-panel [data-section-pane="favorites"] .section-searchbar {
  grid-template-columns:minmax(180px,1fr) auto;
}
.strategy-library-panel [data-section-pane="favorites"] .results-toolbar-favorites {
  grid-template-columns:minmax(180px,1fr) minmax(150px,.7fr) auto;
}
.strategy-library-panel [data-section-pane="popular"] .section-sticky-controls {
  grid-template-columns:minmax(0,1fr);
}
@media(max-width:1100px) {
  .strategy-library-panel [data-section-pane="favorites"] .section-sticky-controls {
    grid-template-columns:minmax(0,1fr);
  }
  .strategy-library-panel [data-section-pane="favorites"] :is(.section-searchbar,.results-toolbar) {
    padding-bottom:var(--space-3);
    border-bottom:1px solid var(--line);
  }
}
@media(max-width:720px) {
  .strategy-library-panel .section-sticky-controls {grid-template-columns:minmax(0,1fr); gap:6px}
  .strategy-library-panel .retention-note {justify-self:start; text-align:start}
  .strategy-library-panel [data-section-pane="favorites"] .results-toolbar-favorites {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .strategy-library-panel [data-section-pane="favorites"] .results-toolbar-favorites > .results-search-field {
    grid-column:1 / -1;
  }
}
@media(max-width:360px) {
  .strategy-library-panel [data-section-pane="favorites"] .results-toolbar-favorites {
    grid-template-columns:minmax(0,1fr);
  }
  .strategy-library-panel [data-section-pane="favorites"] .results-toolbar-favorites > .results-search-field {
    grid-column:auto;
  }
}

/* Desktop density: tighten work-area rhythm without changing type scale. */
@media(min-width:901px) {
  .wrap {padding-top:24px}
  .main-tabs {margin-bottom:var(--space-4)}
  .main-tabs .tab-btn {min-height:32px; padding-inline:12px}
  .research-workspace {gap:var(--space-5)}
  .strategy-composer-workspace {
    padding:21px var(--space-6);
    margin-bottom:var(--space-5);
  }
  .strategy-composer-workspace .panel h2,
  .strategy-composer-workspace #launchPanel > .launch-heading {margin-bottom:var(--space-3)}
  .strategy-composer-workspace [data-research-panel="launch"] > #launchPanel {
    padding-top:var(--space-5);
    margin-top:var(--space-5);
  }
  #reqInput {min-height:100px}
  .new-strategy-actions {margin-top:var(--space-3)}
  .results-section {padding-bottom:var(--space-5)}
  .results-section :is(.job,.job-card,.favorite-result-card) {padding-block:18px}
  #launchPanel .launch-strategy {padding:18px var(--space-5)}
  #launchPanel .launch-strategy + .launch-strategy {
    margin-top:var(--space-4);
    padding-top:var(--space-4);
  }
  #launchPanel .launch-top {
    justify-content:flex-start;
    gap:var(--space-2) var(--space-3);
    padding-bottom:var(--space-3);
    margin-bottom:var(--space-3);
  }
  #launchPanel .launch-top > .job-key {min-width:0; overflow-wrap:anywhere}
  #launchPanel .launch-top > span:last-child {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:var(--space-2);
  }
  #launchPanel .launch-top .b-mini {min-height:30px; padding:5px 10px}
  #launchPanel .launch-mode-switch {gap:6px; margin-top:var(--space-3)}
  #launchPanel .launch-mode-switch label {min-height:30px; padding:5px 9px}
  #launchPanel .launch-param-workspace {gap:var(--space-3); margin-top:var(--space-3)}
  #launchPanel .launch-param-panel-title {margin-bottom:var(--space-2)}
  #launchPanel :is(.launch-param-list,.launch-single-param-list) {gap:4px; margin-top:6px}
  #launchPanel :is(.launch-param-list,.launch-single-param-list) > .empty {
    padding:var(--space-4);
    border-width:1px;
    font-family:var(--sans);
    text-align:left;
  }
}

@media(max-width:900px) {
  .wrap {width:min(100% - 28px,1440px)}
  .tagline {display:none}
  #launchPanel .launch-param-workspace {grid-template-columns:minmax(0,1fr)}
  #launchPanel .launch-param-workspace > * + * {
    padding:var(--space-4) 0 0;
    border-left:0;
    border-top:1px solid var(--line);
  }
}
@media(max-width:620px) {
  .wrap {width:min(100% - 20px,1440px)}
  .global-engine-editor {width:auto; max-height:calc(100dvh - 104px)}
  .engine-config-guide-row {grid-template-columns:minmax(0,1fr); gap:2px}
  .results-section {padding:0 0 var(--space-4)}
  .results-section :is(.job,.job-card,.favorite-result-card) {padding:var(--space-4)}
  .results-section :is(.job,.job-card,.favorite-result-card):first-child {padding-top:var(--space-4)}
  .ai-launcher {width:44px; min-height:44px; padding:10px; justify-content:center}
  .ai-launcher span {display:none}
}
