#relaxation{--relaxation-ink:#193d32;--relaxation-soft:#62766c;--relaxation-line:rgba(25,61,50,.13);display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid var(--relaxation-line);border-radius:28px;background:#f6f7f2;color:var(--relaxation-ink);isolation:isolate}
#relaxation *{box-sizing:border-box}
.relaxation-copy{padding:clamp(28px,4.4vw,68px);align-self:center}
.relaxation-eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:600;letter-spacing:.14em;line-height:1.5}
.relaxation-eyebrow>span{width:6px;height:6px;border-radius:50%;background:#749174;box-shadow:0 0 0 4px #e7ecdf}
#relaxation h2{font:inherit;font-size:clamp(33px,3.6vw,54px);font-weight:450;line-height:1.08;letter-spacing:-.045em;margin:26px 0 21px;color:var(--relaxation-ink)}
.relaxation-description{max-width:400px;font-size:15px;line-height:1.85;color:#53665c;margin:0}
.relaxation-rule{height:1px;background:var(--relaxation-line);margin:32px 0 27px;max-width:400px}
.relaxation-label{font-size:13px;font-weight:600;margin:0 0 13px}
.relaxation-duration{border:0;padding:0;margin:0;min-width:0}
.relaxation-duration legend{font-size:12px;line-height:1.6;color:#62766c;margin-bottom:13px;padding:0}
.relaxation-duration-options{display:flex;gap:7px;flex-wrap:wrap}
.relaxation-duration button{appearance:none;font:inherit;font-size:12px;line-height:1.4;color:#3f5b4e;border:1px solid #d7dfd2;border-radius:8px;padding:11px 14px;cursor:pointer;background:transparent;transition:background 160ms ease,border-color 160ms ease,color 160ms ease;box-shadow:none}
.relaxation-duration button[aria-pressed=true]{background:#193d32;border-color:#193d32;color:#fff}
.relaxation-duration button:not([aria-pressed=true]):hover{background:#e9eee3}
.relaxation-duration button:disabled{cursor:default;opacity:.6}
.relaxation-settings{display:flex;flex-direction:column;gap:13px;margin-top:25px}
.relaxation-toggle{display:flex;position:relative;align-items:center;gap:10px;font-size:12px;line-height:1.5;color:#53665c;cursor:pointer;width:fit-content}
.relaxation-toggle input{position:absolute;left:0;top:0;width:34px;height:20px;opacity:0;margin:0;cursor:pointer}
.relaxation-switch{width:34px;height:20px;background:#d6dfd0;border-radius:20px;flex:none;position:relative;transition:background .18s ease}
.relaxation-switch:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #193d3220;transition:transform .18s ease}
.relaxation-toggle input:checked+.relaxation-switch{background:#416650}
.relaxation-toggle input:checked+.relaxation-switch:after{transform:translateX(14px)}
.relaxation-toggle input:focus-visible+.relaxation-switch{outline:2px solid #193d32;outline-offset:4px}
.relaxation-safety{font-size:10px;line-height:1.75;max-width:340px;color:#6d7c72;margin:26px 0 0}
.relaxation-experience{padding:30px clamp(22px,3.5vw,50px) 26px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;text-align:center;background:radial-gradient(ellipse at 50% 26%,#e7eedc 0%,#eaf0e3 40%,#e4ebdd 100%)}
.relaxation-orb-wrap{width:260px;height:260px;max-width:100%;position:relative;display:grid;place-items:center;margin:0 auto 9px}
.relaxation-orb{width:164px;height:164px;border-radius:50%;position:relative;background:radial-gradient(circle at 36% 29%,#f8fbec 0%,#e8f0d1 30%,#c6d7ab 64%,#a7be95 100%);box-shadow:inset 0 0 22px #faffed88,0 0 54px #bfd2a355,0 14px 54px #52784516;transform:scale(.96);transition:transform 600ms ease;animation:relaxation-breathe 14s ease-in-out infinite;animation-play-state:paused;z-index:2}
.relaxation-orb>span{position:absolute;inset:11%;border-radius:50%;background:linear-gradient(130deg,#ffffff68,transparent 47%);filter:blur(10px)}
.relaxation-orbit{position:absolute;width:222px;height:222px;border:1px solid #8ba37a27;border-radius:50%;inset:19px}
.relaxation-orbit-two{width:260px;height:260px;inset:0;border-color:#8ba37a17}
.relaxation-orb-caption{position:absolute;left:0;right:0;top:122px;font-size:11px;letter-spacing:.015em;font-weight:500;color:#314d37;z-index:3}
#relaxation[data-state=running][data-motion=true] .relaxation-orb{animation-play-state:running}
#relaxation[data-motion=false] .relaxation-orb{animation:none;transform:scale(.96)}
.relaxation-guidance{font-size:16px;font-weight:450;line-height:1.5;letter-spacing:-.015em;min-height:48px;max-width:300px;display:flex;align-items:center;justify-content:center}
.relaxation-guidance-note{font-size:10px;color:#697b69;line-height:1.75;margin:8px 0 22px}
.relaxation-timer-row{display:flex;align-items:center;gap:11px;text-align:left;margin:0 0 23px}
.relaxation-progress{width:38px;height:38px;flex:none}
.relaxation-progress svg{display:block;width:100%;height:100%;transform:rotate(-90deg)}
.relaxation-progress circle{fill:none;stroke-width:1.4}
.relaxation-progress-track{stroke:#b6c8ac66}
.relaxation-progress-fill{stroke:#527248;stroke-linecap:round;stroke-dasharray:113.097;stroke-dashoffset:113.097;transition:stroke-dashoffset .25s linear}
.relaxation-time{display:block;font-size:21px;font-variant-numeric:tabular-nums;letter-spacing:-.035em;line-height:1.25;font-weight:450}
.relaxation-time-label{display:block;font-size:10px;color:#697b69;line-height:1.6;margin-top:1px}
.relaxation-actions{display:flex;gap:16px;align-items:center;justify-content:center;min-height:48px;flex-wrap:wrap}
.relaxation-primary{appearance:none;background:#193d32;color:#fff;border:1px solid #193d32;font:inherit;font-size:12px;font-weight:500;padding:15px 20px;border-radius:9px;display:inline-flex;gap:17px;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 2px #193d3208,0 5px 12px #193d3209;transition:background .15s ease,transform .15s ease}
.relaxation-primary svg{width:16px;height:16px;flex:none}
.relaxation-primary:hover{background:#284e40}
.relaxation-primary:active{transform:scale(.985)}
.relaxation-end{font:inherit;font-size:12px;background:transparent;border:0;color:#4c6657;padding:10px 0;cursor:pointer;text-decoration:underline;text-decoration-color:#4c66574d;text-underline-offset:4px}
.relaxation-end[hidden]{display:none}
.relaxation-status{font-size:10px;color:#697b69;line-height:1.6;min-height:16px;margin:15px 0 0;max-width:320px}
#relaxation button:focus-visible{outline:2px solid #193d32;outline-offset:4px}
@keyframes relaxation-breathe{0%,100%{transform:scale(.94);box-shadow:inset 0 0 22px #faffed88,0 0 44px #bfd2a344,0 14px 54px #52784512}50%{transform:scale(1.065);box-shadow:inset 0 0 26px #faffed88,0 0 68px #bfd2a35e,0 14px 58px #52784518}}
@media(max-width:760px){#relaxation{grid-template-columns:1fr;border-radius:20px}.relaxation-copy{padding:29px 26px 31px}.relaxation-experience{padding:24px 20px 28px}.relaxation-orb-wrap{width:240px;height:240px}.relaxation-orbit-one{inset:19px;width:202px;height:202px}.relaxation-orbit-two{width:240px;height:240px}.relaxation-orb-caption{top:112px}.relaxation-rule{margin:24px 0}.relaxation-description{font-size:14px}.relaxation-safety{margin-top:22px}}
@media(prefers-reduced-motion:reduce){#relaxation .relaxation-orb{animation:none!important;transform:none!important}#relaxation *,#relaxation *:before,#relaxation *:after{transition:none!important}}
