/* LegendMatch design tokens. Generated from design/tokens.json; do not edit. */
@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/auth-assets/fonts/BricolageGrotesque-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Figtree";
  src: url("/auth-assets/fonts/Figtree-Variable.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --surface-100: #fff9f6;
  --surface-200: #f8ebe5;
  --ink: #2a1b28;
  --ink-muted: #6b5866;
  --brand: #6b2c61;
  --on-brand: #ffffff;
  --accent: #f4a93b;
  --on-accent: #2a1b28;
  --blush: #f6d3c8;
  --sage: #2f6b57;
  --error: #a3261f;
  --line: #e3d2cb;
  --line-strong: #9c8794;
  --shadow-soft: 0 8px 24px rgba(107, 44, 97, 0.10);
  --font-display: "Bricolage Grotesque", "Figtree", system-ui, sans-serif;
  --font-sans: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-pill: 999px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --surface-100: #1d1520;
    --surface-200: #2a1f2b;
    --ink: #f7eef2;
    --ink-muted: #c3b2bf;
    --brand: #e7a9da;
    --on-brand: #2a1b28;
    --accent: #f4b455;
    --on-accent: #2a1b28;
    --blush: #4a2f44;
    --sage: #8fd2b6;
    --error: #ff9d92;
    --line: #433442;
    --line-strong: #857485;
    --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.40);
    color-scheme: dark;
  }
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:var(--font-sans);font-size:17px;line-height:26px;background:var(--surface-100);color:var(--ink);padding:var(--space-8) max(var(--space-4),env(safe-area-inset-right,0px)) var(--space-12) max(var(--space-4),env(safe-area-inset-left,0px))}
.brand{max-width:28rem;margin:0 auto var(--space-6);font-family:var(--font-display);font-size:28px;line-height:32px;letter-spacing:-0.02em}
.brand .legend{font-weight:700;color:var(--ink)}
.brand .match{font-weight:500;color:var(--brand)}
main{max-width:28rem;margin:0 auto;padding:var(--space-6);background:var(--surface-200);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}
h1{font-family:var(--font-display);font-size:30px;line-height:36px;font-weight:650;letter-spacing:-0.01em;margin:0 0 var(--space-3);text-wrap:balance}
p{margin:0 0 var(--space-3)}
strong{font-weight:700}
form{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-4)}
form[hidden]{display:none}
label{font-size:15px;line-height:22px;font-weight:600}
input{width:100%;padding:var(--space-3) var(--space-4);font:inherit;color:var(--ink);background:var(--surface-100);border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
input:focus-visible,button:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.buttons{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-4)}
button{align-self:flex-start;margin-top:var(--space-2);padding:var(--space-3) var(--space-6);font:inherit;font-weight:600;border:0;border-radius:var(--radius-pill);background:var(--brand);color:var(--on-brand);cursor:pointer}
.buttons button{margin-top:0}
button:disabled{opacity:.6;cursor:progress}
button.secondary{background:transparent;color:var(--brand);box-shadow:inset 0 0 0 1px var(--line-strong)}
button.link{background:none;padding:0;margin:0;border-radius:0;color:var(--brand);font-weight:400;text-decoration:underline;text-underline-offset:3px}
.switch{margin-top:var(--space-6);font-size:15px;line-height:22px}
.qr svg{display:block;width:220px;height:220px;background:#fff;border-radius:var(--radius-sm);margin:0 0 var(--space-3)}
code{font-family:ui-monospace,monospace;font-size:15px;word-break:break-all}
ol,ul{margin:0 0 var(--space-3);padding-left:var(--space-6)}
.staff-nav{margin:0 0 var(--space-4);font-size:15px}
.staff-nav a,main a{color:var(--brand)}
ul.list{list-style:none;padding:0}
ul.list li{padding:var(--space-3) 0;border-bottom:1px solid var(--line)}
.muted{color:var(--ink-muted);font-size:15px;line-height:22px}
fieldset{border:0;padding:0;margin:var(--space-2) 0;display:flex;flex-direction:column;gap:var(--space-2)}
legend{font-size:15px;font-weight:600;margin-bottom:var(--space-2)}
label.check{font-weight:400;display:flex;gap:var(--space-2);align-items:flex-start}
label.check input{width:auto;margin-top:5px}
select{width:100%;padding:var(--space-3) var(--space-4);font:inherit;color:var(--ink);background:var(--surface-100);border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
.table{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px;line-height:20px}
th,td{text-align:left;padding:var(--space-2);border-bottom:1px solid var(--line);vertical-align:top}
.notice{margin:0 0 var(--space-4);padding:var(--space-4);border-radius:var(--radius-sm);background:var(--surface-100);box-shadow:inset 0 0 0 1px var(--line-strong)}
.notice h2{font-family:var(--font-display);font-size:20px;line-height:26px;margin:0 0 var(--space-2)}
.notice p:last-child{margin-bottom:0}
#message{min-height:22px;margin-top:var(--space-4);font-size:15px;line-height:22px;color:var(--ink-muted)}
.footer{margin:var(--space-8) 0 0;font-size:13px;line-height:18px;color:var(--ink-muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}