@layer brick.tokens,brick.foundations;@layer brick.components{.brick-app-bar{--brick-app-bar-background:var(--brick-color-surface-base);--brick-app-bar-foreground:var(--brick-color-text-primary);--brick-app-bar-border-color:var(--brick-color-border-subtle);--brick-app-bar-blurred-background:color-mix(in srgb, var(--brick-color-surface-base), transparent 12%);--brick-app-bar-reduced-transparency-background:var(--brick-color-surface-base);--brick-app-bar-shadow:0 .5rem 1.5rem color-mix(in srgb, var(--brick-color-shadow), transparent 28%);box-sizing:border-box;background:var(--brick-app-bar-background);inline-size:100%;min-inline-size:0;color:var(--brick-app-bar-foreground);display:block}.brick-app-bar[data-position=absolute],.brick-app-bar[data-position=sticky],.brick-app-bar[data-position=fixed]{z-index:calc(var(--brick-layer-overlay) - 10);inset-block-start:0}.brick-app-bar[data-position=absolute]{position:absolute;inset-inline:0}.brick-app-bar[data-position=sticky]{position:sticky}.brick-app-bar[data-position=fixed]{position:fixed;inset-inline:0}.brick-app-bar[data-variant=solid]{--brick-app-bar-background:var(--brick-color-surface-raised)}.brick-app-bar[data-variant=surface]{--brick-app-bar-background:var(--brick-color-surface-base)}.brick-app-bar[data-variant=transparent]{--brick-app-bar-background:transparent}.brick-app-bar[data-tone=accent][data-variant=solid]{--brick-app-bar-background:var(--brick-color-accent-solid);--brick-app-bar-foreground:var(--brick-color-accent-on-solid);--brick-app-bar-border-color:var(--brick-color-accent-solid-pressed);--brick-app-bar-blurred-background:color-mix(in srgb, var(--brick-color-accent-solid), transparent 12%);--brick-app-bar-reduced-transparency-background:var(--brick-color-accent-solid)}.brick-app-bar[data-tone=accent][data-variant=surface]{--brick-app-bar-background:var(--brick-color-accent-soft);--brick-app-bar-foreground:var(--brick-color-accent-on-soft);--brick-app-bar-border-color:var(--brick-color-accent-border);--brick-app-bar-blurred-background:color-mix(in srgb, var(--brick-color-accent-soft), transparent 12%);--brick-app-bar-reduced-transparency-background:var(--brick-color-accent-soft)}.brick-app-bar[data-tone=accent][data-variant=transparent]{--brick-app-bar-foreground:var(--brick-color-accent-text);--brick-app-bar-border-color:var(--brick-color-accent-border);--brick-app-bar-blurred-background:color-mix(in srgb, var(--brick-color-accent-soft), transparent 12%);--brick-app-bar-reduced-transparency-background:var(--brick-color-accent-soft)}.brick-app-bar[data-bordered]{border-block-end:var(--brick-border-width) solid var(--brick-app-bar-border-color)}.brick-app-bar[data-elevated]{box-shadow:var(--brick-app-bar-shadow)}.brick-app-bar[data-blurred]{background:var(--brick-app-bar-blurred-background);-webkit-backdrop-filter:blur(.75rem)saturate(1.15);backdrop-filter:blur(.75rem)saturate(1.15)}.brick-app-bar[data-tone=accent][data-variant=solid] .brick-icon-button[data-tone=neutral]{--brick-icon-button-background-hover:color-mix(in srgb, currentColor, transparent 88%);--brick-icon-button-background-pressed:color-mix(in srgb, currentColor, transparent 78%);--brick-icon-button-border-color:transparent;--brick-icon-button-foreground:var(--brick-app-bar-foreground)}.brick-app-bar-toolbar{box-sizing:border-box;align-items:center;gap:var(--brick-space-3);min-block-size:4rem;inline-size:100%;min-inline-size:0;padding-inline:clamp(var(--brick-space-4), 4vw, var(--brick-space-6));grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid}.brick-app-bar-toolbar[data-density=compact]{gap:var(--brick-space-2);min-block-size:3rem}:where(.brick-app-bar-start,.brick-app-bar-center,.brick-app-bar-end){align-items:center;gap:var(--brick-space-2);min-inline-size:0;display:flex}.brick-app-bar-start{grid-column:1}.brick-app-bar-center{grid-column:2;justify-content:center}.brick-app-bar-end{grid-column:3;justify-content:flex-end}@media (prefers-reduced-transparency:reduce){.brick-app-bar[data-blurred]{background:var(--brick-app-bar-reduced-transparency-background);-webkit-backdrop-filter:none;backdrop-filter:none}}@media (forced-colors:active){.brick-app-bar,.brick-app-bar[data-variant],.brick-app-bar[data-blurred]{box-shadow:none;color:canvastext;background:canvas;border-color:canvastext}}:where(.brick-button,.brick-icon-button)[data-loading]:after{inline-size:var(--brick-action-spinner-size);block-size:var(--brick-action-spinner-size);border:.125rem solid #0000;border-block-start-color:var(--brick-action-spinner-color);border-inline-end-color:var(--brick-action-spinner-color);border-radius:var(--brick-radius-full);content:"";animation:.7s linear infinite brick-action-spinner-spin;position:absolute;inset-block-start:50%;inset-inline-start:50%}:where([dir=rtl]) :where(.brick-button,.brick-icon-button)[data-loading]:after{animation-name:brick-action-spinner-spin-rtl}@media (prefers-reduced-motion:reduce){:where(.brick-button,.brick-icon-button)[data-loading]:after{animation-duration:1.4s}}@media (forced-colors:active){:where(.brick-button,.brick-icon-button)[data-loading]:after{border-block-start-color:buttontext;border-inline-end-color:buttontext}}@keyframes brick-action-spinner-spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes brick-action-spinner-spin-rtl{0%{transform:translate(50%,-50%)rotate(0)}to{transform:translate(50%,-50%)rotate(360deg)}}.brick-icon-button{--brick-icon-button-size:var(--brick-control-min-block-size-md);--brick-icon-button-icon-size:1.125rem;--brick-icon-button-radius:var(--brick-radius-control);--brick-icon-button-background:transparent;--brick-icon-button-background-hover:var(--brick-icon-button-tone-soft);--brick-icon-button-background-pressed:var(--brick-icon-button-tone-soft-pressed);--brick-icon-button-border-color:transparent;--brick-icon-button-foreground:var(--brick-icon-button-tone-text);--brick-icon-button-spinner-color:var(--brick-icon-button-foreground);--brick-action-spinner-size:var(--brick-icon-button-icon-size);--brick-action-spinner-color:var(--brick-icon-button-spinner-color);box-sizing:border-box;flex:0 0 var(--brick-icon-button-size);inline-size:var(--brick-icon-button-size);min-inline-size:var(--brick-icon-button-size);block-size:var(--brick-icon-button-size);min-block-size:var(--brick-icon-button-size);border:var(--brick-border-width) solid var(--brick-icon-button-border-color);border-radius:var(--brick-icon-button-radius);appearance:none;background:var(--brick-icon-button-background);color:var(--brick-icon-button-foreground);font:inherit;-webkit-user-select:none;user-select:none;vertical-align:middle;transition:background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);justify-content:center;align-items:center;padding:0;line-height:1;text-decoration:none;display:inline-flex;position:relative}.brick-icon-button__icon{inline-size:var(--brick-icon-button-icon-size);block-size:var(--brick-icon-button-icon-size);pointer-events:none;justify-content:center;align-items:center;display:inline-flex}.brick-icon-button__icon>:where(svg,img){block-size:100%;inline-size:100%}.brick-icon-button>:where(svg,img){inline-size:var(--brick-icon-button-icon-size);block-size:var(--brick-icon-button-icon-size)}.brick-icon-button:not([data-disabled],[data-loading]){cursor:pointer}.brick-icon-button:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-icon-button:not([data-disabled],[data-loading]):active{background:var(--brick-icon-button-background-pressed)}.brick-icon-button[data-variant=solid]{--brick-icon-button-background:var(--brick-icon-button-tone-solid);--brick-icon-button-background-hover:var(--brick-icon-button-tone-solid-hover);--brick-icon-button-background-pressed:var(--brick-icon-button-tone-solid-pressed);--brick-icon-button-border-color:var(--brick-icon-button-tone-solid);--brick-icon-button-foreground:var(--brick-icon-button-tone-on-solid)}.brick-icon-button[data-variant=soft]{--brick-icon-button-background:var(--brick-icon-button-tone-soft);--brick-icon-button-background-hover:var(--brick-icon-button-tone-soft-hover);--brick-icon-button-background-pressed:var(--brick-icon-button-tone-soft-pressed);--brick-icon-button-border-color:var(--brick-icon-button-tone-border);--brick-icon-button-foreground:var(--brick-icon-button-tone-on-soft)}.brick-icon-button[data-variant=outline]{--brick-icon-button-background:transparent;--brick-icon-button-border-color:var(--brick-icon-button-tone-border);--brick-icon-button-foreground:var(--brick-icon-button-tone-text)}.brick-icon-button[data-variant=ghost]{--brick-icon-button-background:transparent;--brick-icon-button-border-color:transparent;--brick-icon-button-foreground:var(--brick-icon-button-tone-text)}.brick-icon-button[data-tone=neutral]{--brick-icon-button-tone-solid:var(--brick-color-text-primary);--brick-icon-button-tone-solid-hover:var(--brick-color-text-secondary);--brick-icon-button-tone-solid-pressed:var(--brick-color-border-strong);--brick-icon-button-tone-on-solid:var(--brick-color-text-inverse);--brick-icon-button-tone-soft:var(--brick-color-surface-subtle);--brick-icon-button-tone-soft-hover:var(--brick-color-surface-base);--brick-icon-button-tone-soft-pressed:var(--brick-color-border-subtle);--brick-icon-button-tone-on-soft:var(--brick-color-text-primary);--brick-icon-button-tone-border:var(--brick-color-border-strong);--brick-icon-button-tone-text:var(--brick-color-text-primary)}.brick-icon-button[data-tone=accent]{--brick-icon-button-tone-solid:var(--brick-color-accent-solid);--brick-icon-button-tone-solid-hover:var(--brick-color-accent-solid-hover);--brick-icon-button-tone-solid-pressed:var(--brick-color-accent-solid-pressed);--brick-icon-button-tone-on-solid:var(--brick-color-accent-on-solid);--brick-icon-button-tone-soft:var(--brick-color-accent-soft);--brick-icon-button-tone-soft-hover:var(--brick-color-accent-soft-hover);--brick-icon-button-tone-soft-pressed:var(--brick-color-accent-soft-pressed);--brick-icon-button-tone-on-soft:var(--brick-color-accent-on-soft);--brick-icon-button-tone-border:var(--brick-color-accent-border);--brick-icon-button-tone-text:var(--brick-color-accent-text)}.brick-icon-button[data-tone=info]{--brick-icon-button-tone-solid:var(--brick-color-info-solid);--brick-icon-button-tone-solid-hover:var(--brick-color-info-solid-hover);--brick-icon-button-tone-solid-pressed:var(--brick-color-info-solid-pressed);--brick-icon-button-tone-on-solid:var(--brick-color-info-on-solid);--brick-icon-button-tone-soft:var(--brick-color-info-soft);--brick-icon-button-tone-soft-hover:var(--brick-color-info-soft-hover);--brick-icon-button-tone-soft-pressed:var(--brick-color-info-soft-pressed);--brick-icon-button-tone-on-soft:var(--brick-color-info-on-soft);--brick-icon-button-tone-border:var(--brick-color-info-border);--brick-icon-button-tone-text:var(--brick-color-info-text)}.brick-icon-button[data-tone=success]{--brick-icon-button-tone-solid:var(--brick-color-success-solid);--brick-icon-button-tone-solid-hover:var(--brick-color-success-solid-hover);--brick-icon-button-tone-solid-pressed:var(--brick-color-success-solid-pressed);--brick-icon-button-tone-on-solid:var(--brick-color-success-on-solid);--brick-icon-button-tone-soft:var(--brick-color-success-soft);--brick-icon-button-tone-soft-hover:var(--brick-color-success-soft-hover);--brick-icon-button-tone-soft-pressed:var(--brick-color-success-soft-pressed);--brick-icon-button-tone-on-soft:var(--brick-color-success-on-soft);--brick-icon-button-tone-border:var(--brick-color-success-border);--brick-icon-button-tone-text:var(--brick-color-success-text)}.brick-icon-button[data-tone=warning]{--brick-icon-button-tone-solid:var(--brick-color-warning-solid);--brick-icon-button-tone-solid-hover:var(--brick-color-warning-solid-hover);--brick-icon-button-tone-solid-pressed:var(--brick-color-warning-solid-pressed);--brick-icon-button-tone-on-solid:var(--brick-color-warning-on-solid);--brick-icon-button-tone-soft:var(--brick-color-warning-soft);--brick-icon-button-tone-soft-hover:var(--brick-color-warning-soft-hover);--brick-icon-button-tone-soft-pressed:var(--brick-color-warning-soft-pressed);--brick-icon-button-tone-on-soft:var(--brick-color-warning-on-soft);--brick-icon-button-tone-border:var(--brick-color-warning-border);--brick-icon-button-tone-text:var(--brick-color-warning-text)}.brick-icon-button[data-tone=danger]{--brick-icon-button-tone-solid:var(--brick-color-danger-solid);--brick-icon-button-tone-solid-hover:var(--brick-color-danger-solid-hover);--brick-icon-button-tone-solid-pressed:var(--brick-color-danger-solid-pressed);--brick-icon-button-tone-on-solid:var(--brick-color-danger-on-solid);--brick-icon-button-tone-soft:var(--brick-color-danger-soft);--brick-icon-button-tone-soft-hover:var(--brick-color-danger-soft-hover);--brick-icon-button-tone-soft-pressed:var(--brick-color-danger-soft-pressed);--brick-icon-button-tone-on-soft:var(--brick-color-danger-on-soft);--brick-icon-button-tone-border:var(--brick-color-danger-border);--brick-icon-button-tone-text:var(--brick-color-danger-text)}.brick-icon-button[data-size=xs]{--brick-icon-button-size:var(--brick-control-min-block-size-xs);--brick-icon-button-icon-size:.875rem}.brick-icon-button[data-size=sm]{--brick-icon-button-size:var(--brick-control-min-block-size-sm);--brick-icon-button-icon-size:1rem}.brick-icon-button[data-size=lg]{--brick-icon-button-size:var(--brick-control-min-block-size-lg);--brick-icon-button-icon-size:1.25rem}.brick-icon-button[data-size=xl]{--brick-icon-button-size:var(--brick-control-min-block-size-xl);--brick-icon-button-icon-size:1.5rem}.brick-icon-button[data-shape=circle]{--brick-icon-button-radius:var(--brick-radius-full)}.brick-icon-button[data-disabled]{border-color:var(--brick-color-border-subtle);background:var(--brick-color-surface-subtle);color:var(--brick-color-text-secondary);cursor:not-allowed;opacity:.65}.brick-icon-button[data-loading]{color:#0000;cursor:progress}.brick-icon-button[data-loading]>*{opacity:0}@media (hover:hover) and (pointer:fine){.brick-icon-button:not([data-disabled],[data-loading]):hover{border-color:var(--brick-icon-button-border-color);background:var(--brick-icon-button-background-hover)}}@media (prefers-reduced-motion:reduce){.brick-icon-button{transition-duration:0s}}@media (forced-colors:active){.brick-icon-button{color:buttontext;background:buttonface;border-color:buttontext}.brick-icon-button:focus-visible{outline-color:highlight}.brick-icon-button[data-disabled]{color:graytext;opacity:1;border-color:graytext}}}@layer brick.effects;
