/* Gymelle – bendras stilius (v0.1) */
:root {
  --fonas: #F5F4F8;
  --kortele: #FFFFFF;
  --tekstas: #1C1A26;
  --antrinis: #67637A;
  --linija: #E2DFEA;
  --linija-sviesi: #ECEAF1;
  --zyme: #EFEDF4;
  --seima: #2A7565;
  --seima-sviesi: #E3F1ED;
  --klubas: #7A2E63;
  --klubas-sviesi: #F3E6EF;
  --demesys: #B4541A;
  --demesys-sviesi: #FBEBDF;
  --demesys-linija: #EFCDB6;
  --auksas: #9A6418;
  --auksas-sviesi: #F6EEDF;
  --antraste: "Unbounded", "Manrope", system-ui, sans-serif;
  --pagrindinis: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --akcentas: var(--seima);
  --akcentas-sviesi: var(--seima-sviesi);
}
body.komanda { --akcentas: var(--klubas); --akcentas-sviesi: var(--klubas-sviesi); }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fonas);
  color: var(--tekstas);
  font-family: var(--pagrindinis);
  font-size: 15px;
  line-height: 1.5;
}
a { color: var(--akcentas); font-weight: 600; text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { margin: 0; text-wrap: balance; }
p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--akcentas); outline-offset: 2px; }
[hidden] { display: none !important; }

.zodzenklis { font-family: var(--antraste); font-weight: 600; letter-spacing: -0.01em; font-size: 18px; color: var(--tekstas); }
.antraste-1 { font-family: var(--antraste); font-weight: 500; font-size: 26px; line-height: 1.15; letter-spacing: -0.01em; }
.antraste-2 { font-family: var(--antraste); font-weight: 500; font-size: 17px; line-height: 1.3; }
.skyriaus-pav { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.antrinis { color: var(--antrinis); }
.mazas { font-size: 13px; }

/* Mygtukai */
.mygtukas {
  min-height: 44px; padding: 0 18px; border-radius: 10px; border: 1px solid transparent;
  background: var(--akcentas); color: #FFFFFF; font-weight: 700; font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap;
}
.mygtukas:disabled { opacity: 0.55; cursor: default; }
.mygtukas.antrinis-m { background: #FFFFFF; color: var(--tekstas); border-color: #D8D4E2; }
.mygtukas.svelnus { background: var(--akcentas-sviesi); color: var(--akcentas); }
.mygtukas.mazas-m { min-height: 36px; padding: 0 12px; font-size: 14px; }
.mygtukas.pasirinkta { box-shadow: inset 0 0 0 2px var(--tekstas); }

/* Žymos */
.zymos { display: flex; flex-wrap: wrap; gap: 6px; }
.zyma { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: var(--zyme); white-space: nowrap; }
.zyma.gerai { background: var(--seima-sviesi); color: var(--seima); }
.zyma.demesio { background: var(--demesys-sviesi); color: var(--demesys); }
.zyma.balta { background: #FFFFFF; color: var(--demesys); font-weight: 700; }
.zyma.klubo { background: var(--klubas-sviesi); color: var(--klubas); }
.zyma.medalis { background: var(--auksas-sviesi); color: var(--auksas); }
.zyma.blanki { background: #FFFFFF; color: var(--antrinis); border: 1px solid var(--linija); }

/* Kortelės */
.kortele { background: var(--kortele); border: 1px solid var(--linija); border-radius: 14px; }
.kortele.laukia { background: var(--demesys-sviesi); border-color: var(--demesys); }

/* Vaikų spalvos */
.vaikas-0 { --vaiko: #2F6FA3; --vaiko-sviesi: #E3EDF6; }
.vaikas-1 { --vaiko: #B0487F; --vaiko-sviesi: #F6E4EE; }
.vaikas-2 { --vaiko: #2A7565; --vaiko-sviesi: #E3F1ED; }
.vaikas-3 { --vaiko: #9A6418; --vaiko-sviesi: #F6EEDF; }
.taskas { width: 10px; height: 10px; border-radius: 50%; background: var(--vaiko); flex: none; display: inline-block; }
.avataras { width: 32px; height: 32px; border-radius: 50%; background: var(--vaiko-sviesi); color: var(--vaiko); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; border: 2px solid var(--fonas); }
.avatarai { display: flex; }
.avatarai .avataras + .avataras { margin-left: -8px; }

/* Formos */
.laukas { display: grid; gap: 6px; }
.laukas label { font-size: 13px; font-weight: 700; }
.laukas input, .laukas select, .laukas textarea {
  min-height: 44px; padding: 8px 12px; border: 1px solid #D8D4E2; border-radius: 10px; background: #FFFFFF; width: 100%;
}
.laukas textarea { min-height: 80px; }
.laukai { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }

/* Pranešimas apačioje */
.pranesimas {
  position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  background: var(--tekstas); color: #FFFFFF; padding: 10px 16px; border-radius: 10px; font-size: 14px; font-weight: 600;
  max-width: calc(100% - 32px); z-index: 50; box-shadow: 0 8px 24px -12px rgba(28, 26, 38, 0.5);
}
.pranesimas.klaida { background: var(--demesys); }

.krauna { padding: 48px 0; text-align: center; color: var(--antrinis); }
