*{box-sizing:border-box}body{margin:0;background:#f4f2e9;color:#153c3c;font:15px/1.5 ui-sans-serif,system-ui,sans-serif}main{max-width:1320px;margin:auto;padding:24px 34px}header{display:flex;align-items:center;gap:28px;border-bottom:1px solid #ccd4c9;padding-bottom:19px}.brand{color:inherit;text-decoration:none;letter-spacing:.18em;font-weight:800;font-size:17px}header>span{font-size:13px;color:#657a71}header>button{margin-left:auto}button,select{font:inherit;color:inherit;border:1px solid #b6c7b8;background:#fcfcf4;border-radius:8px;padding:9px 13px;cursor:pointer}button:hover{background:#e1eadb}button:focus-visible,select:focus-visible,#pad:focus-visible{outline:3px solid #dc9c4d;outline-offset:3px}button:disabled{opacity:.4;cursor:default}button.active{background:#214f49;color:#fcf2cf;border-color:#214f49}.intro{display:flex;align-items:center;justify-content:space-between;padding:28px 0 25px}small{font-size:10px;letter-spacing:.19em;font-weight:700;color:#6d8174}h1{font:46px/1.2 Georgia,serif;margin:8px 0 10px;letter-spacing:-.035em}h1 em{color:#9a613b}p{margin:4px 0;color:#60776d}.stats{display:flex;flex-direction:column;text-align:right}.stats b{font:32px Georgia,serif}.stats span{font-size:11px;color:#6d8174}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:22px}#pad{position:relative;aspect-ratio:1.32;overflow:hidden;border-radius:15px;touch-action:none;user-select:none;background:#12383b;cursor:crosshair;color:#fff3d2}#pad>img{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.9}#trails{position:absolute;width:100%;height:100%;inset:0}#overlay{position:absolute;top:20px;left:24px;right:24px;pointer-events:none;text-shadow:0 2px 10px #092c2f}#modeLabel{font-size:10px;letter-spacing:.2em;color:#e2d1a8}h2{font:30px Georgia,serif;margin:6px 0}#overlay p{font-size:12px;color:#dfddd0}.vowel{position:absolute;font:13px Georgia;letter-spacing:.2em;opacity:.75;pointer-events:none}.tl{top:145px;left:20px}.tr{top:145px;right:20px}.bl{bottom:22px;left:20px}.br{bottom:22px;right:20px}#cursor{position:absolute;left:50%;top:50%;width:32px;height:32px;border:1px solid #d6f4e2;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;transition:box-shadow .15s}#cursor i{position:absolute;inset:10px;background:#fff2bc;border-radius:50%}#pad.singing #cursor{box-shadow:0 0 18px 10px #bfffc852;background:#d9ffd630}#pad.singing>img{filter:brightness(1.12)}.stagebar{display:flex;align-items:center;gap:12px;padding:13px 0}.stagebar>span{flex:1;font-size:13px}aside{display:flex;flex-direction:column;gap:14px}.card{padding:18px;background:#eaece1;border:1px solid #d5ddcf;border-radius:12px}#gardens{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:12px 0 8px}#gardens button{padding:9px 4px}#free{width:100%;font-size:12px}label{display:flex;flex-direction:column;gap:7px;font-size:12px;margin-top:12px}select{font-size:12px;width:100%}input{accent-color:#436c50;width:100%}.hint{font-size:11px;margin-top:10px}.echo p{font-size:12px;margin:10px 0}.buttons{display:flex;gap:5px}.buttons button{font-size:11px;padding:8px}.echo>span{display:block;font-size:10px;color:#6d8174;margin-top:10px}footer{display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:11px;color:#708277}details{max-width:500px}summary{cursor:pointer}a{color:#426e53}@media(max-width:900px){main{padding:18px}.workspace{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr}.echo{grid-column:1/-1}h1{font-size:38px}header>span{display:none}#pad{aspect-ratio:1.3}footer{flex-direction:column}.stats b{font-size:25px}}@media(max-width:480px){h1{font-size:32px}.intro p{font-size:12px}.stats span{max-width:60px}aside{grid-template-columns:1fr}.echo{grid-column:auto}header{gap:8px}.brand{font-size:14px}header>button{font-size:12px}#overlay{top:14px;left:16px}h2{font-size:24px}.tl,.tr{top:120px}.stagebar>span{font-size:11px}}