:root{--ui-font: "Fredoka", "Trebuchet MS", sans-serif;--page-header-h: 72px;--page-header-font: clamp(18px, 5.7vw, 60px)}*,*:before,*:after{box-sizing:border-box}html{height:100%;overflow:hidden}body{margin:0;padding:0;height:100%;overflow:hidden}#app-nav{position:fixed;top:0;left:0;right:0;height:44px;background-color:olive;display:flex;align-items:center;padding:0 12px;gap:0;z-index:1000;box-shadow:0 2px 6px #0000004d}#app-nav .nav-tabs{display:flex;flex:1;justify-content:space-evenly}.site-title{font-family:Fascinate Inline,cursive;font-size:22px;color:#fff;letter-spacing:1.5px;margin-right:8px;padding-right:10px;border-right:1px solid rgba(255,255,255,.3);white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.3)}.nav-tab{font-family:var(--ui-font);font-size:15px;font-weight:500;color:#ffffffa6;background:transparent;border:none;border-bottom:3px solid transparent;padding:4px 9px 6px;cursor:pointer;letter-spacing:.5px;transition:color .15s,border-color .15s;line-height:1}.nav-tab:hover{color:#ffffffe6}.nav-tab.active{color:#fff;border-bottom-color:#fff}.app-container{position:fixed;inset:44px 0 0;overflow:hidden}.app-container.hidden,.app-gate{display:none}.app-container.locked>:not(.app-gate){display:none!important}.app-container.locked>.app-gate{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;padding:24px;overflow:auto}.app-gate-box{background:#987444;border-radius:18px;width:460px;max-width:92vw;padding:34px 30px 30px;text-align:center;box-shadow:0 20px 70px #0000008c;border:3px solid olive}.app-gate-lock{font-size:46px;line-height:1;margin-bottom:10px}.app-gate-title{font-family:var(--ui-font);font-size:26px;letter-spacing:2px;color:#fff;text-shadow:0 2px 5px rgba(0,0,0,.4);margin-bottom:12px}.app-gate-text{font-family:var(--ui-font);font-size:15px;line-height:1.6;color:#fff;margin:0 auto 22px;max-width:360px}.app-gate-text strong{color:#ffe9b0}.app-gate-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.app-gate-btn{font-family:var(--ui-font);font-size:15px;letter-spacing:.5px;padding:12px 22px;border-radius:10px;cursor:pointer;color:#fff;background:transparent;border:2px solid rgba(255,255,255,.65);transition:transform .08s ease,background .15s ease,color .15s ease}.app-gate-btn:hover{background:#ffffff24;border-color:#fff}.app-gate-btn:active{transform:translateY(2px)}.app-gate-btn.primary{color:olive;background:#f3ecd8;border-color:#f3ecd8;box-shadow:0 4px #00000047,0 5px 9px #0003}.app-gate-btn.primary:hover{background:#fff;border-color:#fff}.app-gate-btn.primary:active{transform:translateY(3px);box-shadow:0 1px #00000047,0 2px 4px #00000026}.site-modal{position:fixed;inset:0;z-index:2000;background:#000000b8;display:flex;align-items:center;justify-content:center}.site-modal.hidden{display:none}.site-modal-box{background:#987444;border-radius:18px;width:500px;max-width:92vw;box-shadow:0 20px 70px #000000a6;overflow:hidden}.site-modal-header{background:olive;padding:20px 28px;font-family:var(--ui-font);font-size:22px;color:#fff;text-align:center;letter-spacing:2px;text-shadow:0 2px 5px rgba(0,0,0,.4)}.site-modal-body{padding:22px 28px 6px}.site-modal-item{font-family:var(--ui-font);font-size:14px;color:#fff;line-height:1.55;margin-bottom:16px;padding-left:4px}.site-modal-item:last-child{margin-bottom:0}.site-modal-close{display:block;width:calc(100% - 56px);margin:20px 28px;padding:15px;background:olive;color:#fff;border:none;border-radius:10px;font-family:var(--ui-font);font-size:18px;letter-spacing:1px;cursor:pointer;box-shadow:0 5px #0000004d,0 6px 10px #0003;transition:transform .08s ease,box-shadow .08s ease}.site-modal-close:active{transform:translateY(4px);box-shadow:0 1px #0000004d,0 2px 4px #00000026}.nav-auth{margin-left:auto;display:flex;align-items:center;gap:8px;padding-left:6px}.nav-auth-btn{font-family:var(--ui-font);font-size:13px;letter-spacing:.5px;padding:7px 14px;border-radius:18px;white-space:nowrap;cursor:pointer;transition:transform .08s ease,background .15s ease,color .15s ease;color:#fff;background:transparent;border:1.5px solid rgba(255,255,255,.55)}.nav-auth-btn:hover{background:#ffffff1f;border-color:#fff}.nav-auth-btn.primary{color:olive;background:#f3ecd8;border:1.5px solid #f3ecd8;box-shadow:0 2px 5px #00000038}.nav-auth-btn.primary:hover{background:#fff;border-color:#fff}.nav-auth-btn:active{transform:translateY(1px)}.nav-user{font-family:var(--ui-font);font-size:13px;letter-spacing:.5px;color:#fff;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-auth .hidden{display:none}.auth-box{position:relative;width:400px}.auth-close{position:absolute;top:13px;right:16px;width:30px;height:30px;margin:0;padding:0;display:flex;align-items:center;justify-content:center;font-family:Arial,sans-serif;font-size:24px;line-height:1;color:#fff;background:transparent;border:none;border-radius:50%;box-shadow:none;cursor:pointer;opacity:.85}.auth-close:hover{background:#ffffff2e;opacity:1}.auth-close:active{transform:none;box-shadow:none}.auth-demo-note{margin:0;padding:14px 28px 0;text-align:center;font-family:Helvetica Neue,Arial,sans-serif;font-size:12px;line-height:1.4;color:#ffe9b0}.auth-form{padding:14px 28px 26px;display:flex;flex-direction:column;gap:15px}.auth-field{display:flex;flex-direction:column;gap:6px}.auth-field span{font-family:var(--ui-font);font-size:12px;letter-spacing:.5px;color:#fff;padding-left:2px}.auth-input{width:100%;padding:11px 13px;font-family:Helvetica Neue,Arial,sans-serif;font-size:15px;color:#3a2614;background:#efe7d2;border:2px solid #6f5326;border-radius:8px;box-shadow:inset 0 1px 3px #00000038}.auth-input::placeholder{color:#a8946e}.auth-input:focus{outline:none;border-color:olive;box-shadow:0 0 0 2px #80800066,inset 0 1px 3px #00000038}.auth-captcha{display:flex;justify-content:center;min-height:0}.auth-captcha:empty{display:none}.auth-or{display:flex;align-items:center;text-align:center;color:#ffffff80;font-family:Helvetica Neue,Arial,sans-serif;font-size:12px;letter-spacing:1px;text-transform:uppercase;margin:4px 0}.auth-or:before,.auth-or:after{content:"";flex:1;height:1px;background:#ffffff2e}.auth-or span{padding:0 10px}.auth-google{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;font-family:var(--ui-font);font-size:15px;color:#1f1f1f;background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:10px;cursor:pointer;box-shadow:0 4px #0000002e,0 5px 9px #00000026;transition:transform .08s ease,box-shadow .08s ease}.auth-google:active{transform:translateY(3px);box-shadow:0 1px #0000002e,0 2px 4px #0000001f}.auth-submit{margin-top:6px;padding:13px;font-family:var(--ui-font);font-size:16px;letter-spacing:1px;color:#fff;background:olive;border:none;border-radius:10px;cursor:pointer;box-shadow:0 4px #00000047,0 5px 9px #0003;transition:transform .08s ease,box-shadow .08s ease}.auth-submit:active{transform:translateY(3px);box-shadow:0 1px #00000047,0 2px 4px #00000026}.auth-msg{margin:0;min-height:18px;font-family:Helvetica Neue,Arial,sans-serif;font-size:13px;text-align:center;color:#ffe9b0}.auth-msg.error{color:#ffc1b0}.auth-switch{margin:2px 0 0;text-align:center;font-family:Helvetica Neue,Arial,sans-serif;font-size:13px;color:#ffffffd9}.auth-link{font-family:Helvetica Neue,Arial,sans-serif;font-size:13px;font-weight:700;color:#f3ecd8;background:none;border:none;padding:0;cursor:pointer;text-decoration:underline}.auth-link:hover{color:#fff}.privacy-fab{position:fixed;left:16px;bottom:16px;z-index:1900;padding:9px 16px;background:olive;color:#fff;border:none;border-radius:9px;font-family:var(--ui-font);font-size:13px;letter-spacing:1px;cursor:pointer;opacity:.9;box-shadow:0 4px #0000004d,0 5px 9px #00000040;transition:transform .08s ease,box-shadow .08s ease,opacity .12s ease}.privacy-fab:hover{opacity:1}.privacy-fab:active{transform:translateY(3px);box-shadow:0 1px #0000004d,0 2px 4px #00000026}.privacy-box{width:640px;display:flex;flex-direction:column;max-height:88vh}.privacy-body{overflow-y:auto;padding:22px 28px 8px;font-family:var(--ui-font);color:#fff;line-height:1.6;font-size:14px}.privacy-body h3{font-family:var(--ui-font);font-size:15px;letter-spacing:1px;margin:20px 0 6px;color:#fff}.privacy-body p{margin:0 0 12px}.privacy-body ul{margin:0 0 12px;padding-left:20px}.privacy-body li{margin-bottom:8px}.privacy-body .privacy-meta{font-size:12px;opacity:.8;font-style:italic;margin-bottom:16px}.privacy-body strong{color:#fff}.auth-consent{font-family:Segoe UI,system-ui,-apple-system,Helvetica,Arial,sans-serif;font-size:12px;line-height:1.5;color:#fff;opacity:.9;text-align:center;margin:12px 0 0}.ml-app{background-color:#e3d1b8;filter:sepia(20%)}.ml-app .whole-guitar{height:75vh;height:100%;transform:scale(.95);transform-origin:top center;position:relative;padding-top:42px}.ml-app .headstock-triangle{position:absolute;width:190px;height:0;left:50%;right:50%;border-left:20px solid transparent;border-right:20px solid transparent;border-top:24px solid rgb(82,56,28);transform:translate(-50%,-100%)}.ml-app .headstock-rectangle{position:absolute;width:190px;height:90px;left:50%;right:50%;transform:translate(-50%,-111.1%);border-radius:8px 8px 3px 3px;background:radial-gradient(ellipse 60% 45% at 50% 18%,rgba(120,84,44,.4) 0%,transparent 70%),linear-gradient(160deg,#3c2614,#281a0d 45%,#341f0f);box-shadow:2px 1px 8px #0009,inset 0 1px #966e3c4d}.ml-app .guitar-body{position:absolute;left:50%;right:50%;width:550px;height:200px;top:660px;transform:translate(-50%,-35%);border-top-left-radius:150px;border-top-right-radius:150px;background:radial-gradient(ellipse 72% 62% at 50% 10%,rgba(247,218,146,.85) 0%,transparent 60%),radial-gradient(ellipse 105% 85% at 50% 108%,rgba(78,50,18,.55) 0%,transparent 62%),repeating-linear-gradient(0deg,rgba(0,0,0,.022) 0px,rgba(0,0,0,.022) 1px,transparent 1px,transparent 9px),radial-gradient(ellipse 95% 95% at 46% 26%,#e6c07b,#cea35c 48%,#a87d40);box-shadow:2px 3px 12px #00000080,inset 0 0 0 4px #f1e5c6a6,inset 0 0 0 6px #78582c73}.ml-app .guitar-body:after{content:"";position:absolute;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 42% 38%,#241406eb 55%,#0e0702fa);top:64%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 4px #785226eb,0 0 0 6px #cea864d9,0 0 0 9px #785226d9,inset 0 2px 10px #000000c7;z-index:2}.ml-app .guitar-body:before{content:"";position:absolute;width:60px;height:70px;top:116px;left:50%;transform:translate(26px) rotate(12deg);background:linear-gradient(135deg,#7e431f,#5a2f17,#3c1d0d);border-radius:62% 38% 52% 48%/64% 56% 44% 36%;box-shadow:inset 0 1px 2px #ffb4782e,0 1px 4px #0000004d;opacity:.92;z-index:2}.ml-app .body-detail{position:absolute;width:122px;height:22px;top:168px;left:50%;transform:translate(-50%);border-radius:6px/55%;background:linear-gradient(180deg,#3c2614,#251509 55%,#160c04);box-shadow:0 3px 6px #00000080,inset 0 1px #8c603073;z-index:3}.ml-app .body-detail:after{content:"";position:absolute;top:4px;left:16px;width:100px;height:4px;border-radius:2px;background:linear-gradient(180deg,#ece3c4,#c9bd97)}.ml-app .body-detail:before{content:"";position:absolute;top:13px;left:22px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 36% 30%,#fffef8,#d9d2bb);box-shadow:16px 0 #e8e1ca,32px 0 #e8e1ca,48px 0 #e8e1ca,64px 0 #e8e1ca,80px 0 #e8e1ca}.ml-app .fretboard{width:150px;height:650px;position:absolute;left:50%;right:50%;transform:translate(-50%);overflow:visible;background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0px,rgba(0,0,0,.07) 1px,transparent 1px,transparent 22px),repeating-linear-gradient(180deg,rgba(255,255,255,.03) 0px,rgba(255,255,255,.03) 2px,transparent 2px,transparent 30px),linear-gradient(to right,#52381c,#604424,#4e3418);box-shadow:2px 2px 8px #0009,inset 2px 0 4px #0003,inset -2px 0 4px #0003}.ml-app .fret-markers{position:absolute;width:22px;height:100%;left:154px;top:0;pointer-events:none}.ml-app .fret-num{position:absolute;font-family:Fascinate Inline,cursive;font-size:10px;color:#825f2dbf;line-height:15px;left:2px;filter:sepia(0%)!important}.ml-app .fret-num-3{top:141px}.ml-app .fret-num-5{top:256px}.ml-app .fret-num-7{top:353px}.ml-app .fret-num-9{top:433px}.ml-app .fret-num-12{top:523px}.ml-app .mute-btn{position:absolute;top:-42px;width:15px;text-align:center;font-size:22px;font-weight:900;color:#bbb;-webkit-text-stroke:1px #bbb;cursor:pointer;user-select:none;z-index:15}.ml-app .mute-btn[data-string="1"]{left:13px}.ml-app .mute-btn[data-string="2"]{left:35px}.ml-app .mute-btn[data-string="3"]{left:57px}.ml-app .mute-btn[data-string="4"]{left:79px}.ml-app .mute-btn[data-string="5"]{left:101px}.ml-app .mute-btn[data-string="6"]{left:123px}.ml-app .mute-btn.muted{color:red;-webkit-text-stroke:1px red}.ml-app .nut{position:absolute;background:linear-gradient(to bottom,#e8e5d2,#c8c4a6,#dedad0);height:10px;width:100%;box-shadow:0 1px 4px #00000059}.ml-app .strings{position:absolute;width:100%;height:100%}.ml-app .string{position:absolute;height:810px;transform:translateY(-100px)}.ml-app .string:nth-child(1){width:5px;left:18px;background:linear-gradient(to right,#909090,#d8d8d8 40%,silver 60%,#888);box-shadow:0 2px 5px #00000080}.ml-app .string:nth-child(2){width:4px;left:41px;background:linear-gradient(to right,#9a9a9a,#e0e0e0 40%,#c8c8c8 60%,#909090);box-shadow:0 2px 4px #0006}.ml-app .string:nth-child(3){width:3px;left:63px;background:linear-gradient(to right,#aaa,#e8e8e8 40%,#d0d0d0 60%,#999);box-shadow:0 2px 4px #00000059}.ml-app .string:nth-child(4){width:2px;left:86px;background:linear-gradient(to right,#bbb,#f0f0f0 50%,#aaa);box-shadow:0 1px 3px #0000004d}.ml-app .string:nth-child(5){width:2px;left:108px;background:linear-gradient(to right,#ccc,#f5f5f5 50%,#bbb);box-shadow:0 1px 3px #00000040}.ml-app .string:nth-child(6){width:1px;left:130px;background:#e8e8e8;box-shadow:0 1px 2px #0003}.ml-app .frets{position:absolute;width:100%;height:100%}.ml-app .fret{position:absolute;width:150px;height:5px;background:linear-gradient(to bottom,#d0d0d0,#a8a8a8 50%,silver);box-shadow:0 1px 3px #0000004d,inset 0 1px #ffffff80;border-radius:1px}.ml-app .fret:nth-child(1){top:60px}.ml-app .fret:nth-child(2){top:120px}.ml-app .fret:nth-child(3){top:180px}.ml-app .fret:nth-child(4){top:240px}.ml-app .fret:nth-child(5){top:290px}.ml-app .fret:nth-child(6){top:340px}.ml-app .fret:nth-child(7){top:390px}.ml-app .fret:nth-child(8){top:430px}.ml-app .fret:nth-child(9){top:460px}.ml-app .fret:nth-child(10){top:490px}.ml-app .fret:nth-child(11){top:520px}.ml-app .fret:nth-child(12){top:550px}.ml-app .fret:nth-child(13){top:580px}.ml-app .fret:nth-child(14){top:610px}.ml-app .fret:nth-child(15){top:640px}.ml-app .dots{position:absolute;width:100%;height:100%}.ml-app .dot{position:absolute;top:148px;width:13px;height:13px;border-radius:50%;left:69.5px;background:radial-gradient(circle at 38% 35%,#fff5dce6,#d2c3a0d9 60%,#aa9b78cc);box-shadow:inset 0 1px 2px #00000040,0 1px #ffffff26}.ml-app .dot:nth-child(1){top:263px}.ml-app .dot:nth-child(2){top:360px}.ml-app .dot:nth-child(3){top:440px}.ml-app .dot:nth-child(5){top:530px}.ml-app .dot:nth-child(5){top:530px;left:25px}.ml-app .dot:nth-child(6){top:530px;left:112px}.ml-app .dot:nth-child(7){top:620px}.ml-app .e,.ml-app .f,.ml-app .fs,.ml-app .g,.ml-app .gs,.ml-app .a,.ml-app .as,.ml-app .b,.ml-app .c,.ml-app .cs,.ml-app .d,.ml-app .ds{position:absolute;width:15px;height:15px;border-radius:7.5px;background-color:silver;background-image:radial-gradient(circle at 38% 32%,#ffffff8c,#0000 50%,#0000002e);box-shadow:0 2px 4px #00000061,inset 0 1px #ffffff40;cursor:pointer;transition:transform .15s ease,box-shadow .18s ease}.ml-app .note-active{transform:scale(1.22);box-shadow:0 0 12px #ffaa00b8,0 2px 4px #0000004d,inset 0 1px #ffdc6459;z-index:5}.ml-app .e:nth-of-type(1){top:0;left:13px}.ml-app .e:nth-of-type(2){top:530px;left:13px}.ml-app .e:nth-of-type(3){top:360px;left:35px}.ml-app .e:nth-of-type(4){top:90px;left:57px}.ml-app .e:nth-of-type(5){top:590px;left:57px}.ml-app .e:nth-of-type(6){top:440px;left:79px}.ml-app .e:nth-of-type(7){top:260px;left:101px}.ml-app .e:nth-of-type(8){top:0;left:123px}.ml-app .e:nth-of-type(9){top:530px;left:123px}.ml-app .f:nth-of-type(1){top:35px;left:13px}.ml-app .f:nth-of-type(2){top:560px;left:13px}.ml-app .f:nth-of-type(3){top:405px;left:35px}.ml-app .f:nth-of-type(4){top:147px;left:57px}.ml-app .f:nth-of-type(5){top:620px;left:57px}.ml-app .f:nth-of-type(6){top:470px;left:79px}.ml-app .f:nth-of-type(7){top:310px;left:101px}.ml-app .f:nth-of-type(8){top:35px;left:123px}.ml-app .f:nth-of-type(9){top:560px;left:123px}.ml-app .fs:nth-of-type(1){top:90px;left:13px}.ml-app .fs:nth-of-type(2){top:590px;left:13px}.ml-app .fs:nth-of-type(3){top:440px;left:35px}.ml-app .fs:nth-of-type(4){top:205px;left:57px}.ml-app .fs:nth-of-type(5){top:500px;left:79px}.ml-app .fs:nth-of-type(6){top:360px;left:101px}.ml-app .fs:nth-of-type(7){top:90px;left:123px}.ml-app .fs:nth-of-type(8){top:590px;left:123px}.ml-app .g:nth-of-type(1){top:147px;left:13px}.ml-app .g:nth-of-type(2){top:620px;left:13px}.ml-app .g:nth-of-type(3){top:470px;left:35px}.ml-app .g:nth-of-type(4){top:260px;left:57px}.ml-app .g:nth-of-type(5){top:0;left:79px}.ml-app .g:nth-of-type(6){top:530px;left:79px}.ml-app .g:nth-of-type(7){top:405px;left:101px}.ml-app .g:nth-of-type(8){top:147px;left:123px}.ml-app .g:nth-of-type(9){top:620px;left:123px}.ml-app .gs:nth-of-type(1){top:205px;left:13px}.ml-app .gs:nth-of-type(2){top:500px;left:35px}.ml-app .gs:nth-of-type(3){top:310px;left:57px}.ml-app .gs:nth-of-type(4){top:35px;left:79px}.ml-app .gs:nth-of-type(5){top:560px;left:79px}.ml-app .gs:nth-of-type(6){top:440px;left:101px}.ml-app .gs:nth-of-type(7){top:205px;left:123px}.ml-app .a:nth-of-type(1){top:260px;left:13px}.ml-app .a:nth-of-type(2){top:0;left:35px}.ml-app .a:nth-of-type(3){top:530px;left:35px}.ml-app .a:nth-of-type(4){top:360px;left:57px}.ml-app .a:nth-of-type(5){top:90px;left:79px}.ml-app .a:nth-of-type(6){top:590px;left:79px}.ml-app .a:nth-of-type(7){top:470px;left:101px}.ml-app .a:nth-of-type(8){top:260px;left:123px}.ml-app .as:nth-of-type(1){top:310px;left:13px}.ml-app .as:nth-of-type(2){top:35px;left:35px}.ml-app .as:nth-of-type(3){top:560px;left:35px}.ml-app .as:nth-of-type(4){top:405px;left:57px}.ml-app .as:nth-of-type(5){top:147px;left:79px}.ml-app .as:nth-of-type(6){top:620px;left:79px}.ml-app .as:nth-of-type(7){top:500px;left:101px}.ml-app .as:nth-of-type(8){top:310px;left:123px}.ml-app .b:nth-of-type(1){top:360px;left:13px}.ml-app .b:nth-of-type(2){top:90px;left:35px}.ml-app .b:nth-of-type(3){top:590px;left:35px}.ml-app .b:nth-of-type(4){top:440px;left:57px}.ml-app .b:nth-of-type(5){top:205px;left:79px}.ml-app .b:nth-of-type(6){top:0;left:101px}.ml-app .b:nth-of-type(7){top:530px;left:101px}.ml-app .b:nth-of-type(8){top:360px;left:123px}.ml-app .c:nth-of-type(1){top:405px;left:13px}.ml-app .c:nth-of-type(2){top:147px;left:35px}.ml-app .c:nth-of-type(3){top:620px;left:35px}.ml-app .c:nth-of-type(4){top:470px;left:57px}.ml-app .c:nth-of-type(5){top:260px;left:79px}.ml-app .c:nth-of-type(6){top:35px;left:101px}.ml-app .c:nth-of-type(7){top:560px;left:101px}.ml-app .c:nth-of-type(8){top:405px;left:123px}.ml-app .cs:nth-of-type(1){top:440px;left:13px}.ml-app .cs:nth-of-type(2){top:205px;left:35px}.ml-app .cs:nth-of-type(3){top:500px;left:57px}.ml-app .cs:nth-of-type(4){top:310px;left:79px}.ml-app .cs:nth-of-type(5){top:90px;left:101px}.ml-app .cs:nth-of-type(6){top:590px;left:101px}.ml-app .cs:nth-of-type(7){top:440px;left:123px}.ml-app .d:nth-of-type(1){top:470px;left:13px}.ml-app .d:nth-of-type(2){top:260px;left:35px}.ml-app .d:nth-of-type(3){top:0;left:57px}.ml-app .d:nth-of-type(4){top:530px;left:57px}.ml-app .d:nth-of-type(5){top:360px;left:79px}.ml-app .d:nth-of-type(6){top:147px;left:101px}.ml-app .d:nth-of-type(7){top:620px;left:101px}.ml-app .d:nth-of-type(8){top:470px;left:123px}.ml-app .ds:nth-of-type(1){top:500px;left:13px}.ml-app .ds:nth-of-type(2){top:310px;left:35px}.ml-app .ds:nth-of-type(3){top:35px;left:57px}.ml-app .ds:nth-of-type(4){top:560px;left:57px}.ml-app .ds:nth-of-type(5){top:405px;left:79px}.ml-app .ds:nth-of-type(6){top:205px;left:101px}.ml-app .ds:nth-of-type(7){top:500px;left:123px}.ml-app #capo{position:absolute;background:linear-gradient(to bottom,#e0e0e0,#c4c4c4 20%,#848484 50%,#b8b8b8 78%,#d8d8d8);width:15px;height:14px;left:158px;top:35px;cursor:ew-resize;z-index:10;border-radius:7px;box-shadow:0 2px 6px #0009,inset 0 1px 1px #ffffffa6}.ml-app .logo,.page-logo,.pb-app .pb-logo{position:relative;height:var(--page-header-h);display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-family:Major Mono Display,monospace;color:#fff;font-size:var(--page-header-font);background-color:olive;text-align:center;white-space:nowrap;overflow:hidden;z-index:40;margin:0;text-shadow:0 2px 6px rgba(0,0,0,.35);letter-spacing:2px}.ml-app .ml-help-btn{position:absolute;bottom:22px;right:22px;padding:9px 18px;background:olive;color:#fff;border:none;border-radius:20px;font-family:var(--ui-font);font-size:12px;letter-spacing:.5px;cursor:pointer;box-shadow:0 3px #00000047,0 4px 8px #0000002e;text-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .08s ease,box-shadow .08s ease}.ml-app .ml-help-btn:active{transform:translateY(3px);box-shadow:0 0 #00000047,0 1px 3px #00000026}.ml-app .Display{position:absolute;width:250px;height:450px;background-color:#987444;top:75px;left:65%;border-radius:15px;box-shadow:2px 2px 8px #0000004d}.ml-app .top-part{position:absolute;width:100%;height:50px;background-color:olive;font-family:var(--ui-font);text-align:center;border-top-left-radius:15px;border-top-right-radius:15px;display:grid;place-items:center;color:#fff;font-size:30px}.ml-app .clear-btn{position:absolute;width:150px;height:40px;top:535px;left:65%;transform:translate(50px);background-color:#555;color:#fff;display:grid;place-items:center;border-radius:9px;font-size:20px;font-family:var(--ui-font);cursor:pointer;user-select:none;box-shadow:0 3px #333,0 4px 6px #0000004d;transition:transform .08s ease,box-shadow .08s ease}.ml-app .clear-btn:active{transform:translate(50px,2px);box-shadow:0 1px #333,0 2px 3px #0003}.ml-app .strum{position:absolute;width:150px;height:50px;top:360px;left:50px;background:linear-gradient(to bottom,#e83030,#c00);color:#fff;display:grid;place-items:center;border-radius:9px;font-size:30px;font-family:var(--ui-font);cursor:pointer;user-select:none;box-shadow:0 5px #800,0 6px 10px #00000059;transition:transform .08s ease,box-shadow .08s ease;text-shadow:0 1px 3px rgba(0,0,0,.4)}.ml-app .strum:active{transform:translateY(4px);box-shadow:0 1px #800,0 2px 4px #0003}.ml-app .chord-section-label{position:absolute;top:202px;left:20px;color:#fff;font-family:var(--ui-font);font-size:16px}.ml-app .Chord{position:absolute;width:210px;height:115px;top:225px;left:20px;background-color:olive;color:#fff;display:grid;place-items:center;border-radius:10px;font-size:38px;font-family:var(--ui-font);box-shadow:inset 0 2px 5px #0000004d}.ml-app .String-Notes{position:absolute;width:100%;height:100%}.ml-app .String-1-Note,.ml-app .String-2-Note,.ml-app .String-3-Note,.ml-app .String-4-Note,.ml-app .String-5-Note,.ml-app .String-6-Note{position:absolute;width:30px;height:30px;top:115px;background-color:olive;display:grid;place-items:center;color:#fff;font-family:var(--ui-font);font-size:20px;border-radius:4px}.ml-app .String-1-Note{left:10px}.ml-app .String-2-Note{left:50px}.ml-app .String-3-Note{left:90px}.ml-app .String-4-Note{left:130px}.ml-app .String-5-Note{left:170px}.ml-app .String-6-Note{left:210px}.ml-app .String-Text{position:absolute;width:100px;height:40px;top:75px;left:90px;color:#fff;font-family:var(--ui-font);font-size:30px}.sp-app .sp-notes{position:absolute;inset:0;pointer-events:none}.sp-app .sp-note{position:absolute;width:21px;height:21px;border-radius:10.5px;margin:-3px 0 0 -3px;display:flex;align-items:center;justify-content:center;font-family:Helvetica Neue,Segoe UI,Arial,sans-serif;font-weight:700;font-size:11px;letter-spacing:-.3px;line-height:1;color:#5a3a16;background-color:#ece0c0;background-image:radial-gradient(circle at 38% 32%,#ffffff8c,#0000 50%,#0000002e);box-shadow:0 2px 4px #0006,inset 0 1px #ffffff4d;z-index:4}.sp-app .sp-note.sp-root{color:#fff;background-color:#c0392b;box-shadow:0 0 9px #c0392ba6,0 2px 4px #00000059,inset 0 1px #ffffff4d;z-index:5}.sp-app .sp-panel{position:absolute;width:270px;top:90px;left:62%;padding:0 22px 22px;background-color:#987444;border-radius:15px;box-shadow:2px 2px 8px #0000004d}.sp-app .sp-panel-title{margin:0 -22px 18px;padding:14px 0;background:olive;border-radius:15px 15px 0 0;font-family:var(--ui-font);font-size:24px;letter-spacing:2px;color:#fff;text-align:center;text-shadow:0 2px 5px rgba(0,0,0,.4)}.sp-app .sp-field-label{display:block;margin:0 0 7px 2px;font-family:var(--ui-font);font-size:13px;letter-spacing:.5px;color:#fff}.sp-app .sp-select{display:block;width:100%;margin-bottom:18px;padding:10px 12px;font-family:var(--ui-font);font-size:15px;color:#3a2614;background:#efe7d2;border:2px solid #6f5326;border-radius:8px;cursor:pointer;box-shadow:inset 0 1px 3px #00000040}.sp-app .sp-select:focus{outline:none;border-color:olive;box-shadow:0 0 0 2px #80800073,inset 0 1px 3px #00000040}.sp-app .sp-hint{margin-top:16px;font-family:var(--ui-font);font-size:11px;line-height:1.5;color:#fffc}.tuner-app{background-color:#e3d1b8;filter:sepia(12%);overflow:hidden;display:flex;flex-direction:column}.tuner-app .tuner-stage{position:relative;flex:1 1 auto;width:100%;min-height:0}.tuner-app .tuner-toggle{position:absolute;top:20px;left:50%;transform:translate(-50%);z-index:30;padding:10px 28px;background:olive;color:#fff;border:none;border-radius:22px;font-family:var(--ui-font);font-size:14px;letter-spacing:.5px;cursor:pointer;box-shadow:0 3px #00000047,0 4px 8px #0000002e;text-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .08s ease,box-shadow .08s ease,background .15s}.tuner-app .tuner-toggle.on{background:#a23b2b}.tuner-app .tuner-toggle:disabled{opacity:.6;cursor:default}.tuner-app .tuner-centerline{position:absolute;left:50%;transform:translate(-50%);top:0;bottom:174px;width:2px;background:linear-gradient(to bottom,#5a3c1400,#5a3c1447 22%,#5a3c146b);pointer-events:none;z-index:1}.tuner-app .tuner-readout{position:absolute;top:13%;left:0;right:0;text-align:center;pointer-events:none;z-index:5}.tuner-app .tuner-status{font-family:var(--ui-font);font-size:16px;letter-spacing:1.5px;color:#7a5a2a;min-height:22px}.tuner-app .tuner-status.in{color:#3f7d3a}.tuner-app .tuner-status.off{color:#a8412f}.tuner-app .tuner-note{font-family:var(--ui-font);font-weight:800;font-size:128px;line-height:1.05;color:#3a2614;text-shadow:0 3px 8px rgba(0,0,0,.18);transition:color .15s ease}.tuner-app .tuner-note.in{color:#3f7d3a}.tuner-app .tuner-cents{font-family:var(--ui-font);font-weight:700;font-size:20px;color:#8a6a38;min-height:24px}.tuner-app .tuner-meter{position:absolute;left:50%;transform:translate(-50%);top:46%;width:min(560px,82%);height:150px;z-index:4;display:flex;align-items:center}.tuner-app .tuner-track{position:relative;flex:1;height:100%;display:flex;justify-content:space-between;align-items:center}.tuner-app .tuner-track:before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:#5a3c1440}.tuner-app .tuner-track .tick{width:2px;height:16px;background:#5a3c1466;z-index:1}.tuner-app .tuner-track .tick.center{width:3px;height:30px;background:#5a3c148c}.tuner-app .tuner-sign{font-family:var(--ui-font);font-size:34px;font-weight:700;color:#9a7a44;padding:0 14px}.tuner-app .tuner-needle{position:absolute;left:50%;top:50%;width:6px;height:116px;margin-top:-58px;border-radius:3px;background:#a8412f;box-shadow:0 0 12px #a8412fb3;transform:translate(-50%);transition:background .12s ease,box-shadow .12s ease}.tuner-app .tuner-needle.in{background:#3f9a38;box-shadow:0 0 16px #3f9a38d9}.tuner-app .tuner-needle.off{background:#a8412f;box-shadow:0 0 12px #a8412fb3}.tuner-app .tuner-headstock{position:absolute;left:50%;transform:translate(-50%);bottom:0;width:300px;height:220px;z-index:2}.tuner-app .tuner-nut{position:absolute;left:50%;transform:translate(-50%);top:44px;width:108px;height:9px;border-radius:2px;background:linear-gradient(to bottom,#e8e5d2,#c8c4a6,#dedad0);box-shadow:0 1px 4px #00000059;z-index:3}.tuner-app .tuner-plate{position:absolute;left:50%;transform:translate(-50%);top:52px;bottom:0;width:212px;border-radius:22px 22px 4px 4px;background:radial-gradient(ellipse 60% 40% at 50% 16%,rgba(120,84,44,.45) 0%,transparent 70%),linear-gradient(160deg,#3c2614,#281a0d 48%,#341f0f);box-shadow:2px 1px 10px #00000080,inset 0 1px #966e3c4d}.tuner-app .tuner-peg{position:absolute;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--ui-font);font-weight:700;font-size:16px;color:#2a1a0c;background:radial-gradient(circle at 36% 30%,#f2efe4,#b8b09a);box-shadow:0 2px 5px #00000080,inset 0 1px #ffffff73;transition:background .15s ease,box-shadow .15s ease,transform .15s ease,color .15s ease}.tuner-app .tuner-peg.left{left:-8px}.tuner-app .tuner-peg.right{right:-8px}.tuner-app .tuner-peg:nth-of-type(1){top:26px}.tuner-app .tuner-peg:nth-of-type(2){top:82px}.tuner-app .tuner-peg:nth-of-type(3){top:138px}.tuner-app .tuner-peg:nth-of-type(4){top:26px}.tuner-app .tuner-peg:nth-of-type(5){top:82px}.tuner-app .tuner-peg:nth-of-type(6){top:138px}.tuner-app .tuner-peg.active{background:radial-gradient(circle at 36% 30%,#c4e8ba,#5fae54);color:#15400f;box-shadow:0 0 16px #5fae54d9,0 2px 5px #0006;transform:scale(1.12)}.tuner-app .tuner-tuning{position:absolute;top:22px;left:20px;z-index:30;display:flex;flex-direction:column;gap:4px}.tuner-app .tuner-tuning label{font-family:var(--ui-font);font-size:11px;letter-spacing:1px;color:#5a4a2a}.tuner-app .tuner-tuning select{appearance:none;-webkit-appearance:none;padding:7px 30px 7px 12px;background:olive;color:#fff;border:none;border-radius:16px;font-family:var(--ui-font);font-size:12px;letter-spacing:.5px;cursor:pointer;box-shadow:0 3px #00000047,0 4px 8px #0000002e;text-shadow:0 1px 3px rgba(0,0,0,.3);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 12px center}.tuner-app .tuner-tuning select:focus{outline:2px solid #c9b88f;outline-offset:2px}@media (max-width: 560px){.tuner-app .tuner-tuning{top:64px;left:50%;transform:translate(-50%);align-items:center}}.pb-app{--bg: #e3d1b8;--bg-raised: rgb(218, 198, 168);--board: rgb(58, 40, 16);--board-edge: rgb(110, 78, 36);--text: #fff;--text-dim: rgba(255, 255, 255, .65);--accent: olive;--p-face: #444;--p-face-2: #333;--p-trim: #888;background:var(--bg);color:#3a2a10;font-family:var(--ui-font);user-select:none;-webkit-user-select:none;filter:sepia(20%)}.pb-app #app{display:flex;flex-direction:column;height:100%}.pb-app #top-bar{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px;padding:14px 22px;background:transparent;min-height:110px}.pb-app #input-section{display:flex;flex-direction:column;gap:12px;min-width:240px;flex:0 0 auto;z-index:1;padding:12px 14px;border-radius:12px;background:linear-gradient(180deg,#4a3519,#3a2a12);box-shadow:inset 0 1px #ffffff12,0 4px 12px #0000002e}.pb-app .pb-logo{pointer-events:none}.pb-app .pb-logo span{color:#fff}.pb-app .input-controls{display:flex;gap:6px;align-items:center}.pb-app .pb-help-btn{position:absolute;bottom:22px;right:22px;padding:9px 18px;background:olive;color:#fff;border:none;border-radius:20px;font-family:var(--ui-font);font-size:12px;letter-spacing:.5px;cursor:pointer;z-index:10;box-shadow:0 3px #00000047,0 4px 8px #0000002e;text-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .08s ease,box-shadow .08s ease}.pb-app .pb-help-btn:active{transform:translateY(3px);box-shadow:0 0 #00000047,0 1px 3px #00000026}.pb-app .input-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-family:var(--ui-font);letter-spacing:1px;color:#fff;background:#00000040;border:1px solid rgba(255,255,255,.3);border-radius:7px;cursor:pointer;transition:background .12s ease}.pb-app .input-btn:hover:not(:disabled){background:#00000061}.pb-app .input-btn:disabled{opacity:.38;cursor:default}.pb-app .input-btn .dot{width:10px;height:10px;border-radius:50%;background:#ffffff80}.pb-app .input-btn.live .dot{background:#f55;box-shadow:0 0 6px #f55}.pb-app .input-btn.live{background:#00000059}.pb-app .meter-wrap{display:flex;align-items:center;gap:8px}.pb-app #vu-meter{background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:3px}.pb-app #input-label{font-size:12px;font-family:var(--ui-font);color:#ffffffa6;letter-spacing:1px}.pb-app #pedal-tray{display:flex;align-items:center;justify-content:flex-end;justify-self:end;gap:12px;z-index:1;overflow-x:auto;padding:10px 14px;border-radius:12px;background:linear-gradient(180deg,#4a3519,#3a2a12);box-shadow:inset 0 1px #ffffff12,0 4px 12px #0000002e}.pb-app .tray-pedal{width:78px;height:96px;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:9px 6px;cursor:grab;background:linear-gradient(160deg,var(--p-face),var(--p-face-2));border:1px solid var(--p-trim);box-shadow:0 3px 8px #0006,inset 0 1px #ffffff26;transition:transform .12s ease,box-shadow .12s ease}.pb-app .tray-pedal:hover{transform:translateY(-4px);box-shadow:0 7px 16px #00000073,inset 0 1px #ffffff26}.pb-app .tray-pedal:active{cursor:grabbing}.pb-app .tray-pedal .mini-knobs{display:flex;gap:5px}.pb-app .tray-pedal .mini-knob{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#666,#1a1a1a);border:1px solid rgba(255,255,255,.3)}.pb-app .tray-pedal .mini-switch{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d8d8d8,#5e5e5e 70%);border:2px solid rgba(0,0,0,.4);box-shadow:0 2px 4px #0006}.pb-app .tray-pedal .name{font-size:11px;font-family:var(--ui-font);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9);text-align:center;letter-spacing:.5px}.pb-app #board-area{flex:1;display:flex;align-items:center;gap:10px;padding:0 14px}.pb-app #signal-label-in,.pb-app #signal-label-out{font-size:11px;font-family:var(--ui-font);letter-spacing:2px;color:#5037148c;white-space:nowrap}.pb-app #pedal-board{flex:1;min-height:280px;display:flex;align-items:center;gap:22px;padding:26px 30px;overflow-x:auto;background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0px,rgba(0,0,0,.07) 1px,transparent 1px,transparent 22px),repeating-linear-gradient(180deg,rgba(255,255,255,.025) 0px,rgba(255,255,255,.025) 2px,transparent 2px,transparent 30px),linear-gradient(#483216,#38260e 30%,#2e1f0a);border:2px solid var(--board-edge);border-radius:10px;box-shadow:inset 0 0 60px #00000080,0 6px 20px #0000004d}.pb-app #board-hint{width:100%;text-align:center;font-size:18px;font-family:var(--ui-font);letter-spacing:2px;color:#c8a5644d;pointer-events:none}.pb-app #pedal-board:not(.empty) #board-hint{display:none}.pb-app #pedal-board.drag-over{border-color:olive;box-shadow:inset 0 0 60px #00000080,0 0 12px #80800066}.pb-app .drop-marker{width:4px;align-self:stretch;margin:20px 0;border-radius:2px;background:olive;box-shadow:0 0 10px olive;flex-shrink:0}.pb-app .pedal{position:relative;width:150px;border-radius:9px;padding:10px 10px 14px;display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0;cursor:grab;background:linear-gradient(160deg,var(--p-face),var(--p-face-2));border:1px solid var(--p-trim);box-shadow:0 6px 14px #0000008c,inset 0 1px #ffffff2e,inset 0 -2px 6px #0000004d}.pb-app .pedal:active{cursor:grabbing}.pb-app .pedal.dragging{opacity:.35}.pb-app .pedal .head{width:100%;display:flex;align-items:center;justify-content:space-between}.pb-app .pedal .led{width:10px;height:10px;border-radius:50%;background:#3c3c3c;border:1px solid #1c1c1c;cursor:pointer}.pb-app .pedal .led.on{background:#f33;box-shadow:0 0 9px #f33,0 0 3px #f88 inset}.pb-app .pedal .remove{width:17px;height:17px;border:none;border-radius:50%;background:#0006;color:#ffffffbf;font-size:11px;line-height:17px;text-align:center;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}.pb-app .pedal .remove:hover{background:#a22;color:#fff}.pb-app .pedal .pedal-name{font-size:11px;font-family:var(--ui-font);letter-spacing:1.5px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.9)}.pb-app .pedal .knobs{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px}.pb-app .knob{display:flex;flex-direction:column;align-items:center;gap:1px}.pb-app .knob canvas{cursor:ns-resize}.pb-app .knob .knob-label{font-size:8px;font-family:var(--ui-font);letter-spacing:.5px;color:#ffffffe6;text-shadow:0 1px 2px rgba(0,0,0,.8)}.pb-app .knob .knob-value{font-size:7px;color:#fff9;font-variant-numeric:tabular-nums}.pb-app .pedal .switch{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d8d8d8,#5a5a5a 72%);border:3px solid #222;box-shadow:0 3px 6px #0009;cursor:pointer;transition:transform .08s ease,box-shadow .08s ease}.pb-app .pedal .switch:active{transform:translateY(1px);box-shadow:0 1px 3px #00000080}.pb-app [data-type=distortion]{--p-face: #c33a1f;--p-face-2: #7e1f0e;--p-trim: #e8744f}.pb-app [data-type=overdrive]{--p-face: #d8a021;--p-face-2: #8f6410;--p-trim: #f0c463}.pb-app [data-type=delay]{--p-face: #2773c8;--p-face-2: #154a88;--p-trim: #6aa6e8}.pb-app [data-type=reverb]{--p-face: #7a3fc0;--p-face-2: #4c2380;--p-trim: #ab7ce6}.pb-app [data-type=chorus]{--p-face: #1f9a78;--p-face-2: #11604a;--p-trim: #62cbb0}.pb-app #status-bar{display:none}.pb-app.file-drag #pedal-board{border-color:olive}@media (max-width: 900px){.pb-app #input-section{min-width:0;gap:8px}.pb-app .input-btn{padding:8px 12px;font-size:12px}.pb-app #vu-meter{width:140px}.pb-app .tray-pedal{width:62px;height:78px;padding:7px 4px}.pb-app #top-bar{gap:10px;padding:10px 14px;min-height:90px}}@media (max-width: 640px){.pb-app #top-bar{grid-template-columns:1fr;grid-template-rows:auto auto}.pb-app #pedal-tray{grid-column:1 / -1;justify-self:stretch;justify-content:flex-start}}.metro-app{background-color:#e3d1b8;filter:sepia(12%);display:flex;flex-direction:column;overflow:hidden}.metro-stage{flex:1 1 auto;width:100%;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.metro-wrap{display:flex;flex-direction:column;align-items:center;gap:22px;padding:20px;user-select:none;-webkit-user-select:none}.metro-pendulum-wrap{display:flex;flex-direction:column;align-items:center;height:180px;position:relative}.metro-pendulum{width:3px;height:160px;background:linear-gradient(to bottom,#5a3c144d,#5a3c14b3 60%,#3a2614);border-radius:2px;transform-origin:top center;transform:rotate(0);position:relative}.metro-pendulum.swinging{transition:transform .15s ease-out}.metro-pendulum:after{content:"";position:absolute;bottom:-14px;left:50%;transform:translate(-50%);width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c8a458,#7a5a2a 55%,#3a2614);box-shadow:0 3px 10px #00000040}.metro-bpm-row{display:flex;align-items:center;gap:14px}.metro-bpm-btn{width:36px;height:36px;border-radius:50%;border:2px solid rgba(90,60,20,.25);background:transparent;color:#7a5a2a;font-size:22px;line-height:1;cursor:pointer;transition:background .12s,border-color .12s;display:flex;align-items:center;justify-content:center}.metro-bpm-btn:hover{background:#5a3c141a;border-color:#5a3c1480}.metro-bpm-btn:active{background:#5a3c142e}.metro-bpm-display{font-family:Major Mono Display,monospace;font-size:72px;color:#3a2614;min-width:130px;text-align:center;cursor:pointer;letter-spacing:-2px;line-height:1;text-shadow:0 2px 6px rgba(0,0,0,.12)}.metro-bpm-display:hover{color:#7a5a2a}.metro-bpm-label{font-family:var(--ui-font);font-size:11px;color:#a08050;letter-spacing:2px;text-align:center;margin-top:-6px}.metro-slider{width:280px;accent-color:olive;cursor:pointer;height:6px}.metro-slider-labels{display:flex;justify-content:space-between;width:280px;font-family:Major Mono Display,monospace;font-size:11px;color:#5a3c1466;margin-top:-4px}.metro-beat-dots{display:flex;gap:14px;align-items:center;min-height:36px}.metro-dot{width:28px;height:28px;border-radius:50%;background:#5a3c141f;border:2px solid rgba(90,60,20,.25);transition:background .06s,box-shadow .06s}.metro-dot.accent{border-color:#5a3c1480}.metro-dot.active{background:olive;border-color:olive;box-shadow:0 0 12px #80800073}.metro-dot.accent.active{background:#5a5a00;border-color:#5a5a00;box-shadow:0 0 16px #5a5a008c}.metro-sig-row{display:flex;gap:10px;align-items:center}.metro-sig-label{font-family:var(--ui-font);font-size:11px;color:#a08050;letter-spacing:2px;margin-right:4px}.metro-sig-btn{font-family:Major Mono Display,monospace;font-size:13px;padding:6px 14px;border-radius:20px;border:2px solid rgba(90,60,20,.25);background:transparent;color:#5a3c148c;cursor:pointer;transition:all .12s}.metro-sig-btn:hover{border-color:#5a3c1480;color:#3a2614}.metro-sig-btn.active{background:olive;border-color:olive;color:#fff;box-shadow:0 2px 8px #80800059}.metro-btns-row{display:flex;gap:16px;align-items:center}.metro-start-btn{font-family:var(--ui-font);font-size:18px;letter-spacing:3px;padding:14px 44px;border-radius:50px;border:none;background:olive;color:#fff;cursor:pointer;box-shadow:0 4px #00000038,0 5px 12px #00000026;text-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .08s ease,box-shadow .08s ease,background .15s}.metro-start-btn:hover{filter:brightness(1.08)}.metro-start-btn:active{transform:translateY(3px);box-shadow:0 1px #00000038,0 2px 4px #0000001f}.metro-start-btn.running{background:#a23b2b;box-shadow:0 4px #00000038,0 5px 12px #a23b2b4d}.metro-tap-btn{font-family:var(--ui-font);font-size:14px;letter-spacing:2px;padding:14px 24px;border-radius:50px;border:2px solid rgba(90,60,20,.3);background:transparent;color:#7a5a2a;cursor:pointer;transition:all .08s;box-shadow:0 3px #0000001f}.metro-tap-btn:hover{border-color:#5a3c1499;color:#3a2614}.metro-tap-btn.tapped{background:#5a3c141a;border-color:#7a5a2a}