*{box-sizing:border-box}html,body,#root{background:#0a0f24;height:100%;margin:0;overflow:hidden}canvas{touch-action:none;display:block}.toggle{bottom:calc(1.4rem + env(safe-area-inset-bottom,0px));right:calc(1.4rem + env(safe-area-inset-right,0px));touch-action:manipulation;cursor:pointer;opacity:.3;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:0 0;border:none;border-radius:.5rem;flex-direction:column;justify-content:center;gap:.24rem;width:2.1rem;height:2.1rem;padding:0 .45rem;transition:opacity .22s;display:flex;position:fixed}.toggle:hover,.toggle.open{opacity:.85}.toggle span{background:#fff;height:1px;display:block;box-shadow:0 0 4px #00000080}.toggle span:nth-child(2){width:70%}.hint{color:#ffffffbf;text-shadow:0 1px 6px #0009;letter-spacing:.06em;pointer-events:none;margin:0;font:400 .72rem/1 ui-sans-serif,system-ui,sans-serif;animation:7s forwards hint-fade;position:fixed;bottom:1.75rem;left:50%;transform:translate(-50%)}@keyframes hint-fade{0%,12%{opacity:0}28%,62%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.hint{opacity:.7;animation:none}}.overlay{bottom:calc(1.5rem + env(safe-area-inset-bottom,0px));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#ffffffe6;-webkit-user-select:none;user-select:none;background:#0c0e166b;border:1px solid #ffffff1f;border-radius:.9rem;width:min(30rem,100vw - 2rem);padding:.85rem 1.1rem .7rem;font:500 .8rem/1.2 ui-sans-serif,system-ui,sans-serif;animation:.18s panel-in;position:fixed;left:50%;transform:translate(-50%)}@keyframes panel-in{0%{opacity:0;transform:translate(-50%,.5rem)}to{opacity:1;transform:translate(-50%)}}.readout{justify-content:space-between;align-items:baseline;margin-bottom:.55rem;display:flex}.phase{text-transform:uppercase;letter-spacing:.14em;opacity:.75;font-size:.7rem}.clock{font-variant-numeric:tabular-nums;font-size:.95rem}.scrub{appearance:none;cursor:pointer;touch-action:manipulation;background:linear-gradient(90deg,#f6a878 0%,#cfe6f5 25%,#dae4ec 42%,#ef8a52 50%,#6d4a63 57%,#2c3057 64%,#0a0f24 75%,#c98a72 97%);border-radius:999px;width:100%;height:.3rem}.scrub::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border:none;border-radius:50%;width:.85rem;height:.85rem;box-shadow:0 0 0 2px #00000059}.scrub::-moz-range-thumb{appearance:none;cursor:pointer;background:#fff;border:none;border-radius:50%;width:.85rem;height:.85rem;box-shadow:0 0 0 2px #00000059}.ticks{opacity:.45;font-variant-numeric:tabular-nums;height:.9rem;font-size:.6rem;position:relative}.ticks span{position:absolute;transform:translate(-50%)}.controls{flex-wrap:wrap;gap:.35rem;margin-top:.2rem;display:flex}.controls button{text-transform:capitalize;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;background:#ffffff12;border:1px solid #ffffff24;border-radius:.45rem;flex:4rem;padding:.35rem 0;font-size:.72rem;transition:background .12s}.controls button:hover{background:#ffffff29}.controls button.active{background:#ffffff47}@media (width<=34rem){.toggle.open{bottom:9.5rem}}@media (pointer:coarse){.toggle{opacity:.75;width:2.9rem;height:2.9rem;padding:0 .7rem}.toggle span{height:2px}.controls{gap:.45rem}.controls button{min-height:2.9rem;font-size:.82rem}.scrub{height:.65rem;margin:.25rem 0}.scrub::-webkit-slider-thumb{width:1.5rem;height:1.5rem}.scrub::-moz-range-thumb{width:1.5rem;height:1.5rem}.ticks{height:1.1rem;font-size:.68rem}.hint{font-size:.8rem}}@media (width<=26rem){.controls button{flex:42%}}