/* Cowboys navy/blue/silver with Red Sox red */
:root {
  color-scheme: dark;
  --site-bg: #07182f;
  --site-card: #0c2340;
  --site-card-raised: #123151;
  --site-border: #667e91;
  --site-text: #f5f8fc;
  --site-muted: #bfccd8;
  --site-accent: #bd3039;
  --site-accent-strong: #97252f;
  --site-danger: #e35a64;
  --bg: #07182f;
  --bg2: #0c2340;
  --card: #0c2340;
  --card-2: #123151;
  --background: #07182f;
  --surface: #0c2340;
  --surface-2: #123151;
  --border: #667e91;
  --fg: #f5f8fc;
  --text: #f5f8fc;
  --muted: #bfccd8;
  --accent: #bd3039;
  --accent2: #97252f;
  --accent3: #003594;
  --accent-2: #97252f;
  --accent-strong: #97252f;
  --danger: #e35a64;
  --shadow: 0 14px 34px rgba(0, 0, 0, .34);
  --starEmpty: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23869397' stroke-width='2' d='M12 17.27L5.82 21l1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73L18.18 21z'/%3E%3C/svg%3E");
  --starFull: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23BD3039' d='M12 17.27L5.82 21l1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73L18.18 21z'/%3E%3C/svg%3E");
}

html, body {
  color: var(--site-text);
  background: radial-gradient(circle at top left, rgba(0,53,148,.26), transparent 48rem),
              linear-gradient(180deg, #07182f, #0c2340) !important;
}
a { color: #cfe2ff; }
:focus-visible { outline: 3px solid #a8c6e8; outline-offset: 2px; }

.site-header {
  background: linear-gradient(100deg, #041e42 0%, #0c2340 70%, #bd3039 100%);
  border-bottom: 2px solid #869397;
}
.site-brand { color: #fff; }
.site-nav a, .site-link-button {
  color: #f5f8fc;
  border-color: #667e91;
  background: #123151;
}
.site-nav a:hover, .site-nav a[aria-current="page"], .site-link-button:hover {
  background: #003594;
  border-color: #aab8c3;
  color: #fff;
}

.site-panel, .auth-panel, .site-tile, .card, .cardItem, .sheet, .channel {
  background: linear-gradient(155deg, #0c2340, #123151);
  border-color: #667e91;
  color: #f5f8fc;
}
.site-message, .msg, .commentItem {
  background: #123151;
  border-color: #667e91;
}
.badge:not(.ok):not(.danger) {
  color: #e5eef8;
  background: #123151;
  border-color: #667e91;
}
.site-greeting, .site-muted, .site-tile span,
.hello, .meta, .ratingText, .commentMeta, .fs-note,
.sortbar label, .notice, .stream-status, .recording-meta, .topbar p {
  color: #bfccd8;
}

.site-button, .auth-form button, .auth-form input[type="submit"],
.btn:not(.btn-ghost), .btn-primary,
.button:not(.secondary):not(.danger):not(.record) {
  color: #fff;
  border-color: #97252f;
  background: linear-gradient(135deg, #bd3039, #97252f);
}
.btn-ghost, .button.secondary {
  color: #f5f8fc;
  background: #123151;
  border-color: #667e91;
}
.btn-reset, .button.danger, .button.record, .del button {
  background: linear-gradient(135deg, #a32732, #7e202a);
  color: #fff;
}
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  background-color: #07182f;
  border-color: #667e91;
  color: #f5f8fc;
}
input[type="checkbox"], input[type="radio"] { accent-color: #bd3039; }
.thumb, .detailBody img { background-color: #123151; }
#recHref { color: #cfe2ff !important; }
[style*="background:#23134c"] { background: #123151 !important; }

/* FAZUL_RESPONSIVE_V1: shared phone, tablet, and desktop layout adjustments. */
/* Let long usernames and content shrink within flex and grid containers. */
.site-header-inner > div, .site-nav, .site-main, .site-panel, .auth-panel,
.auth-form, .auth-form label, .site-tile, .layout > *, .record-form > *,
.sheet .row > *, .detailBody > *, .channel > *, .active-row > * {
  min-width: 0;
}
.site-greeting { display: block; overflow-wrap: anywhere; line-height: 1.5; }
.site-message, .site-muted, .site-tile, .recording-meta, .commentTxt,
.site-panel h1, .site-panel h2, .name, .text { overflow-wrap: anywhere; }
.site-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
}

/* Make controls readable and comfortably tappable without disabling zoom. */
button, .button, .btn, .btn-ghost, .site-nav a, .site-link-button,
.master-table a { min-height: 44px; }
.button, .btn, .site-nav a, .master-table a {
  display: inline-flex; align-items: center; justify-content: center;
}
button, .button, .btn, .btn-ghost { white-space: normal; overflow-wrap: anywhere; }
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select, textarea { min-width: 0; max-width: 100%; font-size: 1rem; }
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select { min-height: 44px; }
.auth-form .check-label, .recips label { min-height: 44px; }
.auth-form input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; }
.auth-form textarea { resize: vertical; }
img, video { max-width: 100%; }

/* Keep the account table readable with scrolling confined to its own region. */
.master-table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.master-table { min-width: 680px; }
.master-table a { padding: 8px 12px; }
.master-actions > button { max-width: 100%; }

/* OTA recording controls fit within their column as well as the full page. */
.topbar, .recording-actions { flex-wrap: wrap; }
.topbar > *, .recording-actions > * { min-width: 0; max-width: 100%; }
.record-card .record-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.channel, .active-row { grid-template-columns: minmax(0, 1fr) auto; }
.recording-actions { justify-content: flex-start; }

/* Keep recipe cards and dialogs inside narrow or zoomed viewports. */
.wrap > .grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.wrap > .card > .grid { grid-template-columns: minmax(0, 1fr); }
.sheet { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
.sheet fieldset { min-width: 0; }
.sheet .actions, .starsRow { flex-wrap: wrap; }
.detailBody { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); }

/* Stack navigation and control groups on phones and narrow tablet windows. */
@media (max-width: 650px) {
  .site-header-inner { padding: 14px 12px; justify-content: center; text-align: center; }
  .site-header-inner > div { width: 100%; }
  .site-nav { width: 100%; justify-content: center; }
  .site-nav a { flex: 1 1 112px; padding: 9px 10px; }
  .site-main { padding: 20px 12px 40px; }
  .site-panel, .auth-panel { padding: 18px 14px; }
  .auth-shell { padding: 0 12px; margin-top: 24px; }
  .wrap { padding-left: 12px; padding-right: 12px; }
  .master-actions button { flex-basis: 100%; }
  .topbar { padding: 18px 12px 10px; }
  .record-card .record-form, .active-row { grid-template-columns: minmax(0, 1fr); }
  .recording-actions > * { flex: 1 1 auto; }
  .btnbar button { flex: 1 1 140px; }
  .modal { padding: 12px; }
  .sheet { padding: 14px; border-radius: 14px; }
}
@media (max-width: 720px) {
  .sheet .row, .detailBody { grid-template-columns: minmax(0, 1fr); }
}
/* FAZUL_RESPONSIVE_V1_END */