html,body,#root{margin:0;width:100%;min-height:100%}body{background:#05080f}.app{min-height:100vh;background:#050a0e;color:#ffffffe6}.topbar{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08);background:#0a141ca6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:10}.title .name{font-weight:700;letter-spacing:.4px}.title .subtitle{font-size:12px;opacity:.7}.stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.pill{font-size:12px;padding:6px 10px;border-radius:999px;background:#ffffff0f;border:1px solid rgba(255,255,255,.09)}.actions{display:flex;gap:10px;justify-content:flex-end}.btn{padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#ffffffe6;cursor:pointer}.btn:hover{background:#ffffff1a}.main{display:grid;grid-template-columns:320px 1fr;gap:14px;padding:14px}.panel{border:1px solid rgba(255,255,255,.1);background:#ffffff0a;border-radius:14px;padding:12px;height:fit-content}.panelTitle{font-weight:700;margin-bottom:10px}.param{margin-bottom:10px}.param .row{display:flex;justify-content:space-between;font-size:12px;opacity:.9}.param input[type=range]{width:100%}.hint{font-size:12px;opacity:.7;margin-top:10px;line-height:1.35}.canvasWrap{border:1px solid rgba(255,255,255,.1);background:#ffffff05;border-radius:14px;padding:10px;overflow:hidden}canvas{width:100%;height:auto;border-radius:10px;display:block}@media(max-width:900px){.topbar,.main{grid-template-columns:1fr}}