*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,sans-serif;background:#0a0a0a;color:#fff;min-height:100vh;min-height:100dvh}.app-container{height:100vh;height:100dvh;background:#0a0a0a;display:flex;flex-direction:column;align-items:center;padding:1rem}.branding{text-align:center;margin-bottom:1rem}.branding-text{font-family:Tiro Devanagari Sanskrit,serif;font-size:2rem;color:beige;margin:0}#cosmic-view{position:relative;width:100%;max-width:600px;min-width:320px;min-height:320px;flex:1 1 auto;overflow:hidden;display:flex;align-items:center;justify-content:center}.cosmic-canvas{width:100%;height:100%;background:#0a0a0a}.sky-dome-canvas{width:100%;height:100%}.time-scrubber{width:100%;max-width:600px;padding:.25rem 1rem;display:flex;align-items:center;gap:.75rem}.time-scrubber.hidden{display:none}.time-slider{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:#333;border-radius:2px;outline:none}.time-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:orange;border-radius:50%;cursor:grab}.time-slider-label{font-family:monospace;font-size:12px;color:beige;min-width:65px;text-align:right}.sun{filter:drop-shadow(0 0 10px rgba(255,215,0,.5))}.moon{stroke:#0a0a0a;stroke-width:1.5px;opacity:.9}#timeline-controls{width:100%;max-width:600px;margin:1rem auto;padding:0 1rem}.timeline-scrubber{width:100%;display:block;touch-action:none}.timeline-track{fill:#333;stroke:none;cursor:pointer}.timeline-thumb{cursor:grab;filter:drop-shadow(0 0 4px rgba(255,255,255,.3));-webkit-user-select:none;user-select:none}.timeline-thumb:hover{filter:drop-shadow(0 0 6px rgba(255,255,255,.5))}.timeline-thumb:active{cursor:grabbing}.timeline-label{fill:beige;font-family:monospace;font-size:12px;-webkit-user-select:none;user-select:none}.timeline-thumb.dragging{cursor:grabbing;filter:drop-shadow(0 0 8px rgba(255,255,255,.6))}.playback-controls{display:flex;align-items:center;justify-content:center;margin-top:10px}.playback-button{background:transparent;border:2px solid #FFA500;border-radius:50%;width:40px;height:40px;cursor:pointer;color:orange;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background-color .2s,transform .1s}.playback-button:hover{background:#ffa50033}.playback-button:active{transform:scale(.95)}.playback-button:focus{outline:2px solid #FFA500;outline-offset:2px}.playback-button.hidden{display:none}.spiral-indicator{text-align:center;color:beige}.spiral-name{display:block;font-size:16px}.spiral-completion{display:block;min-height:1.2em}.tempo-selector{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px}.tempo-option{background:transparent;border:1px solid #FFA500;border-radius:20px;min-height:44px;padding:8px 16px;cursor:pointer;color:orange;font-size:13px;font-family:system-ui,-apple-system,sans-serif;transition:background-color .2s,color .2s}.tempo-option:hover{background:#ffa50026}.tempo-option:focus{outline:2px solid #FFA500;outline-offset:2px}.tempo-option.active{background:orange;color:#0a0a0a}.earth-glow{transition:r .3s ease,opacity .3s ease}.earth-apsis-label{fill:beige;font-family:monospace;font-size:11px;transition:opacity .2s}.timeline-apsis-marker{stroke:#aaa;stroke-width:1.5px;opacity:.8}.timeline-apsis-label{fill:beige;font-family:monospace;font-size:10px;transition:opacity .2s}.timeline-apsis-hit{pointer-events:all}.info-strip{width:100%;max-width:600px;min-height:52px;padding:.25rem 1rem;flex-shrink:0;cursor:pointer;-webkit-tap-highlight-color:transparent}.info-panel{display:flex;align-items:center;justify-content:center;gap:1.5rem}.info-panel.hidden{display:none}.cel-event{display:flex;flex-direction:column;align-items:center;gap:.2rem}.cel-icon{width:32px;height:32px}.cel-time{font-family:monospace;font-size:13px;color:beige;opacity:.9}#info-panel-wellness{align-items:flex-end}#info-panel-tides{justify-content:center}.tide-chart{width:100%;max-width:300px;height:52px}.spiral-progress-track{width:36px;height:4px;margin:0 auto .35rem;border-radius:2px;background:#f5f5dc1f;overflow:hidden}.spiral-progress-bar{height:4px;width:0%;border-radius:2px;transition:background-color .3s,width .3s}