/* ---------------------------------------------------------------------
   Little Land · Δελτία Πάρτυ — design tokens
   Palette pulled from the venue's own paper form: cream card stock, the
   pink/blue/mint rainbow-logo stripe, warm ink instead of cold black.
   No web fonts (no CDN, ever) — the system stack carries the type scale
   through weight/spacing instead of an exotic face.
--------------------------------------------------------------------- */
:root {
  --bg: #fbf6ee;
  --surface: #ffffff;
  --surface-alt: #f5efe1;
  --ink: #2e2a24;
  --muted: #726858;
  --border: #e8dfcb;

  --primary: #a8345a;      /* balloon pink, darkened for AA text contrast — primary actions */
  --primary-ink: #ffffff;
  --primary-tint: #fbe8ec;
  --secondary: #6fa8c9;    /* rainbow-stripe blue */
  --secondary-tint: #e8f2f7;
  --focus-ring: #3d7ea6;   /* darker than --secondary — clears 3:1 non-text contrast on --surface/--surface-alt/--bg */
  --accent: #6fb98f;       /* rainbow-stripe mint — success / matched */
  --accent-tint: #e6f4ec;
  --warn: #dfa233;
  --warn-tint: #fbf0dc;
  --danger: #c1516a;
  --danger-tint: #f8e3e7;

  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 20px;
  --shadow: 0 1px 2px rgba(46, 42, 36, 0.06), 0 4px 16px rgba(46, 42, 36, 0.06);
  --shadow-lift: 0 2px 4px rgba(46, 42, 36, 0.08), 0 12px 32px rgba(46, 42, 36, 0.12);

  --nav-h: 60px;
  --dock-h: 64px;
  --touch: 44px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  padding-bottom: env(safe-area-inset-bottom);
}

a { color: inherit; }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* At desktop widths the sidebar AND topbar both render a "Little Land"
   home link, so a keyboard user hits several redundant nav stops before
   reaching a page's actual content — this jumps straight past all of it. */
.skip-link {
  position: absolute; top: -3rem; left: 1rem; z-index: 100;
  background: var(--primary); color: var(--primary-ink);
  padding: 0.6rem 1rem; border-radius: var(--radius-sm);
  font-weight: 700; text-decoration: none;
  transition: top 120ms ease;
}
.skip-link:focus-visible { top: 1rem; }

@media (prefers-reduced-motion: no-preference) {
  .card, .btn { transition: box-shadow 160ms ease, transform 160ms ease, background-color 120ms ease; }
}

/* ---------------------------------------------------------------------
   App shell: top brand bar always; bottom dock nav on phones (thumb
   reach), left sidebar on desktop (>=900px). One nav, two renderings.
--------------------------------------------------------------------- */
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  height: var(--nav-h);
  padding: 0 1rem;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.topbar .brand {
  display: flex; align-items: center; gap: 0.5rem;
  font-weight: 800; letter-spacing: -0.01em; font-size: 1.05rem;
  text-decoration: none; color: var(--ink);
}
.topbar .brand .dot { width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--secondary) 55%, var(--accent)); }
.topbar .desktop-nav { display: none; }
.topbar .user-chip { font-size: 0.82rem; color: var(--muted); text-decoration: none; }

/* Mobile-first defaults: sidebar hidden, dock nav shown. The >=900px media
   query below OVERRIDES these — it must stay physically after this block,
   since at equal specificity the later rule wins regardless of the query,
   and an override placed before its default is silently discarded. */
.sidebar { display: none; }

.dock {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
  display: grid; grid-template-columns: repeat(5, 1fr);
  background: var(--surface); border-top: 1px solid var(--border);
  padding-bottom: env(safe-area-inset-bottom);
}
.dock a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.15rem;
  min-height: var(--dock-h); text-decoration: none; color: var(--muted); font-size: 0.72rem; font-weight: 600;
}
.dock a .ic { font-size: 1.25rem; line-height: 1; }
.dock a.active { color: var(--primary); }

.container { max-width: 980px; margin: 0 auto; padding: 1.1rem 1rem calc(var(--dock-h) + 1.5rem); }

/* "Take a photo on-site" only makes sense on a touch/camera-primary
   device — a mouse-driven desktop has no camera capture affordance to
   trigger, so the button would just duplicate the file picker. */
@media (hover: hover) and (pointer: fine) {
  #camera-btn { display: none; }
}

@media (min-width: 900px) {
  .topbar { padding-left: 232px; }
  .topbar .desktop-nav { display: flex; gap: 0.25rem; }
  .topbar .desktop-nav a {
    padding: 0.45rem 0.8rem; border-radius: 999px; font-size: 0.9rem; font-weight: 600;
    color: var(--muted); text-decoration: none;
  }
  .topbar .desktop-nav a.active, .topbar .desktop-nav a:hover { background: var(--primary-tint); color: var(--primary); }
  .sidebar {
    position: fixed; inset: 0 auto 0 0; width: 216px; padding: 1.25rem 1rem;
    background: var(--surface); border-right: 1px solid var(--border);
    display: flex; flex-direction: column; gap: 0.3rem; z-index: 21;
  }
  .sidebar .brand { display: flex; align-items: center; gap: 0.55rem; font-weight: 800; margin-bottom: 1.25rem; }
  .sidebar .brand .dot { width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--secondary) 55%, var(--accent)); }
  .sidebar a {
    display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem; border-radius: var(--radius-sm);
    color: var(--muted); text-decoration: none; font-weight: 600; font-size: 0.92rem;
  }
  .sidebar a.active { background: var(--primary-tint); color: var(--primary); }
  .sidebar a:hover:not(.active) { background: var(--surface-alt); }
  .dock { display: none; }
  .container { margin-left: 216px; padding-bottom: 2rem; }
}

/* ---------------------------------------------------------------------
   Primitives
--------------------------------------------------------------------- */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.1rem 1.15rem;
  margin-bottom: 1.1rem;
  box-shadow: var(--shadow);
}

h1 { font-size: 1.35rem; margin: 0 0 0.9rem; letter-spacing: -0.01em; }
h2 {
  font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 800;
  color: var(--muted); margin: 1.6rem 0 0.85rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--border);
}
h3 { font-size: 0.95rem; margin: 1rem 0 0.5rem; color: var(--muted); }

.eyebrow { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }

.badge {
  display: inline-flex; align-items: center; gap: 0.3rem;
  padding: 0.2rem 0.6rem; border-radius: 999px; font-size: 0.76rem; font-weight: 700;
}
.badge-pending, .badge-processing { background: var(--surface-alt); color: #8a6d3b; }
.badge-needs_review { background: var(--warn-tint); color: #8a5a00; }
.badge-reviewed { background: var(--accent-tint); color: #276b45; }
.badge-failed { background: var(--danger-tint); color: #96233c; }

/* Confidence: a small dot, not a number — quantized so the signal reads
   at a glance instead of asking the reader to interpret "0.82". */
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 0.35rem; flex: none; }
.dot-high { background: var(--accent); }
.dot-mid { background: var(--warn); }
.dot-low { background: var(--danger); }
.confidence { font-size: 0.8rem; color: var(--muted); display: inline-flex; align-items: center; }

/* Ledger check — the app's signature: every computed total is shown as a
   verify-line, not a generic warning banner. Matched totals get a quiet
   mint check; mismatches show what was written vs. what the math gives,
   because that's literally the reconciliation this app exists to do. */
.ledger { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin: 0.75rem 0 1.1rem; }
.ledger-row { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.7rem 0.9rem; font-size: 0.88rem; }
.ledger-row + .ledger-row { border-top: 1px solid var(--border); }
.ledger-row.ok { background: var(--accent-tint); color: #245a3c; }
.ledger-row.mismatch { background: var(--warn-tint); color: #7a5200; }
.ledger-row.info { background: var(--secondary-tint); color: #2c5670; }
.ledger-row.danger { background: var(--danger-tint); color: #7a2438; }
.ledger-icon { flex: none; font-weight: 800; }

/* ---------------------------------------------------------------------
   Forms
--------------------------------------------------------------------- */
form .field { margin-bottom: 0.9rem; }
form label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--muted); margin-bottom: 0.3rem; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number],
select, textarea {
  width: 100%;
  padding: 0.6rem 0.7rem;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 1rem; /* >=16px prevents iOS auto-zoom on focus */
  font-family: inherit;
  background: var(--surface);
  color: var(--ink);
  min-height: var(--touch);
}
input:focus, select:focus, textarea:focus { border-color: var(--secondary); }
input[type=checkbox], input[type=radio] { accent-color: var(--primary); }
.field-money input, .field-num input { font-variant-numeric: tabular-nums; }
.field-hint { display: block; margin-top: 0.3rem; }

.field-group { background: var(--surface-alt); border-radius: var(--radius); padding: 0.9rem 0.9rem 0.1rem; margin-bottom: 1rem; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 1rem; }
@media (max-width: 640px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  min-height: var(--touch);
  padding: 0.6rem 1.15rem;
  border-radius: 999px;
  border: 1px solid var(--primary);
  background: var(--primary);
  color: var(--primary-ink);
  font-weight: 700;
  cursor: pointer;
  font-size: 0.92rem;
  text-decoration: none;
  box-shadow: var(--shadow);
}
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-lift); }
.btn:active { transform: translateY(0); }
.btn.secondary { background: var(--surface); color: var(--ink); border-color: var(--border); box-shadow: none; }
.btn.danger { background: var(--surface); color: var(--danger); border-color: var(--danger); box-shadow: none; }
.btn.block { width: 100%; }
.btn[disabled] { opacity: 0.55; cursor: not-allowed; transform: none; box-shadow: none; }

.messages { list-style: none; padding: 0; margin: 0 0 1rem; }
.messages li { padding: 0.65rem 1rem; border-radius: var(--radius-sm); margin-bottom: 0.5rem; font-size: 0.9rem; font-weight: 600; }
.messages .success { background: var(--accent-tint); color: #245a3c; }
.messages .error { background: var(--danger-tint); color: #7a1f33; }
.messages .warning { background: var(--warn-tint); color: #7a5200; }

.muted { color: var(--muted); font-size: 0.88rem; }
.actions { display: flex; gap: 0.6rem; margin-top: 1.1rem; flex-wrap: wrap; }

/* Persistent bottom action bar for long review forms — the save/confirm
   buttons stay one thumb-reach away regardless of scroll position. This is
   a real fixed toolbar, NOT position:sticky: a bottom-only sticky element
   clamps to the bottom of the viewport as soon as ANY part of its (tall)
   parent is in view, which floats it over the middle of the form instead
   of only appearing once you'd otherwise scroll past it. `#review-form`
   carries matching bottom padding so this never covers the last field. */
.action-bar {
  position: fixed; left: 1rem; right: 1rem;
  bottom: calc(var(--dock-h) + 0.75rem + env(safe-area-inset-bottom));
  z-index: 15;
  max-width: 948px; margin: 0 auto;
  display: flex; gap: 0.6rem;
  padding: 0.7rem; background: rgba(251, 246, 238, 0.94); backdrop-filter: blur(6px);
  border: 1px solid var(--border); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lift);
}
@media (min-width: 900px) { .action-bar { left: calc(216px + 1rem); bottom: 1rem; } }
.action-bar .btn { flex: 1; }
.has-action-bar, #review-form { padding-bottom: 5.5rem; }

.masked-key { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; background: var(--surface-alt); padding: 0.25rem 0.55rem; border-radius: 6px; font-size: 0.88rem; }

details.raw-json summary { cursor: pointer; font-size: 0.85rem; color: var(--muted); font-weight: 600; padding: 0.4rem 0; }
pre.raw-json-body { background: #22201c; color: #e4dccb; padding: 1rem; border-radius: var(--radius-sm); overflow-x: auto; font-size: 0.78rem; margin-top: 0.5rem; }

/* ---------------------------------------------------------------------
   Help / knowledge base
---------------------------------------------------------------------- */
.faq-list details { border-bottom: 1px solid var(--border); }
.faq-list details:last-child { border-bottom: none; }
.faq-list summary {
  cursor: pointer; padding: 0.85rem 0; font-weight: 600; color: var(--ink);
  display: flex; align-items: center; gap: 0.5rem;
}
.faq-list summary::marker { color: var(--primary); }
.faq-list details > div { padding: 0 0 0.9rem 0; color: var(--ink); line-height: 1.55; }
.faq-list details > div p { margin: 0 0 0.6rem; }
.faq-list details > div p:last-child { margin-bottom: 0; }
.faq-list details > div ul, .faq-list details > div ol { margin: 0 0 0.6rem; padding-left: 1.2rem; }
.faq-list details > div li { margin-bottom: 0.3rem; }
.step-list { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.step-list li {
  counter-increment: step; position: relative; padding-left: 2.4rem; margin-bottom: 1rem; line-height: 1.55;
}
.step-list li:last-child { margin-bottom: 0; }
.step-list li::before {
  content: counter(step); position: absolute; left: 0; top: 0;
  width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--primary-tint); color: var(--primary);
  font-weight: 800; font-size: 0.85rem; display: flex; align-items: center; justify-content: center;
}
.step-list strong { display: block; margin-bottom: 0.15rem; }

/* ---------------------------------------------------------------------
   Dashboard — hero stat + stat tiles + lightweight bar charts (plain
   HTML/CSS, no charting library: this app never loads anything from a CDN)
---------------------------------------------------------------------- */
.hero-stat {
  display: flex; align-items: center; gap: 1rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 1.3rem 1.4rem; margin-bottom: 1.1rem;
}
.hero-stat .icon-badge { width: 3.2rem; height: 3.2rem; font-size: 1.5rem; }
.hero-stat .stat-label { font-size: 0.88rem; color: var(--muted); font-weight: 700; margin-bottom: 0.15rem; }
.hero-stat .stat-value { font-size: 2.6rem; font-weight: 800; letter-spacing: -0.02em; color: var(--ink); line-height: 1; }
.hero-stat .stat-sub { font-size: 0.82rem; color: var(--muted); margin-top: 0.3rem; }

.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin-bottom: 1.1rem; }
@media (max-width: 900px) { .stat-grid { grid-template-columns: repeat(2, 1fr); } }
.stat-tile {
  display: flex; align-items: flex-start; gap: 0.75rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 0.95rem 1.05rem;
}
.icon-badge {
  flex: none; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 1.15rem;
}
.icon-badge.badge-primary { background: var(--primary-tint); }
.icon-badge.badge-secondary { background: var(--secondary-tint); }
.icon-badge.badge-accent { background: var(--accent-tint); }
.icon-badge.badge-warn { background: var(--warn-tint); }
.icon-badge.badge-danger { background: var(--danger-tint); }
.stat-tile .stat-label { font-size: 0.78rem; color: var(--muted); font-weight: 600; margin-bottom: 0.2rem; }
.stat-tile .stat-value { font-size: 1.5rem; font-weight: 800; letter-spacing: -0.01em; color: var(--ink); line-height: 1.15; }
.stat-tile .stat-value.warn { color: #7a5200; }
.stat-tile .stat-value.danger { color: var(--danger); }
.stat-tile .stat-sub { font-size: 0.76rem; color: var(--muted); margin-top: 0.15rem; }

.card h2 .h2-icon { margin-right: 0.35rem; }

/* Vertical columns (monthly trend): baseline-anchored, rounded cap, value
   label on the cap, month label below the baseline. Zero months get a
   muted flat tick, not a colored sliver — a 3px pink dash under "0" reads
   as a rendering glitch, not "no data". */
.col-chart { display: flex; align-items: flex-end; gap: 0.9rem; height: 150px; padding-top: 1.4rem; }
.col-chart .col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.col-chart .col-value { font-size: 0.78rem; font-weight: 700; color: var(--ink); margin-bottom: 0.3rem; }
.col-chart .col-value.is-zero { color: var(--muted); font-weight: 600; }
.col-chart .col-bar {
  width: 100%; max-width: 30px; background: linear-gradient(180deg, #c24a72 0%, var(--primary) 100%);
  border-radius: 6px 6px 0 0; min-height: 4px;
}
.col-chart .col-bar.is-zero { background: var(--border); border-radius: 2px; min-height: 3px; max-height: 3px; align-self: flex-start; margin-top: auto; }
.col-chart .col-label { font-size: 0.74rem; color: var(--muted); margin-top: 0.5rem; font-weight: 700; }
.col-chart .col.is-current .col-label { color: var(--primary); }

/* Horizontal bars (popular extra services): label left, bar + value right. */
.hbar-chart { display: flex; flex-direction: column; gap: 0.6rem; }
.hbar-row { display: grid; grid-template-columns: 7rem 1fr 2.2rem; align-items: center; gap: 0.6rem; }
.hbar-row .hbar-label { font-size: 0.82rem; color: var(--ink); font-weight: 600; text-align: right; }
.hbar-row .hbar-track { background: var(--surface-alt); border-radius: 999px; height: 20px; overflow: hidden; }
.hbar-row .hbar-fill { height: 100%; background: linear-gradient(90deg, var(--secondary) 0%, #4f8fb3 100%); border-radius: 999px; min-width: 4px; }
.hbar-row .hbar-value { font-size: 0.8rem; color: var(--muted); font-weight: 700; }

/* ---------------------------------------------------------------------
   Party list — cards that reflow into a table-like grid on wide screens
--------------------------------------------------------------------- */
.filter-row { display: flex; gap: 0.4rem; overflow-x: auto; padding-bottom: 0.2rem; margin-bottom: 1rem; -webkit-overflow-scrolling: touch; }
.filter-row a {
  flex: none; padding: 0.4rem 0.85rem; border-radius: 999px; font-size: 0.82rem; font-weight: 700;
  text-decoration: none; color: var(--muted); background: var(--surface-alt); border: 1px solid transparent;
}
.filter-row a.active { background: var(--primary-tint); color: var(--primary); border-color: var(--primary); }

.party-grid { display: grid; grid-template-columns: 1fr; gap: 0.65rem; }
@media (min-width: 640px) { .party-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .party-grid { grid-template-columns: 1fr 1fr 1fr; } }

.party-card {
  display: block; text-decoration: none; color: inherit;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 0.9rem 1rem; box-shadow: var(--shadow);
}
.party-card:hover { box-shadow: var(--shadow-lift); transform: translateY(-1px); }
.party-card .row1 { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.4rem; }
.party-card .name { font-weight: 700; font-size: 1rem; }
.party-card .meta { font-size: 0.82rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 0.5rem 0.9rem; margin-top: 0.5rem; }

.empty-state { text-align: center; padding: 3rem 1rem; color: var(--muted); }
.empty-state .ic { font-size: 2.2rem; display: block; margin-bottom: 0.6rem; }

/* ---------------------------------------------------------------------
   Upload — drag & drop + a real "this takes a while" processing state
--------------------------------------------------------------------- */
.dropzone {
  border: 2px dashed var(--border); border-radius: var(--radius-lg);
  background: var(--surface-alt);
  padding: 2.2rem 1.2rem; text-align: center; cursor: pointer;
  transition: border-color 120ms ease, background-color 120ms ease;
}
.dropzone.drag-over { border-color: var(--primary); background: var(--primary-tint); }
.dropzone:focus-within { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.dropzone .ic { font-size: 2.4rem; display: block; margin-bottom: 0.5rem; }
.dropzone input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.file-chip-list { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.9rem; }
.file-chip { background: var(--surface); border: 1px solid var(--border); border-radius: 999px; padding: 0.3rem 0.5rem 0.3rem 0.75rem; font-size: 0.82rem; display: inline-flex; align-items: center; gap: 0.35rem; }
.file-chip-remove { border: none; background: none; color: var(--muted); font-size: 0.8rem; cursor: pointer; padding: 0.1rem 0.2rem; line-height: 1; }
.file-chip-remove:hover { color: var(--danger); }

.kv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.6rem; }
.kv-row label { font-size: 0.76rem; }
.kv-row input { font-variant-numeric: tabular-nums; }
.kv-row-bool { display: flex; align-items: center; }
.kv-row-bool label { display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; font-weight: 500; color: var(--ink); margin: 0; }
.kv-row-bool input[type=checkbox] { width: auto; min-height: auto; }

.processing-overlay {
  position: fixed; inset: 0; z-index: 50; display: none;
  background: rgba(46, 42, 36, 0.5); backdrop-filter: blur(2px);
  align-items: center; justify-content: center; padding: 1.5rem;
}
.processing-overlay.active { display: flex; }
.processing-card {
  background: var(--surface); border-radius: var(--radius-lg); padding: 2rem 1.75rem; text-align: center;
  max-width: 320px; box-shadow: var(--shadow-lift);
}
.spinner {
  width: 38px; height: 38px; margin: 0 auto 1rem;
  border: 3px solid var(--border); border-top-color: var(--primary); border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 2.4s; } }
@keyframes spin { to { transform: rotate(360deg); } }

/* Login */
.login-card { max-width: 360px; margin: 4rem auto 0; }