/* theme tokens (dark = default; light overrides live at the end of pages.css, :root[data-theme=light]) */
:root{--tw:255,255,255;--tk:0,0,0;--ts:0,0,0;--sa:1;--k-9d8cf8:157,140,248;--k-0e1016:14,16,22;--k-07080c:7,8,12;--k-b9bec7:185,190,199;--kt-c9cdd5:201,205,213;--kt-a2a8b3:162,168,179;--k-14181e:20,24,30;--k-080a0e:8,10,14;--kt-e9ecf1:233,236,241;--k-050507:5,5,7;--k-030408:3,4,8;--kt-b4b9c3:180,185,195;--k-12141b:18,20,27;--k-090a0e:9,10,14;--kt-aab0bb:170,176,187;--kt-c3c8d0:195,200,208;--kt-a8aeb9:168,174,185;--kt-8f96a3:143,150,163}
/* H-T round 2, item 7: bottom of the homepage (final sign-up, follow strip, footer). Loaded after hf.css; scoped to .hf-final / .hf-footer. */
@property --hfb-a{syntax:"<angle>";inherits:false;initial-value:0deg}
:root{--hfb-green:#3df29a;--hfb-pink:#ec008c;--hfb-vio:rgb(var(--k-9d8cf8))}
@keyframes hfb-spin{to{--hfb-a:360deg}}

/* ---------- final sign-up ---------- */
.hf-final{position:relative;padding:var(--s10) 0 var(--s12)}
.hf-final .f-next-in{position:relative;isolation:isolate;border:0;border-radius:28px;padding:clamp(28px,5vw,64px);overflow:hidden;
  background:
    radial-gradient(60% 80% at var(--hfb-mx,18%) var(--hfb-my,0%),rgba(61,242,154,.16),transparent 62%),
    radial-gradient(50% 70% at 100% 100%,rgba(236,0,140,.14),transparent 65%),
    linear-gradient(180deg,rgba(var(--k-0e1016),.94),rgba(var(--k-07080c),.96));
  box-shadow:0 0 0 1px rgba(var(--tw),.05),0 50px 120px -50px rgba(var(--ts),calc(.95*var(--sa))),0 0 120px -50px rgba(61,242,154,.45)}
.hf-final .f-next-in::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--hfb-a),var(--hfb-green),rgba(61,242,154,.05) 22%,var(--hfb-pink) 50%,rgba(236,0,140,.05) 72%,var(--hfb-green));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:hfb-spin 9s linear infinite}
.hf-final .f-next-in::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(var(--tw),.035) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tw),.035) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask:radial-gradient(70% 90% at 30% 20%,#000,transparent 75%);mask:radial-gradient(70% 90% at 30% 20%,#000,transparent 75%)}
.hf-final .f-next-art{border-radius:16px}
.hf-final .f-next-tilt{border-radius:16px;overflow:hidden;border:1px solid rgba(var(--tw),.12);box-shadow:0 40px 80px -30px rgba(var(--ts),calc(.9*var(--sa))),0 0 90px -30px rgba(236,0,140,.5)}
.hf-final .eyebrow{color:var(--hfb-green)}
.hf-final h2{background:linear-gradient(180deg,rgb(var(--tw)) 30%,rgb(var(--k-b9bec7)));-webkit-background-clip:text;background-clip:text;color:transparent}
.hf-final .f-next-line{color:rgb(var(--kt-c9cdd5))}
.hf-final .f-next-fine{color:rgb(var(--kt-a2a8b3))}

/* premium buttons inside the final block: dark glass + animated conic border (green -> pink) */
.hf-final .actions .btn{position:relative;isolation:isolate;border:0;border-radius:12px;height:58px;padding:0 28px;font-weight:700;
  transition:transform .25s var(--ease),box-shadow .3s}
.hf-final .actions .btn-primary{color:rgb(var(--tw));background:linear-gradient(180deg,rgba(var(--k-14181e),.96),rgba(var(--k-080a0e),.96));box-shadow:0 18px 44px -18px rgba(61,242,154,.55),0 0 0 1px rgba(var(--tw),.04)}
.hf-final .actions .btn-primary::before,.hf-final .actions .btn-ghost::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.5px;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.hf-final .actions .btn-primary::before{background:conic-gradient(from var(--hfb-a),var(--hfb-green),var(--hfb-pink),var(--hfb-green));animation:hfb-spin 5s linear infinite}
.hf-final .actions .btn-ghost{color:rgb(var(--kt-e9ecf1));background:rgba(var(--tw),.04)}
.hf-final .actions .btn-ghost::before{background:rgba(var(--tw),.2)}
.hf-final .actions .btn:hover,.hf-final .actions .btn:focus-visible{transform:translateY(-2px)}
.hf-final .actions .btn-primary:hover{box-shadow:0 24px 54px -16px rgba(236,0,140,.6),0 0 0 1px rgba(var(--tw),.06)}
.hf-final .actions .btn-ghost:hover{background:rgba(var(--tw),.08);color:rgb(var(--tw))}
.hf-final .actions .btn:focus-visible{outline:3px solid rgb(var(--tw));outline-offset:4px}

/* ---------- footer ---------- */
.hf-footer{background:
  radial-gradient(70% 60% at 15% 0%,rgba(61,242,154,.07),transparent 60%),
  radial-gradient(60% 60% at 90% 10%,rgba(236,0,140,.07),transparent 60%),
  linear-gradient(180deg,rgba(var(--k-050507),.92),rgba(var(--k-030408),.99))}
.hf-foot-brand .logo{font-size:20px;gap:12px}
.hf-foot-brand .logo svg{width:28px;height:28px;color:var(--hfb-green);filter:drop-shadow(0 0 12px rgba(61,242,154,.5))}
.hf-foot-brand p{color:rgb(var(--kt-b4b9c3));max-width:46ch}
.hf-follow{border-radius:20px;border:0;position:relative;isolation:isolate;background:linear-gradient(180deg,rgba(var(--k-12141b),.85),rgba(var(--k-090a0e),.9));box-shadow:0 30px 60px -36px rgba(var(--ts),var(--sa))}
.hf-follow::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--hfb-a),rgba(61,242,154,.7),rgba(var(--tw),.08) 25%,rgba(236,0,140,.7) 50%,rgba(var(--tw),.08) 75%,rgba(61,242,154,.7));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:hfb-spin 14s linear infinite}
.hf-follow h3{color:rgb(var(--kt-c9cdd5))}
.hf-follow-m{color:rgb(var(--kt-a2a8b3))}
.hf-follow li a:hover,.hf-follow li a:focus-visible{border-color:rgba(61,242,154,.7);box-shadow:0 10px 26px -12px rgba(61,242,154,.55)}
.hf-foot-nav{gap:var(--s3)}
.hf-foot-col{border-left:0;padding:16px 16px 12px;border-radius:14px;background:rgba(var(--tw),.025);border:1px solid rgba(var(--tw),.06);transition:border-color .25s,background .25s}
.hf-foot-col:hover,.hf-foot-col:focus-within{background:rgba(var(--tw),.04);border-color:rgba(61,242,154,.28)}
.hf-foot-h{display:flex;align-items:center;gap:8px;color:rgb(var(--kt-aab0bb))}
.hf-foot-h::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--hfb-green);box-shadow:0 0 10px var(--hfb-green)}
.hf-foot-col:nth-child(even) .hf-foot-h::before{background:var(--hfb-pink);box-shadow:0 0 10px var(--hfb-pink)}
.hf-foot-nav a{color:rgb(var(--kt-c3c8d0))}
.hf-foot-bar{border-top:0;position:relative}
.hf-foot-bar::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(61,242,154,.5),rgba(var(--tw),.08) 40%,rgba(236,0,140,.5))}
.hf-footer .hf-foot-bar .copyright{color:rgb(var(--kt-a8aeb9))}
.hf-totop{border-color:rgba(var(--tw),.22)}
.hf-totop:hover{border-color:rgba(61,242,154,.7);box-shadow:0 10px 26px -10px rgba(61,242,154,.6)}

@media (max-width:899px){
  .hf-final{padding:var(--s6) 0 var(--s8)}
  .hf-final .f-next-in{border-radius:22px}
  .hf-final .actions{flex-direction:column;align-items:stretch}
  .hf-final .actions .btn{width:100%;flex:0 0 auto;justify-content:center}
  .hf-foot-nav{grid-template-columns:1fr 1fr}
  .hf-foot-col{padding:14px 12px 10px}
}
@media (prefers-reduced-motion:reduce){
  .hf-final .f-next-in::before,.hf-final .actions .btn-primary::before,.hf-follow::before{animation:none}
  .hf-final .actions .btn,.hf-foot-col{transition:none}
  .hf-final .actions .btn:hover,.hf-final .actions .btn:focus-visible{transform:none}
}

/* ---------- round 3: LED outline on the footer wordmark ---------- */
.hf-foot-bg{overflow:visible}
.hfb-led{position:absolute;left:0;top:0;width:100%;height:1em;overflow:visible;font:inherit;letter-spacing:inherit;pointer-events:none}
.hfb-led text{font:inherit;letter-spacing:inherit;text-transform:inherit;fill:none;stroke:url(#hfb-led-g);stroke-width:1.6;stroke-linejoin:round;stroke-opacity:0;vector-effect:none}
.hfb-led.is-on text{stroke-opacity:1;stroke-dasharray:var(--hfb-d,260) var(--hfb-g,1400);animation:hfb-run var(--hfb-t,4.2s) cubic-bezier(.45,.05,.4,1) 1 forwards}
.hfb-led.is-on{filter:drop-shadow(0 0 6px rgba(61,242,154,.75)) drop-shadow(0 0 14px rgba(236,0,140,.45))}
@keyframes hfb-run{from{stroke-dashoffset:var(--hfb-o0,0)}to{stroke-dashoffset:var(--hfb-o1,-1660)}}
@media (prefers-reduced-motion:reduce){
  .hfb-led text{stroke-opacity:.35;stroke-width:1.2}
  .hfb-led{filter:drop-shadow(0 0 8px rgba(61,242,154,.35))}
  .hfb-led.is-on text{animation:none;stroke-dasharray:none}
}

/* ---------- round 3: footer columns tinted per category (same --cat values as the tabs showcase, read by hf-bottom.js) ---------- */
.hf-foot-col{--cat:255,255,255}
.hf-foot-col[data-hfb-cat]{background:linear-gradient(180deg,rgba(var(--cat),.10),rgba(var(--cat),.02) 70%),rgba(var(--tw),.02);border-color:rgba(var(--cat),.28)}
.hf-foot-col[data-hfb-cat]:hover,.hf-foot-col[data-hfb-cat]:focus-within{border-color:rgba(var(--cat),.7);background:linear-gradient(180deg,rgba(var(--cat),.16),rgba(var(--cat),.04) 70%),rgba(var(--tw),.03)}
.hf-foot-col[data-hfb-cat] .hf-foot-h{color:rgb(var(--cat))}
.hf-foot-col[data-hfb-cat] .hf-foot-h::before,.hf-foot-col[data-hfb-cat]:nth-child(even) .hf-foot-h::before{background:rgb(var(--cat));box-shadow:0 0 10px rgba(var(--cat),.8)}
.hf-foot-nav a[data-hfb-c]{display:inline-flex;align-items:center;gap:8px}
.hf-foot-nav a[data-hfb-c]::before{content:"";flex:none;width:6px;height:6px;border-radius:2px;background:rgb(var(--cat));box-shadow:0 0 8px rgba(var(--cat),.7)}
.hf-foot-nav a[data-hfb-c]:hover,.hf-foot-nav a[data-hfb-c]:focus-visible{color:rgb(var(--tw));text-shadow:0 0 14px rgba(var(--cat),.6)}

/* footer legal lines from pages/copy/nav.md (shared with the site pages; added 2026-10-10 with the cookie banner) */
.tp-foot-lines{display:grid;gap:4px}
.tp-risk{margin:0;font-size:12px;color:rgb(var(--kt-8f96a3))}
.tp-foot-lines a[data-ck-open]{color:inherit;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:32px}
.tp-credit{display:inline-block;margin-left:14px;color:rgb(var(--kt-c3c8d0))}.tp-credit a{color:inherit;text-decoration:none}.tp-credit a:hover{text-decoration:underline}

/* Top 5 creators (compact leaderboard under the workspace gallery; sample data, labelled; full version on /community/) */
.hf-t5-list{list-style:none;margin:var(--s4,24px) 0 0;padding:0;display:grid;gap:10px;max-width:760px}
.hf-t5-r{display:grid;grid-template-columns:28px 36px minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;border:1px solid rgba(var(--tw),.1);background:rgba(var(--tw),.035)}
.hf-t5-r.is-top{border-color:rgba(245,196,81,.5);background:linear-gradient(100deg,rgba(245,196,81,.14),rgba(var(--tw),.03) 65%);box-shadow:0 18px 40px -30px rgba(245,196,81,.6)}
.hf-t5-r .hf-av{width:36px;height:36px;font-size:13px}
.hf-t5-n{font:700 16px/1 var(--mono);text-align:center;color:rgb(var(--kt-8f96a3))}
.hf-t5-r.is-top .hf-t5-n{color:#f5c451}
.hf-t5-m{display:flex;flex-direction:column;gap:8px;min-width:0}
.hf-t5-h{font:600 14px/1.2 var(--mono);color:rgb(var(--tw));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hf-t5-bar{display:block;height:6px;border-radius:99px;background:rgba(var(--tw),.08);overflow:hidden}
.hf-t5-bar i{display:block;height:100%;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#3df29a,rgb(var(--k-9d8cf8)))}
.hf-t5-s{font:600 12px/1 var(--mono);color:rgb(var(--kt-b4b9c3));font-variant-numeric:tabular-nums}
.hf-t5-s b{font-size:18px;color:rgb(var(--tw))}
.hf-t5 .hf-row{margin-top:var(--s3,18px)}
@media (max-width:480px){.hf-t5-r{grid-template-columns:22px 32px minmax(0,1fr) auto;gap:10px;padding:10px 12px}.hf-t5-r .hf-av{width:32px;height:32px}}

.hf-t5-r .hf-av::before{content:attr(data-i)}