/* The Garage — overrides on top of brand/aimotor.css only. Data-dense UI,
   monospace numerics, no decorative motion. See PLAN-the-garage-v1.md 4.3. */

body { font-size:15px; }

.garage-gate {
  position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  background:var(--bg);
}
.garage-gate[hidden] { display:none; }
.garage-gate-box { text-align:center; }
.garage-gate-box .btn { margin-top:20px; }

.garage-banner {
  padding:10px 24px; font-family:var(--font-mono); font-size:13px; text-align:center;
}
.garage-banner-stale { background:#3D1414; color:#E27E7E; }
.garage-logout { color:var(--faint) !important; }
.garage-logout:hover { color:var(--muted) !important; }

.garage-header { border-bottom:1px solid var(--border); }
.garage-header-row {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px;
}
.garage-header nav { display:flex; gap:24px; }
.garage-header nav a {
  font-family:var(--font-mono); font-size:13px; text-transform:uppercase;
  letter-spacing:.06em; color:var(--muted);
}
.garage-header nav a.active, .garage-header nav a:hover { color:var(--accent); }

.garage-main { padding:32px 24px; max-width:1400px; }

/* ---------- Data table ---------- */
.garage-table { width:100%; border-collapse:collapse; font-size:14px; }
.garage-table th {
  text-align:left; font-family:var(--font-mono); font-size:11px; text-transform:uppercase;
  letter-spacing:.06em; color:var(--muted); padding:8px 10px; border-bottom:1px solid var(--border);
  white-space:nowrap; cursor:default;
}
.garage-table td {
  padding:10px; border-bottom:1px solid var(--border); vertical-align:middle;
}
.garage-table tbody tr { cursor:pointer; }
.garage-table tbody tr:hover { background:var(--surface); }
.garage-num { font-family:var(--font-mono); font-variant-numeric:tabular-nums; }
.garage-ratio { font-family:var(--font-mono); font-weight:500; }
.garage-chip {
  display:inline-block; padding:2px 8px; border-radius:999px; font-size:11px;
  font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.04em;
  border:1px solid var(--border); color:var(--muted);
}
.garage-chip-lang-es { color:#E2B34A; border-color:#E2B34A; }
.garage-chip-lang-en { color:#7EB0E2; border-color:#7EB0E2; }
.garage-chip-status-new { color:var(--muted); }
.garage-chip-status-shortlisted { color:var(--accent); border-color:var(--accent); }
.garage-chip-status-used { color:#7EB0E2; border-color:#7EB0E2; }
.garage-chip-status-rejected { color:var(--faint); }
.garage-up { color:var(--accent); font-family:var(--font-mono); }

/* ---------- Filters ---------- */
.garage-filters { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; align-items:center; }
.garage-filters select, .garage-filters input {
  background:var(--surface); border:1px solid var(--border); color:var(--text);
  border-radius:8px; padding:6px 10px; font-family:var(--font-mono); font-size:13px;
}

/* ---------- Cluster detail ---------- */
.garage-post-card {
  border:1px solid var(--border); border-radius:var(--r-card); padding:16px;
  margin-bottom:12px; display:grid; grid-template-columns:64px 1fr auto; gap:16px;
}
.garage-post-thumb {
  width:64px; height:64px; border-radius:8px; background:var(--surface);
  object-fit:cover;
}
.garage-post-meta { font-size:12px; color:var(--muted); margin-bottom:6px; font-family:var(--font-mono); }
.garage-post-hook { font-weight:500; margin-bottom:4px; }
.garage-post-caption { color:var(--muted); font-size:13px; max-height:4.2em; overflow:hidden; }
.garage-post-transcript {
  margin-top:8px; font-size:13px; color:var(--muted); border-top:1px solid var(--border);
  padding-top:8px; cursor:pointer;
}
.garage-post-ratio { text-align:right; font-family:var(--font-mono); font-size:20px; font-weight:500; }

/* ---------- Responsive: tables -> stacked cards ---------- */
@media (max-width: 720px) {
  .garage-table thead { display:none; }
  .garage-table, .garage-table tbody, .garage-table tr, .garage-table td { display:block; width:100%; }
  .garage-table tr { border:1px solid var(--border); border-radius:var(--r-card); margin-bottom:12px; padding:10px; }
  .garage-table td { border:none; padding:4px 0; }
  .garage-table td[data-label]::before {
    content:attr(data-label); display:inline-block; min-width:80px;
    font-family:var(--font-mono); font-size:11px; text-transform:uppercase;
    letter-spacing:.06em; color:var(--muted); margin-right:8px;
  }
  .garage-post-card { grid-template-columns:1fr; }
}