*{margin:0;padding:0}html,body{overflow:hidden}:root{--font-title:"p22-numismatic", sans-serif;--font-body:"futura-pt", sans-serif}body{font-family:var(--font-body)}button{font-family:inherit}#webgl{touch-action:none;outline:none;width:100%;height:100%;position:fixed;top:0;left:0}:root{--aurora-green:#5ee8b5;--loader-spin-duration:20s;--loader-fade-duration:.8s;--menu-pulse-duration:1.2s;--tutorial-loop-duration:3s}.loader{z-index:10;color:var(--aurora-green);transition:opacity var(--loader-fade-duration) ease;background:#03060a;flex-direction:column;justify-content:center;align-items:center;gap:2rem;display:flex;position:fixed;inset:0}.loader svg{width:min(30vmin,240px);height:auto;filter:drop-shadow(0 0 12px var(--aurora-green));animation:loader-spin var(--loader-spin-duration) linear infinite}.loader--hidden{opacity:0;pointer-events:none}.loader--unsupported svg{animation-play-state:paused}.loader__message{color:#fff;opacity:.8;font-size:1rem}@keyframes loader-spin{to{transform:rotate(360deg)}}.menu{z-index:5;color:#e8f4ff;-webkit-user-select:none;user-select:none;position:fixed;inset:0}.menu[hidden],.menu__label[hidden]{display:none}.menu__label{text-align:center;pointer-events:none;white-space:nowrap;position:absolute;top:0;left:0}.menu__name{font-family:var(--font-title);letter-spacing:.3em;text-transform:uppercase;color:var(--aurora-green);text-shadow:0 0 10px var(--aurora-green);font-size:1.2rem;font-weight:400}.menu__label--undiscovered .menu__name{color:#e8f4ff;text-shadow:none;opacity:.7;font-size:1.75rem}.menu__meaning{opacity:.75;margin-top:.25rem;font-size:1.125rem;font-style:italic}.sound{flex-direction:column;align-items:center;gap:.75rem;display:flex;position:absolute;bottom:5.5rem;right:1.25rem}.sound__volume{writing-mode:vertical-lr;width:1.5rem;height:7rem;accent-color:var(--aurora-green);cursor:pointer;direction:rtl}.sound__button svg line{transform-box:fill-box;transform-origin:50%;transition:transform .25s}.sound__button[aria-pressed=true] svg line{transform:scaleY(.15)}.menu-button{z-index:6;position:fixed;bottom:1.25rem;right:1.25rem}.menu-button,.sound__button,.help-button{color:#e8f4ff;cursor:pointer;background:#03060a80;border:1px solid #e8f4ff59;border-radius:50%;width:3.5rem;height:3.5rem;padding:.75rem;transition:color .2s,border-color .2s}.menu-button svg,.sound__button svg,.help-button svg{fill:none;stroke:currentColor;stroke-width:.085px;stroke-linecap:butt;stroke-linejoin:miter;width:100%;height:100%;display:block}.sound__button svg,.help-button svg{stroke-width:1.2px}.help-button svg rect{fill:currentColor;stroke:none}.menu-button:hover,.menu-button--open,.sound__button:hover,.help-button:hover{color:var(--aurora-green);border-color:var(--aurora-green)}.menu-button--pulse{animation:menu-pulse var(--menu-pulse-duration) ease-out 2}@keyframes menu-pulse{0%{color:var(--aurora-green);border-color:var(--aurora-green);box-shadow:0 0 0 0 var(--aurora-green)}to{box-shadow:0 0 0 1rem #0000}}.help-button{position:absolute;bottom:1.25rem;right:5.5rem}.tutorial{z-index:7;color:#e8f4ff;-webkit-user-select:none;user-select:none;background:#03060abf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.tutorial[hidden]{display:none}.tutorial__panel{text-align:center;background:#000;border:1px solid #5ee8b559;border-radius:1rem;max-width:52rem;padding:2.5rem 3rem;box-shadow:0 0 40px #5ee8b51f}.tutorial__title{font-family:var(--font-title);letter-spacing:.3em;text-transform:uppercase;color:var(--aurora-green);font-size:1.5rem;font-weight:400}.tutorial__steps{counter-reset:step;gap:5rem;margin:4rem 0;list-style:none;display:flex}.tutorial__step{counter-increment:step;flex:1;max-width:12rem;font-size:1.125rem;line-height:1.4}.tutorial__step p:before{content:counter(step) ". ";color:var(--aurora-green);font-size:1.25rem}.tutorial__art{justify-content:center;align-items:center;width:120px;height:80px;margin:0 auto 1rem;display:flex;position:relative}.tutorial__art svg{fill:none;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%;position:absolute;inset:0}.tutorial__key{letter-spacing:.15em;color:#e8f4ffcc;border:1px solid #e8f4ff80;border-bottom-width:4px;border-radius:6px;width:110px;padding:.5rem 0;font-size:.8rem;position:relative}.tutorial__key--hold{animation:tutorial-key-hold var(--tutorial-loop-duration) ease-in-out infinite}.tutorial__art--cast{align-items:flex-end}.tutorial__art--cast .tutorial__key{width:80px;padding:.2rem 0;font-size:.65rem}.tutorial__key--release{animation:tutorial-key-release var(--tutorial-loop-duration) ease-in-out infinite}.tutorial__stroke{stroke:var(--aurora-green);stroke-dasharray:1;filter:drop-shadow(0 0 4px var(--aurora-green))}.tutorial__stroke--first{animation:tutorial-draw-first var(--tutorial-loop-duration) ease-in-out infinite}.tutorial__stroke--second{animation:tutorial-draw-second var(--tutorial-loop-duration) ease-in-out infinite}.tutorial__cursor{offset-path:path("M50.4 8 L50.4 72 M50.4 25.9 L69.6 40 L50.4 54.1");offset-rotate:0deg;width:10px;height:10px;animation:tutorial-cursor var(--tutorial-loop-duration) ease-in-out infinite;background:#fff;border-radius:50%;position:absolute;top:0;left:0;box-shadow:0 0 8px #fff}.tutorial__art--cast svg{height:70%}.tutorial__rune{stroke:var(--aurora-green);animation:tutorial-cast var(--tutorial-loop-duration) ease-out infinite}.tutorial__note{opacity:.75;margin-bottom:1.5rem;font-size:.9rem;font-style:italic}.tutorial__note[hidden]{display:none}.tutorial__close{letter-spacing:.15em;color:var(--aurora-green);border:1px solid var(--aurora-green);cursor:pointer;background:0 0;border-radius:.5rem;padding:1rem 1.6rem;font-size:1.1rem;transition:background .2s}.tutorial__close:hover,.tutorial__close:focus-visible{background:#5ee8b526;outline:none}@keyframes tutorial-key-hold{0%,15%{border-bottom-width:4px;transform:none}25%,90%{color:var(--aurora-green);border-bottom-width:1px;border-color:var(--aurora-green);transform:translateY(3px);box-shadow:0 0 12px #5ee8b566}to{border-bottom-width:4px;transform:none}}@keyframes tutorial-draw-first{0%,10%{stroke-dashoffset:1px;opacity:1}40%,88%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}@keyframes tutorial-draw-second{0%,48%{stroke-dashoffset:1px;opacity:1}75%,88%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}@keyframes tutorial-cursor{0%,10%{offset-distance:0%;opacity:1}40%{offset-distance:57.3%;opacity:1}42%,46%{offset-distance:57.3%;opacity:0}48%{offset-distance:57.31%;opacity:1}75%,88%{offset-distance:100%;opacity:1}to{offset-distance:100%;opacity:0}}@keyframes tutorial-key-release{0%,35%{color:var(--aurora-green);border-bottom-width:1px;border-color:var(--aurora-green);transform:translateY(3px)}45%,to{border-bottom-width:4px;transform:none}}@keyframes tutorial-cast{0%,38%{opacity:.35;filter:none}48%{opacity:1;filter:drop-shadow(0 0 10px var(--aurora-green))}85%,to{opacity:.35;filter:none}}