@layer theme,base;@layer components{.fit-card{background:linear-gradient(160deg, var(--color-card-2), var(--color-card) 60%);border:1px solid var(--line);border-radius:10px;padding:clamp(1.5rem,4vw,3rem);box-shadow:inset 0 1px #eee8dc1a,0 30px 60px -30px #000000b3}.fit-image{aspect-ratio:4/5;max-inline-size:18rem}.fit-image img{object-fit:cover;block-size:100%}.fit-sticker{border:1px solid var(--line-strong);border-radius:var(--radius-m);background:var(--stage);font-family:var(--font-mono);font-size:var(--text-meta);color:var(--ink);padding:.35rem 1rem;position:absolute;inset-block-start:-1.1rem;inset-inline-start:1.5rem;rotate:-2deg}.fit-shape{pointer-events:none;inline-size:clamp(4rem,6vw,6rem);position:absolute;inset-block-start:-2.4rem;inset-inline-end:-1.5rem}@media not (min-width:40rem){.fit-shape{inline-size:3.5rem;inset-inline-end:-.5rem}}.fld{padding-block-start:1.25rem;position:relative}.fld input,.fld textarea{border:0;border-block-end:1px solid var(--line-strong);inline-size:100%;color:var(--ink);transition:border-color .22s var(--ease-std);background:0 0;border-radius:0;padding-block:.6rem .5rem;font-size:1.125rem}.fld textarea{resize:vertical;min-block-size:5.5rem}.fld input:focus,.fld textarea:focus{border-block-end-color:var(--ink);box-shadow:0 1px 0 var(--ink);outline:none}.fld input:focus-visible,.fld textarea:focus-visible{outline:2px solid var(--focus);outline-offset:4px}.fld label{color:var(--muted);pointer-events:none;transform-origin:100% 0;transition:transform .22s var(--ease-std), color .22s;font-size:1.125rem;position:absolute;inset-block-start:1.85rem;inset-inline-start:0}.fld input:focus+label,.fld input:not(:placeholder-shown)+label,.fld textarea:focus+label,.fld textarea:not(:placeholder-shown)+label{color:var(--ink-2);transform:translateY(-1.5rem)scale(.72)}.fld input[dir=ltr]{text-align:end}.fld .opt{font-size:.85em}.fld-msg{font-size:var(--text-sm);color:var(--error);margin-block-start:.5rem}.fld-error input,.fld-error textarea{border-block-end-color:var(--error)}html.motion .fld-error .fld-msg{animation:.34s shake}@keyframes shake{25%{translate:5px}75%{translate:-5px}}.peer:checked+.chip{background:var(--ink);border-color:var(--ink);color:var(--stage)}.peer:focus-visible+.chip{outline:2px solid var(--focus);outline-offset:2px}}@layer utilities;