/* timeline-v2.css — minimal, structure-first */

.page { min-height: 100vh; padding: 26px 18px 60px; }
.wrap { max-width: 1180px; margin: 0 auto; }

.topbar { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom: 12px; }
.topbarActions { display:flex; gap:10px; flex-wrap:wrap; }

.status { margin: 10px 0 14px; color: var(--muted); }

.grid { display:grid; grid-template-columns: 1.05fr .95fr; gap: 14px; }
@media (max-width: 980px) { .grid { grid-template-columns: 1fr; } }

.card {
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
  border-radius: 18px;
  padding: 14px;
}

.h1 { margin: 0 0 6px; }
.h2 { margin: 0 0 10px; font-size: 18px; }
.h3 { margin: 12px 0 8px; font-size: 14px; color: var(--text); }

.row { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin: 10px 0; }
.field { display:flex; flex-direction:column; gap:6px; min-width: 220px; }
.field.grow { flex: 1; min-width: 260px; }
.field span { color: var(--muted); font-size: 12px; }

.field input, .field select, .field textarea {
  width: 100%;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.20);
  color: var(--text);
  border-radius: 12px;
  padding: 10px 12px;
  outline: none;
}

.field textarea { resize: vertical; }

.actions { display:flex; gap:10px; flex-wrap:wrap; margin-top: 10px; }

.details {
  border: 1px dashed var(--border);
  border-radius: 14px;
  padding: 10px 12px;
  margin-top: 10px;
}
.details summary { cursor: pointer; color: var(--muted); }

.small { font-size: 12px; }

.list { margin-top: 10px; display:flex; flex-direction:column; gap: 10px; }
.item {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(0,0,0,.18);
}
.itemTop { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.itemTitle { font-weight: 700; }
.itemMeta { color: var(--muted); font-size: 12px; margin-top: 4px; }
.itemBody { margin-top: 8px; color: var(--text); }
.itemBody ul { margin: 8px 0 0 18px; color: var(--text); }
.itemActions { display:flex; gap:8px; flex-wrap:wrap; margin-top: 10px; }

.sep { border: none; border-top: 1px solid var(--border); margin: 12px 0; }

.export {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(0,0,0,.22);
  padding: 12px;
  min-height: 160px;
  white-space: pre-wrap;
  word-break: break-word;
}

.foot { margin-top: 12px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.link { color: var(--accent); text-decoration:none; }
.link:hover { text-decoration: underline; }