/* ============================================================
   MathMaster — VBE egzamino skaičiuotuvas (NŠA kopija)
   ------------------------------------------------------------
   Spalvos čia SĄMONINGAI fiksuotos, o ne imamos iš temos: tai
   egzamino įrankio kopija, todėl jis turi atrodyti vienodai ir
   šviesiame, ir tamsiame svetainės režime. Temą seka tik
   paleidimo mygtukas.
   ============================================================ */

/* ------------------------------------------------------------------
   `hidden` PRIVALO nugalėti `display`.
   Naršyklės taisyklė `[hidden]{display:none}` yra UA lentelėje, todėl
   BET KOKIA autoriaus `display` reikšmė ją nugali. Dėl to `.vc-win{display:flex}`
   palikdavo langą matomą net po `win.hidden = true` – ✕ mygtukas atrodė
   neveikiantis, o `.vc-menu{display:flex}` laikė meniu amžinai atvertą.
   ------------------------------------------------------------------ */
.vc-win[hidden],
.vc-win [hidden],
.vc-launch[hidden],
.vc-fab[hidden]{ display:none !important; }

.vc-win{
  --vc-head:#1E1E1E;
  --vc-screen:#2D2D2D;
  --vc-line:#DADADA;
  --vc-key:#F1F1F1;
  --vc-key-h:#E4E4E4;
  --vc-digit:#E8F1FB;
  --vc-digit-h:#D8E7F8;
  --vc-op:#0066CC;
  --vc-op-h:#0057AD;

  position:fixed;
  right:24px; bottom:24px;
  z-index:9000;
  width:min(456px, calc(100vw - 24px));
  display:flex; flex-direction:column;
  background:#FFFFFF;
  border:1px solid #C9C9C9;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 18px 48px rgba(0,0,0,.34), 0 4px 12px rgba(0,0,0,.18);
  font-family:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  user-select:none;
  touch-action:none;
}
.vc-win.is-drag{ box-shadow:0 26px 60px rgba(0,0,0,.42); }

/* ----------------------------- antraštė ----------------------------- */
.vc-head{
  position:relative;                 /* išskleidžiamojo meniu atskaitos taškas */
  display:grid; grid-template-columns:44px 1fr 44px; align-items:center;
  height:46px; background:var(--vc-head); color:#FFFFFF;
  cursor:grab;
}
/* „Grabbing" turi likti VISĄ tempimo laiką, o ne tik kol žymeklis ant antraštės:
   `:active` dingsta, vos žymeklis išbėga už jos, o `.is-drag` deda JS. */
.vc-head:active{ cursor:grabbing; }
.vc-win.is-drag, .vc-win.is-drag .vc-head{ cursor:grabbing; }
.vc-win.is-drag{ user-select:none; }
.vc-hbtn{
  height:46px; border:0; background:transparent; color:#FFFFFF;
  font-size:15px; line-height:1; cursor:pointer;
}
.vc-hbtn:hover{ background:rgba(255,255,255,.12); }
/* Antraštės vidurys – skaičiuotuvo tipo pasirinkimas. */
/* `justify-content:center` – mygtukas platinamas tik iki savo turinio, todėl
   abipus jo lieka PLIKA antraštės juosta, už kurios langą galima tempti.
   Kai čia buvo `flex:1`, mygtukas užimdavo visą vidurinį stulpelį ir tempti
   nebebūdavo už ko: visi antraštės taškai priklausė mygtukams. */
.vc-dd{ display:flex; min-width:0; justify-content:center; }
.vc-title{
  max-width:100%; min-width:0;
  border:0; background:transparent; color:#FFFFFF; cursor:pointer;
  font-family:inherit; font-size:12.5px; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase;
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:46px; padding:0 8px;
}
.vc-title:hover{ background:rgba(255,255,255,.10); }
.vc-title-t{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vc-caret{ font-size:10px; opacity:.65; transition:transform .16s ease, opacity .16s ease; }
.vc-title:hover .vc-caret{ opacity:1; }
.vc-title[aria-expanded="true"]{ background:rgba(255,255,255,.14); }
.vc-title[aria-expanded="true"] .vc-caret{ transform:rotate(180deg); opacity:1; }

/* --------------------- skaičiuotuvo pasirinkimas -------------------- */
/* Išskleidžiama VIRŠ turinio (position:absolute), todėl lango aukštis
   nepasikeičia – anksčiau meniu stumdavo turinį 109 px žemyn. */
.vc-menu{
  position:absolute; top:calc(100% + 6px); left:8px; right:8px;
  z-index:30;
  display:flex; flex-direction:column; gap:2px; padding:5px;
  background:#252525; border:1px solid #3E3E3E; border-radius:8px;
  box-shadow:0 16px 36px rgba(0,0,0,.48);
  animation:vc-drop .14s ease-out;
}
@keyframes vc-drop{ from{ opacity:0; transform:translateY(-4px); } }
.vc-mode{
  display:flex; align-items:center; gap:9px;
  border:0; border-radius:6px; background:transparent; color:#E3E3E3;
  font-family:inherit; font-size:12.5px; text-align:left;
  padding:9px 12px; cursor:pointer; white-space:nowrap;
}
.vc-mode:hover:not(:disabled){ background:#363636; color:#FFFFFF; }
.vc-mode:focus-visible{ outline:2px solid #4FA3F7; outline-offset:-2px; }
.vc-mode:disabled{ color:#767676; cursor:not-allowed; }
.vc-tick{ width:13px; flex:none; opacity:0; font-size:12px; }
.vc-mode.is-on .vc-tick{ opacity:1; color:#4FA3F7; }
.vc-mode.is-on{ color:#FFFFFF; font-weight:700; background:#2F2F2F; }
.vc-mode-t{ overflow:hidden; text-overflow:ellipsis; }

/* ------------------------------ ekranas ----------------------------- */
/* Jokio vidinio slankmačio: langas visada tokio aukščio, kokio reikia visiems
   mygtukams. Mažesniems ekranams aukštis suspaudžiamas žemiau esančiomis
   @media taisyklėmis, o ne slinkimu. */
.vc-body{ display:flex; flex-direction:column; overflow:visible; }
.vc-win.is-min .vc-body{ display:none; }

.vc-screen{
  background:var(--vc-screen); color:#FFFFFF;
  padding:10px 16px 12px;
  border-bottom:1px solid #4A4A4A;
}
.vc-expr{
  min-height:22px; text-align:right;
  font-size:14px; color:#B4B4B4; font-variant-numeric:tabular-nums;
  white-space:nowrap; overflow-x:auto; overflow-y:hidden;
  border-bottom:1px solid #4A4A4A; padding-bottom:6px;
  scrollbar-width:none;
}
.vc-expr::-webkit-scrollbar{ display:none; }
.vc-res{
  min-height:30px; text-align:right; padding-top:6px;
  font-size:24px; font-weight:800; letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
  white-space:nowrap; overflow-x:auto; scrollbar-width:none;
}
.vc-res::-webkit-scrollbar{ display:none; }

/* --------------------------- režimų juosta -------------------------- */
.vc-bar{
  display:grid; grid-template-columns:1fr 74px 74px;
  background:var(--vc-line); gap:1px; border-bottom:1px solid var(--vc-line);
}
.vc-barleft{ background:#FFFFFF; display:flex; align-items:center; padding:10px 14px; }
.vc-arrow{
  background:#FFFFFF; border:0; cursor:pointer;
  font-size:16px; font-weight:700; color:#1E1E1E; padding:12px 0;
}
.vc-arrow:hover{ background:var(--vc-key-h); }

.vc-toggle{
  display:inline-flex; align-items:center; gap:2px;
  background:#1E1E1E; border-radius:999px; padding:3px;
}
.vc-toggle button{
  border:0; background:transparent; color:#FFFFFF; cursor:pointer;
  font-size:11px; font-weight:800; letter-spacing:.04em;
  padding:4px 10px; border-radius:999px; line-height:1;
}
.vc-toggle button.is-on{ background:#FFFFFF; color:#1E1E1E; }

/* ---------------------- mokslinių funkcijų blokas ------------------- */
.vc-sci{ background:var(--vc-line); display:flex; flex-direction:column; gap:1px; }
.vc-scirow{ display:grid; grid-template-columns:repeat(6, 1fr); gap:1px; }

/* ------------------------- skaičių klaviatūra ----------------------- */
.vc-pad{ background:var(--vc-line); display:flex; flex-direction:column; gap:1px; }
.vc-padrow{ display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; }

/* ------------------------------ mygtukai ---------------------------- */
.vc-key{
  border:0; cursor:pointer; background:var(--vc-key); color:#1E1E1E;
  font-family:inherit; font-size:15px; line-height:1;
  padding:16px 4px; transition:background .12s ease;
}
.vc-key:hover{ background:var(--vc-key-h); }
.vc-key:active{ background:#D6D6D6; }
.vc-key sup, .vc-key sub{ font-size:.66em; }

.vc-key.sci{ font-size:14px; padding:15px 4px; }
.vc-key.fn{ font-weight:700; font-size:13.5px; letter-spacing:.04em; }
.vc-key.digit{ background:var(--vc-digit); font-size:17px; font-weight:700; }
.vc-key.digit:hover{ background:var(--vc-digit-h); }
.vc-key.digit:active{ background:#C7DDF4; }
.vc-key.op{ background:var(--vc-op); color:#FFFFFF; font-size:18px; font-weight:700; }
.vc-key.op:hover{ background:var(--vc-op-h); }
.vc-key.op:active{ background:#004E9A; }
.vc-key.wide{ grid-column:span 2; }

.vc-key:focus-visible{ outline:2px solid #0066CC; outline-offset:-3px; }

/* ------------------------- paleidimo mygtukas ----------------------- */
.vc-launch{
  border:1px solid var(--border, #E5E9F2);
  background:var(--card, #FFF); color:var(--text-2, #475569);
  cursor:pointer; font:inherit;
}
.vc-launch.is-on{
  border-color:var(--primary, #4F46E5);
  color:var(--primary, #4F46E5);
  background:var(--primary-50, #EEF2FF);
}
.vc-launch-ic{ font-size:15px; }

.vc-fab{
  position:fixed; right:20px; bottom:20px; z-index:8900;
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 16px; border:0; border-radius:999px; cursor:pointer;
  background:#0066CC; color:#FFFFFF; font:inherit; font-weight:700; font-size:14px;
  box-shadow:0 10px 24px rgba(0,102,204,.34);
}
.vc-fab:hover{ background:#0057AD; }
.vc-fab.is-on{ background:#1E1E1E; box-shadow:0 10px 24px rgba(0,0,0,.3); }

/* Sukrauta virš VBE mygtuko, kad abu tilptų, kai puslapyje nėra `.topbar`. */
.vc-fab-casio{ bottom:78px; background:#1E1E1E; box-shadow:0 10px 24px rgba(0,0,0,.3); }
.vc-fab-casio:hover{ background:#333333; }

/* --------------------- žemi langai: suspaudimas -------------------- */
/* Užuot leidus slankmatį, mygtukai tampa žemesni. Skaičiai išmatuoti
   naršyklėje: pilnas VBE langas – 622 px, todėl jam reikia bent 646 px
   aukščio lango. Žemiau to įsijungia pakopos. */
@media (max-height:700px){
  .vc-key{ padding:12px 4px; }
  .vc-key.sci{ padding:11px 4px; }
  .vc-screen{ padding:8px 16px 10px; }
}
@media (max-height:600px){
  .vc-head, .vc-hbtn, .vc-title{ height:40px; }
  .vc-key{ padding:9px 4px; font-size:14px; }
  .vc-key.sci{ padding:8px 4px; font-size:13px; }
  .vc-key.digit{ font-size:15px; }
  .vc-barleft{ padding:6px 14px; }
  .vc-arrow{ padding:8px 0; }
  .vc-res{ font-size:20px; min-height:26px; }
}
/* Kraštutinis atvejis (pvz. telefonas gulsčiai): kad mygtukai neliktų
   nepasiekiami, slinkimas leidžiamas, bet PATS SLANKMATIS nerodomas –
   ta pati technika, kaip .vc-expr ir .vc-res eilutėse. */
@media (max-height:520px){
  .vc-win{ max-height:calc(100vh - 16px); }
  .vc-body{ overflow:auto; scrollbar-width:none; }
  .vc-body::-webkit-scrollbar{ display:none; }
}

/* ------------------------------ telefonas --------------------------- */
@media (max-width:520px){
  .vc-win{ right:8px; left:8px; bottom:8px; width:auto; }
  .vc-key{ padding:13px 2px; font-size:14px; }
  .vc-key.sci{ font-size:12.5px; padding:12px 2px; }
  .vc-key.digit{ font-size:16px; }
  .vc-bar{ grid-template-columns:1fr 60px 60px; }
  .vc-title{ font-size:11.5px; letter-spacing:.05em; }
  .vc-res{ font-size:21px; }
  .vc-fab-t{ display:none; }
}

/* ===================== ClassWiz EMULIATORIAUS LANGAS ==================== */
/* Emuliatorius yra atskira programa, įdedama per `iframe`, o pats langas –
   PLAUKIOJANTIS ir TEMPIAMAS, kaip ir VBE skaičiuotuvas (ta pati `.vc-win`
   idėja, tik atskira klasė, nes matmenys ir vidus visai kitokie). Skirtingai
   nei ankstesnė versija, jis NEDENGIA viso ekrano fonu – mokinys mato ir gali
   spausti uždavinio tekstą po juo, tik patempęs langą į šalį. */
.vc-casio-win {
  --h: min(88vh, 900px);
  position: fixed;
  right: 24px; bottom: 24px;
  z-index: 9100;
  display: flex;
  flex-direction: column;
  /* Kai grafikas rodomas, langas turi būti platesnis, kad kalkuliatorius
     (445 × 887 nuotrauka, santykis ≈1,873) ir grafikų studija tilptų greta. */
  width: min(94vw, 860px);
  height: var(--h);
  border-radius: 10px;
  overflow: hidden;
  background: #b8b8b8;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .34), 0 4px 12px rgba(0, 0, 0, .18);
  user-select: none;
  touch-action: none;
}
.vc-casio-win[hidden] { display: none !important; }
.vc-casio-win.is-drag { box-shadow: 0 26px 60px rgba(0, 0, 0, .42); }

/* Kai grafikas paslėptas, langas susiaurėja iki vien kalkuliatoriaus
   nuotraukos proporcijos (445 × 887 ≈ 1 : 1,993; dalyba iš 1,873 = 1,993×0,94,
   nes pati nuotrauka rodoma `min(445px, 94vw)` pločiu) – nelieka tuščio ploto,
   kur anksčiau buvo grafikas. */
.vc-casio-win.is-nograph { width: min(60vw, calc((var(--h) - 40px) / 1.873)); }

.vc-casio-head {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 40px 1fr 40px 40px;
  align-items: center;
  height: 40px;
  background: #1E1E1E;
  color: #fff;
  cursor: grab;
}
.vc-casio-head:active { cursor: grabbing; }
.vc-casio-win.is-drag, .vc-casio-win.is-drag .vc-casio-head { cursor: grabbing; }
.vc-casio-win.is-drag { user-select: none; }

.vc-casio-t {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* `.vc-hbtn` stilius (aukštis/šriftas/hover) paveldimas iš VBE lango
   antraštės mygtukų – vizualiai abu langai turi atrodyti kaip ta pati
   sistema, tik su skirtingu turiniu. */
.vc-casio-head .vc-hbtn { height: 40px; }
.vc-casio-head [aria-pressed="false"] { opacity: .45; }

.vc-casio-body { flex: 1 1 auto; display: flex; min-height: 0; }
.vc-casio-win.is-min .vc-casio-body { display: none; }

/* Suskleista būsena – NE plonas per visą lango plotį pluoštas, o kompaktiška
   „piliulė" (kaip greitojo paleidimo mygtukas), prisegta prie kampo
   nepriklausomai nuo to, kur langas prieš tai buvo nutemptas (žr. JS – ten
   išvalomos inline `left/top` reikšmės). Paspaudus bet kur ant jos (išskyrus
   ✕) langas iškart grąžinamas į pilną dydį. */
.vc-casio-win.is-min {
  width: auto;
  height: auto;
  right: 24px; bottom: 24px; left: auto; top: auto;
  border-radius: 999px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .3);
  cursor: pointer;
}
.vc-casio-win.is-min .vc-casio-head {
  grid-template-columns: auto auto;
  height: 44px;
  padding: 0 8px 0 18px;
  gap: 10px;
  border-radius: 999px;
}
.vc-casio-win.is-min .vc-casio-t {
  font-size: 13px;
  text-align: left;
}
.vc-casio-win.is-min [data-casio-act="min"],
.vc-casio-win.is-min [data-casio-act="graph"] { display: none; }
.vc-casio-win.is-min [data-casio-act="close"] { border-radius: 0 999px 999px 0; }

@media (max-width: 520px) {
  .vc-casio-win.is-min { left: auto; top: auto; right: 16px; bottom: 16px; }
}

.vc-casio-frame {
  flex: 1 1 auto;
  width: 100%;
  border: 0;
  display: block;
  background: #b8b8b8;
}

@media (max-width: 520px) {
  .vc-casio-win {
    left: 8px; right: 8px; bottom: 8px; top: 8px;
    width: auto; height: auto;
  }
  .vc-casio-win.is-nograph { width: auto; }
}