/* Safer-Snake (/spiele/safer-snake/) */
.nx-snake-section { background:linear-gradient(135deg,#0c0826,#1b1145 55%,#2a0f3a); }
.nx-snake { position:relative; width:100%; height:min(74vh,700px); min-height:420px; margin:0 0 12px; overflow:hidden; border-radius:18px; background:#0a0720; box-shadow:0 0 0 1px #6f6a9c, 0 18px 50px #0008; touch-action:none; user-select:none; -webkit-user-select:none; }
.nx-snake__canvas { display:block; width:100%; height:100%; transition:filter .4s; }
.nx-snake.is-mirror .nx-snake__canvas { outline:3px solid #b06cff88; outline-offset:-3px; }
.nx-snake__vignette { position:absolute; inset:0; pointer-events:none; opacity:0; background:radial-gradient(ellipse at 50% 55%, transparent 22%, #000000 70%); transition:opacity .6s; z-index:1; }
.nx-snake__hud { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 6px; }
.nx-snake__pill { margin:0; padding:4px 10px; border-radius:999px; background:#140a2bd9; color:#fff; font-size:13px; font-weight:800; box-shadow:0 0 0 1px #ffffff33; }
.nx-snake__tracker { position:absolute; top:10px; left:10px; max-width:min(60%,440px); margin:0; z-index:2; pointer-events:none; }
.nx-snake__status { margin:0; padding:8px 12px; border-radius:12px; background:#140a2be6; color:#fff; font-size:13px; line-height:1.45; box-shadow:0 0 0 1px #46f5c066; }
.nx-snake__status strong { display:block; color:#46f5c0; font-size:13px; }
.nx-snake__status span { display:block; }
.nx-snake__tracker:focus { outline:none; }
.nx-games .is-app-window .nx-knowledge .nx-snake__tracker[data-knowledge-question] { padding:0; border:0; background:none; }
.nx-snake__tip { position:absolute; left:10px; right:10px; bottom:12px; margin:0 auto; max-width:620px; padding:10px 14px; border-radius:14px; background:#0e3b31f0; color:#eafff7; font-size:14px; line-height:1.45; box-shadow:0 0 0 1px #46f5c099, 0 8px 22px #0007; opacity:0; transform:translateY(10px); transition:opacity .3s, transform .3s; pointer-events:none; z-index:2; }
.nx-snake__tip.is-on { opacity:1; transform:none; }
.nx-snake__tip strong { color:#46f5c0; }
.nx-snake__toast { position:absolute; left:50%; top:40%; transform:translate(-50%,-10px) scale(.9); padding:8px 18px; border-radius:999px; background:#ffffff; color:#1a1033; font-weight:900; font-size:20px; opacity:0; transition:opacity .2s, transform .2s; pointer-events:none; z-index:3; }
.nx-snake__toast.is-on { opacity:1; transform:translate(-50%,0) scale(1); }
.nx-snake__toast.is-ok { background:#46f5c0; color:#06261e; }
.nx-snake__loading { position:absolute; inset:0; display:grid; place-items:center; margin:0; color:#e9e5ff; font-weight:800; background:#0a0720; z-index:4; }
.nx-snake__loading[hidden] { display:none; }
.nx-snake__touch { position:absolute; right:12px; bottom:12px; display:grid; grid-template-columns:repeat(3,52px); grid-template-rows:repeat(2,52px); gap:6px; z-index:3; }
.nx-snake__touch[hidden] { display:none; }
.nx-snake__pad { width:52px; height:52px; padding:0; border:2px solid #ffffff88; border-radius:14px; background:#140a2bd9; color:#fff; font:inherit; font-size:20px; font-weight:900; touch-action:none; }
.nx-snake__pad:active { background:#7c2bd9; }
.nx-snake__pad--up { grid-column:2; grid-row:1; }
.nx-snake__pad--left { grid-column:1; grid-row:2; }
.nx-snake__pad--down { grid-column:2; grid-row:2; }
.nx-snake__pad--right { grid-column:3; grid-row:2; }
.nx-snake__touch:not([hidden]) ~ .nx-snake__tip { right:186px; }
.nx-snake__dialog { position:absolute; left:0; right:0; bottom:0; max-height:86%; overflow:auto; padding:16px 18px 18px; border-top:4px solid var(--nx-snake-accent,#46f5c0); border-radius:18px 18px 0 0; background:#130c30f5; color:#fff; box-shadow:0 -10px 30px #0008; z-index:5; overscroll-behavior:contain; }
.nx-snake__dialog[hidden] { display:none; }
.nx-snake__dialog h3 { margin:2px 0 8px; color:#fff !important; -webkit-text-fill-color:#fff !important; font-size:22px; }
.nx-snake__dialog h4 { margin:4px 0 6px; color:#fff !important; -webkit-text-fill-color:#fff !important; font-size:17px; }
.nx-snake__dialog a { display:inline-block; margin:8px 0 4px; color:#9ee8ff !important; font-weight:800; }
.nx-snake__dialog .nx-games__button { display:block; width:100%; margin-top:12px; }
.nx-snake__eyebrow { margin:0; color:var(--nx-snake-accent,#46f5c0); font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.nx-snake__say { margin:0 0 8px; line-height:1.55; color:#ece8ff; }
.nx-snake__card-row { margin:0 0 8px; padding:8px 12px; border-radius:10px; background:#ffffff0d; }
.nx-snake__card-row strong { display:block; color:#cfc8ff; font-size:13px; }
.nx-snake__card-row p { margin:2px 0 0; color:#f2efff; line-height:1.5; }
.nx-snake__card-row.is-game { background:#ffffff14; }
.nx-snake__card-row.is-game strong { color:var(--nx-snake-accent,#46f5c0); }
.nx-snake__card-row.is-warn strong { color:#ffd34d; }
.nx-snake__card-row.is-safer strong { color:#46f5c0; }
.nx-snake__card-row.is-alarm { background:#4a0f1f; box-shadow:inset 3px 0 0 #ff5d7a; }
.nx-snake__card-row.is-alarm strong { color:#ff9aac; }
.nx-snake__mix { margin:12px 0 6px; padding:12px 14px; border:2px solid #ffd34d; border-radius:12px; background:#2a1c05; }
.nx-snake__mix.is-lebensgefahr { border-color:#ff5d7a; background:#3d0b18; }
.nx-snake__mix.is-hoch { border-color:#ff9a3d; background:#3a1d07; }
.nx-snake__mix p { margin:4px 0; line-height:1.5; color:#fff4e6; }
.nx-snake__alarm { font-weight:800; }
.nx-snake__game-note { color:#cfc8ff !important; font-size:14px; }
.nx-snake__keys { margin:4px 0 8px; color:#d8d2ff; font-size:14px; }
.nx-snake-section [data-knowledge-result] { color:#fff; }
.nx-snake-section [data-knowledge-result] h3 { color:#fff !important; -webkit-text-fill-color:#fff !important; }
.nx-snake__result-score { font-size:20px; font-weight:900; color:#46f5c0; }
.nx-snake__learn { margin:12px 0; padding:12px 14px; border-radius:12px; background:#ffffff0d; }
.nx-snake__learn h4 { margin:0 0 6px; color:#fff !important; -webkit-text-fill-color:#fff !important; }
.nx-snake__learn ul { margin:0; padding-left:20px; line-height:1.6; }
.nx-snake__learn a, .nx-snake__links a { color:#9ee8ff !important; font-weight:700; }
.nx-snake__small { font-size:13px; color:#cfc8ff; }
.nx-snake.is-2d .nx-snake__tracker { max-width:calc(100% - 20px); }
@media (max-width:640px) {
  .nx-snake { height:min(68vh,560px); min-height:360px; }
  .nx-snake__tracker { max-width:calc(100% - 20px); }
  .nx-snake__status { font-size:12px; padding:6px 10px; }
  .nx-snake__touch { right:8px; bottom:8px; grid-template-columns:repeat(3,48px); grid-template-rows:repeat(2,48px); }
  .nx-snake__pad { width:48px; height:48px; }
  .nx-snake__touch:not([hidden]) ~ .nx-snake__tip { right:10px; bottom:120px; }
  .nx-snake__dialog h3 { font-size:20px; }
}
@media (prefers-reduced-motion:reduce) { .nx-snake__canvas, .nx-snake__tip, .nx-snake__toast, .nx-snake__vignette { transition:none; } }
.nx-games .is-app-window .nx-snake-section { padding:10px; }
.nx-games .is-app-window .nx-snake { height:calc(100dvh - 190px); min-height:320px; max-height:none; }
.nx-arcade-card[data-game="safersnake"] .nx-arcade-preview-play { color:#b9ffe9; border-color:#46f5c0; }
