:root{
  --fonas:#f2f2f7; --kortele:#ffffff; --tekstas:#1c1c1e; --pilka:#8e8e93;
  --linija:#d1d1d6; --melyna:#007aff; --raudona:#ff3b30; --zalia:#34c759;
  --antraste:rgba(249,249,251,.92);
}
@media (prefers-color-scheme: dark){
  :root{ --fonas:#000; --kortele:#1c1c1e; --tekstas:#f2f2f7; --pilka:#8e8e93;
         --linija:#38383a; --antraste:rgba(28,28,30,.92); }
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
[hidden]{display:none !important}   /* .ramas{display:flex} kitaip perrasytu UA [hidden] taisykle */
html,body{margin:0;padding:0;height:100%;overflow:hidden}
body{
  /* IŠMATUOTA 2026-08-28 (iPhone, standalone): lvh=932 (visas ekranas),
     bet realus viewport = innerHeight = dvh = svh = visualViewport = 873.
     PWA nelenda po busenos juosta (safe top = 0), tad 100lvh persviedavo remą
     59 px žemiau ekrano ir nukirsdavo apatinę juostą. Naudojam svh - jis
     stabilus ir neseka klaviatūros animacijos (skirtingai nei dvh). */
  min-height:100%;
  overscroll-behavior-y:none;
  background:var(--fonas); color:var(--tekstas);
  font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.ramas{height:100%;height:100svh;display:flex;flex-direction:column}
.virs-ramo{position:fixed;inset:0;z-index:50;background:var(--fonas)}
.perziura{height:100%;height:100svh;display:flex;flex-direction:column}

/* antraste */
.antraste{
  flex-shrink:0;
  min-height:calc(3rem + env(safe-area-inset-top));
  padding-top:env(safe-area-inset-top);
  background:var(--antraste);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:.5px solid var(--linija);
}
.antraste-eile{height:3rem;display:flex;align-items:center;justify-content:space-between;padding:0 1rem;gap:.5rem}
.antraste-tekstas{font-size:1.05rem;font-weight:600}
.atgal{background:none;border:0;color:var(--melyna);font-size:1rem;padding:.25rem 0;width:5.5rem;text-align:left;cursor:pointer}
.atgal.desine{text-align:right}
.atgal.desine.pilkas{color:var(--pilka)}
.priedo-veiksmai{display:flex;gap:.75rem;align-items:center}
.priedo-veiksmai a,.priedo-veiksmai button{color:var(--melyna);background:none;border:0;font-size:.9rem;text-decoration:none;padding:0;cursor:pointer}
img.priedo-vaizdas{max-width:100%;border-radius:8px;display:block;margin:0 auto}
iframe.priedo-pdf{width:100%;height:calc(100svh - 8rem);border:0;border-radius:8px;background:#fff}
.zenklelis{background:var(--raudona);color:#fff;border-radius:999px;padding:.1rem .5rem;font-size:.78rem;font-weight:600}

/* turinys */
.turinys{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.skiltis{padding:.75rem 1rem calc(2rem + env(safe-area-inset-bottom))}

/* apatine juosta */
.juosta{
  flex-shrink:0;display:flex;
  border-top:.5px solid var(--linija);
  background:var(--antraste);
  /* Ne visa saugi zona: pilni 34 px palikdavo per dideli tarpa po uzrasais.
     Paliekam ~18 px - namu juostele nedengia, bet turinys nusileidzia zemiau. */
  padding-bottom:max(4px, calc(env(safe-area-inset-bottom) - 16px));
}
.juostos-mygtukas{
  flex:1;background:none;border:0;color:var(--pilka);
  font-size:.68rem;padding:.55rem 0 .2rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;cursor:pointer;
}
.juostos-mygtukas span{font-size:1.3rem;line-height:1}
.juostos-mygtukas.aktyvus{color:var(--melyna)}

/* filtrai */
.filtrai{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}
.laukas{
  width:100%;padding:.6rem .8rem;border:.5px solid var(--linija);border-radius:10px;
  background:var(--kortele);color:var(--tekstas);font-size:16px;
}
.laukas.pin{text-align:center;letter-spacing:.25em;margin-bottom:.6rem}
.segmentai{display:flex;background:var(--linija);border-radius:9px;padding:2px;gap:2px}
.segmentai button{
  flex:1;border:0;border-radius:7px;background:transparent;color:var(--tekstas);
  padding:.35rem;font-size:.85rem;cursor:pointer;
}
.segmentai button.aktyvus{background:var(--kortele);font-weight:600}
.zymos{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.15rem}
.zyma{
  flex:0 0 auto;border:.5px solid var(--linija);background:var(--kortele);color:var(--tekstas);
  border-radius:999px;padding:.28rem .7rem;font-size:.82rem;cursor:pointer;white-space:nowrap;
}
.zyma.aktyvus{background:var(--melyna);color:#fff;border-color:var(--melyna)}

/* sarasas */
.sarasas{background:var(--kortele);border-radius:12px;overflow:hidden}
.laiskas{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:.5px solid var(--linija);
  padding:.7rem .9rem;color:var(--tekstas);cursor:pointer}
.laiskas:last-child{border-bottom:0}
.laiskas.neskaitytas .tema{font-weight:700}
.laiskas .virsus{display:flex;justify-content:space-between;gap:.5rem;font-size:.78rem;color:var(--pilka)}
.laiskas .tema{margin:.15rem 0;font-size:.95rem}
.laiskas .apacia{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--pilka);flex-wrap:wrap}
.taskas{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.tuscia{padding:2.5rem 1rem;text-align:center;color:var(--pilka)}

/* laisko perziura */
.blokas{background:var(--kortele);border-radius:12px;padding:.9rem;margin-bottom:.75rem}
.blokas h3{margin:0 0 .5rem;font-size:.95rem}
.meta{font-size:.85rem;color:var(--pilka);margin:.15rem 0}
.kunas{white-space:pre-wrap;word-wrap:break-word;font-size:.93rem}
iframe.html-kunas{width:100%;height:55vh;border:0;background:#fff;border-radius:8px}
.priedas{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:.5px solid var(--linija)}
.priedas:last-child{border-bottom:0}
.priedas a{color:var(--melyna);text-decoration:none}

/* mygtukai */
.mygtukas{
  width:100%;background:var(--melyna);color:#fff;border:0;border-radius:10px;
  padding:.7rem;font-size:.95rem;font-weight:600;cursor:pointer;
}
.mygtukas.plonas{background:var(--kortele);color:var(--melyna);border:.5px solid var(--linija);margin-top:.75rem}
.mygtukas.pavojus{background:var(--raudona)}
.mygtukas.didelis{padding:.85rem;margin-top:.4rem}
.mygtukai-eile{display:flex;gap:.5rem;margin-top:.5rem}

/* prisijungimas */
.login-vidus{margin:auto;width:100%;max-width:320px;padding:1.5rem;text-align:center}
.login-logo{font-size:3rem}
.login-vidus h1{margin:.25rem 0 .1rem;font-size:1.6rem}
.pilka{color:var(--pilka);font-size:.88rem}
.klaida{color:var(--raudona);font-size:.88rem;margin-top:.75rem}
.skirtukas{display:flex;align-items:center;gap:.6rem;margin:1rem 0;color:var(--pilka);font-size:.8rem}
.skirtukas::before,.skirtukas::after{content:"";flex:1;height:.5px;background:var(--linija)}

/* nustatymai */
.eilute{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem 0;border-bottom:.5px solid var(--linija)}
.eilute:last-child{border-bottom:0}
.eilute label{font-size:.9rem}
.eilute input[type=number],.eilute input[type=text],.eilute select{
  width:8rem;padding:.35rem .5rem;border:.5px solid var(--linija);border-radius:8px;
  background:var(--fonas);color:var(--tekstas);font-size:16px}
.perjungiklis{position:relative;width:51px;height:31px;flex:0 0 auto}
.perjungiklis input{opacity:0;width:100%;height:100%;margin:0}
.perjungiklis i{position:absolute;inset:0;background:var(--linija);border-radius:999px;transition:.2s;pointer-events:none}
.perjungiklis i::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;background:#fff;border-radius:50%;transition:.2s}
.perjungiklis input:checked + i{background:var(--zalia)}
.perjungiklis input:checked + i::after{transform:translateX(20px)}

/* statistika */
.stulpeliai{display:flex;align-items:flex-end;gap:3px;height:110px;margin-top:.5rem}
.stulpelis{flex:1;background:var(--melyna);border-radius:3px 3px 0 0;min-height:2px}
.juostele{margin:.4rem 0}
.juostele .virsus{display:flex;justify-content:space-between;font-size:.82rem;margin-bottom:.2rem}
.juostele .fonas{height:8px;background:var(--linija);border-radius:999px;overflow:hidden}
.juostele .uzpildas{height:100%;border-radius:999px}

.tostas{
  position:fixed;left:50%;transform:translateX(-50%);
  bottom:calc(4.5rem + env(safe-area-inset-bottom));
  background:rgba(0,0,0,.85);color:#fff;padding:.6rem 1rem;border-radius:999px;
  font-size:.85rem;z-index:100;max-width:90%;
}