:root{--color-water-deep:#314462;--color-water-shallow:#81e5e5;--color-water-filter:#def6ea;--color-water-highlight:#a9dbd1;--color-earth:#d5c28e;--color-rock-top:#6e5a5e;--color-rock-side:#473537;--color-sky:#bdd6e2;--color-rain:#ccd0cf;--color-ambient-sunny:#fffdee;--color-ambient-overcast:#f6f6f6;--color-ambient-drizzle:#e9ecec;--color-ambient-rain:#deeef6;--color-ambient-thunderstorm:#9ea6bf;--color-grass-a:#97b54e;--color-grass-b:#4b812e;--color-cattail-leaf:#5e8136;--color-cattail-stalk:#a09e7a;--color-cattail-capsule:#eceaac;--color-shrubbery-stalk:#5f7746;--color-shrubbery-leaf:#426630;--color-fish-white:#e1e0c4;--color-fish-black:#414345;--color-fish-gold:#e4a746;--color-fish-orange:#e56e42;--color-fish-red:#db3030;--color-fish-brown:#6e5a5e;--color-fish-purple:#6d4160;--color-fish-blue:#5f7d8c;--color-fish-pink:#ec97a4;--color-fish-darkblue:#415986;--color-fish-lightpurple:#7c65cd;--color-fish-teal:#4ab3b2;--color-fish-green:#97b54e;--color-fish-darkgreen:#4b812e;--color-fish-lightbrown:#a98d86;--color-fish-bordeaux:#5a0a11;--color-fish-shade:#13232b;--color-bug-butterfly-yellow:#d7c89b;--color-bug-butterfly-yellow-edge:#f6cda2;--color-bug-butterfly-orange:#deb63b;--color-bug-butterfly-orange-edge:#ff967c;--color-bug-butterfly-blue:#bdd7f3;--color-bug-butterfly-blue-edge:#87abdb;--color-bug-butterfly-black:#6b7556;--color-bug-butterfly-black-edge:#474747;--color-bug-butterfly-thunder:#4f4e56;--color-bug-butterfly-thunder-edge:#d64657;--color-code-00:#fdd373;--color-code-01:#eaa247;--color-code-10:#cd6142;--color-code-11:#db3030;--color-preview-outer:#325c73;--color-preview-inner:var(--color-water-shallow);--color-white:#f6f6f6;--padding-top-notch:env(safe-area-inset-top)}body{background:var(--color-shrubbery-leaf);margin:0;font-family:Grandstander}#wrapper{width:100%;height:100%;position:absolute;overflow:hidden}#gui{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}#gui #cards{width:100%;height:100%;position:absolute;top:0;left:0}#gui #overlay{-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;top:0;left:0}@media only screen and (orientation:portrait){.notch-padded{padding-top:max(env(safe-area-inset-top), 30px);padding-bottom:env(safe-area-inset-bottom)}}:root{--loader-logo-width:60%;--loader-logo-color:var(--color-white);--loader-logo-margin:10%;--loader-fade-in:2s;--loader-fade-out:1s;--loader-button-height:80px;--loader-button-margin:16px;--loader-button-border-radius:var(--card-border-radius);--loader-button-text-color:var(--color-shrubbery-leaf);--loader-button-fade-in:1.3s;--loader-fullscreen-padding:32px;--loader-fullscreen-size:64px;--loader-fullscreen-hover:8px;--loader-fullscreen-border:8px;--loader-fullscreen-corner-size:30%}#loader{background:linear-gradient(to top, var(--color-shrubbery-leaf), var(--color-grass-a));width:100%;height:100%;transition:var(--loader-fade-out) opacity;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:0}#loader canvas{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}#loader-links{flex-direction:row-reverse;justify-content:flex-end;align-items:flex-end;width:100%;height:4rem;max-height:100px;padding:16px;display:flex;position:absolute;bottom:0;left:0}#loader-links .loader-icon{width:4rem;transition:var(--loader-fade-in) opacity;margin:auto 0;transition-timing-function:ease-in}#loader-links .loader-icon svg{width:100%;height:100%}#loader-links:hover .loader-bar{opacity:1}#loader #loader-discord path,#loader #loader-website path{fill:#feffff}#loader .loader-icon.invisible,#loader .loader-bar.invisible{opacity:0}#loader #loader-discord:hover,#loader #loader-website:hover{cursor:pointer}#loader #loader-website:hover path{fill:#fca938}#loader #loader-discord:hover path{fill:#778bd8}#loader .fullscreen{margin:var(--loader-fullscreen-padding);width:var(--loader-fullscreen-size);height:var(--loader-fullscreen-size);cursor:pointer;opacity:0;transition:var(--loader-button-fade-in) opacity;position:absolute;top:0;right:0}#loader .fullscreen:hover{width:calc(var(--loader-fullscreen-size) + 2 * var(--loader-fullscreen-hover));height:calc(var(--loader-fullscreen-size) + 2 * var(--loader-fullscreen-hover));top:calc(var(--loader-fullscreen-hover) * -1);right:calc(var(--loader-fullscreen-hover) * -1)}#loader .fullscreen .corner{width:var(--loader-fullscreen-corner-size);height:var(--loader-fullscreen-corner-size);position:absolute}#loader .fullscreen .corner.left-top{border-left:var(--loader-fullscreen-border) solid var(--color-white);border-top:var(--loader-fullscreen-border) solid var(--color-white);top:0;left:0}#loader .fullscreen .corner.right-top{border-right:var(--loader-fullscreen-border) solid var(--color-white);border-top:var(--loader-fullscreen-border) solid var(--color-white);top:0;right:0}#loader .fullscreen .corner.left-bottom{border-left:var(--loader-fullscreen-border) solid var(--color-white);border-bottom:var(--loader-fullscreen-border) solid var(--color-white);bottom:0;left:0}#loader .fullscreen .corner.right-bottom{border-right:var(--loader-fullscreen-border) solid var(--color-white);border-bottom:var(--loader-fullscreen-border) solid var(--color-white);bottom:0;right:0}#loader .fullscreen.loaded{opacity:1}#loader.finished{opacity:0;pointer-events:none}#loader-graphics{width:100%;margin-bottom:var(--loader-logo-margin);flex-direction:column;justify-content:center;align-items:center;display:flex}#loader-slots{place-content:center;align-items:center;width:100%;height:20%;display:flex}#loader-slots .loader-slot{width:25%;height:100%;margin-left:calc(var(--loader-button-margin) / 2);margin-right:calc(var(--loader-button-margin) / 2);text-align:center;border-radius:var(--loader-button-border-radius);flex-direction:column;justify-content:flex-start;display:flex;position:relative}#loader-slots .loader-slot h1{color:var(--color-white);-webkit-user-select:none;user-select:none;background-color:var(--loader-button-text-color);border-top-left-radius:60px;border-top-right-radius:60px;flex-direction:column;justify-content:flex-end;width:120px;height:60px;margin:0;display:flex;position:absolute;top:-60px}#loader-slots .loader-slot button{margin-bottom:var(--loader-button-margin)}.loader-bar{height:var(--loader-logo-width);transition:var(--loader-fade-in) opacity;cursor:pointer;opacity:0;border-radius:5px;place-self:flex-start;margin:auto 0;transition-timing-function:ease-in}.loader-bar svg{width:100%;height:100%}.loader-bar:hover{filter:invert()}#loader-icon{width:var(--loader-logo-width);transition:var(--loader-fade-in) opacity;transition-timing-function:ease-in}#loader-icon.invisible{opacity:0}#loader-icon svg{width:100%;height:100%}#loader-icon svg path{fill:var(--loader-logo-color)}#loader.finished .loader-button button{pointer-events:none}.loader-button{width:25%;height:var(--loader-button-height);margin-bottom:var(--loader-button-margin);opacity:0;transition:var(--loader-button-fade-in) opacity;justify-content:center;align-items:center;transition-timing-function:ease-in;display:flex}.loader-button.loaded{opacity:1}.loader-button button{background-color:var(--color-white);width:100%;color:var(--loader-button-text-color);border-radius:var(--loader-button-border-radius);font-weight:700;transition:opacity .5s}.loader-button button:active,.loader-button button.confirm{background-color:var(--color-fish-black);color:var(--color-white);transition:all}.loader-button button.confirm:active{background-color:var(--color-white);color:var(--loader-button-text-color);transition:all}#loader-loading{flex-direction:row;justify-content:center;align-items:center;transition:opacity .5s;display:flex;position:absolute;top:20px}#loader-loading.invisible{opacity:0;animation:none}#loader-loading-text{color:var(--color-white);margin-left:5px;font-size:1.5em}#loader-loading-icon{transform-origin:0 0;width:20px;animation:1s ease-in-out infinite flutter}@media only screen and (orientation:portrait){#loader-slots{height:unset;flex-direction:column}#loader-slots .loader-slot{flex-direction:row;width:60%}#loader-slots .loader-slot h1{color:var(--color-white);bottom:16px;left:-60px;top:unset;-webkit-user-select:none;user-select:none;background-color:var(--loader-button-text-color);text-align:center;border-top-left-radius:60px;border-bottom-left-radius:60px;flex-direction:column;justify-content:flex-end;width:60px;height:60px;margin:0;padding:0;line-height:60px;display:flex;position:absolute}#loader-slots .loader-slot button:nth-child(2){border-bottom-left-radius:0}#loader-slots .loader-slot button:not(:last-child){margin-right:10px}.loader-button{width:60%}}@keyframes flutter{0%{transform:skew(0deg)scale(1)}20%{transform:translateY(100%)skew(-10deg,-10deg)scale(1)translateY(-100%)}40%{transform:translateY(100%)skew(10deg,10deg)scale(1.1)translateY(-100%)}60%{transform:translateY(100%)skew(-5deg,-5deg)scale(.9)translateY(-100%)}80%{transform:translateY(100%)skew(0deg)scale(1)translateY(-100%)}}:root{--menu-box-background:var(--color-water-deep);--menu-box-padding:32px;--menu-box-spacing:16px;--menu-button-color:var(--color-water-deep);--menu-button-border-radius:var(--loader-button-border-radius);--menu-font-size:1rem}#menu{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:absolute;top:0;left:0}#menu.visible{display:flex}#menu-box{background-color:var(--menu-box-background);border-radius:var(--menu-button-border-radius);-webkit-user-select:none;user-select:none;padding:var(--menu-box-padding);text-align:center;flex-direction:column;align-items:center;display:flex}#menu-box>*{margin-top:var(--menu-box-spacing);flex-grow:1;width:100%}#menu-box h1{color:var(--color-white);margin:unset}#menu-box button{background-color:var(--color-white);color:var(--menu-button-color);border-radius:var(--menu-button-border-radius);white-space:nowrap;min-width:max-content;padding-left:calc(2 * var(--menu-box-spacing));padding-right:calc(2 * var(--menu-box-spacing));height:54px;font-weight:700}#menu-box button:active{background-color:var(--color-fish-black);color:var(--color-white)}#menu-box label{color:var(--color-white);margin-right:var(--menu-box-spacing);font-size:18px}#menu-box input[type=range]{width:100%}#menu-box input[type=checkbox]{float:left;min-width:1rem;min-height:1rem}#menu-box select{width:100%;min-height:1.5rem}#menu-box table{text-align:right}:root{--card-color-background:#866764;--card-color-background-graphics:#7e605e;--card-color-drop-target:#fff5;--card-scale:1;--card-width-default:250px;--card-height-default:350px;--card-preview-width-default:200px;--card-preview-height-default:120px;--card-width:calc(var(--card-width-default) * var(--card-scale));--card-height:calc(var(--card-height-default) * var(--card-scale));--card-preview-width:calc(var(--card-preview-width-default) * var(--card-scale));--card-preview-height:calc(var(--card-preview-height-default) * var(--card-scale));--card-preview-margin:calc((var(--card-width) - var(--card-preview-width) - 2 * var(--card-preview-border)) * .5);--card-preview-columns:6;--card-preview-rows:10;--card-preview-fps:60;--card-preview-border-radius:6px;--card-preview-border:2px;--card-border-radius:12px;--card-drop-target-raise:-.26;--card-colors-size:20px;--card-colors-raise:.5;--card-colors-overlap:.25;--card-colors-gradient:280%;--card-info-spacing:12px;--card-info-color:#d7d4c8;--card-info-transparant-color:#d7d4c800;--card-info-slant:-18deg;--card-info-padding-right:6px;--card-info-text-color:#0c0c0c;--card-code-icon-radius:32px;--card-code-icon-margin:8px;--card-code-opacity:.5;--font-size:20px}.card-shape{width:var(--card-width);height:var(--card-height);margin-left:calc(var(--card-width) * -.5);margin-top:calc(var(--card-height) * -.5);border-radius:var(--card-border-radius)}.card{pointer-events:auto;cursor:pointer;background-color:var(--card-color-background);-webkit-user-select:none;user-select:none;box-shadow:0 0 var(--book-shadow-radius) var(--book-shadow-color);-webkit-tap-highlight-color:transparent;position:absolute;overflow:hidden}.card svg{z-index:-2;width:100%;height:100%;position:absolute}.card svg path{fill:var(--card-color-background-graphics)}.card .preview-frame{width:var(--card-preview-width);height:var(--card-preview-height);margin:var(--card-preview-margin);border-radius:var(--card-preview-border-radius);border:var(--card-preview-border) solid var(--card-info-color);background-color:var(--color-preview-outer);overflow:hidden}.card .colors{margin-top:calc(-1 * var(--card-preview-margin) - var(--card-colors-raise) * var(--card-colors-size));margin-left:var(--card-preview-margin);margin-right:calc(var(--card-preview-margin) + var(--card-colors-size) * .5)}.card .colors .colors-wrapper{flex-direction:row;justify-content:flex-end;display:flex}.card .colors .colors-wrapper .color{width:var(--card-colors-size);height:var(--card-colors-size);margin-left:calc(-1 * var(--card-colors-overlap) * var(--card-colors-size));border:var(--card-preview-border) solid var(--card-info-color);box-sizing:border-box;border-radius:50%}.card .colors .colors-wrapper .color.fill-white{background:radial-gradient(circle at top right, var(--color-fish-white), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-black{background:radial-gradient(circle at top right, var(--color-fish-black), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-gold{background:radial-gradient(circle at top right, var(--color-fish-gold), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-orange{background:radial-gradient(circle at top right, var(--color-fish-orange), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-red{background:radial-gradient(circle at top right, var(--color-fish-red), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-brown{background:radial-gradient(circle at top right, var(--color-fish-brown), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-purple{background:radial-gradient(circle at top right, var(--color-fish-purple), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-blue{background:radial-gradient(circle at top right, var(--color-fish-blue), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-pink{background:radial-gradient(circle at top right, var(--color-fish-pink), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-darkblue{background:radial-gradient(circle at top right, var(--color-fish-darkblue), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-lightpurple{background:radial-gradient(circle at top right, var(--color-fish-lightpurple), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-teal{background:radial-gradient(circle at top right, var(--color-fish-teal), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-green{background:radial-gradient(circle at top right, var(--color-fish-green), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-darkgreen{background:radial-gradient(circle at top right, var(--color-fish-darkgreen), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-lightbrown{background:radial-gradient(circle at top right, var(--color-fish-lightbrown), black var(--card-colors-gradient))}.card .colors .colors-wrapper .color.fill-bordeaux{background:radial-gradient(circle at top right, var(--color-fish-bordeaux), black var(--card-colors-gradient))}.card .info{width:calc(100% - 2 * var(--card-preview-margin));margin:var(--card-preview-margin);margin-bottom:0}.card .info.japanese{margin-top:calc(var(--card-preview-margin) * .5)}.card .info .property{margin-top:calc(var(--card-info-spacing) / 4);margin-bottom:calc(var(--card-info-spacing) / 4);font-size:20px;position:relative}.card .info.japanese .property{font-size:17px}.card .info .property .text{padding:calc(var(--card-info-spacing) / 4);color:var(--card-info-text-color);justify-content:space-between;align-items:flex-end;display:flex}.card .info .property .text .label{color:var(--card-info-color)}.card .info .property .text .label:after{content:":"}.card .info .property .text .value{float:right;padding-right:var(--card-info-padding-right)}.card .info .property .background{background:linear-gradient(to right, var(--card-info-transparant-color), var(--card-info-color));width:100%;height:100%;transform:skew(var(--card-info-slant));z-index:-1;position:absolute;top:0;left:0}.card button{width:100%;height:calc(2 * var(--card-code-icon-radius));margin-top:var(--card-code-icon-margin);pointer-events:auto;opacity:var(--card-code-opacity);position:relative}.card button:active{opacity:1}.card button svg{width:100%;height:100%;top:0;left:0}@keyframes fish-preview-x{0%{background-position-x:0}to{background-position-x:calc(-1 * var(--card-preview-width) * var(--card-preview-columns))}}@keyframes fish-preview-y{0%{background-position-y:0}to{background-position-y:calc(-1 * var(--card-preview-height) * var(--card-preview-rows))}}.card .preview-animation{width:100%;height:100%;animation:fish-preview-x calc(1s * var(--card-preview-columns) / var(--card-preview-fps)) steps(var(--card-preview-columns)) infinite, fish-preview-y calc(1s * var(--card-preview-rows) * var(--card-preview-columns) / var(--card-preview-fps)) steps(var(--card-preview-rows)) infinite;background-repeat:no-repeat}#drop-target{pointer-events:none;left:50%;bottom:calc(var(--card-drop-target-raise) * var(--card-height));background-color:var(--card-color-drop-target);transition:bottom .1s;position:absolute}#drop-target.hidden{bottom:calc(-1 * var(--card-height))}#code-icon{fill:var(--card-info-color)}#fish-icon-defs mask{fill:#fff}#fish-icon-defs #fish-icon-background,#fish-icon-defs #fish-icon-layer-wildcard{fill:var(--book-page-slot-color-icon-neutral)}#fish-icon-defs .white{fill:var(--color-fish-white)}#fish-icon-defs .black{fill:var(--color-fish-black)}#fish-icon-defs .gold{fill:var(--color-fish-gold)}#fish-icon-defs .orange{fill:var(--color-fish-orange)}#fish-icon-defs .red{fill:var(--color-fish-red)}#fish-icon-defs .brown{fill:var(--color-fish-brown)}#fish-icon-defs .purple{fill:var(--color-fish-purple)}#fish-icon-defs .blue{fill:var(--color-fish-blue)}#fish-icon-defs .pink{fill:var(--color-fish-pink)}#fish-icon-defs .darkblue{fill:var(--color-fish-darkblue)}#fish-icon-defs .lightpurple{fill:var(--color-fish-lightpurple)}#fish-icon-defs .teal{fill:var(--color-fish-teal)}#fish-icon-defs .green{fill:var(--color-fish-green)}#fish-icon-defs .darkgreen{fill:var(--color-fish-darkgreen)}#fish-icon-defs .lightbrown{fill:var(--color-fish-lightbrown)}#fish-icon-defs .bordeaux{fill:var(--color-fish-bordeaux)}:root{--book-shadow-color:#1d1d1d;--book-page-color:#bca994;--book-page-color-shade:#92806b;--book-page-color-side:#81715e;--book-page-color-highlight:#ded1bf;--book-page-shade-opacity:.7;--book-page-slot-color:#9d9d9d;--book-page-slot-color-icon-neutral:#949494;--book-page-shade-size:95%;--book-page-skew:30;--book-shadow-radius:12px;--book-hide-time:.5s;--book-button-padding:16px;--page-button-padding:10px;--page-button-page-shift:.75;--page-button-color-enabled:#75a757;--page-button-color-disabled:gray;--page-button-color-unfulfilled:#a43333;--page-button-shadow-radius:4px}#book{pointer-events:auto;background-color:var(--card-color-background);transition:var(--book-hide-time) ease;box-shadow:0 0 var(--book-shadow-radius) var(--book-shadow-color);-webkit-user-select:none;user-select:none;border-radius:var(--card-border-radius);align-items:center;transition-property:top;display:flex;position:absolute}#book.hidden{top:-100%!important}#book.invisible{visibility:hidden}#book #spine{width:0;margin-left:auto;margin-right:auto;position:relative}#book #spine .page{flex-wrap:wrap;justify-content:space-evenly;align-items:center;display:none;position:absolute;overflow:hidden}#book #spine .page .overlay{pointer-events:none;opacity:0;width:100%;height:100%;position:absolute}#book #spine .page .overlay.left{background-color:var(--color-white)}#book #spine .page .overlay.right{background-color:#000}#book #spine .page.visible{display:flex}#book #spine .page.left{background:linear-gradient(to right, var(--book-page-color) var(--book-page-shade-size), var(--book-page-color-highlight));transform-origin:100%;border-top-left-radius:var(--card-border-radius);border-bottom-left-radius:var(--card-border-radius);right:0}#book #spine .page.right{background:linear-gradient(to left, var(--book-page-color) var(--book-page-shade-size), var(--book-page-color-shade));transform-origin:0;border-top-right-radius:var(--card-border-radius);border-bottom-right-radius:var(--card-border-radius);left:0}#book #spine .page .slot{background-color:var(--book-page-slot-color);border-radius:calc(var(--card-border-radius) * var(--card-scale));position:relative;overflow:hidden}#book #spine .page .slot svg{width:100%;height:100%;position:absolute}#book #spine .page .slot .card{transform-origin:0 0;box-shadow:none;margin:0}#cards button:active svg{filter:drop-shadow(0 0 var(--page-button-shadow-radius) var(--book-shadow-color))}#button-load-card{right:var(--book-button-padding);top:calc(var(--button-height) * 2);position:absolute}#button-home{right:var(--book-button-padding);top:var(--button-height);position:absolute}#button-book{right:var(--book-button-padding);top:var(--book-button-padding);position:absolute}#button-book svg{filter:drop-shadow(0 0 var(--page-button-shadow-radius) var(--book-shadow-color))}#button-book:active path.page{fill:var(--color-white)}#button-book path.side{fill:var(--book-page-color-side)}.button-page{position:absolute}.button-page div{align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.button-page div p{padding-left:var(--page-button-padding);margin:0}.button-page svg{filter:drop-shadow(0 0 var(--page-button-shadow-radius) var(--book-shadow-color))}.button-page path{fill:var(--page-button-color-enabled)}.button-page:active path{fill:var(--color-white)}.button-page.locked path{fill:var(--page-button-color-unfulfilled);pointer-events:none}.button-page.disabled path{fill:var(--page-button-color-disabled);pointer-events:none}.button-page.left{left:calc(var(--button-width) * var(--page-button-page-shift) * -1)}.button-page.right{right:calc(var(--button-width) * var(--page-button-page-shift) * -1)}@media only screen and (orientation:portrait){#button-load-card{right:calc(var(--button-width) * 2 + var(--book-button-padding));top:var(--book-button-padding);position:absolute}#button-home{right:calc(var(--button-width) + var(--book-button-padding));top:var(--book-button-padding);position:absolute}}@media only screen and (orientation:portrait) and (width<=600px),(orientation:portrait) and (height<=600px){#button-load-card{right:calc(var(--button-width-small) * 2 + var(--book-button-padding));top:var(--book-button-padding);position:absolute}#button-home{right:calc(var(--button-width-small) + var(--book-button-padding));top:var(--book-button-padding);position:absolute}}@media only screen and (orientation:landscape) and (width<=600px),(orientation:landscape) and (height<=600px){#button-load-card{right:var(--book-button-padding);top:calc(var(--button-height-small) * 2);position:absolute}#button-home{right:var(--book-button-padding);top:var(--button-height-small);position:absolute}}:root{--button-width:80px;--button-height:80px;--load-card-button-padding:10px;--button-height-small:3.5rem;--button-width-small:3.5rem}button{width:var(--button-width);height:var(--button-height);box-sizing:border-box;cursor:pointer;pointer-events:auto;color:var(--color-white);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background-color:#0000;border:none;outline:none;padding:0;font-family:inherit;font-size:18pt}.home-button{position:absolute;top:0;right:0}@media (width<=600px) or (height<=600px){button{width:var(--button-width-small);height:var(--button-height-small);font-size:14pt}.button-page.left{left:calc(var(--button-width-small) * var(--page-button-page-shift) * -1)}.button-page.right{right:calc(var(--button-width-small) * var(--page-button-page-shift) * -1)}}:root{--overlay-element-color:#f6f6f6cc;--overlay-pointer-animation-time:1s;--overlay-pointer-radius:48px;--overlay-pointer-border:8px;--overlay-pointer-animation-scale:1.2;--overlay-highlight-animation-time:1.2s;--overlay-highlight-alpha:50%;--overlay-arrow-width:70px;--overlay-arrow-spacing:16px;--overlay-arrow-raise:32px;--overlay-arrow-scale:.7;--overlay-arrow-animation-time:.7s;--overlay-text-width:65%;--overlay-text-top:16px;--overlay-text-margin:5%}@keyframes pointer-pulse{0%{transform:translate(-50%,-50%)scale(1)}25%{transform:translate(-50%, -50%) scale(var(--overlay-pointer-animation-scale))}to{transform:translate(-50%,-50%)scale(1)}}@keyframes highlight-pulse{0%{opacity:0}20%{opacity:var(--overlay-highlight-alpha)}to{opacity:0}}@keyframes arrow-bounce-down{0%{margin-top:calc(-1 * var(--overlay-arrow-spacing))}50%{margin-top:calc(-1 * (var(--overlay-arrow-spacing) + var(--overlay-arrow-raise)))}to{margin-top:calc(-1 * var(--overlay-arrow-spacing))}}@keyframes arrow-bounce-up{0%{margin-top:calc(var(--overlay-arrow-spacing))}50%{margin-top:calc((var(--overlay-arrow-spacing) + var(--overlay-arrow-raise)))}to{margin-top:calc(var(--overlay-arrow-spacing))}}#overlay .pointer{width:calc(2 * var(--overlay-pointer-radius));height:calc(2 * var(--overlay-pointer-radius));border-radius:calc(var(--overlay-pointer-radius) + var(--overlay-pointer-border));border:var(--overlay-pointer-border) solid var(--overlay-element-color);animation:pointer-pulse var(--overlay-pointer-animation-time) infinite;animation-timing-function:ease-in-out;position:absolute}#overlay .text{width:var(--overlay-text-width);margin-top:var(--overlay-text-top);text-align:center;color:var(--color-white);border:2px solid var(--color-white);background-color:#325c73cc;border-radius:16px;margin-left:auto;margin-right:auto;font-size:32px}#overlay .text p{margin-left:var(--overlay-text-margin);margin-right:var(--overlay-text-margin)}.overlay-highlight{background-color:var(--color-white);width:100%;height:100%;animation:highlight-pulse var(--overlay-highlight-animation-time) infinite;animation-timing-function:ease-in-out;position:absolute}.overlay-arrow{border-top:var(--overlay-arrow-width) solid var(--overlay-element-color);border-right:var(--overlay-arrow-width) solid transparent;transform-origin:0 0;width:0;height:0;position:absolute}.overlay-arrow.down{animation:arrow-bounce-down var(--overlay-arrow-animation-time) infinite;transform:scale(var(--overlay-arrow-scale), 1) rotate(-135deg);animation-timing-function:ease-in-out;top:0;left:50%}.overlay-arrow.up{animation:arrow-bounce-up var(--overlay-arrow-animation-time) infinite;transform:scale(var(--overlay-arrow-scale), 1) rotate(45deg);animation-timing-function:ease-in-out;top:100%;left:50%}.skip-button{pointer-events:auto;width:auto;min-width:var(--button-width);-webkit-user-select:auto;user-select:auto;left:10px;bottom:var(--overlay-text-top);color:var(--color-white);border:2px solid var(--color-white);background:#325c73cc;border-radius:16px;font-size:1.5rem;position:absolute}#debrief-btn{z-index:10;pointer-events:auto;width:auto;min-width:0;color:var(--color-white);border:2px solid var(--color-white);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#325c73cc;border-radius:12px;padding:6px 16px;font-family:inherit;font-size:.95rem;transition:opacity .15s;display:none;position:absolute;top:10px;left:10px}#debrief-btn.unlocked{display:block}#debrief-btn:hover{opacity:.85}@media (width<=600px),(height<=600px){#debrief-btn{padding:4px 10px;font-size:.8rem}}#drop{pointer-events:none;width:100%;height:100%;transition:all .3s;position:absolute;top:0;left:0}#drop.possible{background-color:#f6f6f655}:root{--code-button-color:var(--color-code-10);--code-button-padding:32px;--code-button-margin:16px;--code-button-radius:var(--card-border-radius);--code-help-radius:24px;--code-shadow-radius:var(--book-shadow-radius);--code-shadow-color:var(--book-shadow-color);--code-font-size:32;--code-font-height:22;--code-font-padding:8;--code-font-spacing-base:1.1;--code-font-spacing-top:1.35;--code-font-color:var(--color-white);--code-background:#0006}#code{pointer-events:none;align-items:center;width:100%;height:100%;transition:all .3s;display:flex;position:absolute;top:0;left:0}#code.active{background-color:var(--code-background);pointer-events:auto}#code .view{pointer-events:none;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center;margin-left:auto;margin-right:auto;display:flex;position:relative}#code .view *{box-shadow:0 0 var(--code-shadow-radius) var(--code-shadow-color)}#code .view canvas{pointer-events:auto;border-radius:50%}@media (height<=600px){#code .view canvas{width:50%;height:50%}}#code .view button{background-color:var(--code-button-color);width:50%;padding:var(--code-button-padding);margin-top:var(--code-button-margin);border-radius:var(--code-button-radius)}#code .view button:active{background-color:var(--color-white)}#code .view button.help{width:calc(2 * var(--code-help-radius));height:calc(2 * var(--code-help-radius));border-radius:var(--code-help-radius);margin:0;padding:0;position:absolute;top:0;right:0}#code .view .help-text{box-shadow:none;position:absolute;bottom:100%}#code .view .help-text p{box-shadow:none;color:var(--color-white);text-align:center}
