@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&display=swap');
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#06080E;--blue:#1E88E5;--blue-bright:#42A5F5;--blue-dim:#0D47A1;--blue-glow:rgba(30,136,229,.25);--text:#A8B4D0;--white:#fff;--font:'Outfit',sans-serif}
body{background:var(--bg);color:var(--text);font-family:var(--font);overflow-x:hidden;min-height:100vh}

/* Full-page Three.js canvas */
canvas#world{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0}

/* Neon edge strips */
.neon-top{position:fixed;top:0;left:0;right:0;height:2px;z-index:50;background:linear-gradient(90deg,transparent 5%,rgba(30,136,229,.3) 20%,rgba(66,165,245,.5) 50%,rgba(30,136,229,.3) 80%,transparent 95%);opacity:.5;animation:neon-flicker 4s ease infinite}
.neon-bot{position:fixed;bottom:0;left:0;right:0;height:1px;z-index:50;background:linear-gradient(90deg,transparent 10%,rgba(30,136,229,.2) 50%,transparent 90%)}
@keyframes neon-flicker{0%,100%{opacity:.5}50%{opacity:.8}73%{opacity:.3}74%{opacity:.7}}

/* Subtle overlays */
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,transparent 25%,rgba(6,8,14,.85) 100%)}

/* Layout */
.tw{position:relative;z-index:10;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12px 20px}

/* Top nav — minimal */
.tw-nav{width:100%;max-width:1000px;display:flex;justify-content:space-between;align-items:center;padding:2px 0 0;margin-bottom:14px}
.tw-nav__logo{height:32px;filter:brightness(1.3) drop-shadow(0 0 10px var(--blue-glow))}
.tw-nav__logo-mobile{display:none;height:32px;filter:brightness(1.3) drop-shadow(0 0 10px var(--blue-glow))}
.tw-nav__links{display:flex;gap:20px;align-items:center}
.tw-nav__link{color:var(--text);text-decoration:none;font-size:.88rem;font-weight:500;letter-spacing:.05em;transition:.2s;opacity:.6}
.tw-nav__link:hover{opacity:1;color:var(--white)}
.tw-nav__cta{background:var(--blue);color:var(--white);padding:8px 22px;border-radius:6px;font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transform:matrix(0.99,0,-0.14,1,0,0);transition:.2s;cursor:pointer;border:none;animation:nav-glow 30s ease infinite}
.tw-nav__cta:hover{box-shadow:0 4px 20px var(--blue-glow)}
@keyframes nav-glow{0%,8%,100%{box-shadow:none}3%{box-shadow:0 4px 24px rgba(30,136,229,.5),0 0 40px rgba(66,165,245,.2)}6%{box-shadow:none}}

/* Center area — titan + orbit labels */
.tw-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;width:100%;max-width:1000px;margin-top:-10px}

/* Tagline above titan */
.tw-tagline{text-align:center;margin-bottom:6px}
.tw-tagline__main{font:800 clamp(1.6rem,4.2vw,2.8rem)/1.15 var(--font);color:var(--white);letter-spacing:-.02em}
.tw-tagline__sub{font-size:clamp(.88rem,1.6vw,1.05rem);color:var(--text);opacity:.6;margin-top:6px;letter-spacing:.02em}

/* Slot machine cabinet */
.tw-titan{position:relative;margin:0 auto}
.tw-slot{position:relative;width:clamp(200px,28vw,300px);margin:0 auto}

/* Cabinet body — dark metallic with blue neon edge trim, sharper corners */
.tw-cab{position:relative;background:linear-gradient(180deg,#141420 0%,#0e0e1c 50%,#0a0a18 100%);border-radius:6px 6px 4px 4px;padding:3px;box-shadow:0 8px 40px rgba(0,0,0,.6)}
/* Neon edge trim */
.tw-cab::before{content:'';position:absolute;inset:-1px;border-radius:7px 7px 5px 5px;border:2px solid rgba(30,136,229,.5);box-shadow:0 0 8px rgba(30,136,229,.3),0 0 20px rgba(30,136,229,.1),inset 0 0 8px rgba(30,136,229,.1);pointer-events:none;z-index:2}

/* Screen bezel */
.tw-cab__bezel{background:#080810;border-radius:4px 4px 2px 2px;padding:3px;position:relative}
.tw-cab__bezel::before{content:'';position:absolute;inset:0;border-radius:4px 4px 2px 2px;border:1px solid rgba(30,136,229,.35);box-shadow:inset 0 0 12px rgba(30,136,229,.08);pointer-events:none}

/* Screen */
.tw-cab__screen{position:relative;background:rgba(6,10,30,.85);border-radius:3px 3px 1px 1px;overflow:hidden;aspect-ratio:3/4}
/* Titan spritesheet canvas */
.tw-cab__titan-wrap{position:absolute;inset:0;z-index:1;perspective:600px;overflow:hidden}
.tw-cab__titan-wrap.dimmed{display:none}
.tw-cab__titan{position:absolute;top:0;left:-15px;right:-15px;bottom:-15px;transition:opacity .4s;will-change:transform;transform-style:preserve-3d}
.tw-cab__titan canvas{width:100%;height:100%;display:block;object-fit:contain}
.tw-cab__titan.dimmed{opacity:0}
/* Dynamic light spot that follows cursor */
.tw-cab__spotlight{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 40%,rgba(100,180,255,.12) 0%,transparent 50%);mix-blend-mode:screen}
/* Eye glow — positioned over the eyes, tracks cursor */
.tw-cab__eyes{position:absolute;z-index:2;pointer-events:none;width:45%;height:10%;top:38%;left:27.5%;will-change:transform}
.tw-cab__eye{position:absolute;width:14px;height:8px;border-radius:50%;background:radial-gradient(circle,rgba(140,220,255,.7) 0%,rgba(30,136,229,.3) 60%,transparent 100%);filter:blur(2px);animation:eye-pulse 3s ease-in-out infinite}
.tw-cab__eye--l{left:15%}
.tw-cab__eye--r{right:15%}
@keyframes eye-pulse{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
/* Floating crystal shards */
.tw-cab__shard{position:absolute;z-index:2;pointer-events:none;opacity:0;animation:shard-float 3s ease-in-out infinite}
.tw-cab__shard svg{filter:drop-shadow(0 0 4px rgba(30,136,229,.4))}
@keyframes shard-float{0%,100%{opacity:.6;transform:translateY(0) rotate(0deg)}50%{opacity:1;transform:translateY(-6px) rotate(8deg)}}
/* Breathing glow overlay */
.tw-cab__glow{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at 50% 35%,rgba(30,136,229,.06) 0%,transparent 55%);animation:titan-glow-pulse 4s ease-in-out infinite}
@keyframes titan-glow-pulse{0%,100%{opacity:.6}50%{opacity:1}}
/* Screen inner glow */
.tw-cab__screen::after{content:'';position:absolute;inset:0;border-radius:3px 3px 1px 1px;box-shadow:inset 0 0 30px rgba(30,136,229,.12),inset 0 0 60px rgba(30,136,229,.04);pointer-events:none;z-index:5}
/* Orbit card hover preview — shows in slot screen */
.tw-cab__orbit-preview{position:absolute;inset:0;z-index:3;opacity:0;transition:opacity .4s;pointer-events:none}
.tw-cab__orbit-preview.active{opacity:1}
.tw-cab__orbit-preview img{width:100%;height:100%;object-fit:cover}
/* In-screen showcase image */
.tw-cab__showcase{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .3s;pointer-events:none;display:flex;flex-direction:column;justify-content:flex-end}
.tw-cab__showcase.active{opacity:1}
.tw-cab__showcase img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tw-cab__showcase-text{position:relative;z-index:1;background:linear-gradient(transparent,rgba(0,0,0,.85) 40%);padding:40px 12px 10px;text-align:center}
.tw-cab__showcase-fact{font:600 .8rem/1.4 var(--font);color:var(--blue-bright);margin-bottom:3px}
.tw-cab__showcase-game{font:400 .65rem/1.2 var(--font);color:var(--text);opacity:.5}

/* Control panel — below screen */
.tw-cab__panel{background:linear-gradient(180deg,#0c0c1a,#101020);border-radius:0 0 4px 4px;padding:8px 10px;display:flex;align-items:center;border-top:1px solid rgba(30,136,229,.15)}
.tw-cab__panel-side{flex:1;display:flex;align-items:center}
.tw-cab__panel-side--r{justify-content:flex-end}

/* Buttons row */
.tw-cab__btns{display:flex;gap:4px;align-items:center}
.tw-cab__btn{width:26px;height:20px;border-radius:3px;border:1px solid rgba(30,136,229,.2);background:linear-gradient(180deg,#141428,#0a0a18);box-shadow:inset 0 1px 0 rgba(255,255,255,.03);cursor:pointer;transition:.2s;display:flex;align-items:center;justify-content:center;padding:0}
.tw-cab__btn svg{width:10px;height:10px;color:rgba(30,136,229,.4);transition:.2s}
.tw-cab__btn:hover{border-color:rgba(30,136,229,.5);box-shadow:0 0 8px rgba(30,136,229,.15)}
.tw-cab__btn:hover svg{color:rgba(30,136,229,.8)}
.tw-cab__btn:active{transform:scale(.92)}
.tw-cab__btn--accent{border-color:rgba(30,136,229,.4);box-shadow:0 0 4px rgba(30,136,229,.1)}

/* Spin button — larger, centered */
.tw-cab__spin{width:32px;height:32px;border-radius:50%;border:2px solid rgba(30,136,229,.4);background:radial-gradient(circle at 45% 40%,#1a2240,#0a0e1e);cursor:pointer;position:relative;box-shadow:0 0 10px rgba(30,136,229,.15),inset 0 1px 0 rgba(255,255,255,.05);transition:.2s}
.tw-cab__spin::after{content:'\25B6';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(30,136,229,.6);font-size:.55rem;padding-left:2px}
.tw-cab__spin:hover{border-color:rgba(30,136,229,.7);box-shadow:0 0 16px rgba(30,136,229,.3)}

/* Credit display */
.tw-cab__credit{background:#060610;border:1px solid rgba(30,136,229,.12);border-radius:3px;padding:2px 8px;font:700 .62rem/1.4 var(--font);color:var(--blue);letter-spacing:.05em;text-align:center;min-width:50px}
.tw-cab__credit-label{font:400 .48rem/1 var(--font);color:rgba(30,136,229,.3);letter-spacing:.1em;text-transform:uppercase;text-align:center;margin-bottom:1px}

/* Speaker grille at very bottom */
.tw-cab__grille{height:6px;margin:3px 30%;border-radius:2px;background:repeating-linear-gradient(90deg,rgba(30,136,229,.06) 0px,rgba(30,136,229,.06) 2px,transparent 2px,transparent 4px)}

/* Lever — connected to cabinet right edge */
.tw-lever{position:absolute;right:-24px;top:40%;display:flex;flex-direction:column;align-items:center;cursor:pointer;z-index:5}
/* Arm connecting lever to cabinet */
.tw-lever__arm{position:absolute;left:-4px;top:50%;width:8px;height:14px;background:linear-gradient(180deg,#1a2040,#0e1225);border:1px solid rgba(30,136,229,.15);border-right:none;border-radius:3px 0 0 3px;transform:translateY(-50%)}
.tw-lever__knob{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#2a3a5a,#141828);border:2px solid rgba(30,136,229,.4);box-shadow:0 0 10px rgba(30,136,229,.2);transition:transform .25s cubic-bezier(.22,1,.36,1);position:relative;z-index:2}
.tw-lever:hover .tw-lever__knob{box-shadow:0 0 16px rgba(30,136,229,.4)}
.tw-lever__shaft{width:5px;height:65px;background:linear-gradient(90deg,#141828,#1a2440,#141828);border:1px solid rgba(30,136,229,.15);box-shadow:0 0 6px rgba(30,136,229,.08);transition:transform .25s cubic-bezier(.22,1,.36,1);transform-origin:bottom}
.tw-lever__base{width:18px;height:10px;background:linear-gradient(180deg,#1a2040,#0e1225);border-radius:0 0 4px 4px;border:1px solid rgba(30,136,229,.15);border-top:none}
/* Pull animation — knob drops, shaft compresses, then springs back */
.tw-lever.pulled .tw-lever__knob{transform:translateY(30px) scale(1.2)}
.tw-lever.pulled .tw-lever__shaft{transform:scaleY(.55)}


/* Glow behind cabinet */
.tw-titan-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200%;height:200%;background:radial-gradient(ellipse,rgba(30,136,229,.07) 0%,rgba(30,136,229,.02) 30%,transparent 60%);pointer-events:none;animation:glow-breathe 6s ease-in-out infinite}
@keyframes glow-breathe{0%,100%{opacity:.8}50%{opacity:1.2}}

/* Orbit labels — positioned symmetrically around the titan */
.tw-orbit{position:absolute;width:700px;height:460px;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:10}
.tw-orbit__item{position:absolute;pointer-events:all;cursor:pointer;text-decoration:none;text-align:center;transition:.3s;padding:6px 12px;border-radius:8px;border:1px solid transparent;display:flex;flex-direction:column;align-items:center}
.tw-orbit__item:hover{border-color:rgba(30,136,229,.2);background:rgba(6,10,30,.85)}
/* Tooltips */
.tw-orbit__item[data-tip]{position:absolute}
.tw-orbit__item[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);background:rgba(4,8,18,.95);border:1px solid rgba(30,136,229,.25);border-radius:6px;padding:10px 14px;font:400 .85rem/1.5 var(--font);color:var(--text);width:max-content;max-width:260px;white-space:pre-line;pointer-events:none;opacity:0;transition:.25s;z-index:100;box-shadow:0 4px 20px rgba(0,0,0,.5)}
.tw-orbit__item[data-tip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}
.tw-orbit__icon{display:block;margin:0 auto 3px;color:var(--blue);opacity:.7}
.tw-orbit__icon svg{width:16px;height:16px}
.tw-orbit__label{font:700 .92rem/1.2 var(--font);color:var(--white);white-space:nowrap}
.tw-orbit__sub{font:400 .75rem/1.3 var(--font);color:var(--text);opacity:.7;white-space:nowrap}

/* 8 items: 2 top, 2 upper-mid, 2 lower-mid, 2 bottom */
.tw-orbit__item--tl{top:0;left:20px}
.tw-orbit__item--tr{top:0;right:20px}
.tw-orbit__item--uml{top:30%;left:0}
.tw-orbit__item--umr{top:30%;right:0}
.tw-orbit__item--lml{top:60%;left:0}
.tw-orbit__item--lmr{top:60%;right:0}
.tw-orbit__item--bl{bottom:0;left:20px}
.tw-orbit__item--br{bottom:0;right:20px}

/* Bottom area — chat + actions */
.tw-bottom{width:100%;max-width:700px;margin-top:auto;padding-top:8px}

/* Chat */
.tw-chat{background:rgba(6,10,30,.85);border:1px solid rgba(30,136,229,.12);border-radius:12px;padding:12px 18px;backdrop-filter:blur(10px);margin-bottom:6px}
.tw-chat::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(30,136,229,.3),transparent);border-radius:12px 12px 0 0}
.tw-chat__label{font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(30,136,229,.6);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.tw-chat__dot{width:5px;height:5px;background:var(--blue);border-radius:50%;animation:pulse-dot 2s ease infinite}
.tw-chat__msg{font-size:1rem;color:var(--blue-bright);line-height:1.5;min-height:1.5rem;margin-bottom:10px}
.tw-chat__msg .cur{display:inline-block;width:2px;height:1em;background:var(--blue);vertical-align:text-bottom;animation:blink .6s step-end infinite;margin-left:2px}
.tw-chat__row{display:flex;gap:8px}
.tw-chat__input{flex:1;background:rgba(30,136,229,.04);border:1px solid rgba(30,136,229,.12);border-radius:8px;padding:10px 14px;color:var(--white);font-family:var(--font);font-size:1rem;outline:none;transition:.3s}
.tw-chat__input:focus{border-color:rgba(30,136,229,.35)}
.tw-chat__input::placeholder{color:rgba(200,200,220,.45)}
.tw-chat__send{background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:10px 22px;font:700 .85rem/1 var(--font);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transform:matrix(0.99,0,-0.14,1,0,0);transition:.2s}
.tw-chat__send:hover{box-shadow:0 4px 20px var(--blue-glow)}
.tw-chat__send:disabled{opacity:.4;cursor:not-allowed}

/* Multi-turn chat history */
.tw-chat__history{max-height:220px;overflow-y:auto;margin-bottom:8px;display:none;scrollbar-width:thin;scrollbar-color:rgba(30,136,229,.2) transparent}
.tw-chat__history::-webkit-scrollbar{width:4px}
.tw-chat__history::-webkit-scrollbar-thumb{background:rgba(30,136,229,.2);border-radius:2px}
.tw-chat__bubble{margin-bottom:8px;padding:8px 12px;border-radius:10px;font-size:.92rem;line-height:1.5;max-width:85%;word-wrap:break-word}
.tw-chat__bubble--bot{background:rgba(30,136,229,.08);border:1px solid rgba(30,136,229,.1);color:var(--blue-bright);border-bottom-left-radius:2px;margin-right:auto}
.tw-chat__bubble--user{background:rgba(30,136,229,.15);border:1px solid rgba(30,136,229,.15);color:var(--white);border-bottom-right-radius:2px;margin-left:auto;text-align:right}
.tw-chat__bubble .cur{display:inline-block;width:2px;height:1em;background:var(--blue);vertical-align:text-bottom;animation:blink .6s step-end infinite;margin-left:2px}
.tw-chat__typing{font-size:.78rem;color:rgba(30,136,229,.5);padding:4px 0;display:none}
.tw-chat__typing.visible{display:block}
.tw-chat__counter{font-size:.65rem;color:rgba(30,136,229,.35);text-align:center;padding:4px 0;letter-spacing:.05em}

/* Rate-limit email form */
.tw-chat__rate-limit{display:none;padding:12px 0}
.tw-chat__rate-limit.visible{display:block}
.tw-chat__rate-limit__msg{font-size:.88rem;color:var(--blue-bright);line-height:1.5;margin-bottom:10px}
.tw-chat__rate-limit__row{display:flex;gap:8px;margin-bottom:8px}
.tw-chat__rate-limit__alt{font-size:.75rem;color:var(--text);opacity:.6;text-align:center}
.tw-chat__rate-limit__alt a{color:var(--blue-bright);text-decoration:none}
.tw-chat__rate-limit__thanks{font-size:.88rem;color:var(--blue-bright);line-height:1.5}

/* Action buttons under chat */
.tw-actions{display:flex;gap:12px;justify-content:center;margin-bottom:5px}
.tw-btn{padding:10px 28px;font:700 .88rem/1 var(--font);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:8px;transform:matrix(0.99,0,-0.14,1,0,0);transition:.3s;cursor:pointer;border:none}
.tw-btn--primary{background:var(--blue);color:var(--white);box-shadow:0 4px 16px var(--blue-glow)}
.tw-btn--primary:hover{box-shadow:0 6px 24px rgba(30,136,229,.4);transform:matrix(0.99,0,-0.14,1,0,0) translateY(-1px)}
.tw-btn--ghost{background:rgba(30,136,229,.06);color:var(--blue-bright)}
.tw-btn--ghost:hover{background:rgba(30,136,229,.12)}

/* Trust bar */
.tw-trust{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:4px}
.tw-trust__item{font-size:.75rem;color:var(--text);opacity:.7;display:flex;align-items:center;gap:4px}
.tw-trust__item strong{color:var(--blue-bright);font-weight:600;text-shadow:0 0 8px var(--blue-glow)}
.tw-trust__dot{width:3px;height:3px;border-radius:50%;background:rgba(30,136,229,.2)}

/* Footer */
.tw-footer{width:100%;max-width:700px;display:flex;justify-content:space-between;font-size:.68rem;color:rgba(168,180,208,.45);padding:6px 0}
.tw-footer a{color:rgba(30,136,229,.55);text-decoration:none}
.tw-footer a:hover{color:var(--blue)}

@keyframes blink{50%{opacity:0}}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 4px var(--blue)}50%{box-shadow:0 0 14px var(--blue)}}

/* Side stat badges */
.side-stat{position:fixed;z-index:3;pointer-events:none}
.side-stat__inner{background:rgba(6,10,30,.85);border:1px solid rgba(30,136,229,.1);border-radius:8px;padding:8px 14px;text-align:center;backdrop-filter:blur(6px);transform:matrix(0.99,0,-0.14,1,0,0)}
.side-stat__num{font:800 1.25rem/1.2 var(--font);color:var(--blue-bright);text-shadow:0 0 12px var(--blue-glow)}
.side-stat__label{font:400 .65rem/1.3 var(--font);color:var(--text);opacity:.5;letter-spacing:.08em;text-transform:uppercase}
.ss1{left:16px;top:18%}
.ss2{left:20px;bottom:22%}
.ss3{right:16px;top:22%}
.ss4{right:20px;bottom:18%}
body.loaded .ss1,body.loaded .ss2,body.loaded .ss3,body.loaded .ss4{animation-iteration-count:1}
body.float-active .ss1{animation:float-stat 8s ease-in-out infinite}
body.float-active .ss2{animation:float-stat 9s ease-in-out infinite 3s}
body.float-active .ss3{animation:float-stat 8s ease-in-out infinite 1s}
body.float-active .ss4{animation:float-stat 9s ease-in-out infinite 4s}
@keyframes float-stat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ==================== PRELOADER (inside slot screen only) ==================== */
.preloader{position:absolute;inset:0;z-index:4;background:#010208;display:flex;align-items:center;justify-content:center;transition:opacity .4s ease;border-radius:3px 3px 1px 1px}
.preloader.fade-out{opacity:0;pointer-events:none}
.preloader__pulse{width:80px;height:28px;position:relative}
.preloader__line{stroke:var(--blue);stroke-width:2;fill:none;filter:drop-shadow(0 0 6px rgba(30,136,229,.6));stroke-dasharray:200;stroke-dashoffset:200;animation:pulse-draw .8s ease forwards,pulse-flicker .8s ease-in-out .8s infinite}
.preloader__glow{position:absolute;top:50%;left:50%;width:60px;height:60px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(30,136,229,.15) 0%,transparent 70%);animation:pulse-glow .5s ease-in-out infinite}
@keyframes pulse-draw{to{stroke-dashoffset:0}}
@keyframes pulse-glow{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.3}50%{transform:translate(-50%,-50%) scale(1.4);opacity:.8}}
@keyframes pulse-flicker{0%,100%{opacity:1}50%{opacity:.5}}

/* ==================== PAGE ENTRY ANIMATIONS ==================== */
.tw,.side-stat,.neon-top,.neon-bot{opacity:0}
body.loaded .neon-top,body.loaded .neon-bot{opacity:1;transition:opacity .4s ease .05s}

/* Page appears immediately — loaded class added on DOMContentLoaded */
body.loaded .tw{opacity:1}
body.loaded .tw-nav{animation:enter-down .5s cubic-bezier(.22,1,.36,1) .1s both}

/* Tagline — fades up */
body.loaded .tw-tagline{animation:enter-up .5s cubic-bezier(.22,1,.36,1) .15s both}

/* Titan container — scale in */
body.loaded .tw-titan{animation:enter-scale .6s cubic-bezier(.22,1,.36,1) .2s both}

/* Orbit items — left side from left, right side from right */
body.loaded .tw-orbit__item--tl,
body.loaded .tw-orbit__item--uml,
body.loaded .tw-orbit__item--lml,
body.loaded .tw-orbit__item--bl{animation:enter-left .5s cubic-bezier(.22,1,.36,1) both}
body.loaded .tw-orbit__item--tl{animation-delay:.25s}
body.loaded .tw-orbit__item--uml{animation-delay:.3s}
body.loaded .tw-orbit__item--lml{animation-delay:.35s}
body.loaded .tw-orbit__item--bl{animation-delay:.4s}

body.loaded .tw-orbit__item--tr,
body.loaded .tw-orbit__item--umr,
body.loaded .tw-orbit__item--lmr,
body.loaded .tw-orbit__item--br{animation:enter-right .5s cubic-bezier(.22,1,.36,1) both}
body.loaded .tw-orbit__item--tr{animation-delay:.25s}
body.loaded .tw-orbit__item--umr{animation-delay:.3s}
body.loaded .tw-orbit__item--lmr{animation-delay:.35s}
body.loaded .tw-orbit__item--br{animation-delay:.4s}

/* Side stats — left from left, right from right */
body.loaded .ss1{animation:enter-left .5s cubic-bezier(.22,1,.36,1) .3s both}
body.loaded .ss2{animation:enter-left .5s cubic-bezier(.22,1,.36,1) .38s both}
body.loaded .ss3{animation:enter-right .5s cubic-bezier(.22,1,.36,1) .3s both}
body.loaded .ss4{animation:enter-right .5s cubic-bezier(.22,1,.36,1) .38s both}

/* Bottom — chat, actions, trust, footer rise up with stagger */
body.loaded .tw-chat{animation:enter-up .5s cubic-bezier(.22,1,.36,1) .3s both}
body.loaded .tw-actions{animation:enter-up .5s cubic-bezier(.22,1,.36,1) .35s both}
body.loaded .tw-trust{animation:enter-up .4s cubic-bezier(.22,1,.36,1) .4s both}
body.loaded .tw-footer{animation:enter-up .4s cubic-bezier(.22,1,.36,1) .45s both}

@keyframes enter-left{from{opacity:0;transform:translateX(-60px)}to{opacity:1;transform:translateX(0)}}
@keyframes enter-right{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:translateX(0)}}
@keyframes enter-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes enter-down{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
@keyframes enter-scale{from{transform:scale(.6)}to{transform:scale(1)}}

/* Contact modal */
.tw-modal{display:none;position:fixed;inset:0;z-index:9999;align-items:center;justify-content:center}
.tw-modal.is-open{display:flex}
.tw-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(6px)}
.tw-modal__panel{position:relative;background:rgba(6,10,22,.97);border:1px solid rgba(30,136,229,.2);border-top:2px solid rgba(30,136,229,.4);border-radius:14px;padding:28px 32px;max-width:480px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.tw-modal__close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--text);font-size:1.4rem;cursor:pointer;opacity:.5;transition:.2s}
.tw-modal__close:hover{opacity:1;color:var(--blue)}
.tw-modal__title{font:700 1.25rem/1.3 var(--font);color:var(--white);margin-bottom:4px}
.tw-modal__sub{font-size:.82rem;color:var(--text);opacity:.6;margin-bottom:18px}
.tw-modal label{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);opacity:.5;margin-bottom:4px;margin-top:10px}
.tw-modal input,.tw-modal textarea,.tw-modal select{width:100%;background:rgba(30,136,229,.03);border:1px solid rgba(30,136,229,.1);border-radius:6px;padding:9px 12px;color:var(--white);font-family:var(--font);font-size:1rem;outline:none;transition:.3s}
.tw-modal input:focus,.tw-modal textarea:focus{border-color:rgba(30,136,229,.35)}
.tw-modal textarea{min-height:70px;resize:vertical}
.tw-modal select{cursor:pointer}
.tw-modal select option{background:var(--bg);color:var(--text)}
.tw-modal__send{display:block;width:100%;margin-top:16px;background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:12px;font:700 .88rem/1 var(--font);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transform:matrix(0.99,0,-0.14,1,0,0);transition:.2s}
.tw-modal__send:hover{box-shadow:0 6px 24px var(--blue-glow)}
.tw-modal__methods{margin-top:18px;padding-top:14px;border-top:1px solid rgba(30,136,229,.08)}
.tw-modal__methods-title{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text);opacity:.4;margin-bottom:8px}
.tw-cm{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:.82rem;color:var(--text);text-decoration:none;transition:.2s;border-bottom:1px solid rgba(30,136,229,.04)}
.tw-cm:hover{color:var(--blue)}
.tw-cm svg{color:var(--blue);flex-shrink:0}

/* Demo modal */
.tw-demo-opts{display:flex;flex-direction:column;gap:10px}
.tw-demo-opt{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid rgba(30,136,229,.1);border-radius:10px;text-decoration:none;color:var(--text);transition:.3s;background:rgba(30,136,229,.02);cursor:pointer}
.tw-demo-opt:hover{border-color:rgba(30,136,229,.3);background:rgba(30,136,229,.05);transform:translateX(4px)}
.tw-demo-opt svg{color:var(--blue);flex-shrink:0}
.tw-demo-opt__title{font:700 .92rem/1.3 var(--font);color:var(--white);margin-bottom:2px}
.tw-demo-opt__sub{font-size:.72rem;opacity:.5}

/* Bottom CTA */
.tw-bottom-cta{width:100%;max-width:700px;text-align:center;padding:6px 0;font-size:.92rem;color:var(--text);display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}

/* Responsive */
@media(max-width:700px){
  /* Nav — swap full logo for "C" */
  .tw-nav__logo{display:none}
  .tw-nav__logo-mobile{display:block}
  .tw-nav__link{font-size:.75rem}
  .tw-nav__cta{padding:7px 16px;font-size:.75rem;text-align:center}
  /* Layout */
  .tw-center{padding:10px 0;min-height:auto}
  .tw-center>div[style]{min-height:auto!important}
  .tw-tagline__main{font-size:1.5rem}
  .tw-tagline__sub{font-size:.78rem}
  /* Cabinet — match orbit card grid width */
  .tw-slot{width:calc(100% - 30px)}
  .tw-lever{right:-20px}
  .tw-lever__shaft{height:45px}
  .tw-lever__knob{width:18px;height:18px}
  .tw-cab__btn{width:22px;height:16px}
  .tw-cab__btn svg{width:8px;height:8px}
  .tw-cab__spin{width:26px;height:26px}
  .tw-cab__credit{font-size:.55rem;min-width:36px;padding:2px 5px}
  .tw-cab__credit-label{font-size:.42rem}
  /* Center wrapper becomes column, orbit cards move ABOVE titan */
  .tw-center>div[style]{flex-direction:column!important;align-items:center!important;min-height:auto!important;flex-wrap:wrap!important}
  .tw-orbit{position:relative!important;width:100%!important;height:auto!important;top:auto!important;left:auto!important;transform:none!important;pointer-events:all;display:grid!important;grid-template-columns:1fr 1fr;gap:8px;padding:8px 4px 12px;order:-1!important}
  .tw-titan{order:1;width:100%}
  .tw-titan-glow{order:1}
  .tw-orbit__item{position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;flex-direction:column;align-items:flex-start!important;gap:2px;padding:6px 8px;border:1px solid rgba(30,136,229,.08);border-radius:5px;background:rgba(6,10,30,.85)}
  .tw-orbit__item[data-tip]::after{display:none}
  .tw-orbit__icon{margin:0 0 2px}
  .tw-orbit__icon svg{width:14px;height:14px}
  .tw-orbit__label{font-size:.85rem;white-space:normal}
  .tw-orbit__sub{font-size:.7rem;white-space:normal;line-height:1.3;opacity:.75}
  /* Bottom */
  .tw-actions{flex-wrap:wrap;gap:6px;justify-content:center}
  .tw-btn{padding:9px 18px;font-size:.78rem}
  .tw-trust{gap:8px}
  .tw-trust__item{font-size:.65rem}
  .tw-chat__msg{min-height:3rem} /* 2 lines at 1rem/1.5 line-height = 48px — prevents wrap jump */
  .tw-chat__input{font-size:1rem;padding:9px 12px}
  .tw-chat__send{padding:9px 18px;font-size:.78rem}
  .side-stat{display:none}
}
@media(max-width:1100px){.side-stat{display:none}}
@media(max-width:360px){.tw-nav__cta{display:none}}