
:root{color-scheme:dark;--bg:#090b13;--surface:#111420;--surface2:#171b29;--line:#292d3f;--line-soft:#222638;--muted:#8a91ad;--purple:#966af7;--violet:#bd88ff;--mint:#4be2b5;--blue:#58b7fb;--white:#f5f4ff;--warm:#f4ce84;--sans:'DM Sans',Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--display:'Space Grotesk',var(--sans)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:70px;overflow-x:clip}body{margin:0;min-height:100vh;background:var(--bg);color:var(--white);font:14px/1.5 var(--sans);overflow-x:hidden}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--mint);outline-offset:3px}::selection{background:#8d5cf78c}button:disabled{cursor:not-allowed;opacity:.45}.ambient{position:absolute;pointer-events:none;z-index:-1;filter:blur(110px);opacity:.23;border-radius:100%}.ambient-one{width:min(660px,100vw);height:500px;background:#6137c8;top:40px;left:50%;transform:translateX(-50%)}.ambient-two{width:min(350px,100vw);height:380px;background:#2743a4;top:980px;right:0}.app{max-width:1450px;margin:auto;padding:0 52px}.topbar{height:88px;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #ffffff0d;position:relative;z-index:5}.logo{display:flex;align-items:center;gap:10px;font:700 24px/1 var(--display);letter-spacing:-1.5px}.brand-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(145deg,#a878ff,#6c4de8);display:grid;place-items:center;box-shadow:0 6px 30px #6f45ed55}.brand-mark svg{width:28px;color:white}.logo-accent{font-weight:400}.logo-dot{color:var(--mint)}.topnav{display:flex;gap:36px;color:#a5aac4;font-weight:700;font-size:13px}.topnav a:hover,.footer a:hover{color:#fff}.top-actions{display:flex;align-items:center;gap:20px}.head-chip{font-size:11px;color:#afbad0;font-weight:700;letter-spacing:.04em;display:flex;align-items:center;gap:8px}.status-dot,.live-indicator,.pulse-small{background:var(--mint);display:inline-block;width:6px;height:6px;border-radius:50%;box-shadow:0 0 12px #4be2b599}.nav-cta{border:1px solid #ffffff2c;border-radius:9px;padding:10px 17px;font-size:12px;font-weight:800;display:flex;gap:15px;align-items:center;transition:background .2s}.nav-cta:hover{background:#ffffff12}.nav-cta span{color:var(--mint)}.hero{min-height:540px;padding:104px 0 65px;position:relative}.hero-kicker{font-size:11px;letter-spacing:.15em;color:#b9acdf;font-weight:800;display:flex;align-items:center;gap:14px}.sparkle{color:var(--mint);font-size:17px}.kicker-line{width:27px;height:1px;background:#5f526e}.hero h1{font:700 clamp(48px,6.25vw,94px)/1.04 var(--display);letter-spacing:-.07em;margin:24px 0 23px;max-width:890px;position:relative;z-index:1}.hero h1>span:first-child{background:linear-gradient(100deg,#b389ff 12%,#8b6afd 48%,#65d9da 93%);color:transparent;-webkit-background-clip:text;background-clip:text}.hero-period{color:var(--mint)}.hero p{color:#a8aec6;font-size:16px;line-height:1.8;max-width:525px;margin:0}.hero p strong{color:#fff}.hero-actions{margin-top:28px;display:flex;align-items:center;gap:24px}.primary-link{padding:15px 22px;background:linear-gradient(115deg,#9d71fa,#7f5ce8);font-size:13px;font-weight:800;border-radius:10px;min-width:178px;display:flex;align-items:center;justify-content:space-between;gap:16px;box-shadow:0 8px 40px #6746d640;transition:transform .2s,filter .2s}.primary-link:hover,.generate-button:hover{transform:translateY(-2px);filter:brightness(1.12)}.primary-link span{font-size:17px}.hero-sub{color:#9299b1;font-size:12px}.tiny-check{color:var(--mint);font-weight:bold;margin-right:5px}.hero-metrics{display:flex;gap:48px;margin-top:64px}.hero-metrics>div{display:flex;flex-direction:column;gap:0}.hero-metrics strong{font:700 27px/1.2 var(--display);color:#f0edff}.hero-metrics span{color:#8088a2;font-size:11px;margin-top:5px}.hero-glow-decoration{position:absolute;right:1%;top:38px;width:430px;height:430px;z-index:-1;opacity:.68;background:radial-gradient(ellipse,#6b3cbc26,transparent 65%)}.orbit{position:absolute;border:1px solid #7f63ad3d;border-radius:50%;transform:rotate(-28deg)}.orbit-a{width:380px;height:185px;top:115px;left:0}.orbit-b{width:225px;height:400px;top:0;left:95px;transform:rotate(49deg)}.floating-note{font:100px/1 var(--display);position:absolute;color:#8d66e1;filter:drop-shadow(0 10px 50px #8e55fa77)}.note-1{top:36px;right:160px;transform:rotate(12deg)}.note-2{bottom:48px;right:45px;transform:rotate(-20deg);font-size:66px;color:#5bd8bd}.section-label{display:flex;align-items:center;gap:14px;color:#b9b1d9;font-size:11px;font-weight:800;letter-spacing:.12em;margin-bottom:21px}.label-index{color:var(--mint)}.label-rule{flex:1;height:1px;background:#ffffff1e}.studio-running{display:flex;align-items:center;gap:8px;font-size:10px;color:#9ea4bd}.studio-window{border:1px solid #323349;border-radius:16px;overflow:hidden;background:#10131e;box-shadow:0 20px 110px #0006,0 0 0 1px #ffffff04}.window-topbar{height:52px;padding:0 20px;background:#171a28;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.window-title{display:flex;align-items:center;gap:14px;color:#ccd0e3;font:600 12px var(--display)}.mac-dots{display:flex;gap:6px;margin-right:7px}.mac-dots i{width:9px;height:9px;border-radius:50%;background:#f1777b}.mac-dots i:nth-child(2){background:#eab862}.mac-dots i:nth-child(3){background:#50bd98}.window-version{background:#29263c;border:1px solid #3c3555;border-radius:4px;font-size:10px;color:#a9a0cb;padding:2px 5px;font-family:var(--sans)}.window-right{display:flex;align-items:center;gap:18px}.saved-indicator{font-size:11px;color:#8e96ad}.icon-button{background:transparent;border:1px solid #474b60;color:#a5aec9;width:23px;height:23px;border-radius:5px}.studio-layout{display:grid;grid-template-columns:300px minmax(0,1fr)}.control-panel{background:#141724;padding:25px 20px 22px;border-right:1px solid #2c2e42;min-width:0}.panel-title{display:flex;align-items:center;gap:11px;margin-bottom:24px}.panel-title-icon{font-size:21px;background:#9869fb22;color:#b495ff;display:grid;place-items:center;width:38px;height:38px;border:1px solid #9464fa30;border-radius:10px}.panel-title h2{font:700 17px var(--display);margin:0}.panel-title span:not(.panel-title-icon){font-size:11px;color:#8289a4}.panel-group{padding:0 0 22px;margin-bottom:21px;border-bottom:1px solid #2c3043}.field-title{font-size:10px;font-weight:800;color:#a0a7bf;letter-spacing:.085em;display:block;margin-bottom:11px}.genre-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px}.genre{border:1px solid #32374c;background:#1c2030;color:#a7adc3;border-radius:7px;padding:9px 4px;font-size:11px;font-weight:700;transition:.16s;white-space:nowrap}.genre:hover{border-color:#7456bc;color:#fff}.genre.active{background:#7449d72a;border-color:#a370fa;color:#d7c3ff;box-shadow:inset 0 0 20px #8854f20a}.two-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-select,.tiny-select{width:100%;background-color:#202435;border:1px solid #383d52;border-radius:8px;color:#e8e9f3;padding:10px 8px;outline:none;font-size:12px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23a4a9c3' stroke-width='1.5'/%3E%3C/svg%3E");background-position:right 9px center;background-repeat:no-repeat;padding-right:24px}.form-select:focus{border-color:var(--purple)}.range-title{display:flex;justify-content:space-between;align-items:center}.range-value{font:700 16px var(--display);color:#e9e4ff}.range-value small{font:700 10px var(--sans);color:#777f9b}.custom-range{appearance:none;background:#37324d;width:100%;height:5px;border-radius:4px;margin:12px 0 0;accent-color:var(--purple)}.custom-range::-webkit-slider-thumb{appearance:none;border:3px solid #cbaaff;background:#8458e5;box-shadow:0 0 15px #a066ff60;border-radius:50%;width:16px;height:16px}.custom-range::-moz-range-thumb{border:3px solid #cbaaff;background:#8458e5;border-radius:50%;width:13px;height:13px}.range-limits{display:flex;justify-content:space-between;color:#717990;font-size:10px;margin-top:5px}.switches{padding-bottom:10px;margin-bottom:14px}.switch-row{display:flex;justify-content:space-between;align-items:center;position:relative;cursor:pointer;margin:0 0 17px}.switch-row input{position:absolute;opacity:0;right:0;width:35px;height:23px;cursor:pointer}.switch-name,.switch-desc{display:block}.switch-name{color:#dce0ef;font-size:12px;font-weight:700}.switch-desc{color:#828ba4;font-size:10px;margin-top:2px}.switch-ui{height:20px;width:36px;border-radius:50px;background:#464657;position:relative;transition:.2s;pointer-events:none}.switch-ui:before{content:'';position:absolute;width:14px;height:14px;border-radius:50%;background:#cbd0df;left:3px;top:3px;transition:.2s}.switch-row input:checked+.switch-ui{background:#8554de}.switch-row input:checked+.switch-ui:before{transform:translateX(16px);background:white}.switch-row input:focus-visible+.switch-ui{outline:2px solid var(--mint)}.generator-bottom{display:flex;flex-direction:column;gap:12px}.generate-button{background:linear-gradient(110deg,#9769f6,#6e4cdd);border:none;border-radius:10px;color:white;width:100%;height:49px;font-size:13px;font-weight:800;box-shadow:0 6px 24px #7550df38;transition:.2s;display:flex;align-items:center;justify-content:center;gap:10px}.generate-button>span:first-child{font-size:18px}.generate-arrow{margin-left:4px}.random-preset{background:none;border:none;color:#9f96bf;font-size:11px;font-weight:700;padding:5px}.random-preset:hover{color:white}.workspace{min-width:0;background:#10131e}.project-head{display:flex;justify-content:space-between;align-items:center;padding:24px 26px 18px;gap:12px}.project-eyebrow{color:#9fa5bd;letter-spacing:.07em;font-size:10px;font-weight:800}.project-eyebrow span:last-child{color:#bea5ff}.eyebrow-separator{color:#5e627a;margin:0 4px}.project-title-block input{display:block;margin:4px 0 3px;border:1px solid transparent;background:none;color:#fff;font:700 24px/1.25 var(--display);letter-spacing:-.035em;padding:0 2px 0 0;max-width:340px;width:100%;border-radius:3px}.project-title-block input:focus{border-color:#7355a9;background:#1b1d2b;outline:none}.project-subline{font-size:11px;color:#858ca4}.project-actions{display:flex;gap:7px}.light-button{border:1px solid #363b51;border-radius:7px;background:#202333;color:#c9cde1;font-size:11px;font-weight:800;padding:9px 11px;white-space:nowrap}.light-button:hover{background:#2c3046;color:white}.transport{margin:0 26px;background:#1a1e2d;border:1px solid #303447;border-radius:9px;display:flex;align-items:center;justify-content:space-between;padding:9px 15px;gap:12px}.transport-main,.transport-extras{display:flex;align-items:center;gap:12px}.play-button{border:0;border-radius:7px;width:39px;height:39px;background:var(--mint);color:#101820;font-size:18px;display:grid;place-items:center;transition:filter .2s}.play-button:hover{filter:brightness(1.13)}.transport-plain{background:transparent;color:#a0a6bf;border:0;font-size:15px;min-width:24px}.transport-plain:hover{color:white}.transport-sep{width:1px;height:26px;background:#373b51;margin:0 4px}.transport-bpm,.transport-position{display:flex;flex-direction:column;gap:0;min-width:53px}.transport-bpm b,.transport-position b{font:700 17px/1.2 var(--display);letter-spacing:.02em}.transport-bpm small,.transport-position small{font:700 9px var(--sans);color:#858ba5;letter-spacing:.1em;margin-top:3px}.checkbox-small{display:flex;align-items:center;gap:5px;color:#bec5d9;font-size:11px;white-space:nowrap}.checkbox-small input{accent-color:#a178fb}.volume-wrap{color:#b8c1d7;display:flex;align-items:center;gap:5px}.volume-wrap input{width:64px;accent-color:#a177f7;height:4px}.tracks{display:flex;align-items:end;justify-content:space-between;gap:8px;margin:28px 26px 0;border-bottom:1px solid #33384d}.track-tabs{display:flex;gap:8px}.track-tab{background:none;color:#8d94b0;font-size:12px;font-weight:700;border:0;border-bottom:2px solid transparent;padding:0 11px 12px;display:flex;align-items:center;gap:6px}.track-tab:hover{color:white}.track-tab.active{color:white;border-bottom-color:#b07bff}.track-dot{display:inline-block;width:7px;height:7px;border-radius:2px}.melody-dot{background:#9e74ff}.chords-dot{background:#4bd5cb}.bass-dot{background:#ffbc78}.count-bubble{color:#858b9f;background:#292d40;padding:1px 6px;font-size:10px;border-radius:5px}.track-mode{font-size:10px;letter-spacing:.12em;color:#6f7892;font-weight:800;padding-bottom:12px;white-space:nowrap}.track-mode-line{display:inline-block;width:18px;height:1px;background:#667089;vertical-align:middle;margin-left:4px}.edit-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 26px;padding:11px 0}.tool-left,.tool-right{display:flex;align-items:center;gap:5px}.toolbar-label,.step-size-label{font-size:9px;letter-spacing:.07em;font-weight:800;color:#8189a5;margin-right:4px;white-space:nowrap}.tool-toggle{background:none;border:1px solid transparent;color:#939cb6;font-size:11px;padding:6px 8px;border-radius:5px;white-space:nowrap}.tool-toggle.active{background:#342b50;border-color:#5e448a;color:#d7bdff}.tool-divider{width:1px;height:21px;background:#3a4055;margin:0 8px}.tiny-select{width:78px;font-size:11px;padding:5px 24px 5px 8px;border-radius:5px}.tool-plain{border:0;background:none;color:#8c95b0;font-size:11px;padding:6px;white-space:nowrap}.tool-plain:hover{color:white}.tool-plain.danger-hover:hover{color:#ff9a9a}.roll-outer{margin:0 26px;border:1px solid #34394f;border-radius:8px;overflow:hidden;background:#121623}.piano-scroll{height:490px;overflow:auto;overscroll-behavior:contain;scrollbar-color:#4a4661 #1a1d2c;scrollbar-width:thin}.roll-inner{display:flex;width:max-content;min-height:100%;position:relative}.piano-keyboard{position:sticky;left:0;z-index:2;width:65px;min-width:65px;flex-shrink:0;box-shadow:5px 0 14px #090a134f;background:#1a1f2c}.key-header{height:28px;border-bottom:1px solid #353d52;text-align:center;padding:7px 0;color:#717a93;font-size:9px;font-weight:700;letter-spacing:.04em;background:#1d2030}.piano-key{height:19px;width:65px;border-bottom:1px solid #292e3e;color:#8f9ab3;text-align:right;padding-right:9px;font-size:10px;line-height:18px;position:relative;background:#e0e4f0;color:#475065;font-weight:700}.piano-key.black{background:#232b3c;color:#b8c0d5;border-bottom-color:#101827}.piano-key.c{border-bottom:2px solid #6b7597}.piano-key span{position:relative;z-index:1}.piano-keyboard:before{content:'';position:absolute;width:1px;height:100%;right:0;background:#4b566e;z-index:2}#pianoCanvas{display:block;cursor:crosshair;touch-action:pan-x pan-y}.piano-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10px;color:#858ea9;margin:9px 26px 22px}.shortcut-badge{border:1px solid #394059;background:#25293c;border-radius:4px;font-weight:800;color:#aeb5ce;font-size:8px;padding:1px 4px;margin-left:7px}.shortcut-badge:first-child{margin-left:0}#noteInfo{color:#b29be6;white-space:nowrap}.harmony-card{background:#171b2a;border:1px solid #30354b;border-radius:9px;margin:0 26px 14px;padding:13px 15px}.harmony-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.harmony-heading>div{display:flex;align-items:center;gap:8px}.harmony-heading strong{font-size:10px;letter-spacing:.08em;color:#b7bdd3}.harmony-icon{font-size:15px;color:var(--mint)}#progressionName{color:#8a94aa;font-size:10px}.chord-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.chord-pill{background:#262c3e;border:1px solid #373f56;border-radius:6px;padding:5px 12px;color:#d8e6f4;font:600 12px var(--display)}.export-panel{margin:0 26px 23px;border:1px solid #514176;background:linear-gradient(120deg,#241d39,#1d2032 75%);padding:14px;border-radius:9px;display:flex;align-items:center;justify-content:space-between;gap:12px}.export-panel-copy{display:flex;align-items:center;gap:10px}.export-icon{background:#8b65f62a;color:#c39fff;border:1px solid #7854c052;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font-size:20px}.export-panel-copy strong,.export-panel-copy span:not(.export-icon){display:block}.export-panel-copy strong{font-size:12px;color:#ece8fa}.export-panel-copy div span{font-size:10px;color:#a5a0bb;margin-top:4px}.export-button{background:#9b73f0;border:1px solid #ae8df8;color:white;font-size:11px;font-weight:800;padding:11px 13px;border-radius:7px;white-space:nowrap}.export-button:hover{background:#ae8af7}.export-button>span{color:#e6d8ff;font-size:10px;margin-left:3px}.studio-footnote{color:#838ca4;display:flex;justify-content:space-between;gap:20px;font-size:11px;padding:14px 4px}.studio-footnote>span:first-child{display:flex;align-items:center;gap:9px}.features-section{padding:120px 0 100px}.features-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-top:38px}.features-head h2,.faq-layout h2{font:700 clamp(32px,4vw,54px)/1.15 var(--display);letter-spacing:-.065em;margin:0}.features-head h2 em{font-style:normal;color:var(--violet)}.features-head p{max-width:270px;color:#a1a7bf;line-height:1.7;font-size:13px}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}.feature-card{position:relative;background:#121622;border:1px solid #2a3045;border-radius:12px;padding:22px;min-width:0}.feature-no{color:#767c97;font:700 12px var(--display)}.feature-art{height:135px;background:radial-gradient(ellipse,#7853b923,transparent 75%);display:flex;justify-content:center;align-items:center;overflow:hidden}.art-wave{display:flex;gap:6px;align-items:center;height:75px}.art-wave i{width:8px;height:30%;background:linear-gradient(#b88cff,#6367f6);border-radius:3px;box-shadow:0 0 20px #8c60ee53}.art-wave i:nth-child(3n){height:85%}.art-wave i:nth-child(4n){height:52%}.art-wave i:nth-child(5n){height:100%;background:linear-gradient(#5cedc5,#587bc5)}.art-wave i:nth-child(7n){height:15%}.mini-grid{width:225px;height:85px;background:repeating-linear-gradient(90deg,transparent 0 27px,#42415a33 28px 29px),repeating-linear-gradient(0deg,transparent 0 17px,#42415a33 18px 19px);position:relative;border:1px solid #3b3c57}.mini-grid i{position:absolute;display:block;background:#9a75f7;height:13px;border-radius:3px}.mini-grid i:nth-child(1){width:49px;top:10px;left:10px}.mini-grid i:nth-child(2){width:25px;top:28px;left:67px}.mini-grid i:nth-child(3){width:55px;top:45px;left:98px;background:#5cdccb}.mini-grid i:nth-child(4){width:31px;top:11px;left:155px}.mini-grid i:nth-child(5){width:35px;top:62px;left:40px;background:#5cdccb}.mini-grid i:nth-child(6){width:26px;top:28px;left:191px}.file-icon{font:700 25px var(--display);color:#d7c6ff;border:2px solid #9b7add;border-radius:11px;padding:16px 21px;position:relative;box-shadow:0 8px 40px #8b6af11d}.file-icon span{position:absolute;font-size:15px;background:var(--mint);border-radius:50%;color:#12352b;right:-18px;bottom:-12px;width:32px;height:32px;display:grid;place-items:center}.feature-card h3{font:700 20px var(--display);letter-spacing:-.025em;margin:8px 0 9px}.feature-card p{font-size:12px;line-height:1.7;color:#9a9fb8;margin:0}.faq-section{padding:10px 0 130px}.faq-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:70px;margin-top:40px}.faq-layout h2 span{color:var(--mint)}.faq-layout>div>p{color:#8e98b3;margin-top:18px}.faq-list{border-top:1px solid #313449}.faq-list details{border-bottom:1px solid #303347;padding:19px 3px}.faq-list summary{cursor:pointer;list-style:none;font:600 14px var(--display);display:flex;align-items:center;justify-content:space-between;gap:10px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';font-size:21px;color:var(--violet)}.faq-list details[open] summary:after{content:'−'}.faq-list details p{margin:14px 32px 4px 0;color:#9ba2ba;line-height:1.75;font-size:12px}.footer{display:flex;justify-content:space-between;gap:24px;align-items:center;border-top:1px solid #25293c;padding:30px 0 40px;color:#8088a3;font-size:11px}.footer>div{display:flex;align-items:center;gap:20px}.footer-brand{font:700 23px var(--display);letter-spacing:-1.3px;color:white}.footer-brand span{color:var(--violet)}.footer>div:last-child a{color:#e4d7ff}.modal-backdrop{position:fixed;inset:0;z-index:100;background:#04050ad9;backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px}.hidden{display:none!important}.modal{width:min(540px,100%);max-height:90vh;overflow:auto;background:#1a1d2d;border:1px solid #47425c;border-radius:14px;padding:22px;box-shadow:0 20px 80px #000a}.modal-header{display:flex;align-items:start;justify-content:space-between;gap:15px}.modal-eyebrow{font-size:10px;letter-spacing:.11em;color:#a68beb;font-weight:800}.modal h2{font:700 25px var(--display);margin:6px 0 0}.modal-close{background:#2b3045;border:1px solid #424860;color:#ccd0e4;border-radius:7px;padding:6px 10px}.modal-desc{font-size:12px;color:#9ca5ba;margin:12px 0 20px}.saved-projects{display:flex;flex-direction:column;gap:8px;max-height:330px;overflow-y:auto}.saved-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #363d53;border-radius:9px;padding:12px;background:#202437}.saved-row>div:first-child{min-width:0}.saved-row strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.saved-row small{color:#8e97ae}.saved-row-actions{display:flex;gap:5px;flex-shrink:0}.saved-row-actions button{border:1px solid #4a4b64;background:#34304d;color:#d0c6f2;border-radius:5px;padding:6px 9px;font-size:11px}.saved-row-actions .delete-project{background:#452b3b;color:#f4a5b3}.empty-projects{text-align:center;color:#9099b2;padding:30px 12px;border:1px dashed #434760;border-radius:8px}.modal-footer{display:flex;gap:9px;margin-top:20px;flex-wrap:wrap}.toast-container{position:fixed;bottom:22px;right:22px;z-index:200;display:flex;flex-direction:column;gap:8px}.toast{background:#252a3b;border:1px solid #585172;color:#f3edff;padding:11px 17px;box-shadow:0 10px 40px #0007;border-radius:9px;font-size:12px;font-weight:700;max-width:340px;animation:toast-in .2s ease}.toast.error{border-color:#bb657d;color:#ffd5de}.toast.success{border-color:#55b79d}.toast.removing{animation:toast-out .2s ease forwards}@keyframes toast-in{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes toast-out{to{transform:translateY(12px);opacity:0}}
@media(max-width:1250px){.app{padding:0 30px}.studio-layout{grid-template-columns:265px minmax(0,1fr)}.control-panel{padding:22px 15px}.project-head{padding:21px 19px 16px}.transport,.tracks,.roll-outer,.harmony-card,.export-panel{margin-left:18px;margin-right:18px}.edit-toolbar{margin-left:18px;margin-right:18px}.piano-footer{margin-left:18px;margin-right:18px}.project-actions .light-button{padding:8px}.toolbar-label{display:none}.feature-grid{gap:12px}}
@media(max-width:960px){.app{padding:0 22px}.topnav{display:none}.hero{min-height:auto;padding:85px 0 70px}.hero-glow-decoration{opacity:.3;right:-50px}.studio-layout{grid-template-columns:1fr}.control-panel{border-right:0;border-bottom:1px solid #34354b;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px;padding:23px}.panel-title{grid-column:1/-1;margin-bottom:0}.panel-group{margin:0;padding:0 0 12px}.genre-grid{grid-template-columns:repeat(3,1fr)}.switches{border-bottom:0}.generator-bottom{align-self:center}.workspace{padding-bottom:5px}.piano-scroll{height:450px}.features-section{padding-top:85px}.faq-layout{gap:28px}}
@media(max-width:700px){.app{padding:0 14px}.topbar{height:69px}.logo{font-size:22px}.brand-mark{height:34px;width:34px}.head-chip{display:none}.nav-cta{padding:9px 12px}.hero{padding:70px 6px 60px}.hero h1{font-size:clamp(40px,9vw,66px)}.hero p{font-size:14px}.hero-kicker{font-size:9px;gap:8px}.hero-metrics{gap:26px;margin-top:47px}.hero-glow-decoration{display:none}.studio-layout{display:block}.control-panel{display:grid;grid-template-columns:1fr 1fr;padding:18px;gap:12px}.panel-title{grid-column:1/-1}.panel-group{padding:0 0 12px;margin:0}.panel-group:nth-of-type(1){grid-column:1/-1}.panel-group.switches{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:0;padding-bottom:0}.switch-row{margin-bottom:12px}.generator-bottom{grid-column:1/-1;width:100%}.project-head{flex-wrap:wrap;gap:12px;padding:18px 13px}.project-title-block input{font-size:20px}.project-actions{width:100%;justify-content:flex-start}.transport,.tracks,.roll-outer,.harmony-card,.export-panel{margin-left:11px;margin-right:11px}.edit-toolbar{margin-left:11px;margin-right:11px;flex-wrap:wrap}.piano-footer{margin-left:11px;margin-right:11px;flex-wrap:wrap}.transport{padding:9px;gap:6px}.transport-main,.transport-extras{gap:7px}.transport-bpm b,.transport-position b{font-size:14px}.transport-sep{margin:0 1px}.volume-wrap{display:none}.track-mode{display:none}.track-tabs{gap:0}.track-tab{padding-left:10px;padding-right:10px;font-size:11px}.piano-scroll{height:400px}.harmony-card{padding:12px}.export-panel{flex-direction:column;align-items:stretch}.export-button{align-self:stretch}.studio-footnote{flex-wrap:wrap;font-size:10px}.features-head{display:block}.features-head p{max-width:none}.feature-grid{grid-template-columns:1fr}.feature-art{height:112px}.faq-layout{grid-template-columns:1fr;gap:15px}.features-section{padding:75px 0}.faq-section{padding-bottom:75px}.footer{flex-direction:column;align-items:flex-start}.footer>div{flex-wrap:wrap}.window-topbar{padding:0 12px}.window-right{gap:8px}.saved-indicator{max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
@media(max-width:420px){.hero-actions{flex-direction:column;align-items:flex-start;gap:13px}.hero-metrics{gap:17px}.hero-metrics strong{font-size:23px}.control-panel{grid-template-columns:1fr}.panel-group:nth-of-type(1),.panel-group.switches,.generator-bottom{grid-column:auto}.genre-grid{grid-template-columns:repeat(3,1fr)}.project-actions{gap:5px}.project-actions .light-button{font-size:10px}.transport-position{display:none}.track-tab{gap:4px;padding-left:7px;padding-right:7px}.tool-right{margin-left:auto}.window-title{gap:7px}.window-version{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* -------------------------------------------------------
   MIDILAB / Sessions — v2 art direction
   A warm, tactile music workspace: ink, bone, ochre and clay.
   No stock gradients, glassmorphism or artificial dashboards.
   ------------------------------------------------------- */
:root{--paper:#f5f0e6;--paper-2:#ede7dc;--ink:#1c2521;--clay:#db684c;--acid:#d8e89e;--border-paper:#d6d1c6;--purple:#d97157;--violet:#f3a47d;--mint:#d8e89e;--display:Arial,'Helvetica Neue',sans-serif}
body{background:var(--paper);color:var(--ink)}
body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.115;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.ambient{display:none}.app{max-width:1510px;padding:0 clamp(20px,4.3vw,68px)}
.topbar{height:86px;border-bottom:1px solid #1c25212e}.logo{color:#1e251f;font-size:23px;font-weight:900;letter-spacing:-1.7px}.brand-mark{background:#1d2823;box-shadow:none;border-radius:100%;transform:rotate(-8deg)}.brand-mark svg{color:#f6f0e4}.logo-accent{font-weight:900}.logo-dot{font:700 9px Arial;vertical-align:top;margin-left:3px;color:var(--clay)}
.topnav{gap:30px;color:#4f554c;font-size:12px;font-weight:750}.topnav a{transition:color .25s}.topnav a:hover,.footer a:hover{color:var(--clay)}.head-chip{color:#56604f;font-size:10px}.status-dot{background:var(--clay);box-shadow:none}.nav-cta{background:#1e2823;color:#f7f1e6;border:1px solid #1e2823;padding:11px 18px;border-radius:100px;letter-spacing:.01em;transition:transform .25s,background .25s}.nav-cta:hover{background:var(--clay);transform:translateY(-2px)}.nav-cta span{color:var(--acid)}
.hero{min-height:660px;padding:115px 0 60px;isolation:isolate}.hero-kicker{color:#565d55;letter-spacing:.14em;font-size:10px}.sparkle{color:var(--clay)}.kicker-line{background:#897d6b}.hero h1{font-family:Arial,'Helvetica Neue',sans-serif;font-weight:900;color:var(--ink);max-width:950px;font-size:clamp(55px,6.9vw,106px);letter-spacing:-.087em;line-height:.99;margin:26px 0 27px}.hero h1>span:first-child{font:italic 400 .98em Georgia,'Times New Roman',serif;letter-spacing:-.07em;background:none;color:var(--clay)}.hero-period{font:italic .6em Georgia;color:var(--clay);display:inline-block;transform:translate(4px,-22px)}.hero p{color:#58635b;font-size:16px;line-height:1.75;max-width:510px}.hero p strong{color:#17291e}.hero-actions{margin-top:29px}.primary-link{background:#1e2823;border:1px solid #1e2823;box-shadow:none;border-radius:100px;padding:15px 21px;min-width:202px;color:white;transition:transform .23s,background .23s;letter-spacing:.01em}.primary-link:hover{background:#d9654b;filter:none;transform:translateY(-2px)}.primary-link span{color:var(--acid)}.hero-sub{color:#5b645a}.tiny-check{color:var(--clay)}.hero-metrics{margin-top:75px;gap:54px}.hero-metrics strong{font:800 28px/1.1 Arial;color:#222c24;letter-spacing:-.05em}.hero-metrics span{color:#656a61;font-size:11px}
.hero-vinyl-wrap{position:absolute;width:min(370px,29vw);height:min(390px,31vw);right:1%;top:88px;z-index:-1;transform:rotate(10deg)}.vinyl-disc{width:100%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle at 50% 50%,#232c26 0 3px,#28332c 3px 4px,#19221e 5px 7px);border:6px solid #17211a;box-shadow:15px 25px 65px #111b1740,inset -8px -7px 25px #0005;display:grid;place-items:center;animation:vinyl-turn 22s linear infinite;position:relative}.vinyl-disc:before{content:'';position:absolute;inset:6%;border-radius:50%;border:1px solid #bac7a31c;box-shadow:inset 0 0 0 24px #ffffff05}.vinyl-label{width:45%;aspect-ratio:1;background:#e2a488;border:7px solid #ca8c73;border-radius:50%;color:#273329;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:5px;transform:rotate(-14deg)}.vinyl-label span,.vinyl-label small{font:800 7px/1.2 monospace;letter-spacing:.08em}.vinyl-label strong{font:italic bold clamp(18px,2.8vw,36px)/.82 Georgia;letter-spacing:-.04em}.vinyl-shadow{position:absolute;inset:15% 4% -11% 8%;filter:blur(34px);background:#10191250;border-radius:50%}.hero-sticker{position:absolute;right:-10px;bottom:-5px;transform:rotate(13deg);width:110px;height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--acid);color:#233129;border:1px solid #26322c;border-radius:50%;font:900 13px/1.1 Arial;letter-spacing:-.04em;box-shadow:3px 6px 0 #263129;animation:sticker-float 6s ease-in-out infinite}.hero-sticker span{font-size:23px;margin-top:5px}
@keyframes vinyl-turn{to{transform:rotate(360deg)}}@keyframes sticker-float{50%{transform:rotate(7deg) translateY(-6px)}}
.section-label{color:#595f53;letter-spacing:.12em;font-size:10px}.label-index{color:#bd6447}.label-rule{background:#222a1f2d}.studio-running{color:#626e61}.live-indicator,.pulse-small{background:#cf7657;box-shadow:none}
.studio-section{position:relative;margin-top:12px}.studio-window{background:#1a211e;border:1px solid #1c2922;border-radius:18px;box-shadow:12px 20px 0 #dcd5c7,0 20px 75px #15201626}.window-topbar{background:#252c27;border-color:#3d453f}.window-version{background:#38423a;border-color:#4b544b;color:#c8d9b3}.mac-dots i{background:#df8b68}.mac-dots i:nth-child(2){background:#dfc17c}.mac-dots i:nth-child(3){background:#b0cf8f}.control-panel{background:#242b26;border-color:#3f463e}.workspace{background:#1c221f}.genre{background:#303831;border-color:#464e44;color:#c0c6b8}.genre:hover{border-color:#eab48f}.genre.active{background:#473b30;border-color:#e9a584;color:#ffcca9;box-shadow:inset 0 0 0 1px #bd87633a}.form-select,.tiny-select{background-color:#303931;border-color:#51594b}.switch-row input:checked+.switch-ui{background:#d9795b}.panel-title-icon{background:#66442b55;border-color:#cc916855;color:#f1b68e}.generate-button{background:#e2a27c;color:#233029;border-radius:8px;box-shadow:none}.generate-button:hover{background:#f1b28c;filter:none}.generate-arrow{color:#293429}.custom-range{accent-color:#e8ab85}.custom-range::-webkit-slider-thumb{border-color:#f5c499;background:#d97d60;box-shadow:none}.track-tab.active{border-color:#e0a67f}.project-title-block input:focus{border-color:#da9875}.play-button{background:#de9976}.export-panel{background:#d9e6af;border:1px solid #acbd82;border-radius:12px;padding:15px 16px;gap:20px}.export-icon{background:#223528!important;color:#e2e9b9!important;border-radius:50%!important}.export-panel-copy strong{color:#253026;font-size:13px}.export-panel-copy div span{color:#596b4b;font-size:11px}.export-actions{display:flex;gap:7px;flex-wrap:wrap}.export-button{padding:12px 13px;border-radius:8px;font-weight:800;background:#27352b;border:1px solid #27352b;color:#f6f5ec;transition:transform .2s,background .2s}.export-button:hover{background:#4b6651;transform:translateY(-2px)}.export-button>span{color:#c8d9ba}.export-audio{background:#fffdf5;color:#263329;border-color:#aab69c}.export-audio>span{color:#68805f}.export-audio:hover{background:#f1f4dc}.export-note{font-size:10px;color:#99a592;margin:-13px 26px 26px;min-height:1.7em}.studio-footnote{color:#667167}
/* The sample crate: a real playable library that also feels like a record drawer. */
.sample-section{padding:135px 0 85px}.editorial-head{display:flex;justify-content:space-between;align-items:end;gap:48px;margin:38px 0 35px}.little-eyebrow{font:800 10px Arial;letter-spacing:.17em;color:#ae694f}.editorial-head h2{font:900 clamp(45px,5.3vw,76px)/.98 Arial;letter-spacing:-.08em;color:#202a24;margin:14px 0 0}.editorial-head h2 em{font:italic 400 1.04em Georgia;letter-spacing:-.06em;color:var(--clay)}.editorial-aside{max-width:360px}.editorial-aside p{color:#60665b;font-size:14px;line-height:1.75;margin:0 0 22px}.free-pack-button{display:inline-flex;align-items:center;gap:15px;border-bottom:1px solid #242d25;padding:6px 0 10px;font-size:12px;font-weight:800;color:#27342c;transition:gap .2s}.free-pack-button:hover{gap:22px}.free-pack-button span{font-size:9px;color:#a15a42;border:1px solid #ccbaa5;border-radius:20px;padding:3px 7px}
.crate-panel{background:#faf8f3;border:1px solid #d7d1c2;border-radius:15px;box-shadow:6px 6px 0 #e5dfd3;overflow:hidden}.crate-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:22px 27px;border-bottom:1px solid #ded9cb}.crate-title{font:900 16px Arial;letter-spacing:-.04em;display:flex;align-items:center;gap:11px}.crate-title small{font:700 9px monospace;color:#9b9d8f;letter-spacing:0;margin-left:8px}.crate-mark{font-size:23px;color:#d76b4d}.sample-filters{display:flex;gap:6px;flex-wrap:wrap}.filter-pill{border-radius:100px;border:1px solid #dad9ce;background:transparent;color:#666c61;padding:7px 14px;font-size:11px;font-weight:700;transition:background .2s,color .2s}.filter-pill.active,.filter-pill:hover{background:#26332a;border-color:#26332a;color:white}.sample-item{display:grid;grid-template-columns:38px 66px minmax(150px,1.2fr) minmax(90px,1.6fr) 74px;align-items:center;gap:16px;padding:12px 27px;border-bottom:1px solid #e7e1d6;transition:background .2s}.sample-item:last-child{border-bottom:0}.sample-item:hover{background:#f3f0e7}.listen-sample{width:36px;height:36px;display:grid;place-items:center;border:1px solid #d4cec3;border-radius:50%;color:#2c382e;background:#f2f0e8;padding:0;font-size:11px;transition:transform .2s,background .2s}.listen-sample:hover,.listen-sample.active{background:#dfc8a9;transform:scale(1.06)}.listen-sample.active{font-size:8px}.sample-type{color:#918a7a;font:800 9px monospace;letter-spacing:.1em}.sample-info{display:flex;flex-direction:column;gap:2px;min-width:0}.sample-info strong{font-size:13px;color:#263129;letter-spacing:-.02em}.sample-info small{font-size:10px;color:#8e8e82}.sample-wave{height:28px;display:flex;align-items:center;gap:2px;overflow:hidden;mask-image:linear-gradient(90deg,#000 70%,transparent)}.sample-wave i{width:3px;min-width:3px;border-radius:3px;background:#b4b5a5;transition:background .2s}.sample-item:hover .sample-wave i{background:#d58864}.sample-download{text-align:center;border-radius:6px;border:1px solid #ccc9bc;background:#fff;padding:8px 6px;color:#31392f;font:900 10px Arial;transition:background .2s}.sample-download:hover{background:#dae7b3}.crate-footer{padding:16px 27px;background:#eeeae0;color:#838575;font-size:10px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
/* Album sleeves rather than SaaS pricing cards. */
.packs-section{padding:90px 0 95px}.pack-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.pack-card{overflow:hidden;border:1px solid #d5d0c3;border-radius:16px;background:#fbf9f3;transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .3s}.pack-card:hover{transform:translateY(-6px);box-shadow:9px 12px 0 #e2dccd}.pack-art{height:310px;position:relative;overflow:hidden;isolation:isolate;padding:24px;display:flex;flex-direction:column;justify-content:space-between}.pack-night .pack-art{background:#3d4a3a;color:#e7f1ce}.pack-slow .pack-art{background:#dd9b87;color:#462e2a}.pack-art:before{content:'';position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(0deg,transparent 0 17px,#ffffff0b 18px 19px);opacity:.55}.pack-art-top{display:flex;justify-content:space-between;font:800 10px/1.3 monospace;letter-spacing:.1em}.pack-art-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:15px}.pack-art-bottom strong{font:900 clamp(62px,6.4vw,100px)/.81 Arial;letter-spacing:-.085em;z-index:2}.pack-art-bottom span{font:800 11px monospace;writing-mode:vertical-rl;letter-spacing:.18em}.pack-art-shape{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;transform:translateX(25%);opacity:.74}.pack-art-shape i{width:215px;height:215px;border:1px solid currentColor;border-radius:50%;position:absolute;transform:rotate(-25deg) scaleX(1.3)}.pack-art-shape i:nth-child(2){width:170px;height:170px}.pack-art-shape i:nth-child(3){width:125px;height:125px}.pack-art-shape i:nth-child(4){width:80px;height:80px}.pack-art-shape i:nth-child(5){width:35px;height:35px;background:currentColor}.pack-night .pack-art-shape{animation:cover-spin 18s linear infinite}.pack-slow .pack-art-shape{animation:cover-float 7s ease-in-out infinite}.pack-slow .pack-art-shape i{border-radius:25%;transform:rotate(-25deg) scaleX(1.3)}
@keyframes cover-spin{to{transform:translateX(25%) rotate(360deg)}}@keyframes cover-float{50%{transform:translate(25%,-12px) rotate(7deg)}}
.pack-details{padding:23px 25px 25px}.pack-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font:800 10px monospace;color:#808576}.pack-meta>span:not(.pack-price){border:1px solid #ddd7c9;border-radius:4px;padding:5px 7px}.pack-meta .pack-price{margin-left:auto;font-size:15px;color:#2e3b2b}.pack-details h3{font:900 31px/1 Arial;letter-spacing:-.065em;margin:17px 0 10px}.pack-details p{font-size:13px;color:#6b6d64;line-height:1.65;margin:0 0 21px;min-height:43px}.pack-actions{display:flex;gap:9px;flex-wrap:wrap}.pack-actions button{border:1px solid #bdc6b7;background:#fff;border-radius:8px;padding:12px 14px;font-size:12px;font-weight:800;transition:transform .2s,background .2s}.pack-actions button:hover{transform:translateY(-2px)}.pack-actions .listen-pack{background:#26352b;color:white;border-color:#26352b}.pack-actions .listen-pack.active{background:#b56d51}.pack-actions .buy-pack{background:#e8e5d9;color:#64675b;border-color:#e8e5d9}.pack-disclaimer{display:flex;align-items:flex-start;gap:12px;padding:20px 5px 0;color:#74796e;font-size:11px;line-height:1.6}.pack-disclaimer span{color:var(--clay);font-size:21px;line-height:1}
/* Editorial lower sections */
.features-section{padding:95px 0 110px}.features-head h2,.faq-layout h2{font:900 clamp(40px,4.8vw,63px)/1.06 Arial;letter-spacing:-.075em;color:#26312a}.features-head h2 em{font:italic 400 1.02em Georgia;color:var(--clay)}.features-head p,.faq-layout>div>p{color:#707569}.feature-card{background:#eae6da;border:1px solid #dad2c2;border-radius:14px;color:#2d392e}.feature-card h3{color:#253227}.feature-card p{color:#696e63}.faq-list{border-color:#d3ccbf}.faq-list details{border-color:#d3ccbf}.faq-list summary{color:#243129}.faq-list details p{color:#687063}.faq-layout h2 span,.faq-list summary:after{color:#c97659}.footer{border-color:#c8c7b9;color:#777e70}.footer-brand{color:#1e2b23}.footer-brand span{color:var(--clay)}.footer>div:last-child a{color:#39473b}
/* Motion has a purpose: small, quiet entrances. */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.18,.76,.22,1)}.reveal.in-view{opacity:1;transform:translateY(0)}
@media(max-width:1200px){.hero-vinyl-wrap{right:-3%;top:130px;opacity:.85}.hero h1{max-width:840px}.studio-layout{grid-template-columns:260px minmax(0,1fr)}.export-panel{flex-wrap:wrap}.export-actions{width:100%}}
@media(max-width:960px){.studio-layout{grid-template-columns:1fr}.hero-vinyl-wrap{opacity:.34;top:155px}.hero h1{max-width:780px}.editorial-head{align-items:start}.pack-art{height:255px}.pack-art-bottom strong{font-size:clamp(50px,7vw,74px)}.export-actions{width:auto}}
@media(max-width:700px){.app{padding:0 17px}.topbar{height:71px}.hero{padding:83px 0 75px;min-height:560px}.hero h1{font-size:clamp(50px,10.3vw,76px)}.hero-vinyl-wrap{width:235px;height:235px;top:230px;right:-34px;opacity:.15}.hero-sticker{display:none}.hero-metrics{margin-top:63px;gap:25px}.hero-metrics strong{font-size:25px}.studio-window{box-shadow:5px 8px 0 #dfd8cb}.window-topbar{padding:0 12px}.control-panel{grid-template-columns:1fr 1fr}.sample-section{padding:93px 0 48px}.packs-section{padding:58px 0 70px}.editorial-head{display:block;margin:29px 0}.editorial-head h2{font-size:clamp(40px,10.2vw,67px)}.editorial-aside{margin-top:20px;max-width:100%}.crate-toolbar{padding:17px 14px}.crate-title small{display:none}.sample-item{grid-template-columns:34px minmax(95px,1fr) 62px;gap:9px;padding:11px 14px}.sample-type,.sample-wave{display:none}.sample-info strong{font-size:12px}.sample-info small{font-size:10px}.sample-download{font-size:10px}.crate-footer{padding:13px 15px}.pack-grid{grid-template-columns:1fr;gap:20px}.pack-art{height:280px}.pack-art-bottom strong{font-size:clamp(63px,14vw,90px)}.pack-details{padding:20px}.export-panel{margin-left:11px;margin-right:11px}.export-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.export-button{padding:11px 4px;font-size:10px;min-width:0;white-space:nowrap}.export-button span{display:none}.export-note{margin:-11px 11px 23px}.features-section{padding:60px 0}.faq-section{padding-bottom:80px}}
@media(max-width:420px){.hero h1{font-size:48px}.hero-metrics{gap:20px}.control-panel{grid-template-columns:1fr}.export-button{font-size:10px}.genre-grid{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){.vinyl-disc,.hero-sticker,.pack-art-shape{animation:none!important}.reveal{opacity:1;transform:none;transition:none}}
/* Hand-tuned small illustrations in the explainer */
.feature-art{background:radial-gradient(ellipse at center,#d7d1be 0,#eae6da 75%)}
.art-wave i{background:linear-gradient(#d97c5a,#edb487);box-shadow:none}
.art-wave i:nth-child(5n){background:linear-gradient(#829667,#bbca9b)}
.mini-grid{border-color:#bfb9a7;background:repeating-linear-gradient(90deg,transparent 0 27px,#aab19b33 28px 29px),repeating-linear-gradient(0deg,transparent 0 17px,#aab19b33 18px 19px)}
.mini-grid i{background:#dc9478}.mini-grid i:nth-child(3),.mini-grid i:nth-child(5){background:#91a57b}
.file-icon{color:#2b3e2f;border-color:#829777;box-shadow:none}.file-icon span{background:#ddab87}
