/* crawlipede v4.1 · hacker terminal. Loaded after tech.css. Calm, sparse, elite: CRT scanlines + vignette, mono everywhere,
   hairline green/cyan grid, typed terminal headers, HUD corner brackets, soft glitch only on transitions. */
:root{--bur:#4df5a0;--acid:#4df5a0;--cy:#5ee6ff;--hud:rgba(77,245,160,.55);--hud2:rgba(94,230,255,.35);
  --line:rgba(77,245,160,.09);--line2:rgba(77,245,160,.16);--sans:var(--mono);--disp:var(--mono)}
html{background:#050607 linear-gradient(rgba(77,245,160,.025) 1px,transparent 1px) 0 0/44px 44px;cursor:crosshair}
html{background-image:linear-gradient(rgba(77,245,160,.024) 1px,transparent 1px),linear-gradient(90deg,rgba(94,230,255,.02) 1px,transparent 1px);background-size:44px 44px}
a,button,summary,label,[role="tab"],.sc-pick,.btn,select{cursor:pointer}
input,textarea{cursor:text}
body{font-family:var(--mono);font-size:13.5px;letter-spacing:0;background:transparent}
body::before{display:none}
/* CRT: faint scanlines + vignette over everything, never interactive */
html::before,html::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2147483000}
html::before{background:repeating-linear-gradient(180deg,rgba(0,0,0,.5) 0 1px,transparent 1px 3px);opacity:.16}
html::after{background:radial-gradient(ellipse 120% 95% at 50% 45%,transparent 58%,rgba(0,0,0,.55) 100%)}
h1,h2,h3,h4,p,li,td,th,dd,dt,small,button,input{font-family:var(--mono)}
::selection{background:rgba(77,245,160,.28);color:#fff}
/* hero */
.grid-bg{background-image:linear-gradient(rgba(77,245,160,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(94,230,255,.06) 1px,transparent 1px)}
.grid-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(500px 260px at 22% 34%,rgba(77,245,160,.06),transparent 70%)}
.surface .prompt{font:400 13px var(--mono);color:var(--bur);min-height:1.5em;text-shadow:0 0 10px rgba(77,245,160,.35)}
.surface .prompt .dim{color:var(--dim)}
.cur{display:inline-block;color:var(--bur);animation:blink 1.1s steps(1) infinite;margin-left:1px}
.surface .wordmark{font-weight:200;text-shadow:0 0 1px rgba(230,237,243,.6),0 0 38px rgba(77,245,160,.12)}
.surface .wordmark span{color:var(--bur);text-shadow:0 0 18px rgba(77,245,160,.55)}
.surface .tagline{font:400 13.5px/1.7 var(--mono)}
.surface .tagline b{font:500 clamp(17px,1.6vw,21px)/1.3 var(--mono)}
.ca-row{border-style:dashed;border-color:var(--line2)}
.ca-row .k{color:var(--bur)}
.ca-row .v{white-space:nowrap}
.ca-row .v::before{content:"[ ";color:var(--dim2)}.ca-row .v::after{content:" ]";color:var(--dim2)}
.btn.primary{background:transparent;color:var(--bur);border-color:var(--bur);box-shadow:0 0 0 1px rgba(77,245,160,.15),0 0 18px -6px rgba(77,245,160,.55)}
.btn.primary:hover{background:rgba(77,245,160,.1);color:#d8ffe9}
.start-here{opacity:.8}.sh-arrow{display:none}
.start-here .sh-label{font:400 11px/1 var(--mono)!important;color:var(--bur)!important;transform:none;text-shadow:none;left:auto;right:6px;top:auto;bottom:16px;white-space:nowrap;animation:fade 1s var(--ease) both .8s}
.start-here .sh-label::after{content:" →";position:static;background:none;height:auto;opacity:1}
@media (max-width:640px){.start-here{display:none!important}}
/* HUD corner brackets on framed panels (pure css layers, no extra nodes) */
.panel,.battle-hero,.spec,.bp,.bt-me,.fair,.brain-strip{--hc:var(--hud);
  background-image:linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),
  linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc));
  background-repeat:no-repeat;
  background-size:12px 1px,1px 12px,12px 1px,1px 12px,12px 1px,1px 12px,12px 1px,1px 12px;
  background-position:0 0,0 0,100% 0,100% 0,0 100%,0 100%,100% 100%,100% 100%;border-radius:2px!important}
.panel{background-color:rgba(7,9,10,.78)}
.battle-hero{background-color:rgba(6,9,9,.86)}
.spec{background-color:#070a0b}
.bp{background-color:#070a0b}
.spec.judged,.side-card.lead{--hc:var(--bur)}
/* panel headers read like ascii frames: [ title ] */
.ph{border-bottom-style:dashed}
.ph .pt::before{content:"[ ";color:var(--dim2)}
.ph .pt>.tn{color:var(--dim2)}
.ph .tag{border:0;color:var(--bur);padding:0 2px}
.ph .tag::before{content:"<";color:var(--dim2)}.ph .tag::after{content:">";color:var(--dim2)}
.bh-top{border-bottom-style:dashed}
.bh-top::before{content:"> ";color:var(--bur)}
.term-h{margin:0 0 14px;font:400 12.5px var(--mono);color:var(--bur);min-height:1.4em;text-shadow:0 0 10px rgba(77,245,160,.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.term-h .dim{color:var(--dim)}
.sec-h{font:300 clamp(24px,2.9vw,38px)/1.18 var(--mono);letter-spacing:-.035em;height:auto;max-width:22em}
.sec-h em{color:var(--bur);text-shadow:0 0 18px rgba(77,245,160,.25)}
.bt-lede{font-size:13px;line-height:1.7}
.tbl td,.tbl th{border-bottom-style:dashed}
.tbl td{font-variant-numeric:tabular-nums}
.side-card{transition:background .8s var(--ease)}
.side-card h3::before{content:"// ";color:var(--dim2)}
.tug{background:repeating-linear-gradient(90deg,rgba(77,245,160,.16) 0 2px,transparent 2px 5px)}
.tug .tug-s{box-shadow:0 0 10px rgba(180,155,255,.5)}.tug .tug-c{box-shadow:0 0 10px rgba(77,245,160,.5)}
.tabs{border-top-style:dashed;border-bottom-style:dashed}
.tabs a.on,.tabs a[data-tab="battle"].on{background:rgba(77,245,160,.07);color:var(--bur);box-shadow:inset 0 -1px 0 var(--bur);text-shadow:0 0 10px rgba(77,245,160,.45)}
.tabs a.on::after{content:"_";margin-left:2px;animation:blink 1.1s steps(1) infinite}
.statusbar{border-top-style:dashed;background:rgba(5,6,7,.95)}
.statusbar .xy{color:var(--dim2)}
.statusbar .xy b{color:var(--cy)}
.chip{border-style:dashed}
.stamp{border-style:dashed}
.spec.scan::after{background:linear-gradient(180deg,transparent,rgba(94,230,255,.05) 70%,rgba(77,245,160,.25) 99%,transparent)}
.br-mark{-webkit-text-stroke:1px rgba(77,245,160,.28)}
/* the soft glitch: transitions only (tab switch), ~300ms, then nothing */

.tabpanel.glitch .sec-h,.tabpanel.glitch .term-h{animation:gsplit .34s steps(3,end) both}
@keyframes glitch{0%{clip-path:inset(12% 0 64% 0);transform:translateX(-3px);opacity:.7}25%{clip-path:inset(58% 0 18% 0);transform:translateX(3px)}50%{clip-path:inset(30% 0 40% 0);transform:translateX(-1px);opacity:.9}100%{clip-path:inset(0);transform:none;opacity:1}}
@keyframes gsplit{0%{text-shadow:-2px 0 rgba(180,155,255,.8),2px 0 rgba(94,230,255,.8)}60%{text-shadow:1px 0 rgba(180,155,255,.5),-1px 0 rgba(94,230,255,.5)}100%{text-shadow:none}}
.scr{color:var(--bur);opacity:.85}
@media (max-width:640px){body{font-size:13px}.term-h{font-size:11.5px}.sec-h{font-size:clamp(22px,7vw,30px)}html::before{opacity:.13}}
@media (prefers-reduced-motion:reduce){.tabpanel.glitch,.tabpanel.glitch *{animation:none!important}.cur,.tabs a.on::after{animation:none}}
/* creatures load the text (reveal.js) */
.rv-pend{visibility:hidden}
.rv-pend-rows tbody tr,.rv-pend-rows.rd-top>*,.rv-pend-rows.sig-stats>*{opacity:0}
.rv-rows tbody tr,.rv-rows.rd-top>*,.rv-rows.sig-stats>*{opacity:0;transform:translateX(-6px);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.rv-rows tbody tr.rv-in,.rv-rows.rd-top>.rv-in,.rv-rows.sig-stats>.rv-in{opacity:1;transform:none}
.rc-h{opacity:0}
.rc-s{color:var(--bur);text-shadow:0 0 8px rgba(77,245,160,.6)}
.rv-mask{-webkit-mask-image:linear-gradient(90deg,#000 calc(var(--rx,0px) - 60px),rgba(0,0,0,.35) calc(var(--rx,0px) - 22px),transparent var(--rx,0px));mask-image:linear-gradient(90deg,#000 calc(var(--rx,0px) - 60px),rgba(0,0,0,.35) calc(var(--rx,0px) - 22px),transparent var(--rx,0px))}
/* flow (flow.js) */
html{scroll-padding-top:110px}
/* the bar never changes height on scroll (a sticky bar that resizes shifts the whole page): condensing is colour + shadow only */
.bar{transition:background .35s var(--ease),box-shadow .35s var(--ease)}
.bar.condensed{background:rgba(5,6,7,.95);box-shadow:0 8px 20px -14px rgba(0,0,0,.9)}
.grid-bg{will-change:transform}
/* scroll-linked entrance: --k (0..1) is written every frame from the element's position, so it is glued to the scroll (no timed transition) */
/* scale (never translate) so the effect can't grow the page's scroll height near the bottom */
.slk{transform:scale(calc(.965 + .035 * var(--k,1)));opacity:calc(.4 + .6 * var(--k,1))}
.rw{white-space:nowrap}
.tab-wipe{position:fixed;left:0;right:0;top:0;height:100vh;pointer-events:none;z-index:35;opacity:0}
.tab-wipe.go{animation:wipe .5s var(--ease) both}
.tab-wipe::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background:#050607}
.tab-wipe::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--bur);box-shadow:0 0 12px 2px rgba(77,245,160,.55)}
@keyframes wipe{0%{opacity:1;clip-path:inset(0 0 0 0)}100%{opacity:1;clip-path:inset(100% 0 0 0)}}
.tab-wipe.go::after{animation:wipeLine .5s var(--ease) both}
@keyframes wipeLine{from{transform:translateY(0)}to{transform:translateY(100vh)}}
.rail{position:fixed;right:4px;top:0;width:40px;height:100vh;pointer-events:none;z-index:46}
.rail canvas{position:absolute;inset:0;width:40px;height:100%}
.rail-line{position:absolute;right:19.5px;top:calc(var(--barH,44px) + 50px);bottom:64px;width:1px;background:linear-gradient(180deg,transparent,rgba(77,245,160,.22) 8%,rgba(77,245,160,.22) 92%,transparent)}
.rail-pct{position:absolute;right:30px;top:-6px;font:400 9.5px var(--mono);color:var(--dim2);font-weight:400}
@media (max-width:900px){.rail{display:none}}
@media (prefers-reduced-motion:reduce){.slk{transform:none;opacity:1}.tab-wipe{display:none}.bar{transition:none}}
/* ===== readability pass: bigger, brighter, shorter lines. scanlines never get in the way ===== */
:root{--tx:#dfe5ec;--ink0:#f2f5f8;--dim:#a3adba;--dim2:#7a8593;--read:"Inter",ui-sans-serif,system-ui,sans-serif}
html::before{opacity:.05}
html::after{background:radial-gradient(ellipse 130% 110% at 50% 45%,transparent 72%,rgba(0,0,0,.45) 100%)}
body{font-size:17px;line-height:1.65}
p,li,dd{font-family:var(--read);font-size:17px;line-height:1.7;color:var(--tx)}
p{max-width:68ch}
.surface .tagline{font:400 18px/1.7 var(--read);color:var(--tx);max-width:34em}
.surface .tagline b{font:500 clamp(19px,1.8vw,24px)/1.3 var(--mono);color:var(--ink0)}
.bt-lede,.sig-intro p,.crew-head p{font:400 17px/1.75 var(--read);color:var(--tx)}
.sec-h{font-size:clamp(28px,3.2vw,42px);line-height:1.15;margin-bottom:18px}
.pb{padding:24px 26px}
.panel{margin-bottom:28px}
.ph{padding:12px 18px}
.pt{font-size:14.5px}
.tag,.state{font-size:12.5px}
.sc-style{font:400 13.5px/1.5 var(--read);color:var(--dim)}
.sc-meta{font-size:12.5px;color:var(--dim)}
.sc-score small,.tug-lbl{font-size:13px}
.bh-mine{font:400 14.5px/1.55 var(--read);color:var(--dim)}
.bh-top{font-size:13px}
.tbl th{font-size:12px;color:var(--dim)}
.tbl td{font-size:15px}
.statusbar{font-size:12.5px}
.chip{font-size:12.5px}
.tabs a{font-size:14px;padding:13px 18px}
.term-h{font-size:14px}
.hero-sol{font-size:13.5px}
.ca-row{font-size:14px}
.ca-row .n{font-size:12.5px}
.spec .sig-sum,.spec .sig-call{font-size:15px}
.rd-stat .k{font-size:12px}
.how-link{font-size:13.5px}
/* ===== step 1 · choose your crawler, then 2 · crawl, 3 · win ===== */
.flow123{position:relative;padding:70px 24px 40px;border-top:1px dashed var(--line2)}
.f-in{max-width:1120px;margin:0 auto}
.f-step{margin:0 0 8px;font:400 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.f-step b{color:var(--bur);font-weight:500}
.f-h{margin:0 0 14px;font:400 clamp(34px,4.4vw,58px)/1.05 var(--mono);letter-spacing:-.04em;color:var(--ink0);text-transform:uppercase}
.f-lede{margin:0 0 34px;font:400 18px/1.7 var(--read);color:var(--tx);max-width:60ch}
.cy-cards{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:stretch}
.cy-card{position:relative;display:flex;flex-direction:column;padding:22px 24px 24px;border:1px solid var(--line2);border-radius:4px;background:rgba(7,10,11,.85);--hc:var(--tc);
  background-image:linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc)),linear-gradient(var(--hc),var(--hc));
  background-repeat:no-repeat;background-size:16px 1.5px,1.5px 16px,16px 1.5px,1.5px 16px,16px 1.5px,1.5px 16px,16px 1.5px,1.5px 16px;background-position:0 0,0 0,100% 0,100% 0,0 100%,0 100%,100% 100%,100% 100%;transition:border-color .6s var(--ease),box-shadow .6s var(--ease)}
.cy-spider{--tc:var(--web)}.cy-crawl{--tc:var(--bur)}
.cy-card:hover{border-color:color-mix(in srgb,var(--tc) 45%,transparent);box-shadow:0 0 40px -20px var(--tc)}
.cy-live{display:block;width:100%;height:190px;margin:-6px 0 10px;border-bottom:1px dashed var(--line)}
.cy-team{margin:0;font:400 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tc)}
.cy-card h3{margin:4px 0 14px;font:500 clamp(30px,3vw,40px)/1 var(--mono);letter-spacing:-.03em;color:var(--ink0);text-transform:uppercase}
.cy-perks{margin:0 0 18px;padding:0;list-style:none}
.cy-perks li{position:relative;padding:6px 0 6px 22px;font:400 16.5px/1.5 var(--read);color:var(--tx)}
.cy-perks li::before{content:">";position:absolute;left:0;top:6px;font-family:var(--mono);color:var(--tc)}
.cy-perks b{color:var(--ink0);font-weight:600}
.cy-stat{margin:auto 0 16px;font:400 14px var(--mono);color:var(--dim)}
.cy-stat b{font-weight:500;color:var(--tc);font-size:18px}
.cy-pick{width:100%;padding:16px 18px;border:1px solid var(--tc);border-radius:4px;background:color-mix(in srgb,var(--tc) 10%,transparent);color:var(--ink0);font:600 17px var(--mono);letter-spacing:.02em;cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease)}
.cy-pick:hover{background:color-mix(in srgb,var(--tc) 22%,transparent);box-shadow:0 0 26px -8px var(--tc)}
.cy-pick.on{background:var(--tc);color:#05060a}
.cy-vs{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.cy-vs span{font:500 22px var(--mono);color:var(--ink0);border:1px solid var(--line2);padding:8px 12px;border-radius:3px}
.cy-vs small{font:400 12.5px/1.5 var(--mono);color:var(--dim);letter-spacing:.06em;text-transform:uppercase}
.cy-note{margin:20px 0 0;font:400 15px/1.6 var(--read);color:var(--dim);max-width:none;text-align:center}
.f-next{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.f-next>li{display:flex;gap:18px;padding:22px 24px;border:1px dashed var(--line2);border-radius:4px}
.f-n{flex:none;display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--line2);border-radius:50%;font:500 20px var(--mono);color:var(--dim);transition:color .25s,border-color .25s,box-shadow .25s}
.f-next>li.reached .f-n{border-color:var(--bur);color:var(--bur);box-shadow:0 0 18px -6px var(--bur)}
/* pinned step strip: sticks under the bar while you scroll through the flow, fill = scroll progress (written per frame) */
.f-prog{position:sticky;top:calc(var(--barH,44px) + 6px);z-index:6;max-width:1120px;margin:-40px auto 34px;display:flex;align-items:center;gap:0;padding:8px 12px;border:1px solid var(--line2);border-radius:4px;background:rgba(5,7,8,.92);backdrop-filter:blur(8px);font:400 12.5px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.f-prog a{display:flex;align-items:center;gap:8px;color:var(--dim2);text-decoration:none;white-space:nowrap;transition:color .25s}
.f-prog a i{display:grid;place-items:center;width:22px;height:22px;border:1px solid var(--line2);border-radius:50%;font-style:normal;font-size:11.5px;transition:border-color .25s,color .25s,background .25s}
.f-prog a.done,.f-prog a.on{color:var(--tx)}
.f-prog a.done i{border-color:var(--bur);color:var(--bur)}
.f-prog a.on i{border-color:var(--bur);background:var(--bur);color:#04110a}
.f-prog .fp-seg{flex:1;height:2px;margin:0 12px;background:var(--line2);border-radius:2px;overflow:hidden}
.f-prog .fp-seg b{display:block;height:100%;width:100%;background:var(--bur);transform-origin:0 50%;transform:scaleX(var(--f,0))}
@media (max-width:640px){.f-prog{margin:-30px -4px 24px;padding:7px 10px;font-size:11px;letter-spacing:.04em}.f-prog .fp-seg{margin:0 7px}.f-prog a i{width:20px;height:20px}}
.f-next h3{margin:0 0 8px;font:500 22px/1.25 var(--mono);color:var(--ink0);letter-spacing:-.02em}
.f-next p{margin:0 0 14px;font-size:16px}
.f-next .f-step{margin-bottom:4px;font-size:12px}
@media (max-width:820px){.cy-cards{grid-template-columns:1fr}.cy-vs{flex-direction:row}.cy-vs small br{display:none}.f-next{grid-template-columns:1fr}}
@media (max-width:640px){body,p,li,dd{font-size:16px}.flow123{padding:48px 16px 28px}.surface .tagline{font-size:16.5px}.cy-live{height:150px}.cy-card{padding:18px}.pb{padding:18px 16px}.f-lede{font-size:16.5px}}
/* ---- make a crawlr (launchpad tab) */
.crawlr,.cr-nestp,.prof{margin:22px auto;max-width:1180px;padding:26px 28px}
.cr-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 20px}
.cr-head .f-lede{flex-basis:100%;margin:6px 0 0}
.cr-form{margin-top:22px}
.cr-form>label{display:block;font:500 13px var(--mono);color:var(--bur);margin-bottom:8px}
.cr-in{display:flex;gap:12px;align-items:stretch}
.cr-in textarea{flex:1;min-height:58px;resize:vertical;padding:14px 16px;background:rgba(3,6,6,.9);border:1px solid var(--line2);border-radius:4px;color:var(--ink0,#eef3f6);font:400 16px/1.45 var(--mono);outline:none}
.cr-in textarea:focus{border-color:var(--bur);box-shadow:0 0 0 1px rgba(77,245,160,.2),0 0 24px -10px var(--bur)}
.cr-in .btn{min-width:150px}
.cr-ex{margin:10px 0 0;font-size:12.5px;color:var(--dim)}
.cr-ex button{margin:0 6px 4px 0;padding:4px 10px;border:1px dashed var(--line2);border-radius:3px;background:none;color:var(--tx);font:400 12.5px var(--mono)}
.cr-ex button:hover{border-color:var(--bur);color:var(--bur)}
.cr-msg{min-height:1.4em;margin:10px 0 0;font:400 13px var(--mono);color:var(--dim)}
.cr-msg.bad{color:#ff7a85}
.cr-out{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:22px;margin-top:22px}
.cr-out[hidden]{display:none}
.cr-stage{position:relative;min-height:420px;border:1px solid var(--line2);border-radius:4px;background:#040606 linear-gradient(rgba(77,245,160,.05) 1px,transparent 1px) 0 0/32px 32px;overflow:hidden}
.cr-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.cr-tag{position:absolute;left:14px;bottom:10px;right:14px;margin:0;font:400 13px var(--mono);color:var(--dim);pointer-events:none}
.cr-traits{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cr-traits li,.cf-g li{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border:1px dashed var(--line2);border-radius:3px;max-width:none}
.cr-traits span,.cf-g span{font:400 11px var(--mono);color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.cr-traits b,.cf-g b{font:500 14px var(--mono);color:var(--ink0,#eef3f6);word-break:break-word}
.sw{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.cr-token{margin:0 0 16px;display:flex;gap:14px;align-items:center}
.cr-token img{width:120px;height:120px;border:1px solid var(--line2);border-radius:4px;image-rendering:auto}
.cr-token figcaption{font:400 12.5px/1.5 var(--mono);color:var(--dim)}
.cr-token a{color:var(--bur)}
.cr-launch{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;align-items:end}
.cr-launch label{display:flex;flex-direction:column;gap:5px;font:400 11.5px var(--mono);color:var(--dim);text-transform:uppercase;letter-spacing:.05em}
.cr-launch label:nth-of-type(3){grid-column:1/-1}
.cr-launch input,.cf-ok input{accent-color:var(--bur)}
.cr-launch input{padding:10px 12px;background:rgba(3,6,6,.9);border:1px solid var(--line2);border-radius:3px;color:var(--ink0,#eef3f6);font:500 15px var(--mono);text-transform:none;letter-spacing:0}
.cr-launch .btn{grid-column:1/-1}
.cr-confirm{margin-top:16px;padding:16px;border:1px solid color-mix(in srgb,var(--bur) 45%,transparent);border-radius:4px;background:rgba(77,245,160,.035)}
.cf-h{margin:0 0 10px;font:500 13px var(--mono);color:var(--bur)}
.cf-g{display:flex;gap:14px;align-items:flex-start}
.cf-g img{width:96px;height:96px;border-radius:4px;border:1px solid var(--line2);flex:none}
.cf-g ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px;flex:1}
.cf-g li:nth-last-child(-n+2){grid-column:1/-1}
.cf-ok{display:flex;gap:10px;align-items:flex-start;margin:14px 0 12px;font:400 13px/1.5 var(--read,var(--mono));color:var(--tx)}
.cr-confirm .btn{width:100%}
.cr-confirm .btn[disabled]{opacity:.55;cursor:not-allowed}
.cr-risk{margin:20px 0 0;padding-top:12px;border-top:1px dashed var(--line2);font:400 12.5px var(--mono);color:var(--dim)}
.cr-risk::before{content:"! ";color:#ffb23f}
.cr-n-count{font:400 13px var(--mono);color:var(--dim)}
.cr-nest{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.cr-n{display:flex;gap:12px;padding:12px;border:1px solid var(--line2);border-radius:4px;background:rgba(7,10,11,.85);max-width:none}
.cr-n canvas{width:110px;height:110px;flex:none;border:1px dashed var(--line);border-radius:3px;background:#040606}
.cr-n b{font:500 16px var(--mono);color:var(--ink0,#eef3f6)}
.cr-n .tk{font:400 13px var(--mono);color:var(--bur)}
.cr-n p{margin:4px 0 8px;font:400 12.5px/1.45 var(--mono);color:var(--dim);max-width:none}
.cr-n dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:0;font:400 12.5px var(--mono)}
.cr-n dt{color:var(--dim);text-transform:uppercase;font-size:11px}
.cr-n dd{margin:0}
.cr-n a,.cr-n .cp{color:var(--bur);background:none;border:0;padding:0;font:inherit}
.cr-empty{grid-column:1/-1;padding:22px;border:1px dashed var(--line2);border-radius:4px;color:var(--dim);font:400 14px/1.6 var(--read,var(--mono));max-width:none}
@media (max-width:860px){
  .crawlr,.cr-nestp,.prof{padding:18px 14px;margin:14px 8px}
  .cr-in{flex-direction:column}
  .cr-out{grid-template-columns:1fr}
  .cr-stage{min-height:300px}
  .cr-traits{grid-template-columns:repeat(2,1fr)}
  .cf-g{flex-direction:column}
}
/* ---- boot screen (first visit per session) */
#boot{display:none}
html.booting body{overflow:hidden}
html.booting #boot{display:block;position:fixed;inset:0;z-index:2147482000;cursor:pointer;--seam:50vh;
  background:linear-gradient(#000,#000) top/100% 6vh no-repeat,linear-gradient(#000,#000) bottom/100% 6vh no-repeat,
  linear-gradient(rgba(77,245,160,.18),rgba(77,245,160,.18)) 0 6vh/100% 1px no-repeat,linear-gradient(rgba(77,245,160,.18),rgba(77,245,160,.18)) 0 calc(94vh - 1px)/100% 1px no-repeat,
  radial-gradient(ellipse at 50% 50%,#06090a 0,#020303 75%) ,#020303}
#boot canvas{position:absolute;inset:0;width:100%;height:100%}
.bt-log{position:absolute;left:clamp(16px,3vw,40px);top:calc(6vh + 18px);font:400 12.5px/1.75 var(--mono);color:#a9f5cf;text-shadow:0 0 10px rgba(77,245,160,.3)}
.bt-log p{margin:0;max-width:none;white-space:nowrap}
.bt-log .dim{color:#3d6b55}
.bt-log .cur{color:var(--bur);margin-left:1px}
.bt-log .st{margin-left:12px;font-weight:500;color:var(--bur);opacity:0;transition:opacity .12s}
.bt-log p.done .st{opacity:1}
.bt-wm{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.98);font:200 clamp(42px,8.5vw,118px)/1 var(--mono);letter-spacing:-.04em;color:#1f3a2e;white-space:nowrap;opacity:0;transition:opacity .3s,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.bt-wm.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.bt-wm span{display:inline-block;min-width:.6em;text-align:center;transition:color .2s}
.bt-wm .near{color:#5ee6ff;text-shadow:0 0 14px rgba(94,230,255,.6)}
.bt-wm .ok{color:#eef3f6;text-shadow:0 0 1px rgba(230,237,243,.6),0 0 30px rgba(77,245,160,.18)}
.bt-wm .hl.ok{color:var(--bur);text-shadow:0 0 18px rgba(77,245,160,.6)}
.bt-wm .lock{animation:btlock .45s cubic-bezier(.2,.8,.2,1)}
@keyframes btlock{0%{transform:translateY(-.08em);color:#5ee6ff;text-shadow:-2px 0 rgba(255,60,120,.7),2px 0 rgba(94,230,255,.8),0 0 24px rgba(94,230,255,.8)}100%{transform:none}}
.bt-wm.locked{animation:btflash .35s ease-out}
@keyframes btflash{0%{filter:brightness(1.8) drop-shadow(0 0 18px rgba(77,245,160,.8))}100%{filter:none}}
.bt-skip{position:absolute;right:18px;bottom:calc(6vh + 14px);padding:6px 12px;border:1px dashed rgba(77,245,160,.35);border-radius:3px;background:none;color:#7f9a8c;font:400 12px var(--mono)}
.bt-skip:hover{color:var(--bur);border-color:var(--bur)}
/* exit: the screen splits open along the wordmark line, two scan lines racing outward */
#boot.wipe{animation:btsplit .46s cubic-bezier(.75,0,.25,1) forwards}
#boot.wipe::before,#boot.wipe::after{content:"";position:absolute;left:0;right:0;top:var(--seam);height:2px;background:var(--bur);box-shadow:0 0 18px 2px rgba(77,245,160,.7)}
#boot.wipe::before{animation:btup .46s cubic-bezier(.75,0,.25,1) forwards}
#boot.wipe::after{animation:btdown .46s cubic-bezier(.75,0,.25,1) forwards}
@keyframes btsplit{from{clip-path:polygon(0 0,100% 0,100% var(--seam),0 var(--seam),0 var(--seam),100% var(--seam),100% 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 0,0 0,0 100%,100% 100%,100% 100%,0 100%)}}
@keyframes btup{to{top:0}}
@keyframes btdown{to{top:calc(100% - 2px)}}
/* ---- page breaks: extracted word blocks */
.bk-layer{position:absolute;left:0;top:0;width:0;height:0;z-index:44;pointer-events:none}
.bk-blk{position:absolute;left:0;top:0;padding:.06em .14em;margin:-.06em -.14em;border-radius:2px;white-space:nowrap;text-align:center;transform-origin:50% 50%;will-change:transform;box-sizing:content-box;text-shadow:none;transition:opacity .4s}
.bk-blk.bk-out{opacity:0}
.bk-w.bk-hot{color:#4df5a0;text-shadow:0 0 12px rgba(77,245,160,.8)}
.bk-w.bk-back{animation:bkback .7s ease-out}
@keyframes bkback{0%{color:#4df5a0;text-shadow:0 0 14px rgba(77,245,160,.9)}100%{text-shadow:none}}
.bk-fix{position:fixed;left:14px;bottom:42px;z-index:60;padding:6px 11px;border:1px dashed rgba(77,245,160,.45);border-radius:3px;background:rgba(5,6,7,.9);color:var(--bur);font:400 12px var(--mono)}
.bk-fix:hover{background:rgba(77,245,160,.1)}
.bk-fix[hidden]{display:none}
.cf-ok input{width:16px;height:16px;flex:none;margin:3px 0 0;padding:0}
.cf-ok{justify-content:flex-start;text-align:left}
.cr-grad{margin:10px 0 0;font:400 14px/1.6 var(--read,var(--mono));color:var(--tx);max-width:90ch;padding:10px 12px;border-left:2px solid #b49bff;background:rgba(180,155,255,.05)}
.cr-grad b{color:var(--ink0,#eef3f6)}
.cr-badge{display:inline-block;margin:0 0 6px;padding:2px 8px;border-radius:2px;background:#b49bff;color:#0b0716;font:600 11px var(--mono);letter-spacing:.04em;text-transform:uppercase}
.cr-n.grad{border-color:rgba(180,155,255,.55);box-shadow:0 0 30px -16px #b49bff}
.skin-pick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0 0;font:400 12.5px var(--mono);color:var(--dim)}
.skin-pick .sk-h{color:var(--bur);text-transform:uppercase;letter-spacing:.06em;font-size:11px;margin-right:4px}
.skin-pick button{padding:4px 10px;border:1px dashed var(--line2);border-radius:3px;background:none;color:var(--tx);font:400 12.5px var(--mono)}
.skin-pick button.on{border-style:solid;border-color:var(--bur);color:var(--bur)}
.skin-pick a{color:var(--bur)}
.cr-fee{grid-column:1/-1;margin:2px 0 4px;padding:10px 12px;border:1px dashed rgba(77,245,160,.3);border-radius:3px;font:400 13px/1.55 var(--read,var(--mono));color:var(--tx);max-width:none}
.cr-fee b{color:var(--bur)}
.cr-fee code{font:500 12.5px var(--mono);color:#5ee6ff}
#crShare{width:100%;margin-top:10px}
/* ---- crawl target picker: random · a site · crawlpad pack */
.tp{margin:14px 0;padding:14px 16px;border:1px dashed var(--line2);border-radius:4px;background:rgba(5,7,8,.6)}
.tp-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:10px}
.tp-h{font:500 13px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bur)}
.tp-sum{font:400 12.5px var(--mono);color:var(--dim);overflow-wrap:anywhere}
.tp-modes{display:flex;flex-wrap:wrap;gap:6px}
.tp-modes button{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid var(--line2);border-radius:3px;background:transparent;color:var(--tx);font:500 13.5px var(--mono);cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.tp-modes button i{font-style:normal;color:var(--dim2)}
.tp-modes button:hover{border-color:color-mix(in srgb,var(--bur) 50%,transparent)}
.tp-modes button.on{border-color:var(--bur);background:rgba(77,245,160,.1);color:var(--ink0)}
.tp-modes button.on i{color:var(--bur)}
.tp-body{margin-top:10px}
.tp-row{display:flex;gap:8px}
.tp-row input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line2);border-radius:3px;background:#040606;color:var(--ink0);font:400 14px var(--mono)}
.tp-row input:focus{outline:none;border-color:var(--bur)}
.tp-row .btn{white-space:nowrap}
.tp-st{margin:8px 0 0;font:400 13px/1.55 var(--mono);color:var(--dim);overflow-wrap:anywhere}
.tp-st em{color:var(--honey,#e8c35a);font-style:normal}
.tp-hosts{color:var(--dim2);font-size:12px}
.tp-req{margin-top:8px;padding:7px 12px;border:1px dashed rgba(77,245,160,.5);border-radius:3px;background:transparent;color:var(--bur);font:500 12.5px var(--mono);cursor:pointer}
.tp-chips{display:flex;flex-wrap:wrap;gap:6px}
.tp-chip{padding:6px 11px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--tx);font:500 13px var(--mono);cursor:pointer}
.tp-chip small{margin-left:4px;color:var(--dim2);font-size:11px}
.tp-chip.on{border-color:var(--bur);background:rgba(77,245,160,.12);color:var(--ink0)}
.tp-chip.pend{border-style:dashed;color:var(--dim)}
.f-target{max-width:760px;margin:22px auto 0}
@media (max-width:640px){.tp{padding:12px}.tp-row{flex-direction:column}.tp-modes button{flex:1;justify-content:center;padding:8px 6px;font-size:12.5px}}
/* ---- product focus: make a crawlr leads the hero; the battle is an experiment at the end of the tabs */
.make-hero{position:relative;padding:20px 22px;border:1px solid var(--line2);border-radius:6px;background:rgba(6,9,9,.86);backdrop-filter:blur(6px);box-shadow:0 30px 80px -50px #000}
.mh-k{margin:0 0 12px;font:500 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bur)}
.mh-k span{color:var(--dim);letter-spacing:.06em}
.mh-form{display:flex;gap:8px}
.mh-form input{flex:1;min-width:0;padding:12px 13px;border:1px solid var(--line2);border-radius:3px;background:#040606;color:var(--ink0);font:400 15px var(--mono)}
.mh-form input:focus{outline:none;border-color:var(--bur)}
.mh-form .btn{white-space:nowrap}
.mh-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.mh-steps li{display:grid;grid-template-columns:96px 1fr;gap:10px;padding:10px 0 0;border-top:1px dashed var(--line)}
.mh-steps b{font:500 13px var(--mono);color:var(--ink0);text-transform:uppercase;letter-spacing:.06em}
.mh-steps span{font:400 14.5px/1.5 var(--read);color:var(--tx)}
.mh-steps i{color:var(--dim);font-style:normal}
.mh-grad{margin:14px 0 0;padding:10px 12px;border:1px dashed rgba(77,245,160,.35);border-radius:3px;font:400 13px/1.5 var(--mono);color:var(--dim)}
.f-cta{margin:0 0 8px}
.f-next .f-target{margin:4px 0 14px}
.exp{margin:0 0 22px;padding:26px 24px;border:1px dashed var(--line2);border-radius:6px}
.exp .bt-lede{max-width:72ch}
.exp-grid{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:22px;align-items:start;margin-top:18px}
.exp-cards .cy-cards{grid-template-columns:1fr}
.exp-cards .cy-vs{flex-direction:row}.exp-cards .cy-vs small br{display:none}
.tabs a.tab-exp{opacity:.8}
.tabs a.tab-exp small{margin-left:6px;padding:1px 6px;border:1px dashed var(--line2);border-radius:999px;font:400 10.5px var(--mono);color:var(--dim);letter-spacing:.04em}
@media (max-width:980px){.exp-grid{grid-template-columns:1fr}}
@media (max-width:640px){.make-hero{padding:14px}.mh-form{flex-direction:column}.mh-steps li{grid-template-columns:1fr;gap:2px}.exp{padding:16px 14px}}
.br-mark span{-webkit-text-stroke-color:rgba(77,245,160,.5)}
/* ---- $CrawlPad CA slot: hero-level, premium; swaps to the live mint by editing js/ca.js */
.ca-slot{position:relative;margin-top:22px;max-width:620px;padding:16px 18px 14px;border:1px solid color-mix(in srgb,var(--bur) 45%,transparent);border-radius:6px;background:linear-gradient(180deg,rgba(77,245,160,.07),rgba(4,8,7,.85) 60%);box-shadow:0 0 0 1px rgba(77,245,160,.06),0 24px 60px -34px rgba(77,245,160,.45)}
.ca-slot::before{content:"";position:absolute;inset:-1px;border-radius:7px;padding:1px;background:linear-gradient(100deg,rgba(77,245,160,.9),rgba(94,230,255,.25) 40%,rgba(180,155,255,.5) 70%,rgba(77,245,160,.9));-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:.7}
.cas-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:10px}
.cas-t{font:600 22px var(--mono);color:var(--ink0);letter-spacing:-.01em;text-shadow:0 0 18px rgba(77,245,160,.35)}
.cas-k{font:400 12px var(--mono);color:var(--dim);letter-spacing:.12em;text-transform:uppercase}
.cas-st{margin-left:auto;padding:2px 9px;border:1px dashed var(--line2);border-radius:999px;font:500 11.5px var(--mono);color:var(--dim);letter-spacing:.06em;text-transform:uppercase}
.ca-slot[data-state="live"] .cas-st{border-style:solid;border-color:var(--bur);color:var(--bur)}
.cas-row{display:flex;gap:8px;align-items:stretch}
.cas-v{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:13px 14px;border:1px solid var(--line2);border-radius:4px;background:#030505;font:500 17px var(--mono);color:var(--ink0);letter-spacing:.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-slot[data-state="soon"] .cas-v{color:var(--dim)}
.cas-dots{display:inline-flex;gap:5px}.cas-dots i{width:6px;height:6px;border-radius:50%;background:var(--bur);opacity:.25;animation:casDot 1.4s infinite}.cas-dots i:nth-child(2){animation-delay:.2s}.cas-dots i:nth-child(3){animation-delay:.4s}
@keyframes casDot{0%,100%{opacity:.2}50%{opacity:.9}}
.ca-slot[data-state="live"] .cas-dots{display:none}
.cas-copy{min-width:92px;padding:0 16px;border:1px solid var(--bur);border-radius:4px;background:var(--bur);color:#04110a;font:600 15px var(--mono);cursor:pointer}
.cas-copy:disabled{background:transparent;color:var(--dim2);border-color:var(--line2);cursor:default}
.cas-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:10px;font:500 13px var(--mono)}
.cas-links a{color:var(--bur);text-decoration:none}
.cas-links a[aria-disabled="true"]{color:var(--dim2);pointer-events:none}
.cas-n{flex-basis:100%;font:400 11.5px var(--mono);color:var(--dim2)}
.hero-fees{margin:10px 0 0;font:400 13px var(--mono);color:var(--dim)}
@media (prefers-reduced-motion:reduce){.cas-dots i{animation:none;opacity:.5}}
@media (max-width:640px){.cas-t{font-size:19px}.cas-v{font-size:14px;padding:11px}.cas-st{margin-left:0}}
/* ---- launchpad: plain steps, bigger buttons */
.cr-how{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0}
.cr-how li{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 7px;border:1px solid var(--line2);border-radius:999px;font:500 13.5px var(--mono);color:var(--dim)}
.cr-how li b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--line2);font-size:12.5px}
[data-step="1"] .cr-how li[data-s="1"],[data-step="2"] .cr-how li[data-s="2"],[data-step="3"] .cr-how li[data-s="3"],[data-step="4"] .cr-how li[data-s="4"]{border-color:var(--bur);color:var(--ink0)}
[data-step="1"] .cr-how li[data-s="1"] b,[data-step="2"] .cr-how li[data-s="2"] b,[data-step="3"] .cr-how li[data-s="3"] b,[data-step="4"] .cr-how li[data-s="4"] b{background:var(--bur);border-color:var(--bur);color:#04110a}
[data-step="3"] .cr-how li[data-s="1"] b,[data-step="3"] .cr-how li[data-s="2"] b,[data-step="4"] .cr-how li:not([data-s="4"]) b{border-color:var(--bur);color:var(--bur)}
.cr-n{display:inline-grid;place-items:center;width:24px;height:24px;margin-right:8px;border-radius:50%;background:var(--bur);color:#04110a;font:600 13px var(--mono);vertical-align:middle}
.cr-form>label{font-size:15px;color:var(--ink0)}
.cr-sh{margin:0 0 10px;font:500 15px var(--mono);color:var(--ink0)}
.cr-launch .cr-sh{grid-column:1/-1;margin-top:6px}
.btn.big{padding:16px 22px;font-size:16.5px;font-weight:600}
.cr-in .btn.big{min-width:190px}
.cr-launch .btn.big,.cr-confirm .btn.big{width:100%}
.cr-col{min-width:0}
.cr-col .cr-token{margin-top:12px}
.cr-more{margin:8px 0 0;font:400 13px/1.55 var(--mono);color:var(--dim)}
.cr-more summary{cursor:pointer;color:var(--tx)}
.cr-more[open] summary{margin-bottom:8px}
.cr-adv{grid-column:1/-1}
.cr-adv label{margin-top:4px}
.cr-launch .cr-fee{grid-column:1/-1}
.cr-fee p{margin:0 0 6px}
@media (max-width:640px){.cr-in{flex-direction:column}.cr-in .btn.big{min-width:0;width:100%}.cr-how li{font-size:12.5px}}
/* ---- main nav: spiders hanging on threads, each tip carries a section heading */
.thread-nav{position:relative;z-index:4;height:184px;margin:0 auto;max-width:1600px}
.thread-nav canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.thread-nav a{--h:150;position:absolute;left:0;top:0;display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border:1px solid hsla(var(--h),70%,62%,.45);border-radius:999px;background:rgba(5,9,8,.86);backdrop-filter:blur(4px);color:var(--ink0);font:500 15px var(--mono);letter-spacing:.02em;text-decoration:none;white-space:nowrap;box-shadow:0 0 0 1px rgba(0,0,0,.4),0 8px 24px -14px hsla(var(--h),90%,60%,.9);opacity:0;transition:opacity .4s,border-color .2s,color .2s,background .2s,box-shadow .2s;will-change:transform}
.thread-nav a::before{content:"";position:absolute;left:50%;bottom:100%;width:64px;height:var(--hit,80px);transform:translateX(-50%)} /* hit area up over the spider + thread */
.thread-nav.ready a{opacity:1}
.thread-nav a:hover,.thread-nav a:focus-visible{border-color:hsla(var(--h),85%,66%,1);color:hsl(var(--h),90%,78%);outline:none;background:rgba(8,16,13,.94);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 26px -6px hsla(var(--h),90%,60%,.8)}
.thread-nav a:focus-visible{outline:2px solid hsl(var(--h),90%,70%);outline-offset:3px}
.thread-nav a.on{border-color:hsl(var(--h),85%,62%);background:hsl(var(--h),80%,62%);color:#05100b;font-weight:600;box-shadow:0 0 30px -6px hsla(var(--h),90%,60%,.9)}
@media (max-width:640px){.thread-nav{height:150px}.thread-nav a{min-height:36px;padding:0 10px;font-size:12.5px;letter-spacing:0}.thread-nav a::before{width:48px}}
/* ---- profile */
.pf-act .btn.big{width:auto;min-width:300px}
.pf-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:18px}
.pf-w{font:500 15px var(--mono);color:var(--bur)}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:18px}
.pf-h{margin:0 0 10px;font:500 14px var(--mono);color:var(--ink0);text-transform:uppercase;letter-spacing:.08em}
.pf-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pf-list li{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border:1px dashed var(--line2);border-radius:4px}
.pf-list b{font:500 15px var(--mono);color:var(--ink0)}.pf-list b span{color:var(--bur);font-weight:400}
.pf-list small{font:400 12.5px/1.5 var(--mono);color:var(--dim)}.pf-list small em{color:var(--honey,#e8c35a);font-style:normal}
.pf-list a{color:var(--bur)}
.pf-cp{padding:1px 6px;border:1px solid var(--line2);border-radius:3px;background:none;color:var(--tx);font:400 11px var(--mono);cursor:pointer}
.pf-empty{color:var(--dim);font:400 13.5px/1.55 var(--mono)}
.tabs a.tab-more{opacity:.6}
@media (max-width:820px){.pf-grid{grid-template-columns:1fr}}
/* ---- swarm wordmark */
.bt-wm.sw,.bt-wm.sw.on{transform:translate(-50%,-50%);transition:opacity .35s}
.bt-wm span{transition:color .2s,opacity .45s}
.bt-wm.sw-hide span{opacity:0}
/* ---- short flow chips */
.mh-mini{display:flex;gap:8px;list-style:none;margin:12px 0 0;padding:0}
.mh-mini li{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 6px;border:1px solid var(--line2);border-radius:999px;font:500 15px var(--mono);color:var(--dim)}
.mh-mini li b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--line2);color:var(--ink0);font-size:12px}
.mh-mini li.on{border-color:var(--bur);color:var(--ink0)}.mh-mini li.on b{background:var(--bur);color:#04130b}
.surface .tagline{font-size:clamp(18px,2.1vw,24px)}
/* ---- wallet picker */
.wpick{position:fixed;inset:0;z-index:2147480000;display:grid;place-items:center;background:rgba(0,0,0,.6);backdrop-filter:blur(3px)}
.wp-in{display:grid;gap:10px;min-width:min(340px,90vw);padding:22px;border:1px solid var(--line2);border-radius:10px;background:#070b0a;box-shadow:0 20px 60px -20px rgba(77,245,160,.35)}
.wp-h{margin:0 0 4px;font:500 16px var(--mono);color:var(--ink0)}
.wpick button{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 16px;border:1px solid var(--line2);border-radius:8px;background:rgba(255,255,255,.02);color:var(--ink0);font:500 16px var(--mono);cursor:pointer;text-align:left}
.wpick button:hover,.wpick button:focus-visible{border-color:var(--bur);outline:none}
.wpick button img,.wpick button i{width:28px;height:28px;border-radius:6px;background:var(--line2)}
.wpick .wp-x{justify-content:center;min-height:42px;color:var(--dim);font-size:14px}
/* the five main sections live in the spider-thread nav at the top; the bar below keeps only the extra pages */
.tabs a[data-tab]:not(.tab-more){display:none}
.tabs a.tab-more{opacity:.85}
/* official mark next to the living wordmark */
.wm-row{display:flex;align-items:center;gap:clamp(10px,1.6vw,22px)}
.wm-mark{width:clamp(56px,7vw,104px);height:auto;border-radius:14px;image-rendering:pixelated;filter:drop-shadow(0 0 18px rgba(182,255,59,.25))}
.wm-row .wordmark{margin:0}
.chip.xlink{display:inline-flex;align-items:center;gap:6px;color:var(--ink0);text-decoration:none}
.chip.xlink:hover,.chip.xlink:focus-visible{color:var(--bur);border-color:var(--bur)}
