/* ============================================================
   INNER PUBLIC PAGES — "Farm" theme: /login /stats /bounty /news /help
   /terms /privacy and the 404
   Loaded by inc/mine_head.php on every Farm page except the homepage,
   on top of mine.css (tokens, header, footer, .btn, .kick, .floor,
   .dust, .mach, .qs). Ported from mockup/inner/inner.css.

   Same PERFORMANCE RULE as mine.css: only transform/opacity animate,
   and only on wrapper spans, never on an <svg> itself.
   ============================================================ */
:root{--ok:#4ade80;--bad:#f87171;--warn:#facc15}
[hidden]{display:none!important}

/* header: where you are */
.nav a.on{color:var(--ink);position:relative}
.nav a.on::after{content:"";position:absolute;left:50%;bottom:-9px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--a);box-shadow:0 0 10px var(--a)}

/* ================= PAGE HEAD (shared) ================= */
.ph{position:relative;overflow:hidden;isolation:isolate;padding:62px 0 54px;border-bottom:1px solid var(--line)}
.ph::before{content:"";position:absolute;inset:0;z-index:-3;
  background:radial-gradient(38% 70% at 78% 62%,color-mix(in srgb,var(--a) 17%,transparent),transparent 70%),
             radial-gradient(30% 60% at 6% 0%,color-mix(in srgb,var(--b) 12%,transparent),transparent 70%)}
.ph .floor{height:280px;opacity:.55}
.ph .w{display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center}
.ph .kick::before{display:none}
.ph h1{font:800 clamp(34px,4.7vw,62px)/1.03 'Unbounded',sans-serif;letter-spacing:-.04em;margin:18px 0 18px}
.ph h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 26px var(--glow))}
.ph .sub{color:var(--mut);font-size:17px;max-width:540px}
.art{position:relative;container-type:inline-size;width:100%;max-width:460px;justify-self:end}
.art>svg{display:block;width:100%;height:auto;overflow:visible}
.art .lyr svg{display:block;width:100%;height:100%}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.tags span{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:99px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line);font-size:13px;color:var(--mut)}
.tags b{font:700 13px 'JetBrains Mono',monospace;color:var(--ink)}

/* page body + generic panel */
.pb{padding:54px 0 96px}
.pn{position:relative;border-radius:22px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line2),0 30px 60px -42px #000}
.pn-h{display:flex;align-items:center;gap:12px;padding:15px 22px;border-bottom:1px dashed var(--line2);font:600 11px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.pn-h b{color:var(--ink);font-size:12px}.pn-h .sp{flex:1}
.pn-h .ic{width:16px;height:16px;color:var(--a)}
.hd2{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 18px}
.hd2 h2{font:700 clamp(22px,2.4vw,28px)/1.15 'Unbounded',sans-serif;letter-spacing:-.03em}
.hd2 p{color:var(--mut);font-size:14.5px;max-width:420px}
.void{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:30px 22px 34px}
.void .vi{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;color:var(--mut);margin-bottom:6px;box-shadow:inset 0 0 0 1px var(--line2);background:repeating-linear-gradient(-45deg,rgba(255,255,255,.035) 0 6px,transparent 6px 12px)}
.void .vi .ic{width:24px;height:24px}
.void b{font:700 15px 'Unbounded',sans-serif;letter-spacing:-.01em}
.void span{color:var(--mut);font-size:14px;max-width:360px}

/* inputs (login + bounty) */
.inp{display:flex;align-items:center;gap:12px;height:56px;padding:0 8px 0 16px;border-radius:15px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line2);transition:box-shadow .2s,background .2s}
.inp:focus-within{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1.5px var(--a),0 0 0 4px color-mix(in srgb,var(--a) 16%,transparent)}
.inp>.ic{color:var(--mut)}
.inp:focus-within>.ic{color:var(--a)}
.inp input{flex:1;min-width:0;height:100%;background:none;border:0;outline:0;color:var(--ink);font:500 15px 'Inter',sans-serif}
.inp input::placeholder{color:color-mix(in srgb,var(--mut) 70%,transparent)}
.inp .eye{all:unset;cursor:pointer;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:var(--mut)}
.inp .eye:hover{color:var(--ink);background:rgba(255,255,255,.05)}
.inp .eye:focus-visible{outline:2px solid var(--a)}
.msg{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:13px;font-size:13.5px;line-height:1.45}
.msg .ic{width:17px;height:17px;margin-top:1px}
.msg.bad{background:color-mix(in srgb,var(--bad) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 40%,transparent);color:#fecaca}
.msg.bad .ic{color:var(--bad)}
.msg.ref{background:color-mix(in srgb,var(--b) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--b) 35%,transparent);color:var(--ink)}
.msg.ref .ic{color:var(--b)}
.msg.ok{background:color-mix(in srgb,var(--ok) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 35%,transparent)}
.msg.ok .ic{color:var(--ok)}
.msg.wait{background:color-mix(in srgb,var(--a) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 35%,transparent)}
.msg.wait .ic{color:var(--a)}
.msg.info{color:var(--mut);padding:0}
.msg b{color:var(--ink)}

/* ================= LOGIN — one calm card, dead centre ================= */
.auth{position:relative;isolation:isolate;min-height:calc(100vh - 70px);display:grid;place-items:center;padding:56px 20px 64px}
.auth::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(42% 46% at 50% 38%,color-mix(in srgb,var(--a) 9%,transparent),transparent 70%)}
.acc{width:100%;max-width:440px;padding:36px 36px 30px;border-radius:24px;background:var(--bg2);box-shadow:inset 0 0 0 1px var(--line2),0 40px 80px -40px #000}
.acc-hd{text-align:center;margin-bottom:26px}
.acc-hd .mark{width:44px;height:50px;margin:0 auto 18px}
.acc-hd .mark .ic{width:22px;height:22px}
.acc-hd h1{font:700 22px/1.25 'Unbounded',sans-serif;letter-spacing:-.025em;margin-bottom:8px;text-wrap:balance}
.acc-hd p{color:var(--mut);font-size:14.5px;line-height:1.55}
.acc-hd p b{color:var(--ink);font-weight:600}
.acc form{display:grid;gap:16px}
.fld label{display:block;font-size:13.5px;font-weight:600;margin-bottom:8px}
.fld .hint{margin-top:7px;font-size:12.5px;color:var(--mut)}
.acc .btn{width:100%;justify-content:center;padding:16px 26px;font-size:15.5px;margin-top:4px}
.acc .rule{height:1px;background:var(--line);margin:22px 0 18px}
.facts{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--mut)}
.facts span{display:inline-flex;align-items:center;gap:7px}
.facts .ic{width:15px;height:15px;color:var(--ok)}
.fine2{margin-top:14px;font-size:12.5px;color:var(--mut);text-align:center}
.fine2 a{color:var(--ink);text-decoration:underline}
.auth .after{margin-top:22px;text-align:center;font-size:14px;color:var(--mut)}
.auth .after a{color:var(--ink);font-weight:600}
.auth .after a:hover{color:var(--a)}
footer.slim{padding:30px 0 28px}
.sl-links{display:flex;gap:22px;font-size:14px}
.sl-links a{opacity:.85}.sl-links a:hover{opacity:1;color:var(--a)}
footer.slim .risk-note{margin-top:16px}
footer.slim .legal{margin-top:20px}
/* GTranslate floats bottom-left with an inline style. On a phone that lands on the
   sign-in form, so on this page it stops floating and closes the page instead. */
.pg-login #gt_float_wrapper{position:static!important;display:flex;justify-content:center;padding:0 16px calc(22px + env(safe-area-inset-bottom));background:var(--bg2)}

/* ================= STATS ================= */
.odos{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.odo{position:relative;overflow:hidden;padding:20px 20px 18px;border-radius:20px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line2);container-type:inline-size}
.odo::before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(color-mix(in srgb,var(--c) 22%,transparent),transparent 70%)}
.odo .lab{display:flex;align-items:center;gap:10px;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.odo .lab i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 38%,transparent)}
.odo .lab .ic{width:16px;height:16px}
/* a mechanical counter: one window per digit, split across the middle */
.dg{display:flex;align-items:flex-end;gap:min(4px,1.2cqw);margin:18px 0 10px}
.dg span{position:relative;width:min(30px,10.5cqw);aspect-ratio:30/42;border-radius:7px;display:grid;place-items:center;font:700 min(25px,8.6cqw)/1 'JetBrains Mono',monospace;background:linear-gradient(#0d1424,#05080f);box-shadow:inset 0 0 0 1px var(--line2),inset 0 -12px 12px -10px #000}
.dg span::after{content:"";position:absolute;left:2px;right:2px;top:50%;height:1px;background:rgba(0,0,0,.7)}
.dg i{font:700 min(20px,7cqw)/1 'JetBrains Mono',monospace;font-style:normal;color:var(--mut);padding-bottom:3px}
.dg .pre{color:var(--c)}
.dg small{font:600 min(13px,4.6cqw) 'JetBrains Mono',monospace;color:var(--mut);padding-bottom:4px}
.odo .ft2{font-size:12.5px;color:var(--mut)}

.log{margin-top:16px}
.log .lg-key{display:flex;gap:16px;font-size:11px;letter-spacing:.08em}
.log .lg-key span{display:inline-flex;align-items:center;gap:6px}
.log .lg-key .ic{width:13px;height:13px}
.log .rows{columns:2;column-gap:36px;padding:4px 22px 8px;column-rule:1px dashed var(--line)}
.lr{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--line);break-inside:avoid}
.lr .cnm{width:34px;height:34px;font-size:15px}
.lr b{display:block;font:600 14px 'JetBrains Mono',monospace}
.lr small{display:block;color:var(--mut);font-size:12.5px}
.lr em{font:700 15px 'JetBrains Mono',monospace;font-style:normal;text-align:right}
.lr em s{display:block;text-decoration:none;font:700 9.5px 'JetBrains Mono',monospace;letter-spacing:.1em;opacity:.8}
.lr.in em{color:var(--ok)}.lr.out em{color:var(--b)}
.dot.amber{background:var(--a)}.dot.amber::after{background:var(--a)}

.boards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}
.podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:8px;padding:24px 18px 0;border-bottom:1px solid var(--line2)}
.pod{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.pod .who{font:600 12px 'JetBrains Mono',monospace;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod .val{font:700 12.5px 'JetBrains Mono',monospace;color:var(--a2);margin-bottom:9px}
.pod .val u{text-decoration:none;margin-left:4px}
.pod .blk{width:100%;border-radius:12px 12px 0 0;display:flex;justify-content:center;padding-top:9px;font:800 20px 'Unbounded',sans-serif;color:var(--on)}
.pod.p1 .blk{height:92px;background:var(--grad);box-shadow:0 -10px 30px -12px var(--glow)}
.pod.p2 .blk{height:66px;background:linear-gradient(#d6dde8,#7b8799)}
.pod.p3 .blk{height:50px;background:linear-gradient(#e8a974,#9a5b2c)}
.pod.p1 .crown{width:30px;height:30px;color:var(--a);margin-bottom:6px}
.pod.nil .who,.pod.nil .val{color:var(--mut);opacity:.6}
.pod.nil .blk{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.04) 0 6px,transparent 6px 12px)!important;box-shadow:inset 0 0 0 1px var(--line2)!important;color:var(--mut)}
.rkl{list-style:none;padding:6px 20px 12px}
.rkl li{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px dashed var(--line);font:600 13.5px 'JetBrains Mono',monospace}
.rkl li:last-child{border-bottom:0}
.rkl s{text-decoration:none;color:var(--mut);font-size:12px}
.rkl em{font-style:normal;color:var(--ink)}
.rkl u{text-decoration:none;color:var(--mut);font-size:11px;margin-left:4px}
.board-note{padding:12px 20px 16px;font-size:12.5px;color:var(--mut)}

/* ================= BOUNTY ================= */
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:46px}
.step3{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border-radius:18px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line)}
.step3 s{text-decoration:none;flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font:700 13px 'JetBrains Mono',monospace;color:var(--on);background:var(--grad)}
.step3 b{display:block;font:700 15px 'Unbounded',sans-serif;letter-spacing:-.01em;margin:4px 0 4px}
.step3 span{color:var(--mut);font-size:13.5px;line-height:1.5}
.orders{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.wo{position:relative;display:flex;flex-direction:column;border-radius:22px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line2),0 30px 60px -40px #000;transition:transform .25s}
.wo:hover{transform:translateY(-4px)}
.wo .tape{height:12px;border-radius:22px 22px 0 0;background:repeating-linear-gradient(-45deg,var(--warn) 0 10px,#16120a 10px 20px)}
.wo .wo-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 0;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.wo .wo-h i{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)}
.wo .wo-h .ic{width:22px;height:22px}
.wo .pay{padding:14px 22px 0;font:800 36px/1 'Unbounded',sans-serif;letter-spacing:-.04em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.wo .pay small{font:600 13px 'JetBrains Mono',monospace;letter-spacing:0;color:var(--mut);-webkit-text-fill-color:var(--mut);margin-left:6px}
.wo h3{padding:12px 22px 0;font:700 18px 'Unbounded',sans-serif;letter-spacing:-.02em}
.wo>p{padding:6px 22px 0;color:var(--mut);font-size:14px}
/* tear-off line: the notches are page-coloured discs sitting on the card edge */
.perf{position:relative;margin:18px 0 14px;border-top:2px dashed var(--line2)}
.perf::before,.perf::after{content:"";position:absolute;top:-12px;width:22px;height:22px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line2)}
.perf::before{left:-11px;clip-path:inset(0 0 0 50%)}.perf::after{right:-11px;clip-path:inset(0 50% 0 0)}
.wo ul{list-style:none;display:grid;gap:9px;padding:0 22px 18px}
.wo li{display:flex;gap:10px;font-size:14px}
.wo li .ic{width:16px;height:16px;color:var(--a);margin-top:3px}
.wo li b{color:var(--ink)}
.wo .warn{margin:auto 18px 0;display:flex;gap:10px;padding:12px 14px;border-radius:13px;font-size:13px;line-height:1.5;color:var(--mut);background:color-mix(in srgb,var(--warn) 7%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--warn) 30%,transparent)}
.wo .warn .ic{width:17px;height:17px;color:var(--warn);margin-top:1px}
.wo .warn b{color:var(--ink)}
.wo{padding-bottom:18px}
.disp{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center;margin-top:46px;padding:32px 36px;border-radius:26px;background:var(--panel);overflow:hidden;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 42%,transparent),0 0 90px -46px var(--glow)}
.disp::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 90% at 100% 100%,color-mix(in srgb,var(--a) 12%,transparent),transparent 70%)}
.disp{position:relative}
.disp h3{font:700 26px/1.15 'Unbounded',sans-serif;letter-spacing:-.03em;margin:14px 0 10px}
.disp p{color:var(--mut);font-size:15px}
.disp .kick::before{display:none}
.sendrow{display:flex;gap:10px}
.sendrow .inp{flex:1}
.disp .msg{margin-top:12px}
.disp .big{padding:18px 18px;font-size:14.5px}

/* ================= NEWS ================= */
.wire{position:relative;max-width:920px;margin:0 auto}
.wire::before{content:"";position:absolute;left:150px;top:10px;bottom:10px;width:2px;background:repeating-linear-gradient(180deg,color-mix(in srgb,var(--a) 55%,transparent) 0 6px,transparent 6px 13px)}
.post{position:relative;display:grid;grid-template-columns:128px 1fr;gap:44px;margin-bottom:20px}
.post::before{content:"";position:absolute;left:144px;top:30px;width:14px;height:14px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 3px var(--a),0 0 0 5px var(--bg)}
.post:first-child::before{background:var(--a);box-shadow:0 0 0 5px var(--bg),0 0 16px var(--a)}
.when{text-align:right;padding-top:20px;font:600 11.5px 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.when b{display:block;font:800 34px/1 'Unbounded',sans-serif;letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}
.post article{padding:24px 30px 26px}
.post .new{display:inline-block;margin-bottom:10px;padding:3px 9px;border-radius:99px;font:700 9.5px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--on);background:var(--a)}
.post h2{font:700 22px/1.25 'Unbounded',sans-serif;letter-spacing:-.025em;margin-bottom:12px}
/* the body is admin-authored HTML: style the tags it can contain, nothing else */
.pbody{color:#c3cde0;font-size:15.5px;line-height:1.7}
.pbody>*+*{margin-top:12px}
.pbody a{color:var(--a2);text-decoration:underline}
.pbody b,.pbody strong{color:var(--ink)}
.pbody ul,.pbody ol{padding-left:22px}
.pbody li+li{margin-top:4px}
.pbody code{font:13.5px 'JetBrains Mono',monospace;padding:2px 6px;border-radius:6px;background:rgba(255,255,255,.06)}
.pager{display:flex;gap:8px;justify-content:center;margin-top:34px;padding-left:172px}
.pager a{min-width:44px;height:44px;padding:0 6px;border-radius:13px;display:grid;place-items:center;font:600 14px 'JetBrains Mono',monospace;color:var(--mut);box-shadow:inset 0 0 0 1px var(--line2)}
.pager a:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.pager a.on{background:var(--grad);color:var(--on);box-shadow:none}
.pager .ic{width:18px;height:18px}
.quiet{max-width:720px;margin:0 auto;text-align:center;padding:34px 30px 38px}
.quiet .art{margin:0 auto 6px;max-width:260px;justify-self:center}
.quiet b{display:block;font:700 22px 'Unbounded',sans-serif;letter-spacing:-.02em;margin-bottom:10px}
.quiet p{color:var(--mut);max-width:500px;margin:0 auto 22px}

/* ================= HELP ================= */
.chans{display:grid;grid-template-columns:1fr 1fr 1.05fr;gap:14px}
.chan{display:flex;flex-direction:column;gap:16px;padding:22px}
.chan .row1{display:flex;align-items:center;gap:14px}
.chan .row1 i{width:50px;height:50px;flex:none;border-radius:15px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)}
.chan .row1 .ic{width:24px;height:24px}
.chan small{display:block;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.chan .hdl{display:block;font:700 16px 'JetBrains Mono',monospace;word-break:break-all}
.chan p{color:var(--mut);font-size:14px}
.chan .acts2{display:flex;gap:8px;margin-top:auto}
.chan .acts2 .btn{flex:1;justify-content:center}
.cp{all:unset;box-sizing:border-box;cursor:pointer;width:46px;height:42px;flex:none;border-radius:999px;display:grid;place-items:center;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2);background:rgba(255,255,255,.04)}
.cp:hover{background:rgba(255,255,255,.08)}
.cp:focus-visible{outline:2px solid var(--a)}
.cp .ic:last-child{display:none;color:var(--ok)}
.cp.ok .ic:first-child{display:none}.cp.ok .ic:last-child{display:block}
.safe{position:relative;padding:22px 22px 22px 22px;border-radius:22px;background:var(--panel)}
.safe::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:3px;background:repeating-linear-gradient(-45deg,var(--warn) 0 14px,#16120a 14px 28px);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.safe i{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:var(--warn);color:#16120a;margin-bottom:14px}
.safe i .ic{width:26px;height:26px}
.safe h3{font:700 17px/1.3 'Unbounded',sans-serif;letter-spacing:-.02em;margin-bottom:8px}
.safe p{color:var(--mut);font-size:14px}
.notes2{margin-top:70px}
.notes2 .hd2{margin-bottom:22px}
.qs details.rq summary s{color:var(--warn)}
.qs details.rq{box-shadow:inset 3px 0 0 0 var(--warn),inset 0 0 0 1px var(--line)}
.qs details.rq[open]{box-shadow:inset 3px 0 0 0 var(--warn),inset 0 0 0 1px color-mix(in srgb,var(--warn) 45%,transparent)}
.qs details p a{color:var(--ink);text-decoration:underline}
.qs details p b{color:var(--ink)}

/* ================= art layers (compositor only) ================= */
.scan{left:8.18cqw;top:8.18cqw;width:7cqw;height:40cqw;background:linear-gradient(90deg,transparent,rgba(34,211,238,.28),transparent);animation:scan 3.4s linear infinite}
@keyframes scan{from{transform:translateX(0)}to{transform:translateX(76.6cqw)}}
.arc{animation:arc 2.4s ease-out infinite;animation-delay:var(--d,0s);opacity:0}
@keyframes arc{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
.bobs{animation:bob2 var(--t,5s) ease-in-out infinite;animation-delay:var(--d,0s)}
.wheel{animation:spin 7s linear infinite}
.beam{animation:beam 3.6s ease-in-out infinite}
@keyframes beam{50%{opacity:.55}}


/* ================= TABLET (≤960) ================= */
@media (max-width:960px){
  .nav a.on::after{display:none}
  .top.open .nav a.on{background:rgba(255,255,255,.05);color:var(--a)}
  .ph .w{grid-template-columns:1fr 300px;gap:24px}
  .odos{grid-template-columns:1fr 1fr}
  .boards{grid-template-columns:1fr 1fr}
  .boards .pn:last-child{grid-column:1/-1}
  .steps3{grid-template-columns:1fr}
  .orders{grid-template-columns:1fr 1fr}
  .orders .wo:last-child{grid-column:1/-1}
  .disp{grid-template-columns:1fr;gap:20px}
  .chans{grid-template-columns:1fr 1fr}
  .chans .safe{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;column-gap:18px}
  .chans .safe i{grid-row:span 2;margin:0}
}

/* ================= PHONE (≤760) ================= */
@media (max-width:760px){
  .ph{padding:30px 0 34px}
  .ph .w{grid-template-columns:1fr;gap:6px}
  .ph .art{order:-1;max-width:300px;justify-self:center;margin-bottom:-6px}
  .ph .txt{text-align:center}
  .ph .sub{font-size:15.5px;margin:0 auto}
  .ph h1{font-size:clamp(30px,9vw,40px);margin:14px 0 12px}
  .tags{justify-content:center;margin-top:18px}
  .pb{padding:30px 0 70px}
  .hd2{flex-direction:column;align-items:flex-start;gap:6px}
  .hd2 h2{font-size:22px}

  /* phone: the card loses its frame and becomes the page — no box inside a box */
  .auth{place-items:start center;min-height:0;padding:34px 20px 44px}
  .acc{padding:0;background:none;box-shadow:none}
  .acc-hd h1{font-size:21px}
  .pn-h{padding:13px 18px}
  .inp{height:54px}
  .inp input{font-size:16px} /* 16px stops iOS zooming into the field */
  .sl-links{justify-content:center}
  footer.slim .legal{text-align:center;align-items:center}

  .odos{gap:10px}
  .odo{padding:14px 14px 13px;border-radius:17px}
  .odo .lab{font-size:9px;letter-spacing:.1em;gap:8px}
  .odo .lab i{width:26px;height:26px;border-radius:8px}
  .odo .lab .ic{width:14px;height:14px}
  .dg{margin:14px 0 8px}
  .odo .ft2{font-size:11.5px}
  .log .rows{columns:1;padding:0 16px 4px}
  .log .lg-key{display:none}
  .lr{grid-template-columns:30px 1fr auto;gap:10px;padding:11px 0}
  .lr .cnm{width:30px;height:30px;font-size:13px}
  .lr b{font-size:13px}.lr small{font-size:11.5px}.lr em{font-size:14px}
  .boards{grid-template-columns:1fr;gap:12px;margin-top:34px}
  .boards .pn:last-child{grid-column:auto}

  .steps3{gap:10px;margin-bottom:30px}
  .step3{padding:15px 16px}
  .orders{grid-template-columns:1fr;gap:14px}
  .orders .wo:last-child{grid-column:auto}
  .wo .pay{font-size:32px}
  .wo:hover{transform:none}
  .disp{padding:22px 18px;border-radius:22px;margin-top:30px}
  .disp h3{font-size:21px}
  .sendrow{flex-direction:column}
  .disp .btn{width:100%;justify-content:center}
  .ph .kick::before{display:block} /* centred on a phone, so it gets both rules */

  .wire::before{left:6px}
  .post{grid-template-columns:1fr;gap:10px;padding-left:28px}
  .post::before{left:0;top:4px}
  .when{text-align:left;padding-top:0;display:flex;align-items:baseline;gap:8px}
  .when b{font-size:15px;margin:0;font-family:'JetBrains Mono',monospace;font-weight:700;letter-spacing:0}
  .post article{padding:18px 18px 20px;border-radius:18px}
  .post h2{font-size:18px}
  .pbody{font-size:15px}
  .pager{padding-left:0;margin-top:26px}
  .quiet{padding:24px 18px 28px}
  .quiet b{font-size:19px}

  .chans{grid-template-columns:1fr;gap:12px}
  .chans .safe{display:block}
  .chans .safe i{margin-bottom:12px}
  .notes2{margin-top:50px}
}

/* ================= LEGAL (/terms, /privacy) — markup from lp_doc() =================
   Calm on purpose: a text page head with no art, a plain-English summary, then a
   sticky numbered index beside the clauses. The clause bodies reuse .pbody, the
   news prose scale, plus the <h3>/<dl> the legal text needs. */
.ph-doc .w{grid-template-columns:1fr}
.ph-doc .txt{max-width:780px}
.tldr{padding:24px 28px}
.tldr h2{font:700 17px 'Unbounded',sans-serif;letter-spacing:-.02em}
.tldr ul{list-style:none;display:grid;gap:11px;margin-top:16px}
.tldr li{position:relative;padding-left:22px;color:var(--mut);font-size:15px;line-height:1.6}
.tldr li::before{content:"";position:absolute;left:2px;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 18%,transparent)}
.tldr li.is-warn::before{background:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 18%,transparent)}
.tldr b{color:var(--ink)}
.tldr>p{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line2);font-size:12.5px;color:var(--mut)}
.doc{display:grid;grid-template-columns:262px 1fr;gap:26px;align-items:start;margin-top:22px}
.doc-ix{position:sticky;top:90px;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 110px);overflow:auto;padding:6px;border-radius:18px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line);scrollbar-width:thin}
.doc-ix a{display:flex;align-items:flex-start;gap:10px;flex:none;padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.4;color:var(--mut);transition:color .15s,background .15s}
.doc-ix a:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.doc-ix a s{flex:none;margin-top:1px;text-decoration:none;font:600 11px 'JetBrains Mono',monospace;opacity:.7}
.doc-ix a.on{color:var(--ink);background:color-mix(in srgb,var(--a) 11%,transparent);box-shadow:inset 2px 0 0 var(--a)}
.doc-ix a.on s{color:var(--a);opacity:1}
.doc-b{padding:34px 40px}
.doc-s+.doc-s{margin-top:30px;padding-top:28px;border-top:1px dashed var(--line2)}
.doc-s h2{display:flex;gap:10px;font:700 20px/1.3 'Unbounded',sans-serif;letter-spacing:-.02em}
.doc-s h2 s{flex:none;text-decoration:none;color:var(--a);font-family:'JetBrains Mono',monospace}
.doc-s .pbody{margin-top:12px;font-size:15px}
.pbody h3{margin-top:18px;font:600 15px 'Inter',sans-serif;color:var(--ink)}
.pbody dt{font-weight:600;color:var(--ink)}
.pbody dd{margin:4px 0 0}
.pbody dd+dt{margin-top:10px}

/* ================= 404 ================= */
.e404{position:relative;isolation:isolate;min-height:calc(100vh - 70px);display:grid;place-items:center;padding:56px 20px 72px;text-align:center}
.e404::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(40% 46% at 50% 34%,color-mix(in srgb,var(--a) 11%,transparent),transparent 70%)}
.e404 .code{font:800 clamp(92px,15vw,156px)/1 'Unbounded',sans-serif;letter-spacing:-.05em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 12px 40px var(--glow))}
.e404 h1{font:700 clamp(22px,3vw,30px)/1.2 'Unbounded',sans-serif;letter-spacing:-.03em;margin:16px 0 10px}
.e404 p{color:var(--mut);max-width:48ch;margin:0 auto 26px}
.go{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:720px;margin:40px auto 0}
.go a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 16px;border-radius:18px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line);transition:transform .2s,box-shadow .2s}
.go a:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 45%,transparent)}
.go a:focus-visible{outline:2px solid var(--a);outline-offset:3px}
.go i{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;margin-bottom:6px;color:var(--a);background:color-mix(in srgb,var(--a) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 38%,transparent)}
.go a>span{display:flex;flex-direction:column;gap:4px}
.go b{font:700 14px 'Unbounded',sans-serif;letter-spacing:-.01em;color:var(--ink)}
.go a>span>span{font-size:13px;color:var(--mut)}

@media (max-width:960px){
  /* the index becomes a strip of chips you swipe, above the clauses */
  .doc{grid-template-columns:1fr;gap:14px}
  .doc-ix{position:static;flex-direction:row;gap:6px;max-height:none;overflow-x:auto;scrollbar-width:none}
  .doc-ix::-webkit-scrollbar{display:none}
  .doc-ix a{white-space:nowrap;padding:8px 12px}
  .doc-ix a.on{box-shadow:inset 0 -2px 0 var(--a)}
}
@media (max-width:760px){
  .ph-doc .txt{text-align:left}
  .ph-doc .kick::before{display:none}
  .ph-doc .tags{justify-content:flex-start}
  .tldr{padding:18px 18px}
  .tldr li{font-size:14.5px}
  .doc-b{padding:22px 18px;border-radius:18px}
  .doc-s h2{font-size:17px}
  .e404{min-height:0;padding:40px 20px 56px}
  .go{grid-template-columns:1fr;gap:10px;margin-top:30px}
  .go a{flex-direction:row;text-align:left;gap:12px;padding:14px 16px}
  .go i{margin:0;flex:none}
}