.loading-overlay.active{opacity:1;pointer-events:all}.btn-danger{background:var(--error-color);color:white}.recording-indicator.active{display:inline-flex}.template-option{aspect-ratio:16/9;background:var(--bg-tertiary);border:2px solid transparent;border-radius:var(--radius-lg);cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}.template-option:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.template-option.active{border-color:var(--accent-color);box-shadow:0 0 20px rgba(236,72,153,.4)}.template-preview{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center}.template-canvas{width:100%;height:100%}.template-name{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.8);color:white;padding:var(--spacing-sm);font-size:.75rem;text-align:center;font-weight:500}.recording-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--bg-tertiary);border-radius:var(--radius-md);flex-wrap:wrap;gap:var(--spacing-sm)}.recording-info{display:flex;flex-direction:column;gap:var(--spacing-xs);flex:1}.recording-name{font-weight:500;font-size:.875rem}.recording-meta{font-size:.75rem;color:var(--text-secondary)}.recording-actions{display:flex;gap:var(--spacing-sm)}.status-message.show{transform:translateX(0)}.status-message.success{background:var(--success-color);color:white}.status-message.error{background:var(--error-color);color:white}.status-message.warning{background:var(--warning-color);color:white}@media (max-width:768px){.recording-item{flex-direction:column;align-items:stretch}.recording-actions{justify-content:center}}