*{box-sizing:border-box}body{margin:0;background:#eef1f5;color:#203047;font:17px/1.6 system-ui,sans-serif}main{max-width:1100px;margin:auto;padding:22px}header{display:flex;justify-content:space-between;font-size:13px;letter-spacing:.08em}a{color:#405ba4}h1{font-size:clamp(23px,4vw,36px);font-weight:500;margin:15px 0}#visual{position:relative;background:white;border:1px solid #d7deea;border-radius:16px;overflow:hidden;display:grid;place-items:center;height:min(68vh,730px);min-height:280px}canvas{width:100%;height:100%;object-fit:contain}#settings{padding:20px 0}.controls{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}button,select{font:inherit;border-radius:9px;border:1px solid #bac8dc;padding:10px 15px;background:white;color:#243c60;cursor:pointer}button:hover{background:#e3ebf9}button:focus-visible,select:focus-visible{outline:3px solid #6893e8}#play{background:#354d87;color:white;min-width:105px}button:disabled{opacity:.5}label{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}input[type=range]{width:140px}#sound-controls{display:flex;gap:24px;flex-wrap:wrap}#description{max-width:800px}#status{font-size:14px;color:#536882}#restore{position:absolute;right:12px;bottom:12px;opacity:.75}.compact header,.compact h1,.compact #settings{display:none}.compact main{max-width:none;padding:0}.compact #visual{height:100vh;border:0;border-radius:0}main:fullscreen{background:#eef1f5;max-width:none;width:100%;overflow:auto}#word{font-weight:700;font-size:clamp(35px,8vw,100px);text-align:center}#piano{width:95%;max-width:1000px;padding:30px 10px}#piano .keys{display:flex;height:200px}#piano button{padding:0;flex:1;border-radius:0 0 6px 6px;min-width:0;font-size:clamp(9px,1.5vw,15px);display:flex;align-items:flex-end;justify-content:center;padding-bottom:15px;box-shadow:0 4px 2px #aaa;touch-action:none}#piano button.active{background:#c8dbff;transform:translateY(3px);box-shadow:none}#piano p{text-align:center;color:#556} [hidden]{display:none!important}@media(max-width:600px){main{padding:12px}select{max-width:100%;font-size:15px}#piano .keys{height:145px}#visual{height:55vh}}canvas{position:absolute;inset:0;min-width:0;min-height:0;display:block}