@import url("praxis-theme.css?v=f7cd4d0496e8");
/* Shared public navigation — ONE calm bar (EMA/Cody, 30.09.2026, Rahmen-Auftrag): Menü links, Punkt +
   Wortmarke in der Mitte, Login rechts. Ersetzt die frühere zweistöckige Kombination aus großer
   Lavendel-Kopfzeile (.identity) und dieser Leiste — die Lavendel-Fläche wandert hierher, die Leiste
   trägt jetzt selbst die Wortmarke, immer sichtbar (kein Scroll-Umschalten mehr). Native details
   remains usable without JavaScript. */
html:has(.pr-navigation) { scroll-padding-top: 96px; }
.pr-navigation {
  --pr-ink: #2a3540;
  --pr-link: #1c3f4d;
  --pr-line: #cabfdb;
  --pr-soft: #f2eef9;
  display: block;
  position: sticky;
  top: 0;
  z-index: 40;
  padding: 0 clamp(20px, 5vw, 56px);
  border: 0;
  border-bottom: 1px solid var(--pr-line);
  background: linear-gradient(110deg, var(--masthead-start, #eeebf7), var(--masthead-end, #e3def2));
  color: var(--pr-ink);
  font: 400 15px/1.5 "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  text-align: left;
  isolation: isolate;
  container: praxis-navigation / inline-size;
}
.pr-navigation:has(.palette-menu[open]) { z-index: 60; }
.pr-navigation *,
.pr-navigation *::before,
.pr-navigation *::after { box-sizing: border-box; }
.pr-navigation .pr-nav-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  max-width: 1120px;
  min-height: 76px;
  margin: 0 auto;
  padding: 10px 0;
  border: 0;
}
.pr-navigation a {
  color: inherit;
  text-decoration: none;
  background: none;
  border: 0;
  box-shadow: none;
}
.pr-navigation a:hover {
  color: var(--pr-link);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.pr-navigation :is(a, summary, button):focus-visible {
  outline: 2px solid var(--pr-link);
  outline-offset: 3px;
}
.pr-navigation .pr-menu {
  justify-self: start;
  position: static;
  display: block;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
.pr-navigation .pr-menu > summary {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  min-width: 108px;
  min-height: 46px;
  padding: 10px 16px;
  margin: 0;
  border: 1px solid var(--pr-line);
  border-radius: 24px;
  list-style: none;
  cursor: pointer;
  background: #fff;
  color: var(--pr-link);
  font: inherit;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  user-select: none;
}
.pr-navigation .pr-menu > summary:hover,
.pr-navigation .pr-menu[open] > summary { background: var(--pr-soft); border-color: #bbb3d9; }
.pr-navigation .pr-menu > summary::-webkit-details-marker { display: none; }
.pr-navigation .pr-menu > summary::marker { content: ""; }
.pr-navigation .pr-menu > summary::after { display: none; content: none; }
.pr-navigation svg { display: block; flex: 0 0 auto; width: 20px; height: 20px; max-width: none; }
.pr-navigation .pr-menu-label-open,
.pr-navigation .pr-menu[open] .pr-menu-label { display: none; }
.pr-navigation .pr-menu[open] .pr-menu-label-open { display: inline; }
.pr-navigation .pr-page-label {
  display: block;
  min-width: 0;
  margin: 0;
  color: #596c75;
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: .04em;
  text-align: right;
  overflow-wrap: anywhere;
}
.pr-navigation .pr-page-label > span { display: block; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 2px; color: #63737c; }
.pr-navigation .pr-menu-panel {
  display: block;
  position: absolute;
  inset: calc(100% + 1px) 0 auto;
  z-index: 45;
  width: auto;
  max-width: none;
  max-height: min(720px, var(--pr-menu-available-height, 60dvh));
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 24px 28px;
  border: 1px solid var(--pr-line);
  border-radius: 0 0 16px 16px;
  background: #fff;
  box-shadow: 0 18px 42px -24px #17333f66;
  color: var(--pr-ink);
  text-align: left;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
}
.pr-navigation .pr-menu:not([open]) > .pr-menu-panel { display: none; }
.pr-navigation .pr-menu-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 20px;
  padding: 0 0 16px;
  border-bottom: 1px solid var(--pr-line);
}
.pr-navigation .pr-menu-heading > span { font-size: 19px; font-weight: 600; line-height: 1.35; }
.pr-navigation .pr-menu-close {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid var(--pr-line);
  border-radius: 24px;
  background: #fff;
  color: var(--pr-link);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  box-shadow: none;
}
.pr-navigation[data-navigation-enhanced] .pr-menu-close { display: inline-flex; }
.pr-navigation .pr-menu-close:hover { background: var(--pr-soft); }
.pr-navigation .pr-menu-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 26px;
}
.pr-navigation .pr-menu-services > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 54px;
  padding: 12px 15px;
  border: 1px solid #d2ded7;
  border-radius: 9px;
  background: var(--pr-soft);
  color: var(--pr-link);
  font-weight: 600;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.pr-navigation .pr-menu-services > a:hover { background: #e6efe9; }
.pr-navigation .pr-menu-groups {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px;
}
.pr-navigation .pr-menu-group {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.pr-navigation .pr-menu-group h2 {
  margin: 0 0 8px;
  padding: 0 10px;
  border: 0;
  background: none;
  color: #61726b;
  font: 600 11px/1.5 "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.pr-navigation ul,
.pr-navigation li { list-style: none; margin: 0; padding: 0; border: 0; }
.pr-navigation .pr-menu-group a {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px;
  border-radius: 7px;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.pr-navigation .pr-menu-group a:hover { background: #f6f8f7; }
.pr-navigation a[aria-current]:not([aria-current="false"]) {
  background: var(--pr-soft);
  color: var(--pr-link);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.pr-navigation .pr-menu-service {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 22px;
  margin-top: 24px;
  padding-top: 10px;
  border-top: 1px solid var(--pr-line);
}
.pr-navigation .pr-menu-service a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; color: #596c75; }
.pr-navigation :is(.pr-primary, .pr-login),
body:has(.pr-navigation) .travel-section-navigation { display: none !important; }
@media (max-width: 900px) {
  .pr-navigation .pr-menu-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 28px; }
}
@media (max-width: 520px) {
  .pr-navigation { padding-inline: 16px; }
  .pr-navigation .pr-nav-inner { min-height: 64px; gap: 14px; }
  .pr-navigation .pr-page-label { max-width: 55%; font-size: 12px; letter-spacing: 0; }
  .pr-navigation .pr-page-label > span { display: block; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 2px; color: #63737c; }
.pr-navigation .pr-menu-panel { padding: 18px 16px; }
  .pr-navigation .pr-menu-heading { align-items: flex-start; gap: 10px; }
  .pr-navigation .pr-menu-heading > span { padding-top: 10px; font-size: 17px; }
  .pr-navigation .pr-menu-close { padding-inline: 10px; font-size: 12px; }
  .pr-navigation .pr-menu-groups,
  .pr-navigation .pr-menu-services { grid-template-columns: 1fr; }
  .pr-navigation .pr-menu-services { gap: 8px; margin-bottom: 22px; }
  .pr-navigation .pr-menu-services > a { min-height: 48px; }
  .pr-navigation .pr-menu-groups { gap: 22px; }
}
@container praxis-navigation (max-width: 820px) {
  .pr-navigation .pr-menu-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container praxis-navigation (max-width: 480px) {
  .pr-navigation .pr-menu-groups,
  .pr-navigation .pr-menu-services { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.pr-navigation) { scroll-behavior: auto; }
  .pr-navigation * { transition: none; animation: none; scroll-behavior: auto; }
}
@media (forced-colors: active) {
  .pr-navigation :is(summary, .pr-menu-close, .pr-menu-panel, .pr-menu-services > a) { border-color: ButtonText; }
  .pr-navigation a[aria-current]:not([aria-current="false"]) { outline: 1px solid LinkText; outline-offset: -2px; }
}
@media print { .pr-navigation { display: none !important; } }

/* Matching entry buttons on the left and right of the shared navigation. */
.pr-navigation .pr-account-link { display: inline-flex; align-items: center; justify-content: flex-start; gap: 11px; flex: 0 0 auto; min-width: 108px; min-height: 46px; padding: 10px 16px; border: 1px solid var(--pr-line); border-radius: 24px; background: #fff; color: var(--pr-link); font: inherit; font-weight: 600; line-height: 1.5; letter-spacing: 0; text-transform: none; }
.pr-navigation .pr-account-link:hover { background: var(--pr-soft); border-color: #bbb3d9; text-decoration: none; }
.pr-navigation .pr-account-link svg { width: 20px; height: 20px; }

/* Right-hand cluster: the colour picker (borrowed unchanged from the old .identity masthead) sits
   quietly next to Login, both end-aligned in the third grid column. */
.pr-navigation .pr-nav-end { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: 8px; }
.pr-navigation .pr-nav-end .palette-menu { flex: 0 0 auto; }
.pr-navigation .pr-nav-end .palette-menu > summary { border: 1px solid var(--pr-line); background: #fff; }
.pr-navigation .pr-nav-end .palette-menu > summary:hover { background: var(--pr-soft); }

/* The one brand mark of the merged bar: dot + wordmark, always shown (no more scroll-triggered
   swap between a big masthead and this compact fallback — there is only this bar now). */
.pr-navigation .pr-compact-brand {
  grid-column: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 46px;
  color: var(--pr-link);
}
.pr-navigation .pr-compact-brand:hover { color: var(--pr-link); text-decoration: none; }
.pr-navigation .pr-compact-symbol { width: 34px; height: 34px; }
.pr-navigation .pr-compact-dot { fill: var(--link, #564596); }
.pr-navigation .pr-compact-lockup { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.pr-navigation .pr-compact-wordmark { width: 218px; height: 19px; color: var(--pr-ink); }
.pr-navigation .pr-compact-tagline {
  font: 500 8.5px/1.2 "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .22em;
  text-transform: uppercase;
  white-space: nowrap;
}
@container praxis-navigation (max-width: 620px) {
  .pr-navigation .pr-compact-symbol { width: 30px; height: 30px; }
  .pr-navigation .pr-compact-wordmark { width: 196px; height: 17px; }
}
@container praxis-navigation (max-width: 550px) {
  .pr-navigation .pr-nav-inner { gap: 8px; }
  .pr-navigation .pr-nav-end { gap: 6px; }
  .pr-navigation .pr-compact-brand { gap: 6px; min-width: 0; }
  .pr-navigation .pr-compact-lockup { min-width: 0; }
  .pr-navigation .pr-compact-symbol { width: 20px; height: 20px; flex-shrink: 0; }
  .pr-navigation .pr-compact-wordmark { width: 128px; height: 11px; }
  .pr-navigation .pr-compact-tagline { font-size: 6.5px; letter-spacing: .14em; }
  .pr-navigation .pr-menu > summary,
  .pr-navigation .pr-account-link { min-width: 44px; width: 44px; height: 44px; min-height: 44px; padding: 11px; justify-content: center; }
  .pr-navigation .pr-nav-end .palette-menu > summary { width: 44px; height: 44px; min-height: 44px; }
  .pr-navigation .pr-menu > summary > span,
  .pr-navigation .pr-account-link > span { display: none; }
}
@container praxis-navigation (max-width: 310px) {
  /* Too narrow for menu + wordmark + palette + login side by side without crowding:
     keep the ring-and-dot mark (the brand's smallest true unit) and let the full
     wordmark go — Menü and Login stay fully legible, nothing overlaps or wraps. */
  .pr-navigation .pr-compact-lockup { display: none; }
  .pr-navigation .pr-compact-symbol { width: 28px; height: 28px; }
}

/* Handy-Kopfzeile: ein Menü, eine Marke, ein Kontozugang. Diese gemeinsamen
   Regeln gelten auch ohne den optionalen Boutique-Modus. */
.pr-navigation .pr-nav-end > .palette-menu.identity-palette {
  display: none !important;
}

@container praxis-navigation (max-width: 550px) {
  .pr-navigation .pr-nav-inner:has(.pr-nav-end) {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    gap: 8px;
    min-height: 64px;
  }
  .pr-navigation .pr-nav-end { min-width: 0; gap: 0; }
  .pr-navigation .pr-menu > summary {
    position: relative;
    gap: 0;
  }
  .pr-navigation .pr-menu > summary > .pr-menu-label,
  .pr-navigation .pr-menu > summary > .pr-menu-label-open,
  .pr-navigation .pr-menu[open] > summary > .pr-menu-label,
  .pr-navigation .pr-menu[open] > summary > .pr-menu-label-open {
    display: none;
  }
  .pr-navigation .pr-menu[open] > summary > .pr-menu-icon { display: none; }
  .pr-navigation .pr-menu[open] > summary::before,
  .pr-navigation .pr-menu[open] > summary::after {
    content: "";
    display: block;
    position: absolute;
    top: calc(50% - 1px);
    left: calc(50% - 10px);
    width: 20px;
    height: 2px;
    border-radius: 1px;
    background: currentColor;
    transform: rotate(45deg);
  }
  .pr-navigation .pr-menu[open] > summary::after { transform: rotate(-45deg); }
  .pr-navigation .pr-compact-brand {
    width: 100%;
    max-width: 238px;
    min-width: 0;
    min-height: 44px !important;
    padding: 0 !important;
    flex-direction: row !important;
    gap: 8px !important;
    justify-self: center;
  }
  .pr-navigation .pr-compact-symbol {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px;
  }
  .pr-navigation .pr-compact-lockup {
    display: flex !important;
    min-width: 0;
    width: 0;
    flex: 1 1 0;
    gap: 5px !important;
  }
  .pr-navigation .pr-compact-wordmark {
    width: 100%;
    height: auto;
    aspect-ratio: 280 / 24;
  }
  .pr-navigation .pr-compact-tagline {
    font-size: 6.5px;
    letter-spacing: .14em;
  }
  .pr-navigation .pr-menu-heading { align-items: center; }
  .pr-navigation .pr-menu-heading > span { padding-top: 0; }
  .pr-navigation .pr-menu-heading .pr-menu-close {
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 11px;
    font-size: 0;
    gap: 0;
  }
}

/* 02.10.2026: native masthead above a separate Menu / Login row.
   Both existing DOM variants remain supported. Links and menu logic are unchanged. */
.pr-navigation {
  position:relative !important;
  padding:0 !important;
  background:#fff !important;
  color:#2a3540;
}
.pr-navigation .pr-nav-inner {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:0 !important;
  height:auto !important;
  min-height:70px !important;
  max-width:none !important;
  padding:0 !important;
}
.pr-navigation .pr-nav-inner > .pr-compact-brand {
  grid-column:1 / -1 !important;
  grid-row:1 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  max-width:none !important;
  min-height:0 !important;
  height:auto !important;
  padding:28px clamp(20px,5vw,56px) 24px !important;
  gap:14px !important;
  background:linear-gradient(110deg,var(--masthead-start,#eeebf7),var(--masthead-end,#e3def2));
  color:#1c3f4d !important;
}
.pr-navigation .pr-compact-brand > svg,
.pr-navigation .pr-compact-brand > .pr-compact-symbol {
  width:40px !important; height:40px !important; flex:0 0 40px !important;
}
.pr-navigation .pr-compact-brand .brand-symbol-ring { stroke:#1c3f4d; }
.pr-navigation .pr-compact-brand .brand-symbol-dot,
.pr-navigation .pr-compact-brand .pr-compact-dot { fill:var(--link,#564596); }
/* Reuse the published native vector lockup, so glyphs and tagline match every surface. */
.pr-navigation .pr-compact-brand .pr-compact-lockup {
  display:block !important; width:360px !important; max-width:100% !important;
  height:auto !important; aspect-ratio:360/58; flex:0 0 auto !important;
  background:url("https://praxis-rivoir.de/praxis-wortmarke.svg?v=0f9c7c6e4d58") center/contain no-repeat;
}
.pr-navigation .pr-compact-brand .pr-compact-wordmark,
.pr-navigation .pr-compact-brand .pr-compact-tagline { display:none !important; }
.pr-navigation .pr-compact-brand > .brand-wordmark {
  display:block !important; width:360px !important; max-width:100% !important;
  height:auto !important; aspect-ratio:360/58;
}
.pr-navigation .pr-nav-inner > .pr-menu { grid-column:1 !important; grid-row:1; margin:12px clamp(20px,5vw,56px) !important; }
.pr-navigation .pr-nav-inner > .pr-nav-end,
.pr-navigation .pr-nav-inner > .pr-account-link {
  grid-column:2 !important; grid-row:1; justify-self:end; margin:12px clamp(20px,5vw,56px) !important;
}
.pr-navigation .pr-nav-inner:has(.pr-compact-brand) > .pr-menu,
.pr-navigation .pr-nav-inner:has(.pr-compact-brand) > .pr-nav-end,
.pr-navigation .pr-nav-inner:has(.pr-compact-brand) > .pr-account-link { grid-row:2 !important; }
.pr-navigation .pr-nav-end { min-width:0; gap:0; }
.pr-navigation .pr-nav-end > .palette-menu,
.pr-navigation .pr-nav-end > .identity-palette { display:none !important; }
.pr-navigation .pr-menu > summary,
.pr-navigation .pr-account-link {
  position:relative; display:inline-flex; flex-direction:row !important; align-items:center; justify-content:center;
  min-width:108px !important; width:auto !important; height:46px !important; min-height:46px !important;
  padding:10px 12px !important; gap:8px !important; font-size:13px; border-radius:24px;
}
.pr-navigation .pr-menu > summary > .pr-menu-label,
.pr-navigation .pr-account-link > span:not([data-konto-name]):not(.pr-ein-kurz) { display:inline !important; }
.pr-navigation .pr-menu > summary > .pr-menu-label-open { display:none !important; }
.pr-navigation .pr-menu[open] > summary > .pr-menu-label { display:none !important; }
.pr-navigation .pr-menu[open] > summary > .pr-menu-label-open { display:inline !important; margin-left:28px; }
.pr-navigation .pr-menu > summary > .pr-menu-icon { display:block; width:20px; height:20px; }
.pr-navigation .pr-menu[open] > summary > .pr-menu-icon { display:none !important; }
.pr-navigation .pr-menu[open] > summary::before,
.pr-navigation .pr-menu[open] > summary::after {
  content:""; display:block; position:absolute; top:calc(50% - 1px); left:12px;
  width:20px; height:2px; border-radius:1px; background:currentColor; transform:rotate(45deg);
}
.pr-navigation .pr-menu[open] > summary::after { transform:rotate(-45deg); }
/* Calm, generous menu rows; preserve every existing link, ID and ARIA attribute. */
.pr-navigation .pr-menu-panel { padding:24px clamp(20px,5vw,56px); background:#fffdff; border:0; border-top:1px solid #ddd5e8; border-radius:0 0 12px 12px; }
.pr-navigation .pr-menu-heading { margin-bottom:18px; border-bottom:1px solid #e9e2ef; }
.pr-navigation .pr-menu-group h2,
.pr-navigation .pr-menu-group h3 { margin:0 0 8px; padding:0 12px; color:#79668c; font-size:12px; font-weight:500; letter-spacing:.08em; }
.pr-navigation .pr-menu-group ul { display:flex; flex-direction:column; gap:2px; margin:0; padding:0; list-style:none; }
.pr-navigation .pr-menu-group a,
.pr-navigation .pr-menu-services > a,
.pr-navigation .pr-menu-service a {
  display:flex; align-items:center; min-height:44px; padding:10px 12px;
  border:0; border-radius:8px; background:transparent; color:#42374f; font-size:14px; line-height:1.5;
}
.pr-navigation .pr-menu-group a:hover,
.pr-navigation .pr-menu-services > a:hover,
.pr-navigation .pr-menu-service a:hover { background:#f1ebf8; color:#564596; text-decoration:none; }
@container praxis-navigation (max-width:360px) {
  .pr-navigation .pr-nav-inner > .pr-menu,
  .pr-navigation .pr-nav-inner > .pr-nav-end,
  .pr-navigation .pr-nav-inner > .pr-account-link {
    margin:12px !important;
    min-width:0;
    max-width:calc(100% - 24px);
  }
  .pr-navigation .pr-menu > summary,
  .pr-navigation .pr-account-link { max-width:100%; }
}
@media print { .pr-navigation { display:none !important; } }

/* Native palette styles shared with standalone practice pages. */
:where(.pr-navigation) .palette-menu { position: relative; width: fit-content; max-width: 100%; margin: 0; }
:where(.pr-navigation) .palette-menu > summary { display: grid; place-items: center; width: 44px; min-height: 44px; border-radius: 50%; list-style: none; }
:where(.pr-navigation) .palette-menu > summary::-webkit-details-marker { display: none; }
:where(.pr-navigation) .palette-menu > summary::marker { content: ""; }
:where(.pr-navigation) .palette-current-ring { position: relative; }
:where(.pr-navigation) .palette-current-ring::after { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; transform: translate(-50%,-50%); border-radius: 50%; pointer-events: none; background: var(--link); box-shadow: none; }
:where(.pr-navigation) .palette-current-ring .brand-symbol-ring { stroke: #1c3f4d; }
:where(.pr-navigation) .palette-current-ring .brand-symbol-dot { fill: transparent; stroke: transparent; }
:where(.pr-navigation) .palette-picker { position: absolute; left: 50%; top: calc(100% + 12px); transform: translateX(-50%); z-index: 25; width: min(352px,calc(100vw - 40px)); max-height: min(690px,calc(100dvh - 132px)); overflow-y: auto; overscroll-behavior: contain; padding: 16px 18px; background: #fff; color: var(--ink); text-align: left; border: 1px solid #d4dfe3; border-radius: 16px; box-shadow: 0 12px 36px #16242b1c; }
:where(.pr-navigation) .palette-heading { position: sticky; top: -16px; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; background: #fff; padding-block: 0 8px; }
:where(.pr-navigation) .palette-heading h2 { flex: 1; min-width: 0; padding-block: 8px; font: 600 1rem/1.4 var(--font,system-ui,sans-serif); letter-spacing: 0; text-wrap: balance; }
:where(.pr-navigation) .palette-close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border: 0; background: #fff; color: #52616b; border-radius: 50%; }
:where(.pr-navigation) .palette-close:hover { background: #f5f8f9; }
:where(.pr-navigation) .palette-wheel { --wheel-light: 50%; position: relative; width: min(200px,calc(100% - 16px)); aspect-ratio: 1; margin: 8px auto 15px; border-radius: 50%; cursor: crosshair; touch-action: none; background: radial-gradient(circle closest-side,hsl(0 0% var(--wheel-light)),transparent),conic-gradient(hsl(0 100% var(--wheel-light)),hsl(60 100% var(--wheel-light)),hsl(120 100% var(--wheel-light)),hsl(180 100% var(--wheel-light)),hsl(240 100% var(--wheel-light)),hsl(300 100% var(--wheel-light)),hsl(360 100% var(--wheel-light))); box-shadow: 0 0 0 1px #d4dfe3; }
:where(.pr-navigation) .palette-wheel-marker { position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; transform: translate(-50%,-50%); border: 2px solid #fff; border-radius: 50%; background: var(--palette-selected,var(--accent)); box-shadow: 0 0 0 1px #16242b99,0 1px 5px #16242b55; pointer-events: none; }
:where(.pr-navigation) .palette-choices { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0 4px; margin-bottom: 8px; }
:where(.pr-navigation) .palette-choice { display: grid; place-items: center; min-height: 44px; min-width: 0; padding: 8px; border: 0; background: transparent; border-radius: 8px; }
:where(.pr-navigation) .palette-ring { display: block; width: 23px; height: 23px; border: 3px solid #fff; border-radius: 50%; background: var(--swatch); box-shadow: 0 0 0 1px #d4dfe3; }
:where(.pr-navigation) .palette-choice[aria-pressed="true"] .palette-ring { outline: 2px solid #52616b; outline-offset: 3px; }
:where(.pr-navigation) .palette-control { display: grid; grid-template-columns: 82px minmax(0,1fr) 42px; gap: 8px; align-items: center; min-height: 44px; font-size: .875rem; color: #52616b; }
:where(.pr-navigation) .palette-control input { min-width: 0; width: 100%; height: 44px; margin: 0; accent-color: var(--link); cursor: pointer; }
:where(.pr-navigation) .palette-control output { text-align: right; font-size: .75rem; font-variant-numeric: tabular-nums; }
:where(.pr-navigation) .palette-hex-row { display: grid; grid-template-columns: minmax(0,1fr) 96px 44px; gap: 8px; align-items: center; padding-top: 12px; margin-top: 8px; border-top: 1px solid #d4dfe3; font-size: .875rem; color: #52616b; }
:where(.pr-navigation) #palette-hex { width: 100%; min-width: 0; height: 44px; border: 1px solid #d4dfe3; border-radius: 6px; padding: 7px; background: #fff; color: #2a3540; font: 1rem/1.5 var(--font,system-ui,sans-serif); text-align: center; }
:where(.pr-navigation) #palette-native { display: block; width: 44px; height: 44px; padding: 4px; border: 1px solid #d4dfe3; border-radius: 6px; background: #fff; cursor: pointer; }
:where(.pr-navigation) #palette-hex[aria-invalid="true"] { border-color: #9f374d; }
:where(.pr-navigation) .palette-error { margin-top: 6px; color: #9f374d; font-size: .75rem; line-height: 1.5; }
:where(.pr-navigation) .palette-reset { display: block; min-height: 44px; margin-top: 8px; padding: 6px 0; border: 0; background: transparent; color: var(--link); font-size: .875rem; font-weight: 500; text-align: left; }
:where(.pr-navigation) .palette-fine { margin-top: 8px; border-top: 1px solid #d4dfe3; }
:where(.pr-navigation) .palette-fine > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; color: #52616b; font-size: .875rem; list-style: none; }
:where(.pr-navigation) .palette-fine > summary::-webkit-details-marker { display: none; }
:where(.pr-navigation) .palette-fine > summary::after { content: "+"; font-size: 1.125rem; }
:where(.pr-navigation) .palette-fine[open] > summary::after { content: "−"; }
:where(.pr-navigation) .palette-picker input:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
@media (max-height: 640px) { :where(.pr-navigation) .palette-wheel { width: min(154px,calc(100% - 16px)); } }

/* The same circle/palette behaviour on every shared practice header. */
.pr-navigation .pr-palette-launch {
  display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px;
  min-width:44px; min-height:44px; margin:0; padding:2px; border:0; border-radius:50%;
  background:transparent; color:inherit; cursor:pointer;
}
.pr-navigation .pr-palette-launch > svg,
.pr-navigation .pr-palette-launch > .brand-ring { display:block; width:40px; height:40px; }
.pr-navigation .pr-palette-launch[aria-expanded="true"] {
  background:radial-gradient(circle,var(--pr-flaeche,#fff) 0 57%,transparent 59%),
    conic-gradient(#d86976,#efaa69,#f2cd59,#80b382,#72b7c4,#738bd2,#aa7cc0,#d86976);
}
.pr-navigation .pr-palette-launch[aria-expanded="true"] > svg circle:first-child { stroke:transparent; }
.pr-navigation .pr-palette-launch:focus-visible,
.pr-navigation .pr-brand-home:focus-visible { outline:2px solid var(--pr-akzent,#564596); outline-offset:4px; }
.pr-navigation .pr-brand-home {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:360px; max-width:100%; min-height:44px; color:inherit; text-decoration:none;
}
.pr-navigation .pr-brand-home > .brand-wordmark { display:block; width:360px; max-width:100%; height:auto; }
@media (forced-colors:active) {
  .pr-navigation .pr-palette-launch[aria-expanded="true"] { background:ButtonFace; outline:2px solid Highlight; }
  .pr-navigation .pr-palette-launch[aria-expanded="true"] > svg circle:first-child { stroke:ButtonText; }
}
@media print { .pr-navigation .pr-palette-launch { pointer-events:none; } }
.pr-build-signature { display:flex; flex-direction:column; align-items:center; gap:4px; margin:12px 0 0; font:12px/1.5 system-ui,sans-serif; color:var(--muted,#52616b); }
.pr-build-signature strong { font-size:14px; font-weight:500; letter-spacing:.04em; color:var(--ink,#2a3540); }
.pr-build-dots { display:flex; gap:4px; margin-top:3px; }
.pr-build-dots i { width:5px; height:5px; border-radius:50%; background:#d86976; }
.pr-build-dots i:nth-child(2) { background:#efaa69; }
.pr-build-dots i:nth-child(3) { background:#f2cd59; }
.pr-build-dots i:nth-child(4) { background:#80b382; }
.pr-build-dots i:nth-child(5) { background:#72b7c4; }
.pr-build-dots i:nth-child(6) { background:#738bd2; }
.pr-build-dots i:nth-child(7) { background:#aa7cc0; }

/* The account masthead's existing native circle uses the same palette state. */
.pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch] {
  display:grid; place-items:center; width:44px; height:44px;
  min-width:44px; min-height:44px; margin:0; padding:2px;
  border:0; border-radius:50%; background:transparent; color:inherit; cursor:pointer;
}
.pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch] > svg {
  display:block; width:40px; height:40px;
}
.pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch][aria-expanded="true"] {
  background:radial-gradient(circle,var(--pr-flaeche,#fff) 0 57%,transparent 59%),
    conic-gradient(#d86976,#efaa69,#f2cd59,#80b382,#72b7c4,#738bd2,#aa7cc0,#d86976);
}
.pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch][aria-expanded="true"] > svg .brand-symbol-ring {
  stroke:transparent;
}
.pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch]:focus-visible {
  outline:2px solid var(--pr-akzent,#564596); outline-offset:4px;
}
@media (forced-colors:active) {
  .pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch][aria-expanded="true"] {
    background:ButtonFace; outline:2px solid Highlight;
  }
  .pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch][aria-expanded="true"] > svg .brand-symbol-ring {
    stroke:ButtonText;
  }
}
@media print {
  .pr-shared-header .pr-shared-circle > button.pr-palette-launch[data-praxis-palette-launch] { pointer-events:none; }
}

/* Hide only the summary whose existing external account button is bound. */
.pr-navigation .palette-menu.pr-palette-bound > summary { display:none; }