* { box-sizing:border-box; }
body { margin:0; background:var(--color-bg); color:var(--color-text); font:15px/1.5 system-ui,Segoe UI,Roboto,sans-serif; overflow:hidden; height:100vh; }
label { display:block; font-size:13px; color:var(--color-text-muted); margin:12px 0 4px; }
input[type=text], select, textarea {
  background:var(--color-bg); color:var(--color-text); border:1px solid var(--color-border);
  border-radius:8px; padding:10px 12px; font:inherit;
}
input[type=text]:focus, textarea:focus, select:focus { outline:none; border-color:var(--color-primary); }
input[type=text], textarea { width:100%; }
textarea { resize:vertical; font-family:ui-monospace,Consolas,monospace; font-size:13px; }
.row { display:flex; gap:14px; } .row > div { flex:1; }
details summary { cursor:pointer; color:var(--color-text-muted); margin-top:8px; }
button { background:var(--color-primary); color:#fff; border:0; border-radius:8px; padding:9px 16px;
  font:inherit; font-weight:600; cursor:pointer; }
button.secondary { background:var(--color-bg); color:var(--color-text); border:1px solid var(--color-border); }
button.secondary:hover { border-color:var(--color-primary); }
button:disabled { opacity:.5; cursor:default; }