/* Keep the receipts. Shared brand layer for mattbusel.vercel.app (spec: outreach/brand/BRAND.md).
   Loaded after each page's own <style>; remaps its tokens and squares off the shapes. */
:root:root:root,:root:root:root[data-theme]{
  --night:#0A0B0F;--panel:#15171D;--bone:#EEF1F5;--static:#7D8794;--soft:#BFC5CE;
  --ember:#E8613F;--peach:#F2B880;--gold:#F5C542;--cash:#4AD7A8;--ban:#E5322D;
  --paper:#0A0B0F;--paper2:#15171D;--card:#15171D;--ink:#EEF1F5;--ink2:#BFC5CE;--line:#262A33;
  --accent:#E8613F;--accent-ink:#0A0B0F;
  --serif:'Archivo',system-ui,sans-serif;--sans:'Archivo',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Consolas,monospace;--pixel:'Silkscreen',monospace;
  color-scheme:dark;
}
html body{background:var(--night);color:var(--bone);font-family:var(--sans)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:999;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0 1px,transparent 1px 3px)}
html,body{overflow-x:hidden}
::selection{background:var(--ember);color:var(--night)}

/* status bar (O'BLOCK HUD) */
.hud{border-bottom:1px solid var(--line);background:var(--night);font:12px/1.4 var(--mono);color:var(--static)}
.hud .in{max-width:1180px;margin:0 auto;padding:8px 16px;display:flex;gap:6px 18px;flex-wrap:wrap;align-items:center}
.hud b{font-weight:600}.hud .up{color:var(--cash)}.hud .dn{color:var(--ban)}.hud .pend{color:var(--gold)}
.hud .logo{font:400 13px var(--pixel);color:var(--bone);letter-spacing:.02em;margin-right:auto}
.hud .motto{color:var(--peach)}

/* nav + wordmark */
html body nav{background:var(--night);backdrop-filter:none;border-bottom:1px solid var(--line)}
html body .brand{font:400 15px var(--pixel);letter-spacing:.02em;color:var(--bone)}
html body .brand b{color:var(--bone)}
html body nav ul a{color:var(--static);font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
html body nav ul a:hover{color:var(--bone)}

/* type */
html body h1,html body h2,html body h3,html body summary{font-family:var(--sans);font-weight:900;letter-spacing:-.02em}
html body h1{line-height:.98}
html body h1 em,html body h2 em{font-style:normal;color:var(--peach)}
html body h3{font-weight:800}
html body .kicker,html body .tag,html body .tier .name,html body .panel .tag,html body .fix .tag,html body .work .tag{
  font:600 12px/1.4 var(--mono);letter-spacing:.17em;text-transform:uppercase;color:var(--ember)}
html body .lede,html body .sub,html body p{color:var(--soft)}
html body p strong,html body li strong{color:var(--bone)}
html body code{background:var(--panel);border:1px solid var(--line);border-radius:0;font-family:var(--mono)}

/* buttons: ember, square, one per view */
html body .btn{border-radius:0;background:var(--ember);color:var(--night);font:800 15px var(--sans);padding:12px 18px;box-shadow:none;transition:none}
html body .btn:hover{transform:none;background:#F07452}
html body .btn.ghost,html body .cta .btn.ghost{background:transparent;color:var(--bone);box-shadow:inset 0 0 0 1px var(--line)}
html body .btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--bone)}

/* surfaces: square, flat, 1px lines */
html body .panel,html body .tier,html body .work a,html body .stat,html body .fix,html body .offer,html body .rate,
html body .proofband,html body .contact,html body .cta:not(div.cta):not(.cta.flex),html body .app img{border-radius:0;box-shadow:none}
html body .panel,html body .tier,html body .work a,html body .stat,html body .fix,html body .rate,html body .proofband{background:var(--panel);border:1px solid var(--line)}
html body .work a:hover{border-color:var(--static)}
html body .tier.feat{background:var(--panel);color:var(--bone);border:1px solid var(--ember);box-shadow:inset 4px 0 0 var(--ember)}
html body .tier.feat p,html body .tier.feat li{color:var(--soft)}
html body .tier .price,html body .proof strong,html body .stat b,html body .rate strong{font-family:var(--sans);font-weight:900;letter-spacing:-.02em}
html body .tier .price{font:400 40px/1.1 var(--pixel);color:var(--cash);letter-spacing:0}
html body .tier .price small{font:400 14px var(--mono);color:var(--static)}
html body .tier .price s{color:var(--static);opacity:1}
html body .tier li,html body .checks li{border-top:1px solid var(--line)}
html body .tier li::before,html body .checks li::before{border-color:var(--cash)}
html body .offer{background:var(--panel);border:1px solid var(--ember);box-shadow:inset 4px 0 0 var(--ember)}
html body .contact,html body section.cta,html body div.cta:has(h2){background:var(--panel);color:var(--bone);border:1px solid var(--line);border-radius:0}
html body .contact h2,html body .cta h2{color:var(--bone)}
html body .contact p,html body .cta p{color:var(--soft)}
html body .contact .links a{border-bottom:1px dashed var(--line)}
html body .contact .links a span{font-family:var(--mono);color:var(--static);opacity:1}
html body .app{color:var(--static);font-family:var(--mono);font-size:12px}
html body .app img{border:1px solid var(--line)}
html body .app:hover img{transform:none}
html body .app i{color:var(--gold)}
html body .step{border-top:1px solid var(--bone)}
html body .step::before{color:var(--ember);font-family:var(--mono)}
html body .post{border-left:3px solid var(--ember);font-family:var(--mono);color:var(--bone)}

/* scoreboard / proof rows */
html body .proof{border-color:var(--line)}
html body .proof div{border-color:var(--line)}
html body .proof strong{color:var(--bone);font-size:44px}
html body .proof span{display:block;line-height:1.5;font-family:var(--mono);font-size:12px;color:var(--static);letter-spacing:.04em}

/* FAQ as receipt rows */
html body details{border-top:1px dashed var(--line)}
html body details:last-of-type{border-bottom:1px dashed var(--line)}
html body summary{font-size:19px}
html body summary::after{color:var(--ember);font-family:var(--mono)}

html body footer{border-top:1px dashed var(--line);font:12px/1.7 var(--mono);color:var(--static)}
html body footer::after{content:"keep the receipts.";display:block;max-width:1180px;margin:10px auto 0;padding:0 16px;color:var(--peach)}

/* language switch */
html body .i18n-switch{font:12px/1.6 var(--mono)!important;color:var(--static)!important;opacity:1}

/* trust block (markup owned by the trust layer; restyled here only) */
html body .tb{--tb-bg:var(--panel);--tb-ink:var(--bone);--tb-ink2:var(--static);--tb-line:var(--line);--tb-accent:var(--bone);
  --tb-font:var(--sans);--tb-mark-filter:invert(1);border-top:1px dashed var(--line);max-width:1180px}
html body .tb .tb-story{color:var(--soft)}
html body .tb .tb-name{font-weight:900;color:var(--bone)}
html body .tb .tb-social a{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--static)}
html body .tb .tb-proof li{border-radius:0;background:var(--panel);border:1px solid var(--line)}
html body .tb .tb-num{font:900 26px/1.1 var(--sans);letter-spacing:-.02em;color:var(--bone)}
html body .tb .tb-lbl{font:12px/1.5 var(--mono);color:var(--static)}
html body .tb .tb-h{font:600 12px var(--mono);letter-spacing:.17em;color:var(--ember)}
html body .tb .tb-logos a{font-family:var(--mono);font-size:12px;color:var(--soft)}
html body .tb .tb-logos img.tb-mark{filter:invert(1)}
html body .tb .tb-photo{border-radius:50%}
html body .tb .tb-live{font-family:var(--mono);font-size:13px;color:var(--soft)}
html body .tb .tb-foot{font-family:var(--mono);font-size:12px;color:var(--static)}

@media (max-width:860px){
  html body .wrap{padding-left:16px;padding-right:16px}
  html body .contact{padding:32px 16px}
  html body .proof strong{font-size:34px}
}