/* dexxed · design system: black counter, thermal-receipt paper, one lime "paid" signal. pixel display type, mono receipts. */
:root{
  --bg:#0a0a0a;--bg2:#0e0e0e;--panel:#121212;--panel2:#181818;--line:#1f1f1f;--line2:#2a2a2a;--line3:#383838;
  --paper:#f4f4f0;--paper2:#e9e9e2;--ink:#0a0a0a;--ink2:#3a3a36;--grey:#8a8a84;--grey2:#5e5e59;--txt:#f4f4f0;--txt2:#c9c9c2;
  --lime:#c6ff3d;--lime2:#a8e01e;--limed:rgba(198,255,61,.12);--warn:#ffd36b;--bad:#ff7a6b;
  --px:'Silkscreen',monospace;--mono:'IBM Plex Mono',ui-monospace,monospace;--sans:'Inter',system-ui,-apple-system,sans-serif;
  --s:6px;
  --step:polygon(0 var(--s),var(--s) var(--s),var(--s) 0,calc(100% - var(--s)) 0,calc(100% - var(--s)) var(--s),100% var(--s),100% calc(100% - var(--s)),calc(100% - var(--s)) calc(100% - var(--s)),calc(100% - var(--s)) 100%,var(--s) 100%,var(--s) calc(100% - var(--s)),0 calc(100% - var(--s)));
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--txt);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.3px);background-size:24px 24px;mask-image:linear-gradient(#000,transparent 85%)}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%}
::selection{background:var(--lime);color:#000}
.wrap{position:relative;z-index:1;width:min(1220px,calc(100% - 48px));margin:0 auto}
.px{font-family:var(--px)}.mono{font-family:var(--mono)}.lime{color:var(--lime)}.grey{color:var(--grey)}.bad{color:var(--bad)}
.crisp{image-rendering:pixelated}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ── header ── */
.hdr{position:sticky;top:0;z-index:50;transition:background .25s,border-color .25s,backdrop-filter .25s;border-bottom:1px solid transparent}
.hdr.scrolled{background:rgba(10,10,10,.78);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-color:var(--line)}
.hdr .in{height:74px;display:flex;align-items:center;gap:28px}
.wm{display:inline-flex;align-items:flex-end;gap:3px;font:700 24px/1 var(--px);letter-spacing:.06em}
.wm img{width:20px;height:20px;image-rendering:pixelated;margin-bottom:0}
.nav{display:flex;gap:4px}
.nav a{position:relative;padding:9px 14px;font:400 12px var(--px);letter-spacing:.1em;text-transform:uppercase;color:var(--grey);transition:color .15s}
.nav a:hover,.nav a.on{color:var(--txt)}
.nav a.on:after{content:'';position:absolute;left:14px;right:14px;bottom:2px;height:3px;background:var(--lime);box-shadow:0 0 10px var(--lime)}
.hdr .sp{flex:1}
.chip{display:inline-flex;align-items:center;gap:9px;height:38px;padding:0 14px;background:var(--panel2);border:0;clip-path:var(--step);--s:5px;font:500 12.5px var(--mono);color:var(--txt2);white-space:nowrap;cursor:pointer}
.chip:hover{background:#1f1f1f}.chip b{font:400 10px var(--px);letter-spacing:.1em;color:var(--grey);font-weight:400}.chip i{width:7px;height:7px;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.ham{display:none;width:42px;height:42px;place-items:center;background:var(--panel2);border:0;clip-path:var(--step);--s:5px}

/* ── buttons ── */
.btn{--c:var(--paper);--t:var(--ink);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 24px;border:0;background:var(--c);color:var(--t);font:700 13px var(--px);letter-spacing:.12em;text-transform:uppercase;clip-path:var(--step);white-space:nowrap;transition:transform .14s steps(2),filter .15s,background .15s;isolation:isolate}
.btn:hover{transform:translateY(-2px);filter:brightness(1.06)}.btn:active{transform:translateY(1px)}
.btn.lime{--c:var(--lime)}.btn.ghost{--c:var(--panel2);--t:var(--txt)}.btn.ghost:hover{--c:#222}
.btn.sm{height:38px;padding:0 16px;font-size:11px}.btn.xs{height:30px;padding:0 11px;font-size:10px}.btn.lg{height:60px;padding:0 32px;font-size:14px}
.btn[disabled]{opacity:.4;pointer-events:none}
.btn.lime:before{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);transform:translateX(-120%);z-index:-1}
.btn.lime:hover:before{animation:shine .8s ease}
@keyframes shine{to{transform:translateX(120%)}}
.btn.wal.on{--c:var(--panel2);--t:var(--txt);font-family:var(--mono);font-weight:500;letter-spacing:0;text-transform:none;font-size:13px}
.btn.wal.on:before{content:'';width:7px;height:7px;background:var(--lime);box-shadow:0 0 8px var(--lime);transform:none;position:static;animation:none}

/* ── receipt paper ── */
.paper{position:relative;background:var(--paper);color:var(--ink);font:500 15px/1.5 var(--mono)}
.paper.torn{-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) bottom/16px 9px repeat-x,linear-gradient(#000,#000) top/100% calc(100% - 9px) no-repeat;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) bottom/16px 9px repeat-x,linear-gradient(#000,#000) top/100% calc(100% - 9px) no-repeat}
.paper.torn2{-webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 90deg,#0000 91deg) top/16px 9px repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) bottom/16px 9px repeat-x,linear-gradient(#000,#000) center/100% calc(100% - 18px) no-repeat;mask:conic-gradient(from 135deg at top,#0000,#000 1deg 90deg,#0000 91deg) top/16px 9px repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) bottom/16px 9px repeat-x,linear-gradient(#000,#000) center/100% calc(100% - 18px) no-repeat}
.rl{display:flex;align-items:baseline;gap:10px}
.rl .dots{flex:1;border-bottom:2px dotted rgba(10,10,10,.28);transform:translateY(-4px)}
.rl s{color:#8a8a84}
.rh{font:700 15px var(--px);letter-spacing:.2em;text-align:center}
.rdash{border:0;border-top:2px dashed rgba(10,10,10,.25);margin:12px 0}
.barcode{height:44px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 7px,transparent 7px 8px,var(--ink) 8px 9px,transparent 9px 12px,var(--ink) 12px 15px,transparent 15px 16px)}
.stamp{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 18px;background:var(--lime);color:var(--ink);font:700 22px var(--px);letter-spacing:.18em}
.stamp.big{font-size:44px;padding:16px 30px}

/* ── sections ── */
.sec{position:relative;z-index:1;padding:130px 0}
.kick{display:inline-flex;align-items:center;gap:12px;font:400 12px var(--px);letter-spacing:.18em;color:var(--grey);text-transform:uppercase}.kick i{width:9px;height:9px;background:var(--lime);display:block}
.h2{margin:18px 0 16px;font:700 clamp(34px,4.6vw,62px)/1.04 var(--px);letter-spacing:-.01em}
.h2 em{font-style:normal;color:var(--lime)}
.lede{max-width:640px;margin:0;font-size:18px;color:var(--txt2)}
.card{position:relative;background:var(--panel);clip-path:var(--step);--s:9px}
.card.line{background:linear-gradient(var(--panel),var(--panel)) padding-box,linear-gradient(var(--line2),var(--line2)) border-box;border:2px solid transparent}
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}.rv.d4{transition-delay:.32s}

/* ── forms ── */
.input{width:100%;height:50px;padding:0 16px;background:#000;border:2px solid var(--line2);color:var(--txt);font:500 14.5px var(--mono);outline:none;clip-path:var(--step);--s:5px;transition:border-color .15s}
.input:focus{border-color:var(--lime)}textarea.input{height:auto;padding:13px 16px;resize:vertical;line-height:1.5}
.lbl{display:flex;justify-content:space-between;margin:0 0 9px;font:400 11px var(--px);letter-spacing:.12em;color:var(--grey);text-transform:uppercase}

/* ── status tags ── */
.tag{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 9px;font:700 10px var(--px);letter-spacing:.12em;clip-path:var(--step);--s:3px;white-space:nowrap}
.tag.live{background:var(--panel2);color:var(--txt2)}.tag.live i{width:6px;height:6px;background:var(--lime);animation:blink 1.2s steps(2) infinite}
.tag.q{background:rgba(255,211,107,.14);color:var(--warn)}.tag.paid{background:var(--lime);color:var(--ink)}.tag.pend{background:rgba(255,122,107,.12);color:var(--bad)}
@keyframes blink{50%{opacity:.15}}

/* ── progress to the threshold ── */
.prog{position:relative;height:14px;background:#000;clip-path:var(--step);--s:3px;overflow:hidden}
.prog i{position:absolute;inset:0 auto 0 0;background:repeating-linear-gradient(90deg,var(--lime) 0 10px,var(--lime2) 10px 12px);transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.prog.done i{background:var(--lime)}

/* ── toast / modal ── */
.toast{position:fixed;left:50%;bottom:28px;z-index:120;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:13px 20px;background:var(--paper);color:var(--ink);font:600 13.5px var(--mono);clip-path:var(--step);transition:.22s;max-width:min(560px,calc(100% - 32px))}
.toast.on{opacity:1;transform:translate(-50%,0)}.toast.bad{background:var(--bad)}
.modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:18px;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);overflow-y:auto}
.modal.on{display:grid;animation:fadein .2s}
@keyframes fadein{from{opacity:0}}

/* ── footer ── */
.foot{position:relative;z-index:1;margin-top:60px;border-top:1px solid var(--line);padding:46px 0 54px;color:var(--grey);font-size:13.5px}
.foot .in{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-start}
.foot .links{display:flex;gap:20px;flex-wrap:wrap;font:400 11px var(--px);letter-spacing:.1em;text-transform:uppercase}.foot .links a:hover{color:var(--txt)}

/* ── mobile ── */
@media(max-width:960px){
  .nav{position:fixed;top:74px;left:0;right:0;flex-direction:column;gap:0;padding:8px 24px 20px;background:rgba(10,10,10,.97);border-bottom:1px solid var(--line);transform:translateY(-10px);opacity:0;pointer-events:none;transition:.2s}
  .nav a{padding:15px 0;font-size:13px}.nav a.on:after{left:0;right:auto;width:22px}
  body.menu .nav{transform:none;opacity:1;pointer-events:auto}
  .ham{display:grid}.hide-m{display:none!important}
  .sec{padding:84px 0}.wrap{width:calc(100% - 32px)}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* wallet menu */
.wmenu{position:fixed;z-index:110;padding:8px;background:var(--panel2);box-shadow:inset 0 0 0 2px var(--line3);clip-path:var(--step);--s:7px;animation:fadein .14s}
.wmh{padding:8px 10px 12px;margin-bottom:6px;border-bottom:1px dashed var(--line3)}.wmh span{display:block;font:400 9.5px var(--px);letter-spacing:.14em;color:var(--lime)}.wmh code{font:500 13px var(--mono)}
.wmenu button{display:block;width:100%;padding:11px 10px;border:0;background:none;text-align:left;font:400 11px var(--px);letter-spacing:.1em;text-transform:uppercase;color:var(--txt2);clip-path:var(--step);--s:4px}
.wmenu button:hover{background:#222;color:var(--txt)}.wmenu button.bad{color:var(--bad)}

.imgfb{display:grid!important;place-items:center;background:#000;color:var(--lime);font:700 16px var(--px)}

/* live refresh: re-renders don't replay entrance animations */
.np .rv,.np .rv *{transition:none!important;animation:none!important}.np .rv{opacity:1!important;transform:none!important}