#loadOverlay{display:flex;align-items:center;justify-content:center;letter-spacing:1vw;transition:all 125ms ease-in-out}#loadOverlay.hide{opacity:0;z-index:-1 !important}.btn{box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#556270;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:0.5em 0.6em;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit}.btn:hover{background-color:#6b7b8d;color:#fff;transform:translateY(-3px)}.btn:focus{background-color:#606f7e;color:#fff;transform:translateY(-3px)}.btn:active{background-color:#4a5562;color:#f2f2f2}.btn:hover,.btn:focus{transform:translateY(-3px)}.btn.btn-positive{box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#2ab27b;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:2rem;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit}.btn.btn-positive:hover{background-color:#3ed196;color:#fff;transform:translateY(-3px)}.btn.btn-positive:focus{background-color:#2fc789;color:#fff;transform:translateY(-3px)}.btn.btn-positive:active{background-color:#259d6d;color:#f2f2f2}.btn.btn-positive:hover,.btn.btn-positive:focus{transform:translateY(-3px)}.btn .ficon{display:inline-block;font-size:2em;padding:.5rem}.btn em{color:inherit}.go-home{position:fixed;top:4.5rem;right:1.5rem;z-index:3;box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#556270;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:0.5em 0.6em;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit}.go-home *{color:inherit}.go-home.no-options{top:0.5rem}.option-toggle{position:fixed;top:.5rem;right:1.5rem;z-index:9;box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#556270;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:0.5em 0.6em;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit}.options{position:fixed;top:0;right:0;height:100vh;width:30vw;min-width:360px;overflow-y:scroll;z-index:5;background-color:#fff;padding:1rem}.options .just-help label{margin-bottom:0}.options .just-help label+small{margin-top:0}.options label em,.options small em{color:inherit !important}.options .option-choice{opacity:0}.options .option-choice:focus+.option-display{outline:3px dashed;outline-offset:2px}.options .option-choice:checked+.option-display{box-shadow:inset 0px 0px 0px 0.2em rgba(30,30,30,0.5)}.options .option-display{display:inline-flex;font-size:1.5rem;height:2em;width:2em;align-items:center;justify-content:center;border-radius:2px;margin:.1rem .2rem}.options .option-display.theme .text-display{font-weight:bold}.options .option-display.theme-back{height:5em;width:5em;background-repeat:no-repeat;background-size:contain;background-position:center center}.print-promo{display:none;position:fixed;bottom:0;left:0;width:100%;justify-content:center;z-index:9001}@media print{.print-promo{display:flex}}.print-promo span{padding:.5rem;background-color:#ffffff}.catspaw_mention a{padding:1rem 2rem;border-radius:5px;background:#f1f1f1;color:#525563;position:relative}.catspaw_mention img{position:absolute;top:-1.2rem;right:-.6rem;border:0.35rem solid #525563;border-radius:100%;background-color:inherit;box-sizing:content-box;width:36px;height:36px}.modal{display:none}.modal[data-show="1"]{display:block}.modal .modal-dialog{z-index:1040}.colourpicker .colourpicker_swatch{padding:4px}.colourpicker .colourpicker_swatch .colourpicker_swatch_button{border-radius:4px;border:none;overflow:hidden}.colourpicker .colourpicker_swatch .colourpicker_swatch_button:hover,.colourpicker .colourpicker_swatch .colourpicker_swatch_button:focus{outline:0.2em solid #2d769c}.tool-tip-launcher{box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#556270;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:0.5em 0.6em;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit;text-align:center;border-radius:100%;height:2rem;width:2rem;line-height:1;line-height:0}.tool-tip-launcher:hover{background-color:#6b7b8d;color:#fff;transform:translateY(-3px)}.tool-tip-launcher:focus{background-color:#606f7e;color:#fff;transform:translateY(-3px)}.tool-tip-launcher:active{background-color:#4a5562;color:#f2f2f2}.tool-tip-launcher:hover,.tool-tip-launcher:focus{transform:translateY(-3px)}.tool-tip-launcher:hover,.tool-tip-launcherfocus{opacity:0.7}.tool-tip-launcher i{font-size:0.9em;color:white}tool-tip{background-color:#424242;color:#fff;border-radius:0.125rem;line-height:24px;height:24px;white-space:nowrap;padding:0 0.5rem;font-size:0.75rem;font-weight:600;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);pointer-events:none;transform-origin:center}tool-tip em{color:inherit}@keyframes limitedTooltip{0%{opacity:1}4%{opacity:1}96%{opacity:1}100%{opacity:0;animation-timing-function:ease-in-out}}@media print{#loadOverlay,.options,.option-toggle,.go-home,.modal{display:none !important}}body,html{background-color:#c4d6c5;font-size:1.1rem}*{margin:0px;padding:0px;color:#5a5a5a;font-family:Arial, Helvetica, sans-serif}.btn{box-sizing:border-box;border-radius:3px;box-shadow:0em 0.2em 0em 0em rgba(30,30,30,0.3);color:#fff;background-color:#556270;display:inline-block;text-decoration:none;-webkit-text-size-adjust:none;padding:0.5em 0.6em;transition:125ms all ease-in-out;cursor:pointer;border:none;font-size:inherit}.btn:hover{background-color:#6b7b8d;color:#fff;transform:translateY(-3px)}.btn:focus{background-color:#606f7e;color:#fff;transform:translateY(-3px)}.btn:active{background-color:#4a5562;color:#f2f2f2}.btn:hover,.btn:focus{transform:translateY(-3px)}.btn .ficon{display:inline-block;font-size:2em;padding:.5rem}.ficon{color:inherit}.option-toggle{position:fixed;top:.5rem;right:1.5rem;z-index:6}.options{position:fixed;top:0;right:0;height:100vh;width:40vw;min-width:360px;overflow-y:scroll;z-index:5;background-color:#fff;padding:1rem}.options .just-help label{margin-bottom:0}.options .just-help label+small{margin-top:0}.options label em,.options small em{color:inherit !important}.options .option-choice{opacity:0}.options .option-choice:focus+.option-display{outline:3px dashed;outline-offset:2px}.options .option-choice:checked+.option-display{box-shadow:inset 0px 0px 0px 0.2em rgba(30,30,30,0.5)}.options .option-display{display:inline-flex;font-size:1.5rem;height:2em;width:2em;align-items:center;justify-content:center;border-radius:2px;margin:.1rem .2rem}.options .option-display.theme{padding:0.2em;font-size:2rem}.options .option-display.theme .msg{display:block;height:0.4em;width:0.4em;background-color:white}.options .option-display.theme .msg.msg-1{opacity:.8}.options .option-display.theme .msg.msg-2{opacity:.6}.options .option-display.theme .msg.msg-3{opacity:.4}.go-home{top:0.5rem;right:6.5rem}.option-toggle,.go-home{transform:translateY(0%)}#piff-paff{--c-main-bg: #ebebeb;--c-main-bg-offset: rgba(30,30,30,0.06);--c-control: #5E40BF;--c-control-bg: #ffffff;--c-p1: #ecaf1e;--c-p2: #52c9f4;--c-win: #FFD130;--c-lose: #D92626;--game-border-width: 5px;--control-border-width: 4px;--controls-filter: drop-shadow(0px 2px 2px rgba(30,30,40,0.3));--attack-filter: drop-shadow(0px 2px 1px rgba(30,30,40,0.5));min-height:100vh;background-color:var(--c-main-bg);display:flex;flex-direction:column;justify-content:center;align-items:stretch}#piff-paff .player{position:relative;border:var(--game-border-width) solid var(--c-p1);border-top:none;padding:1.01rem;padding-top:1.5rem;z-index:0;height:50vh;overflow-y:auto;overflow-x:hidden}#piff-paff .player.bg-lines{background-size:20px 20px;background-image:repeating-linear-gradient(-45deg, var(--c-main-bg) 0, var(--c-main-bg) 10px, transparent 0, transparent 50%),repeating-linear-gradient(45deg, var(--c-main-bg-offset) 0, var(--c-main-bg-offset) 5px, transparent 0, transparent 50%)}#piff-paff .player.bg-dots{background-size:15px 15px;background-image:radial-gradient(circle at center, var(--c-main-bg-offset) 4px, transparent 0)}#piff-paff .player[data-player="2"]{transform:rotate(180deg);border-color:var(--c-p2)}#piff-paff .player .health{--health-height: calc(var(--game-border-width) * 2.5);--health-color: var(--c-p1);position:absolute;bottom:calc(100% - var(--health-height));left:-1px;width:0%;height:var(--health-height);background-color:var(--health-color);z-index:2}#piff-paff .player .health.player-2{--health-color: var(--c-p2)}#piff-paff .player .health:after{content:"";display:block;position:absolute;width:0;height:0;border-style:solid;border-color:transparent;border-width:var(--health-height) var(--health-height) 0 0;border-top-color:var(--health-color);left:100%}#piff-paff .player .display,#piff-paff .player .question{text-align:center;font-weight:bold;letter-spacing:1px;border:var(--control-border-width) solid var(--c-control);border-radius:1rem;background-color:var(--c-control-bg);filter:var(--controls-filter);z-index:1}#piff-paff .player .display{letter-spacing:0.1ch;font-size:3vh;height:6.5vh;display:flex;align-items:center;justify-content:center}#piff-paff .player .display .text{display:flex;align-items:center;justify-content:center;transform:translateX(0em)}#piff-paff .player .question{margin:0.6rem 2rem 0;position:relative;padding:.5rem}#piff-paff .player .question:after{content:"";display:block;position:absolute;width:0;height:0;border-style:solid;border-color:transparent;border-width:0 1rem 1rem 1rem;border-bottom-color:var(--c-control);left:50%;bottom:100%;transform:translate(-50%, 0%)}#piff-paff .player .question .text .letter{display:inline-block;opacity:0}#piff-paff .player .startstate,#piff-paff .player .winstates{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;display:none;opacity:0}#piff-paff .player .startstate:before,#piff-paff .player .winstates:before{content:"";display:block;position:absolute;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(30,30,40,0.6)}#piff-paff .player .startstate.shown,#piff-paff .player .winstates.shown{display:flex;opacity:1}#piff-paff .player .startstate.win .winstate.win,#piff-paff .player .winstates.win .winstate.win{display:block}#piff-paff .player .startstate.win .winstate.lose,#piff-paff .player .winstates.win .winstate.lose{display:none}#piff-paff .player .startstate .winstate,#piff-paff .player .winstates .winstate{position:relative;z-index:2;display:flex;align-items:center}#piff-paff .player .startstate .winstate.win,#piff-paff .player .winstates .winstate.win{display:none}#piff-paff .player .startstate .winstate.lose,#piff-paff .player .winstates .winstate.lose{display:block}#piff-paff .player .startstate .winstate img,#piff-paff .player .winstates .winstate img{width:250px;height:250px;object-fit:contain;max-height:27vh;filter:drop-shadow(0px 2px 10px rgba(30,30,40,0.3))}#piff-paff .player .startstate .gamename,#piff-paff .player .winstates .gamename{position:absolute;top:0;left:0;width:100%;text-align:center;color:white;height:0;font-weight:bold;font-size:4rem;line-height:1;filter:drop-shadow(0px 2px 10px rgba(30,30,40,0.3))}#piff-paff .player .startstate .introduction,#piff-paff .player .winstates .introduction{background-color:white;position:relative;display:flex;flex-direction:column;padding:1rem;padding-bottom:0;border-radius:1rem;max-width:calc(90% - 1rem);width:666px;filter:drop-shadow(0px 2px 10px rgba(30,30,40,0.3))}#piff-paff .player .startstate .introduction .text,#piff-paff .player .winstates .introduction .text{text-align:center;font-size:0.9rem}#piff-paff .player .startstate .starter,#piff-paff .player .startstate .rematch,#piff-paff .player .winstates .starter,#piff-paff .player .winstates .rematch{margin:1rem;padding:1rem;border:none;border-radius:1rem;background-color:var(--c-control);color:white;font-weight:bold;transform:scale(0) translateY(-100%);filter:drop-shadow(0px 2px 10px rgba(30,30,40,0.3))}#piff-paff .player .startstate .starter.starter,#piff-paff .player .startstate .rematch.starter,#piff-paff .player .winstates .starter.starter,#piff-paff .player .winstates .rematch.starter{transform:initial;filter:drop-shadow(0px 0px 2px rgba(30,30,40,0.3))}#piff-paff .player .startstate .starter:hover,#piff-paff .player .startstate .starter:focus,#piff-paff .player .startstate .rematch:hover,#piff-paff .player .startstate .rematch:focus,#piff-paff .player .winstates .starter:hover,#piff-paff .player .winstates .starter:focus,#piff-paff .player .winstates .rematch:hover,#piff-paff .player .winstates .rematch:focus{outline:2px solid white}#piff-paff .player .startstate .starter em,#piff-paff .player .startstate .rematch em,#piff-paff .player .winstates .starter em,#piff-paff .player .winstates .rematch em{color:inherit;opacity:0.9}#piff-paff .player .kb{--kb-bg-circ: #4374a8;--kb-bg-diaresis: #2a9d8f;--kb-bg-acute: #ffd25f;--kb-bg-grave: #ff9d4d;--kb-bg-digraph: #e76f51;--kb-act-circ: #326397;--kb-act-diaresis: #228176;--kb-act-acute: #f1c044;--kb-act-grave: #f58f3c;--kb-act-digraph: #d15a3d;--kb-fg-circ: white;--kb-fg-diaresis: white;--kb-fg-acute: black;--kb-fg-grave: black;--kb-fg-digraph: white;max-width:900px;margin:0rem auto 0;filter:var(--controls-filter);transform:scale(0.9)}#piff-paff .player .kb:before,#piff-paff .player .kb:after{content:"";display:block;position:absolute;left:10%;bottom:100%;z-index:0;background-color:var(--c-control);width:var(--control-border-width);height:1.5rem;transform:translateX(-50%)}#piff-paff .player .kb:after{left:90%}#piff-paff .player .kb .hg-button{font-weight:bold}#piff-paff .player .kb .blank span{visibility:hidden}#piff-paff .player .kb .faded span{opacity:0.3}#piff-paff .player .kb .fas span{font-family:inherit !important}#piff-paff .player .kb .spacebar{margin:auto;max-width:75%;min-width:200px}#piff-paff .player .kb .spacebar span{visibility:hidden;opacity:0}#piff-paff .player .kb .hg-row:first-child,#piff-paff .player .kb .hg-row:last-child{justify-content:center}#piff-paff .player .kb .special-toggle{max-width:5rem}#piff-paff .player .kb .letter-circ{background-color:var(--kb-bg-circ);color:var(--kb-fg-circ)}#piff-paff .player .kb .letter-circ:active{background-color:var(--kb-act-circ)}#piff-paff .player .kb .letter-diaresis{background-color:var(--kb-bg-diaresis);color:var(--kb-fg-diaresis)}#piff-paff .player .kb .letter-diaresis:active{background-color:var(--kb-act-diaresis)}#piff-paff .player .kb .letter-acute{background-color:var(--kb-bg-acute);color:var(--kb-fg-acute)}#piff-paff .player .kb .letter-acute:active{background-color:var(--kb-act-acute)}#piff-paff .player .kb .letter-grave{background-color:var(--kb-bg-grave);color:var(--kb-fg-grave)}#piff-paff .player .kb .letter-grave:active{background-color:var(--kb-act-grave)}#piff-paff .player .kb .letter-digraph{background-color:var(--kb-bg-digraph);color:var(--kb-fg-digraph)}#piff-paff .player .kb .letter-digraph:active{background-color:var(--kb-act-digraph)}#piff-paff .player .kb .letter-special span{color:inherit}#piff-paff .player .kb .special-toggle{display:flex;align-items:center;justify-content:center;text-align:center}#piff-paff .player .kb .special-toggle.letter-digraph span{line-height:1}#piff-paff .player .kb .special-toggle span{width:1em;height:1em;border-radius:100%;background-color:white;color:black;line-height:1.3;font-size:1.5em;overflow:hidden;font-weight:bold}#piff-paff .attack{--attack-color: var(--c-p1);position:absolute;z-index:20;top:50%;left:50%;margin-left:-20px;margin-top:20px;content:"";display:block;position:absolute;width:0;height:0;border-style:solid;border-color:transparent;border-width:0 20px 20px 20px;border-bottom-color:var(--attack-color);filter:var(--attack-filter);opacity:0}#piff-paff .attack.player-2{margin-top:-40px;content:"";display:block;position:absolute;width:0;height:0;border-style:solid;border-color:transparent;border-width:20px 20px 0 20px;border-top-color:var(--attack-color);--attack-color: var(--c-p2)}