/* Piano Online: one calm, instrument-first design system. */
:root{--studio-bg:#f6f5f1;--studio-paper:#fffefa;--studio-ink:#242823;--studio-muted:#6d7169;--studio-line:#dedfd6;--studio-accent:#88733f;--studio-gold:#e8cd8d;--studio-radius:20px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body.studio-page,body.secondary-page{margin:0;background:var(--studio-bg);color:var(--studio-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #a8863e;outline-offset:4px}button,input[type=checkbox]{accent-color:var(--studio-accent)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:16px;top:-80px;background:white;padding:12px;z-index:9999}.skip-link:focus{top:8px}
:root body .nav-bar{position:relative;top:auto;padding:0;width:100%;height:auto;background:var(--studio-bg);box-shadow:none;border-bottom:1px solid var(--studio-line);z-index:20}:root body .nav-container{max-width:1240px;margin:auto;min-height:82px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}:root body .nav-links{display:flex;align-items:center;gap:8px}:root body .nav-links a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 16px;color:var(--studio-muted);background:transparent;font-size:14px;font-weight:500;text-decoration:none;border-radius:9px}:root body .nav-links a:hover,:root body .nav-links a.active{color:var(--studio-ink);background:#eaeae1}:root body .nav-links a.active:after{display:none}:root body .nav-links a.studio-language{margin-left:18px;border-left:1px solid var(--studio-line);border-radius:0;padding-right:0;font-size:12px}
.studio-brand{display:flex;align-items:center;gap:11px;text-decoration:none;white-space:nowrap;font-size:21px;font-weight:750;letter-spacing:-.7px;line-height:1.1}.brand-light{font-weight:400;color:var(--studio-muted)}.studio-brand small{display:block;font-size:9px;letter-spacing:2px;color:var(--studio-muted);margin-top:6px;font-weight:500}.brand-keys{display:flex;align-items:flex-start;justify-content:space-evenly;width:36px;height:35px;border:1.8px solid currentColor;border-radius:4px;overflow:hidden;background:repeating-linear-gradient(90deg,transparent 0,transparent 8px,#c8c8be 9px,transparent 10px)}.brand-keys i{display:block;width:5px;height:20px;background:var(--studio-ink)}
.studio-main{max-width:1240px;padding:0 32px;margin:0 auto}.studio-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:38px 0 26px}.studio-kicker{font-size:11px!important;font-weight:650;letter-spacing:1.8px;color:var(--studio-accent)!important;margin:0 0 8px!important}.studio-intro h1{font-size:clamp(27px,2.8vw,38px);font-weight:680;line-height:1.3;letter-spacing:-1.2px;margin:0 0 10px}.studio-intro p{font-size:14px;color:var(--studio-muted);margin:0}.studio-promise{display:flex;gap:15px;white-space:nowrap;font-size:11px;color:var(--studio-muted)}.studio-promise span:before{content:'✓';color:var(--studio-accent);margin-right:5px}
:root body .studio-instrument{margin:0!important;padding:0!important;background:var(--studio-paper)!important;border:1px solid #dadcd2!important;box-shadow:0 12px 35px #262b2110!important;border-radius:var(--studio-radius)!important;overflow:hidden;scroll-margin-top:20px;max-width:none;isolation:isolate;outline:none}:root body .studio-instrument h2,:root body .studio-instrument p{margin:0}.studio-toolbar{padding:14px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--studio-line)}.studio-modes{display:flex;gap:3px;background:#eeeee7;padding:4px;border-radius:10px}.studio-modes button{background:transparent;color:var(--studio-muted);border:0;padding:8px 20px;min-height:38px;border-radius:7px;font-size:13px;font-weight:600;white-space:nowrap}.studio-modes button[aria-pressed=true]{background:var(--studio-paper);color:var(--studio-ink);box-shadow:0 1px 4px #20241b12}.studio-quiet{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:8px 12px;background:transparent;border:1px solid var(--studio-line);border-radius:8px;color:var(--studio-ink);font-size:12px}.studio-quiet:hover{background:#eeeee6}.studio-quiet>span:first-child{font-size:20px;line-height:1}.studio-primary{min-height:42px;border:1px solid var(--studio-ink);border-radius:8px;background:var(--studio-ink);color:#fffefa;padding:9px 19px;font-size:13px;white-space:nowrap}.studio-primary:hover{background:#3b4236}.studio-song-bar{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--studio-line);font-size:12px}.studio-song-bar label{color:var(--studio-muted);white-space:nowrap}.studio-song-bar select{min-width:0;flex:1;max-width:420px;min-height:42px;border:1px solid var(--studio-line);border-radius:8px;background:white;padding:8px 12px;font-size:14px;color:var(--studio-ink)}.studio-song-bar a{margin-left:auto;white-space:nowrap;color:var(--studio-muted);text-decoration:none}
.studio-surface{background:#242823;padding:25px 22px 0;color:#f8f8ed}.studio-display{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:95px;margin-bottom:22px}.studio-display-copy{min-width:0}.studio-eyebrow{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:2.6px;font-weight:650;color:#b8bdae;margin-bottom:12px}.studio-dot{display:inline-block;width:5px;height:5px;background:#b7c29c;border-radius:50%}.studio-instrument .studio-display h2{font-size:22px;color:#f3f3e8;line-height:1.4;letter-spacing:-.4px;font-weight:550;margin:0 0 8px}.studio-instrument .studio-display p{font-size:12px;color:#b9bfb1}.studio-readout{display:flex;flex-direction:column;align-items:center;justify-content:center;border-left:1px solid #4a5145;padding:0 8px 0 32px;min-width:106px}.studio-readout>span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:40px;line-height:1.1;color:var(--studio-gold)}.studio-readout small{font-size:9px;letter-spacing:1px;color:#b9bfb1;margin-top:10px}:root body .studio-instrument .key-hint{background:transparent;border:0;box-shadow:none;padding:0 2px 0 24px;border-radius:0;min-width:98px;border-left:1px solid #4a5145;text-align:center;position:static;transform:none;width:auto}:root body .studio-instrument .hint-text{display:block;color:#b9bfb1;font-size:10px;margin:0 0 4px}:root body .studio-instrument .hint-key{display:block;color:var(--studio-gold);font-family:ui-monospace,monospace;font-weight:650;font-size:40px;line-height:1.1;background:none;box-shadow:none;padding:0;margin:0}:root body .studio-instrument .hint-note{display:block;color:#b9bfb1;font-size:10px;margin:5px 0 0}.studio-upcoming{display:flex;gap:8px;margin:0 0 16px;overflow:hidden}.studio-upcoming span{display:flex;align-items:center;justify-content:center;flex:0 0 37px;min-height:35px;border:1px solid #52594d;border-radius:6px;color:#c8cebd;font:13px ui-monospace,monospace}.studio-upcoming span:first-child{color:#262a22;background:var(--studio-gold);border-color:var(--studio-gold)}.studio-progress{font-size:11px;color:#c7cbbb;padding-bottom:18px}.studio-progress>span{margin-right:18px}.studio-progress progress{display:block;width:100%;height:4px;margin-top:12px;accent-color:var(--studio-gold);border:0;border-radius:4px;overflow:hidden}.studio-progress progress::-webkit-progress-bar{background:#454d40}.studio-progress progress::-webkit-progress-value{background:var(--studio-gold)}
.studio-keyboard-viewport{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;scroll-behavior:smooth;border-radius:5px 5px 7px 7px;padding:0 0 5px}.studio-keyboard-viewport::-webkit-scrollbar{display:none}:root body .studio-instrument .piano-container{width:100%;min-width:990px;max-width:none;height:214px;position:relative;margin:0;padding:0!important;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}:root body .studio-instrument .keys{display:flex;position:relative;gap:0;height:100%;width:100%;margin:0;padding:0;border:0;transform:none;touch-action:none;user-select:none;-webkit-user-select:none}:root body .studio-instrument .key{font-family:inherit;margin:0;position:relative;border-radius:0 0 5px 5px;transition:background .07s,transform .07s;cursor:pointer;touch-action:none;flex-shrink:0;display:block;padding:0;top:auto;left:auto;box-sizing:border-box}:root body .studio-instrument .key.white{flex:1 0 0;min-width:0;height:100%;background:linear-gradient(#fdfdf6 0%,#fdfdf6 87%,#e7e6dc 100%);border:1px solid #b8b9af;border-top:0;box-shadow:inset 0 -4px 0 #d3d3c8;z-index:1}:root body .studio-instrument .key.black{position:absolute;top:0!important;left:var(--key-left)!important;width:2.7%;height:62%;background:linear-gradient(90deg,#141712,#30352c 70%,#161b14);border:1px solid #14180f;box-shadow:inset 0 -5px 0 #0e110c,0 3px 4px #0005;z-index:2;transform:translateX(-50%)}:root body .studio-instrument .key-label{position:absolute;bottom:30px;left:0;right:0;transform:none;display:block;width:100%;text-align:center;font-family:ui-monospace,monospace;font-size:12px;color:#62685b;line-height:1;pointer-events:none;font-weight:600}:root body .studio-instrument .key-note{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:9px;line-height:1;color:#8c9182;pointer-events:none}:root body .studio-instrument .key.black .key-label{bottom:27px;color:#d6dacd;font-size:10px}:root body .studio-instrument .key.black .key-note{bottom:12px;color:#9fa895;font-size:8px}:root body .studio-instrument .keys:not(.show-labels) .key-label{visibility:hidden}:root body .studio-instrument .key.white.current{background:#ecdcad;box-shadow:inset 0 -4px 0 #b79c5e}:root body .studio-instrument .key.black.current{background:#99814c}:root body .studio-instrument .key.white.active,:root body .studio-instrument .key.white.success{background:#ced8b9;transform:translateY(2px);box-shadow:inset 0 -1px 0 #aab39a}:root body .studio-instrument .key.black.active,:root body .studio-instrument .key.black.success{background:#6d7c53;transform:translateX(-50%) translateY(2px)}:root body .studio-instrument .key.error{background:#d9b5a5}:root body .studio-instrument .key.white[data-note=C4]:after{content:'';position:absolute;bottom:70px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:#9a895f}.studio-range{display:flex;justify-content:space-between;align-items:center;gap:5px;min-height:49px;font-size:10px;color:#b4bdac}.studio-range button{color:#d4dacb;min-width:65px;min-height:44px;border:0;background:none;font-size:11px}.studio-range button:hover{color:var(--studio-gold)}.mobile-only{display:none}
.studio-bottom{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px}.studio-settings{display:flex;align-items:center;gap:24px}.studio-volume{display:flex;align-items:center;gap:10px;color:var(--studio-muted);font-size:11px}.studio-volume input{width:95px;height:20px;padding:0}.studio-volume output{font:10px ui-monospace,monospace;width:30px}.studio-toggle{display:flex;align-items:center;gap:7px;min-height:36px;font-size:12px;white-space:nowrap}.studio-toggle input{width:14px;height:14px;margin:0}.studio-bottom>[role=status]{font-size:10px;color:var(--studio-muted)}.studio-more{border-top:1px solid #e9e9e1;padding:0 20px;color:var(--studio-muted);font-size:11px}.studio-more>summary{min-height:42px;display:flex;align-items:center;cursor:pointer;list-style:none;gap:7px}.studio-more>summary:before{content:'+';font-size:17px}.studio-more[open]>summary:before{content:'−'}.studio-more-content{padding:0 0 18px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}.studio-more-content p{width:100%;font-size:12px;line-height:1.8}.studio-rhythm-tools{display:flex;align-items:center;gap:10px}.studio-error{padding:14px 20px;background:#f9e7df;color:#814629;font-size:13px}.studio-instrument .note-drop-zone{position:relative;height:190px;overflow:hidden;background:#1a2018}.studio-instrument .falling-notes{height:100%;position:relative}.studio-instrument .falling-note{position:absolute;background:var(--studio-gold);color:#252921;padding:4px 10px;border-radius:5px}
.studio-discover{padding:48px 0 40px}.studio-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:23px}.studio-section-heading h2,.studio-learn h2{font-size:25px;letter-spacing:-.8px;font-weight:630;line-height:1.4;margin:0}.studio-section-heading>a{font-size:12px;color:var(--studio-muted);text-decoration:none;white-space:nowrap}.studio-song-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.studio-song-card{display:flex;align-items:center;gap:15px;padding:15px;background:var(--studio-paper);border:1px solid var(--studio-line);border-radius:12px;text-decoration:none;min-width:0;transition:border-color .2s,transform .2s}.studio-song-card:hover{border-color:#999f8d;transform:translateY(-2px)}.studio-song-art{display:flex;position:relative;align-items:center;justify-content:center;flex:0 0 57px;height:66px;border-radius:7px;background:#e7e9da;color:#6d7a53;font-size:38px}.studio-song-art small{position:absolute;bottom:4px;right:6px;font:8px ui-monospace,monospace;color:#788268}.studio-song-art[data-art="1"],.studio-song-art[data-art="4"]{background:#ebe3d6;color:#8a775b}.studio-song-art[data-art="2"],.studio-song-art[data-art="5"]{background:#e0e7e5;color:#597871}.studio-song-copy{display:flex;flex-direction:column;gap:5px;min-width:0}.studio-song-copy>small{font-size:10px;color:var(--studio-muted)}.studio-song-copy>strong{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.studio-song-copy>span{font-size:10px;color:var(--studio-muted)}.studio-song-arrow{margin-left:auto;align-self:flex-start;font-size:17px;color:#8e9684}.studio-learn{display:grid;grid-template-columns:1fr 1fr;gap:85px;border-top:1px solid var(--studio-line);padding:38px 0 48px}.studio-learn>div>p:not(.studio-kicker){font-size:12px;color:var(--studio-muted);max-width:425px;line-height:1.9;margin:15px 0 0}.studio-help details{border-bottom:1px solid var(--studio-line)}.studio-help summary{min-height:48px;display:flex;align-items:center;justify-content:space-between;list-style:none;cursor:pointer;font-size:13px}.studio-help summary:after{content:'+';color:var(--studio-muted)}.studio-help details[open] summary:after{content:'−'}.studio-help p{font-size:12px;color:var(--studio-muted);margin:0 0 15px;line-height:1.9}.studio-help>a{display:inline-block;font-size:12px;color:var(--studio-accent);padding-top:16px;text-decoration:none}.studio-footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--studio-line);max-width:1176px;margin:auto;padding:24px 0 30px;font-size:11px;color:var(--studio-muted)}.studio-footer>a{text-decoration:none}
/* A real focus mode, including Safari/iOS fallback and ad isolation. */
body.studio-focus{overflow:hidden!important}body.studio-focus ins.adsbygoogle,body.studio-focus iframe[src*="googlesyndication"],body.studio-focus [id^="google_ads"],body.studio-focus .google-auto-placed{display:none!important}:root body .studio-instrument:fullscreen,:root body .studio-instrument.studio-focus-fallback{width:100vw!important;height:100dvh!important;max-height:100dvh;max-width:none!important;border:0!important;border-radius:0!important;display:flex;flex-direction:column;overflow:auto;background:var(--studio-paper)!important}:root body .studio-instrument.studio-focus-fallback{position:fixed!important;inset:0!important;z-index:2147483647}:root body .studio-instrument:fullscreen .studio-surface,:root body .studio-instrument.studio-focus-fallback .studio-surface{flex:1;display:flex;flex-direction:column;justify-content:flex-end}:root body .studio-instrument:fullscreen .piano-container,:root body .studio-instrument.studio-focus-fallback .piano-container{height:clamp(150px,36vh,390px)}:root body .studio-instrument:fullscreen .studio-display,:root body .studio-instrument.studio-focus-fallback .studio-display{margin-top:auto}:root body .studio-instrument:fullscreen .studio-more,:root body .studio-instrument.studio-focus-fallback .studio-more{display:none}
/* Editorial pages and the searchable catalog share the same shell. */
:root body.secondary-page .song-library-main,:root body.secondary-page .song-page-main,:root body.secondary-page .secondary-main{padding-top:32px}:root body.secondary-page .song-library-hero,:root body.secondary-page .song-library-hero-inner,:root body.secondary-page .secondary-hero{background:none;box-shadow:none;border:0}:root body.secondary-page .song-library-hero h1,:root body.secondary-page .secondary-hero h1{color:var(--studio-ink);font-size:clamp(28px,3vw,40px);letter-spacing:-1px;line-height:1.35}:root body.secondary-page .section-kicker,:root body.secondary-page .song-eyebrow{color:var(--studio-accent);font-size:10px;letter-spacing:1.5px}:root body.secondary-page .song-card{border:1px solid var(--studio-line);border-radius:12px;background:var(--studio-paper);box-shadow:none;padding:21px;min-height:190px}:root body.secondary-page .song-card h3{color:var(--studio-ink);font-size:18px}:root body.secondary-page .song-card-action{color:var(--studio-accent)}:root body.secondary-page .song-card-level{background:#e9eadd;color:#59604c}:root body.secondary-page .song-category-heading h2{font-size:23px;color:var(--studio-ink)}:root body.secondary-page .footer{background:var(--studio-bg);color:var(--studio-muted);border-top:1px solid var(--studio-line)}:root body.secondary-page .song-hero-panel{background:none;box-shadow:none;border:0;padding:5px 0 24px;gap:30px}:root body.secondary-page .song-hero-panel h1{font-size:32px;line-height:1.4;color:var(--studio-ink)}:root body.secondary-page .song-note-preview{background:#eceee3;border:1px solid var(--studio-line);border-radius:14px;padding:20px}:root body.secondary-page .song-meta-grid{gap:16px;margin:16px 0}:root body.secondary-page .song-meta-item{background:none;border:0;padding:0}:root body.secondary-page .song-meta-item strong{font-size:14px}:root body.secondary-page .score-stage{margin-top:24px;background:var(--studio-paper);border:1px solid var(--studio-line);border-radius:16px;box-shadow:none}:root body.secondary-page .score-stage h2{font-size:21px;color:var(--studio-ink)}:root body.secondary-page .song-practice-shell{margin:0}:root body.secondary-page .btn.primary{background:var(--studio-ink);color:white;box-shadow:none;border-color:var(--studio-ink)}:root body.secondary-page .btn.secondary{background:var(--studio-paper);color:var(--studio-ink);border:1px solid var(--studio-line);box-shadow:none}:root body.secondary-page .song-content-section{margin-top:36px}.library-browser{max-width:1152px;margin:0 auto 28px;padding:0 24px}.library-search-row{display:flex;align-items:center;gap:20px;justify-content:space-between}.library-search-row label{display:flex;align-items:center;flex:1;max-width:480px;position:relative}.library-search-row input{width:100%;min-height:48px;padding:12px 15px;background:var(--studio-paper);border:1px solid var(--studio-line);border-radius:10px;color:var(--studio-ink);font-size:14px}.library-count{color:var(--studio-muted);font-size:12px;white-space:nowrap}.library-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.library-filters button{border:1px solid var(--studio-line);background:transparent;border-radius:30px;padding:10px 16px;font-size:12px;min-height:42px;color:var(--studio-muted)}.library-filters button[aria-pressed=true]{background:var(--studio-ink);color:var(--studio-paper);border-color:var(--studio-ink)}.library-empty{padding:30px;text-align:center;border:1px dashed var(--studio-line);border-radius:12px;margin-top:20px;color:var(--studio-muted)}
@media(min-width:1100px){.studio-range button{visibility:hidden}.studio-range{justify-content:center}}
@media(max-width:1050px){.studio-promise{display:none}.studio-instrument .piano-container{min-width:990px}.studio-song-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-learn{gap:40px}.studio-bottom>[role=status]{display:none}.studio-footer{margin:0 32px}}
@media(max-width:640px){:root body .nav-container{padding:0 16px;min-height:69px;gap:6px}:root body .nav-links{gap:0}:root body .nav-links a{font-size:12px;padding:8px 10px;min-height:42px}:root body .nav-links a.studio-language{margin-left:3px;padding-left:9px}.studio-brand{gap:7px;font-size:16px}.studio-brand small{font-size:7px;letter-spacing:1px;margin-top:4px}.brand-keys{width:26px;height:28px}.brand-keys i{width:4px;height:16px}.studio-main{padding:0 14px}.studio-intro{padding:24px 2px 20px}.studio-intro h1{font-size:26px;letter-spacing:-.8px;max-width:350px}.studio-intro p{font-size:12px}.studio-kicker{font-size:9px!important;letter-spacing:1px}.studio-toolbar{padding:10px;gap:5px}.studio-modes{padding:3px}.studio-modes button{padding:8px 10px;font-size:12px;min-height:37px}.studio-toolbar .studio-quiet{font-size:10px;padding:6px 9px;min-height:43px}.studio-song-bar{padding:10px;gap:8px;flex-wrap:wrap}.studio-song-bar label{display:none}.studio-song-bar select{width:150px;flex:1;font-size:12px;padding:8px}.studio-song-bar a{display:none}.studio-primary{padding:8px 11px;font-size:12px}.studio-surface{padding:20px 12px 0}.studio-display{min-height:79px;gap:12px;margin-bottom:20px}.studio-eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:10px}.studio-instrument .studio-display h2{font-size:17px;margin-bottom:6px}.studio-instrument .studio-display p{font-size:10px;max-width:240px}.studio-readout{padding-left:14px;min-width:67px}.studio-readout>span{font-size:28px}.studio-readout small{font-size:8px}.studio-display:has(.key-hint[style*="block"]) .studio-readout{display:none}:root body .studio-instrument .hint-key{font-size:30px}:root body .studio-instrument .key-hint{padding-left:12px;min-width:66px}:root body .studio-instrument .piano-container{height:196px;min-width:1012px}.studio-range{min-height:48px;font-size:9px}.studio-range button{min-width:50px;font-size:10px;padding:0}.mobile-only{display:inline}.studio-bottom{padding:10px 12px}.studio-settings{gap:15px;justify-content:space-between;width:100%}.studio-volume{gap:5px;font-size:10px}.studio-volume input{width:65px}.studio-volume output{display:none}.studio-toggle{font-size:10px;gap:5px;min-height:38px}.studio-more{padding:0 12px;font-size:10px}.studio-upcoming{gap:6px}.studio-upcoming span{flex-basis:31px;min-height:30px;font-size:12px}.studio-discover{padding:32px 2px}.studio-section-heading{gap:10px;margin-bottom:17px;align-items:center}.studio-section-heading h2,.studio-learn h2{font-size:21px}.studio-section-heading>a{font-size:10px}.studio-song-grid{grid-template-columns:1fr;gap:9px}.studio-song-card{padding:12px;gap:12px}.studio-song-art{height:54px;flex-basis:50px;font-size:30px}.studio-song-copy>strong{font-size:14px}.studio-song-copy>small,.studio-song-copy>span{font-size:10px}.studio-song-arrow{align-self:center}.studio-learn{grid-template-columns:1fr;gap:20px;padding:28px 2px 35px}.studio-learn>div>p:not(.studio-kicker){font-size:11px;margin-top:10px}.studio-footer{margin:0 16px;padding:20px 0;font-size:10px;gap:10px}.studio-footer>span:nth-child(2){display:none}.library-browser{padding:0 18px}.library-search-row{align-items:flex-start;flex-direction:column;gap:10px}.library-search-row label{width:100%;max-width:none}.library-filters{gap:6px}.library-filters button{padding:8px 12px;font-size:11px}:root body.secondary-page .song-library-main,:root body.secondary-page .song-page-main,:root body.secondary-page .secondary-main{padding-top:22px}:root body.secondary-page .song-hero-panel{display:block;padding-bottom:20px}:root body.secondary-page .song-hero-panel h1{font-size:25px}:root body.secondary-page .song-note-preview{display:none}:root body.secondary-page .song-meta-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}:root body.secondary-page .song-meta-item strong{font-size:12px}:root body.secondary-page .song-meta-item span{font-size:9px}:root body.secondary-page .song-lead{font-size:12px}:root body.secondary-page .song-composer{font-size:11px}:root body.secondary-page .score-stage-header{display:block}:root body.secondary-page .score-stage-toolbar{flex-wrap:wrap}}
@media(max-height:550px) and (orientation:landscape){:root body .studio-instrument:fullscreen .studio-display,:root body .studio-instrument.studio-focus-fallback .studio-display{min-height:40px;margin:0 0 10px}.studio-instrument:fullscreen .studio-eyebrow,.studio-instrument.studio-focus-fallback .studio-eyebrow,.studio-instrument:fullscreen .studio-more,.studio-instrument.studio-focus-fallback .studio-more,.studio-instrument:fullscreen .studio-submessage{display:none}.studio-instrument:fullscreen .studio-surface,.studio-instrument.studio-focus-fallback .studio-surface{padding-top:10px}.studio-instrument:fullscreen .studio-bottom,.studio-instrument.studio-focus-fallback .studio-bottom{padding-top:4px;padding-bottom:4px}.studio-instrument:fullscreen .studio-toolbar,.studio-instrument.studio-focus-fallback .studio-toolbar{padding:5px 12px}}
@media(prefers-reduced-motion:reduce){html,.studio-keyboard-viewport{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Contrast and inherited pseudo-labels on the older editorial templates. */
:root body.secondary-page .nav-bar{background:var(--studio-bg);backdrop-filter:none}
:root body.secondary-page .nav-links>a{color:var(--studio-muted);border-radius:9px}
:root body.secondary-page .nav-links>a.active,:root body.secondary-page .nav-links>a:hover{color:var(--studio-ink);background:#eaeae1}
:root body.secondary-page :is(.song-lead,.song-composer,.song-note-preview p,.song-card p,.song-card-composer,.song-breadcrumbs,.song-breadcrumbs a,.song-meta-item span,.score-stage-header p,.score-stage-options,.song-library-hero p,.library-stats span,.song-category-heading>span,.secondary-lead,.secondary-hero p){color:var(--studio-muted)}
:root body.secondary-page :is(.song-meta-item strong,.song-note-preview h2,.score-mode-button,.song-card h3){color:var(--studio-ink)}
:root body.secondary-page .song-library-hero{margin:0 auto 24px;padding:14px 0 22px;max-width:1200px}
:root body.secondary-page .library-stats{margin-top:18px}
:root body.secondary-page .library-stats span{border-color:var(--studio-line);background:#eeeee6}
:root body.secondary-page .song-card-composer{display:block;font-size:11px;line-height:1.5}
:root body.secondary-page .song-card{display:flex;flex-direction:column;gap:8px;box-shadow:none!important}
:root body.secondary-page .song-card-action{margin-top:auto}
:root body.secondary-page .secondary-shell{padding-top:24px}
:root body.secondary-page .secondary-hero{padding:20px 0 28px;margin-bottom:24px}
:root body.secondary-page .secondary-hero:after{display:none}
:root body .studio-instrument .key::before,:root body .studio-instrument .key::after{display:none!important}
:root body .studio-instrument input[type=range]{accent-color:var(--studio-accent)}
:root body .studio-instrument :is(button,input,select){max-width:100%}
@media(max-width:360px){:root body .nav-container{padding:0 10px}.studio-brand{font-size:14px}:root body .nav-links a{padding:8px 7px;font-size:11px}.brand-keys{width:23px}.studio-toolbar .studio-quiet{padding:6px}.studio-modes button{font-size:11px;padding:8px}.studio-intro h1{font-size:23px}}
:root body.secondary-page :is(.secondary-section-heading h2,.tutorial-index-section h2,.secondary-card h2,.secondary-card h3){color:var(--studio-ink)}
:root body.secondary-page :is(.secondary-section-heading p,.secondary-card p){color:var(--studio-muted)}
:root body.secondary-page .secondary-eyebrow{color:var(--studio-accent)}
:root body.secondary-page :is(.primary-action,.secondary-action){background:var(--studio-paper);color:var(--studio-ink);border:1px solid var(--studio-line);border-radius:9px;box-shadow:none}
:root body.secondary-page .primary-action{background:var(--studio-ink);color:white}
:root body.secondary-page .score-mode-group{gap:5px;padding:4px;background:#eeeee6;border-radius:10px}
:root body.secondary-page .score-mode-button{padding:9px 12px;min-height:42px;border-radius:7px;border:0;font-size:12px;font-weight:600;white-space:nowrap}
:root body.secondary-page .score-mode-button.is-active{background:var(--studio-gold)}
:root body.secondary-page .song-card-level{align-self:flex-start;padding:3px 9px;border-radius:5px}