@charset "UTF-8";

:root { color-scheme: dark; --bg:#101112; --panel:#17181a; --line:#303134; --text:#f3f2ed; --muted:#a6a6a8; --lime:#c5ff49; --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:88px; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
body:has(.game-stage:fullscreen) { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button:not(:disabled),a { cursor:pointer; }
button:disabled { opacity:.45; cursor:default; }
:focus-visible { outline:2px solid var(--lime); outline-offset:6px; }
::selection { color:var(--bg); background:var(--lime); }
img,video { display:block; max-width:100%; }
button { border:0; }
.skip-link { position:fixed; top:12px; left:12px; z-index:20; background:var(--lime); color:#101112; padding:14px; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-header { height:84px; padding:0 5.2%; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #ffffff16; position:sticky; top:0; z-index:10; background:#101112ed; backdrop-filter:blur(16px); }
.wordmark { display:inline-flex; align-items:center; font-size:29px; font-weight:900; letter-spacing:-2px; }
.brand-dot { width:9px; height:9px; margin:14px 0 0 5px; border-radius:50%; background:var(--lime); }
nav { display:flex; align-items:center; gap:25px; font-size:13px; font-weight:600; }
nav>a:not(.nav-play):hover { color:var(--lime); }
.nav-play { display:flex; align-items:center; gap:26px; padding:12px 20px; border:1px solid #676b5d; color:var(--lime); }
.nav-play:hover { background:var(--lime); color:var(--bg); border-color:var(--lime); }
.hero { min-height:660px; height:min(780px,calc(100svh - 84px)); position:relative; overflow:hidden; display:flex; align-items:center; }
.hero-image { position:absolute; top:0; right:0; bottom:0; width:60%; }
.hero-image img { height:100%; width:100%; object-fit:cover; object-position:50% 18%; }
.hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--bg),transparent 47%),linear-gradient(0deg,var(--bg),transparent 25%); }
.hero-content { z-index:1; position:relative; width:100%; padding:34px 5.2% 70px; }
.eyebrow { display:flex; align-items:center; gap:9px; font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:1.4px; line-height:1.7; }
.status-dot { display:inline-block; width:6px; height:6px; flex-shrink:0; border-radius:50%; background:var(--lime); }
.hero .eyebrow { color:var(--lime); margin:0 0 35px; }
h1,h2,.game-logo { font-weight:900; letter-spacing:-.065em; }
h1 { font-size:clamp(70px,7.6vw,117px); line-height:.94; margin:0 0 27px; }
h1>span { color:var(--lime); }
.hero-description { color:#c6c6c8; font-size:16px; line-height:1.75; margin:0 0 30px; }
.hero-actions { display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:24px; min-height:51px; padding:15px 22px; font-size:13px; font-weight:700; border:1px solid transparent; transition:background .18s,transform .18s; }
.button-lime { color:#15170f; background:var(--lime); }
.button-lime:hover { background:#d7ff86; transform:translateY(-2px); }
.text-link { display:inline-flex; align-items:center; gap:18px; font-size:13px; font-weight:600; padding:12px 0; border-bottom:1px solid #606164; }
.text-link:hover { color:var(--lime); border-color:var(--lime); }
.hero-caption { position:absolute; bottom:30px; right:5.2%; display:flex; align-items:flex-end; flex-direction:column; gap:8px; font-family:var(--mono); font-size:9px; letter-spacing:1px; color:#c9c9cb; }
.hero-caption span:first-child { color:var(--lime); }
.scroll-cue { position:absolute; bottom:34px; left:5.2%; display:flex; align-items:center; gap:15px; font-family:var(--mono); font-size:9px; letter-spacing:1.2px; color:var(--muted); }
.scroll-cue>span { font-size:22px; color:var(--text); }
.ticker { display:flex; align-items:center; justify-content:space-around; gap:40px; overflow:hidden; white-space:nowrap; background:var(--lime); color:var(--bg); padding:19px 26px; font-size:14px; font-weight:800; letter-spacing:-.3px; }
.ticker-star { font-size:27px; line-height:1; font-weight:400; }
.section-shell { padding:0 7.5%; }
.section-label { display:flex; justify-content:space-between; gap:20px; padding:22px 0; border-bottom:1px solid var(--line); color:var(--muted); font-family:var(--mono); font-size:9px; letter-spacing:1px; line-height:1.5; }
.section-label span:first-child { color:var(--text); }
.story { padding-top:65px; padding-bottom:90px; }
.story-grid { display:grid; grid-template-columns:.82fr 1fr; gap:10%; align-items:center; padding-top:52px; }
.story-photo { position:relative; aspect-ratio:4/4.5; overflow:hidden; }
.story-photo>img { width:100%; height:100%; object-fit:cover; object-position:50% 36%; }
.story-photo::after { content:""; position:absolute; inset:65% 0 0; background:linear-gradient(transparent,#0009); pointer-events:none; }
.photo-label { position:absolute; bottom:20px; left:20px; z-index:1; font:8px var(--mono); letter-spacing:1px; }
.story-copy>.eyebrow { color:var(--muted); margin:0 0 20px; font-size:9px; }
h2 { font-size:clamp(35px,3.6vw,57px); line-height:1.03; margin:0 0 25px; }
h2>span { color:var(--lime); }
.story-copy>p:not(.eyebrow),.documentary-copy>p:not(.eyebrow):not(.quiet-note),.play-copy>p:not(.eyebrow) { font-size:14px; line-height:1.85; color:var(--muted); max-width:440px; }
blockquote { border-left:2px solid var(--lime); margin:28px 0 0; padding:0 0 0 20px; font-size:26px; font-weight:700; letter-spacing:-.8px; line-height:1.15; }
blockquote cite { display:block; margin-top:16px; color:var(--muted); font:8px var(--mono); letter-spacing:1px; }
.documentary { background:#18191b; padding-top:28px; padding-bottom:65px; }
.documentary-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:10%; padding-top:48px; align-items:center; }
.documentary-copy>.eyebrow { color:var(--muted); margin-bottom:22px; }
.film-details { display:flex; flex-wrap:wrap; gap:15px; font:8px var(--mono); letter-spacing:1px; padding:24px 0; margin-top:24px; border-top:1px solid #38393d; border-bottom:1px solid #38393d; max-width:440px; }
.film-details>span+span::before { content:"/"; color:#727477; margin-right:15px; }
.quiet-note { color:var(--muted); font-size:11px; margin-top:20px; }
.film { width:100%; max-width:284px; margin:0 auto; }
.film>video { width:100%; height:auto; aspect-ratio:9/16; background:#080808; border:1px solid #424447; object-fit:contain; }
.film figcaption { display:flex; gap:8px; align-items:center; color:var(--muted); font:8px var(--mono); letter-spacing:.8px; margin-top:14px; }
.play-section { padding-top:55px; padding-bottom:90px; background:radial-gradient(ellipse at 80% 55%,#26203366,transparent 60%); }
.play-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:10%; align-items:center; padding-top:50px; }
.play-copy>.eyebrow { color:var(--lime); margin-bottom:22px; }
.play-copy h2 { font-size:clamp(48px,5vw,77px); }
.game-notes { margin:32px 0 16px; max-width:410px; }
.game-notes>div { display:grid; grid-template-columns:135px 1fr; gap:15px; border-top:1px solid var(--line); padding:16px 0; }
.game-notes dt { font:9px var(--mono); color:var(--text); letter-spacing:.5px; line-height:1.6; }
.game-notes dd { font-size:12px; color:var(--muted); line-height:1.6; margin:0; }
.external-game { font-size:11px; }
.arcade { width:100%; max-width:376px; margin:auto; border:1px solid #45434b; background:#101015; box-shadow:14px 14px 0 #202024; }
.arcade-toolbar { height:42px; display:flex; align-items:center; justify-content:space-between; padding:0 15px; border-bottom:1px solid #34343a; font:8px var(--mono); letter-spacing:.8px; color:var(--muted); }
.arcade-toolbar>span:first-child { display:flex; align-items:center; gap:7px; color:var(--text); }
.game-stage { position:relative; width:100%; aspect-ratio:9/16; overflow:hidden; background:#080e17; }
.game-placeholder { display:flex; position:absolute; inset:0; padding:12% 10%; flex-direction:column; align-items:flex-start; justify-content:center; isolation:isolate; background:radial-gradient(ellipse at 100% 20%,#4728666b,transparent 60%),#0d1117; }
.game-grid { position:absolute; inset:0; z-index:-1; opacity:.16; background-image:linear-gradient(#9594ac30 1px,transparent 1px),linear-gradient(90deg,#9594ac30 1px,transparent 1px); background-size:40px 40px; mask-image:linear-gradient(transparent,#000); }
.game-placeholder>.eyebrow { font-size:8px; letter-spacing:.9px; color:var(--lime); }
.game-logo { font-size:clamp(48px,6vw,78px); line-height:.92; margin:24px 0; }
.game-logo>span { color:var(--lime); }
.game-tagline { font-size:13px; line-height:1.75; color:#a9aaba; margin:0 0 25px; }
.start-game { width:100%; justify-content:space-between; }
.game-loading-note { font:7px var(--mono); color:#a9aaba; margin:14px 0 0; letter-spacing:1px; text-align:center; width:100%; }
.game-stage iframe { border:0; display:block; position:absolute; inset:0; width:100%; height:100%; }
.arcade-footer { min-height:43px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 12px; border-top:1px solid #34343a; }
#game-status { color:var(--muted); font:7px var(--mono); letter-spacing:.5px; line-height:1.5; }
#fullscreen { display:flex; align-items:center; gap:5px; font-size:9px; color:var(--text); padding:10px 0 10px 7px; background:none; }
#fullscreen:hover:not(:disabled) { color:var(--lime); }
.game-help { font-size:11px; color:var(--muted); padding:0 14px; line-height:1.7; }
.game-help a { color:var(--lime); text-decoration:underline; text-underline-offset:3px; }
.game-stage:fullscreen { width:100vw; height:100dvh; aspect-ratio:auto; display:grid; place-items:center; background:#080e17; }
.game-stage:fullscreen iframe { position:relative; width:min(100vw,56.25dvh); height:100dvh; }
.site-footer { min-height:118px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-footer>.wordmark { font-size:24px; }
.site-footer>p { color:var(--muted); font-size:11px; line-height:1.7; }
.back-to-top { display:flex; gap:14px; align-items:center; font:9px var(--mono); letter-spacing:.8px; }
.back-to-top>span { font-size:20px; color:var(--lime); }
[hidden] { display:none !important; }
@media (min-width:1600px) { .hero-content { padding-left:max(5.2%,calc((100vw - 1440px)/2)); } .section-shell { padding-left:max(7.5%,calc((100vw - 1300px)/2)); padding-right:max(7.5%,calc((100vw - 1300px)/2)); } }
@media (max-width:1000px) {
  .hero { min-height:620px; }
  h1 { font-size:clamp(65px,9vw,95px); }
  .hero-image { width:65%; }
  .story-grid,.documentary-grid,.play-grid { gap:7%; }
  .section-shell { padding-left:6%; padding-right:6%; }
  .story-copy>h2 { font-size:34px; }
  .story-copy>p:not(.eyebrow) { font-size:13px; }
  .story-copy>.eyebrow { font-size:8px; }
  .game-logo { font-size:59px; }
  .game-notes>div { grid-template-columns:110px 1fr; gap:10px; }
}
@media (max-width:700px) {
  html { scroll-padding-top:78px; }
  .site-header { height:70px; padding:0 5%; }
  .wordmark { font-size:26px; }
  nav { gap:17px; font-size:11px; }
  .nav-play { gap:13px; padding:10px 12px; }
  .hero { min-height:680px; height:calc(100svh - 70px); max-height:830px; align-items:flex-end; }
  .hero-image { width:100%; }
  .hero-image img { object-position:50% 26%; }
  .hero-image::after { background:linear-gradient(0deg,var(--bg) 0%,#101112e8 29%,#1011123d 70%,#10111212),linear-gradient(90deg,#10111244,transparent); }
  .hero-content { padding:0 6% 105px; }
  .hero .eyebrow { font-size:8px; letter-spacing:1.1px; margin-bottom:22px; }
  h1 { font-size:clamp(52px,12vw,84px); margin-bottom:19px; }
  .hero-description { font-size:14px; line-height:1.65; margin-bottom:24px; }
  .hero-actions { gap:18px; }
  .button { padding:14px 17px; gap:14px; font-size:12px; }
  .hero-actions>.text-link { font-size:11px; gap:10px; }
  .hero-caption { display:none; }
  .scroll-cue { left:6%; bottom:33px; font-size:8px; }
  .ticker { justify-content:flex-start; padding:16px 22px; gap:28px; font-size:12px; }
  .section-label { font-size:8px; gap:25px; }
  .section-label>span+span { text-align:right; max-width:145px; }
  .story { padding-top:32px; padding-bottom:50px; }
  .story-grid { grid-template-columns:1fr; gap:32px; padding-top:28px; }
  .story-photo { aspect-ratio:1.25; }
  .story-photo>img { object-position:50% 32%; }
  .story-copy>h2,h2 { font-size:clamp(34px,8.2vw,49px); }
  .story-copy>p:not(.eyebrow),.documentary-copy>p:not(.eyebrow):not(.quiet-note),.play-copy>p:not(.eyebrow) { font-size:14px; }
  .story-copy>.eyebrow { font-size:8px; }
  blockquote { font-size:25px; }
  .documentary { padding-top:13px; padding-bottom:40px; }
  .documentary-grid,.play-grid { grid-template-columns:1fr; gap:32px; padding-top:30px; }
  .documentary-copy>.eyebrow { font-size:8px; }
  .film { max-width:285px; }
  .film-details { margin-top:22px; }
  .play-section { padding-top:30px; padding-bottom:55px; }
  .play-copy h2 { font-size:60px; }
  .game-notes { max-width:none; }
  .game-notes>div { grid-template-columns:125px 1fr; }
  .arcade { max-width:350px; box-shadow:7px 7px 0 #202024; }
  .game-logo { font-size:70px; }
  .game-placeholder>.eyebrow { font-size:8px; }
  .site-footer { flex-wrap:wrap; padding-top:26px; padding-bottom:26px; gap:20px; }
  .site-footer>p { order:3; width:100%; margin:0; font-size:10px; }
  .back-to-top { margin-left:auto; }
}
@media (max-width:360px) { nav { gap:12px; } nav>a:first-child { display:none; } .hero-actions { gap:12px; } .hero-actions .button { font-size:11px; } .hero-actions>.text-link { font-size:10px; } .game-logo { font-size:61px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.tiktok-section { padding-top:35px; padding-bottom:65px; border-bottom:1px solid var(--line); }
.tiktok-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:10%; padding-top:45px; align-items:center; }
.tiktok-grid .eyebrow { color:var(--muted); }
.tiktok-grid>div>p:not(.eyebrow) { max-width:390px; color:var(--muted); line-height:1.85; font-size:14px; margin-bottom:28px; }
.tiktok-profile { display:block; position:relative; overflow:hidden; aspect-ratio:1.22; border:1px solid #3f4145; }
.tiktok-profile>img { height:100%; width:100%; object-fit:cover; object-position:50% 29%; transition:transform .25s; }
.tiktok-profile:hover>img { transform:scale(1.035); }
.tiktok-profile::after { position:absolute; content:""; inset:45% 0 0; background:linear-gradient(transparent,#000d); }
.tiktok-handle { position:absolute; bottom:26px; left:25px; right:25px; z-index:1; }
.tiktok-handle>span { display:block; font:8px var(--mono); color:var(--lime); letter-spacing:1px; margin-bottom:12px; }
.tiktok-handle>strong { display:flex; justify-content:space-between; align-items:center; font-size:clamp(20px,2.5vw,32px); letter-spacing:-1px; }
.player-identity { max-width:410px; margin:16px 0; }
.player-identity>label { display:block; font:9px var(--mono); letter-spacing:.8px; margin-bottom:12px; }
.player-identity>input { font:15px Arial,sans-serif; background:#191a1e; color:var(--text); border:1px solid #48494d; border-radius:0; padding:13px 14px; min-height:46px; width:100%; }
.player-identity>p { color:var(--muted); font-size:11px; line-height:1.6; margin:10px 0 0; }
.scores-section { padding-top:20px; padding-bottom:65px; background:#18191b; }
.scores-heading { display:flex; justify-content:space-between; gap:35px; align-items:end; padding:40px 0 30px; }
.scores-heading .eyebrow { color:var(--muted); }
.scores-heading h2 { margin-bottom:0; }
.scores-heading>p { color:var(--muted); font-size:13px; line-height:1.8; }
.scores-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.scores-table th { text-align:left; color:var(--muted); font:9px var(--mono); letter-spacing:1px; padding:18px 16px; background:#202124; }
.scores-table th:first-child { width:17%; }
.scores-table th:last-child { width:32%; }
.scores-table td { padding:20px 16px; border-bottom:1px solid #343639; font-size:15px; overflow-wrap:anywhere; }
.scores-table td:first-child:not(.scores-empty) { color:var(--lime); font-family:var(--mono); font-size:12px; }
.scores-table td:last-child,.scores-table th:last-child { text-align:right; }
.scores-table tbody>tr:first-child td { font-weight:700; }
.scores-table td.scores-empty { padding:38px 16px; color:var(--muted); font-size:13px; text-align:center; font-weight:400; line-height:1.8; }
.scores-footer { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:14px; }
.scores-footer>p { font-size:11px; line-height:1.7; color:var(--muted); }
#refresh-scores { background:none; color:var(--text); font-size:11px; flex-shrink:0; }
@media(max-width:700px) {
  nav { gap:17px; }
  nav>a[href="#histoire"],nav>a[href="#reportage"] { display:none; }
  .tiktok-section { padding-top:20px; padding-bottom:38px; }
  .tiktok-grid { grid-template-columns:1fr; gap:30px; padding-top:28px; }
  .tiktok-profile { aspect-ratio:1.4; }
  .tiktok-handle>strong { font-size:27px; }
  .scores-section { padding-top:15px; padding-bottom:35px; }
  .scores-heading { display:block; padding-top:25px; }
  .scores-heading>p { margin:20px 0 0; font-size:12px; }
  .scores-table td { padding:18px 10px; font-size:13px; }
  .scores-table th { padding:16px 10px; font-size:8px; }
  .scores-table th:first-child { width:18%; }
  .scores-footer { align-items:start; gap:20px; }
  .scores-footer>p { font-size:10px; }
}