/* KAOS website v2 · Kinetic Obsidian visual system (from Stitch), applied to v1 content */
:root{--bg:#10131a;--bg2:#0b0e15;--ink:#e1e2ec;--mut:#cbc3d7;--faint:#958ea0;--v:#a078ff;--vh:#d0bcff;--vd:#6d3bd7;--line:rgba(208,188,255,.14);--glass:rgba(29,31,39,.55);--up:#45dfa4;--mono:ui-monospace,"JetBrains Mono","SFMono-Regular",Menlo,monospace}
html,body{background:var(--bg)}
body{color:var(--ink)}
/* animated aura + grain */
.aura{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.aura i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(90px);opacity:.28;animation:drift 26s ease-in-out infinite alternate}
.aura i:nth-child(1){background:#6d3bd7;left:-20vmax;top:-10vmax}
.aura i:nth-child(2){background:#3c1a8a;right:-25vmax;top:30vh;animation-duration:32s}
.aura i:nth-child(3){background:#1d2a6b;left:20vw;bottom:-30vmax;animation-duration:38s}
@keyframes drift{to{transform:translate3d(8vw,6vh,0) scale(1.15)}}
.grain{position:fixed;inset:-50%;z-index:60;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
main,.foot,.ticker{position:relative;z-index:1}
section,.pillar{background:transparent!important}
/* type */
.kicker,.eyebrow,.chip,.ticker__tag,.board__h,.sport small{font-family:var(--mono);letter-spacing:.1em}
.big{font-weight:900;letter-spacing:-.03em}
.hl{background:linear-gradient(90deg,#e9ddff,#a078ff 60%,#d0bcff);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:sheen 8s ease-in-out infinite alternate}
@keyframes sheen{to{background-position:100% 0}}
.hero__title em{background:linear-gradient(90deg,#e9ddff,#a078ff,#d0bcff);-webkit-background-clip:text;background-clip:text;background-size:200% 100%;animation:sheen 6s ease-in-out infinite alternate}
/* glass surfaces */
.probs article,.loopgrid div,.card,.trustgrid div,.board,.chat,.signup__row,.sport,details{background:var(--glass)!important;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--line)}
.probs article,.loopgrid div,.card,.trustgrid div{transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.probs article:hover,.loopgrid div:hover,.card:hover,.trustgrid div:hover{transform:translateY(-6px);border-color:rgba(160,120,255,.55);box-shadow:0 20px 60px -20px rgba(160,120,255,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.trustgrid{background:transparent;border:0;gap:14px}.trustgrid div{border-radius:18px}
.sportgrid{border-top:0;gap:14px}.sport{padding:26px!important;border-radius:18px}
.sport b{font-family:var(--mono);font-weight:700;letter-spacing:-.04em}
details{border-radius:14px;padding:4px 20px;margin-bottom:10px}
.btn{background:linear-gradient(135deg,#d0bcff,#a078ff 45%,#6d3bd7);color:#16002f;box-shadow:0 10px 40px -8px rgba(160,120,255,.75),inset 0 1px 0 rgba(255,255,255,.4)}
.btn:hover{box-shadow:0 14px 50px -6px rgba(160,120,255,.95)}
.nav.is-solid{background:rgba(16,19,26,.6)}
.banner{background:linear-gradient(110deg,rgba(109,59,215,.85),rgba(60,26,138,.75));border:1px solid rgba(208,188,255,.25);backdrop-filter:blur(12px)}
.ticker{background:rgba(11,14,21,.85);backdrop-filter:blur(10px)}.ticker__tag{background:transparent}
.ticker__track b{color:#fff}.ticker__track{font-family:var(--mono);font-size:14px}
/* hero */
.hero__tint{background:linear-gradient(90deg,rgba(16,19,26,.92) 0,rgba(16,19,26,.55) 50%,rgba(16,19,26,.2) 100%),linear-gradient(180deg,rgba(16,19,26,.1) 55%,var(--bg) 100%)}
.hero__grid{opacity:.5;background:radial-gradient(circle at 72% 38%,rgba(160,120,255,.35),transparent 50%)}
.hero__phones .phone{animation:float 7s ease-in-out infinite}.hero__phones .phone--front{animation-delay:-3.5s}
@keyframes float{50%{margin-top:-14px}}
/* photo backgrounds */
.pbg,.how__bg,.loop__bg,.cta__bg{position:absolute;inset:0;overflow:hidden;z-index:-1}
.pbg img,.how__bg img,.loop__bg img,.cta__bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.18);will-change:transform}
.pbg img{opacity:.42}.how__bg img{opacity:.22}.loop__bg img{opacity:.5;filter:none}.cta__bg img{opacity:.55}
.pbg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0,rgba(16,19,26,.72) 45%,rgba(16,19,26,.4) 100%),linear-gradient(180deg,var(--bg),transparent 18%,transparent 82%,var(--bg))}
.pillar--alt .pbg::after{background:linear-gradient(270deg,var(--bg) 0,rgba(16,19,26,.72) 45%,rgba(16,19,26,.4) 100%),linear-gradient(180deg,var(--bg),transparent 18%,transparent 82%,var(--bg))}
.how__bg::after,.loop__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg),rgba(16,19,26,.55) 30%,rgba(40,20,100,.35) 60%,var(--bg))}
.how{position:relative;overflow:hidden}.pillar{overflow:hidden;isolation:isolate}
.cta__bg::after{background:radial-gradient(ellipse at 50% 50%,rgba(60,26,138,.55),var(--bg) 78%)}
.strip{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:14px;margin:0 0 40px;height:260px}
.strip img{width:100%;height:100%;object-fit:cover;border-radius:20px;border:1px solid var(--line);transform:scale(1.12)}
.strip{overflow:hidden}.strip>img{transform:none}
@media(max-width:700px){.strip{grid-template-columns:1fr 1fr;height:180px}.strip img:last-child{display:none}}
.card__img{height:260px}.card__img img{filter:none}
.card__img::after{background:linear-gradient(180deg,rgba(60,26,138,.1),rgba(29,31,39,.95))}
/* stage tilt and float */
.stage,.hero__phones{transform:perspective(1400px) rotateX(var(--tilt,0deg)) translateY(var(--lift,0px));transition:transform .2s linear}
.stage .phone{animation:float 8s ease-in-out infinite}.stage .phone:nth-child(2n){animation-delay:-4s}
.phone{box-shadow:0 0 0 1.5px #4a4458,0 0 0 4px #15121f,0 50px 90px -25px rgba(0,0,0,.85),0 30px 140px -30px rgba(160,120,255,.7)}
.board{border-radius:18px}
.up{color:var(--up)}
@media(prefers-reduced-motion:reduce){.aura i,.grain,.hl,.hero__title em,.hero__phones .phone,.stage .phone{animation:none}.stage,.hero__phones{transform:none}}
.ticker__tag{background:#0b0e15!important;position:relative;z-index:2}
.pbg img{opacity:.62}
.pbg::after{background:linear-gradient(90deg,var(--bg) 0,rgba(16,19,26,.6) 42%,rgba(16,19,26,.15) 100%),linear-gradient(180deg,var(--bg),transparent 16%,transparent 84%,var(--bg))}
.pillar--alt .pbg::after{background:linear-gradient(270deg,var(--bg) 0,rgba(16,19,26,.6) 42%,rgba(16,19,26,.15) 100%),linear-gradient(180deg,var(--bg),transparent 16%,transparent 84%,var(--bg))}
.cta__bg img{opacity:.85}.cta__bg::after{background:radial-gradient(ellipse at 50% 50%,rgba(60,26,138,.35),rgba(16,19,26,.85) 80%),linear-gradient(180deg,var(--bg),transparent 25%,transparent 75%,var(--bg))}
.sports{position:relative;overflow:hidden}
.sports .how__bg img{opacity:.3}
@media(max-width:960px){.pbg::after,.pillar--alt .pbg::after{background:linear-gradient(180deg,var(--bg),rgba(16,19,26,.55) 25%,rgba(16,19,26,.55) 75%,var(--bg))}}
html,body{overflow-x:clip}main{overflow-x:clip}
/* Three.js hero seal */
.hero3d{position:absolute;z-index:1;right:max(0px,calc((100% - 1300px)/2));top:2%;width:min(760px,58vw);height:84%;pointer-events:none}
.hero3d canvas{width:100%!important;height:100%!important;display:block}
.hero3d__fallback{position:absolute;left:38%;top:12%;width:200px;opacity:.85;filter:drop-shadow(0 20px 60px rgba(160,120,255,.6))}
.hero3d.on .hero3d__fallback{display:none}
.hero__phones{z-index:2}
@media(max-width:900px){.hero3d{top:auto;bottom:250px;right:0;width:100%;height:380px}.hero__phones{margin-top:120px}}
@media(max-width:900px){.hero3d{position:relative;top:auto;bottom:auto;right:auto;width:100%;height:300px;margin-top:10px}.hero__phones{margin-top:-30px}}