.sanc-tabs { display: none; }
@media (max-width: 640px) {
html.is-signed-in body:not(:has(.dash)) .sanc-tabs, .dash[data-state="in"] .sanc-tabs { position: fixed; z-index: 50; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); display: flex; justify-content: space-around; align-items: center; padding: 7px; border-radius: 24px; background: #16181a; box-shadow: 0 14px 30px -10px rgba(14, 15, 16, .65), 0 0 0 1px #2a2d31; view-transition-name: sanc-tabs; }
html[data-theme="dark"] .sanc-tabs { background: #f5f6f6 !important; box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .8) !important; }
.sanc-tabs > * { position: relative; display: flex; align-items: center; gap: 6px; height: 44px; min-width: 44px; justify-content: center; padding: 0 10px; border: 0; border-radius: 999px; background: none; color: #a0a3a7; font: 900 12px/1 var(--body); text-decoration: none; cursor: pointer; transition: background .25s var(--ease), color .25s; }
html[data-theme="dark"] .sanc-tabs > * { color: #414448; }
.sanc-tabs svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sanc-tabs span { display: none; }
.sanc-tabs .is-on { padding: 0 14px; background: var(--lime); color: #16181a !important; }
.sanc-tabs .is-on span { display: inline; }
.sanc-tabs > *:active { transform: scale(.94); }
.sanc-tabs-dot { position: absolute; top: 8px; right: 8px; width: 9px; height: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 2px #16181a; }
html[data-theme="dark"] .sanc-tabs-dot { background: #16181a; box-shadow: 0 0 0 2px #f5f6f6; }
.sanc-tabs-dot[hidden] { display: none; }
html.is-signed-in body:not(:has(.dash)), body.sanc-app:has(.dash[data-state="in"]) { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
html.is-signed-in body:not(:has(.dash)) .pod:not(.is-docked), body:has(.dash[data-state="in"]) .pod:not(.is-docked) { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
html.is-signed-in body:not(:has(.dash)) .toast { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}
@view-transition { navigation: auto; }
.site-head { view-transition-name: site-head; }
::view-transition-old(root) { animation: sanc-page-out .28s cubic-bezier(.4, 0, .2, 1) both; }
::view-transition-new(root) { animation: sanc-page-in .36s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes sanc-page-out { to { opacity: 0; transform: translateX(-24px); } }
@keyframes sanc-page-in { from { opacity: 0; transform: translateX(32px); } }
@media (prefers-reduced-motion: reduce) {
@view-transition { navigation: none; }
::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
.sanc-tabs > [hidden] { display: none !important; }
@media (max-width: 640px) {
.sanc-tabs { isolation: isolate; }
.sanc-tabs > :not(.sanc-tabs-blob) { flex: 1 1 0; min-width: 44px; gap: 0; padding: 0 8px; overflow: hidden; z-index: 1; transition: flex-grow .6s cubic-bezier(.32, .72, 0, 1), color .3s, transform .2s; }
.sanc-tabs > .is-on { flex-grow: 2.1; padding: 0 12px; }
.sanc-tabs span { display: block; max-width: 0; margin-left: 0; opacity: 0; white-space: nowrap; overflow: hidden; transition: max-width .6s cubic-bezier(.32, .72, 0, 1), margin-left .6s cubic-bezier(.32, .72, 0, 1), opacity .2s; }
.sanc-tabs .is-on span { display: block; max-width: 6em; margin-left: 6px; opacity: 1; transition: max-width .6s cubic-bezier(.32, .72, 0, 1), margin-left .6s cubic-bezier(.32, .72, 0, 1), opacity .3s .14s; }
.sanc-tabs > .sanc-tabs-blob { position: absolute; z-index: 0; top: 7px; left: 0; flex: none; width: 0; height: 44px; min-width: 0; padding: 0; border-radius: 999px; background: var(--lime); pointer-events: none; will-change: transform, width; }
.sanc-tabs.has-blob > .is-on { background: none; }
.sanc-tabs.has-blob > .is-on, .sanc-tabs.has-blob > :not(.is-on):not(.sanc-tabs-blob) { transition-property: flex-grow, color, transform; }
}
@media (prefers-reduced-motion: reduce) { .sanc-tabs > *, .sanc-tabs span { transition: none !important; } }