:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-cyan:#6ccdef;--color-cyan-light:#e4fff9;--color-cyan-dark:#56cfe1;--color-blue:#10abe4;--color-purple:#b0b5ff;--color-purple-dark:#7400b8;--color-magenta:#7400b8;--color-yellow:#ff9000;--color-accent-rare:#f20089;--color-cyan-03:#6ccdef08;--color-cyan-05:#6ccdef0d;--color-cyan-08:#6ccdef14;--color-cyan-10:#6ccdef1a;--color-cyan-15:#6ccdef26;--color-cyan-20:#6ccdef33;--color-cyan-25:#6ccdef40;--color-cyan-30:#6ccdef4d;--color-cyan-35:#6ccdef59;--color-cyan-40:#6ccdef66;--color-cyan-50:#6ccdef80;--color-cyan-60:#6ccdef99;--color-purple-08:#b0b5ff14;--color-purple-12:#b0b5ff1f;--color-purple-15:#b0b5ff26;--color-purple-30:#b0b5ff4d;--color-purple-60:#b0b5ff99;--color-bg-primary:#030812;--color-bg-secondary:#061020;--color-bg-elevated:#0a1628;--color-bg-card:#0a1628;--color-border-light:#ffffff14;--color-border-medium:#ffffff1f;--color-border-strong:#ffffff2e;--color-text-primary:#f0f4f8;--color-text-secondary:#f0f4f899;--color-text-muted:#f0f4f88c;--color-text-subtle:#f0f4f86b;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:var(--color-cyan);--color-success-light:#34d399;--color-warning-light:#fbbf24;--color-error-light:#f87171;--color-blue-light:#93c5fd;--color-text-on-gradient:#fff;--gradient-primary:linear-gradient(135deg,#b0b5ff 0%,#10abe4 100%);--gradient-hero:linear-gradient(135deg,#b0b5ff 0%,#6ccdef 100%);--gradient-accent:linear-gradient(135deg,#b0b5ff 0%,#10abe4 50%,#e4fff9 100%);--gradient-subtle:linear-gradient(135deg,#6ccdef0d 0%,#b0b5ff0d 100%);--gradient-card:linear-gradient(135deg,#6ccdef14 0%,#b0b5ff14 100%);--shadow-sm:0 1px 2px 0 #0000004d;--shadow-base:0 1px 3px 0 #0006;--shadow-md:0 2px 4px 0 #00000080;--shadow-lg:0 4px 8px 0 #0009;--shadow-xl:0 8px 16px 0 #000000b3;--shadow-focus:0 0 0 3px #6ccdef40;--shadow-glow:0 0 20px #6ccdef40;--shadow-glow-hover:0 0 35px #6ccdef59,0 0 70px #b0b5ff33;--shadow-card:0 0 25px #6ccdef1f;--radius-sm:4px;--radius-base:6px;--radius-md:8px;--radius-lg:10px;--radius-xl:12px;--radius-full:9999px;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:20px;--space-2xl:24px;--space-3xl:32px;--font-sans:"Plus Jakarta Sans","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",sans-serif;--font-title:"Poppins","Plus Jakarta Sans",sans-serif;--font-mono:"JetBrains Mono","SF Mono","Monaco","Menlo","Courier New",monospace;--text-xs:11px;--text-sm:12px;--text-base:13px;--text-lg:14px;--text-xl:16px;--text-2xl:18px;--text-3xl:20px;--font-light:300;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--transition-fast:.12s cubic-bezier(.4,0,.2,1);--transition-base:.2s cubic-bezier(.4,0,.2,1);--transition-slow:.3s cubic-bezier(.4,0,.2,1);--easing-spring:cubic-bezier(.34,1.56,.64,1);--z-dropdown:1000;--z-modal:2000;--z-tooltip:3000;--glass-bg-subtle:#ffffff08;--glass-bg-base:#ffffff0f;--glass-bg-raised:#ffffff17;--glass-bg-float:#ffffff21;--glass-blur-sm:blur(8px)saturate(140%);--glass-blur-md:blur(16px)saturate(160%);--glass-blur-lg:blur(28px)saturate(180%);--glass-blur-xl:blur(48px)saturate(200%);--glass-border-subtle:#ffffff0f;--glass-border-base:#ffffff1f;--glass-border-raised:#fff3;--glass-shadow-base:0 4px 24px #00000059,inset 0 1px 0 #ffffff14;--glass-shadow-raised:0 8px 40px #00000073,inset 0 1px 0 #ffffff1f;--glass-shadow-float:0 20px 60px #0000008c,inset 0 1px 0 #ffffff29;--glass-tint-cyan:#48bfe30f;--glass-tint-purple:#6930c30f;--glass-tint-warm:#f200890a;--glass-highlight:linear-gradient(135deg,#ffffff1f 0%,#fff0 60%);--glass-specular:linear-gradient(to bottom,#ffffff1a 0%,#fff0 100%)}body.light-mode{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg-primary:#fff;--color-bg-secondary:#fafbfc;--color-bg-elevated:#f5f7f9;--color-bg-card:#fff;--color-border-light:#0000000f;--color-border-medium:#0000001a;--color-border-strong:#00000026;--color-text-primary:#1a1d23;--color-text-secondary:#4a5568;--color-text-muted:#5d6b79;--color-text-subtle:#a0aec0;--color-text-on-gradient:#fff;--gradient-subtle:linear-gradient(135deg,#14b8a608 0%,#3b82f608 100%);--gradient-card:linear-gradient(135deg,#14b8a60d 0%,#a855f70d 100%);--shadow-sm:0 1px 2px 0 #00000008;--shadow-base:0 1px 3px 0 #0000000f;--shadow-md:0 2px 4px 0 #00000014;--shadow-lg:0 4px 8px 0 #0000001a;--shadow-xl:0 8px 16px 0 #0000001f;--shadow-focus:0 0 0 3px #14b8a626;--shadow-glow:0 0 20px #14b8a626;--shadow-glow-hover:0 0 30px #14b8a640,0 0 60px #14b8a626;--shadow-card:0 0 20px #14b8a60d;--glass-bg-subtle:#ffffff73;--glass-bg-base:#fff9;--glass-bg-raised:#ffffffb8;--glass-bg-float:#ffffffd9;--glass-border-subtle:#00000014;--glass-border-base:#00000021;--glass-border-raised:#0003;--glass-shadow-base:0 2px 8px #00000012,0 4px 20px #0000000f,inset 0 1px 0 #ffffffe6;--glass-shadow-raised:0 4px 16px #0000001a,0 8px 32px #00000014,inset 0 1px 0 #fffffff2;--glass-shadow-float:0 8px 32px #00000024,0 20px 56px #0000001a,inset 0 1px 0 #fff}
*{box-sizing:border-box;margin:0;padding:0}h1,h2{font-family:var(--font-title)}body{font-family:var(--font-sans);color:var(--color-text-primary);background:radial-gradient(ellipse 70% 55% at 20% 10%,#b0b5ff38 0%,transparent 60%),radial-gradient(ellipse 55% 45% at 80% 80%,#6ccdef29 0%,transparent 55%),radial-gradient(ellipse 45% 35% at 60% 40%,#5390d91a 0%,transparent 50%),var(--color-bg-primary);background-attachment:fixed;min-height:100vh;margin:0;padding:0}.demo-container{max-width:1400px;padding:var(--space-2xl);margin:0 auto}.demo-header{background:var(--glass-bg-base);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border-base);border-radius:var(--radius-xl);padding:var(--space-xl);margin-bottom:var(--space-2xl);box-shadow:var(--glass-shadow-base)}.demo-header h1{font-size:var(--text-xl);font-weight:var(--font-semibold);margin-bottom:var(--space-xs);color:var(--color-text-primary)}.demo-header-subtitle{font-size:var(--text-sm);color:var(--color-text-muted)}.status-badge{align-items:center;gap:var(--space-sm);padding:var(--space-xs)var(--space-md);border-radius:var(--radius-base);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-success-10);color:var(--color-success);margin-top:var(--space-md);display:inline-flex}.status-dot{border-radius:var(--radius-full);background:var(--color-success);width:8px;height:8px}.demo-content{max-width:900px;margin:0 auto;padding:0}.section-collapsible{margin-bottom:var(--space-lg);border-bottom:1px solid var(--color-border-light);padding-bottom:var(--space-lg)}.section-collapsible:last-child{border-bottom:none}.section-header{align-items:center;gap:var(--space-md);cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--space-md)0;transition:all var(--transition-base);display:flex}.section-header:hover{color:var(--color-cyan)}.section-chevron{font-size:var(--text-lg);transition:transform var(--transition-base);color:var(--color-text-muted);text-align:center;width:20px}.section-title{font-family:var(--font-title);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0}.section-content{max-height:5000px;transition:max-height var(--transition-slow);padding-left:calc(20px + var(--space-md));overflow:hidden}.section-content.collapsed{max-height:0}.section-inner{padding:var(--space-lg)0;background:var(--color-bg-elevated);border-radius:var(--radius-md);padding:var(--space-xl);margin-top:var(--space-md)}.demo-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border-base);border-radius:var(--radius-lg);padding:var(--space-xl);box-shadow:var(--glass-shadow-base);margin-bottom:var(--space-xl);color:var(--color-text-primary);background:var(--glass-bg-base)!important}.demo-card h2{font-size:var(--text-lg);font-weight:var(--font-semibold);margin-bottom:var(--space-lg);color:var(--color-text-primary)}.demo-card-section{margin-bottom:var(--space-lg)}.demo-card-section:last-child{margin-bottom:0}.demo-card-label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-sm);font-weight:var(--font-semibold)}.btn{padding:var(--space-sm)var(--space-lg);border-radius:var(--radius-base);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:all var(--transition-fast);border:1px solid var(--color-border-light);background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn:hover{background:var(--color-bg-elevated);border-color:var(--color-border-medium)}.btn-primary{background:var(--color-cyan);border-color:var(--color-cyan);color:#fff}.btn-primary:hover{background:var(--color-blue);border-color:var(--color-blue)}.btn-danger{border:1px solid var(--color-error);color:var(--color-error);background:0 0}.btn-danger:hover{background:#ef44441a}.btn-group{gap:var(--space-sm);display:flex}.btn-toggle{padding:var(--space-sm);font-size:var(--text-xs);flex:1}.btn-toggle.active{background:var(--color-cyan);border-color:var(--color-cyan);color:#fff}.btn-activation{padding:var(--space-md)var(--space-lg);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast);border:1px solid var(--color-border-light);color:var(--color-text-muted);justify-content:center;align-items:center;gap:var(--space-sm);text-transform:uppercase;letter-spacing:.5px;background:0 0;flex:1;display:flex}.btn-activation:hover{border-color:var(--color-border-medium)}.btn-activation.enabled{border-color:var(--color-success);color:var(--color-success);background:#10b98126}.btn-activation.loading,.btn-activation.disabled{border-color:var(--color-text-muted);color:var(--color-text-muted)}.toggle-switch{align-items:center;gap:var(--space-md);cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex}.toggle-track{background:var(--color-bg-elevated);border:1px solid var(--color-border-medium);border-radius:var(--radius-full);width:48px;height:24px;transition:all var(--transition-base);position:relative}.toggle-track.active{background:var(--color-cyan-20);border-color:var(--color-cyan)}.toggle-thumb{background:var(--color-text-muted);border-radius:var(--radius-full);width:18px;height:18px;transition:all var(--transition-base);position:absolute;top:2px;left:2px}.toggle-track.active .toggle-thumb{background:var(--color-cyan);left:26px}.toggle-label{font-size:var(--text-sm);color:var(--color-text-muted);font-weight:var(--font-medium)}.toggle-track.active+.toggle-label{color:var(--color-text-primary)}.btn-sm{padding:var(--space-xs)var(--space-md);font-size:var(--text-xs)}.btn-on{background:var(--color-success);border-color:var(--color-success);color:#fff}.btn-on:hover{opacity:.9}.btn-gradient{background:var(--gradient-primary);color:#fff;padding:var(--space-md)var(--space-2xl);border-radius:var(--radius-md);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-base);border:none;box-shadow:0 4px 12px #b0b5ff4d}.btn-gradient:hover{transform:translateY(-2px);box-shadow:0 6px 20px #b0b5ff66}.input{width:100%;padding:var(--space-sm)var(--space-md);border-radius:var(--radius-base);font-size:var(--text-sm);border:1px solid var(--color-border-light);background:var(--color-bg-secondary);color:var(--color-text-primary);transition:all var(--transition-fast)}.input:focus{border-color:var(--color-cyan);background:var(--color-bg-elevated);outline:none}.input::placeholder{color:var(--color-text-muted)}.input:disabled{opacity:.5;cursor:not-allowed}.input-group{gap:var(--space-sm);margin-bottom:var(--space-md);display:flex}.input-number{width:100px}select.input{cursor:pointer}.event-list{border:1px solid var(--color-border-light);border-radius:var(--radius-md);max-height:200px;color:var(--color-text-primary);overflow-y:auto;background:var(--color-bg-secondary)!important}.event-item{padding:var(--space-sm)var(--space-md);border-bottom:1px solid var(--color-border-light);transition:background var(--transition-fast);justify-content:space-between;align-items:center;display:flex}.event-item:last-child{border-bottom:none}.event-item:hover{background:var(--color-bg-elevated)}.event-name{font-size:var(--text-sm);color:var(--color-text-primary)}.empty-state{padding:var(--space-lg);text-align:center;color:var(--color-text-muted);font-size:var(--text-sm);background:0 0!important}.updater-card{padding:var(--space-md);border:1px solid var(--color-border-light);border-radius:var(--radius-md);margin-bottom:var(--space-sm);color:var(--color-text-primary);background:var(--color-bg-secondary)!important}.updater-card.disabled{opacity:.6;background:var(--color-error-10)!important}.updater-card-header{font-size:var(--text-sm);font-weight:var(--font-semibold);margin-bottom:var(--space-sm);color:var(--color-text-primary)}.updater-card-subtitle{font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-md)}.updater-warning{color:var(--color-error);margin-left:var(--space-sm);font-size:var(--text-xs);font-weight:var(--font-normal)}.event-preview-card{padding:var(--space-md);border:1px solid var(--color-border-light);border-radius:var(--radius-md);margin-bottom:var(--space-sm);color:var(--color-text-primary);background:var(--color-bg-secondary)!important}.event-preview-header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.event-preview-title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary)}.event-preview-time{font-size:var(--text-xs);color:var(--color-text-muted)}.event-preview-code{margin:0;margin-top:var(--space-sm);padding:var(--space-md);border:1px solid var(--color-border-light);border-radius:var(--radius-base);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-secondary);max-height:200px;overflow:auto;background:var(--color-bg-primary)!important}.activity-log{max-height:400px;font-size:var(--text-sm);overflow-y:auto}.log-entry{padding:var(--space-sm)var(--space-md);border-bottom:1px solid var(--color-border-light)}.log-entry:last-child{border-bottom:none}.log-entry.success{color:var(--color-success)}.log-entry.error{color:var(--color-error)}.log-entry.info{color:var(--color-text-secondary)}.log-timestamp{color:var(--color-text-muted);margin-right:var(--space-sm)}.modal-overlay{z-index:var(--z-modal);padding:var(--space-2xl);background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--glass-bg-base);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border-base);border-radius:var(--radius-lg);flex-direction:column;width:100%;max-width:800px;max-height:80vh;display:flex;box-shadow:0 20px 60px #0009}.modal-header{padding:var(--space-2xl);border-bottom:1px solid var(--color-border-light);justify-content:space-between;align-items:center;display:flex}.modal-title{font-family:var(--font-title);font-size:var(--text-2xl);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0}.modal-close{color:var(--color-text-muted);cursor:pointer;padding:var(--space-sm);transition:color var(--transition-fast);background:0 0;border:none;font-size:24px;line-height:1}.modal-close:hover{color:var(--color-text-primary)}.modal-body{padding:var(--space-2xl);flex:1;overflow-y:auto}.modal-json{background:var(--color-bg-primary);border:1px solid var(--color-border-light);border-radius:var(--radius-md);padding:var(--space-lg);font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-all;overflow:auto}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-light)}@keyframes spin{to{transform:rotate(360deg)}}.spinner{border:3px solid var(--color-bg-elevated);border-top-color:var(--color-cyan);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.loading-container,.error-container{min-height:100vh;padding:var(--space-2xl);justify-content:center;align-items:center;display:flex}.loading-content,.error-content{text-align:center}.error-content{max-width:600px;padding:var(--space-2xl);background:var(--glass-bg-base);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--color-border-light);border-radius:var(--radius-lg)}.error-content h2{margin-bottom:var(--space-md);color:var(--color-error)}.error-content p{color:var(--color-text-secondary);margin-bottom:var(--space-xl)}