/* Compact public recorder. Admin styles stay in styles.css. */
.recording-app { min-height: 100svh; font-family: 'Segoe UI', system-nepali, system-ui, sans-serif; padding-bottom: env(safe-area-inset-bottom); }
.recording-app .app-header { max-width: 600px; height: 76px; padding: 12px 24px; border: 0; gap: 20px; }
.recording-app .brand { font-size: 25px; gap: 10px; }
.recording-app .brand-mark { width: 36px; height: 38px; font-size: 23px; }
.app-admin { min-height: 44px; display: inline-flex; align-items: center; padding: 6px 14px; border: 1px solid var(--line); border-radius: 24px; font-size: 15px; }
.app-main { max-width: 600px; margin: 0 auto; padding: 4px 24px 24px; }
.app-stepper { display: flex; gap: 8px; margin: 8px 0 24px; padding: 0; list-style: none; }
.app-stepper li { flex: 1; border-top: 3px solid #dbdfd2; padding: 10px 4px 0; font-size: 14px; color: var(--muted); text-align: center; transition: border-color .2s, color .2s; }
.app-stepper li.current { color: var(--green); border-color: var(--green); font-weight: 600; }
.recording-app .app-card { padding: 26px; border-radius: 20px; box-shadow: 0 8px 32px #253d3505; }
.recording-app h1 { font-family: inherit; font-size: 28px; font-weight: 650; letter-spacing: -.7px; line-height: 1.2; margin: 0 0 24px; }
.recording-app .form-grid { gap: 18px 16px; margin: 0 0 20px; }
.recording-app .form-grid .name-field, .recording-app .form-grid .region-field { grid-column: 1 / -1; }
.recording-app .form-grid .age-field, .recording-app .form-grid .gender-field { grid-column: auto; }
.recording-app label { font-size: 16px; font-weight: 500; }
.recording-app input, .recording-app select { min-height: 52px; border-radius: 11px; font-size: 16px; padding: 12px; margin-top: 8px; }
.recording-app .consent-details { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 15px 0 0; margin: 0 0 18px; font-size: 15px; }
.recording-app .consent-details summary { min-height: 32px; color: var(--muted); }
.recording-app .consent-details p { line-height: 1.7; }
.recording-app .checkbox-label { font-size: 15px; font-weight: 400; line-height: 1.65; gap: 12px; }
.recording-app .checkbox-label input { min-height: 22px; width: 22px; height: 22px; margin-top: 3px; padding: 0; border-radius: 5px; }
.app-action { padding-top: 24px; }
.recording-app .button { min-height: 54px; border-radius: 12px; font-size: 17px; transition: transform .12s, background-color .15s; }
.recording-app .button:active:not(:disabled), .recording-app .record-button:active:not(:disabled) { transform: scale(.97); }
.recording-app #register-button { margin-top: 0; }
.recording-app .notice { margin: 0 0 16px; padding: 12px 16px; border-radius: 12px; font-size: 15px; }
.app-session { display: flex; gap: 12px; justify-content: space-between; align-items: center; margin: -6px 0 14px; }
.recording-app .mac-button { min-height: 44px; min-width: 82px; padding: 8px 18px; border: 1px solid #c5c7c1; border-radius: 9px; background: linear-gradient(#fff, #eeefeb); color: #343a35; box-shadow: 0 1px 2px #00000012, inset 0 1px 0 #ffffffd9; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 15px; font-weight: 500; line-height: 1.2; text-decoration: none; transition: background .15s, box-shadow .15s, transform .1s; }
.recording-app .mac-button:hover:not(:disabled) { background: linear-gradient(#fff, #e5e7e1); border-color: #afb4aa; }
.recording-app .mac-button:active:not(:disabled) { background: #e2e5de; box-shadow: inset 0 1px 2px #00000012; transform: translateY(1px); }
.recording-app .mac-button:focus-visible { outline: 3px solid #0a84ff70; outline-offset: 3px; }
.recording-app .mac-button:disabled { opacity: .5; cursor: default; }
.recording-app .privacy-badge { font-size: 13px; border-radius: 8px; padding: 6px 9px; font-variant-numeric: tabular-nums; }
.recording-app .text-button { min-height: 44px; font-size: 15px; }
.recording-app .mode-tabs { border: 0; background: #eaece2; margin: 0 0 20px; padding: 5px; border-radius: 13px; }
.recording-app .mode-tabs button { min-height: 46px; font-size: 16px; border-radius: 9px; }
.recording-app .prompt-box { background: #eef0e5; border: 0; border-radius: 16px; padding: 20px; }
.recording-app .prompt-meta { font-size: 14px; }
.recording-app .prompt-box > p { font-size: 26px; line-height: 1.9; margin: 20px 0 8px; }
.recording-app .prompt-box .text-button { margin-bottom: -8px; }
.app-instruction { color: var(--muted); font-size: 14px; text-align: center; margin: 16px 0 0; }
.recording-app .recorder { padding: 12px 0 20px; }
.recording-app .recording-visual { height: 26px; }
.recording-app .timer { font-size: 20px; margin: 8px 0 22px; }
.recording-app .record-button { width: 92px; height: 92px; box-shadow: 0 0 0 8px #bc552e0b; transition: transform .12s, border-radius .2s; }
.recording-app .record-button.recording { border-radius: 28px; }
.recording-app .recorder p { font-size: 16px; margin-top: 22px; }
.recording-app #duration-note { font-size: 14px; }
.recording-app #review-panel { margin-top: 24px; }
.recording-app audio { margin: 14px 0 22px; height: 54px; }
.recording-app .review-actions { gap: 12px; }
.recording-app .review-actions > .primary { flex: 1.4; }
.recording-app .fine-print { font-size: 14px; margin-top: 14px; }
.recording-app .progress-row { margin-top: 16px; padding-top: 16px; justify-content: center; text-align: center; font-size: 14px; }
.recording-app[data-stage="review"] .recorder, .recording-app[data-stage="review"] .app-instruction { display: none; }
.recording-app[data-stage="review"] .mode-tabs { opacity: .6; }
@media (max-width: 600px) {
  .recording-app .app-header { height: 68px; padding: 10px 20px; padding-top: max(10px, env(safe-area-inset-top)); }
  .app-main { padding: 0 20px 16px; }
  .app-stepper { margin: 4px 0 24px; }
  .recording-app .app-card { border: 0; padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .recording-app input, .recording-app select { background: var(--white); }
  .recording-app h1 { font-size: 26px; margin-bottom: 22px; }
  .recording-app .app-session { margin-top: -8px; }
  .recording-app .prompt-box { padding: 18px; }
  .recording-app .prompt-box > p { font-size: 25px; }
  .recording-app .recorder { padding-bottom: 16px; }
  .recording-app .review-actions, .app-action { position: sticky; bottom: 0; padding: 16px 0 max(12px, env(safe-area-inset-bottom)); background: var(--paper); z-index: 2; }
  .recording-app .button { padding: 14px 16px; }
}
@media (prefers-reduced-motion: reduce) { .recording-app * { transition: none !important; } }

.recording-app .pause-recording { margin-top: 22px; min-width: 190px; }