@keyframes pulse{0%,to{opacity:1}50%{opacity:.75}}@keyframes borderPulse{0%,to{border-color:rgba(255,255,255,.24)}50%{border-color:rgba(255,255,255,.5)}}body{margin:0;box-sizing:border-box;overflow:hidden;background:linear-gradient(148.32deg,#cacaca 14.96%,#d5d5d5 78.32%)}#bodyContainer{display:flex;flex-direction:column;height:100%}body,html{height:100%}#pad,.app,.card,body,html{-webkit-user-select:none;user-select:none}body.drawing-lock{overscroll-behavior:none;touch-action:none}#pad{touch-action:none;-webkit-touch-callout:none}#guidelines{pointer-events:none;position:absolute;display:flex;flex-direction:column;left:0;width:100%;z-index:2;background-image:url(../images/pad-bg.svg);height:100%}#guidelines p.small{padding-left:1em;color:#587979;margin:1em 0 .25em}#actionPanel{display:flex;justify-content:space-between;width:100%;padding:2em;box-sizing:border-box}#actionPanel button.key{min-width:108px}#tools,#wordControl{display:flex;gap:1.5em}#writeArea{flex-shrink:0;flex-grow:1;align-self:stretch}#writeArea p.small{align-self:flex-start;margin-left:2.1333333333em;position:relative;top:-.75em;z-index:3;display:none}#canvasContainer,canvas{width:100%;border-radius:.5em;height:100%}#canvasContainer{overflow:hidden}canvas{mix-blend-mode:multiply;position:relative;flex:1 1 auto;z-index:4}#writeArea,button#begin{display:flex;align-items:center}#writeArea{flex-direction:column;padding:0;gap:60px;width:100%;background:#fff;overflow:hidden}#pad,#writeArea,button.key:after{position:relative}button{pointer-events:all;appearance:none;cursor:pointer;padding:0;margin:0;font-size:1em}button#begin{border:0;background:#ff362b;width:150px;height:150px;border-radius:15vw;position:absolute;transform:translate(-50%,-100%);justify-content:center}button.default{background-color:#ff4043;color:#fff;padding:.7em 1.25em;border-radius:4px}button,button#overlayClose,header #settings #difficulty select{border:0;background-color:transparent}#difficultyBar{display:flex;background-color:#cacaca;border-radius:4px}#difficultyBar button,button.discreet{background-color:transparent;font-size:.9375em}#difficultyBar button{padding:.466667em;color:#383838}#difficultyBar button.active{background-color:#ff4043}button.discreet{padding:0;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}button.key{border-radius:5px;padding:2em .75em 1em;text-align:left;transition:box-shadow .2s;tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent;font-size:.9em}button.key:after{content:" ";width:.5em;height:.5em;display:inline-block;background-color:#fff;border-radius:.25em;margin-left:.625em;top:-.125em;box-shadow:inset 0 0 1px 1px rgba(0,0,0,.11) ease-in}button.key.black{background:#2d2d2d;color:#fff;box-shadow:2px 2px 5px rgba(0,0,0,.5),6px 10px 20px rgba(0,0,0,.45),inset -1px -1px 1px rgba(0,0,0,.25),inset 1.5px 1.5px 1px rgba(255,255,255,.19)}button.key.black.active{box-shadow:0 0 1px 2px transparent,1px 1px 1px rgba(0,0,0,.04),inset 2px 0 3px rgba(0,0,0,.85),inset -1.5px 0 1px rgba(255,239,239,.28)}button.key.white{color:#000;background-color:#d1d1d1;box-shadow:2px 2px 5px rgba(0,0,0,.5),7px 11px 20px rgba(0,0,0,.35),inset -1px -1px 1px rgba(0,0,0,.25),inset 1.5px 1.5px 1px rgba(255,255,255,.19)}button.key.white.active,button.key.white:active,button.key.white[disabled]{box-shadow:2px 2px 5px rgba(0,0,0,.01),7px 11px 20px rgba(0,0,0,.03),inset -1px -1px 1px rgba(0,0,0,.05),inset 1px 1px 2px rgba(0,0,0,.12)}button.key.blue:after{background-color:#8bc6d0}button.key.terracotta:after{background-color:#d08b7e}button.key.red:after{background-color:#ff4043}button.key.yellow:after{background-color:#fff389}button.key.green:after{background-color:#34c759}header #settings{width:25%;display:flex;flex-direction:row;gap:1em}header #settings>div{width:50%}#overlay>div.active,body,header #settings #difficulty{display:flex;flex-direction:column}header #settings #difficulty select{appearance:none;font:inherit;color:#ff4043;text-transform:uppercase;outline:0}header #settings #difficulty select:open{text-transform:none}header #settings #difficulty #difficultyBar{display:flex;justify-items:stretch}header #settings #difficulty #difficultyBar button{flex-grow:1;border-radius:.25em}#state #shield{flex-basis:25%;flex-grow:0;position:relative}#state #shield #pieContainer{position:relative;width:150px}#state #shield #pieContainer #shieldInfo{display:flex;flex-direction:column;justify-content:center;align-content:center;height:100%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}#state #shield #pieContainer #shieldInfo #shieldLabel{text-align:center}#state #shield #pieContainer #shieldInfo #shieldHealth{font-size:.875em;color:#ff4043;font-weight:300;text-align:center}#state #shield #pieContainer #shieldInfo #shieldHealth:after{content:"%"}#state #shield #pieContainer #chart{display:flex}#state #shield #pieContainer #chart svg g{filter:url(#drop-shadow-path-line)}#state .small{text-shadow:rgba(202,202,202,.75)0 0 4px}#state .redGlow{text-shadow:rgba(255,64,67,.7)0 0 4px}#state .redGlow.valueText{text-shadow:rgba(255,64,67,.9)0 0 4px}#state #detailsPanel{flex-grow:1;flex-basis:0;display:flex;flex-direction:column;gap:1.5em}#state #detailsPanel #levelStatus #levelInfo .redGlow,#state #detailsPanel #progressText,#state #detailsPanel .bracket,div.tools label{color:#ff4043}#state #detailsPanel #levelStatus,#state #detailsPanel #urgency{display:flex;flex-direction:row;gap:1.5em}#state #detailsPanel #levelStatus #progress #progressHeader span,.small{font-size:.9375em}#state #detailsPanel #levelStatus #progress #progressInLevel{background:0 0;width:auto;display:flex;align-items:center;justify-content:center;flex-direction:row;gap:.625em;position:relative;left:-.5em}#state #detailsPanel #levelStatus #progress #progressInLevel .step{width:.21875em;height:1.5em;background:#cacaca;display:inline-block;transform:rotate(45deg)}#state #detailsPanel #levelStatus #progress #progressInLevel .step.done{background:#ff4043}#state #detailsPanel #levelStatus #levelInfo{width:50%;display:inline-block;overflow:hidden;align-content:flex-start;justify-content:flex-start}#state #detailsPanel #levelStatus #levelInfo p{margin:0 0 .25em}#state #detailsPanel #levelStatus #levelInfo #chevronProgressBar{display:flex;border-radius:.25em;overflow:hidden}#state #detailsPanel #levelStatus #levelInfo #chevronProgressBar .chevronContainer.done svg path{stroke:#ff4043}#state #detailsPanel #levelStatus #levelInfo #chevronProgressBar .chevronContainer{overflow:visible;width:.82em;position:relative;display:inline-block}#overlay #title_screen button#begin img,#state #detailsPanel #levelStatus #progress{width:50%}#state #detailsPanel #urgency{justify-content:flex-start}#state #detailsPanel #urgency p{margin:0;color:#cacaca}#state #detailsPanel #urgency .largeNumber{line-height:1em;font-size:2em;font-weight:400;color:#ff4043}#state #rewards{flex-basis:25%;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:.5em}#state #rewards #rewardsPanel{display:flex;flex-direction:row;align-items:flex-end;gap:1em;flex-wrap:wrap}#state #rewards #rewardsPanel .reward-slot img{width:100%;aspect-ratio:1/1}#state #rewards #rewardsPanel .reward-slot:empty:nth-child(n+17){display:none}#state #rewards #rewardsPanel .reward-slot{background-color:rgba(255,255,255,.08);border-radius:.25em;border:1px solid rgba(255,255,255,.24);width:2em;height:2em;position:relative}#state #rewards #rewardsPanel .reward-slot .reward-icon{overflow:hidden;border-radius:.7em}#state #rewards #rewardsPanel .reward-slot .reward-count{position:absolute;right:0;top:0;transform:translate(50%,-50%);width:1.5em;height:1.5em;border-radius:2em;font-size:.667em;font-weight:500;line-height:1.33em;background-color:#ff4043;display:flex;justify-content:center;align-items:center}#state #rewards #rewardsPanel .reward-slot.reward-slot--blink{border-color:rgba(255,255,255,.24);animation:borderPulse 1s ease-in-out infinite}#state #rewards #rewardsPanel .reward-slot.reward-slot--blink .reward-icon{animation:pulse 1s ease-in-out infinite}#stateScreenShine{position:absolute;top:-3em;left:-24.6875em;pointer-events:none;height:26.875em;width:59.75em;z-index:100}#panelControls,header{justify-content:space-between}header{flex-direction:column;background-color:#0e0e0e;padding:3em 2em 2.5em;color:#cacaca;margin-bottom:0;flex-shrink:0;background:#0e0e0e}#panelControls #logo{margin-bottom:2em;flex-shrink:0}#panelControls{display:flex;border-bottom:1px solid rgba(255,64,67,.5);margin-bottom:1.7em;align-items:flex-start}#panelControls a{align-self:flex-start;color:#ff4043;text-decoration:none;font-weight:400;font-size:.9375em}#state,header{display:flex;position:relative}#state{width:100%;gap:1.5em}#overlay>div,div.speechbubble{box-sizing:border-box;position:absolute}#overlay,#overlay>div{height:100%;left:0;top:0;background-color:rgba(220,217,214,.8)}#overlay>div{opacity:1;text-align:center;display:none;overflow-x:scroll;width:100vw;align-content:flex-start;padding:4em 6em}#overlay>div .container{text-align:left;align-self:center}#overlay>div .container h2{color:#ff4043;font-size:3.125em;font-weight:700;padding:0;margin:0 0 .4em;line-height:1em}#overlay>div .container p{margin:.75em 0 1.5em;color:#383838;font-weight:500}#overlay>div .controlScreenController{position:relative}#overlay>div img.comms_link{width:100%;margin-bottom:2.5em}#overlay>div button.primary.response{margin-top:2em}#overlay>div#reward .container img{mask:url(./../images/sci-fi_mask.svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:left;mask-position:left;width:100%}#overlay button,#overlay>div{pointer-events:none}#overlay .correctSpelling{font-weight:700}#overlay.active{justify-content:flex-start;display:flex;opacity:1}#overlay div button,#overlay.active,#overlay.active button{pointer-events:all}#overlay{width:100%;position:fixed;-webkit-backdrop-filter:blur(7.5px);backdrop-filter:blur(7.5px);transform:translate3d(0,0,0);transition:transform .5s cubic-bezier(.4,.2,.2,1);color:#fff;flex-direction:column;justify-content:center;overflow:hidden}#overlay[hidden]{transition:transform .3s cubic-bezier(.8,0,.6,.8);transform:translate3d(0,-100%,0);opacity:1}#overlay[hidden],#overlay[hidden] button{pointer-events:none}div.speechbubble{width:26em;background-color:#fff;border:2px solid #000;border-radius:18px;padding:1.25em 2em;top:2em;left:2em;font-size:1.25em;color:#000;font-family:"Comic Neue","Comic Sans MS","Comic Sans",cursive;text-transform:uppercase;text-align:left;font-style:italic;z-index:3}div.speechbubble.tl:after{content:url(/images/speech_bubble_arrow.svg);position:absolute;right:15em;bottom:-1.38em}#overlay,div.tools{z-index:10;display:flex}div.tools{position:absolute;bottom:1.5em;left:2em;font-size:1.125em;font-weight:500;flex-direction:row;gap:1.5em;display:none}div.tools input[type=checkbox]{border:2px solid #ff4043;height:1em;width:1em;margin:0;padding:0;background-color:#ff4043;border-radius:0}#overlay #title_screen{height:100%;padding:0;width:100vw;scroll-snap-type:x mandatory;background-color:#000;position:relative}#overlay #title_screen #title_container{display:flex;flex-wrap:nowrap;flex-direction:row;min-width:min-content;scroll-behavior:smooth;position:relative;height:100%;width:100%;padding:0;transition:opacity .8s ease-in;opacity:0}#overlay #title_screen #title_container #logo,#overlay img.header{width:calc(100% - 4em)}#overlay #title_screen #title_container img{width:100%;height:auto;background-position:top;object-fit:cover!important;object-position:center}#overlay,#overlay #title_screen #title_container.active{opacity:1}#overlay #title_screen #comicContainer{opacity:0;pointer-events:none;position:absolute;transition:opacity .3s .8s ease-out;display:flex;flex-direction:column;align-items:end}#overlay #title_screen #comicContainer.active{opacity:1;pointer-events:all}#overlay #title_screen button#begin{position:absolute;z-index:10;left:47.8vw;top:86vh;width:25vw;height:auto;aspect-ratio:1/1;border-radius:100%;border:1.5em solid #a32a22;box-shadow:0 0 0 6px #161919}#overlay #title_screen button#startGame{position:relative;margin-top:-5em;margin-right:2em;flex-grow:0}#overlay #title_screen button#overlayClose{color:#ff4043;position:fixed;right:1.5em;bottom:1.5em;font-size:1em;z-index:10}#overlay #title_screen .page{min-width:100vw;height:100%;display:flex;position:relative;scroll-snap-align:start}#overlay #title_screen .page .background{position:absolute;width:100%;height:100%;top:0;left:0;z-index:0;object-fit:cover}#overlay #title_screen .page .foreground{position:absolute;bottom:0;z-index:2;width:100%;height:100%;object-fit:cover;object-position:center top}#overlay img.header{left:2em;margin-top:2.25em;height:auto;position:absolute;z-index:1}#overlay #comicContainer{height:100%;overflow-y:scroll}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;src:local("IBM Plex Mono SemiBold"),url(/fonts/plex-mono/IBMPlexMono-SemiBold.woff2)format("woff2")}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:700;src:local("IBM Plex Mono Bold"),url(/fonts/plex-mono/IBMPlexMono-Bold.woff2)format("woff2")}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;src:local("IBM Plex Mono Medium"),url(/fonts/plex-mono/IBMPlexMono-Medium.woff2)format("woff2")}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;src:local("IBM Plex Mono Medium"),url(/fonts/plex-mono/IBMPlexMono-Regular.woff2)format("woff2")}@font-face{font-family:"Comic Neue";font-style:normal;font-weight:700;src:local("Comic Neue"),url(/fonts/ComicNeue-BoldItalic.ttf)format("ttf")}body,button{text-transform:uppercase;font-family:"IBM Plex Mono",monospace}:root{overscroll-behavior:none}#feedback{position:absolute;display:none}@media (max-width:760px){body{font-size:.9em}}@media (max-width:710px){body{font-size:.8em}}@media (max-width:660px){body{font-size:.7em}}@media (max-width:620px){body{font-size:.6em}}@media (max-width:720px){header #settings #difficulty #difficultyBar button{font-size:.9333333333em;padding:.3em}}@media (min-aspect-ratio:1/1){#overlay #title_screen button#begin{align-self:flex-end;top:auto;bottom:-18vw;width:22vw}}