:root{--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--content-max: 1280px;--button-border-width: 1px;--page: #f4f4f4;--surface: #ffffff;--surface-muted: #e8e8e8;--surface-strong: #d4d4d4;--text: #171717;--text-muted: #5c5c5c;--button-bg: #ffffff;--button-bg-active: #171717;--button-text-active: #ffffff;--button-border: #707070;font-family:system-ui,sans-serif;color:var(--text);background:var(--page);font-synthesis:none}:root[data-theme=dark]{--page: #111111;--surface: #1c1c1c;--surface-muted: #292929;--surface-strong: #3a3a3a;--text: #f2f2f2;--text-muted: #b8b8b8;--button-bg: #1c1c1c;--button-bg-active: #f2f2f2;--button-text-active: #171717;--button-border: #9a9a9a}*{box-sizing:border-box}body{margin:0;min-width:20rem;min-height:100vh;background:var(--page)}button,input,select,textarea{color:inherit;font:inherit}button{min-width:2.75rem;min-height:2.75rem;padding:var(--space-2) var(--space-4);color:var(--text);background:var(--button-bg);border-color:var(--button-border);border-style:solid;border-width:var(--button-border-width);border-radius:var(--space-1);cursor:pointer}button[aria-pressed=true],.primary-button{color:var(--button-text-active);background:var(--button-bg-active);border-color:var(--button-bg-active)}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline-color:currentColor;outline-offset:var(--space-1);outline-style:solid;outline-width:var(--space-1)}input,select,textarea{width:100%;min-height:2.75rem;padding:var(--space-3) var(--space-4);color:var(--text);background:var(--surface-muted);border:0;border-radius:0}select{appearance:none;cursor:pointer}textarea{min-height:14rem;resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;line-height:1.5}input[type=range]{padding-inline:0;accent-color:var(--text)}input[type=color]{width:4rem;height:4rem;padding:0;appearance:none;background:var(--surface-muted)}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0;border-radius:0}input[type=color]::-moz-color-swatch{border:0;border-radius:0}h1,h2,h3,p,dl,dd{margin:0}h1{font-size:2rem;line-height:1.125}h2{font-size:1.5rem;line-height:1.25}h3{font-size:1rem;line-height:1.5}code{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace}.app-shell{max-width:var(--content-max);margin-inline:auto;padding:var(--space-4) var(--space-4) 6rem}.site-header{display:flex;flex-direction:column;gap:var(--space-4);padding-block:var(--space-6)}.site-logo{width:fit-content;color:inherit;text-decoration:none}.fatal-error{max-width:40rem;margin-inline:auto;padding:var(--space-8);background:var(--surface)}.fatal-error p,.fatal-error button{margin-top:var(--space-4)}.theme-control{display:grid;gap:var(--space-2);width:10rem;font-weight:600}.eyebrow{margin-bottom:var(--space-2);color:var(--text-muted);font-weight:700}.mode-nav,.button-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}.mode-nav{padding-block:var(--space-4);background:var(--surface-muted)}.mode-nav button{flex:1}.main-layout{display:grid;gap:var(--space-4);padding-block:var(--space-4)}.controls-column{display:grid;align-content:start;gap:var(--space-4)}.panel,.preview,.export-panel{padding:var(--space-4);background:var(--surface)}.section-heading{display:grid;gap:var(--space-2);margin-bottom:var(--space-6)}.section-heading>p:last-child{color:var(--text-muted);line-height:1.5}.config-form,.field-group,fieldset{display:grid;gap:var(--space-2)}.config-form{gap:var(--space-6)}fieldset{margin:0;padding:var(--space-4);background:var(--surface-muted);border:0}legend,label{font-weight:650}legend{padding:0;margin-bottom:var(--space-2)}.field-pair,.base-color-fields{display:grid;gap:var(--space-4)}.base-color-fields{grid-template-columns:auto minmax(0,1fr);align-items:start}.inline-field{display:flex;gap:var(--space-2)}.inline-field input{min-width:0}.inline-field button{flex:none}.range-field+.range-field{margin-top:var(--space-4)}.range-field label{display:flex;justify-content:space-between;gap:var(--space-4)}.field-note,.field-error,.seed-label{color:var(--text-muted);line-height:1.5}.field-error{color:var(--text);font-weight:700}.text-link{position:fixed;z-index:1;inset-inline:var(--space-4);bottom:var(--space-4);display:flex;justify-content:center;align-items:center;max-width:28rem;min-height:2.75rem;margin-top:var(--space-6);margin-inline:auto;padding:var(--space-2) var(--space-4);color:var(--button-text-active);background:var(--button-bg-active);border-color:var(--button-bg-active);border-style:solid;border-width:var(--button-border-width);border-radius:var(--space-1);text-decoration:none}.notice,.status{margin-top:var(--space-4);padding:var(--space-4);background:var(--surface-strong);line-height:1.5}.preview-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:start;gap:var(--space-4)}.config-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2);margin-bottom:var(--space-8)}.config-summary div{padding:var(--space-3);background:var(--surface-muted)}.config-summary dt{color:var(--text-muted)}.config-summary dd{margin-top:var(--space-1);overflow-wrap:anywhere;font-weight:650}.scale-list{display:grid;gap:var(--space-8)}.scale{display:grid;gap:var(--space-3)}.swatch-list{display:grid;gap:var(--space-1)}.swatch-row{display:grid;grid-template-columns:3rem 2.5rem minmax(5rem,1fr) auto;align-items:center;gap:var(--space-2);min-width:0;background:var(--surface-muted)}.swatch{width:3rem;height:3rem}.step-label{color:var(--text-muted);font-variant-numeric:tabular-nums}.swatch-row code{min-width:0}.swatch-row button{margin-right:var(--space-1)}.export-panel textarea{margin-block:var(--space-4)}footer{padding-block:var(--space-8);color:var(--text-muted)}@media(min-width:40rem){.app-shell{padding-inline:var(--space-8)}.site-header{flex-direction:row;justify-content:space-between;align-items:end}.mode-nav button{flex:none}.field-pair{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:56rem){.app-shell{padding-bottom:var(--space-4)}.main-layout{grid-template-columns:minmax(20rem,.85fr) minmax(28rem,1.15fr);align-items:start;gap:var(--space-6)}.preview{position:sticky;top:var(--space-4)}.panel,.preview,.export-panel{padding:var(--space-6)}.text-link:not(:focus-visible){position:absolute;inset:auto;width:var(--space-1);height:var(--space-1);min-height:0;overflow:hidden;margin:0;padding:0;clip-path:inset(50%);white-space:nowrap;border:0}}