@font-face{font-family:Seed;src:local('Helvetica Neue');font-weight:400}*{box-sizing:border-box}html{color-scheme:dark;background:#0b100e}body{margin:0;color:#c3cec4;font-family:Seed,'Helvetica Neue',Arial,sans-serif;font-size:13px;font-weight:400;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,select,input{color:inherit}button,a,select,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none}button:disabled{opacity:.4;cursor:wait}button svg,svg.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}a{color:inherit;text-decoration:none}button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:1px solid #c3dac0;outline-offset:5px}button:hover{color:#eef4e9}select{background:transparent;border:0;padding:3px 21px 3px 0;cursor:pointer;max-width:100%;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='%237e8d81'/%3E%3C/svg%3E");background-position:right 3px center;background-repeat:no-repeat}select option{background:#151d18}input[type=range]{accent-color:#aebfa4;height:2px;cursor:pointer}input[type=checkbox]{accent-color:#bacdb2}h2,p{font-weight:400}h2{font-family:Georgia,serif;font-size:30px;letter-spacing:-1px;margin:7px 0 0}.app{max-width:1420px;margin:auto;padding:0 58px}header{height:112px;display:flex;align-items:center;justify-content:space-between;gap:18px}.identity{display:flex;align-items:center;gap:26px}.wordmark{font-family:Georgia,'Times New Roman',serif;font-size:48px;letter-spacing:-4px;color:#d4dfcc;line-height:1}.seed-mark{display:inline-block;font-family:Georgia,serif;font-size:29px;vertical-align:top;margin:2px 0 0 6px;letter-spacing:0;color:#a7c4a1}.tagline{font-size:11px;color:#77867a;letter-spacing:.3px;padding-top:7px}.header-tools,.footer-group{display:flex;align-items:center;gap:20px}.audio-state{font-size:10px;letter-spacing:.5px;color:#7d8d7e;display:flex;gap:8px;align-items:center}.audio-state i{width:4px;height:4px;border-radius:50%;background:#73816f}.audio-state.active i{background:#cce1a7;box-shadow:0 0 8px #cce1a744}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:32px;color:#89998b;font-size:19px;padding:4px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;z-index:2}.eyebrow{font-size:8px;letter-spacing:1.65px;color:#7b897c}.sound-preset{display:grid;grid-template-columns:auto 30px;column-gap:8px;row-gap:4px}.sound-preset>.eyebrow{grid-column:1/3}.sound-preset select{font-family:Georgia,serif;font-size:22px;letter-spacing:-.4px;min-width:165px}.sound-preset .icon-button{align-self:center}.melody-controls{display:flex;gap:32px}.melody-controls label,.import-controls label{display:flex;flex-direction:column;gap:8px;font-size:8px;letter-spacing:1.3px;color:#7b897c}.melody-controls label select{font-size:11px;letter-spacing:0;color:#b7c3b7}.tempo>span{display:flex;align-items:center;gap:5px;height:21px}.tempo input{width:32px;border:0;background:none;color:#b7c3b7;font-size:11px;padding:0;-moz-appearance:textfield}.tempo input::-webkit-inner-spin-button{appearance:none}.tempo small{letter-spacing:0;font-size:9px;color:#6a7b6d}.field{height:clamp(285px,35vh,420px);min-height:285px;position:relative;margin:10px -6px 0;isolation:isolate;outline-offset:-3px!important;touch-action:none;cursor:crosshair;overflow:hidden}.field canvas{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:-1}.field-caption{position:absolute;top:28px;left:6px;pointer-events:none}.field-caption .eyebrow{font-size:8px;color:#526558}.field-caption p{font-family:Georgia,serif;font-size:20px;line-height:1.28;letter-spacing:-.4px;color:#8b9f8a;margin:12px 0;transition:opacity 1.5s}.playing .field-caption p{opacity:.2}.field-status{position:absolute;right:6px;top:30px;text-align:right;display:flex;flex-direction:column;gap:6px;pointer-events:none}#note-readout{font-size:10px;color:#96aa95}#sample-readout{font-size:9px;color:#506554}.transport{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:10px;cursor:default}.grow-button{background:#c3d3b6;color:#1d2c20;border-radius:30px;padding:11px 22px 11px 16px;display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:12px;min-width:140px;justify-content:center;box-shadow:0 0 24px #b3d19d09;transition:background .25s,box-shadow .25s}.grow-button svg{width:16px;height:16px;fill:currentColor;stroke:none}.grow-button:hover{background:#d6e5c8;color:#16231a;box-shadow:0 0 30px #b3d19d15}.playing .grow-button{background:#202e24;color:#c1d3b5}.transport-hint{font-size:9px;color:#627566;letter-spacing:.2px;white-space:nowrap}.field-bottom{position:absolute;bottom:9px;left:6px;right:6px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.field-bottom>*{pointer-events:auto}.sequence-indicator{display:flex;gap:5px;height:10px;align-items:center}.sequence-indicator i{width:3px;height:3px;border-radius:50%;background:#27372c;transition:background .1s,box-shadow .1s}.sequence-indicator i.has-note{background:#425745}.sequence-indicator i.active{background:#c4dfa9;box-shadow:0 0 7px #afcf8d88}.quiet-button{display:inline-flex;align-items:center;gap:6px;color:#6d8072;font-size:10px;padding:7px 0}.quiet-button svg{height:14px;width:14px}.macros{display:flex;justify-content:center;gap:clamp(30px,6.2vw,95px);padding:12px 10px 27px}.macro{display:flex;align-items:center;flex-direction:column;width:80px;flex-shrink:0}.knob{position:relative;width:65px;height:65px;border-radius:50%;touch-action:none;cursor:ns-resize;background:conic-gradient(from 225deg,#91a98b 0deg,var(--arc) ,#27392d var(--arc),#27392d 270deg,transparent 270deg);padding:2px;--arc:135deg;isolation:isolate}.knob::before{content:'';position:absolute;inset:4px;border-radius:50%;background:radial-gradient(ellipse at 36% 25%,#1e2a21,#111a15 65%,#0d1510);box-shadow:inset 0 1px 1px #73927322,0 3px 6px #0007}.knob::after{content:'';position:absolute;inset:0;border-radius:50%;background:#0b100e;z-index:-1}.knob-marker{position:absolute;inset:10px;transform:rotate(var(--rotation));border-radius:50%;pointer-events:none}.knob-marker::after{content:'';position:absolute;left:calc(50% - 1px);top:2px;height:9px;width:2px;background:#b4c8aa;border-radius:2px}.macro-name{font-size:11px;color:#a6b8a6;margin-top:9px;letter-spacing:.2px}.macro-value{font-family:monospace;font-size:9px;color:#5f7766;margin-top:6px;font-variant-numeric:tabular-nums;min-height:11px}.macro:hover .macro-value,.macro:focus-within .macro-value{color:#b4c7ae}.macro-desc{display:none}.keyboard-area{max-width:970px;margin:auto;padding:0 0 19px}.keyboard-meta{display:flex;justify-content:space-between;align-items:center;font-size:7px;letter-spacing:1.1px;color:#607465;margin-bottom:10px}.keyboard-hint{color:#405648;margin-left:8px;letter-spacing:1.6px}.octave{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:0;color:#7b8e7c}.octave button{font-size:14px;color:#819681;padding:0 5px;line-height:15px;min-width:24px}.piano{position:relative;display:flex;height:85px;gap:3px;touch-action:none;user-select:none}.key{border-radius:0 0 3px 3px;position:relative;flex:1;display:flex;align-items:flex-end;justify-content:center;padding:0 0 9px;font-size:8px;transition:background .08s,color .08s;color:#5e7863;touch-action:none;cursor:pointer;background:linear-gradient(#1c2a21,#26382b);border-top:1px solid #26372b;box-shadow:0 2px 3px #0004;min-width:0}.key.black{position:absolute;top:0;z-index:2;height:58%;width:4.6%;background:linear-gradient(#0b100e,#111b14);border:1px solid #0b100e;border-radius:0 0 2px 2px;color:#415445;padding-bottom:5px;box-shadow:0 3px 3px #0005}.key.playing,.key:active{background:linear-gradient(#7b9970,#b0c799);color:#1b351e;box-shadow:0 3px 22px #a8d08215}.key.black.playing{background:linear-gradient(#506c46,#7e9c69);color:#d0e1bd}.key:hover{filter:brightness(1.2)}.instrument-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:58px;max-width:970px;margin:auto}.footer-group{gap:23px}.tool-button{display:inline-flex;align-items:center;gap:8px;font-size:10px;color:#859989;padding:9px 0;white-space:nowrap}.tool-button svg{width:16px;height:16px}.count{font-family:monospace;font-size:8px;color:#627869}.record-dot{width:7px;height:7px;border:1px solid #8c9d8c;border-radius:50%}.recording .record-dot{background:#dc987e;border:0;border-radius:1px;box-shadow:0 0 10px #dc987e33}.recording #record-label{color:#dcad96}.output{gap:13px}.output svg{width:14px;height:14px;fill:none;stroke:#68816c;stroke-width:1.3}.output input{width:76px}.level-meter{width:22px;height:11px;background:#14241a;overflow:hidden;display:flex;align-items:flex-end;transform:rotate(-90deg)}.level-meter i{height:2px;background:#a3bd91;width:0;transition:width .06s}.page-foot{display:flex;justify-content:space-between;font-size:9px;color:#475c4e;padding:25px 0 22px;letter-spacing:.2px}.controls[hidden]{display:none}.app.controls-hidden .field{height:calc(100vh - 310px);min-height:380px}.app.controls-hidden #hide-controls svg{transform:rotate(180deg)}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#233127;border:1px solid #3c4d3e;border-radius:9px;padding:12px 20px;color:#d0dcc7;font-size:12px;max-width:calc(100vw - 32px);width:max-content;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;z-index:10;line-height:1.5}#toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #2d4032;border-radius:18px;padding:32px;background:#101913;color:#becdbb;max-width:min(610px,calc(100vw - 32px));width:610px;max-height:85vh;box-shadow:0 25px 100px #0009;overflow:auto}dialog::backdrop{background:#020704bb;backdrop-filter:blur(9px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.close-dialog{font-size:26px;font-weight:200;margin-top:-6px;flex-shrink:0}.dialog-copy{font-size:12px;color:#7e9583;line-height:1.8;margin:18px 0 22px}.small-copy{font-size:10px;line-height:1.8;color:#6c8573;margin:20px 0 0}.sample-list{max-height:240px;overflow:auto;margin:0 0 22px;scrollbar-width:thin}.sample-row{display:grid;grid-template-columns:24px 1fr auto 60px 24px;align-items:center;gap:10px;padding:10px 0;font-size:11px}.sample-row svg{height:15px;width:15px;fill:none;stroke:currentColor}.sample-row .sample-kind{font-size:8px;color:#6e8774}.sample-row .sample-root{font-size:10px;color:#7f9784}.sample-row .sample-remove{color:#68806f;font-size:16px}.sample-row .sample-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-controls{display:flex;align-items:flex-end;gap:25px;flex-wrap:wrap}.import-controls select{font-size:11px;color:#b7c8b4;letter-spacing:0}.primary-button{background:#b9cca9;color:#1e3020;border-radius:22px;padding:11px 18px;font-size:11px;margin-left:auto}.primary-button:hover{background:#d0e1bf;color:#1e3020}.check-label{display:flex;align-items:center;gap:8px;font-size:11px;color:#8ca48f;margin-top:25px}.check-label input{margin:0}.danger{color:#8d9e8a;margin-top:15px}dialog.dragover{border-color:#c4dba8;box-shadow:0 0 100px #71866a33}.empty-samples{padding:25px 0;font-size:12px;color:#819885}#envelope-graph{width:100%;height:120px;margin:25px 0 10px;overflow:visible}#envelope-line{fill:none;stroke:#a6bf98;stroke-width:1.5}#envelope-fill{fill:#86a7780c}.envelope-floor{stroke:#283d2d;stroke-width:1}.envelope-controls{display:flex;justify-content:space-between;padding-top:8px}.envelope-controls .knob{width:56px;height:56px}.guide p{font-size:12px;color:#8aa08f;line-height:1.8;margin:22px 0}.guide strong{font-weight:400;color:#c2d1ba}.shortcut-row{display:flex;align-items:center;gap:9px;color:#7e9685;font-size:10px;flex-wrap:wrap}kbd{font-family:monospace;font-size:9px;background:#1a2b1e;padding:5px 8px;border-radius:3px;color:#b5c5ac}[hidden]{display:none!important}
@media(min-height:900px) and (min-width:800px){header{height:130px}.field{height:39vh}.macros{padding-bottom:35px;padding-top:18px}.piano{height:95px}.page-foot{padding-top:35px}}
@media(min-width:1600px){.field{height:43vh}}
@media(max-width:900px){.app{padding:0 30px}.tagline{display:none}.macros{gap:6vw}.header-tools{gap:14px}.melody-controls{gap:20px}.field{height:34vh}.instrument-footer{gap:12px}.footer-group{gap:18px}.output input{width:55px}}
@media(max-width:600px){.app{padding:0 20px}header{height:86px}.wordmark{font-size:39px}.seed-mark{font-size:24px}.audio-state{font-size:8px}.header-tools{gap:9px}.icon-button{width:27px}.topbar{align-items:flex-start;flex-direction:column;gap:22px}.sound-preset{grid-template-columns:auto 30px;width:100%;position:relative}.sound-preset select{width:190px;font-size:23px}.sound-preset .icon-button{position:absolute;right:0;bottom:0}.melody-controls{width:100%;justify-content:space-between;gap:10px}.melody-controls label{font-size:7px;gap:5px}.melody-controls label select{font-size:10px}.field{height:clamp(255px,34vh,340px);margin-top:10px;min-height:255px}.field-caption{top:24px}.field-caption p{font-size:15px}.field-status{top:25px;max-width:40%}#note-readout{font-size:8px}#sample-readout{font-size:8px;line-height:1.4}.transport{bottom:32px}.transport-hint{font-size:8px}.grow-button{font-size:11px;padding:10px 17px 10px 13px;min-width:130px}.sequence-indicator{gap:3px}.sequence-indicator i{width:2px;height:2px}.macros{padding:16px 0 25px;gap:0;justify-content:space-between}.macro{width:52px}.knob{width:49px;height:49px}.knob-marker{inset:8px}.knob-marker::after{height:7px;width:1px}.macro-name{font-size:9px;margin-top:9px}.macro-value{font-size:8px;margin-top:5px}.keyboard-meta{font-size:6px;letter-spacing:.8px}.keyboard-hint{display:none}.piano{height:77px;gap:2px}.key{font-size:6px}.key.black{width:4.8%;border-width:.5px}.octave{font-size:8px;gap:6px}.instrument-footer{display:grid;grid-template-columns:1fr auto;gap:8px}.instrument-footer .footer-group{gap:19px}.recording-tools{justify-content:flex-end}.output{grid-column:1/3;justify-content:center;padding-top:10px}.output input{width:90px}.tool-button{font-size:9px;gap:6px}.tool-button svg{width:14px;height:14px}.page-foot{font-size:8px;padding-top:25px}.page-foot span:last-child{font-size:7px}.app.controls-hidden .field{height:calc(100vh - 370px);min-height:310px}dialog{padding:24px}h2{font-size:25px}.import-controls{gap:16px}.primary-button{padding:10px 13px;font-size:10px}.sample-row{grid-template-columns:20px 1fr 37px 44px 20px;gap:5px;font-size:10px}.sample-row .sample-root{width:44px;padding-right:12px;font-size:9px}.envelope-controls .macro{width:55px}.envelope-controls .knob{width:49px;height:49px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
/* A quiet instrument: the light takes the space, details live on demand. */
.sr-only,#grow-label,#audio-state,.tool-button>span:not(.record-dot):not(.count){position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;padding:0!important;border:0!important}
.app{max-width:1500px;padding:0 50px}header{height:91px}.wordmark{font-size:46px}.header-tools{gap:17px}.audio-state{gap:0;padding-right:4px}.audio-state i{width:3px;height:3px}.topbar{height:36px;align-items:center;flex-direction:row;gap:12px}.sound-preset{display:flex;align-items:center;gap:13px;width:auto}.sound-preset select{font-size:18px;min-width:143px}.sound-preset .icon-button{position:static}.melody-controls{position:absolute;right:0;top:44px;padding:20px 24px;background:#132019f5;border:1px solid #2c4032;border-radius:12px;box-shadow:0 12px 50px #0007;z-index:6;gap:24px}.field{height:clamp(340px,49vh,640px);min-height:340px;margin-top:0;overflow:hidden}.transport{bottom:16px;gap:0}.grow-button{width:49px;height:49px;min-width:49px;border-radius:50%;padding:0;background:#bdceac;color:#1b2d1d;box-shadow:0 0 25px #d6eac015}.grow-button svg{height:17px;width:17px}.playing .grow-button{background:#1b2b21cc;border:1px solid #52674977;color:#c6d6ba;backdrop-filter:blur(12px)}.field-bottom{bottom:21px}.sequence-indicator{opacity:.65}.quiet-button{height:28px;width:28px;justify-content:center}.macros{padding:15px 0 15px;gap:clamp(35px,6vw,100px)}.knob{width:57px;height:57px}.macro-name{margin-top:10px;font-size:10px;color:#8fa58f}.macro-value{opacity:0;transition:opacity .2s;color:#8ca687;margin-top:5px}.macro:hover .macro-value,.macro:focus-within .macro-value{opacity:1}.keyboard-area{padding-bottom:8px;max-width:1000px}.keyboard-meta{margin-bottom:7px;height:15px}.piano{height:72px}.instrument-footer{min-height:54px;max-width:1000px}.tool-button{width:29px;height:32px;padding:6px;position:relative;justify-content:center}.tool-button svg{width:18px;height:18px}.tool-button .count{font-size:7px;position:absolute;right:-4px;top:1px;color:#647e69}.footer-group{gap:17px}.recording-tools{position:absolute;left:50%;transform:translateX(-50%)}.instrument-footer{position:relative}.record-dot{width:8px;height:8px}.recording .record-dot{background:#d79877}.output{gap:10px}.output .icon-button{width:26px}.output .icon-button svg{width:16px;height:16px}.output .icon-button[aria-pressed=true]{opacity:.45}.output .icon-button[aria-pressed=true]::after{content:'';width:16px;height:1px;background:#a3b7a2;position:absolute;transform:rotate(-45deg)}.output input{width:64px}.level-meter{width:16px}.app.controls-hidden .field{height:calc(100vh - 200px);min-height:400px}.app.controls-hidden .instrument-footer{margin-top:12px}.dialog-head h2{margin:0}.import-controls .primary-button{width:auto}.danger{width:auto}.sample-list{margin-top:6px}.recording-tools #record-button.recording::after{content:attr(data-time);position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);font-family:monospace;font-size:8px;color:#b89178}
@media(max-width:900px){.app{padding:0 30px}.field{height:45vh}.macros{gap:6vw}.recording-tools{gap:10px}.melody-controls{gap:18px}}
@media(max-width:600px){.app{padding:0 19px}header{height:75px}.wordmark{font-size:39px}.header-tools{gap:11px}.topbar{height:30px;gap:10px}.sound-preset{gap:7px}.sound-preset select{font-size:17px;width:145px;min-width:145px}.melody-controls{width:calc(100vw - 38px);top:40px;padding:18px;gap:15px;justify-content:space-between}.field{height:47vh;min-height:300px;max-height:490px;margin-top:0}.transport{bottom:13px}.grow-button{height:45px;width:45px;min-width:45px}.field-bottom{bottom:21px}.sequence-indicator{gap:3px;max-width:105px;overflow:hidden}.macros{padding:14px 0 8px;justify-content:space-between;gap:0}.knob{width:47px;height:47px}.macro-name{font-size:9px;margin-top:8px}.macro-value{font-size:7px}.keyboard-area{padding-bottom:7px}.keyboard-meta{height:12px;margin-bottom:6px}.piano{height:67px}.instrument-footer{display:flex;gap:7px;min-height:50px}.instrument-footer .footer-group{gap:14px}.recording-tools{position:static;transform:none;margin:auto}.instrument-footer .output{padding:0;gap:6px}.output input{width:43px}.output .level-meter{display:none}.tool-button{width:23px}.app.controls-hidden .field{height:calc(100dvh - 175px);min-height:360px}.app.controls-hidden .instrument-footer{margin-top:0}.envelope-controls .macro-value{opacity:1}.page-foot{display:none}}
@media(min-height:900px) and (min-width:800px){header{height:100px}.field{height:53vh}.macros{padding-top:16px;padding-bottom:18px}.piano{height:79px}}
/* Seed studio — living pigments, glassy surfaces and quiet botanical detail. */
:root{--accent:#b3dbb5;--accent-b:#a1ced5;--accent-c:#dec78e;--accent-rgb:179,219,181;--accent-b-rgb:161,206,213;--accent-c-rgb:222,199,142;--page-bg:#0b100e}html,body{background:var(--page-bg)}body{transition:background 1s}.wordmark{background:linear-gradient(125deg,var(--accent),#e1e7dc 48%,var(--accent-c));background-clip:text;-webkit-background-clip:text;color:transparent}.seed-mark{color:var(--accent)}.garden-tools{display:flex;align-items:center;gap:10px}.preset-trigger{display:flex;align-items:center;gap:22px;padding:5px 0;font-family:Georgia,serif;font-size:19px;letter-spacing:-.3px;color:#bdcebd;min-width:143px;text-align:left}.preset-trigger svg{width:14px;height:14px;fill:none;stroke:#7b927e;stroke-width:1.2}.preset-trigger:hover{color:var(--accent)}.icon-button,.tool-button,.quiet-button,.octave button{position:relative;border-radius:50%;transition:background .25s,color .25s,box-shadow .25s,transform .25s}.icon-button:hover,.tool-button:hover,.octave button:hover{color:var(--accent);background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(var(--accent-rgb),.19),rgba(var(--accent-b-rgb),.04) 65%,transparent);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.13),0 3px 16px rgba(var(--accent-b-rgb),.05)}.icon-button:active,.tool-button:active,.octave button:active{transform:scale(.9);background:linear-gradient(130deg,rgba(var(--accent-rgb),.25),rgba(var(--accent-c-rgb),.1))}.icon-button[aria-pressed=true]:not(#monitor-mute){color:var(--accent);background:rgba(var(--accent-rgb),.08);box-shadow:0 0 15px rgba(var(--accent-rgb),.08),inset 0 0 0 1px rgba(var(--accent-rgb),.25)}.palette-jewel{width:16px;height:16px;border-radius:50%;background:conic-gradient(from 30deg,var(--accent),var(--accent-b),var(--accent-c),var(--accent));box-shadow:inset -2px -2px 5px #0005,0 0 14px rgba(var(--accent-rgb),.14);position:relative}.palette-jewel:after{content:'';position:absolute;inset:2px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#fff8,transparent 55%)}#hover-button svg{width:17px;height:17px;stroke-width:1.1}.hover-playing .field{cursor:none}.hover-playing #hover-button{box-shadow:0 0 17px rgba(var(--accent-rgb),.13),inset 0 0 0 1px rgba(var(--accent-rgb),.3)}.field{border-radius:16px}.grow-button{background:radial-gradient(ellipse at 30% 12%,#f0f6df80,transparent 60%),linear-gradient(135deg,var(--accent),var(--accent-c));box-shadow:inset 0 1px 1px #fff4,0 5px 25px rgba(var(--accent-rgb),.08);transition:transform .3s,box-shadow .3s,background .3s}.grow-button:hover{background:radial-gradient(ellipse at 55% 5%,#fff8,transparent 60%),linear-gradient(135deg,var(--accent-b),var(--accent));box-shadow:inset 0 1px 2px #fff5,0 0 34px rgba(var(--accent-rgb),.22);transform:scale(1.06)}.grow-button:active{transform:scale(.94)}.playing .grow-button{background:linear-gradient(135deg,rgba(var(--accent-rgb),.15),rgba(var(--accent-b-rgb),.03));border-color:rgba(var(--accent-rgb),.25);color:var(--accent)}.knob{background:conic-gradient(from 225deg,var(--accent-b) 0deg,var(--accent) calc(var(--arc)*.65),var(--accent-c) var(--arc),rgba(var(--accent-rgb),.09) var(--arc),rgba(var(--accent-rgb),.05) 270deg,transparent 270deg);box-shadow:0 0 0 5px rgba(var(--accent-rgb),.012);transition:box-shadow .3s,filter .3s}.knob::before{inset:3px;background:radial-gradient(circle at var(--mx,30%) var(--my,20%),rgba(var(--accent-rgb),.13),transparent 65%),linear-gradient(145deg,#1c2921,#0c1510);box-shadow:inset 0 1px 2px rgba(var(--accent-b-rgb),.14),inset -1px -2px 5px #0007,0 4px 10px #0004}.knob::after{background:var(--page-bg)}.knob:hover,.knob:focus-visible{box-shadow:0 0 0 5px rgba(var(--accent-rgb),.025),0 0 24px rgba(var(--accent-b-rgb),.08);filter:brightness(1.15)}.knob-marker::after{background:var(--accent);box-shadow:0 0 7px rgba(var(--accent-rgb),.28)}.macro-name{color:color-mix(in srgb,var(--accent) 60%,#647168)}.macro-value{color:var(--accent-c)}.piano-wrap{position:relative;isolation:isolate}.piano{z-index:1}.piano-wrap>canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;mix-blend-mode:screen;border-radius:0 0 5px 5px}.key{background:radial-gradient(ellipse at 40% 15%,rgba(var(--accent-rgb),.035),transparent 65%),linear-gradient(180deg,#142118,#26362a);border-top:1px solid rgba(var(--accent-rgb),.06);border-radius:0 0 4px 4px;transition:background .15s,box-shadow .2s}.key:hover{background:linear-gradient(180deg,rgba(var(--accent-b-rgb),.12),rgba(var(--accent-rgb),.2));box-shadow:inset 0 -1px 0 rgba(var(--accent-rgb),.14),0 4px 14px #0005}.key.playing,.key:active{background:linear-gradient(170deg,rgba(var(--accent-b-rgb),.28),rgba(var(--accent-rgb),.67) 65%,rgba(var(--accent-c-rgb),.6));color:#132318;box-shadow:inset 0 0 14px rgba(var(--accent-rgb),.15),0 3px 17px rgba(var(--accent-rgb),.12)}.key.black{background:linear-gradient(#080e0b,#132017);border-color:var(--page-bg)}.key.black.playing{background:linear-gradient(165deg,rgba(var(--accent-c-rgb),.28),rgba(var(--accent-b-rgb),.45));color:var(--accent)}.instrument-footer .footer-group{gap:14px}.recording-tools{gap:14px}.output input{accent-color:var(--accent)}.level-meter i{background:var(--accent)}#loop-button.capturing{background:conic-gradient(var(--accent-c) var(--capture-progress,0deg),transparent 0deg);color:var(--page-bg)}#loop-button.capturing::before{content:'';position:absolute;inset:2px;background:var(--page-bg);border-radius:50%;z-index:0}#loop-button.capturing svg{z-index:1;color:var(--accent-c)}#loop-button.previewing{color:var(--accent);box-shadow:0 0 15px rgba(var(--accent-rgb),.1)}.loop-progress-dot{display:none}.botanical-dialog{background:radial-gradient(ellipse at 100% 0,rgba(var(--accent-rgb),.085),transparent 55%),radial-gradient(ellipse at 0 100%,rgba(var(--accent-b-rgb),.045),transparent 60%),#101913;border:1px solid rgba(var(--accent-rgb),.14);border-radius:25px;padding:32px;box-shadow:inset 0 1px 0 rgba(var(--accent-rgb),.04),0 30px 120px #000b;isolation:isolate}.botanical-dialog:before{content:'';position:absolute;z-index:-1;width:300px;height:320px;top:-130px;right:-60px;border-radius:50%;background:repeating-radial-gradient(ellipse at 65% 40%,transparent 0 12px,rgba(var(--accent-rgb),.026) 12px 13px,transparent 13px 24px);transform:rotate(-35deg);pointer-events:none}.botanical-dialog::backdrop{background:#020604bd;backdrop-filter:blur(15px) saturate(.7)}.botanical-dialog h2{font-size:29px;letter-spacing:-.9px;margin-top:8px;background:linear-gradient(110deg,#dce5d6 10%,var(--accent) 65%,var(--accent-c));background-clip:text;-webkit-background-clip:text;color:transparent}.botanical-dialog .eyebrow{color:color-mix(in srgb,var(--accent) 58%,#365342);font-size:7px;letter-spacing:1.7px}.botanical-dialog .dialog-head{margin-bottom:24px}.botanical-dialog .dialog-copy{font-size:11px;margin-top:-6px;line-height:1.7;color:#819b85}.botanical-dialog .small-copy{font-size:9px;color:#738c79}.botanical-dialog .macro-value{opacity:1}.botanical-dialog .knob::after{background:#111c15}.botanical-dialog select{color:var(--accent)}.botanical-dialog .primary-button{background:radial-gradient(ellipse at 30% 0,#ffffff35,transparent 70%),linear-gradient(135deg,var(--accent),var(--accent-c));box-shadow:0 5px 25px rgba(var(--accent-rgb),.08);transition:filter .2s,transform .2s}.botanical-dialog .primary-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.botanical-dialog .primary-button:active{transform:translateY(1px)}.sample-row{border-bottom:1px solid rgba(var(--accent-rgb),.035);padding:12px 0}.sample-row>button:first-child{width:24px;height:24px;border-radius:50%;background:rgba(var(--accent-rgb),.04);color:var(--accent)}.sample-row:hover{background:linear-gradient(90deg,rgba(var(--accent-rgb),.025),transparent)}.sample-row .sample-root{color:color-mix(in srgb,var(--accent) 70%,#516555)}.sample-row .sample-remove:hover{color:var(--accent-c)}.check-label input{accent-color:var(--accent)}#envelope-graph{margin:12px 0 18px}#envelope-line{stroke:var(--accent);filter:drop-shadow(0 0 5px rgba(var(--accent-rgb),.25))}#envelope-fill{fill:rgba(var(--accent-rgb),.035)}.envelope-floor{stroke:rgba(var(--accent-rgb),.1)}.library-dialog{width:820px;max-height:88dvh}.library-tools{display:flex;flex-direction:column;gap:17px;margin-bottom:20px}.category-tabs{display:flex;gap:6px;overflow:auto;scrollbar-width:none}.category-tabs button{font-size:9px;white-space:nowrap;color:#7d9583;border-radius:30px;padding:8px 11px;transition:background .2s,color .2s}.category-tabs button[aria-pressed=true]{color:var(--accent);background:rgba(var(--accent-rgb),.085);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.1)}#bank-search{width:100%;border:0;border-bottom:1px solid rgba(var(--accent-rgb),.12);border-radius:0;background:none;font-size:12px;padding:7px 0 11px;color:#c5d5c1;outline-offset:3px}#bank-search::placeholder{color:#5e7b67}.bank-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:46vh;overflow:auto;padding:2px;scrollbar-width:thin;scrollbar-color:#3d5140 transparent}.bank-card{position:relative;min-height:138px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:7px;padding:15px;border:1px solid rgba(var(--accent-rgb),.06);border-radius:16px 16px 20px 16px;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(var(--accent-rgb),.025),transparent 85%);overflow:hidden;transition:border-color .25s,background .25s,transform .25s}.bank-card>svg{width:70px;height:38px;fill:none;stroke:var(--accent);stroke-width:.5;opacity:.48;margin-bottom:3px;transition:opacity .25s,transform .4s}.bank-card-name{font-family:Georgia,serif;font-size:15px;letter-spacing:-.2px;color:#b7cbb5}.bank-card-detail{font-size:8px;line-height:1.5;color:#64806d;max-width:95%}.bank-card:hover{border-color:rgba(var(--accent-rgb),.22);background:radial-gradient(ellipse at var(--mx,50%) var(--my,20%),rgba(var(--accent-rgb),.075),rgba(var(--accent-b-rgb),.02));transform:translateY(-2px)}.bank-card:hover>svg{opacity:.9;transform:translateX(5px)}.bank-card[aria-pressed=true]{border-color:rgba(var(--accent-rgb),.35);background:linear-gradient(135deg,rgba(var(--accent-rgb),.1),rgba(var(--accent-c-rgb),.025))}.bank-card[aria-pressed=true]:after{content:'';position:absolute;right:12px;top:14px;width:4px;height:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px rgba(var(--accent-rgb),.6)}.library-dialog.loading .bank-grid{pointer-events:none;opacity:.5}.library-note{margin:16px 0 0!important}.section-label{display:block;font-size:8px;letter-spacing:1.7px;color:#738f7b;margin:22px 0 13px}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.form-option{display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid rgba(var(--accent-rgb),.055);border-radius:14px;padding:11px 8px;font-size:10px;color:#8ba48f;background:rgba(var(--accent-rgb),.018);transition:background .25s,border-color .25s}.form-option svg{width:66px;height:45px;fill:none;stroke:var(--accent);stroke-width:.65;opacity:.55;transition:filter .3s,opacity .3s}.form-option:hover,.form-option[aria-pressed=true]{color:var(--accent);border-color:rgba(var(--accent-rgb),.3);background:radial-gradient(ellipse at 50% 20%,rgba(var(--accent-rgb),.09),rgba(var(--accent-b-rgb),.02))}.form-option[aria-pressed=true] svg,.form-option:hover svg{opacity:1;filter:drop-shadow(0 0 5px rgba(var(--accent-rgb),.3))}.palette-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px 6px;margin-bottom:4px}.palette-option{display:flex;flex-direction:column;align-items:center;gap:9px;font-size:9px;color:#78917f}.palette-option i{width:33px;height:33px;border-radius:50%;background:radial-gradient(ellipse at 30% 15%,#ffffff65,transparent 70%),var(--swatch);box-shadow:inset -3px -5px 8px #0004,0 3px 9px #0005;position:relative;transition:transform .3s,box-shadow .3s}.palette-option i:after{content:'';position:absolute;inset:-5px;border:1px solid transparent;border-radius:50%}.palette-option:hover i{transform:scale(1.1)}.palette-option[aria-pressed=true]{color:var(--accent)}.palette-option[aria-pressed=true] i:after{border-color:rgba(var(--accent-rgb),.5)}.effect-garden{height:105px;position:relative;overflow:hidden;margin:0 0 10px;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}.effect-garden i{position:absolute;left:10%;width:80%;height:80px;top:12px;border-radius:50%;border:1px solid rgba(var(--accent-rgb),.2);transform:rotate(-9deg);box-shadow:0 0 15px rgba(var(--accent-rgb),.025)}.effect-garden i:nth-child(2){transform:rotate(9deg);border-color:rgba(var(--accent-b-rgb),.25)}.effect-garden i:nth-child(3){transform:rotate(-3deg);height:45px;top:30px;border-color:rgba(var(--accent-c-rgb),.25)}.effect-garden i:nth-child(4){transform:rotate(4deg);height:35px;top:30px}.effects-controls{display:flex;justify-content:space-evenly;gap:20px;padding:10px 0}.reset-effects{width:auto;margin-top:10px}.loop-orbit{position:relative;width:180px;height:180px;margin:0 auto 22px}.loop-orbit>svg{width:100%;height:100%;overflow:visible}.loop-orbit circle{fill:none;stroke-width:.75;transform:rotate(-90deg);transform-origin:center}.orbit-track{stroke:rgba(var(--accent-rgb),.12)}#loop-progress{stroke-width:1.7;filter:drop-shadow(0 0 4px rgba(var(--accent-rgb),.25));transition:stroke-dashoffset .15s}#loop-wave{fill:none;stroke:rgba(var(--accent-rgb),.25);stroke-width:.6}.loop-orbit>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;pointer-events:none}.loop-orbit strong{font:400 32px Georgia,serif;color:var(--accent);letter-spacing:-1px}.loop-orbit span{font-size:9px;letter-spacing:.3px;color:#76947d}.loop-options{display:flex;align-items:center;justify-content:space-between;gap:20px}.segmented{display:flex;gap:2px;padding:3px;background:#09130d;border-radius:30px}.segmented button,.length-choices button{padding:8px 13px;border-radius:20px;font-size:10px;color:#738e7c}.segmented button[aria-pressed=true],.length-choices button[aria-pressed=true]{color:var(--accent);background:rgba(var(--accent-rgb),.09)}.length-choices{display:flex;gap:4px}.length-choices button{width:32px;padding:8px 0}.loop-actions{display:flex;align-items:center;gap:12px;margin-top:24px}.loop-actions .primary-button{margin:0;flex:1}.secondary-button{font-size:11px;color:var(--accent);border:1px solid rgba(var(--accent-rgb),.2);border-radius:25px;padding:10px 20px;background:rgba(var(--accent-rgb),.025)}.secondary-button:hover{background:rgba(var(--accent-rgb),.08)}.loop-dialog .small-copy{text-align:center;margin-top:16px}.loop-dialog .check-label{font-size:10px;justify-content:center}.loop-dialog .icon-button{flex-shrink:0}.melody-controls{background:radial-gradient(ellipse at 50% 0,rgba(var(--accent-rgb),.08),transparent 75%),#111c15f5;border-color:rgba(var(--accent-rgb),.14)}#toast{border-color:rgba(var(--accent-rgb),.2);background:#17281eef;backdrop-filter:blur(12px);box-shadow:0 10px 40px #0004;border-radius:25px;font-size:11px;color:var(--accent)}
@media(max-width:600px){.garden-tools{gap:7px}.preset-trigger{font-size:17px;min-width:119px;gap:12px;max-width:160px}.preset-trigger>span{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sound-preset{gap:3px}.garden-tools .icon-button{width:27px}.instrument-footer .footer-group{gap:10px}.instrument-footer{gap:4px}.output input{width:35px}.recording-tools{gap:8px!important}.tool-button{width:23px}.botanical-dialog{padding:23px;border-radius:23px;max-height:88dvh}.botanical-dialog h2{font-size:25px}.botanical-dialog .dialog-head{margin-bottom:21px}.bank-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:48vh}.bank-card{padding:12px;min-height:140px}.bank-card-name{font-size:14px}.bank-card-detail{font-size:8px}.category-tabs button{font-size:8px;padding:7px 8px}.library-tools{gap:12px}.form-option{padding:10px 5px;font-size:9px}.form-option svg{width:58px;height:38px}.palette-grid{gap:17px 3px}.palette-option{font-size:8px;gap:9px}.palette-option i{width:28px;height:28px}.loop-options{gap:10px;flex-wrap:wrap;justify-content:center}.loop-actions{gap:8px}.loop-actions .secondary-button{padding:10px 14px;font-size:10px}.loop-actions .primary-button{font-size:10px;padding:11px 14px}.effects-controls{gap:13px}.loop-orbit{width:150px;height:150px}.envelope-controls{gap:8px}.envelope-controls .macro{width:50px}.import-controls{gap:15px}.sample-row{font-size:10px}#toast{font-size:10px;max-width:calc(100vw - 24px);padding:11px 16px}.knob{box-shadow:0 0 0 4px rgba(var(--accent-rgb),.014)}}
@media(max-width:350px){.app{padding-left:15px;padding-right:15px}.preset-trigger{min-width:104px;font-size:16px;gap:7px}.preset-trigger>span{max-width:105px}.garden-tools{gap:3px}.sound-preset{gap:1px}.instrument-footer .footer-group{gap:6px}.output input{width:30px}.botanical-dialog{padding:20px}.form-grid{gap:6px}.form-option svg{width:54px}.palette-option{font-size:7px}}
@media(prefers-reduced-motion:reduce){.bank-card:hover,.grow-button:hover,.palette-option:hover i{transform:none}}
/* Keep the decorative rings inside the modal on compact screens. */
.botanical-dialog{overflow-x:hidden}.botanical-dialog:before{inset:0;width:100%;height:100%;transform:none;background:repeating-radial-gradient(ellipse at 105% -20%,transparent 0 12px,rgba(var(--accent-rgb),.026) 12px 13px,transparent 13px 24px);mask-image:linear-gradient(#000,transparent 65%)}
@media(max-width:600px){.effects-controls .macro{width:65px}}
@media(min-width:800px) and (max-height:800px){.app:not(.controls-hidden) .field{height:calc(100dvh - 420px);min-height:260px}}

/* The wordmark itself becomes the cursor's brush. */
.wordmark{position:relative;display:inline-flex;align-items:flex-start;isolation:isolate;background:none;color:inherit;outline-offset:7px;user-select:none;-webkit-user-select:none}
.wordmark-label{display:inline-block;line-height:1;background:linear-gradient(125deg,var(--accent),#e1e7dc 48%,var(--accent-c));background-clip:text;-webkit-background-clip:text;color:transparent}
.wordmark .seed-mark{position:relative;z-index:2;display:block;width:.4em;height:.5em;font-size:inherit;line-height:1;margin:2px 0 0 7px;flex:none}
.seed-mark svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none;transform-origin:50% 50%;transform:rotate(0deg);filter:drop-shadow(0 0 0 transparent);transition:transform 850ms cubic-bezier(.22,.61,.36,1),filter 650ms ease}
@media(hover:hover){.seed-mark:hover svg{transform:rotate(24deg);filter:drop-shadow(0 0 4px rgba(var(--accent-rgb),.65)) drop-shadow(0 0 11px rgba(var(--accent-c-rgb),.4))}}
.wordmark:focus-visible .seed-mark svg{transform:rotate(24deg);filter:drop-shadow(0 0 4px rgba(var(--accent-rgb),.65)) drop-shadow(0 0 11px rgba(var(--accent-c-rgb),.4))}
.logo-trail{position:absolute;pointer-events:none;display:block;z-index:1;opacity:0}
.wordmark.trail-active .logo-trail{opacity:1}
.wordmark.trail-active>.wordmark-label{opacity:0}
.wordmark:focus-visible{outline:1px solid var(--accent);border-radius:3px}
.wordmark:focus-visible .wordmark-label,.wordmark:hover:not(.trail-active) .wordmark-label{filter:drop-shadow(0 0 8px rgba(var(--accent-rgb),.25))}
@media(prefers-reduced-motion:reduce){.logo-trail{display:none}.wordmark.trail-active>.wordmark-label{opacity:1}.seed-mark svg,.seed-mark:hover svg,.wordmark:focus-visible .seed-mark svg{transform:none;transition:none}}