/* ═══════════════════════════════════════════════
   SPECTRE — Black + Purple Only
   JetBrains Mono — Terminal Font
   ═══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700;800&display=swap');

:root {
  --bg:   #000000;
  --bg2:  #050505;
  --bg3:  #080808;
  --card: #0A0A0A;
  --p:    #7C3AED;
  --pb:   #8B5CF6;
  --pd:   #4C1D95;
  --txt:  #C4B5FD;
  --dim:  rgba(139,92,246,.5);
  --br:   rgba(124,58,237,.22);
  --brh:  rgba(139,92,246,.6);
  --gp:   rgba(124,58,237,.15);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  background:#000;
  color:var(--txt);
  font-family:'JetBrains Mono','Courier New',monospace;
  font-size:15px;
  overflow-x:hidden;
  cursor:crosshair;
}

/* ── Loader ─────────────────────────────────── */
#loader {
  position:fixed; inset:0; z-index:9999;
  background:#000;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .7s ease, visibility .7s;
}
#loader.hide { opacity:0; visibility:hidden; pointer-events:none; }
.loader-inner { display:flex; flex-direction:column; align-items:center; gap:1.1rem; }
.loader-svg { filter:drop-shadow(0 0 35px rgba(124,58,237,.8)); animation:loaderPulse 2.2s ease-in-out infinite; }
#lg,#lf,#le,#ld,#lc,#lb,#la { transform-origin:center; transform-box:fill-box; }
#la { animation:cw 8s linear infinite; }
#lb { animation:cw 10s linear infinite; }
#lc { animation:acw 9s linear infinite; }
#ld { animation:cw 12s linear infinite; }
#le { animation:acw 11s linear infinite; }
#lf { animation:cw 9s linear infinite; }
#lg { animation:cw 10s linear infinite; }
#ta2,#tb2,#tc2,#td2,#te,#tf,#tg { transform-origin:center; transform-box:fill-box; }
#ta2 { animation:cw 8s linear infinite; }
#tb2 { animation:cw 10s linear infinite; }
#tc2 { animation:acw 9s linear infinite; }
#td2 { animation:cw 12s linear infinite; }
#te  { animation:acw 11s linear infinite; }
#tf  { animation:cw 9s linear infinite; }
#tg  { animation:cw 10s linear infinite; }
#na { animation:cw 8s linear infinite; transform-origin:center; transform-box:fill-box; }
#nb { animation:cw 10s linear infinite; transform-origin:center; transform-box:fill-box; }
#nc { animation:acw 9s linear infinite; transform-origin:center; transform-box:fill-box; }
@keyframes cw  { to { transform:rotatez(360deg); } }
@keyframes acw { to { transform:rotatez(-360deg); } }
@keyframes loaderPulse {
  0%,100% { filter:drop-shadow(0 0 28px rgba(124,58,237,.7)); }
  50%     { filter:drop-shadow(0 0 65px rgba(124,58,237,1)) drop-shadow(0 0 120px rgba(76,29,149,.6)); }
}
.loader-brand { font-size:2.2rem; font-weight:800; letter-spacing:.55em; color:var(--pb); text-shadow:0 0 22px var(--p); padding-left:.55em; }
.loader-sub { font-size:.6rem; letter-spacing:.25em; color:var(--dim); }
.loader-bar-wrap { width:240px; height:1px; background:rgba(124,58,237,.15); overflow:hidden; }
.loader-bar-fill { height:100%; width:0; background:linear-gradient(90deg,var(--pd),var(--p),var(--pb)); box-shadow:0 0 10px var(--p); transition:width .12s linear; }
.loader-pct { font-size:.62rem; color:var(--dim); letter-spacing:.15em; }

/* ── Wormhole ───────────────────────────────── */
#wormhole { position:fixed; inset:0; z-index:0; pointer-events:none; display:block; }
.scanlines { position:fixed; inset:0; z-index:1; pointer-events:none; background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.18) 2px,rgba(0,0,0,.18) 4px); }
nav,section,footer { position:relative; z-index:2; }

/* ── NAVBAR ─────────────────────────────────── */
.navbar {
  display:flex; align-items:center; justify-content:space-between;
  padding:.85rem 1.5rem;
  border-bottom:1px solid var(--br);
  background:rgba(0,0,0,.93); backdrop-filter:blur(14px);
  position:sticky; top:0; z-index:100;
}
.nav-left { display:flex; align-items:center; gap:1.1rem; }
.nav-logo  { display:flex; align-items:center; gap:.6rem; }
.nav-mini-logo { width:30px; height:30px; flex-shrink:0; }
.brand { font-size:1.05rem; font-weight:800; letter-spacing:.4em; color:var(--pb); text-shadow:0 0 15px var(--p); }
.wallet-btn {
  display:flex; align-items:center; gap:.5rem;
  background:transparent; border:1px solid var(--br);
  color:var(--pb); font-family:inherit; font-size:.68rem;
  font-weight:700; letter-spacing:.1em; padding:.38rem 1rem;
  cursor:pointer; transition:all .25s;
}
.wallet-btn:hover { background:rgba(124,58,237,.1); border-color:var(--brh); box-shadow:0 0 16px rgba(124,58,237,.25); }
.wallet-btn.connected { border-color:rgba(34,197,94,.35); color:#22C55E; }
.wallet-btn.connected .wallet-dot { background:#22C55E; box-shadow:0 0 6px #22C55E; }
.wallet-dot { width:7px; height:7px; border-radius:50%; background:var(--pd); box-shadow:0 0 6px var(--p); animation:blink 2s ease-in-out infinite; }
.nav-links { display:flex; list-style:none; gap:1.4rem; align-items:center; }
.nav-links a { color:rgba(196,181,253,.45); text-decoration:none; font-size:.68rem; letter-spacing:.07em; transition:color .2s; }
.nav-links a:hover { color:var(--pb); text-shadow:0 0 8px var(--p); }
.nav-cta { color:var(--pb) !important; border:1px solid var(--br); padding:.32rem .9rem; transition:all .2s !important; }
.nav-cta:hover { background:rgba(124,58,237,.1) !important; }

/* ── Wallet Info Bar ────────────────────────── */
.wallet-info-bar {
  display:none; align-items:center; gap:1.5rem; flex-wrap:wrap;
  padding:.55rem 1.5rem; background:rgba(0,0,0,.9);
  border-bottom:1px solid var(--br); font-size:.65rem;
  position:sticky; top:52px; z-index:99;
}
.wallet-info-bar.visible { display:flex; }
.wib-item { display:flex; align-items:center; gap:.5rem; }
.wib-label { color:var(--dim); letter-spacing:.1em; }
.info-val { color:var(--pb); font-weight:700; }
.diff-val.r5 { color:#FCD34D; text-shadow:0 0 8px rgba(252,211,77,.5); }
.diff-val.rd { color:#EF4444; text-shadow:0 0 8px rgba(239,68,68,.4); }
.wib-sep { color:var(--br); }
.wib-disconnect { color:rgba(239,68,68,.6); background:none; border:none; font-family:inherit; font-size:.65rem; cursor:pointer; letter-spacing:.1em; margin-left:auto; transition:color .2s; }
.wib-disconnect:hover { color:#EF4444; }

/* ── Wallet Modal ───────────────────────────── */
.wallet-modal { position:fixed; inset:0; z-index:9998; display:none; }
.wallet-modal.open { display:flex; align-items:center; justify-content:center; }
.wm-overlay { position:absolute; inset:0; background:rgba(0,0,0,.85); backdrop-filter:blur(6px); }
.wm-panel {
  position:relative; z-index:1; background:#050505;
  border:1px solid var(--br); padding:2rem; width:360px;
  box-shadow:0 0 60px rgba(124,58,237,.12);
}
.wm-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; }
.wm-title { font-size:.75rem; font-weight:800; letter-spacing:.2em; color:var(--pb); }
.wm-close { background:none; border:none; color:var(--dim); font-size:1.1rem; cursor:pointer; transition:color .2s; font-family:inherit; }
.wm-close:hover { color:var(--pb); }
.wm-subtitle { font-size:.65rem; color:var(--dim); margin-bottom:1.4rem; letter-spacing:.08em; }
.wm-wallets { display:flex; flex-direction:column; gap:.65rem; margin-bottom:1.4rem; }
.wm-btn {
  display:flex; align-items:center; gap:.9rem;
  background:transparent; border:1px solid var(--br); color:var(--txt);
  padding:.85rem 1.1rem; font-family:inherit; font-size:.72rem;
  font-weight:700; letter-spacing:.1em; cursor:pointer; transition:all .2s;
  width:100%; text-align:left;
}
.wm-btn:hover { border-color:var(--brh); background:rgba(124,58,237,.08); color:var(--pb); }
.wm-btn-icon { font-size:1.2rem; width:28px; text-align:center; }
.wm-btn-sub { font-size:.58rem; color:var(--dim); display:block; margin-top:.15rem; font-weight:400; }
.wm-status { font-size:.65rem; color:var(--dim); text-align:center; min-height:1.2rem; letter-spacing:.08em; }
.wm-powered { font-size:.56rem; color:rgba(124,58,237,.25); text-align:center; margin-top:1rem; letter-spacing:.1em; }
.wm-error { color:#EF4444; font-size:.65rem; text-align:center; margin-top:.5rem; }

/* ── INTRO ──────────────────────────────────── */
.intro-section {
  min-height:100vh; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; gap:2.5rem; padding:5rem 1.5rem;
  border-bottom:1px solid var(--br);
}
.intro-tag { font-size:.6rem; color:var(--pb); letter-spacing:.16em; margin-bottom:1.4rem; opacity:.7; animation:blink 2.5s step-end infinite; }
.intro-title { font-size:4.8rem; font-weight:800; line-height:1; margin-bottom:.5rem; letter-spacing:.06em; }
.intro-sub { font-size:.76rem; color:var(--dim); letter-spacing:.2em; margin-bottom:1rem; }
.intro-desc { font-size:.88rem; line-height:1.9; color:var(--txt); margin-bottom:2rem; }
.hl  { color:var(--pb); text-shadow:0 0 8px rgba(124,58,237,.5); }
.hl2 { color:rgba(167,139,250,.8); font-style:italic; }
.intro-stats { display:flex; gap:1.1rem; align-items:center; margin-bottom:2rem; padding:.8rem 1.2rem; border:1px solid var(--br); background:rgba(124,58,237,.03); flex-wrap:wrap; }
.stat-item { text-align:center; }
.stat-num { display:block; font-size:1.65rem; font-weight:800; color:var(--pb); text-shadow:0 0 12px var(--p); }
.stat-label { font-size:.55rem; color:var(--dim); letter-spacing:.1em; }
.stat-sep { color:var(--br); }
.intro-btns { display:flex; gap:.75rem; flex-wrap:wrap; }
.intro-right { display:flex; flex-direction:column; gap:1.5rem; }
.intro-badge { font-size:.62rem; letter-spacing:.25em; color:var(--dim); text-align:center; }
.intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--br); border:1px solid var(--br); }
.ig-item { background:var(--card); padding:1.2rem; text-align:center; }
.ig-num { font-size:1.25rem; font-weight:800; color:var(--pb); text-shadow:0 0 10px var(--p); margin-bottom:.3rem; }
.ig-lbl { font-size:.58rem; color:var(--dim); letter-spacing:.1em; }
.intro-chain { display:flex; align-items:center; gap:.5rem; justify-content:center; flex-wrap:wrap; }
.chain-item { font-size:.62rem; font-weight:700; letter-spacing:.2em; border:1px solid var(--br); padding:.3rem .7rem; color:var(--dim); transition:all .2s; }
.chain-item.active { border-color:var(--pb); color:var(--pb); text-shadow:0 0 8px var(--p); }
.chain-arrow { color:var(--br); font-size:.75rem; }

/* ── TERMINAL + LOGO ────────────────────────── */
.terminal-intro-section { padding:3rem 1.5rem; border-bottom:1px solid var(--br); }
.ti-wrap { max-width:920px; margin:0 auto; }
.ti-terminal { background:var(--bg2); border:1px solid var(--br); box-shadow:0 0 50px rgba(124,58,237,.08); }
.ti-body { display:flex; gap:0; }
.ti-logo-wrap { display:flex; align-items:center; justify-content:center; padding:1.5rem 2rem; border-right:1px solid var(--br); background:rgba(0,0,0,.4); min-width:260px; }
.ti-logo-svg { filter:drop-shadow(0 0 25px rgba(124,58,237,.6)); animation:loaderPulse 3s ease-in-out infinite; }
.ti-text { flex:1; padding:1.2rem 1.5rem; font-size:.74rem; line-height:1.75; color:var(--pb); min-height:240px; overflow-y:auto; }
.ti-text::-webkit-scrollbar { width:3px; }
.ti-text::-webkit-scrollbar-thumb { background:var(--br); }

/* ── Buttons ────────────────────────────────── */
.btn-primary {
  display:inline-block; background:var(--pd); color:var(--pb);
  padding:.65rem 1.8rem; font-family:inherit; font-size:.72rem; font-weight:800;
  letter-spacing:.18em; text-decoration:none; border:1px solid var(--p);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  transition:all .3s;
}
.btn-primary:hover { background:var(--p); color:#EDE9FE; box-shadow:0 0 24px rgba(124,58,237,.4); transform:translateY(-2px); }
.btn-primary.large { padding:.85rem 2.4rem; font-size:.82rem; }
.btn-ghost {
  display:inline-block; background:transparent; color:var(--pb);
  padding:.65rem 1.8rem; font-family:inherit; font-size:.72rem; font-weight:700;
  letter-spacing:.18em; text-decoration:none; border:1px solid var(--br);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  transition:all .3s;
}
.btn-ghost:hover { background:rgba(124,58,237,.1); box-shadow:0 0 16px rgba(124,58,237,.18); }
.btn-ghost.purple { color:var(--pb); border-color:var(--br); }
.btn-ghost.purple:hover { background:rgba(124,58,237,.12); }
.btn-card { display:block; text-align:center; text-decoration:none; border:1px solid var(--br); color:var(--pb); padding:.6rem; font-family:inherit; font-size:.7rem; font-weight:700; letter-spacing:.15em; transition:all .3s; cursor:pointer; background:transparent; width:100%; }
.btn-card:hover { background:rgba(124,58,237,.1); border-color:var(--brh); }
.btn-card.featured-btn { background:var(--pd); color:var(--pb); border-color:var(--p); }
.btn-card.featured-btn:hover { background:var(--p); }
.btn-card.sm { padding:.42rem .7rem; font-size:.62rem; }

/* ── Terminal common ────────────────────────── */
.hero-terminal,.full-term,.mine-cmd-box { background:var(--bg2); border:1px solid var(--br); }
.term-header { display:flex; align-items:center; gap:.5rem; padding:.5rem 1rem; background:rgba(0,0,0,.7); border-bottom:1px solid var(--br); }
.term-dots { display:flex; gap:.32rem; }
.td { width:9px; height:9px; border-radius:50%; }
.td.r { background:#FF5F57; } .td.y { background:#FFBD2E; } .td.g { background:#28C840; }
.term-title { font-size:.62rem; color:var(--dim); margin-left:.4rem; }
.term-live { margin-left:auto; font-size:.58rem; color:var(--pb); animation:blink 1.5s step-end infinite; }
.term-body { padding:.9rem; height:280px; overflow-y:auto; font-size:.72rem; line-height:1.75; color:var(--pb); }
.term-body::-webkit-scrollbar { width:3px; }
.term-body::-webkit-scrollbar-thumb { background:var(--br); }
.term-body.big { height:200px; }

/* ── Section Common ─────────────────────────── */
section { padding:4rem 1.5rem; border-bottom:1px solid rgba(124,58,237,.06); }
.dark-section { background:var(--bg2); }
.sec-header { text-align:center; margin-bottom:3rem; }
.sec-tag { font-size:.6rem; color:var(--dim); letter-spacing:.28em; margin-bottom:.55rem; }
.sec-header h2 { font-size:2.4rem; font-weight:800; color:var(--pb); text-shadow:0 0 18px rgba(124,58,237,.4); margin-bottom:.6rem; letter-spacing:.05em; }
.sec-header p { font-size:.85rem; color:var(--txt); line-height:1.7; }
.sec-sub-title { font-size:.64rem; letter-spacing:.25em; color:var(--dim); margin:2.5rem 0 1.2rem; padding-left:.5rem; border-left:2px solid var(--br); }

/* ── Corner brackets ────────────────────────── */
.pcard,.agent-card,.mcard,.rwcard,.mine-stat-box,.tt-card,.ix-card,.hy-card,.sec-card,.pda-card,.hiw-card,.tok-card,.road-item,.comp-card,.llm-card,.diff-row-card { position:relative; }
.pcard::before,.agent-card::before,.mcard::before,.rwcard::before,.mine-stat-box::before,
.tt-card::before,.ix-card::before,.hy-card::before,.sec-card::before,.pda-card::before,
.hiw-card::before,.tok-card::before,.road-item::before,.comp-card::before,.llm-card::before,.diff-row-card::before {
  content:''; position:absolute; top:-1px; left:-1px; width:14px; height:14px;
  border-top:1px solid var(--pb); border-left:1px solid var(--pb); pointer-events:none; z-index:1;
}
.pcard::after,.agent-card::after,.mcard::after,.rwcard::after,.mine-stat-box::after,
.tt-card::after,.ix-card::after,.hy-card::after,.sec-card::after,.pda-card::after,
.hiw-card::after,.tok-card::after,.road-item::after,.comp-card::after,.llm-card::after,.diff-row-card::after {
  content:''; position:absolute; bottom:-1px; right:-1px; width:14px; height:14px;
  border-bottom:1px solid var(--pd); border-right:1px solid var(--pd); pointer-events:none; z-index:1;
}

/* ── GPU PLANS ──────────────────────────────── */
.plans-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.pcard { background:var(--card); border:1px solid var(--br); padding:1.7rem; transition:transform .3s,border-color .3s,box-shadow .3s; }
.pcard:hover { transform:translateY(-5px); border-color:var(--brh); box-shadow:0 14px 45px rgba(124,58,237,.12); }
.pcard.featured { border-color:rgba(124,58,237,.5); }
.pcard-badge { position:absolute; top:0; right:0; background:var(--pd); color:var(--pb); font-size:.5rem; font-weight:700; letter-spacing:.18em; padding:.2rem .65rem; }
.pcard-tier { font-size:.58rem; letter-spacing:.4em; color:var(--dim); margin-bottom:.2rem; }
.pcard-tier.phantom { color:rgba(220,38,38,.6); }
.pcard-gpu { font-size:.88rem; font-weight:700; color:rgba(196,181,253,.8); margin-bottom:.85rem; }
.pcard-price { font-size:2.4rem; font-weight:800; color:var(--pb); text-shadow:0 0 10px rgba(124,58,237,.4); line-height:1; margin-bottom:.2rem; }
.pcard-price span { font-size:.75rem; color:var(--dim); font-weight:400; }
.pcard-reward { font-size:.67rem; color:#FCD34D; letter-spacing:.1em; margin-bottom:1.3rem; }
.pcard-list { list-style:none; margin-bottom:1.5rem; }
.pcard-list li { font-size:.72rem; color:var(--txt); padding:.26rem 0; border-bottom:1px solid rgba(124,58,237,.06); padding-left:.8rem; position:relative; }
.pcard-list li::before { content:'▸'; position:absolute; left:0; color:var(--pd); }

/* ── MINING ─────────────────────────────────── */
.mining-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem; margin-bottom:2.2rem; }
.mine-stat-box { background:var(--card); border:1px solid var(--br); padding:1.3rem; text-align:center; }
.msb-label { font-size:.56rem; letter-spacing:.18em; color:var(--dim); margin-bottom:.45rem; }
.msb-value { font-size:1.3rem; font-weight:800; color:var(--pb); text-shadow:0 0 8px rgba(124,58,237,.35); margin-bottom:.7rem; }
.msb-bar { height:1px; background:rgba(124,58,237,.1); overflow:hidden; }
.msb-fill { height:100%; background:linear-gradient(90deg,var(--pd),var(--p)); box-shadow:0 0 5px var(--p); }
.mining-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-bottom:2.2rem; }
.mcard { background:var(--card); border:1px solid var(--br); padding:1.5rem; text-align:center; transition:border-color .3s; }
.mcard:hover { border-color:var(--brh); }
.mcard.active-m { border-color:rgba(124,58,237,.5); }
.mcard-icon { font-size:1.8rem; color:var(--pb); text-shadow:0 0 12px var(--p); margin-bottom:.5rem; }
.mcard-name { font-size:.6rem; letter-spacing:.28em; color:var(--dim); margin-bottom:.28rem; }
.mcard-hw { font-size:.82rem; font-weight:700; color:rgba(196,181,253,.7); margin-bottom:.45rem; }
.mcard-rate { font-size:.7rem; color:var(--txt); margin-bottom:.28rem; }
.mcard-earn { font-size:.74rem; color:#FCD34D; font-weight:700; margin-bottom:1.1rem; }
.mine-cmd-box { max-width:800px; margin:0 auto; }
.mine-cmd { padding:1.1rem 1.4rem; }
.cmd-line { font-size:.72rem; color:var(--txt); padding:.18rem 0; }
.cmd-prompt { color:var(--pb); margin-right:.5rem; }
.cmd-out { font-size:.72rem; color:#4ADE80; margin-top:.4rem; }

/* ── AGENTS ─────────────────────────────────── */
.agent-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.agent-card { background:var(--card); border:1px solid var(--br); padding:1.5rem; transition:transform .3s,border-color .3s; display:flex; flex-direction:column; }
.agent-card:hover { transform:translateY(-4px); border-color:var(--brh); }
.agent-card.featured-agent { border-color:rgba(124,58,237,.5); }
.ac-header { display:flex; align-items:center; gap:.45rem; margin-bottom:.7rem; }
.ac-status { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.ac-status.online { background:#22C55E; box-shadow:0 0 5px #22C55E; }
.ac-status.busy   { background:#EAB308; box-shadow:0 0 5px #EAB308; }
.ac-type { font-size:.52rem; letter-spacing:.2em; color:var(--dim); }
.ac-id { margin-left:auto; font-size:.55rem; color:var(--dim); }
.ac-name { font-size:1rem; font-weight:800; color:rgba(196,181,253,.85); margin-bottom:.55rem; }
.ac-desc { font-size:.7rem; line-height:1.65; color:var(--txt); margin-bottom:.85rem; flex:1; }
.ac-specs { display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:.85rem; }
.ac-specs span { font-size:.55rem; background:rgba(124,58,237,.08); border:1px solid var(--br); padding:.15rem .45rem; color:var(--dim); }
.ac-price { font-size:1.5rem; font-weight:800; color:var(--pb); line-height:1; }
.ac-price span { font-size:.65rem; color:var(--dim); font-weight:400; }
.ac-reward { font-size:.64rem; color:#FCD34D; margin-bottom:.9rem; }

/* ── POUWE ──────────────────────────────────── */
.arch-box { border:1px solid var(--br); background:var(--card); }
.arch-title { font-size:.6rem; letter-spacing:.25em; color:var(--dim); padding:.8rem 1.2rem; border-bottom:1px solid var(--br); }
.arch-diagram { padding:1.5rem 1.2rem; display:flex; flex-direction:column; gap:1.5rem; }
.arch-layer { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; justify-content:center; }
.arch-node { background:rgba(124,58,237,.08); border:1px solid var(--br); padding:.9rem 1.2rem; text-align:center; min-width:155px; font-size:.7rem; font-weight:700; color:var(--pb); letter-spacing:.1em; }
.arch-node.requester { border-color:rgba(124,58,237,.4); }
.arch-node.agent     { border-color:rgba(124,58,237,.3); }
.arch-node.validator { border-color:rgba(124,58,237,.35); }
.arch-node.reward    { border-color:rgba(252,211,77,.25); color:#FCD34D; }
.an-sub { font-size:.55rem; color:var(--dim); font-weight:400; margin-top:.3rem; }
.arch-arr { color:var(--br); font-size:1.1rem; }
.arch-chain { background:rgba(124,58,237,.06); border:1px solid var(--br); padding:.9rem 1.4rem; text-align:center; }
.chain-block { font-size:.65rem; font-weight:800; color:var(--dim); letter-spacing:.2em; margin-bottom:.6rem; }
.chain-accounts { display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; }
.chain-accounts span { font-size:.58rem; background:rgba(124,58,237,.08); border:1px solid var(--br); padding:.2rem .6rem; color:var(--txt); }
.arch-offchain { background:rgba(124,58,237,.04); border:1px solid var(--br); padding:.8rem 1.4rem; text-align:center; }
.oc-block { font-size:.62rem; font-weight:800; color:var(--dim); letter-spacing:.2em; margin-bottom:.55rem; }
.oc-items { display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; }
.oc-items span { font-size:.57rem; background:rgba(124,58,237,.06); border:1px solid var(--br); padding:.18rem .55rem; color:var(--dim); }

.task-types-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.tt-card { background:var(--card); border:1px solid var(--br); padding:1.4rem; transition:border-color .3s; }
.tt-card:hover { border-color:var(--brh); }
.tt-icon { font-size:1.5rem; color:var(--pb); text-shadow:0 0 10px var(--p); margin-bottom:.6rem; }
.tt-name { font-size:.72rem; font-weight:800; letter-spacing:.15em; color:rgba(196,181,253,.75); margin-bottom:.5rem; }
.tt-desc { font-size:.7rem; line-height:1.65; color:var(--txt); margin-bottom:.6rem; }
.tt-diff { font-size:.55rem; letter-spacing:.15em; color:var(--dim); }

.code-arch-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.folder-tree { background:var(--card); border:1px solid var(--br); padding:1.4rem; }
.ft-title { font-size:.62rem; color:var(--dim); letter-spacing:.15em; margin-bottom:.9rem; }
.ft-item { font-size:.7rem; color:var(--txt); padding:.18rem 0; }
.ft-item.root { color:var(--pb); }
.ft-item.folder { color:var(--dim); font-weight:700; margin-top:.5rem; }
.ft-item.sub { padding-left:1rem; color:var(--txt); }
.ft-tag { color:var(--br); font-size:.6rem; }

.pda-structs { display:flex; flex-direction:column; gap:1rem; }
.pda-title { font-size:.6rem; letter-spacing:.22em; color:var(--dim); margin-bottom:.3rem; }
.pda-card { background:var(--card); border:1px solid var(--br); padding:1rem; }
.pda-name { font-size:.74rem; font-weight:800; color:var(--pb); margin-bottom:.25rem; }
.pda-seed { font-size:.6rem; color:var(--dim); margin-bottom:.6rem; font-style:italic; }
.pda-fields { display:flex; flex-wrap:wrap; gap:.35rem; }
.pda-fields span { font-size:.58rem; background:rgba(124,58,237,.07); border:1px solid var(--br); padding:.15rem .45rem; color:var(--txt); }

.ix-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.ix-card { background:var(--card); border:1px solid var(--br); padding:1.3rem; transition:border-color .3s; }
.ix-card:hover { border-color:var(--brh); }
.ix-name { font-size:.74rem; font-weight:800; color:var(--pb); letter-spacing:.12em; margin-bottom:.5rem; }
.ix-params { font-size:.63rem; color:var(--dim); margin-bottom:.7rem; line-height:1.6; font-style:italic; }
.ix-logic { font-size:.68rem; line-height:1.7; color:var(--txt); margin-bottom:.7rem; }
.ix-cu { font-size:.58rem; letter-spacing:.15em; color:var(--dim); }

.reward-formula-box { background:var(--card); border:1px solid var(--br); padding:1.5rem; }
.rf-title { font-size:.6rem; letter-spacing:.22em; color:var(--dim); margin-bottom:.8rem; }
.rf-formula { font-size:.72rem; line-height:2; color:var(--pb); white-space:pre; overflow-x:auto; }

.hybrid-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; }
.hy-card { background:var(--card); border:1px solid var(--br); padding:1.4rem; transition:border-color .3s; }
.hy-card:hover { border-color:var(--brh); }
.hy-title { font-size:.72rem; font-weight:800; color:var(--pb); letter-spacing:.12em; margin-bottom:.6rem; }
.hy-desc { font-size:.72rem; line-height:1.7; color:var(--txt); margin-bottom:.7rem; }
.hy-weight { font-size:.62rem; color:#FCD34D; margin-bottom:.5rem; }
.hy-bar { height:2px; background:rgba(124,58,237,.1); overflow:hidden; }
.hy-fill { height:100%; background:linear-gradient(90deg,var(--pd),var(--p)); box-shadow:0 0 6px var(--p); transition:width 1.8s ease; }

.security-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.sec-card { background:var(--card); border:1px solid var(--br); padding:1.3rem; transition:border-color .3s; }
.sec-card:hover { border-color:var(--brh); }
.sc-icon { font-size:1.4rem; color:var(--pb); text-shadow:0 0 8px var(--p); margin-bottom:.5rem; }
.sc-name { font-size:.7rem; font-weight:800; letter-spacing:.15em; color:rgba(196,181,253,.75); margin-bottom:.5rem; }
.sc-desc { font-size:.68rem; line-height:1.65; color:var(--txt); }

/* ── SKILLS ─────────────────────────────────── */
.skill-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-bottom:1.8rem; }
.skill-cat { background:var(--card); border:1px solid var(--br); padding:1.3rem; }
.skill-cat-title { font-size:.6rem; letter-spacing:.2em; color:var(--dim); margin-bottom:.9rem; padding-bottom:.5rem; border-bottom:1px solid var(--br); }
.skill-item { display:flex; align-items:center; gap:.45rem; font-size:.7rem; padding:.28rem 0; border-bottom:1px solid rgba(124,58,237,.04); }
.skill-item.unlocked { color:var(--txt); }
.skill-item.unlocked .sk-icon { color:var(--pb); }
.skill-item.locked { color:rgba(196,181,253,.18); }
.sk-icon { color:var(--pd); flex-shrink:0; font-size:.62rem; }
.sk-name { flex:1; }
.sk-req { font-size:.55rem; color:rgba(252,211,77,.6); white-space:nowrap; }
.skill-item.unlocked .sk-req { color:rgba(74,222,128,.6); }
.skill-legend { display:flex; gap:1.8rem; justify-content:center; font-size:.65rem; color:var(--dim); }
.leg-item { display:flex; align-items:center; gap:.4rem; }
.leg-dot { width:6px; height:6px; border-radius:50%; }
.unlocked-dot { background:#22C55E; box-shadow:0 0 5px #22C55E; }
.active-dot   { background:var(--pb); box-shadow:0 0 5px var(--p); }
.locked-dot   { background:rgba(196,181,253,.18); }

/* ── REWARDS ────────────────────────────────── */
.rewards-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-bottom:2.5rem; }
.rwcard { background:var(--card); border:1px solid var(--br); padding:1.5rem; text-align:center; transition:border-color .3s; }
.rwcard:hover { border-color:var(--brh); }
.rw-icon { font-size:2rem; color:var(--pb); text-shadow:0 0 14px var(--p); margin-bottom:.8rem; }
.rwcard h3 { font-size:.74rem; letter-spacing:.14em; color:var(--pb); margin-bottom:.55rem; }
.rwcard p { font-size:.7rem; line-height:1.65; color:var(--txt); margin-bottom:.85rem; }
.rw-rate { font-size:1.2rem; font-weight:800; color:#FCD34D; }
.rw-rate span { font-size:.58rem; color:var(--dim); display:block; }
.token-box { display:flex; align-items:center; gap:2.5rem; border:1px solid rgba(252,211,77,.18); padding:1.6rem 2.2rem; background:rgba(252,211,77,.02); }
.tok-sym { font-size:2.5rem; font-weight:800; color:#FCD34D; text-shadow:0 0 15px rgba(252,211,77,.4); }
.tok-name { font-size:.55rem; letter-spacing:.2em; color:rgba(252,211,77,.45); }
.tok-div { width:1px; height:65px; background:rgba(252,211,77,.15); }
.tok-use { font-size:.72rem; color:var(--txt); padding:.18rem 0; display:flex; align-items:center; gap:.65rem; }
.tk-dot { width:4px; height:4px; border-radius:50%; background:#FCD34D; box-shadow:0 0 4px #FCD34D; flex-shrink:0; }

/* ── LIVE FEED ──────────────────────────────── */
.full-term { margin-bottom:2.2rem; }
.net-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--br); border:1px solid var(--br); }
.ns { background:var(--card); padding:1.2rem; text-align:center; }
.ns-lbl { font-size:.55rem; letter-spacing:.14em; color:var(--dim); margin-bottom:.4rem; }
.ns-val { font-size:.88rem; font-weight:700; color:var(--pb); text-shadow:0 0 7px rgba(124,58,237,.3); }

/* ── TIERS ──────────────────────────────────── */
.tiers-list { display:flex; flex-direction:column; gap:.7rem; }
.tier-row { display:grid; grid-template-columns:130px 130px 1fr 300px; align-items:center; gap:1.3rem; padding:.85rem 1.1rem; background:var(--card); border:1px solid var(--br); transition:border-color .2s; }
.tier-row:hover { border-color:var(--brh); }
.tr-rank { font-size:.64rem; font-weight:800; letter-spacing:.18em; }
.r1 { color:rgba(196,181,253,.3); }
.r2 { color:rgba(196,181,253,.6); }
.r3 { color:var(--pb); text-shadow:0 0 6px var(--p); }
.r4 { color:rgba(220,38,38,.8); text-shadow:0 0 6px rgba(220,38,38,.4); }
.r5 { color:#FCD34D; text-shadow:0 0 12px rgba(252,211,77,.5); animation:blink 2s ease-in-out infinite; }
.rd { color:#EF4444; text-shadow:0 0 8px rgba(239,68,68,.5); }
.tr-req { font-size:.67rem; color:var(--dim); }
.tr-bar { height:2px; background:rgba(124,58,237,.08); overflow:hidden; }
.tr-fill { height:100%; background:linear-gradient(90deg,var(--pd),var(--p)); box-shadow:0 0 5px var(--p); transition:width 1.8s ease; }
.tr-perk { font-size:.67rem; color:var(--txt); }

/* ── CTA ────────────────────────────────────── */
.cta-section { background:radial-gradient(ellipse at center,rgba(124,58,237,.06) 0%,transparent 70%); text-align:center; padding:6rem 1.5rem; }
.cta-inner h2 { font-size:3rem; font-weight:800; margin-bottom:1.1rem; letter-spacing:.07em; }
.cta-inner p { font-size:.85rem; color:var(--txt); line-height:2; margin-bottom:2rem; }
.cta-btns { display:flex; gap:.85rem; justify-content:center; flex-wrap:wrap; margin-bottom:.9rem; }
.cta-note { font-size:.62rem; color:var(--dim); letter-spacing:.08em; }

/* ── FOOTER ─────────────────────────────────── */
.footer { padding:2.2rem 1.5rem; border-top:1px solid var(--br); background:#000; text-align:center; }
.foot-logo { display:flex; align-items:center; justify-content:center; gap:.75rem; margin-bottom:1.1rem; }
.foot-tag { font-size:.55rem; letter-spacing:.14em; color:var(--dim); }
.foot-links { display:flex; justify-content:center; gap:1.6rem; margin-bottom:1.1rem; flex-wrap:wrap; }
.foot-links a { color:var(--dim); text-decoration:none; font-size:.66rem; letter-spacing:.1em; transition:color .2s; }
.foot-links a:hover { color:var(--pb); }
.foot-copy { font-size:.58rem; color:rgba(124,58,237,.2); letter-spacing:.07em; }

/* ── Glitch ─────────────────────────────────── */
.glitch { position:relative; color:var(--pb); }
.glitch::before,.glitch::after { content:attr(data-text); position:absolute; top:0; left:0; width:100%; height:100%; }
.glitch::before { color:rgba(124,58,237,.6); animation:glitch1 5s infinite; clip-path:polygon(0 0,100% 0,100% 40%,0 40%); }
.glitch::after  { color:rgba(76,29,149,.5); animation:glitch2 5s infinite; clip-path:polygon(0 60%,100% 60%,100% 100%,0 100%); }
@keyframes glitch1 { 0%,90%,100%{transform:translate(0)} 92%{transform:translate(-3px,1px)} 95%{transform:translate(2px,-1px)} }
@keyframes glitch2 { 0%,90%,100%{transform:translate(0)} 92%{transform:translate(3px,-1px)} 95%{transform:translate(-2px,2px)} }
@keyframes blink   { 0%,100%{opacity:1} 50%{opacity:.3} }

/* ── Typing cursor ──────────────────────────── */
.typer::after { content:'█'; color:var(--pb); font-size:.8em; animation:blink .7s step-end infinite; margin-left:2px; }

/* ─────────────────────────────────────────────
   NEW SECTIONS
   ───────────────────────────────────────────── */

/* ── ASCII Ticker ────────────────────────────── */
.ascii-section { padding:4rem 1.5rem; border-bottom:1px solid rgba(124,58,237,.06); }
.ascii-ticker-wrap { overflow:hidden; display:flex; flex-direction:column; gap:1rem; margin-top:1.5rem; }
.ascii-ticker-row { overflow:hidden; position:relative; }
.ascii-ticker-row::before,.ascii-ticker-row::after {
  content:''; position:absolute; top:0; bottom:0; width:100px; z-index:2; pointer-events:none;
}
.ascii-ticker-row::before { left:0; background:linear-gradient(90deg,var(--bg),transparent); }
.ascii-ticker-row::after  { right:0; background:linear-gradient(270deg,var(--bg),transparent); }
.ascii-ticker-track { display:flex; gap:1rem; width:max-content; }
.ascii-ticker-track.left  { animation:tickLeft 40s linear infinite; }
.ascii-ticker-track.right { animation:tickRight 40s linear infinite; }
.ascii-ticker-track:hover { animation-play-state:paused; }
.ascii-chip {
  flex-shrink:0; background:var(--bg2); border:1px solid var(--br);
  padding:1rem 1.4rem; min-width:230px; cursor:pointer;
  transition:border-color .2s, background .2s;
  display:flex; flex-direction:column; gap:.3rem; user-select:none;
}
.ascii-chip:hover { border-color:var(--brh); background:rgba(124,58,237,.05); }
.ascii-chip-num   { font-size:.52rem; letter-spacing:.32em; color:var(--dim); }
.ascii-chip-title { font-size:.72rem; font-weight:700; color:rgba(196,181,253,.8); letter-spacing:.05em; line-height:1.35; }
.ascii-chip-hint  { font-size:.56rem; color:var(--p); letter-spacing:.14em; margin-top:.15rem; }
@keyframes tickLeft  { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes tickRight { 0%{transform:translateX(-50%)} 100%{transform:translateX(0)} }

/* ── ASCII Modal ─────────────────────────────── */
.ascii-modal {
  position:fixed; inset:0; z-index:9000; background:rgba(0,0,0,.93);
  display:none; align-items:center; justify-content:center; padding:1.5rem;
}
.ascii-modal.open { display:flex; }
.ascii-modal-inner {
  background:#000; border:1px solid var(--brh); width:100%; max-width:700px;
  max-height:88vh; display:flex; flex-direction:column;
  box-shadow:0 0 50px rgba(124,58,237,.2); animation:fadeInUp .18s ease;
}
.ascii-modal-bar {
  display:flex; align-items:center; gap:.5rem; padding:.6rem 1rem;
  border-bottom:1px solid var(--br); flex-shrink:0; background:#000;
}
.ascii-modal-title { font-size:.6rem; letter-spacing:.2em; color:var(--pb); flex:1; margin-left:.4rem; }
.ascii-modal-x { background:none; border:1px solid var(--br); color:var(--dim); font-family:inherit; font-size:.6rem; padding:.2rem .55rem; cursor:pointer; transition:all .2s; }
.ascii-modal-x:hover { border-color:var(--brh); color:var(--pb); }
.ascii-modal-body { padding:1.4rem; overflow-y:auto; flex:1; }
.ascii-modal-body pre { font-family:'JetBrains Mono',monospace; font-size:.68rem; line-height:1.65; color:rgba(196,181,253,.7); white-space:pre; overflow-x:auto; }
.ascii-modal-desc { font-size:.7rem; line-height:1.8; color:var(--txt); margin-top:1.2rem; border-top:1px solid var(--br); padding-top:1rem; }

/* ── TX Badges (Solana Beach style) ─────────── */
.tx-badge { display:inline-block; font-size:.58rem; font-weight:700; padding:.2rem .65rem; border-radius:20px; letter-spacing:.04em; }
.tx-badge.success { background:#22C55E; color:#000; }
.tx-badge.failed  { background:#EAB308; color:#000; }

/* ── How It Works ───────────────────────────── */
.hiw-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.hiw-card { background:var(--card); border:1px solid var(--br); padding:1.5rem; text-align:center; transition:border-color .3s; }
.hiw-card:hover { border-color:var(--brh); }
.hiw-step { font-size:.58rem; letter-spacing:.3em; color:var(--dim); margin-bottom:.5rem; }
.hiw-num { font-size:2.5rem; font-weight:800; color:var(--pb); text-shadow:0 0 18px rgba(124,58,237,.4); line-height:1; margin-bottom:.6rem; }
.hiw-title { font-size:.76rem; font-weight:800; letter-spacing:.12em; color:rgba(196,181,253,.8); margin-bottom:.5rem; }
.hiw-desc { font-size:.7rem; line-height:1.7; color:var(--txt); }
.hiw-arrow { font-size:1.5rem; color:var(--br); display:flex; align-items:center; justify-content:center; }

/* ── LLM Agent Types ────────────────────────── */
.llm-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.llm-card { background:var(--card); border:1px solid var(--br); padding:1.5rem; transition:border-color .3s; }
.llm-card:hover { border-color:var(--brh); }
.llm-model-tag { font-size:.55rem; letter-spacing:.22em; color:var(--dim); margin-bottom:.5rem; }
.llm-name { font-size:.9rem; font-weight:800; color:rgba(196,181,253,.85); margin-bottom:.3rem; }
.llm-maker { font-size:.62rem; color:var(--dim); margin-bottom:.7rem; }
.llm-desc { font-size:.7rem; line-height:1.65; color:var(--txt); margin-bottom:.9rem; }
.llm-tags { display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:.9rem; }
.llm-tags span { font-size:.55rem; background:rgba(124,58,237,.08); border:1px solid var(--br); padding:.15rem .45rem; color:var(--dim); }
.llm-perf { display:flex; justify-content:space-between; font-size:.62rem; }
.llm-perf span { color:var(--dim); }
.llm-perf strong { color:var(--pb); }

/* ── Agent Auth ─────────────────────────────── */
.auth-tabs { display:flex; gap:0; border:1px solid var(--br); margin-bottom:1.8rem; width:fit-content; }
.auth-tab { background:transparent; border:none; color:var(--dim); font-family:inherit; font-size:.68rem; font-weight:700; letter-spacing:.12em; padding:.55rem 1.4rem; cursor:pointer; transition:all .2s; border-right:1px solid var(--br); }
.auth-tab:last-child { border-right:none; }
.auth-tab.active { background:rgba(124,58,237,.1); color:var(--pb); }
.auth-pane { display:none; }
.auth-pane.active { display:block; }
.auth-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; }
.code-block { background:var(--bg2); border:1px solid var(--br); padding:1.2rem 1.4rem; }
.code-block-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.8rem; }
.code-block-title { font-size:.6rem; letter-spacing:.2em; color:var(--dim); }
.code-copy-btn { background:none; border:1px solid var(--br); color:var(--dim); font-family:inherit; font-size:.58rem; padding:.2rem .6rem; cursor:pointer; transition:all .2s; letter-spacing:.08em; }
.code-copy-btn:hover { border-color:var(--brh); color:var(--pb); }
.code-block pre { font-size:.7rem; line-height:1.75; color:rgba(196,181,253,.7); overflow-x:auto; white-space:pre; }
.code-block pre .kw  { color:var(--pb); }
.code-block pre .str { color:#A3E635; }
.code-block pre .cmt { color:rgba(196,181,253,.3); font-style:italic; }
.auth-key-input-wrap { display:flex; gap:.65rem; margin-top:1rem; }
.auth-key-input { flex:1; background:var(--bg2); border:1px solid var(--br); color:var(--txt); font-family:inherit; font-size:.7rem; padding:.65rem 1rem; outline:none; letter-spacing:.05em; }
.auth-key-input:focus { border-color:var(--brh); }
.auth-key-input::placeholder { color:rgba(196,181,253,.2); }
.auth-status { font-size:.7rem; color:var(--dim); padding:.6rem 0; letter-spacing:.08em; min-height:1.8rem; }
.auth-status.ok  { color:#4ADE80; }
.auth-status.err { color:#EF4444; }
.auth-status.loading { color:#FCD34D; animation:blink 1s step-end infinite; }
.rent-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.rent-card { background:var(--card); border:1px solid var(--br); padding:1.4rem; }
.rent-card-tier { font-size:.55rem; letter-spacing:.3em; color:var(--dim); margin-bottom:.4rem; }
.rent-card-name { font-size:.9rem; font-weight:800; color:rgba(196,181,253,.8); margin-bottom:.4rem; }
.rent-card-price { font-size:1.6rem; font-weight:800; color:var(--pb); line-height:1; margin-bottom:.2rem; }
.rent-card-price span { font-size:.65rem; color:var(--dim); font-weight:400; }
.rent-card-desc { font-size:.68rem; line-height:1.65; color:var(--txt); margin-bottom:.8rem; }
.rent-soon { display:inline-block; font-size:.58rem; letter-spacing:.18em; color:#FCD34D; border:1px solid rgba(252,211,77,.2); padding:.2rem .6rem; margin-bottom:.8rem; }

/* ── Task Workspace ─────────────────────────── */
.workspace-wrap { display:grid; grid-template-columns:1fr 380px; gap:1.2rem; }
.ws-panel { background:var(--bg2); border:1px solid var(--br); display:flex; flex-direction:column; }
.ws-header { display:flex; align-items:center; gap:.5rem; padding:.6rem 1rem; background:rgba(0,0,0,.7); border-bottom:1px solid var(--br); flex-shrink:0; }
.ws-title { font-size:.65rem; letter-spacing:.15em; color:var(--dim); }
.ws-status-dot { width:6px; height:6px; border-radius:50%; background:var(--pb); box-shadow:0 0 5px var(--p); animation:blink 1.8s ease-in-out infinite; margin-left:auto; }
.ws-body { flex:1; padding:1rem; overflow-y:auto; height:340px; font-size:.7rem; line-height:1.8; }
.ws-body::-webkit-scrollbar { width:3px; }
.ws-body::-webkit-scrollbar-thumb { background:var(--br); }
.ws-controls { padding:.75rem 1rem; border-top:1px solid var(--br); display:flex; gap:.65rem; flex-wrap:wrap; background:rgba(0,0,0,.4); flex-shrink:0; }
.ws-select { background:var(--bg2); border:1px solid var(--br); color:var(--txt); font-family:inherit; font-size:.65rem; padding:.4rem .75rem; outline:none; cursor:pointer; }
.ws-select:focus { border-color:var(--brh); }
.ws-btn { background:rgba(124,58,237,.15); border:1px solid var(--br); color:var(--pb); font-family:inherit; font-size:.65rem; font-weight:700; letter-spacing:.1em; padding:.4rem .9rem; cursor:pointer; transition:all .2s; }
.ws-btn:hover { background:rgba(124,58,237,.25); border-color:var(--brh); }
.ws-btn.danger { color:#EF4444; border-color:rgba(239,68,68,.2); background:rgba(239,68,68,.05); }
.ws-btn.danger:hover { background:rgba(239,68,68,.1); border-color:rgba(239,68,68,.4); }
.ws-log { color:var(--txt); padding:.1rem 0; display:flex; gap:.5rem; }
.ws-log .ws-ts  { color:rgba(196,181,253,.3); flex-shrink:0; }
.ws-log .ws-ok  { color:#4ADE80; }
.ws-log .ws-err { color:#EF4444; }
.ws-log .ws-inf { color:var(--pb); }
.ws-log .ws-wrn { color:#FCD34D; }
.notif-item { border-bottom:1px solid rgba(124,58,237,.08); padding:.75rem 0; }
.notif-header { display:flex; align-items:center; gap:.5rem; margin-bottom:.35rem; }
.notif-icon { font-size:.9rem; }
.notif-task { font-size:.68rem; font-weight:700; color:rgba(196,181,253,.8); }
.notif-time { margin-left:auto; font-size:.58rem; color:var(--dim); }
.notif-body { font-size:.67rem; line-height:1.7; color:var(--txt); }
.notif-reward { color:#FCD34D; font-weight:700; }
.notif-skill { color:#EF4444; }
.notif-skill-tag { display:inline-block; font-size:.58rem; background:rgba(239,68,68,.08); border:1px solid rgba(239,68,68,.2); padding:.15rem .45rem; color:rgba(239,68,68,.8); margin:.2rem .2rem 0 0; }

/* ── Compute Section ────────────────────────── */
.compute-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.comp-card { background:var(--card); border:1px solid var(--br); padding:1.5rem; transition:border-color .3s; }
.comp-card:hover { border-color:var(--brh); }
.comp-icon { font-size:2rem; color:var(--pb); text-shadow:0 0 12px var(--p); margin-bottom:.7rem; }
.comp-name { font-size:.8rem; font-weight:800; letter-spacing:.15em; color:rgba(196,181,253,.8); margin-bottom:.5rem; }
.comp-desc { font-size:.7rem; line-height:1.7; color:var(--txt); margin-bottom:.9rem; }
.comp-specs { display:flex; flex-direction:column; gap:.3rem; margin-bottom:.9rem; }
.comp-spec { display:flex; justify-content:space-between; font-size:.65rem; border-bottom:1px solid rgba(124,58,237,.06); padding:.2rem 0; }
.comp-spec-k { color:var(--dim); }
.comp-spec-v { color:var(--pb); }
.comp-live { font-size:.58rem; letter-spacing:.18em; color:#22C55E; animation:blink 2s ease-in-out infinite; }

/* ── Tokenomics ─────────────────────────────── */
.tknmcs-wrap { display:grid; grid-template-columns:350px 1fr; gap:2rem; align-items:start; }
.tknmcs-chart { display:flex; flex-direction:column; gap:.7rem; }
.tok-bar-item { display:flex; flex-direction:column; gap:.35rem; }
.tok-bar-label { display:flex; justify-content:space-between; font-size:.68rem; }
.tok-bar-name { color:rgba(196,181,253,.75); }
.tok-bar-pct { color:var(--pb); font-weight:700; }
.tok-bar-track { height:4px; background:rgba(124,58,237,.1); border-radius:0; overflow:hidden; }
.tok-bar-fill { height:100%; background:linear-gradient(90deg,var(--pd),var(--pb)); box-shadow:0 0 6px var(--p); transition:width 1.5s ease; }
.tok-cards { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.tok-card { background:var(--card); border:1px solid var(--br); padding:1.2rem; }
.tok-card-lbl { font-size:.58rem; letter-spacing:.2em; color:var(--dim); margin-bottom:.4rem; }
.tok-card-val { font-size:1.1rem; font-weight:800; color:var(--pb); }
.tok-card-sub { font-size:.62rem; color:var(--txt); margin-top:.25rem; }
.tknmcs-info { display:flex; flex-direction:column; gap:1rem; }

/* ── Utility ────────────────────────────────── */
.utility-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.util-card { background:var(--card); border:1px solid var(--br); padding:1.4rem; transition:border-color .3s; }
.util-card:hover { border-color:var(--brh); }
.util-icon { font-size:1.6rem; color:var(--pb); text-shadow:0 0 10px var(--p); margin-bottom:.6rem; }
.util-name { font-size:.78rem; font-weight:800; letter-spacing:.12em; color:rgba(196,181,253,.8); margin-bottom:.5rem; }
.util-desc { font-size:.7rem; line-height:1.7; color:var(--txt); }

/* ── Roadmap ────────────────────────────────── */
.roadmap-line { position:relative; display:flex; flex-direction:column; gap:0; padding-left:2rem; }
.roadmap-line::before { content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background:linear-gradient(180deg,var(--pd),var(--p),var(--pd)); }
.road-item { position:relative; padding:1.2rem 1.4rem; background:var(--card); border:1px solid var(--br); margin-bottom:1rem; transition:border-color .3s; }
.road-item:hover { border-color:var(--brh); }
.road-item::before { display:none; }
.road-dot { position:absolute; left:-2.35rem; top:1.5rem; width:10px; height:10px; background:var(--pd); border:1px solid var(--p); border-radius:50%; }
.road-dot.done   { background:var(--p); box-shadow:0 0 8px var(--p); }
.road-dot.active { background:var(--pb); box-shadow:0 0 12px var(--pb); animation:blink 2s ease-in-out infinite; }
.road-phase { font-size:.56rem; letter-spacing:.3em; color:var(--dim); margin-bottom:.25rem; }
.road-title { font-size:.85rem; font-weight:800; color:rgba(196,181,253,.8); margin-bottom:.5rem; }
.road-items { display:flex; flex-direction:column; gap:.2rem; }
.road-items li { font-size:.7rem; color:var(--txt); padding-left:.8rem; position:relative; list-style:none; }
.road-items li::before { content:'▸'; position:absolute; left:0; color:var(--pd); }
.road-done  { color:var(--pb) !important; }
.road-done::before { content:'✓' !important; color:#4ADE80 !important; }

/* ── Difficulty Table ───────────────────────── */
.diff-table { border:1px solid var(--br); overflow:hidden; }
.diff-row { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:0; }
.diff-row.header { background:rgba(124,58,237,.08); font-size:.6rem; letter-spacing:.18em; color:var(--dim); border-bottom:1px solid var(--br); }
.diff-row.header div { padding:.7rem 1rem; }
.diff-row-card { background:var(--card); border-bottom:1px solid var(--br); transition:background .2s; }
.diff-row-card:hover { background:rgba(124,58,237,.04); }
.diff-row-card::before,.diff-row-card::after { display:none; }
.diff-row-card > div { padding:.75rem 1rem; font-size:.7rem; }
.diff-spt { color:var(--txt); }
.diff-mult { font-weight:800; }
.diff-tier-name { color:var(--dim); font-size:.65rem; }
.diff-adv { font-size:.6rem; letter-spacing:.12em; }
.diff-adv.best { color:#4ADE80; }
.diff-adv.good { color:var(--pb); }
.diff-adv.poor { color:#EF4444; }

/* ── Epoch Reward Banner ────────────────────── */
.epoch-banner { background:rgba(252,211,77,.03); border:1px solid rgba(252,211,77,.15); padding:1.2rem 1.5rem; margin-bottom:1.8rem; display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.epoch-label { font-size:.58rem; letter-spacing:.25em; color:rgba(252,211,77,.5); }
.epoch-val { font-size:1.1rem; font-weight:800; color:#FCD34D; }
.epoch-sep { color:rgba(252,211,77,.15); }
.epoch-note { font-size:.65rem; color:rgba(252,211,77,.55); }

/* ── Animations ─────────────────────────────── */
@keyframes fadeInUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
.fade-up { animation:fadeInUp .55s ease both; }

/* ── Responsive ─────────────────────────────── */
@media(max-width:1300px) {
  .agent-grid,.task-types-grid,.security-grid { grid-template-columns:repeat(2,1fr); }
  .skill-grid { grid-template-columns:repeat(2,1fr); }
  .plans-grid { grid-template-columns:repeat(2,1fr); }
  .code-arch-grid { grid-template-columns:1fr; }
  .ix-grid { grid-template-columns:repeat(2,1fr); }
  .hiw-grid { grid-template-columns:repeat(2,1fr); }
  .tknmcs-wrap { grid-template-columns:1fr; }
  .tok-cards { grid-template-columns:repeat(3,1fr); }
  .workspace-wrap { grid-template-columns:1fr; }
}
@media(max-width:1000px) {
  .mining-grid { grid-template-columns:repeat(2,1fr); }
  .rewards-grid { grid-template-columns:repeat(2,1fr); }
  .net-stats { grid-template-columns:repeat(2,1fr); }
  .tier-row { grid-template-columns:1fr 1fr; }
  .tr-bar { display:none; }
  .hybrid-grid { grid-template-columns:1fr; }
  .intro-section { grid-template-columns:1fr; }
  .llm-grid { grid-template-columns:repeat(2,1fr); }
  .utility-grid { grid-template-columns:repeat(2,1fr); }
  .auth-grid { grid-template-columns:1fr; }
  .compute-grid { grid-template-columns:repeat(2,1fr); }
  .rent-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  body { font-size:14px; }
  .navbar { padding:.75rem 1rem; }
  .nav-links { display:none; }
  section { padding:3rem 1rem; }
  .intro-title { font-size:3rem; }
  .ti-body { flex-direction:column; }
  .ti-logo-wrap { border-right:none; border-bottom:1px solid var(--br); }
  .agent-grid,.skill-grid,.rewards-grid,.task-types-grid,.security-grid,.ix-grid,
  .llm-grid,.utility-grid,.compute-grid,.plans-grid,.hiw-grid,.rent-grid { grid-template-columns:1fr; }
  .token-box { flex-direction:column; gap:1rem; text-align:center; }
  .tok-div { width:50px; height:1px; }
  .cta-inner h2 { font-size:1.8rem; }
  .tier-row { grid-template-columns:1fr; }
  .tr-bar,.tr-perk { display:none; }
  .ascii-diagram { min-width:90vw; }
  .diff-row { grid-template-columns:1fr 1fr; }
  .diff-tier-name,.diff-adv { display:none; }
  .tok-cards { grid-template-columns:1fr 1fr; }
  .mining-cards { grid-template-columns:1fr; }
  .workspace-wrap { grid-template-columns:1fr; }
}
