/* KRYPTA v0.11.2 — one design system for 7D and cached historical charts.
 * The historical graph uses the same viewBox (680 × 235), plot box
 * (x=55..645; y=32..197), grid, stroke, fill, toolbar, axes and footer.
 * Its 30/90/365 controls and real timestamps remain independent.
 */
.krypta-coins .coin-chart-section,
.krypta-coins .krypta-history-section{margin:0 0 48px}
.krypta-coins .coin-chart-section>.section-heading,
.krypta-coins .krypta-history-section>.section-heading{margin:0 0 18px}
.krypta-coins .krypta-history-heading .eyebrow{display:block;margin:0 0 5px}
.krypta-coins .coin-chart-card.coin-chart-pro,
.krypta-coins .krypta-history-card.coin-chart-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:20px;
  padding:27px 32px;
  box-shadow:var(--soft-shadow);
}
.krypta-coins .coin-chart-pro .coin-chart-toolbar,
.krypta-coins .krypta-history-card .krypta-history-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:18px 24px;
  padding:0 0 14px;
}
.krypta-coins .krypta-history-card .krypta-history-values{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.krypta-coins .krypta-history-card .krypta-history-overline{
  font-size:.72rem;letter-spacing:.075em;font-weight:850;
}
.krypta-coins .krypta-history-card .krypta-history-selected{
  display:block;
  color:var(--text);
  font-size:clamp(1rem,1.8vw,1.25rem);
  line-height:1.4;
  letter-spacing:-.01em;
  font-weight:850;
  margin:4px 0 0;
  font-variant-numeric:tabular-nums;
}
.krypta-coins .krypta-history-card [data-history-range-change]{
  display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;
  font-size:.91rem;line-height:1.4;font-weight:800;
}
.krypta-coins .krypta-history-card [data-history-range-change] small{
  font-size:.71rem;line-height:1.4;
}
.krypta-coins .krypta-history-tabs{
  margin:0;
  gap:4px;
  padding:4px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--bg);
}
.krypta-coins .krypta-history-tabs button{
  min-height:40px;
  min-width:54px;
  border-radius:9px;
  padding:8px 13px;
  font-size:.78rem;
}
.krypta-coins .krypta-history-tabs button:focus-visible{
  outline:3px solid #74b52f;outline-offset:2px;
}
.krypta-coins .krypta-history-card .krypta-history-graph{
  color:#489064;
  margin:0;
  width:100%;
  border-radius:13px;
  outline-offset:5px;
}
html[data-theme="dark"] .krypta-coins .krypta-history-card .krypta-history-graph{
  color:#baff65;
}
.krypta-coins .krypta-history-card .krypta-history-graph svg{
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  overflow:visible;
}
.krypta-coins .krypta-history-card .krypta-history-axis{
  fill:var(--muted);font:11px Inter,system-ui,sans-serif;
  letter-spacing:0;
}
.krypta-coins .krypta-history-card .krypta-history-range.coin-chart-legend{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin:7px 0 0;
  padding:9px 0 0;
  border-top:1px solid var(--line);
  font-size:.79rem;
  color:var(--muted);
}
.krypta-coins .krypta-history-card .krypta-history-range span:last-child{
  margin-left:auto;text-align:right;
}
.krypta-coins .krypta-history-card .krypta-history-footer.coin-chart-foot{
  border:0;
  margin:13px 0 0;
  padding:0;
  gap:8px 20px;
  font-size:.75rem;
}
.krypta-coins .krypta-history-card .krypta-history-disclaimer{
  margin:12px 0 0;
  color:var(--muted);
  font-size:.74rem;
  line-height:1.65;
}
@media(max-width:700px){
  .krypta-coins .coin-chart-card.coin-chart-pro,
  .krypta-coins .krypta-history-card.coin-chart-card{padding:20px}
  .krypta-coins .krypta-history-card .krypta-history-toolbar{
    flex-direction:column;
    align-items:stretch;
    gap:14px;
  }
  .krypta-coins .krypta-history-tabs{display:flex;width:100%}
  .krypta-coins .krypta-history-tabs button{flex:1}
  .krypta-coins .krypta-history-card .krypta-history-range.coin-chart-legend{
    font-size:.71rem;gap:8px;
  }
  .krypta-coins .krypta-history-card .krypta-history-footer.coin-chart-foot{
    gap:8px 14px;
    align-items:flex-start;
  }
}