:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{color:#f4fbff;background:radial-gradient(circle at top,#00e5ff1f,#0000 28%),radial-gradient(circle at bottom,#0078ff1a,#0000 32%),linear-gradient(#020711 0%,#030917 45%,#02050d 100%);min-height:100%;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}body{min-height:100vh}.page-shell{flex-direction:column;align-items:center;min-height:100vh;padding:48px 18px 72px;display:flex}.hero{text-align:center;width:100%;max-width:760px;margin-bottom:28px}.hero-chip{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.12em;text-transform:uppercase;color:#d6efffcc;background:#ffffff0a;border:1px solid #ffffff17;border-radius:999px;justify-content:center;align-items:center;padding:8px 14px;font-size:12px;display:inline-flex}.hero h1{letter-spacing:-.04em;margin:16px 0 10px;font-size:clamp(2.7rem,8vw,4.6rem);line-height:.95}.hero-copy{color:#e1f0ffc2;max-width:620px;margin:0 auto;font-size:1rem;line-height:1.6}.trainer-shell{justify-content:center;width:100%;display:flex}.trainer-panel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#ffffff0d,#ffffff06);border:1px solid #ffffff14;border-radius:28px;width:100%;max-width:760px;padding:22px;box-shadow:0 24px 60px #00000059,inset 0 1px #ffffff0d}.panel-top{flex-wrap:wrap;justify-content:space-between;gap:12px;display:flex}.panel-chip{color:#baf8ff;letter-spacing:.08em;text-transform:uppercase;background:#00e5ff14;border:1px solid #00e5ff2e;border-radius:999px;padding:8px 12px;font-size:12px;display:inline-flex}.panel-chip.muted{color:#e8f2ffb3;background:#ffffff0a;border-color:#ffffff14}.instruction-wrap{text-align:center;margin-top:22px}.instruction-label{text-transform:uppercase;letter-spacing:.16em;color:#d6e6ff8c;margin:0 0 8px;font-size:12px}.instruction{letter-spacing:-.04em;margin:0;font-size:clamp(2rem,8vw,4.2rem);line-height:1;transition:all .18s}.phase-hold{color:#9ff6ff;text-shadow:0 0 18px #00e5ff47}.phase-release{color:#ffe27a;text-shadow:0 0 18px #ffe27a59;animation:.55s ease-in-out infinite releaseFlash}.phase-fail{color:#ff9aa7;text-shadow:0 0 16px #ff608038}.phase-success{color:#c1ffd0;text-shadow:0 0 16px #64ffa033}.phase-countdown{color:#dff8ff}.phase-idle,.phase-complete{color:#eaf7ff}.feedback{color:#e0edffb8;max-width:420px;margin:12px auto 0;font-size:.98rem;line-height:1.5}.focus-orb{touch-action:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:radial-gradient(circle at 35% 30%,#aaf5ffe6,#0000 18%),radial-gradient(circle,#00e5ff29,#002c4e8c 58%,#020711f5 78%);border-radius:50%;place-items:center;width:min(72vw,290px);height:min(72vw,290px);margin:28px auto 18px;transition:transform .16s,box-shadow .16s,filter .16s,background .16s;animation:4.5s ease-in-out infinite orbBreath;display:grid;position:relative;box-shadow:0 0 26px #00e5ff47,0 0 90px #007dff1a,inset 0 0 30px #7af4ff14}.focus-orb.running{box-shadow:0 0 30px #00e5ff59,0 0 110px #007dff21,inset 0 0 34px #7af4ff1c}.focus-orb.holding{transform:scale(.985);box-shadow:0 0 24px #82faff73,0 0 125px #00e5ff2e,inset 0 0 40px #d2ffff29}.focus-orb.state-hold{filter:saturate(1.12)}.focus-orb.state-release{background:radial-gradient(circle at 35% 30%,#fff8bef2,#0000 18%),radial-gradient(circle,#ffd65c33,#5c360073 58%,#020711f5 78%);transform:scale(.9);box-shadow:0 0 26px #ffdb5880,0 0 100px #ffc40029,inset 0 0 34px #ffefa82e}.focus-orb.state-fail{box-shadow:0 0 22px #ff5a7c73,0 0 90px #ff487826,inset 0 0 34px #ff92aa1f}.focus-orb.state-success{box-shadow:0 0 26px #5affaa6b,0 0 92px #42ff9224,inset 0 0 36px #c3ffdd21}.orb-ring{pointer-events:none;border:1px solid #a4f4ff40;border-radius:50%;position:absolute}.orb-ring-1{animation:8s linear infinite ringDriftA;inset:8%}.orb-ring-2{animation:6.2s linear infinite reverse ringDriftB;inset:18%}.orb-ring-3{animation:4.8s linear infinite ringDriftA;inset:30%}.orb-core{background:radial-gradient(circle,#ebffff 0%,#99f7ff 45%,#00c7ff 100%);border-radius:50%;width:34%;height:34%;transition:background .16s,box-shadow .16s;box-shadow:0 0 30px #a2faffb8,0 0 70px #00e5ff33}.focus-orb.state-release .orb-core{background:radial-gradient(circle,#fff8d9 0%,#ffe27a 45%,#ffb300 100%);box-shadow:0 0 30px #ffe478bf,0 0 70px #ffc4003d}.orb-text{letter-spacing:.28em;text-transform:uppercase;color:#eefaffbd;font-size:.78rem;transition:color .16s,text-shadow .16s;position:absolute;bottom:18%}.focus-orb.state-release .orb-text{color:#fff6c0;text-shadow:0 0 12px #ffe06473}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.stat-card{text-align:left;background:#ffffff09;border:1px solid #ffffff0f;border-radius:18px;padding:14px}.stat-card span{color:#d6e5f5a3;margin-bottom:6px;font-size:.8rem;display:block}.stat-card strong{color:#f7fcff;font-size:1.25rem;font-weight:700}.actions{margin-top:18px}.primary-btn{color:#02283a;letter-spacing:.02em;cursor:pointer;background:linear-gradient(#93faff 0%,#2fe3ff 45%,#00a6de 100%);border:0;border-radius:18px;width:100%;padding:15px 18px;font-size:.98rem;font-weight:800;box-shadow:0 10px 30px #00e5ff2e}.primary-btn:active{transform:translateY(1px)}.hint{text-align:center;color:#dfebf99e;margin:16px 4px 0;font-size:.94rem;line-height:1.6}@keyframes orbBreath{0%,to{transform:scale(1)}50%{transform:scale(1.035)}}@keyframes ringDriftA{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes ringDriftB{0%{transform:rotate(0)scale(.99)}to{transform:rotate(360deg)scale(1.01)}}@keyframes releaseFlash{0%,to{opacity:1;transform:scale(1)}50%{opacity:.72;transform:scale(1.04)}}@media (min-width:760px){.trainer-panel{padding:28px}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}