/* Obsidian / Pearl: appearance-only overrides for the original interactive modules.
   Load after the original module and depth styles. Truck artwork is untouched. */
:root {
  --obs-component-surface: #111318;
  --obs-component-raised: #1b1e25;
  --obs-component-ink: #f3f2f7;
  --obs-component-muted: #b5b6c3;
  --obs-component-line: #ffffff24;
  --obs-component-cyan: #b9e5ed;
  --obs-component-lilac: #c2bcf1;
  --obs-component-red: #ff5a45;
  --obs-component-glass: linear-gradient(150deg, #ffffff0c, #ffffff00 45%), linear-gradient(150deg, #1c1f27ed, #111318f5);
  --obs-component-shadow: 0 20px 42px -20px #000c, 0 4px 9px #0006, inset 0 1px 0 #ffffff1c, inset 0 -1px 0 #0008;
}

/* Service selector: retain all stacked-module movement and selected states. */
.service-modules {
  --service-modules-cream: var(--obs-component-surface);
  --service-modules-blue: #202c35;
  --service-modules-apricot: #252b35;
  --service-modules-ink: var(--obs-component-ink);
  --service-modules-link: var(--obs-component-cyan);
  background: var(--obs-component-glass);
  border-color: var(--obs-component-line);
  box-shadow: var(--obs-component-shadow);
}
.service-modules__tray {
  background-color: #0b0e13;
  background-image: linear-gradient(#b9e5ed06 1px, transparent 1px), linear-gradient(90deg, #b9e5ed06 1px, transparent 1px), linear-gradient(150deg, #b9e5ed05, #c2bcf103);
  border-color: #ffffff1c;
  box-shadow: inset 0 1px 0 #ffffff09, inset 0 8px 24px #0004;
}
.service-modules .service-modules__module {
  color: var(--obs-component-ink);
  background: linear-gradient(160deg, #ffffff0d, #ffffff00 45%), linear-gradient(135deg, #272c36, #171b22);
  border-color: #bfc9e538;
  box-shadow: 0 3px 0 #080a10, 0 4px 0 #ffffff15, 0 12px 20px #0006, inset 0 1px 0 #ffffff24;
}
.service-modules .service-modules__module[aria-pressed="true"] {
  color: var(--obs-component-ink);
  background: linear-gradient(155deg, #b9e5ed12, #ffffff00 42%), linear-gradient(135deg, #2b333e, #192029);
  border-color: #b9e5ed8c;
  box-shadow: 0 3px 0 #080c13, 0 4px 0 #b9e5ed47, 0 16px 25px #0008, inset 0 1px 0 #e2fcff66, inset -1px 0 0 #c2bcf14d;
}
.service-modules .service-modules__module--follow-through[aria-pressed="true"] {
  background: linear-gradient(155deg, #ff5a4512, #ffffff00 42%), linear-gradient(135deg, #2d323d, #1a1e27);
  border-color: #c2bcf185;
  box-shadow: 0 3px 0 #0f0914, 0 4px 0 #c2bcf147, 0 16px 25px #0008, inset 0 1px 0 #e8eaff66, inset -1px 0 0 #ff5a454d;
}
.service-modules .service-modules__module[aria-pressed="true"] :is(.service-modules__number, .service-modules__module-summary, .service-modules__selected-mark, .service-modules__icon) { color: #edf1f7; }
.service-modules .service-modules__module[aria-pressed="true"] .service-modules__icon { stroke: #edf1f7; }
.service-modules .service-modules__module[aria-pressed="true"]:disabled { -webkit-text-fill-color: #edf1f7; }
.service-modules :is(.service-modules__intro, .service-modules__tray-label, .service-modules__instruction, .service-modules__tray-bottom, .service-modules__module-summary, .service-modules__panel-label, .service-modules__panel-description, .service-modules__footer, .service-modules__footer-note, .service-modules__fallback) { color: var(--obs-component-muted); }
.service-modules__number, .service-modules__selected-mark { color: var(--obs-component-cyan); }
.service-modules__icon { stroke: var(--obs-component-cyan); }
.service-modules__connection-base { stroke: #8899b0; }
.service-modules__connection-points { fill: #10151d; stroke: #9ab6c9; }
.service-modules__panel-label > span, .service-modules__footer { border-color: var(--obs-component-line); }
.service-modules__deliverables li::before { background: var(--obs-component-cyan); }
.service-modules .service-modules__links a {
  background: linear-gradient(150deg, #282d37, #181c24);
  color: #e3e5ef;
  border-color: #c5c9e033;
  box-shadow: 0 2px 0 #050609, 0 6px 12px #0005, inset 0 1px 0 #ffffff21;
}
.service-modules__disclosure > span { color: var(--obs-component-lilac); }
@media (hover: hover) {
  .service-modules .service-modules__module:not(:disabled):not([aria-pressed="true"]):hover { border-color: #c8d8f282; box-shadow: 0 3px 0 #080a10, 0 4px 0 #c2bcf140, 0 14px 24px #0008, inset 0 1px 0 #ffffff38; }
  .service-modules .service-modules__links a:hover { background: linear-gradient(150deg, #313744, #222832); border-color: #b9e5ed73; box-shadow: 0 2px 0 #050609, 0 9px 16px #0007, inset 0 1px 0 #c1e5ff42; }
}

/* Strategy session planner. The arcs keep three distinct visual phases. */
.session-agenda { color: var(--obs-component-ink); background: linear-gradient(135deg, #101218, #080a0e); }
.session-agenda-shell { background: var(--obs-component-glass); border-color: #ffffff30; box-shadow: var(--obs-component-shadow); }
.session-agenda-picker { background: linear-gradient(145deg, #b9e5ed05, #c2bcf105); }
.session-agenda-detail { background: #0f1218c9; }
.session-agenda .session-agenda-options button { background: linear-gradient(155deg, #ffffff0c, #ffffff00 60%), #181d25; color: var(--obs-component-ink); border-color: #ffffff29; box-shadow: 0 3px 8px #0004, inset 0 1px 0 #ffffff13; }
.session-agenda .session-agenda-options button[aria-pressed=true] { background: linear-gradient(145deg, #28343f, #1b202c); border-color: #b9e5ed85; box-shadow: 0 8px 22px -10px #000b, inset 0 1px 0 #dbf2ff66, inset -1px 0 0 #c2bcf14a; }
.session-agenda-icon { color: var(--obs-component-cyan); background: #b9e5ed0e; border-color: #b9e5ed30; }
.session-agenda :is(.session-agenda-intro > p, .session-agenda-prompt, .session-agenda-options small, .session-agenda-selection, .session-agenda-helper, .session-agenda-kicker, .session-agenda-clock small, .session-agenda-time small, .session-agenda-steps p, .session-agenda-detail-footer p, .session-agenda-status) { color: var(--obs-component-muted); }
.session-agenda .session-agenda-options button[aria-pressed=true] .session-agenda-selection { color: #edf2f7; }
.session-agenda-reset, .session-agenda-time { color: var(--obs-component-cyan); }
.session-agenda-clock svg { stroke: #ffffff18; }
.session-agenda-clock .session-agenda-arc-one { stroke: #b9e5ed; }
.session-agenda-clock .session-agenda-arc-two { stroke: #c2bcf1; }
.session-agenda-clock .session-agenda-arc-three { stroke: #ff5a45; }
.session-agenda-steps li, .session-agenda-steps li + li, .session-agenda-detail-footer { border-color: var(--obs-component-line); }
@media (hover: hover) {
  .session-agenda .session-agenda-options button:not(:disabled):hover { background: linear-gradient(145deg, #2a303b, #1c232d); border-color: #b9e5ed82; box-shadow: 0 9px 22px -10px #000b, inset 0 1px 0 #e5e7ff42; }
}

/* Before / after workday: graphite surfaces, red attention and cyan completion. */
.work-compare {
  --work-compare-cream: #111318;
  --work-compare-blue: #24333e;
  --work-compare-peach: #242933;
  --work-compare-ink: #f3f2f7;
  --work-compare-link: #b9e5ed;
  --work-compare-line: #ffffff24;
}
.work-compare-switch { background: #090c12; box-shadow: inset 0 2px 6px #0008, 0 1px 0 #ffffff0d; }
.work-compare-button { color: #b5b6c3; }
.work-compare-button[aria-pressed=true] { background: linear-gradient(160deg, #363e4b, #222832); color: #f3f2f7; box-shadow: 0 3px 8px #0008, inset 0 1px 0 #d9eaff5c, inset -1px 0 0 #c2bcf142; }
.work-compare-button:hover[aria-pressed=false] { background: #ffffff0a; color: #f3f2f7; }
.work-compare-stage { background: var(--obs-component-glass); box-shadow: var(--obs-component-shadow); }
.work-compare-windowbar { background: #181b23; }
.work-compare-business-icon { background: #282f3c; color: #e6ebf5; }
.work-compare-board { background-color: #0d1015; background-image: radial-gradient(#ffffff14 .65px, transparent .65px); }
.work-compare-after .work-compare-board { background: #0d1318; }
.work-compare :is(.work-compare-voicemail, .work-compare-message, .work-compare-draft, .work-compare-job, .work-compare-followup) { background: linear-gradient(145deg, #ffffff07, transparent 58%), #191e27; border-color: #ffffff29; box-shadow: 0 6px 15px #0005, inset 0 1px 0 #ffffff13; }
.work-compare :is(.work-compare-sample, .work-compare-mode, .work-compare-card-top small, .work-compare-sender > span, .work-compare-job-contact > span, .work-compare-audio, .work-compare-audio-label, .work-compare-message div > span, .work-compare-message-icon, .work-compare-draft div > span, .work-compare-owner-label, .work-compare-job-number, .work-compare-job-note, .work-compare-assignment small, .work-compare-task-footer, .work-compare-caption, .work-compare-next div > span) { color: var(--obs-component-muted); }
.work-compare-icon { background: #ffffff0c; color: #dfe2ef; }
.work-compare .work-compare-icon-peach, .work-compare-unread { color: #eeeef5; background: #ffffff0b; box-shadow: inset 0 1px 0 #ffffff14, inset 2px 0 0 #ff5a458c; }
.work-compare-icon-blue { color: #b9e5ed; background: #b9e5ed14; }
.work-compare-wave i { background: #8c92a4; }
.work-compare-message-dots { color: #adb5c6; }
.work-compare-note {
  color: #ebeef6;
  background:
    linear-gradient(105deg, transparent 8%, #f3ad43a6 24%, #f541309c 36%, #9a7fffbd 48%, #70d6f5a6 63%, transparent 92%) 95% 0 / 75% 1.5px no-repeat,
    radial-gradient(ellipse at 2% 110%, #ff4b3908, transparent 46%),
    linear-gradient(145deg, #ffffff0e, transparent 52%), #20242d;
  border-color: #c5d0e43d;
  box-shadow: 2px 6px 16px #0008, inset 0 1px 0 #ffffff1a, inset -1px 0 0 #b7c9f224;
}
.work-compare-tape { background: #d5dfec24; border-color: #d5dfec2e; box-shadow: inset 0 1px 0 #ffffff14; }
.work-compare :is(.work-compare-note-label, .work-compare-note p, .work-compare-note-arrow, .work-compare-note-bottom, .work-compare-owner-status) { color: #d8dce7; }
.work-compare-note-underline::after { border-color: #b7c5dd; }
.work-compare-draft-status, .work-compare-mode > span { background: #ff5a45; box-shadow: 0 0 0 2px #ff5a4510; }
.work-compare-owner { background: linear-gradient(160deg, #ffffff06, transparent 60%), #161b24; border-color: #ffffff26; }
.work-compare-captured, .work-compare-next { background: linear-gradient(145deg, #91ddf00a, transparent 65%), #1b232e; border-color: #9dcfef40; }
.work-compare :is(.work-compare-captured, .work-compare-assigned, .work-compare-reminder, .work-compare-next small) { color: #b2e4f3; }
.work-compare-job-icon { color: #b9c4d4; }
.work-compare-assignment, .work-compare-source, .work-compare-task-footer { border-color: #ffffff1a; }
.work-compare-crew-avatar { background: #2a3444; color: #dceef8; border-color: #18212b; outline-color: #b8cce64d; }
.work-compare-source { background: #0b101866; color: #aebbc8; }
.work-compare-next-dot, .work-compare-after .work-compare-mode > span { background: #b2e4f3; box-shadow: 0 0 0 2px #b2e4f310; }
.work-compare-after .work-compare-owner { background: linear-gradient(160deg, #91ddf008, transparent 60%), #161c25; color: #f3f2f7; border-color: #b2e4f333; }
.work-compare-after .work-compare-owner-label { color: #b2e4f3; }
.work-compare-owner-check { background: #b2e4f312; color: #b2e4f3; border-color: #b2e4f352; }

/* Living system diagram. Scope SVG colors to diagram primitives only. */
.sys-flow {
  --sys-flow-cream: #0d1015;
  --sys-flow-blue: #1f2e38;
  --sys-flow-apricot: #222833;
  --sys-flow-ink: #eceef4;
  --sys-flow-accent: #b9e5ed;
  --sys-flow-amber: #ff6851;
  border-color: #ffffff1c;
  background: radial-gradient(ellipse at 70% 0%, #b9e5ed06, transparent 60%), #0d1015;
}
.sys-flow-toggle { background: #090b10; border-color: #ffffff2c; box-shadow: inset 0 2px 5px #0007; }
.sys-flow-toggle button[aria-pressed="true"] { color: #eff2f9; background: linear-gradient(155deg, #343c48, #20252e); box-shadow: 0 2px 6px #0007, inset 0 1px 0 #d8eaff59; }
.sys-flow-toggle button:hover:not([aria-pressed="true"]):not(:disabled) { background: #ffffff0c; }
.sys-flow-stage-labels, .sys-flow-caption, .sys-flow-source { border-color: #ffffff24; }
.sys-flow-tool { background: linear-gradient(150deg, #2a3642, #18232c); border-color: #b9e5ed73; box-shadow: 0 8px 18px #0008, inset 0 1px 0 #e3f7ff40, inset -1px 0 0 #c2bcf13b; }
.sys-flow-founder { background: linear-gradient(150deg, #ffffff0d, transparent 56%), linear-gradient(145deg, #2b303b, #171c25); border-color: #ff685185; box-shadow: 0 8px 20px #0008, inset 0 1px 0 #eef1ff2e, inset -1px 0 0 #ff503824; }
.sys-flow[data-state="after"] .sys-flow-founder { background: linear-gradient(150deg, #b9e5ed0c, transparent 56%), linear-gradient(145deg, #283440, #161e28); border-color: #b9e5ed99; }
.sys-flow-footnote { color: var(--obs-component-muted); }

/* Founder story. Photography crops and the original truck illustration remain intact. */
.founder-paths {
  --founder-paths-cream: #0b0d12;
  --founder-paths-blue: #b9e5ed;
  --founder-paths-apricot: #c2bcf1;
  --founder-paths-ink: #f3f2f7;
  --founder-paths-link: #c4d9ed;
  --founder-paths-muted: #b5b6c3;
}
.founder-paths__line--base { stroke: #ffffff24; }
.founder-paths__line--dylan { stroke: #b9e5ed; }
.founder-paths :is(.founder-paths__origin, .founder-paths__stage, .founder-paths__convergence) { background: var(--obs-component-glass); border-color: #ffffff29; box-shadow: var(--obs-component-shadow); }
.founder-paths .founder-paths__track--dylan .founder-paths__stage { background: linear-gradient(150deg, #b9e5ed08, transparent 50%), linear-gradient(145deg, #1d222a, #11151b); border-color: #b9e5ed29; }
.founder-paths__track::before { background: #ffffff24; }
.founder-paths__track-heading, .founder-paths__stage + .founder-paths__stage, .founder-paths__track--dylan .founder-paths__stage + .founder-paths__stage { border-color: #ffffff24; }
.founder-paths .founder-paths__track-tag { color: #e0d4f5; background: #c2bcf115; }
.founder-paths .founder-paths__track--dylan .founder-paths__track-tag { color: #c8eaf1; background: #b9e5ed15; }
.founder-paths__milestone-dot { border-color: #939bb1; }
.founder-paths__track--dylan .founder-paths__milestone-dot.is-active { border-color: #b9e5ed; box-shadow: 0 0 0 5px var(--founder-paths-cream), 0 0 0 6px #b9e5ed42; }
.founder-paths .founder-paths__stage-label, .founder-paths .founder-paths__track--dylan .founder-paths__stage-label { color: #c5c7d4; }
.founder-paths .founder-paths__stage > p:not(.founder-paths__stage-label):not(.founder-paths__demo-note), .founder-paths .founder-paths__convergence p:last-child { color: #b5b6c3; }
.founder-paths__crew, .founder-paths__project { background: #131820; border-color: #ffffff26; box-shadow: 0 8px 20px #0006, inset 0 1px 0 #ffffff12; }
.founder-paths .founder-paths__proof { background: #c2bcf108; border: 1px solid #c2bcf11a; box-shadow: inset 0 1px 0 #ffffff0b; }
.founder-paths__project img { border-color: #ffffff26; }
.founder-paths__project:hover { border-color: #b9e5ed80; box-shadow: 0 12px 26px #0008, inset 0 1px 0 #c2bcf13a; }
.founder-paths__status { color: #b2e4f3; }
.founder-paths__status--live::before { background: #b2e4f3; }
.about-hero .lead { color: #ebeaf2; }
.about-hero .breadcrumb { color: #b7b9c9; }
.about-hero .eyebrow { color: #c2bcf1; }

/* Focus is intentionally visible even when hover motion is disabled. */
:is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) :is(button, a, input, select, textarea):focus-visible { outline: 2px solid #c8e8fa; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *,
  :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *::before,
  :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
html.motion-off :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *,
html.motion-off :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *::before,
html.motion-off :is(.service-modules, .session-agenda, .work-compare, .sys-flow, .founder-paths) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
