/* Brad's shared brand and appearance tokens for every parent screen. */
@font-face { font-family: "Instrument Sans"; src: url("./InstrumentSans-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400 600; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("./InstrumentSans-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700 900; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("./Manrope-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400 600; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("./Manrope-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700 900; font-display: swap; }

:root,
:root[data-theme] body#sam-app {
  --sam-aubergine: #2B1B2F;
  --sam-warm-white: #F7F4EE;
  --sam-periwinkle: #878EE8;
  --sam-lilac-gray: #E6E4EC;
  --sam-apricot: #F39A68;
  --sam-clinical-red: #C73E47;
  --sam-action: #5E63C7;
  --sam-action-hover: #4C51AD;
  --sam-color-canvas: var(--sam-warm-white);
  --sam-color-surface: #FFFFFF;
  --sam-color-surface-soft: #EFECF3;
  --sam-color-text: var(--sam-aubergine);
  --sam-color-text-secondary: #615568;
  --sam-color-text-subtle: #6F6375;
  --sam-color-border: #D9D3DF;
  --sam-color-border-strong: #85798E;
  --sam-color-trust: var(--sam-action);
  --sam-color-trust-strong: #474C9F;
  --sam-color-trust-soft: #E5E6FB;
  --sam-color-warm: #8A4E1D;
  --sam-color-warm-strong: #8A4E1D;
  --sam-color-warm-soft: #F8E4D2;
  --sam-color-danger: #A1222D;
  --sam-color-danger-soft: #F8DADD;
  --sam-color-focus: #5E63C7;
  --sam-color-on-trust: #FFFFFF;
  --sam-font-sans: "Manrope", sans-serif;
  --sam-font-heading: "Instrument Sans", sans-serif;
  --sam-radius-control: 12px;
  --sam-radius-card: 16px;
  --sam-radius-sheet: 24px;
  --sam-icon-stroke: 1.75;
  --sam-nav-height: 5rem;
  --sam-elevation-card: none;
  --sam-elevation-nav: none;
  --sam-elevation-sheet: 0 20px 48px rgb(43 27 47 / 15%);
  --sam-color-backdrop: rgb(43 27 47 / 55%);
  --sam-badge-source-background: #DDEEE7;
  --sam-badge-source-foreground: #1F6B52;
  --sam-badge-clinician-background: #E5E6FB;
  --sam-badge-clinician-foreground: #3F469C;
  --sam-badge-family-background: #EEEAF5;
  --sam-badge-family-foreground: #594B6A;
  --sam-badge-review-background: #F8E4D2;
  --sam-badge-review-foreground: #8A4E1D;
  --sam-badge-urgent-background: #F8DADD;
  --sam-badge-urgent-foreground: #A1222D;
  --ink: var(--sam-color-text);
  --muted: var(--sam-color-text-secondary);
  --paper: var(--sam-color-canvas);
  --card: var(--sam-color-surface);
  --line: var(--sam-color-border);
  --deep: var(--sam-action);
  --deep-2: var(--sam-action-hover);
  --mint: var(--sam-color-surface-soft);
  --warm: var(--sam-apricot);
  --danger: var(--sam-color-danger);
  --danger-soft: var(--sam-color-danger-soft);
  --green-900: var(--sam-aubergine);
  --green-850: var(--sam-action-hover);
  --green-800: var(--sam-action);
  --gold-500: var(--sam-apricot);
  --gold-400: var(--sam-apricot);
  --gold-300: var(--sam-lilac-gray);
  --gold-text: var(--sam-color-text-secondary);
  --background: var(--sam-color-canvas);
  --surface: var(--sam-color-surface);
  --surface-muted: var(--sam-color-surface-soft);
  --text-primary: var(--sam-color-text);
  --text-secondary: var(--sam-color-text-secondary);
  --text-disabled: var(--sam-color-text-subtle);
  --border-premium: var(--sam-color-border);
  background: var(--sam-color-canvas);
  color: var(--sam-color-text);
  font-family: var(--sam-font-sans);
  font-variant-numeric: tabular-nums;
}

:root[data-theme="dark"],
:root[data-theme="dark"] body#sam-app {
    --sam-color-canvas: #231727;
    --sam-color-surface: #302235;
    --sam-color-surface-soft: #3B2D41;
    --sam-color-text: #F7F4EE;
    --sam-color-text-secondary: #D0C6D7;
    --sam-color-text-subtle: #C2B7CA;
    --sam-color-border: #574660;
    --sam-color-border-strong: #AFA0BA;
    --sam-color-trust: #B4B9FF;
    --sam-color-trust-strong: #C6CAFF;
    --sam-color-trust-soft: #383351;
    --sam-color-warm: #F5B78F;
    --sam-color-warm-strong: #F7C8AA;
    --sam-color-warm-soft: #4A3028;
    --sam-color-danger: #FFC1C5;
    --sam-color-danger-soft: #4B2833;
    --sam-color-focus: #C6CAFF;
}

:root[data-theme] body#sam-app :is(button, input, textarea, select, p, small, strong, summary, label, span, li, td, th, pre, code, a, div) {
  font-family: var(--sam-font-sans);
  font-variant-numeric: tabular-nums;
}
:root[data-theme] body#sam-app :is(h1, h2, h3, h4, h5, h6),
:root[data-theme] body#sam-app :is(h1, h2, h3, h4, h5, h6) span {
  font-family: var(--sam-font-heading) !important;
  letter-spacing: -0.025em;
}
:root[data-theme] body#sam-app :is(input, textarea, select) {
  color: var(--sam-color-text);
  background: var(--sam-color-surface);
  border-color: var(--sam-color-border-strong);
  border-radius: 12px;
}
:root[data-theme] body#sam-app .records-search > label[for="search-input"] {
  display: flex;
  align-items: center;
  min-height: 2rem;
}
:root[data-theme] body#sam-app ::placeholder { color: var(--sam-color-text-secondary); opacity: 1; }
:root[data-theme] body#sam-app ::selection { color: var(--sam-aubergine); background: var(--sam-lilac-gray); }
:root[data-theme] body#sam-app :is(button, a, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--sam-color-focus);
  outline-offset: 4px;
  box-shadow: none;
}
:root[data-theme] body#sam-app #app-view { background: var(--sam-aubergine); }
:root[data-theme] body#sam-app #app-view .app-header {
  max-width: 72rem;
  min-height: 5.25rem;
  padding: 1rem 1.25rem;
  background: var(--sam-aubergine);
  border: 0;
  box-shadow: none;
}
:root[data-theme] body#sam-app #app-view .dog-mark { width: 7.7rem; height: 2.3rem; flex-basis: 7.7rem; padding: 0.25rem; }
:root[data-theme] body#sam-app #app-view img.source-chain-mark { width: 7.2rem; height: auto; display: block; }
:root[data-theme] body#sam-app #app-view .app-identity h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
:root[data-theme] body#sam-app #app-view .app-identity p { display: block; max-width: 13rem; margin: 0; color: var(--sam-warm-white); font-size: 0.75rem; line-height: 1.5; }
:root[data-theme] body#sam-app #app-view .user-avatar { color: var(--sam-aubergine); background: var(--sam-lilac-gray); border: 0; }
:root[data-theme] body#sam-app #app-view .app-brand { min-width: 0; gap: 0.6rem; }
:root[data-theme] body#sam-app #app-view .header-actions { flex-shrink: 0; }
:root[data-theme] body#sam-app #app-view .content-shell {
  min-height: calc(100svh - 12rem);
  margin-top: 6.75rem;
  padding: 0 1.25rem 2rem;
  background: var(--sam-color-canvas);
  border-radius: 24px 24px 0 0;
}
.brand-screen-heading {
  margin: -6.75rem 0 2rem;
  min-height: 6.75rem;
  padding: 0.5rem 0 1.5rem;
  color: #F7F4EE;
}
:root[data-theme] body#sam-app #app-view .brand-screen-heading h2 { margin: 0; color: #F7F4EE; font-size: clamp(2rem, 7.8vw, 2.75rem); font-weight: 700; line-height: 1.15; }
:root[data-theme] body#sam-app #app-view .brand-screen-heading p { margin: 0.4rem 0 0; color: #E6E4EC; font-size: 0.9rem; line-height: 1.5; }
:root[data-theme] body#sam-app #app-view :is(.home-authority-shell, .records-experience-shell, .ask-experience-shell) { gap: 1.5rem; }
:root[data-theme] body#sam-app #app-view .home-welcome h2 { max-width: none; font-size: 1.5rem; font-weight: 400; line-height: 1.3; }
:root[data-theme] body#sam-app #app-view .home-welcome p { margin-top: 0.65rem; }
:root[data-theme] body#sam-app #app-view :is(.records-intro, .ask-intro, .care-experience-intro) h2 { font-size: 1.5rem; font-weight: 700; }
:root[data-theme] body#sam-app #app-view :is(.records-intro, .ask-intro, .care-experience-intro) p { font-size: 0.9rem; }
:root[data-theme] body#sam-app #app-view .record-readiness { border: 1px solid var(--sam-color-border); padding: 1.25rem; }
:root[data-theme] body#sam-app #app-view .record-readiness::after { display: none; }
:root[data-theme] body#sam-app #app-view .record-readiness-action { min-width: 0; max-width: 100%; }
:root[data-theme] body#sam-app #app-view .record-readiness-action > span { min-width: 0; }
:root[data-theme] body#sam-app #app-view .record-readiness h3 { max-width: 22ch; font-size: 1.8rem; font-weight: 700; }
:root[data-theme] body#sam-app #app-view .record-readiness-mark { width: 2.5rem; height: 2.5rem; object-fit: contain; }
:root[data-theme] body#sam-app #app-view :is(.record-readiness-action, .ask-send, .records-search .primary),
:root[data-theme] body#sam-app button.primary {
  background: var(--sam-action);
  color: #FFFFFF;
  border-color: var(--sam-action);
  border-radius: 12px;
  box-shadow: none;
}
:root[data-theme] body#sam-app #app-view :is(.record-readiness-action, .ask-send, .records-search .primary):hover,
:root[data-theme] body#sam-app button.primary:hover { background: var(--sam-action-hover); }
:root[data-theme] body#sam-app #app-view .primary-tab-bar {
  inset: auto 0 0;
  max-width: none;
  min-height: 5rem;
  padding: 0.4rem max(0.3rem, calc((100vw - 40rem) / 2)) max(0.5rem, env(safe-area-inset-bottom));
  background: var(--sam-aubergine);
  border: 0;
  border-radius: 0;
}
:root[data-theme] body#sam-app #app-view .primary-tab { color: #F7F4EE; font-size: 0.68rem; min-height: 4rem; gap: 0.4rem; white-space: normal; }
:root[data-theme] body#sam-app #app-view .primary-tab svg { width: 1.5rem; height: 1.5rem; }
:root[data-theme] body#sam-app #app-view .primary-tab:is(.is-active, [aria-expanded="true"]) { color: #B4B9FF; }
:root[data-theme] body#sam-app #app-view .primary-tab:hover { background: #45334C; }
:root[data-theme] body#sam-app #app-view .primary-tab:focus-visible { outline-color: #F7F4EE; outline-offset: -2px; }
:root[data-theme] body#sam-app #app-view .primary-tab-ask { margin-top: -0.5rem; }
:root[data-theme] body#sam-app #app-view .primary-tab-ask-mark { width: 2.8rem; height: 2.8rem; border: 0; background: var(--sam-action); color: white; box-shadow: none; }
:root[data-theme] body#sam-app #app-view .primary-more-panel { inset: 5.25rem 0 calc(5rem + env(safe-area-inset-bottom)); max-width: 72rem; max-height: none; padding: 0 1.25rem 1.5rem; border: 0; border-radius: 0; box-shadow: none; background: var(--sam-color-canvas); align-content: start; }
:root[data-theme] body#sam-app #app-view .primary-more-heading { margin: 0 -1.25rem 0.5rem; min-height: 6.75rem; padding: 0.5rem 1.25rem 1.5rem; background: var(--sam-aubergine); color: var(--sam-warm-white); }
:root[data-theme] body#sam-app #app-view .primary-more-heading strong { font-family: var(--sam-font-heading); font-size: 2.5rem; font-weight: 700; }
:root[data-theme] body#sam-app #app-view .primary-more-close { color: var(--sam-warm-white); }
:root[data-theme] body#sam-app #app-view .primary-more-close:focus-visible { outline-color: var(--sam-warm-white); }
:root[data-theme] body#sam-app #app-view .primary-more-action { grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding: 1.5rem 0.25rem; }
:root[data-theme] body#sam-app #app-view .primary-more-action svg { width: 2rem; height: 2rem; }
:root[data-theme] body#sam-app #app-view .primary-more-action strong { font-size: 1.08rem; font-weight: 700; }
:root[data-theme] body#sam-app #app-view .primary-more-action small { font-size: 0.85rem; line-height: 1.5; }
:root[data-theme] body#sam-app #app-view :is(.answer-response, .ask-answer-card, .care-provider-card, .experience-record-card) { border: 1px solid var(--sam-color-border); border-radius: 16px; box-shadow: none; }
:root[data-theme] body#sam-app #app-view .answer-response { padding: 1.25rem; }
:root[data-theme] body#sam-app #app-view .answer-response .answer-state { color: var(--sam-color-text); }
:root[data-theme] body#sam-app #app-view .answer-response:is(.is-refusal, .is-failed) .answer-state { color: var(--sam-color-danger); }
:root[data-theme] body#sam-app #app-view .answer-sources { padding: 0.75rem; background: var(--sam-color-surface-soft); border-radius: 12px; }
:root[data-theme] body#sam-app #app-view .ask-source-path { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding: 1rem 0; border-block: 1px solid var(--sam-color-border); }
:root[data-theme] body#sam-app #app-view .ask-source-path::before { display: none; }
:root[data-theme] body#sam-app #app-view .ask-source-path li { display: block; }
:root[data-theme] body#sam-app #app-view .ask-source-path li > span { display: none; }
:root[data-theme] body#sam-app #app-view .ask-suggestions { flex-wrap: wrap; overflow: visible; }
:root[data-theme] body#sam-app #app-view .ask-suggestions button { flex-shrink: 1; padding: 0.55rem 0.7rem; white-space: normal; text-align: left; }
:root[data-theme] body#sam-app #app-view .ask-messages { min-height: 14rem; }
/* A single flow keeps WebKit from retaining a nested grid's pre-rotation height. */
:root[data-theme] body#sam-app #app-view .ask-experience-shell { display: flex; flex-direction: column; }
:root[data-theme] body#sam-app #app-view .app-footer { margin: 0 auto; max-width: 72rem; padding: 1.5rem 1.25rem 2rem; color: #E6E4EC; background: var(--sam-aubergine); border: 0; }

/* Exact badge pairs are available only to evidence-backed states. No label is inferred. */
.brand-badge { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.65rem; border-radius: 12px; font-size: 0.8rem; font-weight: 700; }
.brand-badge[data-trust="source-verified"] { background: var(--sam-badge-source-background); color: var(--sam-badge-source-foreground); }
.brand-badge[data-trust="clinician-confirmed"] { background: var(--sam-badge-clinician-background); color: var(--sam-badge-clinician-foreground); }
.brand-badge[data-trust="family-reported"] { background: var(--sam-badge-family-background); color: var(--sam-badge-family-foreground); }
.brand-badge[data-trust="needs-review"], :root[data-theme] body#sam-app .experience-record-certainty.needs-review { background: var(--sam-badge-review-background); color: var(--sam-badge-review-foreground); }
.brand-badge[data-trust="urgent"] { background: var(--sam-badge-urgent-background); color: var(--sam-badge-urgent-foreground); }

/* Phosphor's regular silhouettes are filled paths; the fine outline sets the
   nominal line weight to 1.75 px on the standard 24 px icon. */
:root[data-theme] body#sam-app #app-view svg[data-phosphor],
:root[data-theme] body#sam-app svg[data-phosphor] {
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 2.6667;
  stroke-linejoin: round;
}

/* A calm first visit, before the existing sign-in form. */
:root[data-theme] body#sam-app #welcome-view { min-height: 100svh; padding: 16px; align-items: center; }
.brand-welcome-card { width: min(100%, 30rem); overflow: hidden; border-radius: 24px; background: var(--sam-color-canvas); }
.brand-welcome-intro { padding: 32px 24px 28px; text-align: center; }
.brand-welcome-logo { width: 10rem; max-width: 100%; height: auto; margin: 0 auto 1.5rem; }
.brand-welcome-logo.brand-login-logo-light { display: block; }
:root[data-theme] body#sam-app .brand-welcome-card h1 { margin: 0 0 1.1rem; color: var(--sam-color-text); font-size: 2rem; font-weight: 700; line-height: 1.12; letter-spacing: -0.035em; }
.brand-welcome-card h1 span { display: block; }
:root[data-theme] body#sam-app .brand-welcome-promise { margin: 0; color: var(--sam-color-text-secondary); font-size: 0.75rem; font-weight: 700; line-height: 1.85; letter-spacing: 0.14em; }
.brand-welcome-promise span { display: block; }
.brand-welcome-photo { position: relative; aspect-ratio: 1.35; overflow: hidden; }
.brand-welcome-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.brand-welcome-actions { padding: 20px 24px 24px; background: #2B1B2F; }
:root[data-theme] body#sam-app .brand-welcome-actions button { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 14px 16px; border-radius: 16px; font-size: 1rem; }
.brand-welcome-actions button svg { width: 24px; height: 24px; flex: 0 0 24px; }
:root[data-theme] body#sam-app .brand-welcome-privacy { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 1.15rem 0 0; color: #F7F4EE; font-size: 0.8rem; line-height: 1.5; }
.brand-welcome-privacy svg { width: 28px; height: 28px; flex: 0 0 28px; }
:root[data-theme="dark"] .brand-welcome-logo.brand-login-logo-light { display: none; }
:root[data-theme="dark"] .brand-welcome-logo.brand-login-logo-dark { display: block; }

/* Feather only the photo edges; the family stays in crisp original pixels. */
.brand-welcome-photo::before, .brand-welcome-photo::after,
.brand-login-hero::before, .brand-login-hero::after {
  content: ""; position: absolute; inset-inline: 0; z-index: 1; pointer-events: none;
}
.brand-welcome-photo::before, .brand-login-hero::before {
  top: 0; height: 28%; background: linear-gradient(to bottom, var(--sam-color-canvas), transparent);
}
.brand-welcome-photo::after, .brand-login-hero::after {
  bottom: 0; height: 20%; background: linear-gradient(to top, var(--sam-color-canvas), transparent);
}
.brand-welcome-photo::after { background: linear-gradient(to top, #2B1B2F, transparent); }
@media (max-width: 360px) {
  .brand-welcome-intro { padding-inline: 20px; }
  .brand-welcome-actions { padding-inline: 20px; }
  :root[data-theme] body#sam-app .brand-welcome-card h1 { font-size: 1.75rem; }
}

/* Sign-in uses the same local assets and unchanged authentication controls. */
:root[data-theme] body#sam-app #login-view { min-height: 100svh; padding: 1rem; align-items: center; }
:root[data-theme] body#sam-app .login-card { width: min(100%, 30rem); padding: 0; overflow: hidden; background: var(--sam-color-canvas); border: 0; border-radius: 24px; box-shadow: none; }
.brand-login-masthead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; padding: 1rem 1.5rem; }
.brand-login-logo { display: block; width: 8rem; max-width: 100%; height: auto; padding: 0; margin: 0; }
:root[data-theme] body#sam-app .login-card #login-back { padding: 0.5rem; min-height: 44px; border: 0; background: transparent; font-size: 0.7rem; }
.brand-login-logo-dark { display: none; }
.brand-login-hero { position: relative; aspect-ratio: 1.9; overflow: hidden; }
.brand-login-hero img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.brand-login-content { padding: 1.25rem 1.5rem 1.5rem; }
:root[data-theme] body#sam-app .login-card h1 { color: var(--sam-color-text); font-size: 1.95rem; font-weight: 700; line-height: 1.1; margin: 0 0 0.75rem; }
:root[data-theme] body#sam-app .login-card h1 span { display: block; color: var(--sam-color-trust-strong); }
:root[data-theme] body#sam-app .login-card .brand-login-network { margin: 0 0 1.25rem; font-size: 0.8rem; line-height: 1.5; }
:root[data-theme] body#sam-app .login-card :is(p, label, .quiet) { color: var(--sam-color-text-secondary); }
:root[data-theme] body#sam-app .login-card .quiet { background: var(--sam-color-surface); border: 1px solid var(--sam-color-border-strong); border-radius: 12px; }
:root[data-theme] body#sam-app .login-card :is(button, input) { min-height: 48px; }
:root[data-theme] body#sam-app .login-card .stack { gap: 0.75rem; margin: 0; }
:root[data-theme] body#sam-app .login-card label { gap: 0.35rem; font-size: 0.85rem; }
:root[data-theme] body#sam-app .login-card input { font-size: 1rem; padding: 0.7rem 0.85rem; }
:root[data-theme] body#sam-app .login-card button { font-size: 0.9rem; padding: 0.75rem; }
:root[data-theme] body#sam-app .login-card #login-error:empty { display: none; }
:root[data-theme] body#sam-app .login-card .privacy-note { margin: 1.25rem 0 0; font-size: 0.75rem; line-height: 1.6; }
.brand-mark-dark { display: none; }
:root[data-theme="dark"] :is(.brand-login-logo-light, .brand-mark-light) { display: none; }
:root[data-theme="dark"] :is(.brand-login-logo-dark, .brand-mark-dark) { display: block; }

/* The approved QI-A frame stays aubergine in both appearances. */
@media (max-width: 360px) {
  :root[data-theme] body#sam-app #app-view .app-header { padding-inline: 1rem; }
  :root[data-theme] body#sam-app #app-view .app-identity p { font-size: 0.65rem; }
  :root[data-theme] body#sam-app #app-view .content-shell { padding-inline: 1rem; }
  :root[data-theme] body#sam-app #app-view .record-readiness { padding: 1rem; }
  .brand-login-masthead, .brand-login-content { padding-inline: 1.25rem; }
}
/* The inherited 18rem minimum otherwise consumes almost the whole tablet at 200% text. */
@media (min-width: 768px) and (max-width: 899px) {
  :root[data-theme] body#sam-app #app-view .home-authority-shell { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
}
@media (min-width: 900px) {
  :root[data-theme] body#sam-app #app-view .content-shell { padding: 0 3rem 3rem; }
  :root[data-theme] body#sam-app #app-view .home-authority-shell { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2rem; }
  :root[data-theme] body#sam-app #app-view .home-welcome { grid-column: 1 / -1; }
  :root[data-theme] body#sam-app #app-view .record-readiness { grid-row: span 2; }
  :root[data-theme] body#sam-app #app-view .provenance-thread { padding: 1.25rem 0; }
}

/* The header stays consistent in ready, active and unavailable states. */
.brand-header-logo { display: none; }
:root[data-theme] body#sam-app #app-view .dog-mark svg { display: none; }
:root[data-theme] body#sam-app #app-view .dog-mark { width: 124px; height: 40px; flex: 0 0 124px; padding: 4px; }
:root[data-theme] body#sam-app #app-view .dog-mark .brand-header-logo { position: static; display: block; width: 116px; max-width: 100%; height: auto; opacity: 1; }
:root[data-theme] body#sam-app #app-view .dog-mark .brand-mark-light { display: none; }
:root[data-theme] body#sam-app #app-view .app-brand { flex: 1 1 auto; }
:root[data-theme] body#sam-app #app-view .app-identity { min-width: 0; }
:root[data-theme] body#sam-app #app-view .app-identity p { white-space: normal; overflow-wrap: anywhere; }
:root[data-theme] body#sam-app #app-view .header-actions { width: 44px; margin-left: 8px; }
:root[data-theme] body#sam-app #app-view .profile-menu-button { width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; }
:root[data-theme] body#sam-app .skip-link { max-width: calc(100vw - 2rem); white-space: normal; overflow-wrap: anywhere; }
:root[data-theme] body#sam-app #app-view .user-avatar { width: 40px; height: 40px; flex-basis: 40px; }
:root[data-theme] body#sam-app #app-view .content-shell,
:root[data-theme] body#sam-app #app-view .panel:not([hidden]) { display: flow-root; }
:root[data-theme] body#sam-app #app-view .brand-screen-heading { background: var(--sam-aubergine); margin-inline: -1.25rem; padding-inline: 1.25rem; }
:root[data-theme] body#sam-app #app-view button.primary { color: white !important; background: var(--sam-action) !important; }
:root[data-theme] body#sam-app #app-view button.primary:hover { background: var(--sam-action-hover) !important; }
:root[data-theme] body#sam-app #app-view:has(#primary-more-panel:not([hidden])) :is(.content-shell, .app-footer) { visibility: hidden; }
:root[data-theme] body#sam-app #app-view:has(#profile-menu:not([hidden])) :is(.content-shell, .app-footer) { visibility: hidden; }
:root[data-theme] body#sam-app #app-view .primary-more-panel { visibility: visible; }
:root[data-theme] body#sam-app :is(button, summary) { white-space: normal; overflow-wrap: anywhere; }
/* Source disclosures need the same thumb-sized hit area as other actions. */
:root[data-theme] body#sam-app :is(.ask-citations, .records-source-details) > summary {
  display: flex;
  align-items: center;
  min-width: 44px;
  min-height: 44px;
}
:root[data-theme] body#sam-app #app-view .primary-tab svg { width: 24px; height: 24px; }
:root[data-theme] body#sam-app #app-view .primary-tab-ask-mark { width: 44px; height: 44px; flex: 0 0 44px; }
:root[data-theme] body#sam-app #app-view .record-readiness-summary { display: grid; grid-template-columns: minmax(0, 1fr) 40px; gap: 12px; align-items: center; }
:root[data-theme] body#sam-app #app-view .record-readiness-summary > div { display: contents; }
:root[data-theme] body#sam-app #app-view .record-count-display { grid-row: 1; grid-column: 1; margin: 0; }
:root[data-theme] body#sam-app #app-view .record-readiness-mark { grid-row: 1; grid-column: 2; width: 40px; height: 40px; }
:root[data-theme] body#sam-app #app-view .record-readiness h3 { grid-row: 2; grid-column: 1 / -1; overflow-wrap: anywhere; }
:root[data-theme] body#sam-app #app-view .home-action-copy { min-width: 0; overflow-wrap: anywhere; }
:root[data-theme] body#sam-app :is(h1, h2, h3, p) { overflow-wrap: anywhere; hyphens: auto; }
:root[data-theme] body#sam-app #app-view .ask-source-path { grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr)); }
:root[data-theme] body#sam-app #app-view .ask-empty-state { padding: 1rem; }
:root[data-theme] body#sam-app #app-view .authority-voice-action .home-action-icon { color: var(--sam-color-trust-strong); }
:root[data-theme] body#sam-app #app-view .authority-voice-action .home-action-arrow { color: var(--sam-color-text-secondary); }
/* Keep the Home action below provenance when engines size the spanning card differently. */
:root[data-theme] body#sam-app #app-view .authority-voice-action { margin-top: 0; }
:root[data-theme] body#sam-app :is(#welcome-title, #login-title):focus { outline-color: var(--sam-color-focus); }
@media (min-width: 900px) {
 :root[data-theme] body#sam-app #app-view .brand-screen-heading { margin-inline: -3rem; padding-inline: 3rem; }
}
@media (max-width: 360px) {
 :root[data-theme] body#sam-app #app-view .brand-screen-heading { margin-inline: -1rem; padding-inline: 1rem; }
}

/* Talk uses the same readable surfaces in every appearance and session state. */
:root[data-theme] body#sam-app #app-view .content-shell:has(#panel-voice:not([hidden])) { margin-top: 0; }
:root[data-theme] body#sam-app #app-view #panel-voice:has(.voice-stage[data-voice-state="ready"]) { display: grid; }
:root[data-theme] body#sam-app #panel-voice { color: var(--sam-color-text); background: var(--sam-color-canvas); }
:root[data-theme] body#sam-app #panel-voice .voice-stage { background: var(--sam-color-surface); border: 1px solid var(--sam-color-border); border-radius: 16px; box-shadow: none; }
:root[data-theme] body#sam-app #panel-voice .voice-stage::before, :root[data-theme] body#sam-app #panel-voice .voice-stage::after { display: none; }
:root[data-theme] body#sam-app #panel-voice :is(.voice-stage-copy, .voice-primary-status, h2, h3, .voice-save-state) { color: var(--sam-color-text); }
:root[data-theme] body#sam-app #panel-voice :is(.voice-session-detail, .aec-status, .empty-state) { color: var(--sam-color-text-secondary); }
:root[data-theme] body#sam-app #panel-voice .voice-stage-kicker { display: none; }
:root[data-theme] body#sam-app #panel-voice :is(.transcript-card, .voice-control-dock, .voice-state-card) { color: var(--sam-color-text); background: var(--sam-color-surface); border-color: var(--sam-color-border); box-shadow: none; }
:root[data-theme] body#sam-app #panel-voice .voice-state-card-primary { background: var(--sam-action); color: white; }
:root[data-theme] body#sam-app #panel-voice .voice-state-card-primary :is(.voice-state-title, .voice-state-hint) { color: white; }
:root[data-theme] body#sam-app #panel-voice .voice-control-orb { color: var(--sam-color-trust-strong); background: var(--sam-color-trust-soft); border-color: var(--sam-color-border-strong); box-shadow: none; }
:root[data-theme] body#sam-app #panel-voice .voice-state-card-muted :is(.voice-state-title, .voice-state-hint) { color: var(--sam-color-text-secondary); }
:root[data-theme] body#sam-app #panel-voice #voice-orb { filter: none; }
:root[data-theme] body#sam-app #panel-voice .voice-orb-stop-blue, :root[data-theme] body#sam-app #panel-voice .voice-orb-stop-cyan { stop-color: var(--sam-periwinkle); }
:root[data-theme] body#sam-app #panel-voice .voice-orb-stop-violet { stop-color: var(--sam-lilac-gray); }
:root[data-theme] body#sam-app #panel-voice :is(.voice-orb-stop-amber, .voice-orb-stop-orange, .voice-orb-stop-lime) { stop-color: var(--sam-apricot); }
:root[data-theme] body#sam-app #panel-voice #voice-orb-shell-gradient stop { stop-color: var(--sam-aubergine); }
:root[data-theme] body#sam-app :is(input, textarea) { caret-color: var(--sam-color-trust-strong); }
:root[data-theme] body#sam-app { scrollbar-color: var(--sam-color-border-strong) var(--sam-color-canvas); }
:root[data-theme] body#sam-app #panel-voice .voice-save-state { background: var(--sam-color-surface-soft); color: var(--sam-color-text); }
:root[data-theme] body#sam-app #panel-voice .empty-state { background: var(--sam-color-surface-soft); color: var(--sam-color-text-secondary); }
/* The unavailable Talk door keeps its one useful action in normal page flow. */
:root[data-theme] body#sam-app #app-view #panel-voice[data-talk-unavailable] { padding-bottom: 1rem; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] :is(.transcript-card, #voice-mute, #voice-stop) { display: none; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] .voice-stage { min-height: 0; padding: 1.5rem; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] #voice-orb { width: min(160px, 35vw); }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] .voice-control-dock { position: static; width: 100%; margin: 1rem 0 0; padding: 0; display: block; background: transparent; border: 0; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] .voice-primary-controls { grid-template-columns: minmax(0, 1fr); }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] #voice-start { min-height: 64px; width: 100%; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] .voice-stage-copy { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; gap: 0.75rem; margin-top: 1rem; }
:root[data-theme] body#sam-app #panel-voice[data-talk-unavailable] .voice-stage-copy > * { order: 0; flex: none; margin: 0; line-height: 1.4; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] > .transcript-card { display: block; }
:root[data-theme] body#sam-app #panel-voice.active[data-talk-available="true"] { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 1rem; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] > .voice-stage { order: 0; min-height: 0; padding: 1rem; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] #voice-orb { width: 120px; height: 120px; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] > .voice-control-dock { order: 1; position: static; width: 100%; margin: 0; transform: none; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] > .transcript-card { order: 2; margin: 0; }
:root[data-theme] body#sam-app #panel-voice[data-talk-available="true"] .transcript { max-height: 40vh; overflow: auto; }

.brand-welcome-card :is(.brand-welcome-promise,.brand-welcome-privacy) { width:100%; max-width:none; margin-inline:auto; text-align:center; }
