*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{min-height:100vh;color:#2e1404;font-family:Georgia,Times New Roman,serif;overflow-x:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background-color:#c08820;background-image:radial-gradient(ellipse 130% 110% at 50% 50%,transparent 25%,rgba(50,18,0,.5) 100%),repeating-linear-gradient(89.3deg,transparent 0px,transparent 2px,rgba(70,28,0,.1) 2px,rgba(70,28,0,.1) 3px,transparent 3px,transparent 9px,rgba(55,18,0,.07) 9px,rgba(55,18,0,.07) 10px,transparent 10px,transparent 19px,rgba(80,32,0,.08) 19px,rgba(80,32,0,.08) 20px),repeating-linear-gradient(88.7deg,#c8821900,#8c500533 20px,#d2911e00 45px,#82440529 75px,#c37d1600 110px,#9b5a082e 140px,#c37d1600 175px),linear-gradient(180deg,#d9ae4a,#c49232 18%,#ae7818 45%,#ba8424,#9e6610 85%,#ae7820)}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat}:root{--s0: #009999;--s1: #1a7fff;--s2: #18b83a;--s3: #e83010;--s4: #b830ff;--s5: #e81060;--wood-dark: rgba(38,14,0,.84);--wood-light: rgba(55,22,0,.38);--wood-border: rgba(195,138,38,.2);--wood-border-hi: rgba(220,158,48,.36);--cream: #f5e8c0}@keyframes pulse-ring{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(3)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:.18}}@keyframes pluck-flash{0%{background:#ffc34b24}to{background:transparent}}@keyframes str-on{0%{opacity:.3}45%{opacity:1}to{opacity:1}}@keyframes slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes label-pop{0%{transform:scale(1)}40%{transform:scale(1.14)}to{transform:scale(1)}}@keyframes card-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}#app{min-height:100vh;max-width:520px;margin:0 auto;display:flex;flex-direction:column;animation:fadeIn .45s ease}.header{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.2rem .75rem;background:var(--wood-dark);border-bottom:1px solid var(--wood-border-hi)}.logo{font-family:Georgia,Times New Roman,serif;font-size:1.6rem;font-weight:700;font-style:italic;letter-spacing:.01em;line-height:1;color:var(--cream);text-shadow:0 2px 8px rgba(0,0,0,.55),0 0 28px rgba(200,158,55,.28)}.logo span{color:#e0b840;font-style:normal}.logo-sub{font-size:.48rem;color:#c89e4e61;letter-spacing:.28em;margin-top:3px;font-family:Courier New,monospace;font-style:normal}.header-btns{display:flex;gap:.4rem}.btn-icon{background:#ffc34b0f;color:#c69b4b7a;border:1px solid rgba(195,138,38,.22);border-radius:5px;padding:.42rem .78rem;font-family:Courier New,monospace;font-size:.6rem;font-weight:700;letter-spacing:.1em;cursor:pointer;transition:all .12s}.btn-icon.active{background:#a58af829;color:#c4b5fd;border-color:#a58af85c}.add-panel{animation:slide-down .2s ease}.tabs{display:flex;background:var(--wood-dark);border-bottom:1px solid var(--wood-border)}.tab{flex:1;padding:.62rem .4rem;text-align:center;font-size:.58rem;font-weight:700;letter-spacing:.12em;cursor:pointer;color:#c69b4b52;border-bottom:2px solid transparent;transition:all .15s;background:transparent;border-top:none;border-left:none;border-right:none;font-family:Courier New,monospace}.tab.active{color:#c4b5fd;border-bottom-color:#a78bfa}.library-panel{background:var(--wood-dark);border-bottom:1px solid var(--wood-border);padding:.8rem 1rem;max-height:58vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.lib-intro{font-size:.56rem;color:#c69b4b52;letter-spacing:.1em;margin-bottom:.65rem;line-height:1.55;font-family:Courier New,monospace}.song-card{background:#14070075;border:1px solid rgba(195,138,38,.13);border-radius:7px;padding:.65rem .85rem;margin-bottom:.48rem;cursor:pointer;display:flex;align-items:center;gap:.7rem;animation:card-in .25s ease both;transition:background .12s,border-color .12s}.song-card:active{background:#140700a6}.song-card.loaded{background:#e0b84017;border-color:#e0b84061}.song-num{font-family:Impact,Arial Narrow,sans-serif;font-size:1.4rem;color:#c38a2633;min-width:1.5rem;text-align:center;line-height:1}.song-card.loaded .song-num{color:#e0b840}.song-info{flex:1;min-width:0}.song-title{font-size:.72rem;font-weight:700;color:var(--cream);letter-spacing:.03em;margin-bottom:.12rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-artist{font-size:.56rem;color:#c69b4b6b;letter-spacing:.08em;margin-bottom:.22rem;font-family:Courier New,monospace}.song-pips{display:flex;gap:3px}.song-pip{width:7px;height:7px;border-radius:50%;opacity:.75}.song-diff{font-size:.49rem;font-weight:700;letter-spacing:.12em;padding:.14rem .38rem;border-radius:3px;white-space:nowrap;font-family:Courier New,monospace}.diff-1{background:#18b83a24;color:#18b83ab8;border:1px solid rgba(24,184,58,.22)}.diff-2{background:#e0b8401c;color:#e0b8409e;border:1px solid rgba(224,184,64,.18)}.diff-3{background:#e830101c;color:#e830109e;border:1px solid rgba(232,48,16,.18)}.ai-panel{background:var(--wood-dark);border-bottom:1px solid var(--wood-border);padding:1rem 1.3rem}.ai-header{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}.ai-title{font-size:.6rem;font-weight:700;letter-spacing:.15em;color:#a78bfa;font-family:Courier New,monospace}.ai-sub{font-size:.56rem;color:#c69b4b4d;letter-spacing:.1em;font-family:Courier New,monospace}.ai-notice{font-size:.54rem;color:#c68a266b;letter-spacing:.08em;line-height:1.55;margin-bottom:.7rem;padding:.5rem .65rem;border:1px solid rgba(195,138,38,.13);border-radius:5px;background:#af761212;font-family:Courier New,monospace}.ai-row{display:flex;gap:.5rem;margin-bottom:.65rem}.ai-input{flex:1;background:#1207009e;border:1px solid rgba(195,138,38,.16);border-radius:5px;padding:.65rem .85rem;color:var(--cream);font-family:Courier New,monospace;font-size:.72rem;outline:none;-webkit-appearance:none}.ai-input::placeholder{color:#c69b4b33}.btn-ai{background:#a58af81f;color:#a78bfa;border:1px solid rgba(165,138,248,.35);border-radius:5px;padding:.65rem 1rem;font-family:Courier New,monospace;font-size:.68rem;font-weight:700;letter-spacing:.08em;cursor:pointer;transition:all .15s;white-space:nowrap}.btn-ai:disabled{opacity:.35;cursor:not-allowed}.ai-loading{display:none;align-items:center;gap:.6rem;font-size:.62rem;color:#a58af899;letter-spacing:.14em;margin-bottom:.6rem;font-family:Courier New,monospace}.ai-loading.show{display:flex}.spinner{width:13px;height:13px;border:2px solid rgba(165,138,248,.16);border-top-color:#a78bfa;border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}.ai-result{display:none;background:#12070085;border:1px solid rgba(165,138,248,.16);border-radius:5px;padding:.8rem 1rem;margin-bottom:.5rem}.ai-result.show{display:block}.ai-result-label{font-size:.58rem;color:#a58af880;letter-spacing:.14em;margin-bottom:.28rem;font-family:Courier New,monospace}.ai-result-seq{font-size:.82rem;color:#a78bfa;letter-spacing:.22em;font-weight:700;margin-bottom:.38rem;font-family:Courier New,monospace}.ai-result-note{font-size:.56rem;color:#c69b4b66;line-height:1.55;font-family:Courier New,monospace}.btn-load-ai{width:100%;background:#a58af81a;color:#a78bfa;border:1px solid rgba(165,138,248,.25);border-radius:5px;padding:.6rem;font-family:Courier New,monospace;font-size:.68rem;font-weight:700;letter-spacing:.1em;cursor:pointer;display:none}.btn-load-ai.show{display:block}.ai-err{display:none;font-size:.6rem;color:#ff5f5fb8;letter-spacing:.1em;margin-bottom:.5rem;font-family:Courier New,monospace}.ai-err.show{display:block}.custom-panel{background:var(--wood-dark);border-bottom:1px solid var(--wood-border);padding:.9rem 1.1rem}.custom-desc{font-size:.56rem;color:#c69b4b59;letter-spacing:.1em;margin-bottom:.65rem;line-height:1.65;font-family:Courier New,monospace}.tap-strings{display:flex;flex-direction:column;gap:.22rem;margin-bottom:.65rem}.tap-str-row{display:flex;align-items:center;gap:.6rem;padding:.32rem .4rem;cursor:pointer;border-radius:5px;transition:background .1s}.tap-str-row:active{background:#ffc34b12}.tap-str-lbl{width:2rem;text-align:right;font-family:Impact,sans-serif;font-size:1.5rem;line-height:1;-webkit-user-select:none;user-select:none}.tap-str-line{flex:1;border-radius:9999px;background:linear-gradient(180deg,#ffd79680,#c39b5540);box-shadow:0 1px #ffebb924,0 -1px #4b23001f;transition:box-shadow .1s}.tap-str-row:active .tap-str-line{box-shadow:0 0 10px 3px #e0b84080}.ts0 .tap-str-lbl{color:#009999b3}.ts0 .tap-str-line{height:3px}.ts1 .tap-str-lbl{color:#1a7fffb3}.ts1 .tap-str-line{height:4px}.ts2 .tap-str-lbl{color:#18b83ab3}.ts2 .tap-str-line{height:5px}.ts3 .tap-str-lbl{color:#e83010b3}.ts3 .tap-str-line{height:6.5px}.ts4 .tap-str-lbl{color:#b830ffb3}.ts4 .tap-str-line{height:8px}.ts5 .tap-str-lbl{color:#e81060b3}.ts5 .tap-str-line{height:10px}.custom-seq-wrap{display:flex;flex-wrap:wrap;gap:.3rem;min-height:2.4rem;margin-bottom:.6rem;align-items:center}.seq-pip{width:1.8rem;height:1.8rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Impact,sans-serif;font-size:.82rem;cursor:pointer;transition:transform .1s;flex-shrink:0;color:#fff}.seq-pip:active{transform:scale(.85)}.seq-empty{font-size:.56rem;color:#c69b4b38;font-family:Courier New,monospace;letter-spacing:.12em}.custom-actions{display:flex;gap:.5rem}.btn-custom-load{flex:1;background:#18b83a1c;color:#18b83a;border:1px solid rgba(24,184,58,.28);border-radius:5px;padding:.6rem;font-family:Courier New,monospace;font-size:.68rem;font-weight:700;cursor:pointer}.btn-custom-clear{background:#e8301017;color:#e830108c;border:1px solid rgba(232,48,16,.18);border-radius:5px;padding:.6rem .9rem;font-family:Courier New,monospace;font-size:.68rem;font-weight:700;cursor:pointer}.custom-err{display:none;font-size:.58rem;color:#ff5f5fb8;letter-spacing:.1em;margin-top:.4rem;font-family:Courier New,monospace}.custom-err.show{display:block}.settings-panel{background:var(--wood-dark);border-bottom:1px solid var(--wood-border);padding:1rem 1.3rem;animation:slide-down .2s ease}.setting-row{margin-bottom:.9rem}.setting-label{font-size:.58rem;color:#c69b4b66;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.42rem;font-family:Courier New,monospace}.setting-tip{font-size:.5rem;color:#c69b4b38;line-height:1.6;font-family:Courier New,monospace;margin-top:.38rem}.sens-scale-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}.sens-scale-end{font-size:.44rem;color:#c69b4b47;font-family:Courier New,monospace;letter-spacing:.12em}.sens-val{font-size:.56rem;color:#e0b840;font-family:Courier New,monospace;font-weight:700;letter-spacing:.12em}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:3px;background:#c38a2638;border-radius:9999px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#e0b840;cursor:pointer;box-shadow:0 0 8px #e0b84080}input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#e0b840;border:none;cursor:pointer}.toggle-row{display:flex;align-items:center;gap:.8rem}.toggle-btn{font-family:Courier New,monospace;font-size:.63rem;font-weight:700;letter-spacing:.1em;background:transparent;color:#c69b4b4d;border:1px solid rgba(195,138,38,.16);border-radius:5px;padding:.32rem .9rem;cursor:pointer}.toggle-btn.on{background:#e0b8401a;color:#e0b840;border-color:#e0b84052}.pattern-section{padding:.62rem 1.2rem .7rem;background:var(--wood-light);border-bottom:1px solid var(--wood-border)}.section-label{font-size:.5rem;color:#37160073;letter-spacing:.26em;text-transform:uppercase;margin-bottom:.4rem;font-weight:700;font-family:Courier New,monospace}.pat-pill{display:inline-block;background:#1c0a0094;color:#e0b840;border:1px solid rgba(224,184,64,.45);border-radius:5px;padding:.32rem .7rem;font-family:Courier New,monospace;font-size:.6rem;font-weight:700;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pat-desc{margin-top:.38rem;font-size:.56rem;color:#37160061;letter-spacing:.18em;font-family:Courier New,monospace}.guitar-area{flex:1;padding:1.4rem 1.2rem .6rem;display:flex;flex-direction:column;gap:0}.guitar-area.flash{animation:pluck-flash .2s ease-out}.string-row{display:flex;align-items:center;padding:.58rem 0;border-radius:6px;cursor:pointer;position:relative}.str-label{width:3rem;text-align:right;padding-right:1rem;font-family:Impact,Arial Narrow,sans-serif;font-size:2rem;line-height:1;-webkit-user-select:none;user-select:none;color:#2d120447;transition:color .12s,text-shadow .12s}.sr0.active .str-label{color:var(--s0);text-shadow:0 0 14px var(--s0),0 0 36px rgba(0,153,153,.4);animation:label-pop .22s ease}.sr1.active .str-label{color:var(--s1);text-shadow:0 0 14px var(--s1),0 0 36px rgba(26,127,255,.4);animation:label-pop .22s ease}.sr2.active .str-label{color:var(--s2);text-shadow:0 0 14px var(--s2),0 0 36px rgba(24,184,58,.4);animation:label-pop .22s ease}.sr3.active .str-label{color:var(--s3);text-shadow:0 0 14px var(--s3),0 0 36px rgba(232,48,16,.4);animation:label-pop .22s ease}.sr4.active .str-label{color:var(--s4);text-shadow:0 0 14px var(--s4),0 0 36px rgba(184,48,255,.4);animation:label-pop .22s ease}.sr5.active .str-label{color:var(--s5);text-shadow:0 0 14px var(--s5),0 0 36px rgba(232,16,96,.4);animation:label-pop .22s ease}.string-row.prev .str-label{color:#2d12047a}.str-line-wrap{flex:1;display:flex;align-items:center;position:relative;padding:5px 0}.str-line{width:100%;border-radius:9999px;background:linear-gradient(180deg,#ffd79685,#c39b5547,#915f232e);box-shadow:0 1px #ffebb929,0 -1px #4b230024;transition:height .1s,background .12s,box-shadow .12s}.sr0.active .str-line{background:linear-gradient(90deg,var(--s0),#3ddcdc,var(--s0));box-shadow:0 0 9px 3px #0099999e,0 0 26px 8px #00999938;animation:str-on .2s ease}.sr1.active .str-line{background:linear-gradient(90deg,var(--s1),#68b6ff,var(--s1));box-shadow:0 0 9px 3px #1a7fff9e,0 0 26px 8px #1a7fff38;animation:str-on .2s ease}.sr2.active .str-line{background:linear-gradient(90deg,var(--s2),#70e888,var(--s2));box-shadow:0 0 9px 3px #18b83a9e,0 0 26px 8px #18b83a38;animation:str-on .2s ease}.sr3.active .str-line{background:linear-gradient(90deg,var(--s3),#ff8060,var(--s3));box-shadow:0 0 9px 3px #e830109e,0 0 26px 8px #e8301038;animation:str-on .2s ease}.sr4.active .str-line{background:linear-gradient(90deg,var(--s4),#d880ff,var(--s4));box-shadow:0 0 9px 3px #b830ff9e,0 0 26px 8px #b830ff38;animation:str-on .2s ease}.sr5.active .str-line{background:linear-gradient(90deg,var(--s5),#ff6090,var(--s5));box-shadow:0 0 9px 3px #e810609e,0 0 26px 8px #e8106038;animation:str-on .2s ease}.pulse-dot{position:absolute;left:2px;width:11px;height:11px;border-radius:50%;pointer-events:none;animation:pulse-ring .55s ease-out forwards}.sr0 .pulse-dot{background:var(--s0);box-shadow:0 0 12px 4px #0999}.sr1 .pulse-dot{background:var(--s1);box-shadow:0 0 12px 4px #1a7fff99}.sr2 .pulse-dot{background:var(--s2);box-shadow:0 0 12px 4px #18b83a99}.sr3 .pulse-dot{background:var(--s3);box-shadow:0 0 12px 4px #e8301099}.sr4 .pulse-dot{background:var(--s4);box-shadow:0 0 12px 4px #b830ff99}.sr5 .pulse-dot{background:var(--s5);box-shadow:0 0 12px 4px #e8106099}.vu-wrap{display:flex;align-items:center;gap:.5rem;padding:.3rem 1.2rem 0}.vu-label{font-size:.5rem;color:#3214044d;letter-spacing:.18em;font-family:Courier New,monospace}.vu-track{flex:1;height:2px;background:#50280a33;border-radius:9999px;overflow:hidden}.vu-fill{height:100%;background:linear-gradient(90deg,#c06010,#e0b840);border-radius:9999px;transition:width .04s linear}.big-display{text-align:center;padding:.4rem 1.4rem .2rem;min-height:6rem;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}.big-name{font-family:Impact,Arial Narrow,sans-serif;font-size:5rem;line-height:1;animation:fadeIn .1s ease;transition:color .1s,text-shadow .1s}.big-name.c0{color:var(--s0);text-shadow:0 0 30px rgba(0,153,153,.8),0 0 70px rgba(0,153,153,.3),0 3px 12px rgba(0,0,0,.4)}.big-name.c1{color:var(--s1);text-shadow:0 0 30px rgba(26,127,255,.8),0 0 70px rgba(26,127,255,.3),0 3px 12px rgba(0,0,0,.4)}.big-name.c2{color:var(--s2);text-shadow:0 0 30px rgba(24,184,58,.8),0 0 70px rgba(24,184,58,.3),0 3px 12px rgba(0,0,0,.4)}.big-name.c3{color:var(--s3);text-shadow:0 0 30px rgba(232,48,16,.8),0 0 70px rgba(232,48,16,.3),0 3px 12px rgba(0,0,0,.4)}.big-name.c4{color:var(--s4);text-shadow:0 0 30px rgba(184,48,255,.8),0 0 70px rgba(184,48,255,.3),0 3px 12px rgba(0,0,0,.4)}.big-name.c5{color:var(--s5);text-shadow:0 0 30px rgba(232,16,96,.8),0 0 70px rgba(232,16,96,.3),0 3px 12px rgba(0,0,0,.4)}.pluck-hint{font-size:.6rem;letter-spacing:.35em;margin-top:.35rem;animation:blink 1.8s infinite;color:#32140459;font-family:Courier New,monospace}.ready-txt{font-family:Impact,Arial Narrow,sans-serif;font-size:2.5rem;color:#3c190433;letter-spacing:.2em}.progress-area{padding:0 1.2rem .35rem}.progress-dots{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap;padding:.3rem 0}.dot{width:1.7rem;height:1.7rem;border-radius:50%;border:2px solid rgba(80,40,10,.2);display:flex;align-items:center;justify-content:center;font-family:Impact,Arial Narrow,sans-serif;font-size:.88rem;color:#32140433;background:#1e0a0014;transition:all .12s}.dot.done0{border-color:#0099994d;color:#00999980;background:#00999912}.dot.done1{border-color:#1a7fff4d;color:#1a7fff80;background:#1a7fff12}.dot.done2{border-color:#18b83a4d;color:#18b83a80;background:#18b83a12}.dot.done3{border-color:#e830104d;color:#e8301080;background:#e8301012}.dot.done4{border-color:#b830ff4d;color:#b830ff80;background:#b830ff12}.dot.done5{border-color:#e810604d;color:#e8106080;background:#e8106012}.dot.active0{background:var(--s0);border-color:var(--s0);color:#000;box-shadow:0 0 10px #009999b3;width:2.1rem;height:2.1rem;font-size:1rem}.dot.active1{background:var(--s1);border-color:var(--s1);color:#fff;box-shadow:0 0 10px #1a7fffb3;width:2.1rem;height:2.1rem;font-size:1rem}.dot.active2{background:var(--s2);border-color:var(--s2);color:#000;box-shadow:0 0 10px #18b83ab3;width:2.1rem;height:2.1rem;font-size:1rem}.dot.active3{background:var(--s3);border-color:var(--s3);color:#fff;box-shadow:0 0 10px #e83010b3;width:2.1rem;height:2.1rem;font-size:1rem}.dot.active4{background:var(--s4);border-color:var(--s4);color:#fff;box-shadow:0 0 10px #b830ffb3;width:2.1rem;height:2.1rem;font-size:1rem}.dot.active5{background:var(--s5);border-color:var(--s5);color:#fff;box-shadow:0 0 10px #e81060b3;width:2.1rem;height:2.1rem;font-size:1rem}.prog-count{text-align:center;font-size:.57rem;color:#32140447;letter-spacing:.22em;margin-top:.15rem;font-family:Courier New,monospace}.controls{display:flex;gap:.8rem;padding:.65rem 1.2rem 2rem;background:var(--wood-light);border-top:1px solid var(--wood-border)}.btn-main{flex:1;font-family:Courier New,monospace;font-weight:700;font-size:.92rem;letter-spacing:.12em;text-transform:uppercase;border:none;border-radius:7px;padding:.92rem;cursor:pointer;transition:all .12s}.btn-main:active,.btn-reset:active{transform:scale(.97)}.btn-start{background:#1408008c;color:#e0b840;border:1px solid rgba(224,184,64,.35);box-shadow:0 0 20px #e0b8401f}.btn-pause{background:#14050099;color:#fa4;border:1px solid rgba(255,140,40,.3)}.btn-reset{background:#14080080;color:#c88c2866;border:1px solid rgba(200,140,40,.15);border-radius:7px;padding:.92rem 1.3rem;font-family:Courier New,monospace;font-size:1.1rem;cursor:pointer;transition:all .12s}.err-banner{display:none;padding:.5rem 1.4rem .6rem;text-align:center;font-size:.62rem;color:#c83c3ccc;letter-spacing:.1em;font-family:Courier New,monospace}.err-banner.show{display:block}.footer{text-align:center;font-size:.48rem;letter-spacing:.2em;padding:.3rem 0 max(.8rem,env(safe-area-inset-bottom));color:#32140433;background:var(--wood-light);font-family:Courier New,monospace}@keyframes good-flash{0%{background:#18b83a38}to{background:transparent}}@keyframes miss-flash{0%{background:#e8301029}to{background:transparent}}.practice-bar{padding:.7rem 1.2rem .65rem;background:var(--wood-dark);border-bottom:1px solid var(--wood-border);display:flex;flex-direction:column;gap:.6rem}.pbar-row{display:flex;align-items:center;gap:.55rem}.pbar-label{font-size:.5rem;color:#c69b4b59;letter-spacing:.22em;font-family:Courier New,monospace;text-transform:uppercase;width:2.8rem;flex-shrink:0}.mode-btns{display:flex;gap:.35rem}.mode-btn{font-family:Courier New,monospace;font-size:.62rem;font-weight:700;letter-spacing:.1em;padding:.32rem .9rem;border-radius:5px;cursor:pointer;background:#14080073;color:#c69b4b4d;border:1px solid rgba(195,138,38,.15);transition:all .12s}.mode-btn.on-follow{background:#e0b8401f;color:#e0b840;border-color:#e0b8406b}.mode-btn.on-tempo{background:#a58af81f;color:#a78bfa;border-color:#a58af86b}.mode-desc{font-size:.5rem;color:#c69b4b47;font-family:Courier New,monospace}.speed-btns{display:flex;gap:.35rem;flex:1}.speed-btn{flex:1;font-family:Courier New,monospace;font-size:.64rem;font-weight:700;padding:.34rem .2rem;border-radius:5px;cursor:pointer;text-align:center;background:#14080073;color:#c69b4b47;border:1px solid rgba(195,138,38,.15);transition:all .12s}.speed-btn.active{background:#e0b84024;color:#e0b840;border-color:#e0b84073;box-shadow:0 0 10px #e0b8401a}.speed-btn.tempo-active{background:#a58af824;color:#a78bfa;border-color:#a58af873}.speed-btn:disabled{opacity:.28;cursor:default}.beat-bar{height:3px;border-radius:9999px;background:#a58af81f;overflow:hidden}.beat-fill{height:100%;border-radius:9999px;transition:width .05s linear}.beat-fill.in-window{background:linear-gradient(90deg,#18b83a,#70e888)}.beat-fill.out-window{background:linear-gradient(90deg,#6030c0,#a78bfa)}.tempo-hint{font-size:.55rem;letter-spacing:.2em;color:#a58af88c;font-family:Courier New,monospace;margin-top:.2rem;animation:blink 1.2s infinite}.tool-tab{padding:14px 4px 6px}.tool-label{font:700 10px Helvetica Neue,Arial,sans-serif;letter-spacing:.14em;color:#f5e8c08c;margin:0 0 8px}.tool-tip{font-size:12px;font-style:italic;text-align:center;color:#f5e8c08c;margin-top:14px}.c-s0{fill:var(--s0)}.c-s1{fill:var(--s1)}.c-s2{fill:var(--s2)}.c-s3{fill:var(--s3)}.c-s4{fill:var(--s4)}.c-s5{fill:var(--s5)}.tuner-display{background:var(--wood-dark);border:1px solid var(--wood-border-hi);border-radius:14px;padding:22px 18px;text-align:center;margin-bottom:14px;box-shadow:0 4px 12px #00000040 inset}.tuner-note{font-family:Georgia,serif;font-size:68px;font-weight:400;line-height:1;color:var(--cream);letter-spacing:-.02em;min-height:68px}.tuner-note small{font-size:26px;color:#f5e8c080;margin-left:4px}.tuner-freq{font:600 11px Helvetica Neue,Arial,sans-serif;letter-spacing:.15em;color:#f5e8c08c;margin-top:6px;font-variant-numeric:tabular-nums}.tuner-meter{position:relative;height:50px;margin:18px 0 4px}.tuner-meter-bar{position:absolute;top:50%;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,rgba(245,232,192,.35) 20%,rgba(245,232,192,.35) 80%,transparent 100%);transform:translateY(-50%)}.tuner-meter-center{position:absolute;top:50%;left:50%;width:1px;height:18px;background:#f5e8c066;transform:translate(-50%,-50%)}.tuner-meter-needle{position:absolute;top:4px;width:3px;height:42px;background:var(--cream);border-radius:2px;transform:translate(-50%);transition:left .12s ease-out,background .2s,box-shadow .2s}.tuner-meter-needle.in-tune{background:#6ee04b;box-shadow:0 0 16px #6ee04bd9}.tuner-scale{display:flex;justify-content:space-between;font:600 9px Helvetica Neue,Arial,sans-serif;color:#f5e8c066;letter-spacing:.1em;padding:0 2px;font-variant-numeric:tabular-nums}.tuner-status{font:700 11px Helvetica Neue,Arial,sans-serif;letter-spacing:.18em;color:#f5e8c0a6;margin-top:14px;min-height:16px}.tuner-status.tuned{color:#6ee04b}.mic-big-btn{width:100%;padding:14px;background:linear-gradient(180deg,#d19040,#a06a14);color:var(--cream);border:1px solid var(--wood-border-hi);border-radius:12px;font:700 13px Helvetica Neue,Arial,sans-serif;letter-spacing:.18em;cursor:pointer;box-shadow:0 3px #32120059,0 1px #ffffff1f inset;transition:transform .06s,filter .15s;-webkit-tap-highlight-color:transparent}.mic-big-btn:hover{filter:brightness(1.08)}.mic-big-btn:active{transform:translateY(1px);box-shadow:0 1px #3212004d}.mic-big-btn.on{background:linear-gradient(180deg,#7a2218,#551008)}.tuner-strings{margin-top:18px}.string-ref-row{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.string-ref-btn{padding:10px 2px;background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:10px;color:var(--cream);cursor:pointer;display:flex;flex-direction:column;align-items:center;transition:border-color .15s,background .15s;font-family:Georgia,serif;-webkit-tap-highlight-color:transparent}.string-ref-btn:hover{border-color:var(--wood-border-hi);background:#2d1000e6}.string-ref-btn:active{transform:translateY(1px)}.string-ref-btn .s-label{font-size:18px;font-weight:700;line-height:1}.string-ref-btn .s-sub{font:400 8.5px Helvetica Neue,Arial,sans-serif;letter-spacing:.08em;color:#f5e8c080;margin-top:3px}.string-ref-btn.s0 .s-label{color:var(--s0)}.string-ref-btn.s1 .s-label{color:var(--s1)}.string-ref-btn.s2 .s-label{color:var(--s2)}.string-ref-btn.s3 .s-label{color:var(--s3)}.string-ref-btn.s4 .s-label{color:var(--s4)}.string-ref-btn.s5 .s-label{color:var(--s5)}.chord-cat-row{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px}.chord-cat{flex:1 1 auto;min-width:60px;padding:8px 10px;background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:8px;color:#f5e8c0a6;font:700 10px Helvetica Neue,Arial,sans-serif;letter-spacing:.14em;cursor:pointer;transition:all .15s;-webkit-tap-highlight-color:transparent}.chord-cat:hover{color:var(--cream);border-color:var(--wood-border-hi)}.chord-cat.active{background:linear-gradient(180deg,#b87820,#8c5612);color:var(--cream);border-color:var(--wood-border-hi)}.chord-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(115px,1fr));gap:10px}.chord-card{background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:12px;padding:10px 8px 8px;text-align:center;cursor:pointer;font-family:Georgia,serif;color:var(--cream);transition:all .15s ease;-webkit-tap-highlight-color:transparent}.chord-card:hover{border-color:var(--wood-border-hi);background:#2d1000e6;transform:translateY(-1px)}.chord-card:active{transform:translateY(0)}.chord-name{font-size:17px;font-weight:700;margin-bottom:4px;letter-spacing:.01em}.chord-svg{display:block}.chord-svg .chord-nut{stroke:var(--cream);stroke-width:3}.chord-svg .chord-fret,.chord-svg .chord-string{stroke:#f5e8c059;stroke-width:1}.chord-svg .chord-dot{stroke:#00000059;stroke-width:.5}.chord-svg .chord-open{stroke-width:1.2;stroke-opacity:.9}.chord-svg .chord-open.c-s0,.chord-svg .chord-open.c-s1,.chord-svg .chord-open.c-s2,.chord-svg .chord-open.c-s3,.chord-svg .chord-open.c-s4,.chord-svg .chord-open.c-s5{fill:none}.chord-svg .chord-open.c-s0{stroke:var(--s0)}.chord-svg .chord-open.c-s1{stroke:var(--s1)}.chord-svg .chord-open.c-s2{stroke:var(--s2)}.chord-svg .chord-open.c-s3{stroke:var(--s3)}.chord-svg .chord-open.c-s4{stroke:var(--s4)}.chord-svg .chord-open.c-s5{stroke:var(--s5)}.chord-svg .chord-muted{font-family:Helvetica Neue,Arial,sans-serif;font-size:11px;font-weight:700;fill:#f5e8c08c}.metro-display{text-align:center;background:var(--wood-dark);border:1px solid var(--wood-border-hi);border-radius:14px;padding:18px 14px;margin-bottom:14px}.metro-bpm{font-family:Georgia,serif;font-size:58px;font-weight:400;line-height:1;color:var(--cream);letter-spacing:-.02em;font-variant-numeric:tabular-nums}.metro-bpm-label{font:700 10px Helvetica Neue,Arial,sans-serif;letter-spacing:.2em;color:#f5e8c08c;margin-top:4px}.metro-slider{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:#f5e8c033;border-radius:2px;margin:8px 0 14px}.metro-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#d19040;border:2px solid #2e1404;cursor:pointer}.metro-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#d19040;border:2px solid #2e1404;cursor:pointer}.metro-dots{display:flex;justify-content:center;gap:12px;margin:14px 0 16px}.metro-dot{width:14px;height:14px;border-radius:50%;background:#f5e8c026;transition:all .08s ease}.metro-dot.on{background:#d19040;transform:scale(1.5);box-shadow:0 0 12px #d19040cc}.metro-dot.down.on{background:#f5e8c0;box-shadow:0 0 16px #f5e8c0d9}.metro-btn-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.metro-main{padding:13px;background:linear-gradient(180deg,#d19040,#a06a14);color:var(--cream);border:1px solid var(--wood-border-hi);border-radius:10px;font:700 12px Helvetica Neue,Arial,sans-serif;letter-spacing:.18em;cursor:pointer;box-shadow:0 3px #32120059,0 1px #ffffff1f inset;transition:transform .06s,filter .15s;-webkit-tap-highlight-color:transparent}.metro-main.on{background:linear-gradient(180deg,#7a2218,#551008)}.metro-main:active{transform:translateY(1px);box-shadow:0 1px #3212004d}.metro-tap{padding:13px;background:var(--wood-dark);color:var(--cream);border:1px solid var(--wood-border);border-radius:10px;font:700 12px Helvetica Neue,Arial,sans-serif;letter-spacing:.18em;cursor:pointer;transition:all .15s;-webkit-tap-highlight-color:transparent}.metro-tap:hover{border-color:var(--wood-border-hi);background:#2d1000e6}.metro-tap:active{transform:translateY(1px)}.metro-meter-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.metro-meter-btn{padding:10px 6px;background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:8px;color:#f5e8c0bf;font:700 12px Georgia,serif;cursor:pointer;transition:all .15s;-webkit-tap-highlight-color:transparent}.metro-meter-btn.active{background:linear-gradient(180deg,#b87820,#8c5612);color:var(--cream);border-color:var(--wood-border-hi)}.metro-preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:6px}.metro-preset{padding:9px 6px;background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:8px;color:var(--cream);cursor:pointer;text-align:center;transition:all .15s;-webkit-tap-highlight-color:transparent;display:flex;flex-direction:column;align-items:center;gap:2px}.metro-preset.active{border-color:var(--wood-border-hi);background:#502000d9}.metro-preset-bpm{font:700 14px Georgia,serif}.metro-preset-label{font:400 9.5px Helvetica Neue,Arial,sans-serif;font-style:italic;color:#f5e8c08c;letter-spacing:.05em}.timer-tab{text-align:center}.timer-ring-wrap{position:relative;width:220px;height:220px;margin:4px auto 16px}.timer-svg{width:220px;height:220px;transform:rotate(-90deg)}.timer-track{stroke:#f5e8c01f;fill:none;stroke-width:4}.timer-progress{stroke:#d19040;fill:none;stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset 1s linear;filter:drop-shadow(0 0 4px rgba(209,144,64,.5))}.timer-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.timer-display{font-family:Georgia,serif;font-size:52px;font-weight:400;color:var(--cream);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}.timer-label{font:700 10px Helvetica Neue,Arial,sans-serif;letter-spacing:.2em;color:#f5e8c08c;margin-top:4px}.timer-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}.timer-preset-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.timer-preset{padding:10px 6px;background:var(--wood-dark);border:1px solid var(--wood-border);border-radius:8px;color:var(--cream);font:700 12px Helvetica Neue,Arial,sans-serif;letter-spacing:.1em;cursor:pointer;transition:all .15s;-webkit-tap-highlight-color:transparent}.timer-preset.active{background:linear-gradient(180deg,#b87820,#8c5612);border-color:var(--wood-border-hi)}