:root{color-scheme:dark;font-family:IBM Plex Sans,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%;background:#f5f6f8;color:#1b2430}.app{min-height:100dvh;padding:14px;background:radial-gradient(800px 520px at 0% 0%,rgba(120,146,170,.22),transparent 55%),radial-gradient(700px 450px at 100% 100%,rgba(188,172,150,.2),transparent 58%),#f4f6f9}.layout{max-width:1600px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:12px}.viewport{position:relative;border-radius:16px;overflow:hidden;min-height:84vh;border:1px solid rgba(140,158,184,.28);background:#eef1f6}.viewport canvas{width:100%!important;height:100%!important;display:block}.tag{position:absolute;left:12px;top:12px;font:600 11px/1 IBM Plex Mono,ui-monospace,monospace;border-radius:999px;padding:6px 10px;border:1px solid rgba(140,162,186,.35);background:#f5f9ffc7}.panel{border-radius:16px;border:1px solid rgba(155,173,196,.3);background:#f8fbffe6}.panel-head{padding:12px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(218,228,245,.14)}.buttons{display:flex;gap:8px}button{border:1px solid rgba(150,171,194,.38);border-radius:10px;padding:7px 10px;color:#233042;background:#e0e9f4f2;font:600 12px/1 IBM Plex Sans,sans-serif;cursor:pointer}button:hover{background:#cddceef2}.panel-body{padding:12px;max-height:84vh;overflow:auto}.group-label{margin:14px 0 6px;font:600 11px/1 IBM Plex Mono,ui-monospace,monospace;color:#5c708aeb;text-transform:uppercase;letter-spacing:.06em}.slider{margin-bottom:8px}.slider-head{display:flex;justify-content:space-between;font-size:13px;margin-bottom:3px}.slider-head span:last-child{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:11px;color:#6a7c95e6}input[type=range]{width:100%;accent-color:#b0c8a3}@media(min-width:1140px){.layout{grid-template-columns:minmax(700px,1fr) 390px;align-items:start}}