.panel{background:var(--viz-panel,#162536);border:1px solid var(--viz-border);border-radius:13px;overflow:hidden;margin:12px 0}.pad{padding:13px}.muted,.bar{color:var(--viz-muted);font-size:12px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.stats article,.rules article{padding:12px;border:1px solid var(--viz-border);background:var(--viz-card);border-radius:10px;font-size:12px}.stats strong{display:block;font-size:24px;color:var(--viz-text)}.bar{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px}canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair;background:#0e1926}.actions,.patterns{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}button{color:var(--viz-text);background:var(--viz-card);border:1px solid var(--viz-border);border-radius:8px;padding:10px;cursor:pointer}button.active{background:var(--viz-accent-bg);border-color:var(--viz-accent)}button.primary{background:var(--viz-accent);color:white}.patterns{grid-template-columns:repeat(3,1fr)}input[type=range]{width:100%;accent-color:var(--viz-accent)}.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.rules p{color:var(--viz-muted);font-size:12px}@media(max-width:480px){.actions,.patterns{grid-template-columns:repeat(2,1fr)}.stats strong{font-size:20px}}