:root{--paper:#f5f6f8;--surface:#fff;--glass:#f8f9fbb8;--glass-strong:#ffffffb8;--glass-border:#ffffffb3;--ink:#15181f;--muted:#5a6274;--line:#e3e6ec;--line-strong:#ced4df;--signal:#15181f;--signal-soft:#eef0f3;--warn:#b4531a;--font-ui:system-ui, -apple-system, "Segoe UI Variable Text", "Segoe UI", sans-serif;--font-mono:ui-monospace, "Cascadia Code", "Segoe UI Mono", Consolas, monospace;--mod:8px}*,:before,:after{box-sizing:border-box}html{background:var(--paper)}body{padding:clamp(calc(var(--mod) * 1.5), 2.5vw, calc(var(--mod) * 5));color:var(--ink);font-family:var(--font-ui);-webkit-text-size-adjust:100%;background:0 0;margin:0;font-size:16px;line-height:1.5}#shader-background{z-index:0;pointer-events:none;background:var(--paper);position:fixed;top:0;bottom:0;left:0;right:0;overflow:hidden}#shader-background canvas{width:100%;height:100%;display:block}.shell{z-index:1;max-width:1140px;padding:clamp(calc(var(--mod) * 2.5), 3.5vw, calc(var(--mod) * 6));background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(28px)saturate(125%);border-radius:18px;margin:0 auto;position:relative;box-shadow:inset 0 1px #fff9,0 24px 70px -28px #15181f47}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.shell{background:#f8f9fbed}}@media (max-width:599px){.shell{padding:calc(var(--mod) * 2.5) calc(var(--mod) * 2);border-radius:12px}}.masthead{gap:calc(var(--mod) * 2.5);margin:0 0 calc(var(--mod) * 4);padding:0 0 calc(var(--mod) * 3);border-bottom:1px solid var(--line);grid-template-columns:1fr auto;display:grid}.mark{width:22px;height:22px;color:var(--ink)}.brand,.colophon__brand{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:10px;font-size:.8125rem;font-weight:650;text-decoration:none;display:inline-flex}.brand{grid-column:1/-1}.brand .mark{color:var(--signal)}.masthead__content{max-width:58ch}.eyebrow{margin:0 0 calc(var(--mod) * .75);color:var(--signal);letter-spacing:.1em;text-transform:uppercase;font-size:.6875rem;font-weight:700}.masthead h1{margin:0 0 var(--mod);letter-spacing:-.045em;font-size:clamp(1.55rem,3vw,2.15rem);font-weight:650;line-height:1.08}.masthead__note{max-width:52ch;color:var(--muted);max-width:48ch;margin:0;font-size:.875rem;line-height:1.6}.masthead__trust{color:var(--muted);letter-spacing:.035em;text-transform:uppercase;flex-direction:column;justify-content:end;align-items:end;gap:5px;padding-bottom:2px;font-size:.6875rem;font-weight:600;display:flex}.masthead__trust span:before{content:"";background:var(--signal);border-radius:50%;width:5px;height:5px;margin:0 7px 1px 0;display:inline-block}.layout{gap:calc(var(--mod) * 4);max-width:68ch;margin:0 auto;display:grid}@media (min-width:900px){.layout{gap:calc(var(--mod) * 6);grid-template-columns:minmax(0,1fr) minmax(320px,400px);align-items:start;max-width:none}.controls{order:-1}.stage{top:calc(var(--mod) * 4);position:sticky}}.stage{gap:calc(var(--mod) * 2);display:grid}.stage__frame{padding:calc(var(--mod) * 2.5);background:var(--surface);border:1px solid #ffffffe6;border-radius:12px;box-shadow:0 2px 6px -1px #15181f17,0 18px 42px -14px #15181f38}#preview{width:100%;height:auto;image-rendering:pixelated;margin-inline-start:auto;margin-inline-end:auto;display:block}@media (max-width:899px){#preview{width:auto;max-width:100%;max-height:42vh}}.readout{min-height:1.2em;font-family:var(--font-mono);color:var(--muted);letter-spacing:.02em;margin:0;font-size:.75rem}.payload{gap:calc(var(--mod) * .5);display:grid}.payload__label{letter-spacing:.06em;color:var(--muted);font-size:.6875rem;font-weight:600}.payload__value{max-height:9em;padding:var(--mod);overflow-wrap:anywhere;white-space:pre-wrap;background:var(--glass-strong);border:1px solid var(--glass-border);font-family:var(--font-mono);border-radius:5px;font-size:.75rem;line-height:1.6;overflow-y:auto}.verify{align-items:baseline;gap:calc(var(--mod) * .75);min-height:1.4em;font-family:var(--font-mono);color:var(--muted);margin:0;font-size:.75rem;line-height:1.5;display:flex}.verify:before{content:"·";flex:none;font-size:1rem}.verify[data-state=pendiente]{color:var(--muted)}.verify[data-state=pendiente]:before{content:"·"}.verify[data-state=ok]{color:var(--ink)}.verify[data-state=ok]:before{content:"✓"}.verify[data-state=ilegible],.verify[data-state=difiere]{color:var(--warn);font-weight:500}.verify[data-state=ilegible]:before,.verify[data-state=difiere]:before{content:"✕"}.alert{padding:var(--mod) calc(var(--mod) * 1.5);background:var(--glass-strong);border-left:2px solid var(--warn);color:var(--warn);margin:0;font-size:.8125rem}.controls{gap:calc(var(--mod) * 3);display:grid}.group{gap:calc(var(--mod) * 2);border:0;margin:0;padding:0;display:grid}.group__title{align-items:center;gap:var(--mod);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);padding:0;font-size:.6875rem;font-weight:700;display:flex}.group__title:before{content:"";border:2px solid var(--signal);width:9px;height:9px;box-shadow:inset 0 0 0 1px var(--surface), 0 0 0 2px var(--signal-soft);flex:none}.row{gap:var(--mod);display:grid}.types{gap:var(--mod);flex-wrap:wrap;display:flex}.type{position:relative}.type input{opacity:0;cursor:pointer;position:absolute;top:0;bottom:0;left:0;right:0}.type span{padding:calc(var(--mod) * .9) calc(var(--mod) * 1.25);background:0 0;border:1px solid #d7dce4b8;border-radius:5px;align-items:center;gap:7px;font-size:.875rem;transition:border-color .12s,color .12s;display:flex}.type input:checked+span{border-color:var(--signal);background:var(--signal-soft);color:var(--signal)}.type__icon{flex:none;width:15px;height:15px}.type input:focus-visible+span{outline:2px solid var(--signal);outline-offset:2px}.fields{gap:calc(var(--mod) * 2);display:grid}.field{gap:calc(var(--mod) * .75);display:grid}.shapes{gap:var(--mod);display:grid}.shapes__title{font-size:.8125rem;font-weight:500}.shapes__row{gap:var(--mod);grid-template-columns:repeat(4,1fr);display:grid}.shape{position:relative}.shape input{opacity:0;cursor:pointer;position:absolute;top:0;bottom:0;left:0;right:0}.shape__box{justify-items:center;gap:calc(var(--mod) * .5);padding:var(--mod) calc(var(--mod) * .5);color:var(--ink);background:0 0;border:1px solid #d7dce4b8;border-radius:5px;transition:border-color .12s,color .12s;display:grid}.shape__box svg{width:22px;height:22px}.shape__label{text-align:center;color:var(--muted);font-size:.6875rem;line-height:1.2}.shape input:checked+.shape__box{border-color:var(--signal);background:var(--signal-soft);color:var(--signal)}.shape input:checked+.shape__box .shape__label{color:var(--signal)}.shape input:focus-visible+.shape__box{outline:2px solid var(--signal);outline-offset:2px}.eye-color{align-items:center;gap:var(--mod);flex-wrap:wrap;display:flex}.eye-color__toggle{align-items:center;gap:calc(var(--mod) * .75);cursor:pointer;font-size:.8125rem;font-weight:400;display:flex}.eye-color__toggle input[type=checkbox]{width:15px;height:15px;accent-color:var(--ink);margin:0}.eye-color input[type=color]{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:5px;width:32px;height:32px;padding:0}.eye-color input[type=color]:disabled{opacity:.35;cursor:not-allowed}.colors{align-items:end;gap:calc(var(--mod) * 2);flex-wrap:wrap;display:flex}.color{gap:calc(var(--mod) * .5);justify-items:start;display:grid}.color input[type=color]{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:5px;width:44px;height:44px;padding:0}.color__hex{font-family:var(--font-mono);color:var(--muted);font-size:.6875rem}input[type=file]{color:var(--muted);font-size:.8125rem}input[type=file]::-webkit-file-upload-button{margin-right:var(--mod);padding:calc(var(--mod) * .75) calc(var(--mod) * 1.5);font:inherit;background:var(--glass-strong);color:var(--ink);border:1px solid var(--line-strong);cursor:pointer;border-radius:5px;font-size:.8125rem;font-weight:500;transition:background-color .12s,border-color .12s}input[type=file]::file-selector-button{margin-right:var(--mod);padding:calc(var(--mod) * .75) calc(var(--mod) * 1.5);font:inherit;background:var(--glass-strong);color:var(--ink);border:1px solid var(--line-strong);cursor:pointer;border-radius:5px;font-size:.8125rem;font-weight:500;transition:background-color .12s,border-color .12s}input[type=file]::-webkit-file-upload-button:hover{background:var(--surface);border-color:var(--ink)}input[type=file]::file-selector-button:hover{background:var(--surface);border-color:var(--ink)}label{font-size:.8125rem;font-weight:500}input[type=text],input[type=url],input[type=password],input[type=tel],input[type=email],input[type=number],input[type=datetime-local],textarea,select{width:100%;padding:calc(var(--mod) * 1.25) calc(var(--mod) * 1.5);font:inherit;color:var(--ink);border:1px solid var(--line);background:#ffffff80;border-radius:5px;font-size:.9375rem;transition:border-color .12s,box-shadow .12s}input[type=text]:hover,input[type=url]:hover,input[type=password]:hover,input[type=tel]:hover,input[type=email]:hover,input[type=number]:hover,input[type=datetime-local]:hover,textarea:hover,select:hover{border-color:var(--line-strong)}input[type=text]:focus,input[type=url]:focus,input[type=password]:focus,input[type=tel]:focus,input[type=email]:focus,input[type=number]:focus,input[type=datetime-local]:focus,textarea:focus,select:focus{border-color:var(--signal);box-shadow:0 0 0 3px var(--signal-soft);outline:none}textarea{resize:vertical;min-height:6em;font-family:var(--font-mono);font-size:.875rem}:focus-visible{outline:2px solid var(--signal);outline-offset:2px}.hint{max-width:44ch;color:var(--muted);margin:0;font-size:.75rem;line-height:1.45}.btn{padding:calc(var(--mod) * 1.5) calc(var(--mod) * 2);font:inherit;color:var(--ink);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:5px;font-size:.875rem;font-weight:500;transition:border-color .12s,background-color .12s}.btn:hover:not(:disabled){border-color:var(--ink)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--ink);color:var(--surface);border-color:var(--ink)}.btn--primary:hover:not(:disabled){background:#000}.btn--quiet{padding:var(--mod) calc(var(--mod) * 1.5);justify-self:start;font-size:.8125rem}.actions{gap:var(--mod);flex-wrap:wrap;display:flex}.actions .btn{flex:auto}.colophon{column-gap:calc(var(--mod) * 8);row-gap:var(--mod);margin:calc(var(--mod) * 6) 0 0;padding-top:calc(var(--mod) * 3);border-top:1px solid var(--line);grid-template-columns:1fr minmax(0,58ch);display:grid}.colophon p{color:var(--muted);margin:0;font-size:.8125rem;line-height:1.6}.colophon__brand{grid-row:span 2;align-self:start}.colophon__fineprint{color:var(--muted);font-size:.75rem!important}@media (max-width:899px){.masthead{gap:calc(var(--mod) * 2);grid-template-columns:1fr}.masthead__trust{flex-flow:wrap;justify-content:start;align-items:center;padding:0}.colophon{gap:var(--mod);grid-template-columns:1fr}.colophon__brand{margin-bottom:var(--mod);grid-row:auto}}@media (prefers-reduced-motion:reduce){*{transition-duration:0s!important;animation-duration:0s!important}}