:root { --foreground:#242824; --background:#fff; --card:#f4f5f1; --border:#d7dbd1; --muted-foreground:#6c7366; --red:#c43d3d; --blue:#247cb5; --purple:#8150ba; }
* { box-sizing:border-box; } body { margin:0; padding:18px; font:14px/1.6 system-ui,sans-serif; color:var(--foreground); background:#fff; } #micro-circuit { max-width:780px; margin:auto; } h3 { font-size:18px; font-weight:600; margin:0 0 14px; } .viz-controls,.viz-row { display:flex; flex-wrap:wrap; gap:12px; align-items:center; } .viz-controls { margin-bottom:12px; align-items:flex-end; } .form-label { display:flex; flex:1; flex-direction:column; gap:4px; min-width:170px; } .form-select { width:100%; min-height:42px; font:inherit; background:#fff; border:1px solid var(--border); border-radius:5px; padding:7px; color:inherit; } .text-small { font-size:12px; } .btn { border:1px solid var(--border); background:#fff; padding:8px 12px; border-radius:5px; cursor:pointer; font:inherit; color:inherit; } .btn:hover { background:var(--card); } :focus-visible { outline:2px solid var(--blue); outline-offset:3px; } [hidden] { display:none!important; } #mc-traces { margin-top:12px; } #mc-traces .form-label { margin-bottom:10px; } @media(max-width:400px){body{padding:10px}.form-select{font-size:16px}}