.sleep-phase-panel{margin-bottom:16px;padding:20px}.sleep-phase-panel .panel-head small{color:var(--muted);font-size:10px}.sleep-phase-timeline{height:42px;display:flex;gap:2px;margin:17px 0 12px;overflow:hidden;border-radius:11px;background:var(--panel-2)}.sleep-phase-timeline i{min-width:3px;display:block}.sleep-phase-timeline .awake,.sleep-phase-legend .awake{background:#ffae6d}.sleep-phase-timeline .core,.sleep-phase-legend .core{background:#70aef5}.sleep-phase-timeline .deep,.sleep-phase-legend .deep{background:#7769df}.sleep-phase-timeline .rem,.sleep-phase-legend .rem{background:#d477c5}.sleep-phase-legend{display:flex;flex-wrap:wrap;gap:13px;color:var(--muted);font-size:10px}.sleep-phase-legend span{display:flex;align-items:center;gap:5px}.sleep-phase-legend i{width:8px;height:8px;border-radius:50%}
.sleep-phase-timeline{position:relative;display:block;gap:0}.sleep-phase-timeline i{position:absolute;top:0;bottom:0;min-width:0;border-left:1px solid var(--panel)}
.sleep-source-graph{padding:16px 0;border-top:1px solid var(--line)}.sleep-source-graph:first-child{border-top:0}.sleep-source-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.sleep-source-head div{display:grid;gap:3px}.sleep-source-head small,.sleep-audio-copy{color:var(--muted);font-size:10px}.sleep-source-head>span{padding:5px 8px;border-radius:999px;background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.sleep-source-graph .sleep-phase-timeline{margin:12px 0 10px}.sleep-audio-marker{position:absolute;z-index:3;top:-4px;bottom:-4px;width:3px;transform:translateX(-1px);border-radius:3px;background:var(--muted);box-shadow:0 0 0 2px var(--panel)}.sleep-audio-marker.pause{background:#ef6461}.sleep-audio-marker.snoring{background:#ffae6d}.sleep-audio-marker.breathing{background:#48c9b0}.sleep-audio-copy{display:block;margin-top:9px}.sleep-recordings{margin-top:16px}.sleep-recordings audio{width:100%;margin-top:14px}.sleep-recordings-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}.sleep-recording-event{display:grid;gap:3px;text-align:left;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2);color:var(--text);cursor:pointer}.sleep-recording-event span{font-size:11px;color:var(--muted)}
#sleep-recordings-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}
@media(max-width:600px){.sleep-source-head{align-items:stretch;flex-direction:column}.sleep-source-head>span{align-self:flex-start}}