body{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);background:#000;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.font-sans{font-family:Inter,sans-serif}html{background:#000}input,textarea,select,[contenteditable=true]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}:root{--tabbar-height: 56px}body.fullscreen-mode header,body.fullscreen-mode .app-header{display:none!important}body.fullscreen-mode .content-area{padding-top:0!important;padding-bottom:0!important;height:100vh;overflow:hidden!important}body.fullscreen-mode{padding-top:0!important;padding-bottom:0!important;color:#f9fafb}body.fullscreen-mode .app-container{height:100vh}body.fullscreen-mode #guitar-view{height:100vh;padding-top:0}body.fullscreen-mode #guitar-view.view-scroll{height:100%;overflow:hidden}body.fullscreen-mode .content-area>:not(#guitar-view){display:none!important}body.fullscreen-mode .guitar-scroll-container{flex:1;overflow-y:hidden;touch-action:pan-x}body.fullscreen-mode .guitar-chord-anchor .guitar-chord-name{display:inline-block!important}body.fullscreen-mode #guitar-view .guitar-tip{display:none}body.fullscreen-mode .bottom-tabbar{display:none!important}body.fullscreen-mode{padding-top:0;padding-bottom:0}body.light.fullscreen-mode,body.light.fullscreen-mode .app-container,body.light.fullscreen-mode .content-area,body.light.fullscreen-mode #guitar-view{background:#f6f2e9;color:#111}.selected-note{color:#f97316!important;transform:scale(1.1);font-weight:800!important;text-shadow:0 0 15px rgba(249,115,22,.2)}.note-name{transition:all .2s cubic-bezier(.34,1.56,.64,1)}.view-hidden{display:none!important}body,div,span,button,input{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,transform,margin,padding,max-height,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.click-flash{outline:none!important;transition:transform .1s ease,opacity .2s ease}.click-flash:active{transform:scale(.92);opacity:.7}.font-tech-title{font-family:Chakra Petch,sans-serif}@keyframes noteFadeIn{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.note-item{display:inline-block;animation:noteFadeIn .2s ease-out forwards;margin:0 1px}.modal-name-wrapper{height:0;opacity:0;overflow:hidden!important;transition:all .3s cubic-bezier(.34,1.56,.64,1);transform:translateY(-5px);display:flex;align-items:center;justify-content:center}.chord-card-active .modal-name-wrapper{height:44px;opacity:1;margin-top:8px;margin-bottom:8px;transform:translateY(0)}.chord-card-active .root-display,.chord-card-active .sec-root-display{color:#f97316!important;transform:scale(1.05)}.content-area{padding-top:56px;padding-bottom:calc(var(--tabbar-height) + env(safe-area-inset-bottom) + 16px);scrollbar-width:none;overflow:hidden;min-height:0}.content-area::-webkit-scrollbar{display:none}.view-scroll{flex:1 1 0;height:100%;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.view-scroll::-webkit-scrollbar{display:none}.lang-btn.active{background-color:#fff;color:#18181b;box-shadow:0 1px 2px #0000000d}.dark .lang-btn.active{background-color:#27272a;color:#fff}.chord-card-inner{display:flex;width:200%;height:100%;transform:translate(-50%);transition:transform .4s cubic-bezier(.2,.8,.2,1)}.chord-card-face{width:50%;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;position:relative;text-align:left;height:100%}.is-secondary .chord-card-inner{transform:translate(0)}.secondary-face{background:transparent;transition:background-color .35s ease}.dark .secondary-face{background:transparent}.group.is-secondary .secondary-face,.dark .group.is-secondary .secondary-face{background:#1a1a1f!important}.scale-degree.is-secondary{border-color:#a1a1aa!important;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.dark .scale-degree.is-secondary{border-color:#52525b!important;box-shadow:none}.scale-degree{aspect-ratio:1 / 1;height:auto;background-color:#1a1a1f!important;transition:background-color .35s ease}.scale-degree.chord-card-active{aspect-ratio:auto}.scale-degree.is-secondary{background-color:#1a1a1f!important}.chord-card-face{background-color:#1a1a1f;transition:background-color .35s ease}.secondary-face{background-color:#24242a}.group.chord-card-active{z-index:10;height:auto!important}.edge-trigger{position:absolute;top:0;bottom:0;width:32px;display:flex;align-items:center;justify-content:center;z-index:20;opacity:0;transition:opacity .2s;color:#a1a1aa;cursor:pointer}.edge-left{color:#f97316}.app-header{position:fixed;top:0;left:0;right:0;z-index:50;background:#000;padding-top:env(safe-area-inset-top);transform:translateZ(0)}.app-header-inner{height:56px;display:flex;align-items:center;justify-content:center;position:relative;padding:0 20px}.app-header-left,.app-header-right{position:absolute;top:0;height:56px;display:flex;align-items:center}.app-header-left{left:20px}.app-header-right{right:20px}.help-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:80}.help-card{position:relative;width:min(86vw,420px);background:#1a1a1f;border:1px solid #2A2A2F;border-radius:20px;padding:18px 18px 16px;box-shadow:0 12px 32px #00000073}.help-welcome{color:#f97316;font-weight:700;margin-bottom:6px}.help-term{color:#f97316;font-weight:600;background:transparent;border:none;padding:0;margin:0;cursor:pointer}.help-term:focus{outline:none}.help-tooltip{position:absolute;z-index:90;max-width:min(260px,calc(100vw - 64px));max-height:calc(100vh - 200px);overflow:auto;background:#111114eb;border:1px solid #2A2A2F;color:#e5e7eb;padding:8px 10px;border-radius:10px;font-size:12px;line-height:1.4;box-shadow:0 8px 20px #0006;opacity:0;transform:translate(-50%) translateY(-6px) scale(.98);transition:opacity .18s ease,transform .18s ease}.help-tooltip.show{opacity:1;transform:translate(-50%) translateY(0) scale(1)}.help-tooltip.hidden{display:none}.hidden{display:none!important}.app-header-title{font-size:16px;font-weight:600;color:#fff;line-height:1;white-space:nowrap;text-align:center}.bottom-tabbar{position:fixed;left:0;right:0;bottom:0;height:calc(var(--tabbar-height) + env(safe-area-inset-bottom));box-sizing:border-box;background:#000;display:flex;align-items:center;justify-content:space-around;padding-top:0;padding-bottom:env(safe-area-inset-bottom);z-index:60;border-top:none;box-shadow:none;overflow:hidden}.bottom-tabbar .tab-item{height:var(--tabbar-height);min-height:0;padding:0 8px;gap:6px;justify-content:center}.bottom-tabbar .tab-item span{line-height:1}@media(orientation:landscape){body:not(.fullscreen-mode) .content-area{padding-bottom:calc(var(--tabbar-height) + env(safe-area-inset-bottom) + 16px)}body:not(.fullscreen-mode) .bottom-tabbar .tab-icon{width:18px;height:18px}#scale-degrees{padding-bottom:5rem!important}#chord-view .scale-degree{aspect-ratio:auto;min-height:150px}#chord-view .scale-degree.chord-card-active .modal-name-wrapper{margin:48px auto 6px;width:100%;justify-content:center;text-align:center}#chord-view .scale-degree.chord-card-active .tones-area{margin-left:auto;margin-right:14px;width:78px;padding-left:0;padding-right:0;justify-content:center}}.tab-item{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10px;font-weight:600;color:#f97316;filter:grayscale(1) brightness(.55);transition:filter .15s ease;padding:8px 12px;min-width:64px;min-height:56px;border-radius:14px}.tab-item i{width:20px;height:20px}.tab-icon{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:none}.tab-item svg{width:20px;height:20px;stroke:currentColor;transition:none}.tab-item.active{filter:none}.interval-layout{min-height:calc(100vh - 160px);padding-top:64px;padding-bottom:64px;display:flex;flex-direction:column;align-items:center;justify-content:space-between}#interval-view{padding-top:0}.interval-result{height:120px;margin-bottom:0}#actual-interval-display{font-size:84px;font-weight:800;color:#f8fafc}.note-name{background:transparent;border:none;font-size:30px;font-weight:600;color:#6b7280;padding:0 6px;cursor:pointer}.note-display{margin:0}:root{--interval-title-top: 101px;--interval-notes-top: 266px;--interval-controls-top: 408px}.interval-layout{position:relative;min-height:calc(100vh - 160px)}.interval-layout .interval-result{position:absolute;top:var(--interval-title-top);left:0;right:0}.interval-layout .note-display{position:absolute;top:var(--interval-notes-top);left:0;right:0}.interval-layout .test-controls{position:absolute;top:var(--interval-controls-top);left:0;right:0;margin:0 auto}.interval-layout #test-question-area{position:absolute;top:var(--interval-title-top);left:0;right:0}.interval-layout #feedback-message{position:absolute;top:var(--interval-notes-top);left:0;right:0}.test-controls{border-top:none;margin-top:0;padding-top:0;width:340px;justify-content:space-between}.rhythm-console{width:100%;display:flex;justify-content:center;padding:24px 16px 64px}.rhythm-hidden{display:none}.rhythm-shell{width:min(420px,100%);background:#141418;border-radius:26px;padding:16px 16px 20px;border:1px solid #2a2a2f;box-shadow:none}.rhythm-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.rhythm-brand-mark{font-size:14px;font-weight:700;letter-spacing:.12em;color:#e5e7eb}.rhythm-brand{display:none}.rhythm-tabs{display:flex;gap:8px}.rhythm-tab{height:28px;padding:0 12px;border-radius:10px;background:#2a2a2f;border:1px solid #2f2f36;color:#9ca3af;font-size:11px;font-weight:700;letter-spacing:.08em;cursor:pointer;transition:all .15s ease}.rhythm-tab.active{background:#fff;border-color:#fff;color:#111}.rhythm-screen{background:#0f0f14;border:1px solid #1f1f25;border-radius:14px;padding:12px;box-shadow:inset 0 0 0 1px #0009}.rhythm-screen-header{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.12em;color:#6b7280;text-transform:uppercase;margin-bottom:10px}.rhythm-screen-title{color:#f97316;font-weight:600}.rhythm-screen-status{color:#6b7280}.rhythm-filters{display:flex;justify-content:center;gap:10px;margin:14px 0 12px}.rhythm-filter{height:30px;padding:0 16px;border-radius:10px;background:#1a1a1f;border:1px solid #2a2a2f;color:#9ca3af;font-size:11px;font-weight:700;letter-spacing:.08em}.rhythm-filter.active{background:#f97316;border-color:#f97316;color:#111}.rhythm-grid{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.rhythm-card{height:78px;border-radius:12px;background:#0f0f14;border:1px solid #24242b;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;cursor:pointer}.rhythm-card.playing{border-color:inherit}.rhythm-card.active-beat{border-color:#f97316;transform:translateY(-1px) scale(1.02)}.rhythm-card.active{border-color:#f97316;box-shadow:0 0 0 1px #f9731666 inset}.rhythm-steps{position:absolute;top:6px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:4px;pointer-events:none}.rhythm-step{width:6px;height:6px;border-radius:999px;background:#3a3a42;transition:transform .18s ease,background-color .18s ease;position:relative}.rhythm-step.rest{background:transparent!important}.rhythm-step.rest:before,.rhythm-step.rest:after{content:"";position:absolute;top:50%;left:50%;width:7px;height:1.5px;background:#3a3a42;transform-origin:center}.rhythm-step.rest:before{transform:translate(-50%,-50%) rotate(45deg)}.rhythm-step.rest:after{transform:translate(-50%,-50%) rotate(-45deg)}.rhythm-steps.active .rhythm-step{background:#f97316;transform:scale(1.5)}.rhythm-steps.active .rhythm-step.rest{background:transparent!important}.rhythm-steps.active .rhythm-step.rest:before,.rhythm-steps.active .rhythm-step.rest:after{background:#f97316}.rhythm-card-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.rhythm-icon{width:44px;height:44px;color:#f97316}.rhythm-icon--large{width:120px;height:120px}.rhythm-controls{display:flex;flex-direction:column;gap:8px;margin-top:8px}.rhythm-control{background:transparent;border:none;border-radius:0;padding:0}.rhythm-control-label{font-size:10px;color:#9ca3af;letter-spacing:.1em;margin-bottom:8px}.rhythm-control-row{display:flex;align-items:center;gap:8px}.rhythm-control-btn{width:26px;height:26px;border-radius:8px;background:#111114;border:1px solid #2a2a2f;color:#e5e7eb;font-weight:700;cursor:pointer}.rhythm-control-range{flex:1;accent-color:#f97316;height:4px}.rhythm-control-value{margin-top:-2px;font-size:11px;color:#f97316;text-align:center;font-weight:700}.rhythm-actions{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.rhythm-action{height:38px;border-radius:12px;background:#f97316;border:none;color:#111;font-size:12px;font-weight:800;letter-spacing:.08em;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .15s ease,box-shadow .2s ease}.rhythm-action:active{transform:scale(.97)}.rhythm-action-icon{background:#fff;color:#111;padding:0}.rhythm-action-svg,.rhythm-loop-icon{width:18px;height:18px}.rhythm-action.ghost{background:#0f0f14;color:#fff;border:1px solid #ffffff}.rhythm-card.dimmed{opacity:.35;filter:grayscale(.3)}.no-accent:hover,.no-accent:active,.no-accent:focus,.no-accent:focus-visible{background-color:inherit!important;color:inherit!important}#test-question-area{margin-top:0;margin-bottom:0}#upgrade-btn{color:#9ca3af!important}@media(hover:hover){.group:hover .edge-trigger{opacity:.3}.edge-trigger:hover{opacity:.8!important}}@media(hover:none){.edge-trigger{display:none!important}}.edge-right{right:0}.edge-left{left:0}#current-key-display{transition:all .4s cubic-bezier(.34,1.56,.64,1);max-height:24px;opacity:1;margin-top:.25rem;transform:scale(1)}#current-key-display.hidden-key{opacity:0;max-height:0;margin-top:0;transform:scale(.8);pointer-events:none}.chord-settings{background-color:#1a1a1f;border:none;box-shadow:none;position:relative;z-index:10;pointer-events:auto;touch-action:manipulation}.chord-type-btn{color:#9ca3af;pointer-events:auto;position:relative;z-index:5;touch-action:manipulation}.chord-type-btn.active-degree{background-color:#24242a;color:#e5e7eb;border:1px solid #2f2f35;box-shadow:none}body.light .chord-type-btn.active-degree{background-color:#efe7dc;color:#111;border-color:#e0d8cb}.mode-scroll-container{display:flex;overflow-x:auto;gap:1rem;scrollbar-width:none;-ms-overflow-style:none;padding:.25rem 0;justify-content:flex-start}.mode-scroll-container::-webkit-scrollbar{display:none}#fretboard{min-width:max-content}#guitar-view{overflow-x:hidden}.guitar-topbar{touch-action:pan-y}.guitar-string-row{isolation:isolate}.guitar-scroll-container{scrollbar-width:none;-ms-overflow-style:none;cursor:grab}.guitar-scroll-container:active{cursor:grabbing}.guitar-scroll-container::-webkit-scrollbar{display:none}.fret-cell{position:relative;display:flex;align-items:center;justify-content:center;border-right:2px solid #2b2b2b;flex-shrink:0;height:100%;cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:1}.dark .fret-cell{border-right-color:#2b2b2b}.fret-0{border-right-width:6px;background-color:#1a1a1f;border-right-color:#3a3a3a}.guitar-string{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);background-color:#4b4b4b;z-index:0;pointer-events:none;box-shadow:0 1px 2px #0003}.dark .guitar-string{background-color:#4b4b4b}.str-0{height:1px}.str-1{height:1.5px}.str-2{height:2px}.str-3{height:3px}.str-4{height:4px}.str-5{height:5px}.guitar-note-marker{position:relative;width:28px;height:28px;border-radius:50%;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;z-index:2;box-shadow:0 2px 4px #0003;animation:popIn .15s cubic-bezier(.175,.885,.32,1.275);-webkit-user-select:none;user-select:none}.marker-root{background-color:#f97316;color:#fff;box-shadow:0 2px 4px #f9731666}.marker-tone{background-color:#fff;color:#f97316;border:2px solid #f97316}.dark .marker-tone{background-color:#18181b}.marker-extension{background-color:#e5e7eb;color:#111827;border:2px solid #d1d5db}.dark .marker-extension{background-color:#27272a;color:#e5e7eb;border-color:#3f3f46}body.light .marker-extension{background-color:#fff;color:#6b7280;border-color:#6b7280}.marker-avoid{background-color:#111;color:#b23b3b;border:2px solid #b23b3b}.dark .marker-avoid{background-color:#111;color:#b23b3b;border-color:#b23b3b}body.light .marker-avoid{background-color:#f6f2e9;color:#c24f4f;border-color:#c24f4f}.marker-gray{background-color:#a1a1aa;color:#fff}.dark .marker-gray{background-color:#52525b}@keyframes popIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes vibrate{0%,to{transform:translateY(-50%)}25%{transform:translateY(calc(-50% - 1px))}75%{transform:translateY(calc(-50% + 1px))}}.string-vibrating{animation:vibrate .05s linear 12}.fret-number{font-size:10px;color:#6b6b6b;font-weight:600;margin-top:4px}.guitar-chord-anchor{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:12rem;text-align:center;pointer-events:none;overflow:visible}.guitar-chord-anchor .guitar-chord-name{display:inline-block;position:relative;text-align:center;overflow:visible}.guitar-chord-text{display:block;line-height:1.1}.guitar-chord-meta{font-size:10px;font-weight:600;color:#71717a;letter-spacing:.02em;position:absolute;left:100%;bottom:-1px;margin-left:6px;white-space:nowrap;line-height:1}body.light .guitar-chord-meta{color:#9ca3af}@media(max-width:820px){.guitar-chord-anchor{left:84px;right:84px;transform:translateY(-50%);width:auto;text-align:center}}.guitar-chord-anchor--below{display:none;position:static;transform:none;width:100%;text-align:left;pointer-events:none;margin-top:8px}.guitar-chord-anchor--top{display:block}@media(orientation:portrait){.guitar-chord-anchor--top{display:none}.guitar-chord-anchor--below{display:block;margin-top:-24px}.guitar-chord-anchor--below .guitar-chord-name{text-align:left}}.guitar-mode-btn,.guitar-clear-btn{display:inline-flex}.guitar-action{display:inline-flex;align-items:center;justify-content:center;line-height:1;padding-top:0;padding-bottom:0}.guitar-mode-btn{min-width:58px;text-align:center}@media(orientation:portrait){.guitar-topbar{margin-left:0;margin-right:0;padding-left:4px!important;padding-right:4px!important}}.scan-dropzone{border:1.5px dashed #d4d4d8;background:linear-gradient(180deg,#f973160f,#fff0)}.dark .scan-dropzone{border-color:#3f3f46;background:linear-gradient(180deg,#f973161f,#18181b00)}.scan-preview-image{width:100%;height:auto;object-fit:contain;border-radius:16px}.dark .scan-preview-image{background:#18181b}.scan-top-flat,.scan-result-flat{border:none!important;background:transparent!important;padding:0!important;box-shadow:none!important}.local-score-card:active{border-color:#2a2a2f}.local-score-flash{border-color:#f97316!important;border-width:1px!important;box-shadow:none!important}.local-score-more{display:inline-flex;align-items:center;justify-content:flex-start;color:#9ca3af;font-weight:800;font-size:22px;padding:2px 6px;cursor:pointer;transform:translateY(-4px)}.local-score-card{position:relative}.local-score-card.local-score-delete-mode{border-color:#ef4444!important;box-shadow:0 0 0 1px #ef444466}.local-score-trash{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#ef4444;background:transparent;border:none;display:none;padding:4px;z-index:2}.local-score-card.local-score-delete-mode .local-score-trash{display:inline-flex;align-items:center;justify-content:center}.local-score-card.local-score-removing{transform:scaleX(.6);opacity:0;transition:transform .2s ease,opacity .2s ease;transform-origin:left center}.favorite-avatar{width:36px;height:36px;border-radius:999px;background:#2a2a2f;position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}.favorite-avatar .avatar-head{width:10px;height:10px;border-radius:50%;background:#a1a1aa;position:absolute;top:7px}.favorite-avatar .avatar-body{width:36px;height:36px;border-radius:50%;background:#a1a1aa;position:absolute;bottom:-24px}.favorite-login-btn{border:1px solid #ffffff;color:#fff;background:transparent;padding:4px 10px;font-size:12px;border-radius:10px;transition:background-color .2s ease,border-color .2s ease,color .2s ease}.favorite-login-btn.active{border-color:#f97316;color:#fff;background:#f9731633}body.light .favorite-login-btn{border-color:#111;color:#111}body.light .favorite-login-btn.active{border-color:#f97316;color:#111;background:#f9731626}.favorite-menu-btn{width:28px;height:28px;border-radius:10px;background:transparent;color:#e5e7eb;font-weight:700;display:inline-flex;align-items:center;justify-content:center;letter-spacing:2px}body.light .favorite-menu-btn{color:#111}.favorite-menu{position:absolute;right:12px;top:52px;background:#141418;border:1px solid #2a2a2f;border-radius:12px;padding:6px;min-width:120px;z-index:10}body.light .favorite-menu{background:#fff;border-color:#e5e7eb}.favorite-menu button{width:100%;text-align:left;padding:8px 10px;font-size:12px;color:#e5e7eb;background:transparent;border:none;border-radius:8px}body.light .favorite-menu button{color:#111}.favorite-menu button.danger{color:#ef4444}.tools-grid{margin-top:8px;grid-template-columns:1fr;gap:16px}.tool-card{background:#1a1a1f;border:1px solid #2a2a2f;border-radius:18px;padding:22px;min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;transition:transform .15s ease,border-color .2s ease,background-color .2s ease}.tool-icon{width:22px;height:22px;border-radius:0;background:transparent;border:none;color:#f97316;display:inline-flex;align-items:center;justify-content:center;margin-bottom:2px}.tool-icon svg{width:22px;height:22px}.tool-card:active{transform:scale(.98);border-color:#f9731699}.tool-title{font-size:16px;font-weight:700;color:#f9fafb}.tool-desc{font-size:12px;color:#9ca3af}.tool-placeholder{background:#1a1a1f;border:1px dashed #2a2a2f;border-radius:20px;padding:28px;min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px}.fifths-page{width:100%;max-width:1100px;margin:0 auto;padding:12px 16px 84px;display:flex;flex-direction:column;gap:16px;overflow-x:hidden}.fifths-header{text-align:center;padding-top:6px}.fifths-title{font-size:20px;font-weight:800;color:#f9fafb}.fifths-subtitle{font-size:12px;color:#9ca3af;margin-top:4px}.fifths-grid{display:grid;gap:16px;overflow-x:hidden;grid-template-columns:minmax(0,1fr)}@media(min-width:980px){.fifths-grid{grid-template-columns:1fr 1fr;align-items:start}}.fifths-panel{background:#1a1a1f;border:1px solid #2a2a2f;border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px;width:100%;box-sizing:border-box}.fifths-right,.fifths-left{width:100%;min-width:0}.fifths-panel-head{display:flex;align-items:center;justify-content:flex-start;gap:8px}.fifths-panel-toggle{display:inline-flex;align-items:center;gap:6px;padding:2px;border-radius:999px;border:1px solid #2a2a2f;background:#1f1f25}.fifths-panel-btn{border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700;border:1px solid transparent;background:transparent;color:#9ca3af;transition:border-color .2s ease,background-color .2s ease,color .2s ease}.fifths-panel-btn.active{background:#24242a;color:#e5e7eb;border-color:#2f2f35}.fifths-panel-title{display:none}.fifths-circle-wrap{display:flex;align-items:center;justify-content:center;padding:8px 0 12px}#fifths-view{overflow-x:hidden}.fifths-info{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.fifths-panel-title{font-size:14px;font-weight:700;color:#f9fafb}.fifths-panel-subtitle{font-size:12px;color:#9ca3af}.fifths-circle{width:100%;max-width:320px;margin:0 auto;aspect-ratio:1 / 1;position:relative}.fifths-circle:before{content:"";position:absolute;inset:var(--fifths-outer-inset, 10%);border-radius:50%;border:2px dashed #2f3036;opacity:.9;z-index:0}.fifths-circle:after{content:"";position:absolute;inset:var(--fifths-inner-inset, 28%);border-radius:50%;border:2px dashed #2b2c31;opacity:.7;z-index:0}.fifths-circle-center{position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;background:#f97316;transform:translate(-50%,-50%);opacity:.8;z-index:1}.fifths-key{position:absolute;transform:translate(-50%,-50%);min-width:38px;height:30px;padding:0 8px;border-radius:999px;border:1px solid #2a2a2f;background:#1f1f25;color:#e5e7eb;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease,border-color .2s ease,background-color .2s ease;z-index:2}.fifths-key.major{width:34px;min-width:34px;height:34px;padding:0;border-radius:50%}.fifths-key.active{background:#f97316;border-color:#f97316;color:#fff}.fifths-key.highlight{box-shadow:0 0 0 3px #f97316d9}body:not(.light) .fifths-key.highlight-root{box-shadow:0 0 0 3px #ffffffe6}.fifths-toggle-row,.fifths-mode-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.fifths-toggle-btn,.fifths-mode-btn{border-radius:999px;padding:6px 14px;font-size:12px;font-weight:700;border:1px solid #2a2a2f;background:#1f1f25;color:#9ca3af;transition:border-color .2s ease,background-color .2s ease,color .2s ease}.fifths-toggle-btn.active,.fifths-mode-btn.active{background:#f97316;border-color:#f97316;color:#111}.fifths-key-info{display:flex;align-items:center;justify-content:space-between}.fifths-key-label{font-size:16px;font-weight:800;color:#f9fafb}.fifths-key-sig{font-size:12px;color:#9ca3af;margin-top:4px}.fifths-scale-notes{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}#fifths-view #fifths-chords.score-chord-row{grid-template-columns:repeat(4,minmax(64px,1fr));max-width:100%;margin:0 auto;justify-items:center;width:100%;overflow-x:hidden}#fifths-view .score-chord{min-width:64px;padding:8px}.fifths-scale-chip{padding:4px 10px;border-radius:10px;background:#24242a;color:#e5e7eb;font-size:12px;font-weight:700}.fifths-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:#9ca3af}.fifths-legend-item{display:inline-flex;align-items:center;gap:6px}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:#f97316}.legend-sd{background:#60a5fa}.legend-d{background:#34d399}.fifths-compass{display:flex;flex-direction:column;gap:10px}.fifths-compass-group{display:flex;align-items:flex-start;gap:10px}.fifths-compass-title{font-size:12px;font-weight:700;color:#f9fafb;min-width:70px}.fifths-compass-row{display:flex;flex-wrap:wrap;gap:6px}.fifths-compass-chip{padding:4px 10px;border-radius:999px;border:1px solid #2a2a2f;background:#1f1f25;color:#e5e7eb;font-size:11px;font-weight:700}.fifths-progressions{display:flex;flex-direction:column;gap:12px}.fifths-prog-group{display:flex;flex-direction:column;gap:8px}.fifths-prog-label{font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:#9ca3af}.fifths-prog-list{display:flex;flex-direction:column;gap:8px}.fifths-prog-row{display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:10px 12px;border-radius:14px;border:1px solid #2a2a2f;background:#1f1f25;transition:border-color .2s ease,background-color .2s ease;position:relative;overflow:visible;min-height:92px}.fifths-prog-row.active{border-color:#f97316b3;background:transparent}.fifths-prog-main{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;padding-right:8px}.fifths-prog-name{font-size:12px;color:#9ca3af}.fifths-prog-functions{font-size:12px;color:#f97316;font-weight:700}.fifths-prog-chords{display:flex;flex-wrap:nowrap;gap:3px;font-size:13px;font-weight:700;color:#f9fafb;white-space:nowrap}.fifths-prog-chord{padding:0;border:none;background:transparent}.fifths-prog-chord.playing{color:#f97316}.fifths-prog-arrow{margin:0 4px;color:#6b7280}.fifths-prog-degrees{font-size:10px;color:#9ca3af}.fifths-prog-note,.fifths-prog-sub{font-size:11px;color:#9ca3af}.fifths-prog-play{width:56px;height:56px;border-radius:50%;border:none;background:transparent;color:#9ca3af;display:inline-flex;align-items:center;justify-content:center;margin-left:auto}.fifths-prog-play.playing{color:#f97316}.fifths-prog-play svg{width:28px;height:28px;display:block}.fifths-prog-loop{position:absolute;top:6px;right:18px;width:16px;height:16px;border:none;background:transparent;color:#9ca3af;display:inline-flex;align-items:center;justify-content:center}.fifths-prog-loop svg{width:12px;height:12px;display:block}.fifths-prog-loop.active{color:#f97316}.fifths-prog-nav{position:absolute;top:50%;width:24px;height:24px;border-radius:999px;border:none;background:transparent;color:#9ca3af;display:inline-flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transform:translateY(-50%);transition:opacity .25s ease}.fifths-prog-nav svg{width:14px;height:14px;display:block}.fifths-prog-nav.prev{left:-10px;transform:translate(-50%,-50%)}.fifths-prog-nav.next{right:-10px;transform:translate(50%,-50%)}.fifths-prog-page{position:absolute;right:6px;bottom:4px;font-size:10px;color:#6b7280;background:#08080c99;padding:1px 4px;border-radius:6px;letter-spacing:.02em;opacity:0;pointer-events:none;transition:opacity .25s ease;transform:translateY(0)}.fifths-prog-row.nav-visible .fifths-prog-nav,.fifths-prog-row.nav-visible .fifths-prog-page{opacity:1;pointer-events:auto}body.light .fifths-page,body.light .fifths-title{color:#111}body.light .fifths-subtitle{color:#6b7280}body.light .fifths-panel,body.light .fifths-panel-toggle{background:#fff8ef;border-color:#e0d8cb}body.light .fifths-panel-btn{color:#6b7280}body.light .fifths-panel-btn.active{background:#efe7dc;border-color:#e0d8cb;color:#111}body.light .fifths-panel-title{color:#111}body.light .fifths-panel-subtitle,body.light .fifths-key-sig,body.light .fifths-prog-name,body.light .fifths-prog-label,body.light .fifths-prog-degrees{color:#6b7280}body.light .fifths-prog-functions{color:#f97316}body.light .fifths-circle:before{border-color:#ded5c7}body.light .fifths-circle:after{border-color:#e4dbcf}body.light .fifths-key{background:#fff8ef;border-color:#e0d8cb;color:#111}body.light .fifths-key.active{background:#111;border-color:#111;color:#fff}body.light .fifths-toggle-btn,body.light .fifths-mode-btn{background:#fff8ef;border-color:#e0d8cb;color:#6b7280}body.light .fifths-toggle-btn.active,body.light .fifths-mode-btn.active{background:#111;border-color:#111;color:#fff}body:not(.light) .fifths-mode-btn{background:#2a2a2f;border-color:#3a3a3f;color:#9ca3af}body:not(.light) .fifths-mode-btn.active{background:#fff;border-color:#fff;color:#111}body.light .fifths-key-label{color:#111}body.light .fifths-scale-chip{background:#f2e8dc;color:#111}body.light .fifths-compass-title{color:#111}body.light .fifths-compass-chip{background:#fff8ef;border-color:#e0d8cb;color:#111}body.light .fifths-prog-row{background:#fff8ef;border-color:#e0d8cb}body.light .fifths-prog-row.active{background:#f3e9dd;border-color:#e0d8cb}body.light .fifths-prog-chords{color:#111}body.light .fifths-prog-chord.playing{color:#f97316}body.light .fifths-prog-play{background:transparent;border:none;color:#6b7280}body.light .fifths-prog-play.playing{color:#f97316}body.light .fifths-prog-loop{color:#6b7280}body.light .fifths-prog-loop.active{color:#f97316}body.light .fifths-prog-nav{color:#6b7280}body.light .fifths-prog-page{color:#6b7280;background:#fff8efd9;border:1px solid #e0d8cb}body.light .fifths-prog-note,body.light .fifths-prog-sub{color:#6b7280}.tuner-container{width:100%;max-width:620px;margin:0 auto;padding:34px 12px 32px;display:flex;flex-direction:column;align-items:center;gap:18px}.tuner-header{text-align:center}.tuner-title{font-size:20px;font-weight:700;color:#f9fafb}.tuner-subtitle{font-size:12px;color:#9ca3af;margin-top:4px}.tuner-dial{width:min(84vw,320px);height:min(46vw,160px);--tuner-radius: min(46vw, 160px);border-radius:280px 280px 0 0;border:2px solid #2a2a2f;background:#121218;display:flex;align-items:flex-end;justify-content:center;position:relative;overflow:hidden}.tuner-range{position:absolute;top:0;right:0;bottom:0;left:0;background:conic-gradient(from -90deg at 50% 100%,transparent 0deg 78deg,rgba(249,115,22,.25) 78deg 102deg,transparent 102deg 180deg);z-index:0;pointer-events:none}.tuner-ticks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.tuner-tick{position:absolute;left:50%;bottom:0;width:2px;height:8px;background:#3a3a3f;transform-origin:bottom center;opacity:.85}.tuner-tick.in-range{background:#f973168c;height:10px}.tuner-tick.major{height:12px;background:#585861}.tuner-tick-label{position:absolute;left:50%;bottom:0;transform-origin:bottom center;font-size:10px;color:#9ca3af;white-space:nowrap;opacity:.9}.tuner-dial.listening{border-color:#f97316b3;box-shadow:0 0 18px #f9731638,inset 0 0 26px #0000008c}.tuner-dial.in-tune{border-color:#22c55e;box-shadow:0 0 20px #22c55e47,inset 0 0 26px #0000008c}.tuner-readout{text-align:center}.tuner-note{font-size:42px;font-weight:800;color:#f9fafb;letter-spacing:-.02em}.tuner-target{font-size:12px;color:#9ca3af;margin-top:2px}.tuner-detected{font-size:12px;color:#f97316;margin-top:6px;min-height:16px;line-height:16px;white-space:nowrap}#tuner-detected.hidden{display:block!important;visibility:hidden}.tuner-detected.in-tune{color:#22c55e}.tuner-needle{position:absolute;bottom:12px;left:50%;width:3px;height:72px;background:#f97316;border-radius:999px;transform-origin:bottom center;transform:translate(-50%) rotate(0);transition:transform .12s ease;z-index:2}.tuner-status{font-size:12px;color:#9ca3af;min-height:18px;line-height:18px;display:flex;align-items:center;justify-content:center}.tuner-status:empty{visibility:hidden}.tuner-strings{width:100%;max-width:360px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}@media(min-width:420px){.tuner-strings{grid-template-columns:repeat(6,minmax(0,1fr))}}.tuner-string{height:44px;border-radius:12px;background:#1a1a1f;border:1px solid #2a2a2f;color:#e5e7eb;font-weight:700;font-size:12px;display:inline-flex;align-items:center;justify-content:center}.tuner-string.active{background:#1a1a1f;border-color:#f97316;color:#f97316;box-shadow:none}.tuner-action{margin-top:6px;min-width:96px;height:40px;padding:0 14px;border-radius:999px;background:#f97316;color:#111;font-weight:700;font-size:14px;border:none;outline:none;display:inline-flex;align-items:center;justify-content:center}body.dark .tuner-action{background:#fff;color:#111}.metro-container{width:100%;max-width:680px;margin:0 auto;padding:72px 12px 48px;display:flex;flex-direction:column;align-items:center;gap:36px}.metro-header{text-align:center}.metro-title{font-size:20px;font-weight:700;color:#f9fafb}.metro-subtitle{font-size:12px;color:#9ca3af;margin-top:4px}.metro-beats{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:6px}.metro-beat{width:10px;height:10px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:#2a2a2f;border:none;color:transparent;transition:background-color .12s ease}.metro-beat.active,.metro-beat.active.accent{background:#f97316e6}.metro-beat.accent{width:14px;height:14px}.metro-bpm{display:flex;align-items:center;gap:0;width:204px;justify-content:space-between;position:relative;top:18px}.metro-step{width:42px;height:42px;border-radius:14px;background:#1a1a1f;border:1px solid #2a2a2f;color:#e5e7eb;font-size:20px;font-weight:700}.metro-bpm-value{min-width:88px;text-align:center;font-size:48px;font-weight:800;color:#f9fafb;letter-spacing:-.02em}.metro-bpm-label{font-size:12px;color:#9ca3af;position:relative;top:18px}.metro-range{width:100%;max-width:320px;accent-color:#f97316;--range-progress: 0%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:28px;background:transparent;outline:none;border:none;box-shadow:none}.metro-range:focus{outline:none}.metro-range::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(90deg,#f97316 var(--range-progress, 0%),#2a2a2f var(--range-progress, 0%));border:none;box-shadow:none}.metro-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:999px;background:#fff;border:2px solid #f97316;margin-top:-7px;box-shadow:none}.metro-range::-moz-range-progress{background:#f97316}.metro-range::-moz-range-track{height:4px;border-radius:999px;background:linear-gradient(90deg,#f97316 var(--range-progress, 0%),#2a2a2f var(--range-progress, 0%));border:none}.metro-range::-moz-range-thumb{width:18px;height:18px;border-radius:999px;background:#fff;border:2px solid #f97316;box-shadow:none}.metro-range::-moz-focus-outer{border:0}.metro-signature-label{font-size:12px;color:#9ca3af;margin-top:6px}.metro-signature-select{width:100%;max-width:fit-content;display:flex;align-items:center;gap:10px;justify-content:center;margin:6px auto 0}.metro-tap{width:40px;height:40px;border-radius:999px;background:transparent;border:1px solid #ffffff;color:#f97316;display:inline-flex;align-items:center;justify-content:center}.metro-signature-toggle{flex:0 0 auto;height:34px;width:56px;border-radius:12px;background:#1a1a1f;border:1px solid #2a2a2f;color:#9ca3af;font-weight:700;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:0;padding:0;position:relative}.metro-signature-toggle i{display:none}body.dark .metro-signature-toggle{border-color:#fff;color:#fff}.metro-signature-toggle.open i{transform:rotate(180deg)}.metro-signature-options{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;max-width:fit-content;max-height:44px;opacity:0;transform:scaleY(.9);transform-origin:top center;transition:max-height .12s ease,opacity .12s ease,transform .12s ease;overflow:hidden}.metro-signature-options.hidden{display:flex!important;max-height:0;opacity:0;transform:scaleY(.9);pointer-events:none}.metro-signature-options.open{max-height:200px;opacity:1;transform:scaleY(1)}.metro-sig{min-width:56px;height:34px;border-radius:12px;background:#1a1a1f;border:1px solid #2a2a2f;color:#9ca3af;font-weight:700;font-size:12px}.metro-sig.active{background:#1a1a1f;border-color:#f97316;color:#f97316;box-shadow:none}.metro-action{margin-top:6px;min-width:96px;height:40px;padding:0 14px;border-radius:999px;background:#f97316;color:#111;font-weight:700;font-size:15px;border:none;outline:none;display:inline-flex;align-items:center;justify-content:center}body.dark .metro-action{background:#fff;color:#111}.metro-actions{display:flex;align-items:center;gap:10px;width:auto;justify-content:center;margin-top:6px;position:relative;top:-18px}.metro-actions>:first-child{margin-left:1px}.score-measure{touch-action:manipulation;transition:border-color .22s ease,box-shadow .22s ease;border:1px solid #2a2a2f;border-radius:20px;background:#0f0f14}.score-measure *{touch-action:manipulation}.dark .score-measure{border-color:#2a2a2f;background:#0f0f14}.scan-electronic-flat{padding:0}.score-measure.active{border-color:#f97316}.card-flash{border-color:#f97316!important;box-shadow:0 0 0 1px #f973168c}.fifths-prog-row.prog-flash{border-color:#f97316;box-shadow:0 0 0 1px #f973168c}.scan-action-btn{width:30px;height:30px;border-radius:9999px;border:1px solid #2a2a2f;background:#0f0f14;color:#a1a1aa;display:inline-flex;align-items:center;justify-content:center;transition:border-color .22s ease,box-shadow .22s ease,color .22s ease,background-color .22s ease}.scan-action-btn svg{stroke:currentColor;fill:none}.scan-action-icon{width:14px;height:14px}.scan-action-btn.active{border-color:#f97316;color:#f97316}.scan-action-btn.active svg{stroke:#f97316;fill:none}.scan-action-btn.flash{border-color:#f97316;color:#f97316;box-shadow:0 0 0 1px #f973168c}.scan-action-btn.flash svg{stroke:#f97316;fill:none}.scan-action-btn.disabled{opacity:.6;cursor:not-allowed;pointer-events:auto}.score-chord{transition:border-color .22s ease,box-shadow .22s ease;border:1px solid #2a2a2f;background:#1a1a1f;color:#e5e7eb;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;padding:10px 12px;min-width:78px}.score-chord-row{grid-template-columns:repeat(4,minmax(78px,1fr))}.score-measure .score-chord{gap:3px;padding:6px 10px;min-width:78px}.dark .score-chord{background:#1a1a1f;border-color:#2a2a2f}.score-chord.active{color:#ea580c;text-decoration:underline;text-underline-offset:4px}.score-chord-card{touch-action:manipulation;border-radius:14px!important;flex:1 1 calc(25% - 6px);max-width:calc(25% - 6px);width:100%;align-self:end;transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease}.score-chord-card *{touch-action:manipulation}.score-chord-card:not(.expanded-mini):not(.expanded-full){justify-content:center}.score-chord-card:not(.expanded-mini):not(.expanded-full) .score-chord-label{margin-top:0;transform:translateY(-2px)}#fifths-view .score-chord-card:not(.expanded-mini):not(.expanded-full){justify-content:center}#fifths-view .score-chord-card:not(.expanded-mini):not(.expanded-full) .score-chord-label{transform:translateY(-6px)}#fifths-view .score-chord-label{font-size:9px;line-height:1;text-align:center}.score-chord-card .score-chord-diagram,.score-chord-card .score-chord-scale{max-height:0;opacity:0;transform:translateY(4px);overflow:hidden!important;transition:max-height .22s ease,opacity .22s ease,transform .22s ease}.score-chord-card.expanded-mini .score-chord-diagram{max-height:90px;opacity:1;transform:translateY(0);width:62px;height:62px}.score-chord-card.expanded-full .score-chord-diagram,.score-chord-card.expanded-full .score-scale-name{margin-bottom:0}.score-chord-card.expanded-full .score-chord-scale{max-height:140px;opacity:1;transform:translateY(0)}.score-chord-card.expanded-full{gap:2px}.score-chord-card.expanded-full .score-chord-diagram{width:62px;height:62px}.score-chord-card.expanded-full .score-scale-name{margin-top:-4px}.score-chord-card.expanded-full .score-chord-scale{margin-top:0}.score-chord-card.expanded-full .score-chord-label{margin-top:10px}.score-chord-card.fast-toggle .score-chord-diagram,.score-chord-card.fast-toggle .score-chord-scale{transition-duration:.14s}.score-chord-diagram{width:52px;height:52px}.score-chord-diagram .chord-diagram{width:100%!important;height:100%!important}.score-chord-card .chord-diagram{background:transparent!important;border:none!important;box-shadow:none!important;padding:0!important;border-radius:0!important}.score-chord-card .chord-diagram-index{display:none!important}.score-chord-label{font-weight:700;font-size:14px;line-height:1.1;text-align:center;white-space:nowrap;overflow:hidden!important;text-overflow:ellipsis;max-width:100%;width:100%}.score-chord-func{font-size:.7em;color:#9ca3af;font-weight:600;margin-left:2px}.score-measure .score-chord-label{font-size:10px}.score-measure .score-chord-scale{font-size:8px}.score-chord-scale{text-align:center;font-size:11px;color:#a1a1aa}.score-scale-name{white-space:nowrap;overflow:hidden!important;text-overflow:ellipsis;max-width:100%}.score-scale-notes{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:4px}.score-scale-row{display:flex;align-items:center;justify-content:center;gap:5px}.score-scale-row span{font-size:7.5px;line-height:1.05}.score-section-flow{margin-top:4px;font-size:11px;color:#9ca3af}.score-section-detail{max-height:0;opacity:0;overflow:hidden!important;color:#9ca3af;transform:translateY(-4px);transition:max-height .24s ease,opacity .2s ease,transform .2s ease,margin-top .2s ease;margin-top:0}.score-section-detail.open{max-height:240px;opacity:1;transform:translateY(0);margin-top:12px}.score-inline-detail{max-height:0;overflow:hidden!important;opacity:0;transform:translateY(-6px);transition:max-height .28s ease,opacity .22s ease,transform .22s ease,margin-top .22s ease}.score-inline-detail.open{max-height:520px;opacity:1;transform:translateY(0);margin-top:14px}.score-inline-detail .detail-block{background:#0f0f14;border:1px solid #2a2a2f}.dark .score-inline-detail .detail-block{background:#0f0f14;border-color:#2a2a2f}.tone-chord{color:#ea580c;font-weight:700}.tone-ext{color:#e5e7eb;font-weight:600}.dark .tone-ext{color:#e5e7eb}.tone-avoid{color:#71717a;text-decoration:line-through}.chord-diagram{width:110px;height:130px;background:#0f0f14;border:1px solid #2a2a2f;border-radius:10px;padding:8px;position:relative;display:flex;align-items:center;justify-content:center;pointer-events:auto;z-index:12;transition:border-color .25s ease,box-shadow .25s ease}.chord-diagram *{pointer-events:auto}.chord-diagram-swipe{position:absolute;top:0;right:0;bottom:0;left:0;z-index:7;background:transparent;touch-action:none}.chord-diagram-nav{position:absolute;left:50%;transform:translate(-50%);width:18px;height:18px;border-radius:999px;border:1px solid #2a2a2f;background:#0f0f14e6;color:#9ca3af;font-size:12px;line-height:16px;display:flex;align-items:center;justify-content:center;z-index:6;opacity:.9;transition:opacity .25s ease;pointer-events:auto}.chord-diagram-nav.up{top:4px}.chord-diagram-nav.down{bottom:4px}.chord-diagram-nav.fade{opacity:0;pointer-events:none}.chord-diagram-index{position:absolute;right:6px;bottom:6px;font-size:10px;color:#6b7280;background:#08080c99;padding:1px 4px;border-radius:6px;z-index:6;letter-spacing:.02em;opacity:0;transition:opacity .2s ease}.chord-diagram.show-index .chord-diagram-index{opacity:1}.chord-diagram.flash{border-color:#f97316;box-shadow:0 0 0 1px #f9731666}.chord-degree-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:30;pointer-events:auto;background:transparent;border-radius:999px}.chord-degree-zone{position:absolute;top:0;bottom:0;width:50%}.chord-degree-zone.left{left:0}.chord-degree-zone.right{right:0}.chord-diagram-toast{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px;color:#f97316;background:#08080cd9;padding:3px 8px;border-radius:10px;border:1px solid #2a2a2f;z-index:8;pointer-events:none}.chord-diagram svg{width:100%;height:100%}.chord-diagram .fret-label{position:absolute;top:6px;left:6px;font-size:10px;color:#9ca3af}.chord-diagram-inline{width:78px;height:98px;background:#0f0f14;border-color:#22242b;display:none;position:absolute;top:14px;right:14px;z-index:2;pointer-events:auto}.scale-degree.chord-card-active .chord-diagram-inline{display:flex!important}.chord-name{transform:translateY(-2px)}.chord-diagram-label{position:absolute;top:118px;right:14px;width:78px;text-align:center;font-size:10px;font-weight:600;color:#9ca3af;display:none}.scale-degree.chord-card-active .chord-diagram-label{display:block}.dark .tone-avoid{color:#a1a1aa}html.native header{display:none!important}html.native .content-area{padding-top:0!important}html.native #home-view{display:none!important}html.native,html.native body,html.native .content-area,html.native .view-scroll{-ms-overflow-style:none;scrollbar-width:none}html.native ::-webkit-scrollbar{display:none}.content-area.no-scroll,.content-area.no-scroll .view-scroll{overflow:hidden!important;overscroll-behavior:none;touch-action:none}html,body{height:100%;overflow:hidden}.app-container{height:100%}#help-title{display:none}html.light,body.light{background:#f6f2e9;color:#111}body.light .app-container,body.light .app-header,body.light .bottom-tabbar{background:#f6f2e9}body.light .app-header-title{color:#111}body.light .help-card{background:#fff8ef;border-color:#e6dfd4;box-shadow:0 10px 28px #00000014}body.light .help-tooltip{background:#fff8eff5;border-color:#e6dfd4;color:#111;box-shadow:0 8px 20px #0000001f}body.light .help-modal{background:#00000059}body.light .tool-card,body.light .tool-placeholder{background:#fff8ef;border-color:#e0d8cb}body.light .rhythm-shell{background:#fff8ef;border-color:#e0d8cb;box-shadow:none}body.light .rhythm-brand-mark{color:#111}body.light .rhythm-tab{background:#e9e3d6;border-color:#e0d8cb;color:#6b7280}body.light .rhythm-tab.active{background:#111;border-color:#111;color:#fff}body.light .rhythm-screen{background:#fffaf2;border-color:#e0d8cb}body.light .rhythm-screen-title{color:#f97316}body.light .rhythm-screen-header,body.light .rhythm-screen-status{color:#6b7280}body.light .rhythm-filter{background:#fff;border-color:#e0d8cb;color:#6b7280}body.light .rhythm-filter.active{background:#f97316;border-color:#f97316;color:#fff}body.light .rhythm-card{background:#fff;border-color:#e0d8cb}body.light .rhythm-card.active{border-color:#f97316;box-shadow:0 0 0 1px #f9731659 inset}body.light .rhythm-card.playing{border-color:inherit}body.light .rhythm-card.active-beat{border-color:#f97316}body.light .rhythm-icon{color:#f97316}body.light .rhythm-control{background:transparent;border-color:transparent}body.light .rhythm-control-label{color:#6b7280}body.light .rhythm-control-btn{background:#f2ede5;border-color:#e0d8cb;color:#111}body.light .rhythm-control-range{accent-color:#f97316}body.light .rhythm-control-value{color:#f97316}body.light .rhythm-action{background:#f97316;color:#fff}body.light .rhythm-action-icon{background:#111;color:#fff}body.light .rhythm-action.ghost{background:#fff;color:#111;border-color:#111}body.light .rhythm-card.dimmed{opacity:.45}body.light .rhythm-step{background:#cfc8bc}body.light .rhythm-step.rest:before,body.light .rhythm-step.rest:after{background:#cfc8bc}body.light .tuner-title{color:#111}body.light .tuner-subtitle,body.light .tuner-target,body.light .tuner-status{color:#6b7280}body.light .tuner-dial{background:#fff8ef;border-color:#e0d8cb;box-shadow:none}body.light .tuner-note{color:#111}body.light .tuner-detected{color:#c95f10}body.light .tuner-needle{background:#c95f10}body.light .tuner-string{background:#fff8ef;border-color:#e0d8cb;color:#111}body.light .tuner-string.active{background:#fff8ef;border-color:#c95f10;color:#c95f10}body.light .tuner-action{background:#111;color:#fff}body.light .metro-title{color:#111}body.light .metro-subtitle,body.light .metro-bpm-label,body.light .metro-signature-label{color:#6b7280}body.light .metro-beat{background:#e0d8cb;color:#6b7280}body.light .metro-beat.active,body.light .metro-beat.active.accent{background:#c95f10}body.light .metro-step{background:#fff8ef;border-color:#e0d8cb;color:#111}body.light .metro-bpm-value{color:#111}body.light .metro-range{accent-color:#c95f10}body.light .metro-range::-webkit-slider-runnable-track{background:linear-gradient(90deg,#c95f10 var(--range-progress, 0%),#e0d8cb var(--range-progress, 0%))}body.light .metro-range::-webkit-slider-thumb{background:#fff;border:2px solid #c95f10}body.light .metro-range::-moz-range-track{background:linear-gradient(90deg,#c95f10 var(--range-progress, 0%),#e0d8cb var(--range-progress, 0%))}body.light .metro-range::-moz-range-thumb{background:#fff;border:2px solid #c95f10}body.light .metro-tap{background:transparent;border-color:#111;color:#c95f10}body.light .metro-signature-toggle{background:transparent;border-color:#111;color:#111}body.light .metro-signature-options{background:transparent}body.light .metro-sig{background:#f1ede7;border-color:#e0d8cb;color:#6b7280}body.light .metro-sig.active{background:#fff8ef;border-color:#c95f10;color:#c95f10}body.light .metro-action{background:#111;color:#fff}body.light .tool-title{color:#111}body.light .tool-desc{color:#6b7280}body.light .tool-icon{color:#c95f10}body.light .edge-trigger{color:#71717a}body.light .bg-black{background-color:#f6f2e9!important}body.light .bg-\[\#1A1A1F\],body.light .bg-\[\#0F0F14\]{background-color:#fff8ef!important}body.light .bg-\[\#2A2A2F\]{background-color:#e8e1d6!important}body.light .border-\[\#2A2A2F\]{border-color:#e0d8cb!important}body.light .bg-zinc-900{background-color:#f6f2e9!important}body.light .bg-zinc-800{background-color:#fff8ef!important}body.light .bg-zinc-100{background-color:#fff!important}body.light .border-zinc-200{border-color:#e6dfd4!important}body.light .text-zinc-100{color:#111!important}body.light .text-zinc-200{color:#1f1f1f!important}body.light .text-zinc-300{color:#3f3f46!important}body.light .text-zinc-400{color:#52525b!important}body.light .text-zinc-500{color:#71717a!important}body.light .text-zinc-600{color:#6b7280!important}body.light .text-zinc-800{color:#1f1f1f!important}body.light .text-zinc-900{color:#111!important}body.light .scale-degree,body.light .scale-degree.is-secondary,body.light .chord-card-face,body.light .secondary-face,body.light .group.is-secondary .secondary-face{background-color:#fff8ef!important}body.light .scale-degree.is-secondary{border-color:#d4cdc2!important;box-shadow:none}body.light .chord-settings{background-color:#fff8ef}body.light .score-measure{background:#fff8ef;border-color:#e0d8cb}body.light .score-chord{background:#fff8ef;border-color:#e0d8cb;color:#111}body.light .score-inline-detail .detail-block{background:#fff8ef;border-color:#e0d8cb}body.light .score-chord-scale,body.light .score-chord-func,body.light .score-section-flow,body.light .score-section-detail{color:#6b7280}body.light .tone-ext{color:#111}body.light .tone-avoid{color:#9ca3af}body.light .chord-diagram{background:#fff8ef;border-color:#e0d8cb}body.light .chord-diagram-nav{background:#fff8efeb;border-color:#e0d8cb;color:#6b7280}body.light .scan-action-btn{background:#fff;border-color:#e0d8cb;color:#111;box-shadow:none}body.light .scan-action-btn.flash{box-shadow:none}body.light .bg-\[\#2F3036\]{background-color:#fff8ef!important}body.light .bg-\[\#3A3B41\]{background-color:#f0e8de!important}body.light .bg-\[\#111111\]{background-color:#f0e9df!important}body.light .border-\[\#1a1a1a\]{border-color:#e0d8cb!important}body.light .fret-cell{border-right-color:#d8d0c4}body.light .fret-0{background-color:#e8dfd4;border-right-color:#cfc6b9}body.light .guitar-string{background-color:#b8b0a4;box-shadow:none}body.light .fret-number{color:#7c6f63}body.light .no-accent.shadow-lg,body.light .no-accent.shadow-xl{box-shadow:none!important}.contrast-btn,.contrast-btn:hover,.contrast-btn:active,.contrast-btn:focus,.contrast-btn:focus-visible,.contrast-btn.no-accent:active,.contrast-btn.no-accent:focus,.contrast-btn.no-accent:focus-visible{background:#fff!important;border:1px solid #ffffff!important;color:#111!important;box-shadow:none!important;outline:none!important;-webkit-appearance:none;-webkit-tap-highlight-color:transparent}body.light .contrast-btn,body.light .contrast-btn:hover,body.light .contrast-btn:active,body.light .contrast-btn:focus,body.light .contrast-btn:focus-visible,body.light .contrast-btn.no-accent:active,body.light .contrast-btn.no-accent:focus,body.light .contrast-btn.no-accent:focus-visible{background:#111!important;border-color:#111!important;color:#fff!important;box-shadow:none!important;outline:none!important;-webkit-appearance:none;-webkit-tap-highlight-color:transparent}.contrast-btn.click-flash:active{opacity:1}.fixed-tone-btn,.fixed-tone-btn:hover,.fixed-tone-btn:active,.fixed-tone-btn:focus,.fixed-tone-btn:focus-visible{background:#27272a!important;border-color:#27272a!important;color:#d4d4d8!important;box-shadow:none!important;outline:none!important;-webkit-appearance:none;-webkit-tap-highlight-color:transparent}body.light .fixed-tone-btn,body.light .fixed-tone-btn:hover,body.light .fixed-tone-btn:active,body.light .fixed-tone-btn:focus,body.light .fixed-tone-btn:focus-visible{background:#e8e1d6!important;border-color:#e0d8cb!important;color:#52525b!important;box-shadow:none!important;outline:none!important;-webkit-appearance:none;-webkit-tap-highlight-color:transparent}body.light .secondary-face{color:#111}body.light .text-\[\#E5E7EB\],body.light .text-\[\#e5e7eb\]{color:#111!important}body.light .bg-\[\#1a1a1f\],body.light .bg-\[\#0f0f14\]{background-color:#fff8ef!important}body.light .bg-\[\#2a2a2f\]{background-color:#e8e1d6!important}body.light .border-\[\#2a2a2f\]{border-color:#e0d8cb!important}body.light .chord-diagram-index{color:#111;background:#fff8efe6;border:1px solid #e0d8cb}