@font-face { font-family: 'Bungee'; src: url('/fonts/bungee.ttf') format('truetype'); font-display: swap; }
* { box-sizing: border-box; }
:root { --ink: #15120e; --cream: #fffaf0; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--ground); color: var(--ink); font: 18px/1.55 Georgia, 'Times New Roman', serif; }
a { color: var(--ink); }
.vh, .hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.top { max-width: 1200px; margin: 0 auto; }
.mast img { display: block; width: 100%; height: auto; }
main { max-width: 760px; margin: 0 auto; padding: 0 16px 40px; }
.card { background: var(--cream); border: 4px solid var(--ink); box-shadow: 10px 10px 0 var(--ink); padding: 26px 24px; margin: 28px 0; }
.kicker { font: 700 12px/1.6 'Courier New', monospace; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 10px; }
h1, h2, .band, .part b { font-family: 'Bungee', Impact, 'Arial Narrow Bold', sans-serif; font-weight: 400; text-transform: uppercase; line-height: 1; margin: 0 0 14px; }
h1 { font-size: clamp(38px, 8vw, 64px); color: var(--p1); text-shadow: 4px 4px 0 var(--ink); }
h2 { font-size: clamp(24px, 5vw, 34px); }
.lede { font-size: 20px; margin: 0 0 20px; }
.field { display: flex; gap: 0; border: 3px solid var(--ink); background: #fff; }
.field input { flex: 1; min-width: 0; border: 0; padding: 14px 14px; font: 18px Georgia, serif; background: transparent; color: var(--ink); }
.field input:focus { outline: 3px solid var(--p2); outline-offset: -3px; }
.btn { font: 400 18px/1 'Bungee', Impact, sans-serif; text-transform: uppercase; background: var(--ink); color: var(--cream); border: 0; padding: 14px 18px; cursor: pointer; text-decoration: none; display: inline-block; }
.btn:hover { background: var(--p1); color: var(--p1ink); }
.btn--line { background: var(--p2); color: var(--p2ink); border: 3px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }
.check { display: flex; gap: 8px; align-items: center; font: 14px/1.4 'Courier New', monospace; margin: 12px 0 0; }
.note { font: 13px/1.4 'Courier New', monospace; margin: 10px 0 0; opacity: .8; }
.status { font: 700 14px/1.4 'Courier New', monospace; margin: 8px 0 0; min-height: 1em; }
.status.is-ok { color: #1e7a4c; } .status.is-error { color: #b3261e; }
.ts:empty { display: none; }
.latest p { margin: 0 0 18px; }
.band { font-size: clamp(26px, 6vw, 40px); color: var(--p2); text-shadow: 3px 3px 0 var(--ink); -webkit-text-stroke: 1px var(--ink); text-align: center; margin: 44px 0 18px; }
.grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.part { background: var(--c); color: var(--i); border: 3px solid var(--ink); box-shadow: 6px 6px 0 var(--ink); padding: 16px 16px 18px; }
.part b { display: block; font-size: 24px; margin: 0 0 8px; }
.part span { font-size: 16px; line-height: 1.45; }
.promise ul { padding: 0; margin: 0 0 22px; list-style: none; }
.promise li { margin: 0 0 12px; }
.foot { max-width: 1200px; margin: 0 auto; background: var(--ink); color: var(--cream); text-align: center; padding: 0 0 28px; }
.foot img { display: block; width: 100%; height: auto; }
.foot p { font: 13px/1.8 'Courier New', monospace; letter-spacing: .04em; margin: 18px 16px 0; }
.foot a { color: var(--p2); }
.foot .small { opacity: .7; margin-top: 4px; }
@media (max-width: 560px) {
  body { font-size: 17px; }
  .card { padding: 20px 16px; box-shadow: 6px 6px 0 var(--ink); }
  .grid { grid-template-columns: 1fr; }
  .field { flex-direction: column; }
  .btn { width: 100%; }
  .btn--line { width: auto; }
}