.tools-page{min-height:100vh}.tools-header{padding:4rem 2rem 3rem;text-align:center;border-bottom:1px solid rgba(0,255,120,.1);background:rgba(0,0,0,.3)}.tools-header__inner{max-width:700px;margin:0 auto}.tools-header__label{font-family:monospace;font-size:.7rem;font-weight:700;letter-spacing:.3em;color:rgba(0,255,120,.6);margin-bottom:.5rem}.tools-header__title{font-family:Rajdhani,sans-serif;font-size:clamp(2.5rem,6vw,5rem);font-weight:700;letter-spacing:.1em;margin-bottom:1rem;line-height:1;color:white}.tools-header__sub{font-family:monospace;font-size:.85rem;color:rgba(255,255,255,.35);letter-spacing:.05em}.tools-content{padding:2rem}.tools-content__inner{max-width:900px;margin:0 auto;display:grid;grid-template-columns:200px 1fr;grid-gap:2rem;gap:2rem;align-items:start}.tool-tabs{display:flex;flex-direction:column;gap:.25rem;position:sticky;top:80px}.tool-tab{display:flex;align-items:center;gap:.75rem;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.4);font-family:monospace;font-size:.7rem;font-weight:700;letter-spacing:.1em;padding:.75rem 1rem;border-radius:3px;cursor:pointer;text-align:left;transition:all .2s}.tool-tab:hover{border-color:rgba(0,255,120,.2);color:rgba(255,255,255,.7)}.tool-tab--active{background:rgba(0,255,120,.06);border-color:rgba(0,255,120,.3);color:rgba(0,255,120,.85)}.tool-tab__icon{font-size:1rem;line-height:1}.tool-area{background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.06);border-radius:4px;overflow:hidden}.tool-area__header{padding:1rem 1.5rem;border-bottom:1px solid rgba(0,255,120,.1);background:rgba(0,255,120,.03)}.tool-area__title{font-family:monospace;font-size:.8rem;font-weight:700;letter-spacing:.2em;color:rgba(0,255,120,.7)}.tool-area__desc{font-family:monospace;font-size:.65rem;color:rgba(255,255,255,.25);letter-spacing:.05em;margin-top:.2rem}.tool-panel{padding:1.5rem}.tool-canvas{width:100%;height:auto;display:block;border-radius:3px;background:#000;border:1px solid rgba(0,255,120,.1);margin-bottom:1rem}.tool-controls{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.btn-start{background:rgba(0,255,120,.1);border:1px solid rgba(0,255,120,.4);color:rgba(0,255,120,.9);font-family:monospace;font-size:.75rem;font-weight:700;letter-spacing:.15em;padding:.6rem 1.2rem;border-radius:3px;cursor:pointer;transition:all .2s}.btn-start:hover{background:rgba(0,255,120,.2)}.btn-stop{background:rgba(255,60,60,.1);border:1px solid rgba(255,60,60,.4);color:rgba(255,100,100,.9);font-family:monospace;font-size:.75rem;font-weight:700;letter-spacing:.15em;padding:.6rem 1.2rem;border-radius:3px;cursor:pointer;transition:all .2s}.btn-stop:hover{background:rgba(255,60,60,.2)}.btn-action{background:rgba(150,100,255,.1);border:1px solid rgba(150,100,255,.4);color:rgba(180,140,255,.9);font-family:monospace;font-size:.75rem;font-weight:700;letter-spacing:.15em;padding:.6rem 1.2rem;border-radius:3px;cursor:pointer;transition:all .2s}.btn-action:hover{background:rgba(150,100,255,.2)}.btn-action:disabled{opacity:.5;cursor:default}.btn-small{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.4);font-family:monospace;font-size:.7rem;font-weight:700;letter-spacing:.1em;padding:.4rem .8rem;border-radius:3px;cursor:pointer}.btn-small:hover{color:white;border-color:rgba(255,255,255,.25)}.active-dot{font-family:monospace;font-size:.7rem;color:rgba(255,60,60,.8);letter-spacing:.1em;animation:blink 1s step-end infinite}.bpm-tool{display:flex;flex-direction:column;align-items:center;gap:2rem;padding:1.5rem}.bpm-display{text-align:center}.bpm-display__value{font-family:monospace;font-size:5rem;font-weight:700;letter-spacing:-.02em;line-height:1;color:rgba(255,255,255,.15);transition:all .2s}.bpm-display__value--active{color:rgba(0,255,120,.9);text-shadow:0 0 30px rgba(0,255,80,.4)}.bpm-display__label{font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.3);letter-spacing:.3em;margin-top:.25rem}.bpm-tap{width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,.04);border:3px solid rgba(255,255,255,.12);color:white;font-family:Rajdhani,monospace;font-size:.9rem;font-weight:700;letter-spacing:.15em;cursor:pointer;transition:all .05s}.bpm-tap--flash{background:oklch(40% .28 295);border-color:oklch(65% .28 295);box-shadow:0 0 40px oklch(50% .28 295/.5)}.bpm-row{display:flex;gap:1rem;align-items:center}.bpm-row__count{font-family:monospace;font-size:.75rem;color:rgba(255,255,255,.3)}.bpm-grid{display:flex;gap:6px;align-items:center}.bpm-grid__tick{width:10px;height:12px;background:rgba(255,255,255,.12);border-radius:2px}.bpm-grid__tick--major{height:24px;background:oklch(60% .28 295/.8)}.tuner-tool{display:flex;flex-direction:column;align-items:center;gap:2rem;padding:2rem}.tuner-note{font-family:monospace;font-size:5rem;font-weight:700;letter-spacing:-.02em;line-height:1;color:rgba(255,255,255,.1);transition:all .15s;text-align:center}.tuner-note--in{color:rgba(0,255,120,.95);text-shadow:0 0 30px rgba(0,255,80,.5)}.tuner-note--off{color:rgba(255,220,0,.9);text-shadow:0 0 30px rgba(255,200,0,.4)}.tuner-status{font-family:monospace;font-size:.85rem;margin-top:.25rem;text-align:center}.tuner-status--in{color:rgba(0,255,120,.7)}.tuner-status--off{color:rgba(255,220,0,.7)}.tuner-meter{width:280px;position:relative}.tuner-meter__bar{height:6px;background:rgba(255,255,255,.06);border-radius:3px;position:relative;overflow:hidden}.tuner-meter__needle{position:absolute;top:0;width:4px;height:100%;transform:translateX(-50%);border-radius:2px;transition:left .1s,background .2s}.tuner-meter__center{position:absolute;left:50%;top:-3px;width:1px;height:12px;background:rgba(255,255,255,.3)}.tuner-meter__labels{display:flex;justify-content:space-between;margin-top:6px;font-family:monospace;font-size:.65rem}.tuner-meter__label{color:rgba(255,255,255,.25)}.tuner-meter__label--center{color:rgba(255,255,255,.4)}.tuner-ring{gap:.5rem;flex-wrap:wrap;max-width:300px}.tuner-ring,.tuner-ring__note{display:flex;justify-content:center}.tuner-ring__note{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);align-items:center;font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.5);transition:all .1s}.tuner-ring__note--in{background:rgba(0,255,120,.2);border-color:rgba(0,255,120,.6);color:rgba(0,255,120,.9)}.tuner-ring__note--off{background:rgba(255,220,0,.2);border-color:rgba(255,220,0,.6);color:rgba(255,220,0,.9)}.synth-row{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap;align-items:center}.synth-row__label{font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.3);letter-spacing:.2em}.synth-preset-btn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.5);font-family:monospace;font-size:.75rem;font-weight:700;letter-spacing:.12em;padding:.4rem .8rem;border-radius:2px;cursor:pointer}.synth-preset-btn--active{background:oklch(40% .28 295);border-color:oklch(65% .28 295);color:white}.synth-octave-btn{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.35);font-family:monospace;font-size:.7rem;padding:.4rem .6rem;border-radius:2px;cursor:pointer}.synth-octave-btn--active{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);color:white}.synth-keyboard{position:relative;height:120px;-webkit-user-select:none;user-select:none;margin-bottom:1rem}.synth-keyboard__whites{display:flex;height:100%;gap:2px}.synth-key-white{flex:1 1;height:100%;cursor:pointer;background:rgba(255,255,255,.9);border-radius:0 0 4px 4px;border:1px solid rgba(0,0,0,.2);position:relative;transition:background .05s,box-shadow .05s;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px}.synth-key-white--pressed{background:oklch(75% .28 295);box-shadow:0 0 20px oklch(60% .28 295/.5)}.synth-key-white__label{font-family:monospace;font-size:.55rem;color:rgba(0,0,0,.3)}.synth-key-white--pressed .synth-key-white__label{color:white}.synth-key-black{position:absolute;top:0;width:6%;height:62%;background:#111;border-radius:0 0 3px 3px;border:1px solid rgba(255,255,255,.1);cursor:pointer;z-index:2;box-shadow:0 4px 8px rgba(0,0,0,.5);transition:all .05s}.synth-key-black--pressed{background:oklch(40% .28 295);border-color:oklch(65% .28 295);box-shadow:0 0 15px oklch(50% .28 295/.6)}.synth-hint{font-family:monospace;font-size:.65rem;color:rgba(255,255,255,.2);text-align:center;letter-spacing:.1em}.midi-tool{padding:1rem;display:flex;flex-direction:column;gap:1.5rem}.midi-intro{font-family:monospace;font-size:.75rem;color:rgba(255,255,255,.4);line-height:1.6}.midi-wave-wrap{position:relative;border-radius:4px;overflow:hidden;border:1px solid rgba(255,255,255,.06);background:#000}.midi-wave-wrap canvas{width:100%;height:auto;display:block}.midi-wave-overlay{inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.6);color:rgba(255,255,255,.2);letter-spacing:.2em}.midi-detect,.midi-wave-overlay{position:absolute;font-family:monospace;font-size:.65rem}.midi-detect{top:8px;left:12px;color:rgba(255,255,255,.3);letter-spacing:.15em}.midi-detect__note{color:oklch(70% .28 295);font-weight:700}.midi-rec-badge{position:absolute;top:8px;right:12px;display:flex;align-items:center;gap:6px}.midi-rec-badge__dot{width:6px;height:6px;border-radius:50%;background:rgba(255,60,60,.9);animation:blink 1s step-end infinite}.midi-rec-badge__label{font-family:monospace;font-size:.6rem;color:rgba(255,100,100,.8);letter-spacing:.15em}.midi-controls{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}.midi-timeline{min-height:80px;background:rgba(0,0,0,.4);border-radius:4px;border:1px solid rgba(255,255,255,.05);padding:1rem;position:relative;overflow:hidden}.midi-timeline__empty{font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.15)}.midi-timeline__notes{display:flex;flex-wrap:wrap;gap:.4rem}.midi-note-chip{background:oklch(40% .28 295/.3);border:1px solid oklch(60% .28 295/.5);border-radius:3px;padding:3px 8px;font-family:monospace;font-size:.7rem;color:oklch(75% .28 295);min-width:36px;text-align:center}.midi-summary{font-family:monospace;font-size:.65rem;color:rgba(255,255,255,.25)}.rec-intro{font-family:monospace;font-size:.75rem;color:rgba(255,255,255,.4);line-height:1.6;margin-bottom:1.25rem}.rec-wave-wrap{position:relative;border-radius:4px;overflow:hidden;border:1px solid rgba(0,255,120,.12);background:#000;margin-bottom:1.25rem}.rec-wave{width:100%;height:auto;display:block}.rec-wave-overlay{inset:0;justify-content:center;background:rgba(0,0,0,.6);font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.25);letter-spacing:.25em}.rec-wave-badge,.rec-wave-overlay{position:absolute;display:flex;align-items:center}.rec-wave-badge{top:10px;right:14px;gap:6px}.rec-wave-badge__dot{width:6px;height:6px;border-radius:50%;background:rgba(255,60,60,.9);animation:blink 1s step-end infinite}.rec-wave-badge__label{font-family:monospace;font-size:.6rem;color:rgba(255,100,100,.85);letter-spacing:.2em}.rec-status{display:grid;grid-template-columns:auto 1fr;grid-gap:1.5rem;gap:1.5rem;align-items:center;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.05);border-radius:4px;padding:1rem 1.25rem;margin-bottom:1.25rem}.rec-time{display:flex;flex-direction:column;gap:.2rem}.rec-time__value{font-family:monospace;font-size:2.4rem;font-weight:700;letter-spacing:.04em;line-height:1;color:rgba(0,255,120,.85);text-shadow:0 0 18px rgba(0,255,80,.25)}.rec-time__label{font-family:monospace;font-size:.6rem;letter-spacing:.3em;color:rgba(255,255,255,.3)}.rec-meta{display:flex;flex-direction:column;gap:.35rem}.rec-meta__row{display:flex;justify-content:space-between;gap:1rem;font-family:monospace;font-size:.7rem}.rec-meta__k{color:rgba(255,255,255,.35);letter-spacing:.2em}.rec-meta__v{color:rgba(255,255,255,.75)}.rec-controls{margin-bottom:1rem}.rec-encoding{font-family:monospace;font-size:.7rem;letter-spacing:.2em;color:rgba(0,255,120,.65);animation:blink 1s step-end infinite}.rec-player{width:100%;margin-top:.5rem;filter:invert(.85) hue-rotate(180deg);border-radius:3px}.sun-wrap{position:relative;width:100%;aspect-ratio:16/10;background:radial-gradient(ellipse at center,rgba(20,0,40,.4) 0,#04000c 80%);border:1px solid rgba(255,255,255,.06);border-radius:4px;overflow:hidden}.sun-wrap--fs{aspect-ratio:auto;width:100vw;height:100vh;border-radius:0;border:none}.sun-canvas{display:block;width:100%;height:100%}.sun-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:rgba(4,0,12,.55)}.sun-hint{font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.4);letter-spacing:.12em;max-width:380px;text-align:center;line-height:1.6}.sun-fs-btn{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.75);font-family:monospace;font-size:.65rem;font-weight:700;letter-spacing:.2em;padding:.5rem .9rem;border-radius:3px;cursor:pointer;transition:all .15s}.sun-fs-btn:hover{background:rgba(0,0,0,.75);border-color:oklch(60% .28 295/.5);color:white}.sun-live{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:6px;font-family:monospace;font-size:.65rem;letter-spacing:.2em;color:rgba(0,255,120,.75)}.sun-live__dot{width:7px;height:7px;border-radius:50%;background:rgba(0,255,120,.85);box-shadow:0 0 10px rgba(0,255,120,.6);animation:blink 1.4s step-end infinite}@media (max-width:800px){.tools-content{padding:1rem}.tools-content__inner{grid-template-columns:1fr;gap:1rem}.tool-tabs{position:static;flex-direction:row;flex-wrap:wrap}.tools-header{padding:3rem 1rem 2rem}.rec-status{grid-template-columns:1fr}}