:root{--primary-color: #ffd700;--secondary-color: #5d31ff;--white: #fff;--extract-color: #212121;--extract-bg-color: var(--white);--letter-line-height: 1.5;--bg-color: #1a1919;--menu-title-color: #ffd700;--button-font-color: #212121;--button-bg-color: var(--white);--button-font-size: 1rem;--input-font-size: 2rem;--input-bg-color: #f5f5f5;--firefly-color: #ffd700;--primary-text: #212121;--secondary-text: #52ecd0;--firefly-word-color: #fff3b7;--mistaken-input-color: #ff9bff;--game-canvas-overlay-color: rgba(0, 0, 0, .6);--font-main-title: 6rem;--font-xs: .8rem;--font-sm: 1rem;--font-md: 1.25rem;--font-lg: 2rem;--font-xl: 3rem;--font-2xl: 4rem;--space-2xs: .25rem;--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--space-2xl: 4rem;--space-3xl: 6rem;--border-radius: 1.5rem;--padding-sm: 1rem;--padding-md: 1.5rem;--padding-lg: 2rem;--option-section-color: #f2f2f2;--options-text-color: #f5f5f5}html,body{margin:0;padding:0;height:100vh;font-family:Roboto,sans-serif;interpolate-size:allow-keywords}*{box-sizing:border-box;margin:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:inherit}#root{min-height:100vh;width:100%;display:flex;background:var(--bg-color)}.sr-only{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.container{background:#0009}kbd{background-color:none;color:var(--secondary-text);border-radius:.5rem;padding:.2rem .5rem;border:1px solid var(--secondary-text);text-shadow:none;border-bottom-width:4px;box-shadow:0 0 4px var(--secondary-text);opacity:.8}.kbd-key{animation:press-key .8s ease-in-out infinite}#game-canvas{height:100vh;width:100%;position:relative;overflow:hidden;display:flex;flex-direction:column;z-index:10}#game-canvas .loader-container{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:99;background-color:var(--game-canvas-overlay-color)}#game-canvas .loader{transform:translateY(50%);font-size:3rem;color:#fff;text-shadow:0 0 .5rem #52ecd0}#game-canvas:after{content:"";position:absolute;inset:0;background-image:url(/assets/waterfall-CVOXqauk.jpg);z-index:-1;background-size:cover;background-position:center}#game-canvas .combo-container{position:absolute;top:2rem;right:3rem;display:flex;align-items:baseline;--bar-radius: 100vw}#game-canvas .combo-container .combo-counter{display:flex;color:#fff;text-shadow:0 0 .5rem #52ecd0;align-items:baseline;transform:skew(-20deg)}#game-canvas .combo-container .combo-counter div:first-child{font-size:1rem}#game-canvas .combo-container .combo-counter div:last-child{font-size:1.5rem}#game-canvas .combo-container .combo-bar-container{background:#212121;border-radius:var(--bar-radius);margin-right:.5rem;overflow:hidden}#game-canvas .combo-container .combo-bar{width:12rem;height:.3rem;background-color:var(--firefly-color);transform:skew(-20deg)}#game-canvas .flash-overlay-container .flash-overlay{inset:0;position:absolute}#tsparticles{position:absolute;overflow:hidden;inset:0;z-index:11;pointer-events:none}.ui-element{position:absolute;z-index:15}#dark-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.cloak{opacity:0;visibility:hidden}#menu{width:100vw;background-color:transparent;z-index:10;display:flex;overflow:hidden;justify-content:center;align-items:center}#menu:after{content:"";position:absolute;inset:0;background-image:linear-gradient(to bottom,#0009),url(/assets/fantasy-BWy87EqD.jpg);z-index:-1;background-size:cover;background-position:center}#menu .game-title{display:flex;flex-direction:column;padding-bottom:var(--space-xl)}#menu .game-title h1{font-size:var(--font-main-title);color:var(--menu-title-color);text-shadow:0 0 .5rem #ffffff,0 0 2rem #1cea11;padding-bottom:10vh}#menu .game-title .game-description{width:100%;font-size:var(--font-xl);color:var(--menu-title-color);text-shadow:0 0 .5rem #52ecd0;padding-bottom:10vh;text-align:center}#menu .game-title .game-options-btn{display:flex;align-items:center;align-self:center;font-size:var(--font-lg);background:none;border:none;color:#fff;cursor:pointer;width:fit-content;margin-bottom:10vh;font-weight:600}#menu .game-title .game-options-btn:hover{filter:brightness(.9)}#menu .game-title .game-options-btn span{text-wrap:nowrap}#menu .game-title .game-options-btn svg{width:1.2rem;height:1.2rem}#menu .game-title .main-btn{align-self:center}#menu .settings-dialog{display:flex;flex-direction:column;background:#0009;padding:2rem 0;border-radius:2rem;outline:none;border:none;margin:auto;height:90vh;width:90%;max-width:980px}#menu .settings-dialog::backdrop{background-color:transparent;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}#menu .setting-tabs{display:flex;justify-content:center;gap:1rem;list-style:none;color:#fff;font-size:var(--font-md);font-weight:600;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1)}#menu .setting-tabs .setting-tab{padding:.5rem 1rem;cursor:pointer;transition:all .2s ease-in-out}#menu .setting-tabs .setting-tab:not(.active){filter:brightness(.6)}#menu .setting-tabs .setting-tab:hover:not(.active){filter:brightness(.8)}#menu .setting-tabs .setting-tab.active{filter:brightness(.9)}#menu .settings-wrapper{display:flex;flex-direction:column;width:100%;column-gap:2rem;background:transparent;padding:3rem;border:none;max-height:80vh;overflow:auto;scrollbar-gutter:stable;scrollbar-color:var(--firefly-color) transparent;--option-size: var(--font-md);font-size:var(--option-size);color:var(--option-section-color)}#menu .settings-wrapper .gameplay-settings{display:flex;gap:4rem;flex-wrap:wrap}#menu .settings-wrapper h2{font-size:var(--font-md);font-weight:700;padding-bottom:2.5rem}#menu .settings-wrapper .close-btn{position:absolute;top:.5rem;right:.5rem;background:none;border:none;cursor:pointer;font-size:var(--font-md)}#menu .settings-wrapper .close-btn svg{width:4rem;height:4rem;fill:var(--firefly-color);stroke:#000}#menu .settings-wrapper .close-btn:hover svg{filter:brightness(.7)}#menu .settings-wrapper .common-options-container{flex:2}#menu .settings-wrapper .common-option-container~.common-option-container{margin-top:var(--space-md)}#menu .settings-wrapper .option-title{text-transform:capitalize;font-weight:600}#menu .settings-wrapper .common-option-container{display:flex;justify-content:space-between;gap:6rem;align-items:baseline;border:none;color:var(--options-text-color);isolation:isolate}#menu .settings-wrapper .common-option-container .common-options-border{padding:.2em;background:#212121;border-radius:100vw;box-shadow:inset 0 4px 8px 2px #0009,inset 0 -1px 2px #ffffff1a,inset 0 0 10px #ff68190d}#menu .settings-wrapper .common-option-container .common-options{--common-options-width: 380px;position:relative;display:flex;font-size:var(--font-md);width:var(--common-options-width);isolation:isolate}#menu .settings-wrapper .common-option-container .common-options .common-option{width:100%}#menu .settings-wrapper .common-option-container .common-options input:checked+.selector-text{color:var(--extract-color);transition:all .3s ease-in-out;font-weight:600}#menu .settings-wrapper .common-option-container .common-options div.selector-indicator{position:absolute;top:0;left:0;width:0;height:100%;z-index:-1;background:var(--primary-color);border-radius:999px;box-shadow:0 0 1rem #ffc80266,inset 0 4px 6px -2px #fff9,inset 0 -2px 8px 2px #ff6819,inset 0 -6px 10px #0000004d}#menu .settings-wrapper .common-option-container .selector-text{transition:all ease-in-out;transition-delay:.1s;text-transform:capitalize;cursor:pointer;display:inline-block;padding:.75rem 1.5rem;text-align:center;width:100%}#menu .settings-wrapper .common-option-container .selector-text:hover{color:#f0f0f0cc}#menu .settings-wrapper .extra-options-container{display:flex;flex-direction:column;color:#fff;flex:1}#menu .settings-wrapper .extra-options-container .option-title{padding-bottom:2rem}#menu .settings-wrapper .extra-options-container .extra-options{display:flex;gap:1.25rem;flex-wrap:wrap}@media(max-width:820px){#menu .settings-wrapper .extra-options-container .extra-options{flex-direction:column}}#menu .settings-wrapper .extra-options-container .game-toggle{background:#212121;color:#fffc;padding:1rem 1.5rem;border-radius:999px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--extract-color);font-size:var(--font-sm);text-transform:capitalize;font-weight:500;letter-spacing:.02em;transition:all .2s ease-in-out;max-width:200px;width:100%;border:none;box-shadow:inset 0 2px 8px 1px #0009,inset 0 -1px 2px #ffffff1a}#menu .settings-wrapper .extra-options-container .game-toggle:hover{filter:brightness(.9)}#menu .settings-wrapper .extra-options-container .game-toggle:active{transform:scale(.9)}#menu .settings-wrapper .extra-options-container .game-toggle:has(.toggle-indicator.on){color:#fffc;box-shadow:inset 0 2px 8px 1px #0009,inset 0 -1px 2px #ffffff1a,0 0 8px var(--firefly-color)}#menu .settings-wrapper .extra-options-container .game-toggle:has(.toggle-indicator.on).fleeing{box-shadow:0 0 8px var(--secondary-text),0 0 12px var(--secondary-color)}#menu .settings-wrapper .extra-options-container .toggle-label{color:#fff}#menu .settings-wrapper .extra-options-container .toggle-indicator{width:.75rem;height:.75rem;border-radius:50%;background:#fffc;transition:all .3s ease}#menu .settings-wrapper .extra-options-container .toggle-indicator.on{box-shadow:0 0 10px var(--firefly-color),0 0 0 1px #000;background:var(--firefly-color)}#menu .settings-wrapper .extra-options-container .toggle-indicator.on.fleeing{box-shadow:0 0 10px var(--secondary-text),0 0 0 1px #000;background:var(--secondary-text)}#menu .footer{position:absolute;bottom:0;width:100%;display:flex;justify-content:space-between;padding:0 var(--space-sm) var(--space-sm);font-size:var(--font-xs);align-items:center;color:#fffc;font-weight:600}#menu .footer .footer-content a{color:#fffc;text-decoration:none;transition:all .2s ease-in-out}#menu .footer .footer-content a:hover{filter:brightness(.9)}.btn-base{padding:.6em 1.5em;border-radius:2em;width:fit-content;cursor:pointer}.btn-base:hover{filter:brightness(1.1);transition:all .2s ease-in-out}.btn-base:active{transform:scale(.9);filter:brightness(.9);transition:all .2s ease-in-out}.btn-sm{font-size:var(--font-sm)}.btn-md{font-size:var(--font-md)}.btn-lg{font-size:var(--font-lg)}.main-btn{font-size:2rem;background:var(--secondary-color);box-shadow:inset 0 0 0 2px #639,inset 0 0 8px 4px hsl(from var(--secondary-color) h s 80),0 0 10px #ffc80280;border:none;color:var(--primary-color);font-weight:600}.main-btn:hover{filter:brightness(1.1);transition:all .2s ease-in-out}.main-btn:active{transform:scale(.9);filter:brightness(.9);transition:all .2s ease-in-out}.primary-btn{background:#ffc802;color:#000;font-weight:600;border:1px solid black}.secondary-btn{background:#0000001a;color:#fffc;font-weight:600;border:rgba(255 255 255 / .4) 1px solid}.input-container{position:absolute;bottom:0;width:100%;display:flex;justify-content:center}.input-container .typing-input-container{position:relative;display:flex;flex-direction:column;gap:1rem;width:20rem;padding:.5rem}.input-container .typing-input-container .typing-input-container-top{position:relative;display:flex;justify-content:center;text-align:center}.input-container .typing-input-container .typing-input-container-top:after{content:"";position:absolute;bottom:-.5rem;width:100%;height:2px;background:linear-gradient(to bottom,var(--firefly-color),orange);box-shadow:0 0 4px var(--secondary-text);z-index:-2}.input-container .typing-input-container .typing-input-container-top:has(.mistaken):after{background:linear-gradient(to bottom,var(--firefly-color),red);box-shadow:0 0 4px var(--mistaken-input-color)}.input-container .typing-input-container .typing-input-container-bottom{height:3rem}.input-container .typing-input-container .typing-input-container-bottom .input-tooltip{width:100%;height:100%;display:flex;gap:.5rem;justify-content:center;align-items:baseline;color:var(--secondary-text);font-size:var(--font-sm);opacity:0;color:#fffc;text-shadow:0 0 .5rem #52ecd0;transition:opacity .3s ease-in}.input-container .typing-input-container .typing-input{position:relative;transform:var(--input-transform);text-align:center;background:none;letter-spacing:.02em;border:none;width:75%;font-size:var(--input-font-size);outline:none;font-weight:600;color:var(--firefly-word-color);text-shadow:0px 0px 2px var(--secondary-text);filter:drop-shadow(0px 4px 2px rgba(0,0,0,.6))}.input-container .typing-input-container .typing-input.mistaken{color:var(--mistaken-input-color);text-shadow:0px 0px 4px red;animation:shake .2s ease-in-out}.input-container .typing-input-container .typing-input::placeholder{color:#fffc}#playground{position:relative;z-index:12;width:100%;height:100vh;pointer-events:none}#playground .firefly-group{will-change:transform,opacity}#playground .firefly-group .word{font-size:2.5rem;font-weight:400;letter-spacing:.05em;text-shadow:1px 2px 2px rgba(0 0 0),0 0 8px rgba(255 223 32 / .8);-webkit-user-select:none;user-select:none;pointer-events:none;fill:var(--firefly-word-color)}#playground .firefly-group .word.word-special{fill:#fff;font-weight:600;text-shadow:1px 1px 2px rgba(0 0 0);animation:hue-rotate 4s linear infinite}#playground .firefly-group .word.word-matched{animation:none}#playground .firefly-group .word.word-matched .char-matched{filter:brightness(1.2)}#playground .firefly-group .firefly-outer-body{opacity:80%;filter:blur(4px)}#playground .firefly-group .firefly-glow{filter:blur(8px);animation:firefly-pulse 2s ease-in-out infinite}#playground .firefly-group .firefly-glow.special-glow{filter:blur(4px);animation-duration:3s}#game-complete{position:relative;width:100%;display:flex;justify-content:center;align-items:center}#game-complete:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(to bottom,#0009),url(/assets/moon-zjF9PEZE.jpg);background-size:cover;background-position:center;background-attachment:fixed}#game-complete #results-container{display:flex;flex-direction:column;padding:4rem;position:relative;z-index:10;width:100%;max-width:1320px;gap:var(--space-xl)}#game-complete #results-container .results-info{display:flex;flex-direction:column;gap:var(--space-xl);padding:var(--space-lg);border-radius:var(--border-radius);background:var(--game-canvas-overlay-color)}#game-complete #results-container .results-info .options-summary{display:flex;gap:var(--space-2xl);padding-bottom:var(--space-lg)}#game-complete #results-container .results-info .options-summary .options-summary-container{display:flex;flex-direction:column;gap:var(--space-sm)}#game-complete #results-container .results-info .options-summary h3{font-size:var(--font-sm);font-weight:600;color:#fff}#game-complete #results-container .results-info .options-summary-list,#game-complete #results-container .results-info .extra-options-summary-list{display:flex;list-style:none;gap:.5rem}:is(#game-complete #results-container .results-info .options-summary-list,#game-complete #results-container .results-info .extra-options-summary-list) .option-summary-item{font-size:var(--font-sm);color:#fff;padding:.5rem 1rem;text-transform:capitalize;background:#fff3;border-radius:var(--border-radius)}#game-complete h2{font-size:font(--font-md);color:#fff;padding-bottom:2rem}#game-complete .statistics-container{display:flex;width:100%;gap:6rem;flex-direction:column}#game-complete .play-data>ul{list-style:none;color:#fff;display:grid;grid-template-columns:repeat(4,1fr);max-width:800px}#game-complete .play-data>ul.shift-down{grid-template-columns:repeat(3,1fr)}@media(max-width:1024px){#game-complete .play-data>ul{grid-template-columns:repeat(2,1fr)}}#game-complete .play-data>ul .play-datum{display:flex;flex-direction:column;justify-content:space-between;gap:.5rem;padding:var(--space-xs)}#game-complete .play-data>ul .play-datum span:first-child{font-size:var(--font-sm)}#game-complete .play-data>ul .stats-number{font-size:var(--font-lg);font-weight:600;color:#ffc802}#game-complete .play-data>ul .stats-number.moonlight{color:var(--secondary-text)}#game-complete .extract-container{position:relative;width:100%;display:flex;flex-direction:column;gap:1rem;align-items:center}#game-complete .extract-container .view-more-btn{background:none;border:none;font-size:var(--font-sm);color:#fff;padding:.5rem 1rem;cursor:pointer}#game-complete .extract-container .paragraphs-container{position:relative;z-index:10;display:flex;flex-direction:column;gap:1rem;line-height:1.5;height:3lh;overflow:hidden;mask-image:linear-gradient(to bottom,black 60%,transparent);-webkit-mask-image:linear-gradient(to bottom,black 60%,transparent);transition:all .5s ease-in-out;transition-behavior:allow-discrete}#game-complete .extract-container .paragraphs-container.show-text{height:auto;-webkit-mask-image:none;mask-image:none}#game-complete .extract-container .extract-paragraph:not(:first-child){margin-top:1rem}#game-complete .extract-container .extract-paragraph{max-width:65ch;font-size:var(--font-md);color:#fffc;text-shadow:0 0 .2rem #4800ff}#game-complete .extract-container .extract-word{display:inline-block;margin:.2rem}#game-complete .right-side{display:flex;justify-content:center}#game-complete .right-side .buttons-container{display:flex;gap:var(--space-lg);height:fit-content;position:sticky;top:4rem}@keyframes firefly-pulse{0%,to{transform:scale(.3);opacity:.3}50%{transform:scale(1);opacity:.7}}.image-container{position:absolute;inset:0;z-index:-1;overflow:hidden}.image-container>img{object-fit:cover;width:100%;height:100%}.image-container:after{content:"";position:absolute;inset:0;background:#0003}.firefly-swarm-container{position:fixed;inset:0;z-index:1000;overflow:hidden;pointer-events:none;display:flex;justify-content:center;align-items:center}.firefly-swarm-container .firefly-swarm-particle{position:absolute;width:12px;height:12px;opacity:0;border-radius:50%;background-color:#fde047;filter:blur(2px);box-shadow:0 0 15px 5px #fde04799}.loading-countdown{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:99}.loading-countdown h2{font-size:4rem;color:#fff;text-shadow:0 0 .5rem #52ecd0}.sound-settings .sound-sliders{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-md);font-size:var(--font-sm);font-weight:600}.sound-settings .sound-sliders .volume-option-container{display:flex;flex-direction:column;gap:var(--space-sm)}.sound-settings .sound-sliders .volume-value{font-size:var(--font-sm);color:var(--primary-color);width:50px;text-align:end}.sound-settings .sound-sliders .volume-slider-container{display:flex;align-items:center}.sound-settings .sound-sliders .sound-icon-container{display:flex;width:2.5rem;background:none;border:none;cursor:pointer;transition:all .2s ease-in-out}.sound-settings .sound-sliders .sound-icon-container:hover{filter:brightness(.9)}.sound-settings .sound-sliders .sound-icon-container .sound-icon{width:2rem;height:2rem}.sound-settings .sound-sliders .sound-icon-container .sound-icon .sound-icon-x-path,.sound-settings .sound-sliders .sound-icon-container .sound-icon .sound-icon-curve-path{fill:var(--primary-color)}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;background:transparent;cursor:pointer;border-radius:100vw;--thumb-size: .8rem}input[type=range]:hover{filter:brightness(.9)}input[type=range]::-moz-range-thumb{height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;background:var(--firefly-color);box-shadow:0 0 6px var(--primary-color)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;background:var(--firefly-color);box-shadow:0 0 6px var(--primary-color)}.volume-slider::-webkit-slider-runnable-track{background:none}.slider-outer{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;padding:.5rem;background:#212121;border-radius:var(--border-radius)}.hidden{opacity:0;visibility:hidden}@keyframes firefly-shadow{0%,to{opacity:.4}50%{opacity:.8;transform:scale(.9)}}@keyframes fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.5)}}@keyframes water-shimmer{0%,to{transform:translate(-50%) rotateX(80deg) scale(1);opacity:.8}50%{transform:translate(-50%) rotateX(78deg) scale(1.05);opacity:1}}@keyframes hue-rotate{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@keyframes shake{25%,75%{transform:translate(2px) rotate(2deg)}50%{transform:translate(-2px) rotate(-2deg)}to{transform:translate(0)}}@keyframes press-key{0%,to{transform:translateY(0);border-bottom-width:4px}50%{transform:translateY(3px);border-bottom-width:2px}}
