/* Compound canonical elevation, approved 2026-10-21.
 * Source: CompoundLabs/design-review/elevation-20261021/index.html,
 * chips-alerts-20261021/CANONICAL.md and skillworks/src/app/elevation.css.
 * Literal neutral tokens; primary tint follows OpenHealth's established green.
 * Load last. Surface treatment only: no geometry, divider, copy, or icon changes.
 */
body.lp.os {
  --elev-0:none;
  --elev-1:inset 0 1px 0 rgb(255 255 255/.75),0 0 0 1px rgb(15 17 20/.08),0 1px 2px rgb(15 17 20/.06),0 2px 6px -1px rgb(15 17 20/.08);
  --elev-1-hover:inset 0 1px 0 rgb(255 255 255/.75),0 0 0 1px rgb(15 17 20/.1),0 2px 4px rgb(15 17 20/.08),0 6px 14px -4px rgb(15 17 20/.16);
  --elev-2:0 0 0 1px rgb(15 17 20/.06),0 1px 2px rgb(15 17 20/.04),0 4px 12px -2px rgb(15 17 20/.06),0 12px 28px -12px rgb(15 17 20/.10);
  --elev-3:0 0 0 1px rgb(15 17 20/.08),0 8px 16px -4px rgb(15 17 20/.12),0 24px 48px -12px rgb(15 17 20/.22);
  --elev-pressed:inset 0 1px 2px rgb(15 17 20/.12),0 0 0 1px rgb(15 17 20/.1);
  --elev-inset:inset 0 1px 2px rgb(15 17 20/.07),inset 0 0 0 1px rgb(15 17 20/.07);
  --elev-primary:inset 0 1px 0 rgb(255 255 255/.28),0 0 0 1px rgb(22 131 91/.9),0 1px 2px rgb(22 131 91/.3),0 4px 10px -2px rgb(22 131 91/.35);
  --elev-primary-hover:inset 0 1px 0 rgb(255 255 255/.3),0 0 0 1px #16835b,0 2px 4px rgb(22 131 91/.3),0 8px 18px -4px rgb(22 131 91/.45);
  --elev-primary-pressed:inset 0 1px 3px rgb(5 45 30/.35),0 0 0 1px #16835b;
  --raise-grad:linear-gradient(180deg,#fff 0%,#f8f9fa 100%);
  --elev-t:transform .15s ease,box-shadow .15s ease,background-color .15s ease;
}
/* Level 1: real controls. Existing dimensions, colours and icon assets stay intact. */
body.lp.os :is(.os-btn,.os-chip,.os-mbtn,.os-pick,.os-qs,.os-pattern-control button) {
  box-shadow:var(--elev-1);transition:var(--elev-t);
}
body.lp.os :is(.os-btn,.os-chip,.os-mbtn,.os-pattern-control button) {border-color:transparent;background:var(--raise-grad)}
body.lp.os :is(.os-go,.os-btn.pri) {box-shadow:var(--elev-primary);transition:var(--elev-t)}
body.lp.os :is(.os-btn.ink,.os-toggle) {
  background:linear-gradient(180deg,#2d3035,#15171a);color:#fff;
  box-shadow:inset 0 1px 0 rgb(255 255 255/.14),0 0 0 1px #15171a,0 1px 2px rgb(15 17 20/.25),0 4px 10px -2px rgb(15 17 20/.3);
  transition:var(--elev-t);
}
body.lp.os .os-chip.is-on {background:linear-gradient(180deg,#16865d,#127650);color:#fff;box-shadow:var(--elev-primary)}
body.lp.os .os-chip.is-on :is(svg,.os-car,.os-n) {color:#fff}
/* Segmented tracks are inset. The existing moving ink thumb is raised. */
body.lp.os :is(.os-tabs,.os-anch) {box-shadow:var(--elev-inset);border-color:transparent}
body.lp.os :is(.os-tab-indicator,.os-anch a.is-on) {
  box-shadow:inset 0 1px 0 rgb(255 255 255/.16),0 1px 2px rgb(15 17 20/.2),0 2px 6px -1px rgb(15 17 20/.18);
}
/* Inputs: a single surface around a complete search control, not around its children. */
body.lp.os .os-q:not(.os-place-form) {box-shadow:var(--elev-1);border-color:transparent}
body.lp.os .os-place-form .os-f {box-shadow:var(--elev-inset)}
body.lp.os .os-place-form {box-shadow:none}
body.lp.os .os-q:focus-within {box-shadow:var(--elev-1),0 0 0 3px rgb(22 131 91/.14)}
body.lp.os .os-place-form:focus-within {box-shadow:none}
body.lp.os .os-place-form .os-f:focus-within {box-shadow:var(--elev-inset),0 0 0 3px rgb(22 131 91/.14)}
/* Level 2: standalone content cards. Nested result content remains flat. */
body.lp.os :is(.os-card,.os-box,.os-empty,.os-notice,.os-glance,.os-rows,.os-mt,.os-faq,.os-reading-step,.os-section-details),
body.lp.os.os-refined-profile .root .oh-rc {
  border-color:transparent;box-shadow:var(--elev-2);
}
body.lp.os.os-refined-profile .root .oh-cmpw {box-shadow:var(--elev-2)!important}
body.lp.os :is(.os-out,.os-band,.os-result-context,.oh-rc-why,.oh-rc-m,.oh-rc-f) {box-shadow:none}
body.lp.os.os-refined-profile .os-proc {box-shadow:none}
/* Level 3: floating layers. */
body.lp.os :is(.os-pop,.os-ac,.os-call,.os-mobile-search-panel,.os-toast) {border-color:transparent;box-shadow:var(--elev-3)}
body.lp.os .os-tray {box-shadow:0 -4px 12px -2px rgb(15 17 20/.06),0 -12px 28px -12px rgb(15 17 20/.10)}
body.lp.os :is(.os-btn,.os-go,.os-chip,.os-mbtn,.os-toggle,.os-pattern-control button):focus-visible {
  outline:3px solid #9fcfb9;outline-offset:4px;
}
@media(hover:hover) and (pointer:fine) {
  body.lp.os :is(.os-btn,.os-chip,.os-mbtn,.os-pattern-control button):hover {transform:translateY(-1px);box-shadow:var(--elev-1-hover)}
  body.lp.os :is(.os-go,.os-btn.pri):hover {box-shadow:var(--elev-primary-hover);transform:translateY(-1px)}
  body.lp.os .os-chip.is-on:hover {box-shadow:var(--elev-primary-hover)}
  body.lp.os :is(.os-card:hover,.os-card.is-hover) {box-shadow:var(--elev-2),0 0 0 2px rgb(22 131 91/.13)}
  body.lp.os :is(.os-btn.ink,.os-toggle):hover {box-shadow:inset 0 1px 0 rgb(255 255 255/.18),0 0 0 1px #15171a,0 2px 4px rgb(15 17 20/.25),0 8px 18px -4px rgb(15 17 20/.35)}
}
body.lp.os :is(.os-btn,.os-chip,.os-mbtn,.os-pattern-control button):active {transform:none;box-shadow:var(--elev-pressed)}
body.lp.os :is(.os-go,.os-btn.pri):active {transform:none;box-shadow:var(--elev-primary-pressed)}
body.lp.os .os-chip.is-on:active {box-shadow:var(--elev-primary-pressed)}
body.lp.os :is(.os-btn.ink,.os-toggle):active {transform:none;box-shadow:inset 0 1px 3px rgb(0 0 0/.4),0 0 0 1px #15171a}
body.lp.os :is(.os-btn,.os-go,.os-chip,.os-mbtn,.os-toggle):is(:disabled,[aria-disabled=true]) {transform:none;box-shadow:var(--elev-pressed);opacity:.55}
@media(max-width:860px) {body.lp.os.is-mapview .os-sheet {box-shadow:0 -8px 16px -4px rgb(15 17 20/.12),0 -24px 48px -12px rgb(15 17 20/.22)}}
@media(prefers-reduced-motion:reduce) {
  body.lp.os :is(.os-btn,.os-go,.os-chip,.os-mbtn,.os-pick,.os-qs,.os-toggle,.os-pattern-control button) {transition:none;transform:none}
}