:root{--bg:#0d0d12;--bg-card:#16161e;--bg-card2:#1e1e28;--text:#E0E0E0;--text-dim:#B0B0B0;--accent:#7c6ff0;--accent-glow:rgba(124,111,240,.35);--green:#4ade80;--red:#ef4444;--border:#282834;--radius:10px}.modal-overlay{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.65)}.modal-overlay.open{display:flex}.modal-overlay.open .modal-panel{animation:fadeIn .2s ease}.modal-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:20px;width:320px;max-width:90vw}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.modal-title{font-size:15px;font-weight:700;color:var(--accent)}.modal-close{background:0 0;border:none;color:var(--text-dim);font-size:18px;cursor:pointer;padding:2px 6px;border-radius:4px}.modal-close:hover{background:rgba(255,255,255,.06);color:var(--text)}.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.theme-opt{padding:6px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:border-color .15s}.theme-opt:hover{border-color:rgba(255,255,255,.25)}.theme-opt.selected{border-color:#fff}.tswatch{display:block;width:100%;aspect-ratio:1;border-radius:50%}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);height:100vh;overflow:hidden;touch-action:manipulation}#bg-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.auth-screen,.menu-screen{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1;display:none;align-items:center;justify-content:center;opacity:0}.auth-screen.visible,.menu-screen.visible{display:flex;opacity:1}.auth-screen.fade-in,.auth-screen.fade-out,.menu-screen.fade-in,.menu-screen.fade-out{display:flex}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}.auth-screen.fade-in,.menu-screen.fade-in{animation:fadeIn .35s ease forwards}.auth-screen.fade-out,.menu-screen.fade-out{animation:fadeOut .25s ease forwards}.auth-panel{width:380px;max-width:90vw;background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:36px 32px 28px;text-align:center}.auth-title{font-size:36px;font-weight:800;color:var(--accent);letter-spacing:2px;margin-bottom:6px;text-shadow:0 0 20px var(--accent-glow)}.auth-sub{color:var(--text-dim);font-size:15px;margin-bottom:28px}.auth-input{width:100%;padding:16px 20px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-card);color:var(--text);font-size:15px;outline:0;margin-bottom:12px;font-family:system-ui,-apple-system,sans-serif}.auth-input:focus{border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow)}.btn-primary{width:100%;padding:16px;margin-top:16px;border:none;border-radius:var(--radius);background:linear-gradient(135deg,var(--accent),#5a4fd6);color:#fff;font-size:17px;font-weight:700;letter-spacing:.5px;font-family:'Segoe UI',system-ui,-apple-system,sans-serif;cursor:pointer;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px;transition:box-shadow .3s,transform .15s}.btn-primary::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent);opacity:0;transition:opacity .3s}.btn-primary:hover{box-shadow:0 0 28px var(--accent-glow);transform:translateY(-1px)}.btn-primary:hover::after{opacity:1}.btn-primary:active{transform:scale(.97)}.btn-primary:disabled{opacity:.45;filter:grayscale(.4)}.btn-link{background:0 0;border:none;color:var(--text-dim);font-size:14px;cursor:pointer;margin-top:20px;text-decoration:underline;display:inline-block}.btn-link:hover{color:var(--accent)}.status-msg{margin-top:12px;font-size:13px;min-height:18px}.status-msg.ok{color:var(--green)}.status-msg.err{color:var(--red)}.auth-form{display:none}.auth-form.active{display:block}.menu-screen{align-items:stretch;padding:0}#overlay{display:flex;flex:1;min-height:0}.sidebar{width:210px;background:var(--bg-card);border-right:1px solid var(--border);display:flex;flex-direction:column;position:relative}.logo{padding:8px 16px;border-bottom:1px solid var(--border);display:flex;justify-content:center;align-items:center}.logo-img{width:100%;max-width:120px;aspect-ratio:1;background-color:var(--accent);-webkit-mask:url('../img/silent-large-black.png') no-repeat center/contain;mask:url('../img/silent-large-black.png') no-repeat center/contain;opacity:.9;transition:background-color .3s ease}.cat-head{padding:10px 16px 2px;font-size:10px;text-transform:uppercase;color:var(--text-dim);letter-spacing:1px}.sub{padding:10px 16px;font-size:13px;color:var(--text-dim);cursor:pointer;border-left:2px solid transparent;display:flex;align-items:center;gap:8px}.sub i{width:14px;text-align:center;font-size:12px}.sbi{width:14px;text-align:center;font-size:14px;color:var(--accent);display:inline-block}.sub:hover{background:rgba(255,255,255,.05);color:var(--text)}.sub.active{border-left:2px solid var(--accent);color:var(--accent);background:rgba(124,111,240,.08)}.sidebar .spacer{flex:1}.settings-panel{position:absolute;left:12px;bottom:48px;width:186px;background:var(--bg-card2);border:1px solid var(--border);border-radius:8px;padding:4px;box-shadow:0 10px 25px -5px rgba(0,0,0,.5),0 8px 10px -6px rgba(0,0,0,.5);display:none;z-index:99}.settings-panel.open{display:block;animation:slideUp .18s cubic-bezier(.16,1,.3,1)}.settings-item{display:flex;align-items:center;gap:10px;padding:8px 12px;font-size:12px;color:var(--text-dim);cursor:pointer;border-radius:6px;transition:all .15s ease}.settings-item:hover{background:rgba(255,255,255,.06);color:var(--text)}.settings-item svg{color:var(--accent);transition:transform .15s ease}.settings-item:hover svg{transform:scale(1.05)}@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.info-bar{padding:12px 16px;border-top:1px solid var(--border);display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text-dim)}.info-bar .dot{width:8px;height:8px;min-width:8px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green)}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.topbar{height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 14px;background:var(--bg-card);border-bottom:1px solid var(--border)}.top-title{font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px;color:var(--accent)}.top-actions{display:flex;gap:8px}.top-btn{padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:var(--bg-card2);color:var(--text);font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px}.top-btn:hover{border-color:var(--accent)}.top-btn.danger{border-color:rgba(231,76,60,.4);color:#e74c3c}.content{flex:1;display:flex;gap:14px;padding:14px;overflow:hidden}.panel{flex:1;display:flex;flex-direction:column;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.panel-header{padding:12px 14px;background:#141418;font-size:11px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:1.5px;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--border)}.panel-body{padding:4px 0;flex:1;overflow-y:auto;position:relative}.prow{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:13px;border-top:1px solid var(--border)}.prow span:first-child{display:flex;align-items:center;gap:8px}.prow:first-of-type{border-top:none}.toggle{position:relative;width:40px;height:20px}.toggle input{display:none}.slider{position:absolute;inset:0;background:#3a3a4a;border-radius:20px;cursor:pointer}.slider:before{content:'';position:absolute;width:14px;height:14px;top:3px;left:3px;background:#888;border-radius:50%;transition:.25s ease}.toggle input:checked+.slider{background:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.toggle input:checked+.slider:before{transform:translateX(18px);background:#fff}.range-slider{-webkit-appearance:none;appearance:none;width:calc(100% - 28px);height:5px;margin:6px 14px 10px;background:#3a3a4a;border-radius:3px;outline:0;display:block}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 10px var(--accent-glow);border:none}.keybind{padding:4px 10px;background:#2a2a38;border:1px solid var(--border);border-radius:6px;font-size:11px;font-weight:600;color:var(--accent);cursor:pointer;font-family:inherit}.color-swatch{cursor:pointer}.swatch{width:16px;height:16px;border-radius:4px;display:inline-block}.page-config,.page-content{position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;pointer-events:none;transition:opacity .25s ease}.page-config.active,.page-content.active{opacity:1;pointer-events:auto}.input-mono{font-family:'Courier New',Consolas,'Fira Code',monospace;letter-spacing:1px;font-size:11px}.pw-meter{opacity:0;max-height:0;margin:0;border-radius:2px;background:#2a2a38;overflow:hidden;transition:opacity .35s ease,max-height .35s ease,margin .35s ease}.pw-meter.visible{opacity:1;max-height:6px;margin:-6px 0 10px}.pw-meter-fill{height:4px;width:0;border-radius:2px;transition:width .3s,background .3s}.pw-label{opacity:0;max-height:0;font-size:11px;text-align:left;overflow:hidden;transition:opacity .35s ease,max-height .35s ease,margin .35s ease}.pw-label.visible{opacity:1;max-height:20px;margin:-2px 0 8px}@media (max-width:600px){.sidebar{width:60px;transition:width .2s ease}.logo{padding:12px 0}.logo-img{max-width:32px}.cat-head{display:none}.sub{padding:12px 0;justify-content:center;font-size:0;gap:0}.sbi{margin:0;font-size:16px}.info-bar{padding:12px 0;flex-direction:column;gap:12px;align-items:center}.info-bar .brand{display:none}.settings-panel{left:68px;bottom:12px;width:150px}.topbar{padding:0 12px;height:48px}.content{flex-direction:column;overflow-y:auto;padding:10px;gap:12px}.panel{flex:none;display:block;height:auto}.panel-body{overflow-y:visible}.auth-panel{padding:24px 20px 20px}.auth-title{font-size:28px}}