/* self-hosted fonts — no third-party fetch in the critical path */
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 700;font-display:swap;src:url(/static/fonts/manrope-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 700;font-display:swap;src:url(/static/fonts/manrope-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/geist-mono-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/geist-mono-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Blueprint product-site template (shared with ccledger/solentic
   subdomains) + explorer-specific components at the end. */
*{margin:0;padding:0;box-sizing:border-box}
/* Light-blue text selection — the one native accent: app-wide, only ever
   seen when you highlight a hash / party id / docs, so it signals the accent
   without touching the Blueprint identity anywhere else. */
::selection{background-color:var(--select,#cdd9ff);color:var(--n900,#18171f)}
::-moz-selection{background-color:var(--select,#cdd9ff);color:var(--n900,#18171f)}
/* single light theme — keep mobile browsers from auto-inverting the brand */
:root{color-scheme:light}
html{background:#f5f5f7}
:root{
  --n50:#fff;--n100:#f5f5f7;--n200:#e6e6e6;--n300:#d9d9d9;
  --n600:#56555c;--n900:#18171f;
  --blue:#5674e1;--blue-d:#4a63c7;--teal:#59b3d4;--lavender:#a7b1d4;
  --select:#cdd9ff;   /* Blueprint light-blue selection accent */
  --lavender-lt:#c6d2ff;--beige:#f2eee8;
  --border:var(--n300);--radius:.125rem;
  --font:Manrope,sans-serif;--mono:"Geist Mono",monospace;
  /* title ceiling: nothing renders larger than the hero title */
  --h1:clamp(1.55rem,1.1rem + 1.35vw,2.05rem);
  --h2:clamp(1.55rem,1.1rem + 1.35vw,2.05rem);
  --h3:clamp(1.5rem,1.1rem + .7vw,1.9rem);
  --h4:clamp(1.28rem,.95rem + .52vw,1.58rem);
  --text-main:clamp(.79rem,.66rem + .2vw,.91rem);
  --text-lg:clamp(.85rem,.52rem + .54vw,1.16rem);
  --text-sm:clamp(.68rem,.57rem + .17vw,.78rem);
  --text-xxl:clamp(1.49rem,.91rem + .94vw,2.03rem);
  --sec-space:clamp(.4rem,.34rem + .12vw,.5rem);
  --cta-grad:linear-gradient(135deg,#4a63c7,#6b82db 50%,#8fa0e8);
}
/* Lenis owns ALL smoothing — CSS smooth re-animates Lenis programmatic
   jumps (route scroll-to-top glides, gets interrupted by the DOM swap, and
   strands the user mid-page) */
html{scroll-behavior:auto}
body{
  font-family:var(--font);background:var(--n100);color:var(--n900);
  line-height:1.2;text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;transition:color .2s}
.link{color:var(--blue);text-decoration:underline}
h1,h2,h3,h4{font-family:var(--font);font-weight:400;line-height:1}
.mono{font-family:var(--mono)}

/* Container with Blueprint side-border pattern */
.pg{margin:0 2.5rem;padding-bottom:.6rem}
.ctr{width:84vw;max-width:100rem;margin:0 auto;border-left:1px solid var(--border);border-right:1px solid var(--border);height:100%}

/* Divider line */
.divider{height:1px;background:var(--border);margin:var(--sec-space) 0;width:100vw;position:relative;left:50%;transform:translateX(-50%)}
#view{min-height:78vh}   /* reserve height so the footer doesn't jump in as content loads (CLS) */

/* Header / Navbar */
.nav{position:sticky;top:0;z-index:100;background:var(--n100);height:5.8rem;transition:box-shadow .3s ease,background .3s ease}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:100%;padding:0;
  width:84vw;max-width:100rem;margin:0 auto;
}
.signet-mark{height:1.625rem;width:auto;opacity:.85}
.signet-tag{font-family:var(--mono);font-size:.62rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--n600);margin-top:.9rem}
.nav-logo{height:2rem;transform:translateY(5px)}
.nav-links{display:flex;gap:1.5rem;align-items:center}
.nav-links a{font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;color:var(--n900);line-height:1;display:inline-flex;align-items:center}
.nav-links a:hover{color:var(--blue)}
.nav-links a.active{color:var(--blue)}
.spacer-line{background:var(--border);height:1px;width:100vw;position:relative;left:50%;transform:translateX(-50%)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;
  border-radius:var(--radius);height:2.75rem;padding:1rem 1.9rem;
  transition:all .2s;white-space:nowrap;border:none;cursor:pointer;
}
.btn-dark{background:var(--n900);color:var(--n50)}
.btn-dark:hover{background:#18171fcc;color:var(--n50)}
.btn-light{background:var(--n200);color:var(--n900)}
.btn-light:hover{background:var(--n300)}
.btn-row{display:flex;gap:.75rem;flex-wrap:wrap}

.cta-primary{
  display:inline-flex;align-items:center;justify-content:center;
  padding:1rem 1.9rem;background:var(--n900);color:#fff;border-radius:var(--radius);
  text-decoration:none;font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;
  height:2.75rem;transition:opacity .2s;white-space:nowrap;border:none;cursor:pointer;
}
.cta-primary:hover{background:#18171fcc;color:#fff}

/* Section tag (// 01 pattern) */
.stag{
  font-family:var(--mono);font-size:var(--text-sm);
  text-transform:uppercase;letter-spacing:1px;margin-bottom:.625rem;
}
.stag .sl{color:var(--n300)}

/* Tags / pills */
.tag{
  display:inline-block;font-family:var(--mono);font-size:var(--text-sm);
  background:var(--beige);border-radius:var(--radius);padding:.75rem;
  line-height:1;text-transform:none;
}

/* Sections */
.sec{padding:1.9rem 0}
.sec-pad{padding:0 2rem}
.sec-white{background:var(--n50)}
.sec-title{font-size:var(--h2);margin-bottom:1rem}
/* editorial headings wrap in balanced blocks, not with orphan last words */
h1,h2,.sec-title,.gov-detail-title,.gov-prop-title{text-wrap:balance}
.sec-desc{color:var(--n600);font-size:var(--text-lg);max-width:36rem;margin-bottom:2rem;line-height:139%}

/* Utilities */
.code{font-family:var(--mono);font-size:var(--text-sm);background:var(--n200);padding:.125rem .375rem;border-radius:var(--radius)}
.muted{color:var(--n600);font-size:var(--text-main);line-height:139%}
.mt-1{margin-top:1rem}

/* Hero — left-aligned like Blueprint.xyz */
.hero{padding:6rem 0 4rem;text-align:left;position:relative;overflow:hidden}
/* subtle blueprint grid — architectural texture shared with the pricing hero */
.hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(24,23,31,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(24,23,31,.045) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 28% 0%,#000,transparent 74%);
  mask-image:radial-gradient(ellipse 72% 62% at 28% 0%,#000,transparent 74%)}
.hero-content{position:relative;z-index:2}
.hero .sec-pad{padding:0 2rem}
.hero .stag{font-size:var(--text-main);margin-bottom:.625rem;color:var(--n900)}
.hero h1{font-size:var(--h1);line-height:1;max-width:10em;padding-bottom:2rem}
.hero-body{color:var(--n600);font-size:var(--text-lg);max-width:28em;margin:0 0 1.5rem;line-height:139%}
.hero-cta{display:flex;gap:.75rem;justify-content:flex-start;flex-wrap:wrap;margin-bottom:2rem}

/* Built on badge */
.built-on{
  display:inline-flex;align-items:center;gap:.5rem;
  margin:0 0 2rem;
  font-family:var(--mono);font-size:var(--text-sm);
  text-transform:uppercase;letter-spacing:.5px;color:var(--n600);
}
.built-on-label{opacity:.8}
.partner-logo{height:1.55rem;width:auto}
.built-on-name{font-weight:500;color:var(--n900)}

/* Stats grid */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2.5rem 0 0}
.stat-card{background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 1.5rem;text-align:center;transition:transform .25s ease,box-shadow .25s ease}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
.stat-v{font-size:var(--text-xxl);font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
.stat-v.blue{color:var(--blue)}
/* --teal (#59b3d4) is a 2.4:1 fail as text; --teal-text passes AA on white */
:root{--teal-text:#2c7d9c}
.stat-v.teal{color:var(--teal-text)}
.stat-sub{font-family:var(--mono);font-size:.62rem;color:var(--n600);margin-top:.4rem;letter-spacing:.3px}
.stat-l{font-family:var(--mono);font-size:var(--text-sm);color:var(--n600);margin-top:.5rem;text-transform:uppercase}

/* 2x2 feature cards */
.feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.feat-card{padding:2.25rem;border-right:1px solid var(--border);border-bottom:1px solid var(--border);transition:background .25s ease}
.feat-card:nth-child(2n){border-right:none}
.feat-card:nth-last-child(-n+2){border-bottom:none}
.feat-card p{font-size:.78rem;color:var(--n600);line-height:1.5;margin-top:.15rem}
.feat-grid-compact{grid-template-columns:repeat(4,1fr)}
.feat-grid-compact .feat-card{padding:1.35rem 1.5rem}
.feat-grid-compact .feat-card h3{margin-bottom:.4rem;font-size:.95rem}
.feat-grid-compact .feat-card:nth-child(2n){border-right:1px solid var(--border)}
.feat-grid-compact .feat-card:nth-child(4n){border-right:none}
.feat-grid-compact .feat-card:nth-last-child(-n+2){border-bottom:1px solid var(--border)}
.feat-grid-compact .feat-card:nth-last-child(-n+4){border-bottom:none}
@media(max-width:1100px){
  .feat-grid-compact{grid-template-columns:repeat(2,1fr)}
  .feat-grid-compact .feat-card:nth-child(2n){border-right:none}
  .feat-grid-compact .feat-card:nth-last-child(-n+4){border-bottom:1px solid var(--border)}
  .feat-grid-compact .feat-card:nth-last-child(-n+2){border-bottom:none}
}
/* Feature bento — distinct bordered boxes (no fused grid, so an odd count can't
   leave broken cells). The two delivery capabilities span two columns as dark
   featured cards; 12 units fill three even rows. */
.feat-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;padding:0 2rem}
.feat-b{position:relative;display:flex;flex-direction:column;padding:1.4rem 1.5rem;background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius) * 2);text-decoration:none;min-width:0;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.feat-b:hover{border-color:var(--n600);box-shadow:var(--shadow-1);transform:translateY(-1px)}
.feat-b h3{font-size:.95rem;font-weight:500;color:var(--n900);margin:0 0 .35rem}
.feat-b p{font-size:.78rem;color:var(--n600);line-height:1.5;margin:0}
.feat-b-lg{grid-column:span 2;padding:1.55rem 1.8rem;background:linear-gradient(var(--n50),var(--n50)) padding-box,linear-gradient(100deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1) border-box;background-size:100% 100%,300% 100%;border:1.6px solid transparent;animation:auroraMorph 8s ease-in-out infinite}
.feat-b-lg h3{font-size:1.05rem;margin-bottom:.4rem}
.feat-b-lg p{font-size:.8rem}
.feat-b-lg:hover{border-color:transparent;box-shadow:0 14px 40px -20px rgba(86,116,225,.45);transform:translateY(-1px)}
.feat-b-tag{font-family:var(--mono);font-size:.58rem;text-transform:uppercase;letter-spacing:.11em;color:var(--blue);font-weight:600;margin-bottom:.5rem}
.feat-b-meta{font-family:var(--mono);font-size:.62rem;color:var(--n600);margin-top:.75rem}
@media(prefers-reduced-motion:reduce){.feat-b-lg{animation:none}}
@media(max-width:900px){.feat-bento{grid-template-columns:repeat(2,1fr)}.feat-b-lg{grid-column:span 2}}
@media(max-width:560px){.feat-bento{grid-template-columns:1fr}.feat-b-lg{grid-column:span 1}}
/* featured-apps rail — a slow marquee of the entire on-chain registry */
.apps-rail{display:flex;align-items:center;gap:1rem;min-width:0}
.apps-rail-l{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--n600);white-space:nowrap;flex:none}
.apps-rail-l b{color:var(--n900)}
.apps-marquee{flex:1;min-width:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3rem,#000 calc(100% - 3rem),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 3rem,#000 calc(100% - 3rem),transparent)}
.apps-marquee-track{display:inline-flex;gap:.45rem;white-space:nowrap;will-change:transform;animation:railScroll 180s linear infinite;padding:.1rem 0}
.apps-marquee:hover .apps-marquee-track{animation-play-state:paused}
@keyframes railScroll{to{transform:translateX(-50%)}}
.arc-dup{display:contents}
.arc{display:inline-flex;align-items:center;gap:.5rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:.55rem .75rem;font-size:.78rem;transition:border-color .15s;min-width:0;flex:none}
.arc:hover{border-color:var(--blue)}
.arc-idn{display:inline-flex;line-height:0}
.arc .idn{width:14px;height:14px;border-radius:3px}
.arc-name{font-weight:600;color:var(--n900);white-space:nowrap}
.arc-val{font-size:.66rem;color:var(--blue-d);white-space:nowrap}
.arc-val i{font-style:normal;font-size:.54rem;color:var(--n600);margin-left:.12rem}
.apps-rail-more{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);white-space:nowrap;flex:none}
.apps-rail-more:hover{color:var(--blue)}
@media(prefers-reduced-motion:reduce){.apps-marquee-track{animation:none}}
.feat-card:hover{background:var(--n200)}
.feat-card h3{font-size:var(--h4);font-weight:500;margin-bottom:.75rem}
.feat-card ul{list-style:none;padding:0}
.feat-card li{color:var(--n600);font-size:var(--text-main);line-height:139%;padding:.25rem 0 .25rem 1.25rem;position:relative}
.feat-card li::before{content:'';position:absolute;left:0;top:.55rem;width:6px;height:6px;border-radius:50%;background:var(--lavender)}

/* Infra metric cards */

/* Hero parallax bg */
.hero-content{position:relative;z-index:1}
.hero-bg{
  position:absolute;top:-60%;left:-30%;right:-30%;bottom:-20%;
  background:radial-gradient(ellipse at 40% 0%,rgba(74,99,199,.35) 0%,rgba(107,130,219,.15) 30%,transparent 60%),
             radial-gradient(ellipse at 70% 10%,rgba(143,160,232,.2) 0%,transparent 45%),
             radial-gradient(ellipse at 20% 30%,rgba(86,116,225,.08) 0%,transparent 50%);
  will-change:transform;z-index:0;pointer-events:none;
}

/* Footer CTA */
.footer-cta{
  background-color:var(--lavender);
  background-image:url('https://cdn.prod.website-files.com/6947f766208b9120532d664c/694a3af03c60483ad368fb36_footer-pattern.svg');
  background-size:cover;background-position:center;
  padding:5rem 1.5rem 4.25rem;text-align:center;
  border-radius:var(--radius);
  border-left:1px solid rgba(255,255,255,.3);border-right:1px solid rgba(255,255,255,.3);
  width:84vw;max-width:100rem;margin-left:auto;margin-right:auto;
}
.footer-cta h2{
  font-family:var(--font);font-size:var(--h2);font-weight:400;
  line-height:1.15;margin-bottom:2rem;color:var(--n900);
}
.footer-cta-desc{font-size:var(--text-lg);color:var(--n900);max-width:28em;margin:0 auto 2rem;line-height:139%}
.footer-cta-url{font-family:var(--mono);background:rgba(0,0,0,.06);padding:.2em .4em;border-radius:var(--radius)}

/* Signet section */
.signet-section{
  display:flex;align-items:center;justify-content:center;
  text-align:center;padding:2.75rem 0;min-height:6rem;
  background:var(--n50);
  border-left:1px solid var(--border);border-right:1px solid var(--border);
  width:84vw;max-width:100rem;margin:0 auto;
}

/* Footer bottom */
.sec-footer-bottom{
  background:var(--n100);
  border-top:1px solid var(--border);
  border-left:1px solid var(--border);border-right:1px solid var(--border);
  width:84vw;max-width:100rem;margin:0 auto;
  padding:3rem 2rem;text-transform:uppercase;
  font-family:var(--mono);font-size:.875rem;
}
.footer-row{
  display:flex;justify-content:space-between;align-items:flex-end;
  width:100%;margin-bottom:15px;flex-wrap:wrap;row-gap:.6rem;
}
.footer-links{display:flex;flex-direction:column;align-items:flex-end;gap:.7rem;color:var(--n900)}
.fl-line{display:flex;gap:2rem;flex-wrap:wrap;justify-content:flex-end}
.sec-footer-bottom a{font-family:var(--mono);font-size:.875rem;color:var(--n900);line-height:1rem;text-decoration:underline}
.sec-footer-bottom a:hover{color:#18171fbf}
.footer-copy{font-family:var(--mono);font-size:.875rem;color:var(--n900)}

/* Mobile hamburger — generous 48px tap target with a tactile press state */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:0;
  width:3rem;height:3rem;min-width:3rem;min-height:3rem;
  flex-direction:column;align-items:center;justify-content:center;
  border-radius:var(--radius);-webkit-tap-highlight-color:transparent;transition:background .2s ease}
.nav-toggle:active{background:rgba(24,23,31,.06)}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--n900);border-radius:2px;margin:4px 0;transition:transform .32s var(--ease),opacity .2s ease}
.nav-toggle.open span:nth-child(1){transform:translateY(10px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}

/* Mobile overlay — grouped "index" panel with a pinned account footer */
.nav-mobile{
  display:none;position:fixed;inset:0;z-index:99;
  background:var(--n100);   /* opaque — the panel is a clean solid surface, no bleed-through */
  flex-direction:column;align-items:stretch;
  opacity:0;transition:opacity .28s var(--ease);
}
.nav-mobile.open{display:flex;opacity:1}
.nav-mob-scroll{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6.25rem 1.5rem 1.25rem}
.nav-mob-group{margin-bottom:1.6rem}
.nav-mob-group:last-child{margin-bottom:.25rem}
.nav-mob-eyebrow{display:flex;align-items:center;gap:.8rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--n600);margin-bottom:.4rem;padding-left:.75rem}
.nav-mob-eyebrow::after{content:"";flex:1;height:1px;background:var(--n300)}
.nav-mobile a{position:relative;display:flex;align-items:center;font-family:var(--mono);font-size:1.08rem;text-transform:uppercase;letter-spacing:.01em;color:var(--n900);text-decoration:none;min-height:2.9rem;padding:.5rem .75rem;border-radius:var(--radius);transition:color .18s ease,background .18s ease}
.nav-mobile a::before{content:"";position:absolute;left:0;top:50%;width:3px;height:56%;background:var(--blue);border-radius:2px;transform:translateY(-50%) scaleY(0);transform-origin:center;transition:transform .24s var(--ease)}
.nav-mobile a:hover{color:var(--blue)}
.nav-mobile a:active{background:rgba(86,116,225,.08)}
.nav-mobile a.active{color:var(--blue)}
.nav-mobile a.active::before{transform:translateY(-50%) scaleY(1)}
/* pinned account footer — always reachable without scrolling the list */
.nav-mob-foot{flex:0 0 auto;padding:1rem 1.5rem calc(1.4rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--n200)}
.nav-mobile .nav-mob-acct{display:flex;align-items:center;justify-content:center;min-height:3.25rem;padding:1rem;background:var(--n900);color:var(--n50);border-radius:var(--radius);font-family:var(--mono);font-size:1rem;text-transform:uppercase;letter-spacing:.03em;transition:background .2s ease}
.nav-mobile .nav-mob-acct::before{display:none}
.nav-mobile .nav-mob-acct:hover{color:var(--n50)}
.nav-mobile .nav-mob-acct:active{background:#000}
.nav-mob-status{display:flex;align-items:center;justify-content:center;gap:.55rem;margin-top:.9rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--n600)}
.nml-dot{width:7px;height:7px;border-radius:50%;background:var(--pos);box-shadow:0 0 0 0 rgba(46,125,79,.45);animation:mobDot 2.2s var(--ease) infinite}
@keyframes mobDot{0%{box-shadow:0 0 0 0 rgba(46,125,79,.45)}70%{box-shadow:0 0 0 7px rgba(46,125,79,0)}100%{box-shadow:0 0 0 0 rgba(46,125,79,0)}}
/* staggered entrance — cascade the groups, then the footer */
.nav-mobile.open .nav-mob-group{animation:mobIn .5s var(--ease) both}
.nav-mobile.open .nav-mob-group:nth-child(2){animation-delay:.07s}
.nav-mobile.open .nav-mob-group:nth-child(3){animation-delay:.14s}
.nav-mobile.open .nav-mob-foot{animation:mobIn .5s var(--ease) both;animation-delay:.2s}
@keyframes mobIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* Responsive — tablet */
@media(max-width:991px){
  .pg{margin:0 1rem}
  .ctr{width:auto}
  .nav-inner{width:auto;padding:0 1.25rem}
  .nav-toggle{display:flex}
  .nav-links{display:none}
  .nav-logo{transform:none}
  .hero{padding:3rem 0}
  .hero h1{font-size:clamp(2rem,5vw + 1rem,3rem)}
  .hero-body{font-size:var(--text-main)}
  .stats,  .feat-grid{grid-template-columns:1fr}
  .sec{padding:1.6rem 0}
  .sec-pad,.feat-bento{padding:0 1rem}
  .sec-title{font-size:clamp(1.5rem,3vw + .5rem,2rem)}
  .footer-cta h2{font-size:1.75rem}
  .footer-cta{padding:5rem 1.5rem 3rem;width:auto}
  .signet-section{width:auto}
  .signet-mark{height:1.5rem}
  .sec-footer-bottom{width:auto}
  .cta-primary{font-size:var(--text-main);padding:.625rem 1.5rem}
}
/* Responsive — mobile */
@media(max-width:479px){
  .pg{margin:0}
  .ctr{width:100%;border:none}
  .nav{height:4.75rem;margin:0}
  .nav-inner{padding:0 1rem;align-items:center}
  .subnav{top:calc(4.75rem - 1px)}
  .nav-logo{height:1.5rem}
  .hero{padding:2rem 0}
  .hero h1{font-size:1.85rem;max-width:100%;padding:0 .5rem 1rem}
  .hero-body{max-width:100%;padding:0 .5rem;font-size:var(--text-main)}
  .hero-cta{padding:0 .5rem}
  .cta-primary{width:100%;text-align:center}
  .tag{padding:.4rem .6rem;font-size:clamp(.6rem,.55rem + .1vw,.68rem)}
  .stats{grid-template-columns:1fr 1fr;gap:.5rem;padding:0 .5rem}
  .stat-card{padding:1.25rem .75rem}
  .stat-v{font-size:clamp(1.1rem,.9rem + .4vw,1.49rem)}
      .sec-title{font-size:clamp(1.35rem,1rem + .7vw,1.75rem)}
  .sec-desc{font-size:var(--text-main)}
  .footer-cta h2{font-size:1.3rem;line-height:140%}
  .footer-cta{padding:4rem 1rem 2.5rem;width:100%;border:none}
  .footer-cta p{font-size:var(--text-main)}
  .signet-section{width:100%;border:none}
  .sec-footer-bottom{width:100%;border-left:none;border-right:none;border-bottom:none;padding:2rem 1rem}
  .footer-row{flex-flow:column;align-items:flex-start;gap:1rem}
  .footer-links{flex-flow:column;gap:1rem;align-items:flex-start}
  .fl-line{justify-content:flex-start}
  .footer-copy{text-align:left}
  .divider{display:none}
  .feat-card{padding:1.5rem}
  .btn{font-size:clamp(.6rem,.55rem + .1vw,.68rem);padding:.75rem 1.25rem}
}

:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:var(--radius)}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;width:1px;height:1px;overflow:hidden;padding:1rem;background:var(--n900);color:#fff;z-index:1000;font-family:var(--mono);font-size:var(--text-sm);border-radius:var(--radius)}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;overflow:visible}

/* ==================================================================
   Explorer data layer — institutional-grade polish on the Blueprint
   template: layered rows, semantic amounts, motion, skeletons.
   ================================================================== */
:root{
  --pos:#2e7d4f;--neg:#b3423a;
  --ease:cubic-bezier(.16,1,.3,1);
  --shadow-1:0 1px 2px rgba(24,23,31,.04),0 2px 8px rgba(24,23,31,.04);
  --shadow-2:0 2px 6px rgba(24,23,31,.05),0 10px 28px rgba(24,23,31,.07);
}

/* page transition */
.page-in{animation:pageIn .45s var(--ease) both}
@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.loading{font-family:var(--mono);font-size:var(--text-sm);color:var(--n600);text-transform:uppercase;letter-spacing:1px;padding:4rem 2rem;text-align:center}
.err{font-family:var(--mono);font-size:var(--text-sm);color:var(--neg);padding:1.5rem 2rem}
.note{font-family:var(--mono);font-size:var(--text-sm);color:var(--n600);margin:.75rem 0;letter-spacing:.5px;text-transform:uppercase}

/* skeleton shimmer */
.skel{position:relative;overflow:hidden;background:var(--n200);border-radius:var(--radius)}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:shimmer 1.4s infinite}
@keyframes shimmer{100%{transform:translateX(100%)}}
.skel-row{display:flex;gap:1rem;align-items:center;padding:.95rem 1.25rem;border-bottom:1px solid var(--n100)}
.skel-row:last-child{border-bottom:none}

/* ------------------------------------------------------------ search */
.search_wrap{position:relative;max-width:52rem;margin:0 0 .5rem}
.search{
  width:100%;height:3.1rem;padding:0 1.25rem 0 2.9rem;
  font-family:var(--mono);font-size:var(--text-main);color:var(--n900);
  background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);outline:none;
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
  box-shadow:var(--shadow-1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%2356555c' stroke-width='2.2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:1.1rem center;
}
.search::placeholder{color:var(--n600);transition:color .28s ease,opacity .28s ease}
.search:focus::placeholder{color:transparent;opacity:0}
.search:focus{border-color:var(--n900);box-shadow:0 0 0 3px var(--lavender-lt)}
/* aurora morph for an open party name — brand hues only */
.aurora{background:linear-gradient(100deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:auroraMorph 8s ease-in-out infinite}
/* page-heading variant: the animated sheen with every stop dark enough to read
   as a primary heading (the wordmark palette washes out at h1 sizes) */
.aurora-deep{background-image:linear-gradient(100deg,#3a54ba,#4a63c7,#5674e1,#2c7d9c,#3a54ba)}
@keyframes auroraMorph{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media(prefers-reduced-motion:reduce){.aurora{animation:none}}
/* product brand lockup — dark "cc" keylined in the product accent (#cdd9ff) + aurora
   "scan". No box, no glow: larger, institutional. */
.cc-lockup{display:inline-flex;align-items:baseline;gap:.03em;margin:.2rem 0 1.3rem}
.cc-cc{color:#18171f;-webkit-text-stroke:5px #cdd9ff;paint-order:stroke fill;
  font-family:var(--font);font-weight:700;font-size:clamp(3.3rem,7vw,4.9rem);letter-spacing:-.02em;line-height:1}
/* line-height:1 clips glyph descenders on the aurora (background-clip:text) suffix — e.g. the "g" in
   "ledger". padding-bottom extends the clip box so the descender renders; the equal negative margin keeps
   the lockup's height + baseline identical. Harmless for descender-free names ("scan"). */
.cc-scan{font-family:var(--font);font-weight:700;font-size:clamp(3.3rem,7vw,4.9rem);letter-spacing:-.045em;line-height:1;padding-bottom:.16em;margin-bottom:-.16em}
.hero .cc-h1{margin-top:0;font-size:clamp(1.55rem,1.1rem + 1.35vw,2.05rem);font-weight:500;max-width:none;padding-bottom:1.3rem;letter-spacing:-.01em;color:var(--n900)}
.search_results{
  position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:80;
  background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow-2);overflow:hidden;max-height:26rem;overflow-y:auto;
  animation:pageIn .25s var(--ease) both;
}
.search_results a{
  display:flex;gap:.75rem;align-items:center;padding:.75rem 1rem;
  font-family:var(--mono);font-size:var(--text-sm);border-bottom:1px solid var(--n100);
  transition:background .15s;
}
.search_results a:hover,.search_results a.sel{background:var(--n100)}
.search_results .kind{
  font-size:.6rem;text-transform:uppercase;letter-spacing:1px;
  background:var(--n900);color:var(--n50);border-radius:var(--radius);padding:.3rem .5rem;flex-shrink:0;
}
.search_results .kind.party{background:var(--blue)}
.search_results .kind.round{background:var(--teal);color:var(--n900)}
.search_results .lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search_results mark{background:var(--lavender-lt);color:inherit;border-radius:2px;padding:0 1px}

/* ------------------------------------------------------------ tables
   table-layout:fixed + per-column widths + ellipsis everywhere:
   tables always fill 100% of the content column and can never
   overflow it — no horizontal scrolling, ever. */
.tbl_wrap{overflow:hidden;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1)}
table{width:100%;border-collapse:collapse;font-size:var(--text-main);table-layout:fixed}
th{
  font-family:var(--mono);font-weight:400;font-size:.62rem;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--n600);text-align:left;
  padding:.7rem 1.1rem;border-bottom:1px solid var(--border);white-space:nowrap;
  background:var(--n50);overflow:hidden;text-overflow:ellipsis;
}
th.r,td.r{text-align:right}
td{
  padding:.85rem 1.1rem;border-bottom:1px solid var(--n100);vertical-align:middle;
  white-space:nowrap;line-height:1.45;overflow:hidden;text-overflow:ellipsis;
}
tr:last-child td{border-bottom:none}
tbody tr{transition:background .18s var(--ease)}
tbody tr:hover{background:var(--n100)}
tbody tr.rowlink{cursor:pointer}
td.num,.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.hash{font-family:var(--mono);font-size:var(--text-sm);color:var(--blue)}
a.hash:hover{text-decoration:underline}
.dim{color:var(--n600)}

/* tx-table column plan (fixed layout: widths set on header cells;
   the transaction column absorbs all remaining width) */
th.c-seq{width:7.2rem}
th.c-type{width:8.6rem}
th.c-roles{width:9.5rem}
th.c-amt{width:9.5rem}
th.c-round{width:6.8rem}
th.c-time{width:8.5rem}
@media(max-width:1100px){th.c-roles{width:8rem}th.c-time{width:7.5rem}}
@media(max-width:1200px){th.c-roles,td.c-roles{display:none}}
@media(max-width:900px){
  th.c-round,td.c-round{display:none}
}
@media(max-width:640px){
  th.c-type,td.c-type{display:none}
  th.c-amt,td.c-amt{display:none}   /* amount is in the description line */
  th.c-seq{width:5.6rem}
  th.c-time{width:5.4rem}
  .cell-time .exact{display:none}
  .filters{gap:.4rem}
  .filters select,.filters input{max-width:100%;flex:1 1 7rem;min-width:0}
  .toggle{flex:0 0 auto}
}
/* wide numeric tables (daily stats): hide secondary columns as space shrinks */
@media(max-width:1100px){th.c-sm,td.c-sm{display:none}}
@media(max-width:760px){th.c-md,td.c-md{display:none}}

/* staggered row reveal */
tbody tr.rv{animation:rowIn .4s var(--ease) both;animation-delay:calc(var(--i,0)*22ms)}
@keyframes rowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
tbody tr.row-new{animation:rowNew 3s ease both}
tbody tr.row-new td:first-child{animation:rowEdge 3s ease both}
@keyframes rowNew{0%{background:var(--lavender-lt)}17%{background:transparent}34%{background:var(--lavender-lt)}51%{background:transparent}68%{background:var(--lavender-lt)}100%{background:transparent}}
@keyframes rowEdge{0%,68%{box-shadow:inset 3px 0 0 var(--blue)}100%{box-shadow:inset 3px 0 0 transparent}}
/* live feed: only the newest row keeps pulsing; it drops in; the oldest fades out */
tbody tr.row-live{animation:rowDrop .5s cubic-bezier(.16,1,.3,1),livePulse 2.6s ease-in-out .5s infinite}
tbody tr.row-live td:first-child{position:relative}
tbody tr.row-live td:first-child::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1);background-size:100% 300%;
  animation:auroraMorphY 8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){tbody tr.row-live td:first-child::before{animation:none}}
@keyframes livePulse{0%,100%{background:transparent}50%{background:color-mix(in srgb,var(--lavender-lt) 48%,transparent)}}
@keyframes rowDrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
tbody tr.row-out{animation:rowFade .42s ease forwards;pointer-events:none}
@keyframes rowFade{to{opacity:0;transform:translateY(6px)}}
@media(prefers-reduced-motion:reduce){tbody tr.row-live,.cn-flash{animation:none}}
/* live feeds are scroll-isolated. The browser's scroll anchoring must never
   track a row the drip is about to displace — without this, reading BELOW the
   feed jolts on every insert (the anchor node moves inside the card and the
   browser "compensates" the page scroll). contain makes the pinned card's
   internal churn invisible to layout outside it. */
#latest,#latest *,#ptxs,#ptxs *{overflow-anchor:none}
#latest .tbl_wrap{contain:layout paint}

/* layered tx cells — the flex column; truncates, never overflows */
.cell-flow{max-width:0;width:100%}
/* min-height: rows with a .pplus/.selfarrow badge must not be taller than plain
   ones — the live feed swaps rows in place and any height delta reflows the page */
.flow-line{display:flex;align-items:center;gap:.45rem;overflow:hidden;white-space:nowrap;min-height:1.35rem}
/* ellipsis applies to the flex children (anchors), not the flex container */
.flow-line a.hash{min-width:0;overflow:hidden;text-overflow:ellipsis;flex-shrink:1}
.flow-line .arrow{color:var(--n300);flex-shrink:0}
.flow-desc{font-size:.72rem;color:var(--n600);margin-top:.22rem;letter-spacing:.1px;display:flex;align-items:baseline;gap:.35rem;min-width:0}
.fd-main{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.pplus{font-family:var(--mono);font-size:.65rem;color:var(--n600);background:var(--n100);border:1px solid var(--n200);border-radius:var(--radius);padding:.1rem .45rem;flex-shrink:0}

/* identicons */
.idn{display:inline-block;width:16px;height:16px;border-radius:5px;flex-shrink:0;vertical-align:-3px;box-shadow:inset 0 0 0 1px rgba(24,23,31,.08)}
.idn-lg{width:44px;height:44px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(24,23,31,.1),var(--shadow-1)}

/* amounts */
.cell-amt{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums;text-align:right}
.cell-amt .unit{font-size:.62rem;color:var(--n600);margin-left:.25rem;letter-spacing:.5px}
.amt-pos{color:var(--pos)}
.amt-neg{color:var(--neg)}
.amount{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums}

/* time cells */
.cell-time{text-align:right}
.cell-time .rel{color:var(--n900)}
.cell-time .exact{font-family:var(--mono);font-size:.62rem;color:var(--n600);margin-top:.2rem;letter-spacing:.3px}

/* chips */
.badge{
  display:inline-flex;align-items:center;gap:.35rem;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.6px;text-transform:uppercase;
  background:var(--beige);border-radius:var(--radius);padding:.32rem .6rem;line-height:1;
  border:1px solid rgba(24,23,31,.06);
}
.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--n600)}
.badge.transfer{background:var(--lavender-lt)}
.badge.transfer::before{background:var(--blue)}
.badge.mint{background:#ddf1d8}
.badge.mint::before{background:var(--pos)}
.badge.tap{background:#fdeacc}
.badge.tap::before{background:#c98a2b}
.badge.abort_transfer_instruction{background:#f6d6d2}
.badge.abort_transfer_instruction::before{background:var(--neg)}
.badge.sender{background:var(--n200);color:var(--n900)}
.badge.sender::before{background:var(--n900)}
.badge.receiver{background:var(--lavender-lt);color:var(--blue-d)}
.badge.receiver::before{background:var(--blue-d)}
.badge.balance_change{background:var(--n200)}
.badge.locked{background:var(--n200)}
.badge.unlocked{background:#ddf1d8}
.badge.unlocked::before{background:var(--pos)}

/* filters + pager */
.filters{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0 0 1.25rem}
.filters select,.filters input{
  font-family:var(--mono);font-size:var(--text-sm);height:2.6rem;padding:0 .9rem;
  border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);
  outline:none;color:var(--n900);text-transform:uppercase;box-shadow:var(--shadow-1);
  transition:border-color .2s,box-shadow .2s;
}
.filters select:focus,.filters input:focus{border-color:var(--n900);box-shadow:0 0 0 3px var(--lavender-lt)}
.toggle{
  font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;
  height:2.6rem;padding:0 1.1rem;border:none;border-radius:var(--radius);
  background:var(--n200);color:var(--n900);cursor:pointer;
  transition:background .2s,transform .12s var(--ease);
}
.toggle:hover{background:var(--n300)}
.toggle:active{transform:scale(.97)}
.toggle.on{background:var(--n900);color:var(--n50)}
.pager{display:flex;gap:.75rem;align-items:center;margin-top:1.25rem;flex-wrap:wrap}
.pager .mono{color:var(--n600);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.5px}
.btn:active,.cta-primary:active{transform:scale(.98)}

/* key/value + cards */
.kv{display:grid;grid-template-columns:230px 1fr}
.kv>div{padding:.7rem 0;border-bottom:1px solid var(--n100);overflow-wrap:anywhere;font-size:var(--text-main);line-height:1.5}
.kv>div:nth-child(odd){font-family:var(--mono);font-size:.66rem;color:var(--n600);letter-spacing:1px;text-transform:uppercase;padding-top:.85rem}
.card{background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;margin-bottom:1rem;box-shadow:var(--shadow-1);transition:box-shadow .25s var(--ease)}
.card:hover{box-shadow:var(--shadow-2)}
.card_title{font-family:var(--mono);font-size:.66rem;color:var(--n600);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:1rem}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:860px){.grid2{grid-template-columns:1fr}.kv{grid-template-columns:1fr}.kv>div:nth-child(odd){border-bottom:none;padding-bottom:0}}

/* flow diagram on tx detail */
.flowviz{display:flex;align-items:stretch;gap:0;margin:.25rem 0 1rem;flex-wrap:wrap}
.flowviz .node{
  flex:1;min-width:14rem;background:var(--n50);border:1px solid var(--border);
  border-radius:var(--radius);padding:1.1rem 1.25rem;box-shadow:var(--shadow-1);
}
.flowviz .node .nlbl{font-family:var(--mono);font-size:.62rem;color:var(--n600);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:.5rem}
.flowviz .node .nparty{display:flex;align-items:center;gap:.5rem;overflow:hidden}
.flowviz .node .namt{font-family:var(--mono);font-size:1.05rem;font-weight:500;margin-top:.45rem;font-variant-numeric:tabular-nums}
.flowviz .mid{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:0 1.4rem;font-family:var(--mono);font-size:.66rem;color:var(--n600);
  letter-spacing:.5px;text-transform:uppercase;
}
.flowviz .mid .fline{width:4.5rem;height:1px;background:var(--n300);position:relative;margin:.45rem 0}
.flowviz .mid .fline::after{content:"";position:absolute;right:-1px;top:-2.5px;width:6px;height:6px;border-top:1px solid var(--n300);border-right:1px solid var(--n300);transform:rotate(45deg)}
@media(max-width:860px){.flowviz{flex-direction:column}.flowviz .mid{padding:.6rem 0}.flowviz .mid .fline{transform:rotate(90deg)}}

/* json viewer */
.json_wrap{position:relative;margin-bottom:1rem}
.json_bar{position:absolute;top:.65rem;right:.75rem;display:flex;gap:.4rem;z-index:2}
.json_bar .jbtn{
  font-family:var(--mono);font-size:.6rem;letter-spacing:.8px;text-transform:uppercase;
  background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);
  color:var(--n600);padding:.35rem .6rem;cursor:pointer;transition:all .2s;
}
.json_bar .jbtn:hover{color:var(--n900);border-color:var(--n900)}
pre.json{
  font-family:var(--mono);font-size:.72rem;line-height:1.75;
  background:var(--n100);border:1px solid var(--border);color:var(--n900);
  border-radius:var(--radius);padding:1.4rem;overflow-x:auto;
  max-height:34rem;overflow-y:auto;transition:max-height .4s var(--ease);
}
pre.json.collapsed{max-height:9rem;overflow-y:hidden;
  -webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
pre.json .k{color:var(--blue)}
pre.json .s{color:var(--pos)}
pre.json .n{color:#4b9cb9}
.copy{cursor:pointer;color:var(--n600);margin-left:.4rem;display:inline-flex;align-items:center;vertical-align:middle;transition:color .2s}
.copy svg{display:block}
.copy:hover{color:var(--blue)}
.copy.ok{color:var(--pos)}

/* charts */
.chart_wrap{background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-1);margin-bottom:1.5rem}
canvas.chart{width:100%;height:250px;display:block;cursor:crosshair}
.legend{display:flex;gap:1.25rem;margin-top:.85rem;font-family:var(--mono);font-size:.64rem;color:var(--n600);flex-wrap:wrap;text-transform:uppercase;letter-spacing:.8px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:.4rem;vertical-align:-1px}
.chart_tip{
  position:fixed;z-index:200;pointer-events:none;background:var(--n900);color:var(--n50);
  font-family:var(--mono);font-size:.66rem;letter-spacing:.4px;line-height:1.7;
  border-radius:var(--radius);padding:.55rem .75rem;box-shadow:var(--shadow-2);
  opacity:0;transition:opacity .15s;white-space:nowrap;
}
.chart_tip b{color:var(--lavender-lt);font-weight:400}

/* stat cards: count-up + accent line */
.stat-card{position:relative;overflow:hidden}
.stat-card::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--lavender-lt));opacity:0;transition:opacity .3s}
.stat-card:hover::after{opacity:1}
.live_dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4caf6d;margin-right:.45rem;animation:pulse 2s infinite}
/* live network-pulse section */
.live-badge{display:inline-flex;align-items:center;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:#3f9e6d;vertical-align:middle;margin-left:.6rem;font-weight:500}
.live-badge .live_dot{margin-right:.35rem;width:7px;height:7px}
.pulse-chart{position:relative;width:100%;flex:1;display:flex;flex-direction:column}
/* the canvas is OUT OF FLOW inside a positioned wrapper: draw() sets its
   pixel size from its rendered size, so in-flow it would feed its own height
   back into layout and ratchet the card taller on every frame */
.pl-cvw{position:relative;flex:1;min-height:120px;min-width:0;display:flex;gap:.6rem}
.pl-cvi{position:relative;flex:1;min-width:0}
.pl-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
/* VU rail — live intensity meter: fill rises with 10s tx/s on the chart's
   √ scale, eased across the ~2s sample cadence so it breathes */
.pl-vu{width:12px;flex:none;position:relative;overflow:hidden;border-radius:3px;background:var(--n100);margin:3px 0}
.pl-vu span{position:absolute;left:0;right:0;bottom:0;height:0%;border-radius:2px;background:linear-gradient(180deg,#59b3d4,#5674e1 55%,#3a54ba)}
@media(prefers-reduced-motion:reduce){.pl-vu span{transition:none}}
.pl-idle{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.8rem;pointer-events:none}
.pl-ma{display:inline-block;width:.9rem;height:2px;background:#3a54ba;border-radius:2px;vertical-align:middle;margin-right:.15rem}
.pl-axis{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.54rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);margin-top:.3rem}
/* governance */
.gov-cats{display:flex;flex-wrap:wrap;gap:.5rem;margin:-.5rem 0 1.6rem}
.gov-cat-chip{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--mono);font-size:.62rem;padding:.3rem .6rem;border:1px solid var(--border);border-radius:var(--radius);color:var(--n600);background:var(--n50)}
.gov-cat-chip b{color:var(--n900)}
.gov-dot{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;flex:none}
.gov-badge{font-family:var(--mono);font-size:.54rem;text-transform:uppercase;letter-spacing:.05em;padding:.12rem .4rem;border-radius:var(--radius);font-weight:500;white-space:nowrap}
.gov-open{background:#e8eefc;color:var(--blue-d)}
.gov-accepted{background:#e2f0e9;color:var(--pos)}
.gov-rejected{background:#f7e4e3;color:var(--neg)}
.gov-expired{background:var(--n100);color:var(--n600)}
.gov-target{color:var(--n600);font-weight:400}
.gv-a{color:var(--pos);font-weight:600}
.gv-r{color:var(--neg);font-weight:600}
/* votes-so-far tally bar */
.gov-vbar{display:inline-flex;vertical-align:middle;width:3rem;height:.5rem;border-radius:99px;overflow:hidden;background:var(--n200);margin-right:.5rem}
.gov-vbar-empty{opacity:.55}
.gvb-a{background:var(--pos)}.gvb-r{background:var(--neg)}
.gov-vnum{font-size:.72rem;font-variant-numeric:tabular-nums}
/* ── governance flow: Open → Decided → outcome proportion ── */
.gov-flow{display:flex;align-items:stretch;gap:1.2rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);padding:1.3rem 1.6rem;margin-bottom:1.6rem}
.gvf-node{display:flex;flex-direction:column;justify-content:center;flex:none;min-width:5rem}
.gvf-n{font-size:2rem;font-weight:600;line-height:1;letter-spacing:-.02em;color:var(--n900);font-variant-numeric:tabular-nums}
.gvf-open .gvf-n{color:var(--blue)}
.gvf-k{font-weight:600;font-size:.82rem;color:var(--n900);margin-top:.35rem}
.gvf-s{font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);margin-top:.2rem}
.gvf-arrow{display:flex;align-items:center;color:var(--n300);flex:none}
.gvf-outcomes{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.7rem;min-width:0}
.gvf-bar{display:flex;height:.7rem;border-radius:99px;overflow:hidden;background:var(--n200)}
.gvf-seg{display:block;min-width:2px}
.gvf-seg.gvf-acc,.gvf-d.gvf-acc{background:var(--pos)}
.gvf-seg.gvf-rej,.gvf-d.gvf-rej{background:var(--neg)}
.gvf-seg.gvf-exp,.gvf-d.gvf-exp{background:var(--n300)}
.gvf-seg.gvf-empty{background:var(--n200)}
.gvf-legend{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem}
.gvf-li{display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--n600)}
.gvf-li b{color:var(--n900);font-weight:600;font-variant-numeric:tabular-nums}
.gvf-li em{font-family:var(--mono);font-size:.62rem;font-style:normal;color:var(--n600)}
.gvf-d{width:.55rem;height:.55rem;border-radius:2px;flex:none}
@media(max-width:640px){.gov-flow{flex-wrap:wrap;gap:.9rem 1.2rem}.gvf-arrow{transform:rotate(90deg)}.gvf-outcomes{flex-basis:100%}}
/* ── governance section headers ── */
.gov-sec-title{font-size:var(--h4);margin:0;font-weight:600}
.gov-sec-sub{font-size:.72rem;font-weight:400;color:var(--n600)}
.dash-sec-h .gov-sec-count{font-family:var(--mono);font-size:.68rem;color:var(--n600);background:var(--n100);border:1px solid var(--border);border-radius:99px;padding:.1rem .55rem}
/* ── governance table ── */
.gov-table td{vertical-align:middle}
/* table-layout:fixed sizes columns from the header row — widths live on the th.
   Stays fixed while other .feat-tables are auto-layout: the title/reason
   ellipsis chain needs constrained columns here. */
.feat-table.gov-table{table-layout:fixed}
.gov-table th.gov-c-prop{width:46%}
.gov-table th.gov-c-req{width:17%}
.gov-prop{display:flex;align-items:flex-start;gap:.55rem;min-width:0}
.gov-prop .gov-dot{margin-top:.34rem}
.gov-prop-body{min-width:0;flex:1}
/* the global td rule inherits nowrap into this block div — without its own
   ellipsis the title hard-clips at the cell edge mid-word */
.gov-prop-title{font-weight:600;font-size:.88rem;color:var(--n900);line-height:1.3;overflow:hidden;text-overflow:ellipsis}
.gov-prop-sub{display:flex;align-items:baseline;gap:.5rem;margin-top:.15rem;min-width:0}
.gov-cat-tag{font-family:var(--mono);font-size:.55rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);white-space:nowrap;flex:none}
.gov-prop-reason{flex:1 1 auto;min-width:0;font-size:.72rem;color:var(--n600);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gov-c-req{max-width:11rem}
.gov-c-req .mono{font-size:.7rem;color:var(--n600);word-break:break-all}
.gov-c-votes{white-space:nowrap}
.gov-c-when{white-space:nowrap;font-size:.72rem;color:var(--n600)}
/* long lists scroll inside one viewport-tall box; the header sticks. Sticky
   headers break under border-collapse:collapse (the border scrolls away with
   the row edge), so the scroll variant switches to separate borders. */
.gov-scroll{max-height:72vh;overflow-y:auto;overscroll-behavior:contain}
.gov-scroll table{border-collapse:separate;border-spacing:0}
.gov-scroll thead th{position:sticky;top:0;z-index:2}
.void{min-height:52vh;display:flex;flex-direction:column;align-items:center;justify-content:center}
/* ==================================================================
   Landing console — the fold's signature: the same instrument grid, but
   each readout/chart is its OWN card with a small gutter between them.
   ================================================================== */
.console-band{padding:0 0 1.9rem}
.console{display:flex;flex-direction:column;gap:.45rem}
.cn-cell,.cn-pulse,.cn-cell14,.cn-m,.cn-chart,.cn-foot{background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius) * 2);box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.cn-cell::before,.cn-pulse::before,.cn-cell14::before,.cn-chart::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(24,23,31,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(24,23,31,.03) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 95% 90% at 50% 0%,#000,transparent 92%);
  mask-image:radial-gradient(ellipse 95% 90% at 50% 0%,#000,transparent 92%)}
.cn-cell>*,.cn-pulse>*,.cn-cell14>*,.cn-chart>*{position:relative;z-index:1}
.cn-l{font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.08em;color:var(--n600);display:flex;align-items:center;gap:.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-l .live_dot{margin-right:0;width:7px;height:7px}
.cn-l-s{color:var(--n600);opacity:.75;text-transform:none;letter-spacing:.02em}
/* readout cards size to their own content: flex-basis auto starts each card
   at its natural width, leftover space distributes evenly across the row */
.cn-top{display:flex;gap:.55rem}
.cn-cell{padding:.85rem 1.15rem;min-width:0;flex:1 1 auto}
.cn-v{font-family:var(--mono);font-weight:400;font-size:1.18rem;color:var(--n900);margin-top:.35rem;font-variant-numeric:tabular-nums;line-height:1.1;display:flex;align-items:center;gap:.4rem;white-space:nowrap;overflow:hidden}
.cn-v .chg{font-size:.66rem;font-weight:500}
.cn-v .chg.pos{color:var(--pos)}.cn-v .chg.neg{color:var(--neg)}
.cn-v .live_dot{width:7px;height:7px}
/* copy actions are bare glyphs — no chrome, faint at rest so the numeral
   leads, full-strength on hover/focus (and always tappable on touch) */
.cn-copy{flex:none;border:none;background:none;padding:0 0 0 .1rem;opacity:.38;transition:opacity .15s,color .15s;color:var(--n600);cursor:pointer;box-shadow:none}
.cn-copy svg{width:13px;height:13px}
.cn-cell:hover .cn-copy,.apps-stat:hover .cn-copy,.cn-copy:hover,.cn-copy:focus-visible,.cn-copy.ok{opacity:1}
.apps-stat .cn-copy{margin-left:.65rem}
.cn-copy:hover{color:var(--blue)}
.cn-copy.ok{color:var(--pos);background:none}
.cn-cd{color:var(--blue-d);text-transform:none;letter-spacing:0}
.cn-link{color:var(--n900);text-decoration:none}
.cn-link:hover{color:var(--blue)}
/* party balance card: title left, live valuation right */
.bal-title{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.bal-tr{color:var(--n600);font-size:.72rem;white-space:nowrap}
.bal-tr b{color:var(--blue-d);font-weight:500;font-size:.8rem}
.bal-avail{color:var(--blue-d)}
.cn-main{display:grid;grid-template-columns:19rem minmax(0,1fr);gap:.55rem}
.cn-pulse{padding:.85rem 1.15rem .7rem;min-width:0;display:flex;flex-direction:column}
.cn-pulse-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.45rem}
.cn-ps{font-size:.64rem;color:var(--n600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;min-width:0;flex:1 1 auto}
.cn-ps b{color:var(--blue-d);font-size:1.18rem;font-weight:400;letter-spacing:-.01em}
.cn-ps em{font-style:normal;color:var(--n600);margin-left:.25rem}
.cn-ps #pl-head,.cn-ps #pl-tps60,.cn-ps #pl-last{color:var(--n900)}
.cn-sep{color:var(--n300);margin:0 .45rem}
.console .pulse-chart{flex:1;display:flex;flex-direction:column}
.console .pl-cvw{min-height:150px}
/* a mining-round turnover flashes its readout card — brief, then settles */
.cn-flash{animation:cnFlash 1.1s ease-out}
@keyframes cnFlash{0%{background:#e8eefc}100%{background:var(--n50)}}
.console .pl-idle{color:var(--n600);font-size:.76rem}
.console .pl-axis{color:var(--n600);margin-top:.25rem}
.console .pl-ma{background:#3a54ba}
.cn-side{display:flex;flex-direction:column;gap:.55rem;min-width:0}
.cn-cell14{padding:.8rem 1.15rem .4rem;flex:1;min-width:0;display:flex;flex-direction:column}
.cn-chart .chart{height:112px;margin-top:.5rem}
.cn-14d{flex:1;min-height:90px;margin-top:.35rem}
.cn-charts{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.cn-chart{padding:.9rem 1.15rem .55rem;min-width:0}
.cn-mini{display:grid;grid-template-columns:1fr 1fr;gap:.55rem;min-height:7.6rem}
.cn-m{padding:.5rem 1.15rem .55rem;min-width:0}
.cn-m-v{font-family:var(--mono);font-weight:400;font-size:1.02rem;color:var(--n900);font-variant-numeric:tabular-nums;white-space:nowrap}
.cn-m-v i{font-style:normal;font-size:.62rem;color:var(--n600);margin-left:.2rem}
.cn-m .cn-l{margin-top:.25rem;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}
.cn-foot{display:flex;align-items:center;justify-content:space-between;gap:.45rem 1.4rem;flex-wrap:wrap;overflow:hidden;padding:.65rem 1.15rem;font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600)}
.cn-foot>span{white-space:nowrap;flex:none}
#cn-lastval{margin-left:auto;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
.cn-foot .live_dot{width:7px;height:7px;margin-right:.35rem}
.cn-foot .ec-ok{color:var(--pos)}
@media(max-width:640px){.cn-foot{justify-content:center;gap:.3rem 1rem}#cn-proto{white-space:normal;text-align:center;flex:1 1 100%}}
@media(max-width:1150px){
  .cn-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .cn-main{grid-template-columns:16rem minmax(0,1fr)}
}
@media(max-width:900px){
  .cn-main{grid-template-columns:minmax(0,1fr)}
  .cn-pulse{order:-1}
  .cn-side{flex-direction:row}
  .cn-side>*{flex:1}
  .cn-charts{grid-template-columns:1fr}
}
@media(max-width:640px){
  .cn-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .cn-v{font-size:1.02rem}
  .cn-side{flex-direction:column}
  .cn-ps b{font-size:1rem}
}
/* hero sits tighter above the console */

.hero-compact .cc-h1{padding-bottom:.7rem}

/* light-surface data caption (stats economics charts) */
.dm-cap{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.09em;color:var(--n600);display:flex;align-items:center;gap:.45rem;margin-bottom:.7rem}
/* economics backfill progress */
.econ-progress-wrap{display:flex;align-items:center;gap:.9rem;margin-bottom:1rem}
.econ-progress{flex:1;height:.45rem;border-radius:99px;background:var(--n200);overflow:hidden}
.econ-progress span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--teal));transition:width .6s var(--ease)}
/* ── status page ── */
.st-dot{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;margin-right:.45rem;vertical-align:baseline}
.st-ok{background:#4caf6d;box-shadow:0 0 0 3px #4caf6d22}
.st-bad{background:var(--neg);box-shadow:0 0 0 3px #b3423a22}
.st-banner{display:flex;align-items:center;gap:.5rem;background:var(--n50);border:1px solid var(--border);border-left:3px solid #4caf6d;border-radius:var(--radius);box-shadow:var(--shadow-1);padding:1rem 1.3rem;font-size:.92rem}
.st-banner-bad{border-left-color:var(--neg)}
/* ── command palette (⌘K) ── */
.cmdk{position:fixed;inset:0;z-index:400}
.cmdk-scrim{position:absolute;inset:0;background:rgba(24,23,31,.42);backdrop-filter:blur(2px)}
.cmdk-panel{position:relative;max-width:34rem;margin:14vh auto 0;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);overflow:hidden}
.cmdk-in{width:100%;border:none;border-bottom:1px solid var(--border);background:var(--n50);padding:1rem 1.2rem;font-family:var(--mono);font-size:.86rem;color:var(--n900);outline:none}
.cmdk-list{max-height:19rem;overflow-y:auto;overscroll-behavior:contain}
.cmdk-item{display:flex;align-items:center;gap:.7rem;padding:.6rem 1.2rem;cursor:pointer;font-size:.84rem}
.cmdk-item:hover{background:var(--n100)}
.cmdk-item.sel{background:var(--n100);box-shadow:inset 3px 0 0 var(--blue)}
.cmdk-kind{font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);background:var(--n200);border-radius:var(--radius);padding:.12rem .4rem;flex:none;min-width:3.4rem;text-align:center}
.cmdk-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmdk-empty{padding:1.1rem 1.2rem;font-size:.8rem}
.cmdk-foot{border-top:1px solid var(--border);padding:.45rem 1.2rem;font-size:.6rem;color:var(--n600);letter-spacing:.04em}
@media(max-width:640px){.cmdk-panel{margin:8vh 1rem 0;max-width:none}}
/* search-results kind chips (standalone twin of the dropdown's .kind) */
.skind{display:inline-block;font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.06em;padding:.14rem .45rem;border-radius:var(--radius);background:var(--n200);color:var(--n900)}
.skind-party{background:var(--lavender-lt);color:var(--blue-d)}
.skind-tx{background:var(--n900);color:var(--n50)}
.skind-round{background:var(--beige);color:var(--n900)}
.gov-empty{padding:1.5rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);text-align:center;font-size:.82rem}
@media(max-width:760px){.gov-c-req{display:none}}
/* the generic ≤479 feat-table column-drop hides nth 3 & 5 — on the gov table
   that's Votes (the point of the page); re-show it */
@media(max-width:479px){.gov-table th:nth-child(3),.gov-table td:nth-child(3){display:table-cell}}
/* ── landing teaser card ── */
.gov-card{display:flex;flex-direction:column;gap:.5rem;background:var(--n50);padding:1.1rem 1.2rem;transition:background .15s;min-width:0}
.gov-card:hover{background:var(--n100)}
.gov-card-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.gov-cat{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);min-width:0}
.gov-cat{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gov-title{font-weight:600;font-size:.9rem;color:var(--n900);line-height:1.3}
.gov-reason{font-size:.74rem;color:var(--n600);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gov-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-top:auto;padding-top:.2rem;font-size:.68rem;color:var(--n600)}
.gov-by b{color:var(--n900);font-weight:600}
.gov-tally{display:inline-flex;align-items:center}
.gov-when{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--n600)}
.gov-detail-head{margin-bottom:1.4rem}
.gov-detail-title{font-size:var(--h3);font-weight:600;color:var(--n900);margin-top:.5rem;line-height:1.2}
.gov-rationale{background:var(--n50);border:1px solid var(--border);border-left:3px solid var(--blue);border-radius:var(--radius);padding:1.1rem 1.3rem;margin:1.6rem 0}
.gov-rationale-h{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);margin-bottom:.5rem}
.gov-rationale p{color:var(--n900);font-size:.86rem;line-height:1.55;margin-bottom:.6rem}
/* landing governance teaser: exactly three cards — fixed columns, no empty cells */
.home-gov{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-1)}
@media(max-width:900px){.home-gov{grid-template-columns:1fr}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* sub-page hero */
.page-hero{padding:3.4rem 0 2.4rem;position:relative;overflow:hidden}
.page-hero.page-hero-tight{padding:2.6rem 0 .6rem}
.page-hero.page-hero-id{padding-bottom:1.2rem}
/* Network header: title left, SV summary stats filling the space on the right */
.net-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:2.5rem;flex-wrap:wrap}
.net-hero-title{min-width:0}
.net-hero .net-hero-stats{gap:2rem;padding-bottom:.45rem;flex-wrap:wrap}
.net-hero-desc{font-size:var(--text-main);color:var(--n600);margin-top:.55rem;max-width:28rem;line-height:1.5}
.net-hero-desc strong{color:var(--n900);font-weight:600}
.feat-toggle-bar{display:flex;justify-content:flex-end;margin-bottom:1rem}
@media(max-width:820px){.net-hero{align-items:flex-start;gap:1.2rem}.net-hero .net-hero-stats{gap:1.2rem 1.9rem}}
.page-hero h1{font-size:var(--h2);line-height:1.05;padding-bottom:.6rem;max-width:none;overflow-wrap:anywhere}
.page-hero .stag{color:var(--n900)}
.page-hero .sec-desc{margin-bottom:.75rem}
.hero-party{display:flex;align-items:center;gap:1rem;margin-bottom:.6rem}

/* empty state */
.empty{
  text-align:center;padding:3.5rem 2rem;background:var(--n50);
  border:1px dashed var(--border);border-radius:var(--radius);
}
.empty .e-ico{font-family:var(--mono);font-size:1.4rem;color:var(--n300);margin-bottom:.75rem}
.empty .e-t{font-size:var(--text-lg);font-weight:500;margin-bottom:.35rem}
.empty .e-d{font-family:var(--mono);font-size:.68rem;color:var(--n600);text-transform:uppercase;letter-spacing:.8px}

/* scrollbars */
.tbl_wrap::-webkit-scrollbar,pre.json::-webkit-scrollbar,.search_results::-webkit-scrollbar{height:8px;width:8px}
.tbl_wrap::-webkit-scrollbar-thumb,pre.json::-webkit-scrollbar-thumb,.search_results::-webkit-scrollbar-thumb{background:var(--n300);border-radius:99px}
.tbl_wrap::-webkit-scrollbar-track,pre.json::-webkit-scrollbar-track{background:transparent}

@media(prefers-reduced-motion:reduce){
  .page-in,tbody tr.rv,tbody tr.row-new,.search_results{animation:none!important}
}

/* ==================================================================
   Network stats band (dashboard header) + monogram chips + width
   ================================================================== */
/* ONE content width. The old negative-margin "bleed" that let some data
   surfaces claim extra width made sibling cards render at different widths
   on the same page — removed; everything aligns to the sec-pad column. */

/* generative blockies-style identity sigils */
.idn{
  display:inline-block;width:18px;height:18px;border-radius:5px;flex-shrink:0;
  vertical-align:-4px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(24,23,31,.08);
}
.idn svg{display:block;width:100%;height:100%}
.idn-lg{width:44px;height:44px;border-radius:11px;box-shadow:inset 0 0 0 1px rgba(24,23,31,.09),var(--shadow-1)}

/* branded loading spinner — the four Blueprint squares pulsing in sequence */
.spinner{display:inline-grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:2px;width:22px;height:22px;vertical-align:middle}
.spinner i{display:block;background:var(--blue);border-radius:2px;animation:spin4 1.2s infinite ease-in-out}
.spinner i:nth-child(1){animation-delay:0s}
.spinner i:nth-child(2){animation-delay:.12s}
.spinner i:nth-child(4){animation-delay:.24s}
.spinner i:nth-child(3){animation-delay:.36s}
@keyframes spin4{0%,70%,100%{opacity:.18;transform:scale(.72)}35%{opacity:1;transform:scale(1)}}
.spin-wrap{display:flex;flex-direction:column;align-items:center;gap:.8rem;padding:3.5rem 2rem;color:var(--n600);font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:1px}
@media(prefers-reduced-motion:reduce){.spinner i{animation:none;opacity:.6}}

/* compact home hero */
.hero-compact{padding:1.6rem 0 .8rem}
.hero-compact h1{font-size:var(--h2);padding-bottom:1rem;max-width:none}
.hero-compact .hero-body{margin-bottom:.8rem}
.hero-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;margin-top:1rem}
.hero-row .built-on{margin:0 0 0 auto;align-self:flex-end;padding-bottom:.1rem}
@media(max-width:760px){.hero-row .built-on{margin-left:0}}

/* compact-fold art slot (per product) — a product image floated top-right of the fold.
   GEOMETRY CONTRACT: these coordinates only clear the .hero-row when the left column is tall
   enough — i.e. the shared fold structure: .cc-lockup (product lockup) + .cc-h1 + a
   28em .hero-body (3-5 lines). Without the lockup (or with a wide/short body) the art lands
   on the built-on row — shrink it or restore the lockup. Asset is per-product; keep the glow.
   The search subnav is product-specific and NOT part of this fold contract. */
.hero-blocks{position:absolute;right:calc(1.5% + 12px);top:calc(4% + 28px);width:min(22rem,26%);z-index:1;pointer-events:none}
.hero-blocks img{display:block;width:100%;height:auto;position:relative;z-index:1;opacity:.95}
.hero-blocks-glow{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);width:76%;height:38%;z-index:0;
  background:radial-gradient(ellipse at center,rgba(86,116,225,.5),rgba(89,179,212,.24) 42%,transparent 72%);filter:blur(30px)}
@media(max-width:900px){.hero-blocks{display:none}}

/* ==================================================================
   UI overhaul: persistent search, rolling odometer, dashboard bits
   ================================================================== */
/* persistent unified search bar under the nav (sticks to top on scroll) */
.subnav{position:sticky;top:calc(5.8rem - 1px);z-index:60;background:color-mix(in srgb,var(--n100) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
/* the translucent wash relies on backdrop blur; engines without it (and
   mobile, where blur is costly) get a SOLID bar so nothing shows through */
@supports not ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))){.subnav{background:var(--n100)}}
@media(max-width:900px){
  .subnav{background:var(--n100);backdrop-filter:none;-webkit-backdrop-filter:none}
  /* Backstop against a see-through gap above the search bar. On mobile the top
     nav's position:sticky can fail (body has overflow-x:hidden, a known sticky
     breaker), scrolling the nav away and leaving empty space over the pinned
     search bar. This solid bar is anchored to the subnav and extends up across
     that zone — behind the nav when it's present, filling the gap when it's not
     — so the sticky header always reads as one continuous solid block. */
  .subnav::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:6rem;background:var(--n100);z-index:-1;pointer-events:none}
}
.subnav .pg{padding-bottom:0}
@media(max-width:479px){.subnav-ctr{padding:.6rem .25rem}}
.subnav-ctr{width:84vw;max-width:100rem;margin:0 auto;padding:.7rem 0}
.subnav .search_wrap{max-width:none;width:100%;margin:0}
.subnav .search{height:2.7rem;box-shadow:none;width:100%}
@media(max-width:991px){.subnav-ctr{width:auto;max-width:none}}
.search-big .search{height:3.5rem;font-size:var(--text-main)}
.search-empty{padding:.85rem 1rem;font-family:var(--mono);font-size:var(--text-sm);color:var(--n600)}

/* rolling-digit odometer for live "climbing" counters */
.odo{display:inline-flex;align-items:baseline;font-variant-numeric:tabular-nums;user-select:none}
.stat-v .hash,.stat-v .hash .odo{font-size:inherit}   /* live round matches the other stat cards */
.odo-d{position:relative;display:inline-block;width:1ch;height:1em;overflow:hidden;vertical-align:baseline}
.odo-col{position:absolute;left:0;top:0;display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.16,1,.3,1);will-change:transform}
.odo-col>span{display:block;height:1em;line-height:1em;text-align:center}
.odo-sep{display:inline-block;width:.5ch;text-align:center}
.live-tick{display:inline-block;width:6px;height:6px;border-radius:50%;background:#4caf6d;margin-left:.3rem;vertical-align:middle;margin-bottom:2px;animation:pulse 1.6s infinite}
@media(prefers-reduced-motion:reduce){.odo-col{transition:none}.live-tick{animation:none}}

/* section header with an action button on the right */
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.3rem;flex-wrap:wrap}
.sec-head .sec-title{margin-bottom:0}
.sec-head .stag{margin-bottom:.35rem}
.chart-cap{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.8px;color:var(--n600);margin-bottom:.8rem}
.chart_wrap .legend{margin-top:.6rem}

/* ==================================================================
   Enhanced wireframe skeleton loaders (table + party tiles)
   ================================================================== */
.skel-tbl{overflow:hidden}
.skel-head{display:flex;gap:1rem;align-items:center;padding:.72rem 1.1rem;border-bottom:1px solid var(--border);background:var(--n50)}
.skel-h{height:.55rem;border-radius:3px;background:var(--n200)}
.skel-head .c-seq{width:3rem}.skel-head .c-type{width:3.4rem}.skel-head .grow{flex:1}
.skel-head .c-amt{width:4rem}.skel-head .c-round{width:3rem}.skel-head .c-time{width:3.4rem}
.skel-tbl .skel-row{display:flex;gap:1rem;align-items:center;padding:.9rem 1.1rem;border-bottom:1px solid var(--n100);animation:rowIn .45s var(--ease) both;animation-delay:calc(var(--i,0)*45ms)}
.skel-tbl .skel-row:last-child{border-bottom:none}
.skel-row .c-seq{width:5rem;flex-shrink:0}
.skel-row .c-type{width:4.4rem;flex-shrink:0}
.skel-flow{flex:1;min-width:0;display:flex;flex-direction:column}
.skel-row .c-amt{width:4.4rem;flex-shrink:0;margin-left:auto}
.skel-row .c-round{width:3rem;flex-shrink:0}
.skel-row .c-time{width:3.4rem;flex-shrink:0}
.skel-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-1)}
.skel-tile{background:var(--n50);padding:1.35rem 1.5rem}
@media(max-width:760px){.skel-tiles{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.skel-tbl .skel-row{animation:none}}

/* ==================================================================
   Blueprint Futurism — API product page, embedded checkout, and a
   shared architectural design language (deep-ink surfaces, blueprint
   grid, aurora, gradient CTAs) that the whole site borrows from.
   ================================================================== */
:root{
  --ink-deep:#0e0e15;--ink-deep-2:#15151f;
  --grad-cta:linear-gradient(120deg,#4a63c7,#6b82db 45%,#59b3d4);
  --grad-aurora:radial-gradient(600px 320px at 78% -12%,rgba(86,116,225,.42),transparent 62%),radial-gradient(520px 300px at 8% 118%,rgba(89,179,212,.26),transparent 60%);
  --bp-grid:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  --shadow-lift:0 24px 60px -26px rgba(24,23,31,.28);
}
.btn.grad,.cta-primary.grad,.price-cta.grad{background:var(--grad-cta);color:#fff;border:none}
.btn.grad:hover,.price-cta.grad:hover{filter:brightness(1.07);color:#fff}

/* deep-ink architectural hero (pricing + welcome share it) */
.price-hero,.co-return .welcome{position:relative;overflow:hidden}
.price-hero{background:var(--ink-deep);color:#fff;padding:6rem 0 5rem;border-radius:var(--radius)}
.price-hero .sec-pad{position:relative;z-index:2}
.price-hero::before{content:"";position:absolute;inset:0;background-image:var(--bp-grid);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse 85% 70% at 28% -10%,#000,transparent 76%);mask-image:radial-gradient(ellipse 85% 70% at 28% -10%,#000,transparent 76%)}
.price-hero::after{content:"";position:absolute;inset:0;background:var(--grad-aurora);pointer-events:none}
.price-hero .stag{color:#a7b1d4;margin-bottom:1.1rem}
.price-hero .stag .sl{color:#5674e1}
.price-h1{font-size:var(--h1);line-height:1.02;letter-spacing:-.02em;max-width:16ch;margin-bottom:1.4rem}
.price-sub{color:#c9c9d2;font-size:var(--text-lg);max-width:52ch;line-height:1.5}
/* pricing hero: text beside a sample API call so the dark band isn't half-empty */
.price-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:2.5rem;align-items:center}
.price-hero-demo{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.14);border-radius:calc(var(--radius) * 2);overflow:hidden;box-shadow:0 26px 64px -32px rgba(0,0,0,.7)}
.demo-head{display:flex;align-items:center;gap:.45rem;padding:.7rem 1rem;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.1)}
.demo-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22)}
.demo-title{margin-left:.55rem;font-family:var(--mono);font-size:.68rem;color:#a7b1d4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demo-code{margin:0;padding:1.1rem 1.15rem;font-family:var(--mono);font-size:.72rem;line-height:1.7;color:#dce0ee;white-space:pre-wrap;word-break:break-word;overflow-x:auto}
.demo-code .c{color:#7a809a}.demo-code .k{color:#8fa0e8}.demo-code .s{color:#7fd6c2}.demo-code .n{color:#59b3d4}
@media(max-width:860px){.price-hero-grid{grid-template-columns:1fr}.price-hero-demo{display:none}}

/* pricing cards */
.price-sec{padding-top:3.25rem}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;align-items:start}
.price-card{position:relative;background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius) * 2);padding:2.1rem 1.9rem;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s;display:flex;flex-direction:column}
.price-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.price-card.featured{background:linear-gradient(var(--n50),var(--n50)) padding-box,var(--grad-cta) border-box;border:1.5px solid transparent;box-shadow:0 26px 70px -28px rgba(86,116,225,.5);transform:translateY(-10px)}
.price-card.featured:hover{transform:translateY(-14px)}
.price-badge{position:absolute;top:-.7rem;left:1.9rem;background:var(--grad-cta);color:#fff;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:1px;padding:.3rem .7rem;border-radius:var(--radius)}
.price-plan{font-size:var(--h4);font-weight:600;letter-spacing:-.01em}
.price-tag{color:var(--n600);font-size:var(--text-sm);margin:.35rem 0 1.4rem;min-height:2.4em;line-height:1.35}
.price-cost{display:flex;align-items:baseline;gap:.15rem;margin-bottom:.4rem}
.price-cur{font-size:1.4rem;font-weight:500;color:var(--n900);align-self:flex-start;margin-top:.3rem}
.price-amt{font-size:3.1rem;font-weight:600;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.price-per{color:var(--n600);font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.5px}
.price-rpm{font-size:var(--text-main);color:var(--n600);padding-bottom:1.5rem;border-bottom:1px solid var(--n200);margin-bottom:1.4rem}
.price-rpm b{color:var(--n900);font-weight:600}
.price-cta{width:100%;height:3rem;border-radius:var(--radius);background:var(--n900);color:var(--n50);font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.5px;border:none;cursor:pointer;transition:all .2s}
.price-cta:hover{background:#18171fcc}
.price-cta:disabled{opacity:.55;cursor:default}
.price-feat{list-style:none;padding:0;margin:1.5rem 0 0;display:flex;flex-direction:column;gap:.7rem}
.price-feat li{position:relative;padding-left:1.6rem;color:var(--n900);font-size:var(--text-main);line-height:1.4}
.price-feat li::before{content:"";position:absolute;left:0;top:.05rem;width:1.05rem;height:1.05rem;border-radius:50%;background:var(--lavender-lt);
  -webkit-mask:no-repeat center/.62rem url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  mask:no-repeat center/.62rem url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.price-card.featured .price-feat li::before{background:var(--grad-cta)}
.free-form{display:flex;flex-direction:column;gap:.6rem}
.free-email{height:3rem;padding:0 1rem;border:1px solid var(--border);border-radius:var(--radius);font-family:var(--mono);font-size:var(--text-sm);outline:none}
.free-email:focus{border-color:var(--n900)}
.free-msg{font-size:var(--text-sm);color:var(--n600)}.free-msg.ok{color:var(--pos)}
.cta-note{font-size:var(--text-sm);color:var(--n600);margin-top:.6rem;line-height:1.4}

.price-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--border)}
.price-trust>div{font-size:var(--text-sm);color:var(--n600);line-height:1.5}
.price-trust b{display:block;font-family:var(--mono);text-transform:uppercase;letter-spacing:.5px;font-size:.66rem;color:var(--n900);margin-bottom:.35rem}

/* embedded checkout */
.checkout{padding:2.5rem 0 4rem}
.back-link{font-family:var(--mono);font-size:var(--text-sm);color:var(--n600);text-transform:uppercase;letter-spacing:.5px}
.back-link:hover{color:var(--blue)}
.checkout-grid{display:grid;grid-template-columns:22rem 1fr;gap:2.5rem;margin-top:1.75rem;align-items:start}
.checkout-summary{position:sticky;top:6rem}
.co-plan{font-size:var(--h3);font-weight:600;margin:.4rem 0 .8rem}
.co-tag{color:var(--n600);font-size:var(--text-main);margin:.6rem 0 1.2rem;line-height:1.4}
.co-secure{margin-top:1.5rem;font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.5px;color:var(--n600)}
.checkout-panel{background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius) * 2);padding:1.5rem;box-shadow:var(--shadow-1)}
#co-mount{min-height:6rem}

/* welcome / key reveal */
.co-return{padding-top:3rem}
.welcome{background:var(--ink-deep);color:#fff;border-radius:calc(var(--radius) * 2);padding:3.5rem 3rem;max-width:52rem;margin:0 auto;position:relative;overflow:hidden}
.welcome::after{content:"";position:absolute;inset:0;background:var(--grad-aurora);pointer-events:none}
.welcome>*{position:relative;z-index:2}
.wl-check{width:3rem;height:3rem;border-radius:50%;background:var(--grad-cta);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1.5rem}
.welcome .stag{color:#a7b1d4}.welcome .stag .sl{color:#5674e1}
.welcome .price-h1{font-size:var(--h2);margin-bottom:1rem}
.wl-sub{color:#c9c9d2;font-size:var(--text-main);max-width:52ch;line-height:1.5;margin-bottom:1.5rem}
.key-box{display:flex;align-items:center;gap:.75rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:.85rem 1rem;margin:1rem 0}
.key-box code{font-family:var(--mono);font-size:.82rem;color:#fff;word-break:break-all;flex:1}
.key-box .copy{flex-shrink:0;background:rgba(255,255,255,.12);color:#fff;border:none;border-radius:var(--radius);padding:.4rem .7rem;font-family:var(--mono);font-size:.66rem;text-transform:uppercase;cursor:pointer}
.key-box .copy.ok{background:var(--pos)}
.h5{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:1px;color:var(--n600);margin:1.5rem 0 .5rem}
.welcome .h5{color:#a7b1d4}
.code-block2{background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:1rem 1.15rem;font-family:var(--mono);font-size:.74rem;line-height:1.7;color:#e6e6ee;white-space:pre-wrap;word-break:break-word;margin-bottom:1.5rem}
.wl-use{margin:.5rem 0}
.notice{border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;background:var(--n50)}
.notice-t{font-weight:600;margin-bottom:.4rem}.notice-m{color:var(--n600);font-size:var(--text-main);line-height:1.5}

/* Stripe trust marks */
.stripe-mark{height:15px;width:auto;vertical-align:middle;display:inline-block}
.co-secure{display:inline-flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.co-secure .lock-i{width:13px;height:13px;color:var(--n600);flex-shrink:0}
.co-secure .stripe-mark{height:16px}
.price-trust b .stripe-mark{height:14px;margin-left:.35em;vertical-align:-.18em}
.co-already{max-width:36rem;margin-top:1.75rem;display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start}
/* native Payment Element checkout */
.pay-form{display:flex;flex-direction:column}
#pay-el{margin-bottom:1rem;min-height:5rem}
.pay-err{color:#d64545;font-size:var(--text-sm);min-height:1.2em;margin-bottom:.5rem;line-height:1.4}
.pay-btn{width:100%;height:3.1rem;justify-content:center;font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.5px}
.pay-btn:disabled{opacity:.7;cursor:default}
.co-discount{margin-bottom:1.1rem}
.co-disc-row{display:flex;gap:.5rem}
.co-disc-input{flex:1;min-width:0;height:2.7rem;padding:0 .85rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);font-family:var(--mono);font-size:.78rem;letter-spacing:.03em;color:var(--n900);text-transform:uppercase}
.co-disc-input::placeholder{color:var(--n600);text-transform:none;letter-spacing:0}
.co-disc-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(86,116,225,.15)}
.co-disc-input:disabled{opacity:.65;background:var(--n100)}
.co-disc-btn{flex-shrink:0;height:2.7rem;padding:0 1.1rem;border:1px solid var(--n900);border-radius:var(--radius);background:var(--n900);color:var(--n50);font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.4px;cursor:pointer;transition:opacity .15s}
.co-disc-btn:hover{opacity:.85}
.co-disc-btn:disabled{opacity:.6;cursor:default}
.co-disc-status{font-family:var(--mono);font-size:.66rem;letter-spacing:.02em;min-height:1em;margin-top:.5rem}
.co-disc-ok{color:var(--pos,#2b9c6a)}
.co-disc-err{color:#d64545}
.pay-fine{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;justify-content:center;margin-top:.9rem;font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.4px;color:var(--n600)}
.pay-fine .stripe-mark{height:13px}

@media(max-width:600px){
  .price-hero{padding:3.6rem 0 3rem}
  .price-h1{font-size:2.7rem;line-height:1.05;max-width:none}
  .price-sub{font-size:var(--text-main)}
  .price-amt{font-size:2.7rem}
  .welcome .price-h1{font-size:2rem}
}
@media(max-width:900px){
  .pricing-grid{grid-template-columns:1fr;max-width:26rem;margin:0 auto}
  .price-card.featured{transform:none}
  .price-card.featured:hover{transform:translateY(-4px)}
  .price-trust{grid-template-columns:1fr}
  .checkout-grid{grid-template-columns:1fr}
  .checkout-summary{position:static}
  .welcome{padding:2.5rem 1.5rem}
}

/* ==================================================================
   Scroll-reveal — fade-up as elements enter view, matching the
   Blueprint family (solentic / ccledger / theblueprint.xyz).
   ================================================================== */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transition-delay:var(--rd,0ms)}
  .reveal.revealed{opacity:1;transform:none}
}

/* self-transfer / reward-collection arrow in the flow cell */
.flow-line .selfarrow{color:var(--teal-text,#2c7d9c);font-weight:600}

/* ==================================================================
   Validator status card + role badges (party page)
   ================================================================== */
.val-badge-wrap{display:inline-flex;gap:.4rem;flex-wrap:wrap;vertical-align:middle;margin-left:.6rem}
.rolebadge{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.6px;
  background:var(--grad-cta);color:#fff;border-radius:var(--radius);padding:.28rem .6rem;white-space:nowrap;vertical-align:middle}
.val-card{border-left:3px solid var(--n300)}
.val-head{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.val-dot{width:10px;height:10px;border-radius:50%;background:var(--n300);flex-shrink:0}
.val-status{font-family:var(--mono);font-size:.8rem;text-transform:uppercase;letter-spacing:.6px;font-weight:500}
.val-sub{font-size:var(--text-sm);color:var(--n600)}
.val-roles{margin-left:auto;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.6px;color:var(--n600)}
.val-note{margin-top:.9rem;font-family:var(--mono);font-size:.62rem;color:var(--n600);letter-spacing:.2px}
.val-kv{grid-template-columns:minmax(9rem,auto) 1fr;column-gap:1.25rem}
/* status colours — dot + label + left rule */
/* ── Blueprint's own validator wears the signet as its avatar ── */
.idn-bp{display:inline-flex;align-items:center;justify-content:center;background:#fff;box-shadow:inset 0 0 0 1px rgba(24,23,31,.12);animation:bpGlow 2.6s ease-in-out infinite}
@keyframes bpGlow{0%,100%{box-shadow:inset 0 0 0 1px rgba(24,23,31,.12),0 0 0 0 rgba(86,116,225,0)}50%{box-shadow:inset 0 0 0 1px rgba(24,23,31,.12),0 0 13px 2px rgba(86,116,225,.55)}}
@media(prefers-reduced-motion:reduce){.idn-bp{animation:none}}
.idn-bp img{width:78%;height:78%;object-fit:contain;display:block}
.val-active{border-left:1px solid var(--border);position:relative}
.val-active::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;z-index:1;
  background:linear-gradient(180deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1);background-size:100% 300%;
  animation:auroraMorphY 8s ease-in-out infinite}
@keyframes auroraMorphY{0%,100%{background-position:0% 0%}50%{background-position:0% 100%}}
@media(prefers-reduced-motion:reduce){.val-active::before{animation:none}}
.val-active .val-dot{background:#4caf6d;box-shadow:0 0 0 4px #4caf6d22;animation:pulse 2s infinite}.val-active .val-status{color:var(--pos)}
.val-lagging{border-left-color:#e8b45a}.val-lagging .val-dot{background:#e8b45a}.val-lagging .val-status{color:#b5872f}
.val-stale{border-left-color:#e0873a}.val-stale .val-dot{background:#e0873a}.val-stale .val-status{color:#c06f28}
.val-inactive{border-left-color:#c0564e}.val-inactive .val-dot{background:#c0564e}.val-inactive .val-status{color:#a8443c}
.val-unknown .val-dot{background:var(--n600)}.val-unknown .val-status{color:var(--n600)}
.val-no_network_rewards{border-left-color:#2c7d9c}.val-no_network_rewards .val-dot{background:#2c7d9c;box-shadow:0 0 0 4px #2c7d9c22;animation:pulse 2s infinite}.val-no_network_rewards .val-status{color:#2c7d9c}
.val-idle{border-left-color:#2c7d9c}.val-idle .val-dot{background:#2c7d9c;box-shadow:0 0 0 4px #2c7d9c22;animation:pulse 2s infinite}.val-idle .val-status{color:#2c7d9c}
@media(max-width:560px){.val-roles{margin-left:0;flex-basis:100%}.rolebadge{font-size:.55rem}}

/* validator lifetime-earnings hero (inside the status card) */
.val-hero{margin:.25rem 0 1rem;padding:1rem 1.15rem;background:var(--n100);border:1px solid var(--border);border-radius:var(--radius)}
.val-hero-v{font-size:var(--text-xxl);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.val-hero-v .unit{font-size:.42em;color:var(--n600);font-weight:400;letter-spacing:0;margin-left:.15rem}
.val-hero-l{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.6px;color:var(--n600);margin-top:.5rem}
.val-loading{display:flex;align-items:center;gap:.85rem;padding:1.5rem .3rem .6rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.02em}
.val-loading .spinner{transform:scale(.6);transform-origin:left center;flex-shrink:0}
/* validator split layout: reward-history chart (left) + status (right) */
.val-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-1);margin-top:.25rem;border-left:3px solid var(--n300)}
.val-layout.val-active{border-left:1px solid var(--border)}
.val-layout.val-inactive{border-left-color:#c0564e}
.val-viz,.val-main{background:var(--n50);padding:1.2rem 1.35rem;min-width:0}
.val-viz-h{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:var(--n900);margin-bottom:.9rem;display:flex;align-items:baseline;gap:.5rem}
.val-viz-t{margin-left:auto;font-size:.82rem;color:var(--blue);letter-spacing:0}
.val-chart-svg{width:100%;height:auto;display:block}
.val-viz-legend{display:flex;gap:1.2rem;margin-top:.6rem;font-family:var(--mono);font-size:.6rem;color:var(--n600)}
.val-viz-legend i{display:inline-block;vertical-align:middle;margin-right:.3rem}
.val-viz-legend .lg-line{width:12px;height:2px;background:#5674e1}
.val-viz-legend .lg-bar{width:7px;height:9px;background:#59b3d4;opacity:.6}
.val-viz-empty{padding:2.2rem 1rem;text-align:center;font-size:.8rem}
.val-main .val-hero{margin-top:0}
@media(max-width:760px){.val-layout{grid-template-columns:1fr}}

/* ------------------------------------------------- featured apps analytics */
.feat-top{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.6rem}
.apps-stats{display:flex;gap:2.4rem;flex-wrap:wrap}
.apps-stat{display:flex;flex-direction:column;line-height:1}
.apps-stat .n{font-family:var(--mono);font-size:1.85rem;font-weight:400;color:var(--n900);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.apps-stat .l{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--n600);margin-top:.45rem}
.feat-toggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--n50)}
.feat-toggle button{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;padding:.5rem .95rem;background:none;border:none;border-right:1px solid var(--border);color:var(--n600);cursor:pointer;transition:background .15s,color .15s}
.feat-toggle button:last-child{border-right:none}
.feat-toggle button:hover{color:var(--n900)}
.feat-toggle button.active{background:var(--n900);color:#fff}
.feat-charts{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:1.6rem;box-shadow:var(--shadow-1)}
.feat-chart{background:var(--n50);padding:1.3rem 1.4rem 1.1rem;display:flex;flex-direction:column}
.feat-chart>.donut-wrap{flex:1}
.feat-chart>#sbar{flex:1;display:flex;flex-direction:column;justify-content:flex-end}
.feat-chart-h{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.09em;color:var(--n900);margin-bottom:1rem}
.feat-chart-empty{padding:2.5rem 1rem;text-align:center;font-size:.8rem}
.donut-wrap{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.donut-svg{width:148px;height:148px;flex-shrink:0}
.donut-c1{text-anchor:middle;font-family:var(--mono);font-size:24px;font-weight:600;fill:var(--n900)}
.donut-c2{text-anchor:middle;font-family:var(--mono);font-size:7px;text-transform:uppercase;letter-spacing:1px;fill:var(--n600)}
.donut-legend{list-style:none;flex:1;min-width:8.5rem;font-family:var(--mono);font-size:.64rem;display:flex;flex-direction:column;gap:.3rem}
.donut-legend li{display:flex;align-items:center;gap:.45rem}
.lg-dot{width:8px;height:8px;flex-shrink:0}
.lg-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--n900)}
.lg-pct{color:var(--n600);font-variant-numeric:tabular-nums}
.sbar-svg{width:100%;height:auto;display:block}
.ax-grid{stroke:var(--n200);stroke-width:1}
.ax-y,.ax-x{font-family:var(--mono);font-size:8px;fill:var(--n600)}
.ax-y{text-anchor:end}.ax-x{text-anchor:middle}
.feat-tbl-bar{display:flex;align-items:center;gap:1rem;margin-bottom:.9rem;flex-wrap:wrap}
.apps-search{width:min(20rem,100%);height:2.6rem;padding:0 1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);font-family:var(--mono);font-size:var(--text-sm);color:var(--n900);outline:none;transition:border-color .18s,box-shadow .18s}
.apps-search:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(86,116,225,.12)}
.apps-search::placeholder{color:var(--n600)}
.feat-note{font-family:var(--mono);font-size:.66rem;margin-left:auto}
.feat-wrap{overflow-x:auto}
.feat-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);table-layout:auto}
.feat-table thead th{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--n600);text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--border);white-space:nowrap;background:var(--n100)}
.feat-table th.num,.feat-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.feat-table th.srt{cursor:pointer;user-select:none}
.feat-table th.srt:hover{color:var(--n900)}
.feat-table th.srt::after{content:"↕";opacity:.35;margin-left:.3rem}
.feat-table th.srt-desc::after{content:"↓";opacity:.9}
.feat-table th.srt-asc::after{content:"↑";opacity:.9}
.feat-rank{width:3.2rem;color:var(--n600);font-family:var(--mono);font-size:.72rem;text-align:left;font-variant-numeric:tabular-nums}
.feat-table td.feat-rank,.feat-table th.feat-rank{padding-left:.9rem}
.feat-row{cursor:pointer;transition:background .13s}
.feat-row td{padding:.6rem .9rem;border-bottom:1px solid var(--border);vertical-align:middle}
.feat-row:hover{background:var(--n100)}
.feat-row:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.feat-app{display:flex;align-items:center;gap:.7rem;min-width:11rem}
.feat-idn{flex-shrink:0;display:inline-flex;line-height:0}
.feat-idn .idn{width:26px;height:26px}
.feat-nm{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.feat-name{font-weight:600;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feat-handle{font-size:.6rem;color:var(--n600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:14rem}
.feat-rew{font-weight:600;color:var(--n900);white-space:nowrap}
.app-cat{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.05em;color:var(--blue);white-space:nowrap}
.asset-cap{display:inline-block;font-family:var(--mono);font-size:.58rem;letter-spacing:.02em;color:var(--n700);background:var(--n100);border:1px solid var(--border);border-radius:4px;padding:.1rem .4rem;margin:.1rem .15rem .1rem 0;white-space:nowrap}
.feat-share{width:8.5rem}
.feat-bar{display:block;height:6px;background:var(--n200);border-radius:1px;overflow:hidden}
.feat-bar i{display:block;height:100%;background:var(--grad-cta);border-radius:1px}
.feat-pending{margin-top:1rem;font-size:.72rem;font-family:var(--mono);text-align:center}
/* super-validator reward-weight bars (Network page, card 2) */
/* chart cards: one visual standard — min height with natural grid stretch,
   so side-by-side pairs stay equal WITHOUT clipping their content */
.card.feat-chart{min-height:16rem}
.feat-chart>canvas.chart{height:12.2rem}
.feat-charts canvas.chart{height:12.2rem}
.feat-charts .donut-wrap svg{width:8.6rem;height:8.6rem;flex:none}
.feat-charts #sbar{flex:1;min-height:0}
.feat-charts #sbar svg{width:100%;height:100%;max-height:13rem;display:block}
.feat-charts.fc-even{grid-template-columns:1fr 1fr}
.sv-wbars{display:flex;flex-direction:column;gap:.35rem;flex:1;justify-content:center;padding:.15rem 0 .4rem}
.sv-wbar{display:flex;align-items:center;gap:.7rem;font-size:.7rem}
.sv-wbar-nm{flex:0 0 8.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--n900);font-family:var(--mono)}
.sv-wbar-tk{flex:1;min-width:0}
.sv-wbar-v{flex:0 0 auto;color:var(--n600);font-variant-numeric:tabular-nums;font-size:.66rem}
@media(max-width:760px){.feat-charts{grid-template-columns:1fr}.feat-note{margin-left:0}.feat-top{align-items:flex-start}}

/* ============================== accounts / auth / dashboard ============================== */
.nav-links{margin-left:auto}
.nav-dd{position:relative;display:inline-flex;align-items:center}
.nav-dd-btn{font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;color:var(--n900);background:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;padding:0;line-height:1}
.nav-caret{display:inline-flex;align-items:center;color:var(--blue);margin-left:.3rem;transition:transform .2s ease}
.nav-dd.open .nav-caret{transform:rotate(180deg)}
.nav-dd-btn:hover{color:var(--blue)}
.nav-dd-menu{position:absolute;top:calc(100% + .85rem);left:50%;transform:translateX(-50%) translateY(-6px);min-width:11rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);padding:.4rem;opacity:0;visibility:hidden;transition:opacity .16s,transform .16s;z-index:120;display:flex;flex-direction:column;gap:.1rem}
.nav-dd.open .nav-dd-menu{opacity:1;visibility:visible;transform:translateX(-50%)}
/* Visibility is driven ONLY by .open (JS), never :hover or :focus-within — both of
   those get set by the very tap/click that should toggle the menu, so they'd hold it
   open and defeat close. JS opens on a real mouse pointerenter (gated by pointerType)
   for instant hover feel, on click/Enter (toggle), and closes on Escape/blur/outside. */
.nav-dd-menu::before{content:"";position:absolute;bottom:100%;left:0;right:0;height:.85rem}
.nav-dd-menu a{padding:.5rem .7rem;border-radius:calc(var(--radius) - 1px);white-space:nowrap;font-size:.72rem}
.nav-dd-menu a:hover{background:var(--n100)}
.nav-acct{display:flex;align-items:center;margin-left:1.6rem;position:relative;flex-shrink:0}
a.acct-signin{padding:.55rem 1.1rem}
a.acct-signlink{font-family:var(--mono);font-size:var(--text-sm);text-transform:uppercase;color:var(--n900);line-height:1;display:inline-flex;align-items:center;margin-right:1.1rem;white-space:nowrap}
a.acct-signlink:hover{color:var(--blue)}
.acct-btn{width:2.3rem;height:2.3rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--n50);cursor:pointer;padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:border-color .15s,box-shadow .15s}
.acct-btn:hover{border-color:var(--n600)}
.nav-acct.open .acct-btn{border-color:var(--blue);box-shadow:0 0 0 3px rgba(86,116,225,.14)}
.acct-btn .acct-img{width:100%;height:100%;object-fit:cover}
.acct-btn .acct-idn,.acct-btn .acct-idn .idn-lg,.acct-btn .acct-idn .idn{width:2.3rem;height:2.3rem;display:block;border-radius:0}
/* live usage instruments — the dashboards' compact usage grid, in the
   landing console's dress: individual cards, faint blueprint grid, mono
   labels, ink numerals, blue-family charts */
.usage-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:.55rem;margin-bottom:.55rem}
.ug-card{background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius)*2);box-shadow:var(--shadow-1);position:relative;overflow:hidden;padding:.85rem 1.15rem .6rem;min-width:0}
.ug-card::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(24,23,31,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(24,23,31,.03) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 95% 90% at 50% 0%,#000,transparent 92%);
  mask-image:radial-gradient(ellipse 95% 90% at 50% 0%,#000,transparent 92%)}
.ug-card>*{position:relative;z-index:1}
.ul-h{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.ul-stats{font-size:.66rem;color:var(--n600);white-space:nowrap}
.ul-stats b{color:var(--blue-d);font-weight:500;font-size:.85rem}
.ul-chart{margin-top:.5rem}
.ul-axis{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.54rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);margin-top:.3rem}
.ug-share{margin-top:.55rem}
.ug-share .ubk-row{display:flex;align-items:center;gap:.5rem}
.ug-dot{display:inline-block;width:.55rem;height:.55rem;border-radius:2px;flex:none}
.ugs-grid{display:grid;grid-template-columns:1fr 8.2rem;gap:1.1rem;align-items:center}
.ugs-donut .donut-svg{width:8.2rem;height:8.2rem}
@media(max-width:640px){.ugs-grid{grid-template-columns:1fr}.ugs-donut{display:flex;justify-content:center}}
@media(max-width:900px){.usage-grid{grid-template-columns:1fr}}
/* range toggle; series refreshes patch the DOM in place — no transitions */
.uc-range{margin-right:.6rem}
#usage-series{position:relative}

/* admin avatar: the Blueprint signet on a white tile, breathing like the
   validator mark */
.acct-bp,.acct-btn .acct-bp,.acct-hd .acct-bp{display:flex;align-items:center;justify-content:center;background:#fff;animation:bpGlow 2.6s ease-in-out infinite}
.acct-bp img{width:78%;height:78%;object-fit:contain;display:block}
.acct-hd .acct-bp{width:2.4rem;height:2.4rem;border-radius:var(--radius)}
@media(prefers-reduced-motion:reduce){.acct-bp{animation:none}}
.acct-menu{position:absolute;top:calc(100% + .7rem);right:0;min-width:15rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);padding:.5rem;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .16s,transform .16s;z-index:130;display:flex;flex-direction:column;gap:.1rem}
.nav-acct.open .acct-menu{opacity:1;visibility:visible;transform:none}
.acct-hd{display:flex;align-items:center;gap:.7rem;padding:.5rem .6rem .8rem;border-bottom:1px solid var(--border);margin-bottom:.4rem}
.acct-hd .acct-img{width:2.4rem;height:2.4rem;border-radius:var(--radius);object-fit:cover}
.acct-hd .acct-idn,.acct-hd .acct-idn .idn-lg{width:2.4rem;height:2.4rem;display:block}
.acct-hd .acct-idn.acct-bp,.acct-btn .acct-idn.acct-bp{display:flex}
.acct-hd-t{min-width:0}
.acct-nm{font-weight:600;font-size:.82rem;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:11rem}
.acct-pl{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--blue);margin-top:.15rem}
.acct-menu a,.acct-out{text-align:left;padding:.55rem .6rem;border-radius:calc(var(--radius) - 1px);font-family:var(--mono);font-size:.72rem;color:var(--n900);background:none;border:none;cursor:pointer;width:100%;display:block}
.acct-menu a:hover,.acct-out:hover{background:var(--n100)}
.acct-out{color:var(--neg);border-top:1px solid var(--border);margin-top:.3rem}
/* Upgrade entrance in the account menu — the natural place a free user looks to go paid */
.acct-upsell{color:#5674e1;font-weight:600;background:rgba(86,116,225,.08);margin-top:.25rem}
.acct-upsell:hover{background:rgba(86,116,225,.15)}
.acct-upsell span{margin-left:.15rem}
.nav-mob-acct{display:none}

.auth-wrap{display:flex;justify-content:center;padding:4rem 1.5rem 6rem;min-height:58vh}
.auth-card{width:100%;max-width:26rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);padding:2.6rem 2.4rem;text-align:center}
.auth-mark{width:3.4rem;height:3.4rem;margin:0 auto 1.4rem}
.auth-mark .idn-lg{width:3.4rem;height:3.4rem}
.auth-mark img{width:100%;height:100%;object-fit:contain;display:block}
.auth-h{font-size:1.5rem;font-weight:600;letter-spacing:-.02em;color:var(--n900);margin-bottom:.6rem}
.auth-sub{font-size:.86rem;color:var(--n600);line-height:1.55;margin-bottom:1.6rem}
.auth-sub em{color:var(--n900);font-style:normal;font-weight:600}
.auth-btn{width:100%;height:3rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--n50);color:var(--n900);font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:all .18s;margin-bottom:.7rem}
.auth-btn:hover:not(:disabled){border-color:var(--n900)}
.auth-btn.primary{background:var(--n900);color:#fff;border-color:var(--n900)}
.auth-btn.primary:hover:not(:disabled){box-shadow:var(--shadow-2)}
.auth-btn:disabled{opacity:.5;cursor:not-allowed}
.auth-ic{font-size:1rem}
.auth-div{display:flex;align-items:center;gap:.8rem;margin:1.2rem 0;color:var(--n600);font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em}
.auth-div::before,.auth-div::after{content:"";flex:1;height:1px;background:var(--border)}
.auth-in{width:100%;height:2.8rem;padding:0 1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);font-size:.8rem;outline:none;margin-bottom:.7rem;transition:border-color .15s}
.auth-in:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(86,116,225,.12)}
.auth-msg{min-height:1.2rem;font-family:var(--mono);font-size:.68rem;margin-top:.4rem}
.auth-msg.ok{color:var(--n600)}.auth-msg.err{color:var(--neg)}
.auth-note{padding:.6rem .8rem;border-radius:var(--radius);font-size:.72rem;margin-bottom:1rem;background:var(--n100)}
.auth-note.err{color:var(--neg)}
.auth-fine{font-size:.66rem;color:var(--n600);margin-top:1.3rem;line-height:1.5}

.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.55rem;margin-bottom:.55rem}
.dash-card{background:var(--n50);padding:1.15rem 1.3rem;min-width:0;border:1px solid var(--border);border-radius:calc(var(--radius)*2);box-shadow:var(--shadow-1)}
.dash-id{display:flex;flex-direction:column;gap:.85rem;justify-content:space-between}
.dash-id-top{display:flex;align-items:center;gap:.9rem}
.dash-id-txt{flex:1;min-width:0}
.dash-id-foot{display:flex;align-items:center;gap:.4rem;border-top:1px solid var(--border);padding-top:.6rem;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--n600);white-space:nowrap}
.dash-id-foot b{color:var(--n900);font-weight:600}
.dash-id-foot .on{color:#1c6b3f}
.dash-id-foot .dash-id-sep{color:var(--n300)}
.dash-id-foot a{margin-left:auto;color:var(--blue)}
.dash-id-foot a:hover{text-decoration:underline}
.dash-av{width:2.8rem;height:2.8rem;flex-shrink:0;position:relative}
.dash-av .acct-img,.dash-av .acct-idn,.dash-av .acct-idn .idn,.dash-av .acct-idn .idn-lg{width:2.8rem;height:2.8rem;border-radius:var(--radius);object-fit:cover;display:block}
.dash-av .acct-bp{display:flex;align-items:center;justify-content:center}
.dash-av .acct-bp img{width:78%;height:78%}
.dash-av-btn{position:absolute;right:-.35rem;bottom:-.35rem;width:1.35rem;height:1.35rem;border-radius:50%;border:1px solid var(--border);background:var(--n50);color:var(--n600);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:var(--shadow-1);transition:color .15s,border-color .15s}
.dash-av-btn:hover{color:var(--blue);border-color:var(--blue)}
.dash-av-rm{border:none;background:none;padding:0;margin-top:.2rem;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);cursor:pointer}
.dash-av-rm:hover{color:var(--neg)}
/* live quota rail — warms as the minute budget tightens */
.quota-rail{height:.35rem;border-radius:99px;background:var(--n200);overflow:hidden;margin:.55rem 0 .35rem}
.quota-rail span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#59b3d4,#5674e1);transition:width .6s ease}
.quota-rail span.q-warn{background:linear-gradient(90deg,#e8b45a,#e0885b)}
.quota-rail span.q-hot{background:linear-gradient(90deg,#e0885b,#d4696b)}
.dash-spark{margin-top:.6rem}
.adm-online{display:flex;align-items:center;gap:.35rem}
.adm-online b{color:var(--pos);font-weight:600}
.adm-online .live_dot{width:7px;height:7px}
/* admin · system health board */
.hl-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.hl-overall{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.hl-overall.ok{color:var(--pos)}
.hl-overall.warn{color:#a9781e}
.hl-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block}
.hl-dot.ok{background:var(--pos);box-shadow:0 0 0 3px rgba(46,125,79,.16)}
.hl-dot.warn{background:#d39a2a;box-shadow:0 0 0 3px rgba(211,154,42,.16)}
.hl-dot.down{background:var(--neg);box-shadow:0 0 0 3px rgba(179,66,58,.16)}
.hl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.hl-card{background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius)*2);padding:1.15rem 1.3rem;min-width:0;box-shadow:var(--shadow-1)}
.hl-wide{grid-column:span 2}
.hl-h{display:flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.07em;color:var(--n900);font-weight:600;margin-bottom:.7rem}
.hl-big{font-size:1.75rem;font-weight:600;letter-spacing:-.01em;margin-bottom:.75rem;line-height:1}
.hl-big.ok{color:var(--pos)}.hl-big.warn{color:#a9781e}.hl-big.down{color:var(--neg)}
.hl-kv{display:grid;grid-template-columns:1fr 1fr;gap:.3rem .9rem}
.hl-kv>div{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;font-size:.74rem;border-bottom:1px dashed var(--border);padding-bottom:.25rem}
.hl-kv span{color:var(--n600)}
.hl-kv b{color:var(--n900);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hl-kv b.warn-t{color:#a9781e}
.hl-prog{display:flex;align-items:center;gap:.6rem;margin-top:.6rem;font-size:.66rem;color:var(--n600)}
.hl-prog>span{min-width:9rem}
.hl-bar{flex:1;height:6px;background:var(--n200);border-radius:3px;overflow:hidden}
.hl-bar i{display:block;height:100%;background:var(--blue);border-radius:3px}
.hl-bar i.warn{background:#d39a2a}.hl-bar i.down{background:var(--neg)}
.hl-prog em{font-family:var(--mono);font-style:normal;min-width:2.4rem;text-align:right}
.hl-note{font-size:.62rem;color:var(--n600);margin-top:.6rem}
.hl-tbl{width:100%;border-collapse:collapse;margin-top:.7rem;font-size:.72rem}
.hl-tbl th{text-align:left;font-family:var(--mono);font-size:.58rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n600);font-weight:500;padding:.3rem .4rem;border-bottom:1px solid var(--border)}
.hl-tbl td{padding:.3rem .4rem;border-bottom:1px solid var(--border);color:var(--n900)}
.hl-tbl .r{text-align:right}
.hl-vers{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.35rem .9rem}
.hl-vers>div{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;font-size:.72rem;border-bottom:1px dashed var(--border);padding-bottom:.25rem}
.hl-vers span{color:var(--n600)}
.hl-vers b{color:var(--n900)}
@media(max-width:760px){.hl-grid{grid-template-columns:1fr}.hl-wide{grid-column:span 1}.hl-kv{grid-template-columns:1fr}}
/* quota banner — amber approaching, red at the wall */
.quota-banner{background:#fdf3e3;border:1px solid #ecd9b0;border-radius:var(--radius);padding:.7rem 1rem;font-size:.78rem;color:#7a5b1e;margin-bottom:.8rem}
.quota-banner.qb-hot{background:#fbeaea;border-color:#ecc4c2;color:#8c3a36}
.quota-banner.qb-ok{background:#e7f3ec;border-color:#bcdcc8;color:#1c6b3f}
.quota-banner a{text-decoration:underline;font-weight:600}
.dash-av img,.dash-av .idn-lg{width:2.8rem;height:2.8rem;border-radius:var(--radius);object-fit:cover}
.dash-nm{font-weight:600;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-em{font-size:.66rem;color:var(--n600);margin-top:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-k{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--n600)}
.dash-v{font-size:1.9rem;font-weight:400;font-family:var(--mono);color:var(--n900);margin-top:.4rem;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.dash-sub{font-size:.66rem;color:var(--n600);margin-top:.3rem}
.dash-cta{display:inline-block;margin-top:.6rem;font-family:var(--mono);font-size:.66rem;color:var(--blue)}
.dash-cta-up{background:var(--grad-cta,#5674e1);color:#fff;padding:.5rem .9rem;border-radius:var(--radius);font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}
.dash-cta-up:hover{filter:brightness(1.08);color:#fff}
.dash-sec-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:1rem}
.dash-keys td{padding:.7rem .9rem}
.dk-mask{color:var(--n600)}
.dk-act{text-align:right}
.dk-del,.dk-rev{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;color:var(--neg);background:none;border:1px solid transparent;cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius)}
/* row actions stay compact visually but keep a usable hit area */
.dk-del,.dk-rev,.dk-ren,.dk-rot,.pk-del{min-height:2rem}
.dk-del:hover,.dk-rev:hover{border-color:var(--neg)}
.key-reveal{margin:1rem 0;padding:1.1rem 1.25rem 1.1rem 1.4rem;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.key-reveal::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#3f9e6d}
.kr-h{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--n900);margin-bottom:.7rem}
/* the reveal panel is light, so override the dark-panel key-box (white-on-transparent) */
.key-reveal .key-box{background:var(--n100);border:1px solid var(--border);margin:0;padding:.72rem .9rem}
.key-reveal .key-box code{color:var(--n900);font-size:.8rem}
.key-reveal .key-box .copy{background:var(--n900);color:var(--n50)}
.key-reveal .key-box .copy:hover{background:#000;color:var(--n50)}
.key-reveal .key-box .copy.ok{background:var(--pos);color:#fff}
.kr-dismiss{position:absolute;top:.45rem;right:.55rem;background:none;border:none;font-size:1.25rem;line-height:1;color:var(--n600);cursor:pointer;padding:0 .35rem;border-radius:var(--radius);transition:color .15s,background .15s}
.kr-dismiss:hover{color:var(--n900);background:var(--n100)}
.kr-note{font-family:var(--mono);font-size:.58rem;color:var(--n600);margin-top:.6rem;letter-spacing:.02em}
.key-reveal .key-box #kr-eye{background:var(--n100);color:var(--n900)}
.key-reveal .key-box #kr-eye:hover{background:var(--n200)}
.dash-settings{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
/* admin dashboard */
.adm-badge{display:inline-block;font-family:var(--mono);font-size:.52rem;text-transform:uppercase;letter-spacing:.06em;background:var(--n900);color:var(--n50);padding:.12rem .38rem;border-radius:calc(var(--radius) - 1px);vertical-align:middle;margin-left:.4rem;font-weight:500}
.adu-plan-row{display:flex;gap:.5rem;align-items:center;margin-top:.55rem;flex-wrap:wrap}
.adu-sel{font-family:var(--mono);font-size:.72rem;padding:.42rem .55rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);color:var(--n900);cursor:pointer}
.adu-plan-row .btn{padding:.42rem .85rem;height:auto;font-size:.68rem}
.adu-revoke{padding:.35rem .75rem;height:auto;font-size:.66rem}
.acct-admin{color:var(--blue)!important}
.ds-row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.1rem 1.4rem;background:var(--n50);border-bottom:1px solid var(--border)}
.ds-row:last-child{border-bottom:none}
.ds-t{font-weight:600;color:var(--n900);font-size:.86rem}
.ds-d{font-size:.72rem;margin-top:.2rem;max-width:34rem}
.ds-danger{color:var(--neg);border-color:var(--neg)!important}
@media(max-width:600px){.ds-row{flex-direction:column;align-items:flex-start;gap:.7rem}}

/* dashboard usage analytics */
.usage-card{display:grid;grid-template-columns:1fr 15rem;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-1);margin-bottom:2rem}
.usage-chart{background:var(--n50);padding:1.2rem 1.3rem;min-width:0}
.usage-bykey{background:var(--n50);padding:1.2rem 1.3rem;display:flex;flex-direction:column;gap:.6rem}
.ubk-h{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--n600);margin-bottom:.2rem}
.ubk-row{display:grid;grid-template-columns:minmax(0,6.5rem) 1fr auto;gap:.55rem;align-items:center}
.ubk-l{font-size:.7rem;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ubk-bar{height:6px;background:var(--n100);border-radius:2px;overflow:hidden}
.ubk-bar>span{display:block;height:100%;background:linear-gradient(90deg,#5674e1,#59b3d4)}
.ubk-v{font-size:.66rem;color:var(--n600);font-variant-numeric:tabular-nums}
.ua-bar{fill:#59b3d4;opacity:.42}
/* enhanced usage chart: summary chips + smooth area + hover crosshair */
.uchart{display:flex;flex-direction:column;gap:1rem}
.uchart-top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.uc-toggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;flex-shrink:0}
.uc-tb{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--n600);background:var(--n50);border:none;padding:.4rem .7rem;cursor:pointer;transition:background .15s,color .15s}
.uc-tb+.uc-tb{border-left:1px solid var(--border)}
.uc-tb.active{background:var(--n900);color:var(--n50)}
/* view toggle: show total OR stacked, and the matching y-axis labels */
.uchart[data-view="total"] .uc-stack,.uchart[data-view="ep"] .uc-total{display:none}
.uchart[data-view="total"] .ax-yS,.uchart[data-view="ep"] .ax-yT{display:none}
.uc-band{stroke:var(--n50);stroke-width:.5;transition:fill-opacity .15s}
.uchart-plot:hover .uc-band{fill-opacity:.9}
/* single-line legend: never wraps — overflows into an invisible horizontal
   scroll (swipe/trackpad) so 10 endpoint families stay one tidy row at any width */
.uc-legend{display:flex;flex-wrap:nowrap;gap:1rem;padding-top:.2rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.uc-legend::-webkit-scrollbar{display:none}
.ucl{display:inline-flex;align-items:center;gap:.35rem;font-size:.64rem;color:var(--n900);white-space:nowrap;flex-shrink:0}
.ucl-dot{width:.6rem;height:.6rem;border-radius:2px;flex-shrink:0}
.ucl-nm{color:var(--n900)}
.ucl-v{color:var(--n900);font-size:.64rem}
.ucl-pct{color:var(--n600);font-family:var(--mono);font-size:.58rem}
.uc-tip-rows{display:flex;flex-direction:column;gap:.12rem;margin-top:.28rem;padding-top:.28rem;border-top:1px solid rgba(255,255,255,.16)}
.uc-tr{display:flex;align-items:center;gap:.35rem;font-family:var(--mono);font-size:.56rem;text-transform:none;letter-spacing:0;opacity:1;color:var(--n50)}
.uc-tr em{margin-left:auto;padding-left:.6rem;font-style:normal;opacity:.85}
.uc-td{width:.5rem;height:.5rem;border-radius:1px;flex-shrink:0}
.uchart-stats{display:flex;flex-wrap:wrap;gap:1rem 2.2rem}
.ucs{display:flex;flex-direction:column;gap:.22rem}
.ucs-v{font-size:1.2rem;font-weight:600;color:var(--n900);font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-.01em}
.ucs-x{font-size:.8rem;font-weight:400;color:var(--n600)}
.ucs-l{font-family:var(--mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.07em;color:var(--n600)}
.uchart-plot{position:relative}
.uc-svg{width:100%;height:auto;display:block;overflow:visible}
.uc-peak{fill:#5674e1;stroke:var(--n50);stroke-width:1.6}
.uc-today{fill:var(--n50);stroke:#5674e1;stroke-width:2}
.uc-cline{stroke:var(--n300);stroke-width:1;stroke-dasharray:3 3}
.uc-cdot{fill:#5674e1;stroke:var(--n50);stroke-width:1.6}
.uc-tip{position:absolute;pointer-events:none;background:var(--n900);color:var(--n50);border-radius:var(--radius);padding:.32rem .55rem;white-space:nowrap;display:flex;flex-direction:column;gap:.05rem;transition:opacity .12s;z-index:6;box-shadow:var(--shadow-2)}
.uc-tip b{font-size:.74rem;font-weight:600;font-variant-numeric:tabular-nums;font-family:var(--mono)}
.uc-tip span{opacity:.7;font-size:.55rem;text-transform:uppercase;letter-spacing:.05em;font-family:var(--mono)}
@media(max-width:760px){.usage-card{grid-template-columns:1fr}}
.dk-ren{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;color:var(--n600);background:none;border:1px solid transparent;cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius);margin-right:.2rem}
.dk-ren:hover{border-color:var(--n600);color:var(--n900)}
.cf-box{margin:0 0 .7rem;min-height:1px}
.oauth-row{display:grid;grid-template-columns:1fr;gap:.55rem;margin-bottom:.2rem}
.oauth-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:2.7rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50);color:var(--n900);font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.03em;transition:border-color .15s,background .15s}
.oauth-btn:hover{border-color:var(--n900);background:var(--n100)}
.oauth-ic{display:inline-flex;align-items:center}
/* connected accounts (dashboard) */
.idn-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.7rem}
.idn-item{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--n50)}
.idn-ic{display:inline-flex;flex-shrink:0}
.idn-meta{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}
.idn-nm{font-weight:600;font-size:var(--text-sm)}
.idn-sub{font-size:.68rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.idn-unlink{flex-shrink:0;background:none;border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .7rem;font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.03em;color:var(--n600);cursor:pointer;transition:border-color .15s,color .15s}
.idn-unlink:hover{border-color:#d64545;color:#d64545}
.idn-connect-row{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem}
.idn-connect{justify-content:flex-start;padding:0 .9rem}
/* two-factor auth */
.tfa-panel{display:flex;gap:1.1rem;margin-top:.9rem;padding:1rem;background:var(--n100);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap}
.tfa-qr{width:150px;height:150px;border-radius:var(--radius);background:#fff;flex-shrink:0}
.tfa-steps{flex:1;min-width:14rem;display:flex;flex-direction:column;gap:.6rem}
.tfa-step{font-size:.76rem;color:var(--n900);line-height:1.4}
.tfa-secret{display:inline-block;align-self:flex-start;background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:.4rem .6rem;font-size:.8rem;letter-spacing:.05em;color:var(--n900)}
.tfa-verify{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.tfa-verify .auth-in{margin-bottom:0;max-width:9rem}
.tfa-verify .btn{white-space:nowrap}
.tfa-msg{font-family:var(--mono);font-size:.68rem;min-height:1rem}
.tfa-msg.err{color:var(--neg)}
.tfa-code-in{text-align:center;letter-spacing:.3em;font-size:1.05rem}
.ds-on{font-family:var(--mono);font-size:.56rem;background:#3f9e6d;color:#fff;padding:.12rem .38rem;border-radius:var(--radius);vertical-align:middle;letter-spacing:.08em}
/* passkeys · sessions · recovery codes · key status (account security) */
.ds-block{display:block}
.ds-full{width:100%}
.ds-count{display:inline-block;font-family:var(--mono);font-size:.6rem;background:var(--n100);color:var(--n600);border:1px solid var(--border);padding:.1rem .4rem;border-radius:calc(var(--radius) - 1px);vertical-align:middle;margin-left:.35rem}
.pk-list,.sess-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.8rem}
.pk-item,.sess-item{padding:.6rem .8rem;background:var(--n100);border:1px solid var(--border);border-radius:var(--radius)}
.pk-item{display:flex;align-items:center;gap:.7rem}
.pk-ic{color:var(--blue);font-size:1rem;flex-shrink:0;line-height:1}
.pk-meta,.sess-meta{display:flex;flex-direction:column;gap:.12rem;min-width:0}
.pk-meta{flex:1}
.pk-nm,.sess-nm{font-weight:600;font-size:.77rem;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-sub,.sess-sub{font-size:.64rem}
.pk-act{display:flex;gap:.3rem;flex-shrink:0}
.pk-ren,.pk-del,.dk-rot{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;background:none;border:1px solid transparent;cursor:pointer;padding:.22rem .45rem;border-radius:var(--radius)}
.pk-ren{color:var(--n600)}.pk-ren:hover{border-color:var(--n600);color:var(--n900)}
.pk-del{color:var(--neg)}.pk-del:hover{border-color:var(--neg)}
.dk-rot{color:var(--n600);margin-right:.2rem}.dk-rot:hover{border-color:var(--blue);color:var(--blue)}
.dk-off{opacity:.55}
.dk-revoked{font-family:var(--mono);font-size:.54rem;text-transform:uppercase;letter-spacing:.05em;color:var(--neg);border:1px solid var(--neg);border-radius:var(--radius);padding:.05rem .3rem;margin-left:.45rem;vertical-align:middle}
.rec-panel{margin-top:.8rem;padding:1rem 1.1rem;background:var(--lavender-lt);border:1px solid var(--lavender);border-radius:var(--radius)}
.rec-h{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.04em;color:var(--n900);margin-bottom:.7rem}
.rec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem .8rem;margin-bottom:.8rem}
.rec-grid code{font-size:.8rem;letter-spacing:.06em;color:var(--n900);background:var(--n50);border:1px solid var(--border);border-radius:calc(var(--radius) - 1px);padding:.3rem .5rem;text-align:center}
.adm-badge.susp{background:var(--neg)}
.dash-usage-actions{display:flex;align-items:center;gap:.8rem}
@media(max-width:560px){.rec-grid{grid-template-columns:1fr}}
/* decorative block cluster — keyed to transparent, feathered into the hero right */
.hero{position:relative}
.hero .hero-content{position:relative;z-index:2}
/* Keep the decorative cluster clear of the hero tagline line at the
   bottom-right — at wide viewports the 28rem cap made it tall enough to reach the
   text (fine in Firefox, overlapped in Chromium/Brave). Smaller cap + a touch
   higher keeps it clear across browsers; it's hidden < 900px anyway. */
.hero-blocks{position:absolute;right:calc(1.5% + 12px);top:calc(4% + 28px);width:min(22rem,26%);z-index:1;pointer-events:none}
.hero-blocks img{display:block;width:100%;height:auto;position:relative;z-index:1;opacity:.95}
.hero-blocks-glow{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);width:76%;height:38%;z-index:0;
  background:radial-gradient(ellipse at center,rgba(86,116,225,.5),rgba(89,179,212,.24) 42%,transparent 72%);filter:blur(30px)}
@media(max-width:900px){.hero-blocks{display:none}}
/* tx-history stacked cubes */
/* By Day table — reasonable scrollable height with a sticky header */
.byday-scroll{max-height:min(74vh,820px);overflow-y:auto}
.byday-scroll thead th{position:sticky;top:0;z-index:1;background:var(--n50)}
/* reward-chart loading — matches the validator .val-loading spinner for consistency */
.feat-loading{display:flex;align-items:center;gap:.85rem;padding:2rem .3rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;color:var(--n600);min-height:9rem}
/* side-by-side chart cards: loaders center in the card so paired placeholders
   sit flush with each other regardless of the host container */
.feat-charts .feat-loading{margin:auto;padding:1rem 0;min-height:0;justify-content:center}
.feat-loading .spinner{transform:scale(.72);transform-origin:left center;flex-shrink:0}

/* ================================================================
   Mobile / tablet responsive polish — consolidated from a
   multi-surface audit. Trailing block: later cascade intentionally
   wins at equal specificity. Grouped by concern.
   ================================================================ */

/* Copy-to-clipboard: enlarge the tap target ~24px without moving it. */
.copy{padding:.35rem;margin:-.35rem -.15rem}

/* Featured apps: remove the grey band (stray .card margin painted over the
   grid's border-colour bg) and let the table scroll instead of crushing. */
.feat-charts .feat-chart{margin-bottom:0}
@media(max-width:760px){
  .feat-table{min-width:44rem}
  .feat-toggle button{padding:.7rem 1.1rem}
  .feat-handle{font-size:.66rem}
  .apps-search{width:100%}
}
@media(max-width:479px){
  .feat-table th:nth-child(3),.feat-table td:nth-child(3),
  .feat-table th:nth-child(5),.feat-table td:nth-child(5){display:none}
  .feat-table{min-width:23rem}
  .feat-app{min-width:8.5rem}
  .feat-share{width:6rem}
}

/* Validator card: never break numbers mid-digit; collapse the split card at
   iPad-portrait (was only ≤760, so 768 shattered), stack label/value narrow. */
.val-kv .num{overflow-wrap:normal;word-break:normal}
@media(max-width:900px){.val-layout{grid-template-columns:1fr}}
@media(max-width:560px){
  .val-kv{grid-template-columns:1fr}
  .val-kv>div:nth-child(odd){border-bottom:none;padding-bottom:0}
  th.c-svurl,td.c-svurl{display:none}   /* SV name becomes the link; drop the identical-prefix url col */
}

/* Party hero: wrap the role badge to its own row so the name stays whole. */
@media(max-width:560px){
  .hero-party{flex-wrap:wrap;row-gap:.5rem}
  .hero-party .val-badge-wrap{flex-basis:100%;margin-left:0}
  .hero-party h1{font-size:clamp(1.55rem,6vw,2.05rem)}
}

/* Hero content left edge aligns with the sections below it; wider body on
   tablet where the block image is hidden. */
@media(max-width:991px){
  .hero .sec-pad{padding:0 1rem}
  .hero-body{max-width:42em}
}

/* Standard data tables: reclaim cell padding so the 9-digit seq fits; larger
   filter controls; cap over-wide low-value columns. */
@media(max-width:640px){
  th,td{padding-left:.7rem;padding-right:.7rem}
  th.c-seq,td.c-seq{width:6.4rem}
  .filters select,.filters input,.toggle{height:2.75rem}
  #alist table th:last-child,#alist table td:last-child{width:4.75rem}
}
@media(max-width:479px){
  #plist table th:nth-child(2),#plist table td:nth-child(2){display:none}
  .page-hero{padding:2.2rem 0 1.2rem}
  .hero-content .sec-desc{margin-bottom:1rem}
  .sec-pad .stats{margin-top:1.25rem}
  .byday-scroll th,.byday-scroll td{padding-left:.55rem;padding-right:.55rem}
  .byday-scroll th{letter-spacing:.3px}
}

/* Pricing / auth: don't strand the single card column on tablet; touch-safe
   oauth + checkout padding; drop redundant dashboard-key columns on phones. */
.oauth-btn{min-height:44px}
@media(min-width:600px) and (max-width:900px){.pricing-grid{max-width:34rem}}
@media(max-width:600px){.checkout-panel{padding:1rem}}
@media(max-width:640px){
  .dash-keys th:nth-child(3),.dash-keys td:nth-child(3),
  .dash-keys th:nth-child(5),.dash-keys td:nth-child(5){display:none}
  /* webhooks table is 5-col (Party·Endpoint·Status·Last delivery·Actions): drop only
     "Last delivery" on mobile so Status AND the action buttons stay reachable. */
  .dash-wh th:nth-child(4),.dash-wh td:nth-child(4){display:none}
}

/* Print / reader / crawler: reveal-gated content must never render blank. */
.print-only{display:none}
.receipt-head{font-family:var(--mono);font-size:.82rem;letter-spacing:.02em;padding:.2rem 0 1rem;border-bottom:1px solid var(--border);margin-bottom:1.1rem}

@media print{
  .reveal{opacity:1!important;transform:none!important}
  .byday-scroll{max-height:none;overflow:visible}
  pre.json.collapsed{max-height:none;-webkit-mask-image:none;mask-image:none;overflow:visible}
  /* receipt mode: strip the app chrome so a tx page prints as a clean record */
  .nav,.subnav,.footer,.footer-cta,.divider,.spacer-line,.back-link,.pager,.copy,.no-print,.skip-link{display:none!important}
  .print-only{display:block!important}
  .page-hero{padding:1rem 0;background:none}
  .hero-bg{display:none}
  body{background:#fff}
  #view{min-height:0}
}

/* Mobile nav account controls — MUST come after the base .nav-acct (l.~1014)
   and .nav-mob-acct (l.~1030) rules, which appear late in this file, or source
   order lets them win. Hide the header Sign-in on mobile; show it in the menu. */
@media(max-width:991px){
  .nav-acct{display:none}
  .nav-mob-acct{display:block}
}

/* ---- validators · live "collecting now" filmstrip ---------------------- */
.vcol-sec{padding-top:1.15rem;padding-bottom:.4rem}
.vcol-eyebrow{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;font:600 .7rem/1 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--n900);margin-bottom:.75rem}
.vcol-eyebrow .live_dot{position:relative;top:1px}
.vcol-sub{font-weight:500;letter-spacing:.01em;text-transform:none;color:var(--n600);font-size:.72rem}
.vcol-strip{display:flex;flex-flow:row nowrap;gap:.6rem;align-items:stretch;overflow:hidden;min-height:82px;padding:4px 2px;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
.vcol-idle{align-self:center;color:var(--n600);font:500 .78rem var(--mono);padding:1.5rem .2rem}
.vcol-card{position:relative;flex:0 0 auto;width:238px;display:flex;gap:.55rem;align-items:center;padding:.6rem .7rem;border:1px solid var(--n200);border-radius:calc(var(--radius) * 2);background:var(--n50);text-decoration:none;color:inherit;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,opacity .44s ease}
.vcol-card:hover{transform:translateY(-2px);border-color:#c7d0e8;box-shadow:0 8px 22px -12px rgba(40,55,110,.35)}
.vcol-in{opacity:0;transform:translateX(-16px) scale(.96)}
.vcol-idn{flex:0 0 auto;line-height:0}
.vcol-idn svg,.vcol-idn img,.vcol-idn>*{width:32px;height:32px;border-radius:5px;display:block}
.vcol-meta{min-width:0;display:flex;flex-direction:column;gap:.24rem;flex:1 1 auto}
.vcol-nm{font:600 .78rem var(--font);color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vcol-row2{display:flex;align-items:center;gap:.4rem}
.vcol-amt{font:700 .82rem var(--mono);color:var(--blue-d);white-space:nowrap;margin-left:auto}
.vcol-amt .unit{font-size:.6rem;color:var(--n600);font-weight:600;margin-left:.14rem}
.vcol-kind{font:700 .57rem var(--mono);letter-spacing:.04em;text-transform:uppercase;padding:.13rem .34rem;border-radius:5px;white-space:nowrap;display:inline-flex;align-items:center;gap:.08rem}
.vcol-plus{font-style:normal;opacity:.7;font-weight:800}
.vk-val{color:#3d5bd1;background:rgba(86,116,225,.13)}
.vk-app{color:#227a9c;background:rgba(89,179,212,.17)}
.vk-sv{color:#8a6a00;background:rgba(243,255,151,.45)}
.vk-un{color:var(--n600);background:rgba(120,125,140,.12)}
.vcol-row3{display:flex;align-items:center;gap:.3rem;font:500 .62rem var(--mono);color:var(--n600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vcol-dot2{opacity:.5}
.vcol-new{border-color:transparent;background:linear-gradient(var(--n50),var(--n50)) padding-box,linear-gradient(120deg,rgba(86,116,225,.6),rgba(89,179,212,.6)) border-box;box-shadow:0 10px 26px -14px rgba(60,91,209,.5)}
.vcol-new::after{content:"";position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--blue);animation:vcolPulse 1.8s infinite}
@keyframes vcolPulse{0%{box-shadow:0 0 0 0 rgba(86,116,225,.5)}70%{box-shadow:0 0 0 7px rgba(86,116,225,0)}100%{box-shadow:0 0 0 0 rgba(86,116,225,0)}}
@media(prefers-reduced-motion:reduce){.vcol-card{transition:none}.vcol-in{opacity:1;transform:none}.vcol-new::after{animation:none}}
@media(max-width:640px){.vcol-card{width:214px}.vcol-strip{-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent);mask-image:linear-gradient(90deg,#000 90%,transparent)}}

/* ---- validators · compact hero + live-collection card ------------------ */
.page-hero.vhero{padding:1.5rem 0 .6rem}
.vhero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(248px,328px);gap:2.4rem;align-items:center}
.vhero-main{min-width:0}
.vhero-main h1{margin:.1rem 0 0}
.vhero-stats{display:flex;gap:2.1rem;flex-wrap:wrap;margin-top:.95rem}
.vhero-live{position:relative;display:flex;flex-direction:column;gap:.6rem;padding:1rem 1.15rem;border-radius:calc(var(--radius) * 2);background:linear-gradient(var(--n50),var(--n50)) padding-box,linear-gradient(100deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1) border-box;background-size:100% 100%,300% 100%;border:1.6px solid transparent;animation:auroraMorph 8s ease-in-out infinite}
.vlc-top{display:flex;align-items:center;font:600 .6rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--n600)}
.vlc-body{display:flex;align-items:center;gap:.7rem;min-height:40px}
.vlc-wait{font:500 .76rem var(--mono);color:var(--n600)}
.vlc-idn{flex:0 0 auto;line-height:0}
.vlc-idn svg,.vlc-idn img,.vlc-idn>*{width:40px;height:40px;border-radius:6px;display:block}
.vlc-meta{min-width:0;display:flex;flex-direction:column;gap:.2rem}
.vlc-nm{font:700 .95rem var(--font);color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.15}
.vlc-nm .cn-link{color:inherit}
.vlc-sub{display:flex;align-items:center;gap:.4rem}
.vlc-amt{font:700 .8rem var(--mono);color:var(--blue-d)}
.vlc-amt .unit{font-size:.58rem;color:var(--n600);font-weight:600;margin-left:.12rem}
.vlc-sub2{font:500 .61rem var(--mono);color:var(--n600)}
/* the validator with the latest reward pulses like a live-feed row, with the
   morphing-blue left edge — same treatment as the newest transaction */
tbody tr.feat-row.v-latest{animation:livePulse 2.6s ease-in-out infinite}
tbody tr.feat-row.v-latest td:first-child{position:relative}
tbody tr.feat-row.v-latest td:first-child::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1);background-size:100% 300%;animation:auroraMorphY 8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.vhero-live{animation:none}tbody tr.feat-row.v-latest{animation:none}tbody tr.feat-row.v-latest td:first-child::before{animation:none}}
@media(max-width:820px){.vhero-grid{grid-template-columns:1fr;gap:1.1rem}.vhero-live{max-width:340px}}

/* ---- validator directory: type badges + liveness dot ------------------- */
.vtype{align-self:flex-start;margin-top:.2rem;font:700 .54rem var(--mono);letter-spacing:.05em;text-transform:uppercase;padding:.08rem .34rem;border-radius:calc(var(--radius) * 2);white-space:nowrap;line-height:1.35}
.vt-val{color:#3d5bd1;background:rgba(86,116,225,.12)}
.vt-sv{color:#8a6a00;background:rgba(243,255,151,.45)}
.vt-app{color:#227a9c;background:rgba(89,179,212,.16)}
.vt-hist{color:var(--n600);background:var(--n200)}

/* ---- SV Locking (CIP-0105) ---- */
.lk-phase{font-family:var(--mono);font-size:.62rem;font-weight:400;text-transform:uppercase;letter-spacing:.1em;color:var(--n600);background:var(--n200);padding:.28rem .55rem;border-radius:var(--radius);vertical-align:middle;margin-left:.6rem;white-space:nowrap}
.lk-thr-row{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;padding:.85rem 1rem;margin:0 0 1.25rem;background:var(--n100);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--mono);font-size:.72rem}
.lk-thr-lbl{text-transform:uppercase;letter-spacing:.09em;color:var(--n600);margin-right:.35rem}
.lk-thr{background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:.24rem .5rem}
.lk-thr b{color:var(--n900)}
.lk-thr-note{color:var(--n600);margin-left:auto}
.lk-hist{opacity:.72}
.lk-off{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);background:var(--n100);border:1px dashed var(--border);border-radius:var(--radius);padding:.18rem .45rem}
.lk-verif{font-family:var(--mono);font-size:.58rem;text-transform:uppercase;letter-spacing:.04em;color:var(--pos,#2b9c6a);margin-left:.45rem;white-space:nowrap}
.lk-foot{color:var(--n600);font-size:.72rem;line-height:1.6;margin-top:1.1rem;max-width:60rem}
@media(max-width:640px){.lk-thr-note{margin-left:0;width:100%}}
/* clear the sticky search bar on load */
.lk-page{padding-top:1.25rem}
/* desktop keeps its even column distribution; narrow screens swipe horizontally */
.lk-wrap{overflow-x:auto}
.lk-tbl{min-width:660px}
.lk-tbl th:first-child,.lk-tbl td:first-child{width:3.4rem;padding-left:.7rem;padding-right:.5rem}   /* fit two-digit ranks */
/* name truncates but the SV badge always renders fully (escapes the cell clip) */
.lk-sv-cell{display:flex;align-items:center;gap:.45rem;overflow:hidden}
.lk-sv-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.lk-tbl .vtype{flex:0 0 auto;align-self:center;margin-top:0}
.lk-lock-c{text-align:right}
.lk-tbl .amount i{margin-left:.16em}
.lk-page .stat-v i{margin-left:.16em}
/* ---- watchlist watch/star button ---- */
.watch-btn{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);background:var(--n50);border:1px solid var(--border);border-radius:var(--radius);padding:.3rem .6rem;cursor:pointer;vertical-align:middle;transition:color .15s,border-color .15s,background .15s}
.watch-btn:hover{color:var(--n900);border-color:var(--n600)}
.watch-btn.on{color:#8a6a00;background:rgba(243,255,151,.35);border-color:rgba(243,255,151,.85)}
.watch-btn svg{flex:none}
.watch-btn.on svg{fill:#cdd9ff;stroke:#8a6a00}
.watch-btn:disabled{opacity:.55;cursor:default}
/* dashboard watchlist card */
.wl-item{display:flex;align-items:center;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--n200)}
.wl-item:last-child{border-bottom:none}
.wl-item .wl-ref{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:.8rem}
.wl-item .wl-kind{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--n600);flex:none;min-width:4.5rem}
.wl-rm{flex:none;background:none;border:none;color:var(--n600);cursor:pointer;font-size:1.05rem;line-height:1;padding:.35rem .5rem;transition:color .15s}
.wl-rm:hover{color:var(--neg)}
.wl-empty{color:var(--n600);font-size:.8rem;padding:.5rem 0}
/* wallet-provenance label on the tx flow sub-line — flex:none so it survives the
   description's ellipsis (the sender's counterparty names are long) */
.via-wallet{flex:none;color:#227a9c;white-space:nowrap}
/* ⌘K hint on the search bar — opens the existing command palette */
.search-kbd{position:absolute;right:.85rem;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:.62rem;color:var(--n600);background:var(--n100);border:1px solid var(--border);border-radius:var(--radius);padding:.14rem .4rem;cursor:pointer;transition:color .15s,border-color .15s}
.search-kbd:hover{color:var(--n900);border-color:var(--n600)}
@media(min-width:641px){.subnav .search{padding-right:3.6rem}}   /* room for the ⌘K hint */
@media(max-width:640px){.search-kbd{display:none}}
.v-live{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--n300);margin-right:.45rem;vertical-align:middle;flex:none}
.v-live.on{background:#4caf6d}
.v-lastact{white-space:nowrap}

/* ---- API keys: live "in use" pulse (key served a request in the last ~10s) --- */
tbody tr.key-live{animation:livePulse 2.6s ease-in-out infinite}
tbody tr.key-live td:first-child{position:relative}
tbody tr.key-live td:first-child::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#5674e1,#59b3d4,#a7b1d4,#c6d2ff,#5674e1);background-size:100% 300%;animation:auroraMorphY 8s ease-in-out infinite}
.keys-inuse{color:var(--blue);font-weight:600}
.keys-inuse-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:.35rem;vertical-align:middle;animation:pulse 2s infinite}
@media(prefers-reduced-motion:reduce){tbody tr.key-live{animation:none}tbody tr.key-live td:first-child::before{animation:none}.keys-inuse-dot{animation:none}}