*{ box-sizing:border-box; font-family:-apple-system,BlinkMacSystemFont,system-ui,sans-serif; }
body{ margin:0; background:#f6f0e7; color:#1f2430; }
.hidden{ display:none !important; }

.top-bar{
  background:#f6f0e7;
  padding:12px 12px 10px;
  position:sticky;
  top:0;
  z-index:5;
  border-bottom:1px solid rgba(17,24,39,0.08);
}
.brand-pill{
  display:inline-block;
  background:#1f2430;
  color:#f6f0e7;
  padding:6px 14px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:0.08em;
  font-size:12px;
}
.top-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.chip-btn{
  border:none;
  border-radius:999px;
  padding:8px 14px;
  background:#e3d7c5;
  color:#1f2430;
  font-weight:950;
  cursor:pointer;
}
.top-sub{
  margin-top:10px;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}
.top-sub input{
  width:min(520px, 92vw);
  border-radius:999px;
  border:1px solid #d1d5db;
  padding:10px 12px;
  font-size:14px;
  background:#fbf7f0;
}
.toggle{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:13px;
  color:#374151;
  font-weight:800;
}
.toggle input{ width:16px; height:16px; }

.main{ padding:10px 12px 90px; }

.stats-row{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:10px;
  margin-top:8px;
}
.stat{
  background:#fbf7f0;
  border-radius:16px;
  padding:10px 12px;
  border:1px solid rgba(17,24,39,0.08);
  box-shadow:0 1px 3px rgba(15,23,42,0.06);
}
.stat .k{ font-size:12px; color:#6b7280; font-weight:900; }
.stat .v{ font-size:18px; font-weight:950; margin-top:2px; }

@media(max-width:520px){
  .stats-row{ grid-template-columns:1fr; }
}

.cards{ margin-top:10px; display:flex; flex-direction:column; gap:10px; }

.card{
  background:#fbf7f0;
  border-radius:18px;
  padding:14px 14px 12px;
  box-shadow:0 1px 3px rgba(15,23,42,0.08);
  border:2px solid transparent;
}
.header{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
}
.name{
  font-weight:950;
  font-size:18px;
  line-height:1.15;
}
.when{
  font-size:13px;
  color:#4b5563;
  white-space:nowrap;
  font-weight:900;
}
.place{
  margin-top:6px;
  font-size:14px;
  color:#4b5563;
  font-weight:650;
}
.meta{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:950;
  border:1px solid rgba(17,24,39,0.10);
  background:rgba(255,255,255,0.7);
}
.badge a{ color:inherit; text-decoration:none; }

.section-title{
  margin-top:12px;
  font-size:12px;
  font-weight:950;
  color:#6b7280;
  letter-spacing:0.06em;
}

.chips{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.partner-chip{
  border-radius:999px;
  padding:8px 10px;
  border:1px solid rgba(17,24,39,0.10);
  background:#fff;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.partner-chip .dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#ef4444; /* pending default */
}
.partner-chip[data-state="done"] .dot{ background:#22c55e; }

.partner-chip .label{
  font-size:12px;
  font-weight:950;
  color:#111827;
  white-space:nowrap;
}

.partner-chip .btn{
  border:none;
  cursor:pointer;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:950;
}

.btn-toggle{ background:#111827; color:#f9fafb; }
.btn-note{ background:#e5e7eb; color:#111827; }
.btn-share{ background:#2563eb; color:#fff; }

.controls-row{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.controls-row button{
  border:none;
  border-radius:999px;
  padding:8px 14px;
  cursor:pointer;
  font-weight:950;
  font-size:13px;
}
.btn-mini{ background:#e3d7c5; color:#1f2430; }
.btn-mini.dark{ background:#111827; color:#f9fafb; }

.actions-row{
  margin-top:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.actions-row button{
  border:none;
  border-radius:999px;
  padding:8px 14px;
  cursor:pointer;
  font-weight:950;
  font-size:13px;
}
.btn-all{ background:#111827; color:#f9fafb; }
.btn-all2{ background:#16a34a; color:#fff; }

.modal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,0.45);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:20;
}
.modal-content{
  background:#f9fafb;
  border-radius:18px;
  padding:16px 16px 12px;
  width:min(520px, 92vw);
  max-height:90vh;
  overflow:auto;
}
.modal-content h2{ margin:0 0 8px 0; }

textarea{
  width:100%;
  border-radius:12px;
  border:1px solid #d1d5db;
  padding:10px 12px;
  font-size:14px;
  background:#fff;
  resize:vertical;
}

.modal-actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}
.modal-actions .primary{
  background:#111827;
  color:#f9fafb;
}
.modal-actions .secondary{
  background:#e5e7eb;
  color:#111827;
}
.modal-actions button{
  border:none;
  border-radius:999px;
  padding:8px 14px;
  font-weight:950;
  cursor:pointer;
}

.bottom-bar{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  padding:8px 12px;
  text-align:center;
  font-size:12px;
  background:#111827;
  color:#e5e7eb;
}