.claim-lab {
  overflow: hidden;
  margin-top: 54px;
  background: #fff;
  border: 1px solid var(--ink);
  box-shadow: 10px 10px 0 var(--acid);
}

.claim-top {
  display: flex;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid var(--ink);
  font: 500 10px var(--mono);
  letter-spacing: .08em;
}

.claim-top i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  background: var(--blue);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(34,92,255,.12);
}

.claim-top b { color: var(--muted); font-weight: 500; }
.claim-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--ink); }
.claim-tabs button {
  padding: 17px;
  color: var(--muted);
  background: var(--paper);
  border: 0;
  border-right: 1px solid var(--ink);
  cursor: pointer;
  font: 500 11px var(--mono);
  text-transform: uppercase;
}
.claim-tabs button:last-child { border-right: 0; }
.claim-tabs button span { margin-right: 12px; color: #969c98; }
.claim-tabs button[aria-selected="true"] { color: #fff; background: var(--blue); }
.claim-tabs button[aria-selected="true"] span { color: var(--acid); }
.claim-panel { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 365px; }
.claim-sequence { align-self: center; padding: 35px; }
.claim-sequence article {
  display: grid;
  grid-template-columns: 90px 1fr 28px;
  align-items: center;
  gap: 15px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}
.claim-sequence article span { color: var(--blue); font: 500 10px var(--mono); }
.claim-sequence article strong { font-size: 15px; }
.claim-sequence article i { display: grid; place-content: center; width: 24px; height: 24px; color: #fff; background: var(--ink); border-radius: 50%; font-style: normal; }
.claim-sequence article i.blocked { color: var(--ink); background: var(--acid); }
.claim-result { display: flex; flex-direction: column; justify-content: center; padding: 38px; color: #fff; background: var(--dark); }
.claim-result > span { color: var(--acid); font: 500 10px var(--mono); letter-spacing: .1em; }
.claim-result > strong { margin: 30px 0 16px; font: 600 clamp(30px, 3.4vw, 48px)/1 var(--display); letter-spacing: -.03em; }
.claim-result > p { margin: 0; color: #aeb8b3; font-size: 14px; line-height: 1.65; }
.claim-result > div { display: flex; justify-content: space-between; margin-top: 38px; padding-top: 18px; border-top: 1px solid #34403a; font: 500 10px var(--mono); }
.claim-result > div b { color: var(--acid); font-size: 18px; }
.claim-note { margin: 0; padding: 15px 20px; color: var(--muted); border-top: 1px solid var(--ink); font: 400 10px/1.5 var(--mono); text-align: center; }

@media (max-width: 800px) {
  .claim-top { gap: 15px; }.claim-top b { text-align: right; }
  .claim-panel { grid-template-columns: 1fr; }.claim-result { min-height: 300px; }
}

@media (max-width: 480px) {
  .claim-lab { box-shadow: 7px 7px 0 var(--acid); }
  .claim-tabs { grid-template-columns: 1fr; }.claim-tabs button { border-right: 0; border-bottom: 1px solid var(--ink); text-align: left; }.claim-tabs button:last-child { border-bottom: 0; }
  .claim-sequence { padding: 24px 18px; }.claim-sequence article { grid-template-columns: 70px 1fr 24px; gap: 8px; }.claim-sequence article strong { font-size: 13px; }.claim-result { padding: 30px 22px; }
}
