/* RVLock shared design system — from Brand Guide 2025 V2.
   Linked by every app (home + sub-apps) so theming + motion stay consistent.
   Re-skin the whole suite by editing the :root tokens here. */
:root {
  --rust: #C13927;        /* primary — used sparingly as a pop */
  --rust-light: #EA6940;  /* secondary */
  --rust-soft: #fbeae7;
  --warm-gray: #605E59;   /* tertiary — floods, headers */
  --tan: #DED5C6;         /* tertiary — warm reprieve from white */
  --ink: #2b2a27;
  --muted: #8a857c;
  --line: #e7e1d8;
  --line-strong: #d8d0c4;
  --bg: #f7f5f1;
  --card: #ffffff;

  --pos: #4f7a5b;  --pos-bg: #eaf1ec;
  --neg: var(--rust);  --neg-bg: #fbeae7;
  --neu: var(--warm-gray);  --neu-bg: #eeece8;
  --review: #9a6b1f;  --review-bg: #f6ecdc;

  --radius: 12px;
  --radius-lg: 16px;
  --radius-pill: 100px;
  --shadow: 0 1px 2px rgba(40,38,34,.06), 0 4px 16px rgba(40,38,34,.04);
  --shadow-hover: 0 2px 6px rgba(40,38,34,.08), 0 16px 38px rgba(40,38,34,.11);
  --ease: cubic-bezier(.4,.0,.2,1);
  --font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: var(--font); background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
::selection { background: var(--rust-light); color: #fff; }

/* ---- Top bar (shared across apps) ---- */
.topbar {
  position: sticky; top: 0; z-index: 30;
  background: var(--warm-gray); color: #fff;
  padding: 13px 26px; display: flex; align-items: center; gap: 14px;
  box-shadow: 0 1px 0 rgba(0,0,0,.08);
}
.topbar .home-link { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: #fff; }
.topbar img.wordmark { height: 28px; display: block; }
.topbar .divider { width: 1px; height: 24px; background: rgba(255,255,255,.25); }
.topbar .app-name { font-weight: 700; font-size: 14.5px; letter-spacing: .3px; line-height: 1.15; }
.topbar .app-sub { font-size: 11.5px; color: rgba(255,255,255,.7); font-weight: 500; }
.topbar .spacer { flex: 1; }
.topbar .back { font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.85); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: var(--radius-pill); transition: background .2s var(--ease); }
.topbar .back:hover { background: rgba(255,255,255,.12); }
.topbar .refreshed { font-size: 11px; color: rgba(255,255,255,.65); display: inline-flex; align-items: center; gap: 6px; }
.dot-live { width: 7px; height: 7px; border-radius: 50%; background: #8fd6a9; animation: pulse 2.4s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(143,214,169,.5)} 70%{box-shadow:0 0 0 6px rgba(143,214,169,0)} 100%{box-shadow:0 0 0 0 rgba(143,214,169,0)} }

.wrap { max-width: 1080px; margin: 0 auto; padding: 28px; }

/* ---- Generic pill button ---- */
.btn {
  font-family: var(--font); font-size: 13px; font-weight: 700; cursor: pointer;
  border: 1px solid var(--line-strong); background: var(--card); color: var(--warm-gray);
  padding: 9px 16px; border-radius: var(--radius-pill); display: inline-flex; align-items: center; gap: 7px;
  transition: transform .12s var(--ease), background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
  text-decoration: none;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--rust); color: #fff; border-color: var(--rust); }
.btn-primary:hover { background: var(--rust-light); border-color: var(--rust-light); box-shadow: 0 6px 16px rgba(193,57,39,.25); }

/* ---- Entrance helpers ---- */
.rise { opacity: 0; transform: translateY(10px); animation: rise .5s var(--ease) forwards; }
@keyframes rise { to { opacity: 1; transform: translateY(0); } }

@media (max-width: 720px) { .wrap { padding: 18px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .rise { opacity: 1; transform: none; }
}