.site-preferences{align-items:center;gap:var(--space-1);flex:none;display:flex}.theme-switch,.site-preferences .language-switch{width:44px;min-width:44px;min-height:44px;color:var(--color-text);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:0;justify-content:center;align-items:center;padding:0;font-weight:650;text-decoration:none;display:inline-flex}.theme-switch span{background:currentColor;width:16px;height:16px;display:block}.theme-switch:disabled{cursor:default;opacity:.45}.theme-switch:focus-visible,.site-preferences .language-switch:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}:root[data-theme=dark]{color-scheme:dark;--color-canvas:#1f1c1d;--color-surface:#292526;--color-surface-muted:#353031;--color-surface-hover:#3c3537;--color-text:#f7f4f1;--color-text-muted:#cecaca;--color-border:#534b4d;--color-border-strong:#807778;--color-info:#bdcddd;--color-info-background:#26303d;--color-info-border:#697e9c;--color-success:#bfd9b8;--color-success-background:#243322;--color-warning:var(--color-thinker-orange-light);--color-error:#efc2bb;--color-error-background:#3f2926;--color-error-border:#9e665d;--color-focus:#8bb3ff}:root[data-theme=light]{color-scheme:light}:root{color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;--color-scout-blue:#21497b;--color-thinker-orange:#eb7114;--color-builder-green:#47a036;--color-auditor-red:#971607;--color-core-graphite:#443a3b;--color-black:#000;--color-white:#fff;--color-palette-citron:#ddd605;--color-palette-porcelain:#e3d4d1;--color-palette-fog:#cecaca;--color-palette-warm-graphite:var(--color-core-graphite);--color-palette-carmine:var(--color-auditor-red);--color-palette-clay:#b4684d;--color-palette-saffron:#deb12d;--color-palette-leaf:var(--color-builder-green);--color-palette-lagoon:#2cbaa8;--color-palette-deep-blue:var(--color-scout-blue);--color-palette-violet:#9a5cc6;--color-palette-tangerine:var(--color-thinker-orange);--color-palette-sky:#8bb3ff;--color-palette-amber:#fa0;--color-palette-citron-shade:#373501;--color-palette-porcelain-shade:#383534;--color-palette-fog-shade:#333232;--color-palette-warm-graphite-shade:#110e0e;--color-palette-carmine-shade:#250501;--color-palette-clay-shade:#2d1a13;--color-palette-saffron-shade:#372c0b;--color-palette-leaf-shade:#04280d;--color-palette-lagoon-shade:#0b2e2a;--color-palette-deep-blue-shade:#08121e;--color-palette-violet-shade:#261731;--color-palette-tangerine-shade:#3b1d05;--color-palette-sky-shade:#232d40;--color-palette-amber-olive-shade:#2a2a00;--color-palette-amber-brown-shade:#402a00;--color-scout-blue-soft:#eaf0f6;--color-scout-blue-border:#bdcddd;--color-scout-blue-strong:#17375f;--color-thinker-orange-soft:#fff1df;--color-thinker-orange-border:#f2d3ad;--color-thinker-orange-strong:#70420f;--color-thinker-orange-light:#efb47c;--color-builder-green-soft:#edf5ea;--color-builder-green-border:#bfd9b8;--color-builder-green-strong:#287523;--color-auditor-red-soft:#f8eae8;--color-auditor-red-border:#dfbcb6;--color-auditor-red-strong:#7b1105;--color-info:var(--color-scout-blue-strong);--color-info-accent:var(--color-scout-blue);--color-info-background:var(--color-scout-blue-soft);--color-info-border:var(--color-scout-blue-border);--color-success:var(--color-builder-green-strong);--color-success-accent:var(--color-builder-green);--color-success-background:var(--color-builder-green-soft);--color-success-border:var(--color-builder-green-border);--color-warning:var(--color-thinker-orange-strong);--color-warning-accent:var(--color-thinker-orange);--color-warning-background:var(--color-thinker-orange-soft);--color-warning-border:var(--color-thinker-orange-border);--color-error:var(--color-auditor-red-strong);--color-error-accent:var(--color-auditor-red);--color-error-background:var(--color-auditor-red-soft);--color-error-border:var(--color-auditor-red-border);--color-canvas:#f7f6f4;--color-surface:#fff;--color-surface-inverse:#292526;--color-surface-muted:#f1efed;--color-surface-hover:#f2edeb;--color-text:#292526;--color-text-muted:#70696a;--color-text-inverse:#f7f4f1;--color-text-on-dark-muted:#e3dcda;--color-border:#e1dedd;--color-border-strong:#bfb7b5;--color-focus:var(--color-scout-blue);--font-size-small:.875rem;--font-size-body:1rem;--font-size-lead:1.0625rem;--font-size-heading-small:1.125rem;--font-size-heading:1.5rem;--font-size-title:2.75rem;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--radius-sm:.5rem;--radius-md:.875rem;--radius-lg:1.25rem;--radius-pill:999px;--shadow-soft:0 18px 48px #29252612;font-family:Space Grotesk,sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--color-canvas:#1f1c1d;--color-surface:#292526;--color-surface-muted:#353031;--color-surface-hover:#3c3537;--color-text:#f7f4f1;--color-text-muted:#cecaca;--color-border:#534b4d;--color-border-strong:#807778;--color-info:#bdcddd;--color-info-background:#26303d;--color-info-border:#697e9c;--color-success:#bfd9b8;--color-success-background:#243322;--color-error:#efc2bb;--color-error-background:#3f2926;--color-error-border:#9e665d;--color-focus:#8bb3ff}}*,:before,:after{box-sizing:border-box}html [hidden]{display:none}:root{--motion-fast:.16s;--motion-standard:.24s;--motion-reveal:.36s;--motion-ease:cubic-bezier(.2, .7, .2, 1)}html,body{background:var(--color-canvas)}body{color:var(--color-text);font-size:var(--font-size-body);-webkit-font-smoothing:antialiased;margin:0;line-height:1.6}button,input{font:inherit;min-width:0}button{cursor:pointer}a{color:var(--color-info);text-underline-offset:.2em}:focus-visible,summary:focus{outline:3px solid var(--color-focus);outline-offset:4px}.app-shell{width:min(100%,72rem);padding:var(--space-8);margin-inline:auto}.skip-link{top:var(--space-2);left:var(--space-2);z-index:2;padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);background:var(--color-surface);position:fixed;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}.site-header,.site-footer{justify-content:space-between;align-items:center;gap:var(--space-6);flex-wrap:wrap;display:flex}.site-header a,.site-footer a{align-items:center;min-height:44px;display:inline-flex}.brand-link{flex-shrink:0;max-width:100%}.header-actions{align-items:center;gap:var(--space-2) var(--space-4);flex-wrap:wrap;display:flex}.brand-link picture,.brand-link img{width:132px;max-width:100%;height:auto;display:block}.intro{max-width:44rem;margin:var(--space-12) 0 var(--space-8)}h1{margin:0 0 var(--space-3);font-size:var(--font-size-title);letter-spacing:-.035em;overflow-wrap:anywhere;font-weight:650;line-height:1.2}h2{margin:0 0 var(--space-6);font-size:var(--font-size-heading-small);font-weight:600;line-height:1.4}p{margin:0 0 var(--space-4)}.lead{font-size:var(--font-size-lead);font-weight:500}.intro :where(p:last-child),.supporting{color:var(--color-text-muted)}.supporting{font-size:var(--font-size-small)}.workspace{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);display:grid}.editor,.preview{min-width:0;padding:var(--space-8)}.preview{border-left:1px solid var(--color-border)}.drop-zone{justify-content:center;align-items:center;gap:var(--space-4);width:100%;min-height:224px;padding:var(--space-6);border:1px dashed var(--color-info-border);border-radius:var(--radius-sm);color:var(--color-text);background:var(--color-info-background);text-align:center;transition:border-color var(--motion-fast) var(--motion-ease), background-color var(--motion-fast) var(--motion-ease);flex-direction:column;display:flex}.drop-zone:disabled{cursor:default}.drop-zone:hover:not(:disabled),.drop-zone.is-dragging{border-color:var(--color-focus)}.drop-zone.is-dragging{outline:2px solid var(--color-focus);outline-offset:-2px}.drop-icon{color:var(--color-info);transition:transform var(--motion-fast) var(--motion-ease);display:flex}.drop-copy,.drop-title,.drop-subtitle{display:block}.drop-title{font-weight:600}.drop-subtitle{margin-top:var(--space-2);color:var(--color-info);font-size:var(--font-size-small)}.privacy-note{align-items:flex-start;gap:var(--space-2);margin:var(--space-4) 0 0;display:flex}.privacy-note svg{color:var(--color-success);flex-shrink:0;margin-top:2px}.error-message{margin:var(--space-4) 0 0;padding:var(--space-3) var(--space-4);border:1px solid var(--color-error-border);border-radius:var(--radius-sm);color:var(--color-error);background:var(--color-error-background);overflow-wrap:anywhere}.source-preview{min-width:0;margin-top:var(--space-6)}.preview-label{margin-bottom:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-small);font-weight:500}.source-frame,.output-surface{border:1px solid var(--color-border);border-radius:var(--radius-sm)}.source-frame{aspect-ratio:1;place-items:center;width:min(100%,144px);display:grid}.source-frame img{object-fit:contain;width:100%;height:100%;display:block}.checkerboard{background-color:var(--color-surface);background-image:linear-gradient(45deg, var(--color-surface-muted) 25%, transparent 25%), linear-gradient(-45deg, var(--color-surface-muted) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--color-surface-muted) 75%), linear-gradient(-45deg, transparent 75%, var(--color-surface-muted) 75%);background-position:0 0,0 7px,7px -7px,-7px 0;background-size:14px 14px}.file-meta{margin-top:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-small);overflow-wrap:anywhere}.empty-preview{justify-content:center;align-items:center;gap:var(--space-4);min-height:246px;padding:var(--space-6);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-muted);text-align:center;flex-direction:column;display:flex}.empty-preview p{font-size:var(--font-size-small);margin:0}.output-surface{padding:var(--space-3)}.preview-grid{--preview-columns:3;gap:var(--space-3);font-size:var(--font-size-small);grid-template-columns:repeat(auto-fit, minmax(min(100%, max(80px, 8ch, calc((100% - (var(--preview-columns) - 1) * var(--space-3)) / var(--preview-columns)))), 1fr));display:grid}.preview-card{align-items:center;gap:var(--space-2);min-width:0;padding-block:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-small);flex-direction:column;display:flex}.icon-frame{width:80px;height:80px;transition:transform var(--motion-standard) var(--motion-ease);place-items:center;display:grid}.icon-frame img{object-fit:contain;width:80px;height:80px;display:block}.source-frame img.pixelated,.preview-grid.pixel-mode .icon-frame img{image-rendering:pixelated}.download-button{justify-content:center;align-items:center;gap:var(--space-3);width:100%;min-height:48px;margin-top:var(--space-6);padding:var(--space-3) var(--space-4);border:1px solid var(--color-info-accent);border-radius:var(--radius-sm);color:var(--color-white);background:var(--color-info-accent);transition:background-color var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease);font-weight:600;display:inline-flex}.download-button:disabled{cursor:default;opacity:.5}.download-button:hover:not(:disabled){background:var(--color-scout-blue-strong)}.download-button.is-loading{cursor:wait;opacity:1}.download-icon{flex-shrink:0}.package-note{margin:var(--space-3) 0 0}.help{margin-top:var(--space-8);border-top:1px solid var(--color-border);overflow-wrap:anywhere}.help section{padding-top:var(--space-6)}.help p,.setup-steps{max-width:72ch}.setup-steps{margin:0 0 var(--space-4);padding-inline-start:var(--space-6)}.setup-steps li+li{margin-top:var(--space-3)}.help code{font-family:inherit;font-size:inherit;font-weight:500}.help details{border-bottom:1px solid var(--color-border)}.help :where(details>p:first-of-type){margin-top:var(--space-3)}.help summary{min-height:44px;padding-block:var(--space-4);cursor:pointer;font-weight:500}.help-reference{font-size:var(--font-size-small)}.site-footer{margin-top:var(--space-16);color:var(--color-text-muted);font-size:var(--font-size-small)}.site-footer p{margin:0}.spinner{border:2px solid var(--color-info-border);border-top-color:var(--color-white);border-radius:50%;flex-shrink:0;width:20px;height:20px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes reveal{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:no-preference){.intro,.workspace{animation:reveal var(--motion-reveal) var(--motion-ease) backwards}.result-panel,.preview-card,.source-preview{animation:reveal var(--motion-standard) var(--motion-ease) backwards}@media (hover:hover) and (pointer:fine){.drop-zone:hover:not(:disabled) .drop-icon{transform:translateY(-2px)}.download-button:hover:not(:disabled){transform:translateY(-1px)}.download-button:active:not(:disabled){transform:translateY(1px)}}}@media (width<=832px){.app-shell{padding:min(var(--space-6), 4vw)}.workspace{grid-template-columns:minmax(0,1fr)}.editor,.preview{padding:min(var(--space-8), 5vw)}.preview{border-left:0;border-top:1px solid var(--color-border)}.intro{margin-top:var(--space-8)}h1{font-size:2rem}}@media (width<=520px){.preview-grid{--preview-columns:2}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}