.dropdown{position:relative;display:inline-block}.dropdown-button{background:transparent;border:none;padding:.6rem 1rem;font-family:var(--font-mono);font-size:.78rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:color .2s ease;color:var(--text)}.dropdown-button:hover{background-color:none}.dropdown-button .icon{transition:transform .3s ease}.dropdown-button .icon.rotate{transform:rotate(180deg)}.dropdown-content{position:absolute;background:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;box-shadow:0 4px 12px #0000000f;list-style:none;padding:.4rem 0;margin:0;z-index:1000;min-width:180px;animation:fadeIn .2s ease}.dropdown-content li{padding:0}.dropdown-content a{display:block;padding:.6rem 1rem;font-family:var(--font-mono);font-size:.78rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text);text-decoration:none;transition:background-color .15s ease,color .15s ease}.dropdown-content a:hover{background-color:#0c0c0c0a;color:var(--accent)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.navbar{position:absolute;top:0;left:0;width:100%;padding:1.5rem 3rem;display:flex;justify-content:space-evenly;align-items:center;background-color:transparent;z-index:1000}.navbar-on-hero .dropdown-button{color:#fff}.navbar-on-hero .hamburger span{background-color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}.navbar-on-hero .navbar-links.open .dropdown-button{color:var(--text)}.navbar-on-hero .hamburger.active span{background-color:var(--text);filter:none}.navbar-links{display:flex;gap:2rem;align-items:center}.hamburger{display:none}@media(max-width:768px){.navbar{justify-content:flex-end}.hamburger{display:none;position:relative;width:30px;height:22px;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;background:transparent;border:none;padding:0;z-index:1100}.hamburger span{height:4px;background-color:var(--text);border-radius:2px;transition:all .3s ease}.hamburger.active span:nth-child(1){transform:translateY(9px) rotate(45deg)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}.navbar-links{position:fixed;top:0;left:0;height:100vh;width:100vw;background-color:var(--bg);flex-direction:column;justify-content:center;align-items:center;gap:2.5rem;transform:translate(100%);transition:transform .3s ease;z-index:999}.navbar-links.open{transform:translate(0)}.navbar-links a,.navbar-links button{font-size:1.5rem;text-decoration:none}}.social-icons{display:flex;flex-direction:row;align-items:center;gap:18px;margin:0}.icon{font-size:18px;color:var(--text-muted);transition:color .2s ease,transform .2s ease;cursor:pointer;display:inline-flex}.icon:hover{transform:translateY(-1px)}.icon.youtube:hover{color:red}.icon.github:hover{color:var(--text)}.icon.spotify:hover{color:#1db954}.hero{height:100vh;background:url() center center/cover no-repeat;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;color:#fff}.hero h1{font-size:5rem;margin-bottom:.5rem}.hero p{font-size:1.25rem;margin-bottom:2rem}.hero:after{content:"";position:absolute;inset:0;background:#0006;z-index:0}.hero-content{z-index:1}.hero-button{display:inline-block;margin-top:1rem;padding:.75rem 1.5rem;border-radius:6px;background:#fff;color:#111;text-decoration:none;font-weight:700;transition:background .3s ease}.footer{background-color:var(--bg);border-top:1px solid var(--border-subtle);padding:.85rem 2rem}.footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.footer-copy{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);margin:0}.footer-right{display:flex;align-items:center;gap:1.5rem}.footer-email{font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;color:var(--text-muted);text-decoration:none;transition:color .2s ease}.footer-email:hover{color:var(--accent)}@media(max-width:700px){.footer-inner{justify-content:center;text-align:center}.footer-right{flex-direction:column;gap:.6rem}}.not-found{display:flex;flex-direction:column;align-items:center;justify-content:center;height:80vh;text-align:center;color:#666}.not-found h1{font-size:6rem;margin-bottom:1rem}.not-found a{margin-top:2rem;color:#00aced;text-decoration:none;font-weight:700}.thumbnail{display:block;width:100%;border-radius:12px;overflow:hidden;background-color:var(--surface);text-decoration:none;color:var(--text);transition:transform .25s ease,box-shadow .25s ease}.thumbnail img{display:block;width:100%;height:auto;object-fit:contain}.gallery-grid.square .thumbnail img{aspect-ratio:1 / 1;height:auto;object-fit:cover}.gallery-grid.text .thumbnail img{display:none}.gallery-grid.text .thumbnail{border:1px solid var(--border-subtle);border-radius:4px;transition:border-color .2s ease}.gallery-grid.text .thumbnail-text{padding:1.5rem}.gallery-grid.text .thumbnail-title{font-family:var(--font-display);font-size:1.5rem;font-weight:500;letter-spacing:-.01em;margin:0 0 .5rem}.gallery-grid.text .thumbnail-description{font-family:var(--font-sans);font-size:.95rem;line-height:1.5;color:var(--text-muted);opacity:1}.gallery-grid.text .thumbnail:hover{transform:none;box-shadow:none;border-color:var(--accent)}.thumbnail-text{padding:12px}.thumbnail-title{font-size:1rem;margin:0 0 4px}.thumbnail-description{font-size:.85rem;opacity:.8}.thumbnail:hover{transform:translateY(-2px);box-shadow:0 12px 30px #0000001a}.gallery-wrapper{min-height:100vh;padding:32px;background-color:var(--bg)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;padding:1rem}@media(max-width:768px){.gallery-wrapper{padding:0}.gallery-grid{display:flex;overflow-x:auto;gap:1rem;padding:1rem;scroll-snap-type:x mandatory}.gallery-grid>*{flex:0 0 80%;scroll-snap-align:start}.gallery-grid::-webkit-scrollbar{display:none}.gallery-grid{-ms-overflow-style:none;scrollbar-width:none}.gallery-grid.text{display:flex;flex-direction:column;overflow-x:visible;scroll-snap-type:none}.gallery-grid.text>*{flex:0 0 auto}}.tool-page{padding:7rem 2rem 4rem;min-height:100vh;background-color:var(--bg);color:var(--text)}.tool-page-header{max-width:900px;margin:0 auto 3rem;text-align:center}.tool-page-eyebrow{font-family:var(--font-mono);font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1rem}.tool-page-title{font-family:var(--font-display);font-size:clamp(2.25rem,4.5vw,3.5rem);font-weight:500;line-height:1.05;letter-spacing:-.025em;color:var(--text)}@media(max-width:768px){.tool-page{padding:5rem 1.25rem 3rem}.tool-page-header{margin-bottom:2rem}}.tool-category{margin-bottom:3rem}.tool-category:last-child{margin-bottom:0}.tool-category-title{font-family:var(--font-mono);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);margin:0 0 1.25rem;padding-bottom:.6rem;border-bottom:1px solid var(--border-subtle)}.tool-category .gallery-wrapper{min-height:0;padding:0;background:none}.tool-category .gallery-grid{padding:0}.rudiment-body{text-align:center}.button-rudiment{margin-top:1rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-rudiment:hover{background-color:var(--accent-hover)}.sequence-output-rudiment{margin-top:2rem;font-family:var(--font-mono);font-size:1.5rem;background-color:var(--surface);padding:1rem 2rem;border:1px solid var(--border-subtle);border-radius:4px;display:inline-block;word-wrap:break-word}.sequence-output-rudiment span.S1,.sequence-output-rudiment span.S2,.sequence-output-rudiment span.S3,.sequence-output-rudiment span.S4{color:#f1c40f;font-weight:700}.sequence-output-rudiment span.D1,.sequence-output-rudiment span.D2,.sequence-output-rudiment span.D3,.sequence-output-rudiment span.D4{color:#3498db;font-weight:700}.sequence-output-rudiment span.P1,.sequence-output-rudiment span.P2,.sequence-output-rudiment span.P3,.sequence-output-rudiment span.P4{color:#e67e22;font-weight:700}.sequence-output-rudiment span.Dr{color:#22e69e;font-weight:700}.sequence-output-rudiment span.Fl{color:#478c4a;font-weight:700}.legend-rudiment{margin-top:2rem;max-width:800px;margin-left:auto;margin-right:auto;background-color:var(--surface);padding:1.5rem 2rem;border:1px solid var(--border-subtle);border-radius:4px;display:grid;grid-template-columns:repeat(2,1fr);column-gap:2rem;row-gap:.5rem}.legend-rudiment h2{grid-column:span 2;text-align:center;margin-top:0;color:var(--text)}.legend-rudiment ul{grid-column:span 2;list-style-type:none;padding-left:0;margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:2rem;row-gap:.5rem}.legend-rudiment li{margin-bottom:.5rem;text-align:left}.checkbox-label{display:inline-flex;align-items:center;cursor:pointer;font-size:1rem;-webkit-user-select:none;user-select:none;margin-bottom:1rem}.rudiment-body input[type=checkbox]{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:2px solid var(--border-subtle);border-radius:4px;margin-right:.5rem;background-color:transparent;position:relative;cursor:pointer;transition:all .2s}.rudiment-body input[type=checkbox]:hover{background-color:var(--accent-hover)}.rudiment-body input[type=checkbox]:checked{background-color:var(--accent);border-color:var(--accent)}.handind-body{text-align:center}.left-pattern-input{margin:1rem 0}.left-pattern-input input{padding:.5rem;font-family:var(--font-mono);font-size:1rem;border-radius:2px;border:1px solid var(--border-subtle);background-color:var(--surface);color:var(--text);margin-left:.5rem;width:300px}.handind-button{margin-top:1rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);border:none;border-radius:2px;color:#fff;transition:background-color .2s}.handind-button:hover{background-color:var(--accent-hover)}.handind-sequence{margin-top:2rem;display:flex;flex-direction:column;gap:2rem}.bar{background-color:var(--surface);padding:1rem;border:1px solid var(--border-subtle);border-radius:4px}.bar-title{font-weight:700;margin-bottom:.5rem;text-align:left}.hand-row{display:flex;align-items:center;margin-bottom:.5rem}.hand-label{width:120px;font-weight:700;text-align:left}.hand-notes{display:flex;gap:.25rem;flex-wrap:wrap}.note{width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.75rem;color:#fff}.left-note{background-color:#3498db}.right-note{background-color:#f1c40f}.note.rest{background-color:#222}.note.accent{background-color:#e74c3c;font-weight:700}.note.ghost{background-color:#888;opacity:.5}.probabilities-input{margin:1rem auto;text-align:left;max-width:500px;padding:1rem;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;color:var(--text)}.probabilities-input h3{text-align:center;margin-bottom:1rem}.probability-input-row{display:flex;justify-content:center;gap:.5rem;margin-bottom:.5rem}.probability-input-row label{width:20px}.probability-input-row input{width:60px;padding:.2rem;font-family:var(--font-mono);border-radius:2px;border:1px solid var(--border-subtle);background-color:var(--surface);color:var(--text);text-align:right}.probability-input-row span{width:20px}.form-compound{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;max-width:800px;margin:0 auto;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.field-compound{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.field-compound label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-compound input,.field-compound select{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-compound input:focus,.field-compound select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-compound{grid-column:1 / -1;justify-self:center;margin-top:.5rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-compound:hover{background-color:var(--accent-hover)}.results-compound{margin-top:2rem;max-width:900px;margin-left:auto;margin-right:auto}.summary-compound{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.summary-item{display:flex;flex-direction:column;align-items:center;padding:.5rem}.summary-label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.summary-value{font-family:var(--font-mono);font-size:1.5rem;font-weight:500;color:var(--text)}.schedule-compound{margin-top:2rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.schedule-compound h2{margin-top:0;color:var(--text)}.table-wrapper-compound{overflow-x:auto}.schedule-compound table{width:100%;border-collapse:collapse;color:var(--text)}.schedule-compound td{font-family:var(--font-mono);font-size:.9rem}.schedule-compound th,.schedule-compound td{padding:.5rem .75rem;border-bottom:1px solid var(--border-subtle);text-align:right}.schedule-compound th:first-child,.schedule-compound td:first-child{text-align:left}.schedule-compound th{color:var(--text);font-weight:700;text-transform:uppercase;font-size:.8rem;letter-spacing:.05em}.schedule-compound tbody tr:hover{background-color:#1f2e290d}.controls-poly{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;max-width:700px;margin:0 auto;background-color:var(--surface);padding:1.25rem 1.5rem;border:1px solid var(--border-subtle);border-radius:4px;align-items:end}.field-poly{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.field-poly label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-poly input,.field-poly select{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-poly input:focus,.field-poly select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-poly{padding:.6rem 1.5rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s;height:42px}.button-poly:hover{background-color:var(--accent-hover)}.presets-poly{margin:1rem auto 0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;color:var(--text-muted);font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em}.preset-poly{padding:.35rem .75rem;font-family:var(--font-mono);font-size:.85rem;cursor:pointer;background-color:#1f2e290d;color:var(--text);border:none;border-radius:4px;transition:all .15s}.preset-poly:hover{background-color:var(--border-subtle);transform:translateY(-1px)}.svg-poly{width:100%;max-width:460px;height:auto;margin:1.5rem auto 0;display:block;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px}.legend-poly{margin-top:1rem;display:flex;flex-direction:column;align-items:center;gap:.4rem;color:var(--text);font-family:var(--font-mono);font-size:.85rem}.legend-poly>div{display:flex;align-items:center;gap:.5rem}.dot-poly{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2)}.metronome-body{max-width:480px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.metro-section{width:100%;display:flex;flex-direction:column;align-items:center;gap:1.25rem}.metro-divider{width:100%;border:none;border-top:1px solid var(--border-subtle);margin:0}.beat-row{display:flex;gap:1rem;justify-content:center;align-items:center;min-height:40px}.beat-dot{width:14px;height:14px;border-radius:50%;background-color:transparent;border:1px solid var(--border-subtle);transition:background-color .05s ease,transform .05s ease,border-color .05s ease}.beat-dot.downbeat{border-color:var(--text-muted)}.beat-dot.active{background-color:var(--accent);border-color:var(--accent);transform:scale(1.4)}.bpm-display{display:flex;flex-direction:column;align-items:center;gap:.35rem}.bpm-value{font-family:var(--font-mono);font-size:4.5rem;font-weight:500;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;background:transparent;border:none;text-align:center;width:4ch;padding:0;cursor:text;-moz-appearance:textfield}.bpm-value::-webkit-outer-spin-button,.bpm-value::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bpm-value:focus{outline:none;color:var(--accent)}.bpm-row{width:100%;display:flex;align-items:center;gap:.85rem}.bpm-row-label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);min-width:60px}.bpm-slider{flex:1;accent-color:var(--accent);cursor:pointer}.tones-row{width:100%;display:flex;align-items:end;justify-content:center;gap:1rem;margin-top:.25rem}.tones-row .field-metronome{min-width:0}.time-sig-field{width:160px}.tones-row select,.tones-row input[type=number]{width:100%;min-width:0}.time-sig-field input[type=number]{padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;font-variant-numeric:tabular-nums;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);height:42px;text-align:center}.time-sig-field input[type=number]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.volume-row{width:100%;display:flex;align-items:center;gap:.85rem}.volume-label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);min-width:60px}.volume-slider{flex:1;accent-color:var(--accent);cursor:pointer}.volume-value{font-family:var(--font-mono);font-size:.85rem;font-variant-numeric:tabular-nums;color:var(--text);min-width:28px;text-align:right}.field-metronome{display:flex;flex-direction:column;align-items:flex-start}.field-metronome label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-metronome select{padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);min-width:140px;height:42px}.field-metronome select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.button-metronome{padding:0 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s ease;height:42px;min-width:100px}.button-metronome:hover{background-color:var(--accent-hover)}.metro-transport{display:flex;gap:.75rem;justify-content:center}.button-tap{background-color:var(--surface);color:var(--text);border:1px solid var(--border-subtle)}.button-tap:hover{background-color:var(--alt-surface)}.sub-row{width:100%;display:flex;align-items:center;gap:.85rem}.sub-options{display:flex;flex:1;gap:.4rem}.sub-option{flex:1;min-width:0;height:36px;padding:0 .5rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background-color:var(--surface);color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:2px;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.sub-option:hover{color:var(--text)}.sub-option.active{background-color:var(--accent);color:#fff;border-color:var(--accent)}.fifths-body{max-width:560px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:2rem}.wheel-fifths{width:100%;max-width:420px;height:auto;-webkit-user-select:none;user-select:none}.segment-fifths{cursor:pointer}.wedge-fifths{stroke:var(--bg);stroke-width:2;transition:fill .15s ease}.wedge-fifths.outer{fill:var(--surface)}.wedge-fifths.inner,.segment-fifths:hover .wedge-fifths.outer{fill:var(--alt-surface)}.wedge-fifths.active{fill:var(--accent)}.label-fifths{font-family:var(--font-mono);text-anchor:middle;dominant-baseline:central;fill:var(--text);pointer-events:none}.label-fifths.major{font-size:15px;font-weight:500}.label-fifths.minor{font-size:11px;fill:var(--text-muted)}.label-fifths.active{fill:#fff}.panel-fifths{width:100%;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface);padding:1.5rem}.panel-head-fifths{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:1.25rem}.panel-key-fifths{margin:0;font-size:1.75rem;text-transform:capitalize}.head-actions-fifths{display:flex;align-items:center;gap:.75rem}.mode-toggle-fifths{display:flex;gap:.35rem}.mode-option-fifths{height:42px;padding:0 .85rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;background-color:var(--surface);color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:2px;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.mode-option-fifths:hover{color:var(--text)}.mode-option-fifths.active{background-color:var(--accent);color:#fff;border-color:var(--accent)}.button-fifths{padding:0 1.5rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;height:42px;white-space:nowrap;transition:background-color .2s ease}.button-fifths:hover{background-color:var(--accent-hover)}.detail-fifths{margin:0;display:flex;flex-direction:column;gap:.9rem}.detail-row-fifths{display:flex;flex-direction:column;gap:.35rem}.detail-row-fifths dt{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.detail-row-fifths dd{margin:0}.mono-fifths{font-family:var(--font-mono);font-size:1rem;color:var(--text)}.chords-fifths{display:flex;flex-wrap:wrap;gap:.5rem}.chord-fifths{display:flex;flex-direction:column;align-items:center;gap:.2rem;min-width:3rem;padding:.4rem .5rem;border:1px solid var(--border-subtle);border-radius:3px;background-color:var(--alt-surface)}.roman-fifths{font-family:var(--font-mono);font-size:.68rem;color:var(--text-muted)}.cpb-body{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:1.75rem}.controls-cpb{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.25rem}.field-cpb{display:flex;flex-direction:column;gap:.5rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.field-cpb select{height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);min-width:90px}.field-cpb select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.guide-cpb{border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.guide-summary-cpb{list-style:none;cursor:pointer;padding:.9rem 1.25rem;font-family:var(--font-mono);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text);display:flex;align-items:center;justify-content:space-between}.guide-summary-cpb::-webkit-details-marker{display:none}.guide-summary-cpb:after{content:"+";font-size:1.1rem;color:var(--text-muted)}.guide-cpb[open] .guide-summary-cpb:after{content:"−"}.guide-content-cpb{padding:0 1.25rem 1.25rem;border-top:1px solid var(--border-subtle)}.guide-content-cpb h3{font-family:var(--font-mono);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text);margin:1.25rem 0 .5rem}.guide-content-cpb p{margin:0;font-size:.92rem;line-height:1.65;color:var(--text-muted)}.guide-content-cpb p strong,.guide-content-cpb li strong{color:var(--text)}.guide-content-cpb ol,.guide-content-cpb ul{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.5rem}.guide-content-cpb li{font-size:.92rem;line-height:1.6;color:var(--text-muted)}.guide-content-cpb code{font-family:var(--font-mono);font-size:.85em;color:var(--accent);background-color:var(--alt-surface);padding:.05rem .3rem;border-radius:2px}.guide-examples-cpb code{font-weight:600}.intro-cpb{margin:0;font-size:.95rem;line-height:1.6;color:var(--text-muted)}.intro-cpb strong{color:var(--text)}.block-cpb{display:flex;flex-direction:column;gap:.85rem}.block-title-cpb{margin:0;font-size:1.1rem;font-family:var(--font-mono);font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text)}.chips-cpb{display:flex;flex-wrap:wrap;gap:.5rem}.chip-cpb{display:flex;flex-direction:column;align-items:center;gap:.2rem;min-width:3.4rem;padding:.45rem .55rem;cursor:pointer;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:3px;transition:border-color .15s ease,background-color .15s ease}.chip-cpb:hover{border-color:var(--accent)}.chip-cpb.borrowed{background-color:var(--alt-surface);border-color:var(--accent)}.roman-cpb{font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted)}.chip-cpb.borrowed .roman-cpb{color:var(--accent)}.chord-cpb{font-family:var(--font-mono);font-size:.95rem;font-weight:500;color:var(--text)}.progression-cpb{display:flex;flex-direction:column;gap:.85rem;padding:1.25rem;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.prog-head-cpb{display:flex;align-items:center;justify-content:space-between;gap:1rem}.prog-actions-cpb{display:flex;gap:.5rem}.button-cpb{height:38px;padding:0 1.25rem;font-family:var(--font-mono);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s ease}.button-cpb:hover:not(:disabled){background-color:var(--accent-hover)}.button-cpb.secondary{background-color:var(--surface);color:var(--text);border:1px solid var(--border-subtle)}.button-cpb.secondary:hover:not(:disabled){background-color:var(--alt-surface)}.button-cpb:disabled{opacity:.4;cursor:not-allowed}.prog-strip-cpb{display:flex;flex-wrap:wrap;gap:.5rem}.prog-chip-cpb{position:relative;display:flex;flex-direction:column;align-items:center;gap:.15rem;min-width:3.6rem;padding:.5rem .6rem .45rem;cursor:grab;background-color:var(--alt-surface);border:1px solid var(--border-subtle);border-radius:3px;transition:border-color .15s ease,opacity .15s ease}.prog-chip-cpb:hover{border-color:var(--accent)}.prog-chip-cpb:active{cursor:grabbing}.prog-chip-cpb.dragging{opacity:.45;border-color:var(--accent)}.prog-remove-cpb{position:absolute;top:0;right:2px;padding:0;border:none;background:none;font-family:var(--font-mono);font-size:.8rem;line-height:1;color:var(--text-muted);cursor:pointer}.prog-remove-cpb:hover{color:var(--accent)}.prog-step-cpb{font-family:var(--font-mono);font-size:.6rem;color:var(--text-muted)}.prog-empty-cpb{margin:0;font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted)}.modes-cpb{display:flex;flex-direction:column;gap:1rem}.mode-row-cpb{display:flex;flex-direction:column;gap:.5rem}.mode-name-cpb{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.modes-body{max-width:680px;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem}.guide-modes{border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.guide-summary-modes{list-style:none;cursor:pointer;padding:.9rem 1.25rem;font-family:var(--font-mono);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text);display:flex;align-items:center;justify-content:space-between}.guide-summary-modes::-webkit-details-marker{display:none}.guide-summary-modes:after{content:"+";font-size:1.1rem;color:var(--text-muted)}.guide-modes[open] .guide-summary-modes:after{content:"−"}.guide-content-modes{padding:0 1.25rem 1.25rem;border-top:1px solid var(--border-subtle)}.guide-content-modes h3{font-family:var(--font-mono);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text);margin:1.25rem 0 .5rem}.guide-content-modes p{margin:0;font-size:.92rem;line-height:1.65;color:var(--text-muted)}.guide-content-modes p strong,.guide-content-modes li strong{color:var(--text)}.guide-content-modes ol,.guide-content-modes ul{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.5rem}.guide-content-modes li{font-size:.92rem;line-height:1.6;color:var(--text-muted)}.guide-content-modes code{font-family:var(--font-mono);font-size:.85em;color:var(--accent);background-color:var(--alt-surface);padding:.05rem .3rem;border-radius:2px}.controls-modes{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.25rem}.field-modes{display:flex;flex-direction:column;gap:.5rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.field-modes select{height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);min-width:90px}.field-modes select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.parent-toggle-modes{display:flex;flex-wrap:wrap;gap:.4rem}.parent-option-modes{height:42px;padding:0 1rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background-color:var(--surface);color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:2px;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.parent-option-modes:hover{color:var(--text)}.parent-option-modes.active{background-color:var(--accent);color:#fff;border-color:var(--accent)}.intro-modes{margin:0;font-size:.95rem;line-height:1.6;color:var(--text-muted)}.intro-modes strong{color:var(--text)}.mode-list-modes{display:flex;flex-direction:column;gap:.6rem}.mode-card-modes{display:flex;flex-direction:column;gap:.4rem;width:100%;padding:.9rem 1rem;text-align:left;cursor:pointer;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;transition:border-color .15s ease}.mode-card-modes:hover{border-color:var(--accent)}.mode-head-modes{display:flex;align-items:baseline;gap:.6rem}.mode-index-modes{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted)}.mode-name-modes{font-family:var(--font-display);font-size:1.1rem;color:var(--text)}.mode-alt-modes{font-family:var(--font-sans);font-style:italic;font-size:.82rem;color:var(--text-muted);margin-left:.5rem}.mode-notes-modes{font-family:var(--font-mono);font-size:1rem;color:var(--text)}.mode-formula-modes{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.04em;color:var(--text-muted)}.tuner-body{max-width:480px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1rem}.note-tuner{font-family:var(--font-mono);font-size:5rem;font-weight:500;line-height:1;color:var(--text-muted);display:flex;align-items:baseline;min-height:5rem;transition:color .15s ease}.note-tuner.in-tune{color:var(--accent)}.octave-tuner{font-size:1.75rem;margin-left:.15em;color:var(--text-muted)}.readout-tuner{font-family:var(--font-mono);font-size:.95rem;color:var(--text-muted);font-variant-numeric:tabular-nums}.meter-tuner{width:100%;margin-top:.5rem}.meter-track-tuner{position:relative;width:100%;height:44px;border:1px solid var(--border-subtle);border-radius:3px;background-color:var(--surface)}.meter-center-tuner{position:absolute;top:0;bottom:0;left:50%;width:1px;background-color:var(--text-muted);transform:translate(-.5px)}.needle-tuner{position:absolute;top:4px;bottom:4px;width:3px;background-color:var(--text-muted);border-radius:2px;transform:translate(-1.5px);transition:left .08s linear,background-color .15s ease}.needle-tuner.in-tune{background-color:var(--accent)}.meter-scale-tuner{display:flex;justify-content:space-between;margin-top:.4rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;color:var(--text-muted)}.cents-tuner{font-family:var(--font-mono);font-size:.85rem;font-variant-numeric:tabular-nums;color:var(--text);min-height:1.2rem}.ref-tuner{display:flex;align-items:center;gap:.5rem;margin-top:.5rem}.ref-label-tuner{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.ref-input-tuner{width:72px;height:38px;padding:.4rem .6rem;font-family:var(--font-mono);font-size:1rem;font-variant-numeric:tabular-nums;text-align:center;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.ref-input-tuner:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.ref-unit-tuner{font-family:var(--font-mono);font-size:.8rem;color:var(--text-muted)}.button-tuner{padding:0 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;height:42px;min-width:120px;margin-top:.5rem;transition:background-color .2s ease}.button-tuner:hover{background-color:var(--accent-hover)}.message-tuner{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.04em;text-align:center;color:var(--text);margin:0}.message-tuner.muted{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.seq-body{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:1.75rem}.seq-transport{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.75rem}.button-seq{padding:0 1.5rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;height:42px;transition:background-color .2s ease}.button-seq:hover{background-color:var(--accent-hover)}.button-seq.secondary{background-color:var(--surface);color:var(--text);border:1px solid var(--border-subtle)}.button-seq.secondary:hover{background-color:var(--alt-surface)}.field-seq{display:flex;flex-direction:column;align-items:flex-start}.field-seq-push{margin-left:auto}.field-seq label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-seq input[type=number]{width:80px;height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;font-variant-numeric:tabular-nums;text-align:center;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.field-seq input[type=number]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.field-seq select{height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.field-seq select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.seq-scroll{overflow-x:auto}.seq-grid{display:flex;flex-direction:column;gap:.5rem;width:max-content}.seq-row{display:flex;align-items:center;gap:.85rem}.voice-label-seq{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);width:64px;flex:0 0 64px;text-align:right}.seq-steps{display:flex;gap:4px}.seq-cell{flex:0 0 30px;width:30px;height:30px;padding:0;cursor:pointer;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:3px;transition:background-color .1s ease,border-color .1s ease}.seq-cell.beat{background-color:var(--alt-surface)}.seq-cell:hover{border-color:var(--text-muted)}.seq-cell.on{background-color:var(--accent);border-color:var(--accent)}.seq-cell.playhead{box-shadow:inset 0 0 0 2px var(--text)}.seq-cell.on.playhead{box-shadow:inset 0 0 0 2px #fff}.song-body{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:2rem}.song-transport{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.85rem;padding:1rem 1.25rem;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.song-hint{flex:1 1 100%;margin:0;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.02em;color:var(--text-muted)}.song-section{display:flex;flex-direction:column;gap:1rem}.song-section-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:.75rem;padding-bottom:.6rem;border-bottom:1px solid var(--border-subtle)}.song-section-title{margin:0;font-family:var(--font-mono);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--text)}.song-section-actions{display:flex;align-items:flex-end;gap:.75rem}.song-transport .field-seq select{height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.song-transport .field-seq select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.prog-chip-cpb.playing{border-color:var(--accent);background-color:var(--accent)}.prog-chip-cpb.playing .roman-cpb,.prog-chip-cpb.playing .chord-cpb,.prog-chip-cpb.playing .prog-step-cpb,.prog-chip-cpb.playing .prog-remove-cpb{color:#fff}.aspect-body{max-width:480px;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem}.presets-aspect{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.presets-label-aspect{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-right:.25rem}.preset-aspect{padding:.4rem .8rem;font-family:var(--font-mono);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background-color:var(--surface);color:var(--text);border:1px solid var(--border-subtle);border-radius:2px;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.preset-aspect:hover{border-color:var(--accent);color:var(--accent)}.group-aspect{display:flex;gap:1rem}.field-aspect{flex:1;display:flex;flex-direction:column}.field-aspect label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-aspect input{padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;font-variant-numeric:tabular-nums;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);height:42px;width:100%}.field-aspect input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.lock-aspect{display:flex;align-items:center;gap:.55rem;font-family:var(--font-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);cursor:pointer}.lock-aspect input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.result-aspect{display:flex;gap:1rem;border-top:1px solid var(--border-subtle);padding-top:1.5rem}.result-item-aspect{flex:1;display:flex;flex-direction:column;gap:.35rem;padding:1rem;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.result-label-aspect{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.result-value-aspect{font-family:var(--font-mono);font-size:1.75rem;font-weight:500;font-variant-numeric:tabular-nums;color:var(--text)}.textstats-body{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:1.25rem}.input-textstats{width:100%;min-height:220px;padding:.85rem 1rem;font-family:var(--font-mono);font-size:.95rem;line-height:1.6;color:var(--text);background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:2px;resize:vertical}.input-textstats:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.strip-textstats{display:flex;align-items:center;gap:.55rem;font-family:var(--font-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);cursor:pointer}.strip-textstats input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.stats-grid-textstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem}.stat-item-textstats{display:flex;flex-direction:column;gap:.4rem;padding:1rem;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface)}.stat-value-textstats{font-family:var(--font-mono);font-size:1.6rem;font-weight:500;font-variant-numeric:tabular-nums;color:var(--text);line-height:1}.stat-label-textstats{font-family:var(--font-mono);font-size:.68rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.palette-extractor-body{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:1.25rem}.dropzone-extractor{display:flex;align-items:center;justify-content:center;min-height:200px;padding:1.5rem;border:1px dashed var(--border);border-radius:4px;background-color:var(--alt-surface);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}.dropzone-extractor.over{border-color:var(--accent);background-color:var(--surface)}.dropzone-prompt-extractor{font-family:var(--font-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);text-align:center}.preview-extractor{max-width:100%;max-height:320px;border-radius:2px;display:block}.file-input-extractor{display:none}.controls-extractor{display:flex;align-items:center;gap:1rem}.field-extractor{display:flex;align-items:center;gap:.6rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.field-extractor select{padding:.4rem .6rem;font-family:var(--font-mono);font-size:.9rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.field-extractor select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.swatches-extractor{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:.6rem}.swatch-extractor{display:flex;flex-direction:column;gap:.4rem;padding:0;border:none;background:none;cursor:pointer;text-align:left}.swatch-color-extractor{display:block;height:72px;border-radius:3px;border:1px solid var(--border-subtle)}.hex-extractor{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;color:var(--text)}.hidden-canvas-extractor{display:none}.palette-gen-body{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem}.controls-gen{display:flex;flex-wrap:wrap;gap:1.25rem;align-items:flex-end}.field-gen{display:flex;flex-direction:column;gap:.5rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.picker-row-gen{display:flex;gap:.5rem}.color-gen{width:48px;height:42px;padding:2px;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);cursor:pointer}.hex-input-gen{width:110px;height:42px;padding:.5rem .75rem;font-family:var(--font-mono);font-size:1rem;letter-spacing:.04em;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text)}.hex-input-gen:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.field-gen select{height:42px;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);min-width:180px}.field-gen select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #1a4d4c33}.swatches-gen{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:.6rem}.swatch-gen{display:flex;flex-direction:column;gap:.4rem;padding:0;border:none;background:none;cursor:pointer;text-align:left}.swatch-color-gen{display:block;height:96px;border-radius:3px;border:1px solid var(--border-subtle)}.hex-gen{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;color:var(--text)}.form-loan{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;max-width:800px;margin:0 auto;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.field-loan{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.field-loan label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-loan input{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-loan input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-loan{grid-column:1 / -1;justify-self:center;margin-top:.5rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-loan:hover{background-color:var(--accent-hover)}.results-loan{margin:2rem auto 0;max-width:900px}.summary-loan{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.summary-item-loan{display:flex;flex-direction:column;align-items:center;padding:.5rem}.summary-label-loan{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.summary-value-loan{font-family:var(--font-mono);font-size:1.5rem;font-weight:500;color:var(--text)}.schedule-loan{margin-top:2rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.schedule-loan h2{margin-top:0;color:var(--text)}.table-wrapper-loan{overflow-x:auto}.schedule-loan table{width:100%;border-collapse:collapse;color:var(--text)}.schedule-loan td{font-family:var(--font-mono);font-size:.9rem}.schedule-loan th,.schedule-loan td{padding:.5rem .75rem;border-bottom:1px solid var(--border-subtle);text-align:right}.schedule-loan th:first-child,.schedule-loan td:first-child{text-align:left}.schedule-loan th{color:var(--text);font-weight:700;text-transform:uppercase;font-size:.8rem;letter-spacing:.05em}.schedule-loan tbody tr:hover{background-color:#1f2e290d}.form-savings{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;max-width:800px;margin:0 auto;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.field-savings{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.field-savings label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-savings input,.field-savings select{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-savings input:focus,.field-savings select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-savings{grid-column:1 / -1;justify-self:center;margin-top:.5rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-savings:hover{background-color:var(--accent-hover)}.results-savings{margin:2rem auto 0;max-width:900px}.summary-savings{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.summary-item-savings{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.5rem}.summary-label-savings{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.summary-value-savings{font-family:var(--font-mono);font-size:1.5rem;font-weight:500;color:var(--text)}.note-savings{max-width:520px;margin:0 auto;padding:1.25rem 1.5rem;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;font-family:var(--font-mono);font-size:.85rem;color:var(--text-muted);text-align:center}.form-debt{max-width:760px;margin:0 auto;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px;display:flex;flex-direction:column;gap:1rem}.debt-rows{display:flex;flex-direction:column;gap:.5rem;overflow-x:auto}.debt-head,.debt-row{display:grid;grid-template-columns:1.4fr 1fr .8fr .9fr 32px;gap:.5rem;align-items:center;min-width:520px}.debt-head span{font-family:var(--font-mono);font-size:.68rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.debt-row input{width:100%;padding:.45rem .6rem;font-family:var(--font-sans);font-size:.95rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.debt-row input[type=number]{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.debt-row input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.remove-debt{width:32px;height:32px;font-size:1.2rem;line-height:1;cursor:pointer;background-color:var(--surface);color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:2px}.remove-debt:hover{border-color:var(--accent);color:var(--accent)}.add-debt{align-self:flex-start;padding:.4rem .9rem;font-family:var(--font-mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background-color:var(--surface);color:var(--text);border:1px solid var(--border-subtle);border-radius:2px}.add-debt:hover{border-color:var(--accent);color:var(--accent)}.debt-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;align-items:end;border-top:1px solid var(--border-subtle);padding-top:1.25rem}.field-debt{display:flex;flex-direction:column;align-items:flex-start}.field-debt label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-debt input,.field-debt select{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-debt input:focus,.field-debt select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-debt{padding:.75rem 1.75rem;height:42px;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-debt:hover{background-color:var(--accent-hover)}.results-debt{margin:2rem auto 0;max-width:760px}.summary-debt{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.summary-item-debt{display:flex;flex-direction:column;align-items:center;padding:.5rem}.summary-label-debt{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.summary-value-debt{font-family:var(--font-mono);font-size:1.5rem;font-weight:500;color:var(--text)}.schedule-debt{margin-top:2rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.schedule-debt h2{margin-top:0;color:var(--text)}.payoff-list-debt{margin:0;padding-left:1.25rem;display:flex;flex-direction:column;gap:.5rem}.payoff-list-debt li{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border-subtle);padding-bottom:.5rem}.payoff-name-debt{color:var(--text)}.payoff-month-debt{font-family:var(--font-mono);font-size:.85rem;color:var(--text-muted)}.note-debt{max-width:560px;margin:0 auto;padding:1.25rem 1.5rem;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;font-family:var(--font-mono);font-size:.85rem;color:var(--text-muted);text-align:center}.form-inflation{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;max-width:800px;margin:0 auto;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.mode-row-inflation{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:.85rem 1.25rem}.mode-toggle-inflation{display:flex;gap:.4rem}.mode-option-inflation{height:38px;padding:0 1rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background-color:var(--bg);color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:2px;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.mode-option-inflation:hover{color:var(--text)}.mode-option-inflation.active{background-color:var(--accent);color:#fff;border-color:var(--accent)}.mode-hint-inflation{margin:0;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.02em;color:var(--text-muted)}.cpi-chart-wrap-inflation{max-width:600px;margin:1.75rem auto 0}.cpi-caption-inflation{margin:0 0 .5rem;font-family:var(--font-mono);font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);text-align:center}.cpi-chart-inflation{width:100%;height:auto;display:block}.cpi-line-inflation{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linejoin:round}.cpi-grid-inflation{stroke:var(--border-subtle);stroke-width:1}.cpi-axis-inflation{font-family:var(--font-mono);font-size:9px;fill:var(--text-muted)}.cpi-marker-inflation{stroke:var(--accent);stroke-width:1;stroke-dasharray:3 3;opacity:.55}.cpi-dot-inflation{fill:var(--accent)}.cpi-marker-label-inflation{font-family:var(--font-mono);font-size:9px;font-weight:500;fill:var(--accent)}.error-inflation{max-width:560px;margin:1.5rem auto 0;padding:1.25rem 1.5rem;background-color:var(--surface);border:1px solid var(--border-subtle);border-radius:4px;font-family:var(--font-mono);font-size:.85rem;color:var(--text-muted);text-align:center}.field-inflation{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.field-inflation label{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.field-inflation input{width:100%;padding:.5rem .75rem;font-family:var(--font-sans);font-size:1rem;border:1px solid var(--border-subtle);border-radius:2px;background-color:var(--surface);color:var(--text);box-sizing:border-box}.field-inflation input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2a4d4c40}.button-inflation{grid-column:1 / -1;justify-self:center;margin-top:.5rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;background-color:var(--accent);color:#fff;border:none;border-radius:2px;transition:background-color .2s}.button-inflation:hover{background-color:var(--accent-hover)}.results-inflation{margin:2rem auto 0;max-width:800px}.statement-inflation{text-align:center;font-family:var(--font-display);font-size:1.25rem;line-height:1.5;color:var(--text);margin:0 0 1.5rem}.statement-inflation strong{color:var(--accent);font-weight:600}.summary-inflation{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;background-color:var(--surface);padding:1.5rem;border:1px solid var(--border-subtle);border-radius:4px}.summary-item-inflation{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.5rem}.summary-label-inflation{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.5rem}.summary-value-inflation{font-family:var(--font-mono);font-size:1.5rem;font-weight:500;color:var(--text)}@keyframes playerFadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.player.animate-in{animation:playerFadeUp .6s ease-out forwards}.player{padding:2rem;max-width:1000px;margin:0 auto;border:1px solid var(--border-subtle);border-radius:4px;background-color:var(--surface);color:var(--text)}.player-columns{display:flex;gap:2.5rem;align-items:flex-start}.left-column{flex:1;text-align:center}.right-column{flex:1}.header-text h2{font-family:var(--font-display);font-size:1.75rem;letter-spacing:-.015em;margin:0 0 .35rem}.header-text p{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);margin:0 0 1.5rem}.album-container{margin-bottom:1.5rem}.album-art{width:260px;height:260px;object-fit:cover;border-radius:2px;border:1px solid var(--border-subtle)}.song-info{margin-bottom:1rem}.song-title{font-family:var(--font-display);font-size:1.25rem;font-weight:500;margin:0}.controls{margin:.25rem 0 .5rem}.play-button{font-size:1.1rem;width:52px;height:52px;border-radius:50%;border:none;background-color:var(--accent);color:#fff;cursor:pointer;padding-bottom:3px;padding-left:3px;transition:background-color .2s ease}.play-button:hover{background-color:var(--accent-hover)}.play-button.pausing{padding-left:0;padding-bottom:5px}.timeline,.volume-control{display:flex;align-items:center;gap:10px;width:100%;margin-top:.75rem}.timeline .slider,.volume-control input[type=range]{flex:1;accent-color:var(--accent)}.time-label{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);white-space:nowrap}.volume-control>span:first-child{font-size:.9rem;color:var(--text-muted)}.playlist-container{background:transparent;padding:0 0 0 1.5rem;border-left:1px solid var(--border-subtle)}.playlist-container h4{font-family:var(--font-mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);margin:0 0 .75rem}.playlist-list{overflow-y:auto;max-height:440px;list-style:none;padding:0;margin:0}.playlist-item{padding:.65rem .5rem;cursor:pointer;display:flex;gap:.85rem;align-items:baseline;border-bottom:1px solid var(--border-subtle);border-left:2px solid transparent;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.playlist-item:hover{background-color:#0c0c0c0a}.playlist-item.active{border-left-color:var(--accent);color:var(--accent);background-color:transparent}.song-number{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);min-width:22px;text-align:right}.playlist-item.active .song-number{color:var(--accent)}.song-name{font-family:var(--font-sans);font-size:.95rem}@media(max-width:768px){.player-columns{flex-direction:column}.playlist-container{border-left:none;padding-left:0;border-top:1px solid var(--border-subtle);padding-top:1.5rem}}.text-section-wrapper{min-height:50vh;background-color:var(--surface);padding-left:128px;padding-right:128px;padding-top:32px;text-align:center;color:var(--text)}.lightbox-overlay{position:fixed;inset:0;background-color:#0c0c0ceb;display:flex;align-items:center;justify-content:center;z-index:1000;padding:40px 80px}.lightbox-image{max-width:100%;max-height:100%;object-fit:contain;display:block}.lightbox-close,.lightbox-nav{position:absolute;background:none;border:none;color:var(--bg);cursor:pointer;font-family:var(--font-sans);line-height:1;padding:8px 12px;opacity:.55;transition:opacity .15s ease}.lightbox-close:hover,.lightbox-nav:hover,.lightbox-close:focus-visible,.lightbox-nav:focus-visible{opacity:1;outline:none}.lightbox-close{top:16px;right:20px;font-size:32px}.lightbox-nav{top:50%;transform:translateY(-50%);font-size:48px}.lightbox-prev{left:16px}.lightbox-next{right:16px}.lightbox-counter{position:absolute;bottom:20px;left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;color:var(--bg);opacity:.55}@media(max-width:768px){.lightbox-overlay{padding:16px}.lightbox-nav{font-size:36px;padding:6px 8px}.lightbox-prev{left:4px}.lightbox-next{right:4px}.lightbox-close{top:8px;right:12px;font-size:28px}}.masonry-wrapper{max-width:1600px;margin:0 auto;padding:40px 20px}.my-masonry-grid{display:flex;margin-left:-25px;width:auto}.my-masonry-grid_column{padding-left:25px;background-clip:padding-box}.masonry-item{margin-bottom:25px}:root{--bg: #faf8f3;--surface: #ffffff;--alt-surface: #f5f0e6;--gradient-stop: #f0eadc;--text: #0c0c0c;--text-muted: #6b6b6b;--accent: #1a4d4c;--accent-hover: #2a6e6b;--border: #e8e3d8;--border-subtle: rgba(12, 12, 12, .08);--font-display: "IBM Plex Serif", Georgia, "Times New Roman", serif;--font-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono: "IBM Plex Mono", "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0;scroll-behavior:smooth;font-family:var(--font-sans);font-size:16px;line-height:1.6;background-color:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3{font-family:var(--font-display);font-weight:500;letter-spacing:-.02em;color:inherit}h1{font-size:clamp(2.5rem,5vw,4rem);line-height:1.05}h2{font-size:clamp(2rem,3.5vw,3rem);line-height:1.15;letter-spacing:-.025em}h3{font-size:1.25rem;line-height:1.3}code,kbd,samp,pre{font-family:var(--font-mono);font-size:.95em}