@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@600;700;800&family=Playfair+Display:ital,wght@0,700;1,700&display=swap";:root{--ink:#17213c;--paper:#e8fbff;--orange:#ff5c39;--purple:#8268ff;--line:#c7d5da}*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:var(--paper);color:var(--ink);margin:0;font-family:Manrope,Arial,sans-serif;transition:background .45s}.noise-calm:before,.noise-warm:before{content:"";z-index:-1;background:radial-gradient(circle at 91% 6%,#ffe641 0 6%,#0000 23%),radial-gradient(circle at 4% 78%,#8aeaff 0 8%,#0000 26%);position:fixed;inset:0}.noise-warm{--paper:#fff0a8}.noise-warm:before{background:radial-gradient(circle at 90% 7%,#ffaf33 0 8%,#0000 23%),radial-gradient(circle at 4% 76%,#ffe06b 0 8%,#0000 26%)}main{max-width:1080px;min-height:100vh;margin:auto;padding:0 28px 50px}.topbar{border-bottom:2px solid var(--ink);justify-content:space-between;align-items:center;height:78px;display:flex}.brand{letter-spacing:-.07em;font-size:24px;font-weight:800}.brand-dot{color:var(--orange);vertical-align:-2px;font-size:29px}.listen-status{letter-spacing:.08em;text-transform:uppercase;color:#42516f;font:500 11px DM Mono}.simple-screen{grid-template-columns:1fr minmax(330px,430px);align-items:center;gap:80px;min-height:calc(100vh - 128px);padding-block:54px;display:grid}.simple-copy h1{letter-spacing:-.09em;text-shadow:5px 5px #ffcf39;margin:0;font-size:clamp(64px,9vw,112px);line-height:.88}.simple-copy h1 em{color:#755bf7;font-family:Playfair Display,serif}.simple-copy p{color:#40506b;max-width:380px;margin:27px 0 0;font-size:17px;line-height:1.6}.sound-panel{border:3px solid var(--ink);box-shadow:10px 10px 0 var(--purple);background:#fff;border-radius:22px;padding:28px}.meter-label{letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;align-items:baseline;font:500 11px DM Mono;display:flex}.meter-label strong{letter-spacing:-.07em;color:#199d73;font:800 31px Manrope}.meter-label .red{color:#e62928}.meter-label small{letter-spacing:0;color:#59677d;font:11px DM Mono}.meter{border:3px solid var(--ink);background:linear-gradient(to top,#7cf2bd 0%,#7cf2bd var(--limit),#ffbd83 var(--limit),#ffbd83 100%);border-radius:24px;width:250px;height:390px;margin:31px auto 17px;position:relative;overflow:visible;box-shadow:7px 7px #bad0ff}.meter-glow,.quiet-zone{border-radius:20px;position:absolute;inset:0}.meter-glow{z-index:3;pointer-events:none;background:linear-gradient(90deg,#ffffff80,#0000 30%,#ffffff29)}.quiet-zone{background:repeating-linear-gradient(0deg,#0000 0 calc(10% - 1px),#17213c29 calc(10% - 1px) 10%)}.threshold{z-index:5;left:-14px;right:-14px;bottom:var(--limit);border-bottom:4px dashed var(--orange);position:absolute}.threshold b{white-space:nowrap;background:var(--orange);color:#fff;border-radius:5px;padding:5px 7px;font:500 10px DM Mono;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.needle{z-index:4;height:var(--level);opacity:.92;background:#277cc0;border-radius:16px 16px 0 0;transition:height .12s,background .2s;position:absolute;bottom:0;left:12px;right:12px}.needle span{background:var(--ink);color:#fff;border:2px solid #fff;border-radius:7px;padding:7px 12px;font:500 19px DM Mono;position:absolute;top:-20px;left:50%;transform:translate(-50%);box-shadow:3px 3px #17213c38}.danger .needle{background:#ef2836;animation:.45s infinite alternate meter-pulse}.scale{text-transform:uppercase;color:#52617a;justify-content:space-between;font:10px DM Mono;display:flex}.scale span{align-items:center;gap:5px;display:flex}.scale span:before{content:"";border-top:2px solid;width:10px}.control{border:2px solid var(--ink);background:#eaf7ff;border-radius:9px;margin-top:27px;padding:15px 16px}.control label{justify-content:space-between;font-size:13px;font-weight:800;display:flex}.control label b{color:#3b62d5;font-family:DM Mono}.control input{accent-color:#7658f7;cursor:pointer;width:100%;height:28px;margin-top:6px}.primary{border:2px solid var(--ink);background:var(--purple);width:100%;min-height:55px;box-shadow:4px 4px 0 var(--ink);color:#fff;cursor:pointer;border-radius:7px;margin-top:17px;font:800 15px Manrope;transition:transform .15s,background .2s}.primary:hover{transform:translate(-2px,-2px)}.primary.active{background:#0f9c70}.angry-mode{--paper:#ff303b;--ink:#fff7df;--orange:#ffe742;--purple:#72122e;animation:.22s ease-in-out 2 shake}.angry-mode:before{content:"";z-index:-1;background:radial-gradient(circle at 20% 0,#ffed36 0 5%,#0000 22%),repeating-linear-gradient(-45deg,#64000026 0 15px,#0000 15px 30px);position:fixed;inset:0}.angry-mode .topbar{border-color:#fff7df}.angry-mode .simple-copy h1{color:#fff7df;text-shadow:5px 5px #881228}.angry-mode .simple-copy h1 em{color:#ffe742}.angry-mode .simple-copy p,.angry-mode .listen-status{color:#fff7df}.angry-mode .sound-panel{color:#fff7df;background:#8e1832;border-color:#fff7df;box-shadow:10px 10px #ffed36}.angry-mode .meter{background:linear-gradient(to top,#e95b54 0%,#e95b54 var(--limit),#ffed36 var(--limit),#ffed36 100%);border-color:#fff7df;box-shadow:7px 7px #ffed36}.angry-mode .meter-label strong{color:#ffed36}.angry-mode .threshold{border-color:#fff7df}.angry-mode .threshold b{color:#8e1832;background:#fff7df}.angry-mode .needle{background:#ffed36}.angry-mode .needle span{background:#8e1832;border-color:#ffed36}.angry-mode .control{background:#b51f3e;border-color:#fff7df}.angry-mode .control label b{color:#ffed36}.angry-mode .primary{color:#7a122b;background:#ffed36;border-color:#fff7df;box-shadow:4px 4px #fff7df}.pause-overlay{z-index:100;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:radial-gradient(circle at 50% 12%,#ffef47 0 9%,#0000 30%),repeating-linear-gradient(-45deg,#5300132e 0 18px,#0000 18px 36px),#a80e2ff0;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.pause-card{text-align:center;color:#65132c;background:#fff7dd;border:5px solid #65132c;border-radius:24px;width:min(580px,100%);padding:34px 38px 31px;animation:.28s cubic-bezier(.2,.9,.25,1.25) pause-pop;box-shadow:12px 12px #ffdf36}.pause-face{filter:drop-shadow(4px 5px #ffcf33);margin-bottom:10px;font-size:74px;line-height:1}.pause-kicker{letter-spacing:.16em;color:#d62531;font:700 12px DM Mono}.pause-card h2{letter-spacing:-.07em;text-transform:uppercase;margin:10px 0 14px;font-size:clamp(43px,7vw,72px);line-height:.88}.pause-card p{color:#7e3447;max-width:430px;margin:0 auto;font-size:16px;line-height:1.5}.pause-count{background:#ffdf36;border:4px solid #65132c;border-radius:50%;place-items:center;width:108px;height:108px;margin:21px auto 7px;font-size:55px;font-weight:800;line-height:1;display:grid;box-shadow:5px 5px #65132c}.pause-card>strong{text-transform:uppercase;letter-spacing:.08em;font:700 12px DM Mono;display:block}.breaths{justify-content:center;gap:9px;margin-top:20px;display:flex}.breaths i{background:#e43b45;border-radius:50%;width:17px;height:17px;animation:1.8s ease-in-out infinite breathe}.breaths i:nth-child(2){animation-delay:.3s}.breaths i:nth-child(3){animation-delay:.6s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}@keyframes meter-pulse{0%{filter:brightness()}to{filter:brightness(1.35)}}@keyframes pause-pop{0%{opacity:0;transform:scale(.82)rotate(-2deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes breathe{0%,to{opacity:.45;transform:scale(.65)}50%{opacity:1;transform:scale(1.25)}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media (width<=750px){main{padding:0 16px calc(28px + env(safe-area-inset-bottom))}.topbar{height:66px}.listen-status{font-size:9px}.simple-screen{min-height:0;padding-block:44px;display:block}.simple-copy h1{text-shadow:3px 3px #ffcf39;font-size:clamp(57px,18vw,82px)}.simple-copy p{margin-top:21px;font-size:15px}.sound-panel{box-shadow:6px 6px 0 var(--purple);margin-top:35px;padding:20px 16px 19px}.meter{width:min(100%,230px);height:355px;margin-top:25px}.scale{font-size:8px}.control{margin-top:22px}.primary{min-height:54px}.pause-overlay{padding:16px;padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(16px + env(safe-area-inset-bottom))}.pause-card{border-width:4px;border-radius:20px;padding:25px 18px 23px;box-shadow:7px 7px #ffdf36}.pause-face{font-size:58px}.pause-kicker{font-size:10px}.pause-card h2{font-size:clamp(38px,12vw,54px)}.pause-card p{font-size:14px}.pause-count{width:90px;height:90px;margin-top:17px;font-size:45px}.breaths{margin-top:15px}}@media (height<=640px){.pause-card{padding-block:18px}.pause-face{margin-bottom:4px;font-size:45px}.pause-card h2{margin-block:7px;font-size:38px}.pause-card p{font-size:12px}.pause-count{width:70px;height:70px;margin-top:10px;font-size:36px}.breaths{margin-top:9px}}