@layer m3-components{.m3-toolbar{--_h:64px;--_edge:16px;--_px:8px;--_gap:4px;--_dir:1;--_bg:var(--md-sys-color-surface-container);--_fg:var(--md-sys-color-on-surface);z-index:var(--md-sys-z-sheet);align-items:center;gap:var(--_gap);height:var(--_h);padding-inline:var(--_px);background:var(--_bg);color:var(--_fg);box-sizing:border-box;display:flex;position:fixed}.m3-toolbar[data-position=top]{--_dir:-1}.m3-toolbar[data-kind=floating]{width:max-content;max-width:calc(100% - 2 * var(--_edge));border-radius:var(--md-sys-shape-corner-full);box-shadow:var(--md-sys-elevation-3);margin-inline:auto;inset-inline:0}.m3-toolbar[data-kind=floating][data-position=bottom]{bottom:calc(var(--m3-toolbar-bottom,0px) + var(--_edge) + env(safe-area-inset-bottom,0px))}.m3-toolbar[data-kind=floating][data-position=top]{top:calc(var(--_edge) + env(safe-area-inset-top,0px))}.m3-toolbar[data-kind=docked]{--_px:16px;--_gap:4px;border-radius:0;justify-content:flex-start;width:auto;inset-inline:0}.m3-toolbar[data-kind=docked][data-position=bottom]{bottom:var(--m3-toolbar-bottom,0);height:calc(var(--_h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0)}.m3-toolbar[data-kind=docked][data-position=top]{height:calc(var(--_h) + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0);top:0}.m3-toolbar[data-inline]{position:absolute}.m3-toolbar[data-inline][data-kind=floating][data-position=bottom]{bottom:var(--_edge)}.m3-toolbar[data-inline][data-kind=floating][data-position=top]{top:var(--_edge)}.m3-toolbar[data-inline][data-kind=docked][data-position=bottom]{height:var(--_h);padding-bottom:0;bottom:0}.m3-toolbar[data-inline][data-kind=docked][data-position=top]{height:var(--_h);padding-top:0;top:0}.m3-toolbar[data-variant=vibrant]{--_bg:var(--md-sys-color-primary-container);--_fg:var(--md-sys-color-on-primary-container)}.m3-toolbar[data-variant=vibrant] .m3-ibtn[data-variant=standard]{--_icon-c:var(--md-sys-color-on-primary-container)}.m3-toolbar[data-variant=vibrant] .m3-btn[data-variant=text]{--_label:var(--md-sys-color-on-primary-container)}@media (forced-colors:active){.m3-toolbar{border:1px solid canvastext}}.m3-toolbar-enter-active{transition:transform var(--md-sys-motion-t-medium-in),opacity var(--md-sys-motion-t-fx-medium)}.m3-toolbar-leave-active{transition:transform var(--md-sys-motion-t-medium-out),opacity var(--md-sys-motion-t-fx-small)}.m3-toolbar-enter-from,.m3-toolbar-leave-to{opacity:0;transform:translateY(calc(32px * var(--_dir) * var(--md-sys-motion-travel))) scale(calc(1 - .08 * var(--md-sys-motion-travel)))}.m3-toolbar[data-kind=docked].m3-toolbar-enter-from,.m3-toolbar[data-kind=docked].m3-toolbar-leave-to{transform:translateY(calc(100% * var(--_dir) * var(--md-sys-motion-travel)))}}@layer m3-density{:root[data-density=compact] .m3-toolbar{--_h:48px;--_edge:12px;--_px:6px}:root[data-density=compact] .m3-toolbar[data-kind=docked]{--_px:12px}}