:root{
  --bg:#f5f6f8;
  --card:#ffffff;
  --border:#e1e4e8;
  --text:#1f2328;
  --muted:#6b7280;
  --primary:#2563eb;
  --primary-dark:#1d4ed8;
  --success:#16a34a;
  --danger:#dc2626;
  --amber:#d97706;
  --purple:#7c3aed;
  --teal:#0d9488;
  --radius:10px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}
.topbar{
  background:var(--card);
  border-bottom:1px solid var(--border);
  padding:1rem 1.5rem;
}
.topbar h1{ font-size:1.1rem; margin:0 0 .75rem; }
.tabs{ display:flex; gap:.5rem; }
.tab-btn{
  padding:.5rem 1rem;
  border:1px solid var(--border);
  background:var(--card);
  border-radius:8px;
  cursor:pointer;
  font-size:.9rem;
}
.tab-btn.active{ background:var(--primary); color:#fff; border-color:var(--primary); }

.container{ max-width:760px; margin:1.5rem auto; padding:0 1rem; }
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }

.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.25rem;
}
.section-title{ font-size:.95rem; color:var(--primary); margin:0 0 .75rem; }
.row{ display:flex; align-items:center; gap:.5rem; }
.row.between{ justify-content:space-between; margin-bottom:1rem; }
.muted{ color:var(--muted); font-size:.85rem; }
.strong{ font-weight:600; }
.hidden{ display:none !important; }

label{ display:block; font-size:.8rem; color:var(--muted); margin:.5rem 0 .25rem; }
input, select, textarea{
  width:100%;
  padding:.5rem .6rem;
  border:1px solid var(--border);
  border-radius:8px;
  font-size:.9rem;
  font-family:inherit;
  background:#fff;
}
textarea{ resize:vertical; }
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }

.btn-primary, .btn-secondary{
  margin-top:1rem;
  padding:.65rem 1rem;
  border:none;
  border-radius:8px;
  font-size:.9rem;
  cursor:pointer;
  width:100%;
}
.btn-primary{ background:var(--primary); color:#fff; }
.btn-primary:hover{ background:var(--primary-dark); }
.btn-secondary{ background:var(--card); border:1px solid var(--border); color:var(--text); width:auto; margin-bottom:1rem; }

.msg{ font-size:.85rem; min-height:1.2em; margin-top:.5rem; }
.msg.success{ color:var(--success); }
.msg.error{ color:var(--danger); }

.filters{ display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1rem; }

.journal-list{ display:flex; flex-direction:column; gap:.75rem; }
.order-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:.9rem 1rem;
  cursor:pointer;
}
.order-card:hover{ border-color:var(--primary); }
.order-card .row.between{ margin-bottom:.35rem; }

.badge{
  font-size:.75rem;
  padding:.2rem .6rem;
  border-radius:999px;
  font-weight:600;
  color:#fff;
  white-space:nowrap;
}
.badge.gray{ background:#6b7280; }
.badge.blue{ background:var(--primary); }
.badge.amber{ background:var(--amber); }
.badge.teal{ background:var(--teal); }
.badge.purple{ background:var(--purple); }
.badge.green{ background:var(--success); }

table.detail-table{ width:100%; font-size:.85rem; margin-bottom:1rem; border-collapse:collapse; }
table.detail-table td{ padding:.3rem 0; border-bottom:1px solid var(--border); }
table.detail-table td:last-child{ text-align:right; }

.step-box{
  background:var(--bg);
  border-radius:8px;
  padding:1rem;
  margin-bottom:1rem;
}
.log-entry{
  display:flex; justify-content:space-between;
  font-size:.78rem; color:var(--muted);
  padding:.2rem 0;
}