/* Connected Home colour studies — local, user-authorized alternatives, 2026-09-16.
 * D-1: interface roles; B-51: illustration roles; D-4: existing motion preserved;
 * D-6: contrast and scope review. These are not ratified design-system tokens.
 * Load after infrastructure.css. No palette attribute means no changed declaration.
 * Geometry, type, content and animation timing belong to the existing stylesheets.
 */

html[data-palette="cobalt"][data-theme="dark"] body.option-connected {
  --po-bg:#0B1322;
  --po-panel:#111F34;
  --po-alt:#14243B;
  --po-footer:#08111F;
  --po-ink:#EDF3FF;
  --po-muted:#B8C8DF;
  --po-line:#354B69;
  --po-strong:#7893B6;
  --po-accent:#95B7FF;
  --po-hover:#B0CAFF;
  --po-on:#101C35;
  --po-art:#B6CDFA;
  --po-soft:#182B48;
}

html[data-palette="cobalt"][data-theme="light"] body.option-connected {
  --po-bg:#F5F7FC;
  --po-panel:#FFFFFF;
  --po-alt:#EAF0FA;
  --po-footer:#E8EDF6;
  --po-ink:#14223B;
  --po-muted:#3B4D69;
  --po-line:#C2CDE1;
  --po-strong:#7187AF;
  --po-accent:#2445AF;
  --po-hover:#183794;
  --po-on:#FFFFFF;
  --po-art:#2445AF;
  --po-soft:#E8EEFB;
}

html[data-palette="amethyst"][data-theme="dark"] body.option-connected {
  --po-bg:#141222;
  --po-panel:#1D1930;
  --po-alt:#241E38;
  --po-footer:#100E1C;
  --po-ink:#F5F1FF;
  --po-muted:#C4BBD9;
  --po-line:#4D405F;
  --po-strong:#9682B1;
  --po-accent:#D0BCFF;
  --po-hover:#E0D2FF;
  --po-on:#21142F;
  --po-art:#D5C4F5;
  --po-soft:#302641;
}

html[data-palette="amethyst"][data-theme="light"] body.option-connected {
  --po-bg:#F9F7FC;
  --po-panel:#FFFFFF;
  --po-alt:#F0ECF7;
  --po-footer:#EEE8F4;
  --po-ink:#2B1D3C;
  --po-muted:#56416B;
  --po-line:#CEC1DD;
  --po-strong:#8D72A5;
  --po-accent:#6231A3;
  --po-hover:#4D247F;
  --po-on:#FFFFFF;
  --po-art:#6231A3;
  --po-soft:#F0E7FB;
}

html[data-palette="ice"][data-theme="dark"] body.option-connected {
  --po-bg:#101820;
  --po-panel:#16242E;
  --po-alt:#1C2C38;
  --po-footer:#0D141B;
  --po-ink:#ECF5FA;
  --po-muted:#BCCEDA;
  --po-line:#405865;
  --po-strong:#7C9CA9;
  --po-accent:#8DDCF4;
  --po-hover:#B0E9F8;
  --po-on:#102A36;
  --po-art:#B6DFEB;
  --po-soft:#233A47;
}

html[data-palette="ice"][data-theme="light"] body.option-connected {
  --po-bg:#F3F8FB;
  --po-panel:#FFFFFF;
  --po-alt:#E6F0F6;
  --po-footer:#E5EDF3;
  --po-ink:#172F3E;
  --po-muted:#314F61;
  --po-line:#BFD0DA;
  --po-strong:#6B91A5;
  --po-accent:#0F526F;
  --po-hover:#0C425E;
  --po-on:#FFFFFF;
  --po-art:#0F526F;
  --po-soft:#DFEDF4;
}

html[data-palette="copper"][data-theme="dark"] body.option-connected {
  --po-bg:#1B1514;
  --po-panel:#261C1A;
  --po-alt:#2E211D;
  --po-footer:#15100F;
  --po-ink:#FAF1EA;
  --po-muted:#D8C5B8;
  --po-line:#60473B;
  --po-strong:#AB8A74;
  --po-accent:#ECB99A;
  --po-hover:#F5CFB7;
  --po-on:#2C180E;
  --po-art:#E0C9BC;
  --po-soft:#3A2A23;
}

html[data-palette="copper"][data-theme="light"] body.option-connected {
  --po-bg:#FAF7F2;
  --po-panel:#FFFDF9;
  --po-alt:#F2EAE1;
  --po-footer:#EEE4D9;
  --po-ink:#382A24;
  --po-muted:#594237;
  --po-line:#D3C1B2;
  --po-strong:#A5846B;
  --po-accent:#79361F;
  --po-hover:#612815;
  --po-on:#FFFFFF;
  --po-art:#79361F;
  --po-soft:#F3E3D8;
}


/* Semantic aliases keep existing components and all their states on one palette. */
html[data-palette] body.option-connected {
  --cc-ink:var(--po-ink);--cc-muted:var(--po-muted);--cc-faint:var(--po-muted);
  --cc-line:var(--po-line);--cc-mint:var(--po-accent);--cc-blue:var(--po-art);
  --nav-bg:var(--po-bg);--nav-ink:var(--po-ink);--nav-line:var(--po-line);
  --accent:var(--po-accent);--accent-ink:var(--po-on);--focus:var(--po-accent);
  --po-inspector-offset:24px;--po-route-mix:58%;
  background:var(--po-bg);color:var(--po-ink);
}
html[data-palette][data-theme="dark"] body.option-connected { --brand-filter:brightness(0) invert(1); }
html[data-palette][data-theme="light"] body.option-connected { --brand-filter:brightness(0);--po-inspector-offset:14px;--po-route-mix:72%; }
html[data-palette] body.option-connected ::selection { background:var(--pearl-accent-mark);color:var(--po-on); }

/* Shared navigation and footer include explicit colours in the original theme. */
html[data-palette] body.option-connected .site-header { background:var(--po-bg);color:var(--po-ink); }
html[data-palette] body.option-connected .nav-panel { background:var(--po-panel);color:var(--po-ink);border-color:var(--po-line); }
html[data-palette] body.option-connected .nav-panel a:hover { background:var(--po-soft);color:var(--pearl-accent-text); }
html[data-palette] body.option-connected .header-action:hover { background:var(--po-hover); }
html[data-palette] body.option-connected .site-footer { background:var(--po-footer);color:var(--po-ink);border-color:var(--po-line); }
html[data-palette] body.option-connected .footer-brand img { filter:var(--brand-filter); }
html[data-palette] body.option-connected :is(.footer-intro p,.footer-links a,.footer-boundary) { color:var(--po-muted); }
html[data-palette] body.option-connected :is(.footer-links h2,.footer-boundary) { border-color:var(--po-line); }
html[data-palette] body.option-connected .footer-links h2 { color:var(--po-ink); }
html[data-palette] body.option-connected .footer-links a:hover { color:var(--pearl-accent-text); }

/* The accepted split hero and lifecycle retain every dimension and shadow extent. */
html[data-palette] body.option-connected .cc-hero {
  --cv-bg:var(--po-bg);--cv-panel:var(--po-panel);--cv-soft:var(--po-soft);
  --cv-line:var(--po-line);--cv-ink:var(--po-ink);--cv-muted:var(--po-muted);
  --cv-accent:var(--po-accent);--cv-sheen:var(--po-line);
  --cv-shadow:color-mix(in srgb,var(--po-ink) 8%,transparent);
}
html[data-palette][data-theme="dark"] body.option-connected .cc-hero { --cv-shadow:color-mix(in srgb,#000000 25%,transparent); }
html[data-palette] body.option-connected .connected :is(.cc-intro h1,.cc-card [data-card-heading],.cc-field-label) { color:var(--po-ink); }
html[data-palette] body.option-connected .connected :is(.cc-hero-lead,.cc-card-kicker,.cc-card [data-card-body],.cc-caption,.cc-inspector-top,.cc-inspector-tag,.cc-field-description,.cc-record-intro .cc-record-hint) { color:var(--po-muted)!important; }
html[data-palette] body.option-connected .connected :is(.cc-text-link,.cc-card-link) { color:var(--pearl-accent-text)!important; }
html[data-palette] body.option-connected .connected .cc-button--mint { background:var(--pearl-accent-mark);color:var(--po-on)!important; }
html[data-palette] body.option-connected .connected .cc-button--mint:hover { background:var(--po-hover); }
html[data-palette] body.option-connected .cc-section-rule { background:var(--po-line); }
html[data-palette] body.option-connected .cc-card { background:var(--po-panel); }
html[data-palette] body.option-connected .cc-card--audience { background:transparent; }
html[data-palette] body.option-connected .cc-card-divider { background:var(--po-line); }

/* The evidence inspector remains the same diagram, tabs and layered sheet. */
html[data-palette] body.option-connected .cc-record { background:var(--po-alt);border-color:var(--po-line); }
html[data-palette] body.option-connected .cc-inspector { background:var(--po-panel);border-color:var(--po-strong);box-shadow:var(--po-inspector-offset) var(--po-inspector-offset) 0 -1px var(--po-alt),var(--po-inspector-offset) var(--po-inspector-offset) 0 0 var(--po-line); }
html[data-palette] body.option-connected .cc-inspector-tag { border-color:var(--po-line); }
html[data-palette] body.option-connected .cc-record-source { color:var(--po-art);border-color:var(--po-strong); }
html[data-palette] body.option-connected .cc-record-target { background:var(--po-soft);color:var(--pearl-accent-text);border-color:var(--po-strong); }
html[data-palette] body.option-connected .cc-record-square { border-color:var(--po-art); }
html[data-palette] body.option-connected .cc-record-track span { background:var(--po-strong); }
html[data-palette] body.option-connected .cc-record-track span:nth-child(2) { background:var(--pearl-accent-mark); }
html[data-palette] body.option-connected :is(.cc-record-tabs,.cc-inspector>.cc-caption) { border-color:var(--po-line); }
html[data-palette] body.option-connected .cc-record-tabs button { color:var(--po-muted); }
html[data-palette] body.option-connected .cc-record-tabs button[aria-selected="true"] { color:var(--pearl-accent-text); }
html[data-palette] body.option-connected .cc-record-tabs button:hover { color:var(--po-ink); }
@media(max-width:680px) {
  html[data-palette][data-theme="dark"] body.option-connected { --po-inspector-offset:8px; }
}

/* Resting architecture adopts this palette. The approved purple passage is untouched.
 * The existing art layers mix these inherited resting roles with --infra-tone-ai;
 * no stage selector, packet style, timing, transform or inline value is replaced. */
html[data-palette] body.option-connected .infrastructure {
  --infra-bg:var(--po-bg);--infra-panel:var(--po-panel);--infra-soft:var(--po-soft);
  --infra-ink:var(--po-ink);--infra-muted:var(--po-muted);--infra-line:var(--po-line);
  --infra-accent:var(--po-accent);--infra-blue:var(--po-art);
  --infra-rest-accent:var(--po-accent);--infra-rest-panel:var(--po-panel);--infra-rest-soft:var(--po-soft);
  --infra-route-muted:color-mix(in srgb,var(--po-art) var(--po-route-mix),var(--po-bg));
}