@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-main:#09090b;--bg-surface:#121218b3;--bg-surface-solid:#121218;--bg-card:#18182073;--border-light:#ffffff14;--border-focus:#a855f780;--primary:270, 91%, 65%;--primary-rgb:168, 85, 247;--secondary:195, 100%, 50%;--secondary-rgb:6, 182, 212;--success:142, 70%, 45%;--success-rgb:34, 197, 94;--danger:346, 84%, 61%;--danger-rgb:239, 68, 68;--warning:38, 92%, 50%;--warning-rgb:245, 158, 11;--text-primary:#f4f4f5;--text-secondary:#a1a1aa;--text-muted:#71717a;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#ffffff1a transparent;margin:0;padding:0}body{background-color:var(--bg-main);color:var(--text-primary);justify-content:center;align-items:center;min-height:100vh;display:flex;overflow-x:hidden}.app-container{background:radial-gradient(circle at 50% 0%, #a855f726, transparent 70%), var(--bg-main);border-radius:40px;flex-direction:column;width:100%;max-width:480px;height:100vh;max-height:920px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #000000b3,0 0 0 12px #1c1917,0 0 0 14px #292524}@media (width<=500px){.app-container{max-width:100%;height:100vh;max-height:100%;box-shadow:none;border-radius:0}}.scroll-content{flex:1;padding:24px 20px 100px;position:relative;overflow-y:auto}.glass-panel{background:var(--bg-surface);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-light);border-radius:24px;box-shadow:0 10px 30px #0000004d}.glass-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:20px;padding:18px;transition:all .25s cubic-bezier(.4,0,.2,1)}.glass-card:hover{border-color:rgba(var(--primary-rgb), .3);background:#18182099;transform:translateY(-2px)}.app-header{border-bottom:1px solid var(--border-light);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#09090bcc;justify-content:space-between;align-items:center;height:70px;padding:0 24px;display:flex}.logo-text{letter-spacing:-.5px;background:linear-gradient(135deg, hsl(var(--primary)), hsl(var(--secondary)));-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:8px;font-size:24px;font-weight:800;display:flex}.logo-dot{background-color:hsl(var(--secondary));width:8px;height:8px;box-shadow:0 0 10px hsl(var(--secondary));border-radius:50%;display:inline-block}.form-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.form-label{color:var(--text-secondary);font-size:14px;font-weight:500}.form-input{border:1px solid var(--border-light);color:var(--text-primary);background:#0000004d;border-radius:12px;padding:14px;font-family:inherit;font-size:15px;transition:all .2s}.form-input:focus{border-color:hsl(var(--primary));box-shadow:0 0 0 3px rgba(var(--primary-rgb), .15);background:#00000080;outline:none}.btn{background:linear-gradient(135deg, hsl(var(--primary)), hsl(var(--primary) - 10));color:#fff;cursor:pointer;box-shadow:0 4px 15px rgba(var(--primary-rgb), .3);border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:14px 20px;font-family:inherit;font-size:15px;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex}.btn:hover{box-shadow:0 6px 20px rgba(var(--primary-rgb), .4);opacity:.95;transform:translateY(-1px)}.btn-secondary{border:1px solid var(--border-light);color:var(--text-primary);box-shadow:none;background:#ffffff0f}.btn-secondary:hover{box-shadow:none;background:#ffffff1a;border-color:#fff3}.btn-danger{background:linear-gradient(135deg, hsl(var(--danger)), hsl(var(--danger) - 10));box-shadow:0 4px 15px rgba(var(--danger-rgb), .3)}.btn-danger:hover{box-shadow:0 6px 20px rgba(var(--danger-rgb), .4)}.btn-outline-primary{border:1px solid hsl(var(--primary));color:hsl(var(--primary));box-shadow:none;background:0 0}.btn-outline-primary:hover{background:rgba(var(--primary-rgb), .1);box-shadow:0 0 15px rgba(var(--primary-rgb), .15)}.mock-switch-container{background:rgba(var(--primary-rgb), .08);border:1px dashed rgba(var(--primary-rgb), .25);border-radius:16px;justify-content:space-between;align-items:center;margin-bottom:24px;padding:12px 16px;display:flex}.switch{width:48px;height:26px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;border:1px solid var(--border-light);background-color:#ffffff1a;border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:18px;height:18px;transition:all .3s;position:absolute;bottom:3px;left:3px;box-shadow:0 2px 4px #0003}input:checked+.slider{background:linear-gradient(135deg, hsl(var(--primary)), hsl(var(--secondary)));border-color:#0000}input:checked+.slider:before{transform:translate(22px)}.lock-button-outer{justify-content:center;align-items:center;width:220px;height:220px;margin:40px auto;display:flex;position:relative}.lock-orbit{border:2px dashed #ffffff1a;border-radius:50%;width:100%;height:100%;animation:30s linear infinite spin;position:absolute}.lock-orbit-active{border-color:rgba(var(--primary-rgb), .35);animation:15s linear infinite spin}.lock-glow{filter:blur(25px);opacity:.15;border-radius:50%;width:180px;height:180px;transition:all .5s;position:absolute}.lock-glow.locked{background:hsl(var(--danger));box-shadow:0 0 50px rgba(var(--danger-rgb), .3)}.lock-glow.unlocked{background:hsl(var(--success));box-shadow:0 0 50px rgba(var(--success-rgb), .3)}.lock-glow.processing{background:hsl(var(--primary));box-shadow:0 0 50px rgba(var(--primary-rgb), .35);animation:1.5s infinite pulse}.lock-circle-btn{cursor:pointer;z-index:2;background:radial-gradient(circle at 30% 20%,#ffffff0d,#0000),#121218;border:1px solid #ffffff1a;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:170px;height:170px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;position:relative;box-shadow:inset 0 4px 10px #ffffff08,0 20px 40px #0006}.lock-circle-btn.locked{border-color:rgba(var(--danger-rgb), .3);box-shadow:0 0 30px rgba(var(--danger-rgb), .1), inset 0 2px 5px #ffffff05}.lock-circle-btn.unlocked{border-color:rgba(var(--success-rgb), .35);box-shadow:0 0 30px rgba(var(--success-rgb), .15), inset 0 2px 5px #ffffff05}.lock-circle-btn.processing{border-color:rgba(var(--primary-rgb), .4);box-shadow:0 0 30px rgba(var(--primary-rgb), .2);transform:scale(.96)}.lock-circle-btn:active{transform:scale(.94)}.lock-icon-wrapper{color:var(--text-primary);transition:all .4s}.lock-icon-wrapper.locked{color:rgb(var(--danger-rgb));transform:scale(1)}.lock-icon-wrapper.unlocked{color:rgb(var(--success-rgb));transform:rotate(360deg)scale(1.05)}.lock-status-text{text-transform:uppercase;letter-spacing:1.5px;color:var(--text-secondary);font-size:13px;font-weight:700;transition:all .3s}.lock-status-text.locked{color:rgba(var(--danger-rgb), .8)}.lock-status-text.unlocked{color:rgba(var(--success-rgb), .9)}.battery-badge{border:1px solid var(--border-light);background:#ffffff0d;border-radius:30px;align-items:center;gap:6px;padding:6px 12px;font-size:13px;font-weight:600;display:flex}.battery-high{color:rgb(var(--success-rgb))}.battery-mid{color:rgb(var(--warning-rgb))}.battery-low{color:rgb(var(--danger-rgb));animation:1s infinite alternate pulse}.bottom-nav{-webkit-backdrop-filter:blur(25px);border-top:1px solid var(--border-light);z-index:10;background:#121218d9;border-bottom-right-radius:40px;border-bottom-left-radius:40px;justify-content:space-around;align-items:center;height:76px;padding:0 10px;display:flex;position:absolute;bottom:0;left:0;right:0}@media (width<=500px){.bottom-nav{border-radius:0}}.nav-tab{color:var(--text-muted);cursor:pointer;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:60px;height:55px;font-size:11px;font-weight:600;text-decoration:none;transition:all .2s;display:flex}.nav-tab:hover{color:var(--text-secondary)}.nav-tab.active{color:hsl(var(--primary));background:rgba(var(--primary-rgb), .08)}.timeline{flex-direction:column;gap:16px;display:flex}.timeline-item{gap:14px;display:flex}.timeline-indicator{flex-direction:column;align-items:center;display:flex;position:relative}.timeline-dot{background:var(--text-muted);border:2px solid var(--bg-main);z-index:2;border-radius:50%;width:10px;height:10px}.timeline-dot.success{background:rgb(var(--success-rgb));box-shadow:0 0 8px rgba(var(--success-rgb), .6)}.timeline-dot.danger{background:rgb(var(--danger-rgb));box-shadow:0 0 8px rgba(var(--danger-rgb), .6)}.timeline-line{background:var(--border-light);z-index:1;width:1px;position:absolute;top:10px;bottom:-22px}.timeline-item:last-child .timeline-line{display:none}.timeline-content{border:1px solid var(--border-light);background:#ffffff05;border-radius:12px;flex:1;padding:10px 14px}.console-container{background:#050508;border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;height:280px;font-family:JetBrains Mono,monospace;font-size:12px;display:flex;overflow:hidden}.console-header{background:#0c0c14;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.console-body{flex-direction:column;flex:1;gap:8px;padding:12px;display:flex;overflow-y:auto}.console-log{border-bottom:1px dashed #ffffff0a;padding-bottom:6px}.console-sent{color:#c084fc}.console-received{color:#38bdf8}.console-success-api{color:#4ade80}.console-failed-api{color:#f87171}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%{opacity:.2;transform:scale(.98)}50%{opacity:.45;transform:scale(1.02)}to{opacity:.2;transform:scale(.98)}}.animate-fade-in{animation:.3s cubic-bezier(.4,0,.2,1) fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#fff3}.theme-toggle{border:1px solid var(--border-light);background:var(--bg-card);width:40px;height:40px;color:var(--text-secondary);cursor:pointer;border-radius:13px;justify-content:center;align-items:center;margin-left:auto;margin-right:10px;transition:transform .2s,color .2s,background .2s,border-color .2s;display:inline-flex}.theme-toggle:hover,.theme-toggle:focus-visible{color:hsl(var(--primary));border-color:rgba(var(--primary-rgb), .35);background:rgba(var(--primary-rgb), .08);outline:none}.theme-toggle:active{transform:scale(.94)}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-main:#f6f7fb;--bg-surface:#ffffffe0;--bg-surface-solid:#fff;--bg-card:#ffffffc7;--border-light:#1e293b21;--border-focus:#9333ea73;--primary:271, 81%, 56%;--primary-rgb:147, 51, 234;--secondary:192, 91%, 42%;--secondary-rgb:8, 145, 178;--success:142, 72%, 36%;--success-rgb:22, 163, 74;--danger:0, 72%, 51%;--danger-rgb:220, 38, 38;--warning:35, 92%, 43%;--warning-rgb:217, 119, 6;--text-primary:#111827;--text-secondary:#475569;--text-muted:#64748b}:root[data-theme=light] body{background-color:var(--bg-main)}:root[data-theme=light] .app-container{background:radial-gradient(circle at 50% 0%, rgba(var(--primary-rgb), .11), transparent 65%), var(--bg-main);box-shadow:0 25px 50px -12px #1e293b38,0 0 0 12px #e2e8f0,0 0 0 14px #cbd5e1}:root[data-theme=light] .app-header{background:#ffffffe6}:root[data-theme=light] .bottom-nav{background:#ffffffe6;box-shadow:0 -8px 28px #1e293b14}:root[data-theme=light] .glass-panel{box-shadow:0 10px 30px #1e293b17}:root[data-theme=light] .glass-card:hover{background:#fffffff5}:root[data-theme=light] .form-input,:root[data-theme=light] select.form-input{background:#ffffffeb!important}:root[data-theme=light] .form-input:focus{background:#fff!important}:root[data-theme=light] .btn-secondary{background:#0f172a0d}:root[data-theme=light] .btn-secondary:hover{background:#0f172a14;border-color:#0f172a29}:root[data-theme=light] .slider{background-color:#0f172a24}:root[data-theme=light] .lock-orbit{border-color:#0f172a1f}:root[data-theme=light] .lock-circle-btn{background:radial-gradient(circle at 30% 20%,#fff,#0000 75%),#f8fafc;border-color:#0f172a1f;box-shadow:inset 0 4px 10px #fffc,0 18px 38px #1e293b29}:root[data-theme=light] .timeline-content{background:#ffffffb8}:root[data-theme=light] .console-container{border-color:var(--border-light);background:#f8fafc}:root[data-theme=light] .console-header{border-color:var(--border-light);background:#eef2f7}:root[data-theme=light] .console-log{border-color:#0f172a17}:root[data-theme=light] .console-log span[style*=\#e4e4e7]{color:#0f172a!important}:root[data-theme=light] .console-log span[style*=\#a1a1aa]{color:#475569!important}:root[data-theme=light] .console-log div[style*=\#09090f]{border-color:var(--border-light)!important;background:#eef2f7!important}@media (prefers-reduced-motion:reduce){.theme-toggle{transition:none}}@media (width>=900px){body{justify-content:stretch;align-items:stretch}.app-container{max-width:none;min-height:100vh;max-height:none;box-shadow:none;background:radial-gradient(circle at 18% 8%, rgba(var(--primary-rgb), .13), transparent 34%), radial-gradient(circle at 82% 16%, rgba(var(--secondary-rgb), .08), transparent 30%), var(--bg-main);border-radius:0}.app-header{height:82px;padding:0 40px 0 126px;position:relative}.app-header img{height:42px!important}.scroll-content{padding:36px 48px 48px 132px}.scroll-content>.animate-fade-in{width:min(1180px,100%);margin:0 auto}.bottom-nav{border-top:0;border-right:1px solid var(--border-light);border-radius:0;flex-direction:column;justify-content:flex-start;gap:12px;width:92px;height:100%;padding:96px 10px 24px;position:absolute;inset:0 auto 0 0;box-shadow:14px 0 38px #00000029}.nav-tab{flex:none;width:72px;height:66px;font-size:11px}.glass-panel{border-radius:28px}.glass-card{border-radius:22px}.lock-button-outer{margin:24px 0;transform:scale(1.08)}}@media (width>=1280px){.scroll-content{padding-left:148px;padding-right:64px}.scroll-content>.animate-fade-in{width:min(1320px,100%)}}#root{width:100%;min-height:100vh}.login-screen{flex-direction:column;gap:20px;width:100%;display:flex}.login-brand-area{text-align:center;margin:20px 0 6px}.login-card{width:100%;padding:24px}@media (width>=900px){.scroll-content:has(.login-screen){padding:0;overflow:auto}.scroll-content>.login-screen{grid-template-columns:minmax(440px,1.08fr) minmax(420px,.92fr);gap:0;width:100%;max-width:none;min-height:calc(100vh - 82px);margin:0;display:grid}.login-brand-area{text-align:left;border-right:1px solid var(--border-light);background:radial-gradient(circle at 72% 28%, rgba(var(--secondary-rgb), .16), transparent 30%), linear-gradient(135deg, rgba(var(--primary-rgb), .13), transparent 52%), var(--bg-surface-solid);flex-direction:column;justify-content:center;align-items:flex-start;min-height:calc(100vh - 82px);margin:0;padding:72px clamp(52px,7vw,120px);display:flex}.login-brand-area img{width:min(390px,80%)!important;max-width:none!important;filter:drop-shadow(0 24px 60px rgba(var(--secondary-rgb), .16))!important;margin-bottom:32px!important}.login-brand-area p{max-width:520px;line-height:1.6;font-size:20px!important}.login-card{border-radius:28px;width:min(500px,100% - 72px);margin:auto;box-shadow:0 28px 80px #00000047;padding:36px!important}}@media (width>=1500px){.scroll-content>.login-screen{grid-template-columns:58% 42%}}.setting-row{border:1px solid var(--border-light);background:rgba(var(--primary-rgb), .04);min-height:48px;color:var(--text-secondary);border-radius:12px;justify-content:space-between;align-items:center;gap:16px;padding:11px 14px;font-size:13px;font-weight:600;display:flex}.setting-row input{width:18px;height:18px;accent-color:hsl(var(--primary))}.login-error{align-items:center;gap:7px;display:flex}
