/* =====================================================================================
   WebUnfold — wygląd (IBM Plex, cienkie linie, paleta „cynk” z TBMA-APP rozwinięta w system)

   Motyw jasności: html[data-theme="jasny|przygaszony|ciemny"]
   Akcent:         html[data-accent="stalowy|zielony|miedziany|grafitowy"]
   Ustawia js/theme-init.js (przed pierwszym malowaniem), przełącza js/theme.js (nagłówek).

   Tokeny:  neutralne   --bg --surface --raised --sunken --field --border --text --text-2 …
            semantyczne --ok --err --warn (+ -bg), --danger
            akcent      --acc --acc-fg --acc-text (+ pochodne --acc-hover --acc-soft --ring)
            widok 3D    --v-…  (czyta viewer3d.js: blacha, krawędzie, wymiary, pomiar, view cube)
            widok 2D    --f-…  (klasy SVG z flat2d.js: kontur, strefy i linie gięć, wymiary, siatka)
   Kontrast tekstu ≥ 4,5:1 (WCAG AA) w każdym motywie i akcencie. Druk (raporty PDF, arkusz A3)
   nie podlega motywom.
   ===================================================================================== */

/* ---------- skala + motyw Jasny (domyślny) ---------- */
:root{
  color-scheme:light;
  --font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --r-1:4px; --r-2:6px; --r-3:10px; --dur:.14s;

  --bg:#E3E6E3; --surface:#F7F8F7; --raised:#FFFFFF; --sunken:#EEF0EE; --field:#FFFFFF;
  --border:#D3D8D4; --border-strong:#AFB7B2; --field-border:#868F95;
  --text:#192024; --text-2:#4F5960; --text-3:#56616A;
  --hover:#E9ECE9; --overlay:rgba(250,251,250,.92); --backdrop:rgba(20,26,30,.42);
  --paper:#FFFFFF; --logo-plate:transparent; --folder:#9A7426;
  --shadow-1:0 1px 2px rgba(16,22,26,.08);
  --shadow-2:0 20px 50px rgba(16,22,26,.20),0 3px 10px rgba(16,22,26,.08);
  --grid-minor:rgba(40,60,70,.05); --grid-major:rgba(40,60,70,.09);

  --ok:#276534; --ok-bg:#E5F1E7; --err:#AE2A21; --err-bg:#FBEAE8; --warn:#865100; --warn-bg:#FCF0D9;
  --neutral-bg:#E9ECE9; --bend-soft:#FAEFD9;
  --danger:#B3261E; --danger-fg:#FFFFFF; --danger-hover:#951E17; --hover-mix:#000000;

  --stal:#245A92;   --stal-fg:#FFFFFF;   --stal-text:#235790;
  --ziel:#1E6943;   --ziel-fg:#FFFFFF;   --ziel-text:#1C643F;
  --miedz:#A1491A;  --miedz-fg:#FFFFFF;  --miedz-text:#924117;
  --grafit:#2B3338; --grafit-fg:#FFFFFF; --grafit-text:#2B3338;

  --v-bg-top:#FCFDFD; --v-bg-bot:#E1E5E8; --v-sheet:#C3C8CB; --v-edge:#3A4146;
  --v-dim:#2B5C9E; --v-meas:#C2410C; --meas-fg:#FFFFFF; --meas-text:#B33C0B;
  --v-ax-x:#E0475A; --v-ax-y:#5FA318; --v-ax-z:#2F7FE0; --v-ax-label:#101418;
  --dl-bg:rgba(251,252,251,.93); --dl-border:#BCCBDF; --dl-text:#24548F;

  --f-bg:#FBFCFB; --f-grid:#DCE0DC; --f-fill:#E7EDF4; --f-cut:#1B4F8A;
  --f-zone:#F6E3C4; --f-zone-hi:#EEC27C;
  --f-up:#B86E00; --f-up-t:#7A4800; --f-dn:#8A3FB8; --f-dn-t:#682B8E;
  --f-bl0:#737C82; --f-dim:#5E676C; --f-dim-t:#1E2326;
}

/* ---------- motyw Przygaszony: ciemnoszary, obniżony kontrast (długa praca) ---------- */
html[data-theme="przygaszony"]{
  color-scheme:dark;
  --bg:#1B1F25; --surface:#22272E; --raised:#2A3038; --sunken:#1E2329; --field:#1D2228;
  --border:#363E47; --border-strong:#4A535D; --field-border:#66717C;
  --text:#C3CCD5; --text-2:#A0ACB7; --text-3:#9CA8B3;
  --hover:#2B3139; --overlay:rgba(34,39,46,.9); --backdrop:rgba(8,10,13,.55);
  --paper:#D3D9DE; --logo-plate:#C9D0D6; --folder:#B99B60;
  --shadow-1:0 1px 2px rgba(0,0,0,.28);
  --shadow-2:0 20px 50px rgba(0,0,0,.45),0 3px 10px rgba(0,0,0,.25);
  --grid-minor:rgba(170,190,210,.035); --grid-major:rgba(170,190,210,.07);

  --ok:#73B984; --ok-bg:#24342A; --err:#EB8A82; --err-bg:#3B292A; --warn:#D7A75A; --warn-bg:#382F21;
  --neutral-bg:#2E343C; --bend-soft:#3A3226;
  --danger:#B04038; --danger-fg:#F6EEED; --danger-hover:#953530; --hover-mix:#000000;

  --stal:#3A6CA3;   --stal-fg:#F1F5F9;   --stal-text:#83AFE4;
  --ziel:#2D7149;   --ziel-fg:#F0F6F2;   --ziel-text:#7AC294;
  --miedz:#9E5328;  --miedz-fg:#FBF2EC;  --miedz-text:#E2A273;
  --grafit:#B4BDC6; --grafit-fg:#1A1F25; --grafit-text:#BAC3CC;

  --v-bg-top:#2D343C; --v-bg-bot:#1D2228; --v-sheet:#A7AFB5; --v-edge:#171B1F;
  --v-dim:#6FA0DB; --v-meas:#E2834F; --meas-fg:#1D0E05; --meas-text:#E99666;
  --v-ax-x:#CF5D6A; --v-ax-y:#76AC47; --v-ax-z:#5B8DD2; --v-ax-label:#14181C;
  --dl-bg:rgba(30,35,41,.92); --dl-border:#3E5876; --dl-text:#93B8E5;

  --f-bg:#20252B; --f-grid:#2C333B; --f-fill:#27313D; --f-cut:#7DABE0;
  --f-zone:#433727; --f-zone-hi:#574429;
  --f-up:#D9A04C; --f-up-t:#E7BA76; --f-dn:#B48DDD; --f-dn-t:#CDB2EC;
  --f-bl0:#7D8892; --f-dim:#939FAA; --f-dim-t:#C3CCD5;
}

/* ---------- motyw Ciemny ---------- */
html[data-theme="ciemny"]{
  color-scheme:dark;
  --bg:#0C0F12; --surface:#14181C; --raised:#1B2025; --sunken:#101316; --field:#0F1215;
  --border:#272E35; --border-strong:#3A444D; --field-border:#5F6B75;
  --text:#E3E8EC; --text-2:#A3AEB7; --text-3:#909BA4;
  --hover:#1E242A; --overlay:rgba(20,24,28,.88); --backdrop:rgba(0,0,0,.6);
  --paper:#E8ECEF; --logo-plate:#E6EAED; --folder:#C9A65E;
  --shadow-1:0 1px 2px rgba(0,0,0,.45);
  --shadow-2:0 20px 50px rgba(0,0,0,.6),0 3px 10px rgba(0,0,0,.4);
  --grid-minor:rgba(160,190,220,.035); --grid-major:rgba(160,190,220,.07);

  --ok:#5FC27A; --ok-bg:#12251A; --err:#FF7F76; --err-bg:#2C1514; --warn:#EAAA42; --warn-bg:#2A200E;
  --neutral-bg:#21272D; --bend-soft:#2A2213;
  --danger:#C2362F; --danger-fg:#FFFFFF; --danger-hover:#A52C26; --hover-mix:#FFFFFF;

  --stal:#5C9DE8;   --stal-fg:#06111E;   --stal-text:#80B5F1;
  --ziel:#4BB679;   --ziel-fg:#04140B;   --ziel-text:#6DCB96;
  --miedz:#E38A52;  --miedz-fg:#1C0B02;  --miedz-text:#F0A577;
  --grafit:#CFD6DC; --grafit-fg:#111417; --grafit-text:#D3DAE0;

  --v-bg-top:#20262C; --v-bg-bot:#0D1013; --v-sheet:#BAC1C6; --v-edge:#0B0E10;
  --v-dim:#6FA9F2; --v-meas:#FF8148; --meas-fg:#1A0A02; --meas-text:#FF8F5C;
  --v-ax-x:#F0566A; --v-ax-y:#7CC23A; --v-ax-z:#4C95F0; --v-ax-label:#0B0E10;
  --dl-bg:rgba(16,19,23,.9); --dl-border:#2F4B70; --dl-text:#8FC0FA;

  --f-bg:#111417; --f-grid:#1F252B; --f-fill:#172331; --f-cut:#7DB5F3;
  --f-zone:#372913; --f-zone-hi:#5C4219;
  --f-up:#F2A53C; --f-up-t:#F6BC63; --f-dn:#C68DF2; --f-dn-t:#D8AFF7;
  --f-bl0:#7B858C; --f-dim:#98A3AB; --f-dim-t:#E3E8EC;
}

/* ---------- akcent (niezależny od jasności; barwy per motyw wyżej) ---------- */
:root,html[data-accent="stalowy"]{--acc:var(--stal);--acc-fg:var(--stal-fg);--acc-text:var(--stal-text)}
html[data-accent="zielony"]{--acc:var(--ziel);--acc-fg:var(--ziel-fg);--acc-text:var(--ziel-text)}
html[data-accent="miedziany"]{--acc:var(--miedz);--acc-fg:var(--miedz-fg);--acc-text:var(--miedz-text)}
html[data-accent="grafitowy"]{--acc:var(--grafit);--acc-fg:var(--grafit-fg);--acc-text:var(--grafit-text)}
:root{
  --acc-hover:color-mix(in srgb,var(--acc) 84%,var(--hover-mix));
  --acc-soft:color-mix(in srgb,var(--acc-text) 13%,var(--surface));
  --acc-soft-2:color-mix(in srgb,var(--acc-text) 18%,var(--surface));
  --ring:var(--acc-text);
  --ring-soft:color-mix(in srgb,var(--acc-text) 28%,transparent);
}

/* ---------- podstawy ---------- */
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:14px/1.45 var(--font);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;
  scrollbar-color:var(--border-strong) transparent}
::selection{background:var(--acc-soft-2);color:var(--text)}
a{color:var(--acc-text)}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.note{color:var(--text-2);font-size:12px;margin-top:8px}
.good{color:var(--ok)} .bad{color:var(--err)} .err{color:var(--err)}
code,kbd{font-family:var(--mono)}

/* ---------- przyciski: główny (akcent) / drugorzędny / niebezpieczny ---------- */
button,a.button{font:500 13px/1.25 var(--font);min-height:32px;padding:6px 14px;border-radius:var(--r-2);
  border:1px solid var(--acc);background:var(--acc);color:var(--acc-fg);cursor:pointer;text-align:center;text-decoration:none;
  transition:background-color var(--dur),border-color var(--dur),color var(--dur),box-shadow var(--dur),transform var(--dur)}
a.button{display:inline-flex;align-items:center;justify-content:center}
button:hover:not(:disabled),a.button:hover{background:var(--acc-hover);border-color:var(--acc-hover)}
button:active:not(:disabled),a.button:active{transform:translateY(1px)}
button.secondary,a.button.secondary{background:var(--raised);border-color:var(--border-strong);color:var(--text)}
button.secondary:hover:not(:disabled),a.button.secondary:hover{background:var(--hover);border-color:var(--text-3)}
button.danger{background:var(--danger);border-color:var(--danger);color:var(--danger-fg)}
button.danger:hover:not(:disabled){background:var(--danger-hover);border-color:var(--danger-hover)}
button.small,a.button.small{min-height:26px;padding:3px 10px;font-size:12.5px;border-radius:5px}
button:disabled{background:var(--sunken);border-color:var(--border);color:var(--text-3);cursor:not-allowed;box-shadow:none}
button.ibtn{display:inline-grid;place-items:center;padding:0;width:32px}
button.ibtn.small{width:30px}
button.ibtn svg{width:16px;height:16px;fill:currentColor;opacity:.85}

/* ---------- pola formularzy (bazowe bez specyficzności — stany niżej wygrywają) ---------- */
input,select,textarea{font:inherit;color:var(--text)}
:where(input[type=text],input[type=number],input[type=date],input[type=password],input:not([type]),select,textarea){
  font-size:13.5px;min-height:30px;padding:4px 8px;border:1px solid var(--field-border);border-radius:var(--r-1);
  background:var(--field);color:var(--text);transition:border-color var(--dur),box-shadow var(--dur),background-color var(--dur)}
:where(textarea){line-height:1.45;padding:8px 10px;resize:vertical}
:where(select){cursor:pointer}
:where(input,select,textarea):hover:not(:disabled):not(:focus){border-color:var(--text-2)}
:where(input,select,textarea):focus-visible{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-soft)}
:where(input,select,textarea):disabled{opacity:.6;cursor:not-allowed}
::placeholder{color:var(--text-3);opacity:1}
input[type=checkbox],input[type=radio]{accent-color:var(--acc);width:15px;height:15px;margin:0;vertical-align:-2px;cursor:pointer}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:2px solid var(--ring);outline-offset:2px;box-shadow:none}
/* stany pola grubości: brak (czerwony) → OK (zielony); ostrzeżenie (bursztyn) ma pierwszeństwo */
input.need{border-color:var(--err);background:var(--err-bg)}
input.okv{border-color:var(--ok);background:var(--ok-bg)}
input.warn{border-color:var(--warn);background:var(--warn-bg)}
progress{width:100%;height:8px;border:0;border-radius:99px;overflow:hidden;background:var(--sunken);accent-color:var(--acc);-webkit-appearance:none;appearance:none}
progress::-webkit-progress-bar{background:var(--sunken);border-radius:99px}
progress::-webkit-progress-value{background:var(--acc);border-radius:99px}
progress::-moz-progress-bar{background:var(--acc);border-radius:99px}

/* ---------- układ aplikacji ---------- */
body.app{display:grid;grid-template-columns:var(--side-w,380px) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:100vh}
/* rozdzielacze paneli (js/layout.js): paski nad granicami paneli, linia akcentu przy najechaniu */
.gutter{position:fixed;z-index:30;touch-action:none;outline:none}
.gutter.v{cursor:col-resize} .gutter.h{cursor:row-resize}
.gutter::after{content:"";position:absolute;background:transparent;transition:background .12s}
.gutter.v::after{left:3px;width:2px;top:0;bottom:0} .gutter.h::after{top:3px;height:2px;left:0;right:0}
.gutter:hover::after,.gutter.drag::after,.gutter:focus-visible::after{background:var(--acc)}
body.resizing{user-select:none} body.resizing.v{cursor:col-resize} body.resizing.h{cursor:row-resize}
body.resizing iframe,body.resizing canvas,body.resizing svg{pointer-events:none}

/* nagłówek: tożsamość (logo LP Konstal + znak aplikacji), tryb, status, motyw, konto */
header.topbar{grid-column:1/-1;display:flex;align-items:center;gap:14px;min-height:52px;padding:6px 18px;
  background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow-1);position:relative;z-index:6}
.brand-logo{display:block;flex:none;box-sizing:content-box;width:125px;height:25px;overflow:hidden;border-radius:3px}
.brand-logo img{display:block;height:42px;width:auto;margin:-6.3px 0 0 -2.8px;mix-blend-mode:multiply}
html[data-theme="przygaszony"] .brand-logo,html[data-theme="ciemny"] .brand-logo{background:var(--logo-plate);padding:5px 9px;border-radius:var(--r-2)}
.brand-sep{flex:none;width:1px;height:30px;background:var(--border)}
.apptitle{display:flex;align-items:center;gap:10px;min-width:0}
.appmark{flex:none;width:26px;height:26px}
.appmark .am-net{fill:var(--acc-soft-2);stroke:var(--acc-text);stroke-width:1.5;stroke-linejoin:round}
.appmark .am-bend{fill:none;stroke:var(--acc-text);stroke-width:1.2;stroke-dasharray:2.2 1.6}
.apptitle h1{margin:0;font-size:16.5px;font-weight:600;line-height:1.15;letter-spacing:-.01em}
.apptitle .sub{display:block;font-size:11.5px;line-height:1.3;color:var(--text-2);white-space:nowrap}
.chip{flex:none;font:600 10.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:99px;
  background:var(--acc-soft);color:var(--acc-text);border:1px solid color-mix(in srgb,var(--acc-text) 28%,transparent)}
body.app #status{margin-left:auto;min-width:0;text-align:right;font-size:12.5px;color:var(--text-2);font-variant-numeric:tabular-nums}
body.app #status::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ok);margin-right:8px;vertical-align:1px}
body.app #status.busy{color:var(--warn)} body.app #status.busy::before{background:var(--warn);animation:wu-pulse 1s ease-in-out infinite}
body.app #status.bad{color:var(--err)} body.app #status.bad::before{background:var(--err)}
@keyframes wu-pulse{50%{opacity:.25}}
header form{margin:0}
header.topbar button,header.topbar a.button{flex:none}

/* przełącznik motywu (js/theme.js): jasność — przełącznik segmentowy, akcent — próbki koloru */
.themectl{display:flex;align-items:center;gap:10px;flex:none;min-height:30px}
.themectl fieldset{border:0;margin:0;padding:0;min-width:0}
.themectl .seg{display:inline-flex;gap:2px;padding:2px;background:var(--sunken);border:1px solid var(--border);border-radius:var(--r-2)}
.seg label{position:relative;display:grid;place-items:center;width:28px;height:24px;border-radius:4px;color:var(--text-2);cursor:pointer;
  transition:background-color var(--dur),color var(--dur)}
.seg label:hover{color:var(--text);background:var(--hover)}
.seg svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.seg svg .fillc{fill:currentColor;stroke:none}
.seg label:has(input:checked){background:var(--raised);color:var(--acc-text);box-shadow:var(--shadow-1),inset 0 0 0 1px var(--border)}
.themectl .swatches{display:inline-flex;gap:2px}
.swatches label{position:relative;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;cursor:pointer}
.swatches .dot{width:14px;height:14px;border-radius:50%;background:var(--c);pointer-events:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text) 20%,transparent);transition:transform var(--dur)}
.swatches label:hover .dot{transform:scale(1.15)}
.swatches label:has(input:checked){box-shadow:inset 0 0 0 1.5px var(--text-2)}
.themectl input[type=radio]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.seg label:has(input:focus-visible),.swatches label:has(input:focus-visible){outline:2px solid var(--ring);outline-offset:1px}

/* ---------- panel boczny: folder → detale → parametry → akcje ---------- */
aside{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0;overflow-y:auto;counter-reset:krok}
aside section{flex:none;padding:12px 16px 14px;border-bottom:1px solid var(--border)}
aside h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font:600 11px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
aside h3::before{counter-increment:krok;content:counter(krok);display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:4px;
  background:var(--acc-soft-2);color:var(--acc-text);font:600 11px/1 var(--mono);letter-spacing:0}
.rootbar{display:flex;gap:6px}
.rootbar input,.rootbar select{flex:1;min-width:0}
.recent{margin-top:8px;display:flex;flex-wrap:wrap;gap:4px}
.recent button{min-height:22px;padding:2px 9px;font-size:11.5px;border-radius:99px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drop{margin-top:8px;border:1.5px dashed var(--border-strong);border-radius:var(--r-2);padding:12px;text-align:center;color:var(--text-2);
  font-size:12.5px;cursor:pointer;background:var(--raised);transition:border-color var(--dur),background-color var(--dur),color var(--dur)}
.drop:hover{border-color:var(--acc-text);color:var(--text)}
.drop.over{border-color:var(--acc-text);background:var(--acc-soft);color:var(--acc-text)}

/* drzewo detali */
.treehead{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 8px;padding:10px 16px 8px;border-bottom:1px solid var(--border)}
.treehead h3{margin:0}
.treehead .count{font:600 12px/1.2 var(--font);color:var(--acc-text);font-variant-numeric:tabular-nums;white-space:pre;text-align:right}
.treehead .tbtns{grid-column:1/-1;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.treehead .tbtns button{min-height:24px;padding:2px 10px}
.tfilter{margin-left:auto;display:flex;gap:10px;font-size:11.5px;color:var(--text-2)}
.tfilter label{display:flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap}
.tfilter input[type=checkbox]{width:13px;height:13px}
/* plakietka formatu w drzewie: siatka 3D / rysunek 2D */
.tfile .kb{display:inline-block;margin-right:6px;padding:0 4px;border-radius:3px;font:600 9.5px/1.5 var(--mono);letter-spacing:.03em;
  vertical-align:1px;border:1px solid var(--border-strong);color:var(--text-2)}
.tfile.k-drawing .kb{color:var(--acc-text);border-color:var(--acc)}
/* rysunek DXF/DWG w panelu 2D — linie w kolorze motywu (ezdxf SVG: currentColor) */
.wu-flat.drawing{color:var(--f-cut)}
.wu-flat .f-draw{color:inherit}
/* linie rysunku: stała grubość na ekranie przy każdym powiększeniu (wypełnienia tekstu bez obrysu) */
.wu-flat .f-draw [class^="dxC"]{vector-effect:non-scaling-stroke;stroke-width:1.1px}
#tree{flex:1;min-height:120px;overflow:auto;padding:0 0 6px}
#tree:focus{outline:none}
.tcols{display:grid;grid-template-columns:1fr 56px;padding:6px 16px 5px;font:600 10.5px/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-2);border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;z-index:1}
.tcols span:last-child{text-align:center}
.tdir>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;min-height:26px;padding:2px 16px;font-size:12.5px;font-weight:500;color:var(--text-2);user-select:none}
.tdir>summary:hover{background:var(--hover);color:var(--text)}
.tdir>summary::-webkit-details-marker{display:none}
.tdir>summary::before{content:"";flex:none;width:10px;height:10px;background:currentColor;transform:rotate(90deg);transition:transform var(--dur);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.2 1.5 7 5l-3.8 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.2 1.5 7 5l-3.8 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.tdir:not([open])>summary::before{transform:none}
.tdir .dnm{display:inline-flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tdir .dnm::before{content:"";flex:none;width:15px;height:15px;background:var(--folder);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1.75 4.25c0-.69.56-1.25 1.25-1.25h3.1l1.5 1.75h5.4c.69 0 1.25.56 1.25 1.25v6.25c0 .69-.56 1.25-1.25 1.25H3c-.69 0-1.25-.56-1.25-1.25z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1.75 4.25c0-.69.56-1.25 1.25-1.25h3.1l1.5 1.75h5.4c.69 0 1.25.56 1.25 1.25v6.25c0 .69-.56 1.25-1.25 1.25H3c-.69 0-1.25-.56-1.25-1.25z'/%3E%3C/svg%3E") center/contain no-repeat}
.tdir .tdir{margin-left:12px}
.tfile{display:grid;grid-template-columns:18px minmax(0,1fr) 56px;align-items:center;gap:6px;min-height:27px;padding:2px 16px;cursor:pointer;font-size:12.5px}
.tfile:hover{background:var(--hover)}
.tfile.sel{background:var(--acc-soft);box-shadow:inset 3px 0 0 var(--acc)}
.tfile.sel .nm{font-weight:500}
.tfile.ctx{background:var(--hover);box-shadow:inset 0 0 0 1px var(--acc-text)}
.tfile .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tfile .qty{text-align:center;font:500 12px/1.75 var(--mono);border-radius:var(--r-1);font-variant-numeric:tabular-nums}
.tfile .qty.implicit{color:var(--text-3)}
.tfile .qty:hover{background:var(--acc-soft-2);color:var(--acc-text)}
.tfile .qty input{width:100%;min-height:22px;padding:1px 2px;text-align:center;font:500 12px var(--mono)}
#tree:focus-visible .tfile.sel{outline:2px solid var(--ring);outline-offset:-2px}
.empty{padding:16px;color:var(--text-2);font-size:12.5px}

/* menu kontekstowe drzewa (prawy przycisk): zmień nazwę F2 / ilość / usuń Del / masa */
.ctxmenu{position:fixed;z-index:50;min-width:240px;padding:5px;background:var(--raised);border:1px solid var(--border);border-radius:var(--r-2);box-shadow:var(--shadow-2)}
.ctxmenu button{display:flex;justify-content:space-between;align-items:center;gap:24px;width:100%;min-height:30px;padding:5px 10px;border:0;border-radius:var(--r-1);
  background:transparent;color:var(--text);font:400 13px/1.3 var(--font);text-align:left}
.ctxmenu button:hover:not(:disabled),.ctxmenu button:focus{background:var(--acc-soft);color:var(--text);outline:none;transform:none}
.ctxmenu button:focus-visible{box-shadow:inset 0 0 0 2px var(--ring)}
.ctxmenu button:disabled{background:transparent;color:var(--text-3)}
.ctxmenu kbd{font:500 11px/1.4 var(--mono);color:var(--text-2);background:var(--sunken);border:1px solid var(--border);border-radius:3px;padding:0 5px}
.ctxmenu hr{border:0;border-top:1px solid var(--border);margin:5px 4px}
input.bigin{width:100%;min-height:40px;margin-top:6px;padding:8px 12px;font:500 15px var(--mono)}
.dellist{margin:8px 0 12px;padding:8px 12px 8px 28px;max-height:40vh;overflow:auto;font:12.5px/1.6 var(--mono);word-break:break-all;
  background:var(--sunken);border:1px solid var(--border);border-radius:var(--r-2)}

/* parametry rozwinięcia */
/* zwarte (2026-10-06, prośba testerów): mniejsze czcionki i pola — wysokość zostaje dla drzewa */
.params{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:4px 8px;align-items:center}
.params label{color:var(--text-2);font-size:12px;font-weight:500}
.params input,.params select{width:100%;font-size:12.5px;min-height:26px;padding:2px 7px}
.params button.small{min-height:24px;padding:2px 9px;font-size:12px}
.params .u{color:var(--text-2);font-size:11px;min-width:48px}
#thk,#kf{font-family:var(--mono);font-weight:500}
.checks{display:flex;flex-direction:column;gap:3px;margin-top:7px;font-size:11.5px;color:var(--text-2)}
.checks input[type=checkbox]{width:13px;height:13px}
.checks label{display:flex;align-items:center;gap:8px;cursor:pointer}
.checks label:hover{color:var(--text)}
#fcState{margin:0 0 0 23px}
#fcState:empty{display:none}
#fcState a{cursor:pointer;text-decoration:underline;color:var(--acc-text)}
#fcState.bad a{color:var(--err)}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:9px}
.actions button{min-height:28px;padding:4px 8px;font-size:12.5px}
.actions .wide{grid-column:1/-1}
.actions .agrp{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin-top:4px;font:600 10px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.actions .agrp::after{content:"";flex:1;height:1px;background:var(--border)}
.actions #bUnfold{min-height:32px;font-size:13.5px;font-weight:600;letter-spacing:.01em}
#msgs p{margin:10px 0 0;padding:8px 10px 8px 12px;font-size:12.5px;line-height:1.45;border-radius:var(--r-1);border-left:3px solid var(--border-strong);background:var(--sunken)}
#msgs .e{color:var(--err);background:var(--err-bg);border-left-color:var(--err)}
#msgs .w{color:var(--warn);background:var(--warn-bg);border-left-color:var(--warn)}
#msgs .i{color:var(--ok);background:var(--ok-bg);border-left-color:var(--ok)}

/* ---------- widoki 3D / 2D ---------- */
main{display:grid;grid-template-columns:minmax(0,var(--v3d,1fr)) minmax(0,var(--v2d,1fr));grid-template-rows:minmax(160px,1fr) var(--bot-h,auto);gap:1px;background:var(--border);min-width:0;min-height:0;overflow:auto}
.view{position:relative;min-height:160px;min-width:0;overflow:hidden;background:var(--f-bg)}
body.bot-fixed main>.bottom{overflow:auto;min-height:0}
#v3d{background:linear-gradient(180deg,var(--v-bg-top) 0%,var(--v-bg-bot) 100%)}
#v3d canvas{display:block;width:100%;height:100%}
#v2d svg{width:100%;height:100%;display:block;cursor:grab}
#v2d svg.drag{cursor:grabbing}
.view h2{position:absolute;top:10px;left:12px;right:12px;z-index:3;margin:0;display:flex;align-items:center;gap:10px;pointer-events:none;font-size:inherit;font-weight:400}
.view h2 .vt{flex:none;font:600 10.5px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--text);
  background:var(--overlay);border:1px solid var(--border);border-radius:99px;padding:5px 10px;box-shadow:var(--shadow-1)}
.view h2 .vhint{min-width:0;font-size:11.5px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.view .placeholder{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;color:var(--text-2);font-size:13px;pointer-events:none;text-align:center;padding:20px}
.view .placeholder::before{content:"";width:46px;height:46px;background:var(--text-3);opacity:.5;-webkit-mask:var(--ph-icon) center/contain no-repeat;mask:var(--ph-icon) center/contain no-repeat}
#ph3d{--ph-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M24 4 42 14v20L24 44 6 34V14z'/%3E%3Cpath d='M6 14l18 10 18-10M24 24v20'/%3E%3C/svg%3E")}
#ph2d{--ph-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M17 4h14v13h13v14H31v13H17V31H4V17h13z'/%3E%3Cpath d='M17 17h14v14H17z' stroke-dasharray='3 2.5'/%3E%3C/svg%3E")}
/* pasek narzędzi nad widokiem (view cube 128 px w prawym dolnym rogu 3D zostaje wolny) */
.tools{position:absolute;left:10px;bottom:10px;max-width:calc(100% - 156px);z-index:3;display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;
  padding:5px 8px;font-size:12.5px;background:var(--overlay);border:1px solid var(--border);border-radius:var(--r-3);box-shadow:var(--shadow-1);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.v2tools{max-width:calc(100% - 20px)}
.tools label{display:inline-flex;align-items:center;gap:6px;padding:2px 3px;color:var(--text-2);cursor:pointer;border-radius:var(--r-1)}
.tools label:hover{color:var(--text)}
.tools .sep{width:1px;align-self:stretch;margin:2px 0;background:var(--border)}
.tools button{min-height:26px;padding:3px 10px;font-size:12.5px;border-radius:5px}
.tools button.secondary{background:transparent;border-color:transparent;color:var(--text)}
.tools button.secondary:hover:not(:disabled){background:var(--hover);border-color:var(--border)}
.tools .tgroup{display:inline-flex;gap:1px;padding:1px;background:var(--sunken);border:1px solid var(--border);border-radius:var(--r-2)}
.tools .tgroup button{min-height:24px;padding:2px 9px}
.tools button.on,.tools button.on:hover:not(:disabled){background:var(--v-meas);border-color:var(--v-meas);color:var(--meas-fg)}
#dimlabels{position:absolute;inset:0;pointer-events:none;z-index:2}
.dl{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;font:500 12px/1 var(--mono);color:var(--dl-text);
  background:var(--dl-bg);border:1px solid var(--dl-border);border-radius:var(--r-1);padding:3px 6px;font-variant-numeric:tabular-nums;box-shadow:var(--shadow-1)}
.dl b{font-weight:600}
.dl.meas{color:var(--meas-fg);background:var(--v-meas);border-color:var(--v-meas)}
.dl.hidden{display:none}
#measinfo{position:absolute;top:42px;left:12px;z-index:3;max-width:calc(100% - 24px);font-size:12px;color:var(--meas-text);pointer-events:none;
  background:var(--overlay);border:1px solid color-mix(in srgb,var(--v-meas) 45%,var(--border));border-radius:var(--r-1);padding:4px 8px}
#measinfo:empty{display:none}

/* rozwinięcie 2D (flat2d.js) — klasy zamiast kolorów na sztywno, zmiana motywu na żywo */
.wu-flat{background:var(--f-bg)}
.wu-flat .f-grid{stroke:var(--f-grid)}
.wu-flat .f-arrow{fill:var(--f-dim)}
.wu-flat .f-fill{fill:var(--f-fill)}
.wu-flat .f-cut{stroke:var(--f-cut)}
.wu-flat .zn{fill:var(--f-zone)}
.wu-flat .zn.hi{fill:var(--f-zone-hi)}
.wu-flat .f-bl0{stroke:var(--f-bl0)}
.wu-flat .bl{stroke:var(--f-up)}
.wu-flat .bl.dn{stroke:var(--f-dn)}
.wu-flat .bl.hi{stroke-width:3px}
.wu-flat .bt{fill:var(--f-up-t);font-family:var(--font)}
.wu-flat .bt.dn{fill:var(--f-dn-t)}
.wu-flat .bt.hi{font-weight:700}
.wu-flat .f-dim{stroke:var(--f-dim)}
.wu-flat .f-dimx{stroke:var(--f-dim)}
.wu-flat .f-dimt{fill:var(--f-dim-t);font-family:var(--mono)}
/* pomiar / kąt w 2D — barwa pomiaru jak w 3D */
.wu-flat.measuring{cursor:crosshair}
.wu-flat .f-ml{stroke:var(--v-meas)}
.wu-flat .f-mthin{stroke-dasharray:4 3}
.wu-flat .f-marrow,.wu-flat .f-mdot{fill:var(--v-meas)}
.wu-flat .f-mt{fill:var(--meas-text);font-family:var(--mono);font-weight:500;paint-order:stroke;
  stroke:var(--f-bg);stroke-width:.35em;stroke-linejoin:round}
.wu-flat .f-snap{fill:none;stroke:var(--v-meas);stroke-width:1.6px;vector-effect:non-scaling-stroke;pointer-events:none}
.wu-flat .f-meas{pointer-events:none}
#measinfo2d{position:absolute;top:42px;left:12px;z-index:3;max-width:calc(100% - 24px);font-size:12px;color:var(--meas-text);pointer-events:none;
  background:var(--overlay);border:1px solid color-mix(in srgb,var(--v-meas) 45%,var(--border));border-radius:var(--r-1);padding:4px 8px}
#measinfo2d:empty{display:none}

/* ---------- dół: tabela gięć + właściwości ---------- */
.bottom{grid-column:1/-1;background:var(--surface);display:grid;grid-template-columns:minmax(0,var(--bt,1.5fr)) minmax(0,var(--bs,1fr));gap:32px;padding:16px 20px 20px}
.ptitle{margin:0 0 10px;font:600 11px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
table{border-collapse:collapse;width:100%;font-size:13px;font-variant-numeric:tabular-nums}
th,td{padding:5px 10px;text-align:right;border-bottom:1px solid var(--border);white-space:nowrap}
th:first-child,td:first-child{text-align:left}
th{font-size:11.5px;font-weight:600;color:var(--text-2);background:var(--sunken);border-bottom-color:var(--border-strong)}
tbody tr:hover{background:var(--hover)}
#tbody tr:hover,#tbody tr.hi{background:var(--bend-soft)}
.sw{display:inline-block;width:18px;border-top:2px dashed var(--f-up);vertical-align:middle;margin-right:8px}
.dirup{color:var(--ok)} .dirdn{color:var(--err)}
dl.stats{display:grid;grid-template-columns:auto minmax(0,1fr);margin:0;font-size:13px;font-variant-numeric:tabular-nums}
dl.stats dt,dl.stats dd{padding:5px 0;border-bottom:1px solid var(--border)}
dl.stats dt{color:var(--text-2);padding-right:16px}
dl.stats dd{margin:0;text-align:right;overflow-wrap:anywhere}
dl.stats dd b{font-weight:600}

/* ---------- okna dialogowe ---------- */
dialog{width:min(1100px,94vw);max-height:88vh;padding:0;border:1px solid var(--border);border-radius:var(--r-3);background:var(--surface);color:var(--text);box-shadow:var(--shadow-2)}
dialog[open]{animation:wu-dlg .16s ease-out}
@keyframes wu-dlg{from{opacity:0;transform:translateY(6px) scale(.985)}to{opacity:1;transform:none}}
dialog::backdrop{background:var(--backdrop)}
dialog .dhead{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;padding:14px 20px 12px;border-bottom:1px solid var(--border)}
dialog .dhead h2{margin:0;font-size:16px;font-weight:600;letter-spacing:-.005em}
dialog .dhead .note{margin:0}
dialog .dbody{padding:16px 20px;overflow:auto;max-height:calc(88vh - 130px)}
dialog .dfoot{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--border);
  background:var(--sunken);border-radius:0 0 var(--r-3) var(--r-3)}
dialog .dbody table{font-size:12.5px}
#dlgDelete{border-top:3px solid var(--danger)}
#dlgDelete .dhead h2{display:flex;align-items:center;gap:8px}
#dlgDelete .dhead h2::before{content:"";width:18px;height:18px;flex:none;background:var(--err);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.2 15.2 14H.8z M7.2 5.6h1.6v4.4H7.2z M7.2 11.2h1.6v1.6H7.2z' fill-rule='evenodd'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.2 15.2 14H.8z M7.2 5.6h1.6v4.4H7.2z M7.2 11.2h1.6v1.6H7.2z' fill-rule='evenodd'/%3E%3C/svg%3E") center/contain no-repeat}
#delQ{margin:0 0 4px;font-weight:600}
.opts{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;align-items:center;max-width:600px;margin:0 0 12px}
.opts label{color:var(--text-2);font-size:13px}
.opts label:has(input[type=checkbox]){display:flex;align-items:center;gap:8px;color:var(--text);cursor:pointer}
.fbtext{width:100%}
dialog.docdlg{width:min(1600px,97vw);max-height:94vh}
.docbody{display:grid;grid-template-columns:280px minmax(0,1fr);gap:16px;padding:16px 20px;height:calc(94vh - 126px)}
.docform{grid-template-columns:auto 1fr;align-content:start;max-width:none;margin:0}
.docform input{width:100%}
.docview{position:relative;min-height:0;border:1px solid var(--border);border-radius:var(--r-2);background:var(--paper);overflow:hidden}
.docview iframe{width:100%;height:100%;border:0;display:block}
.docview .placeholder{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;color:var(--text-2);font-size:13px;background:var(--surface)}
@media (max-width:900px){.docbody{grid-template-columns:1fr;height:auto}.docview{height:60vh}}
.dirlist{list-style:none;margin:10px 0 0;padding:4px;max-height:52vh;overflow:auto;border:1px solid var(--border);border-radius:var(--r-2);background:var(--raised)}
.dirlist li{padding:6px 10px;border-radius:var(--r-1);cursor:pointer;font-size:13px}
.dirlist li+li{margin-top:1px}
.dirlist li:hover{background:var(--acc-soft)}
.crumb{margin-top:8px;font:12.5px var(--mono);color:var(--text-2);word-break:break-all}

/* rozkład złożenia: ocena obróbki, zaznaczanie i usuwanie plików */
.kl{display:inline-block;padding:1px 8px;border-radius:99px;font:600 11px/1.6 var(--font);letter-spacing:.02em;white-space:nowrap;border:1px solid transparent}
.kl-tak{background:var(--ok-bg);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 30%,transparent)}
.kl-sprawdz{background:var(--warn-bg);color:var(--warn);border-color:color-mix(in srgb,var(--warn) 30%,transparent)}
.kl-nie{background:var(--neutral-bg);color:var(--text-2);border-color:var(--border)}
.splitbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 12px}
.splitbar .grow{flex:1}
table.splittab td{vertical-align:middle}
table.splittab td.fname{white-space:normal;overflow-wrap:anywhere;min-width:200px}
table.splittab td.klc{min-width:150px;white-space:normal}
table.splittab td.why{white-space:normal;min-width:260px;max-width:420px}
table.splittab tr.del td,table.splittab tr.skip td{color:var(--text-2)}
table.splittab tr.del td.fname{text-decoration:line-through}
table.splittab td.tcell{width:64px;padding:2px 4px}
table.splittab img.thumb{display:block;width:60px;height:60px;background:var(--paper);border:1px solid var(--border);border-radius:var(--r-1);
  transition:transform .12s;transform-origin:left center;position:relative}
table.splittab img.thumb:hover{transform:scale(3.2);z-index:5;box-shadow:var(--shadow-2)}
table.splittab tr.del img.thumb{opacity:.45}

/* porównanie z FreeCAD (tymczasowe) */
dialog.fcdlg{width:min(1500px,97vw);max-height:94vh}
dialog.fcdlg .dbody{max-height:calc(94vh - 130px)}
.fcverdict{margin:0 0 12px;padding:8px 12px;font-weight:600;border-radius:var(--r-1);border-left:3px solid var(--border-strong);background:var(--sunken)}
.fcverdict:empty{display:none}
.fcverdict.ok{color:var(--ok);background:var(--ok-bg);border-left-color:var(--ok)}
.fcverdict.bad{color:var(--err);background:var(--err-bg);border-left-color:var(--err)}
.fcviews{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fcviews figure{margin:0}
.fcviews figcaption{margin-bottom:6px;font-size:12px;color:var(--text-2)}
.fcsvg{width:100%;height:44vh;border:1px solid var(--border);border-radius:var(--r-2);touch-action:none}
.fctab{width:100%;margin-top:12px;font-size:13px}
.fctab th,.fctab td{text-align:left;padding:5px 10px}
.fctab td.ok{color:var(--ok)} .fctab td.bad{color:var(--err);font-weight:600}
@media (max-width:900px){.fcviews{grid-template-columns:1fr}.fcsvg{height:36vh}}

/* ---------- logowanie / 2FA / zmiana hasła (szablony w webunfold/auth.py) ---------- */
body.login{display:grid;place-items:center;min-height:100vh;padding:24px;background-color:var(--bg);
  background-image:linear-gradient(var(--grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--grid-major) 1px,transparent 1px),
    linear-gradient(var(--grid-minor) 1px,transparent 1px),linear-gradient(90deg,var(--grid-minor) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;background-position:-1px -1px}
.login-card{display:flex;flex-direction:column;gap:14px;width:min(370px,100%);padding:26px 30px 28px;background:var(--surface);
  border:1px solid var(--border);border-top:3px solid var(--acc);border-radius:var(--r-3);box-shadow:var(--shadow-2)}
.login-card .brand-logo{align-self:flex-start;margin-bottom:4px}
.login-card h1{margin:0;font-size:22px;font-weight:600;letter-spacing:-.01em}
.login-card .sub{margin:-10px 0 4px;color:var(--text-2);font-size:13px}
.login-card label{display:flex;flex-direction:column;gap:5px;color:var(--text-2);font-size:12.5px;font-weight:500}
.login-card input{width:100%;min-height:36px;font-size:14px}
.login-card button,.login-card a.button{min-height:38px;font-size:14px;font-weight:600}
.login-card p{margin:0;font-size:13px;line-height:1.5}
.login-card .err{padding:8px 10px 8px 12px;border-left:3px solid var(--err);border-radius:var(--r-1);background:var(--err-bg)}
.login-card .qr{display:grid;place-items:center}
.login-card .qr svg{width:190px;height:190px;background:#FFFFFF;border-radius:var(--r-2);box-shadow:0 0 0 1px var(--border)}
.login-card code{font:13px var(--mono);word-break:break-all}
.login-card .codes{list-style:none;margin:0;padding:10px 12px;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;background:var(--sunken);border:1px solid var(--border);border-radius:var(--r-2)}
.login-card .note{color:var(--text-2);font-size:12.5px}

/* ---------- administracja kontami ---------- */
body.admin{max-width:1180px;margin:0 auto;padding:0 22px 40px}
body.admin header{display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding:14px 0;margin-bottom:6px;border-bottom:1px solid var(--border)}
body.admin header .themectl{margin-left:auto}
body.admin h1{margin:0;font-size:19px;font-weight:600;letter-spacing:-.01em}
body.admin h2{margin:26px 0 10px;font:600 11.5px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
body.admin table{width:100%;border-collapse:collapse;font-size:13px;background:var(--surface);border:1px solid var(--border)}
body.admin th,body.admin td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--border);vertical-align:middle;white-space:normal}
body.admin th{color:var(--text-2);font-weight:600}
body.admin td.act{white-space:nowrap} body.admin td.act button{margin-right:4px}
body.admin .newuser{display:flex;gap:10px;align-items:end;flex-wrap:wrap;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2)}
body.admin .newuser label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;font-weight:500;color:var(--text-2)}
body.admin .secret{margin:12px 0;padding:12px 14px;border:1px solid var(--acc-text);border-left-width:4px;border-radius:var(--r-2);background:var(--acc-soft)}
body.admin .secret code{font:15px var(--mono);user-select:all}
body.admin .off{color:var(--text-2)} body.admin .bad{color:var(--err)}
body.admin #msg p{padding:8px 12px;border-left:3px solid var(--err);background:var(--err-bg);border-radius:var(--r-1)}

/* ---------- responsywność ---------- */
@media (max-width:1360px){ .apptitle .sub{display:none} }
@media (max-width:1200px){
  body.app{grid-template-columns:1fr;grid-template-rows:auto auto auto;height:auto}
  header.topbar{flex-wrap:wrap}
  aside{border-right:0;border-bottom:1px solid var(--border)} #tree{max-height:40vh}
  main{grid-template-columns:1fr;grid-template-rows:auto} .bottom{grid-template-columns:1fr}
  .view{min-height:360px} .gutter{display:none}
}
@media (max-width:640px){
  .brand-logo,.brand-sep{display:none}
  .view h2 .vhint{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}