:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f4f2ec;--surface:#fff;--text:#1b1b1a;--muted:#55534e;--border:#8a8886;--accent:#2f6b1f;--focus:#1a5fc7;--error:#b3261e;--grid-line:#767676;--checker:conic-gradient(#cfcfcf 25%, #fff 0 50%, #cfcfcf 0 75%, #fff 0);font:100%/1.5 system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#121212;--surface:#1f1f1f;--text:#f2f2f2;--muted:#c8c6c0;--border:#8a8886;--accent:#7ccf5a;--focus:#8ab4ff;--error:#ff8a80;--grid-line:#9a9a9a}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}.skip-link{z-index:10;color:var(--text);background:var(--surface);border:2px solid var(--focus);border-radius:4px;padding:8px 12px;position:absolute;top:-200px;left:8px}.skip-link:focus{top:8px}.app-header{max-width:60rem;padding:16px 24px 0}.app-header h1{margin:0 0 4px;font-size:1.6rem}.app-header p{color:var(--muted);margin:0}.app-header .disclaimer{margin-top:4px;font-size:.9rem}.app-footer{color:var(--muted);padding:0 24px 32px}.app-footer p{margin:0}a{color:var(--focus)}.layout{gap:16px;padding:16px 24px 32px;display:grid}@media (width>=48rem){.layout{grid-template-columns:minmax(15rem,19rem) minmax(0,1fr);align-items:start}.layout>.column:last-child{grid-column:1/-1}}@media (width>=76rem){.layout{grid-template-columns:minmax(15rem,19rem) minmax(0,1fr) minmax(16rem,22rem)}.layout>.column:last-child{grid-column:auto}}.column{align-content:start;gap:16px;min-width:0;display:grid}.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;min-width:0;padding:12px 16px 16px}.panel h2{margin:0 0 8px;font-size:1.15rem}.panel h3{margin:16px 0 4px;font-size:1rem}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.hint{color:var(--muted);margin:4px 0;font-size:.9rem}.field{margin-bottom:12px}.field label{margin-bottom:2px;font-weight:600;display:block}input:not([type]),input[type=text],select{max-width:100%;min-height:2.5rem;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:6px 8px}input[type=file]{max-width:100%}input[aria-invalid=true]{border:2px solid var(--error)}fieldset{border:1px solid var(--border);border-radius:6px;min-width:0;margin:0 0 12px;padding:6px 12px 10px}legend{padding:0 4px;font-weight:600}.choice{align-items:center;gap:8px;min-height:2rem;display:flex}.choice input{width:1.1rem;height:1.1rem;accent-color:var(--accent);margin:0}button{min-height:2.75rem;font:inherit;color:var(--text);background:var(--surface);border:2px solid var(--accent);cursor:pointer;border-radius:6px;padding:6px 14px}button:hover{background:color-mix(in srgb, var(--accent) 14%, var(--surface))}button[aria-disabled=true]{color:var(--muted);border-color:var(--border);cursor:not-allowed}.button-row{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.error{color:var(--error);margin:4px 0 8px;font-weight:600}.swatches{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:4px;display:grid}.swatch{cursor:pointer;border:2px solid #0000;border-radius:6px;align-items:center;gap:8px;min-height:2.5rem;padding:4px 6px;display:flex}.swatch:has(input:checked){border-color:var(--text);font-weight:700}.swatch input{accent-color:var(--accent);margin:0}.swatch-name:first-letter{text-transform:uppercase}.chip{background:var(--pixel);border:1px solid var(--text);border-radius:4px;flex:none;width:1.5rem;height:1.5rem}.current-color{margin:8px 0}.inline-fields{align-items:center;gap:8px;display:flex}.inline-fields input[type=color]{background:var(--surface);border:1px solid var(--border);border-radius:4px;width:2.75rem;height:2.5rem;padding:2px}.grid-wrap{padding:4px;overflow-x:auto}.pixel-grid{--gap:0px;gap:var(--gap);padding:var(--gap);background:var(--grid-line);-webkit-user-select:none;user-select:none;touch-action:pinch-zoom;flex-direction:column;display:inline-flex}.pixel-grid.with-lines{--gap:1px}.pixel-row{gap:var(--gap);display:flex}.cell{width:var(--cell);height:var(--cell);background:var(--pixel);cursor:crosshair}.cell.is-see-through{background-image:linear-gradient(var(--pixel), var(--pixel)), var(--checker);background-size:100% 100%,50% 50%}.cell:focus{outline:none}.cell:focus-visible{z-index:1;outline-offset:-2px;outline:2px solid #fff;position:relative;box-shadow:0 0 0 2px #000}.cursor-readout{color:var(--muted);font-variant-numeric:tabular-nums;margin:8px 0 0}.status{background:var(--bg);border-left:4px solid var(--accent);min-height:2.5rem;margin:8px 0 0;padding:6px 10px}.view-choice{flex-wrap:wrap;gap:4px 16px;display:flex}.preview{margin:8px 0 0}.preview canvas,.texture-map{image-rendering:pixelated;background:var(--checker);border:1px solid var(--border);background-size:16px 16px;display:block}.preview figcaption{margin-top:8px}.preview canvas.model-3d{background:var(--bg);cursor:grab;max-width:100%}.preview canvas.model-3d:active{cursor:grabbing}.texture-map{cursor:pointer;width:100%;max-width:256px;height:auto}.row-list{margin:0;padding:0;font-size:.95rem;list-style:none}.row-list li{border-bottom:1px solid color-mix(in srgb, var(--border) 40%, transparent);padding:2px 0}.shortcuts{border-collapse:collapse;width:100%;font-size:.95rem}.shortcuts th,.shortcuts td{text-align:left;vertical-align:top;border-bottom:1px solid var(--border);padding:4px 6px}.shortcuts tbody th{font-weight:600}@media (forced-colors:active){.cell,.chip,.preview canvas,.texture-map{forced-color-adjust:none}.pixel-grid{background:canvastext}.cell:focus-visible{outline-offset:-3px;box-shadow:none;outline:3px solid highlight}.swatch:has(input:checked){border-color:highlight}button[aria-disabled=true]{color:graytext;border-color:graytext}}