.routines{container:routines/inline-size}.routines__day{gap:var(--space-7);align-items:start;display:grid}.routines__line{--margin:calc(var(--space-6) * 5);--rail:calc(var(--space-5) - var(--space-1));--line-x:calc(var(--margin) + var(--space-3) + var(--rail) / 2);--text-x:calc(var(--margin) + var(--space-3) + var(--rail) + var(--space-2));isolation:isolate;min-width:0;position:relative}.routines__line:before{content:"";z-index:1;top:var(--space-3);bottom:var(--space-4);left:calc(var(--line-x) - 1px);background:linear-gradient(var(--blue-border), var(--accent) 40%, var(--blue-deep));pointer-events:none;width:2px;position:absolute}.routines__station+.routines__station{margin-top:var(--space-6)}.routines__station>h2{margin-left:var(--text-x);overflow-wrap:anywhere;position:relative}.routines__station-mark{z-index:2;top:.5lh;left:calc(var(--space-2) * -1 - var(--rail) / 2);width:var(--rail);height:var(--rail);border-radius:var(--radius-round);background:var(--paper);color:var(--accent);justify-content:center;align-items:center;display:inline-flex;position:absolute;transform:translate(-50%,-50%)}.routines__station-dot{width:var(--space-3);height:var(--space-3);border-radius:var(--radius-round);background:var(--accent)}.routines__stops{margin:0;padding:0;list-style:none}.routines__stop{grid-template-columns:var(--margin) minmax(0, 1fr);column-gap:calc(var(--space-3) + var(--rail) + var(--space-2));margin-inline:calc(var(--space-2) * -1);padding:var(--space-2);border-radius:var(--radius-md);transition:background-color var(--duration-out) var(--ease-in);grid-template-rows:auto 1fr;grid-template-areas:"margin name""margin how";align-items:baseline;display:grid;position:relative}.routines__stop:hover{background-color:color-mix(in srgb, var(--ink) 2%, var(--card));transition-duration:var(--duration-quick);transition-timing-function:var(--ease-out)}.routines__stop-mark{z-index:2;top:calc(var(--space-2) + var(--space-3));left:calc(var(--space-2) + var(--line-x));width:var(--space-3);height:var(--space-3);border:2px solid var(--accent);border-radius:var(--radius-round);background:var(--paper);transition:background-color var(--duration-out) var(--ease-in);position:absolute;transform:translate(-50%,-50%)}.routines__stop:hover .routines__stop-mark{background:var(--accent);transition-duration:var(--duration-quick);transition-timing-function:var(--ease-out)}.routines__stop-name{grid-area:name}.routines__stop-name,.routines__side-name{color:var(--ink);font:var(--font-body);text-align:left;overflow-wrap:anywhere;cursor:pointer;background:0 0;border:0;margin:0;padding:0}.routines__stop-name b,.routines__side-name b{font-weight:500}.routines__stop-name:after,.routines__side-name:after{content:"";border-radius:var(--radius-md);position:absolute;inset:0}.routines__stop-name:focus-visible,.routines__side-name:focus-visible{outline:none}.routines__stop-name:focus-visible:after,.routines__side-name:focus-visible:after{outline:2px solid var(--accent);outline-offset:-2px}.routines__stop-how,.routines__side-how,.routines__side-facts{color:var(--ink-muted);font:var(--font-secondary);overflow-wrap:anywhere}.routines__stop-how{grid-area:how}.routines__stop-margin{color:var(--ink-muted);font:var(--font-secondary);text-align:right;overflow-wrap:anywhere;grid-area:margin;display:grid}.routines__stop-when{color:var(--ink)}.routines__add{padding-left:calc(var(--margin) + var(--space-3));position:relative}.routines__add:before{content:"";z-index:2;bottom:var(--space-2);left:calc(var(--line-x) - var(--space-2));width:var(--space-4);height:var(--space-4);border-radius:var(--radius-round);background:var(--paper);position:absolute}.routines__add>button{z-index:3;position:relative}.routines__side{grid-template-columns:repeat(auto-fit, minmax(calc(var(--space-6) * 9), 1fr));gap:var(--space-6) var(--space-7);align-items:start;min-width:0;display:grid}.routines__side:empty{display:none}.routines__side:has(>.is-folding){transition:row-gap var(--duration-base) var(--ease-in);row-gap:0}.routines__side-group>h2{overflow-wrap:anywhere}.routines__side-stops{margin:0 calc(var(--space-2) * -1);padding:0;list-style:none}.routines__side-stop{padding:var(--space-2);border-radius:var(--radius-md);transition:background-color var(--duration-out) var(--ease-in);display:grid;position:relative}.routines__side-stop:hover{background-color:color-mix(in srgb, var(--ink) 2%, var(--card));transition-duration:var(--duration-quick);transition-timing-function:var(--ease-out)}.routines__side-group.is-aside .routines__side-name{color:var(--ink-muted)}.routines__side-stop.has-dot{padding-left:var(--space-6)}.routines__side-mark{z-index:2;top:calc(var(--space-2) + var(--space-3));left:var(--space-2);position:absolute;transform:translateY(-50%)}:is(.routines__line:has([data-routine-lifted],[data-routine-landing]),.routines__side:has([data-routine-lifted],[data-routine-landing])){z-index:2;position:relative}@container routines (min-width:880px){.routines__day{grid-template-columns:minmax(0, 1fr) calc(var(--space-6) * 10)}}@container routines (max-width:519px){.routines__line{--margin:0px;--line-x:calc(var(--rail) / 2);--text-x:calc(var(--rail) + var(--space-2))}.routines__stop{padding-left:calc(var(--text-x) + var(--space-2));grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-template-areas:"name""margin""how";column-gap:0}.routines__stop-margin{text-align:left;display:block}.routines__stop-margin>*+:before{content:" · "}.routines__add{padding-left:0}}