/* Millo UI foundations. Loaded after workspace styles; layouts remain local. */
:root {
  --ui-font:'Golos Text',Arial,sans-serif;
  --ui-accent:#ff5a2e;
  --ui-accent-ink:#20251d;
  --ui-radius-field:16px;
  --ui-radius-button:999px;
  --ui-radius-chip:999px;
  --ui-height-field:52px;
  --ui-height-button:52px;
  --ui-height-compact:44px;
  --ui-space-field:14px;
  --ui-font-field:16px;
  --ui-font-button:13px;
  --ui-font-label:12px;
  --ui-leading-control:1.4;
  --ui-focus:#bf3d16;
  --ui-danger:#a9321c;
  --ui-danger-surface:#ffe4db;
}
:is(.screen,.sheet,.intro-frame) {
  --ui-control-bg:var(--surface,#e8e9e3);
  --ui-color-scheme:light;
  --ui-control-ink:var(--ink,#171817);
  --ui-control-border:var(--line,#d7d9d2);
  --ui-selection-bg:#252b20;
  --ui-selection-ink:#f4f3ee;
  --ui-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b706b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
.screen.theme-dark {
  --ui-color-scheme:dark;
  --ui-selection-bg:var(--ui-accent);
  --ui-selection-ink:var(--ui-accent-ink);
  --ui-focus:#ff9b76;
  --ui-danger:#ffb19d;
  --ui-danger-surface:#4b2822;
  --ui-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c1c6ba' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
:is(.screen,.sheet) :is(.lab-form,.ai-assistant) { --ui-control-bg:var(--paper); }
/* Fields: identical geometry in setup, calculations, AI, filters and dialogs. */
.screen .screen-content :is(input[type=text],input[type=number],input[type=date],input[type=email],input[type=tel],input[type=password],select,textarea),
.sheet.sheet :is(input[type=text],input[type=number],input[type=date],input[type=email],input[type=tel],input[type=password],select,textarea) {
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  min-height:var(--ui-height-field);
  border:1px solid var(--ui-control-border);
  border-radius:var(--ui-radius-field);
  padding:13px var(--ui-space-field);
  background-color:var(--ui-control-bg);
  color:var(--ui-control-ink);
  font-family:var(--ui-font);
  font-size:var(--ui-font-field);
  font-weight:400;
  line-height:var(--ui-leading-control);
  box-shadow:none;
  color-scheme:var(--ui-color-scheme);
}
.screen .screen-content :is(.field,.filter-grid,.full-select,.ai-scope) :is(input,select,textarea),
.sheet.sheet :is(.field,.date-range-fields) :is(input,select,textarea) {
  display:block;
  width:100%;
  margin-top:8px;
}
.screen .screen-content :is(.field,.filter-grid>label,.full-select,.ai-scope>label),
.sheet.sheet .field {
  min-width:0;
  font-family:var(--ui-font);
  font-size:var(--ui-font-label);
  font-weight:400;
  line-height:1.45;
  color:var(--muted);
}
.screen .screen-content select:not([multiple]),.sheet.sheet select:not([multiple]) {
  padding-right:42px;
  background-image:var(--ui-chevron);
  background-position:right 14px center;
  background-size:18px;
  background-repeat:no-repeat;
  text-overflow:ellipsis;
  white-space:nowrap;
  cursor:pointer;
}
:is(.screen,.sheet) select[multiple] { background-image:none; padding-right:14px; white-space:normal; }
/* Hide browser steppers, preserving numeric input, keyboard arrows and validation. */
.screen .screen-content input[type=number],.sheet.sheet input[type=number] { -moz-appearance:textfield; appearance:textfield; }
:is(.screen,.sheet) input[type=number]::-webkit-inner-spin-button,
:is(.screen,.sheet) input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
:is(.screen,.sheet) input[type=date]::-webkit-date-and-time-value { text-align:left; min-height:1.4em; }
.screen .screen-content textarea:not([hidden]),.sheet.sheet textarea:not([hidden]) { min-height:104px; resize:vertical; }
.screen .screen-content :is(.setup-money,.auto-limit) input { padding:12px 8px; }
.screen .screen-content .search-field {
  min-height:var(--ui-height-field); padding:12px 16px; border-radius:var(--ui-radius-field);
  border:1px solid var(--ui-control-border); background:var(--ui-control-bg);
}
.screen .screen-content .search-field input {
  min-width:0; min-height:0; width:100%; padding:0; margin:0; border:0; border-radius:0;
  background:transparent; color:var(--ui-control-ink); font:400 16px/1.4 var(--ui-font);
}
:is(.screen,.sheet) :is(input,textarea)::placeholder { color:var(--muted); opacity:.8; }
:is(.screen,.sheet) input:is([type=checkbox],[type=radio]) {
  -webkit-appearance:auto; appearance:auto; accent-color:var(--ui-accent);
  width:18px; height:18px; min-width:18px; min-height:18px; padding:0; flex-shrink:0;
}
/* Buttons: orange primary, neutral secondary, transparent tertiary. */
.screen .screen-content :is(.full-button,.soft-button,.setup-cta,.auto-cta),
.sheet.sheet :is(.full-button,.soft-button,.sheet-primary),
.intro-frame .intro-next {
  min-height:var(--ui-height-button);
  height:auto;
  border:1px solid transparent;
  border-radius:var(--ui-radius-button);
  padding:14px 18px;
  font-family:var(--ui-font);
  font-size:var(--ui-font-button);
  font-weight:500;
  line-height:var(--ui-leading-control);
  white-space:normal;
  overflow-wrap:break-word;
  text-align:center;
  text-decoration:none;
  box-shadow:none;
  background:var(--ui-control-bg);
  color:var(--ui-control-ink);
}
.screen .screen-content :is(.full-button,.soft-button),
.sheet.sheet :is(.full-button,.soft-button,.sheet-primary) {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
/* Inline SVGs otherwise align to the text baseline and sit above the label. */
:is(.screen,.sheet,.intro-frame) .icon { vertical-align:middle; flex-shrink:0; }
:is(.screen,.sheet) :is(.full-button,.soft-button,.sheet-primary) > .icon { display:block; }
.screen .screen-content :is(.full-button.primary,.soft-button,.setup-cta,.auto-cta),
.sheet.sheet :is(.full-button.primary,.soft-button,.sheet-primary),
.intro-frame .intro-next {
  background:var(--ui-accent);
  color:var(--ui-accent-ink);
}
.screen .screen-content :is(.setup-cta,.auto-cta),.intro-frame .intro-next { text-align:left; }
.screen .screen-content :is(.text-button,.history-button,.setup-small,.auto-link,.ai-missing-link),
.sheet.sheet :is(.sheet-secondary,.text-button) {
  min-height:var(--ui-height-compact);
  font-family:var(--ui-font); font-size:12px; font-weight:400; line-height:1.45;
  color:var(--muted); background:transparent; border-color:transparent; white-space:normal;
}
/* Compact navigation/choices retain their own layout, using the same states. */
.screen .screen-content :is(.segmented,.lab-tabs,.ai-periods,.auto-mode,.choice-row) button,
.sheet.sheet :is(.segmented,.product-tabs,.choice-row) button,
.screen .screen-content .ai-section-switch a {
  min-height:var(--ui-height-compact); min-width:0; border-radius:var(--ui-radius-chip);
  padding:10px 12px; border:1px solid transparent;
  font-family:var(--ui-font); font-size:12px; font-weight:400; line-height:1.35;
  background:var(--ui-control-bg); color:var(--muted);
}
.screen .screen-content :is(.segmented,.lab-tabs,.ai-periods,.auto-mode,.choice-row) button:is(.active,[aria-pressed=true],[aria-selected=true]),
.sheet.sheet :is(.segmented,.product-tabs,.choice-row) button:is(.active,[aria-pressed=true],[aria-selected=true]),
.screen .screen-content .ai-section-switch a.active {
  background:var(--ui-selection-bg); color:var(--ui-selection-ink);
}
.screen .screen-content .segmented button,.sheet.sheet .product-tabs button { padding-inline:5px; }
.screen .screen-content :is(.choice-row,.auto-mode) { flex-wrap:wrap; }
/* Selects need room for both their value and the native disclosure arrow. */
.screen .screen-content .filter-grid {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
}
/* Muted grey loses contrast when a neutral card becomes orange. */
.screen .priority-card :is(.eyebrow,p,small),
.screen .hero-balance .inline-note { color:#4b2e20; }
/* One icon-button size across headers, close/back controls and drill-downs. */
:is(.screen,.sheet) :is(.icon-button,.back-button,.sheet-close,.ai-detail-link),
.intro-frame .intro-back {
  min-width:44px; width:44px; min-height:44px; height:44px;
  border-radius:50%; flex-shrink:0; display:grid; place-items:center;
}
.intro-actions { align-items:center; }
/* Shared focus, error and disabled states include native selectors and textareas. */
:is(.screen,.sheet,.intro-frame) :is(button,a,input,select,textarea,summary):focus-visible {
  outline:2px solid var(--ui-focus); outline-offset:3px;
}
:is(.screen,.sheet) :is(input,select,textarea)[aria-invalid=true],
:is(.screen,.sheet) .field:has(.field-error:not(:empty)) :is(input,select,textarea) { border-color:var(--ui-danger); }
:is(.screen,.sheet) :is(button,input,select,textarea):disabled {
  opacity:.5; cursor:not-allowed;
}
:is(.screen,.sheet) button:disabled { transform:none; filter:none; }
:is(.screen,.sheet) :is(.field-error,.ai-error) { color:var(--ui-danger); font-size:12px; line-height:1.45; }
.sheet.sheet .sheet-primary.is-destructive,.screen .screen-content .full-button.is-destructive {
  background:var(--ui-danger-surface); color:var(--ui-danger);
}
/* Reset inherited card geometry: report status is a badge, never an autopilot card. */
.auto-report-status {
  display:inline-flex; align-items:center; padding:6px 9px; border-radius:999px;
  background:#ffffff8c; font-size:10px; line-height:1.35; white-space:nowrap;
}
.auto-report-top { flex-wrap:wrap; }
@media(max-width:430px) {
  .sheet.sheet .product-heading { flex-wrap:wrap; gap:12px; }
  .sheet.sheet .product-heading > div:first-child { flex:1 0 100%; min-width:0; }
  .sheet.sheet .product-heading h2 { overflow-wrap:anywhere; }
  .sheet.sheet .product-heading .rating-badge {
    display:flex; align-items:center; gap:8px; margin:0; text-align:left;
  }
  .sheet.sheet .product-heading .rating-badge small { margin:0; font-size:11px; }
}
@media(max-width:360px) {
  .sheet.sheet .product-stats strong { font-size:22px; white-space:nowrap; }
  .screen .screen-content :is(.lab-tabs,.ai-periods,.auto-mode,.choice-row) button,
  .sheet.sheet .choice-row button { padding-inline:9px; }
  .screen .screen-content .filter-grid { grid-template-columns:minmax(0,1fr); }
}
@media(forced-colors:active) {
  .screen .screen-content select:not([multiple]),.sheet.sheet select:not([multiple]) { appearance:auto; background-image:none; }
  :is(.screen,.sheet) :is(.full-button,.sheet-primary,.soft-button) { border:1px solid ButtonText; }
}
