/* ============================================================
   PROGRAMOS RĖMAS KAIP SVETAINĖ (Domantas #265, 2026-10-03: „programos kraštai per tamsūs ir ne svetainės stilius“).
   Gandras, tik CSS, kraunama PASKUTINĖ (po app-window.css).
   1) Žetonai: šiltas rusvas grafitas (#303/#307 „šonai per tamsūs“ — iš 3 variantų pasirinktas „šiltas“) + oranžinės šviesos.
      :is(html[data-skin] body.theme-dark, body.theme-dark) — veikia ir be odos (data-skin kartais neuždėtas), specifiškumas visada
      kaip „html[data-skin] body.theme-dark“, tad laimi prieš skin-clay (kraunama vėliau).
   2) Juostos mygtukai — kompaktiški (30 px) su užrašais (#300 „per dideli, nesąmoningi, kai kur tik ikonos“ — 34 px piliulės ir
      „tik ikonos“ vidurinė grupė IŠTRINTOS; netelpa — fit-bars.js sumažina kaip anksčiau).
   3) Rėmas (viršutinė, dešinė, apatinė juostos, biblioteka): vientisa --rem-fonas + oranžinės šviesos background-image sluoksnyje.
      background-color VISADA vientisas — pwa.js iš #toolbar spalvos dažo įdiegtos programos lango mygtukų juostą (Erelio #297),
      todėl švytėjimai neina į viršutinį kairį kampą (ten lango mygtukai).
   4) Pagrindinis meniu (#296 „šviesiau + storesni kontūrai“): #main-menu#main-menu — ta pati specifika kaip menu-site.css,
      laimi, nes kraunama vėliau. ::before NELIEČIAM — įdiegtoje programoje ten Erelio lango juosta (app-window.css).
   ============================================================ */
:is(html[data-skin] body.theme-dark, body.theme-dark) {
    --primary:        #E85D2A;
    --primary-dark:   #C84A1C;
    --primary-light:  #FF7A45;
    --primary-soft:   rgba(232, 93, 42, 0.14);
    --primary-glow:   rgba(232, 93, 42, 0.32);
    --secondary:      #5CC8FF;
    --secondary-dark: #3BA5E0;
    --tertiary:       #A78BFA;

    /* #307 Domantas pasirinko „šiltą“ rėmą (2 iš 3): rusvas grafitas, derantis prie meniu fono ir kreminės scenos */
    --bg-dark:        #1E1A19;
    --bg-panel:       #28221F;
    --bg-card:        #312A27;
    --bg-hover:       #3A322E;
    --bg-input:       #1F1B19;
    --bg-glass:       rgba(40, 34, 31, 0.92);
    --bg:             #28221F;
    --input-bg:       #1F1B19;

    --text:           #ECF0F4;
    --text-dim:       #9AA8B5;
    --text-soft:      #7A8894;
    --text-bright:    #FFFFFF;

    --border:         rgba(255, 255, 255, 0.10);
    --border-light:   rgba(255, 255, 255, 0.14);
    --border-strong:  rgba(255, 255, 255, 0.20);

    --accent-green:   #3FD08A;
    --accent-red:     #EF6B6B;
    --accent-yellow:  #F5C451;
    --accent-orange:  #FF8A55;
    --accent-cyan:    #5CC8FF;

    --shadow-xs:      0 1px 2px rgba(0, 0, 0, 0.45);
    --shadow-sm:      0 3px 10px rgba(0, 0, 0, 0.45);
    --shadow-md:      0 10px 28px rgba(0, 0, 0, 0.5), 0 2px 6px rgba(0, 0, 0, 0.35);
    --shadow-lg:      0 20px 50px rgba(0, 0, 0, 0.6), 0 6px 14px rgba(0, 0, 0, 0.4);
    --shadow-xl:      0 36px 90px rgba(0, 0, 0, 0.65), 0 10px 24px rgba(0, 0, 0, 0.45);
    --shadow-inner:   inset 0 1px 3px rgba(0, 0, 0, 0.5);
    --fx-sheen:       rgba(255, 255, 255, 0.06);
    --rem-fonas:      #28221F;   /* rėmo (juostų) vientisa spalva — ją pwa.js perduoda lango mygtukų juostai */
}

/* ---------- Viršutinė juosta: vientisas fonas + šiltos šviesos iš apačios (ne viršutiniame kairiame kampe) ---------- */
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar {
    --tb-sviesos:
        radial-gradient(36% 190% at 26% 170%, rgba(232, 93, 42, 0.40), transparent 70%),
        radial-gradient(28% 170% at 76% 165%, rgba(255, 122, 69, 0.26), transparent 70%);
    background-color: var(--rem-fonas);
    background-image: var(--tb-sviesos);
    border-bottom: 1px solid rgba(232, 93, 42, 0.18);
    box-shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.6);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .toolbar-group {
    background: rgba(255, 255, 255, 0.04);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.10);
    gap: 3px;
    padding: 3px;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .separator { background: rgba(255, 255, 255, 0.10); }
/* #315 (Domantas: „įeinant į projektą mygtukai trumpam keisti, suspausti“): html.ui-fx (editor-ui.css — ikona + užrašas vienoje
   eilutėje) uždedamas tik ~0,6 s po projekto atidarymo, o iki tol užrašas lūždavo po ikona. Išdėstymas čia — nepriklausomas nuo ui-fx. */
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    min-height: 30px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: #C3CDD6;
    border-radius: 999px;
    transition: background-color .18s ease, color .18s ease, box-shadow .2s ease;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn-icon { gap: 0; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn > .ic { flex: 0 0 auto; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn:hover { background: rgba(255, 255, 255, 0.08); color: #FFFFFF; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn.active {
    background: rgba(232, 93, 42, 0.18);
    color: #FFD3C2;
    box-shadow: inset 0 0 0 1px rgba(232, 93, 42, 0.55);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn:focus-visible { outline: 2px solid #7CC0FF; outline-offset: 2px; }

/* #303 įdiegtoje programoje (window-controls-overlay) lango mygtukų juostos (kairėje 🔴🟡🟢, dešinėje ⌄ / plėtiniai / ⋮) fonas =
   theme-color = vientisa --rem-fonas. Kad neliktų „dėžučių“, viršutinė juostos dalis (lango juostos aukštis) — ta pati vientisa
   spalva per visą plotį, šviesos tik žemiau. */
@media (display-mode: window-controls-overlay) {
    :is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar {
        background-image: linear-gradient(var(--rem-fonas), var(--rem-fonas)), var(--tb-sviesos);
        background-size: 100% env(titlebar-area-height, 0px), auto, auto;
        background-repeat: no-repeat;
    }
}

/* ---------- Dešinė įrankių juosta: vientisas fonas + šviesa apačioje ir viršuje ---------- */
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip {
    background-color: var(--rem-fonas);
    background-image:
        radial-gradient(190% 38% at 100% 104%, rgba(232, 93, 42, 0.42), transparent 70%),
        radial-gradient(190% 26% at 0% 22%, rgba(255, 122, 69, 0.20), transparent 70%),
        radial-gradient(190% 22% at 100% 58%, rgba(232, 93, 42, 0.14), transparent 70%);
    border-left: 1px solid rgba(232, 93, 42, 0.16);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip .tstrip-btn { color: #C3CDD6; transition: background-color .18s ease, color .18s ease; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip .tstrip-btn:hover { background: rgba(255, 255, 255, 0.08); color: #FFFFFF; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip .tstrip-btn.active { background: rgba(232, 93, 42, 0.18); color: #FFD3C2; box-shadow: inset 0 0 0 1px rgba(232, 93, 42, 0.55); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip .tstrip-sep { background: rgba(255, 255, 255, 0.10); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #tools-strip .eui-tip { background: var(--bg-card); color: #ECF0F4; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.12); }

/* ---------- Apatinė būsenos juosta: šviesa abiejuose galuose ---------- */
:is(html[data-skin] body.theme-dark, body.theme-dark) #statusbar {
    background-color: var(--rem-fonas);
    background-image:
        radial-gradient(34% 260% at 0% 100%, rgba(232, 93, 42, 0.36), transparent 70%),
        radial-gradient(34% 260% at 100% 100%, rgba(255, 122, 69, 0.28), transparent 70%);
    border-top: 1px solid rgba(232, 93, 42, 0.16);
    box-shadow: none;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #statusbar .status-sep { background: rgba(255, 255, 255, 0.12); }

/* ---------- Šoninės panelės, savybės ---------- */
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar,
:is(html[data-skin] body.theme-dark, body.theme-dark) #properties {
    background-color: var(--rem-fonas);
    border-color: rgba(255, 255, 255, 0.09);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar { background-image: radial-gradient(170% 34% at 0% 104%, rgba(232, 93, 42, 0.30), transparent 70%); box-shadow: 10px 0 30px -14px rgba(0, 0, 0, 0.6); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #properties { background-image: radial-gradient(170% 34% at 100% 104%, rgba(232, 93, 42, 0.26), transparent 70%); box-shadow: -10px 0 30px -14px rgba(0, 0, 0, 0.6); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar-reveal {
    flex-direction: column;
    gap: 9px;
    width: 26px;
    height: 128px;
    padding: 10px 0;
    background-color: var(--rem-fonas);
    background-image: radial-gradient(160% 60% at 0% 100%, rgba(232, 93, 42, 0.30), transparent 70%);
    box-shadow: inset 0 0 0 1px rgba(232, 93, 42, 0.22), 6px 0 18px -8px rgba(0, 0, 0, 0.5);
}
/* #318 „Library“ šonu — skaitoma iš apačios į viršų, ikona gale (viršuje) */
/* #322 (Domantas: „užvedus liežuvėlis nusileidžia žemiau, glitchina; biblioteka turi atsidaryti normaliai, lėtai, smooth“):
   editor-ui.css html.ui-fx #sidebar-reveal.has-ic:hover { transform: translateY(-1px) } nuimdavo main.css centravimą translateY(-50%) —
   liežuvėlis nušokdavo pusę savo aukščio žemyn. Centravimas išlaikomas, „pakilimas“ — tik 1 px. */
/* #335 (Domantas: „Library liežuvėlis turi keliauti kartu su biblioteka ir atsidarius būti dešinėje ant šono“): liežuvėlis — bibliotekos
   vaikas (js/ui-sidebar.js), kabo už jos dešiniojo krašto: paslėptos bibliotekos kraštas = ekrano kraštas, tad matosi kairėje; atsidarius —
   važiuoja tuo pačiu sluoksniu (du atskiri perėjimai išsiskirdavo — didelis sluoksnis startuodavo kadru vėliau). Paspaudus atidarytą — uždaro. */
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar { overflow: visible; }
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar > #sidebar-reveal {
    display: flex; position: absolute; left: 100%; top: 50%; z-index: 1;
    transform: translateY(calc(-50% + var(--sr-lift, 0px)));
    transition: background-color .18s ease, box-shadow .18s ease;
}
/* editor-ui.css html.ui-fx #sidebar-reveal.has-ic:hover { transform: translateY(-1px) } (1,3,1) — šis stipresnis */
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar > #sidebar-reveal:hover { --sr-lift: -1px; transform: translateY(calc(-50% + var(--sr-lift, 0px))); }
/* Biblioteka išvažiuoja ramiai (atsidarant ilgiau, švelni pabaiga), užsidarant — kiek greičiau */
/* #328 (Domantas: „atsidaro po sekundės ir staigiai“): tolygi ease-in-out kreivė (ne „viskas pradžioje“), trumpiau; will-change — sluoksnis
   paruoštas iš anksto, kad pirmas judesio kadras nelauktų bibliotekos piešimo */
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar { transition: transform .45s cubic-bezier(.45, 0, .2, 1); will-change: transform; contain: layout style; backface-visibility: hidden; }
:is(html[data-skin] body.theme-dark.sidebar-hidden, body.theme-dark.sidebar-hidden) #sidebar { transition: transform .3s cubic-bezier(.4, 0, .2, 1); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar-reveal .sr-zodis {
    writing-mode: vertical-rl; transform: rotate(180deg);
    font: 600 12px/1 var(--font, system-ui), sans-serif; letter-spacing: .06em; white-space: nowrap;
    color: #D5DCE3; transition: color .18s ease;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #sidebar-reveal:hover .sr-zodis { color: #FFD3C2; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .modal-overlay { background: rgba(6, 8, 11, 0.62); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #loading-screen {
    background: radial-gradient(60% 50% at 50% 40%, rgba(232, 93, 42, 0.16), transparent 70%), #0A0D12;
}

/* ---------- Pagrindinis meniu (#296): truputį šviesiau, storesni kontūrai ant mygtukų, žymų, paieškos, kortelių ---------- */
#main-menu#main-menu {
    --s-lin: rgba(255, 255, 255, .14);
    --s-lin2: rgba(255, 255, 255, .22);
    --s-pav: #141B23;
    --s-tekst2: #A3B0BC;
    background:
        radial-gradient(75% 60% at 18% -8%, rgba(232, 93, 42, .42), transparent 70%),
        radial-gradient(60% 50% at 100% 108%, rgba(255, 122, 69, .26), transparent 70%),
        linear-gradient(180deg, #1A181C 0%, #101116 100%);
}
#main-menu#main-menu :is(.mm-btn, .mm-chip, .mm-user, .mm-auth-btn, .mm-logout-btn, .mm-website, .mm-search input, .mm-sort, .mm-view-toggle, .mm-trash-toggle) {
    border-width: 1.5px;
    border-style: solid;
}
#main-menu#main-menu :is(.mm-btn, .mm-chip, .mm-user, .mm-auth-btn, .mm-logout-btn, .mm-website, .mm-search input, .mm-sort, .mm-view-toggle, .mm-trash-toggle):not(:hover):not(:focus):not(.mm-btn-primary):not(.mm-btn-lessons):not(.mm-btn-install) {
    border-color: var(--s-lin2);
}
#main-menu#main-menu :is(.mm-btn, .mm-chip, .mm-website) { background-color: rgba(255, 255, 255, .06); }
#main-menu#main-menu .mm-btn.mm-btn-primary { background-color: var(--s-oranz); border-color: rgba(255, 200, 175, .55); }
#main-menu#main-menu .mm-btn.mm-btn-primary:hover { background-color: var(--s-oranz2); }
#main-menu#main-menu .mm-btn.mm-btn-lessons:not(:hover) { border-color: rgba(232, 93, 42, .6); }
#main-menu#main-menu .mm-btn.mm-btn-install:not(:hover) { border-color: rgba(63, 208, 138, .5); background-color: rgba(63, 208, 138, .08); }
#main-menu#main-menu .mm-pcard { border-width: 1.5px; }
#main-menu#main-menu .mm-pcard:not(:hover):not(.is-recent) { border-color: var(--s-lin); }
#main-menu#main-menu .mm-pcard.is-recent:not(:hover) { border-color: rgba(232, 93, 42, .6); }
#main-menu#main-menu .mm-resume > * { border-width: 1.5px; border-color: rgba(232, 93, 42, .5); }
#main-menu#main-menu .mm-count { background: rgba(255, 255, 255, .09); }

/* ============================================================
   #329 (Domantas: „visų mygtukų lentelės — gražios ir vieno dizaino, visur turi derėti“) — 1 dalis.
   Vienas langų „rūbas“: fonas po langu, kortelė (šiltas paviršius, 18 px kampai, ta pati linija ir šešėlis), antraštė/poraštė.
   Erelis langų inline spalvas perkelia į klases su :where() baze — čia tik bendras rūbas, be !important.
   ============================================================ */
:is(html[data-skin] body.theme-dark, body.theme-dark) {
    --lng-fonas: rgba(14, 11, 10, 0.58);
    --lng-linija: rgba(255, 255, 255, 0.10);
    --lng-seselis: 0 30px 80px -30px rgba(0, 0, 0, 0.75), 0 12px 28px -12px rgba(0, 0, 0, 0.45);
    --lng-r: 18px;
}
/* Fonas po langu */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.export-overlay, .stm-backdrop, .help-backdrop, .modal-overlay, #plu-fonas, .vh-overlay, .p3-notice, .cdlg-backdrop, .cp-backdrop, .cp-prev-backdrop, #kr-langas) {
    background: var(--lng-fonas);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
/* Kortelė */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.export-card, .stm-card, .help-card, .sch-dialog, #plu-langas, #orders-panel, .settings-panel, #rw, #component-panel, #wallfix-panel, .wf-panel, #p3-chat, #clipping-control, .vh-panel, .p3-notice-card, .cdlg-card, .cp-card, .cp-prev-card, .modal-dialog) {
    background-color: var(--bg-panel);
    border: 1px solid var(--lng-linija);
    border-radius: var(--lng-r);
    box-shadow: var(--lng-seselis);
    color: var(--text);
}
/* Antraštės ir poraštės — vienodai (permatomos, plona linija) */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.help-header, .stm-header, .sch-head, .vh-head) {
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.help-footer, .stm-footer) {
    background: rgba(255, 255, 255, 0.03);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
/* Eksporto parinktys — aprašymai be išplėstų tarpų (main.css button { word-spacing } skirta emoji) */
:is(html[data-skin] body.theme-dark, body.theme-dark) .export-option { word-spacing: normal; }

/* Versijų istorija (js/version-history.js .vh-* klasės, Erelio :where() bazė) — mygtukai kaip visur: oranžinis / stiklinis, apvalūs */
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-btn {
    border-radius: 999px; padding: 7px 14px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.16); color: var(--text); word-spacing: normal;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-btn:hover { background: rgba(255, 255, 255, 0.10); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-btn.vh-btn-pri { background: var(--primary); border-color: transparent; color: #1A0F0A; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-btn.vh-btn-pri:hover { background: var(--primary-light); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-x {
    width: 32px; height: 32px; border-radius: 999px; display: inline-grid; place-items: center; padding: 0;
    background: rgba(255, 255, 255, 0.06); font-size: 15px;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) .vh-select { border-radius: 10px; border-color: rgba(255, 255, 255, 0.14); }
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.vh-tag, .vh-up) { color: #FFB085; }

/* Sienų tvirtinimo skydelis (js/wall-fixture-mode.js .wf-* klasės, Erelio :where() bazė) — kortelė iš bendro sąrašo, mygtukai apvalūs */
:is(html[data-skin] body.theme-dark, body.theme-dark) .wf-panel { padding: 10px 16px; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .wf-panel :is(.wf-chip, button) { border-radius: 999px; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .wf-panel .wf-in { border-radius: 10px; }

/* #329 (2 dalis): smulkmenos, kad langai ir meniu atrodytų vienodai */
/* Languose ir išskleidžiamuose meniu — be išplėstų tarpų tarp žodžių (main.css button { word-spacing } skirta emoji; ikonos dabar SVG) */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.tb-panel, .export-card, .settings-panel, .help-card, .stm-card, #orders-panel, .vh-panel, #rw, #kr-isskl) button { word-spacing: normal; }
/* Eksporto parinktis užvedus nebedidėja (išlįsdavo už kortelės krašto) — tik paryškėja */
:is(html[data-skin] body.theme-dark, body.theme-dark) .export-option:hover { transform: none; border-color: rgba(232, 93, 42, 0.5); background: rgba(232, 93, 42, 0.10); }
/* Išskleidžiamo meniu įjungti punktai — tvarkinga oranžinė „piliulė“ be kairio iškyšulio */
:is(html[data-skin] body.theme-dark, body.theme-dark) .tb-panel .tool-btn.active::before { display: none; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .tb-panel .tool-btn.active {
    background: rgba(232, 93, 42, 0.16); color: #FFD3C2; box-shadow: inset 0 0 0 1px rgba(232, 93, 42, 0.45); border-color: transparent;
}
/* Kreditų išskleidžiamas langelis — kaip kitos kortelės */
:is(html[data-skin] body.theme-dark, body.theme-dark) #kr-isskl { border: 1px solid var(--lng-linija); border-radius: 16px; box-shadow: var(--lng-seselis); }
/* Erelio pranešimai (.p3-notice — atnaujinimas, prieiga, perkėlimas) ir juostelė (.p3-banner — „projektas atidarytas kitame lange“) */
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-notice-btn { border-radius: 999px; border-color: rgba(255, 255, 255, 0.16); background: rgba(255, 255, 255, 0.06); word-spacing: normal; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-notice-btn.is-pri { background: var(--primary); border-color: transparent; color: #1A0F0A; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-notice-btn.is-pri:hover { background: var(--primary-light); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-banner { border-radius: 14px; border: 1px solid var(--lng-linija); box-shadow: var(--lng-seselis); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-banner-x { width: 28px; height: 28px; border-radius: 999px; display: inline-grid; place-items: center; background: rgba(255, 255, 255, 0.10); }

/* Klausimų langai (js/custom-dialog.js — patvirtinimai, pervadinimas, pasirinkimai): mygtukai kaip visur — oranžinė / stiklinė piliulė; pavojingas lieka raudonas */
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn { border-radius: 999px; padding: 8px 18px; background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.16); word-spacing: normal; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn:hover { background: rgba(255, 255, 255, 0.10); border-color: rgba(255, 255, 255, 0.24); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn.cdlg-btn-primary { background: var(--primary); border-color: transparent; color: #1A0F0A; font-weight: 600; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn.cdlg-btn-primary:hover { background: var(--primary-light); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn.cdlg-btn-danger { background: #DC2626; border-color: transparent; color: #fff; font-weight: 600; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-btn.cdlg-btn-danger:hover { background: #B91C1C; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-input { border-radius: 10px; border-color: rgba(255, 255, 255, 0.14); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-input:focus { border-color: var(--primary); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cdlg-choice { border-radius: 12px; border-color: rgba(255, 255, 255, 0.12); }

/* Detalės / fitingo peržiūra (js/component-preview.js, fitting-preview.js): 3D fonas šiltas, mygtukai — piliulės, be išplėstų tarpų */
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-canvas-wrap { background: #1E1A19; border-color: var(--lng-linija); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-header { border-bottom-color: rgba(255, 255, 255, 0.08); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-footer { background: rgba(255, 255, 255, 0.03); border-top-color: rgba(255, 255, 255, 0.08); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-btn { border-radius: 999px; background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.16); word-spacing: normal; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-btn:hover { background: rgba(255, 255, 255, 0.10); border-color: rgba(255, 255, 255, 0.24); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-btn.cp-prev-btn-primary { background: var(--primary); border-color: transparent; color: #1A0F0A; font-weight: 600; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .cp-prev-btn.cp-prev-btn-primary:hover { background: var(--primary-light); }

/* Pranešimai (js/toast.js) — kairiau nuo dešinės įrankių juostelės ir virš „Pamokų“ mygtuko (anksčiau uždengdavo vaizdus Iso/Top/Front ir pamokų mygtuką) */
:is(html[data-skin] body.theme-dark, body.theme-dark) #toast-stack { right: calc(52px + 12px); bottom: calc(var(--statusbar-h, 28px) + 18px); }
:is(html[data-skin] body.theme-dark, body.theme-dark):has(> #ls-fab) #toast-stack { bottom: calc(var(--statusbar-h, 28px) + 18px + 62px + 14px); }
/* Atsidarius savybių langui (body.has-properties) — dešinėje plaukiojantys dalykai (užuominų kortelė, vamzdžio kortelė, pranešimai,
   „Pamokos“) slenka kartu su įrankių juostele, kad neuždengtų lango (anksčiau „Moving“ kortelė dengė detalės pavadinimą, pamokų mygtukas — kainą) */
@media (min-width: 769px), (pointer: fine) {
    :is(#tool-coach.ph-card, #pipe-helper, #ls-fab) { transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1); }
    body.has-properties :is(#tool-coach.ph-card, #pipe-helper, #ls-fab) { transform: translateX(calc(-1 * var(--properties-w))); }
    body.resizing-properties :is(#tool-coach.ph-card, #pipe-helper, #ls-fab) { transition: none; }
    :is(html[data-skin] body.theme-dark, body.theme-dark).has-properties #toast-stack { right: calc(var(--properties-w) + 52px + 12px); }
}
/* „Pamokų“ mygtuko užrašas — šiltas kaip visa programa (js/lessons.js įterpia šaltą rgba(14,19,25)) */
:is(html[data-skin] body.theme-dark, body.theme-dark) #ls-fab .ls-fab-t { background: rgba(40, 34, 31, 0.92); border-color: var(--lng-linija); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #ls-fab .ls-fab-x { background: #312A27; color: var(--text-dim); }
:is(html[data-skin] body.theme-dark, body.theme-dark) #ls-fab .ls-fab-x:hover { background: #3A322E; }
/* „Pamokos“ mygtukas (z 900) buvo VIRŠ juostos išskleidžiamų meniu (juosta z 60) — dabar virš scenos ir jos kortelių (≤ 30), bet po meniu ir langais */
body #ls-fab { z-index: 50; }

/* Paskyros meniu ir profilio langas, atidaryti REDAKTORIUJE (⚙ Nustatymai → vardas): šilti kaip visi programos langai.
   Pagrindiniame meniu jie lieka svetainės stiliaus (#194, css/account-site.css) — ten ir pats meniu svetainės spalvų. */
#main-menu:not([style*="flex"]) ~ :is(.profile-menu.profile-menu, #profile-modal#profile-modal) {
    --bg-panel: inherit; --bg-card: inherit; --bg-input: inherit; --bg-hover: inherit; --border: inherit; --border-light: inherit;
    --text: inherit; --text-dim: inherit; --text-soft: inherit; --text-secondary: inherit;
}
#main-menu:not([style*="flex"]) ~ .profile-menu.profile-menu {
    background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .01)), var(--bg-panel);
    border-color: var(--lng-linija); box-shadow: var(--lng-seselis);
}
#main-menu:not([style*="flex"]) ~ .profile-menu.profile-menu .profile-menu-email { color: var(--text-dim); }
#main-menu:not([style*="flex"]) ~ #profile-modal#profile-modal { background: var(--lng-fonas); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
#main-menu:not([style*="flex"]) ~ #profile-modal#profile-modal .pm-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .01)), var(--bg-panel);
    border-color: var(--lng-linija); box-shadow: var(--lng-seselis);
}
#main-menu:not([style*="flex"]) ~ #profile-modal#profile-modal .pm-hero-name { background: linear-gradient(180deg, #FFFFFF 35%, #D9C6BC 100%); -webkit-background-clip: text; background-clip: text; }

/* Pamokų langas (css/lessons.css — svetainės spalvos, #101), atidarytas REDAKTORIUJE („Pamokos“ mygtukas) — šiltas kaip kiti langai */
#main-menu:not([style*="flex"]) ~ #lessons-modal {
    --l-fonas: #1E1A19; --l-pav: var(--bg-panel); --l-pav2: var(--bg-card); --l-lin: rgba(255, 255, 255, .07); --l-lin2: var(--lng-linija);
    --l-tekst: var(--text); --l-tekst2: var(--text-dim);
}
#main-menu:not([style*="flex"]) ~ #lessons-modal .ls-backdrop { background: var(--lng-fonas); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

/* Prisijungimo / profilio languose ir meniu „Sign in / Sign up“ — be išplėstų tarpų tarp žodžių („Save  profile“, „Change  password“):
   main.css button { word-spacing: .18em } skirta emoji, o čia mygtukai be emoji */
:is(#auth-modal, #profile-modal) button, #main-menu :is(.mm-auth-btn, #mm-locked button, #mm-paywall button) { word-spacing: normal; }

/* Prisijungimo ir profilio langų ✕ — tas pats apvalus stiklinis kaip visuose languose (sukimasis užvedus lieka) */
#auth-modal#auth-modal .auth-close, #profile-modal#profile-modal .pm-close {
    width: 32px; height: 32px; padding: 0; display: inline-grid; place-items: center; line-height: 1; font-size: 18px;
    background: rgba(255, 255, 255, 0.06); color: var(--text-dim);
}
#auth-modal#auth-modal .auth-close:hover, #profile-modal#profile-modal .pm-close:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
#profile-modal .pm-card:focus { outline: none; }   /* fokusas — tik kad veiktų Esc (js/profile-modal.js) */

/* Detalių sąrašas (BOM — spaudžiant kainą apatinėje juostoje): platesnis, sumos ir kainos vienoje eilutėje (buvo „250.00 / €“ dviem eilutėmis) */
:is(html[data-skin] body.theme-dark, body.theme-dark) .bom-dialog { width: min(780px, 94vw); max-width: 94vw; max-height: 86vh; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .bom-table :is(td.num, th.num) { white-space: nowrap; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .bom-price-in { min-width: 86px; }
/* Kliento / pastabos laukai — po užrašu per visą plotį (buvo siauri, užuominos nukirstos) */
:is(html[data-skin] body.theme-dark, body.theme-dark) .bom-info-in { display: block; width: 100%; box-sizing: border-box; border-radius: 10px !important; padding: 8px 10px !important; }
/* „Praeitą kartą programa užsidarė netikėtai“ (js/memory-guard.js, inline šalta #1f2937) — šilta kortelė kaip kiti pranešimai */
#crash-note { background: #28221F !important; border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 14px !important; }
/* Senų langų (.modal-dialog: BOM, importas) pagrindinis mygtukas — kaip visur: tamsus užrašas ant oranžinės piliulės */
:is(html[data-skin] body.theme-dark, body.theme-dark) .modal-btn.modal-btn-primary { color: #1A0F0A; font-weight: 600; }

/* Apatinė juosta siaurame lange: ilga užuomina (#status-info, ta pati kaip burbule virš juostos) trumpėja su „…“,
   o projekto vardas nebesuspaudžiamas iki „Project 24 ·“ (1100 px buvo 92 px) */
#statusbar #status-info { display: block; flex-shrink: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#statusbar #status-info::before { display: none; }
#statusbar #status-project { min-width: min(170px, 16vw); flex-shrink: 0; }
#statusbar #status-project:not(:empty) { display: block; }   /* inline-flex nerodo „…“ — blokas apkerpa su daugtaškiu (max-width: editor-ui.css) */
/* ≤1200 px su „👥 Partner here“ ir „⇅ live · synced“ dešinė pusė išlįsdavo už ekrano — jungčių skaičius (yra Statistikoje) slepiamas anksčiau (editor-ui.css v965 tvarka) */
@media (max-width: 1200px) { #statusbar #status-connections { display: none !important; } }

/* Juostos išskleidžiami meniu — tikro dydžio, net kai pati juosta sumažinta masteliu (js/fit-bars.js --tb-s; 13" nešiojamuose meniu tekstas
   buvo ~9 px). Atskira `scale` savybė nesikerta su įskridimo animacija (ui-fx.css animuoja `transform`). Liečiamuose — juosta nemažinama. */
@media (pointer: fine) { #toolbar .toolbar-inner .tb-panel { scale: calc(1 / var(--tb-s, 1)); transform-origin: top left; } }
/* Žemame lange (≤ 720 px) ilgas „View ▾“ meniu išlįsdavo už apačios — slenkamas viduje */
#toolbar .tb-panel { max-height: calc(100vh - 58px - env(titlebar-area-height, 0px)); overflow-y: auto; overscroll-behavior: contain; }   /* įdiegtoje programoje juosta žemiau lango juostelės */

/* Savybių lange „🌡 Pipetė“ (js/temp-zones.js, be klasės) — buvo baltas naršyklės mygtukas tamsiame lange; dabar stiklinė piliulė */
:is(html[data-skin] body.theme-dark, body.theme-dark) #btn-regime-pick {
    border-radius: 999px; padding: 4px 11px !important; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.16); color: var(--text); word-spacing: normal;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) #btn-regime-pick:hover { background: rgba(232, 93, 42, 0.14); border-color: rgba(232, 93, 42, 0.5); }

/* #329 (3 dalis): Erelio bendros klasės (css/app-window.css :where() bazė) — tas pats rūbas kaip kitur:
   uždarymo ✕ — apvalus stiklinis; laukeliai — 10 px, oranžinis fokusas; plaukiojanti juosta ir žymos — piliulės; nuotraukos peržiūra */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.p3-x, .p3-lb-x) {
    width: 32px; height: 32px; padding: 0; border-radius: 999px; display: inline-grid; place-items: center;
    background: rgba(255, 255, 255, 0.06); font-size: 15px; color: var(--text-dim);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.p3-x, .p3-lb-x):hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-x { width: 44px; height: 44px; font-size: 18px; background: rgba(255, 255, 255, 0.10); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-field {
    border-radius: 10px; background: var(--bg-input); border: 1px solid rgba(255, 255, 255, 0.14); color: var(--text);
    transition: border-color .15s ease, box-shadow .15s ease;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-field:focus { outline: none; border-color: rgba(232, 93, 42, 0.75); box-shadow: 0 0 0 4px rgba(232, 93, 42, 0.16); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-floatbar {
    background: rgba(40, 34, 31, 0.96); border: 1px solid var(--lng-linija); border-radius: 999px; padding: 6px; box-shadow: var(--lng-seselis);
}
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-chip {
    border-radius: 999px; padding: 6px 12px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12); color: var(--text); word-spacing: normal;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-chip:hover { background: rgba(255, 255, 255, 0.10); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-chip.is-on { background: var(--primary); border-color: transparent; color: #1A0F0A; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb { background: rgba(14, 11, 10, 0.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-img { border-radius: 14px; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-btn { background: rgba(255, 255, 255, 0.08); color: var(--text); word-spacing: normal; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-btn:hover { background: rgba(255, 255, 255, 0.14); }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-btn.is-pri { background: var(--primary); color: #1A0F0A; }
:is(html[data-skin] body.theme-dark, body.theme-dark) .p3-lb-btn.is-pri:hover { background: var(--primary-light); }

/* #343 (QA): projekto kortelės „⋯“ meniu (js/dropdown-menu.js) — SVG ženklai vienoje eilutėje su užrašu, be išplėstų tarpų */
.dropdown-menu .dropdown-item { display: flex; align-items: center; gap: 10px; word-spacing: normal; }
.dropdown-menu .dropdown-ic { width: 18px; flex: none; display: inline-grid; place-items: center; color: var(--text-dim, #9AA8B5); }
.dropdown-menu .dropdown-item:hover .dropdown-ic { color: var(--primary, #E85D2A); }
.dropdown-menu .dropdown-danger .dropdown-ic { color: inherit; }

/* #343 (QA): prie dešinio krašto prisiglaudę langai (nustatymai, pirkimai) — nebeuždengia dešinės įrankių juostos (52 px) */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.settings-panel, #orders-panel) { right: calc(52px + 12px); }

/* #343 (QA): programos meniu telefone svečiui — viršuje „Sign in“ ir „Sign up“ nebetilpo (lūždavo į 2 eilutes, „Sign up“ išlįsdavo
   už ekrano krašto). Tie patys mygtukai yra kortelėje „Sign in to start“ tiesiai po antrašte — telefone viršutinių nerodom. */
#main-menu#main-menu .mm-auth-btn { white-space: nowrap; }
@media (max-width: 600px) {
    #main-menu#main-menu.is-locked:not(.is-paywall) .mm-topbar .mm-auth-btn { display: none; }
}

/* #343 (QA): langų antraštės uždarymo ✕ — visur vienodas (apvalus stiklinis 32 px), kaip .vh-x / .p3-x */
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.export-close, .modal-close, .rw-x, .stm-close, .settings-close, .np-close, .mm-template-close, .help-close, .op-x, .lgm-close, .clip-close, .cp-prev-close) {
    width: 32px; height: 32px; min-width: 32px; padding: 0; border: 0; border-radius: 999px;
    display: inline-grid; place-items: center; line-height: 1; font-size: 15px;
    background: rgba(255, 255, 255, 0.06); color: var(--text-dim); cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
:is(html[data-skin] body.theme-dark, body.theme-dark) :is(.export-close, .modal-close, .rw-x, .stm-close, .settings-close, .np-close, .mm-template-close, .help-close, .op-x, .lgm-close, .clip-close, .cp-prev-close):hover {
    background: rgba(255, 255, 255, 0.12); color: #fff;
}
#orders-panel#orders-panel .op-x, #component-panel#component-panel .kmp-x, #p3-chat#p3-chat .p3c-hbtn {
    width: 32px; height: 32px; min-width: 32px; padding: 0; border: 0; border-radius: 999px;
    display: inline-grid; place-items: center; line-height: 1; font-size: 15px;
    background: rgba(255, 255, 255, 0.06); color: var(--text-dim); cursor: pointer;
}
#orders-panel#orders-panel .op-x:hover, #component-panel#component-panel .kmp-x:hover, #p3-chat#p3-chat .p3c-hbtn:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }

/* #343 (QA): programos meniu telefone prisijungus — vartotojo žetonas su vardu išlįsdavo už ekrano krašto (≤ 390 px).
   Siauriau nei 480 px — tik avataras (vardas ir el. paštas matosi paspaudus — profilio meniu), ženklas truputį mažesnis. */
@media (max-width: 480px) {
    #main-menu#main-menu .mm-user .mm-user-info, #main-menu#main-menu .mm-user .mm-user-caret { display: none; }
    #main-menu#main-menu .mm-user { padding: 3px; gap: 0; min-width: 0; }
    #main-menu#main-menu img.mm-brand-lockup { height: 30px; }
}

/* #343 (QA): planšetė (iPad, liečiamas > 768 px) — juosta nebemažinama (buvo 0,44: mygtukai 13 px, šriftas ~6 px), o slenkama pirštu;
   mygtukai liečiami (40 px). Išskleidžiami meniu — ekrano koordinatėmis (js/toolbar-menus.js), kad slinkimas jų nenukirptų. */
@media (pointer: coarse) and (min-width: 769px) {
    #toolbar .toolbar-inner {
        transform: none !important; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none;
    }
    #toolbar .toolbar-inner::-webkit-scrollbar { height: 0; }
    :is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tool-btn { min-height: 40px; padding: 0 13px; font-size: 14px; }
    :is(html[data-skin] body.theme-dark, body.theme-dark) #toolbar .tb-panel .tool-btn { min-height: 40px; }
}
