.gx-snake{--sb-mint:#7be5b3;--sb-gold:#f7d591;--sb-ink:#071b22;max-width:820px;margin:24px auto;padding:22px;color:#e4f3ef;background:linear-gradient(145deg,#102b32,#081a22 65%);border:1px solid #365a60;border-radius:18px;font:15px/1.6 system-ui,-apple-system,sans-serif;box-shadow:0 15px 40px #091f2522;box-sizing:border-box}.gx-snake *{box-sizing:border-box}.gx-snake button,.gx-snake select{font:inherit;color:inherit}.gx-snake button{min-height:44px;padding:9px 15px;border:1px solid #47636b;border-radius:8px;background:#17363f;cursor:pointer;touch-action:manipulation;font-weight:700}.gx-snake button:disabled{opacity:.45;cursor:default}.gx-snake button:hover:not(:disabled){background:#25505a}.gx-snake button:focus-visible,.gx-snake select:focus-visible,.gx-snake summary:focus-visible,.sb-stage:focus-visible{outline:3px solid var(--sb-gold);outline-offset:3px}.sb-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.sb-brand{font-family:Arial,sans-serif;font-size:34px;font-weight:950;letter-spacing:-1.8px;line-height:1.05;color:#f3e8c6}.sb-brand span{color:var(--sb-mint)}.sb-head small{display:block;letter-spacing:3px;font-size:10px;margin-top:6px;color:#a8cbbf}.sb-head p{font-size:12px;color:#b6ccc9;margin:0!important}.sb-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.sb-modes button{font-size:13px;padding:10px 5px;border-color:#30505a}.sb-modes button[aria-pressed=true]{color:#071f24;background:var(--sb-mint);border-color:var(--sb-mint)}.sb-settings{display:flex;align-items:center;gap:8px;margin:12px 0}.sb-settings label{font-size:11px;color:#b9d1d0;display:flex;align-items:center;gap:8px;margin-right:auto}.sb-settings select{background:#142f39;border:1px solid #47636b;border-radius:6px;min-height:44px;padding:7px;font-size:13px;max-width:185px}.sb-settings button{font-size:12px;padding:8px 12px}.sb-hud{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:10px 13px;background:#071820;border:1px solid #315059;border-radius:10px 10px 0 0}.sb-hud>div{display:flex;flex-direction:column}.sb-hud span{font-size:10px;color:#9ebeba;letter-spacing:1px}.sb-hud strong{font-size:22px;line-height:1.35;font-variant-numeric:tabular-nums;color:#f6edcf}.sb-stage{position:relative;width:100%;aspect-ratio:1;background:#071b22;border:1px solid #315059;outline:none;overflow:hidden}.sb-stage canvas{display:block;width:100%!important;height:100%!important;max-width:none;object-fit:contain;touch-action:none}.sb-overlay{position:absolute;inset:0;background:#061a227a;display:flex;overflow:auto;padding:18px}.sb-overlay[hidden]{display:none}.sb-card{margin:auto;width:420px;max-width:100%;padding:25px 24px;background:#0b242df5;border:1px solid #6d9794;border-radius:14px;text-align:center;box-shadow:0 14px 40px #0006;flex-shrink:0}.sb-card small{font-size:11px;letter-spacing:2px;color:var(--sb-mint)}.gx-snake .sb-card h3{background:none!important;border:0!important;color:#f8ebc8!important;font-size:27px!important;line-height:1.4!important;padding:0!important;margin:10px 0!important}.gx-snake .sb-card h3:before,.gx-snake .sb-card h3:after{display:none!important}.gx-snake .sb-card p{font-size:13px!important;line-height:1.8!important;color:#c2d4d2;margin:9px 0!important}.sb-card button{display:block;width:100%;margin-top:10px;font-size:14px}.sb-card button.sb-primary{background:var(--sb-gold);color:#162c32;border-color:var(--sb-gold)}.sb-card button.sb-primary:hover{background:#ffe6b8}.sb-card .sb-score{font-size:48px;font-weight:850;color:var(--sb-gold);line-height:1.2;margin:12px 0;font-variant-numeric:tabular-nums}.sb-result-grid{display:flex;gap:18px;justify-content:center;font-size:11px;color:#b7cfca}.sb-result-grid b{display:block;color:#e7f7ed;font-size:22px}.sb-view-return{display:block;margin:10px auto}.sb-view-return[hidden]{display:none}.sb-gauges{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:12px 0}.sb-gauges label{display:flex;justify-content:space-between;color:#c5ded3;font-size:11px;gap:6px}.sb-track{height:5px;border-radius:4px;background:#25404a;margin-top:4px;overflow:hidden}.sb-track i{display:block;height:100%;width:0;background:var(--sb-mint)}.sb-gauges>div:last-child i{background:#7adaf5}.sb-controls{display:grid;grid-template-columns:180px 1fr;align-items:center;gap:22px;margin:16px 0 10px}.sb-dpad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,48px);gap:5px}.sb-dpad button{padding:0;font-size:22px;user-select:none;touch-action:none}.sb-dpad [data-dir="0"]{grid-column:2}.sb-dpad [data-dir="3"]{grid-column:1;grid-row:2}.sb-dpad [data-dir="2"]{grid-column:2;grid-row:2}.sb-dpad [data-dir="1"]{grid-column:3;grid-row:2}.sb-brake{width:100%;min-height:70px!important;touch-action:none!important;user-select:none;background:#173e49!important;border-color:#6eafc1!important;color:#d2f2fb!important}.sb-brake[aria-pressed=true]{background:#30687a!important;box-shadow:inset 0 0 15px #96e1ff44}.sb-brake span{display:block;font-size:10px;font-weight:400;color:#a9c6cf}.sb-status{min-height:3.5em!important;margin:8px 0!important;font-size:12px;line-height:1.7;color:#b6d4cc}.sb-info{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px;padding-top:14px;border-top:1px solid #31505a}.sb-info span{font-size:11px;color:#b7ceca;line-height:1.6}.sb-info b{display:block;color:#f7d591;font-size:12px}.sb-info span:nth-child(2) b{color:#80dff4}.sb-info span:nth-child(3) b{color:#c9a3ff}.sb-guide{margin-top:13px;border-top:1px solid #31505a;padding-top:8px;font-size:12px;color:#b4cdc7}.sb-guide summary{cursor:pointer;min-height:44px;padding:9px 0}.sb-guide p{font-size:12px!important;line-height:1.9!important;margin:8px 0!important}.sb-best{font-size:11px;color:#a8c9c0;margin:6px 0;text-align:right}.sb-note{color:#b9d2d1;font-size:11px}.sb-stage:has(.sb-overlay:not([hidden])){min-height:430px}
@media(max-width:600px){.gx-snake{padding:13px 10px;border-radius:12px;margin:12px auto}.sb-head{margin-bottom:12px}.sb-brand{font-size:29px}.sb-head p{display:none}.sb-modes button{font-size:11px;min-height:44px}.sb-settings{gap:5px}.sb-settings label{gap:4px;font-size:10px}.sb-settings select{font-size:11px;max-width:140px;padding:6px}.sb-settings button{font-size:10px;padding:6px 8px}.sb-hud{padding:9px 10px}.sb-hud strong{font-size:19px}.sb-hud span{font-size:9px}.sb-stage:has(.sb-overlay:not([hidden])){aspect-ratio:auto;width:100%;min-height:0;height:450px}.sb-overlay{padding:10px}.sb-card{padding:18px 12px}.gx-snake .sb-card h3{font-size:22px!important}.gx-snake .sb-card p{font-size:12px!important;line-height:1.7!important}.sb-card button{font-size:12px;min-height:44px;padding:8px}.sb-card .sb-score{font-size:35px}.sb-result-grid{gap:16px}.sb-result-grid b{font-size:19px}.sb-controls{grid-template-columns:155px 1fr;gap:12px;margin-top:12px}.sb-dpad{grid-template-rows:repeat(2,47px)}.sb-brake{font-size:12px!important;padding:8px!important}.sb-brake span{font-size:9px}.sb-info span{font-size:10px}.sb-info b{font-size:11px}.sb-gauges{gap:12px}.sb-gauges label{font-size:10px}}
@media(max-width:359px){.sb-settings{flex-wrap:wrap}.sb-settings label{width:100%;justify-content:space-between}.sb-settings select{max-width:none;flex:1}.sb-settings button{flex:1}.sb-controls{grid-template-columns:145px 1fr;gap:9px}.sb-brake{font-size:11px!important}.sb-card small{font-size:9px}.sb-result-grid{gap:13px}}
@media(prefers-reduced-motion:reduce){.gx-snake *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

@media(min-width:701px){
.gx-snake{display:grid;grid-template-columns:minmax(0,1fr) 180px;column-gap:16px}
.sb-head{grid-column:1/-1;grid-row:1}.sb-modes{grid-column:1/-1;grid-row:2}.sb-settings{grid-column:1/-1;grid-row:3}
.sb-stage{grid-column:1;grid-row:4/10;align-self:start}.sb-hud{grid-column:2;grid-row:4;grid-template-columns:1fr;border:1px solid #315059;border-radius:10px;padding:10px;gap:10px;align-self:start}
.sb-hud>div{flex-direction:row;align-items:center;justify-content:space-between;gap:4px}.sb-hud strong{font-size:20px}.sb-hud span{font-size:10px;letter-spacing:0}
.sb-gauges{grid-column:2;grid-row:5;display:block;margin:12px 0}.sb-gauges>div+div{margin-top:12px}.sb-gauges label{font-size:10px}
.sb-controls{grid-column:2;grid-row:6;display:block;margin:0}.sb-brake{margin-top:10px}.sb-status{grid-column:2;grid-row:7;margin:8px 0!important}.sb-best{grid-column:2;grid-row:8;text-align:left}.sb-view-return{grid-column:2;grid-row:9;margin:8px 0;font-size:12px}.sb-info{grid-column:1/-1;grid-row:10}.sb-guide{grid-column:1/-1;grid-row:11}
.sb-overlay{padding:10px}.sb-card{padding:18px 12px}.gx-snake .sb-card h3{font-size:23px!important}.sb-card .sb-score{font-size:39px}.sb-card p{font-size:12px!important}.sb-card button{font-size:12px}
}