:root {
  color-scheme: dark;
  --ink: #f7f8ef;
  --muted: #9fa4ba;
  --lime: #d8ff63;
  --mint: #55e6dc;
  --pink: #ff6b9e;
  --panel: rgba(15, 18, 38, .68);
  --line: rgba(255, 255, 255, .11);
}
.skin-preview.circuit{background:repeating-linear-gradient(90deg,var(--skin-a) 0 7px,var(--skin-c) 7px 11px,var(--skin-b) 11px 15px)}
.skin-preview.crystal{background:linear-gradient(125deg,var(--skin-c),transparent 45%),repeating-linear-gradient(45deg,var(--skin-a) 0 9px,var(--skin-b) 9px 13px)}
.skin-preview.magma{background:radial-gradient(circle at 25% 45%,var(--skin-b),transparent 20%),radial-gradient(circle at 75% 25%,var(--skin-b),transparent 18%),linear-gradient(var(--skin-a),var(--skin-a))}
.skin-preview.hazard{background:repeating-linear-gradient(135deg,var(--skin-a) 0 15px,var(--skin-b) 15px 30px)}
.skin-preview.camo{background:radial-gradient(ellipse at 20% 25%,var(--skin-b) 0 15%,transparent 17%),radial-gradient(ellipse at 70% 65%,var(--skin-c) 0 20%,transparent 22%),radial-gradient(ellipse at 90% 10%,var(--skin-b) 0 16%,transparent 18%),linear-gradient(var(--skin-a),var(--skin-a))}
.skin-preview.country{background-position:center;background-size:cover;background-repeat:no-repeat}
.skin-preview.country_ultra{position:relative;overflow:hidden;background-position:center;background-size:cover;background-repeat:no-repeat;filter:saturate(1.75) contrast(1.12);box-shadow:inset 0 0 22px #fff9,0 0 11px var(--skin-a),0 0 25px color-mix(in srgb,var(--skin-b) 72%,transparent)}
.skin-preview.country_ultra::before{position:absolute;inset:-40%;content:"";background:conic-gradient(from 20deg,transparent,var(--skin-a),transparent,var(--skin-b),transparent,var(--skin-c),transparent);mix-blend-mode:screen;opacity:.72;animation:ultra-country-glow 3.2s linear infinite}
.skin-preview.country_ultra::after{position:absolute;inset:0;display:grid;place-items:center;content:"✦";color:white;font-size:31px;text-shadow:0 0 6px white,0 0 14px var(--skin-a),0 0 24px var(--skin-b)}
@keyframes ultra-country-glow{to{transform:rotate(1turn)}}
.skin-preview.halloween{background:radial-gradient(circle at 24% 50%,#17101f 0 8%,transparent 9%),radial-gradient(circle at 76% 50%,#17101f 0 8%,transparent 9%),repeating-linear-gradient(135deg,var(--skin-a) 0 18px,var(--skin-b) 18px 29px,var(--skin-c) 29px 36px);box-shadow:inset 0 0 25px #ffb00088,0 0 16px #7d2cff66}
.skin-preview.christmas{background:repeating-linear-gradient(135deg,var(--skin-a) 0 13px,var(--skin-b) 13px 22px,var(--skin-c) 22px 35px);box-shadow:inset 0 0 24px #fff9,0 0 14px #e6394666}
.skin-preview.snow{background-color:var(--skin-a);background-image:radial-gradient(circle,var(--skin-b) 0 13%,transparent 15%),radial-gradient(circle,var(--skin-c) 0 10%,transparent 12%);background-position:0 0,13px 13px;background-size:28px 28px;box-shadow:inset 0 0 24px #fff,0 0 14px #62c8ff77}
.skin-preview.summer{background:radial-gradient(circle at 72% 35%,var(--skin-b) 0 12%,transparent 13%),repeating-radial-gradient(ellipse at 50% 120%,var(--skin-a) 0 10px,var(--skin-c) 11px 17px,var(--skin-b) 18px 25px)}
.skin-preview.spring{background-color:var(--skin-b);background-image:radial-gradient(circle,var(--skin-c) 0 10%,var(--skin-a) 11% 24%,transparent 25%);background-size:34px 34px;background-position:0 0,17px 17px}
.skin-preview.midnight{background:radial-gradient(circle at 28% 30%,#fff 0 2%,transparent 3%),radial-gradient(circle at 68% 64%,var(--skin-c) 0 2%,transparent 3%),linear-gradient(135deg,var(--skin-a),var(--skin-b));background-size:27px 27px,35px 35px,100% 100%;box-shadow:inset 0 0 24px #8055ff66,0 0 18px #8055ffaa}
.skin-preview.matrix{position:relative;overflow:hidden;background-color:#06100c;background-position:center;background-size:contain;background-repeat:no-repeat;box-shadow:inset 0 0 30px #39ff1440,0 0 10px #39ff14aa,0 0 24px #00f5a066}
.skin-preview.launch_epic{position:relative;overflow:hidden;background:radial-gradient(circle at 34% 30%,#f4ccff 0 5%,transparent 6%),repeating-linear-gradient(135deg,var(--skin-a) 0 13px,var(--skin-c) 13px 18px,var(--skin-b) 18px 24px);box-shadow:inset 0 0 27px #fff7,0 0 13px #b86bff,0 0 28px #7b2cff88;animation:launch-joy-pulse 4.4s ease-in-out infinite}.skin-preview.launch_epic::after{position:absolute;inset:0;display:grid;place-items:center;content:"☺";color:#fff;font-size:32px;text-shadow:0 0 8px #fff,0 0 18px #d99bff}@keyframes launch-joy-pulse{50%{filter:saturate(1.22) brightness(1.12);box-shadow:inset 0 0 31px #fff9,0 0 18px #d99bff,0 0 34px #7b2cffaa}}
.skin-preview[class*="summer_"]{background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:inset 0 0 20px rgba(255,255,255,.18),0 5px 16px color-mix(in srgb,var(--skin-a) 24%,transparent)}

* { box-sizing: border-box; user-select: none; -webkit-user-select: none; }
input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]), textarea, [contenteditable="true"] { user-select: text; -webkit-user-select: text; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #080a16; touch-action: pan-x pan-y; }
body { color: var(--ink); font-family: "DM Sans", sans-serif; overscroll-behavior: none; }
button, input { font: inherit; }
button { color: inherit; }

#game-shell { position: relative; width: 100%; height: 100%; isolation: isolate; }
#game { display: block; width: 100%; height: 100%; background: #090b18; touch-action: none; }
.glass { background: var(--panel); border: 1px solid var(--line); box-shadow: 0 22px 70px rgba(0,0,0,.28); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }

.topbar {
  position: fixed; z-index: 40; top: 18px; left: 20px; right: 20px; height: 56px;
  display: flex; align-items: center; justify-content: space-between; padding: 0 18px;
  border-radius: 15px; pointer-events: none;
}
.brand { display: flex; align-items: center; gap: 9px; font-family: "Space Grotesk", sans-serif; font-size: 15px; letter-spacing: .05em; }
.brand img { width: 31px; height: 31px; }
.brand span span { color: var(--lime); }
.server-state { display: flex; align-items: center; color: var(--muted); font-size: 12px; letter-spacing: .05em; }
.server-state strong { color: var(--ink); font-size: 13px; }
.status-dot { width: 8px; height: 8px; margin-right: 8px; border-radius: 99px; background: #6d7288; box-shadow: 0 0 0 4px rgba(109,114,136,.12); }
.status-dot.online { background: var(--mint); box-shadow: 0 0 0 4px rgba(85,230,220,.12), 0 0 15px var(--mint); }
.status-dot.connecting { background: #ffce56; animation: pulse 1s infinite; }
.separator { width: 1px; height: 18px; margin: 0 12px; background: var(--line); }
.top-actions { display: flex; align-items: center; gap: 8px; pointer-events: auto; }
.icon-button, .account-button { height: 32px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.055); color: #d9dce9; cursor: pointer; }
.icon-button { width: 34px; font-size: 17px; }
.icon-button.muted { color: #757b90; }
.season-button{border-color:rgba(179,136,255,.34);background:rgba(179,136,255,.12);color:#d2baff}
.account-button { max-width: 180px; padding: 0 12px; overflow: hidden; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-overflow: ellipsis; white-space: nowrap; }
.account-button.connected { border-color: rgba(216,255,99,.35); color: var(--lime); }
.gold-button,.menu-button{height:32px;padding:0 10px;border:1px solid var(--line);border-radius:9px;background:rgba(255,206,86,.1);color:#ffce56;font-size:10px;font-weight:700;cursor:pointer}.menu-button{background:rgba(255,255,255,.055);color:#d9dce9;font-size:8px;letter-spacing:.08em}

.leaderboard { position: fixed; z-index: 8; top: 91px; right: 20px; width: 235px; padding: 16px; border-radius: 16px; pointer-events: none; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; padding-bottom: 11px; border-bottom: 1px solid var(--line); }
.panel-heading > span { color: var(--lime); font-family: "Space Grotesk", sans-serif; font-size: 12px; letter-spacing: .13em; }
.panel-heading small { color: var(--muted); font-size: 9px; letter-spacing: .08em; }
.leaderboard ol { margin: 10px 0 0; padding: 0; list-style: none; }
.leaderboard li { display: grid; grid-template-columns: 31px 1fr auto; gap: 6px; align-items: center; min-height: 25px; color: #c9ccda; font-size: 11px; }
.leaderboard li .rank { color: #666c83; font-family: "Space Grotesk", sans-serif; }
.leaderboard li .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.country-flag { display: inline-block; width: 16px; height: 12px; margin-right: 5px; border-radius: 2px; background-position: center; background-size: cover; box-shadow: 0 0 0 1px rgba(255,255,255,.18); vertical-align: -1px; flex: 0 0 auto; }
.leaderboard li .points { color: var(--ink); font-variant-numeric: tabular-nums; }
.leaderboard li.me { color: var(--lime); }

.spectator-controls{position:fixed;z-index:18;left:50%;bottom:20px;display:grid;width:min(540px,calc(100vw - 32px));grid-template-columns:auto 1fr;gap:10px 18px;align-items:center;padding:13px 15px;transform:translateX(-50%);pointer-events:auto}.spectator-controls[hidden]{display:none}.spectator-controls span,.spectator-controls strong{display:block}.spectator-controls span{color:var(--mint);font-size:7px;font-weight:900;letter-spacing:.15em}.spectator-controls strong{margin-top:3px;font:700 13px "Space Grotesk",sans-serif}.spectator-actions{display:flex;justify-content:flex-end;gap:7px}.spectator-actions button{min-height:34px;padding:0 11px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.07);color:var(--ink);font-size:7px;font-weight:900;letter-spacing:.08em;cursor:pointer}.spectator-actions button.active{border-color:rgba(85,230,220,.55);background:rgba(85,230,220,.14);color:var(--mint)}.spectator-controls small{grid-column:1/-1;color:var(--muted);font-size:8px;text-align:center}@media(max-width:620px){.spectator-controls{bottom:10px;grid-template-columns:1fr}.spectator-actions{justify-content:stretch}.spectator-actions button{flex:1}.spectator-controls small{font-size:7px}}
.leaderboard li:nth-child(1) .rank { color: #ffcf56; }
.leaderboard li:nth-child(2) .rank { color: #d8e0ee; }
.leaderboard li:nth-child(3) .rank { color: #d58b58; }

.score-card { position: fixed; z-index: 8; left: 20px; bottom: 20px; display: none; min-width: 120px; padding: 12px 16px; border-radius: 14px; pointer-events: none; }
.score-card.visible { display: block; }
.score-card span { display: block; color: var(--muted); font-size: 9px; letter-spacing: .13em; }
.score-card strong { color: var(--lime); font-family: "Space Grotesk", sans-serif; font-size: 25px; }
.edge-warning { position: fixed; z-index: 7; top: 95px; left: 50%; padding: 7px 12px; transform: translateX(-50%) translateY(-10px); border: 1px solid rgba(255,107,158,.4); border-radius: 99px; background: rgba(88,20,48,.7); color: #ff8cb5; font-size: 10px; letter-spacing: .16em; opacity: 0; transition: .2s; }
.edge-warning.visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.kill-toast { position: fixed; z-index: 20; top: 92px; left: 50%; max-width: calc(100vw - 32px); padding: 10px 16px; transform: translate(-50%, -14px); border: 1px solid rgba(216,255,99,.42); border-radius: 999px; background: rgba(22,31,25,.88); color: var(--lime); font-family: "Space Grotesk", sans-serif; font-size: 11px; letter-spacing: .04em; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.kill-toast.visible { opacity: 1; transform: translate(-50%, 0); }
.maintenance-screen { position: fixed; z-index: 100; top: 18px; left: 50%; display: flex; width: min(620px, calc(100vw - 28px)); align-items: center; gap: 15px; padding: 14px 18px; transform: translateX(-50%); border: 1px solid rgba(255,206,86,.42); border-radius: 17px; background: linear-gradient(110deg,rgba(39,30,12,.96),rgba(15,17,31,.97)); box-shadow: 0 18px 55px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.05); color: var(--ink); }
.maintenance-screen[hidden] { display: none; }
.maintenance-symbol { position: relative; display: grid; width: 47px; height: 47px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255,206,86,.35); border-radius: 14px; background: rgba(255,206,86,.1); }
.maintenance-symbol i { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #ffce56; box-shadow: 0 0 11px rgba(255,206,86,.7); animation: maintenance-dot 1.2s ease-in-out infinite; }
.maintenance-symbol i:nth-child(1) { transform: translateX(-12px); }
.maintenance-symbol i:nth-child(2) { animation-delay: .15s; }
.maintenance-symbol i:nth-child(3) { transform: translateX(12px); animation-delay: .3s; }
.maintenance-copy { display: grid; min-width: 0; gap: 3px; }
.maintenance-copy span { color: #ffce56; font-size: 8px; font-weight: 800; letter-spacing: .18em; }
.maintenance-copy strong { font-family: "Space Grotesk", sans-serif; font-size: 16px; }
.maintenance-copy p { margin: 0; color: #bbc0ce; font-size: 10px; }
.maintenance-copy small { color: #7e8497; font-size: 8px; }
.maintenance-screen.updating { inset: 0; width: auto; flex-direction: column; justify-content: center; gap: 24px; padding: 30px; transform: none; border: 0; border-radius: 0; background: radial-gradient(circle at 50% 44%,rgba(37,42,76,.94),rgba(5,7,17,.995) 68%); text-align: center; }
.maintenance-screen.updating .maintenance-symbol { width: 92px; height: 92px; border-radius: 27px; background: linear-gradient(145deg,rgba(216,255,99,.12),rgba(85,230,220,.09)); box-shadow: 0 0 55px rgba(85,230,220,.12); }
.maintenance-screen.updating .maintenance-symbol::after { content: ""; position: absolute; inset: 16px; border: 3px solid rgba(255,255,255,.08); border-top-color: var(--lime); border-right-color: var(--mint); border-radius: 50%; animation: maintenance-spin 1s linear infinite; }
.maintenance-screen.updating .maintenance-symbol i { display: none; }
.maintenance-screen.updating .maintenance-copy { max-width: 520px; gap: 9px; }
.maintenance-screen.updating .maintenance-copy span { color: var(--mint); }
.maintenance-screen.updating .maintenance-copy strong { font-size: clamp(30px,6vw,54px); letter-spacing: -.04em; }
.maintenance-screen.updating .maintenance-copy p { font-size: 13px; }
.maintenance-screen.updating .maintenance-copy small { margin-top: 5px; color: #9298aa; font-size: 10px; }
@keyframes maintenance-dot { 0%,100% { opacity: .28; transform-origin: center; } 50% { opacity: 1; } }
@keyframes maintenance-spin { to { transform: rotate(360deg); } }
.battle-royale-status{position:fixed;z-index:18;top:91px;left:50%;display:grid;min-width:300px;padding:13px 20px;transform:translateX(-50%);border:1px solid rgba(255,107,158,.35);border-radius:14px;background:linear-gradient(100deg,rgba(36,14,39,.9),rgba(20,17,47,.9));text-align:center;pointer-events:none}.battle-royale-status[hidden]{display:none}.battle-royale-status span{color:#ff83b0;font-size:8px;font-weight:700;letter-spacing:.16em}.battle-royale-status strong{margin-top:4px;font-family:"Space Grotesk",sans-serif;font-size:15px}.battle-royale-status small{margin-top:3px;color:#8c8499;font-size:8px}.battle-royale-status.running{top:83px;min-width:250px;padding:8px 15px}.battle-royale-status.running strong{font-size:11px}
.summer-games-status{position:fixed;z-index:18;top:88px;left:50%;display:grid;width:min(430px,calc(100vw - 28px));padding:12px 18px;transform:translateX(-50%);border:1px solid rgba(255,184,72,.52);border-radius:16px;background:linear-gradient(120deg,rgba(30,78,98,.94),rgba(87,45,72,.94));box-shadow:0 16px 45px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.08);text-align:center;pointer-events:none}.summer-games-status[hidden]{display:none}.summer-games-status>span{color:#ffd166;font-size:8px;font-weight:800;letter-spacing:.17em}.summer-games-status>strong{margin-top:4px;color:#fff7df;font-family:"Space Grotesk",sans-serif;font-size:15px;font-variant-numeric:tabular-nums}.summer-games-status>small{margin-top:3px;color:#b9e7e0;font-size:8px}.summer-games-status ol{display:grid;gap:2px;margin:8px 0 0;padding:7px 0 0;border-top:1px solid rgba(255,255,255,.1);list-style:none}.summer-games-status li{display:grid;grid-template-columns:28px 1fr auto;gap:6px;color:#e8fbf5;font-size:9px;text-align:left}.summer-games-status li.me{color:#ffd166;font-weight:800}.summer-games-status li small{color:inherit;font-variant-numeric:tabular-nums}.summer-games-status.running ol{display:none}

.join-screen, .death-screen { position: fixed; z-index: 30; inset: 0; display: grid; place-items: center; padding: 92px 24px 42px; background: radial-gradient(circle at 50% 45%, rgba(30,35,69,.68), rgba(7,9,20,.94) 70%); opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; }
.join-screen.visible, .death-screen.visible { opacity: 1; visibility: visible; }
.join-screen { overflow-x: hidden; overflow-y: auto; }
.join-layout { position: relative; z-index: 1; display: grid; width: min(460px, 100%); place-items: center; }
.join-card { position: relative; width: min(460px, 100%); padding: 34px 42px 28px; border-radius: 25px; text-align: center; overflow: hidden; }
.join-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, var(--lime), var(--mint), transparent); }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .19em; }
.eyebrow i { width: 6px; height: 6px; border-radius: 99px; background: var(--mint); box-shadow: 0 0 12px var(--mint); }
.hero-mark { width: 77px; height: 77px; margin: 19px auto 7px; filter: drop-shadow(0 10px 24px rgba(85,230,220,.19)); }
h1, h2 { margin: 0; font-family: "Space Grotesk", sans-serif; line-height: .99; letter-spacing: -.045em; }
h1 { font-size: clamp(39px, 7vw, 57px); }
h1 em { color: var(--lime); font-style: normal; }
.intro { max-width: 335px; margin: 17px auto 25px; color: var(--muted); font-size: 13px; line-height: 1.55; }
.account-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -9px 0 17px; padding: 9px 11px; border: 1px solid rgba(85,230,220,.16); border-radius: 10px; background: rgba(85,230,220,.045); text-align: left; }
.account-strip span { color: #9da7b9; font-size: 10px; line-height: 1.3; }
.account-strip span.connected { color: var(--lime); }
.account-strip button { flex: 0 0 auto; padding: 6px 9px; border: 0; border-radius: 7px; background: rgba(85,230,220,.14); color: var(--mint); font-size: 8px; font-weight: 700; letter-spacing: .08em; cursor: pointer; }
#join-form { text-align: left; }
#join-form label { display: block; margin: 0 0 8px 3px; color: #c7cada; font-size: 9px; font-weight: 700; letter-spacing: .16em; }
.input-wrap { position: relative; }
#player-name { width: 100%; height: 52px; padding: 0 60px 0 17px; outline: 0; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: rgba(4,6,16,.7); color: var(--ink); font-size: 14px; transition: .2s; }
#player-name:focus { border-color: rgba(216,255,99,.65); box-shadow: 0 0 0 4px rgba(216,255,99,.06); }
#player-name::placeholder { color: #62677d; }
#name-counter { position: absolute; top: 50%; right: 15px; transform: translateY(-50%); color: #62677d; font-size: 10px; }
#play-button, #respawn-button { width: 100%; height: 53px; margin-top: 11px; border: 0; border-radius: 12px; background: var(--lime); color: #111509; font-family: "Space Grotesk", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .08em; cursor: pointer; box-shadow: 0 13px 35px rgba(216,255,99,.15); transition: transform .16s, filter .16s; }
#play-button { display: flex; align-items: center; justify-content: space-between; padding: 0 18px 0 21px; }
#play-button b { font-size: 20px; }
.private-play-button { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 43px; margin-top: 8px; padding: 0 17px; border: 1px solid rgba(85,230,220,.28); border-radius: 11px; background: rgba(85,230,220,.08); color: var(--mint); font-size: 9px; font-weight: 700; letter-spacing: .08em; cursor: pointer; }
.battle-royale-play-button { display:flex;align-items:center;justify-content:space-between;width:100%;height:49px;margin-top:8px;padding:0 17px;border:1px solid rgba(255,107,158,.38);border-radius:11px;background:linear-gradient(100deg,rgba(255,107,158,.12),rgba(179,136,255,.12));color:#ffc0d7;cursor:pointer;text-align:left }.battle-royale-play-button span { display:grid;gap:2px }.battle-royale-play-button strong { font-family:"Space Grotesk",sans-serif;font-size:10px;letter-spacing:.1em }.battle-royale-play-button small { color:#8c829b;font-size:7px;letter-spacing:.07em }.battle-royale-play-button b { color:#ff80ae;font-size:20px }.battle-royale-play-button:hover { border-color:rgba(255,107,158,.7);filter:brightness(1.1) }.battle-royale-play-button:disabled { cursor:not-allowed;filter:grayscale(.6);opacity:.55 }
.battle-royale-play-button[hidden]{display:none}
.summer-games-play-button{display:flex;align-items:center;justify-content:space-between;width:100%;height:53px;margin-top:8px;padding:0 17px;border:1px solid rgba(255,193,77,.62);border-radius:11px;background:linear-gradient(105deg,rgba(255,153,51,.19),rgba(33,192,187,.18),rgba(255,96,139,.15));color:#ffe29a;cursor:pointer;text-align:left;box-shadow:inset 0 1px rgba(255,255,255,.07)}.summer-games-play-button span{display:grid;gap:2px}.summer-games-play-button strong{font-family:"Space Grotesk",sans-serif;font-size:10px;letter-spacing:.08em}.summer-games-play-button small{color:#9edbd2;font-size:7px;letter-spacing:.06em}.summer-games-play-button b{font-size:19px}.summer-games-play-button:hover{border-color:#ffd166;filter:brightness(1.12)}.summer-games-play-button:disabled{cursor:not-allowed;filter:grayscale(.6);opacity:.55}.summer-games-play-button[hidden]{display:none}
.private-play-button[hidden] { display: none; }
.private-game-rules { display: block; margin: 7px 3px 0; color: #777e92; font-size: 8px; line-height: 1.35; text-align: center; }
.private-game-rules[hidden] { display: none; }
#play-button:hover, #respawn-button:hover { filter: brightness(1.08); transform: translateY(-2px); }
#play-button:disabled { cursor: wait; filter: grayscale(.6); opacity: .7; transform: none; }
.controls-hint { display: flex; justify-content: center; gap: 23px; margin-top: 22px; }
.controls-hint > div { display: flex; align-items: center; gap: 4px; }
.controls-hint small { margin-left: 3px; color: #72778d; font-size: 8px; font-weight: 700; letter-spacing: .11em; }
.key { min-width: 26px; height: 22px; display: grid; place-items: center; padding: 0 5px; border: 1px solid rgba(255,255,255,.15); border-radius: 5px; background: rgba(255,255,255,.05); color: #b9bdcc; font-size: 8px; box-shadow: 0 2px 0 rgba(255,255,255,.09); }
.key.wide { min-width: 44px; }
.finger { color: var(--mint); }
.join-message { min-height: 17px; margin: 15px 0 0; color: #ff8cb5; font-size: 11px; }
.join-screen footer { position: absolute; bottom: 18px; color: #555b70; font-size: 10px; }
.ambient { position: fixed; width: 36vw; aspect-ratio: 1; border-radius: 50%; filter: blur(90px); opacity: .13; pointer-events: none; }
.ambient-one { top: -19vw; left: -9vw; background: var(--mint); }
.ambient-two { right: -15vw; bottom: -20vw; background: var(--pink); }

.world-card { position: absolute; top: 50%; left: calc(100% + 18px); display: flex; width: 360px; min-height: 590px; max-height: min(690px, calc(100vh - 140px)); padding: 22px 19px 16px; transform: translateY(-50%); border-radius: 25px; overflow: hidden; flex-direction: column; }
.world-heading { display: flex; align-items: flex-end; justify-content: space-between; padding: 0 3px 14px; border-bottom: 1px solid var(--line); }
.world-heading > div span { display: block; color: var(--mint); font-size: 9px; font-weight: 700; letter-spacing: .17em; }
.world-heading strong { display: block; margin-top: 2px; font-family: "Space Grotesk", sans-serif; font-size: 24px; }
.world-heading small { color: #666d81; font-size: 8px; letter-spacing: .11em; }
.leaderboard-tabs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px; margin-top: 11px; padding: 4px; border-radius: 10px; background: rgba(255,255,255,.045); }
.leaderboard-tabs button { height: 32px; border: 0; border-radius: 7px; background: transparent; color: #777e92; font-size: 8px; font-weight: 700; letter-spacing: .06em; cursor: pointer; }
.leaderboard-tabs button.active { background: rgba(85,230,220,.12); color: var(--mint); box-shadow: inset 0 0 0 1px rgba(85,230,220,.14); }
.leaderboard-country-controls { display: grid; grid-template-columns: 22px minmax(0,1fr); align-items: center; gap: 7px; margin-top: 8px; }
.leaderboard-country-controls[hidden] { display: none; }
.leaderboard-country-controls .country-flag { width: 20px; height: 15px; margin: 0; }
.leaderboard-country-controls select { width: 100%; height: 31px; padding: 0 8px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; outline: 0; background: #090c1c; color: #c9ccda; font-size: 9px; }
.leaderboard-country-controls select:focus { border-color: rgba(85,230,220,.5); }
.battle-leaderboard-controls { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:8px }.battle-leaderboard-controls[hidden]{display:none}.battle-leaderboard-controls select{height:31px;padding:0 8px;border:1px solid rgba(255,255,255,.1);border-radius:7px;outline:0;background:#090c1c;color:#d6d9e5;font-size:9px}.battle-leaderboard-controls>div{display:flex;align-items:center;gap:5px}.battle-leaderboard-controls button{width:29px;height:29px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(255,255,255,.045);color:#cdd1df;cursor:pointer}.battle-leaderboard-controls button:disabled{opacity:.35;cursor:default}.battle-leaderboard-controls span{min-width:40px;color:#858b9e;font-size:8px;text-align:center}
#world-leaderboard-list { flex: 1; min-height: 0; margin: 9px -5px 0 0; padding: 0 7px 0 0; overflow-y: auto; list-style: none; scrollbar-color: rgba(216,255,99,.3) transparent; scrollbar-width: thin; }
#world-leaderboard-list li { display: grid; grid-template-columns: 35px minmax(0,1fr) auto; gap: 7px; align-items: center; min-height: 31px; padding: 0 7px; border-radius: 7px; color: #c5c9d8; font-size: 11px; }
#world-leaderboard-list li:nth-child(odd) { background: rgba(255,255,255,.022); }
#world-leaderboard-list .world-rank { color: #656c81; font-family: "Space Grotesk", sans-serif; }
#world-leaderboard-list .world-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#world-leaderboard-list button.world-name, .leaderboard button.name { min-width: 0; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
#world-leaderboard-list button.world-name:hover, .leaderboard button.name:hover { color: var(--lime); text-decoration: underline; text-underline-offset: 3px; }
.leaderboard .profile-link { pointer-events: auto; }
.medal-rank { font-size: 18px; line-height: 1; filter: drop-shadow(0 2px 5px rgba(0,0,0,.45)); }
.medal-1 { color: #ffd45c !important; }.medal-2 { color: #dce6f3 !important; }.medal-3 { color: #d99662 !important; }
#world-leaderboard-list .world-score { color: var(--lime); font-variant-numeric: tabular-nums; }
#world-leaderboard-list li.league-bronze .world-score{color:#d99662}#world-leaderboard-list li.league-silver .world-score{color:#dce6f3}#world-leaderboard-list li.league-gold .world-score{color:#ffd45c}#world-leaderboard-list li.league-diamond .world-score{color:#73e8ff}#world-leaderboard-list li.league-master .world-score{color:#cda8ff;text-shadow:0 0 9px #9d5cff77}
#world-leaderboard-list .world-empty { display: grid; min-height: 120px; place-items: center; color: #757b90; text-align: center; grid-template-columns: 1fr; }
.own-world-rank { margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(216,255,99,.22); border-radius: 10px; background: rgba(216,255,99,.05); color: var(--lime); font-size: 10px; text-align: center; }

.auth-dialog { width: min(440px, calc(100% - 28px)); max-height: calc(100% - 28px); padding: 31px; overflow-y: auto; border-radius: 23px; color: var(--ink); }
.auth-dialog::backdrop { background: rgba(4,6,15,.8); backdrop-filter: blur(7px); }
.dialog-close { position: absolute; top: 12px; right: 14px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(255,255,255,.06); color: #aeb2c2; font-size: 22px; cursor: pointer; }
.auth-overline { color: var(--mint); font-size: 8px; font-weight: 700; letter-spacing: .18em; }
.auth-dialog h2 { max-width: 320px; margin: 9px 0 23px; font-size: 31px; }
.public-profile-dialog { width: min(620px, calc(100% - 28px)); max-height: calc(100dvh - 28px); padding: 34px; overflow-x: hidden; overflow-y: auto; border: 1px solid rgba(85,230,220,.17); border-radius: 27px; background: radial-gradient(circle at 8% 5%,rgba(85,230,220,.08),transparent 31%),linear-gradient(150deg,rgba(15,18,38,.99),rgba(8,10,25,.99)); color: var(--ink); box-shadow: 0 30px 90px rgba(0,0,0,.55); }
.public-profile-dialog::before { position: absolute; inset: 0 0 auto; height: 2px; content: ""; background: linear-gradient(90deg,transparent,var(--mint),var(--lime),transparent); }
.public-profile-dialog::backdrop { background: rgba(4,6,15,.86); backdrop-filter: blur(10px); }
.public-profile-loading { min-height: 260px; display: grid; place-items: center; color: var(--muted); font-size: 11px; }
.public-profile-loading[hidden]{display:none}
.public-profile-heading { display: flex; align-items: center; gap: 18px; min-width: 0; padding-right: 34px; }
.public-profile-flag { display: grid; width: 82px; height: 58px; flex: 0 0 auto; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background-color: rgba(255,255,255,.045); background-position: center; background-size: cover; font-size: 30px; box-shadow: 0 13px 30px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.04); }
.public-profile-identity { min-width: 0; }
.public-profile-overline { color: var(--mint); font-size: 8px; font-weight: 800; letter-spacing: .18em; }
.public-profile-heading h2 { margin: 4px 0 7px; font-size: clamp(28px,6vw,38px); line-height: 1.02; overflow-wrap: anywhere; }
.public-profile-country { display: inline-flex; max-width: 100%; align-items: center; padding: 5px 9px; border: 1px solid rgba(85,230,220,.17); border-radius: 999px; background: rgba(85,230,220,.07); color: #a9deda; font-size: 9px; font-weight: 600; line-height: 1.25; letter-spacing: .025em; white-space: normal; }
.million-badge { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding: 12px 14px; border: 1px solid rgba(255,205,67,.42); border-radius: 13px; background: linear-gradient(105deg,rgba(255,190,49,.16),rgba(216,255,99,.06)); box-shadow: inset 0 0 24px rgba(255,202,62,.06); }
.million-badge[hidden] { display: none; }
.million-badge>span { display: grid; width: 45px; height: 45px; place-items: center; border-radius: 50%; background: linear-gradient(145deg,#fff2a7,#ef9f18); color: #332006; font-family:"Space Grotesk",sans-serif; font-size: 16px; font-weight: 800; box-shadow: 0 0 20px rgba(255,193,48,.3); }
.million-badge div { display: grid; gap: 3px; }.million-badge strong { color: #ffd76b; font-size: 10px; letter-spacing: .1em; }.million-badge small { color: #a79878; font-size: 8px; }
.public-profile-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 22px; }
.public-profile-stats>div { position: relative; display: flex; min-height: 82px; flex-direction: column; justify-content: space-between; gap: 8px; padding: 15px 16px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; background: linear-gradient(145deg,rgba(10,13,30,.75),rgba(5,7,18,.56)); }
.public-profile-stats>div::after { position: absolute; right: -16px; bottom: -24px; width: 65px; height: 65px; content: ""; border-radius: 50%; background: rgba(216,255,99,.035); }
.public-profile-stats span,.public-profile-skin span { display: block; color: #858ca2; font-size: 8px; font-weight: 800; line-height: 1.35; letter-spacing: .11em; }
.public-profile-stats strong { position: relative; z-index: 1; display: block; color: var(--lime); font-family:"Space Grotesk",sans-serif; font-size: clamp(18px,3.8vw,23px); line-height: 1.05; overflow-wrap: anywhere; }
.public-profile-stats .profile-league{font-size:15px}.profile-league.league-bronze{color:#d99662}.profile-league.league-silver{color:#dce6f3}.profile-league.league-gold{color:#ffd45c}.profile-league.league-diamond{color:#73e8ff;text-shadow:0 0 10px #42dfff66}.profile-league.league-master{color:#cda8ff;text-shadow:0 0 10px #9d5cff88}
.public-profile-skin { display: grid; grid-template-columns: minmax(170px,210px) minmax(0,1fr); align-items: center; gap: 19px; margin-top: 12px; padding: 13px; border: 1px solid rgba(216,255,99,.17); border-radius: 17px; background: linear-gradient(110deg,rgba(216,255,99,.055),rgba(85,230,220,.025)); }
.public-profile-skin .skin-preview { width: 100%; height: 104px; margin: 0; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; }
.public-profile-skin-copy { min-width: 0; }
.public-profile-skin strong { display: block; margin-top: 7px; font-family:"Space Grotesk",sans-serif; font-size: 17px; line-height: 1.15; overflow-wrap: anywhere; }
.public-profile-skin small { display: block; margin-top: 7px; color: #6f768a; font-size: 9px; line-height: 1.4; }
.public-profile-member { margin: 17px 0 0; color: #747b90; font-size: 9px; text-align: center; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 19px; padding: 4px; border-radius: 10px; background: rgba(255,255,255,.045); }
.auth-tabs button { height: 35px; border: 0; border-radius: 7px; background: transparent; color: #787e92; font-size: 9px; font-weight: 700; letter-spacing: .09em; cursor: pointer; }
.auth-tabs button.active { background: rgba(216,255,99,.12); color: var(--lime); }
.auth-form { display: none; }
.auth-form.active { display: block; }
.auth-form label { display: block; margin: 12px 0 7px 2px; color: #b5b9c9; font-size: 8px; font-weight: 700; letter-spacing: .14em; }
.auth-form input { width: 100%; height: 46px; padding: 0 13px; outline: 0; border: 1px solid rgba(255,255,255,.13); border-radius: 10px; background: rgba(4,6,16,.68); color: var(--ink); }
.auth-form input:focus { border-color: rgba(85,230,220,.62); box-shadow: 0 0 0 4px rgba(85,230,220,.055); }
.password-field{position:relative}.auth-form .password-field input{padding-right:86px}.password-toggle{position:absolute;top:50%;right:7px;min-width:69px;height:32px;padding:0 9px;transform:translateY(-50%);border:1px solid rgba(85,230,220,.2);border-radius:8px;background:rgba(85,230,220,.09);color:var(--mint);font-size:7px;font-weight:800;letter-spacing:.06em;cursor:pointer}.password-toggle:hover{border-color:rgba(85,230,220,.55)}
.password-match-hint{transition:color .2s ease}.password-match-hint.success{color:#70d98f}.password-match-hint.error{color:#ff7da8}
.auth-form > small { display: block; margin: 6px 2px 0; color: #71778b; font-size: 9px; }
.auth-form > button, .auth-user-view button { width: 100%; height: 48px; margin-top: 16px; border: 0; border-radius: 10px; background: var(--lime); color: #111509; font-family: "Space Grotesk", sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .08em; cursor: pointer; }
.auth-form > button:disabled { cursor: wait; opacity: .55; }
.auth-form .text-button{height:30px;margin-top:7px;background:transparent;color:#848a9e;font-family:"DM Sans",sans-serif;font-size:8px}.account-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.account-shortcuts button{margin-top:8px;background:rgba(85,230,220,.11);color:var(--mint)}
.local-captcha { display: block; width: 100%; margin-top: 14px; --altcha-max-width: 100%; --altcha-color-base: #090c1c; --altcha-color-base-content: #f4f6ed; --altcha-color-primary: #d8ff63; --altcha-color-primary-content: #111509; --altcha-color-success: #55e6dc; --altcha-border-color: rgba(255,255,255,.14); --altcha-border-radius: 10px; }
.captcha-mode { color: #55e6dc !important; line-height: 1.45; }
.auth-message { min-height: 18px; margin: 14px 0 0; color: #ff8cb5; font-size: 10px; }
.auth-message.success { color: var(--lime); }
.auth-user-view p { color: var(--muted); font-size: 12px; line-height: 1.55; }
.profile-country-form{margin:18px 0;padding:14px;border:1px solid rgba(85,230,220,.16);border-radius:12px;background:rgba(85,230,220,.045)}
.profile-country-form label{display:block;margin-bottom:8px;color:#b5b9c9;font-size:8px;font-weight:700;letter-spacing:.14em}
.country-select-row{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:8px}
.profile-country-flag{display:grid;width:38px;height:30px;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:7px;background-position:center;background-size:cover;font-size:17px}
.profile-country-form select{width:100%;height:42px;padding:0 10px;border:1px solid rgba(255,255,255,.13);border-radius:9px;outline:0;background:#090c1c;color:var(--ink)}
.profile-country-form select:focus{border-color:rgba(85,230,220,.62)}
.profile-country-form>small{display:block;margin:7px 1px 0;color:#71778b;font-size:9px;line-height:1.4}
.auth-user-view .profile-country-form>button{height:42px;margin-top:11px}
.auth-user-view .profile-country-form .auth-message{min-height:0;margin:8px 1px 0;color:#ff8cb5;font-size:10px}
.auth-user-view .profile-country-form .auth-message.success{color:var(--lime)}
.feature-dialog{width:min(720px,calc(100% - 28px));max-height:calc(100% - 28px);padding:29px;overflow:auto;border-radius:23px;color:var(--ink)}.feature-dialog::backdrop{background:rgba(4,6,15,.82);backdrop-filter:blur(7px)}.feature-dialog h2{margin:7px 0 18px;font-size:31px}.feature-dialog>p{color:var(--muted);font-size:11px}.feature-heading{display:flex;align-items:center;justify-content:space-between}.feature-heading strong{color:#ffce56;font-family:"Space Grotesk",sans-serif}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:18px}.shop-item{padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(5,7,18,.52)}.skin-preview{height:72px;margin-bottom:11px;border-radius:10px;background:linear-gradient(135deg,var(--skin-a),var(--skin-b));box-shadow:inset 0 0 22px rgba(255,255,255,.12)}.skin-preview.stripe{background:repeating-linear-gradient(135deg,var(--skin-a) 0 12px,var(--skin-b) 12px 24px)}.skin-preview.dots{background-color:var(--skin-a);background-image:radial-gradient(var(--skin-b) 22%,transparent 24%);background-size:17px 17px}.skin-preview.royal,.skin-preview.neon{box-shadow:inset 0 0 22px #fff6,0 0 18px color-mix(in srgb,var(--skin-a) 38%,transparent)}.shop-item h3{margin:0;font-size:12px}.shop-item p{min-height:28px;margin:5px 0;color:#777e91;font-size:9px}.shop-item button{width:100%;height:34px;border:0;border-radius:8px;background:rgba(216,255,99,.13);color:var(--lime);font-size:8px;font-weight:700;cursor:pointer}.shop-item button.premium{background:linear-gradient(90deg,#6ea8fe,#b388ff);color:white}.shop-item button:disabled{cursor:default;opacity:.55}.friend-form{display:grid;grid-template-columns:1fr auto;gap:8px}.friend-form input{height:44px;padding:0 13px;border:1px solid var(--line);border-radius:9px;background:#090c1c;color:var(--ink);outline:0}.friend-form button{padding:0 17px;border:0;border-radius:9px;background:var(--lime);color:#111509;font-size:9px;font-weight:700}.friends-list{display:grid;gap:7px;margin-top:18px}.friend-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:10px}.friend-status{width:8px;height:8px;border-radius:50%;background:#62687b}.friend-status.online{background:var(--mint);box-shadow:0 0 10px var(--mint)}.friend-row span{font-size:11px}.friend-actions{display:flex;gap:5px}.friend-actions button{padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:rgba(255,255,255,.05);color:#bfc3d0;font-size:8px}.friend-empty{padding:35px;color:#747a8e;text-align:center;font-size:11px}

.wallet-display{display:flex;align-items:center;gap:10px;white-space:nowrap}.wallet-display strong:last-child{color:#7de8ff}.feature-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:2px 0 14px;padding:5px;border:1px solid var(--line);border-radius:12px;background:rgba(4,6,16,.45)}.feature-tabs button{height:36px;border:0;border-radius:8px;background:transparent;color:#777e91;font-size:9px;font-weight:700;letter-spacing:.08em;cursor:pointer}.feature-tabs button.active{background:rgba(216,255,99,.12);color:var(--lime)}.shop-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.shop-actions button{padding:0 5px}.shop-actions .diamond{border:1px solid rgba(125,232,255,.27);background:rgba(125,232,255,.1);color:#7de8ff}.collection-empty{grid-column:1/-1;padding:42px 14px;border:1px dashed var(--line);border-radius:14px;color:#777e91;text-align:center;font-size:11px}
.shop-promo-form{display:grid;grid-template-columns:1fr auto auto;gap:7px;margin:12px 0 0}.shop-promo-form[hidden]{display:none}.shop-promo-form input{height:39px;padding:0 12px;border:1px solid rgba(125,232,255,.22);border-radius:9px;outline:0;background:#090c1c;color:#fff;text-transform:uppercase}.shop-promo-form input:focus{border-color:#7de8ff}.shop-promo-form button{padding:0 14px;border:0;border-radius:9px;background:rgba(125,232,255,.13);color:#7de8ff;font-size:8px;font-weight:700;cursor:pointer}.shop-promo-form button:last-child{background:rgba(255,107,158,.1);color:#ff8cb5}.shop-promo-status{min-height:15px;margin:7px 2px!important;color:#7de8ff!important;font-size:9px!important}.sale-badge{display:inline-block;margin-left:6px;padding:3px 5px;border-radius:5px;background:#ff4f8b;color:#fff;font-size:7px;vertical-align:middle}.old-price{text-decoration:line-through;opacity:.55}

.season-dialog{width:min(900px,calc(100% - 28px));background:linear-gradient(145deg,rgba(13,13,32,.97),rgba(16,10,35,.97))}.season-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.season-heading h2{margin-bottom:4px}.season-heading p{margin:0;color:#858ba0;font-size:10px}.season-progress{margin:18px 0;padding:15px;border:1px solid rgba(85,230,220,.18);border-radius:14px;background:rgba(85,230,220,.045)}.season-progress>div:first-child{display:flex;justify-content:space-between;color:#8f95a8;font-size:9px;font-weight:700}.season-progress>div strong{color:var(--mint)}.season-progress-track{height:8px;margin:10px 0 8px;overflow:hidden;border-radius:99px;background:#080a17}.season-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--lime),var(--mint));box-shadow:0 0 16px rgba(85,230,220,.35);transition:width .35s ease}.season-progress small{color:#71778b;font-size:9px}.season-premium-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 17px;border:1px solid rgba(179,136,255,.35);border-radius:14px;background:linear-gradient(100deg,rgba(110,168,254,.1),rgba(179,136,255,.13))}.season-premium-banner div{display:grid;gap:4px}.season-premium-banner strong{color:#d8c5ff;font-size:11px;letter-spacing:.09em}.season-premium-banner span{color:#9298aa;font-size:10px}.season-premium-banner button{min-width:150px;height:38px;border:0;border-radius:9px;background:linear-gradient(90deg,#6ea8fe,#b388ff);color:#fff;font-size:9px;font-weight:700;cursor:pointer}.season-premium-banner button:disabled{cursor:default;opacity:.55}.season-track-labels{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:20px 0 7px;padding-left:58px;color:#858ba0;font-size:8px;font-weight:700;letter-spacing:.13em;text-align:center}.season-track-labels span:last-child{color:#cdb2ff}.season-tiers{display:grid;gap:7px}.season-tier{display:grid;grid-template-columns:50px 1fr 1fr;gap:8px}.season-tier-number{display:grid;place-items:center;border:1px solid var(--line);border-radius:11px;background:#090b1a;color:#fff;font-family:"Space Grotesk",sans-serif;font-size:15px}.season-tier-number small{display:block;color:#71778b;font-family:"DM Sans",sans-serif;font-size:7px}.season-reward{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;min-height:55px;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(5,7,18,.52)}.season-reward.premium{border-color:rgba(179,136,255,.2);background:rgba(179,136,255,.055)}.season-reward strong{display:block;font-size:10px}.season-reward small{color:#747b90;font-size:8px}.season-reward button{height:31px;padding:0 10px;border:0;border-radius:7px;background:rgba(216,255,99,.13);color:var(--lime);font-size:7px;font-weight:700;cursor:pointer}.season-reward.premium button{background:rgba(179,136,255,.16);color:#d8c5ff}.season-reward button:disabled{cursor:default;opacity:.48}.season-reward.claimed{border-color:rgba(85,230,220,.22)}.season-economy-note{margin-bottom:0!important;text-align:center}

.friend-actions .join-friend { border-color: rgba(85,230,220,.36); background: rgba(85,230,220,.1); color: var(--mint); }
.friend-actions .invite-private { border-color: rgba(179,136,255,.4); background: rgba(179,136,255,.1); color: #cdb2ff; }
.friend-actions button:disabled { cursor: default; opacity: .45; }
.friends-room-status { margin: 0 0 14px; padding: 11px 13px; border: 1px solid rgba(179,136,255,.28); border-radius: 10px; background: rgba(179,136,255,.08); color: #cdb2ff; font-size: 10px; line-height: 1.4; }

.death-screen { z-index: 25; background: rgba(6,8,18,.76); }
.death-card { width: min(520px, 100%); max-height:calc(100vh - 120px); overflow:auto; padding: 38px; border-radius: 23px; text-align: center; }
.death-card .overline { color: var(--pink); font-size: 9px; font-weight: 700; letter-spacing: .2em; }
.death-card h2 { margin-top: 11px; font-size: 39px; }
.death-detail { min-height: 18px; margin: 13px 0 -10px; color: var(--muted); font-size: 12px; }
.final-score { margin: 25px 0 17px; padding: 14px; border-block: 1px solid var(--line); }
.final-score span { display: block; color: var(--muted); font-size: 9px; letter-spacing: .14em; }
.final-score strong { color: var(--lime); font-family: "Space Grotesk", sans-serif; font-size: 31px; }
.battle-final-results{margin:0 0 17px;padding:13px;border:1px solid rgba(85,230,220,.2);border-radius:13px;background:rgba(5,7,18,.52);text-align:left}.battle-final-results>div{display:flex;justify-content:space-between;margin-bottom:9px;font-size:8px;letter-spacing:.1em}.battle-final-results>div strong{color:var(--mint)}.battle-final-results>div span{color:var(--muted)}.battle-final-results ol{display:grid;gap:3px;max-height:260px;margin:0;padding:0;overflow:auto;list-style:none}.battle-final-results li{display:grid;grid-template-columns:34px 18px minmax(0,1fr) auto;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;color:var(--muted);font-size:10px}.battle-final-results li:nth-child(-n+3){background:rgba(216,255,99,.055)}.battle-final-results li.self{background:rgba(85,230,220,.13);color:var(--ink)}.battle-final-results li>strong{color:var(--lime)}.battle-final-results li>small{font-size:8px}
.battle-victory-banner{display:flex;align-items:center;gap:12px;margin:16px 0;padding:13px 15px;border:1px solid rgba(255,206,86,.38);border-radius:13px;background:linear-gradient(100deg,rgba(255,206,86,.15),rgba(216,255,99,.08));text-align:left;box-shadow:0 0 32px rgba(255,206,86,.12)}.battle-victory-banner[hidden]{display:none}.battle-victory-banner>span{font-size:28px;color:#ffce56}.battle-victory-banner div{display:grid;gap:2px}.battle-victory-banner strong{color:#ffe08a;font-size:12px;letter-spacing:.08em}.battle-victory-banner small{color:#a69b7a;font-size:8px}
.rank-promotion{position:fixed;z-index:80;inset:50% auto auto 50%;display:grid;width:min(390px,calc(100% - 30px));place-items:center;padding:30px 25px;transform:translate(-50%,-50%);border:1px solid rgba(125,232,255,.48);border-radius:25px;background:radial-gradient(circle at 50% 10%,rgba(125,232,255,.24),transparent 48%),linear-gradient(145deg,rgba(7,12,29,.98),rgba(20,15,49,.98));box-shadow:0 30px 100px rgba(0,0,0,.55),0 0 70px rgba(125,232,255,.22);text-align:center;animation:rank-promotion-pop 3.8s both}.rank-promotion[hidden]{display:none}.rank-promotion-burst{display:grid;width:64px;height:64px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#7de8ff,#b388ff);color:#fff;font-size:30px;box-shadow:0 0 35px rgba(125,232,255,.5);animation:rank-promotion-pulse 1s ease-in-out infinite alternate}.rank-promotion small{margin-top:17px;color:#7de8ff;font-size:9px;font-weight:800;letter-spacing:.2em}.rank-promotion strong{margin-top:7px;color:#fff;font-family:"Space Grotesk",sans-serif;font-size:31px}.rank-promotion p{margin:5px 0 0;color:#a9b5c8;font-size:11px}@keyframes rank-promotion-pop{0%{opacity:0;transform:translate(-50%,-45%) scale(.72)}12%,82%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-55%) scale(.94)}}@keyframes rank-promotion-pulse{to{transform:scale(1.1) rotate(8deg)}}
#respawn-button { margin-top: 0; }
.secondary-button{width:100%;height:42px;margin-top:9px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.05);color:#b9bdcc;font-size:9px;font-weight:700;letter-spacing:.08em;cursor:pointer}

.touch-controls { display: none; position: fixed; z-index: 15; inset: auto 0 max(22px, env(safe-area-inset-bottom)); align-items: flex-end; justify-content: space-between; padding: 0 max(22px, env(safe-area-inset-left)); pointer-events: none; }
.touch-controls.visible { display: flex; }
.joystick { position: relative; width: 126px; height: 126px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; background: rgba(12,15,32,.35); box-shadow: inset 0 0 30px rgba(0,0,0,.22); pointer-events: auto; touch-action: none; }
.joystick::after { content: ""; position: absolute; inset: 24px; border: 1px dashed rgba(255,255,255,.1); border-radius: 50%; }
#joystick-knob { position: absolute; top: 50%; left: 50%; width: 52px; height: 52px; transform: translate(-50%,-50%); border-radius: 50%; background: rgba(216,255,99,.18); border: 1px solid rgba(216,255,99,.5); box-shadow: 0 0 25px rgba(216,255,99,.11); }
.boost-button { width: 85px; height: 85px; border: 1px solid rgba(255,206,86,.55); border-radius: 50%; background: rgba(255,206,86,.16); color: #ffce56; font-size: 22px; pointer-events: auto; touch-action: none; }
.boost-button small { display: block; margin-top: 1px; font-size: 8px; font-weight: 700; letter-spacing: .08em; }
.boost-button.active { background: rgba(255,206,86,.42); transform: scale(.94); }

@keyframes pulse { 50% { opacity: .35; } }
@media (pointer: coarse) { .touch-hint { display: flex; } .controls-hint > div:not(.touch-hint) { display: none; } }
@media (pointer: fine) { .touch-hint { display: none !important; } }
@media (max-width: 1230px) {
  .join-screen { display: block; padding-top: 92px; }
  .join-layout { gap: 18px; width: min(460px,100%); margin: 0 auto; }
  .world-card { position: static; width: 100%; transform: none; }
  .join-screen footer { display: none; }
}
@media (max-width: 680px) {
  .maintenance-screen:not(.updating) { top: 10px; align-items: flex-start; gap: 10px; padding: 11px 12px; border-radius: 14px; }
  .maintenance-screen:not(.updating) .maintenance-symbol { width: 37px; height: 37px; border-radius: 11px; }
  .maintenance-screen:not(.updating) .maintenance-symbol i { width: 5px; height: 5px; }
  .maintenance-screen:not(.updating) .maintenance-symbol i:nth-child(1) { transform: translateX(-9px); }
  .maintenance-screen:not(.updating) .maintenance-symbol i:nth-child(3) { transform: translateX(9px); }
  .maintenance-screen:not(.updating) .maintenance-copy strong { font-size: 13px; }
  .maintenance-screen:not(.updating) .maintenance-copy p { display: none; }
  .topbar { top: 10px; left: 10px; right: 10px; height: 50px; padding: 0 13px; }
  .brand { font-size: 12px; }.brand img { width: 27px; }
  .server-state, .account-button, #friends-button { display: none !important; }
  .leaderboard { top: 70px; right: 10px; width: 174px; padding: 12px; }
  .leaderboard li { grid-template-columns: 28px 1fr auto; min-height: 22px; font-size: 10px; }
  .score-card { left: 10px; bottom: 164px; min-width: 96px; padding: 9px 12px; }
  .score-card strong { font-size: 20px; }
  .join-screen { display: block; padding: 76px 12px 28px; }
  .join-layout { grid-template-columns: 1fr; gap: 12px; width: 100%; }
  .join-card { width: 100%; padding: 27px 23px 23px; border-radius: 21px; }
  .world-card { min-height: 420px; max-height: 520px; border-radius: 21px; }
  .top-actions{gap:5px}.gold-button{padding-inline:7px}.menu-button{padding-inline:7px}.shop-grid{grid-template-columns:1fr 1fr}.feature-dialog{padding:23px 17px}.season-heading{display:block}.season-heading .wallet-display{margin:10px 0}.season-premium-banner{align-items:stretch;flex-direction:column}.season-premium-banner button{width:100%}.season-tier{grid-template-columns:42px 1fr 1fr}.season-reward{grid-template-columns:1fr;padding:9px}.season-reward button{width:100%}.season-track-labels{padding-left:50px}
  .hero-mark { width: 63px; height: 63px; margin-top: 14px; }
  .intro { margin-bottom: 20px; }
  .join-screen footer { display: none; }
  .public-profile-dialog { width: min(100% - 16px,620px); max-height: calc(100dvh - 16px); padding: 25px 18px 20px; border-radius: 22px; }
  .public-profile-heading { gap: 13px; padding-right: 28px; }
  .public-profile-flag { width: 68px; height: 49px; border-radius: 13px; }
  .public-profile-heading h2 { font-size: clamp(25px,8vw,34px); }
  .public-profile-stats { gap: 8px; margin-top: 18px; }
  .public-profile-stats>div { min-height: 77px; padding: 13px; }
  .public-profile-stats strong { font-size: clamp(17px,5vw,21px); }
  .public-profile-skin { grid-template-columns: 150px minmax(0,1fr); gap: 14px; }
  .public-profile-skin .skin-preview { height: 88px; }
}
.ultra-epic-badge{display:inline-block;margin-left:6px;padding:3px 5px;border:1px solid #fff6;border-radius:5px;background:linear-gradient(90deg,#00d9ff,#974dff,#ff3fa4);color:#fff;font-size:7px;letter-spacing:.06em;box-shadow:0 0 10px #a15cff99;vertical-align:middle}.shop-item button.ultra-epic-action{background:linear-gradient(90deg,#00d9ff,#874dff,#ff3fa4);color:#fff;box-shadow:0 0 14px #854dff66}.event-skin-badge{display:inline-block;margin-left:6px;padding:3px 5px;border:1px solid #ffb65766;border-radius:5px;background:#ff7a001c;color:#ffc069;font-size:7px;letter-spacing:.05em;vertical-align:middle}.event-skin-badge.seasonal,.event-skin-badge.common{border-color:#62c8ff66;background:#62c8ff18;color:#9ee7ff}.event-skin-badge.rare{border-color:#a687ff88;background:linear-gradient(90deg,#2b174f,#8055ff44);color:#d8ccff;box-shadow:0 0 10px #8055ff55}
.legendary-badge{display:inline-block;margin-left:6px;padding:3px 6px;border:1px solid #8aff6988;border-radius:5px;background:linear-gradient(90deg,#07120e,#1d8f42,#00f5a0);color:#efffe9;font-size:7px;letter-spacing:.07em;box-shadow:0 0 12px #39ff1488;vertical-align:middle}.shop-item button.legendary-action{background:linear-gradient(100deg,#13291d,#35e957,#00b980);color:#fff;box-shadow:0 0 16px #39ff1466}.shop-item:has(.legendary-badge){border-color:#39ff1455;box-shadow:0 15px 35px #0ca83a1c}
.launch-epic-badge{display:inline-block;margin-left:6px;padding:3px 6px;border:1px solid #e8c3ff99;border-radius:5px;background:linear-gradient(90deg,#3a0b78,#7b2cff,#d99bff);color:#fff;font-size:7px;letter-spacing:.07em;box-shadow:0 0 13px #9c4dff99;vertical-align:middle}.shop-item:has(.launch-epic-badge){border-color:#b96cff66;box-shadow:0 15px 35px #7b2cff24}
@media(prefers-reduced-motion:reduce){.skin-preview.launch_epic{animation:none}}
@media (max-width:430px){.shop-grid{grid-template-columns:1fr}.shop-promo-form{grid-template-columns:1fr 1fr}.shop-promo-form input{grid-column:1/-1}.season-tier{grid-template-columns:1fr 1fr}.season-tier-number{grid-column:1/-1;min-height:34px;grid-auto-flow:column}.season-track-labels{padding-left:0}.season-reward{min-width:0}.season-reward strong{font-size:9px}.feature-heading{align-items:flex-start;flex-direction:column}.feature-heading .wallet-display{margin-bottom:10px}.public-profile-heading{align-items:flex-start}.public-profile-flag{width:58px;height:43px}.public-profile-country{border-radius:10px}.public-profile-stats{grid-template-columns:1fr}.public-profile-stats>div{min-height:68px}.public-profile-skin{grid-template-columns:1fr}.public-profile-skin .skin-preview{height:105px}.public-profile-skin-copy{padding:2px 3px 4px}}
@media (max-height: 800px) {
  .join-screen { padding-top: 80px; padding-bottom: 18px; }
  .hero-mark { width: 49px; height: 49px; margin: 8px auto 3px; }
  h1 { font-size: 36px; }
  .intro { margin: 10px auto 13px; }
  .controls-hint { margin-top: 13px; }
  .join-card { padding-block: 20px 16px; }
  .world-card { min-height: 470px; }
}

/* Interface 2026 — thème clair inspiré du tableau de bord, sans toucher au rendu Canvas en partie. */
.hero-visual { position: absolute; top: 105px; right: 42px; display: grid; width: 270px; justify-items: center; pointer-events: none; }
.hero-orbit { position: relative; display: grid; width: 250px; height: 250px; place-items: center; overflow: hidden; border: 1px solid rgba(31,157,217,.26); border-radius: 50%; background: radial-gradient(circle at 35% 30%,#fff 0 8%,transparent 9%),linear-gradient(145deg,#bcefff,#f0fbff 48%,#d7f2c1); box-shadow: 0 22px 55px rgba(30,132,184,.18),inset 0 0 0 13px rgba(255,255,255,.52); }
.hero-orbit::before,.hero-orbit::after { position: absolute; content:""; border-radius:50%; background:rgba(88,183,83,.2); filter:blur(1px); }
.hero-orbit::before { right:-22px; bottom:-18px; width:145px; height:82px; transform:rotate(-12deg); }
.hero-orbit::after { left:-25px; bottom:20px; width:110px; height:58px; transform:rotate(18deg); }
.hero-orbit img { position: relative; z-index: 2; width:154px; filter: drop-shadow(0 20px 18px rgba(7,73,104,.22)); transform:rotate(-8deg); }
.hero-ring { position:absolute; inset:20px; border:1px dashed rgba(23,145,204,.28); border-radius:50%; animation:hero-ring-spin 18s linear infinite; }
.hero-orb { position:absolute; z-index:3; width:12px; height:12px; border:3px solid rgba(255,255,255,.85); border-radius:50%; box-shadow:0 5px 14px rgba(21,92,126,.18); }
.hero-orb.orb-one { top:40px; right:43px; background:#b9e73f; }.hero-orb.orb-two { bottom:46px; left:31px; background:#42c8ff; }.hero-orb.orb-three { right:24px; bottom:72px; width:9px; height:9px; background:#ff91bf; }
.hero-visual>strong { margin-top:17px; color:#102342; font-family:"Space Grotesk",sans-serif; font-size:11px; letter-spacing:.13em; }.hero-visual>small { margin-top:4px; color:#6b7b90; font-size:9px; }
@keyframes hero-ring-spin { to { transform:rotate(1turn); } }

body:has(#join-screen.visible) { color-scheme:light; --ink:#10203d; --muted:#6f7b8e; --panel:rgba(255,253,247,.88); --line:rgba(16,32,61,.11); }
body:has(#join-screen.visible) .join-screen { padding-top:94px; background:radial-gradient(circle at 77% 24%,rgba(90,202,255,.27),transparent 24%),radial-gradient(circle at 12% 82%,rgba(185,231,63,.2),transparent 25%),linear-gradient(145deg,#fdfbf4,#f5fbff 58%,#f8f5e9); color:#10203d; }
body:has(#join-screen.visible) .join-screen::before { position:fixed; right:-8vw; bottom:-14vw; width:42vw; height:28vw; content:""; border-radius:50%; background:repeating-linear-gradient(165deg,rgba(65,190,232,.14) 0 5px,transparent 5px 18px); transform:rotate(-8deg); pointer-events:none; }
body:has(#join-screen.visible) .ambient { filter:blur(110px); opacity:.16; }.ambient-one{background:#58cef7}.ambient-two{background:#b9e73f}
body:has(#join-screen.visible) .topbar { background:rgba(255,253,247,.94); border-color:rgba(16,32,61,.09); box-shadow:0 15px 45px rgba(35,73,104,.1); color:#10203d; }
body:has(#join-screen.visible) .brand span span { color:#9ccc2f; }
body:has(#join-screen.visible) .server-state { color:#738095; } body:has(#join-screen.visible) .server-state strong{color:#10203d}
body:has(#join-screen.visible) .icon-button,body:has(#join-screen.visible) .account-button,body:has(#join-screen.visible) .gold-button { border-color:rgba(16,32,61,.1); background:#f7f5ee; color:#263957; }
body:has(#join-screen.visible) .account-button.connected { border-color:rgba(118,171,26,.25); background:#eef7dc; color:#5f8e12; }
body:has(#join-screen.visible) .join-layout { display:grid; width:min(1180px,calc(100vw - 44px)); grid-template-columns:minmax(0,1fr) 390px; gap:18px; align-items:stretch; }
body:has(#join-screen.visible) .join-card,body:has(#join-screen.visible) .world-card { border:1px solid rgba(16,32,61,.1); background:rgba(255,253,247,.91); box-shadow:0 25px 75px rgba(35,73,104,.12); backdrop-filter:blur(22px); }
body:has(#join-screen.visible) .join-card { width:100%; min-height:610px; padding:52px 335px 36px 48px; text-align:left; }
body:has(#join-screen.visible) .join-card::before { height:4px; background:linear-gradient(90deg,#28baf2,#9ed632 65%,transparent); }
body:has(#join-screen.visible) .eyebrow { justify-content:flex-start; color:#159edc; }.eyebrow i{background:#2ac3f5;box-shadow:0 0 12px #2ac3f5}
body:has(#join-screen.visible) .hero-mark { display:none; }
body:has(#join-screen.visible) h1 { margin-top:24px; color:#10203d; font-size:clamp(44px,5vw,66px); } body:has(#join-screen.visible) h1 em{color:#9dcc32}
body:has(#join-screen.visible) .intro { max-width:360px; margin:18px 0 26px; color:#66758a; }
body:has(#join-screen.visible) .account-strip { border-color:rgba(16,32,61,.1); background:#fff; box-shadow:0 8px 22px rgba(39,73,100,.055); }
body:has(#join-screen.visible) .account-strip span { color:#66758a; }.account-strip span.connected{color:#5f8e12}
body:has(#join-screen.visible) .account-strip button { background:#e7f7fd; color:#168bbb; }
body:has(#join-screen.visible) #join-form label { color:#53637a; }
body:has(#join-screen.visible) #player-name { border-color:rgba(16,32,61,.13); background:#fff; color:#10203d; box-shadow:inset 0 1px 2px rgba(18,37,58,.035); }
body:has(#join-screen.visible) #player-name:focus { border-color:#2bb9ed; box-shadow:0 0 0 4px rgba(43,185,237,.11); }
body:has(#join-screen.visible) #play-button { background:#102342; color:#fff; box-shadow:0 15px 30px rgba(16,35,66,.2); } body:has(#join-screen.visible) #play-button b{display:grid;width:31px;height:31px;place-items:center;border-radius:50%;background:#b9e73f;color:#102342}
body:has(#join-screen.visible) .battle-royale-play-button { border-color:#d9d0f4; background:linear-gradient(100deg,#f2edff,#f8f4ff); color:#553d89; }.battle-royale-play-button small{color:#80739b}.battle-royale-play-button b{color:#7254b5}
body:has(#join-screen.visible) .private-play-button { border-color:#cce8e4; background:#effaf8; color:#278c83; }
body:has(#join-screen.visible) .key { border-color:rgba(16,32,61,.12); background:#fff; color:#43536b; box-shadow:0 2px 0 rgba(16,32,61,.08); }
body:has(#join-screen.visible) .controls-hint small { color:#788499; }
body:has(#join-screen.visible) .world-card { position:static; width:100%; min-height:610px; max-height:610px; padding:28px 24px 20px; transform:none; }
body:has(#join-screen.visible) .world-heading { border-color:rgba(16,32,61,.1); }.world-heading>div span{color:#159edc}.world-heading strong{color:#10203d}.world-heading small{color:#7d899b}
body:has(#join-screen.visible) .leaderboard-tabs { background:#f0eee7; } body:has(#join-screen.visible) .leaderboard-tabs button{color:#66758a}.leaderboard-tabs button.active{background:#fff;color:#159edc;box-shadow:0 5px 15px rgba(30,80,110,.08)}
body:has(#join-screen.visible) .leaderboard-country-controls select,body:has(#join-screen.visible) .battle-leaderboard-controls select { border-color:rgba(16,32,61,.12); background:#fff; color:#243651; }
body:has(#join-screen.visible) .battle-leaderboard-controls button { border-color:rgba(16,32,61,.1); background:#fff; color:#263957; }
body:has(#join-screen.visible) #world-leaderboard-list li { color:#33445f; } body:has(#join-screen.visible) #world-leaderboard-list li:nth-child(odd){background:rgba(36,92,120,.035)}
body:has(#join-screen.visible) #world-leaderboard-list .world-score { color:#648f16; }.own-world-rank{border-color:rgba(137,188,43,.25);background:#f3f9e7;color:#608d12}
body:has(#join-screen.visible) .join-screen footer { color:#8792a1; }

:is(.auth-dialog,.feature-dialog,.public-profile-dialog) { color-scheme:light; --ink:#10203d; --muted:#6d798c; --line:rgba(16,32,61,.11); border:1px solid rgba(16,32,61,.11); background:radial-gradient(circle at 90% 5%,rgba(73,197,244,.12),transparent 25%),linear-gradient(150deg,#fffdf8,#f8f6ef); color:#10203d; box-shadow:0 35px 100px rgba(6,24,45,.28); }
:is(.auth-dialog,.feature-dialog,.public-profile-dialog)::backdrop { background:rgba(5,15,30,.66); backdrop-filter:blur(10px); }
:is(.auth-dialog,.feature-dialog,.public-profile-dialog) .dialog-close { border:1px solid rgba(16,32,61,.08); background:#eef1f3; color:#506077; }
:is(.auth-dialog,.feature-dialog,.public-profile-dialog) .auth-overline,:is(.auth-dialog,.feature-dialog,.public-profile-dialog) .public-profile-overline { color:#149edb; }
.auth-dialog h2,.feature-dialog h2,.public-profile-dialog h2 { color:#10203d; }
.auth-tabs,.feature-tabs { background:#efede6; }.auth-tabs button,.feature-tabs button{color:#66758a}.auth-tabs button.active,.feature-tabs button.active{background:#fff;color:#128fca;box-shadow:0 5px 14px rgba(33,72,105,.08)}
.auth-form label,.profile-country-form label,.profile-setting-label { color:#526078; }
.auth-form input,.friend-form input,.profile-country-form select,.shop-promo-form input { border-color:rgba(16,32,61,.13); background:#fff; color:#10203d; }
.auth-form>button,.auth-user-view>button,.auth-user-view .profile-country-form>button,.friend-form button { background:#102342; color:#fff; }
.auth-user-view p,.feature-dialog>p { color:#66758a; }
.profile-country-form,.profile-avatar-form { margin:16px 0; padding:15px; border:1px solid rgba(16,32,61,.1); border-radius:15px; background:rgba(255,255,255,.62); }
.profile-setting-label { display:block; margin-bottom:10px; font-size:8px; font-weight:800; letter-spacing:.14em; }
.profile-avatar-options { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.profile-avatar-options label { position:relative; display:grid; grid-template-columns:45px minmax(0,1fr); align-items:center; gap:10px; min-width:0; padding:10px; border:1px solid rgba(16,32,61,.1); border-radius:12px; background:#fff; cursor:pointer; }
.profile-avatar-options label:has(input:checked) { border-color:#2bb9ed; background:#eefaff; box-shadow:0 0 0 3px rgba(43,185,237,.09); }
.profile-avatar-options input { position:absolute; opacity:0; pointer-events:none; }
.profile-avatar-preview { display:grid; width:45px; height:45px; place-items:center; overflow:hidden; border:1px solid rgba(16,32,61,.12); border-radius:50%; background-color:#edf1f3; background-position:center; background-size:cover; font-size:20px; }
.profile-avatar-options strong { display:block; color:#10203d; font-size:9px; letter-spacing:.08em; }.profile-avatar-options small{display:block;margin-top:3px;color:#7a8799;font-size:8px}
.profile-avatar-form .auth-message { min-height:0; margin:9px 1px 0; }
.account-shortcuts button { background:#e9f7fb; color:#168bbb; }
.local-captcha { --altcha-color-base:#fff; --altcha-color-base-content:#10203d; --altcha-color-primary:#102342; --altcha-color-primary-content:#fff; --altcha-border-color:rgba(16,32,61,.14); }
.shop-item { border-color:rgba(16,32,61,.1); background:#fff; box-shadow:0 12px 28px rgba(36,70,96,.065); }.shop-item h3{color:#10203d}.shop-item p{color:#748094}.shop-item button{background:#edf5dd;color:#608d12}
.feature-tabs { border-color:rgba(16,32,61,.08); }.collection-empty{border-color:rgba(16,32,61,.15);color:#768296}
.season-dialog { background:radial-gradient(circle at 60% 5%,rgba(91,202,251,.18),transparent 34%),linear-gradient(160deg,#fffdf8,#f5fbff); }
.season-progress { border-color:#cde5e8; background:#effafa; }.season-progress-track{background:#dde5e5}.season-premium-banner{border-color:#d9cef4;background:#f3efff}.season-premium-banner span{color:#746c89}
.season-tier-number,.season-reward { border-color:rgba(16,32,61,.1); background:#fff; color:#10203d; }.season-reward.premium{border-color:#ddd1f5;background:#f8f5ff}.season-reward small{color:#788497}
.friend-row { border-color:rgba(16,32,61,.09); background:#fff; }.friend-row span{color:#263957}.friend-actions button{border-color:rgba(16,32,61,.1);background:#f4f3ee;color:#526078}
.public-profile-dialog { background:radial-gradient(circle at 8% 5%,rgba(73,197,244,.13),transparent 30%),linear-gradient(150deg,#fffdf8,#f7f8f2); }
.public-profile-flag { width:78px; height:78px; border-color:rgba(16,32,61,.12); border-radius:50%; background-color:#eef2f3; box-shadow:0 15px 32px rgba(29,69,99,.14); }
.profile-skin-avatar { background-position:center; background-size:cover; }
.public-profile-country { border-color:#c9e5e9; background:#edfafa; color:#287b83; }
.public-profile-stats>div { border-color:rgba(16,32,61,.09); background:#fff; box-shadow:0 10px 24px rgba(29,69,99,.05); }.public-profile-stats>div::after{background:rgba(163,205,52,.08)}
.public-profile-stats span,.public-profile-skin span{color:#768296}.public-profile-stats strong{color:#77a91e}
.public-profile-skin { border-color:#dce8c3; background:linear-gradient(110deg,#f4fae8,#edf9fb); }.public-profile-skin small{color:#758195}.public-profile-member{color:#7e8999}

@media (max-width:1050px) {
  body:has(#join-screen.visible) .join-layout { width:min(680px,calc(100vw - 28px)); grid-template-columns:1fr; }
  body:has(#join-screen.visible) .join-card { min-height:580px; }
  body:has(#join-screen.visible) .world-card { min-height:500px; max-height:600px; }
}
@media (max-width:720px) {
  body:has(#join-screen.visible) .join-screen { padding-top:74px; }
  body:has(#join-screen.visible) .join-card { min-height:0; padding:32px 24px 24px; text-align:center; }
  body:has(#join-screen.visible) .eyebrow { justify-content:center; }
  body:has(#join-screen.visible) h1 { margin-top:20px; font-size:clamp(39px,12vw,55px); }
  body:has(#join-screen.visible) .intro { margin-inline:auto; }
  .hero-visual { display:none; }
  .profile-avatar-options { grid-template-columns:1fr; }
}
@media (max-height:800px) and (min-width:721px) {
  body:has(#join-screen.visible) .join-screen { padding-top:80px; padding-bottom:18px; }
  body:has(#join-screen.visible) .join-card { min-height:540px; padding:34px 300px 22px 38px; }
  body:has(#join-screen.visible) h1 { margin-top:16px; font-size:clamp(42px,4.4vw,56px); }
  body:has(#join-screen.visible) .intro { margin:12px 0 17px; }
  body:has(#join-screen.visible) .controls-hint { margin-top:14px; }
  body:has(#join-screen.visible) .world-card { min-height:540px; max-height:540px; padding-top:22px; }
  .hero-visual { top:75px; right:34px; width:245px; }
  .hero-orbit { width:215px; height:215px; }.hero-orbit img{width:132px}.hero-visual>strong{margin-top:12px}
}

/* Direction artistique v2 — illustration, icônes et thèmes jour/nuit. */
.ui-icon-sprite { position:fixed; width:0; height:0; overflow:hidden; pointer-events:none; }
[hidden] { display:none!important; }
.ui-icon { display:block; width:1.15em; height:1.15em; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
button { transition:transform .16s ease,box-shadow .18s ease,background-color .22s ease,border-color .22s ease,color .22s ease; }
button:not(:disabled):hover { transform:translateY(-2px); }
button:not(:disabled):active { transform:translateY(0) scale(.97); }

/* Localized labels stay readable when Romance-language text is longer than English. */
.primary-button,.secondary-button,.auth-tab,.leaderboard-tab,.account-shortcuts button,.shop-item button,.site-language-switcher button{min-width:0;white-space:normal;overflow-wrap:anywhere;text-wrap:balance}
.dialog-card,.account-page,.shop-panel,.season-panel{min-width:0}
button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid color-mix(in srgb,#27baf2 34%,transparent); outline-offset:2px; }
.icon-button { display:grid; place-items:center; }
.icon-button .ui-icon { width:17px; height:17px; }
.theme-button { position:relative; overflow:hidden; }
.theme-button::after { position:absolute; inset:4px; content:""; border-radius:7px; background:linear-gradient(145deg,rgba(39,186,242,.12),rgba(185,231,63,.14)); opacity:0; transition:opacity .2s; }
.theme-button:hover::after { opacity:1; }
.theme-button .ui-icon { position:relative; z-index:1; }
.gold-button,.menu-button { display:flex; align-items:center; justify-content:center; gap:6px; }
.gold-button .ui-icon,.menu-button .ui-icon { width:14px; height:14px; }
#play-button b .ui-icon { width:17px; height:17px; fill:currentColor; stroke-width:1.4; }
.battle-royale-play-button b,.private-play-button b { display:grid; place-items:center; }
.battle-royale-play-button b .ui-icon,.private-play-button b .ui-icon { width:20px; height:20px; }
.boost-button { display:grid; place-items:center; align-content:center; }
.boost-button>.ui-icon { width:30px; height:30px; fill:currentColor; stroke-width:1.3; }
.join-screen footer { display:flex; align-items:center; gap:13px; }
.footer-legal-link{color:#8792a1;font-size:9px;font-weight:800;text-decoration:none}.footer-legal-link:hover{color:var(--mint)}.legal-consent a{color:#168fb8;font-weight:700}.legal-consent{line-height:1.45}
.purchase-consent{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px;margin:17px 0 4px;padding:13px 14px;border:1px solid rgba(125,232,255,.2);border-radius:12px;background:rgba(125,232,255,.055);color:#9aa4b6;font-size:10px;line-height:1.55;cursor:pointer}.purchase-consent input{width:17px;height:17px;margin:1px 0 0;accent-color:#55e6dc}.purchase-consent a{color:#7de8ff;font-weight:800}.purchase-consent:has(input:focus-visible){outline:2px solid #7de8ff;outline-offset:2px}.purchase-consent:has(input:checked){border-color:rgba(85,230,220,.42);background:rgba(85,230,220,.09);color:#dbe5ef}
#report-problem-button { display:flex; align-items:center; gap:6px; padding:7px 10px; border:1px solid rgba(16,32,61,.1); border-radius:8px; background:rgba(255,255,255,.6); color:#53637a; font-size:8px; font-weight:700; letter-spacing:.07em; cursor:pointer; }
#report-problem-button .ui-icon { width:13px; height:13px; }
.problem-dialog { width:min(650px,calc(100% - 28px)); }
.problem-form { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }
.problem-form label { display:block; margin:13px 2px 6px; color:#5c6b80; font-size:8px; font-weight:700; letter-spacing:.1em; }
.problem-form label small { color:#8a95a4; font-weight:500; letter-spacing:0; }
.problem-form select,.problem-form input,.problem-form textarea { width:100%; border:1px solid rgba(16,32,61,.12); border-radius:10px; outline:0; background:#fff; color:#10203d; }
.problem-form select,.problem-form input { height:43px; padding:0 12px; }
.problem-form textarea { min-height:125px; padding:12px; resize:vertical; font:inherit; line-height:1.45; }
.problem-form label[for="problem-message"],.problem-form #problem-message,.problem-form .payment-safety-note,.problem-form .local-captcha,.problem-form>button,.problem-form .auth-message { grid-column:1/-1; }
.problem-form>button { height:46px; border:0; border-radius:10px; background:#102342; color:#fff; font-size:9px; font-weight:700; letter-spacing:.08em; cursor:pointer; }
.payment-safety-note { display:grid; gap:3px; margin:13px 0; padding:11px 13px; border:1px solid rgba(63,177,184,.2); border-radius:10px; background:#effafa; }
.payment-safety-note strong { color:#287f86; font-size:8px; letter-spacing:.1em; }.payment-safety-note span{color:#68798d;font-size:9px;line-height:1.4}

html,body,.glass,.join-screen,.feature-dialog,.auth-dialog,.public-profile-dialog,.join-card,.world-card,.shop-item,.public-profile-stats>div { transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease; }

/* L’illustration générée remplace le petit pictogramme orbital. */
.hero-visual { position:absolute; z-index:0; inset:0 0 0 auto; display:block; width:57%; height:100%; margin:0; overflow:hidden; border-radius:0 24px 24px 0; pointer-events:none; }
.hero-visual::before { position:absolute; z-index:2; inset:0; content:""; background:linear-gradient(90deg,#fffdf7 0%,rgba(255,253,247,.96) 5%,rgba(255,253,247,.18) 35%,transparent 58%); }
.hero-visual::after { position:absolute; z-index:2; inset:auto 0 0; height:34%; content:""; background:linear-gradient(transparent,rgba(9,36,60,.22)); }
.hero-visual>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:62% center; transform:scale(1.015); filter:saturate(1.05) contrast(1.02); }
.hero-visual figcaption { position:absolute; z-index:3; right:22px; bottom:20px; display:grid; gap:2px; padding:10px 13px; border:1px solid rgba(255,255,255,.54); border-radius:12px; background:rgba(255,255,255,.73); box-shadow:0 12px 30px rgba(9,50,75,.15); backdrop-filter:blur(13px); text-align:left; }
.hero-visual figcaption strong { color:#102342; font-family:"Space Grotesk",sans-serif; font-size:9px; letter-spacing:.12em; }
.hero-visual figcaption small { color:#5f7184; font-size:8px; }
body:has(#join-screen.visible) .join-card>*:not(.hero-visual) { position:relative; z-index:3; }

/* Mode jour complet. */
html[data-theme="light"] { color-scheme:light; }
html[data-theme="light"] body { --ink:#10203d; --muted:#69788d; --panel:rgba(255,253,247,.9); --line:rgba(16,32,61,.11); background:#edf8fb; color:#10203d; }
html[data-theme="light"] .glass { box-shadow:0 22px 65px rgba(27,68,99,.13); }
html[data-theme="light"] .topbar { border-color:rgba(16,32,61,.09); background:rgba(255,253,247,.94); color:#10203d; }
html[data-theme="light"] .icon-button,html[data-theme="light"] .account-button,html[data-theme="light"] .menu-button { border-color:rgba(16,32,61,.1); background:#f7f5ee; color:#263957; }
html[data-theme="light"] .icon-button:hover,html[data-theme="light"] .menu-button:hover { border-color:rgba(32,164,219,.27); background:#eef9fd; color:#118fc8; box-shadow:0 9px 22px rgba(24,130,177,.11); }
html[data-theme="light"] .server-state { color:#718096; } html[data-theme="light"] .server-state strong{color:#10203d}
html[data-theme="light"] .leaderboard,html[data-theme="light"] .score-card { border-color:rgba(16,32,61,.1); background:rgba(255,253,247,.92); color:#10203d; }
html[data-theme="light"] .leaderboard li { color:#45546b; } html[data-theme="light"] .leaderboard li .points{color:#10203d}
html[data-theme="light"] .feature-dialog,html[data-theme="light"] .auth-dialog,html[data-theme="light"] .public-profile-dialog { color:#10203d; }

/* Mode nuit : mêmes composants, contraste nocturne et illustration adaptée. */
html[data-theme="dark"] { color-scheme:dark; }
html[data-theme="dark"] body,html[data-theme="dark"] body:has(#join-screen.visible) { --ink:#f5f7ff; --muted:#98a2b8; --panel:rgba(13,18,36,.88); --line:rgba(173,200,235,.13); background:#070b16; color:#f5f7ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .join-screen { background:radial-gradient(circle at 75% 20%,rgba(24,148,202,.2),transparent 28%),radial-gradient(circle at 8% 86%,rgba(142,190,38,.12),transparent 30%),linear-gradient(145deg,#080d1b,#0b1424 58%,#09121b); color:#f5f7ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .topbar,html[data-theme="dark"] .topbar { border-color:rgba(185,211,241,.11); background:rgba(11,17,32,.9); color:#f5f7ff; box-shadow:0 18px 55px rgba(0,0,0,.28); }
html[data-theme="dark"] body:has(#join-screen.visible) .brand,html[data-theme="dark"] .brand { color:#f5f7ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .server-state,html[data-theme="dark"] .server-state { color:#94a0b6; } html[data-theme="dark"] body:has(#join-screen.visible) .server-state strong,html[data-theme="dark"] .server-state strong{color:#fff}
html[data-theme="dark"] body:has(#join-screen.visible) .icon-button,html[data-theme="dark"] body:has(#join-screen.visible) .account-button,html[data-theme="dark"] body:has(#join-screen.visible) .gold-button,html[data-theme="dark"] .icon-button,html[data-theme="dark"] .account-button,html[data-theme="dark"] .menu-button { border-color:rgba(178,205,239,.14); background:rgba(255,255,255,.055); color:#dce8f8; }
html[data-theme="dark"] .icon-button:hover,html[data-theme="dark"] .menu-button:hover { border-color:rgba(67,197,245,.35); background:rgba(48,184,235,.11); color:#68d8ff; box-shadow:0 10px 26px rgba(0,164,226,.1); }
html[data-theme="dark"] body:has(#join-screen.visible) .join-card,html[data-theme="dark"] body:has(#join-screen.visible) .world-card { border-color:rgba(171,201,236,.12); background:rgba(11,17,33,.91); box-shadow:0 28px 85px rgba(0,0,0,.32); }
html[data-theme="dark"] body:has(#join-screen.visible) h1 { color:#f7f9ff; } html[data-theme="dark"] body:has(#join-screen.visible) h1 em{color:#b7e84a}
html[data-theme="dark"] body:has(#join-screen.visible) .intro { color:#9aa6ba; }
html[data-theme="dark"] .hero-visual::before { background:linear-gradient(90deg,#0b1121 0%,rgba(11,17,33,.97) 6%,rgba(11,17,33,.4) 35%,transparent 62%); }
html[data-theme="dark"] .hero-visual>img { filter:brightness(.68) saturate(1.12) contrast(1.08); }
html[data-theme="dark"] .hero-visual figcaption { border-color:rgba(157,207,238,.2); background:rgba(7,16,29,.7); }
html[data-theme="dark"] .hero-visual figcaption strong { color:#f5f8ff; } html[data-theme="dark"] .hero-visual figcaption small{color:#a9b7ca}
html[data-theme="dark"] body:has(#join-screen.visible) .account-strip { border-color:rgba(181,207,237,.12); background:rgba(255,255,255,.05); box-shadow:none; }
html[data-theme="dark"] body:has(#join-screen.visible) .account-strip span,html[data-theme="dark"] body:has(#join-screen.visible) #join-form label { color:#a8b3c6; }
html[data-theme="dark"] body:has(#join-screen.visible) .account-strip button { background:rgba(43,185,237,.12); color:#64d5ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .battle-royale-play-button { border-color:rgba(152,126,223,.28); background:linear-gradient(100deg,rgba(91,64,154,.2),rgba(49,38,93,.24)); color:#d9caff; }
html[data-theme="dark"] body:has(#join-screen.visible) .battle-royale-play-button small { color:#a79abb; }
html[data-theme="dark"] body:has(#join-screen.visible) .private-play-button { border-color:rgba(87,207,211,.23); background:rgba(39,166,171,.1); color:#85e5df; }
html[data-theme="dark"] body:has(#join-screen.visible) #player-name,html[data-theme="dark"] input,html[data-theme="dark"] select { border-color:rgba(176,204,237,.14); background:#0a1020; color:#f5f7ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .input-wrap span { color:#7e8ba1; }
html[data-theme="dark"] body:has(#join-screen.visible) .controls-hint { border-color:rgba(170,200,235,.12); background:rgba(255,255,255,.035); }
html[data-theme="dark"] body:has(#join-screen.visible) .key { border-color:rgba(184,211,241,.14); background:#111a2b; color:#cbd8ea; }
html[data-theme="dark"] body:has(#join-screen.visible) .world-heading,html[data-theme="dark"] body:has(#join-screen.visible) .world-card li { border-color:rgba(171,201,236,.1); }
html[data-theme="dark"] body:has(#join-screen.visible) .world-heading strong,html[data-theme="dark"] body:has(#join-screen.visible) .world-card li .name,html[data-theme="dark"] body:has(#join-screen.visible) .world-card li .score { color:#eef4ff; }
html[data-theme="dark"] body:has(#join-screen.visible) .leaderboard-tabs,html[data-theme="dark"] .auth-tabs,html[data-theme="dark"] .feature-tabs { border-color:rgba(170,200,235,.1); background:#080e1c; }
html[data-theme="dark"] body:has(#join-screen.visible) .leaderboard-tabs button,html[data-theme="dark"] .auth-tabs button,html[data-theme="dark"] .feature-tabs button { color:#8f9bb0; }
html[data-theme="dark"] body:has(#join-screen.visible) .leaderboard-tabs button.active,html[data-theme="dark"] .auth-tabs button.active,html[data-theme="dark"] .feature-tabs button.active { background:#142238; color:#68d8ff; box-shadow:none; }
html[data-theme="dark"] .feature-dialog,html[data-theme="dark"] .auth-dialog,html[data-theme="dark"] .public-profile-dialog,html[data-theme="dark"] .season-dialog { border-color:rgba(173,200,235,.13); background:radial-gradient(circle at 85% 0,rgba(34,162,213,.12),transparent 32%),linear-gradient(150deg,#0c1324,#0b101e); color:#f5f7ff; }
html[data-theme="dark"] .shop-item,html[data-theme="dark"] .friend-row,html[data-theme="dark"] .season-tier-number,html[data-theme="dark"] .season-reward,html[data-theme="dark"] .public-profile-stats>div { border-color:rgba(173,200,235,.12); background:#11192a; color:#eef4ff; box-shadow:0 12px 28px rgba(0,0,0,.16); }
html[data-theme="dark"] .shop-item h3,html[data-theme="dark"] .friend-row span,html[data-theme="dark"] .public-profile-skin-copy strong,html[data-theme="dark"] .profile-avatar-options strong { color:#f4f7ff; }
html[data-theme="dark"] .shop-item p,html[data-theme="dark"] .public-profile-member,html[data-theme="dark"] .public-profile-skin small { color:#8f9bb0; }
html[data-theme="dark"] .profile-avatar-options label { border-color:rgba(173,200,235,.12); background:#11192a; }
html[data-theme="dark"] .profile-avatar-options label:has(input:checked) { border-color:#42c8f4; background:#102536; }
html[data-theme="dark"] .public-profile-skin { border-color:rgba(111,205,219,.2); background:linear-gradient(110deg,#111d2b,#101b2d); }
html[data-theme="dark"] .public-profile-country { border-color:rgba(87,207,211,.2); background:rgba(39,166,171,.1); color:#76e3e5; }
html[data-theme="dark"] .dialog-close { border-color:rgba(180,207,238,.14); background:#121a2b; color:#dce5f3; }
html[data-theme="dark"] #report-problem-button { border-color:rgba(173,200,235,.13); background:rgba(255,255,255,.055); color:#aebbd0; }
html[data-theme="dark"] .problem-form label { color:#aab6c9; }
html[data-theme="dark"] .problem-form select,html[data-theme="dark"] .problem-form input,html[data-theme="dark"] .problem-form textarea { border-color:rgba(176,204,237,.14); background:#0a1020; color:#f5f7ff; }
html[data-theme="dark"] .payment-safety-note { border-color:rgba(87,207,211,.2); background:rgba(39,166,171,.08); }.payment-safety-note strong{color:#6bdde0}html[data-theme="dark"] .payment-safety-note span{color:#9ba9bc}

/* Contrastes renforcés et cohérents dans chaque fenêtre. */
.theme-sync-note{margin:4px 2px 14px!important;font-size:9px!important;line-height:1.45}
html[data-theme="light"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog){color-scheme:light;--ink:#10233f;--muted:#53647a;--line:rgba(16,35,63,.16);border-color:#cfd9e3;background:radial-gradient(circle at 92% 3%,rgba(58,190,241,.14),transparent 27%),linear-gradient(150deg,#fffefa,#f7f7f1);color:#10233f;box-shadow:0 34px 95px rgba(9,32,55,.25)}
html[data-theme="light"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(h2,h3,strong){color:#10233f}
html[data-theme="light"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(p,small){color:#526379}
html[data-theme="light"] :is(.auth-tabs,.feature-tabs,.leaderboard-tabs){border-color:#d6dde4;background:#ecebe5}
html[data-theme="light"] :is(.auth-tabs,.feature-tabs,.leaderboard-tabs) button{color:#4d6078}
html[data-theme="light"] :is(.auth-tabs,.feature-tabs,.leaderboard-tabs) button.active{background:#fff;color:#057caf;box-shadow:0 5px 15px rgba(21,74,105,.12)}
html[data-theme="light"] :is(input,select,textarea){border-color:#c8d3df;background:#fff;color:#132843}
html[data-theme="light"] :is(input,textarea)::placeholder{color:#718096;opacity:1}
html[data-theme="light"] :is(input,select,textarea):focus{border-color:#129fd6;box-shadow:0 0 0 3px rgba(18,159,214,.12)}
html[data-theme="light"] .password-toggle{border-color:#c4dfe8;background:#e9f7fb;color:#08799f}
html[data-theme="light"] .dialog-close{border-color:#cbd5df;background:#edf1f4;color:#344a63}
html[data-theme="light"] .dialog-close:hover{border-color:#8fbcd0;background:#e6f6fb;color:#087ea9}
html[data-theme="light"] .shop-item{border-color:#ccd7e1;background:#fff;box-shadow:0 12px 28px rgba(26,62,91,.09)}
html[data-theme="light"] .shop-item h3{color:#122842}
html[data-theme="light"] .shop-item p{color:#52647b}
html[data-theme="light"] .shop-item button{border:1px solid #cfe0b2;background:#eaf4d7;color:#456f0a}
html[data-theme="light"] .shop-item button.premium{border-color:#c7cdf2;background:linear-gradient(90deg,#a8c8ff,#c5a9f4);color:#202e5a}
html[data-theme="light"] .shop-actions .diamond{border-color:#b8dce6;background:#e0f5fa;color:#176c82}
html[data-theme="light"] .shop-item button.legendary-action{border-color:#74d88a;background:linear-gradient(100deg,#c9f1d1,#65d68b);color:#174f2c}
html[data-theme="light"] .shop-item button:disabled{border-color:#d4dce3;background:#edf1f4;color:#66758a;opacity:1}
html[data-theme="light"] .shop-item button.premium:disabled{border-color:#d0d3e9;background:#e8e8f5;color:#5c6284}
html[data-theme="light"] .shop-actions .diamond:disabled{border-color:#c9dfe5;background:#e9f5f7;color:#477987}
html[data-theme="light"] .shop-item button.legendary-action:disabled{border-color:#b8dfc1;background:#e2f4e6;color:#346b43}
html[data-theme="light"] .wallet-display strong:first-child{color:#a66b00}
html[data-theme="light"] .wallet-display strong:last-child{color:#087c9a}
html[data-theme="light"] .shop-promo-form button{border:1px solid #b7dbe8;background:#e2f5fb;color:#08739d}
html[data-theme="light"] .shop-promo-status{color:#176b84!important}
html[data-theme="light"] .purchase-consent{border-color:#bfd8df;background:#eef9fa;color:#405a6c}html[data-theme="light"] .purchase-consent a{color:#087da6}html[data-theme="light"] .purchase-consent:has(input:checked){border-color:#66bcbc;background:#e5f6f2;color:#173f45}

/* Confirmation d'achat, protection des mineurs et affichage responsive. */
.purchase-status{margin:12px 0;padding:11px 13px;border:1px solid rgba(255,107,158,.32);border-radius:12px;background:rgba(255,107,158,.08);color:#ffd7e5;font-size:10px;line-height:1.5}.purchase-confirmation-dialog{width:min(540px,calc(100vw - 28px));max-height:min(760px,calc(100dvh - 28px));padding:30px;overflow:auto}.purchase-confirmation-dialog h2{margin:8px 44px 18px 0;font-size:clamp(25px,5vw,36px)}.purchase-summary{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:15px;padding:13px;border:1px solid rgba(125,232,255,.18);border-radius:17px;background:rgba(255,255,255,.035)}.purchase-confirmation-preview{height:82px;border-radius:13px;background:linear-gradient(135deg,#55e6dc,#d8ff63);background-position:center;background-size:cover;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}.purchase-summary small,.purchase-summary strong,.purchase-summary span{display:block}.purchase-summary small{color:#8f9bad;font-size:8px;font-weight:800;letter-spacing:.11em}.purchase-summary strong{margin-top:5px;font:700 16px "Space Grotesk",sans-serif}.purchase-summary span{margin-top:5px;color:#d8ff63;font-weight:800}.purchase-confirmation-text{margin:17px 0 12px;color:#c6cfdd;font-size:11px;line-height:1.65}.purchase-first-consent[hidden]{display:none}.purchase-terms-link{margin:10px 0 16px;font-size:10px}.purchase-terms-link a{color:#7de8ff;font-weight:800}.purchase-eligibility-message{margin:15px 0;padding:13px;border:1px solid rgba(255,107,158,.35);border-radius:12px;background:rgba(255,107,158,.09);color:#ffd5e3;font-size:11px;line-height:1.5}.purchase-confirmation-actions{display:grid;grid-template-columns:.75fr 1.25fr;gap:9px}.purchase-confirmation-actions button{min-height:46px}.purchase-confirmation-actions button:first-child{border:1px solid rgba(255,255,255,.14);background:transparent;color:#c5cfdd}.purchase-confirmation-actions button:last-child{background:linear-gradient(90deg,#d8ff63,#55e6dc);color:#07101c}.purchase-confirmation-actions button:disabled{filter:grayscale(.6);opacity:.48}
html[data-theme="light"] .purchase-status{border-color:#e5aabd;background:#fff1f5;color:#743047}html[data-theme="light"] .purchase-summary{border-color:#cedfe5;background:#f7fbfb}html[data-theme="light"] .purchase-summary small{color:#50687a}html[data-theme="light"] .purchase-summary span{color:#5d890d}html[data-theme="light"] .purchase-confirmation-text{color:#344f62}html[data-theme="light"] .purchase-terms-link a{color:#087da6}html[data-theme="light"] .purchase-eligibility-message{border-color:#e5aabd;background:#fff1f5;color:#743047}html[data-theme="light"] .purchase-confirmation-actions button:first-child{border-color:#ccd9df;color:#294457}
@media(max-width:560px){.purchase-confirmation-dialog{width:calc(100vw - 14px);max-height:calc(100dvh - 14px);padding:22px 17px;border-radius:22px}.purchase-summary{grid-template-columns:74px minmax(0,1fr)}.purchase-confirmation-preview{height:70px}.purchase-confirmation-actions{grid-template-columns:1fr}.purchase-confirmation-actions button:first-child{order:2}.purchase-confirmation-text,.purchase-eligibility-message{font-size:10px}.purchase-consent{font-size:9px}}
@media(max-height:540px) and (orientation:landscape){.purchase-confirmation-dialog{width:min(720px,calc(100vw - 16px));max-height:calc(100dvh - 12px);padding:17px 22px}.purchase-confirmation-dialog h2{margin-block:4px 10px;font-size:23px}.purchase-summary{grid-template-columns:62px minmax(0,1fr);padding:9px}.purchase-confirmation-preview{height:52px}.purchase-confirmation-text{margin:10px 0 7px;line-height:1.45}.purchase-consent{margin:8px 0;padding:9px}.purchase-confirmation-actions{grid-template-columns:.7fr 1.3fr}.purchase-confirmation-actions button:first-child{order:0}}
html[data-theme="light"] :is(.profile-country-form,.profile-avatar-form,.season-progress){border-color:#cbd9e2;background:rgba(255,255,255,.82)}
html[data-theme="light"] .profile-setting-label,html[data-theme="light"] :is(.auth-form,.profile-country-form,.problem-form) label{color:#40536b}
html[data-theme="light"] .profile-avatar-options label{border-color:#cdd8e1;background:#fff}
html[data-theme="light"] .profile-avatar-options label:has(input:checked){border-color:#1b9fcf;background:#e9f8fd}
html[data-theme="light"] .theme-sync-note{color:#4d6d79!important}
html[data-theme="light"] :is(.friend-row,.season-tier-number,.season-reward,.public-profile-stats>div){border-color:#ccd7e0;background:#fff;color:#142942}
html[data-theme="light"] .friend-actions button{border-color:#cbd5df;background:#eef1f3;color:#3f5269}
html[data-theme="light"] .season-premium-banner strong{color:#543a8b}
html[data-theme="light"] .season-reward button{background:#e6f2cf;color:#436e08}
html[data-theme="light"] .season-reward.premium button{background:#e9e1fa;color:#614597}
html[data-theme="light"] .public-profile-stats span,html[data-theme="light"] .public-profile-skin span{color:#52647a}
html[data-theme="light"] .public-profile-stats strong{color:#5d8b0b}
html[data-theme="light"] .payment-safety-note{border-color:#b9dfe2;background:#e9f8f8}html[data-theme="light"] .payment-safety-note strong{color:#176d75}html[data-theme="light"] .payment-safety-note span{color:#52667a}

html[data-theme="dark"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog){color-scheme:dark;--ink:#f4f8ff;--muted:#aab6c8;--line:rgba(180,207,239,.18);border-color:rgba(180,207,239,.18);background:radial-gradient(circle at 88% 0,rgba(34,171,220,.15),transparent 32%),linear-gradient(150deg,#0d1628,#090f1d);color:#f4f8ff}
html[data-theme="dark"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(h2,h3,strong){color:#f5f8ff}
html[data-theme="dark"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(p,small){color:#a9b5c7}
html[data-theme="dark"] :is(input,select,textarea){border-color:rgba(180,207,239,.22);background:#080f1e;color:#f3f7ff}
html[data-theme="dark"] :is(input,textarea)::placeholder{color:#7f8da3;opacity:1}
html[data-theme="dark"] :is(input,select,textarea):focus{border-color:#42c8f4;box-shadow:0 0 0 3px rgba(66,200,244,.12)}
html[data-theme="dark"] .password-toggle{border-color:rgba(80,201,235,.25);background:rgba(54,183,220,.12);color:#82ddf7}
html[data-theme="dark"] .shop-item{border-color:rgba(181,208,239,.16);background:#111b2d}
html[data-theme="dark"] .shop-item p{color:#aab5c7}
html[data-theme="dark"] .shop-item button{border:1px solid rgba(185,231,63,.22);background:rgba(185,231,63,.14);color:#d9ff76}
html[data-theme="dark"] .shop-item button.premium{border-color:rgba(173,159,255,.28);background:linear-gradient(90deg,#4c6fae,#7357a8);color:#fff}
html[data-theme="dark"] .shop-actions .diamond{border-color:rgba(93,207,235,.3);background:rgba(62,183,215,.15);color:#8beaff}
html[data-theme="dark"] .shop-item button:disabled{border-color:rgba(181,208,239,.12);background:#182235;color:#8997aa;opacity:1}
html[data-theme="dark"] .shop-item button.premium:disabled{background:#252642;color:#aeb4dc}
html[data-theme="dark"] .shop-actions .diamond:disabled{background:#132a35;color:#78aeb9}
html[data-theme="dark"] .wallet-display strong:first-child{color:#ffd15b}
html[data-theme="dark"] .wallet-display strong:last-child{color:#7de8ff}
html[data-theme="dark"] .shop-promo-form button{border:1px solid rgba(80,201,235,.27);background:rgba(54,183,220,.14);color:#82ddf7}
html[data-theme="dark"] :is(.profile-country-form,.profile-avatar-form){border-color:rgba(180,207,239,.16);background:rgba(255,255,255,.035)}
html[data-theme="dark"] .profile-setting-label,html[data-theme="dark"] :is(.auth-form,.profile-country-form,.problem-form) label{color:#b6c2d3}
html[data-theme="dark"] .theme-sync-note{color:#9db0bd!important}
html[data-theme="dark"] :is(.friend-row,.season-tier-number,.season-reward,.public-profile-stats>div){border-color:rgba(180,207,239,.16);background:#111b2d;color:#f2f6ff}
html[data-theme="dark"] .friend-actions button{border-color:rgba(180,207,239,.17);background:#182337;color:#c0ccdc}
html[data-theme="dark"] .season-premium-banner strong{color:#d9c9ff}
html[data-theme="dark"] .season-reward button{color:#d9ff76}
html[data-theme="dark"] .public-profile-stats span,html[data-theme="dark"] .public-profile-skin span{color:#aab5c7}
html[data-theme="dark"] .payment-safety-note strong{color:#78e3e6}html[data-theme="dark"] .payment-safety-note span{color:#aab6c8}

@media (max-width:720px) {
  body:has(#join-screen.visible) .hero-visual { position:relative; inset:auto; display:block; width:calc(100% + 48px); height:230px; margin:20px -24px 18px; border-radius:0; }
  .hero-visual::before { background:linear-gradient(180deg,#fffdf7 0%,transparent 20%,transparent 72%,#fffdf7 100%); }
  html[data-theme="dark"] .hero-visual::before { background:linear-gradient(180deg,#0b1121 0%,transparent 23%,transparent 70%,#0b1121 100%); }
  .hero-visual>img { object-position:63% center; }
  .hero-visual figcaption { right:15px; bottom:17px; }
  body:has(#join-screen.visible) .account-strip { margin-top:0; }
  .top-actions { gap:5px; }
  .theme-button { display:grid!important; }
  body:has(#join-screen.visible) .join-screen footer { position:relative; bottom:auto; display:flex; flex-direction:column; margin:17px auto 0; padding-bottom:8px; }
  .problem-form { grid-template-columns:1fr; }
  .problem-form>* { grid-column:1!important; }
}

@media (max-height:800px) and (min-width:721px) {
  .hero-visual { top:0; right:0; width:57%; height:100%; }
  .hero-visual>img { width:100%; }
  .hero-visual figcaption { bottom:14px; }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}

/* Contenu public indexable et guide des règles. Le gameplay conserve son canvas isolé. */
body:has(#join-screen.visible) .join-screen{align-content:start;justify-items:center}
body:has(#join-screen.visible) .seo-game-title{max-width:390px;margin:18px 0 0;color:#168dbb!important;font-family:"DM Sans",sans-serif;font-size:12px!important;font-weight:700;line-height:1.35;letter-spacing:.04em!important}
.hero-slogan{margin:9px 0 0;font-family:"Space Grotesk",sans-serif;font-size:clamp(44px,5vw,66px);line-height:.99;letter-spacing:-.045em}
.hero-slogan em{color:#9dcc32;font-style:normal}
.seo-quick-nav{position:relative;z-index:2;display:flex;width:min(1180px,calc(100vw - 44px));justify-content:center;flex-wrap:wrap;gap:8px;margin:24px auto 0;padding:10px;border:1px solid rgba(16,32,61,.09);border-radius:15px;background:rgba(255,253,247,.82);box-shadow:0 14px 38px rgba(35,73,104,.08);backdrop-filter:blur(14px)}
.seo-quick-nav a{padding:8px 12px;border-radius:9px;color:#41546e;font-size:10px;font-weight:700;letter-spacing:.04em;text-decoration:none}
.seo-quick-nav a:hover{background:#e8f7fd;color:#087da9}
.seo-home{position:relative;z-index:2;width:min(1180px,calc(100vw - 44px));margin:14px auto 24px;padding:clamp(26px,4vw,48px);border:1px solid rgba(16,32,61,.09);border-radius:25px;background:rgba(255,253,247,.92);box-shadow:0 25px 75px rgba(35,73,104,.11);color:#283d58;text-align:left}
.seo-home>header{max-width:850px;margin:0 auto 34px;text-align:center}
.seo-language-summary{max-width:920px;margin:-18px auto 27px!important;padding:13px 17px;border-radius:12px;background:rgba(24,158,210,.07);text-align:center}.seo-language-summary strong{color:#167ea7}
.seo-home>header>span{color:#129ed7;font-size:9px;font-weight:800;letter-spacing:.17em}
.seo-home h2{margin:11px auto 16px;color:#10203d;font-size:clamp(29px,4vw,47px);line-height:1.04}
.seo-home h3{margin:0 0 11px;color:#102842;font-family:"Space Grotesk",sans-serif;font-size:18px;letter-spacing:-.025em}
.seo-home p{margin:0 0 14px;color:#586a7e;font-size:14px;line-height:1.72;user-select:text;-webkit-user-select:text}
.seo-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.seo-home-grid section{padding:25px;border:1px solid rgba(16,32,61,.09);border-radius:18px;background:#fff}
.seo-home-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:28px;color:#66758a;font-size:11px}
.seo-home-actions a{color:#087fae;font-weight:700;text-underline-offset:3px}
.seo-home-actions .seo-play-link{padding:12px 18px;border-radius:11px;background:#102342;color:#fff;text-decoration:none;box-shadow:0 10px 25px rgba(16,35,66,.16)}
.site-menu-dialog{position:fixed;inset:0 0 0 auto;width:min(760px,100vw);height:100dvh;max-width:none;max-height:none;margin:0;padding:28px;overflow:auto;border:0;border-left:1px solid rgba(16,32,61,.13);border-radius:26px 0 0 26px;background:radial-gradient(circle at 90% 2%,rgba(67,196,244,.15),transparent 27%),linear-gradient(150deg,#fffefa,#f3f7f3);color:#10203d;box-shadow:-28px 0 85px rgba(5,22,43,.25)}
.site-menu-dialog[open]{animation:site-menu-enter .24s cubic-bezier(.2,.75,.25,1)}
.site-menu-dialog::backdrop{background:rgba(5,15,30,.62);backdrop-filter:blur(8px)}
@keyframes site-menu-enter{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:translateX(0)}}
.site-menu-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:2px 48px 18px 2px;border-bottom:1px solid rgba(16,32,61,.1)}
.site-menu-heading>div{display:grid;gap:5px}.site-menu-heading span{color:#109bda;font-size:9px;font-weight:800;letter-spacing:.17em}.site-menu-heading strong{color:#10203d;font-family:"Space Grotesk",sans-serif;font-size:clamp(26px,4vw,38px);letter-spacing:-.04em}
.site-language-switcher{display:flex;align-items:center;gap:7px;margin:17px 0;padding:10px;border:1px solid rgba(16,32,61,.09);border-radius:13px;background:rgba(255,255,255,.62)}
.site-language-switcher>span{margin:0 auto 0 4px;color:#596b80;font-size:9px;font-weight:800;letter-spacing:.13em}
.site-language-switcher button{min-width:45px;height:34px;border:1px solid rgba(16,32,61,.1);border-radius:9px;background:#fff;color:#3b506b;font-size:10px;font-weight:800;cursor:pointer;transition:.16s ease}
.site-language-switcher button:hover{border-color:#77bdd8;background:#eef9fd;color:#087fae}.site-language-switcher button.active{border-color:#9dcc32;background:#eafaad;color:#17364b;box-shadow:0 7px 18px rgba(129,166,42,.17)}
.site-menu-dialog .seo-quick-nav{width:100%;margin:0;padding:10px;background:rgba(255,255,255,.68);box-shadow:none}
.site-menu-dialog .seo-home{width:100%;margin:14px 0 0;padding:28px;border-radius:19px;background:rgba(255,255,255,.72);box-shadow:none}
.site-menu-dialog .seo-home>header{margin-bottom:24px;text-align:left}.site-menu-dialog .seo-home h2{font-size:clamp(27px,4vw,40px)}
.site-menu-dialog .seo-home-grid{grid-template-columns:1fr;gap:12px}.site-menu-dialog .seo-home-grid section{padding:21px}.site-menu-dialog .seo-home-actions{justify-content:flex-start}
body:has(#join-screen.visible) .join-screen footer{position:relative;z-index:2;bottom:auto;justify-content:center;flex-wrap:wrap;width:min(1180px,calc(100vw - 44px));margin:0 auto;padding:6px 0 22px}
.rules-dialog{width:min(820px,calc(100vw - 28px))}
.rules-dialog h2{margin-bottom:23px}
.rules-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.rules-grid section{padding:17px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.035)}
.rules-grid strong{color:var(--lime);font-family:"Space Grotesk",sans-serif;font-size:12px;letter-spacing:.04em}
.rules-grid p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.55}
.rules-guide-link{display:block;margin-top:18px;padding:13px 17px;border-radius:11px;background:var(--lime);color:#14200b;font-size:10px;font-weight:800;letter-spacing:.08em;text-align:center;text-decoration:none}
html[data-theme="dark"] .seo-quick-nav,html[data-theme="dark"] .seo-home{border-color:rgba(171,201,236,.12);background:rgba(11,17,33,.94);box-shadow:0 28px 85px rgba(0,0,0,.3)}
html[data-theme="dark"] .seo-quick-nav a{color:#aebbd0}html[data-theme="dark"] .seo-quick-nav a:hover{background:#142238;color:#68d8ff}
html[data-theme="dark"] .seo-home h2,html[data-theme="dark"] .seo-home h3{color:#f4f8ff}
html[data-theme="dark"] .seo-home p{color:#a9b5c7}
html[data-theme="dark"] .seo-home-grid section{border-color:rgba(171,201,236,.11);background:#111a2b}
html[data-theme="dark"] .seo-home-actions{color:#9ba8bc}html[data-theme="dark"] .seo-home-actions a{color:#69d7fb}
html[data-theme="dark"] .seo-home-actions .seo-play-link{background:#b9e73f;color:#102342}
html[data-theme="dark"] .site-menu-dialog{border-color:rgba(171,201,236,.14);background:radial-gradient(circle at 88% 0,rgba(34,171,220,.15),transparent 32%),linear-gradient(150deg,#0d1628,#090f1d);color:#f4f8ff;box-shadow:-30px 0 90px rgba(0,0,0,.45)}
html[data-theme="dark"] .site-menu-heading{border-color:rgba(171,201,236,.14)}html[data-theme="dark"] .site-menu-heading strong{color:#f5f8ff}
html[data-theme="dark"] .site-language-switcher{border-color:rgba(171,201,236,.13);background:rgba(255,255,255,.035)}html[data-theme="dark"] .site-language-switcher>span{color:#aab6c8}
html[data-theme="dark"] .site-language-switcher button{border-color:rgba(171,201,236,.15);background:#111b2d;color:#c6d1e1}html[data-theme="dark"] .site-language-switcher button:hover{background:#15283a;color:#68d8ff}html[data-theme="dark"] .site-language-switcher button.active{border-color:#b9e73f;background:#25351e;color:#e5ff9a}
html[data-theme="dark"] .site-menu-dialog .seo-quick-nav,html[data-theme="dark"] .site-menu-dialog .seo-home{background:rgba(11,17,33,.72)}
html[data-theme="light"] .rules-grid section{border-color:#ccd8e1;background:#fff}html[data-theme="light"] .rules-grid strong{color:#176d75}html[data-theme="light"] .rules-grid p{color:#52647a}

/* Garde-fous de contraste : aucun texte secondaire clair sur fond clair, ni sombre sur fond sombre. */
html[data-theme="light"] body:has(#join-screen.visible) :is(.intro,.server-state,.controls-hint small,.world-heading small,.footer-legal-link,.seo-home-actions){color:#4d6078}
html[data-theme="light"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(.auth-message,.captcha-mode,.password-match-hint,small,p){color:#4d6078}
html[data-theme="light"] .password-match-hint.success{color:#327548}html[data-theme="light"] .password-match-hint.error{color:#b52155}
html[data-theme="dark"] body:has(#join-screen.visible) :is(.intro,.server-state,.controls-hint small,.world-heading small,.footer-legal-link,.seo-home-actions){color:#b0bbcc}
html[data-theme="dark"] :is(.auth-dialog,.feature-dialog,.public-profile-dialog,.season-dialog) :is(.auth-message,.captcha-mode,.password-match-hint,small,p){color:#b0bbcc}

/* Badges publics et vitrine du compte. */
.account-badges-card{margin-top:14px;padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(5,8,20,.32)}.account-badges-card form{margin-top:15px}.account-badges-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.player-badge{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:11px;min-height:84px;padding:12px;border:1px solid color-mix(in srgb,var(--badge-color) 34%,var(--line));border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--badge-color) 11%,transparent),rgba(255,255,255,.02));overflow:hidden}.player-badge>input{position:absolute;top:9px;right:9px;width:18px;height:18px;accent-color:var(--badge-color)}.player-badge:has(input:checked){border-color:var(--badge-color);box-shadow:0 0 0 1px color-mix(in srgb,var(--badge-color) 25%,transparent),0 12px 28px color-mix(in srgb,var(--badge-color) 12%,transparent)}.player-badge-icon{display:grid;width:50px;height:50px;place-items:center;border-radius:15px;background:color-mix(in srgb,var(--badge-color) 18%,transparent);color:var(--badge-color);font:700 14px "Space Grotesk",sans-serif;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--badge-color) 30%,transparent),0 0 20px color-mix(in srgb,var(--badge-color) 18%,transparent)}.player-badge strong{display:block;padding-right:16px;font-size:10px;line-height:1.2}.player-badge small{display:block;margin-top:4px;color:var(--badge-color)!important;font-size:7px;text-transform:capitalize}.player-badge p{display:-webkit-box;margin:4px 0 0;color:var(--muted);font-size:7px;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.account-badges-card form>button{min-height:42px;margin-top:11px}.badge-empty{grid-column:1/-1;margin:0;padding:28px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:10px;text-align:center}.public-profile-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:18px}.public-profile-badges[hidden]{display:none}.public-profile-badges .player-badge{grid-template-columns:40px minmax(0,1fr);min-height:70px;padding:9px}.public-profile-badges .player-badge-icon{width:38px;height:38px;border-radius:12px;font-size:10px}.public-profile-badges .player-badge strong{padding:0;font-size:8px}.public-profile-badges .player-badge p{display:none}

/* Boutique in-game : promotions, vedette et catalogue plus lisible. */
.shop-dialog{width:min(880px,calc(100% - 28px))}.shop-promotion-strip{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:12px;margin:12px 0;padding:12px 14px;border:1px solid rgba(255,166,76,.35);border-radius:14px;background:linear-gradient(100deg,rgba(255,122,62,.13),rgba(255,205,71,.08))}.shop-promotion-strip[hidden]{display:none}.shop-promotion-strip>span{display:grid;width:40px;height:40px;place-items:center;border-radius:12px;background:linear-gradient(145deg,#ff7a3d,#ffc748);color:#fff;font:700 16px "Space Grotesk",sans-serif}.shop-promotion-strip strong,.shop-promotion-strip small{display:block}.shop-promotion-strip strong{color:#ffac52;font-size:8px;letter-spacing:.1em}.shop-promotion-strip small{margin-top:4px;color:var(--muted);font-size:8px;line-height:1.4}.shop-featured{position:relative;margin:15px 0 20px;padding:30px 16px 15px;border:1px solid rgba(85,255,139,.42);border-radius:20px;background:radial-gradient(circle at 82% 18%,rgba(57,255,20,.16),transparent 34%),linear-gradient(135deg,rgba(6,30,22,.92),rgba(10,13,28,.88));box-shadow:0 20px 50px rgba(0,0,0,.2),inset 0 0 35px rgba(36,255,102,.04);overflow:hidden}.shop-featured[hidden]{display:none}.featured-overline{position:absolute;top:11px;left:16px;color:#7aff9f;font-size:7px;font-weight:800;letter-spacing:.13em}.shop-featured .shop-item{display:grid;grid-template-columns:minmax(220px,1.15fr) minmax(170px,.85fr);grid-template-rows:auto auto 1fr;gap:4px 18px;padding:0;border:0;background:transparent;box-shadow:none}.shop-featured .skin-preview{grid-row:1/4;height:155px;margin:0;border:1px solid rgba(107,255,152,.25);box-shadow:inset 0 0 28px rgba(255,255,255,.12),0 0 30px rgba(30,255,111,.16)}.shop-featured .shop-item h3{align-self:end;font-size:21px}.shop-featured .shop-item p{min-height:0;font-size:9px}.shop-featured .shop-actions{align-self:end}.shop-catalog-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-top:18px;padding:0 2px}.shop-catalog-heading h3{margin:3px 0 0;font-size:17px}.shop-catalog-heading small{max-width:270px;color:var(--muted);font-size:8px;text-align:right}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}.shop-item{display:flex;min-width:0;flex-direction:column}.shop-item .shop-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:6px;margin-top:auto}.shop-item .shop-actions button{min-width:0}.shop-item .skin-preview{background-position:center;background-size:cover}
html[data-theme="light"] .account-badges-card{border-color:#cdd9e2;background:#f7fafb}.player-badge{background:linear-gradient(135deg,color-mix(in srgb,var(--badge-color) 12%,#fff),#fff)}html[data-theme="light"] .shop-featured{border-color:#70cb83;background:radial-gradient(circle at 82% 18%,rgba(68,213,101,.16),transparent 34%),linear-gradient(135deg,#f4fff5,#eff9f4)}html[data-theme="light"] .shop-featured .shop-item h3{color:#153726}html[data-theme="light"] .shop-promotion-strip{border-color:#f0c58f;background:linear-gradient(100deg,#fff5e9,#fffaf0)}
@media(max-width:760px){.account-badges-list,.public-profile-badges{grid-template-columns:1fr}.shop-featured .shop-item{grid-template-columns:1fr}.shop-featured .skin-preview{grid-row:auto;height:130px}.shop-catalog-heading{align-items:flex-start;flex-direction:column}.shop-catalog-heading small{text-align:left}}@media(max-width:430px){.account-badges-card{padding:14px}.shop-dialog{width:100vw;max-height:100dvh;margin:0;border-radius:0}.shop-featured{padding-inline:12px}.shop-grid{grid-template-columns:1fr}}

/* Badges premium : image persistante, hiérarchie claire et contraste jour/nuit. */
.account-badges-card{position:relative;padding:26px;border-color:rgba(107,231,255,.22);background:radial-gradient(circle at 92% 0,rgba(107,231,255,.1),transparent 28%),linear-gradient(150deg,rgba(16,25,48,.88),rgba(7,12,27,.78));box-shadow:inset 0 1px rgba(255,255,255,.04),0 20px 50px rgba(0,0,0,.16);overflow:hidden}.account-badges-list{grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}.player-badge{isolation:isolate;grid-template-columns:74px minmax(0,1fr);gap:15px;min-height:116px;padding:16px;border:1px solid color-mix(in srgb,var(--badge-color) 48%,var(--line));border-radius:22px;background:linear-gradient(130deg,color-mix(in srgb,var(--badge-color) 17%,rgba(12,18,37,.94)),rgba(10,15,31,.96) 64%);box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 32px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.player-badge::before{content:"";position:absolute;z-index:-1;width:125px;height:125px;left:-42px;top:-54px;border-radius:50%;background:var(--badge-color);filter:blur(42px);opacity:.16;pointer-events:none}.player-badge::after{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.09),transparent 28%);pointer-events:none}.player-badge:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--badge-color) 76%,white 8%);box-shadow:inset 0 1px rgba(255,255,255,.09),0 18px 38px color-mix(in srgb,var(--badge-color) 12%,rgba(0,0,0,.3))}.player-badge>input{z-index:2;top:13px;right:13px;width:21px;height:21px;cursor:pointer}.player-badge:has(input:checked){border-color:var(--badge-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--badge-color) 34%,transparent),0 18px 42px color-mix(in srgb,var(--badge-color) 18%,rgba(0,0,0,.3))}.player-badge-icon{position:relative;z-index:1;width:72px;height:72px;border:1px solid color-mix(in srgb,var(--badge-color) 62%,rgba(255,255,255,.14));border-radius:21px;background:linear-gradient(145deg,color-mix(in srgb,var(--badge-color) 28%,#18213b),color-mix(in srgb,var(--badge-color) 10%,#080d1d));color:color-mix(in srgb,var(--badge-color) 82%,white);font-size:18px;letter-spacing:-.02em;box-shadow:inset 0 1px rgba(255,255,255,.16),0 9px 25px color-mix(in srgb,var(--badge-color) 24%,transparent);overflow:hidden}.player-badge-icon.has-image{background-color:#0b1020;background-position:center;background-size:cover;background-repeat:no-repeat;color:transparent}.player-badge-icon.has-image::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 -18px 28px rgba(0,0,0,.18)}.player-badge-copy{position:relative;z-index:1;min-width:0}.player-badge-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding-right:19px}.player-badge-heading strong{padding:0;color:var(--ink);font:700 13px/1.25 "Space Grotesk",sans-serif;letter-spacing:-.01em}.player-badge-status{flex:0 0 auto;padding:4px 6px;border:1px solid color-mix(in srgb,var(--badge-color) 45%,transparent);border-radius:999px;background:color-mix(in srgb,var(--badge-color) 13%,transparent);color:var(--badge-color);font-size:6px;font-weight:800;letter-spacing:.1em}.player-badge-copy>small{margin-top:7px;color:color-mix(in srgb,var(--badge-color) 80%,white 10%)!important;font-size:8px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.player-badge-copy>p{margin-top:7px;color:color-mix(in srgb,var(--muted) 88%,white 8%);font-size:9px;line-height:1.45}.public-profile-badges{grid-template-columns:1fr;gap:10px;margin-top:20px}.public-profile-badges .player-badge{grid-template-columns:62px minmax(0,1fr);min-height:94px;padding:14px;border-radius:19px}.public-profile-badges .player-badge-icon{width:60px;height:60px;border-radius:18px;font-size:14px}.public-profile-badges .player-badge-heading{padding-right:0}.public-profile-badges .player-badge-heading strong{font-size:11px}.public-profile-badges .player-badge-copy>small{font-size:7px}.public-profile-badges .player-badge p{display:-webkit-box;font-size:8px;-webkit-line-clamp:2}.public-profile-badges .player-badge-status{font-size:5px}
.player-badge.badge-source-one_million{--badge-color:#ffc94d;border-color:#ffd973;background:radial-gradient(circle at 16% 14%,rgba(255,232,143,.24),transparent 26%),linear-gradient(130deg,#3b2b10,#17140e 66%);box-shadow:inset 0 1px rgba(255,247,202,.2),0 18px 44px rgba(255,188,47,.2)}.player-badge.badge-source-one_million::after{background:linear-gradient(112deg,transparent 12%,rgba(255,245,185,.18) 30%,transparent 47%);background-size:220% 100%;animation:million-badge-shine 5s ease-in-out infinite}.badge-source-one_million .player-badge-icon{border-color:#ffe69b;background:radial-gradient(circle at 38% 28%,#fff3bd,#d79513 70%);color:#3c2700;text-shadow:0 1px rgba(255,255,255,.35);box-shadow:inset 0 1px #fff2bb,0 0 30px rgba(255,194,52,.42)}.badge-source-one_million .player-badge-status{border-color:#ffe39a;background:#ffd45f;color:#3b2600}.badge-source-one_million .player-badge-heading strong{color:#fff3c2}.badge-source-one_million .player-badge-copy>small{color:#ffd66d!important}.badge-source-one_million .player-badge-copy>p{color:#e8dcc0}@keyframes million-badge-shine{0%,62%,100%{background-position:140% 0}78%{background-position:-80% 0}}@media(prefers-reduced-motion:reduce){.player-badge.badge-source-one_million::after{animation:none}}
html[data-theme="light"] .account-badges-card{border-color:#c8dce4;background:radial-gradient(circle at 92% 0,rgba(40,187,219,.13),transparent 30%),linear-gradient(150deg,#fff,#f4f8fb);box-shadow:inset 0 1px #fff,0 20px 45px rgba(20,55,77,.1)}html[data-theme="light"] .player-badge{border-color:color-mix(in srgb,var(--badge-color) 50%,#cbd8df);background:linear-gradient(135deg,color-mix(in srgb,var(--badge-color) 16%,#fff),#fff 64%);box-shadow:inset 0 1px #fff,0 12px 28px rgba(30,64,83,.1)}html[data-theme="light"] .player-badge-heading strong{color:#10233d}html[data-theme="light"] .player-badge-copy>p{color:#53677a}html[data-theme="light"] .player-badge-status{background:color-mix(in srgb,var(--badge-color) 16%,#fff);color:color-mix(in srgb,var(--badge-color) 72%,#193047)}
html[data-theme="light"] .player-badge.badge-source-one_million{background:radial-gradient(circle at 16% 14%,rgba(255,222,111,.3),transparent 28%),linear-gradient(135deg,#fff8df,#fff 68%);box-shadow:inset 0 1px #fff,0 16px 36px rgba(177,116,0,.18)}html[data-theme="light"] .badge-source-one_million .player-badge-heading strong{color:#4a3100}html[data-theme="light"] .badge-source-one_million .player-badge-copy>small{color:#9d6500!important}html[data-theme="light"] .badge-source-one_million .player-badge-copy>p{color:#725c31}
@media(max-width:760px){.account-badges-card{padding:20px}.account-badges-list{grid-template-columns:1fr}.player-badge{grid-template-columns:66px minmax(0,1fr);min-height:104px;padding:13px}.player-badge-icon{width:64px;height:64px;border-radius:19px}.public-profile-badges .player-badge{grid-template-columns:58px minmax(0,1fr)}.public-profile-badges .player-badge-icon{width:56px;height:56px}}@media(max-width:430px){.account-badges-card{padding:14px}.player-badge-heading{display:block;padding-right:24px}.player-badge-status{display:inline-block;margin-top:5px}.player-badge-copy>p{font-size:8px}}
html[data-theme="dark"] .password-match-hint.success{color:#87e3a2}html[data-theme="dark"] .password-match-hint.error{color:#ff91b7}
html[data-theme="dark"] body:has(#join-screen.visible) #world-leaderboard-list .world-name{color:#edf3fc}
html[data-theme="dark"] body:has(#join-screen.visible) #world-leaderboard-list .world-score{color:#c8ef67}

/* Update SA-2026.08.20.0 — portefeuille, classement stable et événements */
.home-wallet{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:10px 0;padding:9px 11px;border:1px solid var(--line);border-radius:11px;background:rgba(5,8,19,.42);font-size:8px;letter-spacing:.06em}.home-wallet[hidden]{display:none}.home-wallet span{color:var(--muted)}.home-wallet strong{color:var(--ink);font-variant-numeric:tabular-nums}.premium-account-badge{padding:4px 7px;border:1px solid rgba(180,120,255,.45);border-radius:999px;background:linear-gradient(100deg,rgba(118,55,216,.28),rgba(230,84,255,.17));color:#d9a8ff!important;font-weight:800;letter-spacing:.12em}.home-primary-links{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.home-primary-links>button{display:flex!important;min-height:53px!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;padding:9px 12px!important;border:1px solid var(--line)!important;border-radius:11px!important;background:rgba(255,255,255,.035)!important;color:var(--ink)!important;text-align:left!important}.home-primary-links>button>b{font-size:20px;color:var(--lime)}.home-primary-links span,.home-primary-links small{display:block}.home-primary-links span{font-size:9px;font-weight:800;letter-spacing:.08em}.home-primary-links small{margin-top:3px;color:var(--muted);font-size:7px;font-weight:500;letter-spacing:0}.score-card #personal-rank{margin-bottom:3px;color:var(--ink);font-family:"Space Grotesk",sans-serif;font-size:9px;font-weight:800;font-variant-numeric:tabular-nums}.score-card strong{display:block;min-width:9ch;font-size:24px;line-height:1.12;font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}#world-leaderboard-list .world-score{display:block;width:13ch;min-width:13ch;overflow:hidden;font-family:"Space Grotesk",sans-serif;font-size:9px;font-weight:700;line-height:1.3;text-align:right;text-overflow:ellipsis;white-space:nowrap}
.auth-form select,.country-confirm-dialog select,.auth-form input[type="search"],.country-confirm-dialog input{width:100%;min-height:42px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#090c1c;color:var(--ink);outline:0}.auth-form input[type="search"]{margin-bottom:6px}.daily-reward-dialog,.country-confirm-dialog{width:min(520px,calc(100% - 28px));text-align:center}.daily-reward-dialog>strong{display:block;margin:18px 0;color:#ffcf59;font:800 28px "Space Grotesk",sans-serif}.daily-reward-progress{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin:18px 0}.daily-reward-progress span{padding:9px 2px;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:7px}.daily-reward-progress span.passed{color:#8bb72e}.daily-reward-progress span.current{border-color:#d8ff63;background:rgba(216,255,99,.13);color:#d8ff63;box-shadow:0 0 18px rgba(216,255,99,.12)}.daily-reward-dialog>button,.country-confirm-dialog>button{width:100%;min-height:44px;border:0;border-radius:9px;background:var(--lime);color:#111509;font-size:9px;font-weight:800}.country-confirm-dialog input,.country-confirm-dialog select{margin:5px 0}.country-confirm-dialog p{line-height:1.55}
.shop-packs{margin:18px 0 25px}.shop-packs[hidden]{display:none}.shop-pack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-top:12px}.shop-pack-card{position:relative;display:grid;grid-template-columns:76px 1fr;gap:12px;padding:13px;border:1px solid rgba(191,126,255,.3);border-radius:15px;background:linear-gradient(135deg,rgba(91,43,157,.14),rgba(7,10,23,.66));overflow:hidden}.shop-pack-art{display:grid;min-height:76px;place-items:center;border-radius:11px;background:linear-gradient(145deg,#7925d8,#e35dff);background-position:center;background-size:cover;color:white;font-size:28px}.shop-pack-copy h3{margin:2px 0 5px;font-size:13px}.shop-pack-copy p{margin:0 0 6px;color:var(--muted);font-size:8px;line-height:1.45}.shop-pack-copy small{color:#a7aec0;font-size:7px;line-height:1.4}.shop-pack-actions{display:flex;grid-column:1/-1;gap:6px}.shop-pack-actions button{flex:1;min-height:34px;border:1px solid var(--line);border-radius:8px;background:rgba(216,255,99,.1);color:var(--lime);font-size:8px;font-weight:800}.shop-pack-actions button.premium{background:linear-gradient(90deg,#7136d6,#d856ef);color:white}.shop-pack-actions button:disabled{opacity:.42}.shop-pack-badge{position:absolute;top:8px;right:8px;padding:4px 6px;border-radius:999px;background:#d8ff63;color:#152008;font-size:6px;font-weight:900;letter-spacing:.08em}.premium-discount-badge{display:inline-block;margin-left:5px;padding:3px 5px;border-radius:999px;background:linear-gradient(90deg,#8036dd,#dc56ef);color:#fff;font-size:5px;vertical-align:middle}.skin-preview.mexico_flag{background:linear-gradient(90deg,#007a3d 0 33.33%,#fff 33.33% 66.66%,#ce1126 66.66%)}.skin-preview.usa_stars{background-color:#193a73;background-image:radial-gradient(#fff 18%,transparent 21%),repeating-linear-gradient(0deg,transparent 0 8px,#c92035 8px 16px,#fff 16px 24px);background-size:18px 18px,100% 100%}.skin-preview.developer_spinner{background:repeating-linear-gradient(135deg,#d7a72b 0 13px,#f7f4e9 13px 26px);box-shadow:inset 0 0 0 3px #1b2028,0 0 18px rgba(215,167,43,.28)}
html[data-theme="light"] .home-wallet,html[data-theme="light"] .home-primary-links>button{background:rgba(255,255,255,.72)}html[data-theme="light"] .auth-form select,html[data-theme="light"] .country-confirm-dialog select,html[data-theme="light"] .auth-form input[type="search"],html[data-theme="light"] .country-confirm-dialog input{background:#fff;color:#10203d}html[data-theme="light"] .shop-pack-card{background:linear-gradient(135deg,#f6ecff,#fff)}
@media(max-width:520px){.home-primary-links{grid-template-columns:1fr}.daily-reward-progress{grid-template-columns:repeat(4,1fr)}.shop-pack-card{grid-template-columns:62px 1fr}.score-card strong{font-size:17px}#world-leaderboard-list .world-score{width:10ch;min-width:10ch;font-size:8px}}
.shop-pack-saving{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin-top:8px}.shop-pack-saving s{color:var(--muted);font-size:8px}.shop-pack-saving strong{color:#d8ff63;font:800 13px "Space Grotesk",sans-serif}.shop-pack-saving small{color:#ffcf59;font-size:6px;font-weight:800;letter-spacing:.07em}
html[data-theme="dark"] body:has(#join-screen.visible) :is(.leaderboard-tabs,.battle-leaderboard-controls) button{color:#b6c1d2}
html[data-theme="dark"] :is(input,textarea)::placeholder{color:#a0adc0}

@media(max-width:720px){
  body:has(#join-screen.visible) .seo-game-title{margin-inline:auto}
  .hero-slogan{font-size:clamp(39px,12vw,55px)}
  .seo-quick-nav,.seo-home{width:calc(100vw - 24px)}
  .seo-quick-nav{margin-top:15px;padding:7px;gap:3px}.seo-quick-nav a{padding:7px 8px;font-size:9px}
  .seo-home{padding:25px 18px;border-radius:19px}.seo-home-grid,.rules-grid{grid-template-columns:1fr}.seo-home-grid{gap:12px}.seo-home-grid section{padding:20px}.seo-home p{font-size:13px}
  body:has(#join-screen.visible) .join-screen footer{width:calc(100vw - 24px);padding-bottom:16px}
  .site-menu-dialog{width:100vw;padding:18px 12px 24px;border-left:0;border-radius:0}.site-menu-heading{padding:3px 45px 15px 4px}.site-menu-heading strong{font-size:28px}.site-language-switcher{position:sticky;top:-18px;z-index:3;margin-inline:0;border-radius:0 0 13px 13px;backdrop-filter:blur(14px)}.site-language-switcher>span{display:none}.site-language-switcher button{flex:1;min-width:0}.site-menu-dialog .seo-quick-nav{width:100%;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.site-menu-dialog .seo-quick-nav a{text-align:center}.site-menu-dialog .seo-home{width:100%;padding:22px 15px}.site-menu-dialog .seo-home-grid section{padding:17px}.site-menu-dialog .seo-home-actions{align-items:stretch;flex-direction:column}.site-menu-dialog .seo-home-actions a{text-align:center}
}

/* Actualités, maintenance planifiée et sécurité du profil. */
.maintenance-notice{position:fixed;z-index:45;top:84px;left:50%;display:grid;width:min(640px,calc(100vw - 32px));padding:12px 18px;border-color:rgba(255,199,77,.38);border-radius:14px;background:rgba(24,21,28,.92);transform:translateX(-50%);text-align:center;pointer-events:none}
.maintenance-notice>span{color:#ffd166;font-size:8px;font-weight:800;letter-spacing:.15em}.maintenance-notice>strong{margin-top:3px;color:#fff;font-size:13px}.maintenance-notice>small{margin-top:2px;color:#c6cad8;font-size:10px}
.news-carousel{position:relative;z-index:2;display:grid;grid-template-columns:150px minmax(0,1fr) auto;align-items:center;gap:20px;width:min(950px,calc(100vw - 44px));min-height:135px;margin:15px auto 24px;padding:14px;border-radius:20px;overflow:hidden;text-align:left}
.news-image{align-self:stretch;min-height:106px;border-radius:14px;background:linear-gradient(135deg,#3bc6ed,#b9e73f);background-position:center;background-size:cover;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.news-image.empty::after{display:grid;height:100%;place-items:center;content:"SNAKE//NEWS";color:#0e2940;font:700 11px "Space Grotesk",sans-serif;letter-spacing:.09em}
.news-carousel article{min-width:0}.news-date{color:var(--lime);font-size:8px;font-weight:800;letter-spacing:.15em}.news-carousel h2{margin:5px 0;color:var(--ink);font-family:"Space Grotesk",sans-serif;font-size:20px;line-height:1.15}.news-carousel p{display:-webkit-box;margin:0;color:var(--muted);font-size:11px;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;user-select:text;-webkit-user-select:text}.news-carousel a{display:inline-block;margin-top:8px;color:var(--lime);font-size:9px;font-weight:800;letter-spacing:.08em;text-decoration:none}
.news-controls{display:grid;justify-items:center;gap:8px}.news-controls>button{width:30px;height:30px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.05);cursor:pointer}.news-dots{display:flex;max-height:42px;flex-direction:column;gap:4px}.news-dots button{width:5px;height:5px;padding:0;border:0;border-radius:50%;background:var(--muted);opacity:.45;cursor:pointer}.news-dots button.active{background:var(--lime);opacity:1}
.profile-security-form{display:grid;gap:8px;margin-top:15px;padding-top:15px;border-top:1px solid var(--line)}.profile-security-form>label,.profile-friend-toggle strong{font-size:8px;font-weight:800;letter-spacing:.11em}.profile-security-form>input,.profile-security-form .password-field{width:100%}.profile-security-form>button{min-height:39px;border:0;border-radius:10px;background:var(--lime);color:#16200e;font-size:9px;font-weight:800;letter-spacing:.07em;cursor:pointer}.profile-security-form>button:disabled{opacity:.45;cursor:not-allowed}.profile-security-form>small{font-size:9px;line-height:1.45}
.profile-friend-toggle{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:15px;padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035);cursor:pointer}.profile-friend-toggle>span{display:grid;gap:3px}.profile-friend-toggle small{color:var(--muted);font-size:9px}.profile-friend-toggle input{width:20px;height:20px;accent-color:#91c522}
html[data-theme="light"] .news-carousel{border-color:#d2dde4;background:rgba(255,255,255,.94);box-shadow:0 18px 48px rgba(39,77,103,.12)}html[data-theme="light"] .news-carousel h2{color:#10203d}html[data-theme="light"] .news-carousel p{color:#4f6278}html[data-theme="light"] .news-date,html[data-theme="light"] .news-carousel a{color:#087fae}html[data-theme="light"] .news-controls>button{border-color:#d2dde4;background:#f4f8fa;color:#18334c}
html[data-theme="light"] .profile-friend-toggle{border-color:#d2dde4;background:#f7fafb;color:#17314a}
@media(max-width:720px){.maintenance-notice{top:76px}.news-carousel{grid-template-columns:86px minmax(0,1fr);gap:12px;width:calc(100vw - 24px);min-height:116px;padding:10px}.news-image{min-height:96px}.news-carousel h2{font-size:16px}.news-carousel p{-webkit-line-clamp:2}.news-controls{grid-column:1/-1;display:flex;justify-content:center}.news-dots{flex-direction:row}.news-controls>button{width:28px;height:25px}}

/* Espace compte pleine page. La fenêtre compacte reste réservée à la connexion. */
.auth-dialog.account-page{width:min(1180px,calc(100vw - 40px));height:min(860px,calc(100dvh - 40px));max-height:none;padding:0;overflow:auto;border-radius:28px;overscroll-behavior:contain}
.auth-dialog.account-page .dialog-close{position:sticky;z-index:8;top:18px;float:right;margin:18px 18px -58px 0;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.auth-dialog.account-page .auth-user-view{min-height:100%;padding:28px}
.account-hero{position:relative;display:grid;grid-template-columns:auto minmax(230px,.8fr) minmax(420px,1.2fr);align-items:center;gap:22px;padding:26px 68px 26px 26px;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle at 9% 30%,rgba(85,230,220,.16),transparent 23%),radial-gradient(circle at 62% 115%,rgba(216,255,99,.12),transparent 36%),rgba(255,255,255,.025)}
.account-hero::after{position:absolute;right:-75px;top:-110px;width:270px;height:270px;border:1px solid rgba(85,230,220,.12);border-radius:50%;content:"";box-shadow:0 0 0 35px rgba(85,230,220,.025),0 0 0 70px rgba(85,230,220,.018);pointer-events:none}
.account-hero-avatar{position:relative;z-index:1;display:grid;width:92px;height:92px;place-items:center;overflow:hidden;border:3px solid rgba(85,230,220,.55);border-radius:29px;background-color:#0f1d2e;background-position:center;background-size:cover;font-size:35px;box-shadow:0 18px 45px rgba(0,0,0,.25),0 0 28px rgba(85,230,220,.12)}
.account-hero-avatar.skin-preview{margin:0;background-size:cover}
.account-hero-copy{position:relative;z-index:1;min-width:0}.account-hero-copy h2{margin:6px 0 5px;font-size:clamp(30px,4vw,46px);overflow-wrap:anywhere}.account-hero-copy>p{margin:0;max-width:500px}
.account-hero-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.account-hero-meta span{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid rgba(85,230,220,.14);border-radius:99px;background:rgba(85,230,220,.065);color:#a6c8d1;font-size:7px;font-weight:800;letter-spacing:.08em}.account-hero-meta i{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.account-page .account-shortcuts{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.account-page .account-shortcuts button{display:grid;width:100%;height:auto;min-height:84px;margin:0;padding:12px 10px;justify-items:start;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(8,12,27,.58);color:var(--ink);text-align:left;transition:transform .18s ease,border-color .18s ease,background .18s ease}.account-page .account-shortcuts button:hover{border-color:rgba(85,230,220,.38);background:rgba(85,230,220,.1);transform:translateY(-2px)}.account-page .account-shortcuts b{display:grid;width:27px;height:27px;margin-bottom:8px;place-items:center;border-radius:9px;background:rgba(216,255,99,.1);color:var(--lime);font-size:14px}.account-page .account-shortcuts span{font-size:8px;font-weight:800;letter-spacing:.07em}.account-page .account-shortcuts small{margin-top:3px;color:var(--muted);font:400 8px "DM Sans",sans-serif;letter-spacing:0}
.account-dashboard{display:grid;grid-template-columns:minmax(330px,.88fr) minmax(480px,1.12fr);gap:14px;margin-top:14px}.account-column{min-width:0;padding:23px;border:1px solid var(--line);border-radius:20px;background:rgba(5,8,20,.32)}
.account-section-heading{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}.account-section-icon{display:grid;width:36px;height:36px;place-items:center;border:1px solid rgba(85,230,220,.2);border-radius:12px;background:rgba(85,230,220,.08);color:var(--mint);font-size:16px}.account-section-heading h3{margin:4px 0;color:var(--ink);font:700 18px "Space Grotesk",sans-serif}.account-section-heading p{margin:0;font-size:10px}
.account-page :is(.profile-country-form,.profile-avatar-form){margin:15px 0 0;padding:15px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.account-page .profile-country-form select{height:46px}.account-page .profile-country-flag{width:43px;height:34px}.account-page .country-select-row{grid-template-columns:43px minmax(0,1fr);gap:10px}.account-page .profile-avatar-options label{min-height:69px}.account-page .profile-avatar-preview{width:48px;height:48px}
.account-page .profile-security-form{display:grid;gap:7px;margin:15px 0 0;padding:15px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.account-page .profile-security-form+.profile-security-form{margin-top:10px}.profile-form-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:3px}.profile-form-title strong{font-size:9px;letter-spacing:.1em}.profile-form-title span{padding:4px 7px;border-radius:99px;background:rgba(85,230,220,.08);color:var(--mint);font-size:7px;font-weight:800}.account-page .profile-security-form label,.account-page .profile-password-grid label{display:block;margin:3px 1px 0;color:#aeb8c8;font-size:7px;font-weight:800;letter-spacing:.11em}.account-page .profile-security-form>input,.account-page .password-field input{width:100%;height:42px;padding:0 85px 0 12px;border:1px solid var(--line);border-radius:9px;outline:0;background:rgba(4,7,17,.72);color:var(--ink)}.account-page .profile-security-form>input{padding-right:12px}.account-page .profile-security-form input:focus{border-color:var(--mint);box-shadow:0 0 0 3px rgba(85,230,220,.08)}
.account-page .profile-security-form .password-toggle{position:absolute;top:50%;right:6px;width:auto;min-width:68px;height:30px;min-height:0;margin:0;padding:0 8px;transform:translateY(-50%);border:1px solid rgba(85,230,220,.2);border-radius:7px;background:rgba(85,230,220,.09);color:var(--mint);font-size:7px}.profile-password-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.profile-password-grid>div{display:grid;gap:7px;min-width:0}.account-page .profile-security-form>button,.account-page .profile-country-form>button{height:40px;min-height:0;margin-top:4px;border-radius:9px;background:linear-gradient(90deg,var(--lime),#9fea66);font-size:8px}.account-page .auth-message{min-height:0;margin:3px 1px 0}.account-page .profile-security-form>small{color:var(--muted)}
.account-preferences{display:grid;grid-template-columns:minmax(280px,1fr) minmax(280px,1fr) auto;align-items:stretch;gap:10px;margin-top:14px}.account-page .profile-friend-toggle,.account-theme-status{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;min-height:72px;margin:0;padding:13px 15px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.account-theme-status{grid-template-columns:auto 1fr}.account-theme-status>span{display:grid;width:36px;height:36px;place-items:center;border-radius:12px;background:rgba(216,255,99,.09);color:var(--lime);font-size:17px}.account-theme-status strong{display:block;font-size:8px;letter-spacing:.11em}.account-theme-status small{display:block;margin-top:3px;color:var(--muted);font-size:8px}.account-preferences>.auth-message{grid-column:1/-1;margin:0}.account-page .account-logout{width:auto;min-width:150px;height:auto;min-height:72px;margin:0;padding:0 18px;border:1px solid rgba(255,107,158,.22);border-radius:15px;background:rgba(255,107,158,.075);color:#ff8cb5;font-size:8px}
html[data-theme="light"] .account-hero{border-color:#d1dde5;background:radial-gradient(circle at 9% 30%,rgba(43,185,237,.15),transparent 23%),radial-gradient(circle at 62% 115%,rgba(178,220,64,.16),transparent 36%),rgba(255,255,255,.78)}html[data-theme="light"] .account-hero-avatar{border-color:#46badd;background-color:#eef7f8;box-shadow:0 18px 45px rgba(36,74,102,.15)}html[data-theme="light"] .account-hero-meta span{border-color:#c5e4eb;background:#edf9fb;color:#3d6472}html[data-theme="light"] .account-page .account-shortcuts button{border-color:#d1dce4;background:rgba(255,255,255,.9);color:#17314a;box-shadow:0 8px 20px rgba(34,70,96,.06)}html[data-theme="light"] .account-page .account-shortcuts button:hover{border-color:#7bc9db;background:#effbfc}html[data-theme="light"] :is(.account-column,.account-page .profile-country-form,.account-page .profile-avatar-form,.account-page .profile-security-form,.account-page .profile-friend-toggle,.account-theme-status){border-color:#d1dde5;background:rgba(255,255,255,.78)}html[data-theme="light"] .account-page :is(.profile-security-form>input,.password-field input){border-color:#cbd8e1;background:#fff;color:#10233f}html[data-theme="light"] .account-page .profile-security-form label,html[data-theme="light"] .account-page .profile-password-grid label{color:#4b5f77}html[data-theme="light"] .profile-form-title span{background:#e5f6f7;color:#087b93}
@media(max-width:980px){.account-hero{grid-template-columns:auto 1fr}.account-page .account-shortcuts{grid-column:1/-1}.account-dashboard{grid-template-columns:1fr}.account-preferences{grid-template-columns:1fr 1fr}.account-page .account-logout{grid-column:1/-1;min-height:52px}}
@media(max-width:620px){.auth-dialog.account-page{width:100vw;height:100dvh;max-width:none;margin:0;border:0;border-radius:0}.auth-dialog.account-page .auth-user-view{padding:14px}.auth-dialog.account-page .dialog-close{top:10px;margin:10px 10px -50px 0}.account-hero{grid-template-columns:64px minmax(0,1fr);gap:13px;padding:21px 48px 18px 17px;border-radius:18px}.account-hero-avatar{width:64px;height:64px;border-radius:20px;font-size:26px}.account-hero-copy h2{font-size:29px}.account-hero-copy>p{font-size:10px}.account-hero-meta span{padding:5px 7px;font-size:6px}.account-page .account-shortcuts{grid-template-columns:1fr 1fr}.account-page .account-shortcuts button{min-height:66px;padding:10px}.account-page .account-shortcuts b{width:24px;height:24px;margin-bottom:5px}.account-dashboard{gap:10px;margin-top:10px}.account-column{padding:15px;border-radius:17px}.account-section-heading h3{font-size:16px}.account-page :is(.profile-country-form,.profile-avatar-form,.profile-security-form){padding:12px}.profile-password-grid{grid-template-columns:1fr}.account-preferences{grid-template-columns:1fr;gap:8px;margin-top:10px}.account-page .account-logout{grid-column:auto}.profile-avatar-options{grid-template-columns:1fr 1fr}.account-page .profile-avatar-options label{grid-template-columns:40px minmax(0,1fr);padding:8px}.account-page .profile-avatar-preview{width:40px;height:40px}}
@media(max-width:390px){.account-hero{grid-template-columns:1fr;padding-top:56px}.account-hero-avatar{width:58px;height:58px}.account-page .account-shortcuts{grid-template-columns:1fr 1fr}.account-page .profile-avatar-options{grid-template-columns:1fr}.account-hero-meta span:nth-child(3){display:none}}

/* HUD mobile v3 — zones sûres distinctes en portrait et paysage. */
@media (max-width:900px) {
  body.game-active .topbar {
    inset:0;
    width:auto;
    height:0;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    pointer-events:none;
  }
  body.game-active .topbar :is(.brand,.server-state),
  body.game-active .top-actions > :not(#menu-button):not(#friends-button) { display:none!important; }
  body.game-active .top-actions { display:contents; }
  body.game-active #menu-button {
    position:fixed;
    z-index:60;
    top:max(10px,env(safe-area-inset-top));
    left:max(10px,env(safe-area-inset-left));
    width:128px;
    height:44px;
    padding:0 12px;
    border:1px solid rgba(216,255,99,.62);
    border-radius:13px;
    background:rgba(8,13,27,.94);
    color:#eaffaa;
    box-shadow:0 10px 28px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.08);
    font-size:8px;
    font-weight:800;
    letter-spacing:.08em;
    pointer-events:auto;
    backdrop-filter:blur(12px);
  }
  body.game-active #menu-button .ui-icon { width:17px;height:17px; }
  body.game-active #friends-button {
    position:fixed;
    z-index:60;
    top:max(10px,env(safe-area-inset-top));
    left:calc(max(10px,env(safe-area-inset-left)) + 136px);
    display:flex!important;
    width:72px;
    height:44px;
    padding:0 9px;
    gap:5px;
    border:1px solid rgba(85,230,220,.46);
    border-radius:13px;
    background:rgba(8,13,27,.94);
    color:#9af5ef;
    box-shadow:0 10px 28px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.08);
    font-size:7px;
    font-weight:800;
    letter-spacing:.07em;
    pointer-events:auto;
    backdrop-filter:blur(12px);
  }
  body.game-active #friends-button .in-game-friends-label { display:inline; }
  body.game-active #friends-button.has-notification { border-color:#ffcf56;color:#ffdc7e;box-shadow:0 0 0 3px rgba(255,207,86,.12),0 10px 28px rgba(0,0,0,.32); }
  body.game-active .leaderboard {
    z-index:20;
    top:max(10px,env(safe-area-inset-top));
    right:max(10px,env(safe-area-inset-right));
    width:clamp(128px,40vw,178px);
    max-height:calc(100dvh - 172px - env(safe-area-inset-bottom));
    padding:10px;
    overflow:hidden;
    border-radius:13px;
    background:rgba(9,13,29,.84);
    box-shadow:0 12px 30px rgba(0,0,0,.24);
    backdrop-filter:blur(10px);
  }
  body.game-active .leaderboard .panel-heading span { font-size:10px; }
  body.game-active .leaderboard .panel-heading small { max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  body.game-active .leaderboard ol { margin-top:6px; }
  body.game-active .leaderboard li { grid-template-columns:24px minmax(0,1fr) auto;min-height:21px;gap:4px;font-size:9px; }
  body.game-active .leaderboard li:nth-child(n+7) { display:none; }
  body.game-active .score-card {
    z-index:20;
    top:calc(max(10px,env(safe-area-inset-top)) + 52px);
    bottom:auto;
    left:max(10px,env(safe-area-inset-left));
    min-width:108px;
    padding:8px 11px;
    border-radius:12px;
    background:rgba(9,13,29,.84);
    backdrop-filter:blur(10px);
  }
  body.game-active .score-card span { font-size:7px; }
  body.game-active .score-card strong { font-size:19px; }
  body.game-active .touch-controls {
    z-index:35;
    bottom:max(14px,env(safe-area-inset-bottom));
    padding-right:max(14px,env(safe-area-inset-right));
    padding-left:max(14px,env(safe-area-inset-left));
  }
  body.game-active .joystick { width:112px;height:112px;background:rgba(7,11,25,.48);box-shadow:inset 0 0 28px rgba(0,0,0,.32),0 8px 26px rgba(0,0,0,.18); }
  body.game-active .joystick::after { inset:22px; }
  body.game-active #joystick-knob { width:48px;height:48px; }
  body.game-active .boost-button { width:78px;height:78px;background:rgba(34,29,15,.58);box-shadow:0 9px 28px rgba(0,0,0,.2); }
  body.game-active .boost-button>.ui-icon { width:27px;height:27px; }
  body.game-active .battle-royale-status,
  body.game-active .summer-games-status {
    z-index:24;
    top:calc(max(10px,env(safe-area-inset-top)) + 60px);
    width:calc(100vw - max(20px,env(safe-area-inset-left)) - max(20px,env(safe-area-inset-right)));
    min-width:0;
    max-width:430px;
    padding:9px 13px;
  }
  body.game-active:has(#battle-royale-status:not([hidden])) .leaderboard,
  body.game-active:has(#summer-games-status:not([hidden])) .leaderboard { top:calc(max(10px,env(safe-area-inset-top)) + 140px); }
  body.game-active:has(#battle-royale-status:not([hidden])) .score-card,
  body.game-active:has(#summer-games-status:not([hidden])) .score-card { top:calc(max(10px,env(safe-area-inset-top)) + 140px); }
  body.game-active:has(#summer-games-status:not([hidden])) :is(.leaderboard,.score-card) { top:calc(max(10px,env(safe-area-inset-top)) + 184px); }
  body.game-active :is(.kill-toast,.edge-warning) { top:auto;bottom:calc(max(14px,env(safe-area-inset-bottom)) + 130px); }
  body.game-active:has(.death-screen.visible) .topbar { display:none; }
  .death-screen { padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
  .death-card { width:min(520px,100%);max-height:calc(100dvh - max(16px,env(safe-area-inset-top)) - max(16px,env(safe-area-inset-bottom)));padding:24px 18px;border-radius:19px;overscroll-behavior:contain; }
  .death-card h2 { margin-top:7px;font-size:clamp(28px,9vw,36px); }
  .death-card :is(.primary-button,.secondary-button) { min-height:48px; }
  .rank-promotion{width:min(360px,calc(100vw - 20px));padding:24px 18px;border-radius:20px}.rank-promotion strong{font-size:27px}
}

@media (max-width:680px) and (orientation:portrait) {
  body.game-active .leaderboard { width:clamp(126px,39vw,166px); }
  body.game-active .score-card { max-width:128px; }
  body.game-active .battle-royale-status small,
  body.game-active .summer-games-status small { font-size:7px; }
}

@media (orientation:landscape) and (max-width:1100px) and (max-height:540px) {
  body.game-active #menu-button {
    top:max(8px,env(safe-area-inset-top));
    left:max(8px,env(safe-area-inset-left));
    width:116px;
    height:42px;
    padding-inline:9px;
  }
  body.game-active #friends-button {
    top:max(8px,env(safe-area-inset-top));
    left:calc(max(8px,env(safe-area-inset-left)) + 124px);
    width:48px;
    height:42px;
    padding:0;
  }
  body.game-active #friends-button .in-game-friends-label { display:none; }
  body.game-active .leaderboard {
    top:max(8px,env(safe-area-inset-top));
    right:max(8px,env(safe-area-inset-right));
    width:150px;
    max-height:calc(100dvh - 16px - env(safe-area-inset-bottom));
    padding:8px 9px;
  }
  body.game-active .leaderboard li { min-height:19px;font-size:8px; }
  body.game-active .leaderboard li:nth-child(n+4) { display:none; }
  body.game-active .score-card {
    top:calc(max(8px,env(safe-area-inset-top)) + 49px);
    left:max(8px,env(safe-area-inset-left));
    min-width:100px;
    padding:6px 9px;
  }
  body.game-active .score-card strong { font-size:17px; }
  body.game-active .battle-royale-status,
  body.game-active .battle-royale-status.running,
  body.game-active .summer-games-status {
    top:max(8px,env(safe-area-inset-top));
    width:min(300px,calc(100vw - 320px));
    min-width:150px;
    padding:7px 10px;
  }
  body.game-active .battle-royale-status strong,
  body.game-active .summer-games-status>strong { margin-top:2px;font-size:11px; }
  body.game-active .battle-royale-status small,
  body.game-active .summer-games-status>small { margin-top:1px;font-size:7px; }
  body.game-active .summer-games-status ol { display:none; }
  body.game-active:has(#battle-royale-status:not([hidden])) .leaderboard,
  body.game-active:has(#summer-games-status:not([hidden])) .leaderboard { top:max(8px,env(safe-area-inset-top)); }
  body.game-active:has(#battle-royale-status:not([hidden])) .score-card,
  body.game-active:has(#summer-games-status:not([hidden])) .score-card { top:calc(max(8px,env(safe-area-inset-top)) + 49px); }
  body.game-active .touch-controls {
    bottom:max(8px,env(safe-area-inset-bottom));
    padding-right:max(12px,env(safe-area-inset-right));
    padding-left:max(12px,env(safe-area-inset-left));
  }
  body.game-active .joystick { width:94px;height:94px; }
  body.game-active .joystick::after { inset:19px; }
  body.game-active #joystick-knob { width:42px;height:42px; }
  body.game-active .boost-button { width:68px;height:68px; }
  body.game-active .boost-button>.ui-icon { width:23px;height:23px; }
  body.game-active .boost-button small { font-size:7px; }
  body.game-active :is(.kill-toast,.edge-warning) { bottom:calc(max(8px,env(safe-area-inset-bottom)) + 100px);max-width:calc(100vw - 260px);padding:7px 11px;font-size:9px; }
  .death-screen { align-items:center;padding:8px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left)); }
  .death-card { width:min(680px,100%);max-height:calc(100dvh - 16px);padding:15px 20px;border-radius:16px; }
  .death-card h2 { margin-top:3px;font-size:24px; }
  .death-card .final-score { margin-block:8px; }
  .death-card :is(.primary-button,.secondary-button) { min-height:42px; }
  .battle-final-results{margin-bottom:9px;padding:9px}.battle-final-results ol{max-height:105px}.battle-victory-banner{margin:8px 0;padding:9px 12px}
}

@media (max-width:430px) {
  body:not(.game-active) .topbar { padding-inline:8px; }
  body:not(.game-active) .brand>span { display:none; }
}

/* Invitations d’amis ouvrables et préférence de notification. */
.in-game-friends-label{display:none}.friends-notification-count{position:absolute;top:-5px;right:-5px;display:grid;width:18px;height:18px;place-items:center;border:2px solid #0b1020;border-radius:50%;background:#ffcf56;color:#271b00;font-size:10px;line-height:1;box-shadow:0 4px 12px rgba(255,190,46,.35)}
.friend-game-notification{position:fixed;z-index:58;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:grid;width:min(380px,calc(100vw - 40px));padding:16px 17px;border:1px solid rgba(85,230,220,.38);border-radius:16px;background:linear-gradient(130deg,rgba(9,18,35,.96),rgba(19,31,51,.96));box-shadow:0 20px 55px rgba(0,0,0,.38),0 0 30px rgba(85,230,220,.08);color:#f4f8ff}.friend-game-notification[hidden]{display:none!important}.friend-game-notification>span{color:#7cebe4;font-size:8px;font-weight:800;letter-spacing:.14em}.friend-game-notification>strong{margin-top:5px;font:700 17px "Space Grotesk",sans-serif}.friend-game-notification>small{margin-top:4px;color:#a9b7ca;font-size:10px;line-height:1.45}.friend-game-notification>div{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:12px}.friend-game-notification button{min-height:38px;padding:0 14px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.06);color:#c7d2e2;font-size:8px;font-weight:800;letter-spacing:.07em;cursor:pointer}.friend-game-notification #friend-game-notification-open{border:0;background:linear-gradient(90deg,#55e6dc,#b5ef62);color:#10201e}.profile-notification-toggle .account-section-icon{color:#ffcf56;background:rgba(255,207,86,.1)}.account-preferences{grid-template-columns:repeat(2,minmax(280px,1fr))}.account-preferences>.auth-message{grid-column:auto}.account-page .account-logout{grid-column:1/-1;min-height:52px}

@media(max-width:680px){
  .friend-game-notification{right:50%;bottom:calc(max(14px,env(safe-area-inset-bottom)) + 132px);width:calc(100vw - max(20px,env(safe-area-inset-left)) - max(20px,env(safe-area-inset-right)));padding:13px 14px;transform:translateX(50%);border-radius:14px}.friend-game-notification>strong{font-size:15px}.friend-game-notification>small{font-size:9px}.friend-game-notification button{min-height:42px}
  #friends-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:20px 14px;border-radius:18px}#friends-dialog h2{font-size:25px}.friend-form{grid-template-columns:1fr}.friend-form button{min-height:42px}.friends-list{margin-top:12px}.friend-row{grid-template-columns:auto minmax(0,1fr);gap:8px}.friend-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.friend-actions button{min-height:37px;padding:6px}
}
@media(max-width:620px){.account-preferences{grid-template-columns:1fr}.account-preferences>.auth-message{grid-column:1/-1}}
@media(max-width:380px){body.game-active #friends-button{width:44px;padding:0}body.game-active #friends-button .in-game-friends-label{display:none}}
@media(max-width:340px){body.game-active #menu-button{width:116px;padding-inline:8px}body.game-active #friends-button{left:calc(max(10px,env(safe-area-inset-left)) + 124px);width:40px}}
@media(orientation:landscape) and (max-width:1100px) and (max-height:540px){.friend-game-notification{right:50%;bottom:max(8px,env(safe-area-inset-bottom));width:min(360px,calc(100vw - 260px));padding:9px 11px;transform:translateX(50%)}.friend-game-notification>strong{font-size:13px}.friend-game-notification>small{font-size:8px}.friend-game-notification>div{margin-top:7px}.friend-game-notification button{min-height:34px}#friends-dialog{width:min(680px,calc(100vw - 16px));max-height:calc(100dvh - 16px);padding:14px 17px}#friends-dialog h2{margin:3px 0 10px;font-size:23px}.friend-form input{height:38px}.friend-form button{min-height:38px}.friends-list{margin-top:9px}.friend-row{padding:7px}.friend-actions button{min-height:32px}}
.race-play-button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:62px;padding:10px 14px;border:1px solid rgba(255,209,102,.42);border-radius:14px;background:linear-gradient(105deg,rgba(255,209,102,.16),rgba(85,230,220,.12));color:#f8fbff;cursor:pointer;box-shadow:inset 0 0 24px rgba(255,209,102,.04)}.race-play-button[hidden]{display:none}.race-play-button span{display:grid;text-align:left}.race-play-button strong{font:800 14px "Space Grotesk",sans-serif;letter-spacing:.1em}.race-play-button small{margin-top:3px;color:#ffd166;font-size:8px;letter-spacing:.08em}.race-play-button b{font-size:26px;color:#ffd166}.race-status{position:fixed;z-index:22;top:84px;left:50%;width:min(410px,calc(100vw - 32px));padding:13px 15px;transform:translateX(-50%);border-color:rgba(255,209,102,.35);text-align:center}.race-status[hidden]{display:none}.race-status>span{color:#ffd166;font-size:8px;font-weight:900;letter-spacing:.16em}.race-status>strong{display:block;margin-top:4px;font:800 18px "Space Grotesk",sans-serif}.race-status>small{display:block;margin-top:2px;color:#a9b7ca;font-size:9px}.race-hud-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:9px}.race-hud-grid span{display:grid;padding:5px 3px;border:1px solid rgba(255,255,255,.08);border-radius:7px;color:#7e8da3;font-size:6px;letter-spacing:.08em}.race-hud-grid b{margin-top:2px;color:#fff;font-size:10px}.race-boost{height:6px;margin-top:7px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}.race-boost span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#55e6dc,#ffd166);transition:width .12s linear}.race-status ol{display:grid;gap:2px;max-height:98px;margin:8px 0 0;padding:0;overflow:auto;list-style:none}.race-status li{display:grid;grid-template-columns:28px 1fr auto;align-items:center;padding:3px 7px;border-radius:6px;background:rgba(255,255,255,.035);font-size:8px;text-align:left}.race-status li.me{background:rgba(255,209,102,.14);color:#ffd166}.race-status li small{font-size:7px;color:#9dabc0}@media(max-width:760px){body.game-active .race-status{top:max(8px,env(safe-area-inset-top));width:min(310px,calc(100vw - 300px));min-width:170px;padding:7px 9px}.race-status>strong{font-size:11px}.race-status>small,.race-status ol{display:none}.race-hud-grid{margin-top:5px}.race-hud-grid span{padding:3px 2px}.race-hud-grid b{font-size:8px}}