:root{--stone:#3f8494;--stone-light:#5a9fae;--stone-dark:#1f5664;--groove:#24596a;--glow:#8ff0ff;--amber:#f39a2b;--text-soft:#e1f8fcc7;--dial:min(76vmin, 480px);--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--mottle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='1400'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.006' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0.1 0 0 0 0 0.15 0 0 0 0.9 -0.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23m)'/%3E%3C/svg%3E");color:#eafcff;-webkit-font-smoothing:antialiased;font-family:ui-rounded,SF Pro Rounded,Nunito,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--stone-dark);-webkit-tap-highlight-color:transparent;overflow:hidden}.stage{cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--grain), var(--mottle), radial-gradient(ellipse at 50% 50%, var(--stone-light) 0%, var(--stone) 45%, var(--stone-dark) 100%);background-blend-mode:soft-light, multiply, normal;background-position:0 0,50%,50%;background-repeat:repeat,no-repeat,no-repeat;background-size:240px 240px,cover,100% 100%;height:100%;min-height:100dvh;position:relative;overflow:hidden}.stage:after{content:"";pointer-events:none;background:radial-gradient(#0000 55%,#05192073 100%);position:absolute;inset:0}.dial{width:var(--dial);height:var(--dial);z-index:1;background:var(--grain), radial-gradient(circle at 50% 45%, #33798a 0%, #2a6878 60%, #215867 100%);background-blend-mode:soft-light, normal;box-shadow:0 0 0 8px var(--groove), 0 0 0 9px #ffffff0f, inset 0 10px 30px #00000059, inset 0 -2px 10px #ffffff0f, 0 0 40px #051e2659;background-size:240px 240px,100% 100%;border-radius:50%;transition:background-color 2s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dial-art{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.wedge{fill:#08232c47}.breath{fill:#8ff0ff12;stroke:#8ff0ff59;stroke-width:.6px;transition:r .6s}.dial[data-kind=breathe] .breath{transition:none}.dot-glow{fill:#f39a2b59;filter:blur(4px)}.dial-time{text-align:center;font-size:calc(var(--dial) * .2);font-variant-numeric:tabular-nums;color:#f2feff;text-shadow:0 0 6px var(--glow), 0 0 18px #8ff0ff99, 0 0 36px #8ff0ff59;font-weight:300;line-height:1;position:absolute;top:75%;left:0;right:0;transform:translateY(-50%)}.below{left:50%;top:calc(50% + var(--dial) / 2 + 32px);z-index:1;justify-items:center;gap:18px;width:min(100% - 32px,440px);display:grid;position:absolute;transform:translate(-50%)}.rounds{width:min(100%, calc(var(--dial) * .6));grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.status{text-align:center;min-height:1.4em;font-size:max(15px, calc(var(--dial) * .045));letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft);font-weight:600}.round{background:#14465473;border-radius:999px;height:6px;overflow:hidden;box-shadow:inset 0 1px 3px #0006,0 1px #ffffff14}.round-fill{border-radius:inherit;transform-origin:0;background:linear-gradient(90deg, #5fd6e8, var(--glow));height:100%;box-shadow:0 0 8px #8ff0ff99}@media (height<=640px){.below{top:calc(50% + var(--dial) / 2 + 18px);gap:10px}}.stage.gate{cursor:default;-webkit-user-select:auto;user-select:auto;place-items:center;display:grid}.gate-form{z-index:1;gap:12px;width:min(100% - 32px,320px);display:grid;position:relative}.gate-input,.gate-button{font:inherit;color:#eafcff;border:1px solid #8ff0ff66;border-radius:999px;padding:12px 18px;font-size:17px}.gate-input{text-align:center;letter-spacing:.08em;background:#14465473}.gate-input::placeholder{color:#e1f8fc80}.gate-input:focus-visible,.gate-button:focus-visible{outline:2px solid var(--glow);outline-offset:3px}.gate-button{letter-spacing:.06em;background:linear-gradient(180deg, #ffb551, var(--amber));color:#3a1d00;cursor:pointer;border-color:#0000;font-weight:600}.gate-wrong{text-align:center;letter-spacing:.06em;min-height:1.4em;color:var(--text-soft);font-size:14px}@media (prefers-reduced-motion:reduce){.breath{transition:none}}