/* MATCH XI site — tokens mirrored from /workspace/MATCH-XI/src/theme (main). Do not add colours not in the tokens. */
@font-face{font-family:"Barlow Condensed";font-style:italic;font-weight:800;font-display:swap;src:url(fonts/BarlowCondensed_800ExtraBold_Italic.woff2) format("woff2"),url(fonts/BarlowCondensed_800ExtraBold_Italic.ttf) format("truetype")} /* fonts.display */
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url(fonts/BarlowCondensed_800ExtraBold.woff2) format("woff2"),url(fonts/BarlowCondensed_800ExtraBold.ttf) format("truetype")} /* fonts.displayUpright */
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(fonts/Inter_400Regular.woff2) format("woff2"),url(fonts/Inter_400Regular.ttf) format("truetype")} /* fonts.regular */
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(fonts/Inter_500Medium.woff2) format("woff2"),url(fonts/Inter_500Medium.ttf) format("truetype")} /* fonts.medium */
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(fonts/Inter_600SemiBold.woff2) format("woff2"),url(fonts/Inter_600SemiBold.ttf) format("truetype")} /* fonts.semibold */
@font-face{font-family:Inter;font-weight:700;font-display:swap;src:url(fonts/Inter_700Bold.woff2) format("woff2"),url(fonts/Inter_700Bold.ttf) format("truetype")} /* fonts.bold */

:root{
  /* colors.ts */
  --bg-primary:#050506;        /* colors.background.primary (palette.black) */
  --bg-secondary:#0A0B0D;      /* colors.background.secondary (palette.night050) */
  --surface-default:#101114;   /* colors.surface.default (night100) */
  --surface-elevated:#17181C;  /* colors.surface.elevated (night200) */
  --surface-interactive:#1E1F24; /* colors.surface.interactive (night300) */
  --surface-pressed:#2A2C33;   /* colors.surface.pressed (night400) */
  --text-primary:#FFFFFF;      /* colors.text.primary */
  --text-secondary:#9CA1AA;    /* colors.text.secondary (night700) */
  --text-muted:#61666F;        /* colors.text.muted (night600) — non-body only */
  --text-inverse:#050506;      /* colors.text.inverse */
  --border-subtle:rgba(255,255,255,.07);   /* colors.border.subtle */
  --border-hairline:rgba(255,255,255,.10); /* colors.border.hairline */
  --border-strong:rgba(255,255,255,.14);   /* colors.border.strong / dashed */
  --border-hairline-strong:rgba(255,255,255,.18); /* colors.border.hairlineStrong */
  --accent:#C8F04A;            /* colors.accent.primary (accent500, PROVISIONAL) */
  --accent-bright:#D9F77A;     /* colors.accent.bright (accent400) */
  --accent-pressed:#A3CC2A;    /* colors.accent.pressed (accent600) */
  --on-accent:#050506;         /* colors.accent.onPrimary */
  --glass-default:rgba(18,20,24,.58); /* colors.glass.default */
  --glass-strong:rgba(14,15,18,.80);  /* colors.glass.strong */
  --scrim-medium:rgba(5,5,6,.70);     /* colors.scrim.medium */
  --scrim-strong:rgba(5,5,6,.88);     /* colors.scrim.strong */
  /* typography.ts */
  --font-display:"Barlow Condensed",sans-serif; /* fonts.display */
  --font-ui:Inter,system-ui,sans-serif;         /* fonts.regular..bold */
  --fs-display-hero:52px; --lh-display-hero:48px; --ls-display-hero:-1.2px; /* type.displayHero */
  --fs-display-xl:40px;   --lh-display-xl:38px;   --ls-display-xl:-0.8px;   /* type.displayXL */
  --fs-display-lg:28px;   --lh-display-lg:28px;   --ls-display-lg:-0.5px;   /* type.displayLg */
  --fs-display-card:18px; --lh-display-card:19px; /* type.displayCard */
  /* spacing.ts */
  --sp-xxs:4px;--sp-xs:8px;--sp-sm:12px;--sp-md:16px;--sp-lg:20px;--sp-xl:24px;--sp-xxl:32px;--sp-xxxl:40px;--sp-huge:48px;--sp-giant:64px; /* spacing.* */
  --touch-min:44px; /* layout.minTouchTarget */
  /* radius.ts */
  --r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:20px;--r-xxl:24px;--r-pill:999px; /* radius.* */
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-primary);color:var(--text-primary);font:400 16px/1.6 var(--font-ui)}
img{max-width:100%;display:block}
a{color:var(--accent)}
a:hover{color:var(--accent-bright)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:var(--sp-md);top:-100px;background:var(--accent);color:var(--on-accent);padding:var(--sp-sm) var(--sp-md);border-radius:var(--r-sm);font-weight:600;z-index:10}
.skip:focus{top:var(--sp-md)}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--sp-md)}
@media(min-width:768px){.wrap{padding:0 var(--sp-xxl)}}
.display{font-family:var(--font-display);font-style:italic;font-weight:800;text-transform:uppercase}
/* header */
.site-head{border-bottom:1px solid var(--border-subtle);background:var(--bg-primary)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:var(--sp-md)}
.brand{font-family:var(--font-display);font-style:italic;font-weight:800;font-size:var(--fs-display-lg);letter-spacing:var(--ls-display-lg);color:var(--text-primary);text-decoration:none;text-transform:uppercase;min-height:var(--touch-min);display:inline-flex;align-items:center}
.lang{display:flex;gap:var(--sp-xxs);align-items:center;font-weight:600;font-size:14px}
.lang a,.lang span{min-width:var(--touch-min);min-height:var(--touch-min);display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-pill);text-decoration:none}
.lang a{color:var(--text-secondary)}
.lang a:hover{color:var(--text-primary);background:var(--surface-interactive)}
.lang [aria-current]{color:var(--text-primary);background:var(--surface-interactive)}
.lang .sep{min-width:auto;color:var(--text-muted)}
/* hero */
.hero{position:relative;padding:var(--sp-giant) 0 var(--sp-huge);overflow:hidden;
  background:radial-gradient(120% 80% at 50% 0%,var(--surface-elevated) 0%,var(--bg-primary) 70%)}
.wordmark{font-size:clamp(64px,16vw,160px);line-height:.9;letter-spacing:-2px;margin:0;padding-right:.08em}
.wordmark .xi{color:var(--accent)}
.pitch{font-size:clamp(18px,2.4vw,22px);color:var(--text-secondary);max-width:40ch;margin:var(--sp-lg) 0 var(--sp-xxl)}
.cta-row{display:flex;flex-wrap:wrap;gap:var(--sp-md);align-items:center}
.badge-placeholder{display:inline-flex;flex-direction:column;justify-content:center;min-width:180px;min-height:56px;padding:var(--sp-xs) var(--sp-md);border:1px dashed var(--border-hairline-strong);border-radius:var(--r-md);background:var(--surface-default);color:var(--text-secondary);font-size:12px;line-height:1.3}
.badge-placeholder strong{color:var(--text-primary);font-size:14px}
.note{color:var(--text-secondary);font-size:14px;display:inline-flex;align-items:center;gap:var(--sp-xs)}
.note::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}
/* shots */
.shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-xl);margin:var(--sp-huge) auto 0;max-width:960px}
.phone{margin:0;background:var(--surface-elevated);border:1px solid var(--border-hairline-strong);border-radius:44px;padding:10px;box-shadow:0 30px 60px rgba(5,5,6,.70)}
.phone img{border-radius:34px;aspect-ratio:393/852;width:100%;height:auto;object-fit:cover}
.phone figcaption{font-size:13px;color:var(--text-secondary);text-align:center;padding:var(--sp-xs) 0 var(--sp-xxs)}
@media(max-width:640px){.shots{grid-template-columns:repeat(3,72%);overflow-x:auto;scroll-snap-type:x mandatory;gap:var(--sp-md);padding-bottom:var(--sp-md);margin-left:calc(-1*var(--sp-md));margin-right:calc(-1*var(--sp-md));padding-left:var(--sp-md);padding-right:var(--sp-md)}.phone{scroll-snap-align:center;border-radius:36px;padding:8px}.phone img{border-radius:28px}}
/* features */
.section{padding:var(--sp-giant) 0}
.section h2.display{font-size:var(--fs-display-xl);line-height:var(--lh-display-xl);letter-spacing:var(--ls-display-xl);margin:0 0 var(--sp-xxl)}
.features{display:grid;gap:var(--sp-md);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));list-style:none;padding:0;margin:0}
.feature{background:var(--surface-default);border:1px solid var(--border-hairline);border-radius:var(--r-lg);padding:var(--sp-xl)}
.feature h3{font-family:var(--font-display);font-style:italic;font-weight:800;text-transform:uppercase;font-size:24px;line-height:1;margin:0 0 var(--sp-xs)}
.feature p{margin:0;color:var(--text-secondary)}
/* footer */
.site-foot{border-top:1px solid var(--border-subtle);background:var(--bg-secondary);padding:var(--sp-xxl) 0;margin-top:var(--sp-giant);font-size:14px;color:var(--text-secondary)}
.site-foot .wrap{display:flex;flex-wrap:wrap;gap:var(--sp-md);justify-content:space-between;align-items:center}
.site-foot nav ul{display:flex;flex-wrap:wrap;gap:var(--sp-xxs);list-style:none;margin:0;padding:0}
.site-foot nav a{color:var(--text-primary);text-decoration:none;min-height:var(--touch-min);display:inline-flex;align-items:center;padding:0 var(--sp-sm);border-radius:var(--r-sm)}
.site-foot nav a:hover{background:var(--surface-interactive)}
/* legal / long-form */
.doc{display:grid;gap:var(--sp-xxl);padding:var(--sp-huge) 0}
@media(min-width:1024px){.doc{grid-template-columns:240px minmax(0,68ch);justify-content:center;gap:var(--sp-giant)}}
.doc-title{font-size:var(--fs-display-xl);line-height:var(--lh-display-xl);letter-spacing:var(--ls-display-xl);margin:0 0 var(--sp-sm)}
@media(min-width:768px){.doc-title{font-size:var(--fs-display-hero);line-height:var(--lh-display-hero);letter-spacing:var(--ls-display-hero)}}
.updated{color:var(--text-secondary);font-size:14px;margin:0 0 var(--sp-xxl)}
.prose{max-width:68ch;font-size:17px;line-height:1.7}
.prose h2{font:700 24px/1.3 var(--font-ui);margin:var(--sp-huge) 0 var(--sp-sm);scroll-margin-top:var(--sp-xl);padding-top:var(--sp-xl);border-top:1px solid var(--border-subtle)}
.prose h3{font:600 18px/1.4 var(--font-ui);margin:var(--sp-xl) 0 var(--sp-xs)}
.prose p,.prose li{color:var(--text-primary)}
.prose .lede{color:var(--text-secondary);font-size:18px}
.toc{font-size:14px}
.toc details{background:var(--surface-default);border:1px solid var(--border-hairline);border-radius:var(--r-md);padding:var(--sp-xxs) var(--sp-md)}
.toc summary{cursor:pointer;font-weight:600;min-height:var(--touch-min);display:flex;align-items:center}
.toc ol{list-style:none;margin:0 0 var(--sp-sm);padding:0}
.toc a{display:flex;align-items:center;min-height:var(--touch-min);color:var(--text-secondary);text-decoration:none;padding:0 var(--sp-xs);border-radius:var(--r-sm)}
.toc a:hover{color:var(--text-primary);background:var(--surface-interactive)}
@media(min-width:1024px){.toc{position:sticky;top:var(--sp-xl);align-self:start;max-height:calc(100vh - 48px);overflow:auto}.toc a{min-height:36px}}
/* support */
.contact-card{background:var(--surface-default);border:1px solid var(--border-hairline);border-radius:var(--r-lg);padding:var(--sp-xl);margin:var(--sp-xl) 0}
.contact-card a{font-weight:600;font-size:18px;min-height:var(--touch-min);display:inline-flex;align-items:center}
.faq{display:grid;gap:var(--sp-sm);margin-top:var(--sp-xl)}
.faq details{background:var(--surface-default);border:1px solid var(--border-hairline);border-radius:var(--r-md);padding:0 var(--sp-md)}
.faq summary{cursor:pointer;font-weight:600;min-height:56px;display:flex;align-items:center}
.faq details p{color:var(--text-secondary);margin:0 0 var(--sp-md)}
.copy-slot{}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}a,.lang a,.toc a{transition:background-color .15s,color .15s}}
.doc-head{padding-top:var(--sp-huge);max-width:calc(240px + 68ch + 64px);margin:0 auto}
.doc-head .updated{margin-bottom:0}
.doc{padding-top:var(--sp-xxl)}
@media(max-width:1023px){.toc details:not([open]) ol{display:none}}
/* copy round 2 */
.hero .sub{color:var(--text-secondary);max-width:52ch;margin:calc(-1*var(--sp-md)) 0 var(--sp-xxl)}
.plus-section{padding-top:0}
.plus-card{background:var(--surface-elevated);border:1px solid var(--border-hairline);border-radius:var(--r-xl);padding:var(--sp-xxl);max-width:760px}
.plus-card h2.display{margin-bottom:var(--sp-sm)}
.plus-card p{margin:0 0 var(--sp-sm);color:var(--text-primary)}
.plus-card .plus-note{color:var(--text-secondary);font-size:14px;margin:0}
/* Placeholder Sem still has to fill: accent outline so it stands out */
mark.ph{background:transparent;color:var(--accent-bright);outline:1px dashed var(--accent);outline-offset:1px;border-radius:4px;padding:0 3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}