*{box-sizing:border-box}html{color-scheme:dark;background:#101921;color:#f6f1e7;font:17px system-ui,-apple-system,sans-serif}body{margin:0}header,main{max-width:800px;margin:auto;padding:16px clamp(16px,5vw,40px)}header{display:flex;align-items:center;gap:12px;border-bottom:1px solid #33474e;letter-spacing:.1em}header img{width:48px;height:48px;border-radius:12px}em,.chord{color:#ecc17d;font-style:normal}main{padding-bottom:60px}h1{font-size:clamp(2rem,6vw,3rem);line-height:1.1;margin:.4em 0}h2{margin:.7em 0 .3em}p{line-height:1.45}button,a.action,input,select{min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid #47606a;font:inherit;background:#20323c;color:inherit;margin:4px 4px 4px 0}button{cursor:pointer}button:disabled{opacity:.55}button:focus-visible,a:focus-visible{outline:3px solid #ecc17d}a{color:#ecc17d}.card{display:block;text-align:left;padding:18px;width:100%;margin:6px 0}.card b,.card small{display:block}.card small{color:#cad5d7;margin-top:4px}.tilegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(255px,100%),1fr));gap:8px}.chord{font-size:2.4rem;font-weight:700}#status:not(:empty){background:#213840;padding:12px;border-radius:10px}label{display:block;margin:.6em 0}input[type=range]{width:100%;padding:0}input[type=checkbox]{min-height:0}article{border-bottom:1px solid #344650;padding:10px 0}.row{display:flex;flex-wrap:wrap;align-items:center;gap:4px}.gold{background:#e2b775;color:#152028}input[type=file]{max-width:100%}[hidden]{display:none!important}progress{width:100%}
.practice-score{padding:24px 0;min-height:240px;text-align:center;overflow-wrap:anywhere}.practice-score .chord{font-size:clamp(72px,19vw,144px);line-height:1.1;letter-spacing:-.03em;margin:8px 0 20px}.practice-lyric{font-size:clamp(28px,5vw,46px);font-weight:600;line-height:1.4;margin:16px 0}.practice-next{font-size:clamp(22px,4vw,30px);color:#cad5d7;margin:16px 0}@media(min-width:768px){.practice-score{min-height:320px}}