/* Guided breathing: isolated, mobile-first, calm premium design */
#s-breath{--br-ink:#263c37;--br-muted:#5f776d;--br-green:#2e7963;--br-gold:#d5b986;--br-cream:#fcfaf4;--br-line:#dfe9df;--br-shadow:0 14px 34px #233a3326;position:relative;isolation:isolate;border-radius:22px;min-height:720px;overflow:hidden;background:#e3ece4;color:var(--br-ink);padding:clamp(10px,2.3vw,26px);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
#s-breath:before{position:absolute;z-index:-2;inset:0;content:"";background-image:linear-gradient(175deg,#0e2f30c7 0%,#345b4d92 18%,#f3f6ebc7 42%,#e8eee2e0 100%),var(--br-bg);background-size:cover;background-position:center 40%;opacity:1}
#s-breath:after{position:absolute;z-index:-1;content:"";inset:0;background:radial-gradient(ellipse at 75% 2%,#fff2cf22,transparent 50%);pointer-events:none}
#s-breath *{box-sizing:border-box}
#s-breath button,#s-breath input{font:inherit}
#s-breath button{cursor:pointer}
#s-breath button:focus-visible,#s-breath summary:focus-visible{outline:3px solid #c5e7b9;outline-offset:3px}
#s-breath .br-wrap{max-width:1070px;margin:0 auto;min-width:0}
#s-breath .br-topnav{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 23px;flex-wrap:wrap}
#s-breath .br-topnav button{color:#284a3e;background:#fffef6e8;border:1px solid #fff9;border-radius:999px;padding:10px 15px;font-size:12px;font-weight:750;min-height:42px;box-shadow:0 5px 16px #091d2533}
#s-breath .br-topnav>span{color:#fff8e8;font-size:11px;letter-spacing:2px;font-weight:800;text-shadow:0 1px 5px #182b2470}
#s-breath .br-intro{color:white;min-height:205px;padding:clamp(12px,2vw,26px) clamp(7px,2.6vw,30px) 30px;max-width:790px;text-shadow:0 3px 14px #1025228c}
#s-breath .br-kicker{font-size:11px;letter-spacing:2px;font-weight:800;text-transform:uppercase;color:#e6d5a8}
#s-breath .br-intro h2{margin:12px 0 14px;line-height:1.05;font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(34px,5vw,56px);letter-spacing:-.7px}
#s-breath .br-intro p{font-size:clamp(14px,2vw,17px);line-height:1.6;max-width:600px;margin:0;color:#f6f8f0}
#s-breath .br-hero-quick{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:22px}
#s-breath .br-hero-quick button{border:1px solid #f3dfaf;background:#f6efe0;color:#2e5746;font-weight:800;font-size:13px;padding:13px 18px;border-radius:16px;box-shadow:0 8px 20px #1128204a;min-height:45px}
#s-breath .br-hero-quick span{font-size:12px;color:#fff8e9;font-weight:650}
#s-breath .br-headline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 15px}
#s-breath .br-headline h3{font-family:Georgia,"Times New Roman",serif;font-size:clamp(22px,3vw,30px);color:#2a4d3e;font-weight:600;margin:0}
#s-breath .br-headline>span{color:#57766c;font-size:12px;font-weight:650}
#s-breath .br-practices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:16px}
#s-breath .br-practice{position:relative;min-width:0;isolation:isolate;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;border:1px solid #ffffffab;border-radius:23px;overflow:hidden;min-height:230px;box-shadow:var(--br-shadow);padding:16px;text-align:left;color:#fff;background:#476358;transition:transform .15s ease,box-shadow .15s ease}
#s-breath .br-practice:before{position:absolute;z-index:-2;inset:0;content:"";background-image:var(--br-photo);background-size:cover;background-position:center;filter:saturate(.78)}
#s-breath .br-practice:after{position:absolute;z-index:-1;inset:0;content:"";background:linear-gradient(0deg,#17382deb 0%,#173c3bb5 50%,#17382d57 100%)}
#s-breath .br-practice:hover{transform:translateY(-3px);box-shadow:0 18px 29px #152d2a3a}
#s-breath .br-practice-top{display:flex;justify-content:space-between;gap:6px;align-items:start}
#s-breath .br-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid #f8f3de77;background:#e4eadb31;border-radius:14px;color:#fff3ce;font-size:31px;line-height:1}
#s-breath .br-arrow{font-size:23px;color:#f8f7e6}
#s-breath .br-practice-content{display:grid;gap:7px;align-content:end;padding-top:25px}
#s-breath .br-tag{color:#eee1bd;font-size:11px;font-weight:750;letter-spacing:.4px}
#s-breath .br-practice strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(21px,2.4vw,28px);font-weight:500;line-height:1.17}
#s-breath .br-practice p{font-size:12px;line-height:1.5;margin:0;color:#f9f7ef}
#s-breath .br-time{background:#f9f5e43b;border:1px solid #f6f2d759;border-radius:20px;padding:6px 10px;display:inline-flex;justify-self:start;font-size:12px;margin-top:3px;font-weight:750;color:#fff4db}
#s-breath .br-history{background:#fbfcf6eb;border:1px solid #f8fff6;border-radius:17px;box-shadow:0 5px 17px #1d3d3522;padding:17px 18px;color:#3b6a55;font-size:13px;line-height:1.55;margin:15px 0}
#s-breath .br-safety{border:1px solid #d3dfcb;border-radius:17px;background:#fffdf1d9;color:#526953;line-height:1.6;font-size:12px;padding:18px 20px;margin:15px 0}
#s-breath .br-safety b{color:#3c6a50}
#s-breath .br-detail-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;color:#fff;min-height:165px;padding:15px clamp(7px,2vw,20px) 27px;text-shadow:0 3px 13px #152c2782}
#s-breath .br-detail-heading h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,4.5vw,48px);line-height:1.1;font-weight:500;margin:11px 0}
#s-breath .br-detail-heading p{font-size:14px;line-height:1.5;margin:4px 0;color:#f7f8ed}
#s-breath .br-detail-chip{flex:0 0 auto;min-width:115px;color:#2f5b4b;background:#fbf9edea;border:1px solid #fffefa;border-radius:16px;padding:12px 17px;text-align:center;box-shadow:0 6px 18px #1d383c50;font-size:12px;text-shadow:none}
#s-breath .br-detail-chip b{font-size:24px;font-family:Georgia,serif;font-weight:600}
#s-breath .br-detail-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start;gap:16px}
#s-breath .br-session-panel,#s-breath .br-side-panel,#s-breath .br-howto{background:#fffefaef;border:1px solid #f5f7ec;border-radius:24px;padding:clamp(13px,2vw,25px);box-shadow:var(--br-shadow);min-width:0;color:#284839}
#s-breath .br-ring-area{display:flex;align-items:center;justify-content:center;padding:12px 2px}
#s-breath .br-anim-ring{--br-progress:0%;--br-stage:#94a5a1;--br-phase-progress:0%;position:relative;display:grid;place-items:center;width:clamp(228px,33vw,320px);aspect-ratio:1;border-radius:50%;padding:13px;background:conic-gradient(from -90deg,#3a8c70 var(--br-progress),#dfebe1 var(--br-progress));box-shadow:0 17px 30px #1a423138,0 0 0 5px #dbe8df7a}
#s-breath .br-anim-ring:before{position:absolute;content:"";inset:22px;border-radius:50%;border:1px solid #e1e8dc;box-shadow:inset 0 0 30px #9bbba540;pointer-events:none}
#s-breath .br-anim-inner{position:relative;z-index:2;background:radial-gradient(ellipse at 25% 20%,#fcfff7,#e4f1e9);border-radius:50%;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:20px;text-align:center;box-shadow:inset 0 3px 10px #a7bfa832}
#s-breath .br-anim-inner:before{content:"";position:absolute;inset:12px;border-radius:50%;border:1px solid #a1c5a641;pointer-events:none}
#s-breath .br-anim-inner small{color:#668573;font-size:12px;font-weight:750;letter-spacing:.5px}
#s-breath .br-anim-inner strong{font-family:Georgia,"Times New Roman",serif;color:#2d604b;font-size:clamp(22px,3vw,32px);font-weight:600;line-height:1.12;max-width:95%}
#s-breath .br-anim-inner>span{font-size:clamp(33px,5vw,45px);font-family:Georgia,serif;color:#284e43;font-weight:500}
#s-breath .br-anim-inner p{color:#5e7c68;font-size:12px;line-height:1.5;max-width:205px;margin:3px 0}
#s-breath .br-progress-row{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#608171;font-size:12px;margin:14px 1px 7px}
#s-breath .br-progress-row b{font-size:12px;color:#326751}
#s-breath .br-progress-track{height:8px;background:#d9e5db;border-radius:10px;overflow:hidden}
#s-breath .br-progress-track span{display:block;background:linear-gradient(90deg,#81af8e,#328668);height:100%;width:0;border-radius:10px;transition:width .09s linear}
#s-breath .br-controls{display:grid;grid-template-columns:1fr auto;gap:9px;margin:17px 0 12px}
#s-breath .br-controls button{padding:14px 16px;border-radius:16px;font-weight:800;font-size:14px;min-height:50px}
#s-breath .br-start{background:linear-gradient(120deg,#3c896c,#236c58);border:1px solid #2a7861;color:#fff;box-shadow:0 7px 17px #27745846}
#s-breath .br-secondary{background:#f7f9f0;color:#4c755f;border:1.5px solid #c8decd}
#s-breath .br-session-message{background:#f1f8ee;border-radius:14px;padding:12px 14px;font-size:12px;color:#5b7563;line-height:1.55}
#s-breath .br-audio-switches{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
#s-breath .br-audio-switches button{border:1px solid #d6e4d6;background:#f8f9f4;color:#65796e;border-radius:14px;padding:9px 11px;font-size:11px;font-weight:650}
#s-breath .br-audio-switches button.selected{background:#e4f3e7;color:#2e7356;border-color:#9fc9af}
#s-breath .br-side-stack{display:grid;gap:14px}
#s-breath .br-side-panel h3{font-size:23px}
#s-breath .br-settings-grid{display:grid;gap:9px}
#s-breath .br-form-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:47px;padding:6px 0;border-bottom:1px solid #e6ede4}
#s-breath .br-form-row label{font-size:13px;font-weight:700;color:#476958;max-width:55%}
#s-breath .br-stepper{display:flex;align-items:center;gap:5px;flex:0 0 auto}
#s-breath .br-stepper button{height:37px;width:37px;border-radius:12px;border:1px solid #b9d6c2;background:#eaf5ec;color:#286d51;font-size:24px;display:grid;place-items:center;line-height:1}
#s-breath .br-stepper output{display:block;min-width:53px;text-align:center;font-size:14px;color:#2b634b;font-weight:800}
#s-breath .br-setting-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:13px;font-size:12px;color:#5a7862}
#s-breath .br-setting-footer b{color:#2d7152}
#s-breath .br-reset,#s-breath .br-small-outline{background:#f7faf4;border:1px solid #c7dec9;border-radius:12px;color:#387456;padding:10px 13px;font-size:12px;font-weight:750}
#s-breath .br-small-outline{margin:13px 0 0;display:block;width:100%}
#s-breath .br-lock-note{background:#fff5e5;border-radius:12px;padding:12px;font-size:12px;color:#8c633d}
#s-breath .br-lock-settings{opacity:.62;pointer-events:none}
#s-breath .br-howto{padding:0;overflow:hidden}
#s-breath .br-howto summary{padding:17px 19px;background:#eaf3e8;color:#345e49;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:800;cursor:pointer;list-style:none}
#s-breath .br-howto summary::-webkit-details-marker{display:none}
#s-breath .br-howto summary>span{font-size:20px}
#s-breath .br-howto>p{padding:0 18px;margin:15px 0;color:#5d7163;font-size:13px;line-height:1.65}
#s-breath .br-step-list{display:grid;gap:9px;padding:0 18px 10px}
#s-breath .br-step-list>div{display:flex;align-items:start;gap:10px}
#s-breath .br-step-list>div>span{flex:0 0 27px;height:27px;display:grid;place-items:center;border-radius:50%;color:#39745b;background:#e6f3e8;font-weight:800;font-size:12px}
#s-breath .br-step-list p{font-size:12px;line-height:1.55;color:#566f5e;margin:4px 0}
#s-breath .br-guide-visual{margin:12px 18px;border:1px solid #dbe9db;background:linear-gradient(115deg,#eef7ed,#f9f4e8);min-height:110px;border-radius:15px;display:grid;place-items:center;overflow:hidden}
#s-breath .br-tip{margin:10px 18px 18px;border-radius:12px;padding:11px 13px;background:#fbf4e6;color:#78694b;font-size:12px;line-height:1.6}
#s-breath .br-square-diagram{width:95px;height:95px;border:4px solid #488b70;position:relative;transform:rotate(0deg);margin:24px}
#s-breath .br-square-diagram span{position:absolute;color:#2c6b51;font-size:10px;font-weight:800;white-space:nowrap;background:#f7f9ed;padding:2px 5px}
#s-breath .br-square-diagram span:nth-child(1){top:-15px;left:4px}
#s-breath .br-square-diagram span:nth-child(2){top:39px;right:-40px;transform:rotate(90deg)}
#s-breath .br-square-diagram span:nth-child(3){bottom:-15px;left:0}
#s-breath .br-square-diagram span:nth-child(4){top:34px;left:-42px;transform:rotate(-90deg)}
#s-breath .br-nostril-diagram{padding:20px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;color:#3d755d;font-size:12px}
#s-breath .br-nostril-diagram span{background:#fff;border:1px solid #b9d8c3;border-radius:12px;padding:10px}
#s-breath .br-nostril-diagram b{font-size:25px}
#s-breath .br-nostril-diagram small{width:100%;text-align:center;color:#66836d}
#s-breath .br-steps-diagram{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;padding:18px}
#s-breath .br-steps-diagram span{border:1px solid #b9d8c3;background:#fff;color:#357055;border-radius:20px;padding:8px 10px;font-size:11px;font-weight:750}
#s-breath .br-wave-diagram{display:flex;gap:8px;align-items:center;height:80px}
#s-breath .br-wave-diagram span{width:5px;background:#7aa994;border-radius:5px;height:25px}
#s-breath .br-wave-diagram span:nth-child(2),#s-breath .br-wave-diagram span:nth-child(6){height:44px}
#s-breath .br-wave-diagram span:nth-child(3),#s-breath .br-wave-diagram span:nth-child(5){height:65px}
#s-breath .br-wave-diagram span:nth-child(4){height:75px}
@media(max-width:900px){#s-breath .br-practices{grid-template-columns:repeat(2,minmax(0,1fr))}#s-breath .br-detail-layout{grid-template-columns:1fr}#s-breath .br-side-stack{grid-template-columns:1fr 1fr;align-items:start}}
@media(max-width:600px){#s-breath{padding:9px;border-radius:16px}#s-breath .br-topnav{margin:0 0 15px}#s-breath .br-topnav>span{font-size:9px;order:-1;width:100%;text-align:center}#s-breath .br-intro{min-height:188px;padding:15px 7px 25px}#s-breath .br-intro h2{font-size:38px}#s-breath .br-intro p{font-size:14px}#s-breath .br-hero-quick button{width:100%;font-size:12px}#s-breath .br-hero-quick span{width:100%}#s-breath .br-practices{gap:10px}#s-breath .br-practice{padding:12px;min-height:223px;border-radius:18px}#s-breath .br-practice strong{font-size:20px}#s-breath .br-practice p{font-size:11px}#s-breath .br-icon{height:39px;width:39px;font-size:25px}#s-breath .br-tag{font-size:10px}#s-breath .br-detail-heading{padding:15px 4px 22px;min-height:145px;align-items:start}#s-breath .br-detail-heading h2{font-size:31px}#s-breath .br-detail-chip{padding:9px 11px;min-width:90px}#s-breath .br-detail-chip b{font-size:20px}#s-breath .br-ring-area{padding:12px 0}#s-breath .br-anim-ring{width:min(72vw,290px)}#s-breath .br-side-stack{grid-template-columns:1fr}#s-breath .br-session-panel{padding:14px}#s-breath .br-controls button{padding:12px 10px;font-size:13px}}
@media(max-width:380px){#s-breath .br-practices{grid-template-columns:1fr}#s-breath .br-practice{min-height:200px}#s-breath .br-detail-heading h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){#s-breath .br-practice{transition:none}#s-breath .br-progress-track span{transition:none}}

/* Breathing-linked motion: gently expands on inhale and recedes on exhale */
#s-breath .br-anim-inner{transform:scale(var(--br-scale,1));will-change:transform}
#s-breath .br-anim-ring.br-pulse-hold .br-anim-inner{box-shadow:inset 0 3px 10px #a7bfa832,0 0 22px #84ae9330}
@media(prefers-reduced-motion:reduce){#s-breath .br-anim-inner{transform:none!important;will-change:auto}}