:root{color-scheme:dark;font:12px ui-monospace,SFMono-Regular,monospace;color:#b6ffcf;background:#070b09}*{box-sizing:border-box}body{margin:0;height:100vh;height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}header{display:flex;align-items:center;gap:10px;padding:6px 12px;min-width:0;flex:none}strong{font-size:11px;letter-spacing:.12em}#piece{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}time{font-size:15px;font-weight:700;white-space:nowrap}.separator{color:#42584a}#status{width:5px;height:5px;border-radius:50%;background:#526257;flex:none}#status[data-live=true]{background:#b6ffcf;box-shadow:0 0 5px #b6ffcf}button{background:none;color:inherit;border:0;cursor:pointer;padding:7px;touch-action:manipulation}button:focus-visible{outline:1px solid}#fullscreen{margin-left:auto;flex:none;width:36px;height:36px}svg{width:100%;height:100%}main{position:relative;flex:1;min-height:0}canvas{display:block;width:100%;height:100%}#waiting{position:absolute;inset:45% 0 auto;text-align:center;color:#708578;font-size:11px;pointer-events:none}dialog{max-width:320px;background:#0c1510;border:1px solid #35463c;color:inherit;line-height:1.7}dialog::backdrop{background:#0009}@media(max-width:430px){header{gap:7px;padding:4px 8px}strong{font-size:10px}time{font-size:14px}}