@font-face{font-family:Helvetica Neue;src:url(/fonts/helvetica/HelveticaNeueMedium.ttf) format("truetype");font-weight:500;font-style:normal}@font-face{font-family:Brandon Text;src:url(/fonts/brandon/BrandonMed.otf) format("opentype");font-weight:500}body{font-family:Brandon Text,sans-serif;overflow-x:hidden;max-height:100svh;position:relative}*,body{margin:0;padding:0}*{box-sizing:border-box;z-index:2}.app-container{max-height:100dvh;background:linear-gradient(white 10%,#006AE1 50%);overflow:hidden}.app-container,.screen{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;box-sizing:border-box}.screen{padding:.4rem 0 0;text-align:center;height:100dvh;max-height:100%;background-image:url(/board-snake.png);background-size:contain;background-repeat:no-repeat;background-position:top}@media(min-width:670px){.screen{background-size:cover}}.home-screen{background-image:url(/BG_HOME.jpg)!important;background-size:cover;background-position:50%;background-repeat:no-repeat}.game-home-title{font-size:3rem;line-height:1;font-weight:800;letter-spacing:-.025em;width:100%;display:flex;justify-content:center;align-items:flex-start;height:100%;overflow:hidden;max-height:10vh}.game-home-logo{width:-moz-fit-content;width:fit-content;margin:0 auto;max-height:100%}.home-hero{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:50%;padding-bottom:12vh}.landing-btn{width:60%;margin-top:2vh}.color-select-btn{width:65%;margin-top:19px}.how-to-btn{width:70%}.modal-overlay{position:fixed;inset:0;background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:50}.modal-content{background-color:white;padding:1.5rem;border-radius:.5rem;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);max-width:24rem;width:100%;text-align:center}.modal-title{font-size:1.25rem;font-weight:700;margin-bottom:1rem}.modal-message{margin-bottom:1.5rem}.modal-actions{display:flex;justify-content:center;gap:1rem}.modal-button{font-weight:700;padding:.5rem 1rem;border-radius:9999px;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);transition-property:background-color,transform;transition-duration:.2s;border:none;cursor:pointer}.modal-button-cancel{background-color:#d1d5db;color:#1f2937}.modal-button-cancel:hover{background-color:#9ca3af}.modal-button-confirm{background-color:#3b82f6;color:white}.modal-button-confirm:hover{background-color:#2563eb}.modal-button-create-it{background-color:#22c55e;color:white}.modal-button-create-it:hover{background-color:#16a34a}.modal-question{background-image:url(/game_bg.jpg);background-size:cover;background-position:50%;background-repeat:no-repeat}.modal-question-content{background-color:white;padding:1.5rem;border-radius:.5rem;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);max-width:24rem;width:100%;text-align:center}.modal-question-title{font-family:Brandon Text;font-size:1rem;font-weight:700;margin-bottom:1.5rem;color:#001D54}.modal-question-options{display:flex;flex-direction:column;gap:1rem}.modal-question-button{background:linear-gradient(90deg,#60a5fa,#4f46e5);color:black;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition-property:all;transition-duration:.3s;transform:scale(1);border:.51px solid #00369a;cursor:pointer;box-shadow:1.01px 1.01px 7.1px 1.01px #00369A33}.modal-question-button:first-child{background:#A1BBEF}.modal-question-button:nth-child(2){background:#9D6CD8}.modal-question-button:nth-child(3){background:#6FBEC1}.modal-question-button:nth-child(4){background:#D68B96}.modal-question-button:hover{background:linear-gradient(90deg,#3b82f6,#4338ca);transform:scale(1.05)}.result-modal-overlay{position:fixed;inset:0;background-image:url(/game_bg.jpg);background-size:cover;background-position:50%;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:50}.result-modal-content{text-align:center;padding:1.5rem;color:white}.result-modal-image{width:120px;height:auto;margin-bottom:1rem}.result-modal-title{font-size:1.5rem;font-weight:600;margin-bottom:.5rem;font-family:Helvetica Neue,sans-serif}.result-modal-message{font-family:Brandon Text;line-height:1.4;margin-bottom:1.5rem;font-weight:450;font-style:Bold;font-size:2rem;line-height:100%;letter-spacing:0;text-align:center}.result-modal-actions{display:flex;justify-content:center;gap:1rem}.result-modal-button{font-weight:700;padding:.5rem 1rem;border-radius:9999px;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06);transition:background-color .2s,transform .2s;border:none;cursor:pointer}.result-modal-button-cancel{background-color:#d1d5db;color:#1f2937}.result-modal-button-cancel:hover{background-color:#9ca3af}.result-modal-button-confirm{background-color:#3b82f6;color:white}.result-modal-button-confirm:hover{background-color:#2563eb}.result-modal-button-create-it{background-color:#22c55e;color:white}.result-modal-button-create-it:hover{background-color:#16a34a}.confetti-container{position:absolute;inset:0;z-index:40;pointer-events:none}.confetti-particle{position:absolute;width:.75rem;height:.75rem;border-radius:9999px;animation:confetti-fall 3s ease-out forwards}.confetti-particle.yellow{background-color:#facc15}.confetti-particle.blue{background-color:#60a5fa}@keyframes confetti-fall{0%{transform:translateY(-100vh) rotate(0deg);opacity:0}10%{opacity:1}to{transform:translateY(100vh) rotate(2turn);opacity:0}}.start-game-button{background:linear-gradient(90deg,#10b981,#0d9488);color:white;font-size:1.5rem;font-weight:700;padding:1rem 2rem;border-radius:9999px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:all;transition-duration:.3s;transform:scale(1);border:none;cursor:pointer}.start-game-button:hover{background:linear-gradient(90deg,#059669,#0f766e);transform:scale(1.05)}.game-id-form-section{background-color:white;padding:2rem;border-radius:16px;width:min(80vw,800px)}.game-id-form,.game-id-form-section{display:flex;align-items:center;justify-content:center;flex-direction:column}.game-id-form{gap:1rem;width:100%}.game-id-register-button{width:100%}.game-id-input-container{max-width:100%;position:relative;align-items:flex-start;gap:.5rem}.game-id-input-container,.game-id-label{width:100%;display:flex;flex-direction:column}.game-id-label{gap:10px}.game-id-label-text{font-family:Helvetica Neue,sans-serif;align-self:flex-start}.game-id-error-text,.game-id-label-text{font-weight:500;font-size:.75rem;line-height:100%;letter-spacing:0}.game-id-error-text{color:#E90000;font-family:Helvetica Neue;text-align:left}.game-id-input{width:100%;padding:.4rem 3rem .4rem .4rem;font-size:1.125rem;border:2px solid #60a5fa;border-radius:6px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);outline:transparent;font-family:Brandon Text;color:#001D54}.game-id-input:focus{box-shadow:0 0 0 2px rgba(59,130,246,.5)}.game-id-enter-button{position:absolute;right:0;top:0;height:100%;background-color:#3b82f6;color:white;font-weight:700;padding:.5rem 1rem;border-top-right-radius:9999px;border-bottom-right-radius:9999px;font-size:1.25rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:background-color;transition-duration:.2s;border:none;cursor:pointer}.game-id-input::placeholder{font-family:Helvetica Neue,sans-serif;font-weight:500;font-size:.8rem;line-height:100%;letter-spacing:0}.game-id-enter-button:hover{background-color:#2563eb}.game-id-info-text{font-size:.875rem;color:#4b5563;margin-bottom:1.5rem;max-width:24rem}.game-id-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url(/dropdown.svg);background-repeat:no-repeat;background-position:right 1rem center;background-size:1rem;border-radius:4px;font-size:1rem;cursor:pointer;font-family:Brandon Text;color:#001D54;font-weight:700;width:100%;padding:.5rem 3rem .5rem .5rem;font-size:1.125rem;border:2px solid #60a5fa;border-radius:6px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);outline:transparent}.generate-id-button:hover{background-color:#9333ea;transform:scale(1.05)}.color-select-title{line-height:2.25rem;color:white;margin-top:10px;line-height:120%;vertical-align:middle;color:#006AE1;font-family:Brandon Text;font-weight:500;font-weight:700;font-size:1.2rem;line-height:100%;letter-spacing:0;text-align:center;width:70%;background-color:white;border-radius:.6rem;padding:.5rem 1rem;margin-bottom:10px}@media (min-width:768px){.color-select-title{font-size:2.25rem}}.color-grid-outer{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:min(500px,80vw);max-height:50vh}.color-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:1rem;gap:1rem;width:100%;max-width:58vw;justify-items:center;align-items:stretch}.color-button-box{width:100%;height:100%}.color-button,.color-button-box{display:flex;align-items:center;justify-content:center}.color-button{position:relative;width:min(100%,80px);height:5.3rem;border-radius:.5rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:all;transition-duration:.3s;transform:scale(1);border:4px solid transparent;cursor:pointer}.color-button:hover{transform:scale(1.05)}.selected{border:3px solid #dd5f83;box-shadow:0 0 0 4px rgba(96,165,250,.5)}.color-name{text-shadow:0 1px 2px rgba(0,0,0,.1)}.color-name,.next-button{color:white;font-size:1.25rem;font-weight:700}.next-button{margin-top:2.5rem;background:linear-gradient(90deg,#3b82f6,#4f46e5);padding:.75rem 2rem;border-radius:9999px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:all;transition-duration:.3s;transform:scale(1);border:none;cursor:pointer}.next-button:hover{background:linear-gradient(90deg,#2563eb,#4338ca);transform:scale(1.05)}.how-to-play-section{display:flex;flex-direction:column;align-items:center;width:min(500px,80vw);margin-top:12px}.how-to-play-content{background-color:transparent;padding-bottom:19px;border-radius:.5rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);max-width:28rem;width:100%;text-align:left;margin-bottom:1rem;line-height:1.5;border:1px solid #fcde54;position:relative}.how-to-play-article{padding:2rem .7rem .6rem 2rem}.how-to-play-title{color:#006AE1;font-family:Brandon Text;font-weight:500;font-size:1.5rem;line-height:100%;letter-spacing:0;text-align:center;width:70%;background-color:white;border-radius:.6rem;padding:.5rem 1rem;position:absolute;top:0;left:50%;transform:translate(-50%,-50%);z-index:1}@media (min-width:768px){.how-to-play-title{font-size:2rem}}.how-to-play-text{font-family:Brandon Text;font-weight:390;font-size:14px;line-height:100%;letter-spacing:0;color:white}.how-to-play-highlight{font-weight:700;color:#2563eb}.how-to-play-highlight-purple{font-weight:700;color:#7c3aed}.how-to-play-timer-text,.how-to-play-timer-text-2{font-family:Brandon Text;font-weight:450;font-size:1rem;line-height:100%;letter-spacing:0;color:#FCE15C;padding-left:.5rem}.how-to-play-timer-text-2{padding-right:.2rem;margin-top:10px}.play-game-button{background:linear-gradient(90deg,#22c55e,#84cc16);color:white;font-size:1.5rem;font-weight:700;padding:1rem 2.5rem;border-radius:9999px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:all;transition-duration:.3s;transform:scale(1);border:none;cursor:pointer}.play-game-button:hover{background:linear-gradient(90deg,#16a34a,#65a30d);transform:scale(1.05)}.game-screen-main{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100dvh;font-family:Inter,sans-serif;width:100%;box-sizing:border-box;background-image:url(/game_bg.jpg);background-size:cover;background-position:50%;background-repeat:no-repeat;height:100dvh;max-height:100dvh}@media (min-width:640px){.game-screen-main{padding:1rem}}.game-header{width:100%;display:flex;flex-direction:column;align-items:center;background-color:transparent;border-radius:.5rem;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);flex:1 0 18%}.game-enclose-section{margin-top:-5vh;margin-bottom:150px}.player-position-text{font-size:1.25rem;font-weight:800;color:#2563eb}@media (min-width:640px){.player-position-text{font-size:1.5rem}}.player-info{display:flex;align-items:center;column-gap:.5rem}.player-icon{width:1.5rem;height:1.5rem;border-radius:9999px;border:2px solid white}@media (min-width:640px){.player-icon{width:2rem;height:2rem}}.player-name{font-size:1rem;color:#4b5563}@media (min-width:640px){.player-name{font-size:1.125rem}}.board-grid{grid-template:repeat(10,minmax(0,1fr)) /repeat(10,minmax(0,1fr));grid-gap:2px;gap:2px;width:min(800px,min(89vw,70vh));height:min(800px,min(85vw,70vh));max-width:100%;margin:0 auto;min-height:0;min-width:0;overflow:hidden}.board-cell{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;font-size:clamp(.96rem,1.5vw,1.2rem);font-weight:600;background:linear-gradient(135deg,#f8f6ff,#e6d7ff 15%,#c084fc 50%,#8b5cf6);box-shadow:1.01px 1.01px 7.1px 1.01px #00369A33;border:.51px solid #00369a;transition:transform .2s ease;max-width:min(calc(88vw/10),90px);max-height:min(calc(88vw/10),90px);height:99%;width:99%}.board-cell:hover{transform:scale(1.05)}.board-cell-pink{background:linear-gradient(135deg,#ffffff,#f5f0f1 15%,#e8c1c8 20%,#D68B96 23%)}.board-cell-purple{background:linear-gradient(135deg,#ffffff,#f3f0f8 15%,#c9b0e6 20%,#9E6DD9 23%);box-shadow:1.01px 1.01px 7.1px 1.01px #00369A33}.board-cell-teal{background:linear-gradient(135deg,#ffffff,#f0f7f7 15%,#b7d8d9 20%,#6FBEC1 23%)}.board-cell-plain{background:linear-gradient(135deg,#ffffff,#f1f3f6 15%,#bbc5d4 20%,#7791B5 23%)}.board-cell-white{background:linear-gradient(135deg,#ffffff,#f5f7fc 15%,#d0dcf7 20%,#A1BBEF 23%)}.board-cell-question{background-color:#fef08a}.board-cell-even{background-color:#dbeafe}.board-cell-odd{background-color:#dcfce7}.question-mark{bottom:.25rem;right:.25rem;color:#7c3aed;font-weight:700}.game-icon-snake,.question-mark{position:absolute;font-size:1.5rem}.game-icon-snake{bottom:0;right:0}.game-icon-ladder{position:absolute;top:0;left:0;font-size:1.5rem}.player-initial{color:white;font-size:1.125rem;font-weight:700}.game-controls{width:100%;display:flex;align-items:center;justify-content:space-evenly;background-color:transparent;padding:.2rem;border-radius:.5rem;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);margin-top:14px}@media (min-width:640px){.game-controls{margin-top:1.5rem}}.timer-display{display:flex;align-items:center;justify-content:center;background:white;padding:.8rem;border-radius:.5rem;max-width:100px}.timer-display span{font-family:Brandon Text;font-weight:450;font-style:Bold;font-size:16px;line-height:100%;letter-spacing:0;text-align:center}.dice-value-display{font-size:1.875rem;font-weight:800;color:#7c3aed;margin-bottom:1rem}@media (min-width:640px){.dice-value-display{font-size:2.25rem}}.dice-roller-box{max-width:110px}.roll-dice-button{background:linear-gradient(90deg,#ec4899,#dc2626);color:white;font-size:1.5rem;font-weight:700;padding:.75rem 2rem;border-radius:9999px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition-property:all;transition-duration:.3s;transform:scale(1);border:none;cursor:pointer}.roll-dice-button:hover:not(.roll-dice-button-disabled){transform:scale(1.05)}.roll-dice-button:active:not(.roll-dice-button-disabled){transform:scale(.95)}.roll-dice-button-disabled{opacity:.5;cursor:not-allowed}@media (min-width:640px){.roll-dice-button{font-size:1.875rem;padding:1rem 2.5rem}}.board-grid{position:relative;display:grid}.player-token{border-radius:50%;font-weight:700;color:white;box-shadow:0 4px 8px rgba(0,0,0,.3);width:min(7vw,40px);height:min(7vw,40px);border-radius:9999px;display:flex;align-items:center;justify-content:center;border:2px solid white;position:absolute;top:18;left:18;z-index:10;transition:transform .6s ease-in-out}.player-token .player-initial{font-size:10px}.how-to-play-content{background-color:#006AE1}.game-id-input-wrapper{position:relative}.where-is-my-id-button{color:#00369A;position:absolute;right:10%;bottom:0;height:80%;outline:4px solid red;background:none;border:none;text-decoration:underline;font-size:1rem;cursor:pointer;padding:0;margin:0;outline:none;white-space:nowrap}.hot-to-play-list{color:white;list-style-position:outside}@media(max-height:580px){.app-container,.game-screen,.screen{overflow-y:auto}}