.donate-trigger{color:#fff;cursor:pointer;background:linear-gradient(135deg,#6b46c1,#9f7aea);border:none;border-radius:999px;align-items:center;gap:.4rem;padding:.45rem 1rem;font-size:.85rem;font-weight:600;transition:opacity .15s,transform .15s;display:inline-flex}.donate-trigger:hover{opacity:.9;transform:scale(1.04)}.donate-trigger-icon{font-size:1rem}.donate-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0009;justify-content:center;align-items:center;animation:.15s fade-in;display:flex;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.donate-modal{background:#1a1a2e;border:1px solid #9f7aea4d;border-radius:1.25rem;width:min(420px,92vw);padding:2rem;animation:.2s slide-up;position:relative;box-shadow:0 0 40px #6b46c159}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.donate-close{color:#888;cursor:pointer;background:0 0;border:none;font-size:1.1rem;line-height:1;transition:color .15s;position:absolute;top:1rem;right:1rem}.donate-close:hover{color:#fff}.donate-header{text-align:center;margin-bottom:1.5rem}.donate-emoji{margin-bottom:.5rem;font-size:2.5rem;display:block}.donate-header h2{color:#e2d9f3;margin:0 0 .4rem;font-size:1.25rem}.donate-header p{color:#9ca3af;margin:0;font-size:.88rem}.donate-amounts{justify-content:center;gap:.6rem;margin-bottom:1rem;display:flex}.donate-amount-btn{color:#d1c4e9;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:.6rem;flex:1;padding:.55rem 0;font-size:1rem;font-weight:600;transition:background .15s,border-color .15s,color .15s}.donate-amount-btn:hover{background:#9f7aea26;border-color:#9f7aea}.donate-amount-btn.active{color:#fff;background:#6b46c166;border-color:#9f7aea}.donate-custom{background:#ffffff0d;border:1px solid #ffffff1f;border-radius:.6rem;align-items:center;margin-bottom:1.25rem;padding:0 .75rem;transition:border-color .15s;display:flex}.donate-custom:focus-within{border-color:#9f7aea}.donate-currency{color:#9ca3af;-webkit-user-select:none;user-select:none;font-size:1rem}.donate-custom input{color:#e2d9f3;background:0 0;border:none;outline:none;flex:1;padding:.65rem .5rem;font-size:1rem}.donate-custom input::placeholder{color:#6b7280}.donate-warning{color:#f59e0b;text-align:center;margin-bottom:.75rem;font-size:.8rem}.donate-warning code{background:#f59e0b26;border-radius:3px;padding:0 3px}.donate-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg,#6b46c1,#9f7aea);border:none;border-radius:.75rem;width:100%;margin-bottom:.75rem;padding:.75rem;font-size:1rem;font-weight:700;transition:opacity .15s,transform .1s}.donate-submit:hover:not(:disabled){opacity:.9;transform:scale(1.01)}.donate-submit:disabled{opacity:.45;cursor:not-allowed}.donate-secure{text-align:center;color:#6b7280;justify-content:center;align-items:center;gap:.3rem;margin:0;font-size:.78rem;display:flex}.chord-buttons{grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.chord-btn{color:#fff6;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff14;border-radius:10px;justify-content:center;align-items:center;height:48px;font-family:inherit;font-size:1rem;font-weight:800;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.chord-btn-inner{z-index:2;transition:transform .2s}.chord-btn:hover{color:#fff;background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.note-led{z-index:10;background:#0f172a;border:1.5px solid #ffffff1a;border-radius:50%;width:9px;height:9px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:6px;right:6px;box-shadow:inset 0 1px 2px #000c,0 0 1px #ffffff1a}.chord-btn.active{color:#fff;background:#ffffff14;border-color:#fff3;box-shadow:0 4px 15px #0000004d}.chord-btn.active .note-led{background:#00f2fe;border-color:#fff;transform:scale(1.1);box-shadow:0 0 12px #00f2fe,0 0 25px #00f2fecc,0 0 45px #00f2fe66,inset 0 0 4px #fff}.chord-btn.active.is-accidental .note-led{background:#f093fb;border-color:#fff;box-shadow:0 0 12px #f093fb,0 0 25px #f093fbcc,0 0 45px #f093fb66,inset 0 0 4px #fff}.chord-btn.is-accidental{background:#00000040;font-size:.9rem}.chord-btn:active{transition:all .1s;transform:translateY(0)scale(.95)}@keyframes ledBloom{0%{opacity:1;box-shadow:0 0 12px currentColor, 0 0 25px rgba(currentColor, .8);transform:scale(1.1)}50%{opacity:.8;box-shadow:0 0 20px currentColor, 0 0 40px rgba(currentColor, .6);transform:scale(1.25)}to{opacity:1;box-shadow:0 0 12px currentColor, 0 0 25px rgba(currentColor, .8);transform:scale(1.1)}}.chord-btn.active .note-led{animation:2s ease-in-out infinite ledPulse}@keyframes ledPulse{0%{filter:brightness()contrast();transform:scale(1.1)}50%{filter:brightness(1.5)contrast(1.2);transform:scale(1.2)}to{filter:brightness()contrast();transform:scale(1.1)}}.type-buttons-grid{grid-template-columns:repeat(3,1fr);gap:.5rem;width:100%;display:grid}.type-btn-card{aspect-ratio:1.1;color:#fff9;cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff05;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:.4rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.type-btn-highlight{opacity:0;background:linear-gradient(135deg,#ffffff0f 0%,#0000 100%);transition:opacity .3s;position:absolute;inset:0}.type-btn-card:hover{color:#fff;background:#ffffff0f;border-color:#fff3;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.type-btn-card:hover .type-btn-highlight{opacity:1}.type-btn-card.active{color:#fff;background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%);border-color:#0000;transform:translateY(-2px);box-shadow:0 4px 15px #f5576c66}.type-symbol{z-index:1;text-shadow:0 1px 4px #0006;margin-bottom:2px;font-size:.95rem;font-weight:900;line-height:1}.type-name{opacity:.6;text-transform:uppercase;letter-spacing:.2px;text-align:center;white-space:nowrap;text-overflow:ellipsis;z-index:1;width:100%;font-size:.45rem;font-weight:800;overflow:hidden}.active .type-name{opacity:.95}.type-btn-card:active{transition:all .1s;transform:translateY(0)scale(.96)}.tuning-container{flex-direction:column;gap:1.25rem;display:flex}.tuning-presets{flex-wrap:wrap;gap:.5rem;display:flex}.tuning-preset-btn{color:#e2e8f0;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:#ffffff08;border:1px solid #ffffff14;border-radius:8px;padding:.5rem .8rem;font-size:.75rem;font-weight:600;transition:all .2s}.tuning-preset-btn:hover{background:#ffffff14;border-color:#fff3}.tuning-preset-btn.active{color:#fff;background:linear-gradient(135deg,#6366f1 0%,#a855f7 100%);border-color:#0000;box-shadow:0 4px 12px #6366f14d}.tuning-custom-wrapper{align-items:center;gap:1rem;display:flex}.tuning-label{color:#fff6;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;font-size:.7rem;font-weight:700}.tuning-strings{scrollbar-width:thin;gap:.5rem;padding-bottom:.5rem;display:flex;overflow-x:auto}.tuning-string{flex-direction:column;align-items:center;gap:.35rem;min-width:44px;display:flex}.tuning-string-num{color:#ffffff4d;font-size:.6rem;font-weight:800}.tuning-select{color:#fff;cursor:pointer;appearance:none;text-align:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;outline:none;width:100%;padding:.4rem .3rem;font-size:.8rem;font-weight:700;transition:all .2s}.tuning-select:hover{background:#ffffff1a;border-color:#fff3}.tuning-select:focus{border-color:#6366f1}.tuning-select option{color:#fff;background:#1a1a24}.degree-buttons{grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.degree-btn{color:#fff;cursor:pointer;text-align:left;background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;align-items:center;padding:.5rem .75rem;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.degree-btn:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.degree-btn.active{background:var(--degree-color-alpha);border-color:var(--degree-color);box-shadow:0 4px 12px var(--degree-color-alpha)}.degree-content{align-items:center;gap:.65rem;width:100%;display:flex}.degree-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;transition:all .2s}.degree-texts{flex-direction:column;gap:1px;display:flex;overflow:hidden}.degree-note-name{color:#fff;font-size:1.1rem;font-weight:900;line-height:1}.degree-subtitle{opacity:.5;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;text-overflow:ellipsis;font-size:.55rem;font-weight:700;overflow:hidden}.active .degree-subtitle{opacity:.8}@media (width<=1400px){.degree-buttons{grid-template-columns:repeat(2,1fr)}}.fretboard-container{width:100%;margin-top:.5rem}.fretboard-wrapper{scrollbar-width:thin;scrollbar-color:#fff3 transparent;padding-bottom:24px;display:flex;overflow-x:auto}.fretboard-wrapper::-webkit-scrollbar{height:6px}.fretboard-wrapper::-webkit-scrollbar-track{background:0 0}.fretboard-wrapper::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.string-labels{flex-direction:column;flex-shrink:0;justify-content:flex-start;width:30px;margin-right:8px;display:flex}.string-label{color:#fff6;justify-content:center;align-items:center;height:36px;font-size:.75rem;font-weight:800;display:flex}.fretboard{background:linear-gradient(#120a05 0%,#21120b 20%,#2c1a11 40%,#21120b 60%,#120a05 100%);border:1px solid #ffffff0d;border-radius:6px;flex-shrink:0;display:flex;position:relative}.nut{z-index:5;background:linear-gradient(#e5e0d8,#c4bfb4,#e5e0d8);border-radius:1px;width:5px;position:absolute;top:0;bottom:0;left:54px;box-shadow:2px 0 6px #0006}.fret-column{flex-direction:column;flex-shrink:0;width:65px;display:flex;position:relative}.fret-column.open-strings{width:54px}.fret-cell{justify-content:center;align-items:center;height:36px;display:flex;position:relative}.string-line{background:linear-gradient(90deg,#c0ac8c66,#dcc8aab3,#c0ac8c66);position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.string-thickness-0{opacity:.8;height:3.2px}.string-thickness-1{opacity:.85;height:2.8px}.string-thickness-2{opacity:.9;height:2.4px}.string-thickness-3{opacity:.95;height:2px}.string-thickness-4{opacity:1;height:1.6px}.string-thickness-5{opacity:1;height:1.2px}.string-thickness-6{opacity:1;height:1px}.string-thickness-7{opacity:1;height:.8px}.note-marker{z-index:10;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;animation:.3s cubic-bezier(.34,1.56,.64,1) both markerAppear;display:flex;position:relative}@keyframes markerAppear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.marker-content{flex-direction:column;align-items:center;line-height:1;display:flex}.marker-note{color:#fff;text-shadow:0 1px 2px #00000080;font-size:.75rem;font-weight:900}.marker-degree-tag{color:#ffffffd1;text-transform:uppercase;font-size:.45rem;font-weight:700}.fret-wire{z-index:3;background:linear-gradient(#c8c3b433,#dcd7c880,#c8c3b433);width:2px;position:absolute;top:0;bottom:0;right:0}.fret-number{color:#ffffff40;font-size:.65rem;font-weight:700;position:absolute;bottom:-18px;left:50%;transform:translate(-50%)}.fret-markers-row{opacity:.6;margin-top:1rem;display:flex}.marker-spacer{flex-shrink:0;width:32px}.markers-track{display:flex}.marker-slot{flex-shrink:0;justify-content:center;width:65px;display:flex}.marker-slot:first-child{width:54px}.fret-marker-dots{gap:4px;display:flex}.fret-dot{background:#ffffff1a;border-radius:50%;width:6px;height:6px}@media (width<=1400px){.fret-column,.marker-slot{width:55px}}:root{--primary-gradient:linear-gradient(135deg, #6366f1 0%, #a855f7 100%);--secondary-gradient:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--accent-gradient:linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);--glass-bg:#ffffff08;--glass-border:#ffffff14;--glass-hover:#ffffff0f;--header-height:64px}.app{background:#0a0a0f;flex-direction:column;height:100vh;display:flex;position:relative;overflow:hidden}.app-glow{pointer-events:none;z-index:0;position:absolute;inset:0}.glow-1{filter:blur(80px);background:radial-gradient(circle,#6366f11f 0%,#0000 70%);width:40%;height:40%;position:absolute;top:-10%;left:20%}.glow-2{filter:blur(80px);background:radial-gradient(circle,#a855f714 0%,#0000 70%);width:40%;height:40%;position:absolute;bottom:0%;right:10%}.app-header{height:var(--header-height);border-bottom:1px solid var(--glass-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:20;background:#0a0a0fd9;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 1.5rem;display:flex}.app-title-container{align-items:center;gap:.75rem;display:flex}.app-title{-webkit-text-fill-color:transparent;letter-spacing:-.5px;background:linear-gradient(135deg,#fff 0%,#c4b5fd 100%);-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.25rem;font-weight:900}.app-logo{object-fit:contain;filter:drop-shadow(0 0 8px #6366f166);width:auto;height:28px;transition:transform .3s}.app-logo:hover{transform:scale(1.1)rotate(-5deg)}.current-chord-badge{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:99px;align-items:center;gap:.5rem;padding:.4rem 1rem;display:flex}.chord-label{color:#fff6;text-transform:uppercase;letter-spacing:.5px;font-size:.65rem;font-weight:700}.chord-name{background:var(--secondary-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.1rem;font-weight:900}.app-main{z-index:10;flex:1;grid-template-rows:1fr auto;grid-template-columns:280px 1fr;gap:1rem;padding:1rem;display:grid;overflow:hidden}.controls-sidebar{scrollbar-width:none;flex-direction:column;grid-area:1/1/span 2;gap:1rem;padding-right:.25rem;display:flex;overflow:hidden auto}.controls-sidebar::-webkit-scrollbar{width:4px}.controls-sidebar::-webkit-scrollbar-thumb{background:#ffffff0d;border-radius:2px}.main-content{flex-direction:column;grid-area:1/2/span 2;gap:1rem;display:flex;overflow:hidden}.content-top{grid-template-columns:1fr 1fr;gap:1rem;min-height:200px;display:grid}.content-bottom{margin-top:auto}.control-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:12px;padding:.75rem;transition:border-color .3s}.section-title{color:#ffffff59;text-transform:uppercase;letter-spacing:1px;align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.75rem;font-weight:800;display:flex}.section-title:after{content:"";background:linear-gradient(90deg, var(--glass-border), transparent);flex:1;height:1px}.string-buttons-grid{grid-template-columns:repeat(5,1fr);gap:.35rem;display:grid}.string-btn-sm{background:var(--glass-bg);border:1px solid var(--glass-border);color:#fff;cursor:pointer;border-radius:10px;flex-direction:column;align-items:center;padding:.35rem;transition:all .2s;display:flex}.string-btn-sm:hover{background:var(--glass-hover);border-color:#fff3}.string-btn-sm.active{background:var(--accent-gradient);color:#000;border-color:#0000;transform:translateY(-1px);box-shadow:0 4px 12px #43e97b4d}.string-num{font-size:.9rem;font-weight:900}.string-type{opacity:.7;font-size:.55rem;font-weight:600}@media (width<=1100px){.app-main{grid-template-columns:1fr;overflow-y:auto}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#e2e8f0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a0f;background-image:radial-gradient(at 20%,#667eea0f 0%,#0000 50%),radial-gradient(at 80% 20%,#764ba20f 0%,#0000 50%),radial-gradient(at 50% 80%,#ec48990a 0%,#0000 50%);background-position:0 0;background-repeat:repeat;background-size:auto;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#root{min-height:100vh}button{font-family:inherit}::selection{color:#fff;background:#667eea66}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff05}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}