:root{color-scheme:dark;--ink:#f4f0ff;--muted:#b8afd3;--line:#ffffff16}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 15% 0,#30204e,transparent 52%),radial-gradient(ellipse at 90% 90%,#112d44,transparent 50%),#090c18;color:var(--ink);font-family:Inter,system-ui,sans-serif;padding:12px}.shell{width:min(100%,476px);height:min(890px,calc(100svh - 24px));min-height:420px;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;border:1px solid var(--line);border-radius:26px;background:linear-gradient(155deg,#1b1730,#101522);box-shadow:0 25px 90px #0007;overflow:hidden}header{display:flex;align-items:center;gap:8px;padding:18px 20px 12px}header>div{flex:1}.eyebrow{font-size:9px;font-weight:750;letter-spacing:.16em;color:var(--muted)}h1{font-size:24px;letter-spacing:-1px;margin:5px 0 0;font-weight:850}.spark{display:inline-block;color:#bf95ff;font-size:19px;margin-left:8px;vertical-align:middle}.icon{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border-radius:14px;border:1px solid var(--line);background:#ffffff09;color:var(--ink);font-size:23px;cursor:pointer}.icon[aria-pressed=true]{color:#ffd1cf;background:#613f523d}.stats{display:flex;gap:18px;padding:8px 20px 14px}.stats>div{display:grid;gap:3px}.stats span{font-size:8px;letter-spacing:.12em;font-weight:750;color:var(--muted)}.stats strong{font-size:20px;font-variant-numeric:tabular-nums}.stats .pressure{margin-left:auto;text-align:right}.pressure strong{font-size:15px;letter-spacing:2px;color:#bca1ed}.arena{position:relative;display:grid;place-items:center;min-height:0;margin:0 10px;overflow:hidden;border-radius:20px;background:#080f20;box-shadow:inset 0 0 0 1px #ffffff0c}canvas{display:block;touch-action:none;outline:none;border-radius:20px}canvas:focus-visible{outline:2px solid #b8f5ff;outline-offset:-3px}.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#080d1dbb;backdrop-filter:blur(5px)}[hidden]{display:none!important}.glass{width:100%;max-width:330px;text-align:center;padding:26px 20px 22px;border:1px solid #ffffff22;border-radius:25px;background:linear-gradient(150deg,#302141ee,#191d36ee);box-shadow:0 20px 60px #0005}.orb-mark{width:64px;height:64px;display:grid;place-items:center;font-size:32px;border-radius:50%;margin:0 auto 20px;background:radial-gradient(circle at 35% 25%,#e6d6ff,#ad64f5 45%,#632da1);box-shadow:inset -4px -7px 8px #24103977,0 9px 24px #b965fa35;color:#fff3}.glass .eyebrow{font-size:8px;line-height:1.5;margin:0}.glass h2{font-size:35px;letter-spacing:-1.3px;margin:7px 0 12px;line-height:1.1}.glass p:not(.eyebrow){font-size:13px;line-height:1.6;color:#d0c8e3;margin:0 0 20px}.primary,.secondary{font:inherit;cursor:pointer;width:100%;min-height:46px;border-radius:14px;font-size:14px;font-weight:750}.primary{display:flex;justify-content:center;gap:14px;align-items:center;background:#b187fa;color:#171027;border:1px solid #d4b9ff;box-shadow:inset 0 1px #ffffff66,0 7px 18px #a862ff23}.secondary{margin-top:8px;background:transparent;color:#e1d4f5;border:1px solid #ffffff24}.glass small{display:block;font-size:10px;color:var(--muted);margin-top:15px}button:hover{filter:brightness(1.1)}button:active{transform:translateY(1px)}button:focus-visible{outline:3px solid #b4f4ff;outline-offset:3px}footer{padding:11px 17px 14px;text-align:center}footer p{font-size:11px;color:#d1c9df;margin:0 0 4px;min-height:14px}footer>span{font-size:8px;color:#a69ab5}@media(max-height:650px){header{padding:10px 14px 6px}h1{font-size:21px}.stats{padding:5px 14px 8px}.glass{padding:17px 16px}.orb-mark{width:42px;height:42px;font-size:24px;margin-bottom:10px}.glass h2{font-size:29px;margin:5px 0 10px}.glass p:not(.eyebrow){font-size:11px;margin-bottom:13px}.glass small{margin-top:9px}footer{padding:7px 12px}.eyebrow{font-size:8px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

body{padding:6px}.shell{width:min(100%,476px);height:calc(100svh - 12px);min-height:0;max-height:none} .glass{max-height:100%;overflow-y:auto} .stats .pressure span{font-size:7px} header .eyebrow{line-height:1.5} @media(max-height:470px) and (max-width:599px){.glass{padding:10px}.glass h2{font-size:22px}.glass .orb-mark{display:none}.glass p:not(.eyebrow){font-size:10px;margin-bottom:8px}.glass small{font-size:8px;margin-top:6px}.primary,.secondary{min-height:34px}header{padding:6px 12px}footer{padding:5px}.stats{padding:3px 12px 5px}}
@media(max-width:599px) and (max-height:650px) and (orientation:portrait){html[data-embedded=true] .shell{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(0,1fr) auto}html[data-embedded=true] header{grid-column:2;grid-row:1;padding:6px 8px 6px 0;gap:5px}html[data-embedded=true] header>div{position:absolute;bottom:5px;right:10px}html[data-embedded=true] header h1{display:none}html[data-embedded=true] header .eyebrow{font-size:0}html[data-embedded=true] #stage{font-size:8px}html[data-embedded=true] .shell{position:relative}html[data-embedded=true] .icon{width:32px;height:32px;border-radius:10px;font-size:18px}html[data-embedded=true] .stats{grid-column:1;grid-row:1;padding:6px 8px;gap:10px;align-items:center}html[data-embedded=true] .stats strong{font-size:16px}html[data-embedded=true] .stats .pressure strong{font-size:12px;letter-spacing:0}html[data-embedded=true] .pressure span{max-width:85px;display:block;font-size:6px}html[data-embedded=true] .arena{grid-column:1/-1;grid-row:2}html[data-embedded=true] footer{grid-column:1/-1;grid-row:3;padding:6px 10px 20px}html[data-embedded=true] footer>span{display:none}html[data-embedded=true] footer p{font-size:9px;margin:0}}