:root{--win-face: #c0c0c0;--win-light: #dfdfdf;--win-shadow: #808080;--win-dark: #000000;--win-hi: #ffffff;--win-text: #000000;--win-blue: #000080;--win-blue-2: #1084d0;--win-disabled:#7f7f7f}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;width:100%}body{background:var(--win-face);color:var(--win-text);font-family:"MS Sans Serif",Tahoma,Geneva,Arial,sans-serif;font-size:11px;line-height:1.2;overflow:hidden}.player{display:flex;align-items:stretch;height:100%;width:100%;padding:4px;gap:6px;background:var(--win-face);color:var(--win-text);border-top:2px solid var(--win-hi);border-left:2px solid var(--win-hi);border-right:2px solid var(--win-dark);border-bottom:2px solid var(--win-dark);box-shadow:inset 1px 1px 0 var(--win-light),inset -1px -1px 0 var(--win-shadow)}.player-empty{align-items:center;justify-content:space-between;padding:8px}.player-msg{font-size:11px;color:var(--win-text)}.player-play{flex:0 0 auto;width:44px;background:var(--win-face);color:var(--win-text);border-top:2px solid var(--win-hi);border-left:2px solid var(--win-hi);border-right:2px solid var(--win-dark);border-bottom:2px solid var(--win-dark);box-shadow:inset 1px 1px 0 var(--win-light),inset -1px -1px 0 var(--win-shadow);border-radius:0;font-family:"MS Sans Serif",Tahoma,Arial,sans-serif;font-size:18px;cursor:pointer;padding:0;line-height:1}.player-play:disabled{color:var(--win-disabled);text-shadow:1px 1px 0 var(--win-hi);cursor:not-allowed}.player-play:active:not(:disabled){border-top:2px solid var(--win-dark);border-left:2px solid var(--win-dark);border-right:2px solid var(--win-hi);border-bottom:2px solid var(--win-hi);box-shadow:inset 1px 1px 0 var(--win-shadow),inset -1px -1px 0 var(--win-light)}.player-mid{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between;min-width:0;gap:4px}.player-leds{display:grid;grid-template-columns:repeat(16,1fr);gap:2px;flex:0 0 auto;padding:3px;background:var(--win-hi);border-top:2px solid var(--win-shadow);border-left:2px solid var(--win-shadow);border-right:2px solid var(--win-hi);border-bottom:2px solid var(--win-hi);box-shadow:inset 1px 1px 0 var(--win-dark),inset -1px -1px 0 var(--win-light)}.player-led{height:12px;background:var(--win-face);border-top:1px solid var(--win-hi);border-left:1px solid var(--win-hi);border-right:1px solid var(--win-shadow);border-bottom:1px solid var(--win-shadow)}.player-led.has-note{background:var(--win-blue-2);border-color:var(--win-blue)}.player-led.is-playhead{background:var(--win-blue);border-top:1px solid var(--win-dark);border-left:1px solid var(--win-dark);border-right:1px solid var(--win-blue-2);border-bottom:1px solid var(--win-blue-2)}.player-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;text-transform:none;padding:0 2px}.player-bpm{font-weight:700;font-family:Courier New,monospace}.player-link{color:var(--win-blue);text-decoration:underline;font-family:"MS Sans Serif",Tahoma,Arial,sans-serif}.player-link:hover{color:var(--win-blue-2)}