@font-face{font-family:Cormorant Garamond;font-style:normal;font-display:swap;font-weight:500;src:url(/prima-vista/assets/cormorant-garamond-latin-500-normal-BsRWmXhO.woff2)format("woff2"),url(/prima-vista/assets/cormorant-garamond-latin-500-normal-zIXX3Q-H.woff)format("woff")}@font-face{font-family:Cormorant Garamond;font-style:normal;font-display:swap;font-weight:600;src:url(/prima-vista/assets/cormorant-garamond-latin-600-normal-Co1r35X9.woff2)format("woff2"),url(/prima-vista/assets/cormorant-garamond-latin-600-normal-2CBVLo0M.woff)format("woff")}@font-face{font-family:Cormorant Garamond;font-style:italic;font-display:swap;font-weight:500;src:url(/prima-vista/assets/cormorant-garamond-latin-500-italic-Y14P-dkT.woff2)format("woff2"),url(/prima-vista/assets/cormorant-garamond-latin-500-italic-DhNIfkTX.woff)format("woff")}@font-face{font-family:"Source Sans 3";font-style:normal;font-display:swap;font-weight:400;src:url(/prima-vista/assets/source-sans-3-latin-400-normal-DQi5PRDE.woff2)format("woff2"),url(/prima-vista/assets/source-sans-3-latin-400-normal-RR2C27NP.woff)format("woff")}@font-face{font-family:"Source Sans 3";font-style:normal;font-display:swap;font-weight:600;src:url(/prima-vista/assets/source-sans-3-latin-600-normal-DeckBYAU.woff2)format("woff2"),url(/prima-vista/assets/source-sans-3-latin-600-normal-Ck0n4g8U.woff)format("woff")}@font-face{font-family:"Source Sans 3";font-style:normal;font-display:swap;font-weight:700;src:url(/prima-vista/assets/source-sans-3-latin-700-normal-CkzU-mV9.woff2)format("woff2"),url(/prima-vista/assets/source-sans-3-latin-700-normal-B-h9tW5h.woff)format("woff")}:root{--lacquer:#0a0a0c;--lacquer-2:#121216;--navy:#121a2a;--navy-2:#182238;--anthracite:#1d2027;--brass:#c9a96a;--brass-bright:#e2c78f;--brass-dim:#c9a96a61;--brass-faint:#c9a96a29;--ivory:#f1e9d6;--ivory-muted:#b8ae98;--paper:#f8f2e3;--paper-edge:#e8dec6;--ink:#141414;--emerald:#1d6a4a;--emerald-light:#7cc4a0;--bordeaux:#8a1f33;--bordeaux-light:#e3909e;--felt:#5c1a24;--serif:"Cormorant Garamond", "Iowan Old Style", Garamond, Georgia, serif;--sans:"Source Sans 3", "Segoe UI", system-ui, sans-serif;--radius:4px;--space:clamp(16px, 3vw, 28px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--sans);color:var(--ivory);background:var(--lacquer)}*{box-sizing:border-box}[hidden]{display:none!important}body{background:radial-gradient(120% 600px at 50% -120px, #ffffff12, transparent 70%) no-repeat, linear-gradient(180deg, var(--lacquer-2) 0, var(--lacquer) 700px) no-repeat, var(--lacquer);min-height:100vh;margin:0;line-height:1.45}body:before{content:"";pointer-events:none;z-index:-1;background:repeating-linear-gradient(90deg,#0000 0 27px,#f1e9d606 27px 28px);position:fixed;inset:0}.masthead{max-width:980px;padding:calc(var(--space) * 1.1) var(--space) 14px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin:0 auto;display:flex}.wordmark{align-items:center;gap:14px;display:flex}.ornament{fill:none;width:42px;height:42px;stroke:var(--brass);stroke-width:1.6px;stroke-linejoin:round;stroke-linecap:round;flex:none}.ornament .thin{stroke-width:1px;opacity:.8}.ornament .keys{stroke-width:.9px;opacity:.7}.wordmark h1{font-family:var(--serif);letter-spacing:.04em;color:var(--ivory);margin:0;font-size:clamp(2rem,5vw,2.6rem);font-weight:600;line-height:1}.tagline{font-family:var(--serif);letter-spacing:.06em;color:var(--brass);margin:6px 0 0;font-size:1.05rem;font-style:italic;font-weight:500}.brass-rule{max-width:980px;margin:0 auto calc(var(--space) * .9);padding:0 var(--space);height:9px;position:relative}.brass-rule:before{content:"";left:var(--space);right:var(--space);border-top:1px solid var(--brass-dim);position:absolute;top:4px}.brass-rule span{background:var(--lacquer);border:1px solid var(--brass);width:9px;height:9px;position:absolute;top:0;left:50%;transform:translate(-50%)rotate(45deg)}.midi-status{border:1px solid var(--brass-dim);color:var(--ivory-muted);background:#121a2ab3;border-radius:999px;max-width:100%;padding:7px 14px;font-size:.88rem}.midi-status .dot{vertical-align:middle;background:var(--brass);border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.midi-status.ok{color:var(--ivory);border-color:#7cc4a073}.midi-status.ok .dot{background:var(--emerald-light);box-shadow:0 0 6px #7cc4a099}.modes{max-width:980px;margin:0 auto calc(var(--space) * .9);padding:0 var(--space) 2px;flex-wrap:wrap;gap:2px 22px;display:flex}.modes::-webkit-scrollbar{display:none}@media (max-width:700px){.modes{scrollbar-width:none;flex-wrap:nowrap;overflow-x:auto}}.mode{font-family:var(--serif);letter-spacing:.02em;color:var(--ivory-muted);background:0 0;border:none;border-bottom:1px solid #0000;border-radius:0;flex:none;padding:6px 0 7px;font-size:1.15rem;font-weight:600}.mode:hover{color:var(--ivory);border-bottom-color:var(--brass-dim);background:0 0}.mode.active{color:var(--brass-bright);border-bottom-color:var(--brass)}.mode.planned,.mode.planned:hover{color:#b8ae9861;cursor:default;border-bottom-color:#0000}.layout{max-width:980px;padding:0 var(--space) calc(var(--space) * 2);gap:var(--space);margin:0 auto;display:grid}.layout>*{min-width:0}.card{background:linear-gradient(180deg, var(--navy-2), var(--navy));border:1px solid var(--brass-faint);border-radius:var(--radius);padding:var(--space);box-shadow:inset 0 1px #ffffff0a,0 18px 40px -24px #000000e6}.staff-card{background:radial-gradient(140% 90% at 50% 0%, #fffaf0 0%, var(--paper) 55%, #f1e8d3 100%);color:var(--ink);text-align:center;border:1px solid var(--paper-edge);padding:clamp(14px,3vw,28px) clamp(10px,3vw,28px) clamp(14px,2.5vw,22px);position:relative;box-shadow:inset 0 1px #fff9,0 24px 48px -20px #000000d9,0 0 0 1px #0009}.staff-card:before{content:"";pointer-events:none;border:1px solid #a0804059;border-radius:2px;position:absolute;inset:8px}.staff{justify-content:center;max-width:600px;margin:0 auto;display:flex}.task-caption{min-height:1.4em;font-family:var(--serif);color:#5b5040;margin:0 0 2px;font-size:1.25rem;font-style:italic;font-weight:500}.feedback-area{min-height:3.2em}.feedback{min-height:1.5em;font-family:var(--sans);letter-spacing:.01em;color:#4a4438;margin:4px 0 0;font-size:1.15rem;font-weight:600}.feedback.correct{color:var(--emerald);animation:.32s ease-out settle}.feedback.wrong{color:var(--bordeaux);animation:.32s ease-out settle}.feedback.skipped{color:#6b5a36;animation:.32s ease-out settle}.feedback-detail{color:#4a4438;min-height:1.3em;margin:2px 0 0;font-size:.98rem;animation:.32s ease-out settle}@keyframes settle{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}kbd{font-family:var(--sans);opacity:.7;border:1px solid;border-radius:3px;margin-left:4px;padding:1px 5px;font-size:.72em;font-weight:600}.knowledge-bar{flex-wrap:wrap;justify-content:center;gap:4px 22px;margin-top:6px;display:flex}button.quiet{color:#6b5a36;letter-spacing:.04em;background:0 0;border:none;border-bottom:1px solid #0000;border-radius:0;padding:4px 2px;font-size:.86rem}button.quiet:hover:not(:disabled){color:#3d3220;background:0 0;border-bottom-color:#a0804099}button.quiet:disabled{color:#a99c80;opacity:.6}button.quiet.used{color:var(--emerald)}.knowledge-card,.lesson-dialog{background:radial-gradient(140% 90% at 50% 0%, #fffaf0 0%, var(--paper) 60%, #f1e8d3 100%);color:#2a2620;border:1px solid var(--paper-edge);border-radius:var(--radius);box-shadow:0 24px 48px -24px #000000d9}.knowledge-card{padding:18px clamp(16px,3vw,28px);animation:.32s ease-out settle;position:relative}.knowledge-card:before,.lesson-dialog:before{content:"";border-top:2px solid var(--brass);position:absolute;top:0;left:clamp(16px,3vw,28px);right:clamp(16px,3vw,28px)}.knowledge-card[data-kind=tip]:before{border-top-color:var(--emerald)}.knowledge-head,.lesson-head{border-bottom:1px solid #a0804059;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:10px;padding-bottom:8px;display:flex}.knowledge-head h2,.lesson-head h2{font-family:var(--serif);color:#2a2620;margin:0;font-size:1.45rem;font-weight:600}button.close{color:#6b5a36;background:0 0;border:none;padding:0 4px;font-size:1.6rem;line-height:1}button.close:hover{color:#2a2620;background:0 0}.knowledge-note{color:#7a6c52;margin:8px 0 0;font-size:.82rem}.knowledge-note:empty{display:none}.knowledge-continue{flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;display:flex}.knowledge-continue .hint{color:#7a6c52}.prose{font-size:1rem;line-height:1.6}.prose p{margin:0 0 .7em}.prose h3,.prose h4{font-family:var(--serif);color:#5b4520;margin:1.2em 0 .35em;font-weight:600}.prose h3{font-size:1.35rem}.prose h4{font-size:1.15rem}.prose ul,.prose ol{margin:0 0 .8em;padding-left:1.3em}.prose li{margin:.15em 0}.prose strong{color:#1d1a15}.prose blockquote{border-left:2px solid var(--brass);font-family:var(--serif);background:#c9a96a1f;margin:.6em 0 1em;padding:8px 14px;font-size:1.1rem;font-style:italic}.prose blockquote p{margin:0}.notation-example{text-align:center;margin:.6em 0 1.1em}.notation-staff{justify-content:center;display:flex;overflow-x:auto}.notation-example figcaption{color:#6b5a36;margin-top:-4px;font-size:.86rem;font-style:italic}.lesson-dialog{width:min(820px,100vw - 24px);max-height:calc(100vh - 40px);padding:22px clamp(16px,4vw,40px) 26px;position:relative;overflow-y:auto}.shortcuts-dialog{width:min(560px,100vw - 24px)}.shortcuts-intro{color:#5b5040;margin:0 0 12px;font-size:.92rem}.shortcuts-list{grid-template-columns:max-content 1fr;align-items:baseline;gap:8px 18px;margin:0;display:grid}.shortcuts-list dt{text-align:right}.shortcuts-list dd{color:#2a2620;margin:0}.shortcuts-list kbd{opacity:1;color:#3d3220;background:#c9a96a2e;margin:2px 1px;display:inline-block}@media (max-width:600px){.shortcuts-list{grid-template-columns:1fr;gap:2px}.shortcuts-list dt{text-align:left;white-space:normal;margin-top:8px}}.lesson-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#050506b8}.lesson-head{background:inherit;z-index:1;padding-top:6px;position:sticky;top:-22px}.rhythm-card{gap:16px;display:grid}.rhythm-head{flex-wrap:wrap;align-items:center;gap:10px 18px;display:flex}.metronome-dot{background:radial-gradient(circle at 35% 30%, #f3dca6, var(--brass) 55%, #7d6532);opacity:.35;border-radius:50%;flex:none;width:22px;height:22px;box-shadow:0 0 0 1px #0009}.metronome-dot.pulse{animation:.26s ease-out beat-pulse}.metronome-dot.pulse.accent{animation-name:beat-pulse-accent}@keyframes beat-pulse{0%{opacity:1;transform:scale(1.35);box-shadow:0 0 18px 4px #e2c78f8c}to{opacity:.35;transform:scale(1)}}@keyframes beat-pulse-accent{0%{opacity:1;transform:scale(1.6);box-shadow:0 0 26px 8px #e2c78fb3}to{opacity:.35;transform:scale(1)}}.rhythm-count{min-width:1.2em;font-family:var(--serif);color:var(--brass-bright);font-variant-numeric:lining-nums;font-size:2rem;font-weight:600;line-height:1}.rhythm-status{color:var(--ivory-muted);flex:220px;margin:0}.rhythm-status[data-kind=ok]{color:var(--emerald-light)}.rhythm-status[data-kind=warn]{color:var(--bordeaux-light)}.rhythm-pad{border-radius:var(--radius);border:1px solid var(--brass-dim);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:radial-gradient(120% 120% at 50% 0,#ffffff0f,#0000 60%),linear-gradient(#17171b,#070708);align-content:center;place-items:center;gap:6px;min-height:170px;transition:border-color .16s;display:grid;box-shadow:inset 0 1px #ffffff12,inset 0 -2px #000c}.rhythm-pad:hover{border-color:var(--brass)}.rhythm-pad.tapped{animation:.18s ease-out pad-tap}@keyframes pad-tap{0%{background-color:#c9a96a47;box-shadow:inset 0 0 40px #e2c78f59}to{background-color:#0000}}.rhythm-pad-label{font-family:var(--serif);color:var(--ivory);font-size:1.6rem;font-weight:600}.rhythm-pad-hint{color:var(--ivory-muted);font-size:.85rem}input[type=range]{accent-color:var(--brass)}.answer-card{gap:14px;display:grid}.answer-row{grid-template-columns:4.5em 1fr;align-items:center;gap:12px;display:grid}.answer-label{font-family:var(--serif);color:var(--brass-bright);font-size:1.2rem;font-style:italic}.answer-buttons{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:6px;display:grid}.key-choice{font-family:var(--serif);padding:7px 4px;font-size:1.08rem;font-weight:600}.key-choice.chosen{background:var(--brass-faint);border-color:var(--brass-bright);color:var(--brass-bright)}.key-choice.right,.key-choice.right:disabled{opacity:1;border-color:var(--emerald-light);color:var(--ivory);background:#1d6a4a8c;animation:.32s ease-out settle}.key-choice.wrong,.key-choice.wrong:disabled{opacity:1;border-color:var(--bordeaux-light);color:var(--ivory);background:#8a1f3380}.answer-footer{flex-wrap:wrap;align-items:center;gap:8px 16px;display:flex}.circle{justify-content:center;padding-top:4px;display:flex}.circle-svg{width:min(100%,340px);height:auto}.circle-svg .segment{fill:#0a0e188c;stroke:var(--brass-dim);stroke-width:1px;transition:fill .3s}.circle-svg .segment.minor{fill:#0a0e18cc}.circle-svg .segment.highlight{fill:#1d6a4a8c}.circle-svg .hub{fill:var(--lacquer);stroke:var(--brass);stroke-width:1px}.circle-svg .label{fill:var(--ivory);font-family:var(--serif);font-weight:600}.circle-svg .label.minor{fill:var(--ivory-muted);font-weight:500}.circle-svg .label.highlight{fill:#fff}@media (max-width:600px){.answer-row{grid-template-columns:1fr;gap:6px}.answer-buttons{grid-template-columns:repeat(5,1fr)}}.session{border:1px solid var(--brass-faint);border-radius:var(--radius);background:#121a2a8c;grid-template-columns:repeat(5,1fr);display:grid}.metric{text-align:center;flex-direction:column;gap:2px;padding:14px 8px 12px;display:flex}.metric+.metric{border-left:1px solid var(--brass-faint)}.metric-value{font-family:var(--sans);font-variant-numeric:tabular-nums lining-nums;color:var(--ivory);font-size:1.35rem;font-weight:600}.metric-label{text-transform:uppercase;letter-spacing:.14em;color:var(--brass);font-size:.72rem}.keyboard-bar{color:var(--ivory-muted);flex-wrap:wrap;align-items:center;gap:10px 18px;margin-bottom:16px;font-size:.92rem;display:flex}.eyebrow{color:var(--ivory)}.eyebrow strong{color:var(--brass-bright);font-weight:600}.keyboard-buttons{gap:8px;display:inline-flex}.hint{color:var(--ivory-muted)}button{font:inherit;letter-spacing:.03em;border-radius:var(--radius);border:1px solid var(--brass-dim);color:var(--ivory);cursor:pointer;background:0 0;padding:7px 14px;font-size:.88rem;transition:background-color .16s,border-color .16s,color .16s}button:hover{border-color:var(--brass);background:var(--brass-faint)}button:active{background:#c9a96a42}button.primary{border-color:var(--brass);color:var(--lacquer);background:var(--brass);font-weight:600}button.primary:hover{background:var(--brass-bright)}button:disabled{opacity:.45;cursor:default}button.primary:disabled:hover{background:var(--brass)}.selection-bar{align-items:center;gap:10px;display:inline-flex}.selection-bar[hidden]{display:none}button.danger{color:var(--bordeaux-light);border-color:#e3909e59;margin-top:16px}button.danger:hover{border-color:var(--bordeaux-light);background:#8a1f3340}:focus-visible{outline:2px solid var(--brass-bright);outline-offset:2px}.keyboard{overscroll-behavior-x:contain;scrollbar-color:var(--brass-dim) transparent;background:linear-gradient(#19191d,#070708);border-radius:3px;padding:10px 10px 12px;overflow-x:auto;box-shadow:inset 0 1px #ffffff14,inset 0 -1px #000c,0 10px 24px -14px #000000e6}.piano{-webkit-user-select:none;user-select:none;touch-action:none;border-top:4px solid var(--felt);height:190px;position:relative;box-shadow:0 -1px #0009}.key{cursor:pointer;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:8px;font-size:.68rem;line-height:1.25;transition:background .22s,box-shadow .22s,transform 60ms;display:flex;position:absolute;top:0}.key.white{color:#776b53;z-index:1;background:linear-gradient(#e9dfc9 0%,#fbf6ea 9%,#f6efdf 70%,#ece2cb 100%);border:1px solid #b7aa8e;border-top:none;border-radius:0 0 4px 4px;height:100%;box-shadow:inset 0 -6px 0 -2px #00000012,inset 1px 0 #ffffffb3,0 2px 2px #00000073}.key.black{height:62%;color:var(--brass);z-index:2;background:linear-gradient(#050506 0%,#1d1d22 78%,#2d2d33 90%,#0d0d10 100%);border-radius:0 0 3px 3px;box-shadow:inset 1px 0 #ffffff24,inset -1px 0 #0009,inset 0 -5px #ffffff0d,0 4px 5px #0000008c}.key.white.held{background:linear-gradient(#ded2b8 0%,#efe6d2 12%,#ebe1cb 100%);box-shadow:inset 0 3px 6px #0000002e}.key.black.held{background:linear-gradient(#000 0%,#141418 85%,#1f1f24 100%);transform:translateY(1px);box-shadow:inset 0 2px 3px #000c,0 1px 2px #00000080}.key .pc-label{letter-spacing:.04em;opacity:.75;font-weight:700}.key .note-label{font-variant-numeric:lining-nums;font-weight:600}.piano.compact .key{padding-bottom:6px;font-size:.6rem}.piano.selecting .key{cursor:copy}.key.white.selected{background:linear-gradient(#efe1bd,#e2cc97)}.key.black.selected{background:linear-gradient(#2a2112,#7a6232)}.key.selected:after{content:"";background:var(--brass);width:8px;height:8px;position:absolute;bottom:28px;left:50%;transform:translate(-50%)rotate(45deg);box-shadow:0 0 0 1px #00000059}.key.white.flash-correct{background:linear-gradient(#cfe3d4,#a9d0b9)}.key.black.flash-correct{background:linear-gradient(#0c2a1e,#1d6a4a)}.key.white.flash-wrong{background:linear-gradient(#ecd1d3,#d9a5ac)}.key.black.flash-wrong{background:linear-gradient(#2c0910,#8a1f33)}.key.flash-hint{box-shadow:inset 0 0 0 3px var(--emerald), 0 2px 2px #00000073}.key.white.flash-hint{background:linear-gradient(#e3eee2,#c4dfcd)}.key.black.flash-hint{background:linear-gradient(#0c2a1e,#24734f)}.panel{padding-top:18px;padding-bottom:18px}.panel>summary{cursor:pointer;font-family:var(--serif);letter-spacing:.02em;color:var(--ivory);align-items:center;gap:12px;font-size:1.45rem;font-weight:600;list-style:none;display:flex}.panel>summary::-webkit-details-marker{display:none}.panel>summary:before{content:"";border-right:1.5px solid var(--brass);border-bottom:1.5px solid var(--brass);width:7px;height:7px;transition:transform .2s;transform:rotate(-45deg)}.panel[open]>summary:before{transform:rotate(45deg)}.panel[open]>summary{border-bottom:1px solid var(--brass-faint);padding-bottom:14px}.settings{gap:16px;margin-top:16px;display:grid}.settings fieldset{border:1px solid var(--brass-faint);border-radius:var(--radius);grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px 20px;margin:0;padding:14px 16px 16px;display:grid}.settings legend{font-family:var(--serif);color:var(--brass-bright);padding:0 8px;font-size:1.15rem;font-style:italic;font-weight:500}.settings label{color:var(--ivory-muted);flex-direction:column;gap:6px;font-size:.9rem;display:flex}.settings label.check{color:var(--ivory);flex-direction:row;align-items:center;gap:10px}.settings label[hidden]{display:none}.settings select,.settings input[type=number]{font:inherit;border-radius:var(--radius);border:1px solid var(--brass-dim);color:var(--ivory);background:#0e1420;padding:8px 10px;font-size:.95rem}.settings select:hover,.settings input[type=number]:hover{border-color:var(--brass)}.settings input[type=checkbox]{accent-color:var(--brass);width:16px;height:16px}.check-group{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 16px;display:grid}.settings .full{color:var(--ivory-muted);grid-column:1/-1;margin:0;font-size:.86rem}.error{color:var(--bordeaux-light);grid-column:1/-1;margin:0}.stats-groups{gap:8px;margin-top:16px;display:grid}.octave{border:1px solid var(--brass-faint);border-radius:var(--radius);background:#0a0e1859;padding:8px 14px}.octave summary{cursor:pointer;flex-wrap:wrap;align-items:baseline;gap:4px 16px;list-style:none;display:flex}.octave-name{font-family:var(--serif);font-variant-numeric:lining-nums;min-width:5.5em;color:var(--ivory);font-size:1.15rem;font-weight:600}.octave summary::-webkit-details-marker{display:none}.octave summary:before{content:"";border-right:1.5px solid var(--brass);border-bottom:1.5px solid var(--brass);align-self:center;width:6px;height:6px;transition:transform .2s;transform:rotate(-45deg)}.octave[open] summary:before{transform:rotate(45deg)}.octave-figures{color:var(--ivory-muted);font-variant-numeric:tabular-nums lining-nums;font-size:.88rem}.octave summary.weak .octave-figures{color:var(--bordeaux-light)}.table-wrap{margin-top:10px;overflow-x:auto}.stats-table{border-collapse:collapse;font-variant-numeric:tabular-nums lining-nums;width:100%;font-size:.86rem}.stats-table th{text-transform:uppercase;letter-spacing:.12em;color:var(--brass);border-bottom:1px solid var(--brass-dim);font-size:.72rem;font-weight:600}.stats-table th,.stats-table td{text-align:right;padding:5px 8px}.stats-table td{border-bottom:1px solid #c9a96a1a}.stats-table .text{text-align:left}.stats-table td.weak{color:var(--bordeaux-light);font-weight:600}@media (max-width:600px){.session{grid-template-columns:repeat(3,1fr)}.metric:nth-child(4){border-left:none}.metric:nth-child(n+4){border-top:1px solid var(--brass-faint)}.piano{height:150px}.key{font-size:.6rem}.ornament{width:34px;height:34px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}