:root {
  --vins: #600e3a;
  --teksts: #302625;
  --klusais: #806f68;
  --stikls: rgba(255, 252, 249, .72);
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #f5ece6; }
body {
  min-height: 100dvh;
  margin: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  color: var(--teksts);
  background:
    radial-gradient(circle at 50% 36%, rgba(96, 14, 58, .18), transparent 33%),
    linear-gradient(145deg, #fffaf6 0%, #f2e5df 58%, #ead8d2 100%);
  font: 16px/1.6 Georgia, "Times New Roman", serif;
}
a { color: inherit; }
header, footer { padding: 1.2rem clamp(1rem, 4vw, 3rem); }
header a {
  color: var(--vins);
  text-decoration: none;
  letter-spacing: .42em;
  font-size: 1rem;
}
footer { color: var(--klusais); text-align: center; font-size: .78rem; }
.radio {
  width: min(100%, 42rem);
  margin: auto;
  padding: 2rem clamp(1rem, 5vw, 3rem) 4rem;
  display: grid;
  justify-items: center;
  gap: 1rem;
  text-align: center;
}
.virsraksts-mazs {
  margin: 0;
  color: var(--vins);
  letter-spacing: .42em;
  font-size: .72rem;
}
h1 {
  margin: -.2rem 0 0;
  color: var(--vins);
  font-size: clamp(2.8rem, 12vw, 6rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: .025em;
}
.ievads { max-width: 40ch; margin: .3rem 0 1rem; }
audio { width: min(100%, 34rem); }
.stavoklis {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--vins);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.punkts {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: #9d8b84;
}
.skan .punkts { background: #2d8a55; box-shadow: 0 0 0 .28rem rgba(45, 138, 85, .12); }
.tagad { min-height: 1.6em; margin: 0; font-size: 1.05rem; font-style: italic; }
.klausitaji { margin: -.55rem 0 0; color: var(--klusais); font-size: .8rem; }
.areja {
  margin-top: .8rem;
  padding: .65rem 1rem;
  color: var(--vins);
  border: 1px solid rgba(96, 14, 58, .28);
  border-radius: 999px;
  background: var(--stikls);
  text-decoration: none;
  font-size: .84rem;
}
.vilnis {
  height: 5rem;
  display: flex;
  align-items: center;
  gap: .48rem;
  color: var(--vins);
}
.vilnis i {
  width: .3rem;
  height: 22%;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
}
.vilnis i:nth-child(2), .vilnis i:nth-child(6) { height: 48%; }
.vilnis i:nth-child(3), .vilnis i:nth-child(5) { height: 76%; }
.vilnis i:nth-child(4) { height: 100%; }
.skan .vilnis i { animation: vilnis .9s ease-in-out infinite alternate; }
.skan .vilnis i:nth-child(2n) { animation-delay: -.42s; }
.skan .vilnis i:nth-child(3n) { animation-delay: -.68s; }
@keyframes vilnis {
  from { transform: scaleY(.36); opacity: .5; }
  to { transform: scaleY(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .skan .vilnis i { animation: none; }
}