:root{--bg:#0c1418;--panel:#142127;--lime:#c6f66b;--text:#f3f5ec;--muted:#94a5ad}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font:16px 'DM Sans',Arial,sans-serif}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--lime);outline-offset:5px}button{color:inherit}#arena{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:none}.vignette{position:fixed;inset:0;background:linear-gradient(90deg,rgba(7,14,18,.92),transparent 67%);pointer-events:none;transition:opacity .5s}body.playing .vignette{opacity:0}header{position:absolute;top:0;left:0;right:0;height:116px;padding:36px 4%;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-size:18px;font-weight:700;letter-spacing:1px;pointer-events:auto}.brand-mark{width:43px;height:43px;border:2px solid var(--lime);border-radius:12px;color:var(--lime);display:grid;place-items:center;font-style:italic;font-size:30px;font-weight:800;transform:rotate(-8deg)}.brand-light{color:var(--muted);font-weight:400}.brand small{display:block;font-size:10px;letter-spacing:3px;margin-top:5px;color:var(--muted)}.session-label{margin-right:250px;font-size:12px;letter-spacing:1.7px;color:#a7b6bd}.session-label span{margin:0 12px;color:var(--lime)}.welcome{position:absolute;left:8%;top:50%;transform:translateY(-46%);width:340px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--lime);display:flex;align-items:center;gap:9px}.eyebrow>span{width:6px;height:6px;background:var(--lime);border-radius:50%}h1{font:900 clamp(74px,7.6vw,112px)/.83 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:-3px;margin:23px 0 24px}h1>span{font-size:.72em;color:var(--lime);letter-spacing:-4px;margin-left:4px}.title-dot{color:#f5ad72}.intro{font-size:17px;line-height:1.7;color:#aabbc2;margin:0 0 27px}label,legend{font-size:11px;letter-spacing:1.7px;color:#aabbc2;font-weight:700}.input-wrap{margin:9px 0 19px;display:flex;align-items:center;border:1px solid #38484e;border-radius:9px;background:#172329d9;padding:0 16px}.input-wrap span{color:var(--lime)}input{width:100%;border:0;background:none;color:var(--text);height:49px;outline:none}fieldset{border:0;margin:0 0 25px;padding:0}legend{margin-bottom:12px}.swatches{display:flex;gap:13px}.swatch{height:28px;width:28px;border:4px solid var(--bg);outline:1px solid transparent;border-radius:50%;background:var(--swatch);transition:transform .2s}.swatch[aria-pressed=true]{outline-color:var(--swatch);transform:scale(1.12)}.play-btn{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:9px;padding:17px 21px;background:var(--lime);color:#14201b;font-size:15px;letter-spacing:1px;font-weight:800;box-shadow:0 5px 30px #c6f66b10}.play-btn:hover{background:#dafba4}.play-btn>span:last-child{font-size:25px;line-height:20px}.howto{display:flex;gap:23px;font-size:12px;color:#9dabb1;margin-top:20px;align-items:center}.howto>span{display:flex;align-items:center;gap:7px}kbd{font:10px 'DM Sans',sans-serif;border:1px solid #40505a;border-radius:4px;padding:5px;color:#e1e6e4}.touch-help{display:none;font-size:13px;color:var(--muted)}.menu-foot{display:flex;justify-content:space-between;border-top:1px solid #ffffff10;margin-top:25px;padding-top:16px;color:#637780;font-size:10px;letter-spacing:1.3px}.leaderboard{position:absolute;right:3%;top:35px;width:240px;background:#102026c9;border:1px solid #6d8c9026;border-radius:14px;padding:18px 17px;backdrop-filter:blur(16px)}.panel-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:1.1px;margin-bottom:16px}.trophy{color:var(--lime);font-size:24px;line-height:16px}.leader-row{display:flex;align-items:center;gap:9px;font-size:13px;padding:7px 2px;color:#b6c5c9}.leader-row .position{color:#5f7983;width:16px;font-size:11px}.leader-row .dot{width:6px;height:6px;border-radius:50%;background:var(--color)}.leader-row .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leader-row .points{font-variant-numeric:tabular-nums;font-size:12px}.leader-row.mine{color:var(--lime);border-top:1px solid #ffffff16;margin-top:6px;padding-top:12px}.board-footer{font-size:10px;color:#637e87;border-top:1px solid #ffffff0c;padding-top:12px;margin-top:10px}.arena-caption{position:absolute;left:55%;bottom:24%;display:flex;gap:11px;align-items:center;font-size:10px;letter-spacing:2px;color:#8fa3ab;pointer-events:none}.accent-line{height:1px;width:28px;background:var(--lime)}.radar-wrap{position:absolute;right:3%;bottom:60px;width:144px;text-align:center}.radar-wrap span{font-size:9px;letter-spacing:1.8px;color:#718b95}.radar-wrap canvas{width:144px;height:144px;opacity:.8}footer{position:absolute;bottom:26px;left:4%;right:4%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.5px;color:#637b85}footer i{color:var(--lime);font-style:normal;margin:0 16px}.hud{position:absolute;left:4%;top:126px;display:flex;gap:28px;pointer-events:none}.hud>div{display:flex;flex-direction:column;gap:5px}.hud span{font-size:10px;color:var(--muted);letter-spacing:1.5px}.hud strong{font:700 38px 'Barlow Condensed',sans-serif}.hud>div:first-child strong{color:var(--lime)}.icon-btn{pointer-events:auto;border:1px solid #ffffff33;background:var(--panel);border-radius:10px;height:44px;width:44px;font-size:20px;margin-right:270px}.game-tip{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);font-size:13px;color:#9cafb8;pointer-events:none;white-space:nowrap}.boost{position:absolute;right:5%;bottom:76px;border:1px solid #c6f66b66;background:#162920dc;border-radius:50%;width:83px;height:83px;display:flex;align-items:center;justify-content:center;flex-direction:column;touch-action:none;user-select:none;box-shadow:0 0 30px #c6f66b10}.boost span{font-size:36px;color:var(--lime);line-height:40px}.boost small{font-size:9px;letter-spacing:1px}.boost.active{background:var(--lime);color:#152519;box-shadow:0 0 40px #c6f66b55}.boost.active span{color:#152519}body.playing .radar-wrap{bottom:180px;width:115px}body.playing #radar{width:115px;height:115px}.modal{position:fixed;inset:0;display:grid;place-items:center;background:#071014ad;backdrop-filter:blur(12px);z-index:10;padding:24px}.modal-card{background:#132127;border:1px solid #ffffff20;max-width:410px;width:100%;padding:36px;border-radius:20px}.modal-card h2{font:700 44px/1.1 'Barlow Condensed',sans-serif;margin:15px 0}.modal-card p{color:var(--muted);line-height:1.6;font-size:15px}.result{display:flex;gap:30px;margin:24px 0}.result strong{font-size:32px;color:var(--lime);display:block}.result span{font-size:12px;color:var(--muted)}.text-btn{border:0;background:none;width:100%;padding:18px 0 0;color:#a5b7bc;font-size:14px}.touch-pad{position:fixed;width:110px;height:110px;border:1px solid #ffffff30;border-radius:50%;background:#ffffff08;pointer-events:none}#thumb{position:absolute;width:42px;height:42px;left:33px;top:33px;border-radius:50%;background:#c6f66b66}.hidden{display:none!important}@media(max-height:740px) and (min-width:701px){.welcome{transform:translateY(-43%);width:305px}h1{font-size:78px;margin:17px 0}.intro{margin-bottom:18px;font-size:15px}.menu-foot{margin-top:18px}fieldset{margin-bottom:18px}.howto{margin-top:15px}.welcome .eyebrow{font-size:10px}}
@media(max-width:1000px){.welcome{left:5%}.leaderboard{width:200px}.session-label{display:none}.arena-caption{display:none}.icon-btn{margin-right:215px}.brand{font-size:15px}}
@media(max-width:700px){header{padding:22px 22px;height:82px}.brand-mark{width:34px;height:34px;font-size:24px}.brand{font-size:14px}.brand small{font-size:8px}.welcome{top:50%;left:7%;width:min(340px,86%);transform:translateY(-44%)}h1{font-size:90px}.intro{font-size:16px;margin-bottom:22px}.leaderboard{display:none}.radar-wrap{display:none}.howto{display:none}.touch-help{display:block}.menu-foot{margin-top:20px}footer{bottom:18px;left:7%;right:7%;font-size:9px}footer>span:last-child{display:none}.vignette{background:linear-gradient(90deg,#091216ed,#09121682)}.icon-btn{margin-right:0}.hud{top:92px;left:24px;gap:22px}.hud strong{font-size:30px}.hud span{font-size:9px}.hud .best{display:none}.game-tip{bottom:26px;font-size:11px;max-width:80%;white-space:normal;text-align:center}.boost{right:24px;bottom:76px;width:74px;height:74px}.modal-card{padding:28px}.modal-card h2{font-size:36px}}
@media(max-height:650px){.welcome{top:88px;transform:none;bottom:50px;overflow:auto;padding:4px 6px 8px 0}h1{font-size:65px;margin:12px 0}.intro{font-size:14px;line-height:1.4;margin-bottom:12px}.input-wrap{margin-bottom:12px}.menu-foot{display:none}.howto,.touch-help{margin-top:12px}fieldset{margin-bottom:15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Minimal black-and-gray entrance, without the arena simulation. */
:root{--bg:#050505;--panel:#151515;--muted:#a0a0a0}
body:not(.playing) .brand,body:not(.playing) .session-label,body:not(.playing) .leaderboard,body:not(.playing) .radar-wrap,.welcome>.eyebrow,.welcome>.intro,#arenaCaption,#menuFooter{display:none!important}
body:not(.playing) .vignette{background:radial-gradient(ellipse at 24% 48%,rgba(255,255,255,.035),transparent 62%)}
.input-wrap{background:#151515;border-color:#333}.input-wrap input{background:transparent}
label,legend{color:#aaa}.menu-foot{border-color:#ffffff12;color:#777}.howto,.touch-help{color:#999}
.leaderboard{background:#111111e6;border-color:#333}.icon-btn{background:#151515}.modal-card{background:#151515}.modal{background:#000000ad}

/* v1 menu layout from the supplied sketch. */
body:not(.playing) .vignette{background:radial-gradient(ellipse at 50% 45%,#ffffff04,transparent 65%)}
.welcome{left:50%;top:46%;bottom:auto;transform:translate(-50%,-50%);width:min(660px,62vw);text-align:center;overflow:visible;padding:0}
.welcome h1{font-size:clamp(88px,8vw,126px);margin:0 0 45px;line-height:1;letter-spacing:-3px}
.welcome h1>span{margin-left:8px}.welcome .howto{justify-content:center;margin-top:31px}
.arena-play{position:relative;display:grid;place-items:center;width:100%;height:112px;border:1px solid #3c3c3c;border-radius:70px;background:linear-gradient(180deg,#1b1b1b,#101010);color:var(--lime);box-shadow:inset 0 1px #ffffff08;transition:border-color .2s,background .2s}
.arena-play:hover{border-color:var(--lime);background:#1b1f15}.play-triangle{font-size:47px;line-height:1;margin-left:7px}.play-eyes{position:absolute;right:30px;top:50%;transform:translateY(-50%) rotate(90deg);font-size:32px;letter-spacing:3px;color:#686868}
.mode-options{display:flex;justify-content:center;gap:14px;margin-top:21px}.mode-options button{min-width:102px;height:40px;border-radius:24px;border:1px solid #393939;background:#121212;font-size:14px}.mode-options button[aria-pressed=true]{color:var(--lime);border-color:#c6f66b70;background:#c6f66b0b}.mode-options button:disabled{color:#666;cursor:default;border-color:#262626}
.player-profile{position:absolute;top:34px;left:4%;display:flex;align-items:center;gap:13px}.player-avatar{display:grid;place-items:center;width:57px;height:57px;border-radius:50%;border:1px solid #3b3b3b;background:#171717;font-size:23px;font-weight:700;color:var(--lime)}.profile-name{display:flex;flex-direction:column;gap:5px}.profile-name label{font-size:9px;color:#888;letter-spacing:1.5px}.profile-name input{height:33px;max-width:215px;padding:0 12px;font-size:15px;border:1px solid #333;border-radius:7px;background:#121212;color:#ddd}
.color-picker{position:absolute;top:46%;right:8%;transform:translateY(-50%);padding:0;margin:0;border:0}.color-picker legend{position:absolute;white-space:nowrap;top:-31px;left:50%;transform:translateX(-50%);font-size:9px;color:#777;letter-spacing:1px}.color-picker .swatches{flex-direction:column;gap:17px}.color-picker .swatch{width:30px;height:30px;background:var(--swatch);border-width:5px}.version-label{position:absolute;right:28px;bottom:25px;font-size:12px;color:#777;letter-spacing:1px}body.playing .player-profile,body.playing .color-picker,body.playing .version-label{display:none}
@media(max-width:700px){.player-profile{top:24px;left:24px;gap:10px}.player-avatar{width:45px;height:45px;font-size:20px}.profile-name input{max-width:168px;font-size:14px}.welcome{left:50%;top:46%;width:82vw;transform:translate(-50%,-50%);bottom:auto;overflow:visible}.welcome h1{font-size:82px;margin-bottom:28px}.arena-play{height:88px}.play-triangle{font-size:38px}.play-eyes{right:23px;font-size:26px}.color-picker{top:auto;bottom:18%;right:50%;transform:translateX(50%)}.color-picker .swatches{flex-direction:row;gap:15px}.color-picker legend{top:-26px}.touch-help{margin-top:23px;font-size:12px}.version-label{bottom:20px;right:22px}}
@media(max-height:560px){.player-profile{top:15px}.welcome{top:51%;width:52vw}.welcome h1{font-size:64px;margin-bottom:14px}.arena-play{height:70px}.mode-options{margin-top:12px}.welcome .howto,.welcome .touch-help{display:none}.color-picker{top:52%;bottom:auto;right:6%;transform:translateY(-50%)}.color-picker .swatches{flex-direction:column;gap:8px}.color-picker .swatch{width:25px;height:25px}.color-picker legend{display:none}}

/* The selected playable snake is previewed inside the start button. */
.arena-play{overflow:hidden;background:#101010;border-color:#292929}
#snakePreview{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.arena-play .play-triangle{position:relative;z-index:1;display:grid;place-items:center;width:62px;height:62px;margin:0;border-radius:50%;border:1px solid #ffffff45;background:#050505c9;color:#f5f5ed;font-size:30px;padding-left:4px;box-shadow:0 3px 18px #0005}
.arena-play:hover .play-triangle{background:#050505;color:var(--lime)}
@media(max-width:700px){.arena-play .play-triangle{width:53px;height:53px;font-size:26px}}

/* Keep the silhouette on the snake itself, with room for the two eyes. */
.arena-play{background:transparent;border-color:transparent;box-shadow:none;overflow:visible}
.arena-play:hover{background:transparent;border-color:transparent}
.arena-play:focus-visible{outline:2px solid var(--lime);outline-offset:5px}

html,body{touch-action:none;overscroll-behavior:none}
.profile-name input{font-size:16px}

.zoom-control{display:none;position:absolute;left:4%;bottom:32px;align-items:center;gap:10px;padding:5px;border:1px solid #333;border-radius:10px;background:#111d;font-size:13px}.playing .zoom-control{display:flex}.zoom-control button{width:30px;height:30px;border:0;border-radius:6px;background:#242424;font-size:20px}.zoom-control output{min-width:42px;text-align:center;color:#c6f66b}@media(max-width:700px){.zoom-control{left:20px;bottom:80px}}

.profile-country-label{margin-top:5px}
.profile-name select{width:215px;max-width:100%;padding:7px 10px;background:#121212;color:#ddd;border:1px solid #333;border-radius:7px;font:13px Arial,sans-serif}
.profile-name .country-help{max-width:215px;font:10px/1.4 Arial,sans-serif;color:#9b9b9b;margin:0;min-height:14px}
@media(max-width:700px){.profile-name select{width:168px}.profile-name .country-help{max-width:168px}}

.country-toggle{display:flex;align-items:center;gap:9px;width:215px;max-width:100%;min-height:36px;padding:7px 10px;border:1px solid #383838;border-radius:8px;background:#121212;color:#e8e8e8;font:13px Arial,sans-serif;text-align:left}
.country-toggle:after{content:'⌄';margin-left:auto;color:#aaa}.country-toggle:disabled{opacity:.55;cursor:default}.country-toggle img,.country-option img{flex:none;object-fit:contain}.country-option-name{flex:1;min-width:0}.country-toggle small,.country-option small{color:#9c9c9c;font-size:11px}
.country-picker-panel{position:fixed;z-index:9000;display:flex;flex-direction:column;overflow:hidden;padding:10px;background:#141716;border:1px solid #3d463b;border-radius:12px;box-shadow:0 18px 60px #000b;color:#eee;font:14px Arial,sans-serif}
.country-picker-panel[hidden]{display:none}.country-picker-panel input{flex:none;width:100%;height:40px;padding:0 11px;background:#090b0a;border:1px solid #4c5845;border-radius:7px;color:white;font:14px Arial,sans-serif}.country-results{overflow:auto;min-height:0;flex:1;margin-top:7px;scrollbar-color:#45543d #151715}.country-option{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:0;border-radius:6px;background:transparent;padding:10px;color:#e8e8e8;font:13px Arial,sans-serif}.country-option:hover,.country-option:focus-visible{background:#283322}.country-option[aria-pressed=true]{background:#354c26;color:#dcffb9}.country-empty{padding:14px;color:#aaa}
@media(max-width:700px){.country-toggle{width:168px}}

/* Minimal in-game HUD: hide the five overlays removed from the reference. */
.brand,.session-label,.radar-wrap,.zoom-control,#tip{display:none!important}
header{justify-content:flex-end}

/* Align player statistics with the top controls. */
body.playing .hud{top:34px}
#pauseBtn{display:grid;place-items:center;padding:0}
#pauseBtn svg{display:block}
@media(max-width:700px){body.playing .hud{top:22px;gap:18px}}

/* Telegram identity uses the same profile slot as the browser guest. */
.player-avatar{overflow:hidden}.player-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}#nickname[readonly]{cursor:default}

/* Fullscreen controls remain below Telegram's native safe area. */
header{margin-top:var(--snake-safe-top,0px)}
body.playing .hud{margin-top:var(--snake-safe-top,0px)}