.snake-game__options{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr);gap:18px;margin-bottom:18px}
.snake-option{display:flex;flex-direction:column;gap:8px;color:#f5edff;font-size:14px;font-weight:700}
.snake-option__label{display:flex;justify-content:space-between;gap:10px}.snake-option output{color:#ffe56e;font-variant-numeric:tabular-nums}
.snake-option input[type=range]{width:100%;accent-color:#f748b2;min-height:28px;cursor:pointer}
.snake-option select,.snake-rank__filters select{min-height:44px;border:1px solid #82609e;border-radius:10px;padding:8px 12px;background:#221540;color:#fff;font:inherit;color-scheme:dark}
.snake-option small{font-size:11px;color:#bcb5d6;font-weight:400}.snake-option:has(:disabled){opacity:.65}
.snake-game__hud{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;min-height:38px;margin-bottom:10px;font-size:12px;color:#c7c1df}
.snake-game__hud strong{color:#83e8ff}.snake-game__hud [data-bonus-active=true]{color:#ffe56e}
.snake-game .snake-game__screen{max-width:min(100%,max(300px,calc((100dvh - var(--persistent-interface-height,112px) - 210px)*1.6667)));margin-inline:auto}
.snake-game__panel{flex-wrap:wrap}.snake-game__help{max-width:300px}.snake-game__message{pointer-events:none}
.snake-game__message .snake-countdown{font-size:clamp(42px,7vw,75px);color:#81e8ff;font-weight:900;line-height:1}
.snake-game__sound{display:flex;align-items:center;gap:7px;color:#d9cfea;font-size:12px}.snake-game__sound input{accent-color:#ec4cab;width:18px;height:18px}
.snake-results,.snake-rank,.snake-achievements{max-width:900px;margin:18px auto 0;padding:20px;border:1px solid #ffffff28;border-radius:22px;background:#130b32dd;color:#f6eeff}
.snake-results__identity,.snake-results__note,.snake-rank__note{font-size:13px;color:#c8bedc;line-height:1.6;margin:8px 0 12px}
.snake-results__buttons{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.snake-results__buttons a{color:#9deaff;text-decoration:underline;text-underline-offset:4px}
.snake-status{min-height:24px;font-size:13px;line-height:1.5;margin:10px 0 0;color:#a9e8dd}.snake-status.is-error{color:#ffb5be}
.snake-rank__heading{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.snake-rank h3,.snake-achievements h3{margin:0;font-size:22px}
.snake-rank__filters{display:flex;gap:8px;flex-wrap:wrap}.snake-rank__filters button[aria-pressed=true]{border-color:#f686c9;background:#71305c88}
.snake-rank__table-wrap{overflow:auto;margin-top:12px}.snake-rank table{width:100%;border-collapse:collapse;text-align:left;min-width:430px;font-size:14px}
.snake-rank th{color:#b8afcf;font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:10px 12px}.snake-rank td{padding:13px 12px;border-top:1px solid #ffffff12;overflow-wrap:anywhere}
.snake-rank td:first-child{width:55px;font-weight:900;color:#ffdf71}.snake-rank tr.is-mine{background:#79285e35}.snake-rank td:last-child{font-weight:900;color:#82e9fa;font-variant-numeric:tabular-nums}.snake-rank small{display:block;color:#b4aaca;font-size:11px;margin-top:4px}
.snake-achievements__list{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 0;padding:0;list-style:none}.snake-achievements li{flex:1 1 160px;padding:12px;border:1px solid #665077;border-radius:12px;color:#a99fba;font-size:13px;line-height:1.5}
.snake-achievements li.is-earned{color:#ffe8a0;border-color:#e4b14e88;background:#a2751022}.snake-achievements strong{display:block}.snake-achievements small{display:block;font-size:11px}
.snake-game-section details.snake-rules{max-width:900px;margin:18px auto;color:#c8bedc;font-size:13px;line-height:1.7}.snake-rules summary{cursor:pointer;color:#9fe7ff}.snake-rules a{color:#9fe7ff}.snake-rules ul{padding-left:22px}
.snake-delete-dialog{max-width:430px;padding:24px;border:1px solid #986cae;border-radius:20px;background:#190f35;color:#f6eeff}.snake-delete-dialog::backdrop{background:#030016bb}.snake-delete-dialog h3{margin-top:0}.snake-delete-dialog p{line-height:1.6;color:#d5cce7}
.snake-game-section [hidden]{display:none!important}.snake-game-section button:focus-visible,.snake-game-section select:focus-visible,.snake-game-section a:focus-visible,.snake-game-section input:focus-visible{outline:3px solid #94eaff;outline-offset:3px}
.snake-chat-profile-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 18px}.snake-chat-profile-actions span{font-size:12px;line-height:1.5;color:#b8c5e2}.snake-chat-profile-actions button{border:1px solid #7866b4;border-radius:10px;min-height:42px;padding:8px 12px;background:#32255c;color:#fff;font:inherit;cursor:pointer}.snake-chat-profile-actions button:focus-visible{outline:3px solid #94eaff;outline-offset:3px}
@media(max-width:600px){.snake-game__options{grid-template-columns:1fr;gap:12px}.snake-rank,.snake-results,.snake-achievements{padding:16px;border-radius:18px}.snake-rank h3,.snake-achievements h3{font-size:20px}.snake-rank td,.snake-rank th{padding:10px 8px}.snake-game__buttons{justify-content:center}.snake-game__hud{font-size:11px}.snake-achievements li{flex-basis:130px}.snake-rank__filters{width:100%}.snake-rank__filters button{flex:1}.snake-game__help{max-width:none}.snake-game__message{padding:12px}.snake-game__message p{font-size:12px}.snake-game__ruby{font-size:38px;margin-bottom:8px}.snake-game__message strong{font-size:24px}}
@media(prefers-reduced-motion:reduce){.snake-game__ruby{animation:none}.snake-game__button{transition:none}}

/* Compact game shell. Everything secondary stays inside one modal. */
.snake-game-heading__description{max-width:620px}
.snake-game__toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;color:#d3c9e8;font-size:13px}
.snake-menu-open{border-color:#b064a8!important;background:linear-gradient(120deg,#58205d,#242455)!important}
.snake-game__panel{justify-content:space-between;gap:12px}
.snake-game__buttons{flex-wrap:wrap}
.snake-menu{box-sizing:border-box;width:min(760px,calc(100vw - 28px));max-width:760px;max-height:min(85dvh,820px);padding:0;border:1px solid #b87ed075;border-radius:26px;color:#f8f0ff;background:radial-gradient(ellipse at 0 0,#4e205866,transparent 60%),#120d29;box-shadow:0 30px 100px #000b;overflow:hidden}
.snake-menu[open]{display:flex;flex-direction:column;animation:snake-menu-in .2s ease-out}
.snake-menu::backdrop{background:#05041bc9;backdrop-filter:blur(7px)}
body:has(#snakeMenu[open]){overflow:hidden}
.snake-menu__header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:22px 24px 16px}
.snake-menu__header h2{margin:5px 0 0;font-size:24px;line-height:1.2}
.snake-menu__header .snake-game-heading__label{font-size:10px;margin:0;letter-spacing:.12em;color:#e28cc3}
.snake-menu__close{flex-shrink:0;width:42px;height:42px;border:1px solid #a37ca755;border-radius:50%;background:#ffffff08;color:#f5dff5;font-size:20px;cursor:pointer}
.snake-menu__close:hover{background:#b6418940}
.snake-menu__tabs{display:flex;flex-shrink:0;gap:4px;padding:0 20px 12px;border-bottom:1px solid #ffffff12;overflow-x:auto}
.snake-menu__tabs button{flex:1;white-space:nowrap;border:1px solid transparent;border-radius:12px;padding:11px 13px;background:transparent;color:#b6abc9;font:inherit;font-size:13px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.snake-menu__tabs button[aria-selected=true]{color:#fff;border-color:#b868b65c;background:linear-gradient(120deg,#84285b66,#6444a333);box-shadow:inset 0 -2px #e563b4}
.snake-menu__content{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#704574 transparent;min-height:0;padding:22px 24px}
.snake-menu__content h3{margin:0 0 12px;font-size:21px}
.snake-menu__content .snake-results,.snake-menu__content .snake-rank,.snake-menu__content .snake-achievements{border:0;background:transparent;padding:0;margin:0;border-radius:0}
.snake-menu__content .snake-rank{margin-top:25px;padding-top:22px;border-top:1px solid #ffffff14}
.snake-menu__content .snake-rules{margin:0;color:#d3c9e3;font-size:14px;line-height:1.7}
.snake-menu__content .snake-rules li+li{margin-top:10px}
.snake-menu__footer{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #ffffff12;padding:12px 24px;color:#aa9fbe;font-size:11px;background:#100b22}
.snake-menu-settings output{display:block;color:#89e4f2;font-size:14px;margin:20px 0 12px}
.snake-speed-picker{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;margin-bottom:24px}
.snake-speed-picker button{position:relative;min-height:68px;border:1px solid #71547e77;border-radius:12px;padding:10px 2px;background:#ffffff05;color:#c3b3d6;cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}
.snake-speed-picker b{display:block;font-size:20px;font-weight:800}.snake-speed-picker span{display:block;font-size:8px;margin-top:5px;min-height:10px}
.snake-speed-picker button[aria-pressed=true]{color:#fff;background:linear-gradient(145deg,#c74496,#582c98);border-color:#ef9cd6;box-shadow:0 5px 20px #e74aaa30;transform:translateY(-3px)}
.snake-speed-picker button:hover:not(:disabled){border-color:#94eaff;transform:translateY(-3px)}
.snake-mode-picker{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.snake-mode-picker button{position:relative;isolation:isolate;display:grid;grid-template-columns:42px 1fr;align-items:center;gap:5px 10px;padding:20px;text-align:left;border:1px solid #74528280;border-radius:18px;background:#ffffff04;color:#b9a9cd;cursor:pointer;overflow:hidden;transition:border-color .25s,box-shadow .25s,color .25s}
.snake-mode-picker button::before{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(120deg,#9c306e55,#493b9233);opacity:0;transform:translateX(-30%);transition:opacity .3s,transform .3s}
.snake-mode-picker button[aria-pressed=true]{color:#fff;border-color:#d985bf;box-shadow:inset 0 0 25px #d34a8d15,0 5px 20px #0002}
.snake-mode-picker button[aria-pressed=true]::before{opacity:1;transform:translateX(0)}
.snake-mode-picker strong{font-size:16px}.snake-mode-picker small{font-size:11px;grid-column:2;line-height:1.5}.snake-mode-icon{grid-row:span 2;font-size:32px;color:#80dfed;text-align:center}
.snake-mode-picker button:disabled,.snake-speed-picker button:disabled{cursor:default;opacity:.6}
.snake-game__sound{display:flex;justify-content:space-between;align-items:center;padding:18px;margin-top:20px;border-radius:16px;background:#ffffff06;border:1px solid #ffffff10}
.snake-game__sound strong{font-size:15px;color:#f1e7fa}.snake-game__sound small{display:block;margin-top:5px;font-size:11px;color:#a99dbb}
.snake-game__sound input{appearance:none;position:relative;flex-shrink:0;width:46px;height:26px;margin-left:10px;border-radius:20px;border:1px solid #897193;background:#392a48;cursor:pointer;transition:background .2s}
.snake-game__sound input::after{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;background:#d3c5e0;border-radius:50%;transition:transform .2s,background .2s}
.snake-game__sound input:checked{background:#a53c87;border-color:#e282bd}.snake-game__sound input:checked::after{transform:translateX(20px);background:white}
.snake-volume-control{margin:15px 0;padding:16px 18px;border:1px solid #ffffff10;border-radius:16px;background:#ffffff04}
.snake-volume-control label{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;color:#e6dcef;font-weight:600}
.snake-volume-control output{margin:0!important;font-size:13px!important;font-variant-numeric:tabular-nums;color:#8fe8f2}
.snake-volume-control input{display:block;width:100%;min-height:32px;margin:9px 0 4px;accent-color:#e365b5;cursor:pointer}
.snake-volume-control small{color:#aa9dbe;font-size:11px;line-height:1.5}
.snake-menu .snake-achievements__list{display:grid;grid-template-columns:1fr 1fr}
.snake-menu .snake-achievements li{padding:16px;min-width:0}
.snake-menu .snake-results__buttons a{font-size:13px}
.snake-delete-dialog{z-index:10}
@keyframes snake-menu-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:600px){.snake-menu{width:calc(100vw - 20px);max-height:88dvh;border-radius:20px}.snake-menu__header{padding:18px 16px 14px}.snake-menu__header h2{font-size:21px}.snake-menu__tabs{padding:0 10px 10px;gap:0}.snake-menu__tabs button{padding:10px 9px;font-size:11px}.snake-menu__content{padding:18px 16px}.snake-menu__footer{padding:10px 16px}.snake-menu__footer span{max-width:130px}.snake-speed-picker{grid-template-columns:repeat(5,1fr);gap:9px}.snake-speed-picker button{min-height:58px}.snake-speed-picker span{font-size:9px}.snake-mode-picker{gap:9px}.snake-mode-picker button{padding:13px;grid-template-columns:28px 1fr;gap:5px}.snake-mode-picker strong{font-size:13px}.snake-mode-picker small{font-size:10px}.snake-mode-icon{font-size:27px}.snake-game__toolbar{font-size:11px}.snake-menu-open{padding:10px 12px!important;font-size:12px!important}.snake-menu .snake-rank table{min-width:0;font-size:12px}.snake-menu .snake-rank th{font-size:9px}.snake-menu .snake-rank th,.snake-menu .snake-rank td{padding:10px 6px}.snake-menu .snake-rank td:first-child{width:32px}.snake-game__buttons .snake-game__button{font-size:11px;padding:10px 12px}.snake-game__hud{gap:8px;justify-content:center}.snake-game-heading__description{font-size:13px}.snake-game__panel{justify-content:center}}
@media(prefers-reduced-motion:reduce){.snake-menu[open]{animation:none}.snake-speed-picker button,.snake-mode-picker button,.snake-mode-picker button::before,.snake-game__sound input,.snake-game__sound input::after{transition:none;transform:none}}
