/* Scoped token page styles */
.token-page{
  --token-bg: radial-gradient(circle at 15% 10%, rgba(34,211,238,0.20), transparent 42%),
              radial-gradient(circle at 85% 0%, rgba(99,102,241,0.25), transparent 40%),
              linear-gradient(180deg,#f4f7ff 0%,#e7f7ff 100%);
  --token-surface:#ffffff;
  --token-muted:#32405c;
  --token-text:#0b1020;
  --token-border:rgba(15,23,42,0.12);
  --token-shadow:0 18px 36px rgba(15,23,42,0.18);
  --token-accent:#2563eb;
  --token-accent-2:#6366f1;
  min-height:100vh;
  padding:2.5rem 1.25rem 4rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  background:var(--token-bg);
  color:var(--token-text);
  font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  position:relative;
}
.token-page::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 20%, rgba(99,102,241,0.12), transparent 45%),
    radial-gradient(circle at 80% 10%, rgba(34,211,238,0.12), transparent 45%),
    url("/token/assets/crbot-token.svg") center/420px no-repeat;
  opacity:0.08;
  mix-blend-mode:multiply;
  z-index:0;
}
.token-frame{max-width:1200px;margin:0 auto;padding:0 18px;}
.token-frame #siteHeader,
.token-frame #siteFooter{width:100%;}
.token-page .token-shell{
  width:100%;
  max-width:1200px;
}
.token-page .token-hero{margin:1.5rem auto;position:relative;}
.token-page .token-eyebrow{
  letter-spacing:.18em;
  font-size:12px;
  color:#a5b4fc;
  text-transform:uppercase;
  display:inline-block;
  margin-bottom:4px;
}
.token-page h1{font-size:2.2rem;margin:.35rem 0 .4rem;color:#0b1020;}
.token-page p{color:var(--token-text);line-height:1.6;margin:0 0 12px;}
.token-page .token-cta-row{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0;}
.token-page .token-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.token-page .token-nav a{padding:8px 12px;border-radius:12px;border:1px solid var(--token-border);background:rgba(255,255,255,0.02);text-decoration:none;color:var(--token-text);font-weight:700;}
.token-page .token-nav a:hover{border-color:var(--token-accent-2);box-shadow:0 10px 24px rgba(0,0,0,0.35);}

.token-page .token-section--hero .token-section-inner{
  background:radial-gradient(circle at 15% 10%, rgba(34,211,238,0.16), transparent 55%),radial-gradient(circle at 80% 0%, rgba(99,102,241,0.22), transparent 60%),linear-gradient(135deg, rgba(255,255,255,0.95), rgba(241,245,255,0.92));
  padding:2.2rem 1.8rem;
}
.token-page .token-hero-layout{display:grid;gap:1.5rem;}
.token-page .token-hero-main{display:grid;grid-template-columns:1fr;align-items:start;gap:12px 14px;position:relative;}
.token-page .token-hero-logo{
  width:120px;
  border-radius:18px;
  padding:10px;
  background:linear-gradient(135deg, rgba(34,211,238,0.16), rgba(99,102,241,0.16));
  border:1px solid rgba(15,23,42,0.06);
  box-shadow:0 10px 24px rgba(15,23,42,0.22);
  backdrop-filter:blur(6px);
  margin-bottom:0;
}
.token-page .token-hero-main .token-hero-inline{display:flex;align-items:center;gap:14px;flex-wrap:nowrap;}
.token-page .token-hero-main .token-hero-inline .token-section-body{margin:0;flex:1 1 0;min-width:0;}
.token-page .token-hero-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.token-page .token-hero-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:16px;background:linear-gradient(135deg, rgba(34,211,238,0.18), rgba(99,102,241,0.18));border:1px solid rgba(99,102,241,0.35);font-weight:700;color:#0b1020;box-shadow:0 10px 20px rgba(15,23,42,0.12);}
.token-page .token-hero-chip svg{width:18px;height:18px;fill:#0b1020;opacity:0.9;}
.token-page .network-badge,.token-page .network-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;margin-top:8px;border-radius:12px;background:linear-gradient(135deg, rgba(34,211,238,0.15), rgba(99,102,241,0.15));border:1px solid rgba(99,102,241,0.3);color:#0b1020;font-weight:600;font-size:.9rem;width:-moz-fit-content;width:fit-content;}
.token-page .network-badge svg,.token-page .network-pill svg{width:14px;height:14px;fill:#5b67f6;}
@media(min-width:900px){
  .token-page .token-hero-layout{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center;}
}

.token-page .price-card{
  background:radial-gradient(circle at 30% 10%, rgba(34,211,238,0.12), transparent 60%),radial-gradient(circle at 90% 0%, rgba(99,102,241,0.12), transparent 70%),#f6f8ff;
  border-radius:20px;
  padding:18px;
  box-shadow:var(--token-shadow);
  border:1px solid var(--token-border);
  position:relative;
}
.token-page .price-label{font-size:12px;letter-spacing:.2em;color:#94a3b8;margin-bottom:6px;text-transform:uppercase;}
.token-page .price-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px;}
.token-page .price-value{font-size:32px;font-weight:800;color:#0b1020;}
.token-page .price-change{font-weight:700;}
.token-page .price-change.up{color:#22d3ee;}
.token-page .price-change.down{color:#f43f5e;}
.token-page .price-change.flat{color:var(--token-muted);}
.token-page .price-meta{font-size:13px;color:var(--token-muted);display:flex;gap:8px;align-items:center;}
.token-page .price-stale{color:#c2410c;font-weight:600;}
.token-page .stale-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:10px;background:rgba(192,65,12,0.12);color:#c2410c;font-weight:700;font-size:.8rem;}
.token-page .stale-row{display:flex;align-items:center;gap:8px;min-height:24px;}

.token-page .supply{display:flex;align-items:center;gap:12px;margin-top:10px;}
.token-page .supply-ring{width:80px;height:80px;position:relative;}
.token-page .supply-ring svg{width:80px;height:80px;transform:rotate(-90deg);}
.token-page .supply-ring circle{fill:none;stroke-width:8;stroke-linecap:round;}
.token-page .supply-ring__bg{stroke:rgba(255,255,255,0.15);}
.token-page .supply-ring__fg{stroke:url(#supplyGradient);}
.token-page .supply-ring__label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#0b1020;}
.token-page .supply-meta{color:var(--token-muted);line-height:1.5;}

.token-page .token-section{width:100%;margin:1.5rem auto;position:relative;}
.token-page .token-section::before{content:"";position:absolute;inset:0;border-radius:24px;padding:1px;background:linear-gradient(135deg,#22d3ee,#6366f1,#ec4899);-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.9;filter:drop-shadow(0 10px 20px rgba(99,102,241,0.15));}
.token-page .token-section-inner{position:relative;z-index:1;border-radius:20px;padding:1.75rem 1.5rem;background:#ffffff;box-shadow:var(--token-shadow);}
.token-page .token-section-title{margin:0;font-size:1.6rem;color:#0b1020;font-weight:700;display:flex;align-items:center;gap:10px;}
.token-page .token-title-icon{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#6366f1;vertical-align:middle;}
.token-page .token-title-icon svg{width:20px;height:20px;fill:#6366f1;}
.token-page .token-section p.lead{margin-top:0;}
.token-page .token-section .token-section-body{color:var(--token-text);line-height:1.7;font-size:.96rem;}
.token-page .token-grid{display:grid;gap:12px;margin-top:12px;}
.token-page .token-grid--why{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.token-page .token-grid--status{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.token-page .token-grid--tokenomics{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.token-page .token-grid--trust{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.token-page .token-card{
  border:1px solid var(--token-border);
  border-radius:16px;
  padding:14px;
  background:#f9fbff;
  box-shadow:0 12px 28px rgba(15,23,42,0.12);
  display:flex;
  flex-direction:column;
  gap:8px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.token-page .token-card:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 18px 36px rgba(15,23,42,0.2);}
.token-page .token-card--mini{padding:12px;border-radius:14px;}
.token-page .token-card-icon{width:32px;height:32px;border-radius:10px;background:rgba(99,102,241,0.12);display:flex;align-items:center;justify-content:center;}
.token-page .token-card-icon svg{width:22px;height:22px;fill:#0b1020;}
.token-page .token-card h3{margin:6px 0 0;font-size:1.05rem;color:#0b1020;display:flex;align-items:center;gap:8px;}
.token-page .token-card h3 svg{width:18px;height:18px;fill:#6366f1;flex-shrink:0;}
.token-page .token-card p{margin:0;color:var(--token-text);line-height:1.5;}

.token-page .status-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;}
.token-page .status-card{border:1px solid var(--token-border);border-radius:14px;padding:14px;background:#f6f8ff;box-shadow:0 12px 28px rgba(15,23,42,0.12);display:flex;flex-direction:column;gap:8px;color:#1f2a44;}
.token-page .status-card h4{margin:0;color:#0b1020;}
.token-page .status-card h3{margin:0;color:#0b1020;display:flex;align-items:center;gap:8px;}
.token-page .status-card h3 svg{width:18px;height:18px;fill:#6366f1;}
.token-page .status-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(37,99,235,0.08);color:#0b1020;font-size:12px;font-weight:700;}
.token-page .address-text{word-break:break-all;font-family:monospace;font-size:13px;}
.token-page .token-address-line{padding:10px 12px;border:1px solid rgba(99,102,241,0.28);border-radius:14px;background:linear-gradient(135deg, rgba(255,255,255,0.92), rgba(240,245,255,0.92));box-shadow:0 8px 16px rgba(15,23,42,0.08);}
.token-page .address-actions{display:flex;flex-wrap:wrap;gap:8px;}
.token-page .address-actions .token-btn{min-width:140px;justify-content:center;}
.token-page .explorer-links,
.token-page .address-actions,
.token-page .api-links{align-items:stretch;}

.token-page .trade-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;}
.token-page .token-card{border:1px solid var(--token-border);border-radius:16px;padding:16px;background:#f9fbff;box-shadow:0 16px 30px rgba(15,23,42,0.14);display:flex;flex-direction:column;gap:10px;color:#1f2a44;}
.token-page .token-card h3{margin:0;font-size:18px;color:#0b1020;}
.token-page .form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;}
.token-page .form-grid input,.token-page .form-grid select{padding:10px;border:1px solid var(--token-border);border-radius:12px;background:rgba(255,255,255,0.02);color:var(--token-text);}
.token-page .btn-row{display:flex;flex-wrap:wrap;gap:10px;}
.token-page .btn-row.center{justify-content:center;}

.token-page .explorer-links{display:flex;flex-wrap:wrap;gap:8px;}
.token-page .explorer-links a{display:inline-flex;align-items:center;gap:6px;}
.token-page .explorer-links a svg{width:14px;height:14px;fill:#5b67f6;}
.token-page .explorer-links a span{display:inline-flex;align-items:center;}
.token-page .api-links{display:flex;flex-wrap:wrap;gap:8px;}
.token-page .api-links .token-btn{min-width:140px;justify-content:center;}
.token-page .explorer-links a{padding:8px 12px;border:1px solid var(--token-border);border-radius:12px;background:#f6f8ff;text-decoration:none;color:#0b1020;font-weight:700;}
.token-page .log{min-height:80px;border:1px solid var(--token-border);border-radius:12px;padding:10px;font-family:monospace;background:#f6f8ff;white-space:pre-line;color:#0b1020;}
.token-page .chips-grid{display:flex;flex-wrap:wrap;gap:10px;}
.token-page .hero-chips{display:flex;flex-wrap:wrap;gap:8px;}
.token-page .hero-chip{display:inline-flex;align-items:center;padding:8px 12px;border-radius:12px;background:rgba(255,255,255,0.05);border:1px solid var(--token-border);font-weight:700;color:var(--token-text);}
.token-page .token-highlights{display:flex;flex-wrap:wrap;gap:8px;margin-top:.75rem;}
.token-page .token-highlight-chip{font-size:.82rem;padding:.45rem .75rem;border-radius:999px;background:linear-gradient(135deg,rgba(34,211,238,0.2),rgba(99,102,241,0.2));border:1px solid rgba(148,163,184,0.4);color:var(--token-text);}
.token-page .token-highlight-chip svg{width:16px;height:16px;vertical-align:middle;margin-right:6px;}
.token-page .two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.token-page .cta-band{text-align:center;border-radius:24px;border:1px solid var(--token-border);padding:24px;box-shadow:var(--token-shadow);}
.token-page .token-section--cta .token-section-inner{
  text-align:center;
  background:radial-gradient(circle at center, rgba(99,102,241,0.18), transparent 60%), #ffffff;
}
.token-page .token-cta-actions{margin-top:1.25rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;}
.token-page .philosophy{background:transparent;border:1px solid transparent;}
.token-page .token-note-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:12px;}
.token-page .token-note{border:1px solid var(--token-border);border-radius:12px;padding:12px;background:#f6f8ff;box-shadow:0 10px 18px rgba(15,23,42,0.12);transition:transform .15s ease, box-shadow .15s ease;}
.token-page .token-note:hover{transform:translateY(-2px);box-shadow:0 14px 24px rgba(15,23,42,0.18);}
.token-page .token-note h3{margin:0 0 6px;display:flex;align-items:center;gap:8px;}
.token-page .token-note h3 svg{width:16px;height:16px;fill:#6366f1;}
.token-page .token-note p{margin:0;}

.token-page .token-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:.6rem 1.2rem;
  border-radius:999px;
  font-weight:600;
  font-size:.92rem;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, filter .2s ease;
  position:relative;
  overflow:hidden;
}
.token-page .token-btn::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.25) 50%, rgba(255,255,255,0) 70%);
  transform:translateX(-100%);
  transition:transform .6s ease;
  pointer-events:none;
}
.token-page .token-btn:hover::after{transform:translateX(100%);}
.token-page .token-btn:focus{outline:2px solid var(--token-accent-2);outline-offset:2px;}
.token-page .token-btn-primary{
  background:linear-gradient(135deg,#22d3ee,#6366f1);
  color:#0b1120;
  box-shadow:0 12px 24px rgba(0,0,0,0.5);
  border:1px solid rgba(99,102,241,0.4);
}
.token-page .token-btn svg{width:16px;height:16px;fill:#5b67f6;filter:drop-shadow(0 0 4px rgba(99,102,241,0.35));}
.token-page .token-btn-primary svg{fill:#0b1120;filter:none;}
.token-page .token-btn-primary:hover{
  transform:translateY(-1px) scale(1.01);
  box-shadow:0 16px 32px rgba(0,0,0,0.6);
  filter:brightness(1.02);
}
.token-page .token-btn-secondary{
  background:linear-gradient(135deg, rgba(255,255,255,0.88), rgba(242,247,255,0.88));
  border:1px solid rgba(148,163,184,0.6);
  color:var(--token-text);
  box-shadow:0 8px 16px rgba(15,23,42,0.12);
}
.token-page .token-btn-secondary:hover{
  border-color:var(--token-accent-2);
  background:radial-gradient(circle at center, rgba(99,102,241,0.12), transparent 60%), linear-gradient(135deg, rgba(255,255,255,0.92), rgba(234,239,255,0.92));
  transform:translateY(-1px) scale(1.01);
}
.token-page .token-btn-ghost{
  background:transparent;
  border-color:rgba(148,163,184,0.3);
  color:var(--token-text);
  box-shadow:0 6px 12px rgba(15,23,42,0.08);
}
.token-page .token-btn:hover{transform:translateY(-1px);}
.token-page .token-btn.disabled,
.token-page .token-btn:disabled{opacity:.5;pointer-events:none;filter:grayscale(0.35);}

.token-page .wallet-modal{position:fixed;inset:0;background:rgba(4,6,14,0.35);display:none;align-items:center;justify-content:center;padding:20px;z-index:200;}
.token-page .wallet-modal.open{display:flex;}
.token-page .wallet-modal__dialog{background:#ffffff;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,0.25);max-width:420px;width:100%;padding:20px;display:flex;flex-direction:column;gap:12px;color:#1f2a44;}
.token-page .wallet-modal__header{display:flex;justify-content:space-between;align-items:center;color:#0b1020;}
.token-page .wallet-modal__close{background:none;border:none;font-size:20px;cursor:pointer;color:#475569;}
.token-page .wallet-row{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.token-page .wallet-row .val{word-break:break-all;font-family:monospace;font-size:13px;color:#0b1020;}
.token-page .wallet-actions{display:flex;gap:10px;flex-wrap:wrap;}
.token-page .skeleton{background:linear-gradient(90deg,rgba(255,255,255,0.08),rgba(255,255,255,0.02),rgba(255,255,255,0.08));color:transparent;}
.token-page .token-highlight-chip{animation:fadeSlideUp .6s ease forwards;opacity:0;}
@keyframes fadeSlideUp{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

@media(max-width:720px){
  .token-page .btn-row{justify-content:center;}
  .token-page .status-cards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
  .token-page .address-actions .token-btn{min-width:120px;flex:1 1 48%;}
  .token-page .api-links .token-btn{min-width:120px;flex:1 1 48%;}
  .token-page .explorer-links a{min-width:120px;flex:1 1 48%;justify-content:center;}
  .token-page .token-cta-actions .token-btn{min-width:140px;flex:1 1 48%;}
  .token-page .token-hero-logo{margin-bottom:10px;}
  .token-page .token-hero-main h1,
  .token-page .token-hero-main .token-section-body,
  .token-page .token-hero-main .token-hero-chips,
  .token-page .token-hero-main .token-eyebrow{grid-column:1;}
  .token-page .token-hero-main .token-hero-inline{flex-wrap:wrap;gap:10px;}
  .token-page .token-hero-logo{width:110px;}
}

@media(max-width:480px){
  .token-page .token-hero-chip{padding:8px 10px;font-size:.88rem;}
  .token-page .token-btn{padding:.5rem 1rem;font-size:.9rem;}
  .token-page .token-btn svg{width:15px;height:15px;}
  .token-page .token-section-title{font-size:1.4rem;}
  .token-page .token-card h3{font-size:1rem;}
  .token-page .token-card{padding:12px;}
  .token-page .token-section-inner{padding:1.5rem 1.2rem;}
  .token-page .token-grid{gap:10px;}
}
