.af-frame{--af-bar:oklch(97.5% .004 260);--af-bar-border:oklch(91% .008 260);--af-url:oklch(100% 0 0);--af-url-text:oklch(55% .02 260);--af-dot:oklch(85% .01 260);--af-chip:oklch(100% 0 0/.92);--af-chip-text:oklch(28% .03 260);--af-chip-border:oklch(90% .01 260);--af-shadow:0 1px 0 oklch(100% 0 0/.6) inset, 0 30px 70px -20px oklch(35% .08 265/.35), 0 12px 24px -12px oklch(30% .05 265/.25);background:var(--af-url);outline:1px solid var(--af-bar-border);box-shadow:var(--af-shadow);isolation:isolate;border-radius:1.25rem;position:relative;overflow:hidden}:where(.dark) .af-frame{--af-bar:oklch(24% .012 265);--af-bar-border:oklch(32% .015 265);--af-url:oklch(19% .01 265);--af-url-text:oklch(72% .02 265);--af-dot:oklch(40% .015 265);--af-chip:oklch(22% .015 265/.9);--af-chip-text:oklch(95% .005 265);--af-chip-border:oklch(36% .02 265);--af-shadow:0 30px 70px -20px oklch(0% 0 0/.7)}.af-contain{background:radial-gradient(ellipse at top, oklch(96% .02 265), transparent 70%), var(--af-bar)}:where(.dark) .af-contain{background:radial-gradient(ellipse at top, oklch(30% .03 265), transparent 70%), var(--af-bar)}.af-bar{background:var(--af-bar);border-bottom:1px solid var(--af-bar-border);align-items:center;gap:.75rem;padding:.6rem .9rem;display:flex}.af-dots{flex-shrink:0;gap:.4rem;display:flex}.af-dots>span{background:var(--af-dot);border-radius:999px;width:.55rem;height:.55rem}.af-url{background:var(--af-url);border:1px solid var(--af-bar-border);min-width:0;max-width:26rem;color:var(--af-url-text);text-align:center;white-space:nowrap;text-overflow:ellipsis;border-radius:.5rem;flex:1;margin-inline:auto;padding:.25rem .75rem;font-size:.72rem;line-height:1.2;overflow:hidden}.af-chip{background:var(--af-chip);color:var(--af-chip-text);border:1px solid var(--af-chip-border);white-space:nowrap;backdrop-filter:blur(8px);border-radius:999px;align-items:center;gap:.45rem;padding:.4rem .8rem;font-size:.75rem;font-weight:600;line-height:1.1;display:inline-flex;position:absolute;box-shadow:0 10px 25px -10px oklch(30% .06 265/.4)}.af-chip:before{content:"";background:var(--color-brand-500);border-radius:999px;width:.4rem;height:.4rem}.af-chip[data-pos=tl]{top:.9rem;left:.9rem}.af-chip[data-pos=tr]{top:.9rem;right:.9rem}.af-chip[data-pos=bl]{bottom:.9rem;left:.9rem}.af-chip[data-pos=br]{bottom:.9rem;right:.9rem}@media (width<=639px){.af-chip{padding:.3rem .6rem;font-size:.65rem}.af-chip+.af-chip{display:none}.af-url{font-size:.62rem}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.af-rise{animation:linear both af-rise view();animation-range:entry entry 55%}.af-drift{animation:linear both af-drift view();animation-range:cover}.af-tilt{animation:linear both af-tilt view();animation-range:entry entry 75%}}}@keyframes af-rise{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}@keyframes af-drift{0%{transform:translateY(40px)}to{transform:translateY(-40px)}}@keyframes af-tilt{0%{opacity:.3;transform:perspective(1600px)rotateX(8deg)translateY(36px)}to{opacity:1;transform:none}}.af-before{border:1px dashed color-mix(in oklch, var(--color-foreground) 22%, transparent);background:color-mix(in oklch, var(--color-foreground) 4%, transparent)}.af-before-pill{color:oklch(72% .14 25);background:oklch(65% .18 25/.16)}.af-after{border:1px solid color-mix(in oklch, var(--color-brand-400) 45%, transparent);background:color-mix(in oklch, var(--color-brand-500) 14%, transparent);box-shadow:0 20px 40px -24px color-mix(in oklch, var(--color-brand-500) 70%, transparent)}.af-after-pill{color:#fff;background:var(--color-brand-500)}.af-zoom{z-index:3;cursor:zoom-in;border-radius:inherit;background:0 0;border:0;position:absolute;inset:0}.af-zoom:focus-visible{outline:2px solid var(--color-brand-500);outline-offset:-4px}.af-zoom-hint{color:#fff;backdrop-filter:blur(8px);opacity:0;background:oklch(22% .03 265/.72);border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .7rem;font-size:.75rem;font-weight:600;transition:opacity .2s,transform .2s;display:inline-flex;position:absolute;bottom:.75rem;right:.75rem;transform:translateY(4px)}.af-zoom-hint svg{width:.9rem;height:.9rem}@media (hover:hover){.af-zoom:hover .af-zoom-hint{opacity:1;transform:none}}.af-zoom:focus-visible .af-zoom-hint{opacity:1;transform:none}@media (hover:none){.af-zoom-hint{opacity:1;gap:0;padding:.45rem;font-size:0;transform:none}}.af-lightbox{color:#fff;background:0 0;border:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:clamp(.75rem,3vw,2.5rem);overflow:auto}.af-lightbox::backdrop{backdrop-filter:blur(6px);background:oklch(14% .02 265/.86)}.af-lightbox[open]{place-items:center;animation:.22s ease-out af-lb-in;display:grid}.af-lightbox-figure{flex-direction:column;align-items:center;gap:.85rem;max-width:100%;margin:0;display:flex}.af-lightbox-figure img{cursor:zoom-out;background:#fff;border-radius:.75rem;width:auto;max-width:min(100%,1800px);height:auto;max-height:calc(100dvh - 7rem);display:block;box-shadow:0 40px 100px -30px #000000b3}.af-lightbox-figure figcaption{text-align:center;color:#ffffffbf;max-width:60rem;font-size:.875rem;line-height:1.5}.af-lightbox-close{z-index:1;color:#fff;cursor:pointer;background:#ffffff1f;border:1px solid #fff3;border-radius:999px;place-items:center;width:2.75rem;height:2.75rem;transition:background .2s;display:grid;position:fixed;top:clamp(.75rem,2vw,1.5rem);right:clamp(.75rem,2vw,1.5rem)}.af-lightbox-close:hover{background:#ffffff38}.af-lightbox-close:focus-visible{outline-offset:2px;outline:2px solid #fff}.af-lightbox-close svg{width:1.25rem;height:1.25rem}:root.af-lightbox-open{overflow:hidden}@keyframes af-lb-in{0%{opacity:0;transform:scale(.98)}}@media (prefers-reduced-motion:reduce){.af-lightbox[open]{animation:none}}