@import "https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=JetBrains+Mono:wght@300;400;500&display=swap";.bg-canvas{z-index:0;background:radial-gradient(ellipse 80% 60% at 20% 10%, #63b3ed12 0%, transparent 60%), radial-gradient(ellipse 60% 80% at 80% 90%, #7ee8d00f 0%, transparent 60%), var(--bg);position:fixed;inset:0}.bg-grid{z-index:0;background-image:linear-gradient(#63b3ed0a 1px,#0000 1px),linear-gradient(90deg,#63b3ed0a 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(70% 70%,#000 30%,#0000 100%);mask-image:radial-gradient(70% 70%,#000 30%,#0000 100%)}.particles{pointer-events:none;z-index:0;position:fixed;inset:0}.particle{background:var(--accent);opacity:0;border-radius:50%;animation:linear infinite float-up;position:absolute}@keyframes float-up{0%{opacity:0;transform:translateY(0)}10%{opacity:.5}90%{opacity:.15}to{opacity:0;transform:translateY(-180px)}}.shell{z-index:1;flex-direction:column;height:100dvh;display:flex;position:relative}header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 24px 14px;display:flex}.logo-group{align-items:center;gap:12px;display:flex}.logo-mark{border:1.5px solid var(--accent);width:36px;height:36px;box-shadow:0 0 16px var(--glow), inset 0 0 8px #63b3ed14;border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative}.logo-mark:before{content:"";border:1px solid #63b3ed66;border-radius:6px;animation:3s ease-in-out infinite pulse-border;position:absolute;inset:4px}.logo-inner{background:var(--accent);width:10px;height:10px;box-shadow:0 0 8px var(--accent);border-radius:50%;animation:2s ease-in-out infinite pulse-dot}@keyframes pulse-border{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes pulse-dot{0%,to{box-shadow:0 0 6px var(--accent)}50%{box-shadow:0 0 16px var(--accent),0 0 32px #63b3ed66}}.logo-text{flex-direction:column;line-height:1;display:flex}.logo-name{letter-spacing:4px;background:linear-gradient(135deg, var(--accent), var(--accent2));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:20px;font-weight:800}.logo-sub{color:var(--muted);letter-spacing:2px;margin-top:2px;font-family:JetBrains Mono,monospace;font-size:9px}.status-pill{border:1px solid var(--border);color:var(--muted);border-radius:20px;align-items:center;gap:5px;padding:4px 10px;font-family:JetBrains Mono,monospace;font-size:10px;transition:all .4s;display:flex}.status-pill .dot{background:var(--muted);border-radius:50%;width:6px;height:6px;transition:all .4s}.status-pill.active{color:var(--accent2);background:#7ee8d00f;border-color:#7ee8d04d}.status-pill.active .dot{background:var(--accent2);box-shadow:0 0 6px var(--accent2);animation:1.2s ease-in-out infinite blink}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}main{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;padding:24px;display:flex}.orb-wrap{justify-content:center;align-items:center;width:220px;height:220px;display:flex;position:relative}.orb-ring{pointer-events:none;border:1px solid;border-radius:50%;animation:linear infinite spin;position:absolute}.r1{border-color:#63b3ed40;animation-duration:12s;inset:0}.r2{border-color:#7ee8d02e;animation-duration:8s;animation-direction:reverse;inset:14px}.r3{border-style:dashed;border-color:#63b3ed1f;animation-duration:20s;inset:28px}@keyframes spin{to{transform:rotate(360deg)}}.widget-center{z-index:2;justify-content:center;align-items:center;display:flex;position:relative}.state-label{letter-spacing:3px;color:var(--muted);text-transform:uppercase;text-align:center;min-height:18px;font-family:JetBrains Mono,monospace;font-size:12px;transition:color .3s}.state-label.active{color:var(--accent)}.drawer{border:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);opacity:0;background:#0c1220eb;border-radius:16px;width:100%;max-width:420px;max-height:0;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s;overflow:hidden}.drawer.open{opacity:1;max-height:300px}.drawer-inner{padding:20px 24px 24px}.drawer-title{letter-spacing:3px;color:var(--muted);text-transform:uppercase;align-items:center;gap:8px;margin-bottom:18px;font-family:JetBrains Mono,monospace;font-size:10px;display:flex}.drawer-title:after{content:"";background:var(--border);flex:1;height:1px}.drawer-grid{gap:14px;display:grid}.ctrl-row{align-items:center;gap:12px;display:flex}.ctrl-label{color:var(--muted);flex-shrink:0;width:88px;font-family:JetBrains Mono,monospace;font-size:11px}.ctrl-value{color:var(--accent);text-align:right;flex-shrink:0;width:34px;font-family:JetBrains Mono,monospace;font-size:11px}footer{border-top:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 24px;display:flex}.footer-info{color:var(--muted);opacity:.4;font-family:JetBrains Mono,monospace;font-size:9px}.btn-settings{letter-spacing:2px;text-transform:uppercase;border:1px solid var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:8px;padding:7px 14px;font-family:JetBrains Mono,monospace;font-size:10px;font-weight:500;transition:all .2s}.btn-settings:hover,.btn-settings.active{color:var(--accent);background:var(--glow);border-color:#63b3ed59}@media (width<=430px){header{padding:14px 16px 12px}.logo-name{letter-spacing:3px;font-size:17px}main{gap:16px;padding:16px}.orb-wrap{width:180px;height:180px}footer{padding:12px 16px}}:root{--bg:#050810;--surface:#0c1220;--border:#63b3ed1f;--accent:#63b3ed;--accent2:#7ee8d0;--text:#e2e8f0;--muted:#4a5568;--glow:#63b3ed2e}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:Syne,sans-serif;overflow:hidden}input[type=range]{-webkit-appearance:none;background:var(--border);cursor:pointer;border-radius:3px;outline:none;width:100%;height:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);width:14px;height:14px;box-shadow:0 0 6px var(--accent);cursor:pointer;border-radius:50%;transition:transform .2s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.3)}select{border:1px solid var(--border);color:var(--text);cursor:pointer;background:#63b3ed0d;border-radius:8px;outline:none;width:100%;padding:6px 10px;font-family:JetBrains Mono,monospace;font-size:11px}select option{background:var(--surface)}