.b-app-shell{--app-shell-sidebar:17rem;--app-shell-bar:4.5rem;background:var(--a-color-canvas);color:var(--a-color-ink);position:relative}.b-app-shell__skip{top:var(--a-space-3);z-index:var(--a-layer-modal);padding:var(--a-space-2) var(--a-space-3);border:var(--a-border-width) solid var(--a-color-ink);border-radius:var(--a-radius-small);background:var(--a-color-surface);color:var(--a-color-ink);transform:translateY(calc(-100% - var(--a-space-6)));font-weight:600;text-decoration:none;position:absolute;inset-inline-start:var(--a-space-3)}.b-app-shell__skip:focus{transform:none}.b-app-shell__frame{grid-template-columns:var(--app-shell-sidebar) minmax(0, 1fr);min-height:100dvh;transition:grid-template-columns var(--a-motion-disclosure) var(--a-motion-out);display:grid}.b-app-shell__frame:where([data-collapsed]){grid-template-columns:0 minmax(0,1fr)}.b-app-shell__sidebar{border-inline-end:var(--a-border-width) solid var(--a-color-ink);background:var(--a-color-canvas);flex-direction:column;min-width:0;height:100dvh;display:flex;position:sticky;top:0;overflow:hidden}.b-app-shell__sidebar>*{width:var(--app-shell-sidebar)}:where(.b-app-shell__frame[data-collapsed]) .b-app-shell__sidebar{visibility:hidden;transition:visibility 0s linear var(--a-motion-disclosure);border-inline-end-width:0}.b-app-shell__brand{height:var(--app-shell-bar);padding:0 var(--a-space-3);border-bottom:var(--a-border-width) solid var(--a-color-ink);flex:none;align-items:center;display:flex}.b-app-shell__brand>*{min-width:0;max-width:100%}.b-app-shell__nav{min-height:0;padding:var(--a-space-4) var(--a-space-3);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--a-color-secondary) transparent;flex:1;overflow:auto}.b-app-shell__footer{gap:var(--a-space-3);padding:var(--a-space-3);border-top:var(--a-border-width) solid var(--a-color-ink);flex:none;display:grid}.b-app-shell__main{flex-direction:column;min-width:0;display:flex}.b-app-shell__top{z-index:var(--a-layer-popover);align-items:center;gap:var(--a-space-3);height:var(--app-shell-bar);padding:0 var(--a-space-6) 0 var(--a-space-3);border-bottom:var(--a-border-width) solid var(--a-color-ink);background:var(--a-color-canvas);display:flex;position:sticky;top:0}:where(.b-app-shell__frame:not([data-top])) .b-app-shell__top{display:none}:where(.b-app-shell__frame:not([data-collapsible])) .b-app-shell__top{padding-inline-start:var(--a-space-6)}.b-app-shell__lead{align-items:center;gap:var(--a-space-2);flex:none;min-width:0;display:flex}:where(.b-app-shell__frame:not([data-collapsible]):not([data-collapsed])) .b-app-shell__lead,.b-app-shell__menu,.b-app-shell__top-brand{display:none}.b-app-shell__top-brand{align-items:center;min-width:0}:where(.b-app-shell__frame[data-collapsed]) .b-app-shell__top-brand{display:flex}.b-app-shell__top-content{align-items:center;gap:var(--a-space-3);flex:1;min-width:0;display:flex}.b-app-shell__content{min-width:0;padding:var(--a-space-8);flex:1}.b-app-shell__content:focus{outline:none}.b-app-shell__drawer{flex-direction:column;min-height:100%;display:flex}.b-app-shell__drawer .b-app-shell__brand{height:auto;padding:0 0 var(--a-space-4)}.b-app-shell__drawer .b-app-shell__nav{padding:var(--a-space-4) 0;overflow:visible}.b-app-shell__drawer .b-app-shell__footer{padding:var(--a-space-4) 0 0;margin-top:auto}.b-app-shell[data-contained]{height:100%;min-height:0;container:app-shell/inline-size}.b-app-shell[data-contained] .b-app-shell__frame{height:100%;min-height:0}.b-app-shell[data-contained] .b-app-shell__sidebar{height:100%}.b-app-shell[data-contained] .b-app-shell__main{scrollbar-width:thin;scrollbar-color:var(--a-color-secondary) transparent;overflow:auto}@media (width<=60rem){.b-app-shell:not([data-contained]) .b-app-shell__frame{grid-template-columns:minmax(0,1fr)}.b-app-shell:not([data-contained]) .b-app-shell__sidebar,.b-app-shell:not([data-contained]) .b-app-shell__toggle{display:none}.b-app-shell:not([data-contained]) .b-app-shell__top{padding-inline:var(--a-space-3) var(--a-space-4);display:flex}.b-app-shell:not([data-contained]) :is(.b-app-shell__lead,.b-app-shell__menu,.b-app-shell__top-brand){display:flex}.b-app-shell:not([data-contained]) .b-app-shell__content{padding:var(--a-space-6) var(--a-space-4) var(--a-space-12)}}@container app-shell (width<=40rem){.b-app-shell__frame{grid-template-columns:minmax(0,1fr)}.b-app-shell__sidebar,.b-app-shell__toggle{display:none}.b-app-shell__top{padding-inline:var(--a-space-3) var(--a-space-4);display:flex}:is(.b-app-shell__lead,.b-app-shell__menu,.b-app-shell__top-brand){display:flex}.b-app-shell__content{padding:var(--a-space-6) var(--a-space-4) var(--a-space-12)}}@media (prefers-reduced-motion:reduce){.b-app-shell__frame,.b-app-shell__sidebar,.b-app-shell__skip{transition:none}}
