@font-face{font-family:System;src:local("Segoe UI"),local("Arial")}html,body{margin:0;min-height:100svh;background:#111;color:#eee;font-family:System,sans-serif;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}body{padding:1.5rem;box-sizing:border-box}.header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.header h1{font-size:1.1rem;font-weight:600;margin:0}.panel{margin-bottom:1.5rem}.panel h2{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:#999;margin:0 0 .5rem}.pill{display:inline-block;padding:.3rem .7rem;border-radius:999px;font-size:.85rem;font-weight:600}.pill-unknown{background:#333;color:#aaa}.pill-connecting{background:#4a3b00;color:#fc3}.pill-open{background:#0d3d1f;color:#4ade80}.pill-closed{background:#4a0d0d;color:#f87171}.pill-status-idle{background:#1e2a3d;color:#7dd3fc}.pill-status-recording{background:#4a0d0d;color:#f87171}.pill-status-uploading{background:#4a3b00;color:#fc3}.badges{display:flex;gap:.5rem}.badge{padding:.3rem .7rem;border-radius:.4rem;font-size:.85rem;font-family:monospace;border:1px solid #333}.badge-on{background:#0d3d1f;color:#4ade80;border-color:#4ade80}.badge-off{background:#1a1a1a;color:#666}.log-panel{flex:1}.log{list-style:none;margin:0;padding:0;max-height:60svh;overflow-y:auto;border:1px solid #333;border-radius:.4rem}.log li{padding:.4rem .7rem;font-family:monospace;font-size:.8rem;border-bottom:1px solid #222;white-space:pre-wrap;word-break:break-all}.log li:last-child{border-bottom:none}