html{height:100%}*,:after,:before{box-sizing:border-box}*{margin:0;font-family:system-ui,Segoe UI,Roboto,Ubuntu,Helvetica Neue,sans-serif}body{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#000;overflow:hidden;scrollbar-width:none}html::-webkit-scrollbar{display:none}#thpace{position:absolute;top:0;left:0;width:100vw;height:100vh;margin:0}.container{width:500px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto;z-index:1}@media(max-height:700px){.container{width:auto;max-width:1000px;height:100vh;flex-direction:row;justify-content:space-around;padding:0 20px;gap:20px}.grid{height:350px;width:350px;margin:0;flex-shrink:0;overflow:hidden}.grid:before{display:none}.spans{display:none}.controls-section{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px}.flags{margin:0}#result{position:static;transform:none;left:auto;top:auto;min-height:40px;display:flex;align-items:center;justify-content:center;margin:10px 0;border:none}.button{width:fit-content;max-width:200px}}.grid{height:420px;width:420px;display:flex;flex-wrap:wrap;background:linear-gradient(145deg,#d5dce3,#b8c0c7);border:10px solid rgba(194,202,209,.9);margin:15% auto;box-shadow:0 15px 25px #00000040,0 5px 10px #00000038,inset 0 0 6px #ffffff80;font-size:1.6rem;text-align:center;letter-spacing:2px;border-radius:12px;animation:fadeInAnimation 2s ease-out 1 forwards;position:relative;cursor:url(/assets/glove2-PFaSnUku.png),auto;transition:transform .3s ease}.grid:hover{transform:translateY(-5px);box-shadow:0 20px 30px #0000004d,0 10px 15px #0003,inset 0 0 8px #fff9}.grid:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,transparent 48%,rgba(255,255,255,.1) 50%,transparent 52%);background-size:200% 200%;animation:shine 4s linear infinite;pointer-events:none;z-index:1}@keyframes shine{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes fadeInAnimation{0%{opacity:0;transform:translateY(4rem)}to{opacity:1;transform:translateY(0)}}div{text-align:center}.flags{font-size:1.4rem;text-align:center;font-weight:200;letter-spacing:2px;background-color:#000;color:#f7f7f7;padding:10px 20px;border:1px solid #f7f7f7;border-radius:3rem;width:fit-content;margin:1rem auto;text-transform:uppercase;box-shadow:2px 2px 2px #0009;text-shadow:0px 2px 2px rgba(255,255,255,.6)}.valid,.bomb,.checked,.grid div{height:40px;width:40px}.valid,.bomb{border:5px solid;border-color:#e4e7ea #b8c0c8 #b8c0c8 #eff1f3;box-sizing:border-box}.checked{background-color:#000;border:2px solid;border-color:#adb7c1;box-sizing:border-box}.one,.two,.three,.four,.five,.six,.seven,.eight{font-weight:400}.one{color:#e10600}.two{color:#0073e6}.three{color:#08ff08}.four{color:#bb41d3}.five{color:#e52}.six{color:#f6a800}.seven{color:#91b0ff}.eight{color:#ff0080}#result{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);font-size:1.6rem;text-align:center;width:fit-content;margin:2rem auto;color:#fff;border-radius:3rem;box-shadow:0 2px 4px #0006}.button{background-color:#f7f7f7;cursor:url(/assets/glove2-PFaSnUku.png),auto;letter-spacing:2px;border:1px solid #000000;color:#000;font-family:inherit;font-size:.8em;font-weight:700;padding:10px 20px;box-shadow:0 2px 4px #0006;border-radius:3rem;transition:.3s;text-transform:uppercase}.button:hover{background-color:#000;color:#f7f7f7;font-weight:200;border:1px solid #f7f7f7;transform:all .3s ease-out}button:active{transform:scale(.9);box-shadow:inset 0 0 10px #f7f7f7;outline:none}button:focus{outline:none;box-shadow:none!important}#reset{font-weight:400}