:root{--bg: #1a1a1f;--panel: #24242b;--fg: #e6e6ea;--muted: #9a9aa6;--border: #34343d;--accent: #4f8cff}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fg);background:var(--bg)}#app{display:flex;height:100vh}#sidebar{width:300px;flex:0 0 300px;background:var(--panel);border-right:1px solid var(--border);padding:16px;overflow-y:auto}#sidebar h1{font-size:18px;margin:0 0 8px}.muted{color:var(--muted)}.small{font-size:12px;line-height:1.4}.control{display:flex;flex-direction:column;gap:6px;margin-top:14px}.control label{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.control label.checkbox{flex-direction:row;align-items:center;gap:8px;text-transform:none;letter-spacing:normal;cursor:pointer}.control input[type=file],.control select,.control button{background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:7px 9px;font:inherit;font-size:13px}.control input[type=range]{width:100%}#generate{background:var(--accent);border:none;color:#fff;cursor:pointer}.control.buttons{flex-direction:row;gap:8px}.control.buttons button{flex:1;cursor:pointer}#viewport{position:relative;flex:1;min-width:0}#canvas{width:100%;height:100%;display:block}#scalar-bar{position:absolute;bottom:16px;left:50%;transform:translate(-50%);width:260px;background:#0006;padding:6px 8px;border-radius:6px}#scalar-bar-gradient{height:12px;border-radius:3px}.scalar-bar-labels{display:flex;justify-content:space-between;font-size:11px;color:#fff;margin-top:3px}