:root{color:#f4f0dc;font-synthesis:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#102923;font-family:system-ui,sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0}#app{height:100dvh}.practice-room{grid-template-rows:auto minmax(0,1fr) auto auto;gap:8px;height:100%;padding:12px;display:grid}button,input,select{font:inherit}button,select{color:#f4f0dc;cursor:pointer;background:#203d30;border:1px solid #526b5b;border-radius:8px;min-height:48px;padding:8px 16px;font-weight:600}button:hover:not(:disabled),select:hover{background:#345447}button.primary,button[aria-pressed=true]{color:#102923;background:#d8ed9a;border-color:#d8ed9a}button:disabled{opacity:.45;cursor:default}:focus-visible{outline-offset:2px;outline:3px solid #f1c878}.toolbar{align-items:center;gap:8px;display:flex}.toolbar select{flex:1;min-width:0}.toolbar a{color:#d8ed9a;font-size:12px}.guide-area{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex}#guide{object-fit:contain;width:100%;height:100%;display:block}.controls{justify-content:center;align-items:center;gap:8px;display:flex}.tempo{white-space:nowrap;align-items:center;gap:10px;margin-left:8px;font-size:13px;display:flex}.tempo input{accent-color:#d8ed9a;width:110px;min-width:0}.status-bar{color:#a9beb4;flex-wrap:wrap;justify-content:center;gap:2px 20px;font-size:12px;line-height:1.3;display:flex}.status-bar p{overflow-wrap:anywhere;margin:0}.status-bar p:empty{display:none}.xr-output{pointer-events:none;width:1px;height:1px;position:fixed;top:-2px;left:-2px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (width<=700px){.practice-room{gap:6px;padding:8px}button,select{padding:6px 10px;font-size:12px}.toolbar{flex-wrap:wrap}.toolbar select{flex-basis:100%}.toolbar button{flex:1}.controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.tempo{grid-column:1/-1;justify-content:center;margin:0}.tempo input{width:min(220px,60vw)}.status-bar{gap:2px 10px;font-size:11px}}@media (height<=500px) and (width>=701px){.practice-room{gap:4px;padding:6px}.status-bar{font-size:10px}}[hidden]{display:none!important}#next.primary{min-width:180px}@media (width<=700px){#next.primary{grid-column:span 2;min-width:0}}
