:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#f5f1e8;color:#2e3028;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:850px;margin:auto;padding-left:28px;padding-right:28px}header{display:flex;justify-content:space-between;align-items:center;height:100px}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}.brand{font-size:32px;letter-spacing:-2px;font-weight:750}.brand span{font-size:13px;color:#d5653e;margin-left:3px}header>a:last-child{font-size:12px;color:#77786c}main{padding-top:40px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:#888674;font-weight:650}h1{font-size:clamp(58px,9vw,88px);font-weight:480;line-height:1;letter-spacing:-4px;margin:26px 0}h1 em{font-family:Georgia,serif;font-weight:400;color:#c7633e}.intro{font-size:13px;line-height:1.9;color:#858273}.instrument{background:#fffdf6;border:1px solid #dfdfd1;border-radius:20px;margin-top:36px;padding:25px 32px 18px;box-shadow:0 18px 45px #443b2505}.top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.1px;color:#989481;gap:20px}.top span:first-child{color:#b4714a}.tempo{display:flex;justify-content:center;align-items:center;gap:38px;margin:32px 0 22px}.tempo>div{text-align:center;min-width:180px}.tempo output{display:block;font-size:100px;font-weight:400;line-height:1.05;letter-spacing:-5px;font-variant-numeric:tabular-nums}.tempo>div>span{font-size:8px;letter-spacing:1.8px;color:#a29b87}.tempo button{border:1px solid #e5e1d4;border-radius:50%;background:transparent;width:39px;height:39px;font-size:22px;color:#8c826d}button{cursor:pointer;font:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d58563;outline-offset:4px}#tempo{display:block;width:80%;margin:0 auto;accent-color:#c7633e;cursor:pointer}.beats{display:flex;justify-content:center;gap:17px;margin:33px 0 28px;min-height:18px}.beat{width:15px;height:15px;background:#e9e5d8;border-radius:50%;transition:background .06s,transform .06s}.beat.active{background:#d17a55;transform:scale(1.2)}.beat:first-child.active{background:#6e7755}.controls{display:flex;gap:12px}.primary{background:#c7633e;color:white;flex:1;padding:16px 20px;border:0;border-radius:9px;display:flex;justify-content:space-between;font-size:12px}.primary:hover{background:#b95533}.primary:disabled{opacity:.6;cursor:wait}.secondary{background:transparent;border:1px solid #ded9c8;color:#847a64;border-radius:9px;padding:12px 20px;font-size:12px}.settings{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:22px;padding-top:19px;border-top:1px solid #ede8dc}.settings label{font-size:10px;color:#8c836e;display:flex;align-items:center;gap:10px}select{font:inherit;background:#f6f2e7;color:#756b53;border:0;border-radius:5px;padding:7px}.settings p{font-size:9px;line-height:1.7;color:#a09985;text-align:right;margin:0}.support{font-size:10px;color:#ab6a48;line-height:1.7;min-height:2px;margin:9px 0 0}.below{display:grid;grid-template-columns:1fr 1.5fr;gap:8px 45px;padding:38px 0 60px}.below h2{font-weight:480;font-size:25px;letter-spacing:-.7px;margin:6px 0}.below p{font-size:12px;color:#8a826e;line-height:1.9;margin:5px 0}.below .small{grid-column:2;font-size:10px;color:#a69d87}footer{border-top:1px solid #dfdccd;padding-top:24px;padding-bottom:32px;display:flex;justify-content:space-between;font-size:10px;color:#9a927f}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.about{max-width:730px;padding-top:40px;padding-bottom:90px}.about h1{font-size:58px}.about h2{font-weight:500;font-size:25px;margin-top:35px}.about p{font-size:14px;line-height:1.9;color:#827966}@media(max-width:520px){main{padding-top:25px}header{height:80px}.instrument{padding:22px 20px}.top{font-size:7px;letter-spacing:.7px}.tempo{gap:14px}.tempo>div{min-width:150px}.tempo output{font-size:85px}.secondary{padding:12px}.settings{align-items:flex-start;flex-direction:column;gap:13px}.settings p{text-align:left}.below{display:block;padding-bottom:35px}.below h2{margin-bottom:13px}.below .small{margin-top:15px}footer{gap:20px}}
