
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#0a0a0f;--surface:#111118;--card:#0d0d14;--border:#1a1a2e;--border2:#252540;--text:#e0e0e0;--dim:#666;--dim2:#888;--accent:#00ff88;--accent2:#00cc6a;--red:#ff3355;--blue:#00aaff;--purple:#aa55ff;--yellow:#ffaa00;--gradient1:linear-gradient(135deg,#00ff88,#00aaff);--gradient2:linear-gradient(135deg,#aa55ff,#00aaff)}
[data-theme="light"]{--bg:#f5f5f8;--surface:#ffffff;--card:#ffffff;--border:#e0e0e8;--border2:#d0d0d8;--text:#1a1a2e;--dim:#888;--dim2:#999;--accent:#00994d;--accent2:#008844;--red:#cc2244;--blue:#0077cc;--purple:#7733cc;--yellow:#cc8800;--gradient1:linear-gradient(135deg,#00994d,#0077cc);--gradient2:linear-gradient(135deg,#7733cc,#0077cc)}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Inter','Segoe UI',sans-serif;overflow-x:hidden;line-height:1.6}
/* Modern scrollbar */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:rgba(10,10,15,.6)}
::-webkit-scrollbar-thumb{background:rgba(0,255,136,.15);border-radius:4px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(0,255,136,.3);border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}
*{scrollbar-width:thin;scrollbar-color:rgba(0,255,136,.15) rgba(10,10,15,.6)}
.mono{font-family:'SF Mono','Fira Code','Consolas',monospace}
/* Background effects */
.bg-grid{position:fixed;inset:0;z-index:0;background-image:linear-gradient(rgba(0,255,136,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,136,.02) 1px,transparent 1px);background-size:60px 60px;pointer-events:none}
.bg-orb{position:fixed;border-radius:50%;filter:blur(80px);z-index:0;pointer-events:none;animation:orbFloat 20s ease-in-out infinite alternate}
.bg-orb.o1{width:600px;height:600px;background:rgba(0,255,136,.04);top:-200px;right:-200px}
.bg-orb.o2{width:500px;height:500px;background:rgba(170,85,255,.035);bottom:-200px;left:-150px;animation-delay:-7s}
.bg-orb.o3{width:400px;height:400px;background:rgba(0,170,255,.03);top:40%;left:30%;animation-delay:-13s}
@keyframes orbFloat{0%{transform:translate(0,0)}50%{transform:translate(30px,-20px)}100%{transform:translate(-20px,30px)}}
/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:10px 32px;display:flex;align-items:center;justify-content:space-between;background:rgba(10,10,15,.8);backdrop-filter:blur(20px);border-bottom:1px solid rgba(26,26,46,.5);transition:all .3s}
.nav.scrolled{padding:8px 32px;box-shadow:0 4px 30px rgba(0,0,0,.4)}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-logo{width:46px;height:46px;border-radius:14px;background:transparent;display:flex;align-items:center;justify-content:center;animation:tlLogoBob 3.6s ease-in-out infinite}
.nav-logo svg{display:block;filter:drop-shadow(0 4px 14px rgba(0,255,121,.45))}
.nav-logo svg .pip{transform-origin:center;animation:tlPipDance 2.4s ease-in-out infinite}
.nav-logo svg .pip-1{animation-delay:0s}
.nav-logo svg .pip-2{animation-delay:.12s}
.nav-logo svg .pip-3{animation-delay:.24s}
.nav-logo svg .pip-4{animation-delay:.36s}
.nav-logo svg .pip-5{animation-delay:.48s}
@keyframes tlLogoBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes tlPipDance{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
.nav-name{font-size:15px;font-weight:700;letter-spacing:2px;color:var(--accent);font-family:'SF Mono','Fira Code',monospace}
.nav-links{display:flex;align-items:center;gap:24px}
.nav-link{color:var(--dim2);font-size:13px;text-decoration:none;transition:color .2s;cursor:pointer}
.nav-link:hover{color:var(--text)}
.nav-dd{position:relative;display:flex;align-items:center}
.nav-ch{width:12px;height:12px;margin-left:3px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.nav-dd:hover .nav-ch,.nav-dd:focus-within .nav-ch{transform:rotate(180deg)}
.nav-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);min-width:280px;padding:8px;background:rgba(17,17,24,.98);border:1px solid var(--border2);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .15s,transform .15s,visibility 0s .15s;z-index:200}
.nav-dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px}
.nav-dd:hover .nav-menu,.nav-dd:focus-within .nav-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition-delay:0s}
.nav-menu a{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;min-height:44px}
.nav-menu a b{display:block;color:var(--text);font-size:13px;font-weight:600}
.nav-menu a span{display:block;color:var(--dim2);font-size:12px;line-height:1.45;margin-top:1px}
.nav-menu a:hover,.nav-menu a:focus-visible{background:rgba(0,255,136,.07)}
.nav-menu a:hover b{color:var(--accent)}
.nav-cta{background:var(--accent);color:#000;padding:8px 20px;border-radius:6px;font-size:12px;font-weight:700;text-decoration:none;letter-spacing:.5px;transition:all .2s;cursor:pointer;border:none;font-family:inherit}
.nav-cta:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,255,136,.3)}
/* Hero */
.hero{position:relative;z-index:1;min-height:calc(100vh - 140px);display:flex;align-items:center;justify-content:center;padding:108px 32px 28px;box-sizing:border-box}
.hero-inner{max-width:1100px;width:100%;display:flex;align-items:center;gap:60px}
.hero-text{flex:1;min-width:0}
@keyframes pulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
.hero h1{font-size:clamp(32px,5vw,56px);font-weight:800;line-height:1.1;margin-bottom:16px;background:linear-gradient(135deg,#fff 0%,#00ff88 50%,#00aaff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-sub{font-size:18px;color:var(--dim2);line-height:1.7;margin-bottom:32px;max-width:520px}
.hero-sub strong{color:var(--text);font-weight:600}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px}
.btn-primary{background:var(--accent);color:#000;padding:14px 32px;border-radius:8px;font-size:14px;font-weight:700;letter-spacing:.5px;border:none;cursor:pointer;transition:all .2s;font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,255,136,.3)}
.btn-secondary{background:rgba(255,255,255,.05);color:var(--text);padding:14px 28px;border:1px solid var(--border2);border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn-secondary:hover{background:rgba(255,255,255,.08);border-color:var(--accent);transform:translateY(-2px)}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap}
.hero-stats[hidden]{display:none}
.hero-stat{text-align:left}
.hero-stat .num{font-size:24px;font-weight:800;font-family:'SF Mono','Fira Code',monospace;color:var(--accent)}
.hero-stat .lbl{font-size:11px;color:var(--dim);margin-top:2px;letter-spacing:.5px}
/* Hero preview mockup */
.hero-visual{flex:1;min-width:320px;max-width:480px;position:relative}
.preview-card{background:rgba(17,17,24,.9);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.6);overflow:hidden;position:relative}
.preview-card::before{content:'';position:absolute;inset:-1px;border-radius:16px;background:linear-gradient(135deg,rgba(0,255,136,.1),transparent 40%,transparent 60%,rgba(170,85,255,.08));z-index:0;pointer-events:none}
.preview-card>*{position:relative;z-index:1}
.preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.preview-title{font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--accent);font-family:'SF Mono',monospace}
.preview-live{font-size:10px;color:var(--dim);display:flex;align-items:center;gap:4px}
.preview-live .dot{width:5px;height:5px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite}
.preview-pred{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.preview-coin{background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:8px;padding:10px;text-align:center}
.preview-coin .name{font-size:9px;color:var(--dim);letter-spacing:1px;font-weight:700}
.preview-coin .dir{font-size:16px;font-weight:800;margin:4px 0 2px}
.preview-coin .dir.up{color:var(--accent)}
.preview-coin .dir.down{color:var(--red)}
.preview-coin .conf{font-size:9px;color:var(--dim2)}
.preview-signals{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:12px}
.preview-sig{background:rgba(0,255,136,.06);border:1px solid rgba(0,255,136,.15);border-radius:4px;padding:2px 8px;font-size:8px;color:var(--accent);font-weight:600;letter-spacing:.5px}
.preview-sig.bear{background:rgba(255,51,85,.06);border-color:rgba(255,51,85,.15);color:var(--red)}
.preview-chart{height:80px;background:linear-gradient(180deg,rgba(0,255,136,.05),transparent);border-radius:6px;position:relative;overflow:hidden}
.preview-chart svg{width:100%;height:100%}
.chart-line{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;opacity:.7}
.chart-area{fill:url(#chartGrad);opacity:.3}
/* Floating numbers animation */
.float-num{position:absolute;font-family:'SF Mono',monospace;font-size:10px;font-weight:700;opacity:0;animation:floatUp 3s ease-out infinite;pointer-events:none}
@keyframes floatUp{0%{opacity:0;transform:translateY(10px)}10%{opacity:.7}90%{opacity:.7}100%{opacity:0;transform:translateY(-40px)}}
/* the try-it card inside the hero */
.hero-try{max-width:520px;min-width:0}
.hero-try .tl-demo-card{padding:22px 20px 18px}
.hero-try .tl-demo-eyebrow{margin-bottom:10px;font-size:10px}
.hero-try .tl-demo-card h2{font-size:22px;margin-bottom:6px}
.hero-try .tl-demo-sub{font-size:13px;margin-bottom:14px;max-width:none}
.hero-try .tl-demo-analyze{grid-template-columns:1fr 1fr;gap:8px}
.hero-try .tl-demo-analyze button{grid-column:1/-1;align-self:auto}
.hero-try .tl-demo-suggest{margin-top:10px}
.hero-try .tl-demo-chip{padding:6px 11px;font-size:11px}
.hero-try .tl-demo-meta{margin-top:12px}
@media(max-width:768px){.hero-try{max-width:100%}}
/* Sections */
.section{position:relative;z-index:1;padding:52px 32px;max-width:1100px;margin:0 auto;text-align:center}
.section>.feature-grid,.section>.pricing-grid,.section>.social-proof,.section>.asset-grid,.section>.asset-grid-bottom,.section>.acc-showcase,.section>.tl-paper-board{text-align:left;margin-left:auto;margin-right:auto}
.section-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(0,255,136,.06);border:1px solid rgba(0,255,136,.15);border-radius:20px;padding:4px 14px;font-size:10px;color:var(--accent);font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:16px}
.section-title{font-size:clamp(24px,3.5vw,40px);font-weight:800;margin-bottom:12px;line-height:1.2}
.section-desc{font-size:15px;color:var(--dim2);max-width:620px;line-height:1.7;margin:0 auto 40px}
/* Pricing */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:960px;margin:0 auto}
.price-card{background:rgba(17,17,24,.85);border:1px solid var(--border);border-radius:14px;padding:32px 24px;display:flex;flex-direction:column;transition:all .3s;position:relative;overflow:hidden}
.price-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.3)}
.price-card.featured{border-color:rgba(0,255,136,.3);box-shadow:0 0 40px rgba(0,255,136,.06)}
.price-card.featured::before{content:'MOST POPULAR';position:absolute;top:0;left:0;right:0;background:var(--accent);color:#000;font-size:9px;font-weight:800;letter-spacing:2px;text-align:center;padding:6px;text-transform:uppercase}
.price-card.featured{padding-top:48px}
.price-tier{font-size:14px;font-weight:800;letter-spacing:2px;text-transform:uppercase;margin-bottom:4px}
.price-amount{font-size:44px;font-weight:800;margin-bottom:2px;font-family:'SF Mono',monospace}
.price-amount span{font-size:16px;color:var(--dim);font-weight:400}
.price-desc{font-size:12px;color:var(--dim);margin-bottom:24px;line-height:1.5}
.price-features{list-style:none;flex:1;margin-bottom:24px}
.price-features li{font-size:12px;padding:6px 0;display:flex;align-items:flex-start;gap:8px;color:var(--text);line-height:1.4}
.price-features li .check{color:var(--accent);font-weight:700;flex-shrink:0;font-size:13px;margin-top:1px}
.price-features li.dim{color:var(--dim)}
.price-features li.dim .check{color:var(--dim)}
.price-btn{width:100%;padding:14px;border-radius:8px;font-size:13px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:all .2s;border:none;font-family:inherit;text-transform:uppercase}
.price-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}
.price-btn.free-btn{background:rgba(255,255,255,.06);border:1px solid var(--border2);color:var(--text)}
.price-btn.pro-btn{background:var(--accent);color:#000}
.price-btn.elite-btn{background:rgba(255,255,255,.06);border:1px solid var(--border2);color:var(--text)}
.auth-reason{margin:-4px 0 14px;padding:10px 12px;border:1px solid rgba(0,255,136,.25);background:rgba(0,255,136,.06);border-radius:8px;color:var(--text);font-size:13px;text-align:center}
/* Auth modal */
.modal-overlay{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);align-items:center;justify-content:center}
.modal-overlay.active{display:flex}
.auth-modal{width:420px;max-width:92vw;max-height:90vh;overflow-y:auto;background:rgba(17,17,24,.95);border:1px solid var(--border);border-radius:16px;padding:36px 28px;position:relative;box-shadow:0 20px 80px rgba(0,0,0,.6)}
.auth-modal::before{content:'';position:absolute;inset:-1px;border-radius:16px;background:linear-gradient(135deg,rgba(0,255,136,.12),transparent 40%,transparent 60%,rgba(170,85,255,.08));z-index:-1;pointer-events:none}
.pw-wrap{position:relative;display:block}
.pw-wrap .form-input{padding-right:66px}
.pw-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:var(--dim2);font-size:10px;font-weight:700;letter-spacing:1px;cursor:pointer;font-family:inherit;padding:5px 7px;border-radius:4px;line-height:1;transition:color .15s,background .15s}
.pw-toggle:hover{color:var(--accent);background:rgba(255,255,255,.05)}
.pw-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.auth-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.tl-check{display:inline-flex;align-items:center;gap:9px;cursor:pointer;user-select:none}
.tl-check input{position:absolute;opacity:0;width:0;height:0}
.tl-box{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--border);background:rgba(255,255,255,.03);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background .16s,border-color .16s,box-shadow .16s}
.tl-box svg{width:11px;height:9px;fill:none;stroke:#04120b;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;transition:stroke-dashoffset .18s ease}
.tl-check input:checked + .tl-box{background:linear-gradient(135deg,#00ff88,#00d4ff);border-color:transparent}
.tl-check input:checked + .tl-box svg{stroke-dashoffset:0}
.tl-check input:focus-visible + .tl-box{box-shadow:0 0 0 3px rgba(0,255,136,.28)}
.tl-check:hover .tl-box{border-color:var(--accent)}
.tl-check-label{font-size:12px;color:var(--dim2);transition:color .15s}
.tl-check:hover .tl-check-label{color:#e8e8ef}
.auth-link{background:transparent;border:none;color:var(--dim2);font-size:12px;cursor:pointer;font-family:inherit;padding:2px 0;transition:color .15s}
.auth-link:hover:not(:disabled){color:var(--accent);text-decoration:underline}
.auth-link:disabled{opacity:.6;cursor:default}
.modal-close{position:absolute;top:16px;right:16px;background:none;border:none;color:var(--dim);font-size:20px;cursor:pointer;transition:color .2s;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:6px}
.modal-close:hover{color:var(--text);background:rgba(255,255,255,.05)}
.modal-logo{text-align:center;margin-bottom:24px}
.modal-logo .icon{width:40px;height:40px;border-radius:10px;background:var(--gradient1);display:inline-flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:8px;box-shadow:0 4px 16px rgba(0,255,136,.15)}
.modal-logo .name{font-size:16px;font-weight:700;letter-spacing:2px;color:var(--accent);font-family:'SF Mono',monospace}
.auth-tabs{display:flex;gap:0;margin-bottom:20px;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.auth-tab{flex:1;padding:10px;background:transparent;border:none;color:var(--dim);font-family:inherit;font-size:11px;font-weight:700;letter-spacing:1px;cursor:pointer;transition:all .2s;text-transform:uppercase}
.auth-tab.active{background:rgba(0,255,136,.07);color:var(--accent)}
.auth-tab:hover:not(.active){background:rgba(255,255,255,.02)}
.form-group{margin-bottom:14px}
.form-label{display:block;font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:5px;font-weight:600}
.form-input{width:100%;padding:11px 14px;background:rgba(0,0,0,.4);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:13px;transition:all .2s;outline:none}
.form-input:focus{border-color:rgba(0,255,136,.4);box-shadow:0 0 0 3px rgba(0,255,136,.06)}
.form-input::placeholder{color:#555}
.pw-strength{height:3px;border-radius:2px;background:rgba(255,255,255,.05);margin-top:6px;overflow:hidden}
.pw-strength .fill{height:100%;border-radius:2px;transition:all .3s}
.captcha-wrap{display:flex;justify-content:center;margin:14px 0}
.rps-btn{background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:10px;padding:12px 16px;cursor:pointer;transition:all .2s;text-align:center;color:var(--text);min-width:72px}
.rps-btn:hover{border-color:rgba(0,255,136,.3);background:rgba(0,255,136,.06);transform:translateY(-2px)}
.rps-btn.selected{border-color:var(--accent);background:rgba(0,255,136,.1);box-shadow:0 0 16px rgba(0,255,136,.15)}
.rps-btn.wrong{border-color:var(--red);background:rgba(255,51,85,.1)}
.submit-btn{width:100%;padding:13px;background:var(--gradient1);border:none;border-radius:8px;color:#000;font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:all .2s;text-transform:uppercase}
.submit-btn:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,255,136,.25)}
.submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.auth-error{color:var(--red);font-size:11px;text-align:center;margin-top:10px;min-height:14px;opacity:0;transition:opacity .3s}
.auth-error.visible{opacity:1}
.auth-success{color:var(--accent);font-size:11px;text-align:center;margin-top:10px;min-height:14px;opacity:0;transition:opacity .3s}
.auth-success.visible{opacity:1}
.auth-footer{text-align:center;margin-top:14px;font-size:11px;color:var(--dim)}
.auth-footer a{color:var(--accent);text-decoration:none;cursor:pointer}
.auth-footer a:hover{text-decoration:underline}
.terms{font-size:10px;color:var(--dim);text-align:center;margin-top:12px;line-height:1.5}
.terms a{color:var(--dim2);text-decoration:underline}
/* Community card + outline button */
.dc-card{display:flex;align-items:center;gap:20px;max-width:760px;margin:0 auto;padding:22px 24px;background:rgba(17,17,24,.85);border:1px solid var(--border);border-radius:14px;text-align:left}
.dc-icon{flex:0 0 44px;width:44px;height:44px;border-radius:10px;border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;color:var(--dim2)}
.dc-icon svg{width:22px;height:22px;fill:currentColor}
.dc-body{flex:1;min-width:0}
.dc-title{font-size:17px;font-weight:700;margin:0 0 4px}
.dc-desc{font-size:14px;color:var(--dim2);margin:0;line-height:1.6}
.dc-count{font-size:12px;color:var(--dim);margin:6px 0 0;font-family:'SF Mono','Fira Code',monospace}
.btn-outline{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border:1px solid var(--border2);border-radius:8px;color:var(--text);font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;transition:border-color .2s,color .2s}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}
.btn-outline:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:640px){.dc-card{flex-direction:column;text-align:center;align-items:center}.btn-outline{width:100%}}
/* Tap targets: every control at least 44px on the cross axis */
.nav-link,.nav-cta{min-height:44px;min-width:44px;justify-content:center;display:inline-flex;align-items:center}
.btn-primary,.btn-secondary,.price-btn,.try-tab,.auth-tab,.submit-btn{min-height:44px}
.footer-links a{min-height:44px;min-width:44px;justify-content:center;display:inline-flex;align-items:center;padding:0 4px}
.auth-link,#emailLinkBtn,#forgotLink,.rps-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:1024px){.bg-orb{display:none}}
@media(max-width:768px){
  .hero-visual{max-width:340px;margin:0 auto}
  .tl-compare{padding:40px 14px;text-align:center}
  .tl-compare-wrap{margin-left:0;margin-right:0;border-radius:14px;transform:none !important}
  .tl-demo{padding:36px 14px 28px}
  .tl-demo-card{padding:22px 18px;border-radius:16px}
  .tl-demo-card h2{font-size:20px;text-align:center}
  .tl-demo-sub{font-size:13px;text-align:center}
  .tl-demo-input{flex-direction:column;gap:8px}
  .tl-demo-input input,.tl-demo-input button{width:100%}
  .tl-demo-suggest{justify-content:center}
  .tl-demo-meta{flex-direction:column;gap:6px;align-items:center;text-align:center}
  .tl-marquee-label{font-size:10px;letter-spacing:2.5px}
  .tl-marquee-label::before,.tl-marquee-label::after{flex-basis:32px}
  .hero-visual{max-width:300px}
  .preview-card{padding:14px}
  .tl-compare-table th,.tl-compare-table td{padding:11px 10px;font-size:11.5px}
  .tl-compare-table .ck,.tl-compare-table .ex{width:18px;height:18px;font-size:11px;margin-right:6px}
  body .hero-visual{margin:0 auto !important;max-width:92% !important}
  body .tl-marquee-section{padding-left:0 !important;padding-right:0 !important}
  body .tl-marquee{mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent) !important;-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent) !important}
  body .tl-marquee-track{gap:28px !important;animation-duration:22s !important}
  body .tl-marquee-item{font-size:14px !important;height:30px !important;padding:0 4px !important;letter-spacing:.5px !important}
  body .tl-marquee-item svg{height:22px !important}
  body .tl-marquee-label{font-size:11px !important;letter-spacing:2px !important;margin-bottom:10px !important;padding:0 12px !important}
  body .tl-compare-table th,body .tl-compare-table td{padding:11px 10px !important;font-size:12px !important}
  body .tl-compare-table .ck,body .tl-compare-table .ex{width:18px !important;height:18px !important;font-size:11px !important;margin-right:6px !important}
  body .tl-demo-card{padding:22px 18px !important}
  body .tl-demo-input{flex-direction:column !important;gap:8px !important}
  body .tl-demo-input input,body .tl-demo-input button{width:100% !important}
  body .tl-demo-suggest{justify-content:center !important;flex-wrap:wrap !important}
  body .float-num{display:none !important}
  .tl-demo{padding:50px 16px 30px}
  .tl-demo-card{padding:28px 20px;border-radius:16px}
  .tl-demo-input{flex-direction:column;gap:8px;background:transparent;border:none;padding:0}
  .tl-demo-input input{background:rgba(10,10,15,.7);border:1px solid var(--border2);border-radius:10px;padding:14px;width:100%}
  .tl-demo-input button{width:100%;justify-content:center;padding:14px}
  .tl-demo-meta{flex-direction:column;align-items:flex-start;gap:6px}
  .tl-marquee-track{gap:40px;animation-duration:28s}
  .tl-marquee-item{font-size:18px;height:36px}
  .tl-marquee-track{animation:none}
  .tl-marquee-section,.tl-demo,.tl-how,.tl-compare,.tl-devices,.tl-stack,.tl-faq,.section,.xray-section{padding-left:max(16px,env(safe-area-inset-left,0)) !important;padding-right:max(16px,env(safe-area-inset-right,0)) !important}
}
@media(max-width:820px){
  .xray-inner{grid-template-columns:1fr;gap:30px}
  .xray-scene{height:440px;order:2}
  .xray-copy{order:1}
  .xray-stack{transform:rotateX(-14deg) rotateY(-14deg) scale(.88)}
  .xray-stack.exploded{transform:rotateX(-22deg) rotateY(-18deg) scale(.88)}
  .xray-layer{width:300px;margin-left:-150px}
  .xray-stack,.xray-stack.exploded,.xray-layer{transition:none}
}
/* Footer */
.footer{position:relative;z-index:1;border-top:1px solid var(--border);padding:40px 32px;text-align:center}
.tl-socials{display:flex;justify-content:center;gap:4px;margin:14px 0 12px}
.tl-social{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;color:#888;text-decoration:none;transition:color .2s,background .2s}
.tl-social svg{width:20px;height:20px;fill:currentColor;display:block}
.tl-social:hover{color:#e0e0e0;background:rgba(255,255,255,.05)}
.tl-social:focus-visible{outline:2px solid #00ff88;outline-offset:2px;color:#e0e0e0}

.footer-links{display:flex;justify-content:center;gap:24px;margin-bottom:12px;flex-wrap:wrap}
.footer-links a{color:var(--dim2);font-size:12px;text-decoration:none;transition:color .2s}
.footer-links a:hover{color:var(--accent)}
.footer-copy{font-size:11px;color:var(--dim2)}
/* Responsive */
@media(max-width:1024px){
}
@media(max-width:768px){
  .hero-inner{flex-direction:column;text-align:center;gap:28px}
  .hero-text{width:100%}
  .hero-text>*{margin-left:auto;margin-right:auto}
  .hero-stats{justify-content:center}
  .hero-sub{margin-left:auto;margin-right:auto;max-width:90%}
  .hero-actions{justify-content:center;flex-direction:column;align-items:stretch;width:100%;max-width:340px;margin-left:auto;margin-right:auto}
  .hero-actions>*{justify-content:center;text-align:center}
  .hero-stats{justify-content:center;width:100%}
  .bg-orb{display:none}
  .hero{padding:92px 16px 24px;min-height:auto}
  .section{padding:42px 18px;text-align:center}
  .hero-visual{max-width:340px;margin:0 auto}
  .pricing-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}
  .nav-links .nav-link{display:none}
  .auth-modal{padding:24px 18px;max-width:94vw}
  .rps-btn{min-width:60px;padding:10px 12px}
  .hero h1{font-size:30px;text-align:center}
  .hero-sub{font-size:15px;text-align:center}
  .tl-devices{padding:48px 16px 60px}
  .tl-devices-wrap{flex-direction:column;align-items:center;gap:24px}
  .nav-logo{width:46px;height:46px}
  .nav-logo svg{width:38px;height:38px}
  .nav-name{font-size:13px;letter-spacing:1.5px}
  .section-badge{margin-left:auto;margin-right:auto}
  .section-title{font-size:24px;text-align:center;line-height:1.25}
  .section-desc{font-size:13.5px;max-width:92%;margin-left:auto;margin-right:auto;line-height:1.65}
  .btn-primary,.btn-secondary{width:100%;justify-content:center}
  .price-card{text-align:center;align-items:center}
  .price-features{text-align:left;width:fit-content;margin:0 auto 24px}
  .price-features li{justify-content:flex-start}
  .footer{padding:24px 16px;text-align:center}
  .footer-links{gap:14px;justify-content:center;flex-wrap:wrap}
  /* New 3D sections, mobile polish */
  .tl-live{padding:44px 16px 54px;text-align:center}
  .tl-live-grid{grid-template-columns:1fr;gap:14px;margin-top:28px;perspective:none}
  .tl-live-card{transform:none !important;text-align:center;padding:22px 18px}
  .tl-live-icon{margin-left:auto;margin-right:auto}
  .tl-live-stat{justify-content:center}
  .tl-stack{padding:36px 14px 48px;text-align:center}
  .tl-stack-wrap{transform:none !important;margin-top:24px}
  .tl-stack-layer{flex-direction:column;align-items:stretch;gap:10px;padding:16px 18px;text-align:center}
  .tl-stack-tier{border-right:none;border-bottom:1px solid rgba(255,255,255,.08);padding-right:0;padding-bottom:8px;width:100%;min-width:0;text-align:center}
  .tl-stack-items{justify-content:center}
  .tl-faq{padding:36px 14px 44px;text-align:center}
  .tl-faq-list{transform:none !important;margin-top:22px;gap:8px}
  .tl-faq-item{padding:14px 18px}
  .tl-faq-item summary{font-size:13.5px}
  .tl-faq-item p{font-size:13px}
  .tl-contact{padding:36px 14px 56px;text-align:center}
  .tl-contact-wrap{transform:none !important;margin-top:22px}
  .tl-contact-card{padding:24px 20px 22px}
  .tl-contact-row{grid-template-columns:1fr;gap:12px}
  .tl-contact-foot{flex-direction:column;align-items:stretch;gap:14px}
  .tl-contact-foot .cta-big{text-align:center}
  .tl-contact-direct{align-items:center;text-align:center}
  /* Leaderboard panel mobile */
  .tl-paper-board{padding:0 12px !important;margin-bottom:32px !important;transform:none !important}
  .tl-paper-board table{font-size:11px}
  .tl-paper-board th,.tl-paper-board td{padding:8px 8px !important}
  /* Demo / AI input */
  /* Marquee label */
}
@media(max-width:480px){
  .hero{padding:86px 14px 28px}
  .section{padding:36px 14px;text-align:center}
  .nav{padding:10px 12px}
  .nav-name{font-size:11px;letter-spacing:1px}
  .nav-logo{width:38px;height:38px}
  .nav-logo svg{width:32px;height:32px}
  .hero-stats{gap:16px;flex-wrap:wrap;justify-content:center}
  .hero-stat .num{font-size:20px}
  .hero-stat .lbl{font-size:9px}
  .price-amount{font-size:28px}
  .price-card{padding:20px 16px}
  .hero-sub{font-size:14px;line-height:1.6}
  .hero h1{font-size:24px;line-height:1.15}
  .hero-inner{gap:28px}
  .hero-visual{max-width:300px}
  .section-badge{font-size:9px;padding:3px 10px}
  .section-title{font-size:21px;line-height:1.25}
  .section-desc{font-size:12.5px;line-height:1.6}
  .auth-modal{padding:20px 14px;max-width:96vw}
  .auth-modal .modal-logo .name{font-size:14px}
  /* New sections fine-tuning */
  .tl-live-stat{font-size:30px}
  .tl-live-suffix{font-size:18px}
  .tl-live-card{padding:20px 16px}
  .tl-stack-layer{padding:14px 16px;border-radius:12px}
  .tl-stack-tier{font-size:9.5px;letter-spacing:1.5px}
  .tl-stack-items span{font-size:11px;padding:4px 9px}
  .tl-faq-item{padding:13px 16px;border-radius:10px}
  .tl-faq-item summary{font-size:13px;gap:10px}
  .tl-faq-item p{font-size:12.5px;line-height:1.65}
  .tl-contact-card{padding:20px 16px;border-radius:16px}
  .tl-contact-card input,.tl-contact-card select,.tl-contact-card textarea{padding:11px 12px;font-size:13.5px;border-radius:9px}
  .tl-contact-card label{font-size:10.5px;letter-spacing:1px}
}
@media(max-width:360px){
  .hero{padding:76px 10px 22px}
  .hero h1{font-size:20px}
  .hero-sub{font-size:13px}
  .hero-stats{gap:10px;flex-wrap:wrap}
  .hero-stat .num{font-size:18px}
  .nav{padding:8px 10px}
  .nav-name{font-size:10px;letter-spacing:.8px}
  .nav-logo{width:32px;height:32px}
  .nav-logo svg{width:28px;height:28px}
  .btn-primary,.btn-secondary{padding:11px 18px;font-size:13px}
  .section{padding:28px 10px}
  .section-title{font-size:19px}
  .section-desc{font-size:12px}
  .auth-modal{padding:16px 12px}
  .tl-contact-card{padding:18px 14px}
  .tl-live-card{padding:18px 14px}
  .tl-live-stat{font-size:26px}
  .tl-stack-tier{font-size:9px}
  .tl-stack-items span{font-size:10.5px;padding:3px 8px}
}

/* ═══ MOBILE FINALIZER, high-specificity overrides for perfect centering ═══ */
@media(max-width:820px){
  /* Force-center every section heading regardless of inner overrides */
  body .section,body .tl-how,body .tl-compare,body .tl-devices,body .tl-live,body .tl-stack,body .tl-faq,body .tl-contact,body .tl-demo{text-align:center !important;padding-left:18px !important;padding-right:18px !important}
  body .section>.section-badge,body .tl-how>.section-badge,body .tl-compare>.section-badge,body .tl-devices>.section-badge,body .tl-live>.section-badge,body .tl-stack>.section-badge,body .tl-faq>.section-badge,body .tl-contact>.section-badge,body .tl-demo>.section-badge{margin-left:auto !important;margin-right:auto !important;display:inline-flex !important}
  body .section>.section-title,body .section>.section-desc,body .tl-how>.section-title,body .tl-how>.section-desc,body .tl-compare>.section-title,body .tl-compare>.section-desc,body .tl-devices>.section-title,body .tl-devices>.section-desc,body .tl-live>.section-title,body .tl-live>.section-desc,body .tl-stack>.section-title,body .tl-stack>.section-desc,body .tl-faq>.section-title,body .tl-faq>.section-desc,body .tl-contact>.section-title,body .tl-contact>.section-desc{text-align:center !important;margin-left:auto !important;margin-right:auto !important}
  /* Relax forced text-align:left for inner grids, keep cards left-aligned individually but block-center them */
  body .section>.acc-showcase,body .section>.tl-paper-board{text-align:center !important}
  /* Kill ALL 3D transforms on mobile, no matter the source */
  body .tl-3d-scroll,body .tl-how-step,body .tl-live-card,body .tl-stack-wrap,body .tl-faq-list,body .tl-contact-wrap,body .tl-compare-wrap,body .tl-devices-laptop,body .tl-devices-phone,body .tl-paper-board{transform:none !important}
  body .tl-how-grid,body .tl-live-grid{perspective:none !important}
  /* Nav: keep brand + auth buttons visible, hide link list */
  body .nav{padding:10px 14px !important}
  body .nav-links .nav-link{display:none !important}
  body .nav-brand{gap:8px !important}
  /* Hero: enforce column-centered layout */
  body .hero-inner{flex-direction:column !important;text-align:center !important;align-items:center !important}
  body .hero-text{width:100% !important;text-align:center !important}
  body .hero-text>*{margin-left:auto !important;margin-right:auto !important}
  body .hero-actions{flex-direction:column !important;align-items:stretch !important;width:100% !important;max-width:340px !important;margin:0 auto !important}
  body .hero-stats{justify-content:center !important;flex-wrap:wrap !important}
  body .hero-visual{margin:0 auto !important;max-width:92% !important}
  /* Pricing grid */
  body .pricing-grid{grid-template-columns:1fr !important;max-width:420px !important;margin:0 auto !important}
  /* Marquee */
  /* Footer */
  body .footer{padding:24px 16px !important;text-align:center !important}
  body .footer-links{justify-content:center !important;flex-wrap:wrap !important;gap:12px 18px !important}
  /* Avoid any horizontal scroll */
  html,body{overflow-x:hidden !important;max-width:100vw !important}
  body .section,body .tl-how,body .tl-compare,body .tl-devices,body .tl-live,body .tl-stack,body .tl-faq,body .tl-contact,body .tl-demo,body .hero{max-width:100vw !important;box-sizing:border-box !important}
  /* Compare table: collapse padding & sizing */
  /* AI demo center & stack */
  /* Contact rows */
  body .tl-contact-row{grid-template-columns:1fr !important}
  body .tl-contact-foot{flex-direction:column !important;align-items:stretch !important;gap:14px !important}
  /* Hide decorative float-num overlay that overlaps LIVE PREDICTIONS title on narrow screens */
}

/* ═══════════════════════════════════════════════════════════════════════════
   MODERN ENHANCEMENTS, typewriter, count-up, marquee, scroll reveals,
   3D tilt, hero spotlight, AI demo
   ═══════════════════════════════════════════════════════════════════════════ */

/* Typewriter cursor on hero h1 */
.tl-typed::after{content:'|';display:inline-block;margin-left:6px;color:var(--accent);font-weight:300;animation:tl-blink 1s steps(2) infinite;-webkit-text-fill-color:var(--accent);text-shadow:0 0 12px rgba(0,255,136,.6)}
@keyframes tl-blink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* Scroll-triggered reveal */
.tl-reveal{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.tl-reveal.in{opacity:1;transform:translateY(0)}
.tl-reveal.delay-1{transition-delay:.08s}
.tl-reveal.delay-2{transition-delay:.16s}
.tl-reveal.delay-3{transition-delay:.24s}
.tl-reveal.delay-4{transition-delay:.32s}

/* Scroll-driven parallax targets (transform set by JS based on scrollY) */
.tl-parallax{will-change:transform;transition:transform .08s linear}

/* Smooth number count-up styling */
.tl-num{display:inline-block;font-variant-numeric:tabular-nums;font-feature-settings:'tnum'}

/* ───── Product tour: muted looping recording of the real app in a soft frame ───── */
.tour{padding-top:56px;overflow-x:clip}
/* the tour is the one section that earns more width than the 1100px column */
.section.tour{max-width:1320px}
.tour-stage{position:relative;max-width:1180px;margin:0 auto 22px}
.tour-stage::before{content:"";position:absolute;inset:-10% 0;background:radial-gradient(60% 60% at 50% 45%,rgba(0,255,136,.10),transparent 70%);filter:blur(30px);pointer-events:none;z-index:0}
.tour-frame{position:relative;z-index:1;background:#0d0d14;border:1px solid rgba(0,255,136,.35);border-radius:14px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,255,136,.18),0 0 32px rgba(0,255,136,.22),0 0 90px rgba(0,170,255,.14),0 30px 80px -30px rgba(0,0,0,.9)}
.tour-stage::after{content:"";position:absolute;inset:-3px;border-radius:17px;background:linear-gradient(135deg,#00ff88,#00aaff 45%,#aa55ff 80%,#00ff88);filter:blur(16px);opacity:.45;z-index:0;pointer-events:none;animation:tourGlow 6s ease-in-out infinite alternate}
@keyframes tourGlow{from{opacity:.32}to{opacity:.6}}
@media(prefers-reduced-motion:reduce){.tour-stage::after{animation:none;opacity:.4}}
.tour-chrome{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-bottom:1px solid var(--border);background:#111118}
.tour-chrome span{width:9px;height:9px;border-radius:50%;background:#252540}
.tour-chrome b{margin-left:10px;font-weight:500;font-size:11px;color:var(--dim);font-family:'SF Mono','Fira Code',monospace;letter-spacing:.3px}
.tour-video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#0a0a0f;object-fit:cover}
.tour-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(10,10,15,.75);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center}
.tour-play svg{width:26px;height:26px;fill:currentColor;margin-left:3px}
.tour-play:hover{border-color:var(--accent);color:var(--accent)}
.tour-play:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tour-copy{font-size:14px;color:var(--dim2);margin:0 0 18px}
@media(max-width:640px){
  .section.tour{padding-left:12px;padding-right:12px}
  .tour-stage{max-width:360px}
  .tour-frame{border-radius:30px;padding:8px;background:#141420}
  .tour-chrome{display:none}
  .tour-video{aspect-ratio:9/19.5;border-radius:22px}
}
@media(prefers-reduced-motion:reduce){.tour-stage::before{filter:none}}

/* ───── Infinite brand marquee (cleaner, no green tint) ───── */
.tl-marquee-section{position:relative;z-index:1;padding:18px 0 22px;border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.04);background:linear-gradient(180deg,rgba(0,0,0,.0),rgba(0,255,136,.025),rgba(0,0,0,.0))}
.tl-marquee-label{display:flex;align-items:center;justify-content:center;gap:14px;text-align:center;font-size:11px;letter-spacing:4px;color:var(--dim2);font-family:'SF Mono','Fira Code',monospace;margin-bottom:14px;text-transform:uppercase}
.tl-marquee-label::before,.tl-marquee-label::after{content:'';flex:0 0 64px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent)}
.tl-marquee-label{text-align:center;font-size:10px;letter-spacing:3px;color:var(--dim);font-family:'SF Mono','Fira Code',monospace;margin-bottom:22px;text-transform:uppercase}
.tl-marquee{position:relative;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.tl-marquee-track{display:flex;gap:56px;width:max-content;animation:tl-scroll 42s linear infinite;will-change:transform;align-items:center}
.tl-marquee:hover .tl-marquee-track{animation-play-state:paused}
.tl-marquee-item{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:42px;padding:0 6px;color:#c9c9d4;opacity:.55;filter:saturate(0) brightness(1.1);transition:opacity .3s,filter .3s,transform .3s;flex-shrink:0;white-space:nowrap}
.tl-marquee-item:hover{opacity:1;filter:saturate(1) brightness(1.2);transform:translateY(-1px)}
.tl-marquee-item svg{display:block;height:30px;width:auto;flex-shrink:0}
@keyframes tl-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ───── Free AI Demo Section ───── */
.tl-demo{position:relative;z-index:1;padding:48px 32px 32px;max-width:980px;margin:0 auto}
.tl-demo-card{position:relative;background:linear-gradient(180deg,rgba(0,255,136,.04),rgba(0,170,255,.03));border:1px solid rgba(0,255,136,.15);border-radius:20px;padding:40px 36px;overflow:hidden}
.tl-demo-card::before{content:'';position:absolute;inset:-1px;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(0,255,136,.5),transparent 30%,transparent 70%,rgba(0,170,255,.5));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.6}
.tl-demo-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:2px;color:var(--accent);font-weight:600;text-transform:uppercase;font-family:'SF Mono',monospace;margin-bottom:14px}
.tl-demo-eyebrow .pulse{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite;box-shadow:0 0 12px rgba(0,255,136,.7)}
.tl-demo h2{font-size:clamp(22px,3.5vw,34px);font-weight:800;line-height:1.15;margin-bottom:8px;background:linear-gradient(135deg,#fff,#00ff88 70%,#00aaff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.tl-demo p.tl-demo-sub{color:var(--dim2);font-size:14px;margin-bottom:24px;max-width:540px}
.tl-demo-input{display:flex;gap:10px;align-items:stretch;background:rgba(10,10,15,.7);border:1px solid var(--border2);border-radius:12px;padding:6px;transition:border-color .25s,box-shadow .25s}
.tl-demo-input:focus-within{border-color:rgba(0,255,136,.5);box-shadow:0 0 0 4px rgba(0,255,136,.08)}
.tl-demo-input input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:15px;padding:12px 14px;font-family:inherit}
.tl-demo-input input::placeholder{color:var(--dim)}
.tl-demo-input button{background:var(--gradient1);color:#000;border:none;border-radius:8px;padding:10px 22px;font-size:13px;font-weight:700;letter-spacing:.5px;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;transition:all .2s;flex-shrink:0}
.tl-demo-input button:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,255,136,.3)}
.tl-demo-input button:disabled{opacity:.5;cursor:not-allowed;transform:none}
.tl-demo-suggest{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.tl-demo-chip{background:rgba(255,255,255,.04);border:1px solid var(--border2);color:var(--dim2);padding:7px 14px;border-radius:20px;font-size:12px;cursor:pointer;transition:all .2s;font-family:inherit}
.tl-demo-chip:hover{background:rgba(0,255,136,.08);border-color:rgba(0,255,136,.3);color:var(--text);transform:translateY(-1px)}
.tl-demo-meta{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:11px;color:var(--dim);font-family:'SF Mono',monospace;letter-spacing:.5px}
.tl-demo-meta .left{display:flex;align-items:center;gap:8px}
.tl-demo-meta .quota{color:var(--accent);font-weight:600}
.tl-demo-output{margin-top:20px;background:rgba(10,10,15,.5);border:1px solid var(--border);border-radius:12px;padding:18px 20px;display:none;min-height:80px;font-size:14px;line-height:1.65;color:var(--text);animation:tl-fadeup .35s ease}
.tl-demo-output.show{display:block}
.tl-demo-output .tl-q{color:var(--accent);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-family:'SF Mono',monospace}
.tl-demo-output .tl-thinking{display:inline-flex;align-items:center;gap:8px;color:var(--dim2)}
.tl-demo-output .tl-thinking::after{content:'';width:14px;height:14px;border:2px solid var(--accent);border-top-color:transparent;border-radius:50%;display:inline-block;animation:tl-spin .8s linear infinite}
/* Chat-style bubbles (mirrors the Chart page assistant) */
.tl-demo-output .tl-msg{display:flex;gap:12px;margin:14px 0;animation:tl-fadeup .3s ease;align-items:flex-start}
.tl-demo-output .tl-msg.user{flex-direction:row-reverse}
.tl-demo-output .tl-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;box-shadow:0 4px 12px rgba(0,0,0,.4)}
.tl-demo-output .tl-av.ai{background:linear-gradient(135deg,rgba(170,85,255,.45),rgba(0,170,255,.4));border:1px solid rgba(170,85,255,.55)}
.tl-demo-output .tl-av.user{background:linear-gradient(135deg,rgba(0,255,136,.35),rgba(0,170,255,.25));border:1px solid rgba(0,255,136,.45)}
.tl-demo-output .tl-bub{max-width:85%;padding:16px 18px;border-radius:16px;font-size:14.5px;line-height:1.65;position:relative;word-wrap:break-word;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.tl-demo-output .tl-bub.ai{background:linear-gradient(180deg,rgba(170,85,255,.10),rgba(0,170,255,.06));border:1px solid rgba(170,85,255,.25);border-top-left-radius:4px;color:var(--text);box-shadow:0 8px 24px -8px rgba(170,85,255,.18)}
.tl-demo-output .tl-bub.user{background:linear-gradient(180deg,rgba(0,255,136,.12),rgba(0,170,255,.06));border:1px solid rgba(0,255,136,.3);border-top-right-radius:4px;color:var(--text);box-shadow:0 8px 24px -8px rgba(0,255,136,.18)}
.tl-demo-output .tl-bub.error{background:rgba(239,83,80,.08);border:1px solid rgba(239,83,80,.25);color:#ef5350}
.tl-demo-output .tl-bub strong,.tl-demo-output .tl-bub b{color:var(--accent);font-weight:700}
.tl-demo-output .tl-bub.ai strong:first-child{display:inline-block;margin-bottom:2px}
.tl-demo-output .tl-bub p{margin:8px 0}
.tl-demo-output .tl-bub p:first-child{margin-top:0}
.tl-demo-output .tl-bub p:last-child{margin-bottom:0}
.tl-demo-output .tl-bub ul{margin:6px 0 10px 4px;padding:0;list-style:none}
.tl-demo-output .tl-bub li{position:relative;padding:4px 0 4px 18px;margin:2px 0}
.tl-demo-output .tl-bub li::before{content:'';position:absolute;left:4px;top:13px;width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--blue));box-shadow:0 0 8px rgba(0,255,136,.45)}
.tl-demo-output .tl-bub code{background:rgba(0,255,136,.08);border:1px solid rgba(0,255,136,.2);color:var(--accent);padding:1px 6px;border-radius:5px;font-family:"SF Mono","JetBrains Mono",monospace;font-size:12.5px}
.tl-demo-output .tl-bub a.tl-cta-link{display:inline-block;background:linear-gradient(135deg,var(--accent),var(--blue));color:#000 !important;text-decoration:none;padding:3px 12px;border-radius:8px;font-weight:700;margin:0 2px;transition:transform .15s ease,box-shadow .2s ease;box-shadow:0 4px 14px -4px rgba(0,255,136,.55)}
.tl-demo-output .tl-bub a.tl-cta-link:hover{transform:translateY(-1px);box-shadow:0 6px 18px -4px rgba(0,255,136,.75);filter:brightness(1.08)}
.tl-demo-output .tl-bub a.tl-cta-link strong{color:#000 !important}
.tl-demo-output .tl-cta-row{display:flex;justify-content:flex-end;margin:14px 0 4px;padding-right:4px}
.tl-demo-output a.tl-cta-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--accent),var(--blue));color:#000 !important;text-decoration:none;padding:10px 20px;border-radius:10px;font-weight:800;font-size:14px;letter-spacing:.2px;box-shadow:0 6px 22px -6px rgba(0,255,136,.7);transition:transform .15s ease,box-shadow .2s ease,filter .15s ease}
.tl-demo-output a.tl-cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px -6px rgba(0,255,136,.9);filter:brightness(1.08)}
.tl-demo-output .tl-bub .tl-dots{display:inline-flex;gap:4px;margin-left:8px;vertical-align:middle}
.tl-demo-output .tl-bub .tl-dots span{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#aa55ff,#00aaff);animation:tl-bounce 1.2s infinite}
.tl-demo-output .tl-bub .tl-dots span:nth-child(2){animation-delay:.15s}
.tl-demo-output .tl-bub .tl-dots span:nth-child(3){animation-delay:.3s}
.tl-demo-output .tl-bub .tl-thinking-label{color:var(--dim2);font-style:italic}
@keyframes tl-bounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-5px);opacity:1}}
@keyframes tl-spin{to{transform:rotate(360deg)}}
@keyframes tl-fadeup{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.tl-demo-lock{margin-top:14px;background:linear-gradient(135deg,rgba(0,255,136,.06),rgba(0,170,255,.06));border:1px solid rgba(0,255,136,.25);border-radius:12px;padding:16px 18px;display:none;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.tl-demo-lock.show{display:flex;animation:tl-fadeup .35s ease}
.tl-demo-lock .txt{font-size:13px;color:var(--text)}
.tl-demo-lock .txt b{color:var(--accent);font-weight:700}
.tl-demo-lock button{background:var(--gradient1);color:#000;border:none;border-radius:8px;padding:11px 22px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;letter-spacing:.5px;transition:all .2s}
.tl-demo-lock button:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,255,136,.3)}

.tl-demo-analyze{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;margin-bottom:12px}
.tl-demo-analyze label{display:flex;flex-direction:column;gap:6px;font-size:10px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;text-align:left;font-family:'SF Mono',monospace}
.tl-demo-analyze select{min-height:44px;background:rgba(10,10,15,.7);border:1px solid var(--border2);border-radius:10px;color:var(--text);font:inherit;font-size:14px;padding:0 36px 0 12px;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--dim2) 50%),linear-gradient(135deg,var(--dim2) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;cursor:pointer}
.tl-demo-analyze button{align-self:end;min-height:44px;background:rgba(255,255,255,.05);border:1px solid var(--border2);border-radius:10px;color:var(--text);font:inherit;font-size:13px;font-weight:700;padding:0 18px;cursor:pointer;white-space:nowrap;transition:border-color .2s,color .2s}
.tl-demo-analyze button:hover{border-color:var(--accent);color:var(--accent)}
.tl-demo-analyze select:focus-visible,.tl-demo-analyze button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:640px){.tl-demo-analyze{grid-template-columns:1fr}.tl-demo-analyze button{width:100%}}

/* ════════════ SIGNAL X-RAY, 3D exploded stack ════════════ */
.xray-section{position:relative;padding:80px 32px;max-width:1280px;margin:0 auto;overflow:hidden}
.xray-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.xray-bg-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4}
.xray-bg-a{width:480px;height:480px;left:-160px;top:-80px;background:radial-gradient(circle,rgba(0,255,136,.6),transparent 65%)}
.xray-bg-b{width:520px;height:520px;right:-160px;bottom:-120px;background:radial-gradient(circle,rgba(170,85,255,.45),transparent 65%)}
.xray-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,255,136,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,136,.04) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 70% 60% at 50% 50%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 50%,#000 30%,transparent 80%)}
.xray-inner{position:relative;display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center;z-index:1}
.xray-copy .section-badge{margin-bottom:16px}
.xray-title{font-size:clamp(28px,3.2vw,42px);font-weight:900;line-height:1.05;margin:0 0 14px;letter-spacing:-.5px;color:#fff}
.xray-grad{background:linear-gradient(120deg,#00ff88 0%,#00ccff 50%,#aa55ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.xray-sub{color:var(--dim2);font-size:14.5px;line-height:1.6;margin:0 0 22px;max-width:480px}
.xray-legend{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:8px}
.xray-legend li{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:12px;padding:9px 14px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);border-radius:10px;transition:all .25s ease;cursor:default}
.xray-legend li:hover,.xray-legend li.on{background:linear-gradient(90deg,rgba(0,255,136,.06),rgba(0,255,136,.01));border-color:rgba(0,255,136,.3);transform:translateX(4px)}
.xray-chip{width:10px;height:10px;border-radius:3px;box-shadow:0 0 10px currentColor}
.xray-legend b{color:#fff;font-size:13.5px;font-weight:700}
.xray-legend span:last-child{color:var(--dim);font-size:11.5px;font-family:'SF Mono',monospace;letter-spacing:.4px}
.xray-cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.xray-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:10px;background:linear-gradient(135deg,#00ff88,#00cc6a);color:#000;font-weight:800;font-size:13px;letter-spacing:.5px;border:none;cursor:pointer;text-transform:uppercase;font-family:inherit;box-shadow:0 12px 30px -10px rgba(0,255,136,.5);transition:transform .2s ease,box-shadow .2s ease}
.xray-btn:hover{transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(0,255,136,.7)}
.xray-btn-i{font-size:14px}
.xray-hint{font-family:'SF Mono',monospace;font-size:11px;color:var(--dim);letter-spacing:1px;text-transform:uppercase}

.xray-scene{position:relative;height:620px;perspective:1600px;perspective-origin:50% 50%}
.xray-stack{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-12deg) rotateY(-18deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.xray-stack.exploded{transform:rotateX(-22deg) rotateY(-26deg)}
.xray-layer{position:absolute;left:50%;top:50%;width:340px;height:200px;margin-left:-170px;margin-top:-100px;border-radius:16px;background:linear-gradient(180deg,rgba(15,18,25,.92),rgba(8,10,16,.92));border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px -20px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.03) inset;backdrop-filter:blur(10px);overflow:hidden;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,border-color .4s ease;will-change:transform}
.xray-layer::after{content:"";position:absolute;inset:0;border-radius:16px;background:radial-gradient(120% 80% at 50% 0%,var(--glow,rgba(0,255,136,.18)),transparent 60%);pointer-events:none;opacity:.8}
.xray-tag{position:absolute;top:12px;left:14px;font-family:'SF Mono',monospace;font-size:9.5px;letter-spacing:2px;color:rgba(255,255,255,.55);text-transform:uppercase;font-weight:700;z-index:2}
.xray-tag-final{color:#00ff88}

/* default tight stack (closed) */
.xray-l0{transform:translateZ(-100px) translateY(28px) rotateX(2deg);--glow:rgba(0,170,255,.28);border-color:rgba(0,170,255,.25)}
.xray-l1{transform:translateZ(-50px) translateY(14px) rotateX(1deg);--glow:rgba(0,255,136,.22);border-color:rgba(0,255,136,.22)}
.xray-l2{transform:translateZ(0) translateY(0);--glow:rgba(255,216,74,.2);border-color:rgba(255,216,74,.22)}
.xray-l3{transform:translateZ(50px) translateY(-14px) rotateX(-1deg);--glow:rgba(170,85,255,.22);border-color:rgba(170,85,255,.25)}
.xray-l4{transform:translateZ(100px) translateY(-28px) rotateX(-2deg);--glow:rgba(255,122,217,.25);border-color:rgba(0,255,136,.45);box-shadow:0 30px 60px -20px rgba(0,0,0,.65),0 0 40px rgba(0,255,136,.25),0 0 0 1px rgba(0,255,136,.15) inset}

/* exploded, fan vertically so every layer is visible */
.xray-stack.exploded{transform:rotateX(-5deg) rotateY(-12deg)}
/* (landfix1) each card had its own rotateX/rotateY, so neighbours at nearly the same depth cut through each other; now every card is parallel and sits just in front of the card above it, the same order as collapsed, so none can intersect at rest or while animating */
.xray-stack.exploded .xray-l0{transform:translate3d(-30px,-220px,16px) scale(.78)}
.xray-stack.exploded .xray-l1{transform:translate3d(-15px,-110px,24px) scale(.82)}
.xray-stack.exploded .xray-l2{transform:translate3d(0,0,32px) scale(.86)}
.xray-stack.exploded .xray-l3{transform:translate3d(15px,110px,40px) scale(.82)}
.xray-stack.exploded .xray-l4{transform:translate3d(30px,220px,48px) scale(.78)}

/* hover lift on hovered layer */
.xray-layer{pointer-events:auto}
.xray-layer.hot{box-shadow:0 30px 60px -20px rgba(0,0,0,.65),0 0 60px rgba(0,255,136,.35),0 0 0 1px rgba(0,255,136,.45) inset;border-color:rgba(0,255,136,.55)!important}
/* bring-forward: when any layer is hot, pop it to the very front and recede the rest */
.xray-stack.has-hot .xray-layer{transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .35s ease,filter .35s ease,box-shadow .35s ease,border-color .35s ease}
.xray-stack.has-hot .xray-layer:not(.hot){opacity:.18;filter:blur(2px) saturate(.5);pointer-events:none}
.xray-stack.has-hot .xray-layer.hot,
.xray-stack.has-hot.exploded .xray-layer.hot{transform:translate3d(0,0,240px) scale(1.06) rotateX(0) rotateY(0)!important;opacity:1!important;filter:none!important;z-index:5;box-shadow:0 40px 90px -20px rgba(0,0,0,.8),0 0 90px rgba(0,255,136,.55),0 0 0 1.5px rgba(0,255,136,.7) inset!important;border-color:rgba(0,255,136,.75)!important}

.xray-layer svg{position:absolute;inset:30px 14px 14px;width:calc(100% - 28px);height:calc(100% - 44px)}

/* layer 1, indicator bars */
.xray-bars{position:absolute;inset:36px 16px 16px;display:flex;align-items:flex-end;gap:3px;justify-content:space-between}
.xray-bars span{flex:1;height:calc(var(--h)*100%);min-height:6px;border-radius:2px 2px 0 0;background:linear-gradient(180deg,var(--c),rgba(0,0,0,.2));box-shadow:0 0 8px var(--c);opacity:.85}

/* layer 2, vote chips */
.xray-votes{position:absolute;inset:36px 16px 16px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;align-content:center}
.xray-vote{font-family:'SF Mono',monospace;font-size:10px;font-weight:800;letter-spacing:.5px;text-align:center;padding:8px 4px;border-radius:6px;border:1px solid;backdrop-filter:blur(4px)}
.xray-vote.v-up{color:#00ff88;background:rgba(0,255,136,.1);border-color:rgba(0,255,136,.35);box-shadow:0 0 12px rgba(0,255,136,.18)}
.xray-vote.v-dn{color:#ef4444;background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.35);box-shadow:0 0 12px rgba(239,68,68,.18)}

/* layer 4, final signal */
.xray-final{position:absolute;left:14px;right:14px;top:42px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;background:radial-gradient(120% 100% at 0% 50%,rgba(0,255,136,.18),rgba(0,255,136,.04));border:1px solid rgba(0,255,136,.35);border-radius:12px}
.xray-final-l{display:flex;align-items:baseline;gap:8px}
.xray-arrow{color:#00ff88;font-size:22px;text-shadow:0 0 16px rgba(0,255,136,.8)}
.xray-final-l b{font-size:26px;font-weight:900;color:#fff;letter-spacing:1.4px}
.xray-final-num{font-family:'SF Mono',monospace;font-size:36px;font-weight:900;background:linear-gradient(135deg,#00ff88,#00ccff);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1;display:block}
.xray-final-num small{font-size:18px;opacity:.7}
.xray-final-sub{font-family:'SF Mono',monospace;font-size:9px;color:rgba(255,255,255,.55);letter-spacing:1.6px;display:block;text-align:right;margin-top:4px}
.xray-final-foot{position:absolute;left:14px;right:14px;bottom:14px;display:flex;justify-content:space-between;font-family:'SF Mono',monospace;font-size:9.5px;color:rgba(255,255,255,.5);letter-spacing:1px;text-transform:uppercase}
.xray-final-foot b{color:#00ff88;margin-right:5px}

.xray-beams{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:translateZ(-1px);opacity:.5;mix-blend-mode:screen}

@media(max-width:980px){
  .xray-inner{grid-template-columns:1fr;gap:30px}
  .xray-scene{height:440px;order:2}
  .xray-copy{order:1}
  .xray-stack{transform:rotateX(-14deg) rotateY(-14deg) scale(.88)}
  .xray-stack.exploded{transform:rotateX(-22deg) rotateY(-18deg) scale(.88)}
  .xray-layer{width:300px;margin-left:-150px}
}
@media(prefers-reduced-motion:reduce){
  .xray-stack,.xray-stack.exploded,.xray-layer{transition:none}
}

.xray-more{position:relative;z-index:1;max-width:1100px;margin:56px auto 0;text-align:center}
.xray-more-title{font-size:22px;font-weight:800;margin:0 0 6px}
.xray-more-sub{font-size:14px;color:var(--dim2);margin:0 0 22px}
/* ───── Inside a signal: six cards, one line-icon set ───── */
.sig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:left}
.sig-card{background:rgba(17,17,24,.85);border:1px solid var(--border);border-radius:14px;padding:22px 20px;min-width:0}
.sig-ic{width:22px;height:22px;stroke:var(--accent);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px;display:block}
.sig-card h3{font-size:15px;font-weight:700;margin:0 0 8px;color:var(--text)}
.sig-card p{font-size:13.5px;line-height:1.65;color:var(--dim2);margin:0}
.sig-foot{margin:22px auto 0;font-size:14px;color:var(--dim2);max-width:620px;line-height:1.7}
@media(max-width:900px){.sig-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sig-grid{grid-template-columns:1fr}}

/* ───── Compare Section (premium glow card) ───── */
.tl-compare{position:relative;z-index:1;padding:48px 32px;max-width:1080px;margin:0 auto;text-align:center}
.tl-compare-wrap{position:relative;margin-top:36px;background:radial-gradient(140% 100% at 0% 0%,rgba(0,255,136,.06),rgba(17,17,24,.92) 60%);border-radius:20px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,255,136,.18),0 0 0 1px rgba(255,255,255,.04) inset}
.tl-compare-wrap::before{content:'';position:absolute;inset:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(0,255,136,.55),rgba(0,170,255,.0) 35%,rgba(170,85,255,.0) 65%,rgba(0,255,136,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.tl-compare-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px;position:relative;z-index:1}
.tl-compare-table th,.tl-compare-table td{padding:18px 22px;text-align:left;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}
.tl-compare-table thead th{font-size:11px;font-weight:800;letter-spacing:2px;color:var(--dim);text-transform:uppercase;background:rgba(0,0,0,.35);padding-top:22px;padding-bottom:22px;position:relative}
.tl-compare-table thead th.us{color:#fff;background:linear-gradient(180deg,rgba(0,255,136,.18),rgba(0,255,136,.04));text-shadow:0 0 14px rgba(0,255,136,.55);position:relative}
.tl-compare-table thead th.us::after{content:'WINNER';position:absolute;top:6px;right:14px;font-size:8.5px;letter-spacing:1.5px;color:#000;background:#00ff88;padding:2px 7px;border-radius:4px;font-weight:900;box-shadow:0 0 12px rgba(0,255,136,.7);animation:tlBeam 2.4s ease-in-out infinite}
.tl-compare-table tbody tr{transition:background .25s}
.tl-compare-table tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
.tl-compare-table tbody tr:hover{background:rgba(0,255,136,.04)}
.tl-compare-table tr:last-child td{border-bottom:none}
.tl-compare-table td.feat{color:var(--text);font-weight:600;font-size:13.5px}
.tl-compare-table td.us{color:#d6ffe9;font-weight:600;background:linear-gradient(90deg,rgba(0,255,136,.05),rgba(0,255,136,.0))}
.tl-compare-table td.them{color:var(--dim2)}
.tl-compare-table .ck{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#00ff88,#00cc70);color:#000;font-weight:900;margin-right:10px;font-size:13px;box-shadow:0 0 14px rgba(0,255,136,.45),0 0 0 1px rgba(0,255,136,.4) inset;vertical-align:middle}
.tl-compare-table .ex{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:rgba(239,68,68,.12);color:#ef4444;font-weight:900;margin-right:10px;font-size:13px;border:1px solid rgba(239,68,68,.35);vertical-align:middle;opacity:.85}
@media(max-width:680px){.tl-compare-table th,.tl-compare-table td{padding:12px 12px;font-size:12px}.tl-compare-table thead th.us::after{display:none}}

/* ───── Live Activity (futuristic stats) ───── */
.tl-live{position:relative;z-index:1;padding:64px 32px 72px;max-width:1180px;margin:0 auto;text-align:center}
.tl-live-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:44px;perspective:1400px}
.tl-live-card{position:relative;background:radial-gradient(120% 100% at 0% 0%,rgba(0,255,136,.07),rgba(17,17,24,.9) 60%);border:1px solid rgba(0,255,136,.12);border-radius:18px;padding:26px 22px 22px;overflow:hidden;text-align:left;transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s;transform-style:preserve-3d;will-change:transform}
.tl-live-card::before{content:'';position:absolute;inset:0;border-radius:18px;padding:1px;background:linear-gradient(135deg,rgba(0,255,136,.45),rgba(0,170,255,0) 35%,rgba(170,85,255,0) 65%,rgba(0,255,136,.45));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s;pointer-events:none}
.tl-live-card:hover::before{opacity:1}
.tl-live-card:hover{border-color:rgba(0,255,136,.3);box-shadow:0 24px 60px -22px rgba(0,255,136,.28)}
.tl-live-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#000;margin-bottom:18px;box-shadow:0 8px 24px -8px rgba(0,255,136,.55)}
.tl-live-icon svg{width:22px;height:22px}
.tl-live-stat{font-size:38px;font-weight:900;letter-spacing:-1px;background:linear-gradient(135deg,#fff,#00ff88);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:baseline;gap:2px;line-height:1}
.tl-live-suffix{font-size:22px;color:var(--accent);-webkit-text-fill-color:var(--accent)}
.tl-live-label{font-size:12.5px;color:var(--dim2);margin-top:8px;letter-spacing:.2px;line-height:1.5}
.tl-live-bar{margin-top:14px;height:6px;border-radius:99px;background:rgba(255,255,255,.04);overflow:hidden;position:relative}
.tl-live-bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#00ff88,#00aaff);box-shadow:0 0 12px rgba(0,255,136,.5);position:relative;transition:width 1s cubic-bezier(.2,.7,.2,1)}
.tl-live-bar-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-100%);animation:tlHowShine 3s ease-in-out infinite}
@media(max-width:1000px){.tl-live-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.tl-live-grid{grid-template-columns:1fr}}

/* ───── Integration Stack ───── */
.tl-stack{position:relative;z-index:1;padding:48px 32px 64px;max-width:1000px;margin:0 auto;text-align:center}
.tl-stack-wrap{margin-top:36px;display:flex;flex-direction:column;align-items:center;gap:10px;perspective:1400px}
.tl-stack-layer{width:100%;max-width:760px;background:radial-gradient(120% 100% at 0% 0%,rgba(0,255,136,.06),rgba(17,17,24,.92) 60%);border-radius:14px;padding:18px 24px;border:1px solid rgba(0,255,136,.12);display:flex;align-items:center;gap:18px;position:relative;overflow:hidden;text-align:left;transition:transform .3s,box-shadow .3s,border-color .3s}
.tl-stack-layer:hover{transform:translateY(-2px);border-color:rgba(0,255,136,.25);box-shadow:0 18px 40px -18px rgba(0,255,136,.22)}
.tl-stack-layer.alt{border-color:rgba(0,170,255,.15)}
.tl-stack-layer.alt:hover{border-color:rgba(0,170,255,.3);box-shadow:0 18px 40px -18px rgba(0,170,255,.22)}
.tl-stack-layer.alt2{border-color:rgba(170,85,255,.15)}
.tl-stack-layer.alt2:hover{border-color:rgba(170,85,255,.3);box-shadow:0 18px 40px -18px rgba(170,85,255,.22)}
.tl-stack-layer.final{border-color:rgba(0,255,136,.4);background:radial-gradient(120% 100% at 0% 0%,rgba(0,255,136,.14),rgba(17,17,24,.95) 60%);box-shadow:0 0 30px rgba(0,255,136,.18)}
.tl-stack-tier{font-family:'SF Mono','Fira Code',monospace;font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:800;text-transform:uppercase;flex:0 0 auto;min-width:160px;border-right:1px solid rgba(255,255,255,.08);padding-right:18px}
.tl-stack-layer.alt .tl-stack-tier{color:#00aaff}
.tl-stack-layer.alt2 .tl-stack-tier{color:#aa55ff}
.tl-stack-layer.final .tl-stack-tier{color:#fff;text-shadow:0 0 12px rgba(0,255,136,.6)}
.tl-stack-items{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.tl-stack-items span{font-size:12px;font-weight:600;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--text);padding:5px 11px;border-radius:8px;letter-spacing:.3px;transition:background .2s,border-color .2s}
.tl-stack-layer:hover .tl-stack-items span{background:rgba(0,255,136,.06);border-color:rgba(0,255,136,.18)}
.tl-stack-arrow{color:var(--accent);font-size:16px;opacity:.5;animation:tlStackArrow 2s ease-in-out infinite}
@keyframes tlStackArrow{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(4px);opacity:.9}}
@media(max-width:680px){.tl-stack-layer{flex-direction:column;align-items:flex-start;gap:10px}.tl-stack-tier{border-right:none;border-bottom:1px solid rgba(255,255,255,.08);padding-right:0;padding-bottom:8px;width:100%}}

/* ───── FAQ ───── */
.tl-faq{position:relative;z-index:1;padding:48px 32px 56px;max-width:880px;margin:0 auto;text-align:center}
.tl-faq-list{margin-top:32px;display:flex;flex-direction:column;gap:10px;text-align:left}
.tl-faq-item{background:rgba(17,17,24,.7);border:1px solid var(--border);border-radius:12px;padding:16px 22px;transition:border-color .3s,background .3s}
.tl-faq-item[open]{border-color:rgba(0,255,136,.3);background:rgba(0,255,136,.03)}
.tl-faq-item summary{cursor:pointer;font-weight:700;font-size:14.5px;color:var(--text);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px}
.tl-faq-item summary::-webkit-details-marker{display:none}
.tl-faq-item summary::after{content:'+';font-size:22px;font-weight:300;color:var(--accent);transition:transform .25s;line-height:1}
.tl-faq-item[open] summary::after{content:'\u2212'}
.tl-faq-item p{margin-top:12px;color:var(--dim2);font-size:13.5px;line-height:1.7}

/* ───── Contact ───── */
.tl-contact{position:relative;z-index:1;padding:48px 32px 72px;max-width:880px;margin:0 auto;text-align:center}
.tl-contact-wrap{margin-top:32px;perspective:1400px}
.tl-contact-card{position:relative;background:radial-gradient(140% 100% at 0% 0%,rgba(0,255,136,.07),rgba(17,17,24,.94) 60%);border-radius:20px;padding:32px 32px 28px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,255,136,.18),0 0 0 1px rgba(255,255,255,.04) inset;text-align:left}
.tl-contact-card::before{content:'';position:absolute;inset:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(0,255,136,.55),rgba(0,170,255,0) 35%,rgba(170,85,255,0) 65%,rgba(0,255,136,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.tl-contact-card form{display:flex;flex-direction:column;gap:14px;position:relative;z-index:1}
.tl-contact-card label{display:flex;flex-direction:column;gap:6px;font-size:11.5px;font-weight:700;letter-spacing:1.2px;color:var(--dim);text-transform:uppercase;font-family:'SF Mono',monospace}
.tl-contact-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tl-contact-card input,.tl-contact-card select,.tl-contact-card textarea{background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.08);border-radius:10px;color:var(--text);padding:12px 14px;font-family:inherit;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;transition:border-color .2s,box-shadow .2s}
.tl-contact-card input:focus,.tl-contact-card select:focus,.tl-contact-card textarea:focus{outline:none;border-color:rgba(0,255,136,.5);box-shadow:0 0 0 3px rgba(0,255,136,.12)}
.tl-contact-card textarea{resize:vertical;min-height:120px;line-height:1.6}
.tl-contact-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:6px}
.tl-contact-direct{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--dim2)}
.tl-contact-direct a{color:var(--accent);text-decoration:none;font-weight:700}
.tl-contact-direct a:hover{text-decoration:underline}
.tl-contact-status{margin-top:10px;padding:12px 14px;border-radius:10px;font-size:13px;font-weight:600}
.tl-contact-status.ok{background:rgba(0,255,136,.08);border:1px solid rgba(0,255,136,.3);color:var(--accent)}
.tl-contact-status.err{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.3);color:#ef4444}
@media(max-width:680px){.tl-contact-row{grid-template-columns:1fr}.tl-contact-foot{flex-direction:column;align-items:stretch}.tl-contact-foot .cta-big{text-align:center}}

/* ───── Device showcase: hover/touch reveal loupe on the real product (port of assets-raw/loupe-reference.html) ───── */
.tl-devices{position:relative;z-index:1;padding:64px 32px 80px;max-width:1200px;margin:0 auto;text-align:center;overflow:hidden}
.xr-stage{position:relative;max-width:1000px;margin:40px auto 0;display:grid;grid-template-columns:1fr;gap:28px;align-items:end;justify-items:center}
@media(min-width:641px){.xr-stage{grid-template-columns:minmax(0,1fr) minmax(0,.28fr);gap:20px}}
@media(min-width:900px){.xr-stage{grid-template-columns:minmax(0,1fr) minmax(0,.26fr);gap:28px}}
.xr-laptop{width:100%;position:relative}
.xr-laptop-lid{position:relative;background:#141420;border:1px solid var(--border2);border-bottom:none;border-radius:14px 14px 0 0;padding:10px 10px 0}
.xr-laptop-lid:before{content:"";position:absolute;left:50%;top:3px;width:6px;height:6px;border-radius:50%;background:#000;transform:translateX(-50%)}
.xr-laptop-base{height:14px;background:linear-gradient(180deg,#1c1c2a,#0f0f18);border:1px solid var(--border2);border-top:none;border-radius:0 0 12px 12px;position:relative;box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
.xr-laptop-base:after{content:"";position:absolute;left:50%;top:0;width:18%;height:4px;border-radius:0 0 4px 4px;background:#0a0a0f;transform:translateX(-50%)}
.xr-phone{width:min(100%,300px);position:relative;background:#141420;border:1px solid var(--border2);border-radius:30px;padding:10px;box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
.xr-phone:before{content:"";position:absolute;left:50%;top:16px;width:24%;height:18px;border-radius:12px;background:#0a0a0f;transform:translateX(-50%);z-index:2}
@media(max-width:640px){.xr-laptop{display:none}.xr-phone{width:min(100%,340px)}}
.xr-frame{position:relative;width:100%;overflow:hidden;background:var(--card);cursor:none;touch-action:pan-y;isolation:isolate;border:1px solid var(--border);border-radius:6px}
.xr-laptop .xr-frame{aspect-ratio:16/10;border-radius:6px 6px 0 0}
.xr-phone .xr-frame{aspect-ratio:780/1688;border-radius:22px}
.xr-base{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:50% 50%;user-select:none;-webkit-user-drag:none}
.xr-phone .xr-base{object-position:50% 0}
.xr-after{display:none}
@media(hover:none){.xr-frame{cursor:default}}
.xr-lens{position:absolute;left:0;top:0;border-radius:50%;pointer-events:none;overflow:hidden;background:#0d0d14;opacity:0;box-shadow:0 0 0 1px rgba(0,255,136,.22),0 0 34px rgba(0,255,136,.10),0 18px 44px -14px rgba(0,0,0,.85);-webkit-mask-image:radial-gradient(circle,#000 62%,rgba(0,0,0,.55) 82%,transparent 94%);mask-image:radial-gradient(circle,#000 62%,rgba(0,0,0,.55) 82%,transparent 94%);will-change:transform;transition:opacity .35s;transform:translate3d(0,0,0)}
.xr-lens img{position:absolute;left:0;top:0;max-width:none;display:block;will-change:transform;backface-visibility:hidden}
.xr-lens.on{opacity:1}
.xr-echo{position:absolute;left:0;top:0;border-radius:50%;pointer-events:none;opacity:0;background:radial-gradient(circle,rgba(0,255,136,.14),transparent 68%);will-change:transform,opacity}
.xr-bar{display:none;align-items:center;justify-content:center;gap:14px;margin-top:18px;flex-wrap:wrap}
@media(hover:none){.xr-bar{display:flex}}
.xr-hint{font-size:12px;color:var(--dim);letter-spacing:.3px;transition:opacity .3s}
.xr-zoom{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:4px 6px}
.xr-zoom button{width:44px;height:44px;border-radius:50%;border:1px solid var(--border2);background:transparent;color:var(--text);font-size:17px;line-height:1;cursor:pointer;font-family:inherit;transition:border-color .2s,color .2s}
.xr-zoom button:hover{border-color:var(--accent);color:var(--accent)}
.xr-zoom button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.xr-zoom span{font-size:11px;color:var(--dim2);min-width:34px;font-variant-numeric:tabular-nums;font-family:'SF Mono','Fira Code',monospace}
.xr-toggle{display:none;justify-content:center;margin-top:18px}
.xr-toggle button{min-height:44px;padding:0 18px;border:1px solid var(--border2);background:var(--card);color:var(--dim2);font:inherit;font-size:13px;cursor:pointer}
.xr-toggle button:first-child{border-radius:8px 0 0 8px}
.xr-toggle button:last-child{border-radius:0 8px 8px 0;margin-left:-1px}
.xr-toggle button[aria-pressed="true"]{color:var(--accent);border-color:rgba(0,255,136,.4);background:rgba(0,255,136,.06)}
.xr-toggle button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(prefers-reduced-motion:reduce){
  .xr-lens,.xr-echo,.xr-bar{display:none !important}
  .xr-frame{cursor:default}
  .xr-toggle{display:flex}
  .xr-after{display:block}
  .xr-base.analyzed{opacity:0;transition:opacity .2s}
  .xr-stage.after .xr-base.analyzed{opacity:1}
}

/* Mobile tweaks */
@media(max-width:720px){
}
@media(prefers-reduced-motion:reduce){
  .tl-reveal{transition:none;opacity:1;transform:none}
  .tl-typed::after{animation:none}
  .bg-orb{animation:none}
}
/* === PWA standalone (Install App), recenter, hide nav, add safe-area === */
@media all and (display-mode: standalone){
  html,body{overflow-x:hidden}
  body{padding-top:env(safe-area-inset-top,0);padding-bottom:env(safe-area-inset-bottom,0)}
  .nav{display:none !important}
  .hero{padding-top:calc(28px + env(safe-area-inset-top,0)) !important;padding-bottom:24px !important}
  .hero-inner{margin-left:auto;margin-right:auto}
  .hero-text{text-align:center;align-items:center;margin:0 auto}
  .hero-actions{justify-content:center}
  .hero-stats{justify-content:center}
  .tl-marquee-section,.tl-demo,.tl-how,.tl-compare,.tl-devices,.tl-stack,.tl-faq,.section,.xray-section{padding-left:max(16px,env(safe-area-inset-left,0)) !important;padding-right:max(16px,env(safe-area-inset-right,0)) !important}
  .tl-footer{padding-bottom:calc(30px + env(safe-area-inset-bottom,0)) !important}
  #ppInstallBtn{display:none !important}
}

/* ═══ Light page (TradeZella-style white + black) with our green; dark bands keep the terminal look ═══ */
html[data-theme="light"]{--bg:#f7f7fb;--surface:#ffffff;--card:#ffffff;--border:#e6e8ef;--border2:#d5d8e2;--text:#14171f;--dim:#6b7280;--dim2:#4b5563;--accent:#00b565;--accent2:#009a55;--neon:#00ff88;--gradient1:linear-gradient(135deg,#00ff88,#00d4aa);--gradient2:linear-gradient(135deg,#00b565,#0077cc)}
html,*{scrollbar-width:thin;scrollbar-color:#1f2330 #f0f1f4}
html::-webkit-scrollbar{width:10px}html::-webkit-scrollbar-track{background:#f0f1f4}html::-webkit-scrollbar-thumb{background:#1f2330;border-radius:6px;border:2px solid #f0f1f4}html::-webkit-scrollbar-thumb:hover{background:#000}
body{background:#f7f7fb;color:var(--text)}
.dark-band{--bg:#0a0a0f;--surface:#111118;--card:#0d0d14;--border:#1a1a2e;--border2:#252540;--text:#e0e0e0;--dim:#8a8f9c;--dim2:#a3a8b5;--accent:#00ff88;--accent2:#00cc6a;background:#0a0a0f;color:#e0e0e0}
.xray-section,#community,#start{--bg:#0a0a0f;--surface:#111118;--card:#0d0d14;--border:#1a1a2e;--border2:#252540;--text:#e0e0e0;--dim:#8a8f9c;--dim2:#a3a8b5;--accent:#00ff88;--accent2:#00cc6a;color:#e0e0e0}
.xray-section{background:#0a0a0f;width:calc(100% - 40px);max-width:none;margin:28px auto;border-radius:32px;padding:104px 64px;box-sizing:border-box}
.xray-inner{max-width:1280px;margin:0 auto}
#community,#start{width:calc(100% - 40px);max-width:none;background:#0a0a0f;box-sizing:border-box}
#community{margin:28px auto 0;border-radius:32px 32px 0 0;padding-top:88px}
#start{margin:0 auto 28px;border-radius:0 0 32px 32px;padding-bottom:96px}
#community>*,#start>*{max-width:1100px;margin-left:auto;margin-right:auto}
#community{padding-bottom:12px}#start{padding-top:24px}
.footer{background:#fff;border-top:1px solid var(--border)}
.footer .tl-socials a{color:var(--dim2)}
.nav{background:rgba(247,247,251,.88);border-bottom:1px solid var(--border)}
.nav.scrolled{background:rgba(247,247,251,.96)}
.nav-cta{background:var(--neon);color:#04120b}
.nav-menu{background:#fff;border-color:var(--border);box-shadow:0 20px 50px rgba(20,23,31,.14)}
.nav-menu a:hover,.nav-menu a:focus-visible{background:#f2fbf6}
.btn-primary,.price-btn.pro-btn,.tl-demo-input button{background:var(--neon);color:#04120b}
.btn-primary:hover{box-shadow:0 8px 24px rgba(0,255,136,.35)}
.btn-secondary{background:#fff;border-color:var(--border2);color:var(--text)}
.btn-secondary:hover{background:#f6f7fa;border-color:var(--accent)}
.section-badge{background:#ecfdf3;border-color:#bff2d6;color:#008a4d}
.dark-band .section-badge,.xray-section .section-badge,#community .section-badge,#start .section-badge{background:rgba(0,255,136,.06);border-color:rgba(0,255,136,.15);color:#00ff88}
.tl-marquee-section{border-top:1px solid var(--border);background:none;padding-top:28px;margin-top:8px}
.tl-marquee-item{color:#14171f;opacity:.82;filter:none}
.tl-marquee-item:hover{opacity:1;filter:none}
.tl-marquee-label{color:var(--dim)}
.tl-marquee-label::before,.tl-marquee-label::after{background:linear-gradient(90deg,transparent,#d5d8e2)}
.tl-demo-card{background:#fff;border:1px solid var(--border);box-shadow:0 20px 60px rgba(20,23,31,.08)}
.tl-demo-card::before{display:none}
.tl-demo h2{background:none;-webkit-text-fill-color:initial;color:var(--text)}
.tl-demo-input{background:#f5f6f9;border-color:var(--border2)}
.tl-demo-input input{color:var(--text)}
.tl-demo-analyze select,.tl-demo-analyze button{background:#f5f6f9;border-color:var(--border2);color:var(--text)}
.tl-demo-chip{background:#f3f4f7;border-color:var(--border);color:var(--dim2)}
.tl-demo-chip:hover{background:#ecfdf3;border-color:#bff2d6;color:var(--text)}
.tl-demo-meta{color:var(--dim)}
.price-card{background:#fff;border-color:var(--border);box-shadow:0 12px 40px rgba(20,23,31,.06)}
.price-card.featured{border-color:#00d97a;box-shadow:0 20px 60px rgba(0,217,122,.14)}
.price-card.featured::before{background:var(--neon);color:#04120b}
.price-btn.free-btn,.price-btn.elite-btn{background:#f5f6f9;border:1px solid var(--border2);color:var(--text)}
.price-features li .check{color:var(--accent)}
.tl-compare-wrap{background:#fff;border:1px solid var(--border);box-shadow:0 16px 48px rgba(20,23,31,.08);color:var(--text)}
.tl-compare-wrap::before{display:none}
.tl-compare-table thead th{background:#f7f8fa;color:#4b5563;border-bottom:1px solid #eceef3}
.tl-compare-table thead th.us{color:#006b3b;background:#ecfdf3;text-shadow:none}
.tl-compare-table thead th.us::after{content:none}
.tl-compare-table th,.tl-compare-table td{border-bottom:1px solid #eceef3}
.tl-compare-table tbody tr:nth-child(even){background:#fafbfc}
.tl-compare-table tbody tr:hover{background:#f2fbf6}
.tl-compare-table td.feat{color:var(--text)}
.tl-compare-table td.us{color:var(--text);background:#f6fdf9}
.tl-compare-table td.them{color:#2b3040;font-weight:500}
.tl-compare-table .ck{background:#00e07a;color:#04120b;box-shadow:none}
.tl-compare-table .ex{background:#ffe3e3;color:#c92a2f;border-color:#f0b4b4}
.modal-overlay{background:rgba(20,23,31,.5)}
.auth-modal{background:#fff;border:1px solid var(--border);box-shadow:0 30px 80px rgba(20,23,31,.28)}
.auth-modal::before{display:none}
.modal-logo .icon.mark{background:none;width:48px;height:48px;border-radius:0}
.modal-logo .icon.mark svg{display:block}
.modal-logo .name{color:var(--text);letter-spacing:2.5px}
.auth-tabs{border-color:var(--border2)}
.auth-tab{color:var(--dim)}
.auth-tab.active{background:#ecfdf3;color:#006b3b}
.auth-tab:hover:not(.active){background:#f7f8fa}
.auth-reason{background:#ecfdf3;border-color:#bff2d6;color:var(--text)}
.form-label{color:var(--dim)}
.form-input{background:#fff;border:1px solid var(--border2);color:var(--text)}
.form-input::placeholder{color:#9aa0ad}
.form-input:focus{border-color:#00c46e;box-shadow:0 0 0 3px rgba(0,255,136,.18)}
#googleAuthBtn{background:#fff !important;border:1px solid var(--border2) !important;color:var(--text) !important}
#googleAuthBtn:hover{background:#f7f8fa !important}
.auth-modal .captcha-wrap>div{background:#f7f8fa !important;border-color:var(--border2) !important}
.rps-btn{background:#fff;border-color:var(--border2);color:var(--text)}
.rps-btn:hover{background:#ecfdf3;border-color:#00c46e}
.rps-btn.selected{background:#ecfdf3;border-color:#00c46e;box-shadow:none}
.submit-btn{background:var(--neon);color:#04120b}
.submit-btn:hover{box-shadow:0 6px 18px rgba(0,255,136,.3)}
.tl-box{background:#fff;border-color:var(--border2)}
.tl-check-label{color:var(--dim2)}
.tl-check:hover .tl-check-label{color:var(--text)}
.pw-toggle{color:var(--dim)}
.pw-toggle:hover{background:#f2f3f6;color:var(--text)}
.pw-strength{background:#eceef3}
.modal-close{color:var(--dim)}
.modal-close:hover{background:#f2f3f6;color:var(--text)}
.auth-footer{color:var(--dim)}
.auth-footer a{color:#006b3b}
.auth-link{color:var(--dim2)}
.auth-link:hover:not(:disabled){color:#006b3b}
.auth-modal .form-group>div[style*="rgba(255,255,255"]{background:#f7f8fa !important}
.tour-copy{color:var(--dim2)}
.tl-reveal{transform:translateY(24px)}
.tl-typed::after{color:var(--accent);-webkit-text-fill-color:var(--accent);text-shadow:none}
.auth-modal{background:#fff;color:var(--text)}

/* ── hero: Binance-style left, laptop loupe right ── */
.hero{background:none;min-height:auto;padding:84px 48px 56px;width:100%;max-width:none;margin:56px auto 0;border-radius:0;box-sizing:border-box}
.hero-inner{gap:52px;align-items:center;max-width:1320px}
.hero .hero-text{flex:0 1 500px;min-width:0}
.hero h1.hero-h1{-webkit-background-clip:border-box;background-clip:border-box;font-size:clamp(38px,4.1vw,58px);font-weight:800;line-height:1.06;letter-spacing:-1.2px;color:#14171f;margin:0 0 18px;background:none;-webkit-text-fill-color:#14171f}
.hero-cycle{position:relative;display:inline-block;height:1.32em;margin-bottom:-.26em;vertical-align:bottom;overflow:hidden;clip-path:inset(0)}
.cyc-ghost{visibility:hidden;white-space:nowrap}
.hero-cycle .cyc{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;transform:translateY(45%);transition:none}
.hero-cycle .cyc.on,.hero-cycle .cyc.out{transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .16s}
.hero-cycle .cyc.on{opacity:1;transform:translateY(0)}
.hero-cycle .cyc.out{opacity:0;transform:translateY(-45%)}
.hero .hero-sub{color:#4b5563;font-size:18px;max-width:540px;margin-bottom:26px}
.hero-signup{display:flex;gap:10px;max-width:520px;margin-bottom:30px}
.hero-signup-box{flex:1;display:flex;align-items:center;gap:10px;min-height:52px;padding:0 14px;background:#fff;border:1px solid #d5d8e2;border-radius:10px;cursor:text;box-shadow:0 1px 2px rgba(20,23,31,.04)}
.hero-signup-box svg{width:18px;height:18px;fill:none;stroke:#6b7280;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.hero-signup-box input{flex:1;min-width:0;border:none;background:transparent;font:inherit;font-size:15px;color:#14171f;outline:none}
.hero-signup-box input::placeholder{color:#8a8f9c}
.hero-signup-box:focus-within{border-color:#00c46e;box-shadow:none}
.hero-signup-box input:focus,.hero-signup-box input:focus-visible{outline:none;box-shadow:none}
.hero-signup-btn{min-height:52px;padding:0 26px;border:none;border-radius:10px;background:var(--neon);color:#04120b;font:inherit;font-size:15px;font-weight:800;cursor:pointer;white-space:nowrap;transition:filter .2s,transform .2s}
.hero-signup-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.hero-signup-btn:focus-visible{outline:2px solid #14171f;outline-offset:2px}
.hero-note{font-size:12.5px;color:#6b7280;margin-bottom:30px}
.hero-tools{padding-top:18px;border-top:1px solid #e6e8ef}
.hero-tools-label{font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:#6b7280;margin-bottom:10px;font-family:'SF Mono','Fira Code',monospace}
.hero-chips{display:flex;flex-wrap:wrap;gap:6px}
.hero-chip{display:inline-flex;align-items:center;min-height:30px;padding:0 11px;border-radius:999px;border:1px solid #d5d8e2;color:#2b3040;font-size:12.5px;text-decoration:none;background:#fff;transition:border-color .2s,background .2s}
.hero-chip:hover{border-color:#00c46e;background:#ecfdf3;color:#14171f}


.hero-screen{flex:1 1 0;min-width:0;max-width:760px}
.xr-hero{margin:0;display:block;max-width:none;justify-items:normal}
.xr-screen{width:100%}
.xr-screen{position:relative;background:#14141c;border:1px solid #2b2b3c;border-radius:20px;padding:10px;box-shadow:0 40px 90px -30px rgba(20,23,31,.55),0 0 0 1px rgba(255,255,255,.03) inset}
.xr-screen::before{content:"";position:absolute;left:50%;top:4px;width:5px;height:5px;border-radius:50%;background:#000;transform:translateX(-50%)}
.xr-hero .xr-frame{aspect-ratio:1920/1080;border-radius:12px;border:1px solid #1e1e2c}
.xr-hero .xr-after{display:block;position:absolute;inset:0;clip-path:inset(0 100% 0 0);transition:clip-path 1.25s cubic-bezier(.65,0,.35,1);z-index:1}
.xr-hero.showing .xr-after{clip-path:inset(0 0 0 0)}
.xr-sweep{position:absolute;top:0;bottom:0;left:0;width:2px;background:linear-gradient(180deg,transparent,#00ff88 30%,#00ff88 70%,transparent);box-shadow:0 0 16px 3px rgba(0,255,136,.55);opacity:0;z-index:2;pointer-events:none;transition:left 1.25s cubic-bezier(.65,0,.35,1),opacity .25s}
.xr-hero.showing .xr-sweep{left:calc(100% - 2px)}
.xr-hero.sweeping .xr-sweep{opacity:1}
.xr-hero .xr-lens{z-index:3}
.xr-hero .xr-echo{z-index:2}
.xr-pill{position:absolute;left:50%;bottom:12px;transform:translateX(-50%) translateY(6px);padding:7px 12px;border-radius:999px;background:rgba(10,10,15,.85);border:1px solid rgba(0,255,136,.35);color:#e0e0e0;font-size:11.5px;letter-spacing:.2px;white-space:nowrap;opacity:0;transition:opacity .4s,transform .4s;z-index:4;pointer-events:none}
.xr-hero.hinting .xr-pill{opacity:1;transform:translateX(-50%) translateY(0)}
@media(hover:none){.xr-pill{display:none}}
.xr-hero .xr-toggle{margin-top:14px}
@media(max-width:1024px){.hero-inner{flex-direction:column;align-items:stretch;gap:36px}.hero .hero-text{flex:0 0 auto}.hero-screen{width:100%;max-width:720px;align-self:center;margin:0 auto}}
/* (ipadhero) iPad portrait and other 740-1024px screens: the text on the left and the before/after screen beside it,
   as on desktop (it used to stack under the text). !important only where the old 768/820px phone rules use it. */
@media (min-width:740px) and (max-width:1024px){
body .hero-inner{flex-direction:row !important;align-items:center !important;text-align:left !important;gap:28px}
body .hero-text{width:auto !important;text-align:left !important}
body .hero-text>*{margin-left:0 !important;margin-right:0 !important}
.hero{padding-left:32px;padding-right:32px}
.hero .hero-text{flex:0 1 46%}
.hero h1.hero-h1{font-size:clamp(32px,4.4vw,44px);text-align:left}
.hero .hero-sub{font-size:16px;text-align:left;max-width:none}
body .hero-visual.hero-screen{flex:1 1 0;width:auto;max-width:none !important;margin:0 !important;align-self:center}
/* the email box kept a 230px minimum from the input's intrinsic size, which pushed Sign Up past the column below 820px */
.hero-signup-box{min-width:0}
.hero-signup-box input{width:100%}
}
/* (ipadhero) the before/after switch under the hero screen, now shown to everyone (it only showed with reduced motion) */
.xr-hero .xr-toggle{position:relative;display:grid;grid-template-columns:1fr 1fr;width:max-content;max-width:100%;margin:16px auto 0;padding:4px;border-radius:999px;background:#14141c;border:1px solid #2b2b3c;box-shadow:0 12px 30px -14px rgba(20,23,31,.55)}
.xr-hero .xr-toggle::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--neon,#00e07a);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.xr-hero .xr-toggle.is-after::before{transform:translateX(100%)}
.xr-hero .xr-toggle button,.xr-hero .xr-toggle button:first-child,.xr-hero .xr-toggle button:last-child{position:relative;z-index:1;min-height:36px;margin:0;padding:0 16px;border:0;border-radius:999px;background:transparent;color:#a3a8b5;font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;transition:color .25s;touch-action:manipulation}
.xr-hero .xr-toggle button:hover{color:#fff}
.xr-hero .xr-toggle button[aria-pressed="true"]{color:#04120b;background:transparent;border-color:transparent}
.xr-hero .xr-toggle button:focus-visible{outline:2px solid var(--neon,#00e07a);outline-offset:2px}
/* (phonehero1) owner 2026-09-16, phone screenshot: the before/after screen "should be below the leading analytical
   software for traders and on top of open your chart button", and it looked squeezed. Below 740px the text column's
   children become flex items of the hero, ordered headline, subtitle, screen, button, tools. The screen fills the column
   and shows a taller 4:3 crop of the same two pictures, anchored on the right where the levels, the labels and the AI's
   read are, so a phone gets a readable picture instead of a whole desktop shrunk to 320px. Desktop and iPads (740px and
   up) are unchanged. */
@media (max-width:739px){
  body .hero-text{display:contents}
  body .hero-inner{gap:0 !important}
  .hero h1.hero-h1{order:1;margin-bottom:14px}
  .hero .hero-sub{order:2;margin-bottom:18px}
  body .hero-visual.hero-screen{order:3;width:100% !important;max-width:100% !important;margin:0 auto 20px !important}
  .hero .hero-signup{order:4;width:100%;max-width:520px;margin-bottom:26px}
  .hero .hero-tools{order:5;width:100%}
  .xr-hero .xr-screen{padding:7px;border-radius:16px}
  .xr-hero .xr-frame{aspect-ratio:4/3;border-radius:11px}
  .xr-hero .xr-base{object-position:100% 50%}
  .xr-hero .xr-toggle{margin-top:12px}
}
/* (phonehero1) the recorded tour on phones: the phone-shaped frame is sized from the screen height so the whole
   recording is on screen at once (it was 9:19.5 of a 360px width, taller than the screen on every phone). */
@media (max-width:640px){
  .tour-stage{width:-webkit-fit-content;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto}
  .tour-frame{width:-webkit-fit-content;width:fit-content;max-width:100%;box-sizing:border-box}
  .tour-video{width:auto;max-width:100%;height:clamp(420px,100vh - 200px,660px);height:clamp(420px,100svh - 130px,660px);aspect-ratio:9/19.5}
}
@media(prefers-reduced-motion:reduce){.xr-hero .xr-toggle::before,.xr-hero .xr-after{transition:none}}
@media(max-width:640px){.hero{padding:28px 18px 24px;width:100%;margin-top:56px;border-radius:0}.xray-section,#community,#start{width:calc(100% - 20px)}.xray-section{padding:56px 20px;border-radius:20px}#community{border-radius:20px 20px 0 0}#start{border-radius:0 0 20px 20px}.hero-signup{flex-direction:column}.hero-signup-btn{width:100%}.hero-h1{font-size:38px}}

/* ── market summary ── */
.ms{max-width:1100px;text-align:left}
.ms-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px}
.ms-top .section-title{margin:0}
.ms-all{color:var(--accent);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap}
.ms-all:hover{text-decoration:underline}
.ms-grid{display:grid;grid-template-columns:1fr 330px;gap:18px;align-items:stretch}
.ms-main,.ms-side{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 12px 40px rgba(20,23,31,.06)}
.ms-main{padding:18px 22px 20px;min-width:0}
.ms-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:8px}
.ms-ident{display:flex;align-items:center;gap:12px}
.ms-icon{width:42px;height:42px;border-radius:50%;background:#ecfdf3;color:#008a4d;display:grid;place-items:center;font-weight:800;font-size:19px;flex:0 0 auto}
.ms-name{font-weight:700;font-size:16px;color:var(--text)}
.ms-sym{font-size:12px;color:var(--dim)}
.ms-quote{text-align:right}
.ms-price{font-size:26px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums;color:var(--text)}
.ms-chg{font-size:13px;font-weight:600}
.ms-chg.up,.ms-row-chg.up{color:#00994d}.ms-chg.down,.ms-row-chg.down{color:#d93a3f}
.ms-chart{position:relative;height:250px;margin:6px 0 2px}
.ms-chart svg{width:100%;height:100%;display:block}
.ms-axis{display:flex;justify-content:space-between;font-size:11px;color:var(--dim);font-family:'SF Mono','Fira Code',monospace;margin-bottom:12px}
.ms-actions{display:flex;gap:10px;flex-wrap:wrap}
.ms-actions .btn-primary,.ms-actions .btn-secondary{min-height:44px}
.ms-side{padding:14px;display:flex;flex-direction:column;min-width:0}
.ms-side-title{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;padding:4px 8px 10px}
.ms-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto auto;align-items:center;gap:10px;width:100%;min-height:48px;padding:6px 8px;border:none;border-radius:10px;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text);transition:background .15s}
.ms-row:hover{background:#f5f6f9}
.ms-row.on{background:#ecfdf3}
.ms-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.ms-row-icon{width:28px;height:28px;border-radius:50%;background:#f3f4f7;display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--dim2)}
.ms-row.on .ms-row-icon{background:#bff2d6;color:#006b3b}
.ms-row-name{font-weight:600;font-size:13.5px;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-row-name small{display:block;font-size:11px;color:var(--dim);font-weight:500}
.ms-row-price{font-variant-numeric:tabular-nums;font-size:13px;font-weight:600}
.ms-row-chg{font-size:12px;font-weight:700;min-width:56px;text-align:right;font-variant-numeric:tabular-nums}
.ms-more{margin-top:auto;padding:12px 8px 4px;font-size:12.5px;color:var(--accent);text-decoration:none;font-weight:600}
.ms-more:hover{text-decoration:underline}
.ms-note{margin-top:12px;font-size:12px;color:var(--dim)}
@media(max-width:900px){.ms-grid{grid-template-columns:1fr}.ms-chart{height:190px}.ms-price{font-size:22px}}
@media(max-width:640px){.ms-main{padding:16px}.ms-actions .btn-primary,.ms-actions .btn-secondary{width:100%;justify-content:center}}

/* market summary, terminal look */
.ms-grid{background:radial-gradient(60% 80% at 0% 0%,rgba(0,255,136,.10),transparent 60%),#0a0a0f;border-radius:28px;padding:20px;gap:16px}
.ms-main,.ms-side{background:#0d0d14;border:1px solid #1c1c2a;box-shadow:none;--text:#e0e0e0;--dim:#8a8f9c;--dim2:#a3a8b5;color:#e0e0e0}
.ms-icon{background:rgba(0,255,136,.12);color:#00ff88}
.ms-name,.ms-price{color:#fff}
.ms-chg.up,.ms-row-chg.up{color:#00ff88}.ms-chg.down,.ms-row-chg.down{color:#ff4d5a}
.ms-chart{height:236px}
.ms-axis{color:#6b7280}
.ms-actions .btn-secondary{background:transparent;border-color:#2a2a3a;color:#e0e0e0}
.ms-actions .btn-secondary:hover{background:rgba(255,255,255,.05);border-color:#00ff88}
.ms-side-title{color:#8a8f9c}
.ms-row{color:#e0e0e0}
.ms-row:hover{background:rgba(255,255,255,.05)}
.ms-row.on{background:rgba(0,255,136,.1)}
.ms-row-icon{background:rgba(255,255,255,.08);color:#c7cbd6}
.ms-row.on .ms-row-icon{background:rgba(0,255,136,.2);color:#00ff88}
.ms-row-name small{color:#8a8f9c}
.ms-more{color:#00ff88}
@media(max-width:900px){.ms-grid{padding:12px;border-radius:20px}.ms-chart{height:200px}}

.ms-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:11px;color:#8a8f9c;margin:2px 0 4px;font-family:'SF Mono','Fira Code',monospace;letter-spacing:.3px}
.ms-legend span{display:inline-flex;align-items:center;gap:6px}
.ms-legend i{width:14px;height:0;border-top:2px dashed #ff4d5a;display:inline-block}
.ms-legend i.s{border-color:#00d68f}.ms-legend i.t{border-top-style:solid;border-color:#00ff88}.ms-legend i.m{width:8px;height:8px;border:none;border-radius:2px;background:#e0e0e0}
.ms-read{margin:4px 0 16px;padding:14px 16px;background:rgba(0,255,136,.04);border:1px solid rgba(0,255,136,.16);border-radius:12px}
.ms-read-head{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#00ff88;font-family:'SF Mono','Fira Code',monospace;margin-bottom:8px}
.ms-read-head span{color:#6b7280;letter-spacing:.3px;text-transform:none;margin-left:8px}
.ms-read ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ms-read li{font-size:13.5px;color:#d5d8e2;line-height:1.5;padding-left:16px;position:relative}
.ms-read li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:#00ff88}
.ms-read li b{color:#fff;font-weight:600}
.ms-read-foot{margin-top:10px;font-size:11.5px;color:#8a8f9c}
.tl-typed{white-space:pre-wrap}
@media(max-width:640px){.ms-legend{gap:10px;font-size:10px}.ms-read li{font-size:12.5px}}

/* Why TradeLabs mega menu */
.nav-mega{position:static}
.nav-menu.mega{position:fixed;top:64px;left:50%;width:min(880px,calc(100vw - 32px));transform:translateX(-50%) translateY(6px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0;padding:0;overflow:hidden;border-radius:18px;box-shadow:0 30px 80px rgba(20,23,31,.18)}
.nav-mega:hover .nav-menu.mega,.nav-mega:focus-within .nav-menu.mega{transform:translateX(-50%) translateY(0)}
.nav-mega::after{left:-40px;right:-40px}
.mega-links{padding:22px 14px 18px 22px;display:flex;flex-direction:column;gap:2px}
.mega-label{font-size:10.5px;letter-spacing:1.8px;text-transform:uppercase;color:#008a4d;font-weight:800;margin:0 0 10px 12px}
.nav-menu.mega a.mega-link{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border-radius:12px;min-height:0;text-decoration:none}
.nav-menu.mega a.mega-link:hover{background:#f2fbf6}
.mega-ic{flex:0 0 36px;width:36px;height:36px;border-radius:10px;background:#ecfdf3;display:grid;place-items:center;color:#008a4d}
.mega-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mega-link b{display:block;font-size:14px;font-weight:700;color:var(--text);line-height:1.3}
.mega-link small{display:block;font-size:12.5px;color:var(--dim2);line-height:1.45;margin-top:2px}
.mega-link:hover b{color:#006b3b}
.nav-menu.mega a.mega-feature{display:flex;flex-direction:column;padding:14px;margin:12px 12px 12px 0;border-radius:14px;background:#f7f8fa;border:1px solid var(--border);min-height:0;text-decoration:none}
.nav-menu.mega a.mega-feature:hover{background:#f2fbf6;border-color:#bff2d6}
.mega-feature-img{display:block;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#0d0d14;border:1px solid var(--border)}
.mega-feature-img img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block}
.mega-feature-body{display:block;padding:12px 4px 2px}
.mega-feature-body b{display:block;font-size:15px;font-weight:800;color:var(--text)}
.mega-feature-body small{display:block;font-size:12.5px;color:var(--dim2);line-height:1.5;margin-top:4px}
.mega-feature-body em{display:inline-flex;align-items:center;gap:5px;font-style:normal;font-size:13px;font-weight:700;color:#006b3b;margin-top:10px}
.mega-feature-body em svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.mega-feature:hover em svg{transform:translateX(3px)}
@media(max-width:900px){.nav-mega{display:none}}

/* eyebrows, merged market + AI section, coin logos */
.eyebrow-lite{display:block;text-align:center;font-size:19px;font-weight:800;color:#00d26a;margin-bottom:14px;letter-spacing:3.5px;text-transform:uppercase;text-shadow:none}   /* (eyebrow2) no glow, bright solid green; dark pages keep #00ff88 */  /* (tbar1) bigger, softer glow */
.eyebrow-lite.left{text-align:left}
.xray-section .eyebrow-lite{color:#00ff88}
.ms-top{align-items:flex-end}
.ms-top .section-title{margin:0}
.ms-grid{grid-template-columns:minmax(0,1.25fr) minmax(360px,1fr);align-items:stretch}
.ms-coins{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.ms-coins .ms-row{display:inline-flex;align-items:center;gap:8px;width:auto;min-height:38px;padding:0 12px 0 6px;border:1px solid #1e1e2c;border-radius:999px;background:#111119;color:#e0e0e0;font:inherit;cursor:pointer;transition:border-color .15s,background .15s}
.ms-coins .ms-row:hover{border-color:#2a2a3a;background:#15151f}
.ms-coins .ms-row.on{border-color:rgba(0,255,136,.5);background:rgba(0,255,136,.08)}
.ms-coins .ms-row-icon{width:26px;height:26px;border-radius:50%;background:none;overflow:hidden;display:block}
.ms-coins .ms-row-name{font-size:13px;font-weight:600}
.ms-coins .ms-row-price{font-size:12.5px;color:#c7cbd6;font-weight:500}
.ms-coins .ms-row-chg{min-width:0;font-size:12px}
.coin-logo{width:100%;height:100%;display:block;object-fit:contain;border-radius:50%}.coin-ic-fb{display:block;overflow:hidden;border-radius:50%;background:rgba(127,127,140,.28);color:inherit;flex-shrink:0}.coin-ic-fb svg{display:block;width:100%;height:100%}
.ms-icon{background:none;overflow:hidden}
.ms-side{padding:0;background:none;border:none;box-shadow:none;min-width:0}
.ms-grid .tl-demo-card{height:100%;box-sizing:border-box;margin:0;background:#0d0d14;border:1px solid #1c1c2a;box-shadow:none;color:#e0e0e0;--text:#e0e0e0;--dim:#8a8f9c;--dim2:#a3a8b5;--border:#1c1c2a;--border2:#2a2a3a;padding:22px 22px 18px;display:flex;flex-direction:column}
.ms-grid .tl-demo-card h2{color:#fff;font-size:22px;margin-bottom:6px}
.ms-grid .tl-demo-sub{font-size:13px;color:#a3a8b5;margin-bottom:14px;max-width:none}
.ms-grid .tl-demo-analyze{grid-template-columns:1fr 1fr;gap:8px}
.ms-grid .tl-demo-analyze button{grid-column:1/-1;align-self:auto;background:#14141c;border-color:#2a2a3a;color:#e0e0e0}
.ms-grid .tl-demo-analyze button:hover{border-color:#00ff88}
.ms-grid .tl-demo-analyze select{background:#14141c;border-color:#2a2a3a;color:#e0e0e0}
.ms-grid .tl-demo-input{background:#14141c;border-color:#2a2a3a}
.ms-grid .tl-demo-input input{color:#e0e0e0}
.ms-grid .tl-demo-input input::placeholder{color:#6b7280}
.ms-grid .tl-demo-chip{background:#14141c;border-color:#2a2a3a;color:#c7cbd6;padding:6px 11px;font-size:11.5px}
.ms-grid .tl-demo-chip:hover{border-color:rgba(0,255,136,.5);background:rgba(0,255,136,.06);color:#fff}
.ms-grid .tl-demo-suggest{margin-top:10px}
.ms-grid .tl-demo-meta{margin-top:auto;padding-top:12px;color:#8a8f9c}
@media(max-width:900px){.ms-grid{grid-template-columns:1fr}.ms-top{flex-direction:column;align-items:flex-start;gap:6px}}

/* ═══ navbar (Shopify-style mega menus, self-contained) ═══ */
.tn{position:fixed;top:0;left:0;right:0;height:56px;z-index:1000;display:flex;align-items:center;padding:0 2.5rem;background:#fff;border-bottom:1px solid #e5e7eb;font-size:.85rem;color:#000;font-family:-apple-system,BlinkMacSystemFont,'Inter','Segoe UI',sans-serif}
.tn-brand{display:inline-flex;align-items:flex-end;gap:4px;text-decoration:none;margin-right:3rem;color:#000}
.tn-logo{width:16px;height:22px;display:block;flex:0 0 auto}
.tn-logo rect{fill:#000}
html[data-theme="dark"] .tn-logo rect{fill:#fff}
.tn-brand-text{padding-bottom:1px}
.tn-brand-text{font-size:20px;font-weight:600;letter-spacing:-.02em;line-height:1;color:#000}
.tn-links{display:flex;align-items:center;gap:2rem;flex:1;min-width:0}
.tn-item{display:flex;align-items:center;height:56px}
.tn-link{background:none;border:none;font:inherit;font-size:.85rem;font-weight:400;color:#000;cursor:pointer;padding:.4rem 0;display:inline-flex;align-items:center;text-decoration:none;transition:color .2s}
.tn-link:hover,.tn-item.open>.tn-link{color:#666}
/* (ipadhdr1) a label never wraps onto a second line */
.tn-link{white-space:nowrap}
.tn-caret{display:inline-block;width:0;height:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-top:4.5px solid currentColor;margin-left:.4rem;opacity:.7;transition:transform .2s}
.tn-item.open .tn-caret{transform:rotate(180deg)}
.tn-mega{position:fixed;top:56px;left:0;right:0;width:100vw;background:#fff;box-shadow:0 10px 40px rgba(0,0,0,.1);padding:2.5rem 0;display:none;justify-content:center;z-index:999;text-align:left}
.tn-item.open .tn-mega{display:flex}
.tn-grid{display:grid;grid-template-columns:repeat(3,1fr) 300px;gap:3.5rem;max-width:1400px;width:100%;padding:0 4rem}
.tn-col{display:flex;flex-direction:column}
.tn-h{color:#00b565;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;padding:0 0 1rem}
.tn-dd-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 0;text-decoration:none;color:#000;transition:padding .2s;border-radius:0}
.tn-dd-item:hover{padding-left:.5rem}
.tn-ic{width:18px;height:18px;flex:0 0 18px;opacity:.7;margin-top:2px;color:#000}
.tn-dd-title{display:block;font-size:.875rem;font-weight:500;color:#000;line-height:1.4}
.tn-dd-desc{display:block;font-size:.75rem;color:#666;line-height:1.5;margin-top:2px}
.tn-feat{background:#f9fafb;border-radius:12px;padding:1.25rem;display:flex;flex-direction:column;gap:.25rem}
.tn-feat-img{width:100%;height:84px;object-fit:cover;object-position:left top;border-radius:8px;margin-bottom:.35rem;display:block;background:#0d0d14}
.tn-feat-title{font-size:.9rem;font-weight:600;color:#000;margin:0 0 .35rem}
.tn-fb{margin-bottom:.4rem}.tn-fb:last-child{margin-bottom:0}
.tn-fb-t{font-size:.75rem;font-weight:600;color:#000;line-height:1.3;margin-bottom:.1rem}
.tn-fb-d{font-size:.68rem;color:#666;line-height:1.35}
.tn-right{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.tn-search{position:relative;display:flex;align-items:center}
.tn-search-in{background:transparent;border:1px solid #d1d5db;border-radius:50px;padding:.4rem 1rem;color:#000;font:inherit;font-size:.85rem;width:0;opacity:0;transition:all .3s ease;outline:none;height:32px;box-sizing:border-box}
.tn-search-in.active{width:200px;opacity:1;margin-right:.5rem}
.tn-search-in::placeholder{color:#999}
.tn-icon-btn{background:transparent;border:none;color:#000;padding:.4rem;cursor:pointer;display:flex;align-items:center;justify-content:center;height:32px;width:32px;border-radius:50%;transition:color .2s}
.tn-icon-btn:hover{color:#666}
.tn-icon-btn svg{width:16px;height:16px}
.tn-search-res{position:absolute;top:calc(100% + .5rem);right:0;background:#fff;border:1px solid #e5e7eb;border-radius:12px;width:400px;max-width:calc(100vw - 2rem);max-height:400px;overflow-y:auto;display:none;z-index:1001;box-shadow:0 10px 40px rgba(0,0,0,.1)}
.tn-search-res.active{display:block}
.tn-sr{padding:1rem 1.5rem;display:flex;align-items:center;gap:1rem;text-decoration:none;color:#000;transition:background .2s}
.tn-sr:hover{background:#f9fafb}
.tn-sr svg{width:20px;height:20px;flex:0 0 20px;opacity:.7;color:#000}
.tn-sr-cat{font-size:.75rem;color:#00b565;text-transform:uppercase;letter-spacing:.05em}
.tn-sr-title{font-size:.95rem;font-weight:500;color:#000}
.tn-sr-desc{font-size:.8rem;color:#666;margin-top:.25rem}
.tn-empty{padding:3rem 1.5rem;text-align:center;color:#666}
.tn-signin{color:#000;text-decoration:none;font-size:.85rem;padding:.4rem .5rem}
.tn-signin:hover{color:#666}
.tn-cta{background:#00FE87;color:#000;padding:0 1.25rem;border-radius:50px;font:inherit;font-size:.85rem;font-weight:600;border:none;height:32px;display:inline-flex;align-items:center;cursor:pointer;transition:all .2s;white-space:nowrap}
.tn-cta:hover{background:#00e577;transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,254,135,.3)}
.tn-burger{display:none;margin-left:auto;background:none;border:none;width:40px;height:40px;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;padding:8px}
.tn-burger{color:#000}.tn-burger svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}   /* (burger1) a phone that forces its own dark mode darkens background colours but keeps text light, so the lines are drawn in the text colour */
/* (ipadhdr1) the full header needs ~1,250 px, so tablets and small laptops (992-1199 px) get the menu button too; it was cut off on iPads */
@media(max-width:1199px){
  .tn{padding:0 1.25rem}
  .tn-brand{margin-right:0}
  .tn-burger{display:flex}
  .tn-links{display:none;position:fixed;top:56px;left:0;right:0;bottom:0;overflow-y:auto;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 2rem}
  .tn.open .tn-links{display:flex}
  .tn-item{height:auto;flex-direction:column;align-items:stretch;border-bottom:1px solid #f0f0f0}
  .tn-link{padding:.85rem 0;font-size:1rem;justify-content:space-between;width:100%}
  .tn-mega{position:static;width:auto;box-shadow:none;padding:0 0 .75rem;display:none}
  .tn-item.open .tn-mega{display:block}
  .tn-grid{grid-template-columns:1fr;gap:1rem;padding:0}
  .tn-feat{display:none}
  .tn-h{padding-bottom:.4rem}
  .tn-right{margin:1rem 0 0;flex-direction:column;align-items:stretch;gap:.6rem}
  .tn-search{display:none}
  .tn-signin,.tn-cta{width:100%;justify-content:center;text-align:center}
}
/* (landfix1) the header's contents sit in the same centered 1200px column as the page sections; every page gets this header */
@media(min-width:1281px){.tn{padding-left:calc((100% - 1200px)/2);padding-right:calc((100% - 1200px)/2)}}

/* navbar extras: theme toggle, language menu, why-menu feature card */
.tn-theme{background:transparent;border:none;color:#000;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}
.tn-theme:hover{background:rgba(0,0,0,.05)}
.tn-theme svg{width:18px;height:18px}
.tn-theme .tn-sun{display:none}
html[data-theme="dark"] .tn-theme .tn-moon{display:none}
html[data-theme="dark"] .tn-theme .tn-sun{display:block}
.tn-lang{position:relative;display:flex;align-items:center}
.tn-lang-btn{width:auto;padding:.4rem .65rem;gap:.4rem;border-radius:0;font-size:.8rem}
.tn-lang-menu{position:absolute;top:calc(100% + 1rem);right:0;min-width:200px;padding:1rem;border-radius:12px;background:#fff;border:1px solid #e5e7eb;box-shadow:0 4px 12px rgba(0,0,0,.08);display:none;z-index:1001}
.tn-lang.open .tn-lang-menu{display:block}
.tn-lang-menu a{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1rem;border-radius:8px;color:#000;text-decoration:none;font-size:.85rem;transition:background .2s,transform .2s}
.tn-lang-menu a:hover{background:#f9fafb;transform:translateX(4px)}
.tn-lang-menu a.on{color:#00b565;font-weight:600}
.tn-lang-menu small{font-size:.65rem;color:#999;text-transform:uppercase;letter-spacing:.05em}
/* (i18n1) the language menu: a search box and every language Microsoft Translator offers, English first */
.tn-lang-menu{width:290px;min-width:0;padding:.6rem}
.tn-lang-code{font-weight:600}.tn-lang-btn{font-family:inherit}
.tn-lang-name{display:none}
.tn-lang-q{display:block;width:100%;box-sizing:border-box;margin:0 0 .45rem;padding:.55rem .75rem;border:1px solid #e5e7eb;border-radius:8px;background:#fff;color:#000;font:inherit;font-size:.85rem;outline:none}
.tn-lang-q:focus{border-color:#00b565}
.tn-lang-list{max-height:min(60vh,420px);overflow-y:auto;overscroll-behavior:contain}
.tn-lang-opt{display:flex;width:100%;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .75rem;border:0;border-radius:8px;background:transparent;color:#000;font:inherit;font-size:.85rem;text-align:left;cursor:pointer}
.tn-lang-opt:hover,.tn-lang-opt:focus-visible{background:#f3f4f6;outline:none}
.tn-lang-opt.on{color:#00b565;font-weight:600}
.tn-lang-opt small{font-size:.7rem;font-weight:400;color:#8a8f9c;white-space:nowrap;text-transform:none;letter-spacing:0}
.tn-lang-sep{height:1px;margin:.35rem .25rem;background:#eef0f3}
.tn-lang-empty{padding:.6rem .75rem;font-size:.8rem;color:#8a8f9c}
.tn-lang-by{padding:.45rem .75rem 0;font-size:.68rem;color:#8a8f9c}
html[data-theme="dark"] .tn-lang-q{background:#111118;border-color:#252540;color:#fff}
html[data-theme="dark"] .tn-lang-opt{color:#fff}
html[data-theme="dark"] .tn-lang-opt:hover,html[data-theme="dark"] .tn-lang-opt:focus-visible{background:#1a1a1a}
html[data-theme="dark"] .tn-lang-opt.on{color:#00d9a3}
html[data-theme="dark"] .tn-lang-sep{background:#1a1a2e}
/* (i18n2) the one-time note after the site switched to the device language */
.tl-i18n-hint{position:fixed;top:72px;right:16px;z-index:2147482000;max-width:340px;display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:12px;background:#111118;color:#f2f2f5;border:1px solid #2a2a3e;box-shadow:0 12px 40px rgba(0,0,0,.35);font:500 13px/1.45 -apple-system,BlinkMacSystemFont,'Inter','Segoe UI',sans-serif;text-align:left}
.tl-i18n-hint-b{display:flex;gap:8px;align-items:center}
.tl-i18n-hint button{font:inherit;font-size:12.5px;font-weight:700;border-radius:8px;padding:7px 12px;cursor:pointer;border:1px solid #2a2a3e;background:transparent;color:#f2f2f5}
.tl-i18n-hint .tl-i18n-hint-more{background:#00ff88;border-color:#00ff88;color:#04120b}
.tl-i18n-hint .tl-i18n-hint-x{margin-left:auto;border:0;padding:2px 8px;font-size:18px;line-height:1;opacity:.7}
@media(max-width:640px){.tl-i18n-hint{top:64px;left:12px;right:12px;max-width:none}}
.tl-i18n-bar{position:fixed;left:0;right:0;top:0;height:2px;background:#00b565;z-index:2147483000;pointer-events:none;animation:tlI18nBusy 1.1s ease-in-out infinite}
@keyframes tlI18nBusy{0%{opacity:.25}50%{opacity:1}100%{opacity:.25}}
.tn-feat-link{text-decoration:none}
.tn-fb-cta{color:#00b565}
.tn-feat-link:hover .tn-fb-cta{text-decoration:underline}
@media(max-width:1199px){.tn-theme{align-self:flex-start}
  /* (i18n1) phones and tablets: the language button sits in the menu panel and its list opens in place */
  .tn-lang{display:block;width:100%}
  .tn-lang-btn{width:100%;height:auto;justify-content:flex-start;padding:.7rem 0;font-size:1rem}
  .tn-lang-name{display:inline}
  .tn-lang-code{display:none}
  .tn-lang-menu,html[data-theme="dark"] .tn-lang-menu{position:static;width:100%;box-shadow:none;margin:.25rem 0 .5rem}
  .tn-lang-list{max-height:45vh}}

/* ═══ dark mode for the landing page (toggle in the navbar, remembered in localStorage) ═══ */
html[data-theme="dark"]{--bg:#0a0a0f;--surface:#111118;--card:#0d0d14;--border:#1a1a2e;--border2:#252540;--text:#e0e0e0;--dim:#8a8f9c;--dim2:#a3a8b5;--accent:#00ff88;--accent2:#00cc6a;--neon:#00ff88}
html[data-theme="dark"],html[data-theme="dark"] *{scrollbar-color:#3a3f4c #0a0a0f}
html[data-theme="dark"]::-webkit-scrollbar-track{background:#0a0a0f}html[data-theme="dark"]::-webkit-scrollbar-thumb{background:#3a3f4c;border-color:#0a0a0f}
html[data-theme="dark"] body{background:#0a0a0f;color:#e0e0e0}
html[data-theme="dark"] .tn{background:#0a0a0f;border-bottom-color:#0a0a0f;color:#fff}
html[data-theme="dark"] .tn-brand-text,html[data-theme="dark"] .tn-link,html[data-theme="dark"] .tn-signin,html[data-theme="dark"] .tn-icon-btn,html[data-theme="dark"] .tn-theme,html[data-theme="dark"] .tn-dd-title,html[data-theme="dark"] .tn-ic,html[data-theme="dark"] .tn-feat-title,html[data-theme="dark"] .tn-fb-t,html[data-theme="dark"] .tn-sr-title,html[data-theme="dark"] .tn-sr svg,html[data-theme="dark"] .tn-lang-menu a{color:#fff}
html[data-theme="dark"] .tn-link:hover,html[data-theme="dark"] .tn-item.open>.tn-link,html[data-theme="dark"] .tn-signin:hover,html[data-theme="dark"] .tn-icon-btn:hover{color:#ccc}
html[data-theme="dark"] .tn-theme:hover{background:rgba(255,255,255,.1)}
html[data-theme="dark"] .tn-burger{color:#fff}
html[data-theme="dark"] .tn-mega{background:#0a0a0f;box-shadow:0 10px 40px rgba(0,0,0,.8)}
html[data-theme="dark"] .tn-links{background:transparent;box-shadow:none}
@media(max-width:1199px){html[data-theme="dark"] .tn-links{background:#0a0a0f}}
html[data-theme="dark"] .tn-item{border-color:#1a1a2e}
html[data-theme="dark"] .tn-h{color:#00d9a3}
html[data-theme="dark"] .tn-dd-desc,html[data-theme="dark"] .tn-fb-d,html[data-theme="dark"] .tn-sr-desc{color:#888}
html[data-theme="dark"] .tn-feat{background:#111118}
html[data-theme="dark"] .tn-fb-cta,html[data-theme="dark"] .tn-lang-menu a.on,html[data-theme="dark"] .tn-sr-cat{color:#00d9a3}
html[data-theme="dark"] .tn-search-in{border-color:#333;color:#fff}
html[data-theme="dark"] .tn-search-in::placeholder{color:#666}
html[data-theme="dark"] .tn-search-res,html[data-theme="dark"] .tn-lang-menu{background:#0a0a0f;border-color:#1a1a2e;box-shadow:0 10px 40px rgba(0,0,0,.8)}
html[data-theme="dark"] .tn-sr:hover,html[data-theme="dark"] .tn-lang-menu a:hover{background:#1a1a1a}
html[data-theme="dark"] .hero h1.hero-h1{color:#fff;-webkit-text-fill-color:#fff}
html[data-theme="dark"] .hero .hero-sub{color:#c7cbd6}
html[data-theme="dark"] .hero-signup-box{background:#14141c;border-color:#2a2a3a;box-shadow:none}
html[data-theme="dark"] .hero-signup-box input{color:#fff}
html[data-theme="dark"] .hero-signup-box input::placeholder{color:#8a8f9c}
html[data-theme="dark"] .hero-signup-box svg{stroke:#8a8f9c}
html[data-theme="dark"] .hero-tools{border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .hero-tools-label{color:#8a8f9c}
html[data-theme="dark"] .hero-chip{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.14);color:#dfe2ea}
html[data-theme="dark"] .hero-chip:hover{border-color:rgba(0,255,136,.5);background:rgba(0,255,136,.06);color:#fff}
html[data-theme="dark"] .tl-marquee-section{border-color:#1a1a2e}
html[data-theme="dark"] .tl-marquee-item{color:#c9c9d4}
html[data-theme="dark"] .eyebrow-lite{color:#00ff88}
html[data-theme="dark"] .section-title,html[data-theme="dark"] .ms-top .section-title,html[data-theme="dark"] .tl-demo h2{color:#fff}
html[data-theme="dark"] .tl-compare-wrap{background:#101018;border-color:#1a1a2e;box-shadow:none}
html[data-theme="dark"] .tl-compare-table thead th{background:#14141c;color:#8a8f9c;border-color:#1a1a2e}
html[data-theme="dark"] .tl-compare-table thead th.us{background:rgba(0,255,136,.08);color:#00ff88}
html[data-theme="dark"] .tl-compare-table th,html[data-theme="dark"] .tl-compare-table td{border-color:#1a1a2e}
html[data-theme="dark"] .tl-compare-table tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
html[data-theme="dark"] .tl-compare-table tbody tr:hover{background:rgba(0,255,136,.04)}
html[data-theme="dark"] .tl-compare-table td.feat,html[data-theme="dark"] .tl-compare-table td.us{color:#e0e0e0;background:none}
html[data-theme="dark"] .tl-compare-table td.us{background:rgba(0,255,136,.04)}
html[data-theme="dark"] .tl-compare-table td.them{color:#a3a8b5}
html[data-theme="dark"] .tl-compare-table .ex{background:rgba(239,68,68,.12);color:#ef4444;border-color:rgba(239,68,68,.35)}
html[data-theme="dark"] .price-card{background:#111118;border-color:#1a1a2e;box-shadow:none}
html[data-theme="dark"] .price-card.featured{border-color:rgba(0,255,136,.5)}
html[data-theme="dark"] .price-btn.free-btn,html[data-theme="dark"] .price-btn.elite-btn,html[data-theme="dark"] .btn-secondary{background:#14141c;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .footer{background:#0a0a0f;border-color:#1a1a2e}
html[data-theme="dark"] .modal-overlay{background:rgba(0,0,0,.7)}
html[data-theme="dark"] .auth-modal{background:#111118;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .modal-logo .name{color:#e0e0e0}
html[data-theme="dark"] .auth-tabs{border-color:#252540}
html[data-theme="dark"] .auth-tab.active{background:rgba(0,255,136,.1);color:#00ff88}
html[data-theme="dark"] .auth-tab:hover:not(.active){background:rgba(255,255,255,.03)}
html[data-theme="dark"] .auth-reason{background:rgba(0,255,136,.06);border-color:rgba(0,255,136,.25);color:#e0e0e0}
html[data-theme="dark"] .form-input{background:#0d0d14;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .form-input::placeholder{color:#666}
html[data-theme="dark"] #googleAuthBtn{background:#14141c !important;border-color:#252540 !important;color:#e0e0e0 !important}
html[data-theme="dark"] .auth-modal .captcha-wrap>div{background:#0d0d14 !important;border-color:#252540 !important}
html[data-theme="dark"] .rps-btn{background:#14141c;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .tl-box{background:#0d0d14;border-color:#252540}
html[data-theme="dark"] .pw-toggle:hover,html[data-theme="dark"] .modal-close:hover{background:rgba(255,255,255,.06);color:#fff}
html[data-theme="dark"] .ms-note,html[data-theme="dark"] .tour-copy,html[data-theme="dark"] .section-desc{color:#a3a8b5}

/* ═══ navbar menus: roomy rows with descriptions, featured card, full-width bottom strip on every menu ═══ */
.tn-mega{padding:0;flex-direction:column;align-items:center}
.tn-wrap{max-width:1400px;width:100%;display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:start}
.tn-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3.5rem;padding:2.25rem 3rem 1.25rem 4rem}
.tn-col{display:flex;flex-direction:column}
.tn-h{color:#00b565;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;padding:0 0 1rem;margin:0}
.tn-dd-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 0;text-decoration:none;color:#000;transition:padding .2s}
.tn-dd-item:hover{padding-left:.5rem}
.tn-ic{width:18px;height:18px;flex:0 0 18px;opacity:.7;margin-top:2px;color:#000}
.tn-dd-title{display:block;font-size:.875rem;font-weight:500;color:#000;line-height:1.4}
.tn-dd-desc{display:block;font-size:.75rem;color:#666;line-height:1.5;margin-top:2px}
.tn-side{padding:2.25rem 4rem 1.25rem 0}
.tn-feat{display:flex;flex-direction:column;gap:.25rem;background:#f9fafb;border-radius:12px;padding:1.25rem;text-decoration:none}
.tn-feat-img{width:100%;height:84px;object-fit:cover;object-position:left top;border-radius:8px;margin-bottom:.35rem;display:block;background:#0d0d14}
.tn-feat-title{font-size:.9rem;font-weight:600;color:#000;margin:0 0 .35rem}
.tn-fb{margin-bottom:.4rem}.tn-fb:last-child{margin-bottom:0}
.tn-fb-t{font-size:.75rem;font-weight:600;color:#000;line-height:1.3;margin-bottom:.1rem}
.tn-fb-d{font-size:.68rem;color:#666;line-height:1.35}
.tn-side-link{display:block;font-size:.8rem;font-weight:600;color:#00b565;text-decoration:none;margin-top:.45rem}
.tn-side-link:hover,.tn-feat-link:hover .tn-fb-cta{text-decoration:underline}
.tn-coins{display:flex;flex-direction:column;gap:.15rem;margin-bottom:.5rem}
.tn-coin{display:flex;align-items:center;gap:.6rem;padding:.3rem 0;text-decoration:none;color:#000;font-size:.85rem}
.tn-coin img{width:22px;height:22px;border-radius:50%}
.tn-coin:hover{color:#00b565}
.tn-strip{width:100%;border-top:1px solid #eceef3;background:#fafafb;margin:0}
.tn-strip-in{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem;align-items:center;padding:1rem 4rem}
.tn-strip-label{color:#00b565;font-size:.66rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em}
.tn-strip-item{text-decoration:none;color:#000}
.tn-strip-item b{display:block;font-size:.875rem;font-weight:500}
.tn-strip-item span{display:block;font-size:.75rem;color:#666;margin-top:1px}
.tn-strip-item:hover b{color:#00b565}
html[data-theme="dark"] .tn-dd-item,html[data-theme="dark"] .tn-dd-title,html[data-theme="dark"] .tn-ic,html[data-theme="dark"] .tn-coin,html[data-theme="dark"] .tn-strip-item,html[data-theme="dark"] .tn-strip-item b,html[data-theme="dark"] .tn-feat-title,html[data-theme="dark"] .tn-fb-t{color:#fff}
html[data-theme="dark"] .tn-dd-desc,html[data-theme="dark"] .tn-fb-d,html[data-theme="dark"] .tn-strip-item span{color:#888}
html[data-theme="dark"] .tn-coin:hover,html[data-theme="dark"] .tn-strip-item:hover b,html[data-theme="dark"] .tn-side-link,html[data-theme="dark"] .tn-fb-cta{color:#00d9a3}
html[data-theme="dark"] .tn-feat{background:#111118}
html[data-theme="dark"] .tn-strip{background:#0c0e11;border-top-color:#171b20}
@media(max-width:1199px){
  .tn-wrap{display:block}
  .tn-cols{display:block;padding:0 0 .5rem}
  .tn-col{margin-bottom:.5rem}
  .tn-side,.tn-strip{display:none}
}
/* (nav1) owner 2026-09-15: the menus were "too bulky" (Resources covered the whole window on 1280x720 and 1366x768 laptops).
   On desktop each menu is a compact panel under its label, like the owner's reference file: tighter rows that keep their icons,
   small group headings, the strip's links as one slim row, and no side cards (their links are all in the menus). The navbar
   script's place() keeps the panel under its label and inside the window. Phones and tablets keep the menu-button panel. */
@media(min-width:1200px){
  .tn-mega{top:56px;right:auto;left:0;width:auto;max-width:calc(100vw - 32px);margin-top:6px;padding:0;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 18px 50px -12px rgba(16,19,18,.24);background:#fff;align-items:stretch}
  .tn-mega::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
  .tn-wrap{display:block;max-width:none;width:auto}
  .tn-side{display:none}
  .tn-cols{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(230px,270px);gap:0 .4rem;padding:.6rem .6rem .35rem}
  .tn-h{padding:.4rem .6rem .2rem;font-size:.6rem}
  .tn-dd-item{padding:.38rem .6rem;border-radius:8px;gap:.6rem;transition:background .15s}
  .tn-dd-item:hover{padding-left:.6rem;background:#f3f4f6}
  .tn-ic{width:16px;height:16px;flex:0 0 16px;margin-top:2px}
  .tn-dd-title{font-size:.84rem;line-height:1.25}
  .tn-dd-desc{font-size:.72rem;line-height:1.3;margin-top:1px}
  .tn-strip{background:transparent;border-top:1px solid #eef0f3}
  .tn-strip-in{display:flex;flex-wrap:wrap;gap:.2rem 1.25rem;max-width:none;padding:.55rem 1.25rem .65rem}
  .tn-strip-label,.tn-strip-item span{display:none}
  .tn-strip-item b{font-size:.8rem;font-weight:600;color:#007a43}
  .tn-strip-item:hover b{color:#00b565;text-decoration:underline}
  html[data-theme="dark"] .tn-mega{background:#0d0d14;border-color:#1f1f33;box-shadow:0 18px 50px -12px rgba(0,0,0,.8)}
  html[data-theme="dark"] .tn-dd-item:hover{background:#16161f}
  html[data-theme="dark"] .tn-strip{background:transparent;border-top-color:#1f1f33}
  html[data-theme="dark"] .tn-strip-item b{color:#00d9a3}
}
.xray-legend li b{white-space:nowrap}
.xray-legend li span:last-child{flex:1;text-align:right;min-width:0}
/* phones: every section title block is centred, like the compare section */
@media(max-width:768px){
  .xray-copy{text-align:center}
  .xray-copy .eyebrow-lite.left,.ms-top .eyebrow-lite.left{text-align:center}
  .xray-sub{margin-left:auto;margin-right:auto}
  .xray-cta-row{justify-content:center}
  .ms-top{align-items:center;text-align:center}
  .ms-top>div{width:100%}
  .ms-all{margin:0 auto}
  .ms-coins{justify-content:center}
  .ms-note{text-align:center}
  .xray-legend li{grid-template-columns:14px 1fr;row-gap:3px;align-items:start}
  .xray-legend li .xray-chip{margin-top:5px}
  .xray-legend li b{white-space:normal;text-align:left}
  .xray-legend li span:last-child{grid-column:2;text-align:left;font-size:11.5px;line-height:1.45}
}

/* feature cards */
.xray-chat{position:absolute;inset:30px 14px 14px;display:flex;flex-direction:column;gap:8px;font-size:10.5px;line-height:1.45}
.xray-chat .q{align-self:flex-end;max-width:78%;background:rgba(0,170,255,.16);border:1px solid rgba(0,170,255,.35);color:#e6f4ff;padding:7px 10px;border-radius:12px 12px 2px 12px}
.xray-chat .a{align-self:flex-start;max-width:92%;background:rgba(0,255,136,.08);border:1px solid rgba(0,255,136,.25);color:#dff9ec;padding:7px 10px;border-radius:12px 12px 12px 2px}
.xray-ticket{position:absolute;inset:32px 16px 14px;display:flex;flex-direction:column;justify-content:space-between;font-size:10.5px;color:#c7cbd6}
.xray-ticket .row{display:flex;justify-content:space-between;align-items:center}
.xray-ticket .mono{font-family:'SF Mono',monospace;font-size:10px;color:#8a8f9c}
.xray-ticket .big{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.3px}
.xray-ticket .big .up{color:#00ff88}.xray-ticket .big .at{font-size:11px;font-weight:600;color:#8a8f9c;letter-spacing:0}
.xray-ticket .g{color:#00ff88;font-weight:700}
.xray-alerts{position:absolute;inset:32px 14px 14px;display:flex;flex-direction:column;gap:7px}
.xray-alerts .al{padding:7px 10px;border-radius:9px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);display:flex;flex-direction:column;gap:2px}
.xray-alerts .al b{font-size:11px;color:#e0e0e0;font-weight:600}
.xray-alerts .al small{font-size:9.5px;color:#8a8f9c;font-family:'SF Mono',monospace}
.xray-alerts .al.on{border-color:rgba(170,85,255,.45);background:rgba(170,85,255,.10)}
.xray-alerts .al.on b{color:#fff}

.price-packs{display:flex;gap:6px;margin:0 0 16px}
.price-packs button{flex:1;padding:8px 4px;border-radius:9px;border:1px solid var(--border2);background:#fff;font:inherit;font-size:13px;font-weight:700;color:var(--text);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;transition:border-color .15s,background .15s}
.price-packs button small{font-size:10.5px;font-weight:600;color:var(--dim)}
.price-packs button:hover{border-color:#00c46e}
.price-packs button.on{border-color:#00c46e;background:#ecfdf3}
.price-packs button.on small{color:#008a4d}
.price-note{max-width:760px;margin:18px auto 0;font-size:12.5px;color:var(--dim);line-height:1.5}
html[data-theme="dark"] .price-packs button{background:#14141c;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .price-packs button.on{background:rgba(0,255,136,.1);border-color:rgba(0,255,136,.5)}
html[data-theme="dark"] .price-packs button.on small{color:#00ff88}
/* ── auth modal: centred card in the landing typography ── */
.auth-modal{width:440px;max-width:92vw;padding:36px 32px 28px;border-radius:14px;text-align:left}
.modal-logo{margin-bottom:22px}
.modal-logo .icon,.modal-logo .icon.mark{width:52px;height:52px;background:none;box-shadow:none;border-radius:0;margin-bottom:10px}
.auth-title{font-size:26px;font-weight:800;letter-spacing:-.6px;color:#14171f;margin:0 0 6px;line-height:1.15;font-family:inherit}
.auth-sub{font-size:14.5px;color:#4b5563;margin:0;line-height:1.5}
.google-btn,#googleAuthBtn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;background:#fff;color:#14171f;border:1px solid var(--border2);border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;margin-bottom:14px}
.google-btn:hover{background:#f7f8fa}
.google-btn:disabled{opacity:.6;cursor:default}
.auth-or{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#6b7280;font-size:13px}
.auth-or::before{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,#bff2d6,#00c46e)}
.auth-or::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,#00c46e,#bff2d6,transparent)}
.auth-modal .form-group{margin-bottom:12px}
.auth-modal .form-input{padding:13px 14px;font-size:14px;border-radius:9px}
.auth-modal .submit-btn{padding:14px;border-radius:9px;font-size:14px;text-transform:none;letter-spacing:0;font-weight:700}
.auth-modal .auth-row{margin-bottom:14px}
.auth-alt{text-align:center;margin-top:10px}
.auth-alt button{background:transparent;border:none;color:#006b3b;font-size:12.5px;cursor:pointer;font-family:inherit;text-decoration:underline;min-height:32px}
.auth-alt button:disabled{opacity:.6;cursor:default}
/* (authflow1) the offer under an error: switch tab with the address carried */
.auth-switch{text-align:center;margin-top:8px;font-size:13px;color:#6b7280}
.auth-switch[hidden]{display:none}
.auth-switch button{background:transparent;border:0;padding:6px 2px;min-height:36px;color:#006b3b;font-family:inherit;font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
html[data-theme="dark"] .auth-switch{color:#a3a8b5}
html[data-theme="dark"] .auth-switch button{color:#00ff88}
.auth-note{margin-top:10px;padding:10px 12px;background:#ecfdf3;border:1px solid #bff2d6;border-radius:8px;color:#14171f;font-size:12.5px;text-align:center}
.auth-modal .terms{font-size:12.5px;color:#4b5563;margin-top:14px;line-height:1.55}
.auth-modal .terms a{color:#006b3b;text-decoration:none;font-weight:600}
.auth-modal .terms a:hover{text-decoration:underline}
.auth-modal .auth-footer{margin-top:18px;font-size:13.5px;color:#4b5563}
.auth-modal .auth-footer a{color:#006b3b;font-weight:600}
.auth-modal .auth-error,.auth-modal .auth-success{font-size:12.5px}
.auth-verify-txt{font-size:14px;color:#14171f;line-height:1.55;margin:0 0 14px;text-align:center}
.auth-modal .captcha-wrap{margin:4px 0 14px;min-height:78px}
#hcapSignup iframe{max-width:100%}
html[data-theme="dark"] .auth-title,html[data-theme="dark"] .auth-verify-txt{color:#fff}
html[data-theme="dark"] .auth-sub,html[data-theme="dark"] .auth-modal .terms,html[data-theme="dark"] .auth-modal .auth-footer,html[data-theme="dark"] .auth-or{color:#a3a8b5}
html[data-theme="dark"] .google-btn{background:#14141c;border-color:#252540;color:#e0e0e0}
html[data-theme="dark"] .auth-alt button,html[data-theme="dark"] .auth-modal .terms a,html[data-theme="dark"] .auth-modal .auth-footer a{color:#00ff88}
html[data-theme="dark"] .auth-note{background:rgba(0,255,136,.06);border-color:rgba(0,255,136,.25);color:#e0e0e0}
@media(max-width:480px){.auth-modal{padding:28px 18px 22px}.auth-title{font-size:23px}}
/* (authipad1) iPad: a wider, shorter box. Empty message lines take no room, the close button is a real touch target,
   scrolling stays inside the box, and the box fits the visible screen when the keyboard is up. */
.auth-modal .auth-error:not(.visible),.auth-modal .auth-success:not(.visible){display:none}
.auth-modal{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;max-height:90vh;max-height:calc(100dvh - 24px)}
.modal-close{width:44px;height:44px;top:10px;right:10px;font-size:24px}
.modal-logo .icon svg{width:100%;height:100%}
@media(min-width:700px){.auth-modal{width:520px;max-width:92vw;padding:30px 44px 24px}}
@media(max-height:820px){.auth-modal{padding-top:24px;padding-bottom:20px}.modal-logo{margin-bottom:14px}.modal-logo .icon,.modal-logo .icon.mark{width:40px;height:40px;margin-bottom:6px}.auth-modal .auth-or{margin-bottom:12px}.auth-modal .form-group{margin-bottom:12px}.auth-modal .captcha-wrap{margin:10px 0}}
@media(max-height:620px){.auth-modal .auth-sub,.modal-logo .icon,.modal-logo .icon.mark{display:none}.auth-modal .auth-title{font-size:21px}.modal-logo{margin-bottom:10px}}
