.app-shell{--chrome-grid-columns: minmax(0, 1fr) auto minmax(0, 1fr);--chrome-inline-gutter: var(--space-6);--chrome-surface: transparent;--chrome-backdrop: blur(var(--space-3)) saturate(1.08);--chrome-divider: color-mix(in oklab, var(--line) 72%, transparent);--app-chrome-height: calc( var(--header-height) + var(--context-stack-height, 0px) );--app-persistent-chrome-height: calc( var(--header-height) + var(--context-persistent-height, 0px) );display:flex;flex-direction:column;min-height:100vh}.app-shell>main{flex:1}.skip-link{position:absolute;top:calc(var(--space-4) * -10);left:var(--space-4);z-index:var(--z-toast);padding:var(--space-3) var(--space-5);border:1px solid var(--line-strong);border-radius:var(--radius-surface);background:var(--surface);font-size:var(--text-xs);text-decoration:none;transition:top var(--duration-base) var(--ease-out)}.skip-link:focus-visible{top:var(--space-4)}.app-chrome{--chrome-edge-inset: .5rem;--chrome-edge-outset: 1rem;--chrome-edge-fade: calc( var(--chrome-edge-inset) + var(--chrome-edge-outset) );position:sticky;top:0;z-index:var(--z-header);height:var(--header-height);min-height:var(--header-height)}.app-chrome:before{content:"";position:absolute;inset-inline:0;top:0;z-index:0;height:calc(100% + var(--chrome-edge-outset));background:transparent;pointer-events:none;-webkit-backdrop-filter:var(--chrome-backdrop);backdrop-filter:var(--chrome-backdrop);-webkit-mask-image:linear-gradient(to bottom,var(--ink) 0 calc(100% - var(--chrome-edge-fade)),color-mix(in oklab,var(--ink) 48%,transparent) calc(100% - .75rem),color-mix(in oklab,var(--ink) 14%,transparent) calc(100% - .25rem),transparent 100%);mask-image:linear-gradient(to bottom,var(--ink) 0 calc(100% - var(--chrome-edge-fade)),color-mix(in oklab,var(--ink) 48%,transparent) calc(100% - .75rem),color-mix(in oklab,var(--ink) 14%,transparent) calc(100% - .25rem),transparent 100%)}.app-chrome[data-context-layout=overlay]:before{height:calc(100% + var(--context-stack-height) + var(--chrome-edge-outset))}.app-chrome[data-context-layout=flow]{display:grid;grid-template-rows:var(--header-height) auto;height:auto}.app-chrome>.site-header,.app-chrome>.context-stack{z-index:1;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.site-header{position:relative;height:var(--header-height);background:var(--chrome-surface);transition:background-color var(--duration-base) var(--ease-out)}.app-chrome.is-condensed:has(.context-stack) .site-header{box-shadow:none}.app-chrome--over-hero .site-header{background:transparent;box-shadow:none}.app-chrome--over-hero.is-condensed .site-header{box-shadow:none}.site-header__inner{display:grid;grid-template-columns:var(--chrome-grid-columns);align-items:center;column-gap:var(--space-6);width:100%;max-width:var(--width-full);height:100%;padding-inline:var(--chrome-inline-gutter);margin-inline:auto}.site-header__inner[data-product-context=true]{grid-template-columns:minmax(0,1fr) auto}.site-header__context{display:flex;align-items:center;gap:var(--space-3);min-width:0}.site-header__navigation-slot{display:flex;align-items:center;justify-content:center;justify-self:center;min-width:0}.site-header__inner[data-product-context=true] .site-header__navigation-slot{display:none}.site-header__utilities{display:flex;align-items:center;justify-content:flex-end;justify-self:end;gap:var(--space-3);width:max-content;min-width:0}.site-brand{display:inline-flex;flex:none;align-items:center;gap:var(--space-2);color:var(--ink);font-size:var(--text-lg);font-weight:var(--weight-semibold);letter-spacing:var(--track-tight);text-decoration:none;white-space:nowrap}.site-brand-mark{display:inline-flex;align-items:center;justify-content:center;width:var(--space-7);height:var(--space-7);color:var(--ink)}.site-brand-mark svg{width:100%;height:100%;fill:currentColor}.site-context-trail{display:flex;flex:1;align-items:center;gap:var(--space-2);min-width:0}.site-context-trail__separator{flex:none;width:var(--space-4);height:var(--space-4);fill:none;stroke:var(--ink-faint);stroke-linecap:round;stroke-linejoin:round;stroke-width:var(--stroke-width)}.site-origin-context,.site-product-context{display:flex;min-width:0;align-items:center;gap:var(--space-2);font-size:var(--text-lg);letter-spacing:var(--track-tight);white-space:nowrap}.site-origin-context{flex:0 1 auto;color:var(--ink-muted);font-weight:var(--weight-medium);text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}.site-origin-context:hover{color:var(--ink)}.site-product-context{flex:0 1 auto;color:var(--ink);font-weight:var(--weight-semibold)}.site-origin-context__icon{position:relative;display:grid;flex:0 0 var(--space-7);width:var(--space-7);min-width:var(--space-7);max-width:var(--space-7);height:var(--space-7);min-height:var(--space-7);max-height:var(--space-7);overflow:hidden;place-items:center;border-radius:var(--radius-surface);background:var(--surface-sunken)}.site-origin-context__icon[data-kind=profile]{border-radius:var(--radius-circle)}.site-origin-context__fallback{color:var(--ink-muted);font-size:var(--text-2xs);font-weight:var(--weight-semibold)}.site-origin-context__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.site-product-context__icon{flex:0 0 var(--space-6);width:var(--space-6);min-width:var(--space-6);max-width:var(--space-6);height:var(--space-6);min-height:var(--space-6);max-height:var(--space-6);border-radius:var(--radius-surface)}.site-origin-context__name,.site-product-context__name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.site-hub-membership{display:inline-flex;flex:none;align-items:center;padding:var(--space-1) var(--space-2);border-radius:var(--radius-surface);background:var(--ink);color:var(--ink-inverse);font-size:var(--text-2xs);font-weight:var(--weight-normal);letter-spacing:var(--track-wide);line-height:var(--leading-none)}.site-navigation{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:var(--space-1);padding:var(--space-1);border-radius:var(--radius-surface);background:var(--surface-sunken);transition:background-color var(--duration-base) var(--ease-out),opacity var(--duration-base) var(--ease-out),visibility var(--duration-base) var(--ease-out)}.site-navigation:before{content:"";position:absolute;inset-block:var(--space-1);left:var(--space-1);z-index:var(--z-base);width:calc((100% - var(--space-4)) / 3);border-radius:var(--radius-surface);background:var(--surface);transform:translate(0);transition:transform var(--duration-slow) var(--ease-out),opacity var(--duration-fast) var(--ease-out);will-change:transform}.site-navigation[data-active-index="1"]:before{transform:translate(calc(100% + var(--space-1)))}.site-navigation[data-active-index="2"]:before{transform:translate(calc(200% + var(--space-2)))}.site-navigation[data-active-index="-1"]:before{opacity:0}.app-chrome:not(.is-condensed) .site-navigation{background:transparent}.app-chrome:not(.is-condensed) .site-navigation:before{opacity:0}.app-chrome[data-context-navigation=local] .site-navigation{visibility:hidden;opacity:0;pointer-events:none}.site-navigation a{position:relative;z-index:var(--z-raised);display:inline-flex;align-items:center;justify-content:center;min-height:var(--size-control-sm);padding-inline:var(--space-4);border-radius:var(--radius-surface);color:var(--ink-muted);font-size:var(--text-base);font-weight:var(--weight-medium);letter-spacing:var(--track-snug);text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}.site-navigation a:hover,.site-navigation a.active{color:var(--ink)}@media(prefers-reduced-motion:reduce){.site-navigation:before{transition:opacity var(--duration-fast) var(--ease-out)}}.site-header__actions{--header-actions-avatar-radius: calc( (var(--size-control-sm) / 2) + var(--space-1) );display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);width:max-content;min-width:0;padding:var(--space-1);border-radius:var(--radius-surface) var(--header-actions-avatar-radius) var(--header-actions-avatar-radius) var(--radius-surface);background:var(--surface-sunken);transition:background-color var(--duration-base) var(--ease-out)}.app-chrome:not(.is-condensed) .site-header__actions{background:transparent}.studio-switch{display:inline-flex;align-items:center;min-height:var(--size-control-sm);padding-inline:var(--space-3);border:none;border-radius:var(--radius-surface);background:transparent;color:var(--ink-muted);font-size:var(--text-base);font-weight:var(--weight-medium);letter-spacing:var(--track-snug);text-decoration:none;transition:var(--transition-colors)}.studio-switch:hover,.studio-switch.active{background:var(--surface);color:var(--ink)}.header-icon-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--size-control);height:var(--size-control);border-radius:var(--radius-surface);color:var(--ink-muted);background:transparent;transition:var(--transition-colors)}.header-icon-button:hover,.header-icon-button.active{background:var(--surface);color:var(--ink)}.header-icon-button svg{width:var(--size-icon);height:var(--size-icon);fill:none;stroke:currentColor;stroke-width:var(--stroke-width);stroke-linecap:round;stroke-linejoin:round}.header-icon-button .notification-badge{position:absolute;top:0;right:0}.notification-badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.125rem;height:1.125rem;padding:0 var(--space-1);border-radius:var(--radius-surface);background:var(--accent);color:var(--ink-on-accent);font-size:var(--text-2xs);font-weight:var(--weight-medium);font-variant-numeric:tabular-nums}.site-header__actions .header-icon-button{width:var(--size-control-sm);height:var(--size-control-sm)}.account-menu{position:relative}.account-menu>summary{display:flex;align-items:center;border-radius:var(--radius-surface)}.account-menu__trigger{padding-block:0;padding-inline:0;color:var(--ink-muted);transition:var(--transition-colors)}.account-menu__trigger:hover,.account-menu[open] .account-menu__trigger{color:var(--ink)}.account-menu__avatar{transition:box-shadow var(--duration-fast) var(--ease-out)}.account-menu__trigger:hover .account-menu__avatar,.account-menu[open] .account-menu__avatar{box-shadow:0 0 0 var(--line-width-strong) var(--surface)}.account-menu__trigger:focus-visible{box-shadow:none}.account-menu__trigger:focus-visible .account-menu__avatar{box-shadow:var(--focus-ring)}.account-menu__panel{position:absolute;top:calc(100% + var(--space-3));right:0;z-index:var(--z-dropdown);min-width:min(15rem,calc(100vw - var(--space-8)));max-width:calc(100vw - var(--space-8));margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-surface);background:var(--surface);box-shadow:var(--shadow-lg)}.account-menu__item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:100%;padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-surface);background:none;color:var(--ink);font-size:var(--text-base);text-align:left;text-decoration:none;transition:background-color var(--duration-fast) var(--ease-out)}.account-menu__item:hover{background:var(--surface-sunken)}.account-menu__separator{height:1px;margin:var(--space-2) 0;background:var(--line)}.account-menu__identity{display:grid;gap:var(--space-1);padding:var(--space-2) var(--space-3) var(--space-3);margin-bottom:var(--space-2);border-bottom:1px solid var(--line)}.account-menu__name{color:var(--ink);font-size:var(--text-base);font-weight:var(--weight-medium);letter-spacing:var(--track-snug);overflow-wrap:anywhere}.development-status{position:relative;display:inline-flex;margin-inline-end:var(--space-2)}.development-status__trigger{display:inline-flex;align-items:center;gap:var(--space-2);padding:0;border:none;border-radius:0;background:transparent;color:var(--ink-faint);font-size:var(--text-xs);font-weight:var(--weight-medium);letter-spacing:var(--track-normal);line-height:var(--leading-none);cursor:help}.development-status__trigger:hover,.development-status__trigger:focus-visible{color:var(--ink)}.development-status__dot{width:var(--space-2);height:var(--space-2);border-radius:var(--radius-circle);background:var(--ok)}.development-status__tooltip{position:absolute;top:calc(100% + var(--space-3));right:0;left:auto;z-index:var(--z-dropdown);display:grid;gap:var(--space-1);width:max-content;max-width:min(36ch,calc(100vw - var(--space-8)));padding:var(--space-3) var(--space-4);border:1px solid var(--line-strong);border-radius:var(--radius-surface);background:var(--surface-raised);box-shadow:var(--shadow-lg);color:var(--ink);opacity:0;pointer-events:none;transform:translateY(calc(var(--space-1) * -1));visibility:hidden;transition:opacity var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),visibility var(--duration-fast) var(--ease-out)}.development-status__tooltip strong,.development-status__tooltip span{font-size:var(--text-2xs);letter-spacing:var(--track-wide)}.development-status__tooltip strong{color:var(--ink);font-weight:var(--weight-semibold);text-transform:uppercase}.development-status__tooltip span{color:var(--ink-muted)}.development-status:hover .development-status__tooltip,.development-status:focus-within .development-status__tooltip{opacity:1;transform:translateY(0);visibility:visible}.mobile-navigation{display:none}.mobile-navigation a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--space-2) var(--space-1) var(--space-3);color:var(--ink-muted);font-size:var(--text-xs);font-weight:var(--weight-medium);letter-spacing:var(--track-snug);text-decoration:none;transition:var(--transition-colors)}.mobile-navigation a svg{width:var(--size-icon-lg);height:var(--size-icon-lg);fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:var(--stroke-width)}.mobile-navigation a.active{color:var(--accent)}.mobile-navigation a.active:before{content:"";position:absolute;left:50%;top:var(--space-1);width:var(--space-6);height:var(--space-1);border-radius:var(--radius-surface);background:var(--accent);transform:translate(-50%)}.site-footer{border-top:1px solid var(--line)}.site-footer__inner{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);width:100%;max-width:var(--width-full);margin:0 auto;padding:var(--space-8) var(--space-6)}.site-footer__mark{color:var(--ink-muted);font-size:var(--text-2xs);font-weight:var(--weight-medium);letter-spacing:var(--track-wide);text-transform:uppercase;white-space:nowrap}.site-footer__links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-5)}.site-footer__links a{color:var(--ink-muted);font-size:var(--text-2xs);letter-spacing:var(--track-normal);text-decoration:none;transition:var(--transition-colors)}.site-footer__links a:hover{color:var(--ink)}@media(max-width:1080px){.app-shell{--chrome-inline-gutter: var(--space-5)}.site-header__inner{column-gap:var(--space-4)}.site-footer__inner{flex-direction:column;align-items:flex-start;gap:var(--space-4)}}@media(max-width:760px){.app-shell{--chrome-inline-gutter: var(--space-4);padding-bottom:calc(var(--space-20) + env(safe-area-inset-bottom))}.site-header__inner{display:flex;gap:var(--space-3)}.site-header__inner[data-product-context=true]{gap:var(--space-2)}.site-header__context{flex:1;margin-right:auto}.site-header__navigation-slot{display:none}.site-header__utilities{flex:none;gap:var(--space-2)}.site-brand,.site-origin-context,.site-product-context{font-size:var(--text-base)}.site-header__inner[data-product-context=true] .site-brand>span:last-child,.site-header__inner[data-product-context=true] .development-status__trigger>span:last-child{display:none}.site-context-trail{gap:var(--space-1)}.development-status__tooltip{position:fixed;top:var(--header-height);right:var(--space-4);left:var(--space-4);width:auto;max-width:none}.site-navigation,.studio-switch{display:none}.mobile-navigation{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-sticky);display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--line);background:color-mix(in oklab,var(--surface) 96%,transparent);-webkit-backdrop-filter:blur(var(--space-4));backdrop-filter:blur(var(--space-4))}.site-footer__inner{padding:var(--space-6) var(--space-4)}}
