@layer components{.practice-page{--breath-light:var(--surface);--breath-ink:var(--fg);--belly-light:var(--color-zen-0);--meditation-halo:color-mix(in srgb, var(--fg) 13%, transparent);--practice-sheet:color-mix(in srgb, var(--canvas) 90%, transparent);--ease-sheet:cubic-bezier(.32, .72, 0, 1)}[data-theme=dark] .practice-page{--breath-light:var(--fg);--meditation-halo:color-mix(in srgb, var(--fg) 16%, transparent)}.practice-scene{isolation:isolate;text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:max(40rem,100svh - 5rem);padding:.5rem 1.5rem 3.5rem;display:flex;position:relative;overflow:clip}.practice-art{flex-shrink:0;width:min(52svh,34rem)}.practice-copy{z-index:4;flex-direction:column;align-items:center;width:min(100%,30rem);margin-top:-.5rem;display:flex;position:relative}.practice-title{font-family:var(--font-calligraphy), Georgia, serif;letter-spacing:0;font-size:clamp(2.5rem,7vw,3.5rem);font-weight:400;line-height:1.15}.practice-intro{color:var(--fg-muted);text-wrap:balance;margin-top:.75rem;line-height:1.7}.practice-muted{color:var(--fg-muted);text-wrap:balance;margin-top:.5rem;font-size:.875rem;line-height:1.6}.practice-result{margin-top:.75rem}.practice-result h2{font-family:var(--font-calligraphy), Georgia, serif;letter-spacing:0;font-size:1.75rem;font-weight:400;line-height:1.3}.practice-result p:not(.practice-muted){margin-top:.25rem;font-size:1.0625rem}.practice-actions{flex-direction:column;align-items:center;gap:.875rem;margin-top:1.75rem;display:flex}.practice-summary{color:var(--fg-muted);font-variant-numeric:tabular-nums;white-space:nowrap}.practice-drawer{border:0;border-left:1px solid var(--line);width:min(26rem,100vw);max-width:none;height:100dvh;max-height:none;color:var(--fg);background:var(--practice-sheet);-webkit-backdrop-filter:blur(24px)saturate(1.15);backdrop-filter:blur(24px)saturate(1.15);transition:transform .48s var(--ease-sheet), overlay .48s allow-discrete, display .48s allow-discrete;margin:0;padding:0;position:fixed;inset:0 0 0 auto;overflow:hidden;transform:translate(0)}.practice-drawer:not([open]){transform:translate(100%)}@starting-style{.practice-drawer[open]{transform:translate(100%)}}.practice-drawer::backdrop{background:color-mix(in srgb, var(--canvas) 40%, transparent);opacity:1;transition:opacity .48s var(--ease-sheet), overlay .48s allow-discrete, display .48s allow-discrete}.practice-drawer:not([open])::backdrop{opacity:0}@starting-style{.practice-drawer[open]::backdrop{opacity:0}}.practice-drawer-panel{flex-direction:column;height:100dvh;display:flex}.practice-drawer-header{justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem 1.25rem .25rem 1.75rem;display:flex;position:relative}.practice-drawer-header h2{font-family:var(--font-calligraphy), Georgia, serif;letter-spacing:0;font-size:2.25rem;font-weight:400;line-height:1.2}.practice-icon-button{width:2.75rem;height:2.75rem;color:var(--fg);cursor:pointer;transition:background-color .16s var(--ease-out), transform .14s var(--ease-out);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.practice-icon-button:active{transform:scale(.94)}.practice-drawer-body{overscroll-behavior:contain;min-height:0;-webkit-mask-image:linear-gradient(var(--fg) calc(100% - 1.5rem), transparent);mask-image:linear-gradient(var(--fg) calc(100% - 1.5rem), transparent);flex:1;align-content:start;gap:1.75rem;padding:.75rem 1.75rem 2rem;display:grid;overflow-y:auto}.practice-drawer-footer{padding:1rem 1.75rem max(1.25rem, env(safe-area-inset-bottom));border-top:1px solid var(--line)}.practice-rhythm,.practice-field-group{gap:1.25rem;display:grid}.practice-glyph{width:100%;height:auto;display:block;overflow:visible}.practice-glyph path{fill:none;stroke:var(--fg);stroke-width:2.25px;stroke-linecap:round;stroke-linejoin:round}.practice-field{border:0;min-width:0;margin:0;padding:0}.practice-field legend{letter-spacing:.04em;color:var(--fg-muted);margin-bottom:.75rem;padding:0;font-size:.8125rem}.practice-chips{flex-wrap:wrap;gap:.5rem;display:flex}.practice-chip{border:1px solid var(--line-strong);cursor:pointer;min-height:2.75rem;transition:background-color .16s var(--ease-out), color .16s var(--ease-out), border-color .16s var(--ease-out), transform .14s var(--ease-out);border-radius:999px;align-items:center;padding:0 1.125rem;font-size:.9375rem;display:inline-flex;position:relative}.practice-chip input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.practice-chip:active{transform:scale(.97)}.practice-chip:has(input:checked){border-color:var(--solid);color:var(--on-solid);background:var(--solid)}.practice-chip:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:3px}.practice-dials{grid-template-columns:repeat(4,minmax(0,1fr));gap:.25rem;display:grid}.practice-dial{justify-items:center;gap:.125rem;display:grid}.practice-dial-label{min-height:2.5em;color:var(--fg-muted);text-align:center;text-wrap:balance;align-items:flex-end;font-size:.75rem;line-height:1.25;display:flex}.practice-dial-value{font-variant-numeric:tabular-nums;align-items:center;min-height:2.75rem;font-size:2.25rem;font-weight:300;line-height:1.2;display:flex}.practice-dial-value[data-zero=true]{color:var(--fg-muted)}.practice-step{border:1px solid var(--line-strong);width:2.75rem;height:2.75rem;color:var(--fg);cursor:pointer;transition:background-color .16s var(--ease-out), opacity .16s var(--ease-out), transform .14s var(--ease-out);border-radius:999px;justify-content:center;align-items:center;display:inline-flex}.practice-step:active:not(:disabled){transform:scale(.94)}.practice-step:disabled{cursor:default;opacity:.35}.practice-hint{color:var(--fg-muted);text-wrap:balance;font-size:.8125rem;line-height:1.6}.practice-volume{color:var(--fg-muted);grid-template-columns:auto 1fr;align-items:center;gap:1rem;font-size:.8125rem;display:grid}.practice-custom{color:var(--fg-muted);justify-content:space-between;align-items:center;gap:1rem;font-size:.8125rem;display:flex}.practice-custom input{border:1px solid var(--line-strong);width:6rem;min-height:2.75rem;color:var(--fg);font:inherit;text-align:center;appearance:textfield;background:0 0;border-radius:999px;padding:0 1rem;font-size:1rem}.practice-custom input::-webkit-inner-spin-button{appearance:none}.practice-custom input::-webkit-outer-spin-button{appearance:none}.practice-custom input:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.practice-range{cursor:pointer;appearance:none;background:0 0;width:100%;height:2.75rem;margin:0}.practice-range::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--fg) var(--fill), var(--line-strong) var(--fill));border-radius:1px;height:2px}.practice-range::-webkit-slider-thumb{background:var(--solid);width:1.25rem;height:1.25rem;transition:transform .14s var(--ease-out);appearance:none;border:0;border-radius:50%;margin-top:calc(1px - .625rem)}.practice-range:active::-webkit-slider-thumb{transform:scale(1.15)}.practice-range:focus-visible::-webkit-slider-thumb{outline:2px solid var(--focus);outline-offset:3px}.practice-range::-moz-range-track{background:var(--line-strong);border-radius:1px;height:2px}.practice-range::-moz-range-progress{background:var(--fg);border-radius:1px;height:2px}.practice-range::-moz-range-thumb{background:var(--solid);border:0;border-radius:50%;width:1.25rem;height:1.25rem}.practice-range:focus-visible::-moz-range-thumb{outline:2px solid var(--focus);outline-offset:3px}.practice-range:focus-visible{outline:none}.practice-session{width:100%;max-width:none;height:100%;max-height:none;color:var(--fg);background:var(--canvas);opacity:1;transition:opacity .6s ease, overlay .6s allow-discrete, display .6s allow-discrete;border:0;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}.practice-session:not([open]){opacity:0}@starting-style{.practice-session[open]{opacity:0}}.practice-session::backdrop{background:var(--canvas);opacity:1;transition:opacity .6s ease, overlay .6s allow-discrete, display .6s allow-discrete}.practice-session:not([open])::backdrop{opacity:0}@starting-style{.practice-session[open]::backdrop{opacity:0}}html:has(.practice-session[open]){overflow:hidden}.practice-session-body{isolation:isolate;height:100%;padding:max(1rem, env(safe-area-inset-top)) 1.5rem 6.5rem;text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.practice-session-body[data-controls=false]{cursor:none}.practice-session-art{flex-shrink:0;width:min(100%,46rem,max(14rem,100svh - 17rem));transition:opacity .5s}.practice-session-body[data-paused=true] .practice-session-art{opacity:.55}.practice-phase{z-index:4;min-width:14rem;margin-top:-.5rem;position:relative}.practice-phase-name{min-height:1.15em;font-family:var(--font-calligraphy), Georgia, serif;font-size:clamp(2.5rem,8vw,3.5rem);line-height:1.15}.practice-phase-name>span{animation:practice-word .7s var(--ease-out) both;display:inline-block}.practice-phase-count{font-variant-numeric:tabular-nums;min-height:1.75rem;color:var(--fg-muted);margin-top:.25rem;font-size:1.25rem}.practice-cycle{gap:.5rem;width:min(100%,18rem);margin:1.25rem auto 0;display:flex}.practice-cycle>span{flex:var(--seconds) 1 0px;background:var(--line);border-radius:1px;height:2px;overflow:hidden}.practice-cycle>span>span{background:var(--fg);transform-origin:0;width:100%;height:100%;display:block;transform:scaleX(0)}.practice-chrome{z-index:5;padding:0 1.5rem max(1.5rem, env(safe-area-inset-bottom));transition:opacity .9s var(--ease-out);flex-direction:column;align-items:center;gap:.875rem;display:flex;position:absolute;inset:auto 0 0}.practice-session-body[data-controls=true] .practice-chrome{transition-duration:.7s;transition-timing-function:var(--ease-breath)}.practice-session-body[data-controls=false] .practice-chrome{opacity:0;pointer-events:none}.practice-remaining{font-variant-numeric:tabular-nums;color:var(--fg-muted);font-size:.9375rem}.practice-error{text-wrap:balance;max-width:24rem;font-size:.8125rem}.practice-controls{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.practice-controls>*{white-space:nowrap}@keyframes practice-word{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (min-width:1024px){.practice-scene{min-height:max(42rem,100svh - 6rem)}}@media (max-width:767px){.practice-art{width:min(100%,46svh)}.practice-drawer{border-top:1px solid var(--line);border-left:0;border-radius:1.5rem 1.5rem 0 0;width:100%;height:auto;inset:auto 0 0;transform:translateY(0)}.practice-drawer:not([open]){transform:translateY(100%)}@starting-style{.practice-drawer[open]{transform:translateY(100%)}}.practice-drawer-panel{height:auto;max-height:min(90dvh,46rem)}.practice-drawer-header{touch-action:none;padding:1.75rem 1rem .25rem 1.5rem}.practice-drawer-header:before{content:"";background:var(--line-strong);border-radius:2px;width:2.25rem;height:4px;position:absolute;top:.5rem;left:50%;translate:-50%}.practice-drawer-body,.practice-drawer-footer{padding-inline:1.5rem}}@media (max-height:520px) and (orientation:landscape){.practice-session-body{flex-direction:row;gap:2.5rem;padding:1rem 2rem}.practice-session-art{width:min(100svh - 2rem,22rem)}.practice-phase{margin-top:0}.practice-chrome{flex-shrink:0;padding:0;position:static;inset:auto}.practice-remaining{display:none}.practice-controls{flex-direction:column}.practice-cycle{margin-top:.75rem}}@media (hover:hover) and (pointer:fine){.practice-chip:hover,.practice-icon-button:hover,.practice-step:hover:not(:disabled){background-color:var(--raised)}.practice-chip:has(input:checked):hover{background-color:var(--solid)}}@media (prefers-reduced-transparency:reduce),(prefers-contrast:more){.practice-drawer{background:var(--canvas);-webkit-backdrop-filter:none;backdrop-filter:none}}@media (prefers-reduced-motion:reduce){.practice-drawer,.practice-drawer:not([open]){transition-property:opacity,overlay,display;transform:none}.practice-drawer:not([open]){opacity:0}@starting-style{.practice-drawer[open]{opacity:0;transform:none}}.practice-phase-name>span{animation-name:practice-word-still}.practice-chip:active,.practice-icon-button:active,.practice-step:active:not(:disabled){transform:none}@keyframes practice-word-still{0%{opacity:0}to{opacity:1}}}}