/* The claim page: "your agent is being built". One step at a time; each step builds one part of the robot. */
body[data-page="claim"]{animation:grid 14s linear infinite}
@keyframes grid{to{background-position:16px 32px}}
.bd{position:relative;text-align:center}
.bd-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bd>*:not(.bd-bg){position:relative;z-index:1}
.bd-bg img{position:absolute;bottom:0;height:min(100vh,1100px);width:auto;opacity:.92;image-rendering:pixelated;animation:sway 9s ease-in-out infinite alternate}
.bd-l{left:0;-webkit-mask:linear-gradient(90deg,#000 60%,transparent);mask:linear-gradient(90deg,#000 60%,transparent)}
.bd-r{right:0;-webkit-mask:linear-gradient(270deg,#000 60%,transparent);mask:linear-gradient(270deg,#000 60%,transparent);animation-delay:-4s}
@keyframes sway{from{transform:translateY(0)}to{transform:translateY(-10px)}}
.bd-bg canvas{position:absolute;inset:0;width:100%;height:100%}
.drone{position:absolute;width:6px;height:6px;background:#9aa3b4;box-shadow:6px 0 #9aa3b4,-6px 0 #9aa3b4,-12px -6px #4de2ff,12px -6px #4de2ff,0 6px #ffd23f;animation:fly 26s linear infinite;opacity:.8}
.drone.d1{top:16%;left:-40px}
.drone.d2{top:31%;left:-40px;animation-duration:38s;animation-delay:-17s;transform:scale(.7)}
@keyframes fly{0%{translate:0 0}50%{translate:55vw -24px}100%{translate:110vw 8px}}
.spks{position:absolute;inset:0}
.spks i{position:absolute;bottom:-10px;width:3px;height:3px;background:#ffd23f;box-shadow:0 0 6px #ffd23f;animation:rise 9s linear infinite;opacity:0}
.spks i:nth-child(3n){background:#4de2ff;box-shadow:0 0 6px #4de2ff}
@keyframes rise{0%{transform:translateY(0);opacity:0}10%{opacity:.8}100%{transform:translateY(-105vh) translateX(30px);opacity:0}}

.bd-t{margin:4px 0 6px;font-size:clamp(28px,4.6vw,64px);line-height:1.05;letter-spacing:2px;text-shadow:0 4px 0 #000}
.bd-t b{color:var(--gold)}
.bd-t span,.bd-t b{display:inline-block;animation:drop .7s cubic-bezier(.2,1.4,.4,1) both}
.bd-t b{animation-delay:.18s}
@keyframes drop{from{transform:translateY(-30px);opacity:0}}
.bd-sub{margin:0 0 26px;color:var(--mut);font-size:15px}
.bd-sub b{color:var(--gold)}

.bd-panel{position:relative;display:grid;grid-template-columns:220px minmax(260px,1fr) minmax(300px,1.1fr);grid-template-areas:"parts bot step" "parts prog prog";gap:6px 26px;padding:26px;margin:0 auto;max-width:1120px;text-align:left;
  background:rgba(9,13,20,.9);border:2px solid #263042;box-shadow:0 0 0 4px #07090e,0 24px 60px rgba(0,0,0,.6);backdrop-filter:blur(3px);animation:rise-in .6s .1s both;overflow:hidden}
.bd-panel::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(77,226,255,.05) 1px,transparent 1px) 0 0/100% 4px;opacity:.5}
.bd-panel::after{content:"";position:absolute;left:0;right:0;height:80px;top:-80px;pointer-events:none;background:linear-gradient(transparent,rgba(77,226,255,.07),transparent);animation:sweep 6s linear infinite}
@keyframes sweep{to{top:110%}}
@keyframes rise-in{from{transform:translateY(24px);opacity:0}}

.bd-parts{grid-area:parts;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.bd-parts li{display:flex;align-items:center;gap:14px;padding:12px 14px;background:#0d121b;border:2px solid #1d2532;font:700 13px Pixel,monospace;color:#8f9aab;letter-spacing:1px;transition:border-color .25s,color .25s,transform .25s;animation:slide-r .45s both}
.bd-parts li svg{width:30px;height:30px;flex:none;color:#566070;transition:color .25s}
.bd-parts li.on{border-color:var(--gold);color:var(--gold);transform:translateX(4px);box-shadow:0 0 0 2px rgba(255,210,63,.15),0 0 22px rgba(255,210,63,.18)}
.bd-parts li.on svg{color:var(--gold);animation:wob 1.6s ease-in-out infinite}
.bd-parts li.ok{color:#eef2f7}
.bd-parts li.ok svg{color:#cfd8e6}
.bd-parts li b{margin-left:auto;color:var(--gr);font-size:16px;animation:pop .45s cubic-bezier(.2,1.8,.4,1) both}
@keyframes slide-r{from{transform:translateX(-18px);opacity:0}}
@keyframes wob{50%{transform:rotate(-8deg) scale(1.08)}}
@keyframes pop{from{transform:scale(0)}}

.bd-bot{grid-area:bot;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:380px}
.bd-bot canvas{width:min(100%,300px);aspect-ratio:48/60;image-rendering:pixelated;position:relative;z-index:1}
.bd-pad{position:absolute;bottom:14px;width:62%;height:26px;border-radius:50%;background:radial-gradient(rgba(77,226,255,.35),transparent 70%);animation:pad 2.4s ease-in-out infinite}
@keyframes pad{50%{opacity:.45;transform:scaleX(.9)}}
.bd-tag{position:absolute;top:2px;z-index:2;padding:6px 12px;background:#0b0f17;border:2px solid #4de2ff;color:#4de2ff;font:700 13px Mono,monospace;box-shadow:0 0 16px rgba(77,226,255,.3);animation:pop .4s cubic-bezier(.2,1.8,.4,1) both}

.bd-step{grid-area:step;display:flex;flex-direction:column;justify-content:center;min-height:380px}
.bs{display:flex;flex-direction:column;animation:in-r .45s cubic-bezier(.2,1,.3,1) both}
.bs.out{animation:out-l .25s ease-in both}
@keyframes in-r{from{transform:translateX(40px);opacity:0}}
@keyframes out-l{to{transform:translateX(-40px);opacity:0}}
.bs-k{margin:0 0 14px;font:700 15px Pixel,monospace;color:var(--gold);letter-spacing:3px}
.bs-h{margin:0;font:700 clamp(28px,3vw,40px)/1.1 Pixel,monospace;color:#fff;text-transform:uppercase}
.bs-h2{display:flex;align-items:center;gap:12px;margin:4px 0 0;font:700 clamp(22px,2.4vw,32px)/1.2 Mono,monospace;color:var(--cy);word-break:break-all}
.bs-h2 .xb{display:grid;place-items:center;width:40px;height:40px;flex:none;border:2px solid #3a4252;color:#fff}
.bs-d{margin:16px 0 22px;color:#cfd8e6;font-size:16px;max-width:400px}
.bs .pbtn{align-self:flex-start;min-width:280px;font-size:16px;padding:18px 26px;margin:0}
.bs .pbtn svg{width:20px;height:20px}
.bs .pbtn.wait{pointer-events:none;background:repeating-linear-gradient(-45deg,#ffd23f 0 12px,#f1c021 12px 24px);background-size:34px 34px;animation:barber .6s linear infinite}
@keyframes barber{to{background-position:34px 0}}
.bs-row{display:flex;gap:18px;align-items:center;margin-top:16px}
.bs-row .lnk{padding:8px 0}
.bs-row .cy{color:var(--cy);text-decoration:underline;text-underline-offset:5px}
.bs .field{max-width:420px;margin-bottom:20px;animation:glow 2.2s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 3px rgba(255,210,63,.12)}}
.bs .err{margin:12px 0 0;max-width:420px}
.bs .tiny{margin:-8px 0 18px;font-size:13px}
.bs .tiny a{color:var(--cy)}
.bs.done .bs-h{color:var(--gr)}

.bd-prog{grid-area:prog;list-style:none;display:flex;justify-content:space-between;margin:14px 0 0;padding:0;position:relative}
.bd-prog::before,.bd-prog .fill{content:"";position:absolute;left:4%;right:4%;top:15px;height:4px;background:#1d2532}
.bd-prog .fill{right:auto;background:linear-gradient(90deg,var(--gr),var(--gold));transition:width .7s cubic-bezier(.2,1,.3,1);box-shadow:0 0 10px rgba(255,210,63,.4)}
.bd-prog li{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;font:700 11px Pixel,monospace;color:#566070;letter-spacing:1px;text-align:center}
.bd-prog li i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:3px solid #3a4252;background:#0b0f17;font-style:normal;font-size:13px;color:#8f9aab;transition:all .3s}
.bd-prog li.ok i{background:var(--gr);border-color:var(--gr);color:#07110a;animation:pop .45s cubic-bezier(.2,1.8,.4,1) both}
.bd-prog li.on{color:var(--gold)}
.bd-prog li.on i{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 0 rgba(255,210,63,.6);animation:ring 1.6s infinite}
@keyframes ring{70%{box-shadow:0 0 0 12px rgba(255,210,63,0)}}
.bd-prog li.ok{color:#cfd8e6}
.bd-trust{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:22px}

.bd.powering .bd-panel{animation:charge 1.3s ease-in both}
@keyframes charge{30%{box-shadow:0 0 0 4px #07090e,0 0 80px rgba(255,210,63,.55)}100%{box-shadow:0 0 0 4px #07090e,0 0 140px rgba(255,210,63,.0)}}
.flash{position:fixed;inset:0;z-index:50;background:#fff7cf;pointer-events:none;animation:flash .7s ease-out both}
@keyframes flash{from{opacity:.85}to{opacity:0}}

@media (max-width:1100px){.bd-panel{grid-template-columns:180px 1fr 1fr;gap:6px 18px}.bd-parts li{padding:10px;font-size:11px;gap:10px}.bd-parts li svg{width:24px;height:24px}}
@media (max-width:860px){
  .bd-bg img{opacity:.25;height:70vh}
  .bd-t{font-size:clamp(24px,8vw,38px)}
  .bd-sub{margin-bottom:16px;font-size:14px}
  .bd-panel{grid-template-columns:1fr;grid-template-areas:"parts" "bot" "step" "prog";padding:14px;gap:10px}
  .bd-parts{flex-direction:row;overflow-x:auto;gap:6px;padding-bottom:4px;scrollbar-width:none}
  .bd-parts li{flex:none;padding:8px 10px;font-size:10px;gap:6px}
  .bd-parts li.on{transform:none}
  .bd-parts li svg{width:20px;height:20px}
  .bd-bot{min-height:0}
  .bd-bot canvas{width:170px}
  .bd-tag{font-size:12px}
  .bd-step{min-height:0}
  .bs .pbtn{align-self:stretch;min-width:0}
  .bs-k{font-size:12px;margin-bottom:8px}
  .bd-prog li{font-size:0;gap:0}
  .bd-prog li.on{font-size:9px;gap:6px}
  .bd-prog li i{width:26px;height:26px;font-size:11px}
  .bd-prog::before,.bd-prog .fill{top:11px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.bd-out{display:flex;justify-content:center;gap:14px;margin:10px 0 0;font:700 12px Pixel,monospace;letter-spacing:1px}
.bd-out a{color:var(--cy)}
.bd-out a:hover{color:var(--gold)}
.bd-out span{color:#3a4252}
.nav .pbtn.live{display:inline-flex;gap:8px;border:2px solid var(--gr);color:var(--gr);background:#0f2a1a;box-shadow:0 4px 0 #05140b,4px 8px 0 #000}
.nav .pbtn.live i{width:8px;height:8px;background:var(--gr);animation:blink 1.2s steps(1) infinite}
@media (max-width:860px){[data-page="claim"] .nav .pbtn.sm{padding:8px 9px;font-size:10px}[data-page="claim"] .nav{gap:8px}[data-page="claim"] .nav .logo span{display:none}}
