:root {
  --bg: #f3efe6;
  --ink: #1c2418;
  --accent: #2f6b4f;
  --accent-2: #c45c26;
  --card: #fffdf8;
  --line: #d7d0c2;
  --ok: #1f6b3a;
  --err: #8b1e1e;
  --font: "Segoe UI", "PT Sans", sans-serif;
  --display: "Georgia", "Times New Roman", serif;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background:
    radial-gradient(circle at 10% 0%, #e7f0e4 0%, transparent 40%),
    radial-gradient(circle at 90% 10%, #f7e4d4 0%, transparent 35%),
    var(--bg);
  min-height: 100vh;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.top {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1rem 1.5rem; border-bottom: 1px solid var(--line);
  background: rgba(255,253,248,.9); position: sticky; top: 0; backdrop-filter: blur(6px);
}
.brand { font-family: var(--display); font-size: 1.35rem; color: var(--ink); font-weight: 700; }
nav { display: flex; gap: .9rem; align-items: center; flex-wrap: wrap; }
.who { opacity: .7; font-size: .9rem; }
.wrap { max-width: 1100px; margin: 0 auto; padding: 1.5rem; }
.foot { text-align: center; padding: 2rem 1rem; opacity: .7; font-size: .9rem; }
.hero h1 { font-family: var(--display); font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0 0 .5rem; }
.hero p { max-width: 42rem; font-size: 1.1rem; line-height: 1.5; }
.filters, .card-form, .auth form, .inline-form {
  display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; margin: 1.25rem 0;
}
.filters label, .card-form label, .auth label { display: flex; flex-direction: column; gap: .3rem; font-size: .9rem; }
input, select, textarea, button {
  font: inherit; padding: .55rem .7rem; border: 1px solid var(--line); border-radius: 8px; background: #fff;
}
textarea { min-width: min(100%, 280px); min-height: 80px; }
button, .btn {
  background: var(--accent); color: #fff; border: none; cursor: pointer; border-radius: 8px; padding: .55rem .9rem;
}
button:hover, .btn:hover { filter: brightness(1.05); }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.product, .order, .detail, .auth, .card-form {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 1rem;
}
.product h2 { font-size: 1.1rem; margin: 0 0 .4rem; font-family: var(--display); }
.meta { opacity: .7; font-size: .85rem; }
.price { font-weight: 700; color: var(--accent-2); }
.lead-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.card-form { flex-direction: column; align-items: stretch; }
.ok { color: var(--ok); font-weight: 600; }
.err { color: var(--err); font-weight: 600; }
table { width: 100%; border-collapse: collapse; background: var(--card); }
th, td { border-bottom: 1px solid var(--line); padding: .55rem .4rem; text-align: left; font-size: .95rem; }
.badge { background: #e8f2ec; padding: .15rem .45rem; border-radius: 999px; font-size: .8rem; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; margin-bottom: 1.5rem; }
.stats div { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: .9rem; font-weight: 600; }
.inline { display: inline; }
.hint { font-size: .9rem; opacity: .8; }
.order { margin-bottom: 1rem; }
.order header { display: flex; gap: .75rem; align-items: center; margin-bottom: .5rem; }

/* Admin ops desk */
.admin-desk .admin-hero {
  display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start;
  margin-bottom: 1rem;
}
.admin-desk .eyebrow { text-transform: uppercase; letter-spacing: .06em; font-size: .75rem; opacity: .65; margin: 0; }
.admin-desk h1 { font-family: var(--display); margin: .2rem 0 .4rem; }
.admin-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.btn-ghost { background: transparent; color: var(--accent); border: 1px solid var(--line); }
.stats-rich div { display: flex; flex-direction: column; gap: .25rem; }
.stats-rich .k { font-size: .75rem; opacity: .65; font-weight: 500; }
.stats-rich strong { font-size: 1.45rem; }
.stats-rich em { font-style: normal; font-size: .8rem; opacity: .75; font-weight: 500; }
.stats-rich div.warn { border-color: #e0a070; background: #fff6ee; }
.admin-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem; margin: 1rem 0 1.5rem;
}
.panel {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 1rem;
}
.panel h2 { margin-top: 0; font-size: 1.05rem; font-family: var(--display); }
.pill-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.pill-list li { background: #eef5f0; border-radius: 999px; padding: .25rem .65rem; }
.row-open { background: #fff9f0; }
.clip { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 640px) {
  .top { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .admin-desk .admin-hero { flex-direction: column; }
}