:root {
  color-scheme: light;
  --ink: #182038;
  --muted: #667085;
  --line: #dfe3ee;
  --purple: #6d3df5;
  --purple-soft: #f2eeff;
  --green: #067647;
  --green-soft: #ecfdf3;
  --amber: #9a6700;
  --amber-soft: #fff8e6;
  --gray-soft: #f7f8fb;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: #f4f5f9;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
main { width: min(980px, calc(100% - 32px)); margin: 32px auto 64px; }
.back { display: inline-flex; margin-bottom: 16px; color: var(--purple); font-size: 14px; font-weight: 800; text-decoration: none; }
.back:hover, .back:focus-visible { text-decoration: underline; outline: none; }
header {
  border-radius: 24px;
  background: linear-gradient(135deg, #2f1b69, #6d3df5);
  color: white;
  padding: 32px;
  box-shadow: 0 20px 45px rgba(48, 27, 105, .18);
}
.eyebrow { margin: 0 0 8px; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .76; }
h1 { margin: 0; font-size: clamp(30px, 5vw, 48px); line-height: 1.04; }
header p { margin: 14px 0 0; max-width: 720px; font-size: 18px; line-height: 1.5; opacity: .9; }
.now { margin: 20px 0; border: 2px solid #b79cff; border-radius: 18px; background: white; padding: 22px 24px; }
.now h2 { margin: 0 0 8px; color: var(--purple); font-size: 15px; letter-spacing: .08em; text-transform: uppercase; }
.now p { margin: 0; font-size: 21px; font-weight: 750; line-height: 1.35; }
section { margin-top: 26px; }
section > h2 { margin: 0 0 12px; font-size: 22px; }
.list { display: grid; gap: 12px; }
.item { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: start; gap: 14px; border: 1px solid var(--line); border-radius: 16px; background: white; padding: 18px; }
.number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--purple-soft); color: var(--purple); font-size: 19px; font-weight: 850; }
.item h3 { margin: 1px 0 5px; font-size: 18px; }
.item p { margin: 0; color: var(--muted); line-height: 1.45; }
.status { border-radius: 999px; padding: 7px 10px; font-size: 12px; font-weight: 850; white-space: nowrap; }
.done { background: var(--green-soft); color: var(--green); }
.verify { background: var(--amber-soft); color: var(--amber); }
.open { background: var(--gray-soft); color: #475467; }
.note { margin-top: 28px; color: var(--muted); font-size: 14px; }
@media (max-width: 680px) {
  main { width: min(100% - 20px, 980px); margin-top: 10px; }
  header { border-radius: 18px; padding: 24px; }
  .item { grid-template-columns: 42px 1fr; }
  .status { grid-column: 2; justify-self: start; }
}