@layer components{.sig-notch{--n:2.25rem;--tab:clamp(9rem, 45%, 13rem);--shape:polygon(0 0, 100% 0, 100% 100%, calc(100% - var(--tab)) 100%, calc(100% - var(--tab) - var(--n)) calc(100% - var(--n)), 0 calc(100% - var(--n)));--notch-line:var(--accent-text);--notch-fill:var(--flood);isolation:isolate;padding-bottom:var(--n);display:grid;position:relative}.sig-notch[data-variant=fill]{--notch-line:var(--band);--notch-fill:var(--band);color:var(--band-fg)}.sig-notch:after,.sig-notch:before{content:"";z-index:-1;clip-path:var(--shape);transition:background-color var(--colour-time) var(--ease-signal);position:absolute}.sig-notch:before{background:var(--notch-line);inset:0}.sig-notch:after{background:var(--notch-fill);inset:1px}.sig-notch__body{min-width:0;display:grid}.sig-notch__tab{width:var(--tab);height:var(--n);font:600 .9375rem/1 var(--font-sans);white-space:nowrap;justify-content:flex-end;align-items:center;gap:.5rem;padding-inline:.9rem;font-stretch:92%;display:flex;position:absolute;bottom:0;right:0}}