.listen-page{background:#14273f;color:white;color-scheme:dark;overflow:hidden}.listening-player{position:relative;isolation:isolate;width:100%;height:100svh;display:flex;flex-direction:column;overflow:hidden;background:#14273f}.listen-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.listening-player::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgb(3 15 30 / .55),rgb(3 15 30 / .23) 35%,rgb(3 15 30 / .18) 55%,rgb(3 15 30 / .7))}.listen-page .skip-link{color:var(--ink)}.listen-page a:focus-visible,.listen-page button:focus-visible,.listen-page summary:focus-visible{outline-color:white}.listen-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 30px;z-index:5}.listen-toolbar-right{display:flex;align-items:center;gap:12px}.glass-control{border:1px solid rgb(255 255 255 / .28);background:rgb(20 36 54 / .3);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:white;min-height:44px;border-radius:25px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:14px;line-height:1.5;transition:background .15s,transform .15s}.glass-control:hover{background:rgb(255 255 255 / .2)}#listen-breathing[aria-pressed=false]{background:rgb(20 36 54 / .45)}#listen-breathing[aria-pressed=true]{border-color:rgb(255 255 255 / .65);background:rgb(255 255 255 / .16)}.listen-home>svg,html[dir=rtl] .listen-step>svg{transform:scaleX(-1)}html[dir=ltr] .listen-home>svg{transform:none}.listen-page .language-menu>summary{border:1px solid rgb(255 255 255 / .28);background:rgb(20 36 54 / .3);backdrop-filter:blur(18px);border-radius:25px;padding-inline:14px;color:white}.listen-page .language-menu nav a:focus-visible{outline-color:var(--blue)}.listen-page .language-menu[open]>summary{background:rgb(255 255 255 / .2)}
.listen-stage{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding-inline:60px}.listen-scene-copy{margin-top:14px;max-width:680px;text-shadow:0 2px 8px rgb(0 0 0 / .65)}.listen-scene-copy h1{font-size:clamp(34px,4.1vw,55px);line-height:1.3;letter-spacing:0}.listen-scene-copy #listen-place{font-size:16px;margin-top:12px;line-height:1.7}.listen-scene-copy #listen-description{font-size:16px;margin-top:14px;line-height:1.8}.listen-center{position:absolute;left:50%;top:61%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.listen-orb{--breath-scale:1;width:clamp(175px,24vw,290px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;border-radius:50%;border:1px solid rgb(255 255 255 / .7);background:radial-gradient(circle at 35% 30%,rgb(255 255 255 / .15),rgb(255 255 255 / .025));box-shadow:0 0 0 24px rgb(255 255 255 / .035),0 0 0 48px rgb(255 255 255 / .025);text-shadow:0 2px 6px rgb(0 0 0 / .45)}.listen-orb #breathing-phase{font-family:var(--title);font-size:32px;line-height:1.4}.listen-orb #listen-clock{font-size:24px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.04em}.listening-player[data-breathing=false] .listen-orb{border-color:transparent;background:transparent;box-shadow:none}.listening-player[data-breathing=false] #breathing-phase{display:none}.listening-player[data-breathing=false] #listen-clock{font-size:50px}
.listen-step{position:absolute;top:48%;border:1px solid rgb(255 255 255 / .3);border-radius:50%;width:44px;height:44px;background:rgb(20 36 54 / .2);backdrop-filter:blur(12px);color:white;display:flex;align-items:center;justify-content:center}.listen-step.previous{inset-inline-start:30px}.listen-step.next{inset-inline-end:30px}.listen-step:hover{background:rgb(255 255 255 / .2)}.listen-bottom{padding:0 28px max(24px,env(safe-area-inset-bottom));width:100%;display:flex;align-items:center;flex-direction:column;gap:12px;z-index:1}.listen-play{border:1px solid rgb(255 255 255 / .38);display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:17px 25px;border-radius:38px;width:min(440px,100%);min-height:62px;background:rgb(238 244 255 / .23);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:white;font-size:16px;font-weight:500;line-height:1.5;transition:background .15s,transform .15s}.listen-play:hover{background:rgb(238 244 255 / .35)}.listen-play svg{width:18px;height:18px}.listen-bottom #listen-feedback{font-size:14px;line-height:1.7;text-align:center}.listen-bottom #listen-feedback:empty{display:none}.demo-download{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;font-size:15px;text-underline-offset:5px}.demo-download:hover{text-decoration:underline}
.listen-dialog{color:var(--ink);color-scheme:light;background:#edf3ff;border:1px solid rgb(255 255 255 / .7);border-radius:28px;padding:28px;width:min(700px,calc(100vw - 40px));max-height:calc(100svh - 48px);overflow:auto;overscroll-behavior:contain;box-shadow:0 15px 80px rgb(0 0 0 / .3)}.listen-dialog::backdrop{background:rgb(4 15 29 / .5);backdrop-filter:blur(10px)}.listen-dialog button:focus-visible,.listen-dialog a:focus-visible{outline-color:var(--blue)}.listen-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}.listen-dialog-heading h2{font-size:30px}.listen-dialog-heading>button,.result-close{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:white;border:0;border-radius:50%;color:var(--muted)}.listen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.listen-card{background:white;border-radius:20px;overflow:hidden;min-width:0}.listen-card>button{display:block;width:100%;padding:0;border:0;background:white;color:var(--ink);text-align:start}.listen-card>button:focus-visible{outline-offset:-3px}.listen-card>button[aria-pressed=true]{box-shadow:inset 0 -3px var(--blue)}.listen-card>button>img{width:100%;aspect-ratio:2;object-fit:cover;outline:1px solid rgb(0 0 0 / .1)}.listen-card-body{display:block;padding:16px 17px}.listen-card-name{display:block;font-family:var(--title);font-size:25px;line-height:1.4}.listen-card-place{display:block;font-size:14px;color:var(--muted);line-height:1.7;margin-top:7px}.listen-card>a{display:flex;align-items:center;justify-content:space-between;min-height:44px;font-size:14px;color:var(--blue);padding:11px 17px;border-top:1px solid var(--line)}.demo-complete{position:relative;width:min(490px,calc(100vw - 40px));text-align:center;padding:36px}.result-close{position:absolute;top:15px;inset-inline-end:15px}.demo-complete>img{border-radius:18px;margin:0 auto 24px;outline:1px solid rgb(0 0 0 / .1)}.demo-complete h2{font-size:31px;line-height:1.4}.demo-complete>p:not(.purchase-note){font-size:16px;line-height:1.8;color:var(--muted);margin-top:18px}.demo-complete>.button{width:100%;margin-top:26px}.demo-complete>.purchase-note{font-size:13px}.demo-replay{display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--blue);font-size:15px;min-height:44px;margin-top:15px}.listen-native audio{width:100%;margin-block:12px}.listen-native p,.listen-native nav{font-size:14px;line-height:1.8}
@media(prefers-reduced-motion:no-preference){.listen-orb{transform:scale(var(--breath-scale,1))}}
@media(max-height:760px) and (min-width:761px){.listen-toolbar{padding-block:16px}.listen-scene-copy{margin-top:4px}.listen-scene-copy h1{font-size:37px}.listen-scene-copy #listen-place,.listen-scene-copy #listen-description{margin-top:10px;font-size:15px}.listen-center{top:65%}.listen-orb{width:185px;gap:18px}.listen-orb #breathing-phase{font-size:27px}.listen-orb #listen-clock{font-size:22px}.listen-bottom{gap:9px;padding-bottom:16px}.listen-play{min-height:56px}}
@media(max-width:760px){.listen-toolbar{padding:16px;gap:10px}.listen-toolbar-right{gap:8px}.glass-control{min-height:42px;padding:10px;font-size:14px}.listen-home>span,.listen-toolbar-right>button>span,.listen-page .language-menu>summary>span{display:none}.listen-page .language-menu>summary{padding:10px;min-width:42px;min-height:42px}.listen-stage{padding-inline:30px}.listen-scene-copy{margin-top:18px}.listen-scene-copy h1{font-size:36px}.listen-scene-copy #listen-place{font-size:14px;margin-top:12px}.listen-scene-copy #listen-description{font-size:15px;margin-top:14px;max-width:320px}.listen-center{top:62%}.listen-orb{width:min(215px,54vw);gap:20px;box-shadow:0 0 0 19px rgb(255 255 255 / .035),0 0 0 38px rgb(255 255 255 / .025)}.listen-orb #breathing-phase{font-size:28px}.listen-orb #listen-clock{font-size:24px}.listen-step{width:36px;height:36px}.listen-step.previous{inset-inline-start:10px}.listen-step.next{inset-inline-end:10px}.listen-step svg{width:18px;height:18px}.listen-bottom{padding-inline:22px;padding-bottom:max(16px,env(safe-area-inset-bottom));gap:10px}.listen-play{min-height:56px;max-width:360px;font-size:15px}.demo-download{font-size:14px}.listen-dialog{width:calc(100vw - 24px);padding:22px;border-radius:24px;max-height:calc(100svh - 30px)}.listen-grid{gap:12px}.listen-card{border-radius:16px}.listen-card-body{padding:13px}.listen-card-name{font-size:22px}.listen-card-place{font-size:13px}.listen-card>a{font-size:13px;padding:10px 13px}.demo-complete{padding:30px 24px}.demo-complete h2{font-size:28px}.demo-complete>p:not(.purchase-note){font-size:15px}html:lang(th) .listen-scene-copy h1,html:lang(ar) .listen-scene-copy h1{font-size:30px;line-height:1.5}html:lang(th) .listen-card-name,html:lang(ar) .listen-card-name{font-size:20px;line-height:1.5}}
@media(max-height:650px){.listen-scene-copy h1{font-size:30px}.listen-scene-copy #listen-description{display:none}.listen-center{top:64%}.listen-orb{width:145px}.listen-play{min-height:50px;padding-block:12px}.listen-bottom{padding-bottom:12px;gap:6px}}
@media(max-height:450px) and (min-width:600px){.listen-toolbar{padding:12px 20px}.listen-stage{padding-inline:30px}.listen-scene-copy{position:absolute;inset-inline-start:8%;top:18%;max-width:30%;text-align:start;margin:0}.listen-scene-copy h1{font-size:28px}.listen-center{left:63%;top:46%}.listen-orb{width:125px;gap:14px;box-shadow:0 0 0 12px rgb(255 255 255 / .035),0 0 0 24px rgb(255 255 255 / .025)}html[dir=rtl] .listen-center{left:37%}.listen-orb #breathing-phase{font-size:24px}.listen-bottom{gap:5px;padding-bottom:10px}.listen-play{max-width:310px;min-height:44px;padding-block:10px;font-size:14px}.demo-download{min-height:35px;font-size:14px}.listen-step.previous{inset-inline-start:13px}.listen-step.next{inset-inline-end:13px}}
@media(forced-colors:active){.glass-control,.listen-play,.listen-step{border:1px solid ButtonText}.listen-orb,.listen-dialog{border:1px solid CanvasText}}