/* stils.css — gaiša, jautra spēle: ekrāni un pogas. Spēle pati ir uz audekla. */
:root {
  --fons: #7EC8F5; --karte: rgba(255, 252, 240, 0.96); --akcents: #F4A261; --teksts: #1B2330;
  --kluss: rgba(27, 35, 48, 0.6); --zals: #4E9A46;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; background: var(--fons); color: var(--teksts); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; overscroll-behavior: none; }
.spele { position: relative; width: 100%; height: 100%; overflow: hidden; }
.kanva { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; }
.ekrans { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(60, 120, 170, 0.35); }
.ekrans.aktiivs { display: flex; }
.ekrans--caurspidigs { background: none; pointer-events: none; }
.karte { width: min(440px, 100%); max-height: 100%; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 22px; border-radius: 22px; background: var(--karte); border: 3px solid #fff; box-shadow: 0 12px 40px rgba(0,0,0,0.18); text-align: center; }
.karte--plata { width: min(540px, 100%); }
.virsraksts { margin: 0; font-size: clamp(26px, 7vw, 40px); font-weight: 900; color: var(--zals); letter-spacing: -0.01em; }
.sauklis { margin: 0; color: var(--kluss); font-size: 15px; line-height: 1.45; }
.merkis { margin: 4px 0 0; color: var(--akcents); font-size: 15px; font-weight: 800; }
.statistika { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; margin: 10px 0 4px; font-size: 13px; color: var(--kluss); }
.poga { min-height: 50px; border: 2px solid rgba(27,35,48,0.15); border-radius: 14px; background: #fff; color: var(--teksts); font-size: 16px; font-weight: 700; cursor: pointer; padding: 12px 18px; }
.poga:hover { background: #f5f5f5; }
.poga--galvena { background: var(--akcents); color: #fff; border-color: transparent; font-size: 19px; font-weight: 900; }
.poga--galvena:hover { background: #ef8f45; }
.poga:focus-visible { outline: 3px solid var(--zals); outline-offset: 2px; }
.dzilums { margin: 0; font-size: clamp(40px, 12vw, 64px); font-weight: 900; color: var(--teksts); }
.josla { height: 14px; border-radius: 999px; background: rgba(27,35,48,0.1); overflow: hidden; }
.josla__pildijums { height: 100%; background: var(--akcents); transition: width 0.6s ease-out; }
.josla__merkis { margin: 0; font-size: 12px; color: var(--kluss); text-align: right; }
.statuss { margin: 8px 0 0; font-size: 18px; font-weight: 800; }
.statuss.uzvara { color: var(--zals); }
.rekords { margin: 0; font-size: 15px; color: var(--akcents); font-weight: 800; opacity: 0; min-height: 18px; }
.rekords.redzams { opacity: 1; }
.nopelnits { margin: 0 0 6px; font-size: 15px; color: var(--kluss); }
.veikals { display: flex; flex-direction: column; gap: 8px; }
.veikals__valuta { margin: 0 0 6px; font-size: 20px; font-weight: 800; color: var(--akcents); }
.uzlabojums { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 14px; border: 2px solid rgba(27,35,48,0.1); background: #fff; color: var(--teksts); text-align: left; cursor: pointer; }
.uzlabojums__teksts { display: flex; flex-direction: column; gap: 2px; }
.uzlabojums__teksts small { color: var(--kluss); font-size: 12px; }
.uzlabojums__cena { font-weight: 800; color: var(--akcents); white-space: nowrap; }
.uzlabojums.pieejams { border-color: var(--zals); }
.uzlabojums.dargs, .uzlabojums.pilns { opacity: 0.5; cursor: default; }
.vadiba { margin: 6px 0 0; font-size: 12px; color: var(--kluss); line-height: 1.5; }