:root{--ink-0: #08070a;--ink-1: #0f0d12;--ink-2: #181520;--ink-3: #221c2b;--line: rgba(255,255,255,0.08);--line-2: rgba(255,255,255,0.14);--fg-1: #f4eeea;--fg-2: #b8b1ad;--fg-3: #7a7370;--fg-4: #4a4541;--rising-red: #e83a1f;--rising-red-hot: #ff6a3d;--rising-red-deep: #8a1a0c;--phoenix-gold: #e8b100;--phoenix-gold-hot: #ffd24b;--signal-green: #3dd87a;--font-sans: 'Inter','Inter Fallback',system-ui,-apple-system,sans-serif;--font-display: 'Anton','Oswald','Inter Fallback',sans-serif;--font-mono: 'JetBrains Mono',ui-monospace,Menlo,monospace}*{box-sizing: border-box;margin: 0;padding: 0}html,body{height: 100%}body{font-family: var(--font-sans);background: var(--ink-0);color: var(--fg-1);min-height: 100vh;min-height: 100dvh;overflow-x: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-feature-settings: 'cv01' 1,'cv02' 1;font-synthesis: none;font-optical-sizing: auto}.stage{display: grid;grid-template-columns: minmax(0,1.05fr) minmax(0,0.95fr);width: 100vw;min-height: 100dvh}.stadium{position: relative;overflow: hidden;background: radial-gradient(ellipse 80% 55% at 50% 110%,rgba(232,58,31,0.55) 0%,rgba(138,26,12,0.4) 35%,transparent 70%),radial-gradient(ellipse 60% 40% at 80% -10%,rgba(232,177,0,0.18) 0%,transparent 60%),linear-gradient(180deg,#1a0e12 0%,#0f0810 55%,#060306 100%);border-right: 1px solid var(--line);padding: 40px 56px;display: flex;flex-direction: column;gap: 24px}.stadium::after{content: '';position: absolute;inset: 0;pointer-events: none;opacity: 0.07;mix-blend-mode: overlay;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");background-size: 220px}.stadium > *{position: relative;z-index: 1}.ribbon{display: flex;align-items: center;gap: 14px;font-family: var(--font-mono);font-size: 11px;letter-spacing: 0.14em;color: var(--fg-3);text-transform: uppercase}.ribbon .dot{width: 6px;height: 6px;border-radius: 50%;background: var(--signal-green);box-shadow: 0 0 0 4px rgba(61,216,122,0.15);animation: pulse 2.4s ease-in-out infinite}.ribbon .sep{color: var(--fg-4)}.ribbon .live{color: var(--fg-1)}@keyframes pulse{0%,100%{box-shadow: 0 0 0 4px rgba(61,216,122,0.15)}50%{box-shadow: 0 0 0 8px rgba(61,216,122,0.05)}}.brand{margin: auto 0;display: grid;grid-template-columns: auto 1px 1fr;align-items: center;gap: 32px}.crest-block{display: flex;flex-direction: column;align-items: center;gap: 14px}.brand img.shield{width: clamp(124px,12.5vw,184px);height: auto;filter: drop-shadow(0 16px 42px rgba(232,58,31,0.45)) drop-shadow(0 0 24px rgba(232,177,0,0.15))}.club-id{font-family: var(--font-mono);font-size: 10px;letter-spacing: 0.34em;text-transform: uppercase;color: var(--phoenix-gold);opacity: 0.85}.brand .divider{width: 1px;height: clamp(134px,13.5vw,198px);background: linear-gradient(180deg,transparent 0%,rgba(232,177,0,0.45) 30%,rgba(232,58,31,0.35) 70%,transparent 100%)}.text-block{display: flex;flex-direction: column;gap: 14px}.brand .wordmark{font-family: var(--font-display);font-size: clamp(56px,7vw,104px);line-height: 0.88;letter-spacing: 0.005em;color: var(--fg-1);text-transform: uppercase;white-space: nowrap}.brand .wordmark .accent{color: transparent;background: linear-gradient(180deg,var(--rising-red-hot) 0%,var(--rising-red) 60%,var(--rising-red-deep) 100%);-webkit-background-clip: text;background-clip: text}.brand .tagline{max-width: 460px;font-size: 16px;line-height: 1.5;color: var(--fg-2);text-wrap: pretty}.brand .tagline em{font-style: italic;color: var(--fg-1);font-weight: 500}.fixture{margin-top: auto;display: grid;grid-template-columns: 1fr auto;gap: 28px;align-items: center;padding: 22px 24px;background: rgba(0,0,0,0.35);border: 1px solid var(--line);border-radius: 18px;backdrop-filter: blur(14px);-webkit-backdrop-filter: blur(14px)}.fixture .eyebrow{font-family: var(--font-mono);font-size: 10px;letter-spacing: 0.18em;text-transform: uppercase;color: var(--fg-3);margin-bottom: 6px}.fixture .matchup{display: flex;align-items: center;gap: 12px;font-family: var(--font-display);font-size: 20px;letter-spacing: 0.01em;text-transform: uppercase;color: var(--fg-1);flex-wrap: wrap}.fixture .matchup .v{color: var(--fg-3);font-size: 12px;font-family: var(--font-mono);letter-spacing: 0.18em}.fixture .home-mark,.fixture .away-mark{width: 30px;height: 30px;border-radius: 50%;display: grid;place-items: center;font-family: var(--font-display);font-size: 11px;color: white;flex-shrink: 0}.fixture .team-logo{width: 30px;height: 30px;object-fit: contain;flex-shrink: 0}.fixture .home-mark{background: linear-gradient(180deg,var(--rising-red) 0%,var(--rising-red-deep) 100%);box-shadow: inset 0 0 0 1px rgba(232,177,0,0.6),0 2px 8px rgba(232,58,31,0.4)}.fixture .away-mark{background: linear-gradient(180deg,#2a7d4a 0%,#134022 100%);box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18)}.fixture .meta{text-align: right;font-family: var(--font-mono);font-size: 12px;color: var(--fg-2);line-height: 1.6;letter-spacing: 0.04em}.fixture .meta .countdown{font-family: var(--font-display);font-size: 26px;color: var(--phoenix-gold);letter-spacing: 0.02em;text-transform: uppercase;display: block;line-height: 1;margin-bottom: 4px}.console{background: linear-gradient(180deg,#0c0a0e 0%,#08070a 100%);display: flex;flex-direction: column;padding: 40px 56px;position: relative}.console::before{content: '';position: absolute;inset: 0;pointer-events: none;background: radial-gradient(ellipse 60% 40% at 100% 0%,rgba(232,58,31,0.08) 0%,transparent 60%),radial-gradient(ellipse 50% 50% at 0% 100%,rgba(232,177,0,0.04) 0%,transparent 60%)}.console > *{position: relative;z-index: 1}.ops-chip{margin-left: auto;display: inline-flex;align-items: center;gap: 10px;padding: 8px 12px 8px 10px;background: rgba(255,255,255,0.03);border: 1px solid var(--line);border-radius: 999px;font-family: var(--font-mono);font-size: 11px;color: var(--fg-2);letter-spacing: 0.06em}.ops-chip .dot{width: 6px;height: 6px;border-radius: 50%;background: var(--signal-green)}.ops-chip .v{color: var(--fg-3)}.form-col{margin: auto 0;width: 100%;max-width: 460px;align-self: center;padding: 32px 0}.eyebrow{font-family: var(--font-mono);font-size: 11px;letter-spacing: 0.22em;color: var(--phoenix-gold);text-transform: uppercase;margin-bottom: 18px}.eyebrow::before{content: '';display: inline-block;width: 24px;height: 1px;background: var(--phoenix-gold);margin-right: 12px;vertical-align: middle}h1.h-display{font-family: var(--font-display);font-size: 52px;line-height: 1.02;letter-spacing: 0.005em;text-transform: uppercase;color: var(--fg-1);margin-bottom: 18px}h1.h-display em{font-style: normal;color: transparent;background: linear-gradient(120deg,var(--phoenix-gold-hot) 0%,var(--phoenix-gold) 60%,var(--rising-red) 100%);-webkit-background-clip: text;background-clip: text}.sub{color: var(--fg-2);font-size: 15px;line-height: 1.55;margin-bottom: 28px;max-width: 420px;text-wrap: pretty}.auth-tabs{display: grid;grid-template-columns: 1fr 1fr;gap: 0;padding: 4px;background: rgba(255,255,255,0.03);border: 1px solid var(--line);border-radius: 14px;margin-bottom: 22px;position: relative}.auth-tabs .indicator{position: absolute;top: 4px;left: 4px;width: calc(50% - 4px);height: calc(100% - 8px);background: linear-gradient(135deg,rgba(232,58,31,0.18),rgba(232,177,0,0.08));border: 1px solid rgba(232,58,31,0.4);border-radius: 10px;transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);box-shadow: inset 0 1px 0 rgba(255,255,255,0.08),0 4px 18px -4px rgba(232,58,31,0.35)}.auth-tabs[data-active="magic"] .indicator{transform: translateX(100%)}.auth-tabs button{position: relative;z-index: 1;background: none;border: none;color: var(--fg-2);font-family: var(--font-sans);font-size: 14px;font-weight: 500;padding: 12px 14px;cursor: pointer;display: inline-flex;align-items: center;justify-content: center;gap: 8px;transition: color 0.2s ease;letter-spacing: 0.02em}.auth-tabs button.active{color: var(--fg-1)}.auth-tabs button .badge{font-family: var(--font-mono);font-size: 9px;letter-spacing: 0.12em;padding: 2px 6px;border-radius: 4px;background: var(--phoenix-gold);color: var(--ink-0);font-weight: 600}.auth-tabs button svg{width: 16px;height: 16px}.form-section{display: none}.form-section.active{display: block}.form-section.is-switching{animation: fadeUp 0.3s ease both}@keyframes fadeUp{from{opacity: 0;transform: translateY(6px)}to{opacity: 1;transform: translateY(0)}}.field{position: relative;margin-bottom: 14px}.field input{width: 100%;padding: 22px 16px 10px 48px;background: rgba(255,255,255,0.04);border: 1px solid var(--line);border-radius: 12px;color: var(--fg-1);font-family: var(--font-sans);font-size: 16px;font-weight: 450;outline: none;transition: border-color 0.2s ease,background 0.2s ease,box-shadow 0.2s ease}.field input::placeholder{color: transparent}.field input:hover{border-color: var(--line-2)}.field input:focus{border-color: var(--rising-red);background: rgba(255,255,255,0.06);box-shadow: 0 0 0 4px rgba(232,58,31,0.15)}.field input:focus:not(:focus-visible){outline: none}.field input:focus-visible{outline: 2px solid var(--rising-red);outline-offset: 2px}.field label{position: absolute;top: 50%;left: 48px;transform: translateY(-50%);color: var(--fg-3);font-size: 14px;pointer-events: none;transform-origin: left center;transition: transform 0.2s cubic-bezier(0.4,0,0.2,1),font-size 0.2s ease,color 0.2s ease}.field input:focus + label,.field input:not(:placeholder-shown) + label{transform: translateY(-160%) scale(0.78);color: var(--phoenix-gold)}.field .icon{position: absolute;top: 50%;left: 18px;transform: translateY(-50%);color: var(--fg-3);pointer-events: none;transition: color 0.2s ease}.field:focus-within .icon{color: var(--rising-red)}.segmented{display: grid;grid-template-columns: 1fr 1fr;gap: 4px;padding: 4px;background: rgba(255,255,255,0.03);border: 1px solid var(--line);border-radius: 10px;margin-bottom: 18px}.segmented input{position: absolute;opacity: 0;pointer-events: none}.segmented label{display: flex;align-items: center;justify-content: center;gap: 8px;padding: 10px 12px;color: var(--fg-2);font-size: 13px;font-weight: 500;border-radius: 6px;cursor: pointer;letter-spacing: 0.01em;transition: background 0.2s ease,color 0.2s ease,box-shadow 0.2s ease}.segmented label:hover{color: var(--fg-1)}.segmented input:checked + label{background: rgba(232,58,31,0.12);color: var(--fg-1);box-shadow: inset 0 0 0 1px rgba(232,58,31,0.4)}.segmented input:focus-visible + label{outline: 2px solid var(--rising-red);outline-offset: 2px}.segmented label .glyph{width: 14px;height: 14px;opacity: 0.7}.cta{width: 100%;position: relative;padding: 16px 24px;border: none;border-radius: 12px;background: linear-gradient(135deg,#ff7a3d 0%,var(--rising-red) 50%,#b1230f 100%);color: white;font-family: var(--font-sans);font-size: 15px;font-weight: 600;letter-spacing: 0.01em;cursor: pointer;overflow: hidden;isolation: isolate;box-shadow: inset 0 1px 0 rgba(255,255,255,0.25),inset 0 0 0 1px rgba(232,177,0,0.35),0 10px 30px -8px rgba(232,58,31,0.45);transition: transform 0.15s ease,box-shadow 0.2s ease}.cta::before{content: '';position: absolute;inset: 0;background: linear-gradient(120deg,transparent 30%,rgba(255,255,255,0.25) 50%,transparent 70%);transform: translateX(-100%);transition: transform 0.6s ease}.cta:hover{transform: translateY(-1px)}.cta:hover::before{transform: translateX(100%)}.cta:focus-visible{outline: 2px solid white;outline-offset: 3px}.cta:active{transform: scale(0.99)}.cta .arrow{margin-left: 8px;display: inline-block;transition: transform 0.2s ease}.cta:hover .arrow{transform: translateX(3px)}.cta--loading{pointer-events: none;opacity: 0.85}.cta--loading .btn-text{visibility: hidden}.cta--loading::after{content: '';position: absolute;top: 50%;left: 50%;width: 20px;height: 20px;margin: -10px 0 0 -10px;border: 3px solid rgba(255,255,255,0.3);border-top-color: white;border-radius: 50%;animation: spin 0.8s linear infinite}@keyframes spin{to{transform: rotate(1turn)}}.passkey-card{padding: 22px;background: rgba(255,255,255,0.025);border: 1px solid var(--line);border-radius: 14px;display: grid;grid-template-columns: 48px 1fr;gap: 16px;align-items: start;margin-bottom: 16px}.passkey-card .key-glyph{width: 48px;height: 48px;border-radius: 12px;background: linear-gradient(135deg,rgba(232,58,31,0.15),rgba(232,177,0,0.1));border: 1px solid rgba(232,58,31,0.3);display: grid;place-items: center;color: var(--phoenix-gold)}.passkey-card h3{font-family: var(--font-sans);font-size: 15px;font-weight: 600;color: var(--fg-1);margin-bottom: 4px;letter-spacing: -0.005em}.passkey-card p{color: var(--fg-2);font-size: 13px;line-height: 1.55}.helper{display: flex;align-items: center;gap: 10px;margin-top: 16px;font-family: var(--font-mono);font-size: 11px;letter-spacing: 0.08em;color: var(--fg-3);text-transform: uppercase;flex-wrap: wrap}.helper a{color: var(--fg-2);text-decoration: none;border-bottom: 1px dashed var(--line-2);padding-bottom: 1px;transition: color 0.2s ease,border-color 0.2s ease;cursor: pointer;background: none;border-left: none;border-right: none;border-top: none;font: inherit;letter-spacing: inherit;text-transform: inherit}.helper a:hover{color: var(--phoenix-gold);border-bottom-color: var(--phoenix-gold)}.helper a:focus-visible{outline: 2px solid var(--phoenix-gold);outline-offset: 2px}.helper .sep{color: var(--fg-4)}.console-foot{margin-top: auto;padding-top: 24px;border-top: 1px solid var(--line);display: flex;align-items: center;justify-content: space-between;font-family: var(--font-mono);font-size: 10px;letter-spacing: 0.14em;color: var(--fg-4);text-transform: uppercase;flex-wrap: wrap;gap: 12px}.console-foot .right{display: flex;align-items: center;gap: 18px;flex-wrap: wrap}.console-foot .build{color: var(--fg-3)}.error-message{background: rgba(220,53,69,0.15);border: 1px solid rgba(220,53,69,0.4);color: #ff6b6b;padding: 12px 16px;border-radius: 10px;margin-bottom: 18px;font-size: 0.9rem;font-weight: 500;text-wrap: pretty}@keyframes checkCircleDraw{to{stroke-dashoffset: 0}}@keyframes checkMarkDraw{to{stroke-dashoffset: 0}}@keyframes fadeInUp{from{opacity: 0;transform: translateY(10px)}to{opacity: 1;transform: translateY(0)}}.success-state{text-align: center;padding: 8px 0}.success-state .check-icon{margin: 0 auto 1.25rem}.check-circle{stroke-dasharray: 166;stroke-dashoffset: 166;animation: checkCircleDraw 0.6s cubic-bezier(0.65,0,0.45,1) forwards}.check-mark{stroke-dasharray: 48;stroke-dashoffset: 48;animation: checkMarkDraw 0.3s ease 0.7s forwards}.success-heading{font-family: var(--font-display);font-size: 36px;letter-spacing: 0.005em;text-transform: uppercase;color: var(--fg-1);margin-bottom: 10px;opacity: 0;animation: fadeInUp 0.4s ease 0.5s forwards}.success-detail{color: var(--fg-2);font-size: 15px;line-height: 1.55;margin-bottom: 6px;opacity: 0;animation: fadeInUp 0.4s ease 0.6s forwards}.success-email{color: var(--phoenix-gold);font-weight: 600}.success-expiry{color: var(--fg-3);font-size: 12px;font-family: var(--font-mono);letter-spacing: 0.1em;text-transform: uppercase;margin-bottom: 18px;opacity: 0;animation: fadeInUp 0.3s ease 0.7s forwards}.success-spam{color: var(--fg-3);font-size: 13px;margin-bottom: 20px;opacity: 0;animation: fadeInUp 0.3s ease 0.8s forwards}.success-actions{display: flex;flex-direction: column;align-items: center;gap: 10px;opacity: 0;animation: fadeInUp 0.3s ease 0.9s forwards}.resend-btn{background: none;border: none;color: var(--phoenix-gold);font-family: var(--font-mono);font-size: 12px;font-weight: 500;letter-spacing: 0.08em;text-transform: uppercase;cursor: pointer;padding: 8px 14px;border-radius: 6px;border: 1px solid rgba(232,177,0,0.3);transition: background 0.2s ease,color 0.2s ease}.resend-btn:hover:not(:disabled){background: rgba(232,177,0,0.1)}.resend-btn:focus-visible{outline: 2px solid var(--phoenix-gold);outline-offset: 2px}.resend-btn:disabled{color: var(--fg-4);border-color: var(--line);cursor: default}.different-email-link{color: var(--fg-3);text-decoration: none;font-size: 12px;font-family: var(--font-mono);letter-spacing: 0.08em;text-transform: uppercase}.different-email-link:hover{color: var(--phoenix-gold)}.different-email-link:focus-visible{outline: 2px solid var(--phoenix-gold);outline-offset: 2px}@media (max-width: 960px){.stage{grid-template-columns: 1fr;min-height: 0}.stadium{padding: 28px 24px;min-height: 360px;border-right: none;border-bottom: 1px solid var(--line)}.console{padding: 28px 24px}.form-col{max-width: none;padding: 8px 0}h1.h-display{font-size: 40px}.brand{grid-template-columns: 1fr;gap: 20px;text-align: center}.crest-block{flex-direction: row}.brand .divider{display: none}.text-block{align-items: center}.brand img.shield{width: 110px}.brand .wordmark{font-size: 64px}.fixture{grid-template-columns: 1fr;gap: 12px}.fixture .meta{text-align: left}}@media (prefers-reduced-motion: reduce){.ribbon .dot{animation: none}.form-section.is-switching{animation: none}.cta::before{transition: none}.auth-tabs .indicator{transition: none}.check-circle,.check-mark{animation: none;stroke-dashoffset: 0}.success-heading,.success-detail,.success-expiry,.success-spam,.success-actions{animation: none;opacity: 1;transform: none}}.auth-tabs[hidden]{display: none}.sr-only{position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0,0,0,0)}