:root{--pixel-size: 2px;--fade-transition-time: .5s;--minimum-size: 9px;--button-shadow: 10px;--z-index-gap: 10;--z-index-content: 501;--z-index-menu: 1001;--padding-rate: 1vw;--margin: calc(var(--padding-rate) * 2 + var(--menu-button-size));--original-tile-size: 18px;--menu-button-size: 36px;--button-size: 56px;--p-size: 20px;--menu-label-size: 12px;--menu-label-container-size: 20px;--green-1: #387f39;--green-2: #a2ca71;--green-3: #bedc74;--green-4: #f6e96b;--blue-1: #a6f3e1;--blue-2: #d0f5ff;--blue-3: #f0f6ff;--tag-width: calc(var(--minimum-size) * 9);--tag-height: calc(var(--minimum-size) * 5);--black-background: rgba(0, 0, 0, .5)}@font-face{font-family:Determination;src:url(/assets/fonts/determination.ttf) format("truetype")}@media only screen and (orientation: portrait){:root{--pixel-size: 1px;--padding-rate: 2vw}}body{cursor:none;overflow:hidden;font-family:Determination,sans-serif}.content{color:var(--green-1);display:flex;justify-content:center;align-items:center;height:100%;left:0;margin:0;position:absolute;top:0;width:100%;z-index:var(--z-index-content)}.content p{font-size:var(--p-size)}.canvas{height:100%;position:absolute;width:100%}h1,p{width:fit-content;height:fit-content}.pixelart-bubble{clip-path:polygon(calc(var(--pixel-size) * 2) 0,calc(100% - calc(var(--pixel-size) * 2)) 0,calc(100% - calc(var(--pixel-size) * 2)) var(--pixel-size),calc(100% - var(--pixel-size)) var(--pixel-size),calc(100% - var(--pixel-size)) calc(var(--pixel-size) * 2),100% calc(var(--pixel-size) * 2),100% calc(100% - calc(var(--pixel-size) * 2)),calc(100% - var(--pixel-size)) calc(100% - calc(var(--pixel-size) * 2)),calc(100% - var(--pixel-size)) calc(100% - var(--pixel-size)),calc(100% - calc(var(--pixel-size) * 2)) calc(100% - var(--pixel-size)),calc(100% - calc(var(--pixel-size) * 2)) 100%,calc(var(--pixel-size) * 2) 100%,calc(var(--pixel-size) * 2) calc(100% - var(--pixel-size)),var(--pixel-size) calc(100% - var(--pixel-size)),var(--pixel-size) calc(100% - calc(var(--pixel-size) * 2)),0 calc(100% - calc(var(--pixel-size) * 2)),0px calc(var(--pixel-size) * 2),var(--pixel-size) calc(var(--pixel-size) * 2),var(--pixel-size) var(--pixel-size),calc(var(--pixel-size) * 2) var(--pixel-size))}.pixel-circle{height:var(--pixel-size);width:var(--pixel-size)}.button{position:relative;height:calc(var(--button-size) - (2 * var(--pixel-size)));width:calc(var(--button-size) * 3.15)}.button label{color:var(--green-1);text-align:center;position:absolute;width:inherit;top:calc(50% - (var(--p-size) / 2))}.button:hover label{color:var(--green-2)!important}.button:active label{color:var(--green-1)!important}.button-outline{border:var(--pixel-size) solid var(--green-1);display:grid;grid-template-rows:80fr 20fr;height:inherit;position:absolute;width:inherit}.button:hover .button-outline{border:var(--pixel-size) solid var(--green-2)}.button:active .button-outline{border:var(--pixel-size) solid var(--green-1)}.button-top{background-color:var(--green-3);clip-path:polygon(calc(var(--pixel-size) * 2) 0,calc(100% - calc(var(--pixel-size) * 2)) 0,calc(100% - calc(var(--pixel-size) * 2)) var(--pixel-size),calc(100% - var(--pixel-size)) var(--pixel-size),calc(100% - var(--pixel-size)) calc(var(--pixel-size) * 2),100% calc(var(--pixel-size) * 2),100% 100%,0% 100%,0 calc(100% - calc(var(--pixel-size) * 2)),0px calc(var(--pixel-size) * 2),var(--pixel-size) calc(var(--pixel-size) * 2),var(--pixel-size) var(--pixel-size),calc(var(--pixel-size) * 2) var(--pixel-size));height:calc(var(--button-size) * .8);position:absolute;width:inherit}.button:hover .button-top{background-color:var(--green-4)!important}.button:active .button-top{background-color:var(--green-2)!important}.button-bottom{background-color:var(--green-2);clip-path:polygon(0% 0%,100% 0%,100% calc(100% - calc(var(--pixel-size) * 2)),calc(100% - var(--pixel-size)) calc(100% - calc(var(--pixel-size) * 2)),calc(100% - var(--pixel-size)) calc(100% - var(--pixel-size)),calc(100% - calc(var(--pixel-size) * 2)) calc(100% - var(--pixel-size)),calc(100% - calc(var(--pixel-size) * 2)) 100%,calc(var(--pixel-size) * 2) 100%,calc(var(--pixel-size) * 2) calc(100% - var(--pixel-size)),var(--pixel-size) calc(100% - var(--pixel-size)),var(--pixel-size) calc(100% - calc(var(--pixel-size) * 2)),0 calc(100% - calc(var(--pixel-size) * 2)));width:inherit;height:calc(var(--button-size) * .2);position:absolute;grid-row:2}.button:hover .button-bottom{background-color:var(--green-3)!important}.button:active .button-bottom{background-color:var(--green-1)!important}.highlight{height:calc(var(--button-size) * .8);position:absolute;width:inherit}.highlight div{background-color:var(--green-4);position:absolute}.button:hover .highlight div{background-color:#fff!important}.button:active .highlight div{background-color:var(--green-3)!important}.highlight-1{bottom:calc(var(--pixel-size) * 2);height:var(--pixel-size);left:var(--pixel-size);width:var(--pixel-size)}.highlight-2{bottom:var(--pixel-size);left:calc(var(--pixel-size) * 2);height:var(--pixel-size);width:calc(100% - (var(--pixel-size) * 3))}.highlight-3{height:calc(100% - (var(--pixel-size) * 4));right:0;width:var(--pixel-size);top:calc(var(--pixel-size) * 2)}.menu-button{width:var(--menu-button-size);height:var(--menu-button-size);background-color:var(--green-3);opacity:.6}.menu-button:hover{background-color:var(--green-4)}.menu-button:active{background-color:var(--green-2)}.menu-button-pressed{background-color:var(--green-4)!important}.component{display:grid;grid-template-columns:max-content;grid-template-rows:max-content;height:max-content;position:absolute;width:max-content;z-index:var(--z-index-menu)}.component-vertical-down{grid-template-rows:10px max-content}.component-vertical-up{grid-template-rows:max-content 10px}.component-horizontal{grid-template-columns:max-content max-content}.component-body{background-color:var(--green-1);padding:5px}.component .bottom{grid-row:2}.component .top{grid-row:1}.component-tail{position:absolute;background-color:var(--green-1);height:10px;width:10px;clip-path:polygon(0% 0%,var(--pixel-size) 0%,var(--pixel-size) var(--pixel-size),calc(var(--pixel-size) * 2) var(--pixel-size),calc(var(--pixel-size) * 2) calc(var(--pixel-size) * 2),calc(var(--pixel-size) * 3) calc(var(--pixel-size) * 2),calc(var(--pixel-size) * 3) calc(var(--pixel-size) * 3),calc(var(--pixel-size) * 4) calc(var(--pixel-size) * 3),calc(var(--pixel-size) * 4) calc(var(--pixel-size) * 4),calc(var(--pixel-size) * 5) calc(var(--pixel-size) * 4),calc(var(--pixel-size) * 5) calc(var(--pixel-size) * 5),calc(var(--pixel-size) * 6) calc(var(--pixel-size) * 5),calc(var(--pixel-size) * 6) calc(var(--pixel-size) * 6),calc(var(--pixel-size) * 7) calc(var(--pixel-size) * 6),calc(var(--pixel-size) * 7) calc(var(--pixel-size) * 7),calc(var(--pixel-size) * 8) calc(var(--pixel-size) * 7),calc(var(--pixel-size) * 8) calc(var(--pixel-size) * 8),calc(var(--pixel-size) * 9) calc(var(--pixel-size) * 8),calc(var(--pixel-size) * 9) calc(var(--pixel-size) * 9),calc(var(--pixel-size) * 10) calc(var(--pixel-size) * 9),calc(var(--pixel-size) * 10) calc(var(--pixel-size) * 10),0% 100%)}.component-tail-top-left{justify-self:left;grid-row:1;left:calc(var(--pixel-size) * 2)}.component-tail-top-right{justify-self:right;grid-row:1;right:calc(var(--pixel-size) * 2)}.component-tail-bottom-left{justify-self:left;grid-row:2;rotate:90deg}.component-tail-bottom-right{justify-self:right;grid-row:2}.component-tail-left-top{top:calc(var(--pixel-size) * 3);grid-column:1}.component-tail-left-bottom{bottom:calc(var(--pixel-size) * 3);grid-column:1}.component-tail-right-top{top:calc(var(--pixel-size) * 3);grid-column:2}.component-tail-right-bottom{bottom:calc(var(--pixel-size) * 3);grid-column:2}.tooltip-text{color:var(--blue-3);font-size:var(--menu-label-size)}.dropdown{background-color:var(--green-2)}.dropdown-component .component-tail{background-color:var(--green-2)!important}.dropdown-option{border-bottom:1px solid var(--green-3);color:var(--green-1);font-size:var(--menu-label-size);padding:10px}.dropdown-option-selected{background-color:var(--green-4);color:var(--green-2)}.dropdown-option:hover{background-color:var(--green-3);color:var(--green-4)}.dropdown-option:last-child{border-bottom:none}.input-bar{display:flex;box-shadow:3px 3px 0 1px #0000001a;height:100%;position:relative;width:100%}.input-bar .input{background-color:transparent;border:none;border-radius:10px;cursor:none;color:var(--green-1);font-size:var(--p-size);font-family:Determination,sans-serif;height:100%;left:0;padding:0;padding-left:calc(var(--minimum-size) * 4);position:absolute;top:0;width:calc(100% - (var(--minimum-size) * 4));z-index:1}.input-bar .input:focus-visible{outline:var(--pixel-size) solid var(--green-4)}.input-bar .background{background-color:var(--blue-3);height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:0}.input-bar .icon{height:calc(var(--minimum-size) * 2);left:var(--minimum-size);opacity:.1;position:absolute;top:calc(50% - var(--minimum-size));width:calc(var(--minimum-size) * var(--minimum-size))}.tags-container{display:grid;height:100%;overflow:hidden}.tags{align-items:center;border-radius:10px;display:grid;height:auto;gap:var(--minimum-size);grid-template-columns:repeat(6,auto);grid-template-rows:repeat(auto-fit,var(--tag-height));padding-bottom:var(--minimum-size)}.tags .label{align-items:center;background-color:var(--blue-3);box-shadow:3px 3px 0 1px #0000001a;display:grid;grid-template-columns:calc(var(--minimum-size) * 2) 1fr;column-gap:var(--pixel-size);height:100%;font-size:var(--menu-label-size);-webkit-user-select:none;user-select:none;color:#0009;overflow:hidden;text-align:left;min-width:calc(var(--minimum-size) * 10);width:calc(var(--minimum-size) * 10);padding-left:calc(var(--pixel-size) * 3);padding-right:calc(var(--pixel-size) * 2)}.tags .tag-logo{height:calc(var(--minimum-size) * 2);width:calc(var(--minimum-size) * 2);object-fit:contain}.tags .tag-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tags .label:hover{background-color:var(--green-4)}.tags .label:hover label{color:var(--green-1)!important}.tags .label:active{background-color:var(--green-1)}.tags .label:active label{color:var(--green-2)!important}.tags .label-selected{background-color:var(--green-3)}.tags .label-selected label{color:var(--green-4)!important}@keyframes collision-shake-1{0%,to{transform:translate(0)}20%{transform:translate(-2px)}40%{transform:translate(2px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes collision-shake-2{0%,to{transform:translate(0)}20%{transform:translate(3px)}40%{transform:translate(-3px)}60%{transform:translate(1px)}80%{transform:translate(-1px)}}@keyframes collision-shake-3{0%,to{transform:translate(0)}20%{transform:translate(-1px)}40%{transform:translate(1px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}}@keyframes collision-blink{0%{color:#387f39}20%{color:#bedc74}40%{color:#a2ca71}60%{color:#f6e96b}80%{color:#387f39}to{color:inherit}}.collision-move-1{animation:collision-shake-1 .5s ease}.collision-move-2{animation:collision-shake-2 .5s ease}.collision-move-3{animation:collision-shake-3 .5s ease}.collision-hit{animation:collision-shake-1 .5s ease,collision-blink .5s steps(1,end)}.window{container:window-container / size;display:grid;grid-template-columns:calc(var(--pixel-size) *2) auto calc(var(--pixel-size) *2);grid-template-rows:calc(var(--pixel-size) *2) auto calc(var(--pixel-size) *2);height:inherit;background-color:var(--green-3);width:100%}.window .container{display:grid;grid-template-rows:auto 1fr;gap:var(--minimum-size);padding:var(--minimum-size);overflow:hidden}.margin{background-color:var(--green-4);width:100%;height:100%}.margin-top{cursor:row-resize;grid-column:1/3;grid-row:1}.margin-left{cursor:col-resize;grid-column:1;grid-row:1/3}.margin-right{cursor:col-resize;grid-column:3;grid-row:1/4}.margin-bottom{cursor:row-resize;grid-column:1/4;grid-row:3}.window .header-container{height:26px;border-style:solid;border-width:calc(var(--pixel-size) * 2);border-color:var(--green-1);background-color:var(--green-2);padding:var(--pixel-size)}.window .header{width:100%;height:100%;background:linear-gradient(to right,var(--green-1),var(--green-2))}.window .header-content{align-content:center;display:grid;grid-template-columns:1fr auto;height:100%;padding-left:var(--minimum-size);padding-right:var(--minimum-size)}.window .header-text{align-self:center;color:#fff;font-size:12px;margin:0}.window .header-buttons{display:grid;grid-template-columns:calc(var(--minimum-size) * 2) calc(var(--minimum-size) * 2) calc(var(--minimum-size) * 2);gap:var(--minimum-size)}.window .button{background:var(--green-3);border-top:calc(var(--pixel-size) * 2) solid var(--green-4);border-left:calc(var(--pixel-size) * 2) solid var(--green-4);border-bottom:calc(var(--pixel-size) * 2) solid var(--green-1);border-right:calc(var(--pixel-size) * 2) solid var(--green-1);height:14px;width:14px}.window .icon-minimize{background:url(/assets/sprites/ui/icons/icon-minimize-normal.svg) no-repeat center;background-size:contain;height:100%;width:100%}.window .icon-maximize{background:url(/assets/sprites/ui/icons/icon-maximize-normal.svg) no-repeat center;background-size:contain;height:100%;width:100%}.window .icon-close{background:url(/assets/sprites/ui/icons/icon-close-normal.svg) no-repeat center;background-size:contain;height:100%;width:100%}.window .button:hover .icon-minimize{background:url(/assets/sprites/ui/icons/icon-minimize-hover.svg) no-repeat center}.window .button:hover .icon-maximize{background:url(/assets/sprites/ui/icons/icon-maximize-hover.svg) no-repeat center}.window .button:hover .icon-close{background:url(/assets/sprites/ui/icons/icon-close-hover.svg) no-repeat center}.window .button:active .icon-minimize{background:url(/assets/sprites/ui/icons/icon-minimize-hover.svg) no-repeat center}.window .button:active .icon-maximize{background:url(/assets/sprites/ui/icons/icon-maximize-hover.svg) no-repeat center}.window .button:active .icon-close{background:url(/assets/sprites/ui/icons/icon-close-hover.svg) no-repeat center}.window .button:hover{cursor:pointer;background:var(--green-4);border-top:calc(var(--pixel-size) * 2) solid var(--green-2);border-left:calc(var(--pixel-size) * 2) solid var(--green-2);border-bottom:calc(var(--pixel-size) * 2) solid var(--green-4);border-right:calc(var(--pixel-size) * 2) solid var(--green-4);height:14px;width:14px}.window .button:hover .button-exit-normal{display:none}.window .button:hover .button-exit-hover{display:block}.window .button:hover .button-maximize-normal{display:none}.window .button:hover .button-maximize-hover{display:block}.window .button:hover .button-minimize-normal{display:none}.window .button:hover .button-minimize-hover{display:block}.window .button:active{cursor:pointer;background:var(--green-1);border-top:calc(var(--pixel-size) * 2) solid var(--green-3);border-left:calc(var(--pixel-size) * 2) solid var(--green-3);border-bottom:calc(var(--pixel-size) * 2) solid var(--green-1);border-right:calc(var(--pixel-size) * 2) solid var(--green-1);height:14px;width:14px}.window .button:active .button-maximize-normal{display:none}.window .button:active .button-maximize-hover{display:block}.window .button:active .button-minimize-normal{display:none}.window .button:active .button-minimize-hover{display:block}.window .content-container{display:grid;grid-template-columns:1fr 1fr;width:100%}.window .image-container{align-content:center;background:var(--green-2);border-top:calc(var(--pixel-size) * 2) solid var(--green-1);border-left:calc(var(--pixel-size) * 2) solid var(--green-1);border-bottom:calc(var(--pixel-size) * 2) solid var(--green-4);border-right:calc(var(--pixel-size) * 2) solid var(--green-4);height:calc(100% - (var(--pixel-size) * 4));width:calc(100% - (var(--pixel-size) * 2))}.window .image{justify-self:center;background:#fff;width:calc(100% - (var(--pixel-size) * 4));height:calc(100% - (var(--pixel-size) * 4))}.window .dark-text{color:var(--green-1)}.window .description-container{display:grid;grid-template-rows:repeat(3,auto-fit) auto;padding-left:calc(var(--minimum-size) * 2);padding-right:calc(var(--minimum-size) * 2);padding-bottom:calc(var(--minimum-size) * 2);height:inherit}.window .description-title{margin:0;font-size:20px}.window .description-subtitle{color:var(--green-2);font-size:15px;margin-bottom:var(--margin-size);height:content-fit}.window .description{font-size:15px;margin-top:0;margin-bottom:var(--margin-size)}.window .description-icons{display:grid;grid-template-columns:repeat(auto-fill,27px);gap:var(--minimum-size);width:100%}.window .description-icon{box-shadow:10px 10px 0 1px #0000001a;display:flex;align-items:center;justify-content:center;background:#fff;height:27px;width:27px;position:relative}.window .description-icon:after{content:attr(data-tooltip);position:absolute;left:50%;bottom:calc(100% + var(--pixel-size));transform:translate(-50%);background-color:var(--green-1);color:var(--blue-3);padding:calc(var(--pixel-size) * 2) calc(var(--pixel-size) * 3);font-size:var(--menu-label-size);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s ease-in-out;z-index:var(--z-index-menu)}.window .description-icon:hover:after{opacity:1}@container window-container (max-height: 210px){.window .container{grid-template-rows:auto}.window .header-container{display:none}.window .content-container{height:calc(50% - calc(var(--padding-rate) / 2));grid-template-columns:1fr;grid-template-rows:60% 40%;gap:var(--minimum-size)}.window .description-subtitle,.window .description{display:none}.window .description-container{height:100%;grid-template-columns:repeat(2,50%);gap:var(--margin-size);padding:0}.window .description-icons{align-items:center}}@container window-container (max-height: 115px){.window .container{grid-template-rows:auto}.window .header-container{display:none}.window .content-container{grid-template-rows:1fr}.window .image-container,.window .description-subtitle,.window .description{display:none}.window .description-container{grid-template-rows:repeat(2,auto-fit);gap:var(--margin-size)}}
