:root{--bg-canvas:#0a0d0a;--bg-canvas-elevated:#0f130f;--surface-card:#161b16c7;--surface-card-solid:#161b16;--surface-subtle:#242c24a6;--surface-hover:#303a30b3;--surface-input:#101410;--surface-overlay:#121612eb;--border-subtle:#ffffff14;--border-card:#ffffff17;--border-hover:#b8f36b59;--border-focus:#b8f36b;--text-primary:#f4f6f2;--text-secondary:#9ea59d;--text-tertiary:#687067;--text-inverse:#0a0e0a;--accent-lime:#b8f36b;--accent-lime-hover:#ccffa3;--accent-lime-gradient:linear-gradient(135deg, #c4fa75 0%, #a4e84e 100%);--accent-lime-subtle:#b8f36b1f;--accent-lime-border:#b8f36b4d;--accent-lime-glow:0 0 28px #b8f36b47;--accent-blue:#70b7ff;--accent-blue-hover:#96ccff;--accent-blue-gradient:linear-gradient(135deg, #8fc4ff 0%, #54a3ff 100%);--accent-blue-subtle:#70b7ff1f;--accent-blue-border:#70b7ff4d;--semantic-amber:#fbbf24;--semantic-amber-subtle:#fbbf2424;--semantic-amber-border:#fbbf2452;--semantic-red:#f87171;--semantic-red-subtle:#f8717124;--semantic-red-border:#f8717152;--semantic-green:#34d399;--semantic-green-subtle:#34d39924;--semantic-green-border:#34d39952;--font-display:"Plus Jakarta Sans", "Inter", -apple-system, sans-serif;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, monospace;--radius-xs:5px;--radius-sm:8px;--radius-md:14px;--radius-lg:18px;--radius-xl:24px;--radius-full:9999px;--shadow-card:0 10px 30px -10px #0009, inset 0 1px 0 #ffffff0d;--shadow-glow:0 0 35px #b8f36b2e;--shadow-drawer:-12px 0 40px #000000b3;--shadow-modal:0 24px 60px #000c, 0 0 0 1px #ffffff14;--header-height:68px}*{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:#0a0d0a}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background:#ffffff24}::-webkit-scrollbar-thumb:hover{background:#b8f36b66}html,body{background-color:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-size:14px;line-height:1.55;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 50% -10%,#b8f36b12 0%,#70b7ff0a 40%,#0000 75%);width:100vw;max-width:1400px;height:600px;position:fixed;top:0;left:50%;transform:translate(-50%)}body:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 100% 100%,#70b7ff08 0%,#0000 70%);width:500px;height:500px;position:fixed;bottom:0;right:0}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.025em;font-weight:700}.app-container{z-index:1;background-color:#0000;flex-direction:column;min-height:100vh;display:flex;position:relative}.main-content{flex:1;width:100%;max-width:1340px;margin:0 auto;padding:32px 24px 90px}.header-nav{z-index:50;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-subtle);height:var(--header-height);background-color:#0a0d0ad1;transition:border-color .2s;position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;gap:20px;max-width:1320px;height:100%;margin:0 auto;padding:0 24px;display:flex}.brand-section{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:12px;text-decoration:none;transition:opacity .15s;display:flex}.brand-section:hover{opacity:.92}.brand-logo-badge{border-radius:var(--radius-sm);width:38px;height:38px;color:var(--accent-lime);font-family:var(--font-display);letter-spacing:-.5px;background:linear-gradient(135deg,#b8f36b2e 0%,#70b7ff1a 100%);border:1px solid #b8f36b66;justify-content:center;align-items:center;font-size:19px;font-weight:800;transition:all .25s;display:flex;box-shadow:0 0 20px #b8f36b33,inset 0 1px #fff3}.brand-section:hover .brand-logo-badge{transform:translateY(-1px);box-shadow:0 0 28px #b8f36b59,inset 0 1px #fff6}.brand-text-wrap h1{letter-spacing:-.4px;color:var(--text-primary);font-size:17px;font-weight:800;line-height:1.2}.brand-text-wrap p{color:var(--text-tertiary);letter-spacing:.4px;text-transform:uppercase;font-size:10.5px;font-weight:600}.nav-links{-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#101410b3;align-items:center;gap:5px;padding:5px;display:flex;box-shadow:inset 0 1px #ffffff0a}.nav-tab-btn{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;align-items:center;gap:7px;padding:7px 14px;font-size:13px;font-weight:500;transition:all .18s cubic-bezier(.16,1,.3,1);display:flex}.nav-tab-btn:hover{color:var(--text-primary);background:#ffffff0d;border-color:#ffffff0f}.nav-tab-btn.active{color:#0b0f0b;background:var(--accent-lime);background:linear-gradient(135deg,#c4fa75 0%,#a4e84e 100%);border-color:#ffffff40;font-weight:700;box-shadow:0 2px 14px #b8f36b59,inset 0 1px #ffffff59}.nav-tab-btn.active svg{color:#0b0f0b}.header-actions{align-items:center;gap:10px;display:flex}.network-badge{border:1px solid var(--border-subtle);border-radius:var(--radius-full);color:var(--text-secondary);font-size:12px;font-weight:500;font-family:var(--font-mono);background:#141914b3;align-items:center;gap:7px;padding:6px 12px;display:inline-flex;box-shadow:inset 0 1px #ffffff0a}.network-badge .pulse-dot{background:var(--semantic-green);width:7px;height:7px;box-shadow:0 0 8px var(--semantic-green);border-radius:50%;animation:2s ease-out infinite radarPulse}@keyframes radarPulse{0%{box-shadow:0 0 #34d399b3}70%{box-shadow:0 0 0 7px #34d39900}to{box-shadow:0 0 #34d39900}}.trust-strip{border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(12px);background:#0e120e99;padding:9px 24px}.trust-strip-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;max-width:1340px;margin:0 auto;font-size:12px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:600;font-family:var(--font-sans);-webkit-user-select:none;user-select:none;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:9px 18px;text-decoration:none;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;position:relative;overflow:hidden}.btn:disabled{opacity:.45;cursor:not-allowed!important;box-shadow:none!important;transform:none!important}.btn-primary{color:#0a0e0a;background:linear-gradient(135deg,#c4fa75 0%,#a4e84e 100%);border-color:#ffffff40;font-weight:700;box-shadow:0 4px 18px #b8f36b47,inset 0 1px #fff6}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#d4ffa3 0%,#b2f05d 100%);transform:translateY(-1.5px);box-shadow:0 8px 26px #b8f36b73,inset 0 1px #ffffff80}.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 10px #b8f36b40}.btn-secondary{-webkit-backdrop-filter:blur(10px);color:var(--text-primary);border-color:var(--border-card);background:#242c24b3;box-shadow:inset 0 1px #ffffff0d}.btn-secondary:hover:not(:disabled){color:#fff;background:#303a30d9;border-color:#ffffff29;transform:translateY(-1px)}.btn-outline{-webkit-backdrop-filter:blur(8px);color:var(--text-secondary);border-color:var(--border-card);background:#ffffff05}.btn-outline:hover:not(:disabled){color:var(--text-primary);background:#ffffff0f;border-color:#ffffff2e;transform:translateY(-1px)}.btn-danger-outline{color:var(--semantic-red);border-color:var(--semantic-red-border);background:0 0}.btn-danger-outline:hover:not(:disabled){background:var(--semantic-red-subtle);border-color:var(--semantic-red);transform:translateY(-1px)}.btn-sm{border-radius:var(--radius-xs);padding:6px 12px;font-size:12px}.btn-lg{border-radius:var(--radius-md);letter-spacing:-.01em;padding:14px 28px;font-size:15px}.card{background:var(--surface-card);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border-card);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:24px;transition:all .25s cubic-bezier(.16,1,.3,1);position:relative}.card:hover{border-color:#ffffff24;box-shadow:0 14px 40px -10px #000000a6,inset 0 1px #ffffff14}.card-subtle{background:var(--surface-subtle);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:18px;box-shadow:inset 0 1px #ffffff0a}.card-glow{border-color:#b8f36b47;box-shadow:0 12px 36px -10px #0009,0 0 25px #b8f36b1f,inset 0 1px #ffffff1a}.card-glow:hover{border-color:#b8f36b80;box-shadow:0 16px 45px -10px #000000b3,0 0 35px #b8f36b33,inset 0 1px #ffffff26}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:24px;display:grid}.kpi-card{background:var(--surface-card);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border-card);border-radius:var(--radius-md);box-shadow:var(--shadow-card);flex-direction:column;gap:10px;padding:20px 22px;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.kpi-card:before{content:"";background:linear-gradient(90deg,#0000,#ffffff14,#0000);height:2px;transition:all .3s;position:absolute;top:0;left:0;right:0}.kpi-card:hover{border-color:#b8f36b59;transform:translateY(-2px);box-shadow:0 16px 36px -8px #000000a6,0 0 20px #b8f36b14}.kpi-card:hover:before{background:linear-gradient(90deg, transparent, var(--accent-lime), transparent)}.kpi-header{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.3px;justify-content:space-between;align-items:center;font-size:12px;font-weight:500;display:flex}.kpi-header svg{color:var(--text-tertiary)}.kpi-value{color:var(--text-primary);letter-spacing:-.5px;font-size:26px;font-weight:700;font-family:var(--font-mono);align-items:baseline;gap:6px;display:flex}.kpi-subtext{color:var(--text-tertiary);align-items:center;gap:4px;font-size:12px;display:flex}.table-container{background:var(--surface-card);border:1px solid var(--border-card);border-radius:var(--radius-md);box-shadow:var(--shadow-card);overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}.data-table th{background:var(--surface-subtle);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--border-card);white-space:nowrap;padding:12px 16px;font-size:11.5px;font-weight:600}.data-table td{border-bottom:1px solid var(--border-subtle);color:var(--text-primary);vertical-align:middle;padding:14px 16px}.data-table tbody tr{transition:background-color .1s}.data-table tbody tr:hover{background-color:var(--surface-hover)}.data-table tbody tr:last-child td{border-bottom:none}.status-badge{border-radius:var(--radius-xs);font-size:11px;font-weight:600;font-family:var(--font-mono);letter-spacing:.3px;text-transform:uppercase;white-space:nowrap;align-items:center;gap:5px;padding:3px 8px;display:inline-flex}.status-badge.badge-locked{background:var(--accent-lime-subtle);color:var(--accent-lime);border:1px solid var(--accent-lime-border)}.status-badge.badge-paid{background:var(--accent-blue-subtle);color:var(--accent-blue);border:1px solid var(--accent-blue-border)}.status-badge.badge-claimed{background:var(--semantic-green-subtle);color:var(--semantic-green);border:1px solid var(--semantic-green-border)}.status-badge.badge-reclaimed{background:var(--semantic-amber-subtle);color:var(--semantic-amber);border:1px solid var(--semantic-amber-border)}.status-badge.badge-expired{background:var(--semantic-red-subtle);color:var(--semantic-red);border:1px solid var(--semantic-red-border)}.form-group{margin-bottom:18px}.form-label{color:var(--text-primary);justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12.5px;font-weight:600;display:flex}.form-label .hint{color:var(--text-tertiary);font-size:11px;font-weight:400}.form-input,.form-select,.form-textarea{background:var(--surface-input);border:1px solid var(--border-card);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-family:var(--font-sans);outline:none;padding:10px 14px;font-size:13.5px;transition:border-color .15s,box-shadow .15s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent-lime);box-shadow:0 0 0 2px var(--accent-lime-subtle)}.form-input::placeholder{color:var(--text-tertiary)}.font-mono{font-family:var(--font-mono)!important}.preset-pills{flex-wrap:wrap;gap:8px;display:flex}.preset-btn{border-radius:var(--radius-sm);background:var(--surface-subtle);border:1px solid var(--border-card);color:var(--text-secondary);cursor:pointer;padding:6px 12px;font-size:12px;transition:all .15s}.preset-btn:hover{background:var(--surface-hover);color:var(--text-primary)}.preset-btn.active{background:var(--accent-lime-subtle);color:var(--accent-lime);border-color:var(--accent-lime-border);font-weight:600}.alert-box{border-radius:var(--radius-sm);align-items:flex-start;gap:12px;margin-bottom:18px;padding:14px 16px;font-size:13px;line-height:1.5;display:flex}.alert-info{background:var(--accent-blue-subtle);border:1px solid var(--accent-blue-border);color:var(--text-primary)}.alert-info svg{color:var(--accent-blue);flex-shrink:0}.alert-warning{background:var(--semantic-amber-subtle);border:1px solid var(--semantic-amber-border);color:var(--text-primary)}.alert-warning svg{color:var(--semantic-amber);flex-shrink:0}.alert-error{background:var(--semantic-red-subtle);border:1px solid var(--semantic-red-border);color:var(--text-primary)}.alert-error svg{color:var(--semantic-red);flex-shrink:0}.alert-success{background:var(--accent-lime-subtle);border:1px solid var(--accent-lime-border);color:var(--text-primary)}.alert-success svg{color:var(--accent-lime);flex-shrink:0}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#080a08c7;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-content{background:var(--surface-card);border:1px solid var(--border-card);border-radius:var(--radius-lg);width:100%;max-width:620px;max-height:90vh;box-shadow:var(--shadow-modal);position:relative;overflow-y:auto}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-header h2{color:var(--text-primary);font-size:18px;font-weight:700}.modal-body{padding:24px}.drawer-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:95;background:#080a08a6;justify-content:flex-end;display:flex;position:fixed;inset:0}.drawer-panel{background:var(--surface-card);border-left:1px solid var(--border-card);width:100%;max-width:600px;height:100%;box-shadow:var(--shadow-drawer);flex-direction:column;display:flex;overflow-y:auto}.drawer-header{border-bottom:1px solid var(--border-subtle);background:var(--surface-card);z-index:10;justify-content:space-between;align-items:center;padding:20px 24px;display:flex;position:sticky;top:0}.drawer-body{flex:1;padding:24px}.payout-trace-timeline{flex-direction:column;gap:0;margin-top:12px;display:flex;position:relative}.trace-step{gap:16px;padding-bottom:28px;display:flex;position:relative}.trace-step:last-child{padding-bottom:0}.trace-step-indicator{flex-direction:column;flex-shrink:0;align-items:center;width:28px;display:flex}.trace-node{border:2px solid var(--border-card);background:var(--surface-subtle);width:24px;height:24px;color:var(--text-tertiary);z-index:2;border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.trace-node.completed{background:var(--semantic-green-subtle);border-color:var(--semantic-green);color:var(--semantic-green)}.trace-node.active{background:var(--accent-lime-subtle);border-color:var(--accent-lime);color:var(--accent-lime);box-shadow:0 0 10px #b8f36b66}.trace-node.waiting{background:var(--surface-subtle);border-color:var(--border-card);color:var(--text-tertiary)}.trace-node.failed{background:var(--semantic-red-subtle);border-color:var(--semantic-red);color:var(--semantic-red)}.trace-line{background:var(--border-subtle);flex:1;width:2px;margin-top:4px;margin-bottom:4px}.trace-line.completed{background:var(--semantic-green);opacity:.4}.trace-step-content{background:var(--surface-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);flex:1;padding:14px 16px;transition:border-color .15s}.trace-step-content:hover{border-color:var(--border-card)}.trace-step-content.active-step{border-color:var(--accent-lime-border);background:#b8f36b08}.trace-header{justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;display:flex}.trace-title{color:var(--text-primary);font-size:13.5px;font-weight:600}.trace-time{color:var(--text-tertiary);font-size:11px;font-family:var(--font-mono)}.trace-desc{color:var(--text-secondary);margin-bottom:8px;font-size:12.5px;line-height:1.45}.trace-evidence{background:var(--surface-input);border:1px solid var(--border-subtle);border-radius:var(--radius-xs);font-size:11.5px;font-family:var(--font-mono);color:var(--accent-blue);word-break:break-all;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;display:flex}.trace-evidence a{color:var(--accent-blue);align-items:center;gap:4px;text-decoration:none;display:inline-flex}.trace-evidence a:hover{text-decoration:underline}.empty-state{text-align:center;color:var(--text-secondary);padding:48px 24px}.empty-state-icon{border-radius:var(--radius-md);background:var(--surface-subtle);border:1px solid var(--border-card);width:48px;height:48px;color:var(--text-tertiary);justify-content:center;align-items:center;margin:0 auto 16px;display:flex}.empty-state h3{color:var(--text-primary);margin-bottom:6px;font-size:16px;font-weight:600}.empty-state p{color:var(--text-secondary);max-width:440px;margin:0 auto 20px;font-size:13px}@media (width<=900px){.header-inner{padding:0 16px}.main-content{padding:20px 16px 60px}.nav-links{max-width:100%;overflow-x:auto}.kpi-grid{grid-template-columns:repeat(2,1fr)}.overview-main-grid,.trace-main-grid{grid-template-columns:1fr!important}}@media (width<=640px){.header-inner{flex-wrap:wrap;gap:12px;height:auto;padding:12px 16px}.brand-text-wrap p{display:none}.kpi-grid{grid-template-columns:1fr}.drawer-panel{max-width:100%}}.gradient-text-hero{background:linear-gradient(#fff 0%,#e3e9e0 55%,#9eaea0 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.gradient-text-lime{background:linear-gradient(135deg,#ccffa3 0%,#9de83f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.gradient-text-blue{background:linear-gradient(135deg,#bde0ff 0%,#5ea9ff 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.glass-pill{border-radius:var(--radius-full);-webkit-backdrop-filter:blur(16px);color:var(--text-secondary);background:#161b16b3;border:1px solid #ffffff14;align-items:center;gap:8px;padding:6px 16px;font-size:12.5px;font-weight:600;display:inline-flex;box-shadow:0 4px 16px #0000004d,inset 0 1px #ffffff0f}.stat-counter-box{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-md);background:#141914a6;border:1px solid #ffffff12;flex-direction:column;gap:6px;padding:18px 22px;transition:all .25s;display:flex;position:relative;overflow:hidden}.stat-counter-box:before{content:"";background:linear-gradient(90deg,#0000,#b8f36b33,#0000);height:2px;position:absolute;top:0;left:0;right:0}.stat-counter-box:hover{border-color:#b8f36b4d;transform:translateY(-2px);box-shadow:0 12px 28px -8px #0009}.feature-grid-item{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-lg);background:#161b1699;border:1px solid #ffffff12;flex-direction:column;gap:14px;padding:28px;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative}.feature-grid-item:hover{border-color:#b8f36b59;transform:translateY(-3px);box-shadow:0 20px 45px -12px #000000b3,0 0 25px #b8f36b14}.feature-icon-wrap{border-radius:var(--radius-md);width:44px;height:44px;color:var(--accent-lime);background:linear-gradient(135deg,#b8f36b26 0%,#70b7ff14 100%);border:1px solid #b8f36b4d;justify-content:center;align-items:center;display:flex;box-shadow:0 0 16px #b8f36b26}.interactive-demo-card{-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);background:#121712d9;border:1px solid #ffffff1a;padding:36px;box-shadow:0 24px 60px -15px #000000bf,0 0 0 1px #ffffff0a,inset 0 1px #ffffff14}.step-indicator-pill{width:28px;height:28px;font-size:13px;font-weight:700;font-family:var(--font-mono);border-radius:50%;justify-content:center;align-items:center;transition:all .25s;display:flex}.step-indicator-pill.active{background:var(--accent-lime);color:#0a0e0a;box-shadow:0 0 14px #b8f36b80}.step-indicator-pill.completed{color:var(--semantic-green);background:#34d39933;border:1px solid #34d39966}.step-indicator-pill.inactive{color:var(--text-tertiary);background:#ffffff0d;border:1px solid #ffffff14}
