
/* Brand tokens from manatresses.com Squarespace site.css :root palette
   and computed styles on https://www.manatresses.com/ (fetched Nov 8, 2026).
   --white-hsl: 39,20%,65% -> #b8ab94 (taupe / lightest)
   --lightAccent-hsl: 33.33,32.14%,89.02% -> #ece4da (cream)
   --accent-hsl: 322.67,42.86%,20.59% -> #4b1e3a (plum)
   --darkAccent-hsl: 326.51,91.49%,9.22% -> #2d021a (deep burgundy)
   --black-hsl: 240,0%,100% -> #ffffff (white)
   Primary buttons on the site: taupe (#b8ab94) text on plum (#4b1e3a).
   Headings: "Old Standard TT"; body: "Sorts Mill Goudy"; buttons/meta: "Almarai". */
:root {
  --ink: #4b1e3a;
  --ink-soft: rgba(75, 30, 58, 0.78);
  --cream: #ece4da;
  --cream-2: #ece4da;
  --paper: #ffffff;
  --gold: #b8ab94;
  --gold-deep: #4b1e3a;
  --taupe: #b8ab94;
  --plum: #4b1e3a;
  --burgundy: #2d021a;
  --rose: #4b1e3a;
  --ok: #2f6b4f;
  --warn: #b07020;
  --admin-bg: #2d021a;
  --admin-card: #4b1e3a;
  --admin-line: #b8ab94;
  --shadow: 0 10px 30px rgba(45, 2, 26, 0.12);
  --radius: 18px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100%; }
body {
  font-family: Almarai, "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--cream);
}
h1, h2, h3, .brand {
  font-family: "Old Standard TT", "Times New Roman", serif;
  font-weight: 400;
  letter-spacing: -0.02em;
}
a { color: var(--gold-deep); }
button, input, select, textarea {
  font: inherit;
}
button { cursor: pointer; }
.page { max-width: 1100px; margin: 0 auto; padding: 20px 16px 96px; }
.page.wide { max-width: none; }
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; margin-bottom: 20px;
}
.brand { font-size: 1.6rem; margin: 0; }
.sub { font-family: "Sorts Mill Goudy", "Palatino Linotype", Palatino, serif; color: var(--ink-soft); margin: 0 0 16px; }
.card {
  background: var(--paper);
  border: 1px solid var(--taupe);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow);
  margin-bottom: 14px;
}
.btn {
  border: 0;
  background: var(--plum);
  color: var(--cream);
  border-radius: 999px;
  padding: 14px 18px;
  min-height: 48px;
  font-family: Almarai, "Helvetica Neue", sans-serif;
  font-weight: 400;
}
.btn.secondary {
  background: #ffffff;
  color: var(--plum);
  border: 1px solid var(--plum);
}
.btn.gold { background: var(--plum); color: var(--cream); font-weight: 700; }
.btn.danger { background: var(--burgundy); color: var(--cream); font-weight: 700; }
.btn.ok { background: var(--ok); color: #ffffff; }
.btn.full { width: 100%; }
.btn[disabled] { opacity: 0.5; }
.grid { display: grid; gap: 12px; }
.grid.cols-2 { grid-template-columns: 1fr; }
.grid.cols-3, .grid.counters { grid-template-columns: 1fr 1fr; }
@media (min-width: 760px) {
  .grid.cols-2 { grid-template-columns: 1fr 1fr; }
  .grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
  .grid.counters { grid-template-columns: repeat(4, 1fr); }
}
label { display: block; font-weight: 600; margin: 12px 0 6px; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="url"], input[type="date"], select, textarea, input[type="file"] {
  width: 100%;
  border: 1px solid var(--taupe);
  background: #ffffff;
  border-radius: 12px;
  padding: 12px 14px;
}
textarea { min-height: 140px; resize: vertical; }
.counter {
  background: var(--paper);
  border-radius: 16px;
  padding: 14px;
  border: 1px solid var(--taupe);
}
.counter b { display: block; font-size: 1.6rem; }
.counter span { color: var(--ink-soft); font-size: 0.92rem; }
.pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  background: #e8dcc8;
  color: var(--burgundy);
  font-size: 0.82rem;
  font-weight: 600;
}
.pill.received, .pill.new_inquiry, .pill.normal { background: #e8d4b3; color: var(--burgundy); }
.pill.creative, .pill.interested, .pill.high { background: #f3e0c4; color: var(--burgundy); }
.pill.editing, .pill.paused { background: #e0c8ee; color: var(--burgundy); }
.pill.admin_review { background: #c5daf3; color: var(--burgundy); }
.pill.owner_review { background: #f3d392; color: var(--burgundy); }
.pill.changes_requested { background: #f0b8ae; color: var(--burgundy); }
.pill.approved, .pill.ok, .pill.customer { background: #bde5c8; color: #1a3d2a; }
.pill.scheduled { background: #bfe0db; color: #1a3d38; }
.pill.published { background: #b5dfc0; color: #1a3d2a; }
.pill.failed, .pill.error, .pill.urgent { background: #efb4b4; color: #5c1f1f; }
.pill.low { background: #ddd6cc; color: var(--burgundy); }
.pill.draft { background: #e6e0d8; color: var(--burgundy); }
.pill.manual { background: #f6d7a7; color: #5c3a00; }
.pill.cancelled { background: #ddd6cc; color: #5c5c5c; text-decoration: line-through; }
.pill.test { background: #ffe08a; color: #5c4300; }
.progress { display: flex; gap: 4px; flex-wrap: wrap; margin: 10px 0; }
.progress i {
  height: 8px; flex: 1; min-width: 22px; border-radius: 99px; background: #e6d7c4;
}
.progress i.on { background: var(--gold-deep); }
.progress i.hot { background: var(--rose); }
.nav-bottom {
  position: fixed; left: 0; right: 0; bottom: 0;
  display: flex; justify-content: space-around;
  background: #ffffffe8;
  border-top: 1px solid var(--taupe);
  padding: 8px 6px calc(8px + env(safe-area-inset-bottom));
  backdrop-filter: blur(10px);
}
.nav-bottom a {
  text-decoration: none; color: var(--ink-soft); font-size: 0.78rem;
  text-align: center; padding: 6px; min-width: 56px; font-weight: 600;
}
.nav-bottom a.active { color: var(--ink); }
.login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(900px 420px at 50% -10%, #4b1e3a, transparent),
    var(--burgundy);
}
.login-panel { width: min(440px, 100%); }
.login .brand-logo {
  display: block;
  width: min(320px, 86%);
  height: auto;
  margin: 0 auto 22px;
}
.login .card { width: 100%; }
.login .card .brand { color: var(--plum); }
.muted { color: var(--ink-soft); font-size: 0.92rem; }
.row { display: flex; gap: 8px; flex-wrap: wrap; }
.list-item {
  display: block; text-decoration: none; color: inherit;
}
.banner {
  background: #fff3bf; color: #5c4300; padding: 10px 14px;
  border-radius: 12px; margin-bottom: 14px; font-weight: 600;
}
.kanban-wrap { position: relative; }
.kanban-hint { margin: 0 0 10px; }
.kanban, .pipeline {
  display: flex;
  gap: 12px;
  overflow-x: scroll;
  overflow-y: hidden;
  padding: 4px 4px 18px;
  scrollbar-width: auto;
  scrollbar-color: #b8ab94 #2d021a;
  -webkit-overflow-scrolling: touch;
}
.kanban::-webkit-scrollbar, .pipeline::-webkit-scrollbar { height: 12px; }
.kanban::-webkit-scrollbar-track, .pipeline::-webkit-scrollbar-track {
  background: #2d021a; border-radius: 99px;
}
.kanban::-webkit-scrollbar-thumb, .pipeline::-webkit-scrollbar-thumb {
  background: #b8ab94; border-radius: 99px;
}
.kanban-wrap::after {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 18px;
  width: 48px;
  pointer-events: none;
  background: linear-gradient(to right, transparent, var(--admin-bg));
}
body:not(.theme-admin) .kanban-wrap::after {
  background: linear-gradient(to right, transparent, var(--cream));
}
.kanban-col, .pipe-col {
  flex: 0 0 260px;
  width: 260px;
  min-width: 260px;
  background: #ffffff;
  border: 1px solid var(--taupe);
  border-radius: 16px;
  padding: 10px;
  color: var(--ink);
}
.kanban-col h3, .pipe-col h3 { margin: 6px 8px 10px; font-size: 1.1rem; color: inherit; }
.kanban-card {
  background: white; border-radius: 12px; padding: 10px; margin-bottom: 8px;
  border: 1px solid var(--taupe); color: var(--ink);
}
.calendar { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 800px) { .calendar { grid-template-columns: repeat(7, 1fr); } }
.day { min-height: 140px; }
.day h4 { margin: 0 0 8px; }
.preview {
  width: 100%; max-height: 280px; object-fit: contain; border-radius: 12px;
  background: #111; margin-top: 8px;
}
body.theme-admin { background: var(--admin-bg); color: #ece4da; }
body.theme-admin .card, body.theme-admin .counter, body.theme-admin .kanban-card, body.theme-admin .day {
  background: var(--admin-card); border-color: var(--admin-line); color: #ece4da;
  box-shadow: none;
}
body.theme-admin h1, body.theme-admin h2, body.theme-admin h3, body.theme-admin h4, body.theme-admin .brand {
  color: #ece4da;
}
body.theme-admin .sub, body.theme-admin .muted, body.theme-admin label,
body.theme-admin .counter span { color: #b8ab94; }
body.theme-admin .counter b { color: #ece4da; }
body.theme-admin a { color: #b8ab94; }
body.theme-admin input, body.theme-admin select, body.theme-admin textarea {
  background: #2d021a; color: #ece4da; border-color: var(--admin-line);
}
body.theme-admin .nav-bottom { background: #2d021aee; border-top-color: var(--admin-line); }
body.theme-admin .nav-bottom a { color: #b8ab94; }
body.theme-admin .nav-bottom a.active { color: #ece4da; }
body.theme-admin .btn.secondary { background: transparent; color: #ece4da; border: 1px solid #b8ab94; }
body.theme-admin .kanban-col, body.theme-admin .pipe-col {
  background: #4b1e3a;
  border: 1px solid var(--admin-line);
  color: #ece4da;
}
body.theme-admin .kanban-col h3, body.theme-admin .pipe-col h3 {
  color: #ece4da;
}
body.theme-admin .kanban-col .muted, body.theme-admin .pipe-col .muted { color: #b8ab94; }
body.theme-admin .kanban-card { background: #2d021a; color: #ece4da; border-color: var(--admin-line); }
body.theme-admin .pill { color: var(--burgundy); }
.pipeline { /* scroll + flex sizing shared with .kanban */ }
.search { margin-bottom: 12px; }
.hidden { display: none !important; }
.rec-dot {
  width: 12px; height: 12px; border-radius: 50%; background: var(--rose);
  display: inline-block; margin-right: 6px; animation: pulse 1s infinite;
}
@keyframes pulse { 50% { opacity: 0.35; } }
.error { color: var(--plum); font-weight: 600; }
body.theme-admin .error { color: #ece4da; }
