:root{color-scheme:dark;--c-bg: #0b0b0b;--c-surface: #111;--c-surface-raised: #161616;--c-border: #222;--c-border-subtle: #1c1c1c;--c-border-interactive: #2a2a2a;--c-text: #eaeaea;--c-text-secondary: #b8b8b8;--c-text-tertiary: #888;--c-accent: #4fc3f7;--c-accent-hover: #6dd0fa;--c-accent-muted: rgba(79, 195, 247, .12);--c-primary: #1a6fff;--c-primary-hover: #2a7fff;--c-warn: #ffbf80;--c-success: #4caf50;--c-error: #f44336;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-pill: 999px;--transition-fast: .12s ease;--transition-normal: .18s ease}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--c-bg);color:var(--c-text);overflow-x:hidden;overscroll-behavior:none;-webkit-overflow-scrolling:touch}header{padding:14px 14px 10px;padding-top:calc(14px + env(safe-area-inset-top));position:sticky;top:0;background:#0b0b0beb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--c-border);z-index:2}h1{margin:0;font-size:16px;font-weight:700;letter-spacing:.3px;color:var(--c-text)}.header-row{display:flex;justify-content:space-between;align-items:center}.header-sep{color:var(--c-text-tertiary);font-weight:400}main{padding:14px;padding-bottom:calc(14px + env(safe-area-inset-bottom));padding-left:calc(14px + env(safe-area-inset-left));padding-right:calc(14px + env(safe-area-inset-right));max-width:1100px;margin:0 auto}.grid{display:grid;grid-template-columns:1fr;gap:14px}.controls-pane{order:2}.viz-pane{order:1}@media(min-width:900px){.grid{grid-template-columns:min(430px,40vw) 1fr}.controls-pane{order:1}.viz-pane{order:2}}.card{border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:14px;background:var(--c-surface)}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}label{display:block;font-size:12px;color:var(--c-text-secondary);margin-bottom:4px}input[type=number]{width:112px;max-width:100%}input,button,select,textarea{background:#0d0d0d;color:var(--c-text);border:1px solid var(--c-border-interactive);border-radius:var(--radius-md);padding:10px;font-size:16px;box-sizing:border-box;max-width:100%;transition:border-color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast),opacity var(--transition-fast)}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 2px var(--c-accent-muted)}input[type=range]{width:260px;max-width:100%}input[type=range]:focus-visible{box-shadow:0 0 0 2px var(--c-accent-muted)}input[type=checkbox]{transform:scale(1.15)}input[type=checkbox]:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;box-shadow:none}button{cursor:pointer;font-weight:500}button:hover:not(:disabled){background:var(--c-surface-raised);border-color:#444}button:active:not(:disabled){background:#1a1a1a}button:focus-visible{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 2px var(--c-accent-muted)}button:disabled{opacity:.45;cursor:not-allowed}select:hover{border-color:#444}.hint{font-size:12px;color:var(--c-text-secondary);line-height:1.45;margin:8px 0 0}.warn{color:var(--c-warn)}.init-hint{color:var(--c-accent);font-weight:600}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12px;white-space:pre-wrap}.checkbox-label{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;color:var(--c-text-secondary)}.indicator-ok{color:var(--c-success)}textarea{width:100%;resize:vertical;box-sizing:border-box}canvas{width:100%;height:auto;background:#070707;border:1px solid var(--c-border);border-radius:var(--radius-lg);box-sizing:border-box}.small{font-size:12px;color:var(--c-text-secondary)}.pill{display:inline-flex;align-items:center;padding:6px 12px;border:1px solid var(--c-border-interactive);border-radius:var(--radius-pill);background:var(--c-accent-muted);font-size:12px;font-weight:500;color:var(--c-accent);letter-spacing:.2px}label[title][for]{cursor:help;border-bottom:1px dotted #555}details{border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:10px;background:#0f0f0f;transition:border-color var(--transition-normal)}details[open]{border-color:#2e2e2e}summary{cursor:pointer;user-select:none;font-weight:600;font-size:13px;color:var(--c-text);transition:color var(--transition-fast)}summary:hover{color:var(--c-accent)}summary::marker{color:var(--c-text-tertiary)}hr{border:0;border-top:1px solid var(--c-border);margin:14px 0}kbd{padding:1px 5px;font-size:10px;color:#9e9e9e;background:#1a1a1a;border:1px solid #333;border-radius:4px;margin-left:4px}.level-meter-wrap{display:flex;align-items:center;gap:8px;margin-top:8px}#levelMeter{width:160px;height:14px;border-radius:7px;border:1px solid var(--c-border-interactive)}.progress-bar-bg{flex:1;height:6px;background:#1a1a1a;border-radius:3px;overflow:hidden;border:1px solid var(--c-border-interactive)}.progress-bar-fill{height:100%;background:var(--c-accent);border-radius:3px;transition:width .18s ease-out;width:0%}.scan-progress{margin-top:6px;height:24px;display:flex;align-items:center;transition:opacity .2s ease-out,visibility .2s ease-out}.scan-progress-row{display:flex;align-items:center;gap:8px;width:100%}.scan-progress-text{white-space:nowrap;min-width:190px}.scan-progress.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.actions-sticky{position:sticky;top:calc(58px + env(safe-area-inset-top));z-index:1;background:var(--c-surface);padding:8px 0;border-bottom:1px solid var(--c-border)}.section-group{margin-top:10px;border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:10px;background:#0f0f0f}.hidden{display:none!important}.onboarding-overlay{position:fixed;inset:0;z-index:100;background:#000000c7;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:16px;animation:overlay-fadein .25s ease-out}@keyframes overlay-fadein{0%{opacity:0}to{opacity:1}}@keyframes dialog-enter{0%{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.onboarding-dialog{background:var(--c-surface);border:1px solid #2e2e2e;border-radius:18px;padding:32px 28px 24px;max-width:480px;width:100%;box-shadow:0 12px 48px #000000b3,0 0 0 1px #ffffff0a inset;animation:dialog-enter .3s ease-out}.onboarding-dialog h2{margin:0 0 6px;font-size:20px;font-weight:700;color:var(--c-text);letter-spacing:.2px}.onboarding-subtitle{font-size:13px;color:var(--c-text-secondary);line-height:1.5;margin:0 0 18px}.onboarding-steps{margin:0 0 20px;padding-left:20px;font-size:13px;color:#cfcfcf;line-height:1.6}.onboarding-steps li{margin-bottom:10px}.onboarding-steps li:last-child{margin-bottom:0}.onboarding-steps kbd{padding:1px 5px;font-size:10px;color:#9e9e9e;background:#1a1a1a;border:1px solid #333;border-radius:4px;margin-left:2px}.onboarding-actions{display:flex;align-items:center;gap:16px}.onboarding-actions button{background:var(--c-accent);color:#0b0b0b;border:none;border-radius:var(--radius-md);padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.onboarding-actions button:hover{background:var(--c-accent-hover);transform:translateY(-1px)}.onboarding-actions button:active{transform:translateY(0)}.onboarding-actions button:focus-visible{outline:none;box-shadow:0 0 0 3px var(--c-accent-muted)}.onboarding-skip{font-size:12px;color:var(--c-text-tertiary);text-decoration:none;transition:color var(--transition-fast)}.onboarding-skip:hover{color:var(--c-text-secondary);text-decoration:underline}.onboarding-notice{font-size:12px;color:var(--c-warn);line-height:1.5;margin:0 0 14px;padding:10px 12px;background:#ffbf8012;border:1px solid rgba(255,191,128,.16);border-radius:var(--radius-md)}.onboarding-tip{font-size:12px;color:var(--c-accent);line-height:1.5;margin:0 0 18px;padding:10px 12px;background:#4fc3f70f;border:1px solid rgba(79,195,247,.14);border-radius:var(--radius-md)}.help-btn{background:transparent;border:1px solid #3a3a3a;color:var(--c-text-secondary);border-radius:50%;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;font-size:14px;font-weight:700;line-height:1;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:color var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast)}.help-btn:hover{color:var(--c-text);border-color:var(--c-accent);background:var(--c-accent-muted)}.help-btn:focus-visible{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 2px var(--c-accent-muted)}.status-error{color:var(--c-error);font-weight:700}.pwa-update-banner{position:fixed;bottom:0;left:0;right:0;z-index:200;background:#141422;color:var(--c-text);padding:14px 18px;padding-bottom:calc(14px + env(safe-area-inset-bottom));font-size:14px;display:flex;align-items:center;gap:12px;border-top:1px solid #2a2a40;box-shadow:0 -4px 16px #00000080}.pwa-update-banner button{padding:8px 16px;font-size:14px;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.pwa-update-banner #pwaReload{background:var(--c-accent);color:#0b0b0b;border:none;font-weight:700}.pwa-update-banner #pwaReload:hover{background:var(--c-accent-hover)}.pwa-dismiss{background:transparent;border:1px solid #555;color:var(--c-text-secondary);padding:8px 12px;margin-left:auto}.pwa-dismiss:hover{border-color:#777;color:var(--c-text)}#btnInit{background:var(--c-accent);color:#0b0b0b;border:none;font-weight:700;letter-spacing:.2px}#btnInit:hover:not(:disabled){background:var(--c-accent-hover);border:none}#btnInit:active:not(:disabled){background:#3ab5e8}#btnInit:disabled{background:var(--c-accent);opacity:.35}@media(max-width:500px){input[type=range],input[type=number]{width:100%}.row{flex-direction:column}.row>div{width:100%}.actions-sticky .row,.actions-sticky{flex-wrap:wrap}.scan-progress-text{min-width:0;font-size:11px}#levelMeter{width:100px}.onboarding-dialog{padding:22px 18px 18px}.onboarding-steps{padding-left:16px}.actions-sticky{display:flex;flex-wrap:wrap;gap:6px;justify-content:center!important}.actions-sticky button{flex:1 1 auto;min-width:0;font-size:13px;padding:10px 6px}h1{font-size:14px}.pill{font-size:11px;padding:5px 8px}}@media(max-width:600px){.scan-progress-text{min-width:0}}@media(max-height:500px)and (orientation:landscape){header{padding-top:calc(6px + env(safe-area-inset-top));padding-bottom:4px}.actions-sticky{padding:4px 0;top:calc(42px + env(safe-area-inset-top))}.actions-sticky button{padding:6px;font-size:13px}}@media(pointer:coarse){button,select,input[type=number],input[type=range],input[type=checkbox]{min-height:44px}summary{min-height:44px;display:flex;align-items:center}.checkbox-label{min-height:44px}.onboarding-skip{min-height:44px;display:inline-flex;align-items:center}.help-btn{width:44px;height:44px;min-width:44px;min-height:44px;font-size:16px}kbd{display:none}input[type=range]{height:44px}}
