/* Shared header and footer. Only colour tokens vary between pages. */
body[data-site-theme="dark"]{--chrome-bg:#11171b;--chrome-footer:#0d1316;--chrome-ink:#f5f6f5;--chrome-muted:#aab7bf;--chrome-line:#34434b;--chrome-button-top:#283139;--chrome-button-bottom:#171e23;--chrome-button-line:#46535c;--chrome-button-shadow:#080c0e;--chrome-lime:#b4f51b}
body[data-site-theme="light"]{--chrome-bg:#fff;--chrome-footer:#f5f6f0;--chrome-ink:#17201c;--chrome-muted:#677168;--chrome-line:#dbe0d8;--chrome-button-top:#fff;--chrome-button-bottom:#f4f5ee;--chrome-button-line:#d2d7ce;--chrome-button-shadow:#e7ebe2;--chrome-lime:#b4f51b}
:root{scroll-padding-top:calc(var(--sticky-header-height,92px) + 24px)}
.shared-header{position:sticky;top:0;z-index:20;background:var(--chrome-bg);color:var(--chrome-ink);border-bottom:1px solid var(--chrome-line)}
.shared-topbar,.shared-footer-inner{width:min(1180px,calc(100% - 80px));margin-inline:auto}
.shared-topbar{height:91px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:32px;align-items:center}
.shared-brand{display:block;width:164px;visibility:visible;opacity:1;pointer-events:auto;transition:none}
.shared-brand img{display:block;width:100%;height:auto;object-fit:contain}
.shared-topbar .shared-nav{display:flex;justify-self:end;align-items:center;gap:14px;width:auto;max-width:100%}
.shared-nav .shared-nav-item{display:flex;justify-content:center;align-items:center;gap:13px;min-width:125px;height:48px;padding:0 18px;border:1px solid var(--chrome-button-line);border-bottom-width:3px;border-radius:8px;background:linear-gradient(var(--chrome-button-top),var(--chrome-button-bottom));box-shadow:0 3px 0 var(--chrome-button-shadow);font:400 16px/1 Anton,Impact,sans-serif;color:var(--chrome-ink);text-transform:uppercase;white-space:nowrap;text-decoration:none;transition:transform .15s,border-color .15s}
.shared-nav .shared-nav-item.shared-nav-contact{flex:none;min-width:48px;width:48px;padding:0}
.shared-nav-item svg{display:block;width:21px;height:21px;flex-shrink:0}
.shared-nav .shared-nav-item.is-active{background:var(--chrome-lime);border-color:#c7ff44;border-bottom-color:#89b91f;color:#101802}
.shared-nav .shared-nav-item:hover{border-color:#89b91f;transform:translateY(-1px)}
.shared-nav .shared-nav-item:active{transform:translateY(1px)}
.shared-footer{background:var(--chrome-footer);color:var(--chrome-ink);border-top:1px solid var(--chrome-line)}
.shared-footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:110px;padding-block:28px}
.shared-credit{font:14px/1.5 Arial,Helvetica,sans-serif;color:var(--chrome-ink)}

.shared-patreon{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;border:1px solid #89b91f;border-radius:8px;padding:10px 15px;font:400 15px/1.2 Anton,Impact,sans-serif;text-transform:uppercase;color:var(--chrome-ink)}
.shared-patreon svg{width:23px;height:23px;flex-shrink:0}.shared-patreon:hover{background:#89b91f18}
@media(max-width:1100px){.shared-topbar,.shared-footer-inner{width:calc(100% - 64px)}.shared-topbar{gap:24px}.shared-brand{width:144px}.shared-topbar .shared-nav{gap:10px}.shared-nav .shared-nav-item{min-width:110px;padding-inline:14px;gap:10px}}
/* Compact button faces match the full wordmark; the invisible vertical padding keeps touch areas generous. */
@media(max-width:720px){
  .shared-topbar{--mobile-nav-face:clamp(32px,10vw,44px);--mobile-nav-hit:max(44px,calc(var(--mobile-nav-face) + 8px));--mobile-nav-inset:calc((var(--mobile-nav-hit) - var(--mobile-nav-face)) / 2);--mobile-nav-gutter:clamp(8px,calc(25vw - 72px),18px);width:calc(100% - var(--mobile-nav-gutter) * 2);height:calc(var(--mobile-nav-hit) + 8px);min-height:0;padding-block:4px;grid-template-columns:calc(var(--mobile-nav-face) * 2.99226) minmax(0,1fr);gap:clamp(7px,calc(12.5vw - 33px),18px);align-items:center}
  .shared-brand{display:flex;align-items:center;justify-self:start;width:100%;min-height:var(--mobile-nav-hit)}
  .shared-topbar .shared-nav{width:auto;gap:clamp(6px,calc(5vw - 12px),10px);justify-self:end}
  .shared-nav .shared-nav-item{position:relative;isolation:isolate;flex:0 0 auto;min-width:max-content;height:var(--mobile-nav-hit);padding:0 clamp(2px,calc(5vw - 16.5px),8px);flex-direction:row;gap:4px;font-size:clamp(13px,3.6vw,16px);border:0;border-radius:7px;background:transparent;box-shadow:none}
  .shared-nav .shared-nav-item::before{content:"";position:absolute;inset:var(--mobile-nav-inset) 0;z-index:-1;border:1px solid var(--chrome-button-line);border-bottom-width:3px;border-radius:7px;background:linear-gradient(var(--chrome-button-top),var(--chrome-button-bottom));box-shadow:0 3px 0 var(--chrome-button-shadow);pointer-events:none}
  .shared-nav .shared-nav-item.is-active{background:transparent;border:0}
  .shared-nav .shared-nav-item.is-active::before{background:var(--chrome-lime);border-color:#c7ff44;border-bottom-color:#89b91f}
  .shared-nav .shared-nav-item:hover::before{border-color:#89b91f}
  .shared-nav .shared-nav-item.shared-nav-contact{flex:none;width:var(--mobile-nav-hit);min-width:var(--mobile-nav-hit);padding:0}
  .shared-nav .shared-nav-contact::before{inset:var(--mobile-nav-inset)}
  .shared-nav-item svg{width:clamp(18px,4.6vw,21px);height:clamp(18px,4.6vw,21px)}
  .shared-footer-inner{width:calc(100% - 36px);flex-direction:column;justify-content:center;gap:20px;padding-block:28px}
}
@media(min-width:651px) and (max-width:720px){.shared-topbar{--mobile-nav-gutter:32px}}
@media(prefers-reduced-motion:reduce){.shared-brand,.shared-nav .shared-nav-item{transition:none}}
/* Shared accessible social/contact shadow box. */
.shared-contact{width:calc(100% - 36px);max-width:620px;padding:32px;border:1px solid var(--chrome-line);border-radius:16px;background:var(--chrome-bg);color:var(--chrome-ink);box-shadow:0 24px 90px #0009}
.shared-contact::backdrop{background:#050a0bd9;backdrop-filter:blur(4px)}.shared-contact h2{font:400 32px/1.15 Anton,Impact,sans-serif;margin:0 0 25px;text-transform:uppercase}.shared-contact-close{position:absolute;top:8px;right:9px;border:0;background:transparent;color:var(--chrome-ink);width:44px;height:44px;font:30px/1 Arial,sans-serif;border-radius:50%}.shared-contact-close:hover{background:#ffffff12}
.contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.contact-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:0;min-height:112px;padding:16px 10px;border:1px solid var(--chrome-line);border-radius:10px;background:var(--chrome-button-bottom);color:var(--chrome-ink);font:400 15px/1.2 Anton,Impact,sans-serif;text-transform:uppercase;text-decoration:none}.contact-link:hover{border-color:var(--chrome-lime);background:#263139}.contact-link svg{width:29px;height:29px;color:var(--chrome-lime);flex-shrink:0}.contact-link small{display:block;margin:0;font:10px/1.4 Arial,Helvetica,sans-serif;text-transform:none;color:var(--chrome-muted);max-width:100%;overflow-wrap:anywhere}
@media(max-width:480px){.shared-contact{padding:25px}.shared-contact h2{font-size:29px;margin-bottom:21px}.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.contact-link{min-height:100px;padding:13px 8px;font-size:14px}}

/* Sam's original banner direction: no keyline; gentle glove/pen contrast; seamless charcoal. */
.hero .hero-art,.brand-hero .banner-art{width:auto;height:100%;max-width:none;right:0;top:0;bottom:auto;opacity:1;mask-image:none;-webkit-mask-image:none;object-fit:contain;object-position:top right}
@media(max-width:650px){.hero .hero-art,.brand-hero .banner-art{width:100%;height:auto;max-width:100%;right:0;top:auto;bottom:0}}