.try{text-align:left;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:start;gap:clamp(1.25rem,3vw,2.5rem);display:grid}.try__bench{gap:.75rem;display:grid}.try__drop{aspect-ratio:1;border-radius:var(--sc-r-lg);background:repeating-linear-gradient(45deg, #ffffff04 0 10px, transparent 10px 20px), var(--sc-surface);width:100%;max-height:70svh;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .16s var(--sc-ease-out);place-items:center;margin-inline:auto;display:grid;position:relative;overflow:hidden}.try__drop[data-drag]{box-shadow:inset 0 0 0 2px var(--sc-accent)}.try__pick{cursor:pointer;width:100%;height:100%;color:inherit;border-radius:inherit;background:0 0;border:0;place-content:center;justify-items:center;gap:.5rem;padding:2rem;display:grid}.try__pick-title{font-size:1.05rem;font-weight:600}.try__pick-sub{color:var(--sc-ink-soft);font-size:var(--sc-t-sm)}.try__result{place-items:center;display:grid;position:absolute;inset:0}.try__canvas{object-fit:contain;image-rendering:auto;width:100%;height:100%;transition:filter .3s var(--sc-ease-out)}.try__canvas[data-phase=preview]{filter:saturate(.85)brightness(.96)}.try__canvas[data-phase=decoding]{opacity:0}.try__thumb{object-fit:cover;width:4.5rem;height:4.5rem;box-shadow:0 0 0 2px var(--sc-canvas), var(--sc-e2);border-radius:8px;position:absolute;bottom:.75rem;left:.75rem}.try__status{min-height:1.5em;font-size:var(--sc-t-sm);color:var(--sc-ink-soft);font-variant-numeric:tabular-nums;margin:0}.try__status[data-error]{color:var(--bad)}.try__controls{gap:1.5rem;display:grid}.try__controls fieldset{border:0;min-width:0;margin:0;padding:0}.try__legend{font-size:var(--sc-t-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .6rem;padding:0;font-weight:600}.try__mats{grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;display:grid}.try__mat{border-radius:var(--sc-r-md);cursor:pointer;font-size:var(--sc-t-sm);box-shadow:inset 0 0 0 1px var(--line);align-items:center;gap:.6rem;padding:.55rem .7rem;transition:box-shadow .16s,background-color .16s;display:flex;position:relative}.try__mat input{opacity:0;cursor:pointer;position:absolute;inset:0}.try__mat:has(input:checked){box-shadow:inset 0 0 0 1.5px var(--sc-accent);background:#ff6a2b12}.try__mat:has(input:focus-visible){outline:2px solid var(--sc-accent);outline-offset:2px}@media (hover:hover) and (pointer:fine){.try__mat:hover{background:#ffffff08}}.try__swatch{border-radius:50%;flex:none;width:1.4rem;height:1.4rem}.try__sample{border-radius:var(--sc-r-md);background:var(--sc-surface);height:2.5rem;box-shadow:inset 0 0 0 1px var(--line);color:var(--sc-ink);cursor:pointer;font-size:var(--sc-t-sm);border:0;align-items:center;gap:.5rem;padding:0 .8rem 0 .35rem;display:inline-flex}.try__sample img{object-fit:cover;border-radius:6px;width:1.9rem;height:1.9rem}.try__sample:active{transform:translateY(1px)}.try__lock{font-size:var(--sc-t-sm);color:var(--sc-ink-soft);align-items:center;gap:.45rem;margin:0;display:flex}.try--compact .try__drop{max-height:52svh}@media (max-width:860px){.try{grid-template-columns:1fr}.try__drop{max-height:none}}.ring-loader{display:block;position:absolute}.ring-loader span{background:var(--sc-accent);opacity:.15;border-radius:50%;animation:1s linear infinite ring-dot;position:absolute;translate:-50% -50%}@keyframes ring-dot{0%{opacity:1}60%,to{opacity:.15}}@media (prefers-reduced-motion:reduce){.ring-loader span{opacity:.7;animation:none}}
