:root{--blue:#155479;--blue-d:#0e3d59;--ochre:#e7a052;--ink:#0b1517;--cream:#f6efe2;--mint:#3dd7b5}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--blue);color:var(--cream);font-family:'Barlow Condensed',sans-serif;font-weight:500;font-size:20px;line-height:1.4;min-height:100vh;overflow-x:hidden}
.felt{position:fixed;inset:-20%;z-index:-1;background:
 repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 2px,transparent 2px 9px),
 radial-gradient(60% 50% at 30% 30%,#1c6694 0,transparent 70%),
 radial-gradient(50% 50% at 80% 80%,var(--blue-d) 0,transparent 70%);animation:drift 40s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(4%,3%,0)}}
a{color:inherit}
.bar{display:flex;justify-content:space-between;align-items:center;padding:18px clamp(18px,4vw,48px);border-bottom:3px dashed rgba(246,239,226,.35)}
.crest{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:'Graduate',serif;font-size:22px;letter-spacing:.04em;text-transform:uppercase}
.crest img{border-radius:50%;border:3px solid var(--ink);box-shadow:0 0 0 3px var(--ochre)}
.btn{display:inline-block;font-family:'Graduate',serif;text-transform:uppercase;letter-spacing:.06em;font-size:18px;padding:12px 26px;border:3px solid var(--ink);border-radius:4px;text-decoration:none;box-shadow:5px 5px 0 var(--ink);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.btn:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--ink)}
.btn-ochre{background:var(--ochre);color:var(--ink)}
.btn-ink{background:var(--ink);color:var(--cream);box-shadow:5px 5px 0 var(--ochre);border-color:var(--ochre)}
.btn-ink:hover{box-shadow:7px 7px 0 var(--ochre)}
.btn-ink:active{box-shadow:1px 1px 0 var(--ochre)}
.jersey{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center;padding:clamp(40px,7vw,96px) clamp(18px,5vw,72px);max-width:1360px;margin:0 auto}
.arc{font-weight:700;text-transform:uppercase;letter-spacing:.3em;color:var(--mint);font-size:16px;margin-bottom:10px}
h1{font-family:'Graduate',serif;font-weight:400;text-transform:uppercase;line-height:.88;font-size:clamp(84px,14vw,210px)}
h1 span{display:block}
.l1{color:var(--cream);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill;text-shadow:8px 8px 0 var(--ink)}
.l2{color:var(--ochre);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill;text-shadow:8px 8px 0 var(--ink);margin-left:.35em}
.sub{margin:28px 0 30px;max-width:30ch;font-size:clamp(20px,2vw,25px)}
.sub b{color:var(--ochre)}
.actions{display:flex;gap:18px;flex-wrap:wrap}
.patch{justify-self:center;width:min(100%,520px);text-align:center;animation:sway 7s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(2deg)}}
.stitch{border-radius:50%;padding:14px;background:var(--ink);box-shadow:0 0 0 8px var(--ochre),0 0 0 14px var(--ink),18px 22px 0 14px rgba(0,0,0,.25);position:relative}
.stitch::after{content:"";position:absolute;inset:4px;border-radius:50%;border:3px dashed var(--ochre);pointer-events:none}
.stitch img{display:block;width:100%;height:auto;border-radius:50%}
figcaption{margin-top:34px;font-family:'Graduate',serif;font-size:26px;letter-spacing:.2em;color:var(--ink);background:var(--cream);display:inline-block;padding:4px 18px;border:3px solid var(--ink);transform:rotate(-2deg)}
.card{max-width:880px;margin:20px auto 90px;background:var(--cream);color:var(--ink);border:4px solid var(--ink);border-radius:10px;box-shadow:12px 12px 0 var(--ink);padding:clamp(22px,4vw,44px);margin-left:max(18px,calc(50% - 440px));margin-right:max(18px,calc(50% - 440px))}
.card-head{display:flex;justify-content:space-between;align-items:center;border-bottom:4px double var(--ink);padding-bottom:12px;margin-bottom:22px}
h2{font-family:'Graduate',serif;font-weight:400;text-transform:uppercase;font-size:clamp(32px,4vw,46px)}
.tag{background:var(--blue);color:var(--cream);font-weight:800;text-transform:uppercase;letter-spacing:.15em;font-size:14px;padding:5px 12px;transform:rotate(3deg)}
.stats{display:grid;grid-template-columns:1fr .8fr 1.5fr .7fr;gap:14px;margin-bottom:26px}
.stats div{border:3px solid var(--ink);padding:10px 14px;background:#fff}
dt{font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--blue)}
dd{font-family:"Graduate",serif;font-size:20px;overflow-wrap:anywhere;white-space:nowrap}
.ca{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--ink);color:var(--cream);padding:12px 16px;border-radius:6px;margin-bottom:26px}
.ca-label{font-family:'Graduate',serif;color:var(--ochre);font-size:20px}
.ca-value{font-family:'JetBrains Mono',monospace;font-size:15px;overflow-wrap:anywhere;flex:1;min-width:0}
.ca-copy{font:800 14px 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.12em;background:var(--mint);color:var(--ink);border:2px solid var(--cream);border-radius:3px;padding:6px 14px;cursor:pointer;transition:transform .12s}
.ca-copy:hover{transform:translateY(-2px)}
.ca-copy:active{transform:translateY(1px)}
.ca-copy.done{background:var(--ochre)}
.ca-scan{color:var(--mint);display:flex;transition:transform .15s}
.ca-scan:hover{transform:scale(1.15)}
.foot{border-top:3px dashed rgba(246,239,226,.35);padding:34px clamp(18px,4vw,48px);display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.foot-crest{display:flex;align-items:center;gap:12px;font-family:'Graduate',serif;font-size:24px;text-transform:uppercase}
.foot-crest img{border-radius:50%;border:3px solid var(--ink);box-shadow:0 0 0 3px var(--ochre)}
.foot-crest em{font-style:normal;color:var(--ochre)}
.ca-small{margin:0;flex:0 1 560px}
.icons{display:flex;gap:12px}
.icons a{width:46px;height:46px;display:grid;place-items:center;background:var(--cream);color:var(--ink);border:3px solid var(--ink);border-radius:50%;box-shadow:3px 3px 0 var(--ink);transition:transform .15s,background .15s}
.icons a:hover{background:var(--ochre);transform:translate(-2px,-2px)}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) rotate(-2deg);background:var(--ochre);color:var(--ink);font-family:'Graduate',serif;padding:8px 22px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
[hidden]{display:none!important}
@media (max-width:860px){
 .jersey{grid-template-columns:1fr;text-align:left}
 .patch{width:min(84%,400px);order:-1}
 .stats{grid-template-columns:1fr 1fr}.stats div:nth-child(3){grid-column:span 2}
 .foot{flex-direction:column;align-items:flex-start}
 .ca-small{flex:none;width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}