:root{font-family:Trebuchet MS,Segoe UI,sans-serif;color:#f4f7ff;background:#0d1322;--app-height: 100dvh}*{box-sizing:border-box}html{margin:0;width:100%;height:100%;overflow:hidden}body{margin:0;min-height:var(--app-height);height:var(--app-height);overflow-x:hidden;overflow-y:hidden;overscroll-behavior:none;display:flex;justify-content:center;align-items:center;padding:0;background:radial-gradient(1000px 600px at 20% 0%,#1d2a46 0%,transparent 60%),radial-gradient(700px 500px at 100% 100%,#17253f 0%,transparent 60%),#0d1322}body.allow-menu-scroll{overflow-y:auto;touch-action:pan-y}#app{width:100%;min-height:var(--app-height);height:var(--app-height);display:flex;justify-content:center;align-items:center;overflow:hidden}.game-shell{position:relative;width:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-rows:100%;align-items:stretch;justify-items:stretch;overflow:hidden}.game-shell.menu-scroll{overflow-y:auto}.shell-rave-overlay{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;pointer-events:none}.shell-rave-fallback-strip{position:absolute;top:0;bottom:0;z-index:1;pointer-events:none;display:none;background:linear-gradient(180deg,#000 0% 100%),repeating-linear-gradient(45deg,transparent 0 11px,color-mix(in srgb,var(--rave-fallback-c1, #00f5ff) 86%,#000000) 11px 12px,transparent 12px 24px),repeating-linear-gradient(180deg,transparent 0 10px,color-mix(in srgb,var(--rave-fallback-c2, #ff2dff) 88%,#000000) 10px 11px,transparent 11px 22px),repeating-linear-gradient(90deg,transparent 0 12px,color-mix(in srgb,var(--rave-fallback-c1, #00f5ff) 84%,#000000) 12px 13px,transparent 13px 26px);box-shadow:inset 0 0 42px #000000fa,0 0 calc(20px * var(--rave-fallback-glow, 1)) color-mix(in srgb,var(--rave-fallback-c1, #00f5ff) 58%,#000000),0 0 calc(36px * var(--rave-fallback-glow, 1)) color-mix(in srgb,var(--rave-fallback-c2, #ff2dff) 44%,#000000);opacity:var(--rave-fallback-opacity, .5);filter:brightness(var(--rave-fallback-brightness, 1)) saturate(var(--rave-fallback-saturation, 1.7));animation:shell-rave-fallback-pulse var(--rave-fallback-duration, .7s) ease-in-out infinite}.shell-rave-fallback-left{transform-origin:left center}.shell-rave-fallback-right{transform-origin:right center}@keyframes shell-rave-fallback-pulse{0%{filter:brightness(calc(var(--rave-fallback-brightness, 1) * .92)) saturate(calc(var(--rave-fallback-saturation, 1.7) * .9));opacity:calc(var(--rave-fallback-opacity, .5) * .9)}to{filter:brightness(calc(var(--rave-fallback-brightness, 1) * 1.08)) saturate(calc(var(--rave-fallback-saturation, 1.7) * 1.08));opacity:calc(var(--rave-fallback-opacity, .5) * 1.08)}}.canvas-wrapper{grid-column:2;display:grid;justify-self:center;align-self:center;z-index:2;position:relative}.canvas-wrapper>*{grid-row:1;grid-column:1}.game-canvas{display:block;width:auto;height:var(--app-height);max-width:100vw;max-height:var(--app-height);border:2px solid #20345e;background:#050913;image-rendering:pixelated}.shell-side-fx{display:block;width:100%;height:100%;pointer-events:none;image-rendering:pixelated;background:transparent;border:none;z-index:1}.shell-side-fx-left{grid-column:1}.shell-side-fx-right{grid-column:3}.auth-overlay{position:absolute;inset:0;z-index:10;pointer-events:none;overflow:clip}.auth-form{pointer-events:auto;display:flex;flex-direction:column;align-items:center;width:16em;margin-top:16em;margin-inline:auto;padding:0;gap:.4em}.auth-input{width:16em;max-width:16em;box-sizing:border-box;padding:.6em .7em;background:#0a1628;border:2px solid #2a4a7a;border-radius:4px;color:#d4e7ff;font-family:"Press Start 2P",monospace;font-size:.7em;outline:none;transition:border-color .15s}.auth-input::placeholder{color:#4a6a9a}.auth-input:focus{border-color:#6ea3ff;box-shadow:0 0 6px #6ea3ff59}.auth-error{color:#ff6b6b;font-family:"Press Start 2P",monospace;font-size:.5em;text-align:center}.auth-error:empty{display:none}.auth-confirm{color:#6bffb8;font-family:"Press Start 2P",monospace;font-size:.5em;text-align:center}.auth-confirm:empty{display:none}.auth-btn-submit{width:16em;max-width:16em;box-sizing:border-box;padding:.7em;background:#1f335a;border:2px solid #6ea3ff;border-radius:4px;color:#d4e7ff;font-family:"Press Start 2P",monospace;font-size:.7em;cursor:pointer;transition:background .15s}.auth-btn-submit:hover:not(:disabled){background:#2a4470}.auth-btn-submit:disabled{opacity:.5;cursor:default}.auth-btn-toggle{background:none;border:none;color:#6a8ab8;font-family:"Press Start 2P",monospace;font-size:.45em;cursor:pointer;padding:.5em;transition:color .15s}.auth-btn-toggle:hover{color:#9cc2ff}.profile-overlay{position:absolute;inset:0;z-index:10;pointer-events:none;overflow:clip}.profile-form{pointer-events:auto;display:flex;flex-direction:column;align-items:center;margin-top:34%;padding:0 2em;gap:.5em}.profile-label{color:#9cc2ff;font-family:"Press Start 2P",monospace;font-size:.6em;text-align:center}.profile-input{width:100%;max-width:18em;padding:.6em .7em;background:#0a1628;border:2px solid #2a4a7a;border-radius:4px;color:#d4e7ff;font-family:"Press Start 2P",monospace;font-size:.7em;outline:none;text-align:center;transition:border-color .15s}.profile-input::placeholder{color:#4a6a9a}.profile-input:focus{border-color:#6ea3ff;box-shadow:0 0 6px #6ea3ff59}.profile-error{color:#ff6b6b;font-family:"Press Start 2P",monospace;font-size:.5em;text-align:center}.profile-error:empty{display:none}.profile-btn-save{width:100%;max-width:18em;padding:.7em;background:#1f335a;border:2px solid #6ea3ff;border-radius:4px;color:#d4e7ff;font-family:"Press Start 2P",monospace;font-size:.7em;cursor:pointer;transition:background .15s}.profile-btn-save:hover:not(:disabled){background:#2a4470}.profile-btn-save:disabled{opacity:.5;cursor:default}.profile-btn-back{background:none;border:none;color:#6a8ab8;font-family:"Press Start 2P",monospace;font-size:.5em;cursor:pointer;padding:.5em;transition:color .15s}.profile-btn-back:hover{color:#9cc2ff}.profile-versus-stats{width:100%;max-width:18em;margin-top:.4em;padding:.5em 0;border-top:1px solid #1e3358;text-align:center}.profile-versus-stats:empty{display:none}.profile-stats-title{color:#6ea3ff;font-family:"Press Start 2P",monospace;font-size:.5em;margin-bottom:.5em}.profile-stats-row{display:flex;justify-content:center;align-items:center;gap:.4em;margin-bottom:.3em}.profile-stats-label{color:#6a8ab8;font-family:"Press Start 2P",monospace;font-size:.45em}.profile-stats-val{color:#d4e7ff;font-family:"Press Start 2P",monospace;font-size:.55em}.profile-stats-sep{color:#3a5a8a;font-family:"Press Start 2P",monospace;font-size:.45em}
