@tailwind base;@tailwind components;@tailwind utilities;:root{--font-bebas:var(--font-bebas);--font-playfair:var(--font-playfair);--font-raleway:var(--font-raleway);--font-inter:var(--font-inter);--font-space-mono:var(--font-space-mono);--surface-deep:#0f111a;--surface-base:#101222;--surface-container-low:#181a2b;--surface-container:#1c1e2f;--surface-container-high:#27293a;--surface-variant:#323445;--fret-wire:#334155;--primary-container:#facc15;--primary:#ffecb9;--primary-fixed-dim:#eec200;--secondary:#4de082;--on-surface:#e1e1f8;--on-surface-variant:#d1c6ab;--glass-fill:rgba(26,28,44,.4);--glass-stroke:rgba(250,204,21,.12);--background:var(--surface-base);--foreground:var(--on-surface);--accent:var(--primary);--accent-dark:var(--primary-fixed-dim);--text-primary:var(--on-surface);--text-secondary:var(--on-surface-variant);--border-color:var(--fret-wire);--background-secondary:var(--surface-container);--background-hover:var(--surface-variant)}body[data-theme=light]{--surface-deep:#f3efe6;--surface-base:#f8f5ee;--surface-container-low:#f1eadf;--surface-container:rgba(255,250,243,.84);--surface-container-high:hsla(38,62%,95%,.94);--surface-variant:#d9cfbc;--fret-wire:rgba(120,105,78,.24);--primary-container:#c58f16;--primary:#6a521e;--primary-fixed-dim:#e0b03a;--secondary:#2f8b62;--on-surface:#1b1d22;--on-surface-variant:#655c4e;--glass-fill:rgba(255,248,240,.78);--glass-stroke:rgba(197,143,22,.16);--background:var(--surface-base);--foreground:var(--on-surface);--accent:#fff3d3;--accent-dark:#b88211;--text-primary:var(--on-surface);--text-secondary:var(--on-surface-variant);--border-color:var(--fret-wire);--background-secondary:var(--surface-container);--background-hover:rgba(197,143,22,.1)}@theme inline{--color-background:var(--background);--color-foreground:var(--foreground);--color-primary:var(--primary-container);--color-accent:var(--accent);--font-bebas:var(--font-bebas);--font-playfair:var(--font-playfair);--font-raleway:var(--font-raleway);--font-inter:var(--font-inter);--font-space-mono:var(--font-space-mono)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background-color:var(--surface-deep);background-image:radial-gradient(circle at top,rgba(250,204,21,.16),transparent 30%),radial-gradient(circle at bottom right,rgba(77,224,130,.08),transparent 28%),linear-gradient(180deg,var(--surface-deep) 0,var(--surface-base) 58%,var(--surface-container-low) 100%);background-attachment:fixed;color:var(--on-surface);font-family:var(--font-inter),Arial,Helvetica,sans-serif;text-rendering:optimizeLegibility;transition:background-color .3s ease,color .3s ease,background-image .3s ease}body[data-theme=light]{background-image:radial-gradient(circle at top,rgba(197,143,22,.16),transparent 26%),radial-gradient(circle at bottom right,rgba(47,139,98,.08),transparent 24%),linear-gradient(180deg,var(--surface-deep) 0,var(--surface-base) 58%,#ebe2d2 100%)}a{color:inherit}button,input,select,textarea{font:inherit}select{color-scheme:light}body[data-theme=dark] select{color-scheme:dark}body[data-theme=dark] optgroup,body[data-theme=dark] option,body[data-theme=dark] select{background-color:#181a2b;color:#f7ebc8}body[data-theme=dark] option:checked,body[data-theme=dark] option:hover{background-color:#2b3150;color:#fff6de}body[data-theme=light] optgroup,body[data-theme=light] option,body[data-theme=light] select{background-color:#fffaf2;color:#2f2516}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-frame{flex:1 1;width:100%;padding-top:5.75rem}.app-main{width:100%;flex:1 1;padding:0 1rem 4rem}.page-shell{width:min(100%,1280px);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.page-shell>*{width:100%}.site-header{position:fixed;inset:0 0 auto 0;z-index:1000;padding:1rem}.site-nav{width:min(100%,1536px);min-height:4.75rem;margin:0 auto;padding:.85rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1.25rem;border:1px solid var(--glass-stroke);border-radius:1.5rem;background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 16px 40px rgba(0,0,0,.2),inset 0 1px 0 hsla(0,0%,100%,.05)}.nav-brand{gap:.875rem;text-decoration:none;min-width:0}.nav-brand,.nav-brand-mark{display:inline-flex;align-items:center}.nav-brand-mark{width:2.9rem;height:2.9rem;justify-content:center;border-radius:999px;border:1px solid rgba(250,204,21,.24);background:linear-gradient(135deg,rgba(250,204,21,.26),rgba(250,204,21,.06));color:var(--primary-container);box-shadow:0 0 24px rgba(250,204,21,.14);flex-shrink:0}.nav-brand-icon{width:1.35rem;height:1.35rem}.nav-brand-copy{display:flex;flex-direction:column;min-width:0}.nav-brand-title{font-family:var(--font-bebas),sans-serif;font-size:clamp(1.65rem,2vw,2.1rem);letter-spacing:.08em;line-height:1;color:var(--primary-container)}.nav-brand-subtitle{font-family:var(--font-space-mono),monospace;font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--on-surface-variant);white-space:nowrap}.nav-links{display:none;align-items:center;justify-content:center;gap:.4rem;flex:1 1}.nav-link,.nav-mobile-link{display:inline-flex;align-items:center;gap:.55rem;padding:.8rem 1rem;border-radius:999px;font-family:var(--font-raleway),sans-serif;font-size:.95rem;font-weight:500;color:var(--on-surface-variant);text-decoration:none;transition:color .25s ease,background-color .25s ease,border-color .25s ease,transform .25s ease}.nav-link:hover,.nav-mobile-link:hover{color:var(--on-surface);background:rgba(250,204,21,.08);transform:translateY(-1px)}.nav-link.is-active,.nav-mobile-link.is-active{color:var(--primary-container);background:rgba(250,204,21,.12);box-shadow:inset 0 -2px 0 rgba(250,204,21,.65)}.nav-action-icon,.nav-link-icon{width:1rem;height:1rem;flex-shrink:0}.nav-actions{display:flex;align-items:center;gap:.6rem}.nav-action,.nav-mobile-action,.nav-mobile-toggle{border:1px solid var(--glass-stroke);background:hsla(0,0%,100%,.02);color:var(--on-surface);border-radius:999px;transition:background-color .25s ease,border-color .25s ease,color .25s ease,transform .25s ease}.nav-action,.nav-mobile-action{display:inline-flex;align-items:center;gap:.55rem;padding:.75rem 1rem;font-family:var(--font-raleway),sans-serif;font-size:.92rem;font-weight:600}.nav-action:hover,.nav-mobile-action:hover,.nav-mobile-toggle:hover{background:rgba(250,204,21,.12);border-color:rgba(250,204,21,.22);color:var(--primary-container);transform:translateY(-1px)}.nav-mobile-toggle{width:2.9rem;height:2.9rem;display:inline-flex;align-items:center;justify-content:center}.nav-mobile-panel{width:min(100%,1536px);margin:.6rem auto 0;padding:0;display:grid;grid-gap:1rem;gap:1rem;border-radius:1.5rem;border:1px solid transparent;background:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);opacity:0;pointer-events:none;transform:translateY(-12px);transition:opacity .25s ease,transform .25s ease,background-color .25s ease,border-color .25s ease,padding .25s ease}.nav-mobile-panel.is-open{padding:1rem;border-color:var(--glass-stroke);background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);opacity:1;pointer-events:auto;transform:translateY(0);box-shadow:0 18px 44px rgba(0,0,0,.18)}.nav-mobile-actions,.nav-mobile-links{display:grid;grid-gap:.65rem;gap:.65rem}.site-footer{width:100%;padding:0 1rem 1.25rem}.site-footer-inner{width:min(100%,1536px);margin:0 auto;padding:2.5rem 1.5rem;display:grid;grid-gap:2rem;gap:2rem;border-top:1px solid rgba(250,204,21,.16);background:linear-gradient(180deg,hsla(0,0%,100%,.01),hsla(0,0%,100%,0)),var(--surface-deep);border-radius:1.75rem;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.04)}.site-footer-kicker{margin:0 0 .6rem;font-family:var(--font-space-mono),monospace;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--primary-container)}.site-footer-title{margin:0;font-family:var(--font-bebas),sans-serif;font-size:clamp(2rem,4vw,2.6rem);letter-spacing:.08em;color:var(--on-surface)}.site-footer-copy,.site-footer-meta-text{margin:0;font-family:var(--font-raleway),sans-serif;line-height:1.7;color:var(--on-surface-variant)}.site-footer-copy{max-width:32rem;margin-top:.65rem}.site-footer-links{display:flex;flex-wrap:wrap;gap:.85rem 1.15rem}.site-footer-link{font-family:var(--font-space-mono),monospace;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--on-surface-variant);transition:color .25s ease}.site-footer-link:hover{color:var(--secondary)}.site-footer-meta{display:grid;grid-gap:.35rem;gap:.35rem}body[data-theme=light] .site-footer-inner{background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.08)),hsla(43,58%,95%,.82)}@media (min-width:960px){.app-main{padding-inline:2rem}.nav-links{display:flex}.nav-mobile-panel,.nav-mobile-toggle{display:none}.site-footer-inner{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);align-items:start}.site-footer-meta{justify-items:end;text-align:right}}@media (max-width:959px){.nav-action span{display:none}.site-nav{gap:.8rem}}@media (max-width:767px){.app-frame{padding-top:5.4rem}.app-main{padding:0 .85rem 3rem}.site-footer,.site-header{padding-inline:.75rem}.site-nav{min-height:4.4rem;padding:.75rem .9rem;border-radius:1.25rem}.nav-brand-mark,.nav-mobile-toggle{width:2.7rem;height:2.7rem}.nav-brand-title{font-size:1.55rem}.nav-brand-subtitle{font-size:.62rem;letter-spacing:.2em}.site-footer-inner{padding:2rem 1.15rem}.site-footer-links{gap:.65rem .9rem}}@media (max-width:560px){.nav-brand-subtitle{display:none}.nav-actions{gap:.45rem}.nav-action,.nav-mobile-toggle{padding-inline:.8rem}}@media (orientation:landscape) and (max-height:520px){.app-frame{padding-top:6.35rem}.app-main{padding-bottom:2.5rem}.site-header{padding:.65rem .85rem}.site-nav{min-height:4.1rem;padding:.6rem .8rem;border-radius:1.2rem}.nav-brand{gap:.7rem}.nav-brand-mark,.nav-mobile-toggle{width:2.55rem;height:2.55rem}.nav-action-icon,.nav-brand-icon{width:1.05rem;height:1.05rem}.nav-brand-title{font-size:1.8rem}.nav-brand-subtitle{font-size:.58rem;letter-spacing:.22em}.nav-actions{gap:.45rem}.nav-action,.nav-mobile-action{padding:.6rem .8rem}.nav-mobile-panel{margin-top:.4rem}.nav-mobile-panel.is-open{padding:.8rem;border-radius:1.2rem}}@media (max-width:768px){.about-container,.chord-container,.circle-of-fifths-container,.scale-container,.tuner-container{padding:1.5rem}.chord-form,.scale-selector{grid-template-columns:1fr}.fretboard-container{width:100%;max-width:100%;overflow-x:auto;padding:.5rem;margin:0 auto;justify-content:flex-start;align-items:flex-start;box-sizing:border-box}.fretboard-loading{min-height:250px;padding:1.5rem}.spinner{width:40px;height:40px;border-width:3px}.fretboard-loading p{font-size:1rem}.fretboard{min-width:calc(25 * 32px);width:min-content;margin:0;padding:.8rem}.fret-numbers,.string-row{grid-template-columns:repeat(25,minmax(32px,1fr))}.fret{height:2.5rem;padding:.4rem}.fret:not(:first-child){border-left:1px solid #4b5563}.note-marker{width:1.6rem;height:1.6rem;font-size:.75rem}.note-marker.root{background-color:#000}.note-marker.scale{background-color:#fb923c}.note-marker.non-scale{background-color:#6b7280;opacity:.5}}@media (max-width:480px){.about-container,.chord-container,.circle-of-fifths-container,.scale-container,.tuner-container{padding:1rem}.fretboard-container{padding:.3rem}.fretboard-loading{min-height:200px;padding:1rem}.spinner{width:35px;height:35px;border-width:2px}.fretboard-loading p{font-size:.9rem}.fretboard{min-width:calc(25 * 28px);padding:.6rem}.fret-numbers{font-size:.75rem}.fret-numbers,.string-row{grid-template-columns:repeat(25,minmax(28px,1fr))}.fret{height:2rem;padding:.3rem}.note-marker{width:1.3rem;height:1.3rem;font-size:.65rem}}.navbar{position:fixed;top:0;left:0;right:0;width:100vw;padding:16px 32px;display:flex;justify-content:space-between;align-items:center;background:rgba(15,23,42,.95);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(245,158,11,.2);box-sizing:border-box;z-index:1000;box-shadow:0 4px 20px rgba(0,0,0,.1)}.nav-left{display:flex;gap:20px;margin-left:2rem}.nav-btn{font-size:16px;font-weight:500;font-family:var(--font-raleway),sans-serif;background:none;border:none;color:var(--text-primary);cursor:pointer;padding:12px 20px;transition:all .3s ease;display:flex;align-items:center;gap:8px;border-radius:12px;text-decoration:none;position:relative;overflow:hidden}.nav-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(245,158,11,.1),transparent);transition:left .5s ease}.nav-btn:hover:before{left:100%}.nav-btn:hover{background-color:rgba(245,158,11,.1);transform:translateY(-2px);color:var(--primary)}.nav-btn.active{background:linear-gradient(135deg,rgba(245,158,11,.2),rgba(245,158,11,.1));color:var(--primary);border:1px solid rgba(245,158,11,.3)}.nav-icon{width:20px;height:20px;transition:all .3s ease}.nav-btn:hover .nav-icon{transform:scale(1.1) rotate(5deg);color:var(--primary)}.nav-btn.active .nav-icon{color:var(--primary)}.nav-right{display:flex;gap:1rem;margin-right:2rem}.theme-toggle{padding:10px 16px;background:rgba(30,41,59,.8);color:var(--text-primary);border:1px solid rgba(245,158,11,.2);border-radius:10px;cursor:pointer;font-weight:500;font-family:var(--font-raleway),sans-serif;transition:all .3s ease;display:flex;align-items:center;gap:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.theme-toggle:hover{background:rgba(245,158,11,.2);border-color:rgba(245,158,11,.4);transform:translateY(-2px);color:var(--primary)}body[data-theme=light] .navbar{background:hsla(0,0%,100%,.95);border-bottom-color:rgba(245,158,11,.3)}body[data-theme=light] .theme-toggle{background:hsla(0,0%,100%,.8);color:var(--background);border-color:rgba(245,158,11,.3)}body[data-theme=light] .theme-toggle:hover{background:rgba(245,158,11,.2);color:var(--primary)}body[data-theme=light] .nav-btn{color:var(--background)}body[data-theme=light] .nav-btn:hover{background-color:rgba(245,158,11,.1);color:var(--primary)}.box{padding:20px;border-radius:10px;margin-bottom:20px;transition:background .3s ease,color .3s ease}.about-container,.chord-container,.circle-of-fifths-container,.scale-container,.tuner-container{width:100%;max-width:1200px;margin:0 auto;padding:2rem;box-sizing:border-box;background:rgba(15,23,42,.8);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(245,158,11,.2);border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,.2),0 0 0 1px rgba(245,158,11,.1),inset 0 1px 0 hsla(0,0%,100%,.1);transition:all .3s ease}body[data-theme=light] .about-container,body[data-theme=light] .chord-container,body[data-theme=light] .scale-container,body[data-theme=light] .tuner-container{background:hsla(0,0%,100%,.9);color:var(--background);border-color:rgba(245,158,11,.3);box-shadow:0 20px 40px rgba(0,0,0,.1),0 0 0 1px rgba(245,158,11,.1)}body[data-theme=dark] .about-container,body[data-theme=dark] .chord-container,body[data-theme=dark] .scale-container,body[data-theme=dark] .tuner-container{background:rgba(15,23,42,.8);color:var(--text-primary);border-color:rgba(245,158,11,.2)}.tuner-title{font-size:1.25rem;font-weight:600;font-family:var(--font-playfair),serif;margin-bottom:1rem;color:var(--primary)}.tuner-note{font-size:1.75rem;font-weight:700;color:var(--primary);letter-spacing:2px}.tuner-indicator{margin-left:.5rem;font-size:1rem;color:var(--text-secondary);font-family:var(--font-raleway),sans-serif}.tuner-bar-container{position:relative;height:7rem;margin-bottom:1rem}.tuner-bar{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-end}.tuner-bar-indicator{height:1.5rem;width:4px;border-radius:9999px;transition:transform .2s ease}.tuner-bar-labels{display:flex;justify-content:space-between;font-size:.875rem;padding:0 1rem;color:#9ca3af;margin-top:5rem}.tuner-button{margin-top:1rem;padding:.75rem 1.5rem;font-weight:600;font-family:var(--font-raleway),sans-serif;color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px rgba(0,0,0,.2);position:relative;overflow:hidden}.tuner-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);transition:left .5s ease}.tuner-button:hover:before{left:100%}.tuner-button.on{background:linear-gradient(135deg,#ef4444,#dc2626)}.tuner-button.on:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(239,68,68,.4)}.tuner-button.off{background:linear-gradient(135deg,#16a34a,#15803d)}.tuner-button.off:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(22,163,74,.4)}.scale-title{font-size:1.5rem;font-weight:700;font-family:var(--font-playfair),serif;margin-bottom:1rem;color:var(--primary)}.scale-selector{display:grid;grid-gap:1rem;gap:1rem;margin-bottom:2rem}@media (min-width:768px){.scale-selector{grid-template-columns:repeat(3,1fr)}}.scale-selector label{display:block;margin-bottom:.5rem;color:inherit}.scale-selector select{width:100%;padding:.75rem;border-radius:10px;border:1px solid rgba(245,158,11,.3);background:rgba(30,41,59,.8);color:var(--text-primary);font-family:var(--font-raleway),sans-serif;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.scale-selector select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(245,158,11,.1)}body[data-theme=light] .scale-selector select{background:hsla(0,0%,100%,.9);color:var(--background);border-color:rgba(245,158,11,.3)}body[data-theme=dark] .scale-selector select{background:rgba(30,41,59,.8);color:var(--text-primary);border-color:rgba(245,158,11,.3)}.scale-info{margin:1rem 0;color:inherit}.fretboard-container::-webkit-scrollbar{height:8px}.fretboard-container::-webkit-scrollbar-track{background:rgba(0,0,0,.1);border-radius:4px}.fretboard-container::-webkit-scrollbar-thumb{background:rgba(139,69,19,.5);border-radius:4px}.fretboard-container::-webkit-scrollbar-thumb:hover{background:rgba(139,69,19,.7)}.fretboard{background:linear-gradient(135deg,#7b4c2f,#a76a3d);padding:2rem;border-radius:16px;min-width:900px;margin:0 auto;box-shadow:0 15px 40px rgba(0,0,0,.4),inset 0 2px 0 hsla(0,0%,100%,.1);border:3px solid rgba(139,69,19,.3);position:relative;overflow:hidden}.fretboard:before{left:0;right:0;bottom:0;background-image:linear-gradient(90deg,transparent,transparent calc(100% / 25 - 1px),hsla(0,0%,100%,.1) calc(100% / 25 - 1px),hsla(0,0%,100%,.1) calc(100% / 25),transparent calc(100% / 25))}.fretboard:after,.fretboard:before{content:"";position:absolute;top:0;pointer-events:none;z-index:1}.fretboard:after{left:calc(12 * 100% / 25);width:2px;height:100%;background:hsla(0,0%,100%,.2)}.fret-numbers{display:grid;grid-template-columns:repeat(25,minmax(35px,1fr));border-bottom:1px solid hsla(0,0%,100%,.2);margin-bottom:1rem;color:#fef3c7;font-size:.875rem;font-weight:600;text-align:center;z-index:2}.fret-number:nth-child(10),.fret-number:nth-child(12),.fret-number:nth-child(16),.fret-number:nth-child(18),.fret-number:nth-child(20),.fret-number:nth-child(22),.fret-number:nth-child(25),.fret-number:nth-child(4),.fret-number:nth-child(6),.fret-number:nth-child(8),.fret-numbers{position:relative}.fret-number:nth-child(10):after,.fret-number:nth-child(13):after,.fret-number:nth-child(16):after,.fret-number:nth-child(18):after,.fret-number:nth-child(20):after,.fret-number:nth-child(22):after,.fret-number:nth-child(25):after,.fret-number:nth-child(4):after,.fret-number:nth-child(6):after,.fret-number:nth-child(8):after{content:"";position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);width:18px;height:18px;background:hsla(0,0%,100%,.4);border-radius:50%;z-index:2;box-shadow:0 2px 4px rgba(0,0,0,.3)}.fret-number:nth-child(13):after{width:20px;height:20px;background:rgba(245,158,11,.6);box-shadow:0 3px 6px rgba(0,0,0,.4)}.strings-container{display:flex;flex-direction:column;gap:-1rem}.string-row{display:grid;grid-template-columns:repeat(25,minmax(35px,1fr));margin-bottom:-.5rem;position:relative;z-index:2}.string-row-all,.string-row-scale{margin-bottom:1rem}.string-row:last-child{margin-bottom:0}.string-row:after{content:"";position:absolute;left:0;right:0;bottom:-.375rem;height:1px;background:hsla(0,0%,100%,.2);z-index:1}.fret{position:relative;display:flex;align-items:center;justify-content:center;height:3rem;z-index:3;overflow:hidden;padding:-.5rem}.fret:first-child{background:hsla(0,0%,100%,.05);border-radius:4px 0 0 4px}.note-marker{width:1.8rem;height:1.8rem;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-family:"Inter","Poppins",var(--font-raleway),sans-serif;font-size:.65rem;transition:all .2s ease;box-shadow:0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.1);position:relative;overflow:hidden;cursor:pointer;flex-shrink:0}.note-marker:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);transition:left .3s ease}.note-marker:hover:before{left:100%}.note-marker:hover{transform:scale(1.1);box-shadow:0 6px 20px rgba(0,0,0,.5),inset 0 1px 0 hsla(0,0%,100%,.2)}.note-marker.root{background:radial-gradient(circle at 30% 30%,#f59e0b,#d97706);border:2px solid #fef3c7;box-shadow:0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.2),0 0 10px rgba(245,158,11,.3)}.note-marker.scale{background:radial-gradient(circle at 30% 30%,#fbbf24,#f59e0b);border:2px solid hsla(48,96%,89%,.8);box-shadow:0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.1)}.note-marker.non-scale{background:radial-gradient(circle at 30% 30%,#6b7280,#4b5563);border:2px solid hsla(220,9%,46%,.5);opacity:.8;box-shadow:0 4px 12px rgba(0,0,0,.3),inset 0 1px 0 hsla(0,0%,100%,.05)}.fretboard-container{position:relative}.fretboard-container:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(135deg,rgba(245,158,11,.1),rgba(139,69,19,.1));border-radius:18px;z-index:-1;filter:blur(4px)}.fretboard:before{background-image:linear-gradient(90deg,transparent,transparent calc(100% / 25 - 1px),hsla(0,0%,100%,.15) calc(100% / 25 - 1px),hsla(0,0%,100%,.15) calc(100% / 25),transparent calc(100% / 25))}.scale-border-l,.scale-empty,.scale-note,.scale-table{display:none}.chord-title{font-size:1.25rem;font-weight:600;font-family:var(--font-playfair),serif;color:var(--primary);margin-bottom:1rem}.chord-form{display:grid;grid-gap:1rem;gap:1rem;margin-bottom:1rem}.chord-form.scale-selector{justify-content:center;align-items:center;display:flex;gap:2rem;margin-bottom:1.5rem}@media (min-width:768px){.chord-form{grid-template-columns:repeat(4,1fr);text-align:left}}@media (max-width:700px){.chord-form.scale-selector{flex-direction:column;gap:1rem;align-items:stretch}}.chord-label{font-size:.875rem;font-weight:500;margin-bottom:4px;display:block;color:inherit}.chord-select{width:100%;padding:.5rem;border-radius:6px;border:1px solid #ccc;color:#1f2937;background-color:#fff}body[data-theme=dark] .chord-select{background-color:#2a2a2a;color:#fff;border-color:#444}.chord-checkbox-wrapper{display:flex;align-items:center;margin-top:1.5rem}.chord-checkbox-wrapper label{font-size:.875rem;color:inherit}.chord-explanation{font-size:.875rem;color:#6b7280;font-style:italic;margin-bottom:.25rem}.chord-notes{font-size:.875rem;font-weight:500;color:inherit;margin-bottom:1rem}.ico-button{width:20px;height:20px}.tuner-button-wrapper{display:flex;justify-content:center;margin-top:1rem}.footer{width:100%;padding:1.5rem 0;border-top:1px solid rgba(245,158,11,.2);transition:all .3s ease;margin-top:auto;background:rgba(15,23,42,.8);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}body[data-theme=light] .footer{background:hsla(0,0%,100%,.9);color:var(--background);border-top-color:rgba(245,158,11,.3)}body[data-theme=dark] .footer{background:rgba(15,23,42,.8);color:var(--text-primary);border-top-color:rgba(245,158,11,.2)}.footer-content{max-width:1200px;margin:0 auto;padding:0 2rem;text-align:center}.footer-text{font-size:.875rem;font-family:var(--font-raleway),sans-serif}.footer-link{color:var(--primary);margin-left:.5rem;text-decoration:none;transition:all .3s ease;font-weight:500}.footer-link:hover{color:var(--accent);text-decoration:underline}@media (max-width:768px){.footer{padding:1rem 0}.footer-content{padding:0 1rem}.footer-text{font-size:.8rem}}@media (max-width:480px){.footer{padding:.8rem 0}.footer-content{padding:0 .8rem}.footer-text{font-size:.75rem}}.titulo-container{display:flex;justify-content:center;align-items:center;margin:1.5rem auto .75rem;text-align:center;padding:1rem 0;position:relative;width:100%;max-width:1280px;box-sizing:border-box}.titulo-wrapper{flex-direction:column;width:min(100%,960px);padding:2rem 3rem;background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--glass-stroke);border-radius:28px;box-shadow:0 20px 40px rgba(0,0,0,.3),0 0 0 1px rgba(250,204,21,.08),inset 0 1px 0 hsla(0,0%,100%,.1)}.titulo-icons,.titulo-wrapper{display:flex;align-items:center;gap:1.5rem}.titulo-icons{margin-bottom:1rem}.icon-center,.icon-left,.icon-right{width:2.5rem;height:2.5rem;color:var(--primary-container);filter:drop-shadow(0 0 10px rgba(250,204,21,.4));transition:all .3s ease}.icon-center:hover,.icon-left:hover,.icon-right:hover{transform:scale(1.1) rotate(5deg);color:var(--primary)}.titulo-principal{margin:0;font-family:var(--font-bebas),sans-serif;font-size:clamp(3.8rem,8vw,5.8rem);font-weight:400;letter-spacing:.08em;line-height:1}.titulo-text{background:linear-gradient(135deg,var(--primary-container) 0,var(--primary) 50%,var(--primary-container) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(250,204,21,.22);position:relative}.titulo-text:before{content:"";position:absolute;top:-10px;left:-10px;right:-10px;bottom:-10px;background:linear-gradient(135deg,var(--primary-container),var(--primary));z-index:-1;filter:blur(20px);opacity:.22;border-radius:20px}.titulo-subtitle{font-family:var(--font-space-mono),monospace;font-size:.85rem;color:var(--on-surface-variant);margin:0;opacity:.95;font-weight:700;letter-spacing:.24em;text-transform:uppercase}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.titulo-wrapper{animation:float 6s ease-in-out infinite}@media (max-width:768px){.titulo-container{margin:1rem auto .5rem;padding:.75rem 0}.titulo-wrapper{padding:1.5rem 2rem;gap:1rem}.titulo-principal{letter-spacing:.06em}.titulo-subtitle{font-size:.78rem}.titulo-icons{gap:1rem}.icon-center,.icon-left,.icon-right{width:2rem;height:2rem}}@media (max-width:480px){.titulo-wrapper{padding:1.25rem 1.1rem;border-radius:24px}.titulo-icons{gap:.8rem}.icon-center,.icon-left,.icon-right{width:1.8rem;height:1.8rem}}.section-kicker{display:inline-block;font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--primary-container)}.about-page,.home-page{width:100%;display:flex;flex-direction:column;gap:2rem}.about-hero,.about-values-section,.home-hero,.home-tools,.home-workbench{width:100%}.about-hero-panel,.home-hero-panel{position:relative;overflow:hidden;padding:clamp(2rem,4vw,4rem);border-radius:2rem;border:1px solid var(--glass-stroke);background:radial-gradient(circle at top right,rgba(250,204,21,.18),transparent 28%),radial-gradient(circle at bottom left,rgba(77,224,130,.08),transparent 24%),linear-gradient(180deg,rgba(26,28,44,.78),rgba(16,18,34,.92));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 24px 60px rgba(0,0,0,.24),inset 0 1px 0 hsla(0,0%,100%,.08)}body[data-theme=light] .about-hero-panel,body[data-theme=light] .home-hero-panel{background:radial-gradient(circle at top right,rgba(214,162,15,.18),transparent 30%),radial-gradient(circle at bottom left,rgba(31,154,90,.08),transparent 24%),linear-gradient(180deg,rgba(255,248,238,.9),hsla(38,51%,93%,.95))}.about-hero-panel:before,.home-hero-panel:before{content:"";position:absolute;inset:auto -10% -35% auto;width:22rem;height:22rem;border-radius:999px;background:rgba(250,204,21,.08);filter:blur(30px);pointer-events:none}.about-hero-panel,.home-hero-actions,.home-hero-copy,.home-hero-metrics{position:relative;z-index:1}.about-hero-title,.about-section-title,.home-hero-title,.home-section-title{margin:0;color:var(--on-surface)}.home-hero-title{max-width:16ch;margin-top:1rem;font-family:var(--font-inter),sans-serif;font-size:clamp(2.75rem,7vw,5.5rem);font-weight:800;line-height:.97;letter-spacing:-.04em}.home-hero-title span{color:var(--primary-container)}.about-hero-text,.about-meta-text,.about-story-copy p,.about-value-text,.home-card-text,.home-hero-text,.home-section-text{font-family:var(--font-raleway),sans-serif;line-height:1.75;color:var(--on-surface-variant)}.home-hero-text{max-width:44rem;margin:1.5rem 0 0;font-size:1.05rem}.home-hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}.about-contact-button,.home-cta{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:3.6rem;padding:.95rem 1.5rem;border-radius:1rem;text-decoration:none;transition:transform .25s ease,background-color .25s ease,border-color .25s ease,color .25s ease}.about-contact-button:hover,.about-contact-card:hover,.about-meta-card:hover,.about-story-card:hover,.about-value-card:hover,.home-cta:hover,.home-info-card:hover,.home-tool-card:hover{transform:translateY(-3px)}.about-contact-button.primary,.home-cta-primary{background:var(--primary-container);color:#231b00;font-weight:700;box-shadow:0 0 24px rgba(250,204,21,.18)}.about-contact-button.secondary,.home-cta-secondary{border:1px solid hsla(0,0%,100%,.14);background:hsla(0,0%,100%,.03);color:var(--on-surface);font-weight:600}body[data-theme=light] .about-contact-button.secondary,body[data-theme=light] .home-cta-secondary{border-color:rgba(90,69,20,.14);background:hsla(0,0%,100%,.45)}.about-contact-icon,.home-cta-icon,.home-tool-link-icon{width:1rem;height:1rem}.home-hero-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:1rem;gap:1rem;max-width:52rem;margin-top:2rem}.about-contact-card,.about-meta-card,.about-story-card,.about-value-card,.home-info-card,.home-metric-card,.home-tool-card{border:1px solid var(--glass-stroke);background:var(--glass-fill);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 18px 44px rgba(0,0,0,.18),inset 0 1px 0 hsla(0,0%,100%,.05)}body[data-theme=light] .about-contact-card,body[data-theme=light] .about-meta-card,body[data-theme=light] .about-story-card,body[data-theme=light] .about-value-card,body[data-theme=light] .home-info-card,body[data-theme=light] .home-metric-card,body[data-theme=light] .home-tool-card{background:rgba(255,250,242,.76)}.home-metric-card{display:flex;align-items:center;gap:.9rem;padding:1rem 1.1rem;border-radius:1.15rem}.about-meta-icon,.about-value-icon-svg,.home-metric-icon,.home-tool-icon{color:var(--primary-container)}.home-metric-label{display:block;font-family:var(--font-space-mono),monospace;font-size:.65rem;text-transform:uppercase;letter-spacing:.22em;color:var(--on-surface-variant)}.home-metric-value{display:block;margin-top:.25rem;font-family:var(--font-raleway),sans-serif;font-size:.95rem;color:var(--on-surface)}.about-meta-grid,.about-values-grid,.home-tools-grid,.home-workflow-grid{display:grid;grid-gap:1.25rem;gap:1.25rem}.home-workflow-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.home-info-card{min-height:100%;padding:1.5rem;border-radius:1.35rem}.home-info-card.accent-primary{border-left:4px solid var(--primary-container)}.home-info-card.accent-secondary{border-left:4px solid var(--secondary)}.home-info-card.accent-tertiary{border-left:4px solid #ffb3b0}.home-info-card.accent-primary-soft{border-left:4px solid var(--primary)}.about-story-kicker,.home-card-kicker{display:inline-block;margin-bottom:.8rem;font-family:var(--font-space-mono),monospace;font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--on-surface-variant)}.about-value-title,.home-card-title,.home-tool-title{margin:0;font-family:var(--font-inter),sans-serif;font-size:1.45rem;font-weight:700;color:var(--on-surface)}.home-card-text{margin:.9rem 0 0;font-size:.98rem}.about-values-header,.home-tools-header,.home-workbench-header{display:grid;grid-gap:1rem;gap:1rem;margin-bottom:1.5rem}.about-section-title,.home-section-title{margin-top:.8rem;font-family:var(--font-bebas),sans-serif;font-size:clamp(2rem,5vw,3.25rem);line-height:.95;letter-spacing:.04em}.home-section-text{max-width:42rem;margin:0;font-size:1rem}.home-workbench-shell{width:100%}.home-workbench-shell .scale-container{max-width:100%}.home-tools-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.home-tool-card{display:flex;flex-direction:column;gap:1rem;padding:1.6rem;border-radius:1.5rem;text-decoration:none;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.home-tool-card:hover{border-color:rgba(250,204,21,.24)}.about-value-icon,.home-tool-icon-wrap{width:3.25rem;height:3.25rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(250,204,21,.16);background:rgba(250,204,21,.08)}.home-tool-text{margin:0;font-family:var(--font-raleway),sans-serif;line-height:1.7;color:var(--on-surface-variant)}.home-tool-link{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-space-mono),monospace;font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--primary-container)}.about-hero-title{margin-top:.8rem;font-family:var(--font-bebas),sans-serif;font-size:clamp(3.1rem,7vw,5.8rem);line-height:.92;letter-spacing:.04em;color:var(--primary-container)}.about-hero-text{max-width:44rem;margin:1.25rem 0 0;font-size:1.05rem}.about-story-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);grid-gap:1.5rem;gap:1.5rem;width:100%}.about-contact-card,.about-meta-card,.about-story-card,.about-value-card{border-radius:1.6rem;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.about-story-card{padding:1.8rem}.about-story-copy{display:grid;grid-gap:1rem;gap:1rem}.about-feature-list,.about-meta-text,.about-story-copy p{margin:0;font-size:1rem}.about-feature-list{list-style:none;padding:0;display:grid;grid-gap:.85rem;gap:.85rem}.about-feature-list li{padding:1rem 1.05rem;border-radius:1rem;background:rgba(250,204,21,.08);border:1px solid rgba(250,204,21,.12);font-family:var(--font-raleway),sans-serif;line-height:1.6;color:var(--on-surface)}body[data-theme=light] .about-feature-list li{background:rgba(214,162,15,.08);border-color:rgba(214,162,15,.14)}.about-values-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.about-value-card{padding:1.7rem}.about-value-icon{margin-bottom:1.1rem}.about-value-text{margin:.85rem 0 0;font-size:.98rem}.about-meta-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);width:100%}.about-contact-card,.about-meta-card{padding:1.8rem}.about-meta-heading{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}.about-meta-icon{width:1.4rem;height:1.4rem;margin-top:.4rem;flex-shrink:0}.about-stack{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}.about-stack-pill{display:inline-flex;align-items:center;min-height:2.4rem;padding:.55rem .9rem;border-radius:999px;background:hsla(0,0%,100%,.04);border:1px solid rgba(250,204,21,.14);font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-surface)}body[data-theme=light] .about-stack-pill{background:hsla(0,0%,100%,.55)}.about-contact-actions{display:grid;grid-gap:.85rem;gap:.85rem;margin-top:1.5rem}body[data-theme=light] .about-hero-title,body[data-theme=light] .about-meta-icon,body[data-theme=light] .about-value-icon-svg,body[data-theme=light] .home-hero-title span,body[data-theme=light] .home-metric-icon,body[data-theme=light] .home-tool-icon,body[data-theme=light] .home-tool-link,body[data-theme=light] .section-kicker{color:var(--primary)}.chord-workspace,.scale-workspace,.tuner-workspace{display:flex;flex-direction:column;gap:1.5rem}.chord-workspace-header,.scale-workspace-header,.tuner-workspace-header{display:grid;grid-gap:.85rem;gap:.85rem}.chord-workspace-title,.scale-workspace-title,.tuner-workspace-title{margin-bottom:0}.chord-extension-copy,.chord-workspace-text,.scale-workspace-text,.tuner-panel-text,.tuner-workspace-text{margin:0;font-family:var(--font-raleway),sans-serif;font-size:1rem;line-height:1.75;color:var(--on-surface-variant)}.chord-details-grid,.chord-workspace-grid,.scale-controls-grid,.scale-insight-grid,.tuner-workspace-grid{display:grid;grid-gap:1.2rem;gap:1.2rem}.scale-controls-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.chord-control-panel,.chord-detail-card,.chord-visual-panel,.scale-control-card,.scale-fretboard-shell,.scale-insight-card,.tuner-config-card,.tuner-gauge-card,.tuner-reference-card{border:1px solid var(--glass-stroke);background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.18),inset 0 1px 0 hsla(0,0%,100%,.05)}body[data-theme=light] .chord-control-panel,body[data-theme=light] .chord-detail-card,body[data-theme=light] .chord-visual-panel,body[data-theme=light] .scale-control-card,body[data-theme=light] .scale-fretboard-shell,body[data-theme=light] .scale-insight-card,body[data-theme=light] .tuner-config-card,body[data-theme=light] .tuner-gauge-card,body[data-theme=light] .tuner-reference-card{background:rgba(255,250,242,.76)}.scale-control-card{padding:1.35rem;border-radius:1.3rem;min-height:100%}.scale-control-card.accent-primary{border-left:4px solid var(--primary-container)}.scale-control-card.accent-secondary{border-left:4px solid var(--secondary)}.scale-control-card.accent-tertiary{border-left:4px solid #ffb3b0}.scale-control-card.accent-primary-soft{border-left:4px solid var(--primary)}.chord-panel-kicker,.scale-control-kicker{display:inline-block;margin-bottom:.8rem;font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--on-surface-variant)}.scale-control-title{display:block;margin-bottom:.8rem;font-family:var(--font-inter),sans-serif;font-size:1.35rem;font-weight:700;color:var(--on-surface)}.scale-workspace-select{width:100%;min-height:3rem;padding:.8rem .9rem;border-radius:.95rem;border:1px solid rgba(250,204,21,.14);background:hsla(0,0%,100%,.04);color:var(--on-surface);font-family:var(--font-raleway),sans-serif;transition:border-color .25s ease,background-color .25s ease,box-shadow .25s ease}.scale-workspace-select:focus{outline:none;border-color:rgba(250,204,21,.45);box-shadow:0 0 0 3px rgba(250,204,21,.12)}body[data-theme=light] .scale-workspace-select{background:hsla(0,0%,100%,.58)}.scale-legend-strip{display:flex;flex-wrap:wrap;gap:.8rem}.scale-legend-pill,.scale-stat-chip{display:inline-flex;align-items:center;gap:.55rem;min-height:2.4rem;padding:.55rem .9rem;border-radius:999px;border:1px solid rgba(250,204,21,.12);background:hsla(0,0%,100%,.04);font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-surface)}.scale-legend-pill.root{border-color:rgba(250,204,21,.3)}.scale-legend-pill.scale{border-color:rgba(77,224,130,.26)}.scale-legend-pill.neutral{border-color:hsla(0,0%,100%,.08);color:var(--on-surface-variant)}.scale-legend-dot{width:.75rem;height:.75rem;border-radius:999px;background:var(--surface-variant)}.scale-legend-pill.root .scale-legend-dot{background:var(--primary-container)}.scale-legend-pill.scale .scale-legend-dot{background:var(--secondary)}.scale-fretboard-shell{padding:1.5rem;border-radius:1.7rem}.scale-fretboard-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.scale-fretboard-title{margin:0;font-family:var(--font-bebas),sans-serif;font-size:clamp(1.9rem,4vw,2.8rem);letter-spacing:.05em;color:var(--on-surface)}.scale-fretboard-stats{display:flex;flex-wrap:wrap;gap:.75rem}.scale-stat-icon{width:.9rem;height:.9rem;color:var(--primary-container)}.scale-insight-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.scale-insight-card{padding:1.25rem;border-radius:1.25rem}.horizontal-block{padding:1.4rem;border-radius:1.4rem;border:1px solid var(--glass-stroke);background:hsla(0,0%,100%,.03)}body[data-theme=light] .horizontal-block{background:hsla(0,0%,100%,.42)}.horizontal-block+.horizontal-block{margin-top:1rem}.horizontal-block-title{margin-bottom:1rem;font-family:var(--font-space-mono),monospace;font-size:.75rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--primary-container)}.tuner-workspace-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);align-items:start}.tuner-gauge-card{position:relative;overflow:hidden;padding:1.75rem;border-radius:1.8rem}.tuner-gauge-backdrop{position:absolute;inset:0;opacity:.15;background-image:radial-gradient(circle at 2px 2px,rgba(250,204,21,.7) 1px,transparent 0);background-size:34px 34px;pointer-events:none}.tuner-gauge-shell{position:relative;width:min(100%,32rem);aspect-ratio:1/1;margin:0 auto;display:flex;align-items:flex-end;justify-content:center;padding-bottom:4.25rem}.tuner-gauge-arc{position:absolute;inset:0;width:100%;height:auto;color:rgba(148,163,184,.34)}.tuner-gauge-track{filter:drop-shadow(0 0 10px rgba(250,204,21,.08))}.tuner-gauge-needle{position:absolute;bottom:4.15rem;left:50%;width:.35rem;height:12rem;border-radius:999px;transform-origin:bottom center;background:linear-gradient(180deg,rgba(250,204,21,.4),var(--primary-container));box-shadow:0 0 20px rgba(250,204,21,.28);transition:transform .15s cubic-bezier(.2,0,.4,1)}.tuner-gauge-needle.out-of-tune{background:linear-gradient(180deg,hsla(0,91%,71%,.4),#f87171);box-shadow:0 0 20px hsla(0,91%,71%,.24)}.tuner-gauge-needle.neutral{background:linear-gradient(180deg,rgba(148,163,184,.35),#94a3b8);box-shadow:none}.tuner-gauge-display{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:.7rem;text-align:center}.tuner-note{font-family:var(--font-bebas),sans-serif;font-size:clamp(4.5rem,12vw,7rem);line-height:.9;letter-spacing:.04em;color:var(--primary-container);text-shadow:0 0 24px rgba(250,204,21,.2)}.tuner-cents{font-size:.82rem;letter-spacing:.18em;color:var(--on-surface-variant)}.tuner-cents,.tuner-status-pill{font-family:var(--font-space-mono),monospace;text-transform:uppercase}.tuner-status-pill{display:inline-flex;align-items:center;gap:.5rem;min-height:2.25rem;padding:.55rem .85rem;border-radius:999px;border:1px solid rgba(148,163,184,.2);background:rgba(148,163,184,.08);font-size:.72rem;font-weight:700;letter-spacing:.16em;color:var(--on-surface)}.tuner-status-pill.in-tune{border-color:rgba(77,224,130,.24);background:rgba(77,224,130,.12);color:var(--secondary)}.tuner-status-pill.out-of-tune{border-color:hsla(0,91%,71%,.24);background:hsla(0,91%,71%,.12);color:#fca5a5}.tuner-status-icon{width:.9rem;height:.9rem}.tuner-scale-labels{display:flex;justify-content:space-between;max-width:32rem;margin:-2rem auto 0;padding:0 1rem;font-family:var(--font-space-mono),monospace;font-size:.66rem;letter-spacing:.14em;color:var(--on-surface-variant)}.tuner-meta-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:1rem;gap:1rem;margin-top:1.4rem}.tuner-meta-card{padding:.95rem 1rem;border-radius:1rem;border:1px solid rgba(250,204,21,.12);background:hsla(0,0%,100%,.04);text-align:center}.tuner-meta-label{display:block;margin-bottom:.35rem;font-family:var(--font-space-mono),monospace;font-size:.64rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--on-surface-variant)}.tuner-meta-value{font-family:var(--font-inter),sans-serif;font-size:1.15rem;color:var(--on-surface)}.tuner-side-panel{display:grid;grid-gap:1rem;gap:1rem}.chord-control-panel,.chord-detail-card,.chord-visual-panel,.tuner-config-card,.tuner-reference-card{padding:1.5rem;border-radius:1.5rem}.tuner-panel-heading{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:.85rem;font-family:var(--font-space-mono),monospace;font-size:.76rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--on-surface)}.tuner-panel-icon{width:1rem;height:1rem;color:var(--primary-container)}.tuner-action-button{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:.65rem}.tuner-reference-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:.75rem;gap:.75rem}.tuner-reference-pill{min-height:3rem;border-radius:.95rem;border:1px solid rgba(250,204,21,.12);background:hsla(0,0%,100%,.04);color:var(--on-surface-variant);font-family:var(--font-space-mono),monospace;font-size:.8rem;font-weight:700;transition:border-color .25s ease,color .25s ease,transform .25s ease}.tuner-reference-pill:hover{border-color:rgba(250,204,21,.24);color:var(--primary-container);transform:translateY(-2px)}.chord-workspace-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:start}.chord-control-panel{display:grid;grid-gap:1.35rem;gap:1.35rem}.chord-control-group{display:grid;grid-gap:.9rem;gap:.9rem}.chord-tone-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:.65rem;gap:.65rem}.chord-tone-button,.chord-type-button{border:1px solid rgba(250,204,21,.12);background:hsla(0,0%,100%,.04);color:var(--on-surface);transition:transform .25s ease,border-color .25s ease,background-color .25s ease,color .25s ease}.chord-tone-button{min-height:3rem;border-radius:.95rem;font-family:var(--font-space-mono),monospace;font-size:.85rem;font-weight:700}.chord-tone-button.is-active,.chord-type-button.is-active{border-color:rgba(250,204,21,.34);background:rgba(250,204,21,.14);color:var(--primary-container);box-shadow:0 0 18px rgba(250,204,21,.12)}.chord-tone-button:hover,.chord-type-button:hover{transform:translateY(-2px);border-color:rgba(250,204,21,.24)}.chord-type-list{display:grid;grid-gap:.7rem;gap:.7rem}.chord-type-button{min-height:3.4rem;padding:.9rem 1rem;border-radius:1rem;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-raleway),sans-serif;font-size:.95rem;font-weight:600}.chord-type-suffix{color:var(--on-surface-variant);font-family:var(--font-space-mono),monospace}.chord-extension-toggle{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid hsla(0,0%,100%,.08)}.chord-toggle-switch{position:relative;width:3.6rem;height:2rem;display:inline-flex;align-items:center}.chord-toggle-switch input{position:absolute;inset:0;opacity:0;cursor:pointer}.chord-toggle-slider{position:relative;width:100%;height:100%;border-radius:999px;background:rgba(148,163,184,.22);transition:background-color .25s ease}.chord-toggle-slider:after{content:"";position:absolute;top:.2rem;left:.22rem;width:1.55rem;height:1.55rem;border-radius:999px;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.2);transition:transform .25s ease}.chord-toggle-switch input:checked+.chord-toggle-slider{background:rgba(250,204,21,.42)}.chord-toggle-switch input:checked+.chord-toggle-slider:after{transform:translateX(1.55rem);background:var(--primary-container)}.chord-visual-panel{display:flex;flex-direction:column;justify-content:center;min-height:100%;overflow:hidden;position:relative}.chord-visual-panel:before{content:"";position:absolute;inset:50% 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(250,204,21,.18),transparent)}.chord-visual-notes{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem}.chord-note-orb{display:flex;flex-direction:column;align-items:center;gap:.65rem}.chord-note-role{font-family:var(--font-space-mono),monospace;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-surface-variant)}.chord-note-circle{width:clamp(4.8rem,9vw,6.8rem);height:clamp(4.8rem,9vw,6.8rem);display:flex;align-items:center;justify-content:center;border-radius:999px;border:2px solid rgba(250,204,21,.16);background:hsla(0,0%,100%,.04);transition:transform .25s ease,border-color .25s ease}.chord-note-orb.is-root .chord-note-circle{background:var(--primary-container);color:#231b00;border-color:rgba(250,204,21,.38);box-shadow:0 0 22px rgba(250,204,21,.18)}.chord-note-circle:hover{transform:scale(1.06)}.chord-note-letter{font-family:var(--font-bebas),sans-serif;font-size:clamp(2rem,5vw,3rem);letter-spacing:.05em;color:inherit}.chord-note-degree{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;min-height:2rem;padding:0 .65rem;border-radius:999px;background:hsla(0,0%,100%,.05);font-family:var(--font-space-mono),monospace;font-size:.75rem;color:var(--on-surface-variant)}.chord-visual-summary{position:relative;z-index:1;margin-top:2rem;text-align:center}.chord-visual-title{margin:0;font-family:var(--font-bebas),sans-serif;font-size:clamp(2rem,5vw,3rem);letter-spacing:.05em;color:var(--on-surface)}.chord-visual-subtitle{margin:.6rem 0 0;font-family:var(--font-raleway),sans-serif;color:var(--on-surface-variant)}.chord-details-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.chord-detail-card{min-height:100%}.chord-detail-list{display:grid;grid-gap:.8rem;gap:.8rem}.chord-detail-copy{display:flex;flex-direction:column;gap:1rem}.chord-explanation,.chord-notes{margin:0}@media (max-width:768px){.about-meta-grid,.about-story-grid,.about-values-grid,.chord-details-grid,.chord-workspace-grid,.home-hero-metrics,.home-tools-grid,.home-workflow-grid,.scale-controls-grid,.scale-insight-grid,.tuner-workspace-grid{grid-template-columns:1fr}.about-contact-card,.about-hero-panel,.about-meta-card,.about-story-card,.about-value-card,.chord-control-panel,.chord-detail-card,.chord-visual-panel,.home-hero-panel,.scale-control-card,.scale-fretboard-shell,.scale-insight-card,.tuner-config-card,.tuner-gauge-card,.tuner-reference-card{padding:1.5rem;border-radius:1.5rem}.about-hero-text,.about-meta-text,.about-story-copy p,.about-value-text,.home-card-text,.home-hero-text,.home-section-text{font-size:.98rem}.chord-extension-toggle,.scale-fretboard-header{flex-direction:column;align-items:flex-start}.tuner-gauge-shell{padding-bottom:3.25rem}.tuner-gauge-needle{height:9rem;bottom:3.15rem}.chord-tone-grid,.tuner-reference-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:480px){.about-story-kicker,.home-card-kicker,.section-kicker{font-size:.64rem;letter-spacing:.2em}.about-contact-actions,.home-hero-actions{grid-template-columns:1fr}.about-contact-button,.home-cta{width:100%}.home-metric-card{align-items:flex-start}.chord-visual-notes,.scale-fretboard-stats,.scale-legend-strip{gap:.65rem}.chord-tone-grid,.tuner-meta-row,.tuner-reference-grid{grid-template-columns:1fr 1fr}.chord-type-button{min-height:3.15rem}}@media (orientation:landscape) and (max-height:520px){.titulo-container{margin:.6rem auto .25rem;padding:.25rem 0 0}.titulo-wrapper{padding:1rem 1.4rem;gap:.7rem}.titulo-icons{gap:.7rem}.icon-center,.icon-left,.icon-right{width:1.5rem;height:1.5rem}.titulo-subtitle{font-size:.7rem}}@media (max-width:380px){.chord-tone-grid,.tuner-reference-grid{grid-template-columns:1fr}}.scale-options{margin:1rem 0}.checkbox-label{display:flex;align-items:center;gap:.5rem;color:inherit;cursor:pointer}.checkbox-label input[type=checkbox]{width:1rem;height:1rem;cursor:pointer}.about-content{text-align:center}.about-content h1{font-size:2.5rem;font-weight:700;margin-bottom:2rem;color:#6366f1}.about-content h2{font-size:1.5rem;font-weight:600;margin:1.5rem 0 1rem;color:#818cf8}.about-content p{font-size:1.1rem;line-height:1.6;margin-bottom:1.5rem}.about-content ul{list-style:none;padding:0;margin:1rem 0}.about-content li{font-size:1.1rem;margin:.5rem 0;padding:.5rem;border-radius:8px;transition:background .3s ease}.about-content li,body[data-theme=light] .about-content li{background-color:rgba(99,102,241,.1)}.about-content li:hover,body[data-theme=dark] .about-content li{background-color:rgba(99,102,241,.2)}.scale-info-container{display:flex;flex-direction:column;gap:1.5rem;margin:1.5rem 0;padding:1.5rem;background-color:rgba(0,0,0,.05);border-radius:.5rem}body[data-theme=dark] .scale-info-container{background-color:hsla(0,0%,100%,.05)}.scale-formula{text-align:center}.scale-formula h3{font-size:1.1rem;font-weight:600;color:#6366f1;margin-bottom:.5rem}.formula-display{padding:.75rem;background-color:rgba(99,102,241,.1);border-radius:.375rem;display:inline-block}.formula-text{font-family:monospace;font-size:1.2rem;font-weight:600;color:#6366f1}.scale-details-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:2rem;gap:2rem;margin:1rem 0;padding:1rem;background-color:rgba(0,0,0,.05);border-radius:.5rem}body[data-theme=dark] .scale-details-grid{background-color:hsla(0,0%,100%,.05)}.scale-chords-column,.scale-intervals-column,.scale-notes-column{display:flex;flex-direction:column;gap:.5rem;padding:1rem;background-color:rgba(0,0,0,.05);border-radius:.5rem}body[data-theme=dark] .scale-chords-column,body[data-theme=dark] .scale-intervals-column,body[data-theme=dark] .scale-notes-column{background-color:hsla(0,0%,100%,.05)}.scale-chords-column h3,.scale-intervals-column h3,.scale-notes-column h3{font-size:1.1rem;font-weight:600;color:#6366f1;margin-bottom:.5rem;text-align:center;padding-bottom:.5rem;border-bottom:2px solid rgba(99,102,241,.2)}.chords-list,.intervals-list,.notes-list{display:flex;flex-direction:column;gap:.5rem}.chord-item,.interval-item,.note-item{display:flex;align-items:center;gap:1rem;padding:.5rem;background-color:rgba(0,0,0,.05);border-radius:.375rem;transition:all .2s ease}.chord-item:hover,.interval-item:hover,.note-item:hover{transform:translateX(5px);background-color:rgba(99,102,241,.1)}body[data-theme=dark] .chord-item,body[data-theme=dark] .interval-item,body[data-theme=dark] .note-item{background-color:hsla(0,0%,100%,.05)}body[data-theme=dark] .chord-item:hover,body[data-theme=dark] .interval-item:hover,body[data-theme=dark] .note-item:hover{background-color:rgba(99,102,241,.2)}.chord-degree,.interval-degree,.note-degree{font-weight:600;color:#6366f1;min-width:2rem;text-align:center}.chord-name,.interval-name,.note-name{flex:1 1}.chord-type{padding:.25rem .5rem;border-radius:.25rem;font-size:.875rem;font-weight:500;white-space:nowrap}.chord-type.mayor{background-color:rgba(34,197,94,.2);color:#22c55e}.chord-type.menor{background-color:rgba(239,68,68,.2);color:#ef4444}.chord-type.disminuido{background-color:rgba(168,85,247,.2);color:#a855f7}.chord-type.aumentado{background-color:rgba(234,179,8,.2);color:#eab308}.chord-type.justo{background-color:rgba(99,102,241,.2);color:#6366f1}.scale-type{text-align:center;margin-top:1rem}.scale-type h3{font-size:1.1rem;font-weight:600;color:#6366f1;margin-bottom:.5rem}.type-badge{display:inline-block;padding:.5rem 1rem;border-radius:.375rem;font-weight:600;text-transform:capitalize}.type-badge.mayor{background-color:rgba(34,197,94,.2);color:#22c55e}.type-badge.menor{background-color:rgba(239,68,68,.2);color:#ef4444}.type-badge.disminuido{background-color:rgba(168,85,247,.2);color:#a855f7}.type-badge.aumentado{background-color:rgba(234,179,8,.2);color:#eab308}.display-mode-select{width:100%;padding:.5rem;border-radius:.375rem;border:1px solid #4b5563;background-color:transparent;color:inherit;transition:all .3s ease}body[data-theme=light] .display-mode-select{background-color:#fff;border-color:#d1d5db}body[data-theme=dark] .display-mode-select{background-color:#1f2937;border-color:#4b5563}.scale-horizontal-table{display:flex;flex-direction:column;gap:1.2rem;margin:1.5rem 0;padding:1.5rem 1rem;background-color:rgba(0,0,0,.05);border-radius:.5rem}body[data-theme=dark] .scale-horizontal-table{background-color:hsla(0,0%,100%,.05)}.horizontal-row{display:flex;align-items:center;gap:1rem;margin-bottom:.5rem;flex-wrap:wrap}.horizontal-title{min-width:160px;font-size:1.1rem;font-weight:700;color:#6366f1;text-align:left;margin-right:1.5rem;letter-spacing:1px}.horizontal-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.375rem;background-color:rgba(0,0,0,.05);font-size:1rem;font-weight:500;transition:background .2s}body[data-theme=dark] .horizontal-item{background-color:hsla(0,0%,100%,.05)}.horizontal-item .chord-degree,.horizontal-item .interval-degree,.horizontal-item .note-degree{color:#6366f1;font-weight:600;margin-right:.25rem}.horizontal-item .chord-type{margin-left:.5rem}@media (max-width:700px){.scale-horizontal-table{padding:1rem .2rem}.horizontal-title{min-width:90px;font-size:1rem;margin-right:.5rem}.horizontal-item{font-size:.95rem;padding:.4rem .5rem}}.scale-selected-info{display:flex;gap:2rem;justify-content:center;align-items:center;margin:1rem 0 1.5rem;font-size:1.1rem;font-weight:500;color:#6366f1}.selected-scale-type strong,.selected-tone strong{color:#ef4444;font-weight:700;margin-left:.3rem}@media (max-width:700px){.scale-selected-info{flex-direction:column;gap:.5rem;font-size:1rem}}.scale-formula-row{gap:2.5rem;margin-bottom:1rem}.scale-formula-row,.scale-type-inline{display:flex;align-items:center;justify-content:center}.scale-type-inline{flex-direction:column}@media (max-width:700px){.scale-formula-row{flex-direction:column;gap:.5rem}}.scale-info-row{display:flex;justify-content:center;align-items:flex-start;gap:2.5rem;margin-bottom:2rem;margin-top:2.5rem;flex-wrap:wrap}.scale-info-block{display:flex;flex-direction:column;align-items:center;min-width:170px;gap:.5rem}.scale-info-title{color:#6366f1;font-size:1.2rem;font-weight:700;margin-bottom:.3rem;text-align:center;letter-spacing:1px;min-height:1.7em;display:flex;align-items:flex-end;justify-content:center}.selected-tone-block{font-size:1.3rem}.selected-scale-type-block,.selected-tone-block{background:#23233a;color:#ef4444;font-weight:700;padding:.4rem 1.2rem;border-radius:.4rem;margin-top:.2rem}.selected-scale-type-block{font-size:1.1rem}@media (max-width:900px){.scale-info-row{flex-direction:column;gap:1.2rem;align-items:center}.scale-info-block{min-width:0;width:100%}}.chord-info-row{display:flex;justify-content:center;align-items:flex-start;gap:2.5rem;margin-bottom:2rem;margin-top:2.5rem;flex-wrap:wrap}.chord-info-block{display:flex;flex-direction:column;align-items:center;min-width:170px;gap:.5rem}@media (max-width:900px){.chord-info-row{flex-direction:column;gap:1.2rem;align-items:center}.chord-info-block{min-width:0;width:100%}}@media (max-width:768px){.navbar{padding:12px 16px}.nav-left{margin-left:0;gap:10px}.nav-btn{padding:8px 12px;font-size:16px}.nav-btn span{display:none}.nav-icon{width:24px;height:24px}.nav-right{margin-right:0;gap:.5rem}.theme-toggle{padding:8px;font-size:14px;min-width:40px;justify-content:center}.theme-toggle span{display:none}.theme-toggle .nav-icon{width:20px;height:20px;margin:0}.titulo{font-size:2rem;padding:.8rem 1.5rem;gap:.8rem}.guitar-icon{width:2rem;height:2rem}.fretboard-container{overflow-x:auto;padding:.5rem;-webkit-overflow-scrolling:touch}.fretboard{min-width:700px;padding:1.5rem;border-radius:12px}.fret{height:3rem;padding:.2rem}.note-marker{width:2rem;height:2rem;font-size:.7rem}.fret-numbers{font-size:.75rem}.fret-number:nth-child(12):after,.fret-number:nth-child(15):after,.fret-number:nth-child(17):after,.fret-number:nth-child(19):after,.fret-number:nth-child(21):after,.fret-number:nth-child(24):after,.fret-number:nth-child(3):after,.fret-number:nth-child(5):after,.fret-number:nth-child(7):after,.fret-number:nth-child(9):after{bottom:-1.25rem;width:10px;height:10px}.fret-number:nth-child(12):after{width:14px;height:14px}}@media (max-width:480px){.navbar{padding:8px 12px}.nav-btn{padding:6px 10px}.nav-icon{width:20px;height:20px}.titulo{font-size:1.5rem;padding:.6rem 1.2rem;gap:.6rem}.guitar-icon{width:1.5rem;height:1.5rem}.fretboard-container{overflow-x:auto;padding:.3rem;-webkit-overflow-scrolling:touch}.fretboard{min-width:600px;padding:1rem;border-radius:8px}.fret{height:2.5rem;padding:.15rem}.note-marker{width:1.5rem;height:1.5rem;font-size:.65rem}.fret-numbers{font-size:.7rem}.fret-number:nth-child(12):after,.fret-number:nth-child(15):after,.fret-number:nth-child(17):after,.fret-number:nth-child(19):after,.fret-number:nth-child(21):after,.fret-number:nth-child(24):after,.fret-number:nth-child(3):after,.fret-number:nth-child(5):after,.fret-number:nth-child(7):after,.fret-number:nth-child(9):after{bottom:-1rem;width:8px;height:8px}.fret-number:nth-child(12):after{width:12px;height:12px}}.circle-container{position:relative;width:600px;height:600px;margin:2rem auto;display:flex;justify-content:center;align-items:center}@media (max-width:768px){.circle-container{width:400px;height:400px;transform:scale(.8)}}@media (max-width:480px){.circle-container{width:320px;height:320px;transform:scale(.6)}}.circle-outer{width:500px;height:500px}.circle-inner,.circle-outer{position:absolute;border-radius:50%;border:2px solid #6366f1;pointer-events:none}.circle-inner{width:250px;height:250px}.note-button{position:absolute;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;background-color:rgba(99,102,241,.2);color:inherit;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;border:2px solid #6366f1;font-size:1.2rem;font-weight:700;z-index:10}.note-button:hover{transform:translate(-50%,-50%) scale(1.1)}.note-button.selected{background-color:#ff3e3e;color:#fff}.note-name{font-size:1.2rem;font-weight:700}.note-relative{font-size:.8rem;opacity:.8}.note-info{margin-top:2rem;padding:1.5rem;background-color:rgba(99,102,241,.1);border-radius:12px;text-align:center}.note-info h3{font-size:1.5rem;margin-bottom:1rem;color:#6366f1}.note-info-content{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap}.note-info-block{min-width:120px}.note-info-block h4{color:#6366f1;margin-bottom:.5rem}.circle-segment{position:absolute;width:125px;height:125px;transform-origin:0 0;border-radius:0 125px 0 0}.note-C{background-color:#f55}.note-G{background-color:coral}.note-D{background-color:orange}.note-A{background-color:gold}.note-E{background-color:#ff0}.note-B{background-color:#9acd32}.note-Fs{background-color:#32cd32}.note-Cs{background-color:#20b2aa}.note-Gs{background-color:#1e90ff}.note-Ds{background-color:#9370db}.note-As{background-color:orchid}.note-F{background-color:#ff69b4}.circle-text-overlay{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none}.circle-explanation{margin:2rem 0;padding:1.5rem;background-color:rgba(99,102,241,.1);border-radius:12px}.circle-explanation h3{font-size:1.2rem;margin-bottom:1rem;color:#6366f1;text-align:center}.circle-explanation p{margin-bottom:1rem;line-height:1.6}.circle-explanation ul{list-style:disc;margin-left:1.5rem;margin-bottom:1rem}.circle-explanation li{margin-bottom:.5rem}body[data-theme=light] .circle-of-fifths-container{background-color:hsla(0,0%,100%,.9);color:#111}body[data-theme=dark] .circle-of-fifths-container{background-color:rgba(31,41,55,.9);color:#d1d5db}.circle-of-fifths-responsive{width:100%;max-width:600px;margin:0 auto;display:flex;justify-content:center;align-items:center;aspect-ratio:1/1;background:#23233a;border-radius:50%;box-shadow:0 2px 16px 0 rgba(0,0,0,.1)}.circle-svg{width:100%;height:auto;display:block}.circle-label-major-svg{font-size:2rem;font-weight:900;fill:#111827;stroke:#fff;stroke-width:.7;filter:drop-shadow(0 1px 2px #fff8)}.circle-label-major-svg,.circle-label-minor-svg{paint-order:stroke fill;transition:all .3s ease;transform-origin:center}.circle-label-minor-svg{font-size:1.5rem;font-weight:800;fill:#374151;opacity:.98;stroke:#fff;stroke-width:.5}.circle-label-enharmonic{fill:#b3ff00;opacity:.7}.circle-label-enharmonic,.circle-label-enharmonic-minor{font-size:1rem;transition:all .3s ease;transform-origin:center}.circle-label-enharmonic-minor{fill:red;opacity:.6}.selected-note{fill:#fc9700!important;filter:drop-shadow(0 0 12px rgba(99,102,241,.8));transform:scale(1.05);opacity:1!important}.note-svg-note-C{fill:#03ff0b}.note-svg-note-G{fill:#b2dfdb}.note-svg-note-D{fill:#ffe082}.note-svg-note-A{fill:#ffccbc}.note-svg-note-E{fill:#b3e5fc}.note-svg-note-B{fill:#d1c4e9}.note-svg-note-Fs{fill:#f8bbd0}.note-svg-note-Cs{fill:#c8e6c9}.note-svg-note-Gs{fill:#fff9c4}.note-svg-note-Ds{fill:#ffe0b2}.note-svg-note-As{fill:#b2ebf2}.note-svg-note-F{fill:#dcedc8}@media (max-width:600px){.circle-of-fifths-responsive{max-width:98vw;min-width:0;padding:0}.circle-svg{width:98vw;height:auto}.circle-label-major-svg{font-size:1rem}.circle-label-minor-svg{font-size:.8rem}}.note-info-title{color:#6366f1;font-weight:700;font-size:1.5rem;text-align:center;margin-bottom:16px}.note-info-main-label{color:#6366f1;font-weight:800;font-size:2rem;text-align:center;margin-bottom:8px;letter-spacing:1px}.notation-toggle-checkbox{font-weight:500;color:inherit;font-size:1rem;display:flex;align-items:center;gap:8px}.notation-toggle-checkbox input[type=checkbox]{accent-color:#6366f1;width:18px;height:18px}svg .circle-armature-group{z-index:10;filter:drop-shadow(0 0 2px #23233a) drop-shadow(0 0 2px #23233a)}.circle-sheet-container{width:100%;max-width:850px;margin:2rem auto;padding:2rem;background-color:rgba(31,41,55,.9);border-radius:12px;box-shadow:0 0 20px rgba(0,0,0,.1)}body[data-theme=light] .circle-sheet-container{background-color:hsla(0,0%,100%,.9);color:#111}body[data-theme=light] .altered-notes,body[data-theme=light] .flats,body[data-theme=light] .major-key,body[data-theme=light] .minor-key,body[data-theme=light] .sharps{color:#333}.sheet-grid{width:100%;border-collapse:collapse;margin-top:1rem}.sheet-header{padding:1rem;background-color:rgba(178,223,219,.2);border-radius:8px;font-weight:700;margin-bottom:.5rem}.sheet-header,.sheet-row{display:grid;grid-template-columns:1fr 1fr .8fr .8fr 2fr;grid-gap:1rem;gap:1rem}.sheet-row{padding:.8rem 1rem;border-bottom:1px solid rgba(178,223,219,.2);transition:background-color .2s ease}.sheet-row:hover{background-color:rgba(178,223,219,.1)}.major-key{font-weight:600;color:#b2dfdb}.minor-key{color:#d1d5db}.flats,.sharps{text-align:center;font-weight:500}.altered-notes{font-size:.9rem;color:#9ca3af}.circle-page-container{max-width:1200px;margin:0 auto;align-items:center;box-sizing:border-box}.notation-toggle{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.5rem;background-color:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border-color);cursor:pointer;transition:all .2s ease;margin-right:1rem}.notation-toggle:hover{background-color:var(--background-hover)}.notation-toggle .nav-icon{width:1.25rem;height:1.25rem}.selected-sector{transition:all .3s ease;filter:drop-shadow(0 0 8px rgba(99,102,241,.3))}.fretboard-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;background:linear-gradient(135deg,#7b4c2f,#a76a3d);border-radius:16px;padding:2rem;box-shadow:0 15px 40px rgba(0,0,0,.4),inset 0 2px 0 hsla(0,0%,100%,.1);border:3px solid rgba(139,69,19,.3)}.fretboard-loading p{color:#fef3c7;font-size:1.1rem;font-weight:600;margin-top:1rem;text-align:center;font-family:var(--font-raleway),sans-serif;animation:fadeInUp .5s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.spinner{width:50px;height:50px;border:4px solid hsla(48,96%,89%,.3);border-top-color:#f59e0b;border-radius:50%;animation:spin 1s linear infinite,pulse 2s ease-in-out infinite;box-shadow:0 0 20px rgba(245,158,11,.3)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes pulse{0%,to{box-shadow:0 0 20px rgba(245,158,11,.3);transform:scale(1)}50%{box-shadow:0 0 30px rgba(245,158,11,.6);transform:scale(1.05)}}.fretboard{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.circle-page-container{display:flex;flex-direction:column;gap:1.5rem;width:100%}.circle-sheet-workspace,.circle-workspace{display:flex;flex-direction:column;gap:1.4rem}.circle-sheet-header,.circle-workspace-header{display:grid;grid-gap:.85rem;gap:.85rem}.circle-sheet-title,.circle-workspace-title{margin:0}.circle-sheet-text,.circle-workspace-text{margin:0;max-width:68ch;font-family:var(--font-raleway),sans-serif;font-size:1rem;line-height:1.75;color:var(--on-surface-variant)}.circle-workspace-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-gap:1.2rem;gap:1.2rem;align-items:start}.chord-fretboard-shell,.circle-info-card,.circle-sheet-workspace .sheet-grid,.circle-visual-card{border:1px solid var(--glass-stroke);background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.18),inset 0 1px 0 hsla(0,0%,100%,.05)}body[data-theme=light] .chord-fretboard-shell,body[data-theme=light] .circle-info-card,body[data-theme=light] .circle-sheet-workspace .sheet-grid,body[data-theme=light] .circle-visual-card{background:rgba(255,250,242,.76)}.circle-visual-card{position:relative;overflow:hidden;padding:1.5rem;border-radius:1.8rem}.circle-visual-backdrop{position:absolute;inset:0;opacity:.16;background-image:radial-gradient(circle at 1px 1px,rgba(250,204,21,.55) 1px,transparent 0),radial-gradient(circle at 70% 20%,rgba(77,224,130,.18),transparent 26%);background-size:32px 32px,auto;pointer-events:none}.circle-visual-head{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.circle-panel-kicker{display:inline-block;font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--on-surface-variant)}.circle-legend-row{display:flex;flex-wrap:wrap;gap:.7rem}.circle-legend-pill{display:inline-flex;align-items:center;gap:.55rem;min-height:2.25rem;padding:.5rem .85rem;border-radius:999px;border:1px solid hsla(0,0%,100%,.08);background:hsla(0,0%,100%,.04);font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-surface)}.circle-legend-pill.sharps{border-color:rgba(250,204,21,.24)}.circle-legend-pill.flats{border-color:rgba(77,224,130,.22)}.circle-legend-dot{width:.75rem;height:.75rem;border-radius:999px;background:var(--surface-variant)}.circle-legend-pill.sharps .circle-legend-dot{background:var(--primary-container)}.circle-legend-pill.flats .circle-legend-dot{background:var(--secondary)}.circle-workspace .circle-of-fifths-responsive.circle-workspace-responsive{position:relative;z-index:1;max-width:100%;padding:1rem;border-radius:1.6rem;background:radial-gradient(circle at center,hsla(0,0%,100%,.06) 0,rgba(8,10,18,.18) 60%,transparent 100%),linear-gradient(180deg,hsla(0,0%,100%,.04),hsla(0,0%,100%,.01));box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.05)}.circle-svg{overflow:visible}.circle-ring-sector{cursor:pointer;stroke:hsla(0,0%,100%,.08);stroke-width:4;transition:fill .25s ease,stroke .25s ease,opacity .25s ease,transform .25s ease}.circle-ring-sector.is-sharp-sector{fill:rgba(250,204,21,.16)}.circle-ring-sector.is-flat-sector{fill:rgba(77,224,130,.15)}.circle-ring-sector.is-neutral-sector{fill:rgba(148,163,184,.12)}.circle-ring-sector:hover{opacity:.95;stroke:rgba(250,204,21,.32)}.circle-ring-sector.is-selected{fill:rgba(250,204,21,.3);stroke:rgba(255,236,185,.62);filter:drop-shadow(0 0 16px rgba(250,204,21,.22))}.circle-divider-line{stroke:hsla(0,0%,100%,.08);stroke-width:3}.circle-frame-core,.circle-frame-inner,.circle-frame-outer{fill:none}.circle-frame-outer{stroke:hsla(0,0%,100%,.16);stroke-width:8}.circle-frame-inner{stroke:hsla(0,0%,100%,.12);stroke-width:6}.circle-frame-core{stroke:rgba(250,204,21,.32);stroke-width:4}.circle-label-group{cursor:pointer}.circle-workspace .circle-label-major-svg{font-size:1.85rem;font-weight:900;fill:var(--primary);stroke:rgba(15,17,26,.75);stroke-width:.9;filter:drop-shadow(0 4px 10px rgba(15,17,26,.35))}.circle-workspace .circle-label-minor-svg{font-size:1.34rem;font-weight:800;fill:var(--on-surface);opacity:.96;stroke:rgba(15,17,26,.55);stroke-width:.6}.circle-workspace .circle-label-enharmonic,.circle-workspace .circle-label-enharmonic-minor{font-size:.92rem;font-weight:700;fill:var(--on-surface-variant);opacity:.76}.circle-workspace .selected-note{fill:#fff4cf!important;filter:drop-shadow(0 0 14px rgba(250,204,21,.42));transform:scale(1.06);opacity:1!important}.circle-info-column{display:grid;grid-gap:1rem;gap:1rem}.circle-info-card{padding:1.4rem;border-radius:1.5rem}.circle-info-card.accent-primary{border-left:4px solid var(--primary-container)}.circle-info-card.accent-secondary{border-left:4px solid var(--secondary)}.circle-info-card.accent-primary-soft{border-left:4px solid var(--primary)}.circle-info-card-head{display:inline-flex;align-items:center;gap:.7rem;margin-bottom:.9rem}.circle-info-card-head h3{margin:0;font-family:var(--font-inter),sans-serif;font-size:1.05rem;color:var(--on-surface)}.circle-info-card p{margin:0;font-family:var(--font-raleway),sans-serif;line-height:1.7;color:var(--on-surface-variant)}.circle-info-icon,.circle-tip-icon{width:1rem;height:1rem;color:var(--primary-container)}.circle-tip-box{display:inline-flex;align-items:flex-start;gap:.65rem;margin-top:1rem;padding:.9rem 1rem;border-radius:1rem;border:1px solid rgba(77,224,130,.18);background:rgba(77,224,130,.08);color:var(--on-surface)}.circle-selection-summary{display:grid;grid-gap:1rem;gap:1rem}.circle-selection-title{font-family:var(--font-bebas),sans-serif;font-size:clamp(2rem,5vw,2.8rem);line-height:.95;letter-spacing:.04em;color:var(--on-surface)}.circle-selection-alt{font-family:var(--font-space-mono),monospace;font-size:.9rem;letter-spacing:.08em;color:var(--on-surface-variant)}.circle-selection-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:.85rem;gap:.85rem}.circle-selection-stat{display:grid;grid-gap:.35rem;gap:.35rem;padding:1rem;border-radius:1rem;border:1px solid hsla(0,0%,100%,.08);background:hsla(0,0%,100%,.04)}.circle-selection-stat strong{font-family:var(--font-bebas),sans-serif;font-size:2rem;line-height:.9;color:var(--primary-container)}.circle-selection-stat small{font-family:var(--font-raleway),sans-serif;line-height:1.5;color:var(--on-surface-variant)}.circle-selection-label{font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--on-surface-variant)}.circle-sheet-workspace .sheet-grid{display:grid;grid-gap:.7rem;gap:.7rem;padding:1rem;border-radius:1.5rem}.circle-sheet-workspace .sheet-header,.circle-sheet-workspace .sheet-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) .75fr .75fr minmax(0,1.7fr);grid-gap:.9rem;gap:.9rem}.circle-sheet-workspace .sheet-header{padding:.95rem 1rem;border-radius:1rem;background:rgba(250,204,21,.12);font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-surface)}.circle-sheet-workspace .sheet-row{align-items:center;padding:.95rem 1rem;border-radius:1rem;border:1px solid hsla(0,0%,100%,.06);background:hsla(0,0%,100%,.03);transition:transform .2s ease,border-color .2s ease,background-color .2s ease}.circle-sheet-workspace .sheet-row:hover{transform:translateY(-2px);border-color:rgba(250,204,21,.18);background:rgba(250,204,21,.08)}.circle-sheet-workspace .altered-notes,.circle-sheet-workspace .flats,.circle-sheet-workspace .major-key,.circle-sheet-workspace .minor-key,.circle-sheet-workspace .sharps{color:var(--on-surface)}.circle-sheet-workspace .major-key{font-weight:700;color:var(--primary)}.circle-sheet-workspace .minor-key{color:var(--on-surface-variant)}.circle-sheet-workspace .flats,.circle-sheet-workspace .sharps{text-align:center;font-family:var(--font-space-mono),monospace}.circle-sheet-workspace .altered-notes{line-height:1.6;color:var(--on-surface-variant)}.chord-fretboard-shell{display:grid;grid-gap:1.15rem;gap:1.15rem;padding:1.5rem;border-radius:1.6rem}.chord-fretboard-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem}.chord-fretboard-title{margin:.35rem 0 0;font-family:var(--font-bebas),sans-serif;font-size:clamp(1.8rem,4vw,2.5rem);letter-spacing:.04em;color:var(--on-surface)}.chord-fretboard-stats{display:flex;flex-wrap:wrap;gap:.7rem}.chord-fretboard-stats .scale-stat-chip{gap:.4rem}.chord-fretboard-stats .scale-stat-chip strong{color:var(--primary-container)}.chord-fretboard-scroll{overflow-x:auto;padding-bottom:.3rem}.chord-fretboard-grid{min-width:48rem;display:grid;grid-template-columns:3.5rem repeat(13,minmax(3rem,1fr));grid-gap:0;gap:0;border-radius:1.3rem;overflow:hidden;border:1px solid hsla(0,0%,100%,.08);background:linear-gradient(180deg,hsla(0,0%,100%,.04),hsla(0,0%,100%,.02)),linear-gradient(135deg,#7b4c2f,#a76a3d)}.chord-fret-number,.chord-fretboard-corner,.chord-string-label{display:flex;align-items:center;justify-content:center;min-height:3rem;font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fef3c7;background:rgba(24,16,10,.24);border-right:1px solid hsla(0,0%,100%,.08);border-bottom:1px solid hsla(0,0%,100%,.08)}.chord-fretboard-corner,.chord-string-label{background:rgba(24,16,10,.38)}.chord-fret-cell{position:relative;min-height:3.4rem;display:flex;align-items:center;justify-content:center;border-right:1px solid hsla(0,0%,100%,.12);border-bottom:1px solid hsla(0,0%,100%,.08);background:hsla(38,87%,88%,.08)}.chord-fret-cell.is-nut{background:rgba(255,244,211,.16);box-shadow:inset 3px 0 0 rgba(255,248,235,.42)}.chord-fret-cell.has-dot:after{content:"";position:absolute;width:.72rem;height:.72rem;border-radius:999px;background:rgba(255,248,235,.28);box-shadow:0 1px 4px rgba(0,0,0,.18)}.chord-fret-marker{position:relative;z-index:1;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:2px solid hsla(48,96%,89%,.72);background:radial-gradient(circle at 30% 30%,#fbbf24,#f59e0b);color:#231b00;font-family:var(--font-space-mono),monospace;font-size:.72rem;font-weight:700;box-shadow:0 10px 18px rgba(0,0,0,.22),inset 0 1px 0 hsla(0,0%,100%,.35)}.chord-fret-marker.is-tonic{background:radial-gradient(circle at 30% 30%,#ffe8ad,#facc15);box-shadow:0 0 0 2px rgba(250,204,21,.2),0 12px 22px rgba(0,0,0,.24)}.chord-fretboard-caption{margin:0;font-family:var(--font-raleway),sans-serif;line-height:1.7;color:var(--on-surface-variant)}@media (max-width:900px){.circle-selection-stats,.circle-workspace-grid{grid-template-columns:1fr}.circle-sheet-workspace .sheet-header,.circle-sheet-workspace .sheet-row{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:768px){.chord-fretboard-shell,.circle-info-card,.circle-sheet-workspace .sheet-grid,.circle-visual-card{padding:1.25rem;border-radius:1.4rem}.chord-fretboard-header,.circle-visual-head{flex-direction:column;align-items:flex-start}.circle-workspace .circle-of-fifths-responsive.circle-workspace-responsive{padding:.6rem;border-radius:1.2rem}.circle-workspace .circle-label-major-svg{font-size:1.35rem}.circle-workspace .circle-label-minor-svg{font-size:1rem}.circle-workspace .circle-label-enharmonic,.circle-workspace .circle-label-enharmonic-minor{font-size:.72rem}.circle-sheet-workspace .sheet-header,.circle-sheet-workspace .sheet-row{grid-template-columns:1fr}.circle-sheet-workspace .sheet-header{gap:.35rem}.circle-sheet-workspace .sheet-row{gap:.45rem}.chord-fretboard-grid{min-width:40rem;grid-template-columns:3rem repeat(13,minmax(2.7rem,1fr))}}@media (max-width:480px){.chord-fretboard-stats,.circle-legend-row{width:100%}.chord-fretboard-stats .scale-stat-chip,.circle-legend-pill{width:100%;justify-content:center}.circle-selection-title{font-size:1.9rem}.chord-fretboard-grid{min-width:34rem;grid-template-columns:2.6rem repeat(13,minmax(2.45rem,1fr))}.chord-fret-number,.chord-fretboard-corner,.chord-string-label{min-height:2.6rem;font-size:.64rem}.chord-fret-cell{min-height:3rem}.chord-fret-marker{width:1.7rem;height:1.7rem;font-size:.66rem}}.fretboard-container{width:100%;overflow-x:auto;overflow-y:hidden;padding:.35rem .15rem .65rem;scrollbar-gutter:stable both-edges;-webkit-overflow-scrolling:touch}.fretboard{width:100%;min-width:0;padding:clamp(.95rem,2vw,1.6rem);border-radius:1.35rem}.fret-numbers,.string-row{min-width:100%}.string-row{margin-bottom:.25rem}.string-row:after{bottom:.1rem}.fret{min-width:0;height:clamp(2.3rem,5vw,3rem);padding:.15rem}.note-marker{width:clamp(1.35rem,2.6vw,1.8rem);height:clamp(1.35rem,2.6vw,1.8rem);font-size:clamp(.56rem,1.4vw,.65rem)}.scale-fretboard-stats{justify-content:flex-end}.scale-fretboard-stats .scale-stat-chip{max-width:100%}@media (max-width:900px){.scale-fretboard-shell{padding:1.35rem}.scale-fretboard-stats{justify-content:flex-start}}@media (max-width:768px){.fretboard{border-radius:1.05rem}.fret-numbers{font-size:.72rem}.fret-number:nth-child(10):after,.fret-number:nth-child(13):after,.fret-number:nth-child(16):after,.fret-number:nth-child(18):after,.fret-number:nth-child(20):after,.fret-number:nth-child(22):after,.fret-number:nth-child(25):after,.fret-number:nth-child(4):after,.fret-number:nth-child(6):after,.fret-number:nth-child(8):after{width:.7rem;height:.7rem;bottom:1rem}.fret-number:nth-child(13):after{width:.9rem;height:.9rem}}@media (max-width:480px){.scale-fretboard-shell{padding:1rem}.fretboard-container{padding-inline:0}.fretboard{padding:.8rem}.fret{height:2.15rem}.note-marker{width:1.25rem;height:1.25rem;font-size:.52rem}}.progression-workspace{display:flex;flex-direction:column;gap:1.5rem}.progression-workspace-header{display:grid;grid-gap:.85rem;gap:.85rem}.progression-workspace-title{margin:0}.progression-workspace-text{margin:0;max-width:70ch;font-family:var(--font-raleway),sans-serif;font-size:1rem;line-height:1.75;color:var(--on-surface-variant)}.progression-config-grid,.progression-degree-grid,.progression-function-list,.progression-insight-grid,.progression-layout-grid,.progression-steps-grid,.progression-suggestion-grid{display:grid;grid-gap:1.2rem;gap:1.2rem}.progression-layout-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:start}.progression-insight-grid{grid-template-columns:minmax(0,1fr) minmax(0,.92fr)}.progression-suggestion-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.progression-analysis-panel,.progression-builder-panel,.progression-config-panel,.progression-degree-card,.progression-diatonic-panel,.progression-function-card,.progression-step-card,.progression-suggestion-card,.progression-suggestions-panel,.progression-template-card{border:1px solid var(--glass-stroke);background:var(--glass-fill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.18),inset 0 1px 0 hsla(0,0%,100%,.05)}body[data-theme=light] .progression-analysis-panel,body[data-theme=light] .progression-builder-panel,body[data-theme=light] .progression-config-panel,body[data-theme=light] .progression-degree-card,body[data-theme=light] .progression-diatonic-panel,body[data-theme=light] .progression-function-card,body[data-theme=light] .progression-step-card,body[data-theme=light] .progression-suggestion-card,body[data-theme=light] .progression-suggestions-panel,body[data-theme=light] .progression-template-card{background:rgba(255,250,242,.76)}.progression-analysis-panel,.progression-builder-panel,.progression-config-panel,.progression-diatonic-panel,.progression-suggestions-panel{padding:1.5rem;border-radius:1.6rem}.progression-panel-head{display:flex;align-items:flex-start;gap:.8rem;margin-bottom:1.2rem}.progression-panel-icon{width:1rem;height:1rem;margin-top:.25rem;color:var(--primary-container);flex-shrink:0}.progression-panel-kicker{display:inline-block;margin-bottom:.45rem;font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--on-surface-variant)}.progression-panel-title{margin:0;font-family:var(--font-inter),sans-serif;font-size:1.18rem;color:var(--on-surface)}.progression-config-grid{grid-template-columns:1fr}.progression-config-field{display:grid;grid-gap:.55rem;gap:.55rem}.progression-config-field span{font-family:var(--font-space-mono),monospace;font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--on-surface-variant)}.progression-select{width:100%;min-height:3rem;padding:.8rem .95rem;border-radius:.95rem;border:1px solid rgba(250,204,21,.14);background:hsla(0,0%,100%,.04);color:var(--on-surface);transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease}.progression-select:focus{outline:none;border-color:rgba(250,204,21,.36);box-shadow:0 0 0 3px rgba(250,204,21,.1)}.progression-builder-actions,.progression-config-actions,.progression-step-actions,.progression-tag-row,.progression-transpose-actions{display:flex;flex-wrap:wrap;gap:.75rem}.progression-config-actions{margin-top:1.25rem}.progression-add-button,.progression-chip-button,.progression-cta,.progression-step-button{border:1px solid rgba(250,204,21,.14);background:hsla(0,0%,100%,.04);color:var(--on-surface);transition:transform .25s ease,border-color .25s ease,background-color .25s ease,color .25s ease,opacity .25s ease}.progression-add-button:hover,.progression-chip-button:hover,.progression-cta:hover,.progression-step-button:hover{transform:translateY(-1px);border-color:rgba(250,204,21,.28)}.progression-add-button:disabled,.progression-chip-button:disabled,.progression-cta:disabled,.progression-step-button:disabled{opacity:.45;cursor:not-allowed;transform:none}.progression-cta{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:3rem;padding:.8rem 1rem;border-radius:1rem;font-family:var(--font-raleway),sans-serif;font-weight:600}.progression-cta-primary{background:rgba(250,204,21,.14);color:var(--primary-container)}.progression-cta-secondary{color:var(--on-surface-variant)}.progression-cta-ghost{width:100%;justify-content:space-between}.progression-cta-icon,.progression-inline-icon{width:.95rem;height:.95rem;flex-shrink:0}.progression-transpose-bar{display:grid;grid-gap:.75rem;gap:.75rem;margin-top:1.25rem;padding-top:1.2rem;border-top:1px solid hsla(0,0%,100%,.08)}.progression-transpose-current{gap:.55rem;padding:.6rem .9rem;border-radius:999px;border:1px solid rgba(250,204,21,.16);background:rgba(250,204,21,.08);color:var(--primary-container)}.progression-chip-button,.progression-transpose-current{display:inline-flex;align-items:center;min-height:2.75rem}.progression-chip-button{gap:.45rem;padding:.6rem .85rem;border-radius:999px;font-family:var(--font-space-mono),monospace;font-size:.76rem;font-weight:700}.progression-builder-actions{margin-bottom:1.15rem}.progression-add-button{min-width:0;display:grid;grid-gap:.15rem;gap:.15rem;padding:.75rem .9rem;border-radius:1rem;text-align:left}.progression-add-button span{font-family:var(--font-bebas),sans-serif;font-size:1.35rem;line-height:1;letter-spacing:.06em}.progression-add-button small{color:var(--on-surface-variant)}.progression-steps-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.progression-degree-card,.progression-function-card,.progression-step-card,.progression-suggestion-card,.progression-template-card{padding:1.15rem;border-radius:1.2rem}.progression-step-card{display:grid;grid-gap:.65rem;gap:.65rem}.progression-degree-function,.progression-function-name,.progression-step-order,.progression-suggestion-top span{font-family:var(--font-space-mono),monospace;font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--on-surface-variant)}.progression-degree-roman,.progression-step-roman{font-family:var(--font-bebas),sans-serif;font-size:1.9rem;letter-spacing:.06em;color:var(--primary-container)}.progression-degree-chord,.progression-step-chord,.progression-suggestion-top h4,.progression-template-header h4{margin:0;font-family:var(--font-inter),sans-serif;font-size:1.05rem;color:var(--on-surface)}.progression-step-function{margin:0;color:var(--on-surface-variant)}.progression-step-button{width:2.5rem;height:2.5rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px}.progression-step-button.danger:hover{border-color:hsla(0,91%,71%,.34);color:#fca5a5}.progression-empty-state{display:grid;place-items:center;grid-gap:.7rem;gap:.7rem;min-height:13rem;border:1px dashed rgba(250,204,21,.18);border-radius:1.4rem;background:hsla(0,0%,100%,.03);text-align:center;color:var(--on-surface-variant)}.progression-degree-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.progression-degree-card{display:grid;grid-gap:.45rem;gap:.45rem;min-height:100%}.progression-template-card{margin-bottom:1rem}.progression-function-top,.progression-suggestion-top,.progression-template-header{display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem}.progression-function-card p,.progression-suggestion-card p,.progression-template-card p{margin:.7rem 0 0;line-height:1.7;color:var(--on-surface-variant)}.progression-tag{display:inline-flex;align-items:center;min-height:2rem;padding:.35rem .6rem;border-radius:999px;border:1px solid rgba(250,204,21,.14);background:hsla(0,0%,100%,.04);font-family:var(--font-space-mono),monospace;font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-surface)}.progression-function-list{grid-template-columns:1fr}.progression-function-top strong{font-family:var(--font-bebas),sans-serif;font-size:1.8rem;line-height:1;color:var(--primary-container)}.progression-suggestions-panel{overflow:hidden}.progression-suggestion-card{display:grid;grid-gap:.7rem;gap:.7rem}@media (max-width:1100px){.progression-insight-grid,.progression-layout-grid,.progression-suggestion-grid{grid-template-columns:1fr}.progression-degree-grid,.progression-steps-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:768px){.progression-analysis-panel,.progression-builder-panel,.progression-config-panel,.progression-diatonic-panel,.progression-suggestions-panel{padding:1.25rem;border-radius:1.4rem}.progression-degree-grid,.progression-steps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.progression-builder-actions,.progression-config-actions,.progression-transpose-actions{flex-direction:column}.progression-chip-button,.progression-cta,.progression-transpose-current{width:100%;justify-content:center}}@media (max-width:480px){.progression-degree-grid,.progression-steps-grid{grid-template-columns:1fr}.progression-function-top,.progression-suggestion-top,.progression-template-header{flex-direction:column}}@font-face{font-family:__Bebas_Neue_d758cf;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/8b44c7e6549520b2-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Bebas_Neue_d758cf;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/6c25f6e897d845a3-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Bebas_Neue_Fallback_d758cf;src:local("Arial");ascent-override:116.50%;descent-override:38.83%;line-gap-override:0.00%;size-adjust:77.25%}.__className_d758cf{font-family:__Bebas_Neue_d758cf,__Bebas_Neue_Fallback_d758cf;font-weight:400;font-style:normal}.__variable_d758cf{--font-bebas:"__Bebas_Neue_d758cf","__Bebas_Neue_Fallback_d758cf"}@font-face{font-family:__Playfair_Display_0a80b4;font-style:normal;font-weight:400 900;font-display:swap;src:url(/_next/static/media/47f136985ef5b5cb-s.woff2) format("woff2");unicode-range:U+0301,U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:__Playfair_Display_0a80b4;font-style:normal;font-weight:400 900;font-display:swap;src:url(/_next/static/media/4ead58c4dcc3f285-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Playfair_Display_0a80b4;font-style:normal;font-weight:400 900;font-display:swap;src:url(/_next/static/media/28a2004cf8372660-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Playfair_Display_0a80b4;font-style:normal;font-weight:400 900;font-display:swap;src:url(/_next/static/media/eaead17c7dbfcd5d-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Playfair_Display_Fallback_0a80b4;src:local("Times New Roman");ascent-override:96.37%;descent-override:22.36%;line-gap-override:0.00%;size-adjust:112.28%}.__className_0a80b4{font-family:__Playfair_Display_0a80b4,__Playfair_Display_Fallback_0a80b4;font-style:normal}.__variable_0a80b4{--font-playfair:"__Playfair_Display_0a80b4","__Playfair_Display_Fallback_0a80b4"}@font-face{font-family:__Raleway_ea7542;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/200388358b398524-s.woff2) format("woff2");unicode-range:U+0460-052f,U+1c80-1c8a,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:__Raleway_ea7542;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/6e67fad4fa881005-s.woff2) format("woff2");unicode-range:U+0301,U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:__Raleway_ea7542;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/10dadb2e82d03733-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Raleway_ea7542;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/95d1875af7c44e92-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Raleway_ea7542;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/630c17af355fa44e-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Raleway_Fallback_ea7542;src:local("Arial");ascent-override:89.62%;descent-override:22.31%;line-gap-override:0.00%;size-adjust:104.89%}.__className_ea7542{font-family:__Raleway_ea7542,__Raleway_Fallback_ea7542;font-style:normal}.__variable_ea7542{--font-raleway:"__Raleway_ea7542","__Raleway_Fallback_ea7542"}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/ba9851c3c22cd980-s.woff2) format("woff2");unicode-range:U+0460-052f,U+1c80-1c8a,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/21350d82a1f187e9-s.woff2) format("woff2");unicode-range:U+0301,U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/c5fe6dc8356a8c31-s.woff2) format("woff2");unicode-range:U+1f??}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/19cfc7226ec3afaa-s.woff2) format("woff2");unicode-range:U+0370-0377,U+037a-037f,U+0384-038a,U+038c,U+038e-03a1,U+03a3-03ff}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/df0a9ae256c0569c-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/8e9860b6e62d6359-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/e4af272ccee01ff0-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Inter_Fallback_f367f3;src:local("Arial");ascent-override:90.20%;descent-override:22.48%;line-gap-override:0.00%;size-adjust:107.40%}.__className_f367f3{font-family:__Inter_f367f3,__Inter_Fallback_f367f3;font-style:normal}.__variable_f367f3{--font-inter:"__Inter_f367f3","__Inter_Fallback_f367f3"}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/ae822095a172cc5c-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/3c70c5716f1730b3-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/fc727f226c737876-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/77fb5eec12c66d49-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/281dae1e814de8c6-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Space_Mono_e8b655;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/806de4d605d3ad01-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Space_Mono_Fallback_e8b655;src:local("Arial");ascent-override:80.78%;descent-override:26.04%;line-gap-override:0.00%;size-adjust:138.65%}.__className_e8b655{font-family:__Space_Mono_e8b655,__Space_Mono_Fallback_e8b655;font-style:normal}.__variable_e8b655{--font-space-mono:"__Space_Mono_e8b655","__Space_Mono_Fallback_e8b655"}