:root{color-scheme:dark;--bg:#101312;--text:#eeeae0;--muted:#9a9e96;--gold:#dabd82;--line:#30342f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:14px}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:6px}header,main,footer{max-width:1320px;margin:auto}header{height:110px;display:flex;align-items:center;justify-content:space-between;padding:0 60px}.brand{font-family:Georgia,serif;font-size:30px;letter-spacing:-1.8px}.brand span{color:var(--gold)}.edition,.eyebrow,.stage-caption,.below,#pedal,footer>span:nth-child(2){font-size:10px;font-weight:500;letter-spacing:2px}.edition{color:var(--muted);display:flex;align-items:center;gap:15px}.edition i,.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold)}.about-link{font-size:12px;color:#c1c3ba}.intro{text-align:center;padding:46px 20px 4px}.eyebrow{color:var(--gold)}h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(58px,6.5vw,91px);font-weight:400;letter-spacing:-4px;line-height:1.01;margin:25px 0 23px}h1 em{font-weight:400;color:var(--gold)}.subtitle{color:var(--muted);font-size:14px;letter-spacing:.2px}.stage{position:relative;height:330px;margin:14px 60px 0;isolation:isolate}.stage-glow{position:absolute;inset:0 0 -30px;background:radial-gradient(ellipse at 50% 70%,#b89c5d14,transparent 66%);z-index:-1}.stage-caption{position:absolute;top:20px;left:0;right:0;display:flex;justify-content:space-between;color:#898e83;font-size:9px;letter-spacing:1.6px}canvas{position:absolute;width:100%;height:220px;bottom:89px;left:0}#keyboard{position:absolute;bottom:26px;left:0;width:100%;height:83px;display:flex;border-top:3px solid #5f5746;filter:drop-shadow(0 9px 12px #0008)}.key{position:relative;flex:1;background:linear-gradient(#b4b6aa,#e2e1d6 55%,#c3c5b9);border:1px solid #373b35;border-radius:0 0 3px 3px;transform-origin:top;--strength:0}.key.black{position:absolute;top:-1px;height:56px;z-index:2;background:linear-gradient(90deg,#101410,#2d312b 48%,#121610);border:1px solid #080c09;box-shadow:0 3px 2px #0009;border-radius:0 0 2px 2px}.key.active{background:linear-gradient(#bc985c,#ffe1a1);box-shadow:0 0 22px #e8c37a80;transform:scaleY(.97)}.key.black.active{background:linear-gradient(#514127,#bc9656)}.piano-edge{position:absolute;bottom:16px;height:10px;width:100%;background:linear-gradient(#49473c,#252a24);border-radius:0 0 3px 3px}.stage-base{position:absolute;bottom:0;width:100%;height:16px;background:linear-gradient(#171c16,#101312);transform:perspective(250px) rotateX(-8deg)}.player{margin:22px 60px 0;padding:28px 0;display:grid;grid-template-columns:1.2fr 1fr .8fr;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:25px}.piece .eyebrow{font-size:9px}.piece h2{font-family:Georgia,serif;font-size:25px;font-weight:400;letter-spacing:-.5px;margin:9px 0}.piece p{font-size:11px;color:var(--muted);margin:0}.piece p span{margin:0 7px;color:#676d61}.transport{display:flex;align-items:center;gap:20px}.play{background:var(--gold);border:0;width:60px;height:60px;border-radius:50%;color:#22281e;cursor:pointer;font-size:18px;flex-shrink:0}.play:hover{background:#ead29e}.play:disabled{opacity:.5;cursor:progress}#status{font-size:12px;color:#deded3}.time{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:10px;margin-top:11px;min-width:145px;font-variant-numeric:tabular-nums}.time-line{height:1px;width:72px;background:#525649}.volume{display:flex;gap:12px;align-items:center;justify-content:end;color:var(--muted);font-size:11px}.volume input{width:94px;accent-color:var(--gold);height:24px}.volume output{min-width:27px}.below{margin:19px 60px;display:flex;justify-content:space-between;gap:20px;color:#949b8c;font-size:9px;letter-spacing:.8px}.below .dot{margin-right:7px}.below button{background:none;border:0;color:#b4b9ad;font-size:10px;padding:0;cursor:pointer}.notes{border-top:1px solid var(--line);margin:82px 60px 0;padding:45px 0;display:grid;grid-template-columns:1fr 1fr;gap:100px}.notes h2{font-family:Georgia,serif;font-weight:400;font-size:37px;line-height:1.1;margin:18px 0}.notes p{color:var(--muted);font-size:13px;line-height:1.8;max-width:390px}.notes .eyebrow{font-size:10px;color:var(--gold)}.technical{padding-top:15px}.technical h3{font-size:14px;font-weight:500}.technical a{display:block;font-size:11px;color:var(--gold);margin-top:16px}.mode-row{display:flex;flex-direction:column;gap:10px;margin-top:23px;font-size:11px;color:#c3c7ba}select{background:#1c221c;color:var(--text);padding:10px;border:1px solid #434937;border-radius:4px;max-width:290px}footer{padding:30px 60px 42px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);border-top:1px solid #242a22}footer .brand{font-size:24px}footer a{font-size:10px}@media(min-width:1500px){.intro{padding-top:70px}.stage{height:365px}canvas{height:255px}}@media(max-width:760px){header{height:82px;padding:0 24px}.edition{display:none}.brand{font-size:28px}.intro{padding-top:34px}h1{font-size:65px;letter-spacing:-3px}.subtitle{font-size:12px}.stage{margin:25px 20px 0;height:280px}.stage-caption{font-size:7px;letter-spacing:.7px}canvas{height:196px;bottom:63px}#keyboard{height:59px;bottom:17px}.key.black{height:39px}.piano-edge{bottom:9px;height:8px}.stage-base{height:9px}.player{margin:20px 24px 0;grid-template-columns:1fr 1fr;gap:26px;padding:23px 0}.piece{grid-column:1 / -1;text-align:center}.piece h2{font-size:26px}.transport{gap:12px}.play{width:52px;height:52px}.time{min-width:105px}.time-line{width:38px}#status{font-size:10px}.volume{gap:7px}.volume label{display:none}.volume input{width:65px}.below{margin:18px 24px;flex-wrap:wrap;gap:15px;font-size:8px}.below>span:first-child{flex:1 1 100%}.notes{margin:55px 24px 0;padding:30px 0;grid-template-columns:1fr;gap:15px}.notes h2{font-size:34px}.notes p{max-width:none}footer{padding:25px 24px}footer>span:nth-child(2){font-size:8px;letter-spacing:1px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.key.active{transform:none}}

.technical details{margin:20px 0;color:var(--muted);font-size:12px}.technical summary{cursor:pointer;color:var(--gold);padding:10px 0}.technical details label{display:block;font-size:11px;margin:14px 0 8px}.technical audio{width:100%;max-width:380px;height:36px}

.catalogue-panel{max-width:1100px;margin:1.5rem auto;padding:0 1.5rem;display:grid;gap:.8rem}.catalogue-panel select{width:100%;min-height:44px;background:#171c19;color:#eee3cc;border:1px solid #575345;padding:.7rem;border-radius:8px}.catalogue-panel nav{display:flex;flex-wrap:wrap;gap:1rem}.catalogue-panel a{color:#c9b786;font-size:.8rem}button:disabled{opacity:.6}