@import url("./tokens.css");

/* SUPPORT MATTHEW — ROYAL SUPPORT CHAMBER */
body{min-height:100vh;padding:24px 16px;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 5%,rgba(173,14,39,.34),transparent 50%),var(--ink);color:var(--text);font-family:var(--body)}
.wrap{width:min(100%,620px);text-align:center}
.brand{color:var(--gilt);font:600 12px var(--display);letter-spacing:.12em}
.card{position:relative;overflow:hidden;margin:22px auto;padding:clamp(22px,5vw,38px);border:1px solid var(--line-2);border-radius:var(--r-xl);background:linear-gradient(145deg,rgba(52,7,16,.97),rgba(17,3,7,.98));box-shadow:var(--shadow-deep),var(--shadow-crimson)}
.card::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--crimson),var(--gilt),transparent)}
.crown{font-size:34px;color:var(--gilt);text-shadow:0 0 22px rgba(232,194,122,.28);animation:supportPulse 3s ease-in-out infinite}
h1{margin:8px 0 12px;color:#fff0d9;font:600 clamp(27px,7vw,42px)/1.2 var(--display);letter-spacing:.01em}
.intro{max-width:440px;margin:0 auto 24px;color:var(--muted);font-size:13px;line-height:1.85}
.qr-frame{width:min(100%,360px);margin:0 auto;padding:12px;background:#fff;border:1px solid rgba(232,194,122,.4);border-radius:14px;box-shadow:0 0 35px rgba(232,194,122,.13)}
.qr-frame img{display:block;width:100%;height:auto;border-radius:6px;filter:none}
.scan{margin:20px 0 6px;color:var(--gilt);font-size:11px;font-weight:700;letter-spacing:.09em}
.note{margin:0;color:var(--muted);font-size:11px;line-height:1.8}
.thanks{margin:24px 0 20px;color:#f1d9b1;font:600 13px var(--display)}
.back{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 22px;border:1px solid var(--gilt);border-radius:var(--r);background:linear-gradient(135deg,var(--crimson),var(--crimson-deep));color:#fff;text-decoration:none;font-size:11px;font-weight:700;letter-spacing:.07em;transition:filter .2s,transform .2s}
.back:hover{filter:brightness(1.15);transform:translateY(-2px)}
footer{margin-top:20px;padding:0;border:0;color:var(--faint);font-size:9px;letter-spacing:.12em}
@keyframes supportPulse{0%,100%{transform:scale(1);text-shadow:0 0 12px rgba(232,194,122,.18)}50%{transform:scale(1.08);text-shadow:0 0 25px rgba(232,194,122,.42)}}
@media(max-width:420px){body{padding:16px 12px}.card{margin:16px auto;padding:22px 17px}.brand{font-size:10px}.scan{font-size:10px}}
@media(prefers-reduced-motion:reduce){.crown{animation:none}}