/* NILLA house style — ported from HoodRugCheck (app/globals.css + tailwind.config.ts), accent swapped green/cyan → gold/amber */
:root{
  color-scheme:dark;
  --void:#03050a;--abyss:#060910;--surface:#080d16;--elevated:#0d1420;
  --hairline:rgba(255,205,110,.14);
  --muted:#6b7a91;--subtle:#8090a6;
  --s50:#f8fafc;--s100:#f1f5f9;--s300:#cbd5e1;--s400:#94a3b8;
  --signal:#f3c64b;--signal-deep:#c99a1e;      /* HRC signal  #00e5a0 → gold  */
  --amber:#ff9f1c;--amber-deep:#d97e00;        /* HRC cyan    #00e5ff → amber */
  --up:#00e5a0;--down:#ff4d6d;
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-sans:'Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --ease-out:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0}
body{background:var(--void);color:var(--s300);font-family:var(--font-sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh}
img,canvas{max-width:100%}
a{color:inherit}
::selection{background:rgba(243,198,75,.32);color:#fff8e1}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#04070d}::-webkit-scrollbar-thumb{background:#16202f;border-radius:999px}

/* ── page-wide overlays ── */
.scanlines{position:fixed;inset:0;z-index:40;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 3px);mix-blend-mode:overlay;opacity:.6}
.scanlines::after{content:'';position:absolute;left:0;right:0;top:0;height:30vh;background:linear-gradient(to bottom,transparent,rgba(243,198,75,.07),transparent);animation:sweep 9s linear infinite;will-change:transform}
@keyframes sweep{from{transform:translate3d(0,-100%,0)}to{transform:translate3d(0,400%,0)}}
.page{position:relative;z-index:10;display:flex;flex-direction:column;min-height:100vh}
main{flex:1}

/* ── header ── */
.hdr{position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(255,205,110,.1);background:rgba(3,5,10,.7);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.hdr__in{max-width:1152px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.mark{position:relative;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;border:1px solid rgba(243,198,75,.4);background:rgba(243,198,75,.1);overflow:visible;flex:none}
.mark img{width:22px;height:22px;border-radius:6px;display:block;box-shadow:0 0 10px rgba(243,198,75,.55)}
.mark__ping{position:absolute;inset:0;border-radius:10px;border:1px solid rgba(243,198,75,.5);animation:sonar 3.4s ease-out infinite}
@keyframes sonar{0%{transform:scale(.25);opacity:.45}70%{opacity:.1}100%{transform:scale(1);opacity:0}}
.brand__t{font-family:var(--font-display);font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--s100)}
.brand__t span{color:var(--signal)}
.hdr__r{display:flex;align-items:center;gap:14px}
.live{display:none;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:var(--muted)}
.live[hidden]{display:none}
.live i{width:4px;height:4px;border-radius:50%;background:var(--signal);animation:breathe 4.5s ease-in-out infinite}
.hdr__link{display:none;font-family:var(--font-mono);font-size:11px;color:var(--subtle);text-decoration:none;transition:color .2s}
.hdr__link:hover{color:var(--signal)}
@media(min-width:640px){.live{display:flex}.hdr__link{display:inline}}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;border-radius:12px;padding:12px 20px;font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:-.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .2s var(--ease-out),box-shadow .2s,filter .2s,background .2s,border-color .2s;min-width:0}
.btn:active{transform:scale(.98)}
.btn:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.btn--primary,.scan-btn{background:var(--signal);color:var(--void);box-shadow:0 0 14px rgba(243,198,75,.7),0 0 36px rgba(243,198,75,.4)}
.btn--primary:hover,.scan-btn:hover{filter:brightness(1.1);box-shadow:0 0 18px rgba(243,198,75,.9),0 0 50px rgba(243,198,75,.5)}
.btn--outline{border-color:rgba(243,198,75,.45);color:var(--signal);background:rgba(243,198,75,.06)}
.btn--outline:hover{background:rgba(243,198,75,.12);border-color:rgba(243,198,75,.7);box-shadow:0 0 24px rgba(243,198,75,.25)}
.btn--ghost{border-color:rgba(255,255,255,.15);color:var(--s100);background:transparent}
.btn--ghost:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.25)}
.btn--sm{padding:8px 14px;font-size:13px;border-radius:10px;background:var(--signal);color:var(--void);box-shadow:0 0 14px rgba(243,198,75,.55),0 0 34px rgba(243,198,75,.28)}
.btn--sm:hover{filter:brightness(1.1)}

/* ── hero ── */
.hero{position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict}
.hero-bg__rain{position:absolute;inset:0;width:100%;height:100%;opacity:.5;z-index:0}
.hero-bg__glow{position:absolute;left:50%;top:30%;width:120vmax;height:70vh;transform:translate3d(-50%,-50%,0);z-index:1;background:radial-gradient(45% 55% at 50% 50%,rgba(243,198,75,.30),transparent 70%),radial-gradient(38% 48% at 62% 48%,rgba(255,159,28,.20),transparent 70%);animation:breathe 5s ease-in-out infinite;will-change:opacity}
.hero-bg__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2}
@keyframes breathe{0%,100%{opacity:.7}50%{opacity:1}}
.hero__in{position:relative;z-index:10;max-width:768px;margin:0 auto;padding:56px 20px 300px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0}
@media(min-width:640px){.hero__in{padding:72px 20px 340px}}
.pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;border:1px solid rgba(243,198,75,.3);background:rgba(3,5,10,.6);padding:5px 12px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:var(--s300);backdrop-filter:blur(4px)}
.pill i{width:6px;height:6px;border-radius:50%;background:var(--signal);box-shadow:0 0 14px rgba(243,198,75,.55),0 0 34px rgba(243,198,75,.28)}
.coinwrap{position:relative;width:min(240px,62vw);aspect-ratio:1;margin-top:22px}
@media(min-width:640px){.coinwrap{width:280px}}
.coinwrap__bloom{position:absolute;inset:-22%;border-radius:50%;background:radial-gradient(circle,rgba(243,198,75,.55) 0%,transparent 62%);filter:blur(28px);opacity:.5;animation:breathe 4s ease-in-out infinite}
#coin{position:relative;width:100%;height:100%;display:block;filter:drop-shadow(0 18px 40px rgba(243,198,75,.35))}
h1{margin:14px 0 0;font-family:var(--font-display);font-weight:800;font-size:clamp(72px,24vw,150px);line-height:.95;letter-spacing:-.04em;color:var(--s50);text-wrap:balance}
.text-gradient{background:linear-gradient(100deg,#fff6d6 0%,var(--signal) 38%,var(--amber) 72%,#ffe9b0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.text-glow{position:relative;display:inline-block}
.text-glow::before{content:attr(data-text);position:absolute;inset:0;z-index:-1;color:#f3c64b;filter:blur(18px);opacity:.55;pointer-events:none}
.lead{margin:14px auto 0;max-width:520px;font-size:15px;line-height:1.65;color:rgba(203,213,225,.9);text-wrap:pretty}
.lead b{color:var(--signal);font-weight:600}
.copy{margin:16px auto 0;max-width:560px;display:flex;flex-direction:column;gap:12px}
.copy p{margin:0}
.copy b{color:var(--signal);font-weight:600}
.copy__eyebrow{font-family:var(--font-mono);font-size:11px;line-height:1.6;text-transform:uppercase;letter-spacing:.14em;color:var(--subtle)}
.copy__eyebrow b{font-weight:600}
.copy__body{font-size:15px;line-height:1.65;color:rgba(203,213,225,.9);text-wrap:pretty}
.copy__callout{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,4.6vw,24px);line-height:1.3;letter-spacing:-.02em;color:var(--signal);text-shadow:0 0 22px rgba(243,198,75,.35);text-wrap:balance}

/* CA box = HRC scan input */
.ca{width:100%;max-width:640px;margin-top:30px;text-align:left}
.ca__label{display:block;margin:0 0 8px 4px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:var(--subtle)}
.scan-shell{position:relative;border-radius:18px;padding:2px;overflow:hidden;isolation:isolate;box-shadow:0 0 0 1px rgba(243,198,75,.25),0 0 24px rgba(243,198,75,.35),0 0 70px rgba(255,159,28,.22),0 30px 80px -30px rgba(0,0,0,.9);transition:box-shadow .35s ease}
.scan-shell::before{content:'';position:absolute;left:50%;top:50%;width:250%;aspect-ratio:1;z-index:-1;background:conic-gradient(from 0deg,#f3c64b,#ff9f1c 25%,#f3c64b 50%,#ff9f1c 75%,#f3c64b);transform:translate3d(-50%,-50%,0) rotate(0deg);animation:orbit 4.5s linear infinite;will-change:transform}
.scan-shell:focus-within{box-shadow:0 0 0 1px rgba(243,198,75,.5),0 0 36px rgba(243,198,75,.6),0 0 110px rgba(255,159,28,.35),0 30px 80px -30px rgba(0,0,0,.9)}
@keyframes orbit{to{transform:translate3d(-50%,-50%,0) rotate(360deg)}}
.scan-surface{position:relative;border-radius:16px;background:linear-gradient(180deg,rgba(10,18,30,.9),rgba(5,9,16,.94));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);display:flex;flex-direction:column;gap:8px;padding:8px}
@media(min-width:640px){.scan-surface{flex-direction:row;align-items:center}}
.scan-prompt{display:none;padding-left:12px;font-family:var(--font-mono);font-size:13px;color:rgba(243,198,75,.7);user-select:none}
@media(min-width:640px){.scan-prompt{display:block}}
.scan-surface code{flex:1;min-width:0;padding:14px 12px;font-family:var(--font-mono);font-size:13px;color:var(--s50);word-break:break-all;line-height:1.4;border-radius:12px}
@media(min-width:640px){.scan-surface code{font-size:14px}}
.scan-btn{flex:none;border:0;border-radius:12px;padding:14px 24px;font-family:var(--font-display);font-weight:700;font-size:15px;cursor:pointer;transition:transform .2s,box-shadow .2s,filter .2s}
.scan-btn:active{transform:scale(.98)}
.scan-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.toast{min-height:20px;padding:6px 4px 0;font-family:var(--font-mono);font-size:12px;color:var(--signal)}

/* stats strip = HRC ticker pills */
.stats{width:100%;max-width:640px;margin-top:10px;display:grid;grid-template-columns:repeat(var(--tiles,3),minmax(0,1fr));gap:8px}
.stats[hidden]{display:none}
.stat{border-radius:14px;border:1px solid var(--hairline);background:rgba(8,13,22,.6);padding:10px 8px 9px;text-align:center;backdrop-filter:blur(8px)}
.stat__l{display:block;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}
.stat__v{display:block;margin-top:3px;font-family:var(--font-display);font-weight:800;font-size:clamp(20px,5.6vw,28px);line-height:1.1;letter-spacing:-.02em;color:var(--signal);font-variant-numeric:tabular-nums;text-shadow:0 0 18px rgba(243,198,75,.35)}
.stat__s{display:block;margin-top:2px;font-family:var(--font-mono);font-size:9px;text-transform:uppercase;letter-spacing:.14em;color:var(--subtle)}
.stat[hidden]{display:none}
.stat__v.up{color:var(--up);text-shadow:0 0 18px rgba(0,229,160,.35)}.stat__v.down{color:var(--down);text-shadow:0 0 18px rgba(255,77,109,.35)}
.stats__upd{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:6px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}
.stats__upd i{width:4px;height:4px;border-radius:50%;background:var(--signal);animation:breathe 4.5s ease-in-out infinite}

.actions{width:100%;max-width:640px;margin-top:22px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(min-width:640px){.actions{grid-template-columns:repeat(3,minmax(0,1fr))}}
.actions .btn{white-space:normal;line-height:1.2;padding:13px 12px;font-size:14px}
.actions .btn--primary{grid-column:1/-1}
@media(min-width:640px){.actions .btn--primary{grid-column:auto}}
.fine{margin:22px 0 0;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--subtle)}

/* ── sections ── */
.wrap{max-width:1152px;margin:0 auto;padding:0 20px}
.sec{padding-top:40px}
@media(min-width:640px){.sec{padding-top:64px}}
.sec--cta{padding-top:72px}
.sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
h2{margin:0;font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-.02em;color:var(--s100)}
@media(min-width:640px){h2{font-size:26px}}
.sec__head p{margin:6px 0 0;font-size:13px;color:var(--subtle)}
.sec__meta{display:none;flex:none;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
@media(min-width:640px){.sec__meta{display:block}}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--subtle)}
.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--signal);box-shadow:0 0 10px var(--signal)}

/* glass = HRC .glass with masked gradient border + cursor spot */
.glass{position:relative;border-radius:16px;background:linear-gradient(180deg,rgba(14,22,36,.62),rgba(8,13,22,.72));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:0 30px 80px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.05);transform-style:preserve-3d;transition:transform .25s var(--ease-out)}
.glass::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(243,198,75,.55),rgba(255,159,28,.35) 40%,rgba(255,220,150,.12) 70%,rgba(243,198,75,.4));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}
.glass__spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(243,198,75,.16),transparent 60%)}
.glass:hover .glass__spot{opacity:1}
.glass__in{position:relative;z-index:1}
.grid{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:640px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{padding:20px;min-width:0;animation:rise .62s var(--ease-out) both;animation-delay:calc(.1s + var(--i,0)*.07s)}
.card__top{display:flex;align-items:baseline;justify-content:space-between}
.card__n{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;color:var(--signal)}
.card__w{font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.card h3{margin:12px 0 0;font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:-.01em;color:var(--s100)}
.card p{margin:8px 0 0;font-size:12.5px;line-height:1.6;color:var(--s400)}
.quote{padding:24px 22px}
@media(min-width:640px){.quote{padding:36px 40px}}
.quote__q{margin:14px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(20px,4.6vw,30px);line-height:1.25;letter-spacing:-.02em;color:var(--s50);text-wrap:balance;text-shadow:0 0 24px rgba(243,198,75,.18)}
.quote__by{margin:14px 0 0;font-family:var(--font-mono);font-size:12px;color:var(--subtle)}
.cta{overflow:hidden;padding:44px 22px;text-align:center}
@media(min-width:640px){.cta{padding:56px 48px}}
.cta__bloom{position:absolute;left:-80px;right:-80px;top:-96px;height:224px;opacity:.7;filter:blur(48px);pointer-events:none;background:radial-gradient(50% 60% at 50% 50%,rgba(243,198,75,.3),transparent 70%)}
.cta h2{font-size:26px;color:var(--s50)}
@media(min-width:640px){.cta h2{font-size:34px}}
.cta p{margin:12px auto 0;max-width:520px;font-size:14px;color:var(--s400)}
.cta__row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px}
.foot{margin-top:80px;border-top:1px solid rgba(255,205,110,.1)}
.foot__in{max-width:1152px;margin:0 auto;padding:28px 20px;font-size:12px;line-height:1.7;color:var(--s400)}

/* ── motion ── */
.rise{animation:rise .7s var(--ease-out) both;animation-delay:calc(var(--i,0)*.08s)}
@keyframes rise{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scanlines::after,.hero-bg__glow,.scan-shell::before,.coinwrap__bloom,.mark__ping,.live i,.stats__upd i,.pill i{animation:none!important}
  .rise,.card{animation:none!important}
  .glass{transition:none}
}