/* Export controls stay outside the recording compositor. */
[hidden] { display: none !important; }
body.text-hidden .masthead, body.text-hidden .edition { visibility: hidden; }
.recording-source { position: fixed; left: -10000px; top: 0; width: 1px; height: 1px; pointer-events: none; }
.controls #toggle-record { color: #df96a7; }
#toggle-record .record-icon circle { fill: currentColor; stroke: none; }
#toggle-record .stop-icon { display: none; }
#toggle-record[aria-pressed="true"] .record-icon { display: none; }
#toggle-record[aria-pressed="true"] .stop-icon { display: block; }
#toggle-record .stop-icon rect { fill: currentColor; stroke: none; }
#record-feedback { position: absolute; bottom: max(94px, calc(env(safe-area-inset-bottom) + 80px)); left: 50%; transform: translateX(-50%); width: min(90%, 420px); display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; pointer-events: none; }
#record-status { font: 11px/1.5 "SFMono-Regular", Consolas, monospace; color: #e2bdc8; padding: 5px 9px; background: #08090be6; border-radius: 3px; }
.save-actions { display: flex; gap: 8px; pointer-events: auto; }
.save-actions button { min-height: 44px; padding: 10px 16px; color: #efd5dd; border: 1px solid #55404a; border-radius: 3px; background: #21171d; font: 13px Georgia, serif; cursor: pointer; }
.save-actions button:focus-visible { outline: 2px solid #e2b7c6; outline-offset: 3px; }
.controls button:disabled, .save-actions button:disabled { opacity: .4; cursor: not-allowed; }
@media (min-width: 700px) { #record-feedback { left: 42px; transform: none; align-items: flex-start; text-align: left; } }