:root{color-scheme:dark;--cyan:#3ef4f2;--pink:#f553e6;--violet:#aa6bff;--ink:#05040b;--line:rgba(157,180,255,.24)}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--ink);color:#f9f8ff;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}#app{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden;isolation:isolate}canvas{display:block;width:100%;height:100%;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.54) 100%),repeating-linear-gradient(to bottom,transparent 0 3px,rgba(0,0,0,.12) 4px);opacity:.75}.screen{position:absolute;inset:0;z-index:4}.screen[hidden],.hidden{display:none!important}.title-screen{display:grid;place-items:center;background:radial-gradient(circle at 50% 49%,rgba(9,7,25,.55),rgba(3,3,8,.36) 65%,rgba(3,3,8,.2));text-align:center}.title-content{display:flex;flex-direction:column;align-items:center;position:relative;z-index:1;padding:28px}.sigil{font-size:22px;letter-spacing:1.6em;color:var(--cyan);margin-left:1.6em;text-shadow:0 0 18px currentColor;opacity:.8}.sigil span{color:var(--pink)}h1{font-size:clamp(84px,15vw,230px);font-weight:200;letter-spacing:-.095em;line-height:.95;margin:27px 0 22px;padding-right:.08em;text-shadow:-3px 0 22px var(--violet),3px 0 27px var(--cyan),0 0 65px #992cff}h1 span{color:#d9ffff;text-shadow:0 0 26px var(--cyan),0 0 75px #078a9d}.title-tag{font-size:clamp(10px,1.1vw,13px);letter-spacing:.48em;margin:0 0 45px;opacity:.75}.main-button{background:rgba(5,8,19,.76);border:1px solid #e8e9ff;border-radius:6px;box-shadow:0 0 10px #9baaff88,inset 0 0 12px #7f80ba55;min-width:180px;padding:13px 30px;font-size:16px;letter-spacing:.22em;transition:background .18s,box-shadow .18s,transform .18s}.main-button:hover{background:#211132;box-shadow:0 0 22px var(--violet),inset 0 0 20px #7862ca88;transform:translateY(-2px)}.secondary-buttons{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap;justify-content:center}.secondary-buttons button,.secondary-buttons a,.stack button:not(.main-button),.name-row button,.tabs button{background:rgba(5,8,19,.76);border:1px solid var(--line);border-radius:4px;padding:10px 14px;font-size:11px;letter-spacing:.14em}.secondary-buttons button:hover,.secondary-buttons a:hover,.stack button:hover,.tabs button:hover{border-color:var(--cyan);box-shadow:0 0 13px #36dddf66}.title-footer{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:28px;right:28px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.2em;opacity:.55}#hud{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:max(18px,env(safe-area-inset-top)) 25px;pointer-events:none;text-shadow:0 0 8px #000}#hud small{display:block;font-size:10px;letter-spacing:.18em;color:#cbc9e8}#hud strong{display:block;font-weight:400;letter-spacing:.06em;font-size:clamp(19px,2.5vw,30px);font-variant-numeric:tabular-nums}#hud b{display:block;color:var(--pink);font-weight:400;font-size:26px;text-shadow:0 0 12px var(--pink)}.hud-center{position:absolute;top:max(20px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);text-align:center}#hearts{display:flex;gap:8px;justify-content:center}#hearts span{width:13px;height:13px;border:1px solid var(--cyan);transform:rotate(45deg);box-shadow:0 0 9px var(--cyan)}#hearts span.empty{opacity:.25}#pattern{display:flex;gap:5px;margin-top:13px;justify-content:center}#pattern span{width:8px;height:8px;border:1px solid var(--violet);transform:rotate(45deg)}#pattern span.lit{background:var(--pink);box-shadow:0 0 12px var(--pink)}.hud-right{display:flex;align-items:center;gap:15px}.icon-button{pointer-events:auto;border:1px solid var(--line);background:#06071099;border-radius:4px;font-size:16px;line-height:1;width:34px;height:34px}#bottomHud{position:absolute;z-index:2;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px}.meter{width:min(35vw,270px);height:5px;background:#363341;border-radius:5px;overflow:hidden;box-shadow:0 0 8px #99a}#abilityFill{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--cyan),var(--pink));box-shadow:0 0 10px var(--pink)}.pulse{pointer-events:auto;display:grid;place-items:center;width:70px;height:70px;border-radius:50%;border:1px solid var(--cyan);background:#0a1025bb;color:var(--cyan);font-size:26px;box-shadow:0 0 18px #28eef58f}.pulse small{font-size:8px;letter-spacing:.13em}.pulse:disabled{opacity:.4;box-shadow:none}.panel-screen{display:grid;place-items:center;background:rgba(2,2,9,.72);backdrop-filter:blur(7px);padding:16px}.panel{position:relative;width:min(100%,430px);max-height:calc(100dvh - 32px);overflow:auto;border:1px solid rgba(153,154,242,.35);border-radius:5px;padding:35px 32px;background:linear-gradient(135deg,rgba(10,9,25,.97),rgba(2,4,12,.96));box-shadow:0 0 45px #19155799,inset 0 0 26px #1c183a66;text-align:center}.panel h2{font-weight:400;letter-spacing:.28em;font-size:24px;margin:8px 0 28px}.eyebrow{font-size:10px;letter-spacing:.5em;color:var(--cyan)}.close{position:absolute;top:9px;right:12px;border:0;background:none;color:#a6a6c4;font-size:26px}.stack{display:flex;flex-direction:column;gap:8px;max-width:250px;margin:auto}.stack button{min-height:42px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px;margin-bottom:26px}.result-grid small{display:block;letter-spacing:.2em;font-size:10px;color:#a5a3bb}.result-grid strong{display:block;font-size:20px;font-weight:400;margin-top:5px}#submitArea{margin:0 auto 24px;max-width:250px}#submitArea label{display:block;font-size:10px;letter-spacing:.25em;margin-bottom:10px;color:var(--cyan)}.name-row{display:flex;gap:6px}.name-row input{width:100%;min-width:0;background:#040711;color:white;border:1px solid var(--line);padding:9px;text-transform:uppercase;letter-spacing:.15em}.name-row button{border-color:var(--cyan)}#submitMessage{min-height:17px;font-size:11px;color:var(--cyan);margin:7px 0 0}.modal-panel{width:min(100%,540px);text-align:left}.modal-panel h2{text-align:center}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0}.how-item{text-align:center}.how-symbol{display:block;height:45px;font-size:31px;color:var(--cyan);text-shadow:0 0 15px currentColor}.how-item:nth-child(2) .how-symbol{color:var(--pink)}.how-item:nth-child(3) .how-symbol{color:#e8c95d}.how-item b{display:block;font-size:12px;letter-spacing:.2em}.how-item p{font-size:11px;color:#a9a8bc;line-height:1.5}.hint{font-size:12px;text-align:center;letter-spacing:.1em;color:#b9b5d5}.setting-row{display:flex;justify-content:space-between;align-items:center;margin:18px 0;font-size:13px;letter-spacing:.12em}.setting-row button{min-width:86px;border:1px solid var(--line);background:#0b0d1c;padding:9px}.tabs{display:flex;justify-content:center;gap:5px;margin:15px 0}.tabs .selected{border-color:var(--pink);box-shadow:0 0 12px #fc38e477}.leaderboard{width:100%;border-collapse:collapse;font-size:11px;font-variant-numeric:tabular-nums}.leaderboard th{color:#9a9bb9;font-weight:400;letter-spacing:.1em}.leaderboard td,.leaderboard th{padding:8px 3px;text-align:right;border-bottom:1px solid #222638}.leaderboard td:nth-child(2),.leaderboard th:nth-child(2){text-align:left}.leaderboard tr:first-child td{color:#eab9ff}.leaderboard-empty{text-align:center;color:#aaa;padding:28px}#toast{position:absolute;z-index:6;top:22%;left:50%;transform:translateX(-50%);font-size:15px;letter-spacing:.25em;color:white;text-shadow:0 0 15px var(--pink);opacity:0;pointer-events:none;transition:opacity .25s;white-space:nowrap}#toast.visible{opacity:1}@media(max-width:600px){.title-content{padding:14px}.title-tag{letter-spacing:.22em;margin-bottom:33px}.title-footer{left:15px;right:15px}.secondary-buttons{gap:7px}.secondary-buttons button{font-size:9px;padding:10px 8px}#hud{padding:max(13px,env(safe-area-inset-top)) 12px}.hud-center{top:max(14px,env(safe-area-inset-top))}#hud strong{font-size:19px}#hud b{font-size:23px}.hud-right{gap:7px}#bottomHud{width:100%;padding:0 18px;justify-content:space-between;bottom:max(14px,env(safe-area-inset-bottom));left:0;transform:none}.meter{width:60vw}.pulse{width:65px;height:65px}.panel{padding:32px 19px}.how-grid{gap:8px}.how-item p{font-size:10px}}@media(max-height:600px){h1{font-size:min(20vh,140px);margin:12px 0}.title-tag{margin-bottom:15px}.panel{padding-top:18px;padding-bottom:18px}.panel h2{margin-bottom:14px}.stack{gap:5px}.stack button{min-height:35px}.result-grid{margin-bottom:10px;gap:8px}}@media(prefers-reduced-motion:reduce){.vignette{opacity:.4}*{scroll-behavior:auto!important;transition:none!important}}

.secondary-buttons a{display:inline-flex;align-items:center;text-decoration:none;color:inherit}
