.page{padding-top:clamp(24px,5vw,48px);padding-bottom:clamp(48px,8vw,96px)}.page .back{color:var(--ink-soft);margin-bottom:12px;font-size:14px;text-decoration:none;display:inline-block}.page h1{margin-bottom:8px;font-size:clamp(28px,4.5vw,40px)}.page .lead{color:var(--ink-soft);max-width:680px;margin-bottom:24px}.text-input{border:1px solid var(--line);background:var(--paper);width:100%;height:48px;color:var(--ink);font-family:var(--font-mono);border-radius:10px;padding:0 14px;font-size:16px}.text-input:focus,.color-input:focus-visible,.range:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.color-input,.panel .color-input{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:10px;flex:none;width:48px;height:48px;padding:0}.color-input::-webkit-color-swatch-wrapper{padding:4px}.color-input::-webkit-color-swatch{border:0;border-radius:6px}.color-input::-moz-color-swatch{border:0;border-radius:6px}.picker-row{gap:10px;display:flex}.error{color:var(--danger);font-size:14px}.checker{background-color:#fff;background-image:linear-gradient(45deg,#ccc 25%,#0000 25%),linear-gradient(-45deg,#ccc 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ccc 75%),linear-gradient(-45deg,#0000 75%,#ccc 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.values{gap:2px;margin:0;display:grid}.value-row{border-top:1px solid var(--line);grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 0;display:grid}.value-row dt{color:var(--ink-soft);font-size:13px;font-weight:600}.value-row dd{font-family:var(--font-mono);font-variant-ligatures:none;overflow-wrap:anywhere;margin:0;font-size:15px}.small-btn{border:1px solid var(--line);background:var(--paper-raised);height:34px;color:var(--ink-soft);font:inherit;cursor:pointer;white-space:nowrap;border-radius:8px;padding:0 12px;font-size:13px;font-weight:600}.small-btn:hover,.small-btn.copied{border-color:var(--accent);color:var(--accent)}.small-btn.primary{background:var(--accent-soft);color:var(--accent);border-color:#0000}.range-field{color:var(--ink-soft);grid-template-columns:90px minmax(0,1fr) 52px;align-items:center;gap:10px;font-size:14px;display:grid}.range-field output{font-family:var(--font-mono);text-align:right;font-size:13px}.range{-webkit-appearance:none;appearance:none;border:1px solid var(--line);cursor:pointer;border-radius:999px;width:100%;height:14px}.range::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--ink);background:#fff;border-radius:50%;width:20px;height:20px;box-shadow:0 1px 3px #0000004d}.range::-moz-range-thumb{border:2px solid var(--ink);background:#fff;border-radius:50%;width:18px;height:18px}@media (width<=480px){.value-row{grid-template-columns:60px minmax(0,1fr) auto}.range-field{grid-template-columns:76px minmax(0,1fr) 46px}}.page [hidden]{display:none!important}.drop{text-align:center;border:2px dashed var(--line);justify-items:center;gap:12px;padding:clamp(28px,6vw,44px) 20px;transition:border-color .15s,background-color .15s;display:grid}.drop.over{border-color:var(--accent);background:var(--accent-soft)}.drop-title{font-family:var(--font-display);font-size:26px;font-weight:600}.file-btn{cursor:pointer}.file-btn:focus-within{outline:2px solid var(--accent);outline-offset:3px}.privacy{color:var(--ink-soft);font-size:14px}.work{gap:16px;margin-top:20px;display:grid}.work[hidden]{display:none}.panel{gap:16px;padding:20px;display:grid}.panel h2{font-size:22px}.files{gap:8px;margin:0;padding:0;list-style:none;display:grid}.file-row{border:1px solid var(--line);background:var(--paper);border-radius:10px;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;display:grid}.file-row canvas,.file-row img{object-fit:contain;border:1px solid var(--line);background:#fff;border-radius:3px;width:40px;height:auto;max-height:52px}.file-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.file-meta{color:var(--ink-soft);font-size:13px}.row-tools{gap:4px;display:flex}.icon-btn{border:1px solid var(--line);background:var(--paper-raised);width:34px;height:34px;color:var(--ink-soft);font:inherit;cursor:pointer;border-radius:8px;place-items:center;font-size:16px;display:grid}.icon-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.thumbs{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;display:grid}.thumb{border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);border-radius:10px;justify-items:center;gap:6px;padding:10px 8px 8px;font-size:13px;display:grid;position:relative}.thumb canvas{background:#fff;max-width:100%;height:auto;box-shadow:0 1px 3px #00000026}.thumb.picked{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.thumb.dragging{opacity:.4}.thumb.drop-before{box-shadow:-4px 0 0 var(--accent)}.options{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;display:grid}.field{color:var(--ink-soft);gap:6px;font-size:14px;font-weight:600;display:grid}.field small{font-weight:400}.text-input,.select{border:1px solid var(--line);background:var(--paper);width:100%;height:46px;color:var(--ink);font:inherit;border-radius:10px;padding:0 14px;font-size:16px}.select{appearance:none;cursor:pointer;background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:calc(100% - 20px),calc(100% - 15px);background-repeat:no-repeat;background-size:5px 5px}.text-input:focus,.select:focus{outline:2px solid var(--accent);outline-offset:1px}.mono{font-family:var(--font-mono)}.seg{flex-wrap:wrap;gap:8px;display:flex}.seg button{border:1px solid var(--line);background:var(--paper-raised);height:40px;color:var(--ink-soft);font:inherit;cursor:pointer;border-radius:10px;padding:0 14px;font-size:15px;font-weight:600}.seg button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.actions{flex-wrap:wrap;align-items:center;gap:10px 16px;display:flex}.actions .btn{cursor:pointer;font:inherit;border:0;font-size:16px;font-weight:600}.actions .btn:disabled{opacity:.6;cursor:progress;transform:none}.hint{color:var(--ink-soft);font-size:14px}.error{color:var(--danger);font-size:15px;font-weight:600}.error[hidden]{display:none}.done{background:var(--accent-soft);color:var(--accent);border-radius:10px;padding:14px 16px;font-weight:600}.done[hidden]{display:none}.link-btn{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-weight:600;text-decoration:underline}@media (width<=480px){.thumbs{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}}