:root{--surface: #e0e5ec;--surface-sunken: #dae0e8;--text: #2c333f;--muted: #6a7686;--accent: #3b82f6;--accent-ink: #ffffff;--warn: #b45309;--sh-light: rgba(255, 255, 255, .85);--sh-dark: rgba(163, 177, 198, .6);--neu-raised: -6px -6px 12px var(--sh-light), 6px 6px 12px var(--sh-dark);--neu-raised-sm: -3px -3px 6px var(--sh-light), 3px 3px 6px var(--sh-dark);--neu-inset: inset -4px -4px 8px var(--sh-light), inset 4px 4px 8px var(--sh-dark);--neu-inset-sm: inset -2px -2px 4px var(--sh-light), inset 2px 2px 5px var(--sh-dark);--radius: 14px;--radius-sm: 10px;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--surface);color:var(--text)}.app{display:grid;grid-template-columns:1fr 360px;height:100vh}:where(button,input,select,a,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion: no-preference){.action-btn,.preset-btn,.lang button,.toggle input{transition:box-shadow .15s ease,color .15s ease}}.viewport{position:relative;min-width:0}.viewport canvas{display:block}.panel{background:var(--surface);overflow-y:auto}.panel-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;background:var(--surface);box-shadow:0 6px 10px -8px var(--sh-dark)}.panel-header h1{font-size:15px;font-weight:700;margin:0;line-height:1.3}.lang{display:flex;gap:8px}.lang button{background:var(--surface);color:var(--muted);border:none;border-radius:var(--radius-sm);padding:5px 10px;font-size:12px;font-weight:600;cursor:pointer;box-shadow:var(--neu-raised-sm)}.lang button:active{box-shadow:var(--neu-inset-sm)}.lang button.on{color:var(--accent);box-shadow:var(--neu-inset-sm)}.panel-footer{position:sticky;bottom:0;z-index:2;display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--surface);box-shadow:0 -6px 10px -8px var(--sh-dark)}.action-btn{flex:1;background:var(--accent);color:var(--accent-ink);border:none;border-radius:var(--radius);padding:11px 12px;font-size:13px;font-weight:700;cursor:pointer;box-shadow:var(--neu-raised)}.action-btn:active{box-shadow:var(--neu-inset),inset 0 0 0 100px #0000000f}.action-btn:disabled{opacity:.5;cursor:default;box-shadow:var(--neu-raised-sm)}.action-btn.secondary{background:var(--surface);color:var(--text)}.panel-section{padding:6px 0}.panel-section+.panel-section{box-shadow:inset 0 1px #fff9}.section-head{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:none;color:var(--text);font-size:13px;font-weight:700;padding:10px 16px;cursor:pointer}.section-head i{color:var(--muted);font-style:normal}.section-body{padding:6px 16px 16px;display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:8px}.field-head{display:flex;align-items:baseline;justify-content:space-between}.field-head label{font-size:12px;color:var(--muted)}.field-val{font-size:12px;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}.field-val i{color:var(--muted);font-style:normal;font-weight:400;margin-left:2px}.field-controls{display:flex;align-items:center;gap:10px}.slider{flex:1;appearance:none;-webkit-appearance:none;height:22px;background:transparent;cursor:pointer}.slider::-webkit-slider-runnable-track{height:8px;border-radius:8px;background:var(--surface-sunken);box-shadow:var(--neu-inset-sm)}.slider::-moz-range-track{height:8px;border-radius:8px;background:var(--surface-sunken);box-shadow:var(--neu-inset-sm)}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-5px;border-radius:50%;background:var(--surface);border:3px solid var(--accent);box-shadow:var(--neu-raised-sm)}.slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--surface);border:3px solid var(--accent);box-shadow:var(--neu-raised-sm)}.numfield{width:64px;background:var(--surface);color:var(--text);border:none;border-radius:var(--radius-sm);padding:6px 8px;font-size:12px;font-weight:600;box-shadow:var(--neu-inset-sm)}.select{width:100%;background:var(--surface);color:var(--text);border:none;border-radius:var(--radius-sm);padding:9px 10px;font-size:12px;box-shadow:var(--neu-inset-sm)}.textfield{width:100%;background:var(--surface);color:var(--text);border:none;border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;font-weight:600;letter-spacing:.02em;box-shadow:var(--neu-inset-sm)}.color{width:100%;height:34px;background:var(--surface);border:none;border-radius:var(--radius-sm);padding:4px;cursor:pointer;box-shadow:var(--neu-inset-sm)}.toggles{display:flex;flex-direction:column;gap:12px}.toggle{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text);cursor:pointer}.toggle input{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 auto;width:22px;height:22px;margin:0;border-radius:7px;background:var(--surface);box-shadow:var(--neu-raised-sm);cursor:pointer}.toggle input:checked{background:var(--accent);box-shadow:var(--neu-inset-sm)}.toggle input:checked:after{content:"";position:absolute;left:7px;top:3px;width:5px;height:10px;border:solid var(--accent-ink);border-width:0 2px 2px 0;transform:rotate(45deg)}.presets{display:grid;grid-template-columns:1fr 1fr;gap:12px}.preset-btn{background:var(--surface);color:var(--text);border:none;border-radius:var(--radius);padding:10px;font-size:12px;font-weight:600;cursor:pointer;box-shadow:var(--neu-raised-sm)}.preset-btn:active{box-shadow:var(--neu-inset-sm);color:var(--accent)}.info{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:var(--radius);box-shadow:var(--neu-inset-sm)}.info-row{display:flex;justify-content:space-between;font-size:12px}.info-label{color:var(--muted)}.info-value{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}.info-status{color:var(--muted);font-size:12px}.banner{border-radius:var(--radius-sm);padding:9px 11px;font-size:12px;margin-top:6px}.banner.warn{color:var(--warn);font-weight:600;box-shadow:var(--neu-inset-sm)}.warnings{margin:8px 0 0;padding-left:16px;color:var(--warn);font-size:11px}.warnings li{margin:2px 0}@media (max-width: 820px){.app{grid-template-columns:1fr;grid-template-rows:45vh 1fr}}
