@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
/* Minimal, crafted: quiet at rest, a lot when you touch it.
   Calm paper page, blue as the only accent, sharp serif headlines, cards with soft real shadows and a thin blue top line.
   The motion (cards drawing in, heading rules, button pulse, lines that ripple from your finger) comes from /assets/minimal-fx.js,
   which adds the mx-* classes below. Shared by the homepage and every v2 page. */
html[data-universe="minimal"]{
  --font-display:'Bebas Neue','Bahnschrift',sans-serif; --display-weight:400; --display-tracking:.02em;
}
html[data-universe="minimal"] h1,html[data-universe="minimal"] h2,html[data-universe="minimal"] h3{text-shadow:none;-webkit-text-stroke:0}

/* cards: black glass with a teal neon edge, teal corner brackets and a precise glowing line (svg added by minimal-fx.js) that keeps
   drawing itself around the card and erasing, each card on its own timing, the same living pen as the phantoms */
html[data-universe="minimal"] .csd-card{
  --neon:#19e6cf; --cb:14px;
  position:relative;border:0;border-radius:8px;color:#dff7f3;
  background:
    linear-gradient(var(--neon),var(--neon)) 8px 8px/var(--cb) 2px no-repeat,linear-gradient(var(--neon),var(--neon)) 8px 8px/2px var(--cb) no-repeat,
    linear-gradient(var(--neon),var(--neon)) calc(100% - 8px) 8px/var(--cb) 2px no-repeat,linear-gradient(var(--neon),var(--neon)) calc(100% - 8px) 8px/2px var(--cb) no-repeat,
    linear-gradient(var(--neon),var(--neon)) 8px calc(100% - 8px)/var(--cb) 2px no-repeat,linear-gradient(var(--neon),var(--neon)) 8px calc(100% - 8px)/2px var(--cb) no-repeat,
    linear-gradient(var(--neon),var(--neon)) calc(100% - 8px) calc(100% - 8px)/var(--cb) 2px no-repeat,linear-gradient(var(--neon),var(--neon)) calc(100% - 8px) calc(100% - 8px)/2px var(--cb) no-repeat,
    radial-gradient(120% 90% at 0% 0%,rgba(25,230,207,.12),transparent 55%),
    linear-gradient(160deg,#121518,#07090b);
  box-shadow:0 0 0 1px rgba(25,230,207,.45),0 0 18px rgba(25,230,207,.35),0 0 46px rgba(25,230,207,.14),0 16px 36px rgba(0,0,0,.25);
  backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:box-shadow .25s,transform .25s;
}
html[data-universe="minimal"] .csd-card h2,html[data-universe="minimal"] .csd-card h3,html[data-universe="minimal"] .csd-card b{color:#fff}
html[data-universe="minimal"] .csd-card .muted,html[data-universe="minimal"] .csd-card small,html[data-universe="minimal"] .csd-card .note,html[data-universe="minimal"] .csd-card span:not(.p):not(.price){color:#a9c9c4}
html[data-universe="minimal"] .csd-card .p,html[data-universe="minimal"] .csd-card .price{color:var(--neon)}
html[data-universe="minimal"] a.csd-card:hover,html[data-universe="minimal"] .mt:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(25,230,207,.7),0 0 26px rgba(25,230,207,.5),0 0 60px rgba(25,230,207,.2),0 20px 40px rgba(0,0,0,.3)}
.mx-ink{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);pointer-events:none;overflow:visible;z-index:2}
.mx-ink rect{filter:drop-shadow(0 0 3px #19e6cf) drop-shadow(0 0 9px rgba(25,230,207,.8));x:4px;y:4px;width:calc(100% - 8px);height:calc(100% - 8px);rx:6px;fill:none;stroke:#19e6cf;stroke-width:1.8;stroke-linecap:round;
  stroke-width:1.2;stroke-dasharray:.22 .78;stroke-dashoffset:0;animation:mxDrawErase 7s linear infinite;animation-delay:var(--d,0s)}
@keyframes mxDrawErase{to{stroke-dashoffset:-1}}
html[data-universe="minimal"] .csd-card.mx-wait > *{opacity:0;transform:translateY(10px)}
html[data-universe="minimal"] .csd-card.mx-in > *{opacity:1;transform:none;transition:opacity .6s .25s,transform .6s .25s cubic-bezier(.2,.7,.2,1)}

/* section headings: a short blue rule draws in underneath when the heading comes into view */
html[data-universe="minimal"] main h2.mx-rule::after{content:"";display:block;width:56px;height:2px;margin-top:12px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
html[data-universe="minimal"] main h2.mx-rule.mx-ruled::after{transform:scaleX(1)}
html[data-universe="minimal"] .page-head h1 + p,html[data-universe="minimal"] .lead{color:var(--ink-muted)}

/* tap feedback: a crisp blue ring that pulses out from any button */
@keyframes mxPulse{from{outline-offset:0;outline-color:color-mix(in srgb,var(--accent) 60%,transparent)}to{outline-offset:10px;outline-color:transparent}}
html[data-universe="minimal"] .mx-pulse{outline:2px solid transparent;animation:mxPulse .5s ease-out}

@media (prefers-reduced-motion:reduce){
  html[data-universe="minimal"] .csd-card.mx-wait > *{opacity:1;transform:none}
  html[data-universe="minimal"] main h2.mx-rule::after{transform:scaleX(1);transition:none}
  html[data-universe="minimal"] .mx-pulse{animation:none}
  .mx-ink rect{animation:none;stroke-dashoffset:0}
}
/* text and buttons inside the black cards stay readable */
html[data-universe="minimal"] .csd-card .link,html[data-universe="minimal"] .csd-card a:not(.btn):not(.buy):not(.gx){color:var(--neon)}
html[data-universe="minimal"] .csd-card .btn-ghost{color:#dff7f3;border-color:rgba(25,230,207,.6)}
html[data-universe="minimal"] .csd-card li{color:#cfe9e5}
/* buttons match the cards: black glass, teal neon edge and glow, teal lettering (the live canvas fill is turned off in Minimal) */
html[data-universe="minimal"] .gx.gx,html[data-universe="minimal"] .btn,html[data-universe="minimal"] .buy,html[data-universe="minimal"] .pm-buy{
  background:linear-gradient(160deg,#151a1d,#07090b);color:#19e6cf;border:1px solid rgba(25,230,207,.7);border-radius:8px;
  box-shadow:0 0 10px rgba(25,230,207,.35),inset 0 0 12px rgba(25,230,207,.12);text-shadow:0 0 8px rgba(25,230,207,.6);filter:none;
  font-family:'Bebas Neue','Bahnschrift',sans-serif;letter-spacing:.06em;text-transform:uppercase;transition:box-shadow .2s,transform .2s,color .2s}
html[data-universe="minimal"] .gx.gx > canvas,html[data-universe="minimal"] .gx.gx::before{display:none}
html[data-universe="minimal"] .gx.gx .gx-t{color:#19e6cf;-webkit-text-fill-color:#19e6cf;background:none;text-shadow:0 0 8px rgba(25,230,207,.6)}
html[data-universe="minimal"] .gx.gx:hover,html[data-universe="minimal"] .btn:hover,html[data-universe="minimal"] .buy:hover,html[data-universe="minimal"] .pm-buy:hover{
  color:#fff;transform:translateY(-2px);box-shadow:0 0 0 1px #19e6cf,0 0 22px rgba(25,230,207,.65),inset 0 0 16px rgba(25,230,207,.2);filter:none}
html[data-universe="minimal"] .gx-gold.gx.gx,html[data-universe="minimal"] .btn-main{background:linear-gradient(160deg,#0f2b28,#06110f);border-color:#19e6cf}
/* button lettering: bigger (condensed caps run small) and crisp light text; the glow stays on the edge, not the letters */
html[data-universe="minimal"] .gx.gx,html[data-universe="minimal"] .btn{font-size:19px;letter-spacing:.07em;color:#effffc;text-shadow:none}
html[data-universe="minimal"] .buy,html[data-universe="minimal"] .pm-buy{font-size:17px;letter-spacing:.07em;color:#effffc;text-shadow:none}
html[data-universe="minimal"] .gx.gx .gx-t{color:#effffc;-webkit-text-fill-color:#effffc;text-shadow:none}
html[data-universe="minimal"] .aud-buy-btn.gx.gx{font-size:20px}
