/* copied from emo.neonforge.uk (make_css.py) - edit there, not here */
:root{--ink:#111;--paper:#fff;--muted:#444;--faint:#777;--hair:#d6d6d6;--soft:#f3f3f3;--red:#df3d27;--deep:#b61017;--peach:#ffc48a;--orange:#ff892b;--tint:#fbe9e5;
  --ok:#1f7a3a;--ok-soft:#e5f3e9;--display:'Archivo',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace;--ease:cubic-bezier(.2,.7,.1,1);--wrap:1280px;--gutter:48px}
@media(max-width:900px){:root{--gutter:24px}}@media(max-width:560px){:root{--gutter:16px}}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.55 var(--display);-webkit-font-smoothing:antialiased}
a{color:inherit}:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.wrap{max-width:calc(var(--wrap) + 2*var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.mono{font-family:var(--mono)}
.disp{font-family:var(--display);font-weight:900;font-stretch:62%;text-transform:uppercase;line-height:.88;letter-spacing:-.01em}
.red{color:var(--red)}.orange{color:var(--orange)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 12px;z-index:99}.skip:focus{left:8px}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:2px solid var(--ink)}
.top .wrap{display:flex;align-items:center;gap:28px;height:76px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo .mark{width:44px;height:44px;border-radius:99px;background:var(--ink);display:grid;place-items:center;overflow:hidden;position:relative;flex:none}
.logo .mark i{position:absolute;left:-6px;right:-6px;height:6px;border-radius:6px}
.logo .wm{display:flex;flex-direction:column;line-height:1}
.logo .wm b{font-family:var(--display);font-weight:900;font-stretch:62%;font-size:40px;letter-spacing:-.01em;line-height:.85}
.logo .wm span{font-size:9.5px;font-weight:800;letter-spacing:.38em;color:var(--red);margin-top:4px;text-transform:uppercase}
.nav{display:flex;gap:22px;margin-left:12px}
.nav a{text-decoration:none;font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap}
.nav a:hover{border-bottom-color:var(--red)}
.top .cta{margin-left:auto;display:flex;gap:12px}
@media(max-width:1240px){.nav{display:none}}
@media(max-width:560px){.logo .wm span{display:none}.top .cta .btn-outline{display:none}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border:2px solid var(--ink);background:transparent;color:var(--ink);
  font:700 15px var(--display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .15s var(--ease),box-shadow .15s var(--ease),background .15s,color .15s,border-color .15s}
.btn-sm{min-height:44px;padding:0 18px;font-size:14px}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover:not(:disabled){background:var(--red);border-color:var(--red);transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.btn-outline:hover:not(:disabled){background:var(--ink);color:#fff}
.btn-red{background:var(--red);border-color:var(--red);color:#fff}
.btn-red:hover:not(:disabled){transform:translate(-3px,-3px);box-shadow:6px 6px 0 #fff}
.btn-light{background:#fff;border-color:#fff;color:var(--ink)}.btn-light:hover:not(:disabled){background:var(--red);border-color:var(--red);color:#fff}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* ---------- strip + hero ---------- */
.strip{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--ink);font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media(max-width:700px){.strip span:nth-child(2){display:none}}
.hero{padding:56px 0 34px}
.eyebrow{display:flex;align-items:center;gap:14px;font-size:14px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--red)}
.eyebrow::before{content:'';width:34px;height:3px;background:var(--red)}
.hero h1{margin:26px 0 0;font-size:clamp(64px,11.2vw,168px)}
.hero h1 span{display:block}
.hero .row{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-end;justify-content:space-between;margin-top:34px}
.hero p{margin:0;max-width:520px;font-size:18px;color:var(--ink)}
.hero .btns{display:flex;gap:12px;flex-wrap:wrap}
.wave{display:block;width:100%;height:110px;margin-top:22px}

/* ---------- sections ---------- */
.sec{padding:56px 0}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid var(--ink);padding-bottom:14px;margin-bottom:34px}
.sec-head h2{margin:0;font-size:15px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.sec-head .no{font:500 13px var(--mono);color:var(--red)}
.big{font-size:clamp(46px,6.4vw,92px);margin:0 0 30px}

/* ---------- builder ---------- */
.builder{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:48px;align-items:stretch}
@media(max-width:1060px){.builder{grid-template-columns:1fr}}
.step{margin-bottom:46px}
.step-h{display:flex;align-items:baseline;gap:16px;border-bottom:1px solid var(--ink);padding-bottom:10px;margin-bottom:18px}
.step-h .n{font:500 13px var(--mono);color:var(--red)}
.step-h h3{margin:0;font-size:clamp(30px,3.4vw,44px)}
.step-h .aside{margin-left:auto;font:500 12px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.versions{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.vbtn{text-align:left;border:2px solid var(--ink);background:var(--paper);color:var(--ink);padding:12px 14px;cursor:pointer;font:inherit;display:flex;flex-direction:column;gap:4px;transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.vbtn b{font-family:var(--display);font-weight:900;font-stretch:62%;font-size:32px;line-height:.9}
.vbtn span{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.vbtn:hover:not(:disabled):not([aria-pressed=true]){transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--red)}
.vbtn[aria-pressed=true]{background:var(--ink);color:#fff}.vbtn[aria-pressed=true] span{color:var(--peach)}
.vbtn:disabled{border-color:var(--hair);color:var(--faint);cursor:default;background:repeating-linear-gradient(-45deg,var(--soft) 0 2px,transparent 2px 10px)}
.vnote{margin:16px 0 0;font-size:16px;color:var(--muted);max-width:900px}.vnote a{color:var(--red);font-weight:700}
.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0;border-top:1px solid var(--ink);margin-bottom:22px}
.preset{text-align:left;border:0;border-bottom:1px solid var(--ink);background:transparent;color:var(--ink);padding:14px 16px 14px 0;cursor:pointer;font:inherit;display:grid;grid-template-columns:auto 1fr;gap:2px 14px;align-items:baseline}
.preset .cnt{font:500 12px var(--mono);color:var(--red);grid-row:1/3}
.preset b{font-size:17px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.preset span.d{font-size:13.5px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.preset:hover b{color:var(--red)}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
input[type=search],select{font:500 15px var(--display);padding:0 14px;min-height:48px;border:2px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);-webkit-appearance:none;appearance:none}
select{padding-right:36px;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) 21px,calc(100% - 13px) 21px;background-size:5px 5px;background-repeat:no-repeat}
input[type=search]{flex:1;min-width:200px}
.seg{display:inline-flex;border:2px solid var(--ink)}
.seg button{border:0;background:transparent;color:var(--ink);padding:0 16px;font:700 13px var(--display);letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.seg button+button{border-left:2px solid var(--ink)}
.seg button[aria-pressed=true]{background:var(--ink);color:#fff}
.mods{margin-top:16px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);max-height:72vh;overflow:auto}
.mod{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:14px 4px;border-bottom:1px solid var(--hair);cursor:pointer;align-items:start}
.mod:last-child{border-bottom:0}.mod:hover{background:var(--soft)}
.mod input{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:2px solid var(--ink);margin:2px 0 0;background:var(--paper);display:grid;place-items:center;cursor:pointer}
.mod input:checked{background:var(--red);border-color:var(--red)}
.mod input:checked::after{content:'';width:10px;height:6px;border-left:3px solid #fff;border-bottom:3px solid #fff;transform:translateY(-2px) rotate(-45deg)}
.mod.off{cursor:default;opacity:.55}.mod.off:hover{background:transparent}.mod.off input{cursor:default}
.mod.on{background:var(--tint)}
.mod .nm{font-weight:800;font-size:17px;text-transform:uppercase;letter-spacing:.01em;word-break:break-word}
.mod .nm small{font:500 12px var(--mono);color:var(--muted);text-transform:none;letter-spacing:0;margin-left:8px}
.mod .meta{font:500 12px var(--mono);color:var(--faint);margin-top:2px;word-break:break-word}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.chip{display:inline-block;padding:2px 7px;border:1px solid var(--hair);font:500 11px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.chip.warn{border-color:var(--orange);color:#9a4a00;background:#fff4e8}.chip.bad{border-color:var(--red);color:var(--red);background:var(--tint)}.chip.ok{border-color:var(--ok);color:var(--ok);background:var(--ok-soft)}
.empty{padding:28px 4px;color:var(--muted);font:500 13px var(--mono);text-transform:uppercase}

/* ---------- server panel (dark card on a red block) ---------- */
.side{position:relative}
.srv{position:sticky;top:96px;max-height:calc(100vh - 116px);overflow:auto;background:var(--ink);color:#fff;border:2px solid var(--ink);box-shadow:14px 14px 0 var(--red);padding:24px;margin-right:14px}
@media(max-width:1060px){.srv{position:static;max-height:none}}
.srv .step-h{border-bottom-color:#fff}.srv .step-h h3{font-size:40px}
.srv .lbl{display:block;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin:22px 0 8px;color:#fff}
.srv .hint{font-size:13px;color:#bbb;margin-top:7px}
.srv select{width:100%;background-color:#1b1b1b;color:#fff;border-color:#fff;background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%)}
.selbox{border:1px dashed #555;padding:12px;min-height:58px}
.selbox .top2{display:flex;justify-content:space-between;align-items:baseline}
.selbox .count{font-family:var(--display);font-weight:900;font-stretch:62%;font-size:28px;text-transform:uppercase;line-height:1}
.selchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;max-height:150px;overflow:auto}
.selchip{display:inline-flex;align-items:center;gap:2px;border:1px solid #555;padding:2px 2px 2px 9px;font:500 12px var(--mono)}
.selchip button{border:0;background:transparent;color:#999;cursor:pointer;font-size:15px;line-height:1;padding:0 6px}.selchip button:hover{color:var(--red)}
button.link{border:0;background:none;color:var(--peach);cursor:pointer;font:700 12px var(--display);letter-spacing:.12em;text-transform:uppercase;padding:0}
.kind{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kind button{text-align:left;border:2px solid #fff;background:transparent;color:#fff;padding:12px;cursor:pointer;font:inherit}
.kind button b{display:block;font-family:var(--display);font-weight:900;font-stretch:62%;font-size:26px;text-transform:uppercase;line-height:.95}
.kind button span{display:block;font-size:12.5px;color:#bbb;margin-top:4px}
.kind button[aria-pressed=true]{background:#fff;color:#111}.kind button[aria-pressed=true] span{color:#444}
.kind button:disabled{border-color:#444;color:#666;cursor:not-allowed;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 10px)}.kind button:disabled span{color:#666}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;cursor:pointer;margin-top:18px}
.check input{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:2px solid #fff;margin:1px 0 0;flex:none;display:grid;place-items:center;cursor:pointer;background:transparent}
.check input:checked{background:var(--red);border-color:var(--red)}.check input:checked::after{content:'';width:9px;height:5px;border-left:3px solid #fff;border-bottom:3px solid #fff;transform:translateY(-2px) rotate(-45deg)}
.check input:disabled{opacity:.6;cursor:default}
.actions{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-top:24px}.actions .btn{padding:0 16px}
.srv .btn-outline{border-color:#fff;color:#fff}.srv .btn-outline:hover:not(:disabled){background:#fff;color:#111}
.callout{padding:12px 14px;font-size:14px;margin-top:16px;border-left:4px solid}
.callout.bad{border-color:var(--red);background:rgba(223,61,39,.14)}.callout.ok{border-color:#4ade80;background:rgba(74,222,128,.1)}.callout.info{border-color:#888;background:rgba(255,255,255,.06)}
.callout ul{margin:6px 0 0;padding-left:18px}
.plan h4{margin:16px 0 6px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.plan ul{margin:0;padding-left:18px;font-size:13.5px;max-height:180px;overflow:auto;color:#ddd}
.plan .sub{color:#999}
details{margin-top:8px}details summary{cursor:pointer;font:500 12px var(--mono);color:#bbb;text-transform:uppercase;letter-spacing:.04em}
pre{white-space:pre-wrap;word-break:break-word;background:#0b0b0b;color:#ddd;border:1px solid #333;padding:10px;max-height:320px;overflow:auto;font:500 11.5px/1.5 var(--mono);margin:10px 0 0}

/* ---------- builds ---------- */
.jobs{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:20px}
@media(max-width:420px){.jobs{grid-template-columns:1fr}}
.job{border:2px solid var(--ink);padding:18px;background:var(--paper)}
.job .hd{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.job .ttl{font-family:var(--display);font-weight:900;font-stretch:62%;font-size:30px;text-transform:uppercase;line-height:.95}
.job .meta{font:500 12px var(--mono);color:var(--faint);margin-top:6px;text-transform:uppercase;letter-spacing:.03em}
.badge{font:700 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border:2px solid var(--ink);white-space:nowrap}
.badge.running,.badge.queued{background:var(--peach)}.badge.done{background:var(--ink);color:#fff}.badge.failed,.badge.cancelled{background:var(--red);border-color:var(--red);color:#fff}
.bar{height:12px;border:2px solid var(--ink);margin-top:16px;background:var(--paper)}
.bar i{display:block;height:100%;background:repeating-linear-gradient(-45deg,var(--red) 0 8px,var(--orange) 8px 16px);transition:width .6s var(--ease)}
.job.running .bar i{background-size:22.6px 22.6px;animation:mv 1s linear infinite}@keyframes mv{to{background-position:22.6px 0}}
.job .stage{margin-top:10px;font-weight:700}.job .stage .sub{font-weight:400;color:var(--muted)}
.job .sum{font:500 12px var(--mono);color:var(--muted);margin-top:10px;text-transform:uppercase}
.job .callout.bad{color:var(--ink)}
.job .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.job pre{background:var(--soft);color:var(--ink);border-color:var(--hair)}
.nobuilds{font-size:16px;color:var(--muted);max-width:620px;margin:0}

/* ---------- how it works (dark band) ---------- */
.dark{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.dark::after{content:'';position:absolute;right:-60px;bottom:-60px;width:420px;height:420px;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 14px);pointer-events:none}
.dark .sec-head{border-bottom-color:#fff}
.rows{border-top:1px solid #fff}
.rowi{display:grid;grid-template-columns:90px minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:baseline;padding:26px 0;border-bottom:1px solid #444}
.rowi .no{font:500 13px var(--mono);color:var(--orange)}
.rowi h4{margin:0;font-size:clamp(30px,3.6vw,46px)}
.rowi p{margin:0;color:#ccc;font-size:16.5px}.rowi p b{color:#fff}.rowi a{color:var(--peach)}
@media(max-width:800px){.rowi{grid-template-columns:50px 1fr}.rowi p{grid-column:2}}
code{font:500 .86em var(--mono);background:rgba(127,127,127,.18);padding:1px 5px}

/* ---------- legend ---------- */
.legend{display:grid;gap:0;border-top:1px solid var(--ink)}
.legend div{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.legend div span:last-child{color:var(--muted);font-size:16px}
@media(max-width:600px){.legend div{grid-template-columns:1fr;gap:6px}}

/* ---------- CTA + footer ---------- */
.ctaband{display:block;background:var(--red);color:#fff;text-decoration:none}
.ctaband .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:44px;padding-bottom:44px}
.ctaband b{font-size:clamp(54px,9vw,128px)}
.ctaband svg{width:72px;height:72px;flex:none;transition:transform .2s var(--ease)}.ctaband:hover svg{transform:translateX(10px)}
footer .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;padding-top:26px;padding-bottom:110px}
footer a,footer span{font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
footer .copy{color:var(--faint);margin-left:auto}

/* ---------- mobile bar ---------- */
.mbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:30;display:none;align-items:center;gap:10px;background:var(--ink);color:#fff;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--red);padding:10px 10px 10px 16px}
.mbar span{font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:14px}
.mbar .btn{margin-left:auto}
@media(max-width:1060px){.mbar.show{display:flex}}

/* ---------- dark mode: keep the editorial look, swap paper and ink ---------- */
@media (prefers-color-scheme:dark){
  :root{--ink:#f1f1f1;--paper:#121212;--muted:#bdbdbd;--faint:#8c8c8c;--hair:#333;--soft:#1c1c1c;--tint:#2b1713;--ok:#4ade80;--ok-soft:#14261b}
  .top{background:rgba(18,18,18,.94)}
  .logo .mark{background:#000;box-shadow:inset 0 0 0 2px #333}
  .btn-dark{color:#121212}.btn-dark:hover:not(:disabled){color:#fff}
  .vbtn[aria-pressed=true]{color:#121212}.vbtn[aria-pressed=true] span{color:var(--deep)}
  .seg button[aria-pressed=true]{color:#121212}
  .srv{background:#000;border-color:#333}
  .dark{background:#000}
  .chip.warn{color:#ffb36b;background:#2a1a0a}
  .badge.done{color:#121212}
  .mbar{background:#000;border-color:#333;color:#fff}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}