:root{--board-w:660px;--board-h:600px;--cell-size:2%;--bg:#ff4500;--board-bg:#fff;--board-border:#707070;--snake-color:#0fb3a3;--snake-color-2:rgba(15,179,163,.75);--snake-head:#0a0a0a;--bait-color:#ff3b3b;--bait-glow:rgba(255,59,59,.35);--obstacle-bg:#4b026d}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#ff4500;background-color:var(--bg);margin:0}h1,h3{font-family:Arial,Helvetica,sans-serif;margin:.4rem 0}.title,h1,h3{text-align:center}.title{background:transparent;border:1px solid rgba(0,0,0,.06);border-radius:10px;box-shadow:0 10px 20px rgba(0,0,0,.04),inset 0 -3px 8px hsla(0,0%,100%,.5);color:#0a0a0a;color:var(--snake-head);display:block;font-family:Poppins,Inter,Arial,Helvetica,sans-serif;font-size:28px;font-weight:800;line-height:1.05;margin:.6rem auto;padding:8px 14px;position:relative;text-shadow:0 6px 12px rgba(0,0,0,.06);width:-webkit-max-content;width:max-content}.title:after{background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.6));border-radius:4px;box-shadow:0 6px 16px rgba(0,0,0,.08);content:"";display:block;height:4px;margin:8px auto 0;max-width:260px;width:48%}@media (max-width:840px){.title{font-size:20px;padding:6px 10px}}button{background-color:#000;border:none;border-radius:6px;color:#fff;cursor:pointer;display:inline-block;font-size:14px;margin-right:16px;margin-top:24px;padding:12px 20px;text-align:center;transition:background .12s ease,-webkit-transform .12s ease;transition:transform .12s ease,background .12s ease;transition:transform .12s ease,background .12s ease,-webkit-transform .12s ease}button:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px)}.game-container{display:flex;justify-content:center;padding:20px}.game-layout{-webkit-backdrop-filter:blur(6px) saturate(120%);backdrop-filter:blur(6px) saturate(120%);background:linear-gradient(180deg,#fbfbfb,#fff 40%,#f2f4f6);background:linear-gradient(180deg,#fbfbfb 0,var(--board-bg) 40%,#f2f4f6 100%);background-clip:padding-box;border:10px solid hsla(0,0%,44%,.85);border-radius:18px;box-shadow:0 20px 50px rgba(12,24,32,.35),inset 0 6px 18px hsla(0,0%,100%,.45),inset 0 -10px 40px rgba(15,179,163,.02);float:left;height:600px;height:var(--board-h);margin:0 100px;overflow:hidden;position:relative;transition:box-shadow .22s ease,-webkit-transform .22s cubic-bezier(.2,.9,.3,1);transition:transform .22s cubic-bezier(.2,.9,.3,1),box-shadow .22s ease;transition:transform .22s cubic-bezier(.2,.9,.3,1),box-shadow .22s ease,-webkit-transform .22s cubic-bezier(.2,.9,.3,1);width:660px;width:var(--board-w)}.game-layout:before{background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 0),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 0),radial-gradient(ellipse at center,rgba(0,0,0,.02),transparent 50%);background-size:2% 2%,2% 2%,100% 100%;background-size:var(--cell-size) var(--cell-size),var(--cell-size) var(--cell-size),100% 100%;content:"";inset:0;mix-blend-mode:multiply;opacity:.65;pointer-events:none;position:absolute}.snake-body-1,.snake-body-2,.snake-head{border-radius:50%;box-shadow:0 4px 6px rgba(0,0,0,.25),inset 0 -6px 10px hsla(0,0%,100%,.06);height:2%;height:var(--cell-size);position:absolute;-webkit-transform-origin:center;transform-origin:center;transition:left .12s linear,top .12s linear,background .14s ease,-webkit-transform .12s linear;transition:transform .12s linear,left .12s linear,top .12s linear,background .14s ease;transition:transform .12s linear,left .12s linear,top .12s linear,background .14s ease,-webkit-transform .12s linear;width:2%;width:var(--cell-size);z-index:2}.snake-body-1{background:linear-gradient(180deg,#0fb3a3,#0b9e8f 60%);background:linear-gradient(180deg,var(--snake-color) 0,#0b9e8f 60%);z-index:2}.snake-body-2{background:linear-gradient(180deg,rgba(15,179,163,.75),rgba(11,158,143,.5) 60%);background:linear-gradient(180deg,var(--snake-color-2) 0,rgba(11,158,143,.5) 60%);opacity:.85;z-index:1}.snake-head{background:radial-gradient(circle at 30% 30%,#555 0,#0a0a0a 50%);background:radial-gradient(circle at 30% 30%,#555 0,var(--snake-head) 50%);box-shadow:0 6px 10px rgba(0,0,0,.45),0 0 10px rgba(0,0,0,.25);height:2%;height:calc(var(--cell-size));width:2%;width:calc(var(--cell-size));z-index:3}.snake-bait,.snake-bait-far{background:radial-gradient(circle at 35% 30%,#fff9,#ff3b3b 40%,#d23232 100%);background:radial-gradient(circle at 35% 30%,#fff9,var(--bait-color) 40%,#d23232 100%);border-radius:50%;box-shadow:0 6px 18px rgba(255,59,59,.35),inset 0 -4px 8px hsla(0,0%,100%,.12);box-shadow:0 6px 18px var(--bait-glow),inset 0 -4px 8px hsla(0,0%,100%,.12);height:2%;height:var(--cell-size);position:absolute;-webkit-transform-origin:center;transform-origin:center;transition:opacity .18s ease,-webkit-transform .18s ease;transition:transform .18s ease,opacity .18s ease;transition:transform .18s ease,opacity .18s ease,-webkit-transform .18s ease;width:2%;width:var(--cell-size);z-index:4}.snake-bait-far{-webkit-filter:blur(.6px);filter:blur(.6px);opacity:.7;-webkit-transform:scale(.9);transform:scale(.9);z-index:2}@-webkit-keyframes bait-pulse{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{-webkit-transform:translateY(-6%) scale(1.08);transform:translateY(-6%) scale(1.08)}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@keyframes bait-pulse{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{-webkit-transform:translateY(-6%) scale(1.08);transform:translateY(-6%) scale(1.08)}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}.snake-bait{-webkit-animation:bait-pulse 1.2s ease-in-out infinite;animation:bait-pulse 1.2s ease-in-out infinite}.snake-bait:after,.snake-bait:before{font-size:10px;left:50%;opacity:0;pointer-events:none;position:absolute;top:-.25rem;-webkit-transform:translateX(-50%) translateY(-40%);transform:translateX(-50%) translateY(-40%);transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease;z-index:6}.snake-bait:focus:before,.snake-bait:hover:before{opacity:1;-webkit-transform:translateX(-50%) translateY(-160%);transform:translateX(-50%) translateY(-160%)}.snake-bait:before{background:rgba(0,0,0,.85);border-radius:.3rem;box-shadow:0 6px 14px rgba(0,0,0,.25);color:#fff;content:attr(data-tooltip);padding:.35rem .5rem;text-align:center;white-space:nowrap}.snake-bait:after{border:8px solid transparent;border-top-color:rgba(0,0,0,.85);content:""}.obstacle{background-color:#4b026d;background-color:var(--obstacle-bg);background-size:cover;border-radius:6px;box-shadow:0 6px 14px rgba(0,0,0,.25);height:2%;height:var(--cell-size);position:absolute;width:2%;width:var(--cell-size)}.information{-webkit-animation:panel-slide .42s cubic-bezier(.2,.9,.3,1) both;animation:panel-slide .42s cubic-bezier(.2,.9,.3,1) both;background:linear-gradient(180deg,hsla(0,0%,100%,.95),hsla(0,0%,96%,.9));border:1px solid rgba(0,0,0,.06);border-radius:12px;box-shadow:0 18px 40px rgba(2,10,20,.25),0 6px 18px rgba(0,0,0,.12),inset 0 1px 0 hsla(0,0%,100%,.6);color:#222;display:flex;flex-direction:column;float:left;gap:12px;margin:0 70px 200px 0;min-height:240px;padding:18px;position:relative;-webkit-transform-origin:top center;transform-origin:top center;width:260px}@-webkit-keyframes panel-slide{0%{opacity:0;-webkit-transform:translateY(18px) scale(.995);transform:translateY(18px) scale(.995)}to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@keyframes panel-slide{0%{opacity:0;-webkit-transform:translateY(18px) scale(.995);transform:translateY(18px) scale(.995)}to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}.information>div:first-child{align-items:flex-start;background:linear-gradient(180deg,rgba(15,179,163,.06),rgba(15,179,163,.02));border-radius:10px;box-shadow:0 8px 20px rgba(11,158,143,.06),inset 0 -6px 14px hsla(0,0%,100%,.35);display:flex;flex-direction:column;gap:6px;padding:10px 12px}.information>div:first-child h1{color:#0b6e61;font-size:16px;font-weight:700;margin:0;transition:color .18s,-webkit-transform .28s cubic-bezier(.2,.9,.3,1);transition:transform .28s cubic-bezier(.2,.9,.3,1),color .18s;transition:transform .28s cubic-bezier(.2,.9,.3,1),color .18s,-webkit-transform .28s cubic-bezier(.2,.9,.3,1)}@-webkit-keyframes score-pop{0%{color:#0b6e61;-webkit-transform:scale(1);transform:scale(1)}30%{color:#0fb3a3;-webkit-transform:scale(1.08);transform:scale(1.08)}to{color:#0b6e61;-webkit-transform:scale(1);transform:scale(1)}}@keyframes score-pop{0%{color:#0b6e61;-webkit-transform:scale(1);transform:scale(1)}30%{color:#0fb3a3;-webkit-transform:scale(1.08);transform:scale(1.08)}to{color:#0b6e61;-webkit-transform:scale(1);transform:scale(1)}}.information>div:first-child h1:last-of-type{-webkit-animation:score-pop .7s ease-in-out;animation:score-pop .7s ease-in-out}.information button{background:linear-gradient(180deg,#111,#000);border-radius:8px;box-shadow:0 8px 18px rgba(0,0,0,.28);font-weight:700;margin:0;padding:10px 16px;transition:box-shadow .14s ease,background .14s ease,-webkit-transform .14s ease;transition:transform .14s ease,box-shadow .14s ease,background .14s ease;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,-webkit-transform .14s ease}.information button:hover{box-shadow:0 18px 36px rgba(0,0,0,.34)}.information ol{color:#333;font-size:13px;line-height:1.4;margin:6px 0 0}.information>div:last-child{border-radius:8px;margin-top:6px;padding:8px;text-align:center;transition:opacity .28s ease,-webkit-transform .28s ease;transition:transform .28s ease,opacity .28s ease;transition:transform .28s ease,opacity .28s ease,-webkit-transform .28s ease;will-change:transform,opacity}.information>div:last-child h1{color:#6b0f0f;font-size:18px;margin:6px 0;text-shadow:0 2px 8px rgba(255,59,59,.12)}@-webkit-keyframes gameover-shake{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-6px) rotate(-1deg);transform:translateX(-6px) rotate(-1deg)}50%{-webkit-transform:translateX(6px) rotate(1deg);transform:translateX(6px) rotate(1deg)}75%{-webkit-transform:translateX(-4px) rotate(-.5deg);transform:translateX(-4px) rotate(-.5deg)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes gameover-shake{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-6px) rotate(-1deg);transform:translateX(-6px) rotate(-1deg)}50%{-webkit-transform:translateX(6px) rotate(1deg);transform:translateX(6px) rotate(1deg)}75%{-webkit-transform:translateX(-4px) rotate(-.5deg);transform:translateX(-4px) rotate(-.5deg)}to{-webkit-transform:translateX(0);transform:translateX(0)}}.information>div:last-child:has(h1:where(:not(:empty))){-webkit-animation:gameover-shake .62s ease-in-out;animation:gameover-shake .62s ease-in-out}@media (max-width:840px){.game-layout{border:12px solid hsla(0,0%,44%,.75);border-radius:14px;height:calc(min(92vw, 540px)*.9);margin:12px 20px;width:min(92vw,540px)}:root{--cell-size:2.4%}.information{float:none;margin:14px auto 40px;width:92vw}.game-layout{height:calc(min(92vw, 540px)*.9);margin:12px 20px;width:min(92vw,540px)}:root{--cell-size:2.4%}}
/*# sourceMappingURL=main.32dc4fff.css.map*/