/* Alpine.js: keep x-cloaked elements hidden until Alpine hydrates so we
   don't show dropdowns / panels in their initial expanded state. */
[x-cloak] { display: none !important; }

:root {
  --ri-red: #d63e45;
  --ri-red-dark: #3b0d0f;
  --ri-red-accent: #ef4a44;
  --ri-red-tertiary: #ba272e;
  --ri-mute: #888888;
  --ri-soft-bg: #fafafa;
  --ri-border: #d9d9d9;
}

html, body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #1a1a1a;
}

a { color: var(--ri-red); }
a:hover { color: var(--ri-red-tertiary); }

.btn-primary {
  background: var(--ri-red);
  color: #fff;
  border: 1px solid var(--ri-red-tertiary);
}
.btn-primary:hover { background: var(--ri-red-tertiary); }
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }

.btn-ghost {
  background: transparent;
  color: var(--ri-red);
  border: 1px solid var(--ri-border);
}
.btn-ghost:hover { background: #f6e6e7; }

.cell-mine {
  background: #fff0f1;
  outline: 2px solid var(--ri-red);
  outline-offset: -2px;
}

.flash-ok { background: #ecfdf5; color: #065f46; border: 1px solid #6ee7b7; }
.flash-err { background: #fef2f2; color: #7f1d1d; border: 1px solid #fca5a5; }
.flash-info { background: #eff6ff; color: #1e3a8a; border: 1px solid #93c5fd; }

.status-badge { font-size: 0.75rem; font-weight: 600; padding: 2px 8px; border-radius: 9999px; }
.status-DRAFT { background: #e5e7eb; color: #374151; }
.status-PUBLISHED { background: #d1fae5; color: #065f46; }
.status-LOCKED { background: #dbeafe; color: #1e3a8a; }