/* SolanaClock.com v3 · theme A "Neon Pulse": dark-only, glowing epoch ring, gradient card outlines.
   Fonts self-hosted (OFL: Unbounded, Space Grotesk, JetBrains Mono; Latin subset) to fit CSP font-src 'self'. */
@font-face{font-family:"Unbounded";src:url(../fonts/unbounded.woff2?v=202610200720) format("woff2");font-weight:600 700;font-style:normal;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(../fonts/space-grotesk.woff2?v=202610200720) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(../fonts/jetbrains-mono.woff2?v=202610200720) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
:root{color-scheme:dark}
/* SolanaClock theme kit: shared compact layout. 14px text floor, 48px targets, no solid-fill buttons. */
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--txt);font:14px/1.4 var(--f-body);-webkit-font-smoothing:antialiased}
body{min-height:100vh}
a{color:inherit}
.wrap{max-width:760px;margin:0 auto;padding:10px 14px 24px;display:flex;flex-direction:column;gap:10px;position:relative;z-index:1}
.top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px}
.brand{font:var(--brand-w) 18px/1 var(--f-display);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:48px}
.live{font-size:14px;color:var(--dim);display:inline-flex;align-items:center;gap:6px}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--dim)}
.live.ok .pulse{background:var(--up);box-shadow:0 0 8px var(--up)}
.live.bad .pulse{background:var(--down)}
.h1{font-size:14px;font-weight:500;color:var(--dim);margin:-8px 0 0}
.h1 span{font-weight:400}
.lbl{display:block;font:500 14px/1.3 var(--f-label);color:var(--dim);letter-spacing:var(--lbl-ls,.03em);text-transform:var(--lbl-tt,uppercase)}
.lbl em{font-style:normal;text-transform:none}
.epoch{border-radius:var(--r-lg);padding:14px}
.ep-num,.cd-val{font-variant-numeric:tabular-nums}
.bar-meta{display:flex;justify-content:space-between;margin-top:6px;font:14px var(--f-num);color:var(--dim);font-variant-numeric:tabular-nums}
.bar-meta b{color:var(--txt)}
.ends{display:grid;grid-template-columns:1fr;gap:6px;margin-top:10px}
.ends>div{border:1px solid var(--line);border-radius:var(--r-sm);padding:7px 10px}
.ends b{font:600 15px/1.3 var(--f-num);display:block;margin-top:1px}
.fine{font-size:14px;color:var(--dim);margin-top:8px;line-height:1.35}
.err{margin-top:8px;font-size:14px;color:var(--down);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.err[hidden]{display:none}
.err button{font:600 14px var(--f-body);min-height:48px;padding:0 18px;border-radius:99px;border:1.5px solid currentColor;background:transparent;color:var(--accent);cursor:pointer}
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.tile{border-radius:var(--r-sm);padding:8px 10px;min-width:0}
.tile b{display:block;font:var(--num-w) 20px/1.25 var(--f-num);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.sub{display:block;font-size:14px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up{color:var(--up)}.down{color:var(--down)}
.spark{display:block;width:100%;height:26px;margin:3px 0 1px}
.spark path{fill:none;stroke:var(--spark,var(--a2));stroke-width:2;vector-effect:non-scaling-stroke}
.mkts h2,.faq h2{font:500 14px var(--f-label);color:var(--dim);text-transform:var(--lbl-tt,uppercase);letter-spacing:var(--lbl-ls,.03em);margin:2px 0 6px}
.mk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.mk{border-radius:var(--r-sm);padding:7px 10px;display:flex;justify-content:space-between;align-items:center;gap:6px;min-width:0;min-height:52px}
.mk .s{font:600 14px var(--f-label)}
.mk .v{font:14px/1.25 var(--f-num);font-variant-numeric:tabular-nums;text-align:right}
.mk .c{display:block;font-size:14px}
.faq details{border-radius:var(--r-sm);margin-top:6px;font-size:14px}
.faq summary{cursor:pointer;font-weight:600;font-size:14px;min-height:48px;display:flex;align-items:center;padding:0 12px;list-style:none;gap:8px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";font:600 16px var(--f-num);color:var(--accent);width:14px}
.faq p{color:var(--dim);padding:0 12px 10px}
/* Stellar TimeLock promo: suite rule = black, white outline, white text. Same in every direction. */
.stl{margin-top:4px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 14px;border-radius:16px;color:#fff;background:#000;border:1.5px solid #fff;box-shadow:none}
.stl-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;min-width:0;min-height:48px}
.stl-logo{width:48px;height:48px;border-radius:12px;flex:none}
.stl-txt{display:flex;flex-direction:column;min-width:0;gap:2px}
.stl-txt b{font:600 16px var(--f-body)}
.stl-txt span{font-size:14px;color:#fff}
.stl-txt .stl-url{align-self:flex-start;margin-top:4px;padding:5px 12px;border:1.5px solid #fff;border-radius:99px;color:#fff;font-weight:600}
.gp{flex:none;display:block;line-height:0;border-radius:10px;min-height:48px}
.gp img{display:block;height:62px;width:auto}
.stl a:focus-visible{outline:2px solid #fff;outline-offset:2px}
.foot{font-size:14px;color:var(--dim);text-align:center;line-height:1.4}
@media (max-width:520px){.stl{flex-direction:column;align-items:stretch;gap:6px}.gp{align-self:center}}
@media (min-width:900px){
 .wrap{max-width:1040px;padding:12px 24px 24px}
 .tiles{grid-template-columns:repeat(3,1fr)}
 .mk-grid{grid-template-columns:repeat(6,1fr)}
 .ends{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.sub{white-space:normal;overflow:visible}
.live{white-space:nowrap;flex:none}

/* A · Neon Pulse — Solana gradient neon, glowing epoch ring */
:root{--bg:#05030B;--surf:rgba(255,255,255,.025);--line:#2A2140;--txt:#F1EEFF;--dim:#A69FC4;--up:#14F195;--down:#FF4D8D;
 --a1:#9945FF;--a2:#14F195;--a3:#00C2FF;--accent:#14F195;--grad:linear-gradient(90deg,#9945FF,#19FB9B);
 --f-display:"Unbounded",system-ui,sans-serif;--f-body:"Space Grotesk",system-ui,sans-serif;--f-label:"Space Grotesk",sans-serif;--f-num:"JetBrains Mono",ui-monospace,monospace;
 --brand-w:600;--num-w:600;--r-lg:24px;--r-sm:14px;--lbl-ls:.08em}
body{background:radial-gradient(60% 40% at 0% 0%,rgba(153,69,255,.28),transparent 70%),radial-gradient(60% 40% at 100% 55%,rgba(20,241,149,.14),transparent 70%),#05030B}
.brand{font-size:16px;gap:7px}
.brand b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}
.dot{width:12px;height:12px;border-radius:50%;background:conic-gradient(#9945FF,#14F195,#9945FF);box-shadow:0 0 12px #9945FF}
.epoch,.tile,.mk,.faq details,.ends>div{background:linear-gradient(#0B0816,#0B0816) padding-box,linear-gradient(135deg,rgba(153,69,255,.7),rgba(20,241,149,.45)) border-box;border:1px solid transparent}
.ends>div{background:linear-gradient(#07050F,#07050F) padding-box,linear-gradient(135deg,rgba(153,69,255,.4),rgba(20,241,149,.25)) border-box}
.epoch{box-shadow:0 0 40px rgba(153,69,255,.18),inset 0 0 40px rgba(20,241,149,.04)}
.ep-head{position:relative;width:272px;height:272px;margin:4px auto 0;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center}
.ep-head::before,.ep-head::after{content:"";position:absolute;inset:0;border-radius:50%;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#000 calc(100% - 12px));mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#000 calc(100% - 12px))}
.ep-head::after{background:repeating-conic-gradient(#1C1530 0 1.6deg,#0B0816 1.6deg 2.4deg)}
.ep-head::before{z-index:1;background:conic-gradient(from 0deg,#9945FF,#00C2FF calc(var(--p)*50%),#14F195 calc(var(--p)*100%),transparent 0);filter:drop-shadow(0 0 10px rgba(20,241,149,.8)) drop-shadow(0 0 18px rgba(153,69,255,.6))}
.ep-head>div{position:relative;z-index:2}
.ep-num{font:700 56px/1 var(--f-display);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 16px rgba(153,69,255,.55));letter-spacing:-.02em}
.cd{margin-top:2px}.cd .lbl{font-size:14px}
.cd-val{font:600 30px/1.1 var(--f-num);color:#fff;text-shadow:0 0 12px rgba(20,241,149,.7)}
.bar{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bar-meta{justify-content:center;gap:10px;margin-top:8px}
.bar-meta b{color:var(--a2);text-shadow:0 0 8px rgba(20,241,149,.6)}
.tile b{color:#fff}
.tile .lbl,.mk .s{color:#C7B8FF}
.spark path{stroke:#14F195;filter:drop-shadow(0 0 4px #14F195)}
.mk .s{font-family:var(--f-display);font-weight:600}
.err button{color:var(--a2)}
@media (min-width:900px){
 .epoch{display:grid;grid-template-columns:300px 1fr;grid-template-rows:1fr auto auto auto auto 1fr;column-gap:28px;align-items:center;padding:18px 24px}
 .ep-head{grid-column:1;grid-row:1/-1;margin:0}
 .epoch>.bar-meta{grid-column:2;grid-row:2}.epoch>.ends{grid-column:2;grid-row:3}.epoch>.fine{grid-column:2;grid-row:4}.epoch>.err{grid-column:2;grid-row:5}
 .bar-meta{justify-content:flex-start;margin:0;font-size:16px}
 .ends{grid-template-columns:1fr}
}

/* production additions */
.epoch{--p:0}
.live.ok .pulse{animation:p 2s ease-in-out infinite}
@keyframes p{50%{opacity:.35}}
.gp:hover img{filter:brightness(1.15)}
.stl-brand:hover .stl-url{background:rgba(255,255,255,.08)}
.epoch.nf{display:block}
.epoch.nf p{margin-top:6px}
.epoch.nf a{text-decoration:underline}
