*{box-sizing:border-box}
body{margin:0;background:#FAF8F3;color:var(--text1);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
.band{padding:var(--space-7) var(--space-4);position:relative;z-index:1}
.band>.inner{max-width:1080px;margin:0 auto}
.band.win{background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed}
@media (hover:none),(max-width:760px){.band.win,.band.ink.win{background-attachment:scroll}}
.band.win.win-warm{background-color:#F3F0E8;background-image:url("../images/band-warm.png")}
.band.win.win-cold{background-color:#F4F9FE;background-image:url("../images/band-cold.png")}
.band.win.win-white{background-color:#fff;background-image:url("../images/band-white.png")}
.band.ink{color-scheme:dark;--text1:#F4F9FE;--text2:#E4F1FF;--text3:#93A0AC;--text-accent:#D4FF00;--weight-small:300;--weight-overline:400;color:var(--text1)}
.band.ink.win{background-color:#000810;background-image:url("../images/band-dark.png")}
.stack{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start}
.stack-sm{display:flex;flex-direction:column;gap:var(--space-2);align-items:flex-start}
.stack>*,.stack-sm>*{margin:0}
.row{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center}
.measure{max-width:52ch}
.measure-wide{max-width:66ch}
.lead{margin-bottom:var(--space-5)}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--space-5)}
.nav,.foot{max-width:1080px;margin:0 auto;padding:var(--space-4);display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;justify-content:space-between;position:relative;z-index:3}
.nav img,.foot img{height:20px;width:auto;display:block;align-self:flex-start}
.navlinks{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center}
.foot{border-top:1px solid #00081016;background:#FAF8F3}
.btn{padding:11px 20px;border-radius:var(--radius-2);display:inline-flex;align-items:center;justify-content:center;line-height:1.25;text-decoration:none;white-space:nowrap}
.btn.pri{background:#D4FF00;color:#1a1f00;font-weight:600}
.btn.sec{border:1px solid #00081033;color:var(--text2)}
.cta .btn.sec{border-color:#E4F1FF3d;color:var(--text2)}
.hero{padding-top:var(--space-5);padding-bottom:var(--space-7)}
.hero h1{font-size:clamp(1.875rem,4.4vw,3rem);max-width:26ch}
.kick{display:flex;align-items:center;gap:var(--space-3)}
.kick::before{content:"";width:28px;height:1px;background:#849E00}
.band.ink .kick::before{background:#D4FF00}
.card{border-radius:var(--radius-3);border:1px solid #00081014;background:#fff;box-shadow:0 1px 2px #0008100f,0 6px 18px -10px #00081024}
.card.deep{box-shadow:0 1px 2px #0008100f,0 8px 22px -10px #0008102b,0 24px 50px -24px #00081024}
.band.ink .card{background:#F4F9FE0d;border-color:#E4F1FF1f;box-shadow:none}
.chain{padding:var(--space-5) var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}
.chain>*{margin:0}
.path{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.pnode{padding:7px var(--space-3);border-radius:var(--radius-2);background:#FAF8F3;border:1px solid #00081020;box-shadow:0 1px 1px #0008100a;display:inline-block;line-height:1.4;white-space:nowrap}
@media (max-width:600px){.pnode{white-space:normal}}
.pnode.hit{background:#F7FBE8;border-color:#849E0088;box-shadow:0 1px 1px #849E001f}
.band.ink .pnode{background:#F4F9FE0f;border-color:#E4F1FF29;box-shadow:none}
.pedge{color:var(--text3)}
.state{font-family:"DM Mono",ui-monospace,monospace;font-size:.8125rem;padding:2px 7px;border-radius:4px;background:#00081010;white-space:nowrap}
.band.ink .state,.cta .state{background:#E4F1FF14}
.finds{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-2) var(--space-3);align-items:baseline;margin-top:var(--space-4);max-width:70ch}
.finds>*{margin:0}
.finds .ar{color:#849E00}
.loop{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:var(--space-4)}
.lp{padding-top:var(--space-3);border-top:1px solid #00081024;display:flex;flex-direction:column;gap:var(--space-2)}
.lp>*{margin:0}
.band.ink .lp{border-top-color:#E4F1FF33}
.lp.on{border-top:2px solid #D4FF00}
.rungs{display:flex;flex-direction:column}
.rung{padding:var(--space-4) 0;border-bottom:1px solid #00081012;display:flex;flex-direction:column;gap:var(--space-2)}
.rung:last-child{border-bottom:0}
.rung>*{margin:0}
.cta{max-width:1160px;margin:0 auto;padding:var(--space-6) var(--space-5);border-radius:20px;background:linear-gradient(180deg,#0052A3cc 0%,#002E5Cdb 34%,#001F3Deb 68%,#000810f7 100%);backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1);color-scheme:dark;--text1:#F4F9FE;--text2:#E4F1FF;--text3:#C2E1FF;--text-accent:#D4FF00;--weight-small:300;--weight-overline:400;color:var(--text1);box-shadow:0 1px 0 #ffffff1f inset}
.cta a{color:#D4FF00}
.cta .btn.pri{color:#1a1f00}
@media (max-width:760px){.cta{padding:var(--space-5) var(--space-4);border-radius:14px}}
a{color:var(--surface-link-text)}
a:hover{color:var(--surface-link-text-hover)}
.band.ink a{color:#D4FF00}

/* ── product surfaces: how the tool itself renders ─────────────────── */
.ui{border:1px solid #00081014;border-radius:12px;background:#FAF8F3;overflow:hidden;box-shadow:0 1px 2px #0008100f,0 10px 26px -12px #0008102e,0 28px 56px -28px #00081029}
.ui-head{padding:20px 22px 16px;display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:flex-end;justify-content:space-between}
.ui-head>*{margin:0}
.ui-eyebrow{font-family:"DM Mono",ui-monospace,monospace;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:#849E00;margin:0}
.ui-title{margin:6px 0 0;font-size:1.5rem;font-weight:700;letter-spacing:-.01em;color:#000810}
.ui-bar{display:flex;align-items:center;gap:12px;padding:12px 22px;border-top:1px solid #00081014;border-bottom:1px solid #00081014;background:#ffffff8c}
.ui-bar img{flex:none;display:block}
.ui-bar-label{font-family:"DM Mono",ui-monospace,monospace;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:#000810;margin:0}
.ui-count{font-size:.75rem;white-space:nowrap;line-height:1.3;color:#0052A3;border:1px solid #C2E1FF;background:#F4F9FE;border-radius:999px;padding:1px 9px}
.ui-rule{flex:1;height:1px;background:#C2E1FF;min-width:16px}
.ui-act{margin:0;font-size:.8125rem;color:#6E8500;white-space:nowrap}
.ui-row{padding:14px 22px;border-bottom:1px solid #00081010;display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:var(--space-3);align-items:center;border-left:2px solid var(--dim-500,#00081020)}
.ui-row:last-child{border-bottom:0}
.ui-row img{width:20px;height:20px;display:block}
.ui-row>*{margin:0}
.ui-name{font-size:.9375rem;font-weight:600;color:#000810}
.ui-edge{font-family:"DM Mono",ui-monospace,monospace;font-size:.6875rem;color:#5A6673;white-space:nowrap}
.dimchip{display:inline-block;white-space:nowrap;line-height:1.4;font-family:"DM Mono",ui-monospace,monospace;font-size:.625rem;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:#0008100a;color:#3B4752;border:1px solid #00081020;margin-top:4px}
@media (max-width:680px){.ui-row{grid-template-columns:22px minmax(0,1fr)}.dimchip{white-space:normal}.ui-edge{grid-column:2;justify-self:start}}
/* result rows, the way a query returns them */
.res{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-3) var(--space-4);align-items:baseline;padding:16px 22px;border-bottom:1px solid #00081010}
.res:last-child{border-bottom:0}
.res>*{margin:0}
.res .qty{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:#000810;line-height:1}
.res .qty.warn{color:#A82E57}