@layer components{.fc__panel,.fc__reset,.stepper,.type-flip{--glass-surface: color-mix(in oklch, var(--color-surface-elevated) 86%, transparent);background:var(--glass-surface);border:var(--hairline) solid var(--color-border);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur))}}@layer components{.right-controls{display:flex;flex-direction:column;align-items:flex-end;gap:calc(var(--spacing) * 2);max-width:100%;margin-inline-start:auto}.right-controls__fonts{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:calc(var(--spacing) * 2)}.stepper{display:inline-flex;align-items:center;gap:calc(var(--spacing) * .5);padding:calc(var(--spacing) * .75);font-family:var(--font-sans)}.stepper__arrow{flex:none;width:2.2em;padding:.5em 0;font-size:var(--text-sm);line-height:1;color:var(--color-text-muted);background:none;border:none;border-radius:var(--radius-pill);cursor:pointer;transition:color var(--duration-fast) var(--ease-smooth),background var(--duration-fast) var(--ease-smooth)}.stepper__arrow:hover{color:var(--color-text-primary);background:var(--color-accent-subtle)}@media(pointer:coarse){.stepper__arrow{padding:.7em 0}}.stepper__arrow:focus-visible{outline:var(--hairline) solid var(--color-accent-muted);outline-offset:calc(var(--spacing) * .5)}.stepper__label{pointer-events:none;text-align:center;font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted)}}@layer components{.type-flip{display:inline-flex;align-items:center;gap:.4em;padding:.45em .8em;font-family:var(--font-sans);font-size:var(--text-xs);letter-spacing:.06em;line-height:1;color:var(--color-text-muted);cursor:pointer}.type-flip:hover{color:var(--color-text-primary)}.type-flip--on{color:var(--color-accent)}}@layer components{.woven-wall{--_tile: var(--wall-tile, clamp(240px, calc(22vw + 60px) , 420px));--_origin: var(--wall-origin, 0px);position:relative;width:100%;overflow:clip}.woven-wall__origin{position:absolute;inset-block-start:0;inset-inline-start:var(--_origin);inline-size:0;block-size:0;pointer-events:none}.woven-wall__row{display:flex;inline-size:max-content;list-style:none;transform:translate3d(calc(var(--_origin) - var(--wall-count, 6) * var(--_tile)),0,0);backface-visibility:hidden}.woven-wall__tile{flex:0 0 var(--_tile);aspect-ratio:4 / 5;overflow:hidden;background-color:var(--tone)}.woven-wall__tile img{inline-size:100%;block-size:100%;object-fit:cover}@media(prefers-reduced-motion:reduce){.woven-wall__row{inline-size:100%;transform:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-inline-start:var(--_origin);scroll-padding-inline-start:var(--_origin);scrollbar-width:thin}.woven-wall__row:focus-visible{outline:var(--focus-width) solid var(--color-accent);outline-offset:calc(var(--spacing) * -.5)}.woven-wall__tile{scroll-snap-align:start}}}@layer components{.fc__panel,.fc__reset,.stepper,.type-flip{--glass-surface: color-mix(in oklch, var(--color-surface-elevated) 86%, transparent);background:var(--glass-surface);border:var(--hairline) solid var(--color-border);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur))}}@layer components{.fc{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing) * 2);font-family:var(--font-sans)}.fc__panel{display:flex;align-items:center;gap:calc(var(--spacing) * .5);padding:calc(var(--spacing) * .75)}.fc__seg{padding:.5em 1em;font-family:var(--font-sans);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted);background:none;border:none;border-radius:var(--radius-pill);cursor:pointer;transition:color var(--duration-fast) var(--ease-smooth),background var(--duration-fast) var(--ease-smooth)}.fc__seg:hover{color:var(--color-text-primary);background:var(--color-accent-subtle)}.fc__seg--active{color:var(--color-surface);background:var(--color-accent)}.fc__reset{padding:.5em .9em;font-family:var(--font-sans);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted);cursor:pointer;transition:color var(--duration-fast) var(--ease-smooth)}.fc__reset:hover{color:var(--color-text-primary)}.fc__seg:focus-visible,.fc__reset:focus-visible{outline:var(--hairline) solid var(--color-accent-muted);outline-offset:calc(var(--spacing) * .5)}}
