@keyframes tm-json-done{0%,62%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.08)}74%,90%{opacity:1;transform:scale(1)}95%,to{opacity:0;transform:scale(.6)}}@keyframes tm-json-draw{0%,64%{stroke-dashoffset:14px}74%,to{stroke-dashoffset:0}}.tm--grad{--tm-cycle:7.2s}.tm-grad-a{stop-color:var(--surface-inset)}.tm-grad-b{stop-color:var(--border-strong)}.tm-grad-c{stop-color:var(--text)}.tm-grad-band{fill:url(#tm-grad-ramp)}.tm-grad-wipe{fill:var(--surface);animation:tm-grad-wipe var(--tm-cycle) var(--ease) infinite;transform:translate(150px)}@keyframes tm-grad-wipe{0%,30%{transform:translate(0)}52%,92%{transform:translate(150px)}to{transform:translate(0)}}.tm-grad-stop{animation:tm-grad-stop var(--tm-cycle) var(--ease) infinite backwards}.tm-grad-stop--2{animation-delay:90ms}.tm-grad-stop--3{animation-delay:.18s}@keyframes tm-grad-stop{0%,4%{opacity:0;transform:translateY(-9px)}16%,92%{opacity:1;transform:none}97%,to{opacity:0;transform:translateY(-9px)}}.tm-grad-eye{fill:var(--text-subtle)}.tm-grad-sel{fill:var(--surface);stroke:var(--accent);stroke-width:2px}.tm-grad-arrow{stroke:var(--text);stroke-width:1.6px;stroke-linecap:round}.tm-grad-prop{fill:var(--text-subtle)}.tm-grad-card{animation:tm-grad-card var(--tm-cycle) var(--ease) infinite}@keyframes tm-grad-card{0%,50%{opacity:0;transform:translate(9px)scale(.96)}58%,92%{opacity:1;transform:none}97%,to{opacity:0;transform:translate(9px)scale(.96)}}.tm-grad-line{animation:tm-grad-line var(--tm-cycle) var(--ease) infinite backwards}.tm-grad-line--2{animation-delay:60ms}.tm-grad-line--3{animation-delay:.12s}.tm-grad-line--4{animation-delay:.18s}.tm-grad-line--5{animation-delay:.24s}.tm-grad-line--6{animation-delay:.3s}@keyframes tm-grad-line{0%,56%{opacity:0;transform:translate(7px)}64%,92%{opacity:1;transform:none}97%,to{opacity:0;transform:translate(7px)}}.tm--grad .tm-done{animation:tm-json-done var(--tm-cycle) var(--ease) infinite}.tm--grad .tm-tick{animation:tm-json-draw var(--tm-cycle) var(--ease) infinite}.grad{flex-direction:column;gap:12px;display:flex;container-type:inline-size}.grad__bar,.grad__stopbar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.grad__spacer{flex:1}.grad__field{color:var(--text-muted);align-items:center;gap:6px;font-size:.8125rem;display:inline-flex}.grad__field--wide{gap:8px}.grad__unit{font-family:var(--font-mono);color:var(--text-subtle);font-variant-numeric:tabular-nums;font-size:.75rem}.grad__num{text-align:center;font-variant-numeric:tabular-nums;width:62px;height:32px;padding:0 6px;font-size:.8125rem}.grad__hex{width:92px;height:32px;font-family:var(--font-mono);text-transform:lowercase;padding:0 8px;font-size:.8125rem}.grad__panes{gap:14px;min-height:0;display:grid}@container (width>=780px){.grad__panes{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}.grad__pane{flex-direction:column;gap:8px;min-width:0;min-height:0;display:flex}.grad__head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;min-height:30px;display:flex}.grad__title{font-family:var(--font);color:var(--text-muted);margin:0;font-size:.8125rem;font-weight:600}.grad__head-actions{align-items:center;gap:6px;display:flex}.grad__head-actions .btn{height:26px;padding:0 8px;font-size:.75rem}.grad__head-actions .segmented{padding:1px}.grad__head-actions .segmented button{padding:3px 9px;font-size:.75rem}.grad__head-actions .select{height:26px;font-size:.75rem}.grad__stage{border:1px solid var(--border);border-radius:var(--r-lg);background-color:var(--surface);background-image:linear-gradient(45deg, var(--border) 25%, transparent 25%), linear-gradient(-45deg, var(--border) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--border) 75%), linear-gradient(-45deg, transparent 75%, var(--border) 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;overflow:hidden}.grad__preview{aspect-ratio:16/9;background-position:50%;background-size:cover;min-height:260px}.grad__actions{align-items:center;gap:6px;display:inline-flex}.grad__trackwrap{flex-direction:column;gap:6px;display:flex}.grad__rail{border:1px solid var(--border);border-radius:9px;height:18px}.grad__track{cursor:copy;height:24px;margin-top:-27px;position:relative}.grad__stop{border:2px solid var(--surface);background:var(--stop-color,var(--surface));width:20px;height:20px;box-shadow:0 0 0 1px var(--border-input);cursor:grab;touch-action:none;border-radius:50%;margin-left:-10px;padding:0;position:absolute;top:2px}.grad__stop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.grad__stop.is-selected{box-shadow:0 0 0 2px var(--accent)}.grad__stop.is-dragging{cursor:grabbing}.grad__hint{color:var(--text-subtle);margin:0;font-size:.75rem}.grad__swatch{border:1px solid var(--border-input);border-radius:var(--r-sm);background:var(--surface);cursor:pointer;width:32px;height:32px;padding:2px}.grad__swatch::-webkit-color-swatch-wrapper{padding:0}.grad__swatch::-webkit-color-swatch{border:0;border-radius:3px}.grad__swatch::-moz-color-swatch{border:0;border-radius:3px}.grad__out{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);overflow:auto}.grad__code{font-family:var(--font-mono);white-space:pre-wrap;word-break:break-word;background:0 0;border:0;margin:0;padding:12px;font-size:.8125rem;line-height:1.65}.grad__presets{flex-direction:column;gap:8px;display:flex}.grad__swatches{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;display:grid}.grad__preset{border:1px solid var(--border-input);border-radius:var(--r-md);cursor:pointer;align-items:flex-end;height:46px;padding:0;display:flex;overflow:hidden}.grad__preset:hover{border-color:var(--border-hover)}.grad__preset:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.grad__preset span{width:100%;color:var(--text);text-align:left;background:light-dark(#ffffffdb,#14121ad1);padding:2px 6px;font-size:.6875rem;font-weight:600}.grad__verdict,.grad__note{color:var(--text-muted);margin:0;font-size:.8125rem}.grad__note{color:var(--text-subtle)}.grad__host{flex-direction:column;height:100%;min-height:0;display:flex}.grad__host .grad{flex:1;min-height:0}.grad__host .grad__preview{min-height:320px}