body{display:flex;min-height:100vh;flex-direction:column}.breathing-main{flex:1;padding:52px 0 76px}.intro{max-width:840px;margin:0 auto 32px;text-align:center}.crumbs{margin-bottom:18px;color:var(--muted);font-size:.82rem}.crumbs a{color:var(--primary);font-weight:750}.intro h1{margin:18px auto 14px;font-size:clamp(2.7rem,7vw,4.9rem)}.intro .lead{max-width:750px}
.breathing-shell{--session-progress:0;--dot-x:0;--dot-y:1;--breath-scale:.72;--p0:0;--p1:0;--p2:0;--p3:0;position:relative;max-width:1100px;margin:auto;overflow:hidden;border:1px solid var(--border);border-radius:32px;background:rgba(255,255,255,.9);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.breathing-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(315px,.6fr)}
.breathing-stage{position:relative;display:flex;min-height:690px;overflow:hidden;flex-direction:column;align-items:center;justify-content:center;padding:40px 36px;color:#fff;background:radial-gradient(circle at 50% 43%,rgba(104,230,210,.18),transparent 28%),radial-gradient(circle at 12% 13%,rgba(146,130,255,.28),transparent 28%),linear-gradient(155deg,#161a40 0%,#29265d 52%,#174c5d 100%)}.breathing-stage:before,.breathing-stage:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.breathing-stage:before{width:410px;height:410px;top:-260px;right:-150px;background:rgba(141,126,248,.16)}.breathing-stage:after{width:320px;height:320px;bottom:-210px;left:-120px;background:rgba(67,229,207,.12)}
.stage-top{position:absolute;z-index:5;top:24px;right:24px;left:24px;display:flex;align-items:center;justify-content:space-between}.session-kicker{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.76);font-size:.71rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.session-kicker>span:first-child{width:7px;height:7px;border-radius:50%;background:#72ead7;box-shadow:0 0 0 5px rgba(114,234,215,.12)}.focus-control{display:grid;width:43px;height:43px;place-items:center;border:1px solid rgba(255,255,255,.18);border-radius:13px;color:#fff;background:rgba(255,255,255,.08);font-size:1.25rem;line-height:1;backdrop-filter:blur(10px);transition:.2s}.focus-control:hover{background:rgba(255,255,255,.16);transform:translateY(-1px)}
.square-scene{position:relative;z-index:2;display:grid;width:min(430px,76vw);aspect-ratio:1;place-items:center;margin-top:14px}.ambient-orb{position:absolute;width:55%;height:55%;border-radius:38%;background:radial-gradient(circle at 34% 26%,rgba(234,255,252,.56),rgba(80,214,198,.25) 35%,rgba(112,94,222,.14) 69%,transparent 70%);filter:blur(2px);opacity:.9;transform:scale(var(--breath-scale));transition:transform .12s linear,opacity .3s}.breath-square{position:absolute;inset:15%;filter:drop-shadow(0 0 22px rgba(105,235,215,.12))}.breath-square:before{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.16);border-radius:28px;box-shadow:inset 0 0 34px rgba(255,255,255,.035)}.route{position:absolute;background:rgba(255,255,255,.12);overflow:hidden}.route i{position:absolute;display:block;background:linear-gradient(90deg,#9d8eff,#6df0dc);box-shadow:0 0 12px rgba(109,240,220,.7)}.route-left{top:0;bottom:0;left:-1px;width:3px}.route-left i{right:0;bottom:0;left:0;height:calc(var(--p0)*100%)}.route-top{top:-1px;right:0;left:0;height:3px}.route-top i{top:0;bottom:0;left:0;width:calc(var(--p1)*100%)}.route-right{top:0;right:-1px;bottom:0;width:3px}.route-right i{top:0;right:0;left:0;height:calc(var(--p2)*100%)}.route-bottom{right:0;bottom:-1px;left:0;height:3px}.route-bottom i{top:0;right:0;bottom:0;width:calc(var(--p3)*100%)}.guide-dot{position:absolute;z-index:3;left:calc(var(--dot-x)*100%);top:calc(var(--dot-y)*100%);width:17px;height:17px;border:4px solid rgba(255,255,255,.75);border-radius:50%;background:#77f1df;box-shadow:0 0 0 8px rgba(119,241,223,.13),0 0 25px #77f1df;transform:translate(-50%,-50%);transition:left .12s linear,top .12s linear}.route-label{position:absolute;color:rgba(255,255,255,.45);font-size:.63rem;font-weight:850;letter-spacing:.17em;text-transform:uppercase;transition:.25s}.label-left{top:50%;left:-60px;transform:rotate(-90deg) translateX(-50%);transform-origin:left top}.label-top{top:-29px;left:50%;transform:translateX(-50%)}.label-right{top:50%;right:-67px;transform:rotate(90deg) translateX(50%);transform-origin:right top}.label-bottom{bottom:-29px;left:50%;transform:translateX(-50%)}.breathing-shell[data-phase="0"] .label-left,.breathing-shell[data-phase="1"] .label-top,.breathing-shell[data-phase="2"] .label-right,.breathing-shell[data-phase="3"] .label-bottom{color:#8ff4e5;text-shadow:0 0 14px rgba(143,244,229,.45)}
.breath-copy{position:relative;z-index:2;display:grid;place-items:center;text-align:center;pointer-events:none}.phase-overline{min-height:17px;color:rgba(255,255,255,.56);font-size:.65rem;font-weight:850;letter-spacing:.18em;text-transform:uppercase}.phase-name{margin-top:10px;font-size:clamp(1.45rem,4vw,2.15rem);letter-spacing:-.04em}.phase-count{margin-top:3px;font-variant-numeric:tabular-nums;font-size:clamp(4.6rem,11vw,6.7rem);font-weight:760;line-height:.9;letter-spacing:-.08em;text-shadow:0 9px 32px rgba(8,11,39,.34)}.phase-hint{min-height:18px;margin-top:14px;color:rgba(255,255,255,.65);font-size:.76rem}
.stage-readout{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:13px;margin-top:2px;color:rgba(255,255,255,.57);font-size:.72rem}.stage-readout strong{color:rgba(255,255,255,.93);font-variant-numeric:tabular-nums;font-size:.8rem}.readout-divider{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.35)}.stage-status{position:relative;z-index:2;min-height:21px;margin:16px 0 17px;color:rgba(255,255,255,.72);font-size:.82rem;text-align:center}.controls{position:relative;z-index:2;display:flex;align-items:center;gap:10px}.main-control,.secondary-control{min-height:52px;border-radius:16px;font-weight:850;transition:.2s}.main-control{min-width:178px;border:0;color:#28275a;background:#fff;box-shadow:0 14px 34px rgba(8,12,37,.28)}.main-control:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(8,12,37,.34)}.secondary-control{min-width:88px;border:1px solid rgba(255,255,255,.18);color:#fff;background:rgba(255,255,255,.08)}.secondary-control:hover{background:rgba(255,255,255,.16)}.session-progress{position:absolute;z-index:2;right:30px;bottom:24px;left:30px;height:4px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.12)}.session-progress span{display:block;width:calc(var(--session-progress)*100%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#9d8eff,#72ead7);box-shadow:0 0 16px rgba(114,234,215,.55);transition:width .15s linear}
.settings-panel{padding:34px 30px;border-left:1px solid var(--border);background:rgba(251,250,255,.95)}.settings-eyebrow,.section-kicker{display:block;margin-bottom:8px;color:var(--primary);font-size:.68rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.settings-panel h2{margin:0 0 6px;font-size:1.35rem;letter-spacing:-.03em}.settings-panel>p{margin:0 0 21px;color:var(--muted);font-size:.8rem;line-height:1.55}.goal-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.goal-option{display:grid;min-height:62px;padding:10px;border:1px solid var(--border);border-radius:13px;color:var(--text);background:#fff;text-align:left;transition:.2s}.goal-option strong{font-size:.79rem}.goal-option span{align-self:end;color:var(--muted);font-size:.68rem}.goal-option:hover{border-color:rgba(108,92,231,.35);transform:translateY(-1px)}.goal-option.active{color:#fff;border-color:var(--primary);background:linear-gradient(135deg,var(--primary),#8375ed);box-shadow:0 9px 22px rgba(108,92,231,.18)}.goal-option.active span{color:rgba(255,255,255,.72)}.goal-option.wide{grid-column:1/-1;min-height:57px}.setting-divider{height:1px;margin:22px 0;background:var(--border)}.switch-list{display:grid;gap:16px}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.switch-copy strong,.switch-copy span{display:block}.switch-copy strong{font-size:.82rem}.switch-copy span{margin-top:3px;color:var(--muted);font-size:.7rem;line-height:1.4}.switch{position:relative;width:44px;height:25px;flex:none}.switch input{position:absolute;opacity:0}.switch>span:not(.sr-only){position:absolute;inset:0;border-radius:99px;background:#d8d6e4;transition:.2s}.switch>span:not(.sr-only):after{content:"";position:absolute;top:4px;left:4px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 2px 7px #0003;transition:.2s}.switch input:focus-visible+span{outline:3px solid rgba(108,92,231,.25);outline-offset:2px}.switch input:checked+span{background:var(--primary)}.switch input:checked+span:after{transform:translateX(19px)}.pattern-card{display:flex;align-items:center;gap:13px;margin-top:22px;padding:14px;border:1px solid rgba(108,92,231,.1);border-radius:14px;background:linear-gradient(135deg,#f0edff,#edfafa)}.mini-box{position:relative;width:39px;height:39px;flex:none;border:2px solid rgba(108,92,231,.26);border-radius:10px}.mini-box i{position:absolute;width:7px;height:7px;right:-4px;top:-4px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(0,194,168,.1)}.pattern-card strong,.pattern-card small{display:block}.pattern-card strong{color:var(--primary-dark);font-size:.75rem}.pattern-card small{margin-top:4px;color:var(--muted);font-size:.68rem}.keyboard-tip{margin:17px 0 0!important;padding-top:16px;border-top:1px solid var(--border);font-size:.68rem!important}.keyboard-tip strong{color:var(--primary-dark)}
.content-section{padding:70px 0}.content-section.alt{border-block:1px solid rgba(31,34,62,.06);background:rgba(255,255,255,.45)}.content{max-width:950px;margin:auto}.content h2{margin:0 0 12px;font-size:clamp(1.8rem,4vw,2.55rem);letter-spacing:-.04em}.content>p{color:var(--muted);line-height:1.75}.phase-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:26px}.phase-card{position:relative;overflow:hidden;padding:22px 19px;border:1px solid var(--border);border-radius:19px;background:#fff}.phase-card>span{display:grid;width:32px;height:32px;place-items:center;margin-bottom:25px;border-radius:10px;color:var(--primary);background:#f0edff;font-size:.68rem;font-weight:900}.phase-card:after{content:"";position:absolute;width:70px;height:70px;top:-37px;right:-37px;border-radius:50%;background:rgba(0,194,168,.08)}.phase-card h3{margin:0 0 7px;font-size:.96rem}.phase-card p{margin:0;color:var(--muted);font-size:.81rem;line-height:1.6}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:25px;counter-reset:step}.step{position:relative;padding:24px 22px 22px;border:1px solid var(--border);border-radius:19px;background:#fff;counter-increment:step}.step:before{content:counter(step);display:grid;width:31px;height:31px;place-items:center;margin-bottom:14px;border-radius:10px;color:#fff;background:linear-gradient(135deg,var(--primary),#8375ed);font-size:.78rem;font-weight:900}.step h3{margin:0 0 7px;font-size:1rem}.step p{margin:0;color:var(--muted);font-size:.85rem;line-height:1.65}.comfort-note{display:flex;gap:13px;margin-top:18px;padding:16px 18px;border:1px solid rgba(0,146,128,.12);border-radius:16px;background:rgba(0,194,168,.07)}.comfort-note>span{display:grid;width:25px;height:25px;flex:none;place-items:center;border-radius:50%;color:#087b6c;background:rgba(0,194,168,.14);font-weight:900}.comfort-note p{margin:1px 0 0;color:#4e6b69;font-size:.8rem;line-height:1.6}.faq{display:grid;gap:10px;margin-top:24px}.faq details{border:1px solid var(--border);border-radius:15px;background:#fff}.faq summary{padding:17px 19px;cursor:pointer;font-weight:800}.faq details p{margin:0;padding:0 19px 18px;color:var(--muted);line-height:1.7}.try-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.try-head h2{margin-bottom:5px}.try-head p{margin:0;color:var(--muted)}.try-head>a{color:var(--primary);font-size:.86rem;font-weight:800}.try-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:25px}.try-card{display:flex;align-items:center;gap:13px;padding:18px;border:1px solid var(--border);border-radius:17px;background:#fff;transition:.2s}.try-card:hover{transform:translateY(-3px);box-shadow:0 14px 35px rgba(53,49,110,.1)}.try-icon{display:grid;width:44px;height:44px;flex:none;place-items:center;border-radius:13px;color:var(--primary);background:#f0edff;font-size:.7rem;font-weight:850}.try-card strong,.try-card span span{display:block}.try-card span span{margin-top:4px;color:var(--muted);font-size:.75rem}.toast{position:fixed;right:22px;bottom:22px;z-index:90;max-width:calc(100% - 44px);padding:13px 17px;border-radius:13px;color:#fff;background:#25263d;box-shadow:0 14px 38px #1f223e3d;opacity:0;transform:translateY(14px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.focus-mode{overflow:hidden;background:#161a40}body.focus-mode .site-header,body.focus-mode .intro,body.focus-mode .settings-panel,body.focus-mode .content-section,body.focus-mode footer{display:none}body.focus-mode .breathing-main{padding:0}body.focus-mode .breathing-main>.container{width:100%;max-width:none}body.focus-mode .breathing-shell{max-width:none;min-height:100vh;border:0;border-radius:0}body.focus-mode .breathing-grid{display:block}body.focus-mode .breathing-stage{min-height:100vh}
@media(max-width:900px){.breathing-grid{grid-template-columns:1fr}.breathing-stage{min-height:660px}.settings-panel{border-top:1px solid var(--border);border-left:0}.phase-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.breathing-main{padding:38px 0 55px}.intro{margin-bottom:24px}.breathing-shell{border-radius:24px}.breathing-stage{min-height:590px;padding:38px 15px}.stage-top{top:17px;right:17px;left:17px}.square-scene{width:min(390px,90vw);margin-top:5px}.breath-square{inset:17%}.label-left{left:-53px}.label-right{right:-60px}.phase-count{font-size:clamp(4.5rem,24vw,6.2rem)}.settings-panel{padding:26px 19px}.main-control{min-width:158px}.session-progress{right:20px;bottom:18px;left:20px}.content-section{padding:54px 0}.phase-grid,.steps,.try-grid{grid-template-columns:1fr}.try-head{align-items:flex-start;flex-direction:column}.phase-card{padding:20px}.phase-card>span{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ambient-orb{transform:none!important}}