/* Admin — same tokens, utilitarian layout */
body.admin { background: var(--card); }

.admin-header {
  background: var(--ink); color: var(--paper);
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: .9rem 1.5rem; flex-wrap: wrap;
}
.admin-header .wordmark { color: var(--paper); }
.admin-header .tag {
  font-family: var(--body); font-size: .7rem; font-weight: 700;
  letter-spacing: .15em; text-transform: uppercase;
  background: var(--gold); color: var(--ink);
  border-radius: 4px; padding: .1rem .4rem; vertical-align: middle;
}
.admin-header nav { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.admin-header nav a { color: var(--paper); text-decoration: none; font-size: .93rem; font-weight: 500; }
.admin-header nav a:hover { color: var(--gold); }
.admin-header nav a.quiet { color: var(--sage); }

.admin-main { max-width: 1150px; margin: 0 auto; padding: 2rem 1.5rem 4rem; }
.admin-main h1 { font-size: 1.9rem; }
.admin-main h2 { font-size: 1.25rem; margin-top: 2.5rem; }
.muted { color: var(--moss); }
.mono { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .88em; }
.small { font-size: .85rem; }
.note { color: var(--gold-ink); font-style: italic; }

/* tables */
table { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--radius); overflow: hidden; font-size: .93rem; }
th, td { text-align: left; padding: .7rem .8rem; vertical-align: top; }
thead th { background: var(--ink); color: var(--paper); font-weight: 600; font-size: .82rem; letter-spacing: .04em; }
tbody tr + tr td { border-top: 1px solid #E3E7DC; }
tr.inactive { opacity: .5; }
td.addr { max-width: 260px; }

/* status pills */
.pill, .pill-btn, .pill-select {
  display: inline-block; font-size: .78rem; font-weight: 700;
  border-radius: 999px; padding: .2rem .7rem;
  text-transform: lowercase; text-decoration: none;
  border: 1.5px solid transparent; cursor: pointer; font-family: var(--body);
}
.pill.pending,   .pill-btn.pending,   .pill-select.pending   { background: #F4E3BC; color: #7A5A10; }
.pill.assigned,  .pill-btn.assigned,  .pill-select.assigned  { background: #DCE7F5; color: #2B4A76; }
.pill.completed, .pill-btn.completed, .pill-select.completed { background: #DCEBD8; color: #2E5B31; }
.pill.cancelled, .pill-btn.cancelled, .pill-select.cancelled { background: #F0DBDB; color: #7A2E2E; }
.filters { display: flex; gap: .5rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
.filters .pill { background: #fff; border-color: var(--sage); color: var(--moss); }
.filters .pill.active { border-color: var(--ink); color: var(--ink); }

/* forms */
.inline-form { margin: 0; }
.inline-form select { font: inherit; font-size: .85rem; padding: .3rem .4rem; border-radius: 6px; border: 1px solid var(--sage); background: #fff; max-width: 170px; }
.add-form { display: flex; gap: .7rem; flex-wrap: wrap; align-items: center; margin-top: 1rem; }
.add-form input { font: inherit; padding: .55rem .8rem; border: 1.5px solid var(--sage); border-radius: 8px; background: #fff; }
.add-form input[type="number"] { width: 110px; }

/* stat cards */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin: 1.5rem 0 2.5rem; }
.stat { background: #fff; border-radius: var(--radius); padding: 1.1rem 1.2rem; }
.stat span { display: block; font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--moss); }
.stat strong { font-family: var(--display); font-size: 1.9rem; font-weight: 600; }
.stat.accent { background: var(--ink); color: var(--paper); }
.stat.accent span { color: var(--sage); }
.stat.accent strong { color: var(--gold); }
.stat.alert { outline: 2px solid var(--gold); }

/* login */
.login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; margin: 0; }
.login-card { background: #fff; border-radius: 14px; padding: 2.5rem; width: min(380px, 92vw); display: flex; flex-direction: column; gap: 1rem; box-shadow: 0 10px 40px rgba(34,55,43,.12); }
.login-card h1 { margin: 0; font-size: 1.5rem; }
.login-card label { display: flex; flex-direction: column; gap: .3rem; font-weight: 700; font-size: .88rem; }
.login-card input { font: inherit; padding: .65rem .8rem; border: 1.5px solid var(--sage); border-radius: 8px; }
.login-card .error { color: #7A2E2E; background: #F0DBDB; border-radius: 8px; padding: .5rem .8rem; margin: 0; font-size: .9rem; }
.login-card .tag { margin: -0.6rem 0 0; }