@font-face{
  font-family:Tiny5;
  src:url('/assets/fonts/Tiny5-Regular.ttf') format('truetype');
  font-display:swap
}
@font-face{
  font-family:Inter;
  src:url('/assets/fonts/InterVariable.woff2') format('woff2');
  font-weight:100 900;
  font-display:swap
}
:root{
  color-scheme:dark;
  --bg:#0b1015;
  --panel:#111a1d;
  --text:#edf1eb;
  --muted:#9aa9a4;
  --green:#b0f2a0;
  --line:#293735;
  --pixel:Tiny5,monospace;
  --body:Inter,Arial,sans-serif
}
*,*::before,*::after{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:100px
}
body{
  position:relative;
  isolation:isolate;
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.65 var(--body);
  -webkit-font-smoothing:antialiased
}
button,a{
  -webkit-tap-highlight-color:transparent
}
button{
  font:inherit
}
a{
  color:inherit;
  text-decoration:none
}
button{
  cursor:pointer
}
img{
  object-fit:contain;
  image-rendering:pixelated
}
p,h1,h2,h3{
  margin:0
}
h2,h3{
  font-weight:500;
  line-height:1.12
}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--green);
  outline-offset:6px
}
[hidden]{
  display:none!important
}
.shell{
  width:min(1180px,calc(100% - 64px));
  margin-inline:auto
}
.skip-link{
  position:fixed;
  top:8px;
  left:16px;
  z-index:100;
  padding:12px;
  background:var(--green);
  color:var(--bg);
  transform:translateY(-160%)
}
.skip-link:focus{
  transform:translateY(0)
}
.site-header{
  position:sticky;
  top:0;
  z-index:20;
  background:#0b1015f2;
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(12px)
}
.header-row{
  display:flex;
  align-items:center;
  gap:24px;
  min-height:80px
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:9px;
  white-space:nowrap;
  font-size:13px;
  font-weight:750;
  letter-spacing:.1em
}
.brand-divider{
  color:#526660;
  margin:0 4px
}
.brand-system{
  font:20px/1 var(--pixel);
  letter-spacing:.03em;
  color:var(--green)
}
.desktop-nav{
  display:flex;
  gap:28px;
  margin-left:auto;
  color:#b0bcb7;
  font-size:13px
}
.desktop-nav a:hover,.text-link:hover{
  color:var(--green)
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  min-height:54px;
  padding:12px 25px;
  border:1px solid #50664f;
  box-shadow:3px 3px 0 #060a0b;
  font-size:14px;
  font-weight:600;
  transition:background .18s,transform .18s
}
.button:hover{
  transform:translateY(-2px);
  background:#24352a
}
.button-small{
  min-height:40px;
  padding:8px 16px;
  gap:16px;
  font-size:12px
}
.button-green{
  background:var(--green);
  color:#142017;
  border-color:var(--green);
  box-shadow:4px 4px 0 #355742
}
.button-green:hover{
  background:#ceffbf
}
.menu-toggle{
  display:none;
  width:42px;
  height:42px;
  border:1px solid var(--line);
  background:var(--panel);
  padding:12px
}
.menu-toggle span{
  display:block;
  height:2px;
  background:var(--green);
  margin:5px 0
}
.mobile-nav{
  padding-block:10px 20px
}
.mobile-nav a{
  display:block;
  padding:10px
}
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:68px 0 0
}
.site-space{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,#0b101538,#0b101570),url('/assets/world/space-concept.webp') center/cover no-repeat;
  opacity:.8
}
.site-space::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(#b0f2a006 1px,transparent 1px),linear-gradient(90deg,#b0f2a006 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(transparent,#0008 40%,#000)
}
.hero-content{
  text-align:center
}
.eyebrow,.micro{
  font:11px/1.5 var(--body);
  font-weight:600;
  letter-spacing:.13em;
  color:var(--muted)
}
.eyebrow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#c2d3c6
}
.status-pixel{
  display:inline-block;
  width:6px;
  height:6px;
  background:var(--green);
  box-shadow:0 0 10px #b0f2a033;
  flex-shrink:0
}
.hero h1{
  position:relative;
  width:fit-content;
  margin:12px auto 8px;
  color:var(--green);
  font:clamp(64px,11vw,144px)/.98 var(--pixel);
  letter-spacing:-.035em;
  text-shadow:0 5px 0 #315346
}
.title-star{
  position:absolute;
  right:-28px;
  top:10px;
  font:28px/1 var(--pixel);
  text-shadow:none
}
.hero-lead{
  font:clamp(28px,3.2vw,42px)/1.15 var(--body);
  font-weight:500;
  letter-spacing:-.04em
}
.hero-description{
  margin:22px auto 0;
  font-size:15px;
  line-height:1.8;
  color:#b2bdbb
}
.hero-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:30px;
  margin-top:28px
}
.text-link{
  font-size:13px
}
.hero-note{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px;
  margin:28px 0 42px;
  font:12px/1.5 var(--pixel);
  letter-spacing:.1em;
  color:#8eaa9a
}
.hero-note span{
  color:#567163
}
.intro{
  padding-top:108px;
  text-align:center
}
.intro h2{
  margin-top:16px;
  font-size:clamp(30px,4vw,48px);
  letter-spacing:-.04em;
  line-height:1.18
}
.intro h2 span{
  color:var(--green)
}
.intro>p{
  max-width:620px;
  margin:24px auto 0;
  font-size:15px;
  color:var(--muted)
}
.intro-rule{
  display:flex;
  align-items:center;
  gap:24px;
  margin:65px auto 0;
  max-width:280px;
  color:#658b6f
}
.intro-rule::before,.intro-rule::after{
  content:'';
  height:1px;
  background:#30473b;
  flex:1
}
.tools{
  padding-top:75px
}
.section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:35px
}
.section-heading h2{
  font:44px/1.1 var(--pixel);
  margin-top:10px
}
.tools-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px
}
.tool-card{
  padding:27px;
  background:linear-gradient(135deg,#14211d,#10191a);
  border:1px solid #304139;
  position:relative;
  transition:border-color .18s,transform .18s
}
.tool-card::before{
  content:'';
  position:absolute;
  top:-1px;
  left:-1px;
  width:5px;
  height:5px;
  background:var(--green)
}
.tool-card:hover{
  border-color:#739668;
  transform:translateY(-3px)
}
.tool-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:22px
}
.tool-top>span{
  font:10px/1.5 var(--pixel);
  color:#9eb59e;
  letter-spacing:.05em
}
.tool-card h3{
  font:29px/1.15 var(--pixel);
  margin-bottom:12px
}
.tool-card p{
  font-size:13px;
  line-height:1.8;
  color:#a7b6ad;
  min-height:72px
}
.tool-caption{
  display:block;
  margin-top:25px;
  padding-top:14px;
  border-top:1px solid #2a3b30;
  font-size:10px;
  letter-spacing:.02em;
  color:#8eae95
}
.workflow{
  padding-top:105px
}
.steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  list-style:none;
  padding:0;
  margin:0
}
.steps li{
  position:relative;
  border-top:1px solid #425440;
  padding:28px 24px 0 0
}
.steps li::before{
  content:'';
  width:8px;
  height:8px;
  position:absolute;
  top:-5px;
  left:0;
  background:var(--green);
  box-shadow:0 0 0 5px var(--bg)
}
.step-index{
  font:20px/1 var(--pixel);
  color:#6c9874
}
.steps h3{
  font:29px/1.3 var(--pixel);
  margin-top:14px
}
.steps p{
  margin-top:9px;
  font-size:12px;
  color:var(--muted);
  line-height:1.9
}
.entry{
  position:relative;
  margin-top:100px;
  padding:50px 24px 60px;
  text-align:center;
  background:radial-gradient(ellipse at center,#20362755,transparent 65%);
  border-block:1px solid #2c4034
}
.entry-art{
  margin-bottom:20px
}
.entry h2{
  font:clamp(38px,5vw,62px)/1.1 var(--pixel);
  margin-top:12px;
  color:var(--green)
}
.entry p{
  margin-top:18px;
  color:var(--muted);
  font-size:14px
}
.entry .button{
  margin-top:28px
}
.footer{
  padding-top:44px;
  padding-bottom:28px
}
.footer-top,.footer-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px
}
.footer-top{
  padding-bottom:26px;
  border-bottom:1px solid var(--line)
}
.footer-bottom{
  padding-top:20px;
  align-items:flex-start;
  font-size:10px;
  color:#7f9088
}
.footer-bottom p{
  max-width:700px;
  line-height:1.8
}
.footer-bottom>span{
  white-space:nowrap
}
@media(min-width:1600px){
  .hero{
    padding-top:80px
  }
}
@media(max-width:1050px){
  .desktop-nav{
    gap:16px
  }
  .brand-system{
    display:none
  }
  .header-row>.button{
    margin-left:auto
  }
  .tools-grid{
    gap:12px
  }
  .tool-card{
    padding:22px
  }
  .tool-card h3{
    font-size:26px
  }
  .tool-card p{
    min-height:95px
  }
}
@media(max-width:760px){
  .shell{
    width:calc(100% - 36px)
  }
  .header-row{
    min-height:68px;
    gap:14px
  }
  .brand{
    font-size:12px
  }
  .brand img{
    width:28px;
    height:28px
  }
  .brand-divider{
    display:none
  }
  .desktop-nav{
    display:none
  }
  .menu-toggle{
    display:block
  }
  .header-row>.button{
    min-height:38px;
    padding:8px 11px;
    font-size:11px;
    gap:12px
  }
  .hero{
    padding-top:45px
  }
  .hero h1{
    font-size:clamp(56px,12vw,90px);
    margin-top:20px
  }
  .title-star{
    right:-14px;
    font-size:18px;
    top:4px
  }
  .eyebrow{
    font-size:8px;
    letter-spacing:.1em
  }
  .hero-lead{
    font-size:30px
  }
  .hero-description{
    font-size:13px;
    max-width:400px
  }
  .hero-actions{
    gap:22px
  }
  .hero-note{
    font-size:10px;
    gap:11px;
    margin-bottom:32px
  }
  .intro{
    padding-top:72px
  }
  .intro h2{
    font-size:34px
  }
  .intro>p{
    font-size:13px;
    max-width:520px
  }
  .intro-rule{
    margin-top:42px
  }
  .tools{
    padding-top:48px
  }
  .section-heading h2{
    font-size:34px
  }
  .tools-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .tool-card p{
    min-height:96px;
    font-size:12px
  }
  .tool-caption{
    font-size:9px
  }
  .tool-top>span{
    font-size:8px
  }
  .tool-top img{
    width:48px;
    height:48px
  }
  .workflow{
    padding-top:72px
  }
  .steps{
    grid-template-columns:repeat(2,minmax(0,1fr));
    row-gap:35px
  }
  .entry{
    margin-top:70px
  }
  .footer .brand-system{
    display:inline-block
  }
  .footer .brand-divider{
    display:inline
  }
  .footer-bottom{
    flex-direction:column;
    gap:14px
  }
}
@media(max-width:420px){
  .shell{
    width:calc(100% - 28px)
  }
  .hero h1{
    font-size:13.5vw
  }
  .hero-lead{
    font-size:27px
  }
  .title-star{
    display:none
  }
  .hero-description{
    font-size:12px
  }
  .desktop-break{
    display:none
  }
  .hero-actions{
    flex-direction:column;
    gap:18px
  }
  .hero-note{
    font-size:9px;
    gap:8px
  }
  .tools-grid{
    grid-template-columns:1fr
  }
  .tool-card{
    padding:24px
  }
  .tool-card p{
    min-height:0;
    font-size:13px
  }
  .tool-top>span{
    font-size:10px
  }
  .tool-card h3{
    font-size:29px
  }
  .tool-caption{
    font-size:10px
  }
  .section-heading h2{
    font-size:30px
  }
  .steps h3{
    font-size:25px
  }
  .steps p{
    font-size:11px
  }
  .footer-top{
    gap:12px
  }
  .footer .brand{
    font-size:10px;
    gap:5px
  }
  .footer .brand-system{
    font-size:16px
  }
  .entry h2{
    font-size:35px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*::before,*::after{
    transition:none!important;
    animation:none!important
  }
}

/* Pixel trading illustrations: decoration, never live market data. */
.hero-note{margin-bottom:20px}
.market-ribbon{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 25px;margin:0 auto 34px;color:#bfd0c4;font-size:10px}
.market-ribbon>span{display:flex;align-items:center;gap:7px}
.market-ribbon img{filter:drop-shadow(0 0 7px #a779ff20)}
.section-loot{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:20px}
.section-loot img:first-child{transform:rotate(-12deg)}
.section-loot img:last-child{transform:rotate(12deg)}
.section-loot img{filter:drop-shadow(0 0 12px #52c8ff30)}
.intro>p{color:#b0bdb4}
.intro-rule{max-width:370px}
.intro-rule img{filter:drop-shadow(0 0 10px #b0f2a030)}
.section-heading .micro{color:#b4c8b8}
.tool-card{
  --detail:var(--green);
  background:linear-gradient(135deg,#14211df7,#10191af7);
  box-shadow:inset 0 1px 0 #b0f2a00a,4px 4px 0 #04091270
}
.tool-card:nth-child(3n+2){--detail:#a779ff}
.tool-card:nth-child(3n){--detail:#52c8ff}
.tool-card::before{background:var(--detail);box-shadow:0 0 12px color-mix(in srgb,var(--detail) 35%,transparent)}
.tool-card::after{content:'';position:absolute;right:-1px;bottom:-1px;width:5px;height:5px;background:var(--detail);opacity:.7}
.tool-card:hover{border-color:var(--detail);box-shadow:inset 0 1px #b0f2a010,4px 4px 0 #04091270,0 0 22px color-mix(in srgb,var(--detail) 9%,transparent)}
.tool-top img{filter:drop-shadow(0 0 12px color-mix(in srgb,var(--detail) 25%,transparent))}
.tool-top>span{color:color-mix(in srgb,var(--detail) 65%,#a6b2aa)}
.tool-visual{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  height:112px;
  margin-top:21px;
  padding:12px 12px 28px;
  border:1px solid #33463d;
  background:linear-gradient(135deg,#b0f2a008,#52c8ff03);
  color:#89b696;
  overflow:hidden
}
.tool-visual svg{display:block;width:100%;height:68px}
.tool-visual>span:not(.visual-library-caption){position:absolute;bottom:7px;left:12px;font:9px/1.3 var(--pixel);letter-spacing:.07em;color:#87a894}
.visual-levels>img{flex-shrink:0;filter:drop-shadow(0 0 9px #a779ff38)}
.visual-levels>svg{min-width:0;flex:1}
.visual-risk,.visual-records{flex-direction:column;justify-content:center;align-items:stretch;padding:11px 12px;gap:10px}
.visual-risk>div{display:flex;align-items:center;gap:10px;color:var(--green);font:11px/1 var(--pixel)}
.visual-risk>div:nth-child(2){color:#52c8ff}
.visual-risk>div:nth-child(3){color:#a779ff}
.visual-risk span{width:46px}
.visual-risk i{flex:1;height:1px;background:currentColor;box-shadow:0 0 12px color-mix(in srgb,currentColor 30%,transparent)}
.visual-risk b{font-size:16px;width:18px;text-align:center}
.visual-records{gap:3px}
.visual-records>div{display:flex;align-items:center;gap:9px;font:10px/1 var(--pixel);color:#a4c9ad}
.visual-records i{flex:1;height:3px;background:linear-gradient(90deg,#b0f2a030 55%,transparent 55%)}
.visual-records>div:nth-child(2) i{background:linear-gradient(90deg,#52c8ff30 75%,transparent 75%)}
.visual-records>div:nth-child(3) i{background:linear-gradient(90deg,#a779ff30 45%,transparent 45%)}
.visual-records b{color:var(--green);font-size:12px;font-weight:400}
.visual-library{justify-content:center;gap:14px}
.visual-library img{filter:drop-shadow(0 0 9px #a779ff28)}
.visual-library>span:not(.visual-library-caption){position:static;color:#648970;font:16px/1 var(--pixel)}
.visual-library-caption{position:absolute;bottom:7px;left:12px;font:9px/1.3 var(--pixel);letter-spacing:.07em;color:#87a894}
.tool-caption{margin-top:18px}
.steps{padding:0 20px 26px;background:#0e191bd9;border:1px solid #2c4038;box-shadow:4px 4px 0 #060b1270}
.steps li{margin-top:26px}
.steps li::before{box-shadow:0 0 0 5px #0e191b,0 0 18px #b0f2a025}
.step-icon{position:absolute;right:25px;top:22px;filter:drop-shadow(0 0 8px #b0f2a020)}
.entry{isolation:isolate;background:radial-gradient(ellipse at center,#203627b0,#0b1015c0 75%);border:1px solid #37513d;box-shadow:inset 0 0 0 4px #18251d80,5px 5px 0 #050b1280}
.entry-art img{filter:drop-shadow(0 0 22px #b0f2a038)}
.footer{background:linear-gradient(180deg,transparent,#0b1015c9)}
.footer-bottom{color:#a0afa6}


@media(max-width:760px){
  .site-space{background-position:center;opacity:.65}
  .market-ribbon{gap:10px 16px;max-width:380px;font-size:9px;margin-bottom:26px}
  .market-ribbon>span{min-width:140px;justify-content:center}
  .market-ribbon img{width:22px;height:22px}
  .hero-note{margin-bottom:18px}
  .tool-visual{padding-inline:8px}
  .visual-library{gap:7px}
  .visual-library img{width:36px;height:36px}
  .step-icon{right:10px;width:30px;height:30px}
}
@media(max-width:420px){
  .market-ribbon{gap:8px;max-width:310px}
  .market-ribbon>span{min-width:128px;font-size:8px}
  .steps{padding-inline:12px}
  .steps li{padding-right:7px}
  .step-icon{right:5px;width:27px;height:27px}
  .section-loot{gap:10px}
}

/* Typography, buttons and lightweight motion. */
.button{
  position:relative;
  overflow:hidden;
  gap:14px;
  border-radius:3px;
  transition:background .18s,transform .18s,box-shadow .18s;
  box-shadow:3px 3px 0 #14281b,inset 0 1px 0 #ffffff16
}
.button::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 30%,#ffffff20 48%,transparent 66%);
  transform:translateX(-130%);
  pointer-events:none
}
.button:hover::after{transform:translateX(130%);transition:transform .65s ease}
.button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #14281b}
.button-icon{flex-shrink:0;transition:transform .25s ease}
.button:hover .button-icon{transform:translateY(-2px) rotate(-8deg)}
.button-arrow{display:grid;place-items:center;width:27px;height:27px;margin-left:5px;background:#15281912;border:1px solid #192e171c;font-size:17px;line-height:1;transition:transform .2s ease}
.button:hover .button-arrow{transform:translate(2px,-2px)}
.button-small{background:#1b3024;border-color:#55734d;color:#d9f3cf;padding:7px 10px 7px 13px;gap:9px;min-height:44px}
.button-small:hover{background:#294334;box-shadow:3px 3px 0 #0a1912,0 0 18px #b0f2a012}
.button-small .button-arrow{background:#b0f2a011;border-color:#b0f2a025;color:var(--green)}
.title-star{animation:star-drift 7s ease-in-out infinite}
@keyframes star-drift{0%,100%{transform:translateY(0);opacity:1}50%{transform:translateY(-4px);opacity:.65}}
.hero-note{margin-top:30px;opacity:.85}
.market-ribbon{opacity:.85;margin-bottom:34px}
.intro{padding-top:95px}
.section-heading h2{font:500 clamp(29px,3.4vw,42px)/1.16 var(--body);letter-spacing:-.045em}
.tool-card{padding:27px;border-radius:3px}
.tool-top{margin-bottom:21px}
.tool-top img{width:52px;height:52px}
.tool-top>span{font:600 9px/1.5 var(--body);letter-spacing:.05em}
.tool-card h3{font:600 20px/1.3 var(--body);letter-spacing:-.035em;margin-bottom:13px}
.tool-card p{font-size:13px;line-height:1.85;color:#b0beb4;min-height:76px}
.tool-visual{opacity:.8;border-color:#314639;border-radius:2px}
.tool-card:hover .tool-visual{opacity:1;transition:opacity .2s}
.tool-card:hover .tool-top img{transform:translateY(-3px);transition:transform .25s}
.tool-caption{color:#a3b5a5;font-size:10px}
.steps{border-radius:3px;padding-bottom:30px}
.steps h3{font:600 21px/1.3 var(--body);letter-spacing:-.03em;margin-top:19px}
.steps p{font-size:12px;line-height:1.9;color:#a9b8ad}
.entry{padding:48px 24px 52px;background:radial-gradient(ellipse at 50% 45%,#203627a0,#0b1015d0 80%);border-color:#354c3a;border-radius:3px}
.entry-art{margin-bottom:15px}
.entry-art img{width:78px;height:78px;animation:portal-breathe 8s ease-in-out infinite}
@keyframes portal-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.025)}}
.entry h2{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:13px;line-height:1.15;margin-top:20px}
.entry-invitation{font:400 35px/1.2 var(--body);letter-spacing:-.045em;color:var(--text)}
.entry-name{font:64px/1 var(--pixel);color:var(--green);letter-spacing:-.025em}
.entry p{font-size:14px;line-height:1.8;margin-top:20px}
.reveal-ready.is-revealed{animation:section-arrive .5s ease-out both}
@keyframes section-arrive{from{opacity:.7;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.tool-card.reveal-ready:nth-child(3n+2){animation-delay:.06s}
.tool-card.reveal-ready:nth-child(3n){animation-delay:.12s}
@media(max-width:1050px){
  .tool-card h3{font-size:18px}
  .tool-card p{min-height:98px}
}
@media(max-width:760px){
  .header-row>.button{padding:7px 9px;font-size:10px;gap:7px;min-height:42px}
  .button-small .button-icon{width:19px;height:19px}
  .button-small .button-arrow{width:22px;height:22px;margin-left:0;font-size:15px}
  .tool-card h3{font-size:20px}
  .entry h2{gap:8px}
  .entry-invitation{font-size:28px}
  .entry-name{font-size:52px}
  .steps h3{font-size:20px}
}
@media(max-width:420px){
  .header-row{gap:9px}
  .header-row>.button{gap:6px;font-size:9px;white-space:nowrap;padding:6px 7px}
  .button-small .button-icon{width:17px;height:17px}
  .button-small .button-arrow{width:20px;height:20px}
  .brand{gap:5px;font-size:10px}
  .menu-toggle{width:36px;min-width:36px;height:40px;padding:10px}
  .hero-actions .button{font-size:12px;padding:11px 16px;gap:10px;white-space:nowrap}
  .hero-actions .button-icon{width:22px;height:22px}
  .hero-actions .button-arrow{width:24px;height:24px}
  .intro{padding-top:75px}
  .tool-card h3{font-size:21px}
  .tool-card p{min-height:0;font-size:13px}
  .tool-top>span{font-size:9px}
  .entry h2{flex-direction:column;align-items:center;gap:10px}
  .entry-invitation{font-size:26px}
  .entry-name{font-size:48px}
  .entry .button{font-size:12px;gap:9px;padding-inline:17px}
}
@media(prefers-reduced-motion:reduce){
  .reveal-ready:not(.is-revealed){opacity:1;transform:none}
}

/* A continuous ribbon of real product screens; only the track moves. */
.system-gallery{--screen-width:clamp(290px,52vw,700px);--screen-gap:22px;position:relative;width:100vw;margin-left:calc(50% - 50vw);text-align:left;scroll-margin-top:110px;isolation:isolate}
.system-gallery::before{content:'';position:absolute;inset:-30px 0;z-index:-1;background:radial-gradient(ellipse at 35% 45%,#79ab8620,transparent 55%),radial-gradient(ellipse at 80% 50%,#8372d315,transparent 50%);pointer-events:none}
.gallery-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:10px}
.gallery-wordmark{font:20px/1.4 var(--pixel);color:var(--green);letter-spacing:.035em}
.gallery-wordmark>span{font:600 9px/1.5 var(--body);letter-spacing:.14em;color:#94a99d;margin-left:12px}
.carousel-viewport{overflow:hidden;padding:25px 0 28px;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.carousel-track{display:flex;width:max-content;animation:screen-orbit 104s linear infinite;animation-delay:-4s;will-change:transform}
.carousel-group{display:flex;gap:var(--screen-gap);padding-right:var(--screen-gap);flex-shrink:0}
.carousel-screen{--screen-accent:#b0f2a0;flex:0 0 var(--screen-width);width:var(--screen-width);margin:0;padding:15px;border:1px solid #b0f2a028;border-radius:24px;background:linear-gradient(135deg,#1a302675,#10192785 55%,#18253465);box-shadow:inset 0 1px 0 #ffffff0a,0 15px 40px #02071145;position:relative;overflow:hidden}
.screen-watchtower{--screen-accent:#52c8ff}
.screen-journal{--screen-accent:#d2ba82}
.screen-statistics{--screen-accent:#a779ff}
.carousel-screen::before{content:'';position:absolute;left:28px;right:28px;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--screen-accent),transparent);opacity:.55;pointer-events:none}
.screen-caption{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:28px;margin:0 3px 13px;font-size:13px;font-weight:500;color:#d0e0d6}
.screen-caption>span:first-child{display:flex;align-items:center;gap:9px}
.screen-caption img{filter:drop-shadow(0 0 7px color-mix(in srgb,var(--screen-accent) 30%,transparent))}
.screen-number{font:12px/1 var(--pixel);letter-spacing:.08em;color:var(--screen-accent);white-space:nowrap}
.screen-number i{font-style:normal;color:#5e776b;margin-inline:4px}
.screen-glass{position:relative;aspect-ratio:2/1;overflow:hidden;border-radius:14px;border:1px solid #ffffff0b;background:linear-gradient(135deg,#14201c55,#0e182b55);box-shadow:0 0 24px color-mix(in srgb,var(--screen-accent) 7%,transparent)}
.product-capture{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;opacity:.94;pointer-events:none;user-select:none}
.screen-glass::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,#b0f2a00a,transparent 38%,#a779ff08),linear-gradient(0deg,#090e1924,transparent 35%);box-shadow:inset 0 0 32px #02071430}
.screen-description{display:flex;align-items:center;gap:8px;margin:13px 3px 0;font-size:10px;line-height:1.5;color:#9db0a5}
.screen-description i{width:4px;height:4px;flex-shrink:0;background:var(--screen-accent);opacity:.7;box-shadow:0 0 8px var(--screen-accent)}
.system-gallery.is-offscreen .carousel-track,.system-gallery.is-hidden .carousel-track{animation-play-state:paused}

@keyframes screen-orbit{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:760px){
  .system-gallery{--screen-width:80vw;--screen-gap:16px;scroll-margin-top:90px}
  .gallery-wordmark{font-size:18px}
  .gallery-wordmark>span{font-size:8px;margin-left:8px}
  .carousel-viewport{padding-block:20px 22px;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
  .carousel-screen{padding:10px;border-radius:17px}
  .screen-caption{font-size:11px;gap:9px;margin-bottom:9px;min-height:25px}
  .screen-caption img{width:23px;height:23px}
  .screen-number{font-size:10px}
  .screen-glass{border-radius:10px}
  .screen-description{font-size:11px;margin-top:10px}
}
@media(prefers-reduced-motion:reduce){
  .carousel-track{animation:none;will-change:auto;width:100%}
  .carousel-viewport{mask-image:none;padding-inline:max(18px,calc((100vw - 1180px)/2))}
  .carousel-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:0;width:100%}
  .carousel-group[aria-hidden=true]{display:none}
  .carousel-screen{width:100%;min-width:0}
}
@media(prefers-reduced-motion:reduce) and (max-width:760px){.carousel-group{grid-template-columns:1fr}}

/* Drag seeks the running animation, so automatic motion never stops on hover. */
.carousel-viewport{cursor:grab;touch-action:pan-y;user-select:none}
.carousel-viewport.is-dragging{cursor:grabbing}
.screen-sessions{--screen-accent:#52c8ff}
.screen-economics{--screen-accent:#e3c48c}
@media(prefers-reduced-motion:reduce){.carousel-viewport{cursor:default}}

/* Quiet cosmic depth, with local light and a clear product hierarchy. */
.site-space{opacity:.32;background-image:linear-gradient(180deg,#0b101538,#0b101580),url('/assets/world/space-concept.webp')}
.ambient-field{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.ambient-field::before,.ambient-field::after{content:'';position:absolute;width:560px;height:560px;background:radial-gradient(circle,#b0f2a055 1px,transparent 1.7px);background-size:13px 13px;mask-image:radial-gradient(ellipse,#0009,transparent 65%);opacity:.3;animation:ambient-drift 32s ease-in-out infinite alternate}
.ambient-field::before{right:-130px;top:18%;transform:rotate(-18deg)}
.ambient-field::after{left:-200px;bottom:-130px;background-image:radial-gradient(circle,#a779ff60 1px,transparent 1.7px);animation-delay:-16s}
@keyframes ambient-drift{from{translate:0 0;opacity:.2}to{translate:18px -22px;opacity:.4}}
.hero::before{content:'';position:absolute;z-index:-1;top:0;left:0;right:0;height:760px;background:linear-gradient(180deg,#0b101518,#0b10153d),url('/assets/world/space-concept.webp') center top/cover no-repeat;mask-image:linear-gradient(#000 65%,transparent);opacity:.7;pointer-events:none}
.hero::after{content:'';position:absolute;z-index:-1;top:0;left:-20px;right:-20px;height:670px;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Crect width='2' height='2' fill='%23bd94ff'/%3E%3C/svg%3E"),radial-gradient(ellipse at 22% 23%,#a779ff16,transparent 40%),radial-gradient(ellipse at 83% 62%,#a779ff18,transparent 42%);mask-image:radial-gradient(ellipse 270px 165px at 22% 23%,#000,transparent 85%),radial-gradient(ellipse 300px 190px at 83% 62%,#000,transparent 85%);opacity:.55;animation:hero-particle-drift 24s ease-in-out infinite alternate}
@keyframes hero-particle-drift{from{transform:translate3d(0,-6px,0);opacity:.42}to{transform:translate3d(-12px,12px,0);opacity:.65}}
.hero h1{font-size:clamp(64px,10.5vw,132px)}
.hero-lead{font-size:clamp(30px,3.5vw,46px);font-weight:550}
.hero-description{max-width:650px;color:#bfcbc5}
.button-green{box-shadow:3px 3px 0 #355742,0 0 24px #b0f2a014}
.button-green:hover{box-shadow:3px 3px 0 #355742,0 0 28px #b0f2a030}
.system-gallery{margin-top:25px}
.system-gallery::before{inset:-15px 0 -25px;background:linear-gradient(180deg,#0b101500,#0b1015bf 18%,#0b1015bf 82%,#0b101500),radial-gradient(ellipse at 30% 45%,#79ab8620,transparent 60%)}
.carousel-screen{background:linear-gradient(135deg,#1a3026b0,#101927c9 55%,#182534b0);border-color:#b0f2a02c;box-shadow:inset 0 1px 0 #ffffff0a,0 18px 45px #02071160}
.screen-glass{background:#0d1422f2;box-shadow:0 0 24px color-mix(in srgb,var(--screen-accent) 5%,transparent)}
.screen-glass::after{background:linear-gradient(120deg,#b0f2a005,transparent 38%,#a779ff03);box-shadow:inset 0 0 22px #02071415}
.screen-description{font-size:12px;color:#b3c3ba}
.intro{position:relative;padding-top:110px}
.intro::before{content:'';position:absolute;inset:15% 5% 0;z-index:-1;background:radial-gradient(ellipse,#0b1015e0,transparent 70%);pointer-events:none}
.tools{position:relative;isolation:isolate;padding-top:70px}
.tools::before{content:'';position:absolute;inset:0 0 -70px;z-index:-1;background:radial-gradient(ellipse at 15% 25%,#b0f2a009,transparent 45%),linear-gradient(#0b101550,#0b1015b0 35%,#0b101500);pointer-events:none}
.section-heading h2{font-weight:550}
.tools-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:20px}
.tool-card{--detail:var(--green);border-color:#ffffff16;border-radius:18px;background:linear-gradient(140deg,#14231ff5,#10191dfc 60%);box-shadow:inset 0 1px 0 #ffffff05,0 15px 35px #02071125;overflow:hidden}
.tool-card::before{width:24px;height:2px;left:27px;top:0;background:var(--detail);box-shadow:0 0 14px color-mix(in srgb,var(--detail) 30%,transparent)}
.tool-card::after{display:none}
.tool-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--detail) 38%,transparent);box-shadow:inset 0 1px #ffffff08,0 18px 40px #02071140}
.tool-feature{grid-column:span 6;padding:28px 28px 22px}
.tool-feature .tool-top{margin-bottom:13px}
.tool-feature .tool-top img{width:42px;height:42px}
.tool-feature h3{font-size:28px;letter-spacing:-.045em}
.tool-feature p{min-height:0;max-width:460px;font-size:14px;line-height:1.75}
.tool-journal{--detail:#c1abef!important;background:radial-gradient(ellipse at 85% 0,#a779ff0b,transparent 65%),linear-gradient(140deg,#182124f5,#10191dfc)}
.feature-capture{margin:24px -10px 0;aspect-ratio:1.95;position:relative;overflow:hidden;border:1px solid #ffffff10;border-radius:11px;background:#0e1421;box-shadow:0 10px 30px #04091240}
.feature-capture img{width:100%;height:100%;display:block;object-fit:cover;image-rendering:auto;opacity:.96;pointer-events:none;user-select:none}
.tool-feature .tool-caption{display:flex;align-items:center;gap:9px;font-size:12px;margin-top:20px;color:#c4d5c9;border-top-color:#ffffff10}
.tool-feature .tool-caption::before{content:'';width:5px;height:5px;background:var(--detail);box-shadow:0 0 12px color-mix(in srgb,var(--detail) 30%,transparent)}
.tool-secondary{grid-column:span 3;padding:22px}
.tool-secondary:nth-child(3){--detail:#a779ff}
.tool-secondary:nth-child(4){--detail:#52c8ff}
.tool-secondary:nth-child(5){--detail:#b0f2a0}
.tool-secondary:nth-child(6){--detail:#c1abef}
.tool-secondary .tool-top{margin-bottom:17px;gap:7px}
.tool-secondary .tool-top img{width:32px;height:32px}
.tool-secondary .tool-top>span{font-size:8px;letter-spacing:.035em;text-align:right}
.tool-secondary h3{font-size:18px;min-height:46px;line-height:1.3}
.tool-secondary p{font-size:12px;line-height:1.75;min-height:106px}
.tool-secondary .tool-visual{height:88px;margin-top:17px;padding:9px 9px 22px;border-radius:8px;border-color:#ffffff0c;opacity:.85}
.tool-secondary .tool-visual svg{height:50px}
.tool-secondary .tool-caption{font-size:11px;border-color:#ffffff0c;line-height:1.5}
.tool-secondary .visual-risk{padding:12px;gap:8px}
.tool-secondary .visual-risk>div{font-size:10px}
.tool-secondary .visual-levels>img{width:28px;height:28px}
.tool-secondary .visual-library{gap:7px}
.tool-secondary .visual-library img{width:30px;height:30px}
.tool-secondary .tool-visual>span,.tool-secondary .visual-library-caption{font-size:8px;letter-spacing:.01em;left:9px}
.case-study{padding-top:115px;position:relative;isolation:isolate;scroll-margin-top:110px}
.case-study::before{content:'';position:absolute;inset:80px 0 -50px;z-index:-1;background:radial-gradient(ellipse at 65% 55%,#a779ff09,transparent 65%),linear-gradient(#0b101500,#0b1015b0 25%,#0b1015b0 85%,transparent);pointer-events:none}
.case-heading{align-items:flex-end;margin-bottom:30px}
.case-heading h2{max-width:640px;line-height:1.2}
.case-heading h2 span{color:var(--green)}
.case-heading>p{font-size:13px;line-height:1.8;color:#a7b7ad;max-width:340px;margin-bottom:3px}
.case-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px}
.case-tab{display:flex;align-items:center;gap:12px;position:relative;text-align:left;padding:19px 17px;border:1px solid #ffffff12;border-radius:12px;background:#10191dea;color:#abb9b0;transition:border-color .2s,background .2s,box-shadow .2s}
.case-tab:hover{border-color:#b0f2a04a;background:#182820}
.case-tab[aria-selected=true]{background:linear-gradient(125deg,#243b2af5,#17271efa);border-color:#b0f2a060;color:#e6f1e2;box-shadow:inset 0 1px 0 #b0f2a010,0 0 22px #b0f2a007}
.case-tab-index{position:absolute;right:12px;top:8px;font:11px/1 var(--pixel);color:#728a7b}
.case-tab[aria-selected=true] .case-tab-index{color:var(--green)}
.case-tab img{flex-shrink:0;filter:drop-shadow(0 0 10px #b0f2a018)}
.case-tab strong{display:block;font-size:15px;font-weight:600;line-height:1.4}
.case-tab small{display:block;font-size:10px;margin-top:3px;color:#93a79a;line-height:1.5}
.case-tab-arrow{margin-left:auto;align-self:flex-end;font-size:14px;color:#779180}
.case-tab[aria-selected=true] .case-tab-arrow{color:var(--green)}
.case-panel{border:1px solid #ffffff18;border-radius:20px;padding:14px;background:linear-gradient(145deg,#16241de6,#101823f5 60%);box-shadow:0 20px 60px #02071140}
.case-screen{margin:0;aspect-ratio:2.15;overflow:hidden;border-radius:12px;background:#0c1220;border:1px solid #ffffff0a}
.case-screen img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;pointer-events:none;user-select:none}
.case-explanation{display:flex;align-items:center;gap:24px;padding:25px 18px 13px}
.case-stage-mark{font:22px/1 var(--pixel);white-space:nowrap;color:var(--green);align-self:flex-start;margin-top:4px}
.case-explanation h3{font-size:19px;font-weight:550;letter-spacing:-.025em;line-height:1.4}
.case-explanation p{max-width:720px;color:#aabbb0;font-size:13px;line-height:1.8;margin-top:8px}
.case-example{margin-left:auto;white-space:nowrap;align-self:flex-start;font-size:9px;letter-spacing:.04em;color:#7d9185;padding:6px 9px;border:1px solid #ffffff10;border-radius:5px}
.entry{margin-top:115px;border-radius:24px;border-color:#b0f2a028;padding:62px 24px;box-shadow:inset 0 1px 0 #ffffff08,0 15px 45px #02071130;background:radial-gradient(ellipse at 50% 30%,#2d4b2b7d,#0b121bf0 75%);overflow:hidden}
.entry::before,.entry::after{content:'';position:absolute;z-index:-1;width:360px;height:360px;top:20%;background:radial-gradient(circle,#b0f2a04d 1px,transparent 1.6px);background-size:14px 14px;mask-image:radial-gradient(ellipse,#0009,transparent 68%);pointer-events:none}
.entry::before{left:-100px;transform:rotate(-18deg)}
.entry::after{right:-100px;transform:rotate(18deg)}
.entry-art img{width:90px;height:90px;filter:drop-shadow(0 0 28px #a779ff50)}
.entry .micro{color:#abc0ac}
@media(max-width:1050px){
  .tool-secondary{grid-column:span 6}
  .tool-secondary h3,.tool-secondary p{min-height:0}
  .case-tab{padding:19px 12px;gap:8px}
  .case-tab img{width:25px;height:25px}
  .case-tab strong{font-size:14px}
  .case-tab small{font-size:9px}
  .case-heading{align-items:flex-start;flex-direction:column;gap:16px}
  .case-heading>p{max-width:none}
  .case-example{display:none}
}
@media(max-width:760px){
  .site-space{opacity:.22}
  .hero::before{height:610px;background-position:center top;opacity:.45}
  .hero::after{height:580px;mask-image:radial-gradient(ellipse 170px 140px at 8% 16%,#0009,transparent 85%),radial-gradient(ellipse 180px 155px at 100% 72%,#0009,transparent 85%)}
  .hero h1{font-size:clamp(50px,14.5vw,88px)}
  .hero-lead{font-size:clamp(29px,6vw,38px)}
  .hero-description{font-size:13px;max-width:480px}
  .ambient-field::before,.ambient-field::after{width:370px;height:370px;opacity:.2}
  .intro{padding-top:85px}
  .tools-grid{gap:15px}
  .tool-feature{grid-column:span 12;padding:25px 23px 20px}
  .tool-feature h3{font-size:25px}
  .tool-feature p{font-size:13px}
  .feature-capture{margin-top:20px;aspect-ratio:1.85}
  .tool-secondary{padding:20px}
  .case-study{padding-top:80px;scroll-margin-top:85px}
  .case-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:15px}
  .case-tab{padding:19px 12px;min-height:85px}
  .case-tab small{font-size:10px}
  .case-panel{border-radius:16px;padding:8px}
  .case-screen{aspect-ratio:1.35;border-radius:10px}
  .case-screen img{object-fit:cover;object-position:center}
  #panel-plan .case-screen img{object-position:right center}
  .case-explanation{padding:18px 9px 12px;gap:14px}
  .case-stage-mark{font-size:18px}
  .case-explanation h3{font-size:17px}
  .case-explanation p{font-size:12px;line-height:1.8}
  .entry{margin-top:80px;border-radius:20px;padding:48px 20px}
  .screen-description{font-size:11px}
}
@media(max-width:480px){
  .tool-secondary{grid-column:span 12;display:grid;grid-template-columns:1fr 90px;column-gap:15px;padding:21px}
  .tool-secondary .tool-top{grid-column:1/-1;margin-bottom:12px}
  .tool-secondary h3{grid-column:1;margin:0 0 9px;font-size:19px}
  .tool-secondary p{grid-column:1;font-size:12px}
  .tool-secondary .tool-visual{grid-column:2;grid-row:2/4;height:100%;min-height:95px;margin:0;padding-inline:7px}
  .tool-secondary .tool-visual>span,.tool-secondary .visual-library-caption{display:none}
  .tool-secondary .visual-levels>img{display:none}
  .tool-secondary .visual-library{flex-direction:column;gap:3px;padding:5px}
  .tool-secondary .visual-library>span{display:none}
  .tool-secondary .visual-library img{width:23px;height:23px}
  .tool-secondary .visual-risk{padding:8px;gap:13px}
  .tool-secondary .visual-risk span{width:34px;font-size:8px}
  .tool-secondary .visual-risk b{width:10px;font-size:12px}
  .tool-secondary .tool-caption{grid-column:1/-1;margin-top:17px;padding-top:12px}
  .case-tab{gap:8px;padding-inline:10px}
  .case-tab img{width:24px;height:24px}
  .case-tab strong{font-size:13px}
  .case-tab small{font-size:9px;max-width:105px}
  .case-tab-arrow{display:none}
  .gallery-wordmark>span{letter-spacing:.09em}
}
@media(prefers-reduced-motion:reduce){
  .ambient-field::before,.ambient-field::after{animation:none}
  .hero::after{animation:none;transform:none}
}
