.chords-visual>div{display:flex;gap:7px;justify-content:center}.chords-visual b{display:block;background:#fafafa;border:1px solid #d7d7d7;padding:18px 12px;width:64px;font-size:15px;font-weight:500;box-shadow:none}.chords-visual b:nth-child(2){background:#222;color:white;border-color:#222;transform:translateY(-8px);box-shadow:none}.chords-visual small{display:block;font-size:9px;font-weight:400;margin-top:10px;opacity:.5}.melody-visual{background:#202020;color:#fff}.melody-visual>span,.melody-visual>p{color:#aaa}.note-line{position:relative;display:flex;justify-content:space-between;gap:9px;height:86px;align-items:center;background:repeating-linear-gradient(0deg,transparent 0 20px,#ffffff12 20px 21px)}.note-line i{background:#d9d9d9;width:39px;height:25px;color:#343434;display:grid;place-items:center;font-style:normal;font-size:10px;border-radius:3px}.note-line i:nth-child(2){transform:translateY(-15px)}.note-line i:nth-child(3){transform:translateY(-30px)}.note-line i:nth-child(4){transform:translateY(-15px)}.rhythm-visual>div{display:flex;align-items:center;justify-content:center;gap:8px;height:90px}.rhythm-visual i{display:block;background:#444;width:12px;height:35px;border-radius:2px}.rhythm-visual i:nth-child(3n){height:75px}.rhythm-visual i:nth-child(2n){height:50px;background:#929292}.demo{background:#fff;border:1px solid #d5d5d5;padding:26px;border-radius:7px;box-shadow:0 20px 50px #00000008}.demo-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.09em;color:#777;gap:12px}.demo-top i{display:inline-block;width:5px;height:5px;background:#555;border-radius:50%;margin-right:5px}.style-picker{display:flex;gap:6px;margin:26px 0}.style-picker button{background:transparent;border:1px solid #dadada;text-align:left;padding:12px;flex:1;color:#555;font-size:13px;border-radius:3px}.style-picker button span{display:block;font-size:8px;margin-top:5px;opacity:.6}.style-picker button[aria-pressed=true]{background:#232323;border-color:#232323;color:white}.demo-chords{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:26px}.demo-chords>div{border:1px solid #dcdcdc;border-radius:3px;padding:12px;transition:background .15s}.demo-chords small{display:block;font-size:8px;color:#999}.demo-chords strong{display:block;font-size:32px;letter-spacing:-.04em;font-weight:400;margin:15px 0 7px}.demo-chords span{font-size:8px;color:#888}.demo-chords .active{background:#e1e1e1;border-color:#929292}.keyboard{position:relative;display:flex;height:115px;border:4px solid #242424;border-top-width:11px;background:#242424;border-radius:3px;overflow:hidden}.key{background:#fff;border:1px solid #c9c9c9;flex:1;border-radius:0 0 3px 3px}.key.black{position:absolute;top:0;width:2.8%;height:64%;background:#222;border-color:#111;z-index:1;box-shadow:0 4px 0 #555}.key.active{background:#b7b7b7}.key.black.active{background:#7e7e7e;box-shadow:0 4px 0 #676767}.demo-controls{display:flex;align-items:center;gap:13px;padding-top:24px}.demo-controls button{border:0;background:#222;color:white;width:43px;height:43px;border-radius:50%;font-size:12px}.demo-controls strong{display:block;font-size:11px;font-weight:500}.demo-controls div>span{display:block;color:#999;font-size:9px;margin-top:4px}.demo-duration{margin-left:auto;font-size:8px;letter-spacing:.09em;color:#888}.demo-duration span{font-size:18px;margin-left:9px}
/* Shared landing styles above own the typography, hero, navigation, buttons and sections. */
.impro-landing .intro-strip strong{font-weight:550;color:#111}
.impro-step-visual{height:230px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;border-radius:11px;background:#eee;overflow:hidden}
.impro-step-visual>span{font-size:9px;letter-spacing:.12em;color:#777}
.impro-step-visual>p{font-size:11px;color:#777;margin:0}
.impro-step-visual.melody-visual{background:#161616;color:#fff}
.impro-step-visual.melody-visual>span,.impro-step-visual.melody-visual>p{color:#aaa}
.impro-landing .step>.eyebrow{display:block;color:#777;font-size:9px;letter-spacing:.12em;margin-top:27px}
.impro-landing .step>h3{margin-top:12px}
.impro-landing .experience-heading{padding-top:0;align-self:center}
.impro-landing .experience-heading .demo-note{font-size:11px}
.impro-landing .impro-demo{background:#111;color:#fff;border-color:#2a2a2a;border-radius:18px;padding:28px;box-shadow:0 26px 70px #00000024}
.impro-landing .demo-top{color:#bbb}.impro-landing .style-picker button{color:#ddd;border-color:#555;border-radius:100px;text-align:center}.impro-landing .style-picker button[aria-pressed=true]{background:#fff;color:#111;border-color:#fff}
.impro-landing .demo-chords>div{border-color:#444;border-radius:10px}.impro-landing .demo-chords small,.impro-landing .demo-chords span{color:#aaa}.impro-landing .demo-chords .active{background:#333;border-color:#ddd}
.impro-landing .demo-controls button{background:#fff;color:#111}.impro-landing .demo-controls div>span{color:#aaa}
.impro-landing .impro-possibilities{padding-top:0;padding-bottom:100px;border-top:0}.impro-landing .impro-possibilities h2{font-size:clamp(45px,4.4vw,64px);font-weight:560;letter-spacing:-.06em;line-height:1.04;margin:20px 0 40px}
.impro-possibility-list>div{padding:30px;border-radius:11px;background:#fff}.impro-possibility-list strong{font-size:21px;font-weight:550;letter-spacing:-.04em}.impro-possibility-list p{font-size:13px;line-height:1.8;color:#666;margin:15px 0 0}
.impro-landing .faq-items summary>span{font-size:22px;font-weight:300}.impro-landing .faq-items details[open] summary>span{transform:rotate(45deg)}
@media(max-width:950px){.impro-landing .impro-demo{padding:20px}.demo-chords>div{padding:10px}.style-picker button{padding:11px 8px}.style-picker button span{font-size:7px}}
@media(max-width:650px){.impro-landing .hero-source-links a{font-size:9px}.impro-landing .intro-strip{padding:30px 0}.impro-landing .intro-strip p{font-size:17px}.impro-landing .step{display:block}.impro-step-visual{height:220px;margin-bottom:23px}.impro-landing .step h3{font-size:23px}.impro-landing .step>p{font-size:13px}.impro-landing .impro-demo{padding:20px 14px}.demo-top{font-size:7px}.demo-chords{gap:6px}.demo-chords strong{font-size:27px}.demo-chords>div{padding:10px 8px}.keyboard{height:110px}.demo-duration{font-size:7px}.impro-landing .impro-possibilities{padding-bottom:65px}.impro-landing .impro-possibilities h2{font-size:38px}.impro-possibility-list>div{padding:25px}}

/* Keep the validated typeface, with natural spacing for easier reading. */
body.pianola-premium.impro-landing main :is(h2,h3){
  letter-spacing:-.015em;
  line-height:1.16;
}
body.pianola-premium.impro-landing .hero.editorial-hero #hero-title{
  font-size:clamp(52px,6.2vw,88px);
  letter-spacing:-.015em;
  line-height:1.12;
  font-weight:550;
}
body.pianola-premium.impro-landing :is(.hero-description,.intro-strip p,.personal-visual>p,.personal-copy p,.value-list li,.impro-possibility-list strong){
  letter-spacing:0;
}
body.pianola-premium.impro-landing .hero-description{line-height:1.65}
body.pianola-premium.impro-landing .intro-strip p{line-height:1.25}
body.pianola-premium.impro-landing .personal-visual>p{line-height:1.18}
@media(max-width:650px){
  body.pianola-premium.impro-landing .hero.editorial-hero #hero-title{
    font-size:clamp(36px,9.8vw,52px);
    line-height:1.15;
  }
}

.chord-explorer{display:grid;grid-template-columns:.85fr 1.15fr;gap:6%;align-items:center;margin-top:38px;padding:38px;border:1px solid #ddd;border-radius:12px;background:#fff}
.chord-explorer-copy .eyebrow{font-size:9px;color:#666;letter-spacing:.12em;margin:0 0 16px}
.chord-explorer-copy h3{font-size:28px;font-weight:550;margin:0 0 16px}
.chord-explorer-copy>p:not(.eyebrow){font-size:13px;line-height:1.7;color:#666;margin:0 0 22px}
.chord-explorer-copy label{display:block;font-size:11px;margin:0 0 9px;color:#555}
.chord-explorer-copy select{width:100%;min-height:48px;padding:11px 14px;border:1px solid #bbb;border-radius:5px;background:#fff;color:#111;font:inherit;font-size:14px;cursor:pointer}
.chord-explorer-instrument{min-width:0;padding:24px;background:#111;color:#fff;border-radius:12px}
.chord-explorer-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:22px}
.chord-explorer-title strong{font-size:21px;font-weight:500}.chord-explorer-title>span{font-size:12px;color:#bbb}
.chord-explorer .keyboard{height:132px;border-top-width:10px}
.chord-explorer .key{display:flex;align-items:flex-end;justify-content:center;padding-bottom:12px;font-size:10px;color:#555}
.chord-explorer .key.black{width:4.1%;font-size:8px;color:#fff;padding-bottom:7px}
.chord-explorer .key.is-chord{background:#c9c9c9;color:#111;font-weight:650;box-shadow:inset 0 -5px 0 #777}
.chord-explorer .key.black.is-chord{background:#777;color:#fff;box-shadow:inset 0 -4px 0 #aaa}
#chord-notes{font-size:15px;font-weight:500;letter-spacing:.04em;margin:20px 0 10px}
.chord-explorer-hint{font-size:10px;line-height:1.7;color:#aaa;margin:0}
.impro-landing .impro-styles{padding:0 0 100px}
.impro-styles-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:35px}
.impro-styles-heading h2{font-size:clamp(36px,4.4vw,60px);font-weight:550;margin:20px 0}
.impro-styles-heading>div>p:last-child{font-size:14px;color:#666;line-height:1.7}



.style-carousel{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#aaa transparent;padding-bottom:14px}
.style-carousel-list{display:flex;list-style:none;margin:0;padding:0;gap:16px}
.style-genre-card{flex:0 0 clamp(260px,28vw,340px);scroll-snap-align:start;min-height:320px;border:0;background:#fff;padding:26px;border-radius:11px;display:flex;flex-direction:column;color:#111}

.style-genre-card h3{font-size:37px;font-weight:550;margin:32px 0 14px}
.style-genre-card strong{font-size:14px;font-weight:500;line-height:1.5}
.style-genre-card p{font-size:12px;line-height:1.8;color:#666;margin:13px 0 25px}

.style-carousel-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:16px}.style-carousel-footer>span{font-size:10px;color:#777}
@media(max-width:950px){.chord-explorer{grid-template-columns:1fr;gap:28px;padding:28px}.chord-explorer-copy h3{font-size:27px}.chord-explorer-copy select{max-width:360px}}
@media(max-width:650px){.chord-explorer{padding:22px;margin-top:25px}.chord-explorer-instrument{padding:18px 12px}.chord-explorer .keyboard{height:115px}.chord-explorer .key{font-size:8px}.chord-explorer .key.black{font-size:6px}.impro-landing .impro-styles{padding-bottom:65px}.impro-styles-heading{align-items:flex-start;flex-wrap:wrap;gap:10px;margin-bottom:22px}.impro-styles-heading h2{font-size:35px}.impro-styles-heading>div>p:last-child{font-size:13px}.style-genre-card{flex-basis:85%;padding:24px;min-height:310px}.style-carousel-footer{align-items:flex-start;flex-direction:column;gap:12px}}

/* One continuous learning story: the method, its chord example, then styles. */
.impro-landing .impro-chord-section{padding:0 0 90px}
.impro-chord-section .chord-explorer{margin-top:0}
.chord-select-wrap{position:relative;max-width:370px}
.chord-select-wrap #chord-choice{appearance:none;-webkit-appearance:none;max-width:none;min-height:56px;padding:15px 65px 15px 22px;border:1px solid #111;border-radius:100px;background:#111;color:#fff;font-size:14px;font-weight:550;transition:background .2s}
.chord-select-wrap #chord-choice:hover{background:#333}
.chord-select-wrap #chord-choice:focus-visible{outline:2px solid #777;outline-offset:4px}
.chord-select-wrap #chord-choice option{background:#fff;color:#111}
.chord-select-chevron{position:absolute;right:9px;top:9px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;color:#111;font-size:24px;line-height:1;pointer-events:none;padding-bottom:7px}
.impro-landing .how-section .step>p:last-child{line-height:1.8;font-size:14px}
.method-motion{position:relative}
.method-motion *, .method-motion:before,.method-motion:after{animation-play-state:paused!important}
.method-motion.motion-running *, .method-motion.motion-running:before,.method-motion.motion-running:after{animation-play-state:running!important}
.chords-visual.method-motion b,.chords-visual.method-motion b:nth-child(2){background:#fff;color:#111;box-shadow:none;transform:none;animation:impro-chord-focus 5.2s infinite;animation-delay:calc(var(--order)*1.3s)}
.chords-visual b:nth-child(1){--order:0}.chords-visual b:nth-child(2){--order:1}.chords-visual b:nth-child(3){--order:2}.chords-visual b:nth-child(4){--order:3}
@keyframes impro-chord-focus{0%,20%{background:#151515;color:#fff;transform:translateY(-7px);box-shadow:none}25%,100%{background:var(--piano-card-bg,#fff);color:var(--piano-card-ink,#111);transform:translateY(0);box-shadow:none}}
.method-motion .note-line{height:105px;position:relative;align-items:flex-start}
.method-motion .note-line i{position:absolute;width:36px;height:23px;transform:none;animation:impro-note-focus 4.5s infinite;animation-delay:calc(var(--order)*.65s);opacity:.5}
.method-motion .note-line i:nth-child(1){--order:0;left:0;top:0}.method-motion .note-line i:nth-child(2){--order:1;left:21%;top:18px}.method-motion .note-line i:nth-child(3){--order:2;left:42%;top:36px}.method-motion .note-line i:nth-child(4){--order:3;left:63%;top:54px}.method-motion .note-line i:nth-child(5){--order:4;left:84%;top:72px}
.melody-playhead{position:absolute;top:-4px;bottom:0;width:1px;background:#ffffff45;animation:impro-melody-sweep 4.5s linear infinite}
@keyframes impro-note-focus{0%,14%{opacity:1;background:#fff;box-shadow:0 0 0 3px #ffffff25}20%,100%{opacity:.5;background:#ddd;box-shadow:none}}
@keyframes impro-melody-sweep{0%{left:0;opacity:0}4%{opacity:1}80%{left:100%;opacity:1}81%,100%{left:100%;opacity:0}}
.rhythm-visual.method-motion>div{position:relative;gap:9px}
.rhythm-visual.method-motion i{transform-origin:center;animation:impro-rhythm 2.4s ease-in-out infinite;animation-delay:calc(var(--beat)*.16s)}
.rhythm-visual i:nth-child(4n+1){--beat:0}.rhythm-visual i:nth-child(4n+2){--beat:1}.rhythm-visual i:nth-child(4n+3){--beat:2}.rhythm-visual i:nth-child(4n){--beat:3}
@keyframes impro-rhythm{0%,18%,100%{transform:scaleY(.55);opacity:.35}35%,55%{transform:scaleY(1);opacity:1}72%{transform:scaleY(.75);opacity:.65}}
/* Compact, automatically moving styles retain native scrolling and dragging. */
.impro-styles .loop-track{display:flex;width:max-content;gap:0;transform:none;animation:none}
.impro-styles .style-carousel-list{flex:none;width:max-content;padding-right:12px;gap:12px}
.impro-styles .style-carousel{scroll-snap-type:none;cursor:grab;touch-action:pan-x pan-y;scrollbar-width:none;overflow-anchor:none}
.impro-styles .style-carousel::-webkit-scrollbar{display:none}
.impro-styles .style-carousel.is-dragging{cursor:grabbing;user-select:none}
.impro-styles .style-genre-card{flex:0 0 236px;min-height:200px;padding:20px;border-radius:10px;scroll-snap-align:none}

.impro-styles .style-genre-card h3{font-size:28px;margin:20px 0 10px}
.impro-styles .style-genre-card strong{font-size:12px}
.impro-styles .style-genre-card p{font-size:11px;line-height:1.7;margin:10px 0 16px}

@media(max-width:650px){.impro-landing .impro-chord-section{padding-bottom:65px}.impro-landing .how-section .step>p:last-child{font-size:13px}.impro-styles .style-genre-card{flex-basis:218px;min-height:200px;padding:18px}.impro-styles .style-genre-card h3{font-size:26px}.chord-select-wrap #chord-choice{font-size:13px}.method-motion .note-line i{width:33px}}
@media(prefers-reduced-motion:reduce){.method-motion *,.method-motion:before,.method-motion:after{animation:none!important}.method-motion .note-line i{opacity:1}.melody-playhead{display:none}.chords-visual.method-motion b:first-child{background:#111;color:#fff}}

/* A shared vertical rhythm prevents adjacent section paddings from accumulating. */
body.pianola-premium.impro-landing{--impro-section-space:clamp(36px,4.2vw,56px);--impro-content-gap:36px}
body.pianola-premium.impro-landing main>:is(.intro-strip,.personal-section,.how-section,.impro-chord-section,.impro-styles,.experience-section,.impro-possibilities,.faq-section,.final-section){
  padding-block:var(--impro-section-space);
  margin-block:0;
}
body.pianola-premium.impro-landing .intro-strip p{margin-block:0}
body.pianola-premium.impro-landing .intro-strip strong{color:inherit}
body.pianola-premium.impro-landing .how-section .key-heading{margin-bottom:var(--impro-content-gap)}
body.pianola-premium.impro-landing :is(.personal-section,.experience-inner,.faq-section){row-gap:var(--impro-content-gap)}
body.pianola-premium.impro-landing .impro-styles-heading{margin-bottom:var(--impro-content-gap)}
body.pianola-premium.impro-landing :is(.personal-copy,.experience-heading,.faq-heading,.section-heading,.impro-styles-heading>div)>:first-child{margin-top:0}
body.pianola-premium.impro-landing .step>p:last-child{margin-bottom:0}
body.pianola-premium.impro-landing .site-footer{padding-block:32px}
@media(max-width:650px){
  body.pianola-premium.impro-landing{--impro-section-space:28px;--impro-content-gap:28px}
  body.pianola-premium.impro-landing .steps{row-gap:36px}
  body.pianola-premium.impro-landing .site-footer{padding-block:28px}
}

/* Impro illustrations must fit their card independently of shared landing styles. */
body.pianola-premium.impro-landing .steps{align-items:start}
body.pianola-premium.impro-landing .step{min-width:0}
body.pianola-premium.impro-landing .step .impro-step-visual{height:230px;min-height:230px;flex:none;padding:22px;margin:0;border-radius:11px;gap:16px}
body.pianola-premium.impro-landing .impro-step-visual>span{line-height:1.45}
body.pianola-premium.impro-landing .impro-step-visual>p{line-height:1.45}
body.pianola-premium.impro-landing .chords-visual>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-width:0;width:100%;flex:none}
body.pianola-premium.impro-landing .chords-visual b{width:auto;min-width:0;padding:17px 4px;white-space:nowrap;text-align:center}
body.pianola-premium.impro-landing .method-motion .note-line{width:100%;flex:none}
body.pianola-premium.impro-landing .method-motion .note-line i:nth-child(2){left:calc(25% - 9px)}
body.pianola-premium.impro-landing .method-motion .note-line i:nth-child(3){left:calc(50% - 18px)}
body.pianola-premium.impro-landing .method-motion .note-line i:nth-child(4){left:calc(75% - 27px)}
body.pianola-premium.impro-landing .method-motion .note-line i:nth-child(5){left:calc(100% - 36px)}
body.pianola-premium.impro-landing .rhythm-visual.method-motion>div{width:100%;min-width:0;gap:clamp(4px,.6vw,9px);flex:none}
body.pianola-premium.impro-landing .rhythm-visual i{flex:1;max-width:12px;min-width:0}
body.pianola-premium.impro-landing .step>.eyebrow{min-height:2.9em;margin:26px 0 12px;line-height:1.45}
body.pianola-premium.impro-landing .step>h3{min-height:2.32em;margin:0 0 16px}
body.pianola-premium.impro-landing .step>p:last-child{max-width:none}
@media(max-width:1100px) and (min-width:701px){
 body.pianola-premium.impro-landing .steps{grid-template-columns:minmax(0,1fr);gap:32px}
 body.pianola-premium.impro-landing .steps>.step{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr);grid-template-rows:auto auto 1fr;column-gap:28px;padding-top:24px}
 body.pianola-premium.impro-landing .step .impro-step-visual{grid-column:1;grid-row:1/4;align-self:start}
 body.pianola-premium.impro-landing .step>.eyebrow{grid-column:2;grid-row:1;min-height:0;margin:0 0 12px}
 body.pianola-premium.impro-landing .step>h3{grid-column:2;grid-row:2;min-height:0}
 body.pianola-premium.impro-landing .step>p:last-child{grid-column:2;grid-row:3}
}
@media(max-width:700px){
 body.pianola-premium.impro-landing .steps{grid-template-columns:minmax(0,1fr);gap:32px}
 body.pianola-premium.impro-landing .steps>.step{display:flex;flex-direction:column}
 body.pianola-premium.impro-landing .step>.eyebrow{min-height:0;margin-top:22px}
 body.pianola-premium.impro-landing .step>h3{min-height:0}
 body.pianola-premium.impro-landing .step .impro-step-visual{width:100%;max-width:none}
 body.pianola-premium.impro-landing .method-motion .note-line i{width:36px}
}
@media(max-width:400px){
 body.pianola-premium.impro-landing .hero-source-links{flex-wrap:wrap}
 body.pianola-premium.impro-landing .hero-source-links a{flex:1 1 120px;font-size:11px}
 body.pianola-premium.impro-landing .style-picker{flex-wrap:wrap}
 body.pianola-premium.impro-landing .style-picker button{flex:1 1 100px}
 body.pianola-premium.impro-landing .demo-duration{display:none}
 body.pianola-premium.impro-landing .chord-explorer{padding:18px}
}

/* Soft translucent pastel accents keep musical activity within the monochrome palette. */
.impro-landing{--piano-blue:rgb(192 211 226 / .72);--piano-blue-light:rgb(210 226 237 / .78);--piano-blue-shadow:rgb(152 175 193 / .42);--piano-blue-halo:rgb(192 211 226 / .16)}
.chord-select-wrap #chord-choice,.chord-select-trigger{width:100%;min-height:52px;padding:13px 18px;border:1px solid #d4d4d4;border-radius:12px;background:#fff;color:#222;font:inherit;font-size:14px;font-weight:500;text-align:left;cursor:pointer}
.chord-select-wrap #chord-choice:hover,.chord-select-trigger:hover{background:#f7f7f7;border-color:#aaa}
.chord-select-trigger{display:flex;justify-content:space-between;align-items:center;gap:16px}
.chord-select-trigger[aria-expanded=true]{border-color:#888;background:#fafafa}
.chord-select-arrow{display:block;flex:0 0 20px;width:20px;height:20px;transform-origin:center;transition:transform .18s;color:#777}
.chord-select-trigger[aria-expanded=true] .chord-select-arrow{transform:rotate(180deg)}
.chord-select-wrap.is-enhanced>.chord-select-chevron{display:none}
.chord-select-wrap [hidden]{display:none!important}
.chord-options{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 8px);max-height:320px;overflow-y:auto;padding:6px;border:1px solid #ddd;border-radius:14px;background:#fff;box-shadow:0 12px 32px #00000016;overscroll-behavior:contain}
.chord-options button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:42px;padding:10px 12px;border-radius:9px;background:transparent;color:#333;font:inherit;font-size:13px;text-align:left}
.chord-options button:hover,.chord-options button:focus-visible{background:#f0f0f0;outline:none}
.chord-options button[aria-selected=true]{background:#ededed;color:#111;font-weight:600}
.chord-option-check{visibility:hidden;color:#555}.chord-options button[aria-selected=true] .chord-option-check{visibility:visible}
.chord-select-trigger:focus-visible{outline:2px solid #777;outline-offset:3px}
.impro-landing .impro-styles .loop-window{mask-image:none;-webkit-mask-image:none}
.impro-landing .key.active,.impro-landing .chord-explorer .key.is-chord{background:var(--piano-blue);color:#202a31;box-shadow:inset 0 -5px 0 var(--piano-blue-shadow)}
.impro-landing .key.black.active,.impro-landing .chord-explorer .key.black.is-chord{background:var(--piano-blue);color:#fff;box-shadow:inset 0 -4px 0 var(--piano-blue-shadow)}
@keyframes impro-chord-focus{0%,20%{background:#111;color:#fff;transform:translateY(-7px);box-shadow:none}25%,100%{background:var(--piano-card-bg,#fff);color:var(--piano-card-ink,#111);transform:translateY(0);box-shadow:none}}
@keyframes impro-note-focus{0%,14%{opacity:1;background:var(--piano-blue-light);color:#111;box-shadow:0 0 0 3px var(--piano-blue-halo)}20%,100%{opacity:.5;background:#ddd;box-shadow:none}}
.impro-landing .melody-playhead{background:var(--piano-blue-light)}
@keyframes impro-rhythm{0%,18%,100%{transform:scaleY(.55);opacity:.35;background:#444}35%,55%{transform:scaleY(1);opacity:1;background:var(--piano-blue)}72%{transform:scaleY(.75);opacity:.65;background:#444}}
@media(prefers-reduced-motion:reduce){.impro-landing .chords-visual.method-motion b:first-child{background:var(--piano-blue);color:#202a31}.chord-select-arrow{transition:none}}

/* Selection must not paint empty space between Impro sections. */
body.pianola-premium.impro-landing main::selection,
body.pianola-premium.impro-landing main>section::selection{background:transparent;color:inherit}

/* Give both voices the same type scale and starting line. */
body.pianola-premium.impro-landing .personal-section{align-items:stretch}
body.pianola-premium.impro-landing .personal-visual{display:flex;flex-direction:column;min-width:0;min-height:0;height:auto;padding:32px;gap:0}
body.pianola-premium.impro-landing .personal-visual .big-quote{display:none}
body.pianola-premium.impro-landing .personal-copy{min-width:0;padding:32px;border-radius:12px;box-shadow:inset 0 0 0 1px #dedede}
body.pianola-premium.impro-landing .personal-copy>.eyebrow{min-height:27px;font-size:9px;line-height:1.5;margin:0 0 20px}
body.pianola-premium.impro-landing .personal-visual>p,
body.pianola-premium.impro-landing .personal-copy>h2{font-size:clamp(32px,3.4vw,48px);font-weight:550;letter-spacing:-.015em;line-height:1.16}
body.pianola-premium.impro-landing .personal-visual>p{margin:47px 0 36px}
body.pianola-premium.impro-landing .personal-copy>h2{margin:0 0 24px}
body.pianola-premium.impro-landing .personal-copy>p:not(.eyebrow){max-width:none}
body.pianola-premium.impro-landing .personal-keys{--keyboard-x:0;position:relative;flex:none;left:auto;right:auto;bottom:auto;width:100%;max-width:none;height:102px;margin-top:auto;transform:none}
body.pianola-premium.impro-landing .personal-caption{position:static;margin-top:32px;max-width:none;font-size:7px;line-height:1.7}
@media(max-width:900px){
 body.pianola-premium.impro-landing .personal-section{grid-template-columns:minmax(0,1fr)}
 body.pianola-premium.impro-landing .personal-visual{padding:28px}
 body.pianola-premium.impro-landing .personal-visual>p,
 body.pianola-premium.impro-landing .personal-copy>h2{font-size:clamp(28px,4.8vw,36px)}
 body.pianola-premium.impro-landing .personal-visual>p{margin:0 0 36px}
 body.pianola-premium.impro-landing .personal-keys{max-width:400px;height:100px}
 body.pianola-premium.impro-landing .personal-copy{padding:28px}
 body.pianola-premium.impro-landing .personal-copy>.eyebrow{min-height:0}
}
body.pianola-premium.impro-landing .steps>.step{border-top:0;padding-top:0}

/* White style cards sit directly on the pale page without a dark top edge. */
body.pianola-premium.impro-landing .impro-styles{border:0;box-shadow:none}
body.pianola-premium.impro-landing .impro-styles .loop-window:focus-visible{outline:2px solid #c7c7c7;outline-offset:3px}

/* C, C-sharp, D, D-sharp, E, F, F-sharp, G, G-sharp, A, A-sharp, B. */
body.pianola-premium.impro-landing .piano-key-sequence>*{--piano-card-bg:#fff;--piano-card-ink:#111;--piano-card-muted:#666}
body.pianola-premium.impro-landing .piano-key-sequence>:is(:nth-child(12n+2),:nth-child(12n+4),:nth-child(12n+7),:nth-child(12n+9),:nth-child(12n+11)){--piano-card-bg:#111;--piano-card-ink:#fff;--piano-card-muted:#bbb}
body.pianola-premium.impro-landing :is(.steps.piano-key-sequence>.step>.impro-step-visual,.impro-possibility-list.piano-key-sequence>div,.chords-visual>.piano-key-sequence>b){background:var(--piano-card-bg);color:var(--piano-card-ink)}
body.pianola-premium.impro-landing .steps.piano-key-sequence>.step>.impro-step-visual>:is(span,p),
body.pianola-premium.impro-landing .impro-possibility-list.piano-key-sequence>div>p{color:var(--piano-card-muted)}
body.pianola-premium.impro-landing .chords-visual>.piano-key-sequence>b{border-color:color-mix(in srgb,var(--piano-card-ink) 18%,var(--piano-card-bg))}
@media(prefers-reduced-motion:reduce){body.pianola-premium.impro-landing .chords-visual>.piano-key-sequence>b:first-child{background:var(--piano-blue);color:#202a31}}

/* A quiet photographic pause at the heart of the improvisation journey. */
body.pianola-premium.impro-landing .impro-inspiration{padding-block:var(--impro-section-space)}
.impro-inspiration figure{margin:0}
.impro-inspiration img{display:block;width:100%;height:auto;border-radius:12px;aspect-ratio:1672/941;object-fit:cover}
.impro-inspiration figcaption{margin-top:20px;font-size:clamp(20px,2.2vw,30px);font-weight:500;line-height:1.3;letter-spacing:-.015em;color:#222}
@media(max-width:650px){.impro-inspiration img{aspect-ratio:3/2;height:auto;object-position:36% center}.impro-inspiration figcaption{margin-top:16px;font-size:20px}}

/* Platform-independent playback icons and a quiet, touch-friendly control. */
.impro-landing .demo-controls #play{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #555;border-radius:50%;background:transparent;color:#eee;box-shadow:none}
.impro-landing .demo-controls #play:hover{background:#ffffff0a;border-color:#999}
.impro-landing .demo-controls #play:focus-visible{outline:2px solid #ddd;outline-offset:4px}
#play-icon{display:block;fill:currentColor}
#play-icon .demo-pause-shape{display:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
#play[aria-pressed=true] .demo-play-shape{display:none}
#play[aria-pressed=true] .demo-pause-shape{display:block}

/* Put chord symbols first, with the French name as the secondary label. */
body.pianola-premium.impro-landing .chords-visual b{font-size:24px;line-height:1.15}
body.pianola-premium.impro-landing .chords-visual small{font-size:11px;line-height:1.4;margin-top:10px}

/* Fixed key bed and black-key layer; only the white key surfaces move. */
body.pianola-premium.impro-landing .personal-keys{animation:none!important;transform:none!important;isolation:isolate}
body.pianola-premium.impro-landing .personal-keys i{animation:none!important;transform:none!important;background:#ddd;box-shadow:none;overflow:hidden}
body.pianola-premium.impro-landing .personal-keys i::after{content:"";position:absolute;inset:0 0 3px;border-radius:inherit;background:#f9f9f9;box-shadow:inset 0 -3px 0 #ececec;transform:translate3d(0,0,0)}
body.pianola-premium.impro-landing .personal-black-keys{position:absolute;inset:0;z-index:3;pointer-events:none;transform:translateZ(0);backface-visibility:hidden;will-change:transform}
body.pianola-premium.impro-landing .personal-black-keys b{animation:none!important;transform:none!important;transition:none!important}
@media(prefers-reduced-motion:no-preference){
 body.pianola-premium.impro-landing .personal-keys i:is([data-note=re],[data-note=fa],[data-note=mi],[data-note=la])::after{animation:impro-personal-key-press 4s ease-in-out infinite}
 body.pianola-premium.impro-landing .personal-keys i[data-note=re]::after{animation-delay:0s}
 body.pianola-premium.impro-landing .personal-keys i[data-note=fa]::after{animation-delay:.75s}
 body.pianola-premium.impro-landing .personal-keys i[data-note=mi]::after{animation-delay:1.5s}
 body.pianola-premium.impro-landing .personal-keys i[data-note=la]::after{animation-delay:2.25s}
 body.pianola-premium.impro-landing .personal-keys:not(.motion-running) i::after{animation-play-state:paused}
}
@keyframes impro-personal-key-press{
 0%,18.75%,100%{transform:translate3d(0,0,0);background:#f9f9f9;box-shadow:inset 0 -3px 0 #ececec}
 3%,14%{transform:translate3d(0,3px,0);background:#c4c4c4;box-shadow:inset 0 -1px 0 #aaa}
}

/* Chord cards are white at rest; only the currently pressed card becomes black. */
body.pianola-premium.impro-landing .chords-visual.method-motion>.piano-key-sequence>b{--piano-card-bg:#fff;--piano-card-ink:#111;--piano-card-muted:#666}
@media(prefers-reduced-motion:reduce){body.pianola-premium.impro-landing .chords-visual.method-motion>.piano-key-sequence>b:first-child{background:#111;color:#fff}}

/* The carousel follows the actual chromatic keyboard, including E–F and B–C. */
.impro-landing .impro-styles .style-genre-card{background:#fff;color:#111}
.impro-landing .impro-styles .style-genre-card[data-piano-key=black]{background:#111;color:#fff}
.impro-landing .impro-styles .style-genre-card[data-piano-key=black] p{color:#bbb}
.impro-landing .impro-styles .style-genre-card h3{margin-top:0}

.impro-landing .style-carousel-footer{justify-content:flex-end}
.impro-landing .demo-controls #status:empty{display:none}

/* A compact glimpse of the piano roll, aligned with the keyboard below it. */
.impro-landing #demo-piano-roll{display:block;width:100%;height:84px;box-sizing:border-box;border:4px solid #242424;border-bottom:0;border-radius:5px 5px 0 0;background:#191919}
.impro-landing .demo-piano #keyboard{border-top:0;border-radius:0 0 3px 3px}
@media(max-width:650px){.impro-landing #demo-piano-roll{height:72px}}

/* Chords are compact labels; the saved space makes the falling notes easier to see. */
.impro-landing .impro-demo .demo-chords{margin-bottom:18px}
.impro-landing .impro-demo .demo-chords>div{display:flex;flex-direction:column;justify-content:center;min-height:0;padding:10px 12px}
.impro-landing .impro-demo .demo-chords strong{font-size:26px;line-height:1.1;margin:0 0 4px}
.impro-landing .impro-demo .demo-chords span{font-size:10px;line-height:1.4}
@media(max-width:650px){
 .impro-landing .impro-demo .demo-chords>div{padding:8px 6px}
 .impro-landing .impro-demo .demo-chords strong{font-size:24px}
 .impro-landing .impro-demo .demo-chords span{font-size:9px}
}