@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=DM+Sans:wght@400;500&display=swap');*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 0,#405c6555,transparent 65%),#0c242e;color:#e4eee7;font-family:'DM Sans',sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:23px 5%;gap:15px}header span{font-size:9px;letter-spacing:3px;color:#adc6c4}a{font-size:11px;color:#d6d9c6;text-decoration:none}button{font:inherit;color:#dce9e2;background:#23454d;border:1px solid #9bb7ae66;padding:11px 18px;border-radius:24px;cursor:pointer}button:hover{background:#345d65}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ebd4a9;outline-offset:5px}main{max-width:1210px;padding:0 25px;margin:auto}.intro{text-align:center;margin:28px 0}.eyebrow{font-size:9px;letter-spacing:3px;color:#bdcfc6}h1,h2,h3,.intro p{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400}h1{font-size:clamp(54px,6vw,78px);margin:9px 0}.intro p{font-size:25px;font-style:italic;color:#d7cdb3;margin:0}.tabs{display:flex;max-width:760px;margin:32px auto 25px;gap:12px}.tabs button{flex:1;border-radius:18px;padding:16px;font-family:'Cormorant Garamond',Georgia,serif;font-size:23px;background:#1b3b45}.tabs button span{color:#d9c8a5;margin-right:9px}.tabs small{display:block;font:9px/1.8 'DM Sans',sans-serif;color:#b2cac9;margin-top:6px}.tabs button[aria-pressed=true]{border-color:#dfcba4;background:linear-gradient(130deg,#4b655f,#2b4e53);box-shadow:0 0 23px #d3c59c10}.water-window{height:480px;isolation:isolate;position:relative;overflow:hidden;border-radius:150px 150px 25px 25px;border:1px solid #b2b9a477;box-shadow:0 24px 70px #020e1966;background:#365f70}canvas{width:100%;height:100%;display:block}.window-title{position:absolute;top:40px;width:100%;text-align:center;pointer-events:none;text-shadow:0 2px 20px #092c3c88}.window-title .eyebrow{color:#e1e6d4}.window-title h2{font-size:35px;margin:13px;color:#f0e4cb}.scene-bottom{position:absolute;bottom:20px;left:25px;right:25px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#e0e7da;text-shadow:0 1px 9px #082c33}.scene-bottom span:last-child{letter-spacing:2px;font-size:8px}#surface{position:absolute;inset:0;border:0;background:transparent;border-radius:150px 150px 25px 25px;cursor:crosshair;padding:0}#surface:focus-visible{outline-offset:-8px}.controls{display:grid;grid-template-columns:1.35fr .9fr;gap:22px;margin-top:24px}.controls>div{border:1px solid #8aa7a14d;border-radius:20px;padding:28px;background:linear-gradient(140deg,#23464d99,#17333d99)}.control-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}h3{font-size:28px;margin:9px 0}.control-heading button{font-size:11px;white-space:nowrap}.controls p{font-size:11px;line-height:1.9;color:#b9ceca}.controls small{display:block;font-size:9px;line-height:1.9;color:#a6bfbc;margin-top:17px}.sliders{display:grid;gap:17px;margin:25px 0}.sliders label{display:grid;grid-template-columns:105px 1fr 34px;gap:12px;align-items:center;font-size:10px;color:#d5dfd5}input[type=range]{width:100%;accent-color:#d5c7a4;cursor:pointer}output{text-align:right;color:#b7ceca}.breath-controls button,.still-controls button{font-size:11px;margin-top:10px}#breath{position:absolute;top:50%;left:50%;transform:translate(-50%,-35%);text-align:center;pointer-events:none}.breath-orb{width:105px;height:105px;border:1px solid #fff3cfaa;border-radius:50%;background:radial-gradient(circle,#e9e7cf55,#dce6d51a 65%,transparent);box-shadow:0 0 60px #f2e2ae44;transform:scale(.72)}#breath-label{display:block;margin-top:30px;white-space:nowrap;font:italic 22px Georgia;color:#f4e7c9;text-shadow:0 2px 15px #123f4b}footer{text-align:center;font-size:10px;line-height:1.9;color:#98b5b8;margin:32px auto 40px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}@media(max-width:700px){main{padding:0 15px}header{padding:20px}header span{display:none}.intro{margin-top:18px}.tabs{gap:8px}.tabs button{padding:14px 7px;font-size:21px}.tabs button span{display:block;margin:0}.tabs small{font-size:8px}.water-window{height:420px;border-radius:90px 90px 20px 20px}.window-title{top:30px}.window-title h2{font-size:28px}.controls{grid-template-columns:1fr}.controls>div{padding:23px}.scene-bottom{left:18px;right:18px;font-size:9px}.sliders label{grid-template-columns:95px 1fr 30px}.control-heading{flex-wrap:wrap}}