@layer components{.art{--art-panel:var(--secondary);--art-light:var(--card);--art-ink:var(--foreground);--art-line:color-mix(in srgb, var(--foreground) 9%, transparent);--art-edge:color-mix(in srgb, var(--foreground) 14%, transparent);--art-reflection:color-mix(in srgb, var(--art-light) 66%, transparent);--art-soft:color-mix(in srgb, var(--art-light) 14%, transparent);--art-rim:color-mix(in srgb, var(--art-light) 32%, transparent);--art-shadow:0 8px 18px -14px color-mix(in srgb, var(--art-ink) 5%, transparent), 0 1px 2px color-mix(in srgb, var(--art-ink) 1.5%, transparent)}.dark .art{--art-panel:var(--card);--art-light:var(--foreground);--art-ink:var(--background);--art-reflection:color-mix(in srgb, var(--art-light) 7%, transparent);--art-soft:color-mix(in srgb, var(--art-light) 1.5%, transparent);--art-rim:color-mix(in srgb, var(--art-light) 9%, transparent)}.art-panel{border:1px solid var(--art-line);border-top-color:var(--art-edge);background:linear-gradient(145deg, var(--art-reflection), transparent 36%, transparent 72%, var(--art-soft)), linear-gradient(155deg, color-mix(in srgb, var(--popover) 86%, transparent), color-mix(in srgb, var(--art-panel) 72%, transparent));box-shadow:inset 0 1px 0 var(--art-rim), inset 0 -1px 0 color-mix(in srgb, var(--art-ink) 4%, transparent), var(--art-shadow);border-radius:12px}.art-glass{border:1px solid var(--art-line);border-top-color:var(--art-edge);background:linear-gradient(150deg, var(--art-reflection), transparent 35%, transparent 70%, var(--art-soft)), color-mix(in srgb, var(--popover) 78%, transparent);box-shadow:inset 0 1px 0 var(--art-rim), inset 0 -1px 0 var(--art-rim), var(--art-shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:10px}.art-bar{border-bottom:1px solid var(--art-line);height:32px;color:var(--muted-foreground);white-space:nowrap;align-items:center;gap:10px;padding:0 12px;font-size:11px;display:flex}.art-dots{flex:none;gap:4px;display:flex}.art-dots i{background:var(--muted-foreground);opacity:.35;border-radius:50%;width:5px;height:5px}:where(.art-sk){display:inline-block}.art-sk{-webkit-text-fill-color:transparent;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;user-select:none;border-radius:999px;max-width:100%;margin-block:.32em;overflow:hidden;background:color-mix(in oklab, currentColor 20%, transparent)!important;width:fit-content!important;height:.62em!important;box-shadow:none!important;border:0!important;flex:0 auto!important;padding:0!important;line-height:1!important}.art-sk-lines{flex-direction:column;align-items:flex-start;gap:2px;min-width:0;display:flex}.art .tile{--art-tone-limit:clamp(10, 15 - 7 * cos(var(--art-hue,28) * 1deg), 20);--hue:calc(var(--art-hue,28) + clamp(-1 * var(--art-tone-limit), var(--hue-shift,0), var(--art-tone-limit)))}:where(.art-tones) .tile:nth-of-type(3n+2){--hue-shift:20}:where(.art-tones) .tile:nth-of-type(3n){--hue-shift:-18}.art-cursor{z-index:5;width:21px;height:26px;color:var(--brand);filter:drop-shadow(0 2px 2px color-mix(in srgb, var(--art-ink) 14%, transparent));pointer-events:none;position:absolute;overflow:visible}.art-cursor path{fill:currentColor;stroke:var(--card);stroke-width:1.5px;stroke-linejoin:round}.art-chip{border:1px solid var(--art-line);border-radius:var(--art-chip-radius,6px);background:color-mix(in srgb, var(--card) 70%, transparent);white-space:nowrap;align-items:center;gap:5px;padding:3px 8px;font-size:11px;display:inline-flex}.art-chip>i{color:var(--muted-foreground);font-size:10px}.art-chip.is-on{background:var(--info-soft);color:var(--info-soft-foreground);border-color:#0000}.art-chip.is-ok{background:var(--success-soft);color:var(--success-soft-foreground);border-color:#0000}.art-chip:is(.is-on,.is-ok)>i{color:inherit}.art-chip.is-out{color:var(--muted-foreground);background:0 0;border-style:dashed}.art-chip.is-del{color:var(--muted-foreground);background:0 0;border-color:#0000;text-decoration:line-through}.art-btn{background:var(--primary);color:var(--primary-foreground);white-space:nowrap;border-radius:7px;justify-content:center;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:500;display:inline-flex}.art-btn.is-ghost{border:1px solid var(--art-line);color:var(--foreground);background:0 0}.art-btn.is-done{background:var(--success-soft);color:var(--success-soft-foreground)}.art-done{background:var(--success-soft);width:fit-content;color:var(--success-soft-foreground);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:11.5px;font-weight:500;display:inline-flex}.art-done>i{font-size:10px}.art-check{background:var(--success-soft);width:16px;height:16px;color:var(--success-soft-foreground);border-radius:50%;flex:none;place-items:center;font-size:8px;display:inline-grid}.art-ai{background:var(--info-soft);color:var(--info-soft-foreground);border-radius:999px;flex:none;align-items:center;gap:5px;padding:1px 6px;font-size:10px;font-style:normal;font-weight:600;display:inline-flex}.art-ai>i{font-size:9px}.art-swap{align-items:center;display:inline-grid}.art-swap>*{grid-area:1/1}.art-swap>.art-before{opacity:0}@keyframes art-rise{0%{opacity:0;transform:translateY(6px)}}.js .reveal:not(.is-in) :is(.art,.art *),.js .reveal.art:not(.is-in) :is(*){animation-play-state:paused!important}.art-wide{width:100%;max-width:956px;margin-inline:auto}.hero-screen .art-wide{max-width:min(956px,100vw - 2*clamp(16px,4vw,40px))}.art-split{gap:clamp(32px,5vw,72px)}.art-split>*{min-width:0}@media (min-width:1001px){.art-split{grid-template-columns:1.1fr 1fr;column-gap:56px;width:100%;max-width:956px;margin-inline:auto}.art-split.how-flip{grid-template-columns:1fr 1.1fr}}@media (max-width:1000px){.art-split{grid-template-columns:minmax(0,1fr)}.art-split.how-flip>:first-child{order:0}}}