/* terminal.css */
/* BLOCK_LAB — shared TERMINAL base for sub-pages (gallery / mine).
   Replaces the legacy style.css on those pages. Matches the homepage (index.css) look.
   CSP-safe: self-hosted fonts only (Space Mono / Inter / Archivo Black). */

:root{
  --acid:#CBF806; --red:#FF2E35; --wow:#FF2E35; --ink:#0e0f13; --bg:#0e0f13; --cream:#f7f6f2;
  --sky:#4fc3ff; --green:#2fe38a; --amber:#ffb02e; --ember:#ff7a18;
  --panel:#12141a; --panel2:#171a21; --line:#232734; --mut:#8a92a3; --dim:#5c6473; --txt:#c7ccd6;
  --wow-glow:rgba(203,248,6,.28);
  --mono:'Space Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --disp:'Archivo Black','Inter',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden;max-width:100%}
body{
  background:var(--ink); color:var(--txt); font-family:var(--sans);
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; min-height:100vh;
  background-image:
    linear-gradient(rgba(203,248,6,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(203,248,6,.018) 1px,transparent 1px);
  background-size:100% 26px,26px 100%;
}
::selection{background:var(--acid);color:var(--ink)}
a{color:var(--acid);text-decoration:none}
a:hover{text-decoration:none;opacity:.85}
.mono{font-family:var(--mono)}
.dim{color:var(--dim)} .green{color:var(--green)} .amb{color:var(--amber)}
.acid{color:var(--acid)} .red{color:var(--red)} .sky{color:var(--sky)}
img{max-width:100%}
h1,h2,h3{margin:0}

/* ================= HEADER / NAV (matches homepage nav) ================= */
header{
  position:sticky;top:0;z-index:70;background:rgba(10,11,14,.92);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  display:block;padding:0;font-family:var(--mono);
}
header .wrap{
  max-width:1120px;margin:0 auto;padding:0 18px;
  display:flex;align-items:center;gap:12px;height:56px;
}
.logo{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-weight:700;font-size:14px;
  letter-spacing:.3px;color:var(--acid);white-space:nowrap;text-decoration:none}
.logo img{width:22px;height:22px;border-radius:5px}
header .spacer{flex:1}
.lnk{font-family:var(--mono);font-size:13px;color:var(--txt);padding:8px 10px;border-radius:6px;transition:.14s;white-space:nowrap}
.lnk::before{content:'$ ';color:var(--dim)}
.lnk:hover{color:var(--acid);background:rgba(203,248,6,.06);opacity:1}
.lnk[aria-current="page"]{color:var(--acid)}
.net-pill{font-family:var(--mono);font-size:11px;color:var(--dim);border:1px solid var(--line);border-radius:6px;
  padding:6px 10px;display:flex;align-items:center;gap:7px;white-space:nowrap}
.net-pill.wrong-net{border-color:var(--red);color:#ff8a8f}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);flex:none;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* buttons */
button{font-family:var(--mono);cursor:pointer;border:1px solid var(--line);border-radius:6px;font-weight:700;
  padding:9px 15px;font-size:13px;letter-spacing:.3px;transition:.14s;background:var(--panel2);color:var(--txt)}
.btn,.btn-wow,.btn-ghost{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.3px;
  padding:9px 15px;border:1px solid var(--line);border-radius:6px;background:var(--panel2);color:var(--txt);
  cursor:pointer;transition:.14s;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.btn-wow{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.btn-wow:hover{transform:translateY(-1px);box-shadow:0 6px 20px var(--wow-glow)}
.btn-ghost:hover{border-color:var(--acid);color:var(--acid)}
button:hover{transform:translateY(-1px)}
button:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}
#darkToggle{display:none!important}   /* terminal is dark-only */

/* ================= STATUS / TAG BAR (homepage statusbar strip) ================= */
.tagbar{
  background:#0a0b0e;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:12px;color:var(--dim);
  text-align:center;padding:8px 16px;letter-spacing:.3px;
}
/* official scam-prevention notice */
.notice-band{background:linear-gradient(180deg,rgba(255,176,46,.11),rgba(255,176,46,.03));border-bottom:1px solid rgba(255,176,46,.4);font-family:var(--mono)}
.notice-band .wrap{display:flex;gap:14px;align-items:flex-start;max-width:1080px;margin:0 auto;padding:11px 18px}
.notice-band .nb-tag{flex:none;font-size:11px;font-weight:700;color:var(--ink);background:var(--amber);padding:4px 10px;border-radius:6px;letter-spacing:.05em;white-space:nowrap;margin-top:1px}
.notice-band .nb-text{font-size:13px;line-height:1.55;color:var(--txt);text-align:left}
.notice-band .nb-text b{color:var(--cream)} .notice-band .nb-text b.rd{color:var(--red)} .notice-band .nb-text b.amb{color:var(--amber)}
.notice-band .nb-sub{color:var(--dim);font-size:12px}
.notice-band .nb-x{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media(max-width:640px){.notice-band .wrap{flex-direction:column;gap:8px}}

/* ================= HERO / SECTION HEADINGS ================= */
.kicker{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;color:var(--dim);
  letter-spacing:1.4px;text-transform:uppercase;margin-bottom:10px}
.kicker::before{content:'▚';color:var(--acid)}
.h2{font-family:var(--disp);font-size:clamp(26px,4.6vw,42px);line-height:1.05;letter-spacing:-.5px;color:var(--cream);margin:0 0 10px}
.disp{font-family:var(--disp)}
h1.h2{font-weight:400}

/* ================= STATS (mine + shared) ================= */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px 15px;font-family:var(--mono)}
.stat .k{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.6px}
.stat .v{font-size:20px;font-weight:700;margin-top:5px;color:var(--cream)}
.stat .v.sm{font-size:14px}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stats{grid-template-columns:1fr}}

.section-h{display:flex;align-items:center;gap:10px;margin:18px 0 14px;font-family:var(--mono)}
.section-h h2{font-family:var(--disp);font-size:16px;margin:0;color:var(--cream);letter-spacing:0}
.section-h .sub{color:var(--dim);font-size:12px}
.section-h .spacer{flex:1}

/* ================= STATUS LINE ================= */
.status{margin:14px auto;max-width:640px;text-align:center;font-family:var(--mono);font-weight:700;font-size:13px;min-height:20px;color:var(--dim)}
.status.err{color:#ff8a8f} .status.ok{color:var(--green)} .status.work{color:var(--amber)}

/* ================= FOOT ================= */
.foot{margin-top:44px;text-align:center;color:var(--dim);font-family:var(--mono);font-size:12px;line-height:1.8}
.foot a{color:var(--txt)} .foot a:hover{color:var(--acid)}
.foot code{color:var(--mut)}

/* page content wrap (direct body child; header .wrap is overridden above) */
body > .wrap{max-width:1120px;margin:0 auto;padding:26px 18px 64px}

/* ================= MOBILE ================= */
@media(max-width:760px){
  header .wrap{height:auto;min-height:52px;flex-wrap:wrap;gap:8px;padding:8px 14px}
  .logo{font-size:13px}
  .lnk{padding:7px 8px;font-size:12px}
  .net-pill{display:none}
}
@media(prefers-reduced-motion:reduce){ .dot{animation:none} }

/* ============================================================
   BLOCKY / PIXEL-ARCADE TYPE — unified with homepage + /mine
   (Press Start 2P display + Space Mono body, balanced sizes)
   ============================================================ */
:root{ --pixel:'Press Start 2P','Space Mono',monospace; --orange:#ff6a1a;
       --disp:'Press Start 2P','Space Mono',monospace; }
body{ font-family:var(--mono) }                       /* Space Mono body, like /mine */
/* pixel display headings — smaller + roomy line-height so the chunky font stays balanced */
.h2,.disp,h1,h2,h3{ font-family:var(--pixel); text-transform:uppercase; letter-spacing:0; line-height:1.42 }
.h2{ font-size:clamp(18px,3.2vw,32px) }
.section-h h2{ font-size:13px; line-height:1.5 }
h3{ font-size:14px; line-height:1.55 }
.logo{ font-family:var(--pixel); font-size:13px; letter-spacing:0 }
.kicker,.badge,.eyebrow{ font-family:var(--pixel); font-size:10px; letter-spacing:1px }
/* blocky buttons: pixel font + hard shadow (matches /mine + homepage) */
button,.btn,.btn-wow,.btn-ghost{ font-family:var(--pixel); font-size:11px; letter-spacing:0;
  border-radius:5px; border-width:2px; box-shadow:4px 4px 0 rgba(0,0,0,.55); transition:transform .08s,box-shadow .08s }
button:hover,.btn:hover,.btn-wow:hover,.btn-ghost:hover{ transform:translate(2px,2px); box-shadow:2px 2px 0 rgba(0,0,0,.55) }
.lnk,.net-pill,.netpill{ font-family:var(--mono) }

/* webfonts/fonts.css */
/* latin-ext */
@font-face {
  font-family: 'Archivo Black';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/ArchivoBlack-400-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;
}
/* latin */
@font-face {
  font-family: 'Archivo Black';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/ArchivoBlack-400-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Bangers';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/Bangers-400-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;
}
/* latin */
@font-face {
  font-family: 'Bangers';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/Bangers-400-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/Inter-400-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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/Inter-400-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/webfonts/Inter-600-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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/webfonts/Inter-600-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/Inter-700-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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/Inter-700-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/webfonts/Inter-800-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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/webfonts/Inter-800-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/webfonts/Inter-900-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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/webfonts/Inter-900-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Luckiest Guy';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/LuckiestGuy-400-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;
}
/* latin */
@font-face {
  font-family: 'Luckiest Guy';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/LuckiestGuy-400-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/Nunito-700-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;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/Nunito-700-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/webfonts/Nunito-800-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;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/webfonts/Nunito-800-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/webfonts/Nunito-900-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;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/webfonts/Nunito-900-lat.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;
}
/* latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/webfonts/Orbitron-600-lat.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;
}
/* latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/Orbitron-700-lat.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;
}
/* latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/webfonts/Orbitron-800-lat.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;
}
/* latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/webfonts/Orbitron-900-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/SpaceMono-400-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;
}
/* latin */
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/SpaceMono-400-lat.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;
}
/* latin-ext */
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/SpaceMono-700-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;
}
/* latin */
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/webfonts/SpaceMono-700-lat.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;
}
/* pixel display — Press Start 2P (self-hosted; CSP font-src 'self') */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/webfonts/PressStart2P-400-lat.woff2) format('woff2');
}

/* nav.css */
/* BLOCK_LAB — one header for every app page: logo left, page links + Connect right. Self-contained. */
.topnav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;height:60px;padding:0 18px;
  background:rgba(0,0,0,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #22252d}
.tn-logo{display:flex;align-items:center;gap:9px;font-family:'Press Start 2P','Space Mono',monospace;font-size:12px;color:#f5f4f0;text-decoration:none;min-width:0;white-space:nowrap}
.tn-logo img{width:24px;height:24px;border-radius:5px}
.tn-logo b{color:#CBF806;font-weight:400}
.tn-logo span{color:#9aa0aa;font-family:'Space Mono',monospace;font-size:12px;margin-left:4px}
.tn-right{display:flex;align-items:center;gap:10px}
.tn-link{font-family:'Space Mono',monospace;font-weight:700;font-size:12px;color:#c7ccd6;text-decoration:none;border:1px solid #22252d;border-radius:999px;padding:9px 14px;white-space:nowrap;transition:color .15s,border-color .15s}
.tn-link:hover{color:#CBF806;border-color:rgba(203,248,6,.5)}
.tn-btn{font-family:'Press Start 2P','Space Mono',monospace;font-size:9px;padding:11px 14px;border-radius:999px;background:#CBF806;color:#0a0b0e;border:2px solid #CBF806;cursor:pointer;white-space:nowrap;line-height:1}
.tn-btn:hover{background:#d9ff2e}
.tn-btn.tn-conn{background:#0f1116;color:#CBF806}.tn-btn.tn-conn:hover{background:#2a2f3f;color:#ff6a1a}
.tn-btn.tn-conn{background:#0f1116;color:#CBF806}.tn-btn.tn-conn:hover{background:#2a2f3f;color:#ff6a1a}
@media(max-width:420px){.tn-logo span{display:none}.tn-link{padding:8px 11px;font-size:11px}.tn-btn{font-size:8px;padding:10px 12px}}
#bl-toasts{position:fixed;right:16px;bottom:16px;z-index:9999;display:flex;flex-direction:column;gap:8px;max-width:min(92vw,420px)}
.bl-toast{font-family:'Space Mono',monospace;font-size:12px;line-height:1.5;padding:12px 14px;border-radius:10px;border:2px solid #CBF806;background:#141a0c;color:#f4f6f0;box-shadow:0 10px 30px rgba(0,0,0,.5);animation:blt .25s ease-out}
.bl-toast.bad,.bl-toast.warn{border-color:#ff6a1a;background:#2a1206}.bl-toast.out{opacity:0;transform:translateY(6px);transition:all .4s}
@keyframes blt{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* persistent nav: current page + wallet menu */
.tn-right{position:relative;overflow:visible}
.tn-link.on{color:#CBF806;border-color:rgba(203,248,6,.55);background:rgba(203,248,6,.06)}
.tn-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:#0f1116;border:1px solid #2a2f3f;border-radius:12px;padding:8px;box-shadow:0 14px 34px rgba(0,0,0,.6);z-index:60}
.tn-menu.open{display:block}
.tn-menu-addr{font-family:'Space Mono',monospace;font-size:11px;color:#9aa0aa;padding:6px 8px 8px;word-break:break-all;border-bottom:1px solid #22252d;margin-bottom:6px}
.tn-menu-lab{font-family:'Space Mono',monospace;font-size:11px;color:#9aa0aa;padding:2px 8px 8px;border-bottom:1px solid #22252d;margin-bottom:6px}.tn-menu-lab b{color:#CBF806}.tn-menu-lab:empty{display:none}
.tn-menu-item{display:block;width:100%;text-align:left;font-family:'Space Mono',monospace;font-weight:700;font-size:12px;color:#f5f4f0;background:transparent;border:1px solid transparent;border-radius:8px;padding:9px 10px;cursor:pointer}
.tn-menu-item:hover{background:#2a1206;color:#ff6a1a;border-color:rgba(255,106,26,.5)}
@media(max-width:560px){.tn-right{gap:6px}.tn-link{padding:8px 9px;font-size:11px}.tn-logo span{display:none}}

/* ---- mobile: hamburger menu (CSS-only, checkbox toggle) ---- */
.tn-tog{display:none}
.tn-actions{display:flex;align-items:center;gap:8px;position:relative;order:3}
.tn-right{order:2;margin-left:auto}
.tn-burger{display:none;width:42px;height:42px;border:1px solid #22252d;border-radius:10px;background:#0f1116;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex:none}
.tn-burger span{display:block;width:18px;height:2px;background:#f5f4f0;border-radius:2px;transition:transform .2s,opacity .2s}
.tn-tog:checked ~ .tn-actions .tn-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.tn-tog:checked ~ .tn-actions .tn-burger span:nth-child(2){opacity:0}
.tn-tog:checked ~ .tn-actions .tn-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:760px){
  .topnav{flex-wrap:wrap;height:auto;min-height:60px;padding:9px 12px;gap:8px}
  .tn-actions{margin-left:auto;order:2}
  .tn-burger{display:flex}
  .tn-right{order:3;display:none;width:100%;flex-direction:column;align-items:stretch;gap:6px;padding:6px 0 4px;margin-left:0}
  .tn-tog:checked ~ .tn-right{display:flex}
  .tn-link{display:block;text-align:center;padding:11px 14px;font-size:12px}
  .tn-btn{font-size:9px;padding:11px 12px}
  .tn-menu{right:0;top:calc(100% + 8px)}
}

.bl-status{font-family:'Space Mono',monospace;font-size:12px;line-height:1.5;padding:8px 18px;border-bottom:1px solid #242838;color:#c9cfda;background:#12141a}.bl-status b{letter-spacing:.1em}.bl-status.demo{background:#2a1206;border-color:#5a2a10;color:#ffb98a}.bl-status.demo b{color:#ff6a1a}.bl-status.live{background:#0f1a13;border-color:#1f4a30;color:#9fd8b8}.bl-status.live b{color:#2fe38a}
[hidden]{display:none!important}
.bl-status .bl-sep{color:#3a4a3f;margin:0 6px}.bl-w.on{color:#2fe38a;font-weight:700}.bl-w.off{color:#ffb98a}

/* WALLET PICKER (2026-10-02): several injected wallets -> the player chooses */
.bl-pick{position:fixed;inset:0;z-index:95;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.bl-pick-box{background:#0c0e12;border:2px solid #CBF806;border-radius:14px;padding:18px;width:min(380px,100%);box-shadow:0 0 40px rgba(203,248,6,.25)}
.bl-pick-h{font-family:'Press Start 2P','Space Mono',monospace;font-size:11px;color:#f4f6f0;margin-bottom:8px}
.bl-pick-s{font-family:'Space Mono',monospace;font-size:11px;color:#9aa3b5;line-height:1.5;margin-bottom:12px}
.bl-pick-btn{display:flex;align-items:center;gap:12px;width:100%;margin-top:8px;padding:10px 12px;border-radius:10px;border:1px solid #2a2f3a;background:#13161c;color:#f4f6f0;font-family:'Space Mono',monospace;font-size:13px;cursor:pointer;text-align:left}
.bl-pick-btn:hover{border-color:#CBF806}.bl-pick-btn img{width:28px;height:28px;border-radius:7px}
.bl-pick-cancel{margin-top:12px;background:transparent;border:0;color:#9aa3b5;font-family:'Space Mono',monospace;font-size:11px;cursor:pointer;text-decoration:underline}

/* gallery.css */
.gwrap{max-width:1100px;margin:0 auto;padding:16px 18px}
.gpanel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:14px}
.ghdr{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acid);margin-bottom:10px}

/* stats strip */
.gstats{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:14px}
.gs{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;text-align:center}
.gs .k{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:5px}
.gs b{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:12px;color:var(--acid)}
.gs.burn b{color:#ff6a1a}

.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filters select,.filters input{background:#0a0b0e;color:var(--cream);border:1px solid var(--line);border-radius:8px;
  padding:9px 11px;font-size:13px;font-family:var(--mono);font-weight:700}
.filters input{min-width:250px;flex:1 1 250px}
.filters select{cursor:pointer}
.chk{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:12px;color:var(--cream);border:1px solid var(--line);border-radius:8px;padding:8px 11px;cursor:pointer}
.chk input{accent-color:#CBF806}
.gcount{margin-left:auto;color:var(--dim);font-size:12px;font-weight:700;font-family:var(--mono)}

/* DEAD as of 2026-09-19: the core legend was removed from gallery.js — nine tiles duplicating the
   "All cores" select. No .html or served .js emits class="legend" any more. Kept, not deleted,
   because this tree has no version control; delete freely once it does. */
.legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:6px;margin-bottom:14px}
.lg{display:flex;align-items:center;gap:7px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px;cursor:pointer;text-align:left;color:inherit;font:inherit}
.lg:hover{border-color:var(--acid)}
.lg img{width:48px;height:48px;border-radius:5px;flex:none;image-rendering:pixelated}
.lg span{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.lg b{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:8px}
.lg i{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.gstatus{text-align:center;color:var(--dim);font-family:var(--mono);font-size:12px;padding:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.gcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:block;
  text-decoration:none;color:inherit;transition:transform .08s,border-color .12s}
.gcard:hover{transform:translateY(-2px);border-color:var(--acid)}
.gcard.t-leg{border-color:rgba(255,213,74,.6)}.gcard.t-epic{border-color:rgba(199,125,255,.55)}.gcard.t-rare{border-color:rgba(90,209,255,.5)}
.gcard.sealed .gart{opacity:.85}
.gart{width:100%;aspect-ratio:1;background:#06070b;display:block;object-fit:cover;image-rendering:pixelated;-webkit-user-drag:none;user-select:none}
.gmeta{padding:9px 10px;font-size:12px;font-family:var(--mono)}
.gid{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:10px;color:var(--cream)}
.grar{float:right;font-weight:700;font-family:var(--pixel,'Press Start 2P'),monospace;font-size:10px}
.gkind{margin-top:6px;color:var(--cream)}
.gkind b{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:9px}
.gtr{color:var(--dim);margin-top:3px;line-height:1.5}
.feather{color:#CBF806}
.gown{margin-top:6px;font-size:11px;color:var(--sky);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.gcol{color:var(--acid);border:1px solid rgba(203,248,6,.35);border-radius:100px;padding:1px 7px;font-size:10px}

/* tiers + kind colours */
.leg{color:#ffd54a}.epic{color:#c77dff}.rare{color:#5ad1ff}.com{color:var(--dim)}
.kc0{color:#CBF806}.kc1{color:#8a9a6a}.kc2{color:#b06cff}.kc3{color:#f2b632}.kc4{color:#8fd9ff}.kc5{color:#c9662a}.kc6{color:#3a7bff}.kc7{color:#ff6a1a}.kc8{color:#ff3b3b}

.more{display:block;margin:16px auto;padding:11px 20px}
.empty{text-align:center;color:var(--dim);padding:50px 20px;font-weight:700;font-family:var(--mono)}
.empty .disp{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:14px;line-height:1.6;color:var(--acid);display:block;margin-bottom:12px;text-transform:uppercase}
.empty a{color:var(--acid)}

@media(max-width:900px){.gstats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){
  .filters input{min-width:0;flex:1 1 100%}
  .filters select,.chk{flex:1 1 46%}
  .gstats{grid-template-columns:repeat(2,1fr)}
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
}
.chk input{min-width:0;flex:none;width:16px;height:16px;padding:0;margin:0}
.gwrap{padding-top:14px}
/* Battle record badge on a card. Sits beside the power badge; only drawn when the block has won at
   least once, so an unblooded block shows nothing rather than a zero. */
.gwin{float:right;margin-right:8px;font-weight:700;font-family:var(--pixel,'Press Start 2P'),monospace;font-size:10px;color:#ffb020}
/* CSP on this site is style-src 'self' with NO unsafe-inline, so an inline style attribute and any
   element.style assignment are both silently dropped. Visibility has to be a class. */
.is-off{display:none !important}

/* findings 04-06, 20: larger cards, identity + power + ownership first, a skeleton while loading */
.ghead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ghead .gid{font-size:13px}.gpw{font-family:var(--pixel,'Press Start 2P'),monospace;font-size:12px;font-weight:700}
.gtier{margin-top:8px;font-size:13px;color:var(--cream)}.gmeta .gkind{font-size:12px}.gmeta .gtr{font-size:12px}
.gown{font-size:12px}.gyou{color:#0b0c10;background:#2fe38a;border-radius:4px;padding:1px 6px;font-weight:700}
.gcard.gmine{border-color:#2fe38a}
.gview{display:inline-block;margin-top:10px;font-size:12px;font-weight:700;color:var(--acid,#CBF806)}
.gcard:hover .gview,.gcard:focus-visible .gview{text-decoration:underline}
.gcard.gsk{pointer-events:none}.gcard.gsk .gart{aspect-ratio:1/1;background:linear-gradient(90deg,#171a21,#232734,#171a21);background-size:200% 100%;animation:gsk 1.3s linear infinite}
.gcard.gsk i{display:block;height:12px;margin:8px 0;border-radius:6px;background:#1b1e27}.gcard.gsk i:nth-child(1){width:40%;height:14px}.gcard.gsk i:nth-child(2){width:75%}.gcard.gsk i:nth-child(3){width:55%}
@keyframes gsk{0%{background-position:200% 0}100%{background-position:-200% 0}}
.gerr{grid-column:1/-1;font-family:var(--mono);font-size:13px;line-height:1.6;color:#ffb98a;background:#1c0f07;border:1px solid #7a3a14;border-radius:12px;padding:16px}
.gretry{margin-left:6px;font:inherit;font-weight:700;color:#0b0c10;background:#CBF806;border:0;border-radius:8px;padding:5px 10px;cursor:pointer}
/* TIERS AT A GLANCE (2026-10-01): a legendary block and a common block must read differently from across the room */
.gcard.t-leg{box-shadow:0 0 0 1px rgba(255,213,74,.35),0 0 22px rgba(255,213,74,.28);position:relative;isolation:isolate}
.gcard.t-leg::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;box-shadow:0 0 34px rgba(255,213,74,.55);animation:fxglow 2.6s ease-in-out infinite}
.gcard.t-epic{box-shadow:0 0 0 1px rgba(199,125,255,.3),0 0 16px rgba(199,125,255,.22)}
.gcard.t-rare{box-shadow:0 0 10px rgba(90,209,255,.14)}
@media (prefers-reduced-motion:reduce){.gcard.t-leg::after{animation:none;opacity:.6}}

/* 04 (2 Oct): five columns inside the 1100 px container, fewer on narrow screens */
.grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1000px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* five columns (2 Oct): the war badge gets its own line, the owner address never splits */
.gwin{float:none;display:block;margin:4px 0 0}
.gown{white-space:nowrap}

/* 2026-10-03 SEO: the page heading */
.g-h1{grid-column:1/-1;font-family:'Press Start 2P',monospace;font-weight:400;font-size:14px;line-height:1.6;margin:4px 0 10px;color:#e8edf5}.g-h1 span{font-family:'Space Mono',monospace;font-size:11px;color:#8a919c}

/* util.css */
/* !important reproduces the precedence the inline styles had: a plain class loses to a more specific
   selector, an inline style never did. The three declarations WITHOUT it (.u34 opacity, .u38 display,
   .u53 color) are the ones this page sets from JavaScript at runtime -- !important there would outrank
   el.style.* and silently kill the behaviour (invisible mosaic, stuck 'load more', errors not red). */
/* Utility classes replacing inline style attributes, so the CSP no longer needs
   style-src 'unsafe-inline'. Linked last on every page: an inline style used to beat
   stylesheet rules, so these must not lose to an equally specific earlier rule. */
.u1{height:26px !important;width:26px !important;vertical-align:-7px !important;margin-right:7px !important}
.u2{width:100% !important;max-width:460px !important;display:block !important;margin:0 auto !important;border:6px solid var(--ink) !important;border-radius:26px !important;box-shadow:12px 12px 0 var(--ink) !important}
.u3{margin-top:16px !important}
.u4{background:var(--red) !important;transform:rotate(-2deg) !important}
.u5{font-size:clamp(34px,5.6vw,58px) !important}
.u6{max-width:66ch !important;margin:6px 0 2px !important;font-weight:800 !important;font-size:clamp(15px,2.2vw,18px) !important;opacity:.85 !important}
.u7{opacity:.7 !important}
.u8{margin-top:24px !important;border:3px solid var(--ink) !important;border-radius:16px !important;background:var(--paper) !important;box-shadow:6px 6px 0 var(--ink) !important;padding:24px 26px !important;text-align:center !important}
.u9{font-family:var(--disp,'Bangers',cursive) !important;font-size:clamp(26px,5vw,46px) !important;line-height:1 !important}
.u10{color:#12b886 !important}
.u11{color:var(--red) !important}
.u12{font-family:'Nunito',sans-serif !important;font-weight:800 !important;font-size:clamp(15px,2.2vw,19px) !important;margin-top:10px !important;max-width:52ch !important;margin-left:auto !important;margin-right:auto !important}
.u13{font-family:'Luckiest Guy',cursive !important;color:var(--red) !important;font-size:18px !important;margin-top:12px !important}
.u14{margin-top:20px !important;border:3px solid var(--ink) !important;border-radius:16px !important;background:var(--panel) !important;box-shadow:6px 6px 0 var(--ink) !important;padding:24px 26px !important}
.u15{display:inline-block !important;background:var(--green,#12b886) !important;color:#fff !important;font-weight:800 !important;font-size:12px !important;letter-spacing:.08em !important;text-transform:uppercase !important;padding:5px 11px !important;border-radius:7px !important}
.u16{font-family:var(--disp,'Bangers',cursive) !important;font-size:clamp(24px,4.5vw,40px) !important;line-height:1.05 !important;margin-top:12px !important}
.u17{font-family:'Nunito',sans-serif !important;font-weight:700 !important;font-size:clamp(14px,2vw,17px) !important;margin-top:10px !important;max-width:62ch !important}
.u18{color:var(--mut) !important}
.u19{display:inline-block !important;margin-top:14px !important}
.u20{display:flex !important;flex-wrap:wrap !important;gap:10px !important;align-items:center !important;margin:2px 0 8px !important}
.u21{display:inline-block !important;background:#12b886 !important;color:#fff !important;font-weight:800 !important;font-size:12px !important;letter-spacing:.08em !important;text-transform:uppercase !important;padding:5px 11px !important;border-radius:7px !important}
.u22{font-weight:800 !important}
.u23{font-size:16px !important;padding:6px 14px !important;box-shadow:4px 4px 0 var(--ink) !important}
.u24{height:24px !important;width:24px !important;vertical-align:-6px !important;margin-right:6px !important}
.u25{background:var(--panel) !important;border:1px solid var(--line) !important;border-radius:14px !important;padding:22px !important;margin:6px 0 !important;text-align:center !important}
.u26{font-size:11px !important;letter-spacing:.16em !important;text-transform:uppercase !important;color:var(--mut) !important}
.u27{font-family:var(--disp,'Bangers','Luckiest Guy',cursive) !important;color:var(--wow,#ff2e35) !important;font-size:clamp(34px,6vw,52px) !important;line-height:1.1 !important;margin:8px 0 !important}
.u28{color:var(--mut) !important;font-size:12px !important}
.u29{margin:16px 0 !important;text-align:center !important}
.u30{background:var(--panel) !important;border:1px dashed var(--line) !important;border-radius:14px !important;padding:40px 22px !important;margin:6px 0 !important;text-align:center !important}
.u31{font-size:34px !important}
.u32{font-weight:800 !important;margin-top:8px !important}
.u33{color:var(--mut) !important;font-size:13px !important;margin-top:6px !important}
.u34{opacity:0}
.u35{font-weight:700 !important;margin:6px 0 !important}
.u36{font-size:15px !important}
.u37{display:flex !important;gap:10px !important;justify-content:center !important;margin-top:12px !important}
.u38{display:none}
.u39{text-align:center !important;margin:18px 0 2px !important}
.u40{margin:6px 0 !important}
.u41{max-width:64ch !important;margin:8px auto !important;color:var(--mut) !important;font-weight:600 !important}
.u42{font-family:var(--disp,'Bangers',cursive) !important;font-size:24px !important;margin:18px 0 2px !important}
.u43{text-align:center !important;margin:14px 0 2px !important}
.u44{max-width:60ch !important;margin:8px auto !important;color:var(--mut) !important;font-weight:600 !important}
.u45{margin-top:26px !important}
.u46{text-align:center !important}
.u47{font-family:var(--disp,'Bangers',cursive) !important;font-size:26px !important;margin:0 !important;color:var(--wow) !important}
.u48{color:var(--mut) !important;font-weight:700 !important;font-size:13px !important}
.u49{color:#cbf806 !important;font-weight:800 !important}
.u50{max-width:620px !important;margin:10px auto 0 !important;border:1px solid var(--line) !important;border-radius:14px !important;background:var(--panel) !important;padding:16px !important}
.u51{font-family:var(--disp,'Bangers',cursive) !important;font-size:26px !important;margin:0 0 8px !important}
.u52{text-align:center !important;margin:16px 0 2px !important}
.u53{color:var(--mut);font-weight:700 !important;margin:10px 0 14px !important}
.u54{margin-top:8px !important}
.u55{margin-top:12px !important;font-size:13px !important;color:var(--mut) !important}
.u56{color:var(--mut) !important;font-weight:700 !important;font-size:13px !important;margin-top:4px !important}
.u57{font-family:var(--disp,'Bangers',cursive) !important;font-size:24px !important;margin:20px 0 4px !important;text-align:center !important}


/* styles JavaScript used to write inline (wallet.js) - blocked by style-src 'self', so they are
   classes now. NO: the page sets el.style.* at runtime and would beat it. */
.u-08b6931{color:var(--mut) !important;font-size:13px !important;font-weight:600 !important;margin-top:16px !important;text-align:center !important;border-top:1px solid var(--line) !important;padding-top:12px !important}
.u-10dbc5a{color:var(--mut) !important;font-weight:700 !important;font-size:12px !important}
.u-13076d9{text-align:center !important}
.u-553a645{margin-top:14px !important}
.u-87cd1cf{text-align:center !important;margin-top:16px !important}
.u-8f9e15f{color:var(--mut) !important;font-size:12px !important;margin-top:6px !important}
.u-b5df232{color:inherit !important}
.u-f040f72{text-align:center !important;margin-bottom:6px !important}
.u-fdeb3e6{padding:3px 9px !important;font-size:11px !important}

/* fx.css */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* BLOCK_LAB — ⚡ BADASS MODE (shared FX layer: scanlines, vignette, neon glow, glitch, embers, pulse). CSP-safe. */
.fxtoggle{display:inline-flex;align-items:center;gap:6px;font-family:'Space Mono','Consolas',monospace;font-size:11px;font-weight:700;letter-spacing:.06em;color:#CBF806;background:transparent;border:1.5px solid rgba(203,248,6,.45);border-radius:999px;padding:8px 12px;cursor:pointer;white-space:nowrap}
.fxtoggle:hover{border-color:#CBF806}
body.badass .fxtoggle{background:rgba(203,248,6,.12);box-shadow:0 0 14px rgba(203,248,6,.35)}

/* CRT scanlines + vignette */
body.badass::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 2px,transparent 2px 4px);opacity:.55}
body.badass::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:59;
  background:radial-gradient(130% 100% at 50% 40%,transparent 62%,rgba(0,0,0,.55) 100%)}

/* neon */
/* The glow used to be a box-shadow KEYFRAME: an infinite animation that repaints the element on the
   main thread every frame, on every pill and button at once, for as long as the page is open. It now
   sits on a pseudo-element whose only animated property is opacity - the compositor handles that
   alone, and the main thread is left for the miner, the wallet and scrolling. Same look. */
body.badass .pill,body.badass .btn.o{position:relative;isolation:isolate}
body.badass .pill::after,body.badass .btn.o::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  box-shadow:0 0 26px rgba(203,248,6,.85),0 0 60px rgba(203,248,6,.35);opacity:.45;animation:fxglow 2.4s ease-in-out infinite;will-change:opacity}
body.badass .pill{box-shadow:0 0 12px rgba(203,248,6,.45)}
body.badass .pill.o,body.badass .btn.o{box-shadow:0 0 12px rgba(255,106,26,.5)}
body.badass .pill.o::after,body.badass .btn.o::after{box-shadow:0 0 26px rgba(255,106,26,.9),0 0 60px rgba(255,106,26,.4)}
@keyframes fxglow{0%,100%{opacity:.35}50%{opacity:1}}
body.badass .ghost{box-shadow:0 0 12px rgba(203,248,6,.22)}
body.badass .card,body.badass .wcard{box-shadow:0 0 0 1px rgba(203,248,6,.10),0 0 34px rgba(203,248,6,.07),inset 0 0 40px rgba(0,0,0,.35)}
body.badass .wcard.g,body.badass .card.g{box-shadow:0 0 0 1px rgba(203,248,6,.45),0 0 26px rgba(203,248,6,.22)}
body.badass .wcard.o,body.badass .card.o{box-shadow:0 0 0 1px rgba(255,106,26,.5),0 0 26px rgba(255,106,26,.25)}
body.badass .wcard.gold{box-shadow:0 0 0 1px rgba(212,175,55,.5),0 0 26px rgba(212,175,55,.22)}
body.badass h1 .g,body.badass .v,body.badass .lnum,body.badass .brand b{text-shadow:0 0 10px rgba(203,248,6,.75),0 0 28px rgba(203,248,6,.35)}
body.badass h1 .o,body.badass .v.o,body.badass .cd{text-shadow:0 0 10px rgba(255,106,26,.8),0 0 28px rgba(255,106,26,.35)}
body.badass .v.gold{text-shadow:0 0 10px rgba(212,175,55,.8)}
body.badass .chip.on{box-shadow:0 0 10px rgba(203,248,6,.45)}
body.badass .bar2 i{box-shadow:0 0 12px rgba(203,248,6,.8)}
body.badass .bar2 i.o{box-shadow:0 0 12px rgba(255,106,26,.8)}
body.badass .wall i.e{box-shadow:0 0 8px rgba(255,106,26,.9);animation:fxflicker 1.6s ease-in-out infinite}
body.badass .stack{filter:drop-shadow(0 0 22px rgba(203,248,6,.28))}
body.badass .lic{filter:drop-shadow(0 0 6px rgba(203,248,6,.6))}

/* glitch on headlines */
body.badass .glitch{animation:fxglitch 4.2s infinite}
/* transform only: the filter() steps forced a full repaint of the heading on every glitch frame */
@keyframes fxglitch{0%,91%,100%{transform:none}92%{transform:translate(2px,-1px) skewX(2deg)}94%{transform:translate(-2px,1px)}96%{transform:translate(1px,0) skewX(-2deg)}98%{transform:none}}
@keyframes fxflicker{0%,100%{opacity:1}50%{opacity:.55}}

/* embers */
.embers{position:fixed;inset:0;pointer-events:none;z-index:58;display:none;overflow:hidden}
body.badass .embers{display:block}
.embers i{position:absolute;bottom:-12px;width:4px;height:4px;border-radius:2px;background:#ff8a2a;box-shadow:0 0 8px #ff6a1a;opacity:0;animation:fxrise 8s linear infinite}
.embers i.g{background:#CBF806;box-shadow:0 0 8px #CBF806}
.embers i:nth-child(1){left:6%;animation-delay:0s}.embers i:nth-child(2){left:14%;animation-delay:1.3s;animation-duration:9s}
.embers i:nth-child(3){left:22%;animation-delay:2.6s}.embers i:nth-child(4){left:31%;animation-delay:.7s;animation-duration:7s}
.embers i:nth-child(5){left:40%;animation-delay:3.4s}.embers i:nth-child(6){left:48%;animation-delay:1.9s;animation-duration:10s}
.embers i:nth-child(7){left:57%;animation-delay:4.2s}.embers i:nth-child(8){left:65%;animation-delay:.3s;animation-duration:8.5s}
.embers i:nth-child(9){left:73%;animation-delay:2.2s}.embers i:nth-child(10){left:81%;animation-delay:5s;animation-duration:7.5s}
.embers i:nth-child(11){left:89%;animation-delay:1.1s}.embers i:nth-child(12){left:95%;animation-delay:3.8s;animation-duration:9.5s}
.embers i:nth-child(13){left:36%;animation-delay:6s}.embers i:nth-child(14){left:60%;animation-delay:6.6s;animation-duration:8s}
@keyframes fxrise{0%{transform:translateY(0) translateX(0);opacity:0}8%{opacity:.95}60%{opacity:.7}100%{transform:translateY(-105vh) translateX(28px);opacity:0}}

@media (prefers-reduced-motion:reduce){body.badass .glitch,body.badass .pill,body.badass .embers i,body.badass .wall i.e{animation:none}}

/* ---- BADASS on the inner pages (mine / gallery / launchpad) ---- */
body.badass .btn.y,body.badass .btn-wow,body.badass .btn.primary,body.badass button.primary,body.badass .cta-btn{box-shadow:0 0 16px rgba(203,248,6,.55),0 0 42px rgba(203,248,6,.22);animation:fxpulse 2.4s ease-in-out infinite}
body.badass .btn.o,body.badass .btn.rd{box-shadow:0 0 16px rgba(255,106,26,.6);animation:fxpulseo 2.4s ease-in-out infinite}
body.badass .card,body.badass .gpanel,body.badass .tile,body.badass .st,body.badass .gasbox,body.badass .stat,body.badass .panel,body.badass .box{box-shadow:0 0 0 1px rgba(203,248,6,.10),0 0 30px rgba(203,248,6,.06),inset 0 0 36px rgba(0,0,0,.35)}
body.badass .gasbox{box-shadow:0 0 0 1px rgba(255,106,26,.35),0 0 26px rgba(255,106,26,.18)}
body.badass .logo,body.badass .brand,body.badass .badge,body.badass .st b,body.badass .netpill,body.badass .eyebrow{text-shadow:0 0 10px rgba(203,248,6,.7),0 0 26px rgba(203,248,6,.3)}
body.badass h1 .acc,body.badass .gb-big,body.badass .red{text-shadow:0 0 12px rgba(255,106,26,.8),0 0 30px rgba(255,106,26,.35)}
body.badass h1,body.badass .h2{text-shadow:0 0 14px rgba(245,244,240,.25)}
body.badass .board,body.badass .grid img,body.badass .tile img{filter:saturate(1.15) contrast(1.06)}
body.badass .board{box-shadow:0 0 0 1px rgba(203,248,6,.25),0 0 40px rgba(203,248,6,.12)}
body.badass .tile.leg,body.badass .tile.epic{box-shadow:0 0 18px rgba(203,248,6,.35)}
body.badass input,body.badass select{box-shadow:inset 0 0 12px rgba(0,0,0,.5)}
body.badass input:focus,body.badass select:focus{box-shadow:0 0 12px rgba(203,248,6,.45)}

/* MOMENTS (2026-10-01): shared peaks - mint landed, war won, blocks burning */
.fx-burst{position:fixed;inset:0;pointer-events:none;z-index:70}
body.fx-flash::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:71;background:radial-gradient(60% 60% at 50% 40%,rgba(203,248,6,.55),rgba(203,248,6,0) 70%);animation:fxflash .7s ease-out forwards}
body.fx-flash-burn::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:71;background:radial-gradient(60% 60% at 50% 50%,rgba(255,106,26,.5),rgba(255,106,26,0) 70%);animation:fxflash .7s ease-out forwards}
@keyframes fxflash{0%{opacity:1}100%{opacity:0}}
.fx-shake{animation:fxshake .6s cubic-bezier(.36,.07,.19,.97) both}
@keyframes fxshake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}
/* a burned block tile: pixel fire eating it, then ash */
.wall i.e.burning{position:relative;overflow:visible;animation:fxash 2.8s steps(6) forwards}
.wall i.e.burning::after{content:"";position:absolute;left:-2px;right:-2px;bottom:0;height:140%;pointer-events:none;background:linear-gradient(0deg,#ff6a1a 0 25%,#ffb01a 25% 45%,#ffe08a 45% 55%,transparent 55%);background-size:6px 100%;mask:linear-gradient(0deg,#000 40%,transparent 95%);-webkit-mask:linear-gradient(0deg,#000 40%,transparent 95%);animation:fxfire .35s steps(3) infinite,fxfireout 2.8s ease-in forwards}
@keyframes fxfire{0%{transform:translateY(0) scaleY(1)}50%{transform:translateY(-3px) scaleY(1.15)}100%{transform:translateY(1px) scaleY(.9)}}
@keyframes fxfireout{0%,70%{opacity:1}100%{opacity:0}}
@keyframes fxash{0%{filter:brightness(1.6) saturate(1.4)}60%{filter:brightness(.9)}100%{filter:grayscale(1) brightness(.35)}}
@media (prefers-reduced-motion:reduce){.wall i.e.burning,.wall i.e.burning::after,.fx-shake{animation:none}.wall i.e.burning{filter:grayscale(1) brightness(.35)}}
