*,:after,:before{box-sizing:border-box}body{margin:0}h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0;padding:0}a{color:inherit}button,input{color:currentColor;font-family:inherit;font-size:inherit}ol,ul{list-style:none}.visually-hidden{block-size:1px;inline-size:1px;overflow:hidden;position:absolute;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@font-face{font-family:Roboto;font-weight:400;src:url(27f62b53b93858475a7f.ttf)}@font-face{font-family:Roboto;font-weight:700;src:url(d50a80138ec4f2fb5e9f.ttf)}@font-face{font-display:swap;font-family:PressStart2P;font-weight:400;src:url(9408ab2c41f7cfb7c4f1.woff) format("woff")}
:root{--main-font:Roboto;--accent-font:PressStart2P;--weight-regular:400;--weight-bold:700;--background-color:#fff;--accent-color:#000;--gradient:repeating-linear-gradient(#d3d3d3 0px 2px,transparent 2px 4px),repeating-linear-gradient(90deg,#d3d3d3 0px 2px,transparent 2px 4px),linear-gradient(#e7e7e7 0.01%,#1a1a1a)}
.page{align-items:center;background-attachment:fixed;background-image:var(--gradient);background-position:50%;background-size:cover;color:var(--accent-color);display:flex;flex-direction:column;font-family:var(--main-font),sans-serif;font-weight:var(--weight-regular);gap:10px;height:100vh;justify-content:center;position:relative;width:100vw}.page__label{opacity:30%;position:absolute;right:13px;top:25px;z-index:1}.main__start{align-items:center;display:flex;flex-direction:column;gap:50px;height:100vh;justify-content:center;width:100vw}.main__game{background-color:var(--background-color);border:1px solid var(--accent-color);display:grid;grid-template-columns:2fr 1fr;grid-template-rows:6fr 1fr;height:50vh;width:50vw}.page__title{font-family:var(--accent-font),sans-serif;font-size:50px;font-weight:400}.flowtext{background:linear-gradient(90deg,#e933ff,#ffb400,#f33,#334dff,#e933ff);background-clip:text;-webkit-background-clip:text;background-size:200% auto;-webkit-text-fill-color:transparent;animation:textflow 5s linear infinite}.bluetext{color:#334dff}@keyframes textflow{0%{background-position:0}to{background-position:200%}}.button{background-color:transparent;background-color:var(--background-color);border:1px solid var(--accent-color);cursor:pointer;display:flex;height:40px;position:relative;width:130px}.button__text{color:#fff;margin:auto;mix-blend-mode:difference;position:relative;z-index:1}.button:after{background-color:var(--accent-color);content:"";display:block;height:100%;left:0;position:absolute;top:0;transition:width .5s ease-in-out;width:0}.button:hover:after{width:100%}.button_type-start{font-size:20px;height:50px;width:150px}.popup{align-items:center;background-color:var(--background-color);background-color:rgba(0,0,0,.5);bottom:0;display:none;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:10}.popup_is-animated{display:flex;opacity:0;pointer-events:none;transition:visibility 0s .6s,opacity .6s;-webkit-user-select:none;-moz-user-select:none;user-select:none;visibility:hidden}.popup_is-opened{display:flex;opacity:1;pointer-events:all;transition:visibility 0s,opacity .6s;visibility:visible}.popup__button-close{background:transparent url(e587918bb0ad6804036d.svg) 50% no-repeat;background-size:35px 35px;border:none;cursor:pointer;height:35px;width:35px}.popup__button-close:hover{opacity:.6}.popup__content{background-color:var(--background-color);border:1px solid var(--accent-color);flex-direction:column;min-height:210px;min-width:290px;position:relative}.popup__content,.title_and_button{display:flex;justify-content:space-between}.title_and_button{border-bottom:1px solid var(--accent-color)}.popup__title{align-self:center;font-size:22px;margin-left:5px}.popup__form{align-items:center;display:flex;flex-direction:column;gap:20px;justify-content:space-between}.popup__input_type_against-whom,.popup__input_type_number-of-handful{height:30px;width:140px}.popup__button{margin-bottom:10px}.popup__content-how-many{height:600px;width:500px}.instruction-container{border:2px solid;-o-border-image:linear-gradient(90deg,#f33,#334dff,#e933ff) 30;border-image:linear-gradient(90deg,#f33,#334dff,#e933ff) 30}.popup__button-start{align-self:center;margin-top:10px}.form__content-how-many{display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:10px}.handful-container{border:1px solid #000;display:flex;flex-direction:column;gap:10px;height:290px;justify-content:start;overflow:auto;padding:5px;position:relative;width:100%}.handful-container-game{height:100%}.popup__input_type_how-many-handful{width:260px}.handful{align-items:center;border:1px solid #000;cursor:pointer;display:flex;min-height:50px;width:100%}.handful__number{font-size:20px;margin-left:10px}.handful__count{border-left:1px solid var(--accent-color);border-right:1px solid var(--accent-color);display:flex;justify-content:center;margin-left:auto;margin-right:5px;min-width:50px}.handful-list__image{display:flex;gap:1px;overflow:hidden}.handful-list__image-item{background:transparent url(41e54573c124964c72ee.svg) 50% no-repeat;background-size:35px 35px;min-height:35px;min-width:35px}.handful-checked{border:2px solid red;border-radius:5px}.game-history-container{border:1px solid var(--accent-color);display:flex;flex-direction:column;gap:10px;height:100%;overflow:auto;padding:10px;width:100%}.history-item{border:1px solid var(--accent-color);border-radius:5px;padding:2px}.button__restart{align-self:center;justify-self:center}.danger-color{color:red;font-weight:var(--weight-bold);mix-blend-mode:normal}.control__panel{align-items:center;display:flex;gap:10px;margin-left:10px}.control__button{height:30px;width:50px}.conrtol__panel-input{width:58px}.element_hide{display:none}label span{border:1px solid var(--accent-color);display:inline-block;height:18px;margin-right:5px;vertical-align:middle;width:18px}input[type=checkbox]:checked+span{background-image:url(e587918bb0ad6804036d.svg);background-position:50%;background-repeat:no-repeat;background-size:contain}.message-error{background-color:rgba(238,5,5,.514)}.message-info{background-color:rgba(5,28,238,.514)}.message-good{background-color:rgba(5,238,63,.514)}.end-message{margin:10px;text-align:center}@media (width < 830px){.main__game{height:50vh;width:100vw}.button__restart{font-size:10px;max-height:20px;max-width:50px}}*,:after,:before{box-sizing:border-box;margin:0;padding:0}.snow{--animation-name:snowfall;bottom:0;display:flex;justify-content:space-between;left:0;pointer-events:none;position:fixed;right:0;top:0;z-index:100}.snow__flake{animation-iteration-count:infinite;animation-name:var(--animation-name);animation-timing-function:ease-in-out;color:#219ae0;position:relative;top:-1.5em;will-change:transform}@keyframes snowfall{0%{transform:translateY(0)}to{transform:translateY(calc(100vh + 1.5em))}}
