:root{font-family:DM Sans,sans-serif;color:#25251f;background:#f5f3ee;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink:#25251f;--muted:#77766f;--line:#e8e6de;--paper:#fffefa;--green:#c5f068;--darkgreen:#8fba3c}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 70% 8%,rgba(221,232,195,.22),transparent 30%),#f5f3ee}.page-shell{max-width:1130px;margin:0 auto;padding:0 42px}.topbar{height:76px;border-bottom:1px solid #e9e7df;display:flex;align-items:center;justify-content:space-between}.brand{font:800 21px Manrope,sans-serif;letter-spacing:-1.2px;color:var(--ink);display:flex;align-items:center;gap:9px;text-decoration:none}.brand-mark{height:23px;display:flex;align-items:center;gap:2px}.brand-mark i{width:3px;border-radius:5px;background:#77a82e;display:block}.brand-mark i:nth-child(1),.brand-mark i:nth-child(4){height:8px}.brand-mark i:nth-child(2){height:17px}.brand-mark i:nth-child(3){height:12px}.privacy-pill{font-size:11px;color:#6a6a60;border:1px solid #e7e5dc;border-radius:30px;padding:8px 12px;background:#ffffff70;display:flex;align-items:center;gap:7px}.privacy-dot{height:6px;width:6px;background:#86b643;border-radius:50%;box-shadow:0 0 0 3px #edf5de}.text-button{background:none;border:0;color:#5e5d55;font:500 12px DM Sans;cursor:pointer}.text-button span{font-size:15px;margin-left:4px}.intro{text-align:center;padding:55px 0 34px}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:1.6px;font-weight:700;color:#6f7f58;display:flex;align-items:center;justify-content:center;gap:8px}.eyebrow-line{width:19px;height:1px;background:#91aa70}.intro h1{font:700 43px/1.13 Manrope,sans-serif;letter-spacing:-2.4px;margin:15px 0 11px}.intro h1 em{font-style:normal;color:#78a531}.intro-copy{max-width:405px;margin:0 auto;color:#77766f;font-size:13px;line-height:1.7}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:14px}.card{background:var(--paper);border:1px solid #eae8e0;border-radius:14px;box-shadow:0 2px 8px #2d2a1c06}.capture-card,.melody-card{padding:21px 22px 16px;min-height:347px}.section-heading{display:flex;align-items:flex-start;gap:12px}.step-number{color:#87a75a;font:700 10px Manrope,sans-serif;letter-spacing:.7px;padding-top:4px}.section-heading h2{font:700 15px Manrope,sans-serif;margin:0 0 4px;letter-spacing:-.3px}.section-heading p{font-size:11px;color:#85837b;margin:0;line-height:1.5}.listening-panel{height:169px;margin:18px 0 13px;background:#f4f7eb;border:1px solid #edf1e4;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.orb-wrap{width:60px;height:60px;position:relative;display:grid;place-items:center;margin:0 0 8px}.orb{height:42px;width:42px;z-index:1;border-radius:50%;background:linear-gradient(145deg,#ddf6a9,#b8e569);display:grid;place-items:center;box-shadow:inset 0 1px 2px #fff,0 5px 13px #78a3332e}.orb-note{font-size:20px;color:#57811e}.orb-glow{position:absolute;width:50px;height:50px;border-radius:50%;background:#d5f29d;filter:blur(15px);opacity:.8}.orb-ring{position:absolute;inset:5px;border:1px solid #c3dc9f;border-radius:50%;opacity:.43}.ring-two{inset:0;opacity:.23}.listening-title{font:700 12px Manrope,sans-serif}.listening-hint{font-size:10px;color:#88887d;margin-top:4px}.record-clock{display:none;font:600 10px Manrope;color:#6c8e36;margin-top:5px}.meter{position:absolute;bottom:12px;left:50%;transform:translate(-50%);height:15px;display:flex;align-items:center;gap:2px;opacity:.15}.meter span{display:block;width:2px;height:4px;background:#6f9b36;border-radius:3px}.is-recording .orb{animation:breathe .8s ease-in-out infinite alternate}.is-recording .orb-ring{animation:ripple 1.7s ease-out infinite}.is-recording .ring-two{animation-delay:.5s}.is-recording .record-clock{display:block}.is-recording .meter{opacity:.85}.is-recording .meter span{animation:wave .48s ease-in-out infinite alternate}.is-recording .meter span:nth-child(3n){animation-delay:.14s}.is-recording .meter span:nth-child(2n){animation-delay:.28s}@keyframes breathe{to{transform:scale(1.12);box-shadow:0 0 20px #bde477}}@keyframes ripple{0%{transform:scale(.7);opacity:.7}to{transform:scale(1.4);opacity:0}}@keyframes wave{to{height:14px}}.capture-actions{display:flex;gap:8px}.button{height:36px;padding:0 13px;border-radius:7px;font:600 11px DM Sans;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s ease;border:1px solid transparent}.button:disabled{opacity:.45;cursor:not-allowed}.button-primary{background:var(--green);color:#263515;min-width:142px}.button-primary:hover:not(:disabled){background:#b8e65b;transform:translateY(-1px)}.button-stop{background:#fce9e3;border-color:#f4d8d0;color:#a14d3d}.button-sample{background:transparent;border-color:#e9e7df;color:#616057}.button-sample:hover{background:#f6f5f0}.record-icon{height:8px;width:8px;border-radius:50%;background:#5b8f26}.stop-icon{width:8px;height:8px;border-radius:2px;background:#bd5948}.sparkle{font-size:14px;color:#88a846}.small-note{color:#95938a;font-size:9px;margin-top:13px;display:flex;align-items:center;gap:6px}.mic-small{color:#81a347;font-size:14px}.section-heading-tight{align-items:center}.icon-button{margin-left:auto;height:26px;width:26px;border-radius:6px;border:1px solid #e7e5dc;background:#fffefa;color:#747368;font-size:15px;cursor:pointer}.melody-stage{height:211px;border-radius:9px;margin-top:17px;background:linear-gradient(180deg,#fbfbf7,#f8f8f2);border:1px solid #f0efe9;position:relative;overflow:hidden}.empty-melody{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8e8c82;font-size:11px}.empty-icon{font-size:28px;color:#a7bd87;margin-bottom:8px}.empty-melody small{font-size:9px;color:#aaa89e;margin-top:5px}.melody-canvas{display:block;width:100%;height:100%}.melody-footer{display:flex;align-items:center;justify-content:space-between;padding-top:11px}.note-count{font-size:10px;color:#8b897f}.play-melody{padding:0;background:none;border:0;color:#5e793b;font:600 10px DM Sans;cursor:pointer}.play-melody:disabled{opacity:.4;cursor:default}.play-melody span{font-size:9px;margin-right:4px}.instrument-section{padding-top:33px}.instrument-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.instrument-header .section-heading{align-items:center}.button-outline{background:#fffefa;border-color:#e5e4db;color:#68665e;height:32px;font-size:10px}.button-outline:hover:not(:disabled){background:#f7f8f1;border-color:#d8dfc8}.sequence-icon{font-size:16px;color:#7da046}.instrument-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.instrument-card{min-height:114px;background:#fffefa;border:1px solid #e8e6de;border-radius:10px;padding:12px 12px 10px;cursor:pointer;position:relative;transition:.18s ease;text-align:left;color:var(--ink)}.instrument-card:hover{border-color:#c7d8ab;transform:translateY(-2px);box-shadow:0 5px 16px #2d2a1c0e}.instrument-card.selected{border-color:#91b957;background:#fbfdef;box-shadow:0 0 0 1px #bad58e inset}.instrument-card.is-playing{border-color:#9bc460;background:#f6f9ed}.instrument-top{display:flex;align-items:center;justify-content:space-between}.instrument-emoji{font-size:21px;line-height:1}.instrument-play{height:23px;width:23px;border-radius:50%;background:#f4f4ee;color:#747269;display:grid;place-items:center;font-size:9px;transition:.18s}.instrument-card:hover .instrument-play,.instrument-card.is-playing .instrument-play{background:#e8f3d6;color:#5e852b}.instrument-card h3{font:700 11px Manrope,sans-serif;margin:11px 0 2px}.instrument-card p{font-size:9px;color:#89877d;margin:0}.instrument-tag{position:absolute;right:10px;bottom:9px;font:600 8px DM Sans;color:#85a557;opacity:0}.instrument-card.selected .instrument-tag{opacity:1}.selected-bar{margin-top:20px;padding:12px 14px 12px 16px;border:1px solid #e8e7df;background:#fffefac7;border-radius:10px;display:flex;align-items:center;justify-content:space-between}.selected-left{display:flex;align-items:center;gap:10px}.selected-check{height:25px;width:25px;border-radius:50%;background:#edf4df;color:#7b9c4a;display:grid;place-items:center;font-size:11px}.selected-left small{display:block;color:#939187;font-size:9px;margin-bottom:2px}.selected-left strong{font:600 11px Manrope,sans-serif}.button-dark{height:34px;background:#303329;color:#fff;font-size:10px}.button-dark:hover:not(:disabled){background:#464a3a}.button-dark span{font-size:15px;margin-left:3px}.footer{height:69px;display:flex;justify-content:space-between;align-items:center;color:#a09e95;font-size:9px}.footer-dot{padding:0 5px;color:#a5bb7d}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,14px);background:#303329;color:#fff;padding:10px 15px;border-radius:8px;font-size:11px;box-shadow:0 8px 22px #0002;opacity:0;pointer-events:none;transition:.2s;z-index:10;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%)}.hidden{display:none!important}.instrument-card:focus-visible,.button:focus-visible,.icon-button:focus-visible,.text-button:focus-visible{outline:2px solid #8db44a;outline-offset:2px}#help-button{padding:8px}@media(max-width:760px){.page-shell{padding:0 22px}.workspace{grid-template-columns:1fr}.capture-card,.melody-card{min-height:unset}.capture-card{padding-bottom:16px}.melody-stage{height:196px}.instrument-grid{grid-template-columns:repeat(2,1fr)}.instrument-section{padding-top:27px}.intro{padding:45px 0 28px}.intro h1{font-size:37px}.instrument-header{align-items:flex-start;gap:12px}.instrument-header>.button{white-space:nowrap;margin-top:0}}@media(max-width:460px){.page-shell{padding:0 15px}.topbar{height:65px}.privacy-pill{font-size:0;padding:8px}.privacy-pill:after{content:"On-device mic";font-size:9px}.text-button{font-size:0}.text-button span{font-size:15px}.intro{padding:39px 0 24px}.intro h1{font-size:34px}.intro-copy{font-size:12px;padding:0 12px}.capture-card,.melody-card{padding:17px 15px 15px}.instrument-header{display:block}.instrument-header>.button{margin:13px 0 0 25px}.selected-bar{padding:11px}.selected-left strong{font-size:10px}.button-dark{padding:0 9px}.footer{font-size:8px}.toast{max-width:90vw;white-space:normal;text-align:center}}.button-save{background:#eef5df;border-color:#e0ebca;color:#587c2d}.button-save:hover{background:#e6f0d3}.library-section{padding-top:32px}.library-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.library-header .section-heading{align-items:center}.library-list{display:grid;gap:8px}.library-empty{min-height:62px;border:1px dashed #deded3;border-radius:9px;background:#fffefa7a;display:flex;align-items:center;justify-content:center;gap:8px;color:#99978e;font-size:10px}.library-empty span{font-size:17px;color:#a4ba81}.hum-item{display:grid;grid-template-columns:minmax(140px,1fr) minmax(150px,240px) auto;gap:15px;align-items:center;padding:11px 13px;border:1px solid #e8e6de;background:#fffefa;border-radius:9px}.hum-item-title{font:700 11px Manrope,sans-serif}.hum-item-meta{font-size:9px;color:#929086;margin-top:4px}.hum-item audio{width:100%;height:32px}.hum-item .button{height:29px;padding:0 10px;font-size:9px}.hum-item-actions{display:flex;align-items:center;gap:7px}.library-error{font-size:10px;color:#a14d3d;padding:10px 12px;background:#fff4f0;border-radius:8px}@media(max-width:700px){.hum-item{grid-template-columns:1fr auto;gap:7px}.hum-item audio{grid-column:1 / -1;grid-row:2}.hum-item-actions{grid-column:2;grid-row:1}.library-header{align-items:flex-start;gap:10px}.library-header>.button{white-space:nowrap}}