/* Life Assistant 3.9.2 — Slate & Mineral palette.
   Loaded last so one coherent palette wins over the historical visual layers. */

html:root:not(.dark) {
  color-scheme: light;
  --bg: #F3F6F8;
  --sb-bg: #EAF0F3;
  --main-bg: #F3F6F8;
  --card-bg: #FCFDFE;
  --card-brd: rgba(31, 52, 65, .11);
  --brd: rgba(31, 52, 65, .12);
  --border: var(--brd);
  --text: #18232A;
  --text2: #4E5D66;
  --muted: #71808A;
  --ac: #416F8F;
  --ac2: #7198B2;
  --ac-g: linear-gradient(135deg, #365F7D 0%, #7198B2 100%);
  --ac-s: rgba(65, 111, 143, .11);
  --sha: 0 12px 30px rgba(49, 84, 108, .20);
  --nav-act: rgba(65, 111, 143, .10);
  --mp-bg: rgba(31, 52, 65, .055);
  --mp-slider: rgba(65, 111, 143, .16);
  --theme-ico-bg: rgba(31, 52, 65, .055);
  --theme-ico-brd: rgba(31, 52, 65, .10);
  --sb-color: #18232A;

  --la-canvas: #F3F6F8;
  --la-canvas-elevated: #F8FAFB;
  --la-surface: #FCFDFE;
  --la-surface-subtle: #E5ECEF;
  --la-ink: #18232A;
  --la-ink-soft: #64737C;
  --la-line: rgba(31, 52, 65, .11);
  --la-accent: #416F8F;
  --la-accent-2: #7198B2;
  --la-accent-strong: #2F5874;
  --la-accent-soft: #DEE9EF;
  --la-work: #266F78;
  --la-success: #397762;
  --la-warning: #A76A28;
  --la-danger: #B8454F;

  --surface: rgba(252, 253, 254, .92);
  --surface-solid: #FCFDFE;
  --surface-soft: #E5ECEF;
  --surface-raised: #FFFFFF;
  --surface-glass: rgba(252, 253, 254, .85);
  --line: var(--la-line);
  --primary: var(--la-accent);
  --primary-strong: var(--la-accent-strong);
  --primary-soft: var(--la-accent-soft);
  --accent: var(--la-accent);
  --work: var(--la-work);
  --success: var(--la-success);
  --green: var(--la-success);
  --warning: var(--la-warning);
  --amber: var(--la-warning);
  --danger: var(--la-danger);
  --purple: #74859A;
  --shadow-card: 0 1px 2px rgba(27, 47, 60, .05), 0 12px 30px rgba(27, 47, 60, .065);
  --shadow-hover: 0 2px 4px rgba(27, 47, 60, .06), 0 20px 44px rgba(27, 47, 60, .11);
  --shadow-float: 0 28px 82px rgba(27, 47, 60, .20);
  --sh1: var(--shadow-card);
  --sh2: var(--shadow-hover);
}

html:root.work:not(.dark) {
  --bg: #EEF4F5;
  --sb-bg: #E7EFF0;
  --main-bg: #EEF4F5;
  --card-bg: #FAFDFD;
  --card-brd: rgba(28, 62, 67, .12);
  --brd: rgba(28, 62, 67, .13);
  --border: var(--brd);
  --text: #182629;
  --text2: #4A5D61;
  --muted: #6E7F82;
  --ac: #247681;
  --ac2: #3F9DA3;
  --ac-g: linear-gradient(135deg, #247681 0%, #3F9DA3 100%);
  --ac-s: rgba(36, 118, 129, .11);
  --sha: 0 12px 30px rgba(31, 105, 115, .20);
  --nav-act: rgba(36, 118, 129, .10);
  --mp-slider: rgba(36, 118, 129, .16);
  --sb-color: #182629;

  --la-canvas: #EEF4F5;
  --la-canvas-elevated: #F4F8F8;
  --la-surface: #FAFDFD;
  --la-surface-subtle: #E3ECEE;
  --la-ink: #182629;
  --la-ink-soft: #607276;
  --la-line: rgba(28, 62, 67, .12);
  --la-accent: #247681;
  --la-accent-2: #3F9DA3;
  --la-accent-strong: #195E68;
  --la-accent-soft: #DCECEE;
  --la-work: #247681;

  --surface: rgba(250, 253, 253, .92);
  --surface-solid: #FAFDFD;
  --surface-soft: #E3ECEE;
  --surface-raised: #FFFFFF;
  --surface-glass: rgba(250, 253, 253, .85);
  --line: var(--la-line);
  --primary: var(--la-accent);
  --primary-strong: var(--la-accent-strong);
  --primary-soft: var(--la-accent-soft);
  --accent: var(--la-accent);
  --work: var(--la-work);
}

html:root.dark {
  color-scheme: dark;
  --bg: #0E151A;
  --sb-bg: #121C22;
  --main-bg: #0E151A;
  --card-bg: #19242B;
  --card-brd: rgba(224, 237, 244, .11);
  --brd: rgba(224, 237, 244, .12);
  --border: var(--brd);
  --text: #F1F5F7;
  --text2: #C0CDD4;
  --muted: #93A3AD;
  --ac: #78A9C7;
  --ac2: #9BBFD2;
  --ac-g: linear-gradient(135deg, #4F819F 0%, #7FAEC9 100%);
  --ac-s: rgba(120, 169, 199, .15);
  --sha: 0 14px 36px rgba(55, 111, 145, .27);
  --nav-act: rgba(120, 169, 199, .14);
  --mp-bg: rgba(237, 246, 250, .07);
  --mp-slider: rgba(120, 169, 199, .20);
  --theme-ico-bg: rgba(237, 246, 250, .07);
  --theme-ico-brd: rgba(237, 246, 250, .11);
  --sb-color: #F1F5F7;

  --la-canvas: #0E151A;
  --la-canvas-elevated: #121C22;
  --la-surface: #19242B;
  --la-surface-subtle: #202E36;
  --la-ink: #F1F5F7;
  --la-ink-soft: #A4B3BC;
  --la-line: rgba(224, 237, 244, .11);
  --la-accent: #78A9C7;
  --la-accent-2: #9BBFD2;
  --la-accent-strong: #A9CEE1;
  --la-accent-soft: #203745;
  --la-work: #75C4C9;
  --la-success: #73C19B;
  --la-warning: #E6B76C;
  --la-danger: #F08083;

  --surface: rgba(25, 36, 43, .92);
  --surface-solid: #19242B;
  --surface-soft: #202E36;
  --surface-raised: #263640;
  --surface-glass: rgba(25, 36, 43, .85);
  --line: var(--la-line);
  --primary: var(--la-accent);
  --primary-strong: var(--la-accent-strong);
  --primary-soft: var(--la-accent-soft);
  --accent: var(--la-accent);
  --work: var(--la-work);
  --success: var(--la-success);
  --green: var(--la-success);
  --warning: var(--la-warning);
  --amber: var(--la-warning);
  --danger: var(--la-danger);
  --purple: #A2B4CC;
  --shadow-card: 0 2px 9px rgba(0, 0, 0, .25);
  --shadow-hover: 0 20px 48px rgba(0, 0, 0, .36);
  --shadow-float: 0 30px 88px rgba(0, 0, 0, .58);
  --sh1: var(--shadow-card);
  --sh2: var(--shadow-hover);
}

html:root.dark.work {
  --bg: #0C1517;
  --sb-bg: #101C1F;
  --main-bg: #0C1517;
  --card-bg: #162428;
  --card-brd: rgba(222, 244, 245, .11);
  --brd: rgba(222, 244, 245, .12);
  --border: var(--brd);
  --text: #EDF7F6;
  --text2: #B8CCCD;
  --muted: #8FA4A6;
  --ac: #65C4CA;
  --ac2: #7ED0B9;
  --ac-g: linear-gradient(135deg, #318E98 0%, #55B6AD 100%);
  --ac-s: rgba(101, 196, 202, .15);
  --sha: 0 14px 36px rgba(34, 135, 143, .27);
  --nav-act: rgba(101, 196, 202, .14);
  --mp-slider: rgba(101, 196, 202, .21);
  --sb-color: #EDF7F6;

  --la-canvas: #0C1517;
  --la-canvas-elevated: #101C1F;
  --la-surface: #162428;
  --la-surface-subtle: #1E3034;
  --la-ink: #EDF7F6;
  --la-ink-soft: #9EB2B4;
  --la-line: rgba(222, 244, 245, .11);
  --la-accent: #65C4CA;
  --la-accent-2: #7ED0B9;
  --la-accent-strong: #92D9DD;
  --la-accent-soft: #19383C;
  --la-work: #65C4CA;

  --surface: rgba(22, 36, 40, .92);
  --surface-solid: #162428;
  --surface-soft: #1E3034;
  --surface-raised: #21363A;
  --surface-glass: rgba(22, 36, 40, .85);
  --line: var(--la-line);
  --primary: var(--la-accent);
  --primary-strong: var(--la-accent-strong);
  --primary-soft: var(--la-accent-soft);
  --accent: var(--la-accent);
  --work: var(--la-work);
}

body {
  background:
    radial-gradient(circle at 7% -9%, color-mix(in srgb, var(--ac) 11%, transparent), transparent 32rem),
    radial-gradient(circle at 102% 106%, color-mix(in srgb, var(--ac2) 8%, transparent), transparent 38rem),
    var(--bg) !important;
}

.device-select-screen,
.connection-screen {
  background:
    radial-gradient(circle at 50% -12%, color-mix(in srgb, var(--ac) 22%, transparent), transparent 34rem),
    radial-gradient(circle at 5% 108%, color-mix(in srgb, var(--ac2) 14%, transparent), transparent 30rem),
    var(--bg) !important;
}

.brand-mark,
.connection-logo,
.device-select-logo,
.primary-action,
.button.primary,
.button:not(.secondary):not(.danger),
.quick-action.primary,
.page-unified-add-btn.primary {
  background: var(--ac-g) !important;
}

.brand-mark,
.connection-logo,
.device-select-logo,
.primary-action,
.passkey-main-action,
.mobile-fab {
  box-shadow: var(--sha) !important;
}

.desktop-sidebar,
.mobile-nav,
.topbar {
  border-color: var(--card-brd) !important;
}

/* Muted per-view accents that belong to the same visual family. */
#content[data-view-key$=":tasks"] { --view-accent: var(--ac); --view-soft: var(--ac-s); }
#content[data-view-key$=":calendar"] { --view-accent: #397990; --view-soft: color-mix(in srgb, #397990 11%, transparent); }
#content[data-view-key$=":habits"] { --view-accent: #477C65; --view-soft: color-mix(in srgb, #477C65 11%, transparent); }
#content[data-view-key$=":goals"] { --view-accent: #A66E2F; --view-soft: color-mix(in srgb, #A66E2F 11%, transparent); }
#content[data-view-key$=":food"] { --view-accent: #A45361; --view-soft: color-mix(in srgb, #A45361 11%, transparent); }
#content[data-view-key$=":sport"],
#content[data-view-key$=":health"] { --view-accent: #347A72; --view-soft: color-mix(in srgb, #347A72 11%, transparent); }
#content[data-view-key$=":journal"],
#content[data-view-key$=":notes"] { --view-accent: #88634D; --view-soft: color-mix(in srgb, #88634D 11%, transparent); }
#content[data-view-key$=":projects"] { --view-accent: #426E80; --view-soft: color-mix(in srgb, #426E80 11%, transparent); }

html.dark #content[data-view-key$=":calendar"] { --view-accent: #71B7CB; }
html.dark #content[data-view-key$=":habits"] { --view-accent: #79B994; }
html.dark #content[data-view-key$=":goals"] { --view-accent: #DDB36E; }
html.dark #content[data-view-key$=":food"] { --view-accent: #D98996; }
html.dark #content[data-view-key$=":sport"],
html.dark #content[data-view-key$=":health"] { --view-accent: #75C3B9; }
html.dark #content[data-view-key$=":journal"],
html.dark #content[data-view-key$=":notes"] { --view-accent: #C39A7F; }
html.dark #content[data-view-key$=":projects"] { --view-accent: #7DB7C9; }

@media (prefers-contrast: more) {
  html:root { --card-brd: color-mix(in srgb, var(--text) 28%, transparent); --brd: var(--card-brd); }
}
