/* 404 and "launching soon" pages (design A: the pixel M). Built by preview/_build/errors/build.py. Classes start with ep- so nothing else is touched. */
.ep{--ep-line:rgba(255,255,255,.16);position:relative;display:grid;align-content:center;overflow:hidden;min-height:calc(100vh - 56px);min-height:calc(100svh - 56px);padding:clamp(28px,5vh,64px) 0;background:#09090c;color:#c3c3cf;font:400 16px/1.55 "IBM Plex Sans",system-ui,-apple-system,sans-serif}
.ep *{box-sizing:border-box}
.ep::before{content:"";position:absolute;inset:0;background:radial-gradient(55% 60% at 70% 45%,rgba(127,88,236,.26),transparent 70%);pointer-events:none}
.ep::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(60% 70% at 60% 40%,#000,transparent);mask-image:radial-gradient(60% 70% at 60% 40%,#000,transparent);pointer-events:none}
.ep-w{position:relative;z-index:1;width:min(1160px,100% - 40px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,6vw,96px);align-items:center}
.ep-eb{display:inline-flex;align-items:center;gap:10px;font:400 12px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:#d4b4ff}
.ep-eb::before{content:"";width:7px;height:7px;border-radius:50%;background:#7ee0a6;animation:ep-ping 2.4s infinite}
@keyframes ep-ping{0%{box-shadow:0 0 0 0 rgba(126,224,166,.5)}70%,100%{box-shadow:0 0 0 9px rgba(126,224,166,0)}}
.ep h1{margin:14px 0 16px;font:800 clamp(34px,5.4vw,68px)/1.02 "Archivo","Helvetica Neue",Arial,sans-serif;letter-spacing:-.04em;color:#fff;text-wrap:balance}.ep h1 em{font-style:normal;color:#9372ff}
.ep-sb{margin:0;max-width:34em;font-size:clamp(16px,2vw,19px);color:#c3c3cf}
.ep-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.ep a.ep-b1,.ep a.ep-b2{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 26px;border-radius:99px;font:600 16px "IBM Plex Sans",system-ui,sans-serif;text-decoration:none;transition:background .25s,transform .25s,border-color .25s}
.ep a.ep-b1{background:#7f58ec;color:#fff;box-shadow:0 18px 40px -18px #7f58ec}.ep a.ep-b1:hover{background:#8f6cf5;transform:translateY(-2px)}
.ep a.ep-b2{border:1px solid var(--ep-line);color:#fff}.ep a.ep-b2:hover{border-color:#9372ff}
.ep-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.ep .ep-chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:99px;border:1px solid var(--ep-line);background:rgba(255,255,255,.03);color:#fff;text-decoration:none;font-size:15px;transition:border-color .2s,transform .2s}.ep .ep-chips a:hover{border-color:#9372ff;transform:translateY(-2px)}
.ep-stage{--ps:64px;position:relative;display:grid;justify-items:center;gap:22px}
.ep-pm{--s:var(--ps);--g:calc(var(--s)*.2);display:grid;grid-template-columns:repeat(5,var(--s));grid-template-rows:repeat(5,var(--s));gap:var(--g);width:max-content}
.ep-pm i{grid-column:calc(var(--c) + 1);grid-row:calc(var(--r) + 1);border-radius:calc(var(--s)*.22);background:#fff;opacity:.9}
.ep-pm i:nth-child(4),.ep-pm i:nth-child(5){background:#e2d6ff}
.ep-cap{font:400 11px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#a9a3c0;text-align:center}
/* 404: one tile has fallen out and roams the screen, the rest flicker */
.ep[data-mode="nf"] .ep-pm i{animation:ep-flick 7s steps(1) infinite;animation-delay:calc(var(--n)*.37s)}
@keyframes ep-flick{0%,92%,100%{opacity:.9;transform:none}93%{opacity:.25;transform:translateX(3px)}95%{opacity:.9;transform:translateX(-3px)}97%{opacity:.4}}
.ep[data-mode="nf"] .ep-pm i:nth-child(8){opacity:0;animation:none}
.ep-fl{position:absolute;left:50%;top:50%;width:var(--ps);height:var(--ps);margin:calc(var(--ps)/-2) 0 0 calc(var(--ps)/-2);border-radius:calc(var(--ps)*.22);background:#9372ff;box-shadow:0 0 36px -2px rgba(147,114,255,.95);animation:ep-roam 11s ease-in-out infinite}
@keyframes ep-roam{0%{transform:translate(0,0) rotate(0)}18%{transform:translate(150px,-120px) rotate(40deg)}38%{transform:translate(-170px,-60px) rotate(-30deg)}58%{transform:translate(120px,130px) rotate(60deg)}78%{transform:translate(-110px,140px) rotate(-20deg)}100%{transform:translate(0,0) rotate(0)}}
/* coming soon: the M lights up tile by tile while a bar fills */
.ep[data-mode="soon"] .ep-pm i{opacity:.12;transform:scale(.8);animation:ep-build 8s ease-in-out infinite;animation-delay:calc(var(--n)*.45s)}
@keyframes ep-build{0%{opacity:.12;transform:scale(.8);box-shadow:none}10%,70%{opacity:1;transform:scale(1);box-shadow:0 0 24px -4px rgba(147,114,255,.95)}85%,100%{opacity:.12;transform:scale(.8);box-shadow:none}}
.ep-bar{width:min(320px,100%);height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}.ep-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#7f58ec,#b79cff);animation:ep-fill 8s ease-in-out infinite}
@keyframes ep-fill{0%{width:6%}70%,100%{width:82%}}
@media(max-width:900px){.ep-w{grid-template-columns:1fr}.ep-stage{--ps:44px;order:-1;margin-bottom:6px}@keyframes ep-roam{0%{transform:translate(0,0)}25%{transform:translate(90px,-60px)}50%{transform:translate(-90px,-20px)}75%{transform:translate(40px,80px)}100%{transform:translate(0,0)}}}
@media(max-width:700px){.ep a.ep-b1,.ep a.ep-b2{width:100%}}
@media(prefers-reduced-motion:reduce){.ep *,.ep *::before,.ep *::after{animation:none!important;transition:none!important}.ep[data-mode="soon"] .ep-pm i{opacity:1;transform:none}.ep-bar i{width:82%}.ep-fl{transform:translate(120px,-90px)}}