.tool-main{padding-top:var(--nav-height);position:relative}.tool-header{padding:64px var(--gutter) 32px;border-bottom:1px solid var(--line);position:relative;overflow:hidden}.tool-header:before{content:"";filter:blur(60px);pointer-events:none;background:radial-gradient(#ff6a1a2e 0%,#ff6a1a0d 35%,#0000 65%);width:700px;height:500px;position:absolute;top:-100px;right:-100px}.tool-header-inner{max-width:var(--max-w);flex-direction:column;gap:24px;margin:0 auto;display:flex;position:relative}.tool-breadcrumb{align-items:center;gap:10px;font-size:13px;display:flex}.crumb{color:var(--fg-2);white-space:nowrap;transition:color var(--dur-fast) var(--ease), gap var(--dur-fast) var(--ease);align-items:center;gap:6px;font-weight:500;display:inline-flex}.crumb:hover{color:var(--ember-300);gap:10px}.crumb-sep{color:var(--fg-3)}.crumb-active{color:var(--fg-0)}.tool-header-row{align-items:center;gap:20px;display:flex}.tool-header-icon{background:var(--bg-1);border:1px solid var(--line-strong);border-radius:var(--radius-lg);width:64px;height:64px;color:var(--ember-300);box-shadow:var(--shadow-card), inset 0 0 0 1px #ff6a1a14;flex-shrink:0;place-items:center;display:grid}.tool-h1{font-family:var(--font-display);letter-spacing:-.04em;color:var(--fg-0);margin:0 0 8px;font-size:clamp(36px,5vw,56px);font-weight:700;line-height:1}.tool-h1-sub{color:var(--fg-1);max-width:580px;margin:0;font-size:17px;line-height:1.5}.tool-header-meta{flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px;display:flex}.tool-slug{color:var(--fg-2);background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px}.tool-tag{font:500 11px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.08em;border-radius:var(--radius-sm);padding:6px 10px}.tool-tag-free{background:var(--ember-tint);color:var(--ember-200);border:1px solid #ff6a1a66;align-items:center;gap:6px;display:inline-flex}.tool-body{max-width:var(--max-w);padding:48px var(--gutter) 64px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:flex-start;gap:48px;margin:0 auto;display:grid;position:relative}@media (max-width:980px){.tool-body{grid-template-columns:1fr;gap:32px}}.tool-left{flex-direction:column;gap:24px;display:flex}.tool-right{top:calc(var(--nav-height) + 16px);flex-direction:column;gap:16px;display:flex;position:sticky}@media (max-width:980px){.tool-right{position:static}}.console{background:linear-gradient(180deg, var(--bg-2) 0%, var(--bg-1) 100%);border:1px solid var(--line-strong);border-radius:var(--radius-xl);box-shadow:var(--shadow-pop);padding:32px;position:relative;overflow:hidden}.console:before{content:"";background:linear-gradient(90deg,#0000,#ff6a1a66,#0000);height:1px;position:absolute;top:0;left:0;right:0}.console-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:18px;display:flex}.console-head-title{align-items:center;gap:10px;display:flex}.console-head-title .lbl{color:var(--fg-1);font-size:12px}.console-head-status{font-family:var(--font-mono);color:var(--fg-2);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:6px;font-size:11px;display:inline-flex}.info-card{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px}.info-card-title{font:500 11px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--fg-2);margin:0 0 14px}.info-card-body{color:var(--fg-1);flex-direction:column;gap:12px;font-size:14px;line-height:1.6;display:flex}.info-card-body p{color:var(--fg-1);margin:0}.info-card-body ul,.info-card-body ol{flex-direction:column;gap:6px;margin:0;padding-left:18px;display:flex}.info-card-body li{color:var(--fg-1)}.info-card-body strong{color:var(--fg-0);font-weight:600}.info-card-body .mono{background:var(--bg-inset);color:var(--fg-0);border-radius:4px;padding:2px 6px;font-size:13px}.num-input{background:var(--bg-inset);border:1px solid var(--line-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-inset);align-items:center;gap:4px;padding:4px;display:inline-flex}.num-btn{width:32px;height:32px;color:var(--fg-1);font:500 16px/1 var(--font-sans);cursor:pointer;border-radius:var(--radius-sm);transition:all var(--dur-fast) var(--ease);background:0 0;border:0}.num-btn:hover{background:var(--bg-2);color:var(--fg-0)}.num-field{color:var(--fg-0);font:600 18px/1 var(--font-mono);text-align:center;-moz-appearance:textfield;background:0 0;border:0;outline:none;width:80px}.num-field::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.num-field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.num-suffix{font:500 11px/1 var(--font-mono);color:var(--ember-300);letter-spacing:.12em;text-transform:uppercase;padding-right:4px}.bpm-slider{flex-direction:column;gap:10px;display:flex}.bpm-slider-track{background:var(--bg-inset);border:1px solid var(--line-strong);border-radius:var(--radius-full);height:28px;box-shadow:var(--shadow-inset);position:relative;overflow:hidden}.bpm-slider-fill{background:linear-gradient(90deg, var(--ember-700), var(--ember), var(--amber));border-radius:var(--radius-full);pointer-events:none;transition:width .12s var(--ease);position:absolute;top:0;bottom:0;left:0}.bpm-slider-input{appearance:none;cursor:ew-resize;z-index:2;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.bpm-slider-input::-webkit-slider-thumb{appearance:none;background:var(--fg-0);border-radius:var(--radius-sm);border:1px solid var(--line-strong);width:24px;height:32px;box-shadow:var(--shadow-pop);cursor:ew-resize}.bpm-slider-input::-moz-range-thumb{background:var(--fg-0);border-radius:var(--radius-sm);border:1px solid var(--line-strong);cursor:ew-resize;width:24px;height:32px}.bpm-slider-ticks{justify-content:space-between;padding:0 4px;display:flex}.bpm-tick{font:500 10px/1 var(--font-mono);color:var(--fg-3);letter-spacing:.04em;font-variant-numeric:tabular-nums}.bpm-tick-active{color:var(--ember-300)}.stat-tile{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);flex-direction:column;gap:6px;padding:14px 16px;display:flex}.stat-tile-label{font:500 10px/1 var(--font-mono);color:var(--fg-2);letter-spacing:.08em;text-transform:uppercase}.stat-tile-row{align-items:baseline;gap:6px;display:flex}.stat-tile-value{font:600 22px/1 var(--font-mono);color:var(--fg-0)}.stat-tile-unit{font:500 11px/1 var(--font-mono);color:var(--fg-2);letter-spacing:.08em;text-transform:uppercase}.stat-tile-big .stat-tile-value{font:700 36px/1 var(--font-display);letter-spacing:-.03em;font-variation-settings:"wdth" 88}.stat-tile-accent{background:var(--ember-tint);border-color:#ff6a1a66}.stat-tile-accent .stat-tile-value{color:var(--ember-200)}.copy-btn{border-radius:var(--radius-sm);width:26px;height:26px;color:var(--fg-3);cursor:pointer;transition:all var(--dur-fast) var(--ease);background:0 0;border:1px solid #0000;place-items:center;display:grid}.copy-btn:hover{background:var(--bg-2);color:var(--ember-300);border-color:var(--line)}.tool-opening{max-width:var(--max-w);padding:0 var(--gutter);margin:0 auto}.tool-opening-copy{font:400 15px/1.7 var(--font-sans);color:var(--fg-2);max-width:640px;margin:0;padding:20px 0 0}.tool-faq{max-width:var(--max-w);padding:32px var(--gutter) 48px;border-top:1px solid var(--line);margin:0 auto}.tool-faq-inner{max-width:720px}.tool-faq-heading{font:600 13px/1 var(--font-sans);letter-spacing:.05em;text-transform:uppercase;color:var(--fg-3);margin:0 0 24px}.tool-faq-list{flex-direction:column;gap:20px;margin:0;padding:0;display:flex}.tool-faq-item{flex-direction:column;gap:8px;display:flex}.tool-faq-q{font:600 14px/1.4 var(--font-sans);color:var(--fg-0);margin:0}.tool-faq-a{font:400 14px/1.65 var(--font-sans);color:var(--fg-2);margin:0;padding:0}.related{max-width:var(--max-w);padding:32px var(--gutter) 64px;border-top:1px solid var(--line);margin:0 auto}.related-head{justify-content:space-between;align-items:baseline;margin-bottom:20px;display:flex}.related-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}@media (max-width:800px){.related-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:520px){.related-grid{grid-template-columns:1fr}}.related-card{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);color:var(--fg-0);transition:all var(--dur-fast) var(--ease);align-items:center;gap:14px;padding:16px;display:flex}.related-card:hover{background:var(--bg-2);border-color:var(--line-strong);color:var(--fg-0)}.related-card:hover .related-card-icon{color:var(--ember-300)}.related-card-icon{width:36px;height:36px;color:var(--fg-1);background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);transition:color var(--dur-fast) var(--ease);flex-shrink:0;place-items:center;display:grid}.related-card-text{flex-direction:column;flex:1;gap:2px;display:flex}.related-card-name{font:500 14px/1.2 var(--font-sans);letter-spacing:-.01em;color:var(--fg-0)}.related-card-blurb{font:400 12px/1.3 var(--font-sans);color:var(--fg-2)}.waitlist-mini{max-width:var(--max-w);padding:32px var(--gutter) 96px;margin:0 auto}.waitlist-mini-inner{background:linear-gradient(180deg, var(--bg-2), var(--bg-1));border:1px solid var(--line-strong);border-radius:var(--radius-xl);box-shadow:var(--shadow-pop);grid-template-columns:1.1fr 1fr;gap:48px;padding:48px;display:grid;position:relative;overflow:hidden}.waitlist-mini-inner:before{content:"";filter:blur(40px);pointer-events:none;background:radial-gradient(circle,#ff6a1a38 0%,#0000 60%);width:500px;height:500px;position:absolute;top:-100px;right:-100px}@media (max-width:800px){.waitlist-mini-inner{grid-template-columns:1fr;gap:24px;padding:32px}}.waitlist-mini-left,.waitlist-mini-right{position:relative}.waitlist-mini-title{font-family:var(--font-display);letter-spacing:-.03em;color:var(--fg-0);text-wrap:balance;margin:14px 0 12px;font-size:clamp(24px,3vw,36px);font-weight:700;line-height:1.05}.waitlist-mini-sub{color:var(--fg-1);max-width:480px;margin:0;font-size:15px;line-height:1.55}.waitlist-mini-right{align-items:center;display:flex}.waitlist-mini-right .waitlist{width:100%}.kbd{font:500 11px/1 var(--font-mono);background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:var(--fg-1);border-bottom-width:2px;padding:4px 7px;display:inline-block}.divider-h{background:var(--line);height:1px;margin:8px 0}.field-row{flex-direction:column;gap:8px;display:flex}.field-row-label{font:500 12px/1 var(--font-sans);color:var(--fg-2);letter-spacing:.06em;text-transform:uppercase;justify-content:space-between;align-items:center;display:flex}.tapper-page-display{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-inset);grid-template-columns:1.4fr 1fr;gap:24px;margin-bottom:20px;padding:28px;display:grid}@media (max-width:600px){.tapper-page-display{grid-template-columns:1fr}}.tapper-page-bpm{flex-direction:column;gap:8px;display:flex}.tapper-page-bpm .bpm-num{font-variation-settings:"wdth" 75;font-size:140px;line-height:.85}.tapper-page-bpm .bpm-unit{font-size:12px}.tapper-page-controls{grid-template-columns:1fr auto auto;gap:12px;display:grid}.tap-btn-big .tap-btn-inner{padding:32px}.tap-btn-big .tap-btn-label{font-size:32px}.calc-input-grid{gap:20px;margin-bottom:24px;display:grid}.calc-input-grid.two-col{grid-template-columns:1fr 1fr}@media (max-width:600px){.calc-input-grid.two-col{grid-template-columns:1fr}}.calc-big-input{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-inset);flex-direction:column;gap:8px;padding:24px;display:flex}.calc-big-input-label{font:500 11px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2)}.calc-big-input-row{align-items:baseline;gap:8px;display:flex}.calc-big-input input{color:var(--fg-0);font:700 64px/1 var(--font-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;font-variation-settings:"wdth" 88;-moz-appearance:textfield;background:0 0;border:0;outline:none;width:100%;padding:0}.calc-big-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.calc-big-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.calc-big-input-unit{font:500 14px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ember-300)}.calc-table{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}.calc-table-head{background:var(--bg-1);border-bottom:1px solid var(--line);font:500 11px/1 var(--font-mono);color:var(--fg-2);letter-spacing:.08em;text-transform:uppercase;grid-template-columns:90px repeat(3,1fr);padding:12px 18px;display:grid}.calc-table-row{border-bottom:1px solid var(--line);transition:background var(--dur-fast) var(--ease);grid-template-columns:90px repeat(3,1fr);align-items:center;padding:16px 18px;display:grid}.calc-table-row:last-child{border-bottom:0}.calc-table-row:hover{background:var(--bg-1)}.calc-table-row .note{font:600 15px/1 var(--font-mono);color:var(--fg-0);align-items:center;gap:8px;display:flex}.calc-table-row .cell{font:500 15px/1 var(--font-mono);color:var(--fg-1);align-items:center;gap:6px;display:flex}.calc-table-row.row-accent .cell{color:var(--ember-200)}.calc-table-row.row-accent .note{color:var(--ember-300)}@media (max-width:600px){.calc-table-head,.calc-table-row{grid-template-columns:60px repeat(3,1fr);padding:12px;font-size:12px}.calc-table-row .note,.calc-table-row .cell{font-size:13px}}.swap-result{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);justify-content:center;align-items:center;gap:24px;margin-bottom:16px;padding:32px 24px;display:flex}.swap-result-value{flex-direction:column;flex:1;align-items:center;gap:8px;display:flex}.swap-result-num{font:700 64px/1 var(--font-display);letter-spacing:-.04em;font-variation-settings:"wdth" 85;color:var(--fg-0);font-variant-numeric:tabular-nums}.swap-result-num.accent{background:linear-gradient(105deg, var(--ember-300), var(--ember), var(--amber));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.swap-result-unit{font:500 11px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}.swap-arrow{color:var(--fg-3);border-radius:var(--radius-full);background:var(--bg-1);border:1px solid var(--line);place-items:center;width:40px;height:40px;display:grid}.preset-chips{flex-wrap:wrap;gap:8px;display:flex}.preset-chip{font:500 12px/1 var(--font-mono);border-radius:var(--radius-full);background:var(--bg-1);border:1px solid var(--line);color:var(--fg-1);cursor:pointer;transition:all var(--dur-fast) var(--ease);padding:8px 12px}.preset-chip:hover{background:var(--bg-2);color:var(--fg-0)}.preset-chip-active{background:var(--ember-tint);color:var(--ember-200);border-color:#ff6a1a66}.key-grid{grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:20px;display:grid}@media (max-width:600px){.key-grid{grid-template-columns:repeat(4,1fr)}}.key-cell{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer;transition:all var(--dur-fast) var(--ease);flex-direction:column;align-items:center;gap:4px;padding:10px 8px;display:flex}.key-cell:hover{background:var(--bg-2);border-color:var(--line-strong)}.key-cell-active{background:var(--ember-tint);border-color:var(--ember);box-shadow:0 0 0 1px var(--ember)}.key-cell-standard{font:600 14px/1 var(--font-sans);color:var(--fg-0)}.key-cell-camelot{font:500 11px/1 var(--font-mono);color:var(--fg-2)}.key-cell-active .key-cell-standard{color:var(--ember-200)}.key-cell-active .key-cell-camelot{color:var(--ember-300)}.key-result{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);grid-template-columns:repeat(4,1fr);gap:12px;padding:24px;display:grid}@media (max-width:600px){.key-result{grid-template-columns:repeat(2,1fr)}}.key-result-cell{flex-direction:column;gap:6px;display:flex}.key-result-label{font:500 10px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2)}.key-result-value{font:700 24px/1 var(--font-display);letter-spacing:-.03em;color:var(--fg-0);font-variation-settings:"wdth" 88;align-items:center;gap:8px;display:flex}.key-result-value.mono-val{font:600 22px/1 var(--font-mono)}.key-result-cell-accent .key-result-value{color:var(--ember-200)}.camelot-layout{grid-template-columns:1fr 1fr;align-items:center;gap:32px;display:grid}@media (max-width:800px){.camelot-layout{grid-template-columns:1fr}}.camelot-wheel-wrap{aspect-ratio:1;justify-content:center;align-items:center;width:100%;max-width:460px;margin:0 auto;display:flex;position:relative}.camelot-svg{width:100%;height:100%}.camelot-segment{cursor:pointer;transition:opacity .2s var(--ease), filter .2s var(--ease)}.camelot-segment-dim{opacity:.18}.camelot-segment:hover{opacity:1;filter:brightness(1.2)}.camelot-info{flex-direction:column;gap:16px;display:flex}.camelot-selected{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);flex-direction:column;gap:16px;padding:24px;display:flex}.camelot-selected-head{justify-content:space-between;align-items:center;display:flex}.camelot-selected-key{font:700 56px/1 var(--font-display);letter-spacing:-.04em;color:var(--fg-0);font-variation-settings:"wdth" 85}.camelot-selected-code{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.camelot-selected-code .mono{font:600 20px/1 var(--font-mono);color:var(--ember-300)}.compat-list{flex-direction:column;gap:8px;display:flex}.compat-row{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);align-items:center;gap:12px;padding:10px 12px;display:flex}.compat-row-label{font:500 11px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-2);flex-shrink:0;width:80px}.compat-row-keys{flex-wrap:wrap;gap:6px;display:flex}.compat-key{font:600 13px/1 var(--font-sans);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--fg-0);cursor:pointer;transition:all var(--dur-fast) var(--ease);padding:6px 10px}.compat-key:hover{background:var(--ember-tint);color:var(--ember-200);border-color:#ff6a1a66}.compat-key .mono{color:var(--fg-2);margin-left:4px;font-size:10px}.dropzone{border:2px dashed var(--line-strong);border-radius:var(--radius-xl);background:var(--bg-inset);text-align:center;transition:all var(--dur-fast) var(--ease);cursor:pointer;flex-direction:column;align-items:center;gap:16px;padding:56px 24px;display:flex}.dropzone:hover,.dropzone-active{border-color:var(--ember);background:var(--ember-tint)}.dropzone-icon{border-radius:var(--radius-lg);background:var(--bg-2);border:1px solid var(--line-strong);width:56px;height:56px;color:var(--ember-300);place-items:center;display:grid}.dropzone-title{font:600 18px/1.2 var(--font-sans);color:var(--fg-0);letter-spacing:-.01em;margin:0}.dropzone-sub{color:var(--fg-2);margin:0;font-size:13px}.dropzone-formats{font:500 10px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin-top:6px}.analyzing{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-xl);flex-direction:column;gap:20px;padding:32px;display:flex}.analyzing-head{justify-content:space-between;align-items:center;display:flex}.analyzing-filename{align-items:center;gap:10px;display:flex}.analyzing-status{font:500 11px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ember-300);align-items:center;gap:6px;display:inline-flex}.analyzing-wave{align-items:center;gap:3px;height:100px;padding:0 4px;display:flex}.analyzing-wave>div{background:linear-gradient(180deg, var(--amber), var(--ember));min-height:4px;animation:wave-pulse 1.4s var(--ease) infinite;border-radius:2px;flex:1}.progress-bar{background:var(--bg-2);border-radius:var(--radius-full);height:6px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--ember-700), var(--ember), var(--amber));height:100%;transition:width .2s var(--ease);border-radius:var(--radius-full)}.progress-stages{font:500 11px/1 var(--font-mono);letter-spacing:.06em;color:var(--fg-3);justify-content:space-between;display:flex}.progress-stages span.active{color:var(--ember-300)}.progress-stages span.done{color:var(--success)}.result-display{grid-template-columns:1.2fr 1fr;gap:20px;display:grid}@media (max-width:600px){.result-display{grid-template-columns:1fr}}.result-key{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);flex-direction:column;gap:12px;padding:28px;display:flex}.result-key-key{font:700 80px/1 var(--font-display);letter-spacing:-.05em;font-variation-settings:"wdth" 80;background:linear-gradient(105deg, var(--ember-300), var(--ember), var(--amber));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.result-key-camelot{font:600 18px/1 var(--font-mono);color:var(--fg-1)}.result-conf{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);flex-direction:column;gap:8px;padding:16px;display:flex}.result-conf-bar{background:var(--bg-2);border-radius:var(--radius-full);height:4px;overflow:hidden}.result-conf-fill{background:var(--success);border-radius:var(--radius-full);height:100%}.result-meta{flex-direction:column;gap:10px;display:flex}.demo-notice{background:var(--warning-bg);border-radius:var(--radius-md);color:var(--fg-1);border:1px solid #ffb5474d;align-items:flex-start;gap:10px;padding:14px 16px;font-size:13px;line-height:1.5;display:flex}.demo-notice strong{color:var(--warning);font-weight:600}.demo-notice svg{color:var(--warning);flex-shrink:0;margin-top:2px}.metronome-console{background:linear-gradient(#1a1411 0%,#110d0b 100%);padding:28px}.metronome-layout{grid-template-columns:320px 1fr;align-items:flex-start;gap:32px;display:grid}@media (max-width:720px){.metronome-layout{grid-template-columns:1fr}}.metronome-svg-wrap{flex-direction:column;align-items:center;gap:12px;display:flex}.metronome-svg{-webkit-user-select:none;user-select:none;touch-action:none;width:100%;max-width:320px;height:auto}.metronome-hint{font:500 11px/1.4 var(--font-mono);color:var(--fg-3);letter-spacing:.04em;text-align:center}.metronome-controls{flex-direction:column;gap:18px;display:flex}.tempo-readout{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-inset);justify-content:space-between;align-items:flex-end;padding:18px 22px;display:flex}.tempo-readout-num{align-items:baseline;gap:8px;display:flex}.tempo-readout-num .mono{font:700 56px/.9 var(--font-display);letter-spacing:-.04em;font-variation-settings:"wdth" 85;color:var(--fg-0);font-variant-numeric:tabular-nums}.tempo-readout-unit{font:500 11px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ember-300)}.tempo-readout-term{flex-direction:column;align-items:flex-end;gap:2px;display:flex}.term-italic{color:var(--fg-0);letter-spacing:-.01em;font:italic 600 18px/1 Times New Roman,serif}.term-desc{font:400 11px/1.3 var(--font-sans);color:var(--fg-2)}.tempo-nudge{grid-template-columns:auto auto 1fr auto auto;align-items:center;gap:8px;display:grid}.nudge-btn{background:var(--bg-2);color:var(--fg-1);border:1px solid var(--line-strong);border-radius:var(--radius-md);font:600 12px/1 var(--font-mono);cursor:pointer;transition:all var(--dur-fast) var(--ease);min-width:38px;padding:8px 10px}.nudge-btn:hover{background:var(--bg-3);color:var(--fg-0);border-color:#ff6a1a4d}.tempo-slider{appearance:none;background:var(--bg-inset);border:1px solid var(--line-strong);border-radius:var(--radius-full);cursor:ew-resize;outline:none;width:100%;height:6px;margin:0}.tempo-slider::-webkit-slider-thumb{appearance:none;cursor:ew-resize;background:linear-gradient(#f5d878,#b88a30);border:1px solid #5a4010;border-radius:50%;width:18px;height:18px;box-shadow:0 2px 4px #0006}.tempo-slider::-moz-range-thumb{cursor:ew-resize;background:linear-gradient(#f5d878,#b88a30);border:1px solid #5a4010;border-radius:50%;width:18px;height:18px}.metro-play-btn{background:linear-gradient(180deg, var(--ember) 0%, var(--ember-700) 100%);border-radius:var(--radius-lg);color:var(--fg-on-ember);font:700 18px/1 var(--font-display);letter-spacing:-.01em;cursor:pointer;box-shadow:var(--shadow-glow-ember);transition:all var(--dur-fast) var(--ease);border:0;justify-content:center;align-items:center;gap:12px;padding:18px 22px;display:inline-flex}.metro-play-btn:hover{filter:brightness(1.06);box-shadow:0 1px 0 0 #ffffff4d inset, 0 0 0 1px var(--ember-300), 0 8px 16px #ff6a1a80, 0 22px 48px #ff6a1a8c}.metro-play-btn:active{transform:scale(.98)}.metro-play-btn-on{color:var(--amber);box-shadow:var(--shadow-inset), 0 0 0 1px #ff6a1a80, 0 0 20px #ff6a1a26;background:linear-gradient(#3a1a08 0%,#1f0d04 100%)}.metro-play-kbd{font:500 10px/1 var(--font-mono);border-radius:var(--radius-sm);letter-spacing:.08em;text-transform:uppercase;background:#0003;margin-left:auto;padding:4px 6px}.metro-play-btn-on .metro-play-kbd{color:var(--ember-300);background:#ff6a1a26}.control-row{align-items:flex-end;gap:12px;display:flex}.control-block{flex-direction:column;flex:1;gap:8px;display:flex}.bpb-buttons{grid-template-columns:repeat(6,1fr);gap:4px;display:grid}.bpb-btn{background:var(--bg-2);color:var(--fg-1);border:1px solid var(--line);border-radius:var(--radius-sm);font:600 12px/1 var(--font-mono);cursor:pointer;transition:all var(--dur-fast) var(--ease);padding:8px 4px}.bpb-btn:hover{background:var(--bg-3);color:var(--fg-0)}.bpb-btn-on{background:var(--ember-tint);color:var(--ember-200);border-color:#ff6a1a66}.beat-dots{justify-content:center;gap:10px;padding:10px 0;display:flex}.beat-dot{background:var(--bg-3);border:1px solid var(--line-strong);width:14px;height:14px;transition:all 80ms var(--ease);border-radius:50%}.beat-dot-accent{border-color:#ff6a1a80}.beat-dot-on{background:var(--ember);border-color:var(--ember);box-shadow:0 0 12px var(--ember), 0 0 24px var(--ember-glow);transform:scale(1.15)}.beat-dot-accent.beat-dot-on{background:var(--amber);border-color:var(--amber);box-shadow:0 0 14px var(--amber), 0 0 28px #ffb54799;transform:scale(1.25)}.sound-buttons{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.sound-btn{background:var(--bg-2);color:var(--fg-1);border:1px solid var(--line);border-radius:var(--radius-sm);font:500 11px/1 var(--font-sans);cursor:pointer;transition:all var(--dur-fast) var(--ease);padding:8px 4px}.sound-btn:hover{background:var(--bg-3);color:var(--fg-0)}.sound-btn-on{background:var(--ember-tint);color:var(--ember-200);border-color:#ff6a1a66}.tap-tempo-btn{background:var(--bg-2);border:1px solid var(--line-strong);color:var(--fg-1);border-radius:var(--radius-md);font:600 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:all var(--dur-fast) var(--ease);align-self:flex-end;align-items:center;gap:6px;padding:12px 16px;display:inline-flex}.tap-tempo-btn:hover{background:var(--bg-3);color:var(--ember-300);border-color:#ff6a1a4d}.dot-live-off{background:var(--fg-3);box-shadow:none;animation:none}.tuner-start{text-align:center;flex-direction:column;align-items:center;gap:16px;padding:48px 32px;display:flex}.tuner-start-icon{background:var(--bg-inset);border:1px solid var(--line-strong);width:80px;height:80px;color:var(--ember-300);border-radius:50%;place-items:center;display:grid}.tuner-start-title{font:700 24px/1.2 var(--font-display);letter-spacing:-.02em;color:var(--fg-0);margin:0}.tuner-start-sub{color:var(--fg-2);max-width:420px;margin:0;font-size:14px}.tuner-display{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-inset);transition:border-color .2s var(--ease), background .2s var(--ease);grid-template-columns:1fr 1fr;gap:24px;margin-bottom:20px;padding:28px;display:grid}.tuner-display-in{background:#4ed4a60a;border-color:#4ed4a680}.tuner-display-close{border-color:#ffb54766}.tuner-note{align-self:center;align-items:baseline;gap:6px;display:flex}.tuner-note-name{font:700 110px/.85 var(--font-display);letter-spacing:-.04em;font-variation-settings:"wdth" 75;color:var(--fg-0)}.tuner-note-empty{color:var(--fg-3)}.tuner-display-in .tuner-note-name{color:var(--success)}.tuner-display-close .tuner-note-name{color:var(--amber)}.tuner-note-oct{font:600 22px/1 var(--font-mono);color:var(--fg-2)}.tuner-meta{flex-direction:column;align-self:center;gap:10px;display:flex}.tuner-meta-row{flex-direction:column;gap:4px;display:flex}.tuner-meta-k{font:500 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-2)}.tuner-meta-v{font:600 18px/1 var(--font-mono);color:var(--fg-0)}.cents-in{color:var(--success)}.cents-close{color:var(--amber)}.cents-off{color:var(--fg-1)}.tuner-meter{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);height:100px;margin-bottom:18px;padding:18px 16px 32px;position:relative;overflow:hidden}.tuner-meter-scale{justify-content:space-between;height:30px;display:flex;position:relative}.tuner-meter-tick{background:var(--fg-3);width:1px;height:12px;position:relative}.tuner-meter-tick-center{background:var(--ember);width:2px;height:28px;box-shadow:0 0 8px var(--ember)}.tuner-meter-num{font:500 10px/1 var(--font-mono);color:var(--fg-3);font-variant-numeric:tabular-nums;position:absolute;top:18px;left:50%;transform:translate(-50%)}.tuner-meter-zone-center{pointer-events:none;background:#4ed4a61f;border-left:1px dashed #4ed4a640;border-right:1px dashed #4ed4a640;width:6%;height:30px;position:absolute;top:18px;left:47%}.tuner-meter-needle{width:4px;height:56px;transition:left 80ms var(--ease);z-index:3;margin-left:-2px;position:absolute;top:8px}.tuner-meter-needle-bar{background:linear-gradient(180deg, var(--amber), var(--ember));width:100%;height:100%;box-shadow:0 0 14px var(--ember-glow), 0 0 28px var(--ember-glow);border-radius:2px}.tuner-meter-in .tuner-meter-needle-bar{background:var(--success);box-shadow:0 0 14px #4ed4a699}.tuner-meter-close .tuner-meter-needle-bar{background:var(--amber);box-shadow:0 0 14px #ffb54799}.tuner-meter-labels{font:500 11px/1 var(--font-mono);color:var(--fg-3);letter-spacing:.06em;justify-content:space-between;display:flex;position:absolute;bottom:8px;left:16px;right:16px}.strings-row{flex-direction:column;gap:14px;display:flex}.strings-row-label{flex-direction:column;gap:8px;display:flex}.tuning-select{flex-wrap:wrap;gap:6px;display:flex}.strings-list{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}@media (max-width:600px){.strings-list{grid-template-columns:repeat(3,1fr)}}.string-tile{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);transition:all .2s var(--ease);flex-direction:column;align-items:center;gap:4px;padding:12px 8px;display:flex;position:relative}.string-tile-target{background:var(--ember-tint);border-color:#ff6a1a66}.string-tile-tuned{background:#4ed4a61f;border-color:#4ed4a680;box-shadow:0 0 16px #4ed4a633}.string-tile-num{font:500 9px/1 var(--font-mono);letter-spacing:.08em;color:var(--fg-3);text-transform:uppercase}.string-tile-note{font:700 22px/1 var(--font-display);color:var(--fg-0);letter-spacing:-.02em}.string-tile-note sub{font-size:10px;font-weight:500;font-family:var(--font-mono);color:var(--fg-2);margin-left:2px}.string-tile-tuned .string-tile-note{color:var(--success)}.string-tile-freq{color:var(--fg-3);font-size:10px}.string-tile-check{color:var(--success);position:absolute;top:4px;right:4px}.chord-controls{flex-direction:column;gap:18px;margin-bottom:24px;display:flex}.chord-control-block{flex-direction:column;gap:8px;display:flex}.root-grid{grid-template-columns:repeat(12,1fr);gap:4px;display:grid}@media (max-width:600px){.root-grid{grid-template-columns:repeat(6,1fr)}}.root-btn{background:var(--bg-inset);border:1px solid var(--line);color:var(--fg-1);border-radius:var(--radius-md);font:600 14px/1 var(--font-sans);cursor:pointer;transition:all var(--dur-fast) var(--ease);padding:10px 4px}.root-btn:hover{background:var(--bg-2);color:var(--fg-0)}.root-btn-on{background:var(--ember);border-color:var(--ember);color:var(--fg-on-ember);box-shadow:0 0 0 1px var(--ember-300), 0 4px 12px #ff6a1a4d}.root-btn-sharp{color:var(--fg-2);background:#1a0f08}.root-btn-sharp:hover{color:var(--fg-0);background:#2a1408}.root-btn-on.root-btn-sharp{background:var(--ember);color:var(--fg-on-ember)}.type-grid{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}@media (max-width:720px){.type-grid{grid-template-columns:repeat(3,1fr)}}.type-btn{background:var(--bg-inset);border:1px solid var(--line);color:var(--fg-1);border-radius:var(--radius-md);cursor:pointer;transition:all var(--dur-fast) var(--ease);flex-direction:column;align-items:center;gap:4px;padding:10px 6px;display:flex}.type-btn:hover{background:var(--bg-2);color:var(--fg-0)}.type-btn-on{background:var(--ember-tint);color:var(--ember-200);border-color:#ff6a1a66}.type-btn-sym{font:700 14px/1 var(--font-mono);font-feature-settings:"tnum";color:var(--fg-0)}.type-btn-on .type-btn-sym{color:var(--ember-200)}.type-btn-label{font:400 10px/1.2 var(--font-sans);color:var(--fg-3);text-align:center}.chord-result{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px}.chord-result-name{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:20px;display:flex}.chord-symbol{font-family:var(--font-display);letter-spacing:-.04em;font-variation-settings:"wdth" 80;align-items:baseline;gap:2px;font-weight:700;display:flex}.chord-symbol-root{color:var(--fg-0);font-size:56px;line-height:.9}.chord-symbol-suffix{color:var(--ember-300);font-size:28px;font-style:italic;line-height:.9}.chord-desc{color:var(--fg-2);font-size:13px;font-family:var(--font-mono);margin-top:6px}.chord-display-grid{grid-template-columns:1.4fr 1fr;gap:24px;display:grid}@media (max-width:720px){.chord-display-grid{grid-template-columns:1fr}}.chord-display-block{flex-direction:column;gap:10px;display:flex}.piano-wrap{border:1px solid var(--line-strong);border-radius:var(--radius-md);background:linear-gradient(#2a1810,#1a0e08);padding:12px;overflow:hidden}.piano-svg{width:100%;height:auto;display:block}.fretboard-wrap{border:1px solid var(--line-strong);border-radius:var(--radius-md);background:linear-gradient(#3d2818,#1f1208);flex-direction:column;align-items:center;padding:12px;display:flex}.fretboard-svg{width:100%;max-width:220px;height:auto}.fretboard-empty{text-align:center;color:var(--fg-2);flex-direction:column;align-items:center;gap:8px;padding:40px 24px;display:flex}.fretboard-empty p{margin:0;font-size:13px}.chord-intervals{flex-direction:column;gap:10px;margin-top:20px;display:flex}.intervals-row{flex-wrap:wrap;gap:8px;display:flex}.interval-pill{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-full);font:500 14px/1 var(--font-sans);align-items:center;gap:8px;padding:8px 14px;display:flex}.prog-key-row{grid-template-columns:1fr auto;align-items:flex-end;gap:18px;display:grid}@media (max-width:720px){.prog-key-row{grid-template-columns:1fr}}.prog-key-block{flex-direction:column;gap:8px;display:flex}.mode-toggle{border:1px solid var(--line-strong);border-radius:var(--radius-md);background:var(--bg-inset);display:inline-flex;overflow:hidden}.mode-btn{color:var(--fg-1);font:600 13px/1 var(--font-sans);cursor:pointer;transition:all var(--dur-fast) var(--ease);background:0 0;border:0;padding:12px 24px}.mode-btn:hover{background:var(--bg-2);color:var(--fg-0)}.mode-btn-on{background:var(--ember);color:var(--fg-on-ember)}.prog-chord-row{flex-wrap:wrap;gap:8px;margin-bottom:18px;display:flex}.prog-chord{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);min-width:90px;transition:all .1s var(--ease);flex-direction:column;flex:1;align-items:center;gap:4px;padding:18px 14px;display:flex;position:relative}.prog-chord-on{background:var(--ember-tint);border-color:var(--ember);box-shadow:0 0 0 1px var(--ember), 0 8px 24px #ff6a1a4d;transform:translateY(-2px)}.prog-chord-numeral{font:600 14px/1 var(--font-mono);color:var(--fg-2);letter-spacing:.04em}.prog-chord-on .prog-chord-numeral{color:var(--ember-200)}.prog-chord-symbol{font:700 28px/1 var(--font-display);letter-spacing:-.03em;color:var(--fg-0);font-variation-settings:"wdth" 88}.prog-chord-on .prog-chord-symbol{color:var(--amber)}.prog-chord-notes{color:var(--fg-3);margin-top:2px;font-size:11px}.prog-chord-x{background:var(--bg-2);width:20px;height:20px;color:var(--fg-3);cursor:pointer;opacity:0;transition:all var(--dur-fast) var(--ease);border:0;border-radius:50%;place-items:center;display:grid;position:absolute;top:4px;right:4px}.prog-chord:hover .prog-chord-x{opacity:1}.prog-chord-x:hover{background:var(--danger);color:#fff}.prog-transport{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.prog-tempo{align-items:center;gap:10px;display:flex}.palette-grid{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}@media (max-width:600px){.palette-grid{grid-template-columns:repeat(4,1fr)}}.palette-chord{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);color:var(--fg-0);cursor:pointer;transition:all var(--dur-fast) var(--ease);flex-direction:column;align-items:center;gap:4px;padding:14px 8px;display:flex}.palette-chord:hover{background:var(--ember-tint);border-color:#ff6a1a66;transform:translateY(-1px)}.palette-numeral{font:600 12px/1 var(--font-mono);color:var(--fg-2)}.palette-chord:hover .palette-numeral{color:var(--ember-300)}.palette-symbol{font:700 20px/1 var(--font-display);letter-spacing:-.02em;color:var(--fg-0)}.palette-notes{color:var(--fg-3);font-size:10px}.preset-prog-list{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}@media (max-width:600px){.preset-prog-list{grid-template-columns:1fr}}.preset-prog{text-align:left;background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer;transition:all var(--dur-fast) var(--ease);flex-direction:column;gap:4px;padding:14px 16px;display:flex}.preset-prog:hover{background:var(--bg-2);border-color:var(--line-strong)}.preset-prog-on{background:var(--ember-tint);border-color:#ff6a1a66}.preset-prog-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.preset-prog-name{font:600 14px/1 var(--font-sans);color:var(--fg-0);letter-spacing:-.01em}.preset-prog-desc{font:500 12px/1 var(--font-mono);color:var(--ember-300)}.preset-prog-famous{font:400 12px/1.4 var(--font-sans);color:var(--fg-2)}.lufs-headline{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);flex-direction:column;gap:16px;margin-bottom:18px;padding:28px;display:flex}.lufs-headline-file{color:var(--fg-2);align-items:center;gap:8px;display:flex}.lufs-headline-file .mono{font-size:13px}.lufs-headline-num{align-items:flex-end;gap:16px;display:flex}.lufs-big{font:700 88px/.85 var(--font-display);letter-spacing:-.05em;font-variation-settings:"wdth" 78;background:linear-gradient(105deg, var(--ember-300), var(--ember), var(--amber));-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.lufs-big-side{flex-direction:column;gap:4px;padding-bottom:8px;display:flex}.lufs-meters{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:24px;display:grid}@media (max-width:720px){.lufs-meters{grid-template-columns:repeat(2,1fr)}}.lufs-meter-card{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);flex-direction:column;gap:6px;padding:16px;display:flex}.lufs-curve{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px}.lufs-curve-svg{width:100%;height:auto}.platform-list{flex-direction:column;gap:6px;display:flex}.platform-row{background:var(--bg-inset);border:1px solid var(--line);border-radius:var(--radius-md);transition:border-color var(--dur-fast) var(--ease);grid-template-columns:12px 110px 76px 1fr 70px 130px;align-items:center;gap:14px;padding:12px 16px;display:grid}@media (max-width:720px){.platform-row{grid-template-columns:12px 1fr auto;gap:10px}.platform-row>.platform-target,.platform-row>.platform-bar,.platform-row>.platform-diff{grid-column:1/-1}.platform-row>.platform-status{display:none}}.platform-row-loud{border-color:#ff546866}.platform-row-quiet{border-color:#ffb5474d}.platform-row-ok{border-color:#4ed4a666}.platform-dot{border-radius:50%;width:12px;height:12px}.platform-name{font:500 14px/1 var(--font-sans);color:var(--fg-0);letter-spacing:-.01em}.platform-target{font:500 12px/1 var(--font-mono);color:var(--fg-2)}.platform-bar{background:var(--bg-2);border-radius:var(--radius-full);height:6px;position:relative;overflow:visible}.platform-bar-mid{background:var(--ember);border-radius:1px;width:2px;margin-left:-1px;position:absolute;top:-4px;bottom:-4px;left:50%}.platform-bar-mark{background:var(--fg-0);border:2px solid var(--bg-inset);border-radius:50%;width:12px;height:12px;margin-left:-6px;position:absolute;top:-3px}.platform-row-loud .platform-bar-mark{background:var(--danger)}.platform-row-quiet .platform-bar-mark{background:var(--amber)}.platform-row-ok .platform-bar-mark{background:var(--success)}.platform-diff{font:600 13px/1 var(--font-mono);text-align:right}.platform-diff-loud{color:var(--danger)}.platform-diff-quiet{color:var(--amber)}.platform-diff-ok{color:var(--success)}.platform-status{font:500 11px/1 var(--font-sans);color:var(--fg-2);text-align:right}.platform-status-loud{color:var(--danger)}.platform-status-quiet{color:var(--amber)}.platform-status-ok{color:var(--success)}