/* Shared rhythm. Page-specific layouts load after this foundation. */
:root {
  --rugym-page-width: 1120px;
  --rugym-gutter: 24px;
  --rugym-motion: 180ms;
}
.btn { white-space: normal; line-height: 1.4; }
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--rugym-primary);
  --bs-btn-border-color: var(--rugym-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--rugym-primary-dark);
  --bs-btn-hover-border-color: var(--rugym-primary-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--rugym-primary-dark);
  --bs-btn-active-border-color: var(--rugym-primary-dark);
  --bs-btn-focus-shadow-rgb: 104,82,214;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--rugym-primary);
  --bs-btn-disabled-border-color: var(--rugym-primary);
}
.btn-outline-primary {
  --bs-btn-color: var(--rugym-primary);
  --bs-btn-border-color: #c9bff0;
  --bs-btn-hover-bg: var(--rugym-primary);
  --bs-btn-hover-border-color: var(--rugym-primary);
  --bs-btn-active-bg: var(--rugym-primary-dark);
  --bs-btn-active-border-color: var(--rugym-primary-dark);
  --bs-btn-disabled-color: var(--rugym-primary);
  --bs-btn-disabled-border-color: #c9bff0;
  --bs-btn-focus-shadow-rgb: 104,82,214;
}
.text-bg-primary, .bg-primary { background-color: var(--rugym-primary)!important; }
.text-primary { color: var(--rugym-primary)!important; }
.btn, .icon-button, .nav-pill { transition: background-color var(--rugym-motion), border-color var(--rugym-motion), color var(--rugym-motion), box-shadow var(--rugym-motion); }
.btn:focus-visible, .icon-button:focus-visible { outline: 3px solid var(--rugym-primary); outline-offset: 3px; }
.btn-close { flex-shrink: 0; width: 44px; height: 44px; padding: 0; background-size: 14px; }
.modal-header .btn-close, .offcanvas-header .btn-close { margin: 0; }
.modal-content { border: 1px solid var(--rugym-border); border-radius: 24px; }
.modal-header { align-items: center; gap: 12px; }
.modal-title { overflow-wrap: anywhere; }
.form-label { line-height: 1.5; }
.form-text, .invalid-feedback { font-size: .875rem; line-height: 1.55; }
.invalid-feedback { color: #b13248; }
.form-control, .form-select { min-width: 0; }
.interaction-area .gap-template, .interaction-area .punctuation-line { font-family: var(--rugym-font); }
.form-control[type=file] { padding: 10px; white-space: normal; }
.back-link { min-height: 44px; align-items: center; overflow-wrap: anywhere; }
.surface-card { box-shadow: none; }
.empty-state { animation: none; }
.empty-state p { max-width: 42ch; margin-inline: auto; font-size: .9375rem; line-height: 1.6; }
.error-page { width: min(640px,100%); min-height: 65dvh; margin: auto; padding: 40px var(--rugym-gutter); }
.error-page > strong { color: var(--rugym-primary); font-size: clamp(4rem,12vw,6rem); font-weight: 650; letter-spacing: -.06em; }
.error-page h1 { margin: 24px 0 12px; font-size: clamp(1.6rem,4vw,2.25rem); line-height: 1.2; text-wrap: balance; }
.error-page p { font-size: 1rem; line-height: 1.6; }
.error-page .btn { margin-top: 12px; padding-inline: 28px; }
.rugym-confirm-modal p { font-size: .9375rem; }
.rugym-confirm-modal .eyebrow { display: none; }
.rugym-alert .flash-message { font-size: .9375rem; line-height: 1.5; }
.rugym-alert { grid-template-columns: 34px minmax(0,1fr) 44px; gap: 8px; }
.rugym-alert .btn-close { width: 44px; height: 44px; background-size: 12px; }
.mobile-top-actions .btn { min-height: 44px; }
.mobile-topbar { flex-wrap: wrap; height: auto; min-height: 64px; gap: 8px; }
.mobile-top-actions { max-width: 100%; flex-wrap: wrap; justify-content: flex-end; }
.mobile-login-link { display: inline-flex; align-items: center; min-height: 44px; }
.onboarding-card > p, .onboarding-step > p { font-size: .9375rem; line-height: 1.6; }
.onboarding-counter { font-size: .8125rem; }
.tour-tip-list li { font-size: .875rem; line-height: 1.5; }
.tour-section-grid strong { font-size: .9375rem; }
.tour-section-grid small { font-size: .8125rem; line-height: 1.5; }
.onboarding-card .btn { min-height: 44px; }
.topbar .avatar-link { min-width: 44px; height: 44px; }
.mobile-topbar .avatar-link { min-width: 44px; height: 44px; }
.topbar a[aria-current=page] { color: var(--rugym-primary); }
.app-project-footer nav a { min-width: 0; overflow-wrap: anywhere; }
/* Fade the disclosed content, never animate height or move the next action. */
.history-page details[open] > .history-session-content,
.history-page details[open] > .mistake-entry-content,
.admin-filter-disclosure[open] > .admin-filter-panel { animation: rugym-disclose 160ms ease-out; }
@keyframes rugym-disclose { from { opacity: .45; } to { opacity: 1; } }
@media (max-width:575.98px) {
  :root { --rugym-gutter: 14px; }
  .modal-dialog { margin-inline: 14px; }
  .modal-body { overflow-wrap: anywhere; }
  .rugym-confirm-modal .modal-dialog { width: calc(100% - 28px); }
}
@media (prefers-reduced-motion:reduce) {
  .btn, .icon-button, .nav-pill { transition: none; }
  .history-page details[open] > .history-session-content,
  .history-page details[open] > .mistake-entry-content,
  .admin-filter-disclosure[open] > .admin-filter-panel { animation: none; }
}
