body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}html,body{margin:0;padding:0;height:100%;width:100%;max-width:100vw;overflow-x:hidden;background-color:var(--theme-bg, #f8f9fa);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box}*,*:before,*:after{box-sizing:border-box}.btn-primary,button.primary{background-color:var(--theme-accent, var(--custom-tuning-color, #007bff))!important;border-color:var(--theme-accent, var(--custom-tuning-color, #007bff))!important}.btn-primary:hover,button.primary:hover{background-color:var(--theme-link-hover, var(--custom-tuning-color, #007bff))!important;border-color:var(--theme-link-hover, var(--custom-tuning-color, #007bff))!important}a{color:var(--theme-link-color, var(--custom-tuning-color, #007bff));transition:color .2s ease}a:hover{color:var(--theme-link-hover, var(--custom-tuning-color, #0056b3))}.card,.content-card,.section-card{background:var(--theme-container-bg, #ffffff);color:var(--theme-container-text, #2c3e50)}.App{text-align:center}.App-logo{position:relative;top:-35vh;left:45vw;height:10vmin;pointer-events:none}@media(prefers-reduced-motion:no-preference){.accordion{animation:App-logo-spin infinite 20s linear}}.App-header{background-color:#282c34;width:100%;max-width:100vw;height:100vh;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff;box-sizing:border-box}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.app-container{width:100%;max-width:100vw;min-height:100vh;overflow-x:hidden;display:flex;flex-direction:column}.main-content{flex:1;width:100%;max-width:100vw;overflow-x:hidden;padding-top:0}.main-content>*{max-width:100vw;overflow-x:hidden}@media(max-width:768px){.app-container,.main-content{padding:0;margin:0}}.app-container,.main-content,.navbar{box-sizing:border-box}html{scroll-behavior:auto!important}.main-content{scroll-margin-top:0;scroll-padding-top:0}.navbar{position:sticky;top:0;z-index:50;background:var(--theme-navbar, #111);color:var(--theme-navbar-text, #fff);display:flex;align-items:center;padding:.5rem 1rem;height:56px;width:100%;max-width:100vw;box-sizing:border-box;overflow:visible;border-bottom:1px solid color-mix(in srgb,var(--theme-navbar-text, #fff) 15%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px color-mix(in srgb,var(--theme-navbar, #111) 50%,black)}.nav-header{display:flex;justify-content:space-between;align-items:center;width:100%}.nav-right{display:flex;align-items:center;gap:1rem}.logo{margin:0;color:var(--theme-navbar-text, #fff);text-decoration:none;font-size:1.3rem;font-weight:600;text-shadow:0 1px 2px color-mix(in srgb,var(--theme-navbar, #111) 80%,black)}.menu-btn{background:none;border:none;color:inherit;font-size:1.6rem;cursor:pointer}.nav-desktop{display:none;align-items:center;gap:2rem}@media(min-width:768px){.nav-desktop{display:flex}.menu-btn{display:none}}.nav-link{color:var(--theme-navbar-text, #fff);text-decoration:none;font-weight:500;padding:.5rem 0;transition:all .2s;text-shadow:0 1px 2px color-mix(in srgb,var(--theme-navbar, #111) 80%,black)}.nav-link:hover{opacity:.85;text-shadow:0 1px 3px color-mix(in srgb,var(--theme-navbar, #111) 90%,black)}.admin-link{background:linear-gradient(135deg,#dc3545,#c82333)!important;color:#fff!important;padding:.5rem 1rem!important;border-radius:6px!important;font-weight:600!important;transition:all .2s!important;text-shadow:0 1px 2px rgba(0,0,0,.8)!important}.admin-link:hover{background:linear-gradient(135deg,#c82333,#a71e2a)!important;transform:translateY(-1px)!important;box-shadow:0 2px 8px #dc35454d!important;text-shadow:0 1px 3px rgba(0,0,0,.9)!important;color:#f0f0f0!important}.instruments-menu{position:relative}.nav-dropdown-btn{background:none!important;background-color:transparent!important;border:none;color:var(--theme-navbar-text, #fff);font-weight:500;font-size:inherit;font-family:inherit;cursor:pointer;padding:.5rem 0;display:flex;align-items:center;gap:.5rem;transition:all .2s;text-decoration:none;outline:none;text-shadow:0 1px 2px color-mix(in srgb,var(--theme-navbar, #111) 80%,black);box-shadow:none!important;-webkit-appearance:none;-moz-appearance:none;appearance:none}.nav-dropdown-btn:hover{opacity:.85;text-shadow:0 1px 3px color-mix(in srgb,var(--theme-navbar, #111) 90%,black);background:none;background-color:transparent}.nav-dropdown-btn:focus{outline:none;opacity:.85;text-shadow:0 1px 3px color-mix(in srgb,var(--theme-navbar, #111) 90%,black);background:none;background-color:transparent}.nav-dropdown-btn .chevron{font-size:.7rem;transition:transform .2s;will-change:transform;display:inline-block;color:var(--theme-navbar-text, #fff);opacity:.9;background:none!important;background-color:transparent!important;padding:0!important;margin:0 0 0 .35rem!important;border:none!important;box-shadow:none!important;vertical-align:baseline;line-height:inherit;position:relative;top:-.05em}.nav-dropdown-btn .chevron.open{transform:rotate3d(0,0,1,180deg)}.nav-dropdown-btn:hover .chevron,.nav-dropdown-btn:focus .chevron{background:none!important;background-color:transparent!important}.nav-dropdown-btn span{background:none!important;background-color:transparent!important}.nav-dropdown{position:absolute;top:100%;left:50%;transform:translate(40%);background:var(--theme-card-bg, white);color:var(--theme-text, #2d3748);border-radius:12px;box-shadow:0 8px 24px #0003,0 2px 6px #0000001a;min-width:280px;z-index:1000;overflow:hidden;margin-top:.75rem;border:1px solid var(--theme-border, rgba(0, 0, 0, .08))}.nav-dropdown-instruments{position:absolute;top:100%;left:50%;transform:translate(-20%);background:var(--theme-card-bg, white);color:var(--theme-text, #2d3748);border-radius:12px;box-shadow:0 8px 24px #0003,0 2px 6px #0000001a;min-width:280px;z-index:1000;overflow:hidden;margin-top:.75rem;border:1px solid var(--theme-border, rgba(0, 0, 0, .08))}.dropdown-grid{display:grid;grid-template-columns:1fr;gap:0}.instrument-section{padding:1rem 0;border-bottom:1px solid var(--theme-border, #f0f0f0)}.instrument-section:last-child{border-bottom:none}.instrument-section-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--theme-text-secondary, #6c757d);padding:0 1.25rem .5rem;margin:0}.nav-dropdown .dropdown-item{display:flex;align-items:center;padding:.65rem 1.25rem;color:var(--theme-text, #2d3748);text-decoration:none;transition:all .15s ease;border:none;width:100%;text-align:left;font-size:.9rem;line-height:1.4;background:none;cursor:pointer;border-left:3px solid transparent}.nav-dropdown .dropdown-item:hover{background-color:var(--theme-hover-bg, #f8f9fa);border-left-color:var(--theme-accent, #007bff);padding-left:1.5rem}.nav-dropdown .dropdown-item:active{background-color:var(--theme-hover-bg, #e9ecef)}.mobile-subsection-header{font-weight:600;font-size:.85rem;color:#6c757d;padding:.5rem 1rem;text-transform:uppercase;letter-spacing:.5px;background-color:#ffffff0d}.auth-btn{background:#19c37d;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .2s}.auth-btn:hover{background:#16a085}.auth-btn.mobile{width:100%;margin-top:.5rem}.auth-btn.desktop{white-space:nowrap}.user-menu{position:relative;z-index:100}.user-menu:after{content:"";position:absolute;top:100%;right:0;width:100%;height:.5rem;background:transparent;z-index:59;pointer-events:none}.user-menu-btn{display:flex;align-items:center;gap:.5rem;background:none;border:none;color:var(--theme-navbar-text, #fff);cursor:pointer;padding:.5rem .75rem;border-radius:6px;transition:all .2s;font-size:.9rem;text-shadow:0 1px 2px color-mix(in srgb,var(--theme-navbar, #111) 80%,black)}.user-menu-btn:hover{background:color-mix(in srgb,var(--theme-navbar-text, #fff) 15%,transparent);opacity:.9;text-shadow:0 1px 3px color-mix(in srgb,var(--theme-navbar, #111) 90%,black)}.welcome-text{font-weight:500;white-space:nowrap;text-shadow:0 1px 2px color-mix(in srgb,var(--theme-navbar, #111) 80%,black)}.user-avatar{width:32px;height:32px;border-radius:50%;background:#19c37d;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem}.user-avatar.small{width:24px;height:24px;font-size:.8rem}.user-name{font-size:.9rem;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chevron{transition:transform .2s ease;font-size:.7rem;display:inline-block;line-height:1;color:var(--theme-navbar-text, #fff);opacity:.9}.chevron.open{transform:rotate(180deg)}.user-dropdown{position:absolute;top:100%;right:0;background:var(--theme-container-bg)!important;color:var(--theme-text, #191e25);border:1px solid var(--theme-border, #e5e7eb);border-radius:6px;box-shadow:0 10px 15px -3px #0003;min-width:220px;max-width:250px;z-index:1000;margin-top:.5rem;pointer-events:auto;overflow:hidden;opacity:1;visibility:visible}.dropdown-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;color:var(--theme-navbar-text, #2d3748);text-decoration:none;transition:background-color .2s;border:none;background:none;width:100%;text-align:left;cursor:pointer;font-size:.9rem;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropdown-item:hover{background:var(--theme-hover-bg, #f8f9fa);background-clip:padding-box}.logout-btn{border-top:1px solid var(--theme-border, #e5e7eb);margin-top:.25rem;padding-top:1rem}.user-link{display:flex!important;align-items:center;gap:.75rem;color:#fff!important}.nav-divider{height:1px;background:#ffffff40;margin:.5rem 0;border:none}.mobile-section-header{font-weight:600;font-size:.9rem;color:#fffc!important;text-transform:uppercase;letter-spacing:1px;padding:.5rem .25rem .25rem!important;border-bottom:1px solid rgba(255,255,255,.3)!important;margin-top:.5rem}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:49}.nav-panel{position:fixed;top:0;right:0;bottom:0;width:100%;max-width:320px;z-index:500;list-style:none;margin:0;padding:1rem 1.5rem 2rem;background:#001f12;color:#fff;transition:transform .26s ease,opacity .26s ease;will-change:transform,opacity;transform:translate3d(100%,0,0);box-shadow:-4px 0 24px #00000040;height:100vh;height:100dvh;min-height:100vh;min-height:100dvh;max-height:100vh;max-height:100dvh;overflow-y:auto}.nav-panel.open{transform:translateZ(0);opacity:1}.nav-panel.closed{transform:translate3d(100%,0,0);opacity:0}.nav-panel li{border-bottom:1px solid rgba(255,255,255,.25);margin-bottom:.25rem}.nav-panel li:last-child{border-bottom:none}.nav-panel a{display:block;padding:1rem .5rem;color:#fff;text-decoration:none;font-size:1.1rem;border-radius:6px;transition:background-color .2s ease}.nav-panel a:hover{background:#ffffff1a}@media(max-width:768px){.welcome-text{max-width:120px;overflow:hidden;text-overflow:ellipsis}.user-dropdown{min-width:200px;max-width:220px}}@media(max-width:480px){.navbar{padding:.5rem;width:100%;box-sizing:border-box;overflow:visible}.nav-header{width:100%;min-width:0;gap:.5rem}.logo{font-size:1.1rem;min-width:0;flex-shrink:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-right{gap:.5rem;flex-shrink:0;position:relative}.nav-panel{width:100vw;max-width:100vw;left:0;right:0;padding:1rem;box-sizing:border-box;height:100vh;height:100dvh;min-height:100vh;min-height:100dvh}.welcome-text{display:none}.user-menu-btn{padding:.25rem .5rem;min-width:0}.user-menu{position:relative;z-index:0}.user-dropdown{position:absolute;top:100%;right:0;width:250px;max-width:calc(100vw - 1rem);min-width:200px;box-sizing:border-box;z-index:10;margin-top:.5rem;background:var(--theme-container-bg)!important;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 10px 15px -3px #0000001a;overflow:hidden}.dropdown-item{padding:.75rem;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@media(min-width:800px){.navbar{padding:.5rem 2rem;height:56px}.nav-panel{width:380px;max-width:380px;padding:2rem 2rem 3rem;height:100vh;height:100dvh;min-height:100vh;min-height:100dvh}.nav-panel a{font-size:1.2rem;padding:1.25rem 1rem}.mobile-section-header{font-size:1rem;padding:1rem 1rem .5rem!important}}@media(prefers-reduced-motion:reduce){.nav-panel{transition:none}}@media screen and (min-width:768px)and (max-width:1920px)and (min-resolution:96dpi){.navbar{background:linear-gradient(180deg,var(--theme-navbar, #111) 0%,color-mix(in srgb,var(--theme-navbar, #111) 95%,black) 100%)}.logo,.nav-link,.nav-dropdown-btn,.welcome-text,.user-menu-btn{font-weight:600!important;text-shadow:0 1px 3px color-mix(in srgb,var(--theme-navbar, #111) 90%,black)!important;z-index:1}.nav-link,.nav-dropdown-btn{border-radius:4px;transition:all .2s ease!important}.nav-link:hover{background:color-mix(in srgb,var(--theme-navbar-text, #fff) 12%,transparent)!important;padding:.5rem .75rem!important;margin:0 -.75rem!important}.nav-dropdown-btn:hover{background:none!important;background-color:transparent!important}}@media(min-width:1024px)and (max-width:1440px){.navbar{background:var(--theme-navbar, #000000);box-shadow:0 2px 8px color-mix(in srgb,var(--theme-navbar, #111) 50%,black);border-bottom:2px solid color-mix(in srgb,var(--theme-navbar-text, #fff) 20%,transparent)}.logo,.nav-link,.nav-dropdown-btn,.welcome-text{font-weight:700!important;color:var(--theme-navbar-text, #fff)!important;text-shadow:0 0 3px color-mix(in srgb,var(--theme-navbar-text, #fff) 30%,transparent),0 1px 4px color-mix(in srgb,var(--theme-navbar, #111) 100%,black),0 2px 6px color-mix(in srgb,var(--theme-navbar, #111) 80%,black)!important}.nav-link:hover{color:var(--theme-navbar-text, #fff)!important;text-shadow:0 0 5px color-mix(in srgb,var(--theme-navbar-text, #fff) 50%,transparent),0 1px 6px color-mix(in srgb,var(--theme-navbar, #111) 100%,black),0 2px 8px color-mix(in srgb,var(--theme-navbar, #111) 90%,black)!important;background:color-mix(in srgb,var(--theme-navbar-text, #fff) 10%,transparent)!important;border-radius:4px!important;padding:.5rem .75rem!important}.nav-dropdown-btn:hover{color:var(--theme-navbar-text, #fff)!important;text-shadow:0 0 5px color-mix(in srgb,var(--theme-navbar-text, #fff) 50%,transparent),0 1px 6px color-mix(in srgb,var(--theme-navbar, #111) 100%,black),0 2px 8px color-mix(in srgb,var(--theme-navbar, #111) 90%,black)!important;background:none!important;background-color:transparent!important;border-radius:4px!important;padding:.5rem .75rem!important}.user-menu-btn{font-weight:700!important;color:var(--theme-navbar-text, #fff)!important;text-shadow:0 0 3px color-mix(in srgb,var(--theme-navbar-text, #fff) 30%,transparent),0 1px 4px color-mix(in srgb,var(--theme-navbar, #111) 100%,black)!important}.user-menu-btn:hover{background:color-mix(in srgb,var(--theme-navbar-text, #fff) 25%,transparent)!important;color:var(--theme-navbar-text, #fff)!important;text-shadow:0 0 5px color-mix(in srgb,var(--theme-navbar-text, #fff) 50%,transparent),0 1px 6px color-mix(in srgb,var(--theme-navbar, #111) 100%,black)!important}.admin-link{font-weight:700!important;text-shadow:0 0 3px rgba(255,255,255,.4),0 1px 4px rgba(0,0,0,1)!important}}.user-status{margin-right:.5rem;font-size:1.1rem}.user-status-info{padding:.5rem 1rem;border-bottom:1px solid var(--theme-border);color:var(--theme-container-text)!important;background:var(--theme-container-bg)!important;text-align:center}.user-level{font-size:.9rem;font-weight:600}.upgrade-link{background:linear-gradient(135deg,#ffc107,#ff8f00);color:#212529!important;font-weight:600}.upgrade-link:hover{background:linear-gradient(135deg,#ff8f00,#f57c00);transform:translateY(-1px)}@media(max-width:767px){.nav-desktop{display:none!important}.menu-btn{display:block!important}}.nav-header{display:flex;justify-content:space-between;align-items:center;width:100%;gap:2rem}.nav-right{display:flex;align-items:center;gap:1rem;flex-shrink:0}.admin-link{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff!important;padding:.5rem 1rem!important;border-radius:6px;font-weight:600;transition:all .2s}.admin-link:hover{background:linear-gradient(135deg,#c82333,#a71e2a);transform:translateY(-1px);box-shadow:0 2px 8px #dc35454d}*{box-sizing:border-box}@media(max-width:320px){.navbar{padding:.25rem .5rem}.logo{font-size:1rem;max-width:120px}.user-menu-btn{padding:.25rem}.user-avatar{width:28px;height:28px;font-size:.75rem}.menu-btn{font-size:1.4rem;padding:.25rem}.user-dropdown{width:calc(100vw - .5rem);right:.25rem;max-width:260px}}.navbar,.nav-header,.nav-right,.nav-panel,.user-dropdown{max-width:100vw;overflow-x:hidden}@media(max-width:280px){.logo{font-size:.9rem;max-width:100px}.user-dropdown{width:calc(100vw - .25rem);right:.125rem}}.user-dropdown .dropdown-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;color:var(--theme-container-text)!important;text-decoration:none;background:none;border:none;width:100%;text-align:left;cursor:pointer;font-size:.9rem;transition:background-color .2s;white-space:nowrap}.user-dropdown .dropdown-item:hover{background:var(--theme-hover-bg)}.user-dropdown .logout-btn{border-top:1px solid var(--theme-border);margin-top:.25rem}@media(max-width:768px){.user-menu .user-dropdown{right:0;left:auto;width:250px;max-width:calc(100vw - 1rem);transform:translate(0)}}@media(max-width:320px){.user-menu .user-dropdown{width:calc(100vw - .5rem);right:.25rem;max-width:none}}.nav-dropdown{position:absolute!important;top:100%!important;left:0!important;background:var(--theme-card-bg, white)!important;border-radius:8px!important;box-shadow:0 4px 12px #00000026!important;min-width:160px!important;width:max-content!important;max-width:220px!important;z-index:9999!important;overflow:hidden!important;margin-top:.5rem!important;display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;border:1px solid var(--theme-border, rgba(0, 0, 0, .08))!important}.navbar,.nav-right,.nav-header,.nav-desktop,.user-menu,.accordion-menu{overflow:visible!important;position:relative!important}.chevron{display:inline-block!important;transition:transform .2s ease!important;font-size:.7rem!important;line-height:1!important;color:var(--theme-navbar-text, #fff)!important;opacity:.9!important}.chevron.open{transform:rotate(180deg)!important}
