/* 02-juosta.css — Prisijungimo langas, sonine juosta (pokalbiu sarasas, paieska, pulsas)
   ir pokalbio meniu.

   Issskirta is public/index.html 2026-08-31 (UX refresh, 0 etapas). Failu TVARKA
   yra reiksminga: numeriai varduose = ta pati eiles tvarka, kokia buvo monolite. */
  /* --- prisijungimas --- */
  #login{position:fixed;inset:0;background:var(--panel);display:flex;align-items:center;justify-content:center;z-index:70}
  #login .box{text-align:center;max-width:300px;width:100%}
  #login h1{font-family:var(--display);font-size:var(--dsp-l);font-weight:600;margin:0 0 4px;letter-spacing:-.4px}
  #login p{color:var(--muted);margin:0 0 22px;font-size:var(--tx-l)}
  #pin{width:100%;padding:13px;font-size:var(--dsp-m);text-align:center;letter-spacing:8px;
       background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--text)}
  #pin:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}
  /* --err-text, ne --err: uzpildo spalva kaip TEKSTAS ant --panel davė 4,44:1. */
  #loginErr{color:var(--err-text);font-size:var(--tx-m);margin-top:12px;min-height:18px}

  /* --- sonine --- */
  /* ================= KAIRE PUSE: juostele + kontekstinis stulpelis =================
     Juostele (rail) sako, KURIOJE sistemos dalyje esi; stulpelis salia — kas toje
     dalyje yra. Iki 2026-08-31 buvo tik stulpelis, o visos kitos dalys gyveno po
     vienu mygtuku jo apacioje; zr. 07-sritys.css.
     Abu viename `#kaire` del vienos priezasties: telefone jiedu isslenka kaip
     VIENAS stalcius, ir dalinti ta judesi i du butu ne tik sunkiau, bet ir matoma. */
  #kaire{display:flex;flex:0 0 auto;min-height:0}
  /* 80 px, ne 72 ir ne 64. Ismatuota du kartus: ilgiausias srities vardas
     („Nustatymai") 9,5 px sriftu 52 px punkte nusikerpa i „Nustaty…", o perėjus nuo
     Manrope prie Montserrat (2026-09-01) tas pats zodis paplatejo dar ~8 % ir vel
     nutruko jau 72 px juosteleje. Uzrasas, kuris nutruksta, atrodo kaip klaida.
     Trumpinti zodi butu pigiau, bet „Nustat." lietuviskai neskamba niekaip.
     PAMOKA, uz kuria sumoketa: srifto seimos keitimas yra ir MAKETO keitimas —
     kiekviena vieta, kur tekstas remiasi i fiksuota ploti, permatuojama is naujo. */
  #rail{width:80px;flex:0 0 auto;background:var(--panel);border-right:1px solid var(--line);
        display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 0 10px}
  #railZenklas{width:var(--t5);height:var(--t5);color:var(--accent-text);margin-bottom:var(--t3);flex:0 0 auto}
  #railZenklas svg{width:var(--t5);height:var(--t5);display:block}
  #railSritys{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%}
  .railTarpas{flex:1 1 auto}
  /* Punktas: ikona + mazas uzrasas. Uzrasas cia ne puosmena — juostele be uzrasu
     reikalauja isimokti septynias ikonas, o naudojama ji kasdien.
     Aktyvus punktas — VIENSPALVIS akcento kvadratas, o ne blankus atspalvis:
     issimatuota, kad --accent-soft ant --panel duoda ~1,1:1, t.y. „pazymeta" butu
     nematoma; solidus fonas duoda 4,2:1 (sviesioje) ir 5,3:1 (tamsioje). */
  .railM{width:70px;min-height:46px;border:none;background:none;color:var(--muted);cursor:pointer;
         border-radius:var(--r-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
         padding:5px 2px;font:inherit;position:relative;transition:background var(--greitas),color var(--greitas)}
  .railM svg{width:var(--ik-l);height:var(--ik-l);display:block}
  .railTx{font-size:var(--tx-xs);line-height:1;letter-spacing:.01em;max-width:100%;overflow:hidden;text-overflow:ellipsis;
          white-space:nowrap}
  .railM:hover{background:var(--hover);color:var(--text)}
  .railM.on{background:var(--accent-solid);color:var(--on-accent)}
  .railM:focus-visible{outline:none;box-shadow:var(--ziedas)}
  /* Zenklelis juosteleje sako TIK „cia kazkas yra" — skaicius laukia viduje.
     Suma ant srities, kurioje du moduliai, nieko nesako apie tai, kuriam ju reikia demesio. */
  .railZyme{position:absolute;top:5px;right:8px;width:7px;height:7px;border-radius: var(--r-round);
            background:var(--muted)}
  .railZyme.kritine{background:var(--err-solid)}
  .railZyme.demesio{background:var(--warn-solid)}
  .railM.on .railZyme{background:var(--on-accent)}
  .railIk{width:var(--mygt-ik);height:var(--mygt-ik);flex:0 0 auto;border:none;background:none;color:var(--muted);border-radius:var(--r-md);
          display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--greitas),color var(--greitas)}
  .railIk:hover{background:var(--hover);color:var(--text)}
  .railIk svg{width:var(--ik-m);height:var(--ik-m);display:block}
  .railIk:focus-visible{outline:none;box-shadow:var(--ziedas)}

  aside{width:264px;background:var(--panel);border-right:1px solid var(--line);
        display:flex;flex-direction:column;flex:0 0 auto;min-width:0}
  /* Stulpelis keiciasi pagal sriti, bet DOM lieka vietoje: taip pokalbiu sarasas
     negrizta i pradzia kaskart, kai zmogus uzsuka i „Sistema" ir atgal. */
  .stulpelis{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
  body[data-sritis="pokalbiai"] #stSritis{display:none}
  body:not([data-sritis="pokalbiai"]) #stPokalbiai{display:none}
  body.vienaDalis #side{display:none}
  aside header{padding:var(--t4) var(--t4) var(--t2);display:flex;align-items:center;gap:8px}
  aside header b{font-family:var(--display);font-size:var(--tx-xl);font-weight:600;letter-spacing:-.2px}
  /* PIRMAEILIS veiksmas atrodo pirmaeilis. Iki 2026-09-01 „Naujas pokalbis" ir
     paieskos laukas buvo du vienodi apvesti staciakampiai vienas po kito — akis
     nemate, kuris is ju veiksmas, o kuris laukas. Uzpildytas akcentu mygtukas ta
     klausima uzdaro be nė vieno papildomo zodzio. */
  /* Variantas „pagrindinis": TAMSUS (grafitas) fonas, baltas tekstas, seselis.
     Melyna lieka AKCENTUI — aktyviam juosteles punktui. Dvi skirtingos rolės
     viena spalva reiske, kad „kur as esu" ir „ka cia daryti" atrode vienodai. */
  #new{margin:var(--t1) var(--t3) var(--t2);padding:0 var(--t3);
       background:var(--primary);color:var(--primary-foreground);border:1px solid transparent;
       border-radius:var(--r-md);font-weight:500;cursor:pointer;font-size:var(--tx-l);
       display:flex;align-items:center;gap:var(--t2);height:var(--mygt-h-l);
       box-shadow:var(--shadow);transition:background var(--greitas),box-shadow var(--greitas)}
  #new:hover{background:var(--text);box-shadow:var(--shadow-h)}
  #new:focus-visible{outline:none;box-shadow:var(--ziedas)}
  /* Be `opacity`: .9 ant akcento davė 4,43:1 — po ribos. Silpninti cia nera ko,
     pliusas yra mygtuko dalis, ne jo sesėlis. */
  #new span.p{color:inherit;font-size:var(--ik-btn);line-height:1}
  /* Paieskos laukas su klavisu zyme. Zyme — ATSKIRAS elementas, o ne placeholder'io
     galas: 264 px lauke uzuomina placeholder'yje tiesiog nusikerpa vidury zodzio
     (zr. modules/paieska/paieska.js). */
  .ieskaBox{position:relative;margin:0 var(--t3) var(--t2)}
  #ieska{height:var(--mygt-h);padding:0 var(--t3);font-size:var(--tx-m);border:1px solid var(--line-strong);background:var(--soft);
         border-radius:var(--r-md);color:var(--text);width:100%;display:block}
  .ieskaBox.turiKbd #ieska{padding-right:52px}
  #ieska:focus{outline:none;border-color:var(--accent);background:var(--bg);box-shadow:var(--ziedas)}
  #ieska::placeholder{color:var(--muted)}
  #ieskaKbd{display:none;position:absolute;right:var(--t2);top:50%;transform:translateY(-50%);
            font-family:var(--label);font-size:var(--tx-xs);letter-spacing:.03em;color:var(--faint);
            border:1px solid var(--line-2);border-radius:var(--r-sm);padding:2px 5px;pointer-events:none;
            background:var(--bg)}
  .ieskaBox.turiKbd #ieskaKbd{display:block}
  /* Rasant zyme trukdo — ji sako, KAIP cia patekti, o ne ka daryti toliau. */
  .ieskaBox.turiKbd #ieska:focus~#ieskaKbd{display:none}
  /* Chip'as virs pokalbiu saraso. Nuo 2026-09-01 jis rodomas VISADA — tuscia vieta
     tyloje buvo neatskiriama nuo pakibusios sistemos (zr. sasaja.js renderVyksta).
     Todel ramybes bukle tycia TYLI vizualiai: pilkas tekstas be fono ir be ratuko.
     Ji turi buti perskaitoma tada, kai i ja pazvelgiama, ir nepastebima visa likusi
     laika — kitaip po dienos ji virstu triuksmu, o triuksmo nustojama skaityti. */
  #vyksta{margin:0 12px 8px;padding:6px 9px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);
          font-size:var(--tx-s);font-weight:600;display:none;align-items:center;gap:7px;cursor:pointer}
  #vyksta.on{display:flex}
  #vyksta .spin{display:none}
  #vyksta.dirba .spin{display:block}
  /* Ramybe: ne aliarmas ir ne pergale — tiesiog paaiskinta tyla. */
  #vyksta.ramu{background:transparent;color:var(--faint);font-weight:500;cursor:default;
               border:1px solid var(--line-2)}
  /* Nezinia NERAUDONA: serveris, neatsakes viena karta, dar nera gedimas. Raudona
     paliekama tam, kas tikrai luzo (zr. brain/vaizdo-kalba.md). */
  #vyksta.nezinia{background:transparent;color:var(--warn-text);font-weight:500;cursor:default;
                  border:1px solid var(--warn-text)}
  #list{flex:1;overflow-y:auto;padding:0 var(--t2) var(--t3);min-height:60px}
  .grupe{font-family:var(--label);font-size:var(--tx-xs);font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);
         padding:var(--t4) var(--t3) var(--t1)}
  /* Pokalbio eilute: 40 px ir 13,5 px tekstas.
     Buvo 33 px / 13 px — ankstoka net stalinėje, o salia erdviu apzvalgos korteliu
     tai atrode kaip du skirtingi produktai viename lange. Ritmas visoje sasajoje
     dabar vienas: eilutes 36-40 px, kortos --t4 vidinio tarpo. */
  .item{position:relative;padding:var(--t2) var(--t2) var(--t2) var(--t3);border-radius:var(--r-m);
        cursor:pointer;font-size:var(--tx-l);color:var(--muted);display:flex;align-items:center;
        gap:var(--t2);min-height:40px}
  .item:hover{background:var(--hover);color:var(--text)}
  /* „Rodyti daugiau" — eilutes plocio, bet ne mygtuko isvaizdos: jis priklauso
     sarasui, o ne veiksmams virs jo. */
  #listDaugiau{display:block;width:100%;margin-top:var(--t2);padding:var(--t2) var(--t3);
               font:inherit;font-size:var(--tx-m);color:var(--muted);background:none;
               border:1px solid var(--line-strong);border-radius:var(--r-m);cursor:pointer;
               min-height:40px;text-align:center}
  #listDaugiau:hover{background:var(--hover);color:var(--text)}
  .item.on{background:var(--hover);color:var(--text);font-weight:600}
  .item .t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .item .ren{flex:1;min-width:0;width:100%;font:inherit;color:var(--text);background:var(--bg);
             border:1px solid var(--accent);border-radius:var(--r-sm);padding:2px 6px}
  .item .ren:focus{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}
  /* ⋯ mygtukas: per hover slepiam, bet lieciamuose ekranuose hover nera — ten rodom visada */
  .item .dots{margin-left:auto;flex:0 0 auto;border:none;background:none;color:var(--faint);cursor:pointer;
              font-size:var(--tx-2xl);line-height:1;padding:2px 5px;border-radius:var(--r-sm);opacity:0}
  /* opacity cia TIK slepia (0/1) — blankumas ateina is --faint, kad kontrastas butu matuojamas */
  .item:hover .dots,.item.menuon .dots{opacity:1}
  .item .dots:hover{color:var(--text);background:var(--soft-3)}
  /* Ekranuose be peles `⋯` matomas visada (kitaip jo nepasieksi), bet TYLIAI.
     Tyliau daroma DYDZIU, ne `opacity`: opacity blukina teksta KARTU su fonu, tad
     kontrastas krenta nematomai — pirmoji versija su `.55` davė 2,90:1 vietoj 4,5.
     Spalva lieka `--faint`, kuris pagal zodyna riba praeina. */
  @media(hover:none){.item .dots{opacity:1;font-size:var(--tx-l);color:var(--faint)}}
  @media(hover:none){.item .dots:active{color:var(--text)}}
  #tuscias{color:var(--muted);font-size:var(--tx-m);padding:14px 10px;text-align:center}
  aside footer{padding:10px 14px;border-top:1px solid var(--line);font-size:var(--tx-s);color:var(--muted);
               display:flex;justify-content:space-between;align-items:center}
  aside footer a{color:var(--muted);text-decoration:none;cursor:pointer}
  aside footer a:hover{color:var(--text)}

  /* --- ratukas: kazkas dar sukasi --- */
  @keyframes suk{to{transform:rotate(360deg)}}
  .spin{flex:0 0 auto;width:12px;height:12px;border-radius: var(--r-round);border:2px solid var(--soft-3);
        border-top-color:var(--accent);animation:suk .8s linear infinite}

  /* --- pokalbio meniu (position:fixed, kad #list neapkirptu) --- */
  #menu{position:fixed;z-index:60;min-width:190px;background:var(--bg);border:1px solid var(--line-strong);
        border-radius:var(--r-l);padding:var(--t2);box-shadow:var(--shadow-3);display:none;font-size:var(--tx-l)}
  #menu.on{display:block}
  #menu button{display:flex;align-items:center;gap:var(--t3);width:100%;text-align:left;border:none;background:none;
               color:var(--text);padding:var(--t2) var(--t3);border-radius:var(--r-m);cursor:pointer;
               min-height:40px}
  #menu button:hover{background:var(--hover)}
  #menu button.pav{color:var(--err-text)}
  #menu .ico{width:15px;text-align:center}