:root{--glass:#ffffff8c;--glass-border:#ffffffa6;--ink:#14161ce0;--ink-2:#14161c8c;--accent:#4f7cff;--spring:cubic-bezier(.34, 1.56, .64, 1)}@media (prefers-color-scheme:dark){:root{--glass:#1c1e248c;--glass-border:#ffffff24;--ink:#f5f6faeb;--ink-2:#f5f6fa8c;--accent:#6f92ff}}*{box-sizing:border-box}.stage{background:#e8ebf2;justify-content:center;align-items:center;min-height:100vh;padding:24px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Inter,Segoe UI,sans-serif;display:flex;position:relative;overflow:hidden}@media (prefers-color-scheme:dark){.stage{background:#0e1015}}.blob{filter:blur(70px);opacity:.55;border-radius:50%;animation:26s ease-in-out infinite alternate drift;position:absolute}.b1{background:#7aa2ff;width:46vmax;height:46vmax;top:-18%;left:-12%}.b2{background:#b48cff;width:40vmax;height:40vmax;animation-delay:-8s;bottom:-20%;right:-10%}.b3{background:#6fd6c9;width:30vmax;height:30vmax;animation-delay:-16s;top:40%;left:55%}@keyframes drift{0%{transform:translate(0)scale(1)}to{transform:translate(6vmax,-4vmax)scale(1.12)}}@media (prefers-reduced-motion:reduce){.blob{animation:none}.pop{animation:none!important}}.card{background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(24px)saturate(1.6);backdrop-filter:blur(24px)saturate(1.6);width:min(480px,100%);color:var(--ink);border-radius:28px;padding:28px 26px 26px;position:relative;box-shadow:0 8px 32px #00000024,inset 0 1px #ffffff59}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.card{background:#f0f2f8eb}@media (prefers-color-scheme:dark){.card{background:#1c1e24f0}}}.head h1{letter-spacing:-.02em;margin:0;font-size:26px;font-weight:700}.head p{color:var(--ink-2);margin:4px 0 20px;font-size:14px}.field-wrap{margin-bottom:18px;position:relative}.field{resize:none;width:100%;font:inherit;color:var(--ink);background:#ffffff73;border:none;border-radius:16px;outline:none;padding:14px 16px;font-size:15px;transition:box-shadow .25s;box-shadow:inset 0 1px 3px #0000000f}@media (prefers-color-scheme:dark){.field{background:#00000047}}.field:focus-visible{box-shadow:inset 0 1px 3px #0000000f, 0 0 0 3px color-mix(in srgb, var(--accent) 45%, transparent)}.count{color:var(--ink-2);font-size:11px;position:absolute;bottom:8px;right:10px}.count.warn{color:#d05b3c;font-weight:600}.seg-wrap{align-items:center;gap:12px;margin-bottom:12px;display:flex}.seg-label{letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);flex:0 0 118px;font-size:12px}.seg{background:#787e8c29;border-radius:12px;flex:1;padding:2px;display:flex;position:relative}.seg-pill{transition:transform .35s var(--spring);background:#ffffffe6;border-radius:10px;position:absolute;top:2px;bottom:2px;left:2px;box-shadow:0 1px 4px #0000001f}@media (prefers-color-scheme:dark){.seg-pill{background:#ffffff2e}}.seg-btn{z-index:1;cursor:pointer;font:inherit;color:var(--ink-2);transition:color .2s ease, transform .2s var(--spring);background:0 0;border:none;border-radius:10px;flex:1;padding:7px 0;font-size:13px;font-weight:600;position:relative}.seg-btn:active{transform:scale(.95)}.seg-btn.active{color:var(--ink)}.seg-btn:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.colors{margin-top:2px}.presets{flex-wrap:wrap;flex:1;align-items:center;gap:12px;display:flex}.preset{cursor:pointer;width:28px;height:28px;transition:transform .2s var(--spring);border-radius:50%;padding:0;box-shadow:0 1px 5px #0003}.preset:hover{transform:scale(1.15)}.preset:active{transform:scale(.95)}.preset:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.custom-row{flex-wrap:wrap;align-items:center;gap:14px;margin-left:130px;display:flex}.mini-seg{background:#787e8c29;border-radius:999px;padding:2px;display:flex}.mini-btn{cursor:pointer;font:inherit;color:var(--ink-2);background:0 0;border:none;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:600;transition:background .2s,color .2s}.mini-btn.active{color:var(--ink);background:#ffffffe6;box-shadow:0 1px 3px #0000001f}@media (prefers-color-scheme:dark){.mini-btn.active{background:#ffffff2e}}.mini-btn:focus-visible{outline:2px solid var(--accent)}.dots-row{gap:12px;display:flex}.cdot{cursor:pointer;flex-direction:column;align-items:center;gap:3px;display:flex}.cdot-swatch{width:26px;height:26px;transition:transform .2s var(--spring);border:1px solid #00000026;border-radius:50%;position:relative;box-shadow:inset 0 1px 2px #fff6,0 1px 4px #00000026}.cdot-swatch:hover{transform:scale(1.12)}.cdot-swatch input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.cdot-label{letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);font-size:10px;font-weight:600}.scan-warn{color:#d05b3c;margin:10px 0 0 130px;font-size:12px;font-weight:600}.preview{justify-content:center;align-items:center;min-height:232px;margin:18px 0;display:flex}.tile{border-radius:20px;width:216px;height:216px;padding:12px;transition:background .25s;box-shadow:0 6px 24px #00000029}.tile svg{width:100%;height:100%;display:block}.pop{animation:pop .35s var(--spring)}@keyframes pop{0%{opacity:.4;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.empty{color:var(--ink-2);text-align:center;max-width:280px;font-size:14px;line-height:1.5}.actions{gap:10px;display:flex}.btn{border:1px solid var(--glass-border);cursor:pointer;font:inherit;color:var(--ink);transition:transform .2s var(--spring), opacity .2s ease;background:#ffffff59;border-radius:999px;flex:1;padding:12px 0;font-size:14px;font-weight:600}@media (prefers-color-scheme:dark){.btn{background:#ffffff14}}.btn.primary{color:#fff;background:color-mix(in srgb, var(--accent) 85%, transparent);box-shadow:0 4px 16px color-mix(in srgb, var(--accent) 35%, transparent);border-color:#0000}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:default}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.toast{color:var(--ink);background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);opacity:0;pointer-events:none;transition:opacity .25s ease, transform .35s var(--spring);border-radius:999px;padding:10px 18px;font-size:13px;font-weight:600;position:fixed;bottom:28px;left:50%;transform:translate(-50%,16px);box-shadow:0 6px 20px #0000002e}.toast.show{opacity:1;transform:translate(-50%)}@media (width<=440px){.seg-label{flex-basis:92px}.custom-row,.scan-warn{margin-left:0}}