.recorded-whiteboard{--board-accent:#205d4f;display:grid;gap:12px;min-width:0;color:#183a32;font:inherit}.board-toolbar,.board-playback{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.recorded-whiteboard button,.recorded-whiteboard select{min-height:44px;padding:8px 12px;border:1px solid #bdcbc5;border-radius:8px;background:#f5f8f6;color:#183a32;font:inherit;cursor:pointer}.recorded-whiteboard button:disabled{opacity:.55;cursor:default}.recorded-whiteboard button[hidden]{display:none}.recorded-whiteboard .board-field{display:flex;align-items:center;gap:8px;min-width:0;font-size:.9rem}.recorded-whiteboard label{font-size:.9rem}.recorded-whiteboard input[type=color]{width:44px;height:40px;padding:3px;border:1px solid #bdcbc5;border-radius:6px;background:#fff}.recorded-whiteboard input[type=range]{accent-color:var(--board-accent);min-height:34px;max-width:100%}.board-toolbar input[type=range]{width:95px}.board-canvas{display:block;width:100%;aspect-ratio:8/5;background:#fff;border:1px solid #a9bcb3;border-radius:8px;touch-action:none;cursor:crosshair;box-sizing:border-box}.board-playback .board-field:has(input[type=range]){flex:1 1 220px}.board-playback input[type=range]{flex:1;min-width:90px;width:100%}.board-time{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.9rem;direction:ltr}.board-status,.board-hint{margin:0;line-height:1.5;font-size:.88rem;overflow-wrap:anywhere}.board-status{min-height:1.5em;color:#34574a}.recorded-whiteboard :focus-visible{outline:3px solid #a47724;outline-offset:3px}.recorded-whiteboard audio{display:none}@media(max-width:500px){.board-toolbar,.board-playback{gap:8px}.board-toolbar button{flex:1 1 125px}.board-playback .board-field:has(input[type=range]){flex-basis:100%}.recorded-whiteboard .board-field{flex-wrap:wrap}.board-canvas{aspect-ratio:8/5}}