:root{color-scheme:dark;font-family:DM Sans,sans-serif;color:#ecf0e9;background:#121a18;font-synthesis:none}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;min-width:320px;min-height:100svh;overflow-x:hidden;background:radial-gradient(circle at 50% 40%,rgba(67,94,80,.17),transparent 40%),linear-gradient(155deg,#16201d,#101715 55%,#0d1312)}body:before{position:fixed;inset:0;pointer-events:none;content:"";opacity:.15;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.app-shell{position:relative;z-index:1;display:grid;grid-template-rows:auto 1fr auto;min-height:100svh;width:min(100%,520px);margin:0 auto;padding:calc(20px + env(safe-area-inset-top)) 24px calc(22px + env(safe-area-inset-bottom))}.topbar{display:flex;align-items:center;justify-content:space-between}.top-actions{display:flex;align-items:center;gap:8px}.brand{display:flex;gap:10px;align-items:center;color:#f1f2ed;text-decoration:none;font:600 18px/1 Manrope,sans-serif;letter-spacing:-.5px}.brand-mark{display:flex;gap:2px;align-items:end;height:18px}.brand-mark i{display:block;width:3px;border-radius:3px;background:#b8c9bb}.brand-mark i:nth-child(1){height:8px}.brand-mark i:nth-child(2){height:16px}.brand-mark i:nth-child(3){height:12px}.info-button,.close-button{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(221,229,219,.14);border-radius:50%;color:#b9c1b8;background:#ffffff06;cursor:pointer}.info-button{font:500 15px Georgia,serif}.install-button{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid rgba(221,229,219,.14);border-radius:18px;color:#aebcb1;background:#ffffff09;font-size:11px;cursor:pointer}.install-button svg{width:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.player{align-self:center;display:flex;flex-direction:column;align-items:center;text-align:center;padding:44px 0 36px}.eyebrow{display:flex;align-items:center;gap:8px;color:#809189;text-transform:uppercase;letter-spacing:2.4px;font-size:10px;font-weight:600}.eyebrow span,.continuous-pill span{width:5px;height:5px;border-radius:50%;background:#9fb6a3;box-shadow:0 0 12px #9fb6a3}h1{margin:12px 0 6px;font:500 clamp(36px,11vw,50px)/1.1 "Manrope",sans-serif;letter-spacing:-2.4px}.subtitle{margin:0;color:#8d9992;font-size:14px}.sound-orbit{position:relative;display:grid;place-items:center;width:250px;height:250px;margin:22px 0 8px}.orbit-line{position:absolute;inset:18px;border:1px solid rgba(169,190,174,.1);border-radius:48% 52% 49% 51%;transition:border-color .8s ease}.orbit-line-two{inset:4px;opacity:.45;transform:rotate(28deg)}.active .orbit-line-one{animation:drift-one 9s linear infinite;border-color:#a9beae30}.active .orbit-line-two{animation:drift-two 13s linear infinite;border-color:#a9beae21}.play-button{position:relative;display:grid;place-items:center;width:136px;height:136px;border:1px solid rgba(211,224,210,.22);border-radius:50%;color:#18211e;background:linear-gradient(145deg,#c4d0c2,#91a592);box-shadow:0 20px 60px #00000047,inset 0 1px #ffffff59;cursor:pointer;transition:transform .2s ease,box-shadow .7s ease}.play-button:active{transform:scale(.96)}.play-button:focus-visible,input:focus-visible,.profile-options button:focus-visible,.install-button:focus-visible,.info-button:focus-visible,.close-button:focus-visible{outline:2px solid #d4e2d3;outline-offset:4px}.play-icon{width:0;height:0;margin-left:7px;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:18px solid currentColor}.pause-icon{display:none;gap:7px}.pause-icon i{width:5px;height:25px;border-radius:4px;background:currentColor}.is-playing .play-icon{display:none}.is-playing .pause-icon{display:flex}.is-playing .play-button{box-shadow:0 20px 75px #8ead942b,0 0 50px #8ead9414,inset 0 1px #ffffff59}.status{min-height:20px;color:#a5b1a8;font-size:12px;letter-spacing:.2px}.sound-controls{width:min(100%,330px);margin:20px 0 0;padding:0;border:0;text-align:left}.sound-controls legend{margin-bottom:9px;color:#838f88;font-size:11px}.profile-options{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:4px;border:1px solid rgba(205,220,204,.08);border-radius:12px;background:#ffffff05}.profile-options button{padding:9px 5px;border:0;border-radius:8px;color:#7e8b84;background:transparent;font-size:11px;cursor:pointer;transition:color .2s ease,background .2s ease}.profile-options button[aria-pressed=true]{color:#18211e;background:#a9b9a8;box-shadow:0 3px 10px #0004;font-weight:600}.tone-header{display:flex;justify-content:space-between;margin-top:14px}.tone-header label,.tone-header span{color:#838f88;font-size:11px}.tone-header span{color:#a7b4aa}.tone-row{display:flex;align-items:center;gap:10px;margin-top:9px}.tone-row>span{width:40px;color:#5f6c65;font-size:9px}.tone-row>span:last-child{text-align:right}.volume-control{width:min(100%,330px);margin-top:19px}.volume-control label,.volume-control>span{color:#838f88;font-size:11px}.volume-control label{float:left}.volume-control>span{float:right;font-variant-numeric:tabular-nums}.slider-row{clear:both;display:flex;gap:12px;align-items:center;padding-top:10px}.slider-row svg{width:15px;fill:#6f7c75}.slider-row .volume-high{width:18px}input[type=range]{--volume: 45%;flex:1;height:44px;margin:0;appearance:none;cursor:pointer;background:linear-gradient(to right,#aabbaa var(--volume),#35403b var(--volume)) center / 100% 3px no-repeat}input[type=range].tone-slider{--tone: 18%;background:linear-gradient(to right,#aabbaa var(--tone),#35403b var(--tone)) center / 100% 3px no-repeat}input[type=range]::-webkit-slider-thumb{width:22px;height:22px;appearance:none;border:0;border-radius:50%;background:#d7ded3;box-shadow:0 2px 7px #0008}input[type=range]::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;background:#d7ded3;box-shadow:0 2px 7px #0008}footer{display:flex;flex-direction:column;align-items:center;text-align:center}.continuous-pill{display:flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid rgba(205,220,204,.09);border-radius:30px;color:#8b9a91;background:#ffffff05;font-size:10px;letter-spacing:.3px}footer p{max-width:340px;margin:12px 0 0;color:#59665f;font-size:9px;line-height:1.5}dialog{width:min(calc(100% - 38px),420px);padding:28px;border:1px solid rgba(214,228,213,.13);border-radius:24px;color:#e6ebe3;background:#18221f;box-shadow:0 28px 80px #000a}dialog::backdrop{background:#040807b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.close-button{position:absolute;top:16px;right:16px;font-size:22px;font-weight:300}.dialog-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:#29362f}.dialog-icon span{width:18px;height:18px;border:1px solid #a9bca9;border-radius:50% 48% 52% 46%;transform:rotate(30deg)}dialog h2{margin:19px 0 10px;font:500 24px/1.2 Manrope,sans-serif;letter-spacing:-.8px}dialog p{color:#a0aca4;font-size:13px;line-height:1.65}dialog .dialog-note{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);color:#74817a;font-size:11px}.install-app-icon{width:58px;height:58px;border-radius:14px;box-shadow:0 8px 24px #0005}.install-steps{display:grid;gap:10px;margin-top:18px}.install-steps p{display:flex;align-items:center;gap:11px;margin:0}.install-steps span{display:grid;flex:0 0 26px;place-items:center;width:26px;height:26px;border-radius:50%;color:#c7d2c5;background:#29362f;font-size:11px;font-weight:600}.install-steps strong{color:#d7ded5;font-weight:500}@keyframes drift-one{to{transform:rotate(360deg)}}@keyframes drift-two{0%{transform:rotate(28deg)}to{transform:rotate(-332deg)}}@media(max-height:690px){.player{padding:18px 0 14px}.sound-orbit{width:168px;height:168px;margin:8px 0 0}.play-button{width:96px;height:96px}.sound-controls{margin-top:10px}.tone-header{margin-top:9px}.volume-control{margin-top:10px}footer p{display:none}}@media(prefers-reduced-motion:reduce){.active .orbit-line-one,.active .orbit-line-two{animation:none}}
