:root{--bg:#101a14;--panel:#18241d;--field:#101a14;--line:#2b3c32;--text:#f1e8e4;--muted:#b3bba8;--accent:#c0394f;--accent-ink:#fff;--accent-soft:#e0707f;--glow:#c0394f4d;--lane:#18241d;--grid:#ffffff10;--bar:#ffffff30;--hit-line:#060c08;--note:#c0394f;--note-label:#fff;--note-mark:#ffd0d7;--note-octave:#edb8bf;--note-octave-label:#3a1018;--note-octave-mark:#8a1c30;--miss:#ff6b6b;--wood-light:#bf7243;--wood-dark:#7a3d1f;--wood-lines:#3a140533;--wood-sheen:#ffd8b850;--wood-edge:#ffffff30;--wood-inside-top:#4a2412;--wood-inside-bottom:#6a341a;--wood-label:#f3d6c2;--wood-value:#fff3ea;--maple-light:#ecd3ae;--maple:#dcb98c;--burnt:#3a1606;--brass-light:#d9b26a;--brass:#b88a45;--brass-dark:#7c5a28;--tine-light:#f4f6f8;--tine-dark:#9aa3ab;--tine-label:#1c1c1c;--retuned:#b3261e;--octave:#1a4fa0;--forest:#101a14;--sand:#b38e55;--sand-panel:#bd9a60;--sand-field:#cbac77;--sand-line:#94713d;--sand-ink:#24170a;--sand-muted:#36260f;--sand-rose:#5c0d1b;--max-tongue:min(34vh, 360px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--text);flex-direction:column;align-items:center;margin:0;padding:0 16px 48px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;display:flex}header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 16px;width:min(100%,1200px);padding:12px 0 10px;display:flex}header,.practice{--bg:var(--sand);--panel:var(--sand-panel);--field:var(--sand-field);--line:var(--sand-line);--text:var(--sand-ink);--muted:var(--sand-muted);--accent-soft:var(--sand-rose);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--sand);box-shadow:0 0 0 100vmax var(--sand);clip-path:inset(0 -100vmax)}.practice{padding-bottom:14px}h1{letter-spacing:.01em;margin:0;font-size:1.3rem}h1 .key{color:var(--muted);font-weight:400}header p{color:var(--muted);margin:0;font-size:.85rem}kbd{border:1px solid var(--muted);border-radius:3px;padding:0 4px;font-size:.85em}#app{flex-direction:column;align-items:center;width:100%;display:flex}.practice{flex-direction:column;gap:10px;width:min(100%,1200px);display:flex}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 16px}.field{min-width:0;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;flex-direction:column;gap:6px;font-size:.75rem;display:flex}.field select{text-overflow:ellipsis;width:100%;min-width:0}.field select,.field input[type=text],.song-editor textarea{font:inherit;letter-spacing:0;text-transform:none;color:var(--text);background:var(--field);border:1px solid var(--line);border-radius:8px;font-size:.95rem}.field select,.field input[type=text]{height:40px;padding:0 12px}.field select:focus-visible,.field input:focus-visible,.song-editor textarea:focus-visible,button:focus-visible,.click-toggle:focus-within{outline:2px solid var(--accent-soft);outline-offset:2px}input[type=range],input[type=checkbox]{accent-color:var(--accent)}button{font:inherit;cursor:pointer}.controls button,.song-strip button{height:40px;color:var(--text);border:1px solid var(--line);background:0 0;border-radius:10px;padding:0 18px;font-weight:600}.controls button:hover,.song-strip button:hover,.import-row button:hover{border-color:var(--accent-soft)}.controls button[name=start]{background:var(--accent);height:44px;color:var(--accent-ink);border-color:var(--accent);box-shadow:0 4px 14px var(--glow);padding:0 30px;font-weight:700}.controls button[name=stop]{height:44px}.controls{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.controls .song{flex:1.6 200px}.controls .mode,.controls .transpose{flex:140px}.controls .tempo{flex:190px}.controls .tempo span{align-items:center;gap:10px;height:40px;display:flex}.controls .tempo input{flex:1;width:100%;min-width:0}.controls .meter{flex:0 0 80px}.controls output{color:var(--text);letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums;min-width:4.5em;font-size:.95rem}.controls .click-toggle{border:1px solid var(--line);background:var(--field);height:40px;color:var(--text);cursor:pointer;border-radius:8px;align-items:center;gap:10px;padding:0 14px;font-size:.95rem;display:flex}.controls .click-toggle input{width:18px;height:18px;margin:0}.controls .actions{gap:10px;margin-left:auto;display:flex}.song-editor textarea,.tab-view{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.875rem;line-height:1.6}.tab-view{--lines:2;box-sizing:content-box;height:calc(var(--lines) * 1.6em);white-space:pre-wrap;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:8px;margin:0;padding:6px 14px 0;position:relative;overflow:hidden}.tab-note.now{background:var(--accent);color:var(--accent-ink);box-shadow:0 0 0 2px var(--accent);border-radius:4px}.import-row{flex-wrap:wrap;align-items:flex-end;gap:12px 14px;display:flex}.import-row .field{flex:220px}.import-row button{height:40px;color:var(--text);border:1px solid var(--accent-soft);background:0 0;border-radius:8px;padding:0 20px;font-weight:600}.import-row .help-link{color:var(--accent-soft);text-underline-offset:3px;border:none;margin-left:auto;padding:0 4px;font-weight:400;text-decoration:underline}.overlay{width:min(800px,100vw - 32px);max-width:none;max-height:calc(100dvh - 32px);color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0;overflow:auto;box-shadow:0 24px 60px #00000080}.overlay::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#060c08b3}.overlay header{z-index:1;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:nowrap;justify-content:space-between;align-items:center;width:auto;max-width:none;margin:0;padding:14px 20px;display:flex;position:sticky;top:0}.overlay h2{color:var(--text);margin:0;font-size:1.1rem;font-weight:600}.overlay header button{width:36px;height:36px;color:var(--text);border:1px solid var(--line);background:0 0;border-radius:8px;padding:0;font-size:1.4rem;line-height:1}.song-editor-body{flex-direction:column;gap:14px;padding:16px 20px 20px;display:flex}.song-editor textarea{resize:vertical;width:100%;padding:10px 14px}.editor-error:empty{display:none}.format-help>p{color:var(--muted);margin:14px 20px;font-size:.9rem}.format-sections{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:18px 28px;padding:0 20px;display:grid}.format-help h3{color:var(--accent-soft);letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px;font-size:.75rem;font-weight:600}.format-help dl{grid-template-columns:7rem 1fr;align-items:baseline;gap:6px 14px;margin:0;display:grid}.format-help dt code{color:var(--text);background:var(--field);border:1px solid var(--line);white-space:pre;border-radius:6px;padding:2px 8px;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.875rem;display:inline-block}.format-help dd{margin:0;font-size:.9rem;line-height:1.4}.song-strip{position:relative}.song-strip .tab-view{cursor:pointer;padding-right:214px}.song-strip button{border-color:var(--accent-soft);background:var(--panel);align-items:center;gap:8px;height:32px;padding:0 14px;font-weight:400;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.song-strip svg{fill:none;width:16px;height:16px;stroke:var(--accent-soft);stroke-width:2px;stroke-linejoin:round;stroke-linecap:round}@media (width<=700px){.song-strip .tab-view{padding-right:56px}.song-strip button{padding:0 10px}.song-strip .label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}.highway-box .status{z-index:1;background:color-mix(in srgb, var(--bg) 85%, transparent);text-align:center;pointer-events:none;border-radius:999px;width:max-content;max-width:calc(100% - 16px);margin:0;padding:3px 12px;font-size:.85rem;position:absolute;top:6px;left:50%;transform:translate(-50%)}.highway-box .status:empty{display:none}.tongue.retuned .letter,.tongue.retuned .cipher{color:var(--retuned)}.tongue .octave{color:var(--octave);margin-left:1px;font-size:1.6em;font-weight:900;line-height:.6}.skipped{color:var(--muted);margin:0;font-size:.8rem}.skipped:empty{display:none}.error{color:var(--miss);margin:0;font-size:.9rem}.error:empty{display:none}.stage{flex-direction:column;align-items:center;max-width:100%;padding-top:16px;display:inline-flex}.highway-box{align-self:stretch;height:21vh;min-height:140px;margin-bottom:14px;position:relative}.highway{width:100%;height:100%;display:block;position:absolute;inset:0}.kalimba,.bonnet-underside,.klang-cavity{--grain-lines:repeating-linear-gradient(179.2deg, transparent 0 9px, var(--wood-lines) 9px 10px, transparent 10px 23px, var(--wood-lines) 23px 25px, transparent 25px 41px)}.kalimba{--gap:clamp(2px, .6vw, 6px);align-items:flex-start;gap:var(--gap);--side:clamp(10px, 3vw, 36px);--head:30px;--top:18px;padding:var(--top) var(--side) 48px;background:radial-gradient(ellipse 70% 45% at 50% 26%, var(--wood-sheen), transparent 70%), url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MDAiIGhlaWdodD0iNDIwIiB2aWV3Qm94PSIwIDAgOTAwIDQyMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPCEtLSB3b29kIGdyYWluOiBub2lzZSBzdHJldGNoZWQgYWxvbmcgdGhlIGJvYXJkIChzbG93IGFjcm9zcyB4LCBmYXN0IGRvd24geSksIGl0cyBoaWdoIHN0cmVha3MgYXMgZGFyayBmaWJyZXMgLS0+CiAgPGZpbHRlciBpZD0iZ3JhaW4iIHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPgogICAgPGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMDAzMiAwLjEyIiBudW1PY3RhdmVzPSI0IiBzZWVkPSIzNyIgLz4KICAgIDwhLS0gdGhlIGZpYnJlcycgaW5rIGEgZGVlcCBydXN0IGJyb3duOyBhbHBoYSBmcm9tIHRoZSBub2lzZSdzIHJlZCBjaGFubmVsLCBvbmx5IGl0cyBwZWFrcyAtLT4KICAgIDxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAuMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAwIDAuMDMgIDEuOTUgMCAwIDAgLTAuNzkiIC8+CiAgPC9maWx0ZXI+CiAgPHJlY3Qgd2lkdGg9IjkwMCIgaGVpZ2h0PSI0MjAiIGZpbHRlcj0idXJsKCNncmFpbikiIC8+Cjwvc3ZnPgo=) 0 0 / 100% 100% no-repeat, var(--grain-lines), linear-gradient(180deg, var(--wood-light), var(--wood-dark));background-blend-mode:normal, multiply, normal, normal;box-shadow:0 10px 40px #000a, inset 0 2px 0 var(--wood-edge), inset 0 -6px 14px #0004;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:18px 18px 48% 48%/18px 18px 27% 27%;max-width:100%;display:flex;position:relative}.kalimba:before{content:"";left:6%;right:6%;top:calc(var(--top) + var(--head) - 14px);pointer-events:none;background:linear-gradient(180deg, var(--brass-light), var(--brass) 45%, var(--brass-dark));z-index:1;border-radius:4px;height:14px;position:absolute;box-shadow:0 2px 4px #0006,inset 0 1px #fff5}.tongue{width:clamp(14px,3.4vw,34px);height:calc(var(--max-tongue) * var(--length));background:linear-gradient(90deg, var(--tine-dark), var(--tine-light) 45%, var(--tine-dark));color:var(--tine-label);cursor:pointer;transform-origin:50% 0;border:none;border-radius:2px 2px 40% 40%/2px 2px 10px 10px;flex-direction:column;justify-content:flex-end;align-items:center;padding:0 0 8px;font:600 clamp(9px,1.6vw,15px)/1.05 system-ui,sans-serif;display:flex;position:relative;box-shadow:0 3px 6px #0007}.tongue:focus-visible{outline:2px solid var(--accent-soft);outline-offset:2px}.tongue-head{height:var(--head);cursor:cell;border-radius:2px 2px 0 0;position:absolute;inset:0 0 auto}.tongue-head:hover{background:linear-gradient(180deg, color-mix(in srgb, var(--accent-soft) 55%, transparent), transparent)}.tuning-reset{left:calc(var(--side) + 2px);top:calc(var(--top) + var(--max-tongue) * .44 + 26px);background:radial-gradient(circle at 35% 30%, var(--brass-light), var(--brass) 55%, var(--brass-dark));width:32px;height:32px;color:var(--brass-dark);cursor:pointer;border:none;border-radius:50%;padding:6px;transition:box-shadow .3s,filter .3s;position:absolute;box-shadow:inset 0 1px #fff6,inset 0 -2px 3px #0005,0 2px 4px #0008}.tuning-reset svg{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%;display:block}.tuning-reset:not(:disabled){box-shadow:inset 0 1px 0 #fff6, inset 0 -2px 3px #0005, 0 2px 4px #0008, 0 0 12px var(--brass-light)}.tuning-reset:not(:disabled):hover{filter:brightness(1.12)}.tuning-reset:not(:disabled):active svg{transition:transform .2s;transform:rotate(-60deg)}.tuning-reset:disabled{cursor:default;filter:saturate(.4)brightness(.75)}.tuning-reset:focus-visible{outline:2px solid var(--accent-soft);outline-offset:2px}.kalimba .engraving{right:var(--side);top:calc(var(--top) + var(--max-tongue) * .44 + 40px);text-align:center;letter-spacing:.02em;box-sizing:border-box;background:linear-gradient(180deg, color-mix(in srgb, var(--maple-light) 55%, transparent), color-mix(in srgb, var(--maple) 45%, transparent)), url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MDAiIGhlaWdodD0iNDIwIiB2aWV3Qm94PSIwIDAgOTAwIDQyMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPCEtLSB3b29kIGdyYWluOiBub2lzZSBzdHJldGNoZWQgYWxvbmcgdGhlIGJvYXJkIChzbG93IGFjcm9zcyB4LCBmYXN0IGRvd24geSksIGl0cyBoaWdoIHN0cmVha3MgYXMgZGFyayBmaWJyZXMgLS0+CiAgPGZpbHRlciBpZD0iZ3JhaW4iIHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPgogICAgPGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMDAzMiAwLjEyIiBudW1PY3RhdmVzPSI0IiBzZWVkPSIzNyIgLz4KICAgIDwhLS0gdGhlIGZpYnJlcycgaW5rIGEgZGVlcCBydXN0IGJyb3duOyBhbHBoYSBmcm9tIHRoZSBub2lzZSdzIHJlZCBjaGFubmVsLCBvbmx5IGl0cyBwZWFrcyAtLT4KICAgIDxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAuMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAwIDAuMDMgIDEuOTUgMCAwIDAgLTAuNzkiIC8+CiAgPC9maWx0ZXI+CiAgPHJlY3Qgd2lkdGg9IjkwMCIgaGVpZ2h0PSI0MjAiIGZpbHRlcj0idXJsKCNncmFpbikiIC8+Cjwvc3ZnPgo=) 30% 40% / 320% 260% no-repeat, repeating-linear-gradient(178.6deg, transparent 0 6px, #8a5a2a1f 6px 7px, transparent 7px 15px), linear-gradient(180deg, var(--maple-light), var(--maple));width:max-content;color:var(--burnt);text-shadow:0 0 1px #6a2a0a80;cursor:help;-webkit-user-select:none;user-select:none;white-space:pre;border-radius:6px;flex-direction:column;gap:2px;margin:0;padding:.5em .4em;font:italic 600 clamp(9px,1.35vw,14px)/1.35 Georgia,Times New Roman,serif;display:flex;position:absolute;box-shadow:inset 0 1px 2px #5a2a0a66,inset 0 -1px #fff4,0 1px #ffd8b833}.engraving span:first-child{letter-spacing:.04em;font-size:1.25em}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.tongue .key{opacity:.55;margin-top:6px;font-size:.75em;font-weight:400}.tongue.target{box-shadow:0 0 0 3px var(--accent), 0 0 18px var(--accent)}.tongue.plucked{animation:.6s ease-out ring}.tongue.miss{animation:.4s ease-out miss}@keyframes miss{0%{box-shadow:0 0 0 3px var(--miss), 0 0 18px var(--miss)}to{box-shadow:0 3px 6px #0007}}@keyframes ring{0%{filter:brightness(1.35) drop-shadow(0 0 6px var(--accent));transform:rotate(.8deg)}15%{transform:rotate(-.6deg)}30%{transform:rotate(.4deg)}45%{transform:rotate(-.2deg)}to{filter:none;transform:rotate(0)}}@media (prefers-reduced-motion:reduce){.tongue.plucked{animation:.4s ease-out glow}@keyframes glow{0%{filter:brightness(1.35)}to{filter:none}}}.klang-bay{--lift-time:.7s;--lift-ease:cubic-bezier(.3, .7, .2, 1);--lift:100deg;perspective:1600px;perspective-origin:50% 0;max-width:100%;display:grid;position:relative}.klang-bay>*{grid-area:1/1}@media (width<=700px){.klang-bay{perspective:5200px}}.bonnet{z-index:1;transform-origin:50% 0;transform-style:preserve-3d;transition:transform var(--lift-time) var(--lift-ease);align-self:start;position:relative}.klang-bay.open .bonnet{transform:rotateX(var(--lift))}.bonnet-front,.bonnet-front *,.bonnet-front .kalimba:before{backface-visibility:hidden}.bonnet-front{position:relative}.klang-bay.open .bonnet-front{visibility:hidden;transition:visibility 0s linear calc(var(--lift-time) * .35)}.bonnet-underside{backface-visibility:hidden;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MDAiIGhlaWdodD0iNDIwIiB2aWV3Qm94PSIwIDAgOTAwIDQyMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPCEtLSB3b29kIGdyYWluOiBub2lzZSBzdHJldGNoZWQgYWxvbmcgdGhlIGJvYXJkIChzbG93IGFjcm9zcyB4LCBmYXN0IGRvd24geSksIGl0cyBoaWdoIHN0cmVha3MgYXMgZGFyayBmaWJyZXMgLS0+CiAgPGZpbHRlciBpZD0iZ3JhaW4iIHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPgogICAgPGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMDAzMiAwLjEyIiBudW1PY3RhdmVzPSI0IiBzZWVkPSIzNyIgLz4KICAgIDwhLS0gdGhlIGZpYnJlcycgaW5rIGEgZGVlcCBydXN0IGJyb3duOyBhbHBoYSBmcm9tIHRoZSBub2lzZSdzIHJlZCBjaGFubmVsLCBvbmx5IGl0cyBwZWFrcyAtLT4KICAgIDxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAuMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAwIDAuMDMgIDEuOTUgMCAwIDAgLTAuNzkiIC8+CiAgPC9maWx0ZXI+CiAgPHJlY3Qgd2lkdGg9IjkwMCIgaGVpZ2h0PSI0MjAiIGZpbHRlcj0idXJsKCNncmFpbikiIC8+Cjwvc3ZnPgo=) 0 0 / 100% 100% no-repeat, var(--grain-lines), linear-gradient(0deg, var(--wood-inside-top), var(--wood-inside-bottom));background-blend-mode:multiply, normal, normal;cursor:pointer;border-radius:48% 48% 18px 18px/27% 27% 18px 18px;position:absolute;inset:0;transform:rotateX(180deg);box-shadow:inset 0 0 24px #0008}.bonnet-latch,.klang-actions button{background:linear-gradient(180deg, var(--brass-light), var(--brass) 55%, var(--brass-dark));color:#2a1c0a;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;border:none;border-radius:6px;height:22px;padding:0 14px;font:600 10px/22px system-ui,sans-serif;box-shadow:inset 0 1px #fff6,0 2px 4px #0008}.bonnet-latch:hover,.klang-actions button:hover{filter:brightness(1.08)}.bonnet-latch:focus-visible,.klang-actions button:focus-visible{outline:2px solid var(--accent-soft);outline-offset:2px}.bonnet-latch{z-index:2;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.klang-cavity{visibility:hidden;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MDAiIGhlaWdodD0iNDIwIiB2aWV3Qm94PSIwIDAgOTAwIDQyMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPCEtLSB3b29kIGdyYWluOiBub2lzZSBzdHJldGNoZWQgYWxvbmcgdGhlIGJvYXJkIChzbG93IGFjcm9zcyB4LCBmYXN0IGRvd24geSksIGl0cyBoaWdoIHN0cmVha3MgYXMgZGFyayBmaWJyZXMgLS0+CiAgPGZpbHRlciBpZD0iZ3JhaW4iIHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPgogICAgPGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMDAzMiAwLjEyIiBudW1PY3RhdmVzPSI0IiBzZWVkPSIzNyIgLz4KICAgIDwhLS0gdGhlIGZpYnJlcycgaW5rIGEgZGVlcCBydXN0IGJyb3duOyBhbHBoYSBmcm9tIHRoZSBub2lzZSdzIHJlZCBjaGFubmVsLCBvbmx5IGl0cyBwZWFrcyAtLT4KICAgIDxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAuMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAwIDAuMDMgIDEuOTUgMCAwIDAgLTAuNzkiIC8+CiAgPC9maWx0ZXI+CiAgPHJlY3Qgd2lkdGg9IjkwMCIgaGVpZ2h0PSI0MjAiIGZpbHRlcj0idXJsKCNncmFpbikiIC8+Cjwvc3ZnPgo=) 0 0 / 100% 100% no-repeat, var(--grain-lines), linear-gradient(180deg, var(--wood-inside-top), var(--wood-inside-bottom));background-blend-mode:multiply, normal, normal;transition:visibility 0s linear var(--lift-time);border-radius:18px 18px 48% 48%/18px 18px 27% 27%;position:absolute;inset:0;overflow:hidden;box-shadow:inset 0 6px 22px #000c,inset 0 0 0 1px #0006}.klang-bay.open .klang-cavity{visibility:visible;transition:none;position:relative}.klang{text-align:left;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));align-content:center;gap:8px 24px;min-height:100%;padding:24px clamp(14px,4vw,40px) 56px;display:grid}.klang label{color:var(--wood-label);grid-template-columns:6.5em minmax(3em,1fr) 4.5em;align-items:center;gap:8px;font-size:.85rem;display:grid}.klang input[type=range]{accent-color:var(--accent);width:100%}.klang output{color:var(--wood-value);text-align:right;font-variant-numeric:tabular-nums}.klang-actions{grid-column:1/-1;justify-content:center;gap:12px;margin-top:8px;display:flex}@media (prefers-reduced-motion:reduce){.klang-bay .bonnet,.klang-bay .klang-cavity,.klang-bay .bonnet-front,.klang-bay.open .bonnet-front{transition:none}}
