:root{--bg:#14121c;--surface:#1f1c2b;--surface-2:#2a2639;--text:#ece9f5;--text-muted:#a09bb3;--accent:#ffcc4d;--accent-text:#1a1400;--border:#3a3550;--warn:#ff9a6b;--radius:4px;--pixel-font:"DotGothic16", system-ui, sans-serif;--body-font:system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root{--bg:#f6f4fb;--surface:#fff;--surface-2:#eeebf6;--text:#1c1830;--text-muted:#5d5873;--accent:#7a4dff;--accent-text:#fff;--border:#d4cfe3;--warn:#c2410c;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--body-font);margin:0;line-height:1.6}button,input,select,textarea{font:inherit;color:inherit}button{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;padding:6px 12px}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input,select,textarea{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);width:100%;padding:6px 8px}input[type=checkbox]{width:auto}input[type=color]{width:44px;height:36px;padding:2px}.button-primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent);font-weight:700}.header{border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.header__title,.section__title,h2{font-family:var(--pixel-font);font-weight:400}.header__title{margin:0;font-size:1.4rem}.header__actions{flex-wrap:wrap;gap:8px;display:flex}.layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;max-width:1280px;margin:0 auto;padding:16px;display:grid}.convert[hidden]{display:none}.output-column{align-self:start;position:sticky;top:16px}.section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px}.section__title{cursor:pointer;padding:10px 14px;font-size:1.1rem}.section__body{gap:12px;padding:0 14px 14px;display:grid}.field{gap:4px;display:grid}.field__label{color:var(--text-muted);font-size:.85rem}.field__note{color:var(--warn);margin:0;font-size:.8rem}.row{flex-wrap:wrap;align-items:end;gap:8px;display:flex}.row>.field{flex:120px}.parts-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;display:grid}.check{align-items:center;gap:8px;display:flex}.segmented{flex-wrap:wrap;gap:4px;display:flex}.segmented__item[aria-checked=true],.chip-button[aria-pressed=true],.palette-card[aria-pressed=true]{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.chips{flex-wrap:wrap;gap:6px;display:flex}.palette-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;display:grid}.palette-card{text-align:left;gap:6px;display:grid}.swatches{flex-wrap:wrap;align-items:center;gap:2px;display:flex}.swatch{border:1px solid #0000004d;width:12px;height:12px;display:inline-block}.swatch--large{width:20px;height:20px}.swatches__more{margin-left:4px;font-size:.75rem}.saved-palettes,.palette-editor__colors,.library-list,.keyword-chips,.hints{margin:0;padding:0;list-style:none}.saved-palettes li,.library-list li{flex-wrap:wrap;align-items:center;gap:8px;padding:4px 0;display:flex}.palette-editor__colors{flex-wrap:wrap;gap:6px;display:flex}.palette-editor__colors li{background:var(--surface-2);border-radius:var(--radius);align-items:center;gap:4px;padding:2px 6px;display:flex}.keyword-chips{flex-wrap:wrap;gap:6px;display:flex}.keyword-chip{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;align-items:center;gap:4px;padding:2px 4px 2px 10px;display:flex}.keyword-chip button{background:0 0;border:none;padding:0 6px}.output{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);gap:12px;padding:14px;display:grid}.tabs{flex-wrap:wrap;gap:4px;display:flex}.tabs__tab[aria-selected=true]{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.tabs--steps .tabs__tab{font-size:.8rem}.help-text{color:var(--text-muted);margin:0;font-size:.8rem}.output__panel{gap:8px;display:grid}.output__text{resize:vertical;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:.85rem}.hints li{color:var(--text-muted);font-size:.85rem}.sheet-preview{gap:6px;margin:0;display:grid}.sheet-preview svg{background:var(--surface-2);width:100%;max-height:200px}.sheet-cell{fill:none;stroke:var(--accent);stroke-width:1px;vector-effect:non-scaling-stroke}.sheet-preview__caption{color:var(--text-muted);margin:0;font-size:.85rem}.toasts{z-index:30;gap:8px;display:grid;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.toast{background:var(--text);color:var(--bg);border-radius:var(--radius);padding:8px 16px}.dialog-backdrop{z-index:20;background:#00000080;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.dialog{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);gap:12px;width:min(560px,100%);max-height:80vh;padding:16px;display:grid;overflow:auto}.view-tabs{max-width:1280px;margin:0 auto;padding:0 16px}.slider-field__inputs{align-items:center;gap:8px;display:flex}.slider-field__inputs input[type=range]{flex:1;min-width:0}.slider-field__inputs input[type=number]{width:6em}.convert-axis{gap:8px;display:grid}.convert-bg{align-items:center;gap:8px;margin:0;display:flex}.convert-preview figure{gap:6px;margin:0;display:grid}.convert-stage{position:relative}.convert-stage canvas,.convert-result{width:100%;height:auto;image-rendering:pixelated;display:block}.convert-stage svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.grid-line{stroke:var(--accent);stroke-width:1px;vector-effect:non-scaling-stroke;opacity:.8}.convert-result{cursor:crosshair;background-color:#fff;background-image:conic-gradient(#ccc 25%, transparent 0 50%, #ccc 0 75%, transparent 0);background-size:16px 16px}.mobile-bar{display:none}@media (width<=767px){.layout{grid-template-columns:minmax(0,1fr);padding:16px 16px 80px}.output-column{position:static}.convert .output-column{order:-1}.mobile-bar{background:var(--surface);border-top:1px solid var(--border);z-index:10;gap:8px;padding:10px 16px;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-bar button{flex:1}.toasts{bottom:72px}}