:root{--bg: #0d0e11;--glass: rgba(18, 19, 23, .72);--glass-strong: rgba(18, 19, 23, .9);--border: rgba(255, 255, 255, .1);--border-strong: rgba(255, 255, 255, .18);--text: #e9e9ec;--muted: rgba(233, 233, 236, .62);--accent: #9aa4ff;--accent-2: #76e0c2;--danger: #ff8a8a;--radius: 12px;--gutter: 12px;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;--mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}#app{position:fixed;inset:0;overflow:hidden}canvas{display:block;touch-action:none}code{font-family:var(--mono);font-size:.92em}.hidden{display:none!important}.topbar{position:fixed;top:calc(var(--gutter) + env(safe-area-inset-top,0px));left:var(--gutter);right:var(--gutter);z-index:10;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;padding:8px 14px;background:var(--glass);border:1px solid var(--border);border-radius:var(--radius);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);min-width:0}.brandText{min-width:0}.brandTitle{font-size:14px;font-weight:650;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brandSub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34ch}.actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.btn,.select{font:inherit;font-size:13px;color:var(--text);background:var(--glass);border:1px solid var(--border);border-radius:10px;padding:9px 12px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background-color .15s ease,border-color .15s ease}.btn{position:relative;display:inline-flex;align-items:center;gap:7px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:hover,.select:hover{background:var(--glass-strong);border-color:var(--border-strong)}.btn:active{transform:translateY(1px)}.btn:focus-visible,.btn:has(input:focus-visible),.select:focus-visible,.chk:focus-within,.range:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}.btn.primary{background:#9aa4ff38;border-color:#9aa4ff73}.btn.primary:hover{background:#9aa4ff52}.btn.danger{color:var(--danger)}.btn.iconOnly{width:38px;justify-content:center;padding-left:0;padding-right:0;font-weight:650}.btn[aria-expanded=true]{border-color:#9aa4ff8c;background:#9aa4ff29}.btn input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip-path:inset(50%);pointer-events:none}.select{cursor:pointer}.select option{background:#1a1b20;color:var(--text)}.menuWrap{position:relative;display:flex}.menu{position:absolute;top:calc(100% + 6px);right:0;z-index:12;width:270px;max-width:calc(100vw - 2 * var(--gutter));padding:6px;display:flex;flex-direction:column;gap:2px;background:var(--glass-strong);border:1px solid var(--border);border-radius:12px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 16px 48px #0006}.menuItem{font:inherit;text-align:left;color:var(--text);background:transparent;border:1px solid transparent;border-radius:8px;padding:8px 10px;cursor:pointer}.menuItem:hover,.menuItem:focus-visible{background:#ffffff12;outline:none}.menuItem[aria-current=true]{border-color:#9aa4ff73}.menuItemName{font-size:13px;font-weight:600}.menuItemDetail{font-size:12px;color:var(--muted);margin-top:2px}.panel{position:fixed;z-index:9;top:calc(var(--gutter) + 58px + env(safe-area-inset-top,0px));right:var(--gutter);width:min(340px,calc(100vw - 2 * var(--gutter)));max-height:calc(100vh - 150px);overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px;background:var(--glass-strong);border:1px solid var(--border);border-radius:14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 16px 48px #0006}.group{display:flex;flex-wrap:wrap;gap:6px}.group>.select,.group>.field{flex:1 1 100%}.groupTitle{flex:1 1 100%;font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:2px 2px 0}.field,.chk{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid var(--border);background:var(--glass);font-size:12px}.fieldLabel{font-size:12px;min-width:58px;color:var(--muted)}.range{flex:1;min-width:80px;accent-color:var(--accent)}.mono{font-family:var(--mono);font-size:12px;opacity:.95}.chk{cursor:pointer;-webkit-user-select:none;user-select:none}.chk input{accent-color:var(--accent);margin:0}.hint{position:fixed;z-index:5;left:50%;bottom:calc(58px + env(safe-area-inset-bottom,0px));transform:translate(-50%);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;max-width:calc(100vw - 2 * var(--gutter));padding:9px 16px;font-size:12px;color:var(--muted);background:var(--glass);border:1px solid var(--border);border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none;transition:opacity .6s ease;box-sizing:border-box}.hint b{color:var(--text);font-weight:600}.hint.fade{opacity:0}.hint .touchOnly{display:none}@media(hover:none)and (pointer:coarse){.hint .mouseOnly{display:none}.hint .touchOnly{display:inline}}.status{position:fixed;z-index:6;left:var(--gutter);bottom:calc(var(--gutter) + env(safe-area-inset-bottom,0px));max-width:min(520px,calc(100vw - 2 * var(--gutter)));box-sizing:border-box;padding:7px 11px;font-size:12px;color:var(--muted);background:var(--glass);border:1px solid var(--border);border-radius:10px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status.error{color:var(--danger);border-color:#ff8a8a59}.loader{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:var(--gutter);background:radial-gradient(ellipse at center,#0d0e118c,#0d0e11d9);transition:opacity .5s ease}.loader.landing{background:radial-gradient(ellipse at 50% 45%,#1a1c24 0%,var(--bg) 70%)}.loader.fade{opacity:0;pointer-events:none}.loaderCard{width:min(380px,100%);box-sizing:border-box;padding:18px 18px 16px;background:var(--glass-strong);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 60px #00000073}.loaderHead{margin-bottom:14px}.loaderTitle{font-size:15px;font-weight:650;overflow-wrap:anywhere}.loaderPhase{font-size:12px;color:var(--muted);margin-top:2px;overflow-wrap:anywhere}.loader.error .loaderPhase{color:var(--danger)}.bar{position:relative;height:6px;border-radius:999px;background:#ffffff14;overflow:hidden}.barFill{position:absolute;inset:0 auto 0 0;width:0%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .2s ease}.bar.indeterminate .barFill{width:35%;animation:slide 1.1s ease-in-out infinite}.loader.error .barFill{background:var(--danger);width:100%;animation:none}@keyframes slide{0%{left:-35%}to{left:100%}}.loaderMeta{display:flex;justify-content:space-between;gap:12px;margin-top:8px;min-height:16px;font-size:12px;color:var(--muted)}.loaderActions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.dropOverlay{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#0d0e1199;pointer-events:none}.dropCard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:36px 48px;border:2px dashed rgba(154,164,255,.7);border-radius:20px;background:var(--glass-strong)}.dropCard svg{width:36px;height:36px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dropTitle{font-size:16px;font-weight:650}.dropSub{font-size:12px;color:var(--muted)}.modal{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:var(--gutter);background:#00000080}.modalCard{width:min(640px,100%);max-height:calc(100vh - 2 * var(--gutter));overflow-y:auto;box-sizing:border-box;padding:16px 18px;background:var(--glass-strong);border:1px solid var(--border);border-radius:16px;box-shadow:0 16px 48px #00000073}.modalHeader{display:flex;align-items:center;justify-content:space-between;gap:12px}.modalTitle{font-size:16px;font-weight:650}.modalBody{margin-top:6px;font-size:13px;line-height:1.55}.sectionTitle{margin-top:14px;font-weight:650}.modalBody ul{margin:6px 0 0 18px;padding:0}@media(max-width:920px){.actions .btn span{display:none}.actions .btn{padding:9px 10px}.actions label.btn.primary span{display:inline}.brandSub{max-width:22ch}.hint{border-radius:14px}.hint .hintDrop{display:none}}@media(max-width:480px){.topbar{flex-direction:column;align-items:stretch}.actions{justify-content:flex-start;flex-wrap:nowrap}.actions .btn,.actions .menuWrap{flex:1 1 0;justify-content:center;min-width:0;padding-left:0;padding-right:0}.actions .menuWrap .btn{flex:1 1 auto}.menu{left:0;right:auto}.actions label.btn.primary{flex:2.4 1 0}.panel{top:calc(var(--gutter) + 112px + env(safe-area-inset-top,0px));max-height:calc(100vh - 200px)}}@media(max-width:340px){.actions label.btn.primary span{display:none}.actions label.btn.primary{flex:1 1 0}}@media(prefers-reduced-motion:reduce){.bar.indeterminate .barFill{animation:none;left:0;width:100%;opacity:.35}.loader,.hint{transition:none}}