.games {
  --rs-bg: #090d18; --rs-panel: rgba(18, 25, 45, .94); --rs-line: rgba(255,255,255,.14);
  --rs-text: #f7f9ff; --rs-muted: #aeb9d5; --rs-lime: #7cff79; --rs-mint: #36deb0;
  --rs-purple: #8f63ff; --rs-pink: #ff5fa2; --rs-danger: #ff6b73;
  position: relative; width: min(1180px, 100%); min-height: min(820px, var(--abz-game-stage-height, 92dvh)); margin: 20px auto;
  color: var(--rs-text); background: radial-gradient(circle at 50% 0, #202d57 0, var(--rs-bg) 55%);
  border-radius: 28px; overflow: hidden; isolation: isolate; font-family: Inter, Poppins, system-ui, sans-serif;
  box-shadow: 0 25px 80px rgba(0,0,0,.35); touch-action: manipulation;
}
.games, .games *, .games *::before, .games *::after { box-sizing: border-box; }
.games button, .games input, .games select { font: inherit; }
.games button { color: inherit; }
.games__shell { position: relative; min-height: inherit; }
.games__screen { display: none; min-height: inherit; padding: clamp(24px, 5vw, 64px); }
.games__screen.is-active { display: flex; }
.games__screen:not(.games__screen--arena) { align-items: center; justify-content: center; gap: clamp(28px, 6vw, 80px); }
.games__hero { text-align: center; max-width: 560px; }
.games__eyebrow { margin: 0 0 8px; color: var(--rs-mint); font-weight: 800; text-transform: uppercase; letter-spacing: .13em; font-size: .78rem; }
.games h1, .games h2, .games p { margin-top: 0; }
.games h1, .games__screen--menu h2 { font-size: clamp(3.1rem, 8vw, 6.6rem); line-height: .84; letter-spacing: -.07em; margin-bottom: 20px; }
.games h1 span, .games__screen--menu h2 span { color: var(--rs-lime); }
.games__tagline { color: var(--rs-muted); font-size: clamp(1rem, 2vw, 1.25rem); }
.games__card { width: min(430px, 100%); padding: 28px; background: var(--rs-panel); border: 1px solid var(--rs-line); border-radius: 24px; box-shadow: 0 18px 55px rgba(0,0,0,.3); }
.games label, .games legend { display: block; color: var(--rs-muted); font-size: .88rem; font-weight: 750; }
.games input, .games select { width: 100%; margin-top: 7px; padding: 13px 15px; color: var(--rs-text); background: #11182c; border: 1px solid var(--rs-line); border-radius: 12px; outline: none; }
.games input:focus, .games select:focus, .games button:focus-visible { outline: 3px solid rgba(124,255,121,.5); outline-offset: 2px; }
.games fieldset { border: 0; padding: 0; margin: 24px 0; }
.games__avatars { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; margin-top: 10px; }
.games__avatar { aspect-ratio: 1; display: grid; place-items: center; border: 2px solid transparent; border-radius: 18px; background: #18203a; font-size: 2rem; cursor: pointer; animation: rs-float 2.2s ease-in-out infinite; }
.games__avatar:nth-child(2n) { animation-delay: -.7s; }.games__avatar:nth-child(3n) { animation-delay: -1.2s; }
.games__avatar.is-selected { border-color: var(--rs-lime); background: rgba(124,255,121,.12); transform: translateY(-3px); }
@keyframes rs-float { 50% { transform: translateY(-5px) rotate(3deg); } }
.games__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.games__button, .games__icon-button, .games__tabs button, .games__skill { border: 0; cursor: pointer; }
.games__button { padding: 12px 19px; border-radius: 999px; font-weight: 850; }
.games__button--primary { background: linear-gradient(135deg, var(--rs-lime), var(--rs-mint)); color: #07120d !important; }
.games__button--ghost { background: rgba(255,255,255,.09); }
.games__button--play { min-width: 180px; padding: 17px 38px; font-size: 1.25rem; color: #07120d !important; background: linear-gradient(135deg, var(--rs-lime), var(--rs-mint)); box-shadow: 0 12px 35px rgba(54,222,176,.25); }
.games__field-error { min-height: 1.2em; margin: 7px 0; color: #ff9da3; font-size: .84rem; }
.games__note { min-height: 1.2em; margin: 14px 0 0; color: var(--rs-muted); text-align: center; font-size: .82rem; }
.games__snake-preview { height: 90px; display: flex; align-items: center; justify-content: center; filter: drop-shadow(0 12px 16px rgba(124,255,121,.2)); }
.games__snake-preview i, .games__snake-preview b { width: 42px; height: 42px; margin-left: -8px; border-radius: 50%; background: linear-gradient(145deg, var(--rs-lime), #35bb75); }
.games__snake-preview i:nth-child(odd) { transform: translateY(7px); }.games__snake-preview b { display:grid;place-items:center;color:#10172a;font-size:12px;letter-spacing:4px;width:52px; }
.games__snake-preview--large { transform: scale(1.25); margin: 24px 0; }
.games [data-screen="skills"] { align-items: stretch !important; justify-content: flex-start !important; flex-direction: column; gap: 18px !important; }
.games__screen-header { display:flex;align-items:center;gap:18px; }.games__screen-header h2 { margin:0;font-size:clamp(1.6rem,4vw,2.8rem); }
.games__icon-button { width:45px;height:45px;border-radius:50%;background:rgba(255,255,255,.1);font-weight:900; }
.games__skill-tools { display:grid;grid-template-columns:200px 1fr;gap:16px; }
.games__tabs { display:flex;flex-wrap:wrap;gap:8px; }.games__tabs button { padding:10px 15px;border-radius:999px;background:rgba(255,255,255,.08);font-weight:750; }
.games__tabs button.is-active { color:#08120e;background:var(--rs-lime); }
.games__skill-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;overflow:auto;max-height:390px;padding:2px; }
.games__skill { text-align:left;padding:14px;border-radius:15px;background:#141c33;border:1px solid var(--rs-line); }
.games__skill small { display:block;color:var(--rs-muted);margin-top:3px; }.games__skill.is-selected { border-color:var(--rs-lime);background:rgba(124,255,121,.11); }
.games__skill-footer { display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:auto; }.games__skill-footer span { margin-right:auto;color:var(--rs-muted); }
.games__screen--menu { flex-direction:column; }.games__menu-profile { position:absolute;top:24px;left:28px;display:flex;align-items:center;gap:10px; }.games__menu-profile>span { font-size:2rem; }.games__menu-profile small,.games__menu-profile strong{display:block}.games__menu-tip{position:absolute;bottom:24px;color:var(--rs-muted)}
.games__screen--arena { position:relative;padding:0;overflow:hidden;background:#080d17; }
.games__screen--arena.is-active { display:block; }
.games canvas { display:block;width:100%;height:min(820px,92vh);touch-action:none;cursor:crosshair; }
.games__hud { position:absolute;inset:14px 14px auto;display:flex;align-items:center;gap:10px;pointer-events:none; }
.games__hud>div { min-width:84px;padding:9px 12px;border:1px solid var(--rs-line);background:rgba(8,13,23,.78);backdrop-filter:blur(8px);border-radius:14px; }
.games__hud small,.games__hud strong{display:block}.games__hud small{color:var(--rs-muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.games__hud-player{display:flex!important;align-items:center;gap:8px}.games__hud-player span{font-size:1.55rem}.games__hud .games__icon-button{margin-left:auto;pointer-events:auto}
.games__boost-meter { position:absolute;left:18px;bottom:18px;width:180px;height:9px;background:rgba(255,255,255,.15);border-radius:999px;overflow:hidden; }.games__boost-meter span{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--rs-pink),var(--rs-lime));}
.games__arena-hint { position:absolute;bottom:12px;left:50%;transform:translateX(-50%);padding:8px 14px;background:rgba(8,13,23,.7);border-radius:999px;color:var(--rs-muted);font-size:.78rem;white-space:nowrap; }
.games__overlay { position:absolute;z-index:10;inset:0;display:grid;place-items:center;padding:20px;background:rgba(3,6,13,.78);backdrop-filter:blur(8px); }.games__overlay[hidden]{display:none}
.games__modal { width:min(620px,100%);padding:clamp(24px,5vw,42px);border:1px solid var(--rs-line);border-radius:26px;background:#121a30;text-align:center;box-shadow:0 25px 70px #0008; }.games__modal--small{max-width:390px}.games__question{font-size:clamp(1.25rem,3vw,1.8rem);font-weight:800}.games__choices{display:grid;gap:10px;margin:22px 0}.games__choice{padding:14px;border-radius:14px;border:1px solid var(--rs-line);background:#1a2441;cursor:pointer}.games__choice:hover{border-color:var(--rs-lime)}.games__choice:disabled{cursor:default}.games__choice.is-correct{background:#154b39;border-color:var(--rs-lime)}.games__choice.is-wrong{background:#522335;border-color:var(--rs-danger)}.games__feedback{min-height:1.5em;font-weight:750}
.games__screen--results { flex-direction:column;text-align:center; }.games__screen--results h2{font-size:clamp(2.3rem,6vw,4.6rem);margin-bottom:10px}.games__result-avatar{font-size:4rem;animation:rs-float 2s ease-in-out infinite}.games__results-grid{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:10px;width:min(680px,100%)}.games__results-grid>div{padding:18px;background:var(--rs-panel);border:1px solid var(--rs-line);border-radius:18px}.games__results-grid small,.games__results-grid strong{display:block}.games__results-grid small{color:var(--rs-muted)}.games__results-grid strong{font-size:1.6rem;margin-top:4px}
@media (max-width:760px){.games{min-height: var(--abz-game-stage-height, 100dvh);margin:0;border-radius:0}.games__screen:not(.games__screen--arena){flex-direction:column;padding:22px}.games__skill-tools{grid-template-columns:1fr}.games__skill-footer{flex-wrap:wrap}.games__skill-footer span{width:100%}.games__hud{gap:5px}.games__hud>div{min-width:0;padding:7px 8px}.games__hud-player strong{display:none}.games__arena-hint{display:none}.games__results-grid{grid-template-columns:repeat(2,1fr)}.games canvas{height: var(--abz-game-stage-height, 100dvh)}}
@media (prefers-reduced-motion:reduce){.games *{scroll-behavior:auto!important}.games__avatar,.games__result-avatar{animation:none}}
