.crumbbar { gap: 12px; }
.crumbbar .cb-trail { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.crumbbar .cb-back { display: none; align-items: center; gap: 4px; min-width: 0; color: var(--ink-2); }
.crumbbar .cb-back svg { width: 14px; height: 14px; flex: none; stroke: currentColor; }
.crumbbar .pal-open { margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 28px; padding: 0 8px 0 10px; border: 1px solid var(--line); border-radius: var(--r); background: transparent; color: var(--ink-3); font: inherit; font-size: 12px; letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color var(--hover-dur) var(--ease-out), color var(--hover-dur) var(--ease-out), border-color var(--hover-dur) var(--ease-out); }
.crumbbar .pal-open:hover { background: var(--accent-soft); color: var(--ink); }
.crumbbar .pal-open:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.crumbbar .pal-open svg { width: 14px; height: 14px; flex: none; stroke: currentColor; }
.crumbbar .pal-open kbd { padding: 0 5px; border: 1px solid var(--line); border-radius: var(--r); font: 400 12px/18px var(--mono); color: var(--ink-3); }
.appbar .pal-ab { display: none; }

.secnav { margin: 4px 0 14px; min-width: 0; max-width: 100%; }
.sc-chips, .sc-subs { position: relative; max-width: 100%; }
.sc-chips, .sc-subs { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 6px; }
.sc-chips { flex-wrap: wrap; }
.sc-chips li, .sc-subs li { display: flex; }
.sc-chips .sep { width: 1px; height: 18px; margin: 0 4px; background: var(--line-2); }
.secnav:not(.has-sub) .sc-chips .sep { width: 10px; margin: 0; background: transparent; }
.nchip { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r); background: transparent; color: var(--ink-2); font-size: 13px; line-height: 20px; text-decoration: none; white-space: nowrap; transition: background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), scale var(--duration-quick) var(--ease-smooth-out); }
.nchip svg { width: 16px; height: 16px; flex: none; stroke: currentColor; }
.nchip:hover { background: var(--accent-soft); color: var(--ink); }
.nchip.on { border-color: var(--ink); color: var(--ink); font-weight: 600; }
.nchip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.nchip .n { min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--warn-soft); color: var(--warn-ink); font-size: 12px; font-weight: 600; line-height: 18px; text-align: center; }
html[data-theme^="standard"] .nchip { border-radius: 999px; }
html[data-theme^="standard"] .nchip.on { background: var(--accent-soft); }

.secnav.has-sub .sc-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 0; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
.secnav.has-sub .sc-chips::-webkit-scrollbar { display: none; }
.secnav.has-sub .sc-chips li { position: relative; flex: none; }
.sc-subs { position: relative; margin-top: 26px; padding-top: 0; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
.sc-subs::-webkit-scrollbar { display: none; }
.sc-subs li { flex: none; }
.stab { display: inline-flex; align-items: center; min-height: 30px; padding: 0 11px; border: 1px solid var(--line); border-radius: var(--r); background: transparent; color: var(--ink-2); font-size: 13px; line-height: 20px; text-decoration: none; white-space: nowrap; transition: color var(--duration-fast) var(--ease-out), background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), scale var(--duration-quick) var(--ease-smooth-out); }
.stab:hover { color: var(--ink); background: var(--accent-soft); }
.stab.on { color: var(--ink); font-weight: 600; border-color: var(--ink); }
html[data-theme^="standard"] .stab { border-radius: 999px; }
html[data-theme^="standard"] .stab.on { background: var(--accent-soft); }
.stab:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
html:not([data-theme^="standard"]) .stab.on { color: var(--accent); border-color: var(--accent); }
html:not([data-theme^="standard"]) .nchip.on { border-color: var(--accent); color: var(--accent); }

@media (max-width: 639px) {
  .crumbbar .cb-trail { display: none; }
  .crumbbar .cb-back { display: inline-flex; }
  .crumbbar:not(:has(.cb-back)) { display: none; }
  .crumbbar .pal-open { margin-left: auto; padding: 0 10px; }
  .crumbbar .pal-open kbd, .crumbbar .pal-open .pal-t { display: none; }
  .secnav { margin: 0 0 12px; }
  .sc-chips, .secnav.has-sub .sc-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 0; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
  .sc-chips::-webkit-scrollbar { display: none; }
  .sc-chips li { flex: none; }
  .sc-subs { margin-top: 8px; }
  .nchip { min-height: 36px; }
  .stab { min-height: 36px; }
}

.nv .ct.attn i { background: var(--warn); }
.nv .ct.attn { gap: 5px; color: var(--ink-2); }

.sc-grp { margin: 0 0 24px; }
.sc-grp .sec-h { margin: 0 0 12px; }
.sc-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.sc-cards li { display: flex; }
.sc-card { flex: 1; display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-content: start; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--surface); color: var(--ink); text-decoration: none; transition: background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), scale var(--duration-quick) var(--ease-smooth-out); }
.sc-card:hover { background: var(--accent-soft); border-color: var(--line-2); color: var(--ink); transition-duration: var(--hover-dur), var(--hover-dur), var(--duration-quick); }
.sc-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sc-ico { grid-row: 1 / span 2; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: var(--r); }
.sc-ico svg { width: 16px; height: 16px; stroke: var(--ink-2); }
.sc-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sc-t b { font-size: 15px; line-height: 22px; font-weight: 600; }
.sc-t small { font-size: 13px; line-height: 18px; color: var(--ink-2); }
.sc-card .cnt { grid-column: 2; font-size: 13px; line-height: 18px; color: var(--ink-3); }
.sc-card .cnt b { font-weight: 600; color: var(--ink-2); }
.sc-card .cnt.warn, .sc-card .cnt.warn b { color: var(--warn-ink); }
.sc-card .cnt.warn::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--warn); vertical-align: 1px; }

.flt { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 16px; }
.flt .flt-l { margin-right: 4px; font-size: 12px; color: var(--ink-3); }
.flt a { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r); color: var(--ink-2); font-size: 12px; font-weight: 500; text-decoration: none; transition: background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), scale var(--duration-quick) var(--ease-smooth-out); }
.flt a:hover { background: var(--accent-soft); color: var(--ink); }
.flt a .n { color: var(--ink-3); font-weight: 400; }
.flt a.on, .an-seg a[aria-current=true] { border-color: var(--ink); color: var(--ink); font-weight: 600; background: var(--accent-soft); }
.flt a.on::before, .an-seg a[aria-current=true]::before { content: ""; width: 4px; height: 8px; margin: -2px 6px 0 0; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.flt a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
html[data-theme^="standard"] .flt a { border-radius: 999px; }
html:not([data-theme^="standard"]) .flt a.on { border-color: var(--accent); color: var(--accent); }
:is(.nchip, .stab, .flt a):hover { transition-duration: var(--hover-dur), var(--hover-dur), var(--hover-dur), var(--duration-quick); }
@media (prefers-reduced-motion: no-preference) {
  :is(.nchip, .stab, .flt a):active:not(:focus-visible) { scale: .96; }
  .sc-card:active:not(:focus-visible) { scale: .98; }
}

.pal { position: fixed; inset: 0; z-index: 90; display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; }
.pal[hidden] { display: none; }
.pal-scrim { position: absolute; inset: 0; background: var(--scrim); opacity: 0; transition: opacity var(--modal-close-dur) var(--modal-ease); }
.pal-box { position: relative; width: min(640px, 100%); max-height: min(560px, 76vh); display: flex; flex-direction: column; border: 1px solid var(--line-2); border-radius: var(--r-panel); background: var(--bg); box-shadow: var(--shadow); opacity: 0; scale: var(--modal-scale); transform-origin: var(--pal-o, 50% 0); transition: opacity var(--modal-close-dur) var(--modal-ease), scale var(--modal-close-dur) var(--modal-ease); }
.pal.is-open .pal-scrim { opacity: 1; transition-duration: var(--modal-open-dur); }
.pal.is-open .pal-box { opacity: 1; scale: 1; transition-duration: var(--modal-open-dur); }
.pal.is-instant :is(.pal-scrim, .pal-box) { transition: none; }
.pal-in { display: flex; align-items: center; gap: 10px; padding: 0 14px; border-bottom: 1px solid var(--line); }
.pal-in svg { width: 16px; height: 16px; flex: none; stroke: var(--ink-3); }
.pal .pal-in input, .pal .pal-in input:focus, .pal .pal-in input:focus-visible { flex: 1; min-width: 0; height: 48px; min-height: 48px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: 15px; outline: none; box-shadow: none; text-transform: none; letter-spacing: 0; }
.pal-in input::placeholder { color: var(--ink-3); }
.pal-in:focus-within { box-shadow: inset 0 -2px 0 var(--accent); }
.pal kbd { padding: 0 5px; border: 1px solid var(--line); border-radius: var(--r); font: 400 12px/18px var(--mono); color: var(--ink-3); }
.pal-list { list-style: none; margin: 0; padding: 6px; overflow-y: auto; overscroll-behavior: contain; }
.pal-g { padding: 10px 10px 4px; font-size: 12px; font-weight: 600; color: var(--ink-3); }
.pal-o { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; padding: 0 10px; border-radius: var(--r); color: var(--ink); font-size: 14px; cursor: pointer; }
.pal-o[aria-selected="true"] { background: var(--accent-soft); box-shadow: inset 2px 0 0 var(--ink); }
.pal-l { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal-m { flex: none; font-size: 12px; color: var(--ink-3); }
.pal-empty { padding: 20px 10px; color: var(--ink-3); font-size: 14px; }
.pal-foot { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; padding: 8px 14px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3); }
html:not([data-theme^="standard"]) .pal-o[aria-selected="true"] { box-shadow: inset 2px 0 0 var(--accent); }

@media (max-width: 1023px) { .appbar .pal-ab { display: inline-flex; } .crumbbar .pal-open { display: none; } }
@media (max-width: 639px) { .pal { padding-top: 8vh; } .pal-foot { display: none; } }
@media (prefers-reduced-motion: reduce) { .pal-scrim, .pal-box, .nchip, .stab, .sc-card, .flt a { transition: none !important; } }
.side-tg { display: none; }
.side-tip { position: fixed; z-index: 80; left: 0; top: 0; padding: 4px 8px; border-radius: var(--r); background: var(--ink); color: var(--bg); font-size: 12px; line-height: 16px; white-space: nowrap; pointer-events: none; opacity: 0; transform: translate(-4px, -50%); transition: opacity var(--tt-out-dur) var(--ease-smooth-out), transform var(--tt-out-dur) var(--ease-smooth-out); }
.side-tip.on { opacity: 1; transform: translate(0, -50%); transition: opacity var(--tt-in-dur) var(--ease-smooth-out) var(--tt-delay), transform var(--tt-in-dur) var(--ease-smooth-out) var(--tt-delay); }
.side-tip.is-moving { transition: none; }
@media (min-width: 1024px) {
  .side-tg { position: absolute; top: 20px; right: 12px; display: inline-grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid transparent; border-radius: var(--r); background: transparent; color: var(--ink-3); cursor: pointer; transition: color var(--hover-dur) var(--ease-out), background-color var(--hover-dur) var(--ease-out); }
  .side-tg:hover { color: var(--ink); background: var(--accent-soft); }
  .side-tg:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .side-tg svg { width: 16px; height: 16px; fill: none; stroke: currentColor; }
  .brand { padding-right: 40px; }
  html.side-anim .app { transition: grid-template-columns var(--side-dur) var(--ease-smooth-out); }
  html[data-side="min"] { --side-w: 64px; }
  html[data-side="min"] .side { padding-left: 8px; padding-right: 8px; }
  html[data-side="min"] .brand { justify-content: center; padding: 0; }
  html[data-side="min"] .side-tg { position: static; margin: 10px auto 0; }
  html[data-side="min"] :is(.brand > span:not(.logo), .nv > span:not(.ct), .me .who) { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  html[data-side="min"] .nv { position: relative; justify-content: center; gap: 0; padding-left: 0; padding-right: 0; }
  html[data-side="min"] .nv .ct { display: none; }
  html[data-side="min"] .nv .ct.attn, html[data-side="min"] .nv .ct[title="Unread messages"] { display: inline-flex; position: absolute; top: 2px; right: 2px; min-width: 18px; height: 18px; margin: 0; padding: 0 4px; justify-content: center; border-radius: 9px; background: var(--bg); box-shadow: 0 0 0 1px var(--line-2); color: var(--ink); font-size: 12px; line-height: 18px; }
  html[data-side="min"] .nv .ct.attn i { display: none; }
  html[data-side="min"] .me { justify-content: center; padding-left: 0; padding-right: 0; }
  html[data-side="min"] .me > svg { display: none; }
}
@media (prefers-reduced-motion: reduce) { html.side-anim .app, .side-tip, .side-tg { transition: none !important; } }
.secnav.has-sub { position: relative; }
.sc-flow { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.sc-flow path { fill: none; stroke-width: 1; shape-rendering: crispEdges; }
.sc-flow .base { stroke: var(--line-2); }
.sc-flow .on { stroke: var(--ink); }
html:not([data-theme^="standard"]) .sc-flow .on { stroke: var(--accent); }
html:not(.js) .secnav.has-sub .sc-subs { margin-top: 10px; }
@media (max-width: 639px) { .sc-flow { display: none; } }
.nav-flat { display: flex; flex-direction: column; gap: 4px; }
