:root{--main-color:#222;--nav-color:oklch(from var(--main-color) calc(l - .02) c h);--hover-nav-color:color-mix(in srgb, var(--nav-color), #fff 20%)}*{box-sizing:border-box;color:#fff;background:0 0;border:none;margin:0;padding:0}body{background-color:var(--main-color);width:100%;min-height:100vh}button,select,input{font:inherit}button{cursor:pointer}select,option{color:#111}.screen{background:radial-gradient(circle at top, #3b3b46 0, var(--main-color) 48%);flex-direction:column;gap:18px;min-height:100dvh;padding:24px 18px 104px;display:flex}.screen-header h1{font-size:clamp(2rem,8vw,4rem)}.eyebrow{color:#9ee8ff;letter-spacing:.16em;text-transform:uppercase;font-size:.85rem}.pendulum-card,.tuner-display,.pitch-history,.control-grid label,.offset-control{background:#ffffff12;border:1px solid #ffffff24;border-radius:24px;box-shadow:0 18px 45px #0000003d}.pendulum-card{padding:20px}.pendulum-stage{height:230px;position:relative;overflow:hidden}.pendulum-stage:before{content:"";background:#9ee8ff;border-radius:50%;width:18px;height:18px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.pendulum-rod{transform-origin:top;background:linear-gradient(#fff,#9ee8ff);border-radius:99px;width:6px;height:190px;transition:transform .12s ease-out;position:absolute;top:16px;left:calc(50% - 3px)}.pendulum-weight{background:#ffcf66;border-radius:50%;width:54px;height:54px;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.beat-dots{justify-content:center;gap:10px;display:flex}.beat-dots span{background:#ffffff47;border-radius:999px;width:12px;height:12px}.beat-dots span.active{background:#ffcf66;box-shadow:0 0 18px #ffcf66}.bpm-panel{grid-template-columns:repeat(2,1fr) minmax(112px,1.4fr) repeat(2,1fr);align-items:stretch;gap:8px;display:grid}.bpm-panel.compact{grid-template-columns:repeat(3,1fr)}.bpm-panel button,.primary-action{background:#405cff;border-radius:16px;min-height:54px;font-weight:700}.bpm-readout{flex-direction:column;justify-content:center;align-items:center;display:flex}.bpm-readout strong{font-size:3rem;line-height:.9}.wide-slider,.offset-control input{accent-color:#9ee8ff;width:100%}.control-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;display:grid}.control-grid label,.offset-control{gap:8px;padding:14px;display:grid}.control-grid select{background:#fff;border-radius:12px;padding:10px}.primary-action{color:#151515;background:linear-gradient(135deg,#ff7a59,#ffcf66);font-size:1.2rem}.tuner-display{text-align:center;padding:22px}.note-name{font-size:clamp(4rem,18vw,8rem);font-weight:900;line-height:1}.cent-meter{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:18px 0;display:grid}.cent-meter div{background:linear-gradient(90deg,#ff7a59,#9ee8ff 50%,#ff7a59);border-radius:99px;height:12px;position:relative}.cent-meter i{background:#fff;border-radius:99px;width:4px;height:28px;position:absolute;top:-8px;transform:translate(-50%)}.in-tune{color:#9effb7}.out-tune{color:#ffcf66}.pitch-history{background-image:linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-size:100% 28px,28px 100%;min-height:260px;position:relative;overflow:hidden}.pitch-history .center-line{background:#9ee8ffb3;width:3px;position:absolute;inset:0 auto 0 50%}.pitch-history span{background:#ffcf66;border-radius:50%;width:9px;height:9px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 12px #ffcf66}@media (width>=760px){.screen{max-width:760px;margin:0 auto}}main{width:100dvw;height:100dvh}#tab_nav{background-color:var(--nav-color);z-index:10;grid-template-columns:1fr 1fr 1fr;gap:10px;width:100dvw;height:80px;padding:5px;display:grid;position:fixed;bottom:0;left:0}#tab_nav button,#more_manu button{text-align:center;background:0 0;border:none;border-radius:10px;flex-direction:column;height:70px;padding:10px;display:flex}#tab_nav button:hover,#more_manu button:hover,#tab_nav button.active,#more_manu button.active{background-color:var(--hover-nav-color)}.nav_icon{color:#fff;height:calc(80px - 3em)}#more_manu{background-color:var(--nav-color);z-index:10;gap:10px;width:100svw;height:fit-content;padding:5px;position:fixed;bottom:80px;left:0}#more_manu div{grid-template-columns:1fr 1fr 1fr;display:grid}#more_manu div button{align-items:center}#overlay{z-index:5;background:0 0;position:fixed;inset:0}