.sleep-tool-page{padding-top:4.5rem;padding-bottom:var(--space-10)}@media (min-width:769px){.sleep-tool-page{padding-top:5rem}}.sleep-player-card{background:var(--color-bg-card,#fff);border:1px solid var(--color-border);border-radius:var(--radius-2xl,1.5rem);padding:var(--space-8);margin-top:var(--space-6);margin-bottom:var(--space-8);box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:var(--space-6);align-items:center;text-align:center}.sleep-mode-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-3);width:100%}.mode-btn{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-bg-soft);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;text-align:left;transition:all var(--transition-fast)}.mode-btn:hover{border-color:var(--color-primary);background:var(--color-bg)}.mode-btn.active{border-color:var(--color-primary);background:rgba(99,102,241,.08);box-shadow:0 0 0 2px var(--color-primary)}.mode-icon{font-size:1.5rem;flex-shrink:0}.mode-text strong{display:block;font-size:var(--font-size-sm);color:var(--color-text)}.mode-text small{display:block;font-size:var(--font-size-xs);color:var(--color-text-muted)}.sleep-duration-selector{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-2)}.duration-pills{display:flex;flex-wrap:wrap;gap:var(--space-2)}.duration-pill{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-bg-soft);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.duration-pill.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.ambient-sound-selector{display:flex;align-items:center;gap:var(--space-3);font-size:var(--font-size-sm)}.sound-select{padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-text)}.sleep-visualizer-stage{position:relative;width:min(280px,100%);height:auto;aspect-ratio:1;margin-inline:auto;display:flex;align-items:center;justify-content:center}.sleep-circle-wrapper{position:relative;width:min(240px,100%);height:auto;aspect-ratio:1;display:flex;align-items:center;justify-content:center}.sleep-pulse-circle{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(129,140,248,.25) 0,rgba(99,102,241,.05) 70%);border:2px solid rgba(99,102,241,.3);will-change:transform}.sleep-stage-content{position:relative;z-index:2;padding:var(--space-4);max-width:200px}.sleep-phase-title{display:block;font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-text);margin-bottom:var(--space-1)}.sleep-phase-timer{display:block;font-size:2rem;font-weight:var(--font-weight-extrabold);color:var(--color-primary);font-variant-numeric:tabular-nums}.sleep-instruction{font-size:var(--font-size-xs);color:var(--color-text-muted);margin:var(--space-2) 0 0}.session-time-remaining{position:absolute;bottom:-1.5rem;font-size:var(--font-size-xs);color:var(--color-text-subtle);font-variant-numeric:tabular-nums}.sleep-controls{display:flex;gap:var(--space-4);margin-top:var(--space-4)}