@font-face {
  font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("fonts/plus-jakarta-sans-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url("fonts/jetbrains-mono-latin-ext-500-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url("fonts/jetbrains-mono-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}





:root {
  
  --ink:        #0F0E0C;   
  --ink-2:      #2A2723;   
  --ink-3:      #5C564E;   
  --ink-4:      #8A8378;   

  --bone:       #F4F0EA;   
  --bone-rgb:   244, 240, 234;   
  --paper:      #FAF7F2;   
  --linen:      #ECE5DA;   
  --stone:      #D9D1C2;   
  --plaster:    #C8BFB1;   

  
  --walnut:     #5A3E2B;   
  --clay:       #B85C3E;   
  --clay-soft:  #E5C0AE;   
  --sage:       #6B7B5C;   
  --brass:      #B0935C;   
  --ochre:      #D4A24C;   

  
  --shp-1:      #2E65A0;   
  --shp-2:      #08796F;   
  --shp-3:      #657556;   
  --shp-4:      #554674;   
  --shp-5:      #934566;   

  
  --clay-deep:  #833921;
  --ochre-soft: #E5D7C2;
  --ochre-deep: #70521C;
  --sage-soft:  #D2DEC8;
  --sage-deep:  #46523A;
  --patina:     #167F75;   
  --patina-soft: #C3E0DC;
  --patina-deep: #00544D;
  --cobalt:     #346BA6;   
  --cobalt-soft: #CADBEE;
  --cobalt-deep: #164472;
  --plum:       #5B4B7A;   
  --plum-soft:  #DCD5EC;
  --plum-deep:  #35284C;
  --heather:    #994B6C;   
  --heather-soft: #ECD1DA;
  --heather-deep: #672A45;
  --ash:        #96928A;   

  
  --kanwa:      #D5D8DC;
  --sel:        #FFE600;
  
  --blad:       #B3122B;
  
  --material:   #FAF7F2;
  
  --bryla-material:  var(--material);
  --bryla-obrobione: var(--plaster);
  
  --hover:      #C5BDAC;

  
  --bg:           var(--bone);
  --bg-elevated:  var(--paper);
  --bg-sunken:    var(--linen);
  --fg:           var(--ink);
  --fg-muted:     var(--ink-3);
  --fg-subtle:    var(--ink-4);
  --border:       #DCD3C2;
  --border-strong: #0F0E0C;
  --accent:       var(--clay);
  --accent-fg:    #FFFFFF;

  
  --font-display: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;

  
  --brand-tracking:  -0.055em;
  --font-serif:   "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fs-overline: 0.6875rem;  
  --fs-caption:  0.75rem;    
  --fs-opis:     0.8125rem;  
  --fs-small:    0.875rem;   
  --fs-body:     1rem;       
  --fs-lead:     1.125rem;   
  --fs-h6:       1.25rem;    
  --fs-h5:       1.5rem;     
  --fs-h4:       2rem;       
  --fs-h3:       2.75rem;    
  --fs-h2:       3.75rem;    
  --fs-h1:       5.5rem;     
  --fs-display:  8.5rem;     

  --tracking-tight:  -0.03em;
  --tracking-snug:   -0.015em;
  --tracking-normal: 0;
  --tracking-wide:    0.04em;
  --tracking-caps:    0.14em;

  --leading-tight: 0.95;
  --leading-snug:  1.05;
  --leading-body:  1.5;
  --leading-loose: 1.7;

  
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-8:  32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;
  --s-24: 96px;
  --s-32: 128px;
  --s-40: 160px;

  
  --r-0:   0px;     
  --r-1:   2px;
  --r-2:   4px;
  --r-3:   8px;
  --r-4:   14px;
  --r-pill: 999px;
  --r-circle: 50%;

  
  --shadow-1: 0 1px 0 rgba(15,14,12,0.04), 0 1px 2px rgba(15,14,12,0.05);
  --shadow-2: 0 2px 4px rgba(15,14,12,0.06), 0 8px 16px rgba(15,14,12,0.05);
  --shadow-3: 0 8px 16px rgba(15,14,12,0.08), 0 24px 48px rgba(15,14,12,0.08);
  --shadow-inset: inset 0 0 0 1px var(--border);
  --shadow-architectural: 1px 1px 0 var(--ink); 
  
  --fokus-poswiata: 0 0 6px 1px;
  --fokus-krycie:   45%;

  
  --ease-out:    cubic-bezier(0.2, 0.7, 0.2, 1);   
  --ease-in-out: cubic-bezier(0.6, 0.05, 0.2, 1);  
  --dur-fast:    140ms;  
  --dur-base:    220ms;  
  --dur-slow:    420ms;  
}


html, body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.display, h1.display, .brand-display {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--fs-display);
  line-height: var(--leading-tight);
  letter-spacing: var(--brand-tracking);
}


h1 { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-h1); line-height: var(--leading-tight);  letter-spacing: var(--brand-tracking);  margin: 0; }
h2 { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-h2); line-height: var(--leading-snug);   letter-spacing: var(--brand-tracking);  margin: 0; }
h3 { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-h3); line-height: var(--leading-snug);   letter-spacing: -0.04em;                margin: 0; }
h4 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-h4); line-height: 1.15;                  letter-spacing: var(--tracking-snug);   margin: 0; }
h5 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-h5); line-height: 1.25;                  letter-spacing: var(--tracking-snug);   margin: 0; }
h6 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h6); line-height: 1.3;                                                           margin: 0; }

.editorial,
.serif {
  font-family: var(--font-serif);
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0;
}

.overline {
  font-family: var(--font-body);
  font-size: var(--fs-overline);
  font-weight: 600;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--fg-muted);
}

p, .body { font-size: var(--fs-body); line-height: var(--leading-body); }
.lead    { font-size: var(--fs-lead); line-height: var(--leading-loose); color: var(--ink-2); }
.small   { font-size: var(--fs-small); }
.caption { font-size: var(--fs-caption); color: var(--fg-muted); }
.mono    { font-family: var(--font-mono); font-size: 0.85em; letter-spacing: -0.01em; }


a { color: var(--ink); text-decoration: none; border-bottom: 1px solid currentColor; transition: color var(--dur-fast) var(--ease-out); }
a:hover { color: var(--clay); }


@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .panel,
  html:not([data-theme="light"]) .cv-bar,
  html:not([data-theme="light"]) .cv-wrap,
  html:not([data-theme="light"]) #toast,
  html:not([data-theme="light"]) #pieceTip {
    --ink:        #F0EFEC;
    --ink-2:      #D2C8B8;
    --ink-3:      #9B9182;
    --ink-4:      #8C8171;

    --bone:       #151515;
    --bone-rgb:   21, 21, 21;
    --paper:      #1B1B1B;
    --linen:      #222222;
    --stone:      #2C2C2C;
    --plaster:    #3A3A3A;

    --walnut:     #B4885F;
    --clay:       #D97C55;
    --clay-soft:  #4A2E22;
    --sage:       #8FA47C;
    --brass:      #C7A968;
    --ochre:      #E3B15C;
    --shp-1:      #64A3E6;
    --shp-2:      #51B5A9;
    --shp-3:      #9BB188;
    --shp-4:      #8874B3;
    --shp-5:      #D97DA2;
    --clay-deep:  #D97C55;
    --ochre-soft: #3A2B12;
    --ochre-deep: #E3B15C;
    --sage-soft:  #26321A;
    --sage-deep:  #8FA47C;
    --patina:     #43A89D;
    --patina-soft: #0C3531;
    --patina-deep: #43A89D;
    --cobalt:     #5896D9;
    --cobalt-soft: #1D2F44;
    --cobalt-deep: #5896D9;
    --plum:       #7C68A6;
    --plum-soft:  #312941;
    --plum-deep:  #7C68A6;
    --heather:    #CB7196;
    --heather-soft: #40242F;
    --heather-deep: #CB7196;
    --ash:        #A8A399;
    --kanwa:      #1E2125;
    --blad:       #FF4D5E;   
    --material:   #34312C;
    --bryla-material:  #6E685F;
    --bryla-obrobione: #4A4640;
    --hover:      #3D3D3D;

    --border:        #2A2A2A;
    --border-strong: #F0EFEC;

    --shadow-1: 0 1px 0 rgba(0,0,0,0.24), 0 1px 2px rgba(0,0,0,0.28);
    --shadow-2: 0 2px 4px rgba(0,0,0,0.30), 0 8px 16px rgba(0,0,0,0.28);
    --shadow-3: 0 8px 16px rgba(0,0,0,0.34), 0 24px 48px rgba(0,0,0,0.34);
  }
}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .cv-bar,
html[data-theme="dark"] .cv-wrap,
html[data-theme="dark"] #toast,
html[data-theme="dark"] #pieceTip {
  --ink:        #F0EFEC;
  --ink-2:      #D2C8B8;
  --ink-3:      #9B9182;
  --ink-4:      #8C8171;

  --bone:       #151515;
  --bone-rgb:   21, 21, 21;
  --paper:      #1B1B1B;
  --linen:      #222222;
  --stone:      #2C2C2C;
  --plaster:    #3A3A3A;

  --walnut:     #B4885F;
  --clay:       #D97C55;
  --clay-soft:  #4A2E22;
  --sage:       #8FA47C;
  --brass:      #C7A968;
  --ochre:      #E3B15C;
  --shp-1:      #64A3E6;
  --shp-2:      #51B5A9;
  --shp-3:      #9BB188;
  --shp-4:      #8874B3;
  --shp-5:      #D97DA2;
  --clay-deep:  #D97C55;
  --ochre-soft: #3A2B12;
  --ochre-deep: #E3B15C;
  --sage-soft:  #26321A;
  --sage-deep:  #8FA47C;
  --patina:     #43A89D;
  --patina-soft: #0C3531;
  --patina-deep: #43A89D;
  --cobalt:     #5896D9;
  --cobalt-soft: #1D2F44;
  --cobalt-deep: #5896D9;
  --plum:       #7C68A6;
  --plum-soft:  #312941;
  --plum-deep:  #7C68A6;
  --heather:    #CB7196;
  --heather-soft: #40242F;
  --heather-deep: #CB7196;
  --ash:        #A8A399;
  --kanwa:      #1E2125;
  --blad:       #FF4D5E;
  --material:   #34312C;
  --bryla-material:  #6E685F;
  --bryla-obrobione: #4A4640;
  --hover:      #3D3D3D;

  --border:        #2A2A2A;
  --border-strong: #F0EFEC;

  --shadow-1: 0 1px 0 rgba(0,0,0,0.24), 0 1px 2px rgba(0,0,0,0.28);
  --shadow-2: 0 2px 4px rgba(0,0,0,0.30), 0 8px 16px rgba(0,0,0,0.28);
  --shadow-3: 0 8px 16px rgba(0,0,0,0.34), 0 24px 48px rgba(0,0,0,0.34);
}




.panel, .cv-bar, .cv-wrap, #toast, #pieceTip,
.panel *, .cv-bar *, .cv-wrap *, #toast *, #pieceTip * { box-sizing: border-box; }



.panel { background: var(--paper); border: 1px solid var(--border); padding: 24px; position: sticky; top: 111px; z-index: 35; }

#drop {
  border: 1.5px dashed var(--plaster); background: var(--bone);
  padding: 18px 16px; text-align: center; color: var(--ink-3);
  cursor: pointer; transition: border-color var(--dur-fast) var(--ease-out);
  font-size: 14px;
}
#drop.hover, #drop:hover { border-color: var(--clay); color: var(--ink); }
#drop b { color: var(--ink); }

.field { display: grid; gap: 8px; margin-top: 18px; min-width: 0; }

.field[hidden], .row2[hidden] { display: none; }
.field label, .row2 label {
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption);
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
  line-height: 1.35;
}
.field input, .row2 input, .field textarea {
  font-family: var(--font-body); font-size: 15px; color: var(--ink);
  background: var(--bone); padding: 12px 13px; width: 100%; min-width: 0;
}

.field textarea { font-family: var(--font-mono); font-size: var(--fs-small); resize: vertical; }

.gcode-tpl {
  background: var(--linen); border: 1px solid var(--border); border-radius: 10px;
  padding: 16px; margin-top: 8px; display: grid; gap: 14px;
}
.gcode-tpl .field { margin-top: 0; }
.gcode-tpl textarea { background: var(--paper); }
.gcode-tpl .mag-note { margin: 0; }

.mag-note code {
  font-family: var(--font-mono); font-size: var(--fs-opis); color: var(--ink);
  background: var(--clay-soft); border-radius: 4px; padding: 1px 5px;
}

.row2 {
  display: grid; grid-template-columns: 1fr 1fr; grid-auto-flow: row;
  gap: 8px 14px; margin-top: 18px; align-items: end;
}


.panel label.check {
  display: flex; align-items: flex-start; gap: 8px;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-small);
  letter-spacing: 0; text-transform: none; color: var(--ink-2);
  line-height: 1.4; cursor: pointer; user-select: none;
}
.panel label.check[hidden] { display: none; }   
.check input {
  width: 15px; height: 15px; min-width: 15px; margin: 1px 0 0;
  accent-color: var(--clay); cursor: pointer;
}
.row2 .check { grid-column: 2; align-self: start; }

.panel > .check, .sec > .check, #magBody > .check, #kalibBox > .check, #kalibBox > [role="radiogroup"] > .check { margin-top: 16px; }

.panel label.check:has(input:disabled) { color: var(--ink-3); cursor: default; }

details { margin-top: 18px; }
summary { cursor: pointer; font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); }


.sec { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.sec > summary {
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption);
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-2);
  display: flex; align-items: baseline; gap: 9px;
  list-style: none;   
}
.sec > summary::-webkit-details-marker { display: none; }
.sec > summary::before { content: "\25B8"; font-size: var(--fs-caption); color: var(--ink-4); }
.sec[open] > summary::before { content: "\25BE"; }
.sec > summary:hover { color: var(--ink); }

.sec > summary .nm {
  font-weight: 500; font-size: var(--fs-small); letter-spacing: 0.02em;
  text-transform: none; color: var(--ink-3); min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.sec > .field:first-of-type, .sec > .row2:first-of-type { margin-top: 14px; }


.nb { white-space: nowrap; }   
.hint {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; border-radius: 50%;
  border: 1px solid var(--plaster); color: var(--ink-4);
  font-size: var(--fs-caption); font-weight: 600; cursor: help; position: relative;
  margin-left: 7px; letter-spacing: 0; text-transform: none; vertical-align: middle;
}
.hint:hover, .hint:focus-visible { border-color: var(--clay); color: var(--clay); outline: none; }
.hint::after {
  content: attr(data-tip); position: absolute;
  bottom: calc(100% + 9px); left: -10px;
  width: min(250px, 74vw);
  background: var(--ink); color: var(--bone);
  font-family: var(--font-body); font-weight: 400; font-size: var(--fs-opis); line-height: 1.5;
  letter-spacing: 0; text-transform: none;
  white-space: normal;   
  padding: 10px 12px; box-shadow: var(--shadow-3);
  opacity: 0; transform: translateY(4px); pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
  z-index: 40;
}
.hint:hover::after, .hint:focus-visible::after { opacity: 1; transform: translateY(0); }

.check .hint::after { left: auto; right: -10px; }


.panel :focus-visible, .pop :focus-visible {
  outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 6px;
}


:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea) {
  border: 1px solid var(--ink-4); border-radius: var(--r-0); outline: none;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select) { height: var(--s-8); }
:where(select) { padding-right: 28px; }   
:where(input, textarea)::placeholder { color: var(--ink-3); }
:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea):hover { border-color: var(--ink-3); }
:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea):focus {
  border-color: var(--cobalt); outline: none; border-radius: var(--r-0);
  box-shadow: 0 0 0 1px var(--cobalt), var(--fokus-poswiata) color-mix(in srgb, var(--cobalt) var(--fokus-krycie), transparent);
}
:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea)[aria-invalid="true"] { border-color: var(--clay); }
:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea)[aria-invalid="true"]:focus {
  box-shadow: 0 0 0 1px var(--clay), var(--fokus-poswiata) color-mix(in srgb, var(--clay) var(--fokus-krycie), transparent);
}
:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea):disabled { border-color: var(--border); background: var(--linen); color: var(--ink-3); cursor: not-allowed; box-shadow: none; }


.btn-mini {
  
  min-height: 32px;
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-small);
  letter-spacing: 0.02em; padding: 6px 10px; cursor: pointer;
  border: 1px solid var(--border); background: none; color: var(--ink-2);
  border-radius: 8px; transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.btn-mini:hover { border-color: var(--ink); color: var(--ink); }

.btn-mini.on { background: var(--clay); border-color: var(--clay); color: var(--bone); }

.btn-mini:disabled {
  opacity: 0.45; cursor: not-allowed; border-color: var(--linen); color: var(--ink-3);
}
.btn-mini:disabled:hover { border-color: var(--linen); color: var(--ink-3); }

.btn-mini[aria-disabled="true"], .btn-mini[aria-disabled="true"]:hover { opacity: 0.45; border-color: var(--linen); color: var(--ink-3); cursor: default; }

.btn-mini.primary { background: var(--ink); border-color: var(--ink); color: var(--bone); }

.btn-mini.ghost { border-color: transparent; color: var(--ink-3); }
.btn-mini.ghost:hover { border-color: var(--border); color: var(--ink); }
.btn-mini.primary:hover { background: var(--ink-2); border-color: var(--ink-2); color: var(--bone); }
.btn-mini.on:hover { color: var(--bone); }

.mag-row {
  display: flex; align-items: center; gap: 8px; margin-top: 8px; min-width: 0;
  flex-wrap: wrap;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2);
}
.mag-row b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mag-row > span { color: var(--ink-3); margin-right: auto; min-width: 0; }
.mag-row .btn-mini { flex-shrink: 0; }

.mag-btns { display: flex; gap: 8px; flex-shrink: 0; margin-right: 0 !important; }
.mag-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.mag-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 16px; font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption);
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
}
.mag-grid {
  display: grid; grid-template-columns: 1fr 76px 76px; gap: 6px 8px; margin-top: 8px;
  align-items: center; font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2);
}

.mag-grid .mag-sug { display: block; font-size: var(--fs-caption); color: var(--ink-3); }
.mag-grid .mag-sug[hidden] { display: none; }
#mfChipPosuw { margin: var(--s-2) 0 0; font-size: var(--fs-opis); }
.mag-grid input, #magBody select, #magBody .mag-row input[type="text"],
#presetBar select, #presetBar input[type="text"],
#machBar select, #machBar input[type="text"], #shpWarstwaPole select {
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
  background: var(--bone); padding: 7px 8px; min-width: 0; max-width: 100%;
}

#magBody select, #presetBar select, #machBar select, #matBox select { padding-right: 28px; }
#matBox select {
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
  background: var(--bone); padding: 7px 28px 7px 8px; flex: 1; min-width: 150px;
}
#matBox .mag-row:first-child { margin-top: 14px; }

#presetBar .mag-row select, #presetBar .mag-row input[type="text"],
#machBar .mag-row select, #machBar .mag-row input[type="text"],
#magBody .mag-row select, #magBody .mag-row input[type="text"] {
  flex: 1; min-width: 150px;
}

.mag-form {
  margin: 4px 0 10px 4px; padding: 12px;
  border: 1px dashed var(--border); border-radius: 8px; background: var(--bone);
}

#magBody .mag-form input:not([type="checkbox"]), #magBody .mag-form select {
  background: var(--paper);
}

.nrz-edyt .mag-form {
  margin: 0; padding: 2px 12px 12px; border: 0; background: none;
}
.mag-note { font-family: var(--font-body); font-size: var(--fs-opis); color: var(--ink-3); margin: 14px 0 0; line-height: 1.5; }

#shpGeomBox[data-polecenie] #shpHelp, #shpGeomBox[data-polecenie] #shpPolyHelp, #shpGeomBox[data-wskaz] #shpPolyHelp { display: none; }

#shpGeomBox.shp-grupa-wym > :not(#shpPomocPol) { display: none; }

#shpGumPola { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--s-2); align-items: center; }
#shpGumPola label.shp-gb-tyt { grid-column: 1 / -1; align-items: center; justify-content: flex-start; }
#shpGumPola label.shp-gb-tyt .nb { margin-left: 0; }   
#shpGumPola label.shp-gb-os { display: flex; align-items: center; justify-content: flex-start; column-gap: var(--s-1); }
#shpGumPola label.shp-gb-os input { flex: 1; min-width: 0; width: auto; }
#shpGumPola label.shp-gb-z { grid-column: 1; }
#shpGumPola[hidden], #shpGumPola:not(.shp-gb-3d) .shp-gb-z { display: none; }
#shpPomocPol strong { color: var(--ink-2); font-weight: 600; }
.mag-note[hidden] { display: none; }

#fMaxWarn { color: var(--clay); }



#magBody, .pick {
  --c-dia: 48px; --c-z: 16px; --c-t: 26px; --c-gap: 10px; --c-pad: 26px;
}

.tbar { margin-top: 10px; }
#magQ, .pop-q {
  width: 100%; font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
  background: var(--bone); padding: 7px 8px; min-width: 0;
}
.shapebar { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.shapebar[hidden] { display: none; }

#shapeBox:not(.shp-kieszen) .shp-tylko-kieszen, #shapeBox.shp-kieszen .shp-tylko-profil { display: none; }

#wcSideDrawer[data-zakladka="narzedzia"] #shapeBox { display: none; }

#shapeBox:not(.shp-faza) .shp-tylko-faza, #shapeBox.shp-faza .shp-bez-fazy { display: none; }

#shapeBox:not(.shp-grawer) .shp-tylko-grawer, #shapeBox.shp-grawer .shp-bez-grawera { display: none; }

#shapeBox:not(.shp-gobszaru) .shp-tylko-gobszaru { display: none; }
#shapeBox.shp-gobszaru #shpOpBox > :not(.shp-vc-tak):not(.shp-tylko-gobszaru) { display: none; }

#shapeBox:not(.shp-kieszen):not(.shp-planowanie) .shp-kiesz-plan,
#shapeBox:not(.shp-planowanie) .shp-tylko-plan,
#shapeBox.shp-planowanie .shp-tylko-profil, #shapeBox.shp-planowanie .shp-bez-plan { display: none; }

#shapeBox.shp-wspolna .shp-bez-wsp, #shapeBox:not(.shp-wspolna) .shp-tylko-wsp { display: none; }
#shapeBox.shp-planowanie .shp-kiesz-plan, #shapeBox.shp-planowanie .shp-krokz-wiersz { grid-template-columns: 1fr; }

.shapebar.shp-otwarta .shp-s[data-side="in"] { order: -1; }

#shapeBox.shp-wiercenie .shp-frez { display: none; }

#shapeBox.shp-zmierz > :not(#shpPomiar) { display: none !important; }
#shpPomiar[hidden] { display: none; }
#shpPomiar .wc-grpl { margin: 16px 0 10px; font-size: var(--fs-opis); }
#shpPomiar .wc-kr-sum { grid-template-columns: 88px minmax(0, 1fr) auto; column-gap: 8px; }
#shpPomiar .wc-kr-sum dt { font-size: var(--fs-small); line-height: 1.5; }
#shpPomiar .wc-kr-sum dd { font: 500 var(--fs-body)/1.35 var(--font-mono); letter-spacing: -0.01em; overflow-wrap: anywhere; }
#shpPomiar .wc-kr-sum dd small { font-family: var(--font-body); font-size: var(--fs-opis); margin-top: 2px; }
#shpPomiar .mag-note { margin: 12px 0 0; }

.shp-wlasc { border: 0; margin: 0; padding: 0; min-width: 0; }
.shp-wlasc:disabled { opacity: 0.45; }
#shapeBox.shp-wiercenie .shp-frez-wiersz { grid-template-columns: 1fr; }
.sbtn {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2);
  background: none; border: 1px solid var(--border); border-radius: 8px;
  padding: 4px 8px;
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out),
    background var(--dur-fast) var(--ease-out);
}
.sbtn svg { display: block; }
.sbtn:hover { border-color: var(--ink); color: var(--ink); }
.sbtn[aria-pressed="true"] { background: var(--clay); border-color: var(--clay); color: var(--bone); }

.shp-wylot-linia { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-top: 8px; }
.shp-wylot-stan { font-family: var(--font-body); font-size: var(--fs-opis); line-height: 1.5; color: var(--ink-3); }
.shp-wylot-stan.shp-wylot-brak { color: var(--ink-2); }

.shp-wylot-stan.shp-wylot-wl { color: var(--ink-2); font-weight: 600; }
.sbtn[aria-disabled="true"] { color: var(--ink-3); background: var(--linen); border-color: var(--border); cursor: default; }

.shp-wylot-gr { display: inline-flex; align-items: center; gap: var(--s-2); font: 500 var(--fs-small)/1.35 var(--font-body); color: var(--ink-2); }
.shp-wylot-gr[hidden] { display: none; }
.shp-wylot-gr input { width: 84px; min-width: 0; padding: 6px 8px; font-family: var(--font-mono); font-size: var(--fs-small); color: var(--ink); background: var(--bone); }
.shp-wylot-gr .nb { font-weight: 400; font-size: var(--fs-caption); color: var(--ink-3); }
.shp-wylot .row2, .shp-wylot .check { margin-top: 8px; }

#shpDnoBox { margin-top: 10px; }
#shpCzubek .btn-mini { margin-left: 4px; }

.shp-list { display: flex; flex-direction: column; margin-top: 8px; }

.wc-ops .wc-scrollpane { -webkit-user-select: none; user-select: none; }
.wc-ops .wc-scrollpane :is(input, textarea) { -webkit-user-select: text; user-select: text; }

.shp-row { font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2); cursor: pointer; }

.shp-list .shp-row[data-id] { content-visibility: auto; contain-intrinsic-size: auto 30px; }
.ot-g, .ot-o { display: grid; align-items: center; gap: 6px; min-height: 30px; white-space: nowrap; min-width: 0; }
.ot-g { grid-template-columns: 14px 14px minmax(0, 1fr) auto auto auto; padding: 0 0 0 2px; color: var(--ink); }
.ot-g:hover, .ot-o:hover { background: var(--bone); }
.ot-g .ot-n { font-weight: 600; }
.ot-c {
  display: grid; place-items: center; width: 14px; height: 14px; padding: 0;
  background: none; border: none; cursor: pointer; color: var(--ink-3);
}
.ot-c:hover, .ot-c:focus-visible { color: var(--ink); }
.ot-kids { margin-left: 8px; border-left: 1px solid var(--border); }
.shp-row.ot-zw .ot-kids { display: none; }
.ot-o { grid-template-columns: 16px 14px minmax(0, 1fr) auto; padding: 0 6px 0 4px; }
.ot-o .ik { color: var(--ink-3); }
.ot-no { font: 500 var(--fs-caption) var(--font-mono); color: var(--ink-3); text-align: right; }   
.ot-n { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ot-n small { color: var(--ink-3); font-size: var(--fs-caption); margin-left: 4px; }
.ot-t { font: 500 var(--fs-caption) var(--font-mono); color: var(--clay-deep); }   

.ot-n.ot-n-poza { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 6px; text-overflow: clip; white-space: normal; padding: 3px 0; }
.ot-poza { flex: 0 1 auto; min-width: min-content; font-weight: 600; font-size: var(--fs-caption); line-height: 1.25; color: var(--ochre-deep); }
.ot-n-t { flex: 1 0 5em; min-width: 5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.shp-list .ot-o { grid-template-columns: 16px 14px minmax(0, 1fr) auto auto; padding-right: 0; }

.shp-list .ot-o.ot-o-kolor { grid-template-columns: 16px 14px minmax(0, 1fr) auto 18px auto; }
.ot-kolor { display: grid; place-items: center; width: 24px; height: 24px; margin: 0 -3px; padding: 0; border: 0; border-radius: 4px; background: transparent; cursor: pointer; }
.ot-kolor::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--c, var(--ink-3)); }
.ot-kolor:hover { background: var(--linen); }
.ot-kolor:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.ot-kolor-kr { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--c, var(--ink-3)); flex: none; }
.shp-list .ot-o .shp-ico-del { visibility: hidden; }
.shp-list .ot-o:hover .shp-ico-del, .shp-list .ot-o:focus-within .shp-ico-del, .shp-list .ot-o[data-wyb] .shp-ico-del { visibility: visible; }

.shp-row[data-czesc="op"] .ot-o[data-wyb], .shp-row[data-czesc="ksztalt"] .ot-g { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); color: var(--ink); }
.shp-row[data-czesc="op"] .ot-o[data-wyb] .ik { color: var(--ink); }

.shp-row.ot-zw[aria-current="true"] .ot-g, .shp-row.ot-zw[data-czesc="op"] .ot-g { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); }

.shp-row.shp-row-dod .ot-g { box-shadow: inset 2px 0 0 var(--clay); }

.shp-kontekst { display: grid; gap: 6px; margin-bottom: 10px; }
.shp-kontekst[hidden], .shp-kops[hidden] { display: none; }

.shp-box { margin: 0; }

.shp-kontekst:has(~ .shp-box:not([hidden])) { margin-bottom: 0; }

.shp-plik-dol:not(:has(.file-blk)), .shp-proj .shp-plik-dol { display: none; }
.shp-box[hidden] { display: none; }
.shp-box-tyt.ot-gr { margin: 0 0 var(--s-1); padding: 0 4px; border-top: 0; }   
.shp-box-tyt .ot-n { white-space: normal; text-overflow: clip; }   
.shp-box-tyt .ot-n small { margin-left: 6px; }
#shpBoxTresc[hidden] { display: none; }
.shp-box-tyt[aria-disabled="true"] { cursor: default; }
.shp-box-tyt[aria-disabled="true"]:hover { background: none; }
.shp-box-tyt[aria-disabled="true"] .ik { color: var(--ink-4); }
.shp-box-tyt[aria-disabled="true"] .ot-n { color: var(--ink-3); }
.shp-box-siatka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-1) var(--s-2); align-items: center; }
.shp-box-siatka .shp-box-w { grid-column: 1 / -1; margin: var(--s-2) 0 0; }
.shp-box-os { text-align: center; font: 500 var(--fs-small)/1.35 var(--font-body); color: var(--ink-2); }
.shp-box-siatka input { min-width: 0; width: 100%; padding: 0 9px; background: var(--bone); color: var(--ink); font: 500 var(--fs-small) var(--font-mono); }   
.shp-box .check { margin-top: var(--s-2); }
.shp-box-siatka .pole-blad { grid-column: 1 / -1; }
#shpBoxNota { margin: var(--s-1) 0 0; }
.shp-box-akcje { display: flex; gap: var(--s-2); margin: var(--s-2) 0 0; }
#shpWlasc.shp-box-on #shpRect, #shpWlasc.shp-box-on #shpCircle, #shpWlasc.shp-box-on #shpPoint { display: none; }
.shp-krz-opcje:not(:has(> :not([hidden]))) { display: none; }   
.shp-crumb {
  display: flex; align-items: center; gap: 6px; justify-self: start; padding: 0;
  background: none; border: none; cursor: pointer;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-3);
}
.shp-crumb:hover, .shp-crumb:focus-visible { color: var(--ink); }
.shp-ophead { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.shp-ophead .ik { align-self: center; color: var(--ink-3); flex: 0 0 auto; }
.shp-ophead .no { font: 500 var(--fs-small) var(--font-mono); color: var(--ink-3); }
.shp-szkic-head { margin: 14px 0 10px; }
.shp-szkic-head .no { margin-left: auto; }
.shp-ophead h5 { font-size: 17px; font-weight: 800; letter-spacing: -0.02em; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.shp-op-del {
  margin-left: auto; padding: 0; background: none; border: none; cursor: pointer;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-3);
}
.shp-op-del:hover, .shp-op-del:focus-visible { color: var(--clay); }
.shp-kops { display: grid; gap: 4px; margin: 10px 0; }
.shp-kops .ot-o {
  width: 100%; border: none; background: none; cursor: pointer; text-align: left;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2);
}

.shp-kops .ot-o:has(.shp-ico-del) { grid-template-columns: 16px 14px minmax(0, 1fr) auto auto; padding-right: 0; }
.shp-kops .ot-o .shp-ico-del { color: var(--ink-2); }   
.shp-kops .ot-o .shp-ico-del .ik { color: inherit; }
.shp-kops .ot-o .shp-ico-del:hover, .shp-kops .ot-o .shp-ico-del:focus-visible { color: var(--clay); }
.shp-kops .ot-o[role="button"]:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }

.shp-kolor label { display: flex; gap: 6px; align-items: baseline; }
.shp-kolor-n { margin-left: auto; font: 500 var(--fs-opis) var(--font-mono); color: var(--ink-3); }
.shp-sw-rz { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.shp-sw {
  width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--border); background: var(--paper);
  padding: 0; cursor: pointer; display: grid; place-items: center; position: relative; overflow: hidden;
  color: var(--ink-2); font: 500 14px/1 var(--font-body);
}
.shp-sw::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--c); }
.shp-sw[aria-checked="true"] { box-shadow: 0 0 0 2px var(--paper), 0 0 0 3.5px var(--ink); }
.shp-sw:focus-visible { outline: 2px solid var(--clay); outline-offset: 2px; }
.shp-sw-plus {
  border-style: dashed; font-size: 0;
  
  background: linear-gradient(var(--ink-2), var(--ink-2)) center / 10px 1.5px no-repeat,
              linear-gradient(var(--ink-2), var(--ink-2)) center / 1.5px 10px no-repeat, var(--paper);
}
.shp-sw-plus::before { display: none; }
.shp-sw-plus[aria-expanded="true"] { border-style: solid; border-color: var(--ink); color: var(--ink); }

.kpk { display: grid; gap: 10px; margin-top: 8px; }
.kpk-h { display: flex; align-items: baseline; gap: 12px; font: 500 var(--fs-caption) var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.kpk-wr { font: 500 var(--fs-small) var(--font-body); letter-spacing: 0; text-transform: none; color: var(--ink-2); background: none; border: 0; padding: 0; cursor: pointer; }
.kpk-wr:hover { color: var(--ink); }
.kpk-sv, .kpk-bar { position: relative; cursor: crosshair; touch-action: none; }
.kpk-sv canvas, .kpk-bar canvas { display: block; width: 100%; border: 1px solid var(--border); background: none; }
.kpk-sv canvas { height: 140px; }
.kpk-bar canvas { height: 12px; }
.kpk-sv i { position: absolute; width: 14px; height: 14px; border-radius: 50%; margin: -7px 0 0 -7px; box-shadow: 0 0 0 2px var(--paper), 0 0 0 3.5px var(--ink); pointer-events: none; }
.kpk-bar i { position: absolute; top: -3px; width: 6px; height: 18px; margin-left: -3px; background: var(--paper); border: 1.5px solid var(--ink); pointer-events: none; }
.kpk-rz { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 8px; }
.kpk-rz label { margin: 0; }
.kpk-rz input { font-family: var(--font-mono); text-transform: uppercase; }

.kpk-ost { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px; }
.kpk-ost label { margin: 0; }
.kpk-ost .shp-sw-rz { margin: 0; }

.kpk-ost .shp-sw::before { box-shadow: inset 0 0 0 1px var(--ink-4); }
.kpk-pr { display: flex; border: 1px solid var(--border); }
.kpk-pr b { width: 22px; height: 22px; }
.kpk-t { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font: var(--fs-small) var(--font-body); color: var(--ink-2); }
.kpk-t li { display: grid; grid-template-columns: minmax(0, 1fr) auto 72px; gap: 8px; align-items: baseline; }
.kpk-t b { font: 500 var(--fs-small) var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kpk-t b.kpk-ok { color: var(--ink); }
.kpk-t b.kpk-nie { color: var(--clay); }
.kpk-t small { font: var(--fs-opis) var(--font-mono); color: var(--ink-3); text-align: right; white-space: nowrap; }
.kpk-u { margin: 0; }
.kpk-u[hidden], .shp-kops[hidden] { display: none; }
.kpk-b { display: flex; justify-content: flex-end; gap: 6px; }
.shp-kolor-uwaga { margin: 2px 0 0; }
.shp-kolor[hidden] { display: none; }

.shp-kropka { display: none; width: 9px; height: 9px; border-radius: 50%; justify-self: center; background: var(--c, transparent); }

.shp-dodaj-op {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; margin: 8px 0 4px;
}

.ot-o.ot-bez .ot-n { font-style: italic; color: var(--ink-3); }
.shp-bez-op { justify-self: start; }

.shp-grupa-op { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin: 8px 0 4px; }

.shp-grupa-op.shp-po-op { margin-bottom: var(--s-4); }
.shp-grupa-op[hidden] { display: none; }

.ot-o.ot-niepas .ot-n small { color: var(--ochre-deep); font-style: normal; }

.ot-o.ot-wyspa .ot-n { color: var(--ink-3); }
.shp-wyspy { margin-bottom: 14px; }
.shp-wyspy[hidden] { display: none; }
.shp-wyspy .check { margin: 6px 0; }
.shp-wyspy .shp-wyspa-uw { margin: 2px 0 6px 24px; }

.shp-wyspy .shp-wyspa-ukryta { font-size: var(--fs-opis); color: var(--ink-3); }

#shpGenWarn { margin: 0 0 12px; }
#shpPas > .mag-warn { margin: 0 0 var(--s-2); }   
#shpPas:has(> :not([hidden])) { margin-top: var(--s-2); }
.shp-row.shp-drag-over { box-shadow: inset 0 0 0 1px var(--ink); }

.ot-widok { padding: 4px 16px 6px; background: var(--paper); }

.ot-gora { position: sticky; top: -6px; z-index: 2; background: var(--paper); }
#shpMatKarta:not(:empty) { padding: var(--s-2) var(--s-4) 0; }
#shpMatKarta:not(:empty) + .ot-widok { padding-top: var(--s-2); }
.shp-mat { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 0 var(--s-3); align-items: center; padding: var(--s-2);
  background: var(--material); border: 1px solid var(--ink-3); border-radius: var(--r-2); cursor: pointer; color: var(--ink); font-family: var(--font-body); }
.shp-mat:hover { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.shp-mat:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.shp-mat[aria-current="true"] { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); }
.shp-mat[aria-current="true"]:hover { box-shadow: inset 2px 0 0 var(--clay), inset 0 0 0 1px var(--ink); }
.shp-mat-min { grid-row: 1 / span 3; }

.shp-maty { display: grid; gap: var(--s-2); }

.shp-list > .shp-maty { margin: var(--s-2) var(--s-4); }
.shp-maty-wiele .shp-mat[aria-current="true"], .shp-maty-wiele .shp-mat[aria-current="true"]:hover { box-shadow: inset 4px 0 0 var(--clay), 0 0 0 2px var(--ink); }
.shp-maty-wiele .shp-mat[aria-current="true"] .shp-mat-t b { text-decoration: underline; text-underline-offset: 3px; }
.shp-mat-dodaj { display: flex; align-items: center; gap: var(--s-2); width: 100%; min-height: 32px; margin: 0; padding: 0 var(--s-3);
  font: 600 var(--fs-small)/1.2 var(--font-body); color: var(--ink); background: none; border: 1px dashed var(--ink-3); border-radius: var(--r-2); cursor: pointer; }
.shp-mat-dodaj:hover { border-color: var(--ink); }
.shp-mat-dodaj:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.shp-mat-dodaj kbd { margin-left: auto; font: 500 var(--fs-small) var(--font-body); color: var(--ink-2); }

.shp-mat-nazwa { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px var(--s-2); align-items: center; }
.shp-mat-nazwa > label { grid-column: 1 / -1; }
.shp-mat-nazwa[hidden] { display: none; }

.shp-w-mat { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px 0 6px; padding: 0 6px; vertical-align: middle;
  border: 1px solid var(--ink-3); border-radius: var(--r-2); background: var(--material); font: 600 var(--fs-opis)/1.5 var(--font-body); color: var(--ink); white-space: nowrap; }
.shp-w-mat svg { flex: none; }
.shp-mat-e { display: flex; gap: 6px; align-items: baseline; min-width: 0; font: 600 var(--fs-small)/1.3 var(--font-body); color: var(--ink-2); }

.shp-mat-t { flex: 1; min-width: 0; }
.shp-mat-t b, .shp-mat-t i { white-space: nowrap; font-weight: 600; }

.shp-mat-t i { display: block; }

.shp-mat-cel { grid-column: 2; font: 600 var(--fs-caption)/1.3 var(--font-mono); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--clay-deep); }
.shp-mat-e i { font-style: normal; font-weight: 500; }
.shp-mat-e .ik { margin-left: auto; align-self: center; flex: none; color: var(--ink-2); }
.shp-mat-w { min-width: 0; font: 700 var(--fs-body)/1.3 var(--font-body); font-variant-numeric: tabular-nums; color: var(--ink); }
.shp-mat-z { min-width: 0; font: 500 var(--fs-body)/1.3 var(--font-body); color: var(--ink); }
.shp-mat-z > span { margin-right: 6px; font-size: var(--fs-small); color: var(--ink-2); }

.shp-mat-z.shp-mat-ochra, .shp-mat-z.shp-mat-ochra > span { color: var(--ochre-deep); }
.shp-mat-pl { fill: var(--material); stroke: var(--ink-3); stroke-width: 1.5; }
.shp-mat[aria-current="true"] .shp-mat-pl { stroke: var(--ink); }
.shp-mat-z0 { fill: var(--paper); stroke: var(--ink); stroke-width: 1.5; }
.shp-mat-z1 { fill: var(--ink); }

.shp-mat-uwagi { display: grid; gap: var(--s-1); margin: var(--s-2) var(--s-4); }
.shp-mat-uw { display: flex; align-items: stretch; gap: var(--s-2); margin: 0; padding: var(--s-1) var(--s-1) var(--s-1) var(--s-3);
  font: 500 var(--fs-small)/1.35 var(--font-body); color: var(--ochre-deep); background: var(--ochre-soft); border-radius: var(--r-2); }
.shp-mat-uw > span { flex: 1; min-width: 0; align-self: center; }
.shp-mat-uw b { font-weight: 700; }
.shp-mat-link { flex: none; min-width: 24px; min-height: 24px; padding: 0 var(--s-2); font: 600 var(--fs-small) var(--font-body); color: var(--ink);
  background: none; border: 0; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.shp-mat-link:hover { text-decoration-thickness: 2px; }
.shp-mat-link:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }

.shp-otwory { margin-top: var(--s-2); flex-direction: column; align-items: flex-start; }   
.shp-otwory[hidden] { display: none; }

.shp-wsp-uw { flex-wrap: wrap; margin-top: var(--s-2); }
.shp-wsp-uw[hidden] { display: none; }
.shp-wsp-uw > .shp-wsp-tnij { flex: 1 0 100%; min-height: var(--s-8); text-align: left; }
.ot-seg { display: inline-flex; border: 1px solid var(--border); padding: 1px; gap: 1px; background: var(--paper); }
.ot-seg button { font: 600 var(--fs-small) var(--font-body); color: var(--ink-3); padding: 3px 8px; background: none; border: 0; cursor: pointer; }
.ot-seg button[aria-pressed="true"] { background: var(--ink); color: var(--bone); }
.ot-seg button:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }

.shp-proj .ot-seg { display: none; }

.ot-widok { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }

.ot-widok > .ot-seg { flex: 1 0 100%; display: flex; }
.ot-widok > .ot-seg button { flex: 1 1 0; min-width: 0; padding-inline: 4px; }
.shp-proj .ot-widok > .ot-seg { display: none; }
.ot-wid { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; font: 600 var(--fs-small) var(--font-body); color: var(--ink-2);
  padding: 3px 8px; background: var(--paper); border: 1px solid var(--border); cursor: pointer; white-space: nowrap; }
.ot-wid[hidden] { display: none; }
.ot-wid:hover { border-color: var(--ink); color: var(--ink); }
.ot-wid:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.ot-wid .ik { color: currentColor; }
.ot-wid-t { display: inline-flex; align-items: center; gap: 5px; }

.shp-row.shp-ukryty .ot-g, .shp-row.shp-ukryty .ot-kids, .ot-q.ot-q-ukr { color: var(--ink-3); }

.shp-row.shp-poza-iz > .ot-g, .shp-row.shp-inna-pl > .ot-g { color: var(--ink-3); }   
.shp-row.shp-ukryty .ot-g > .ik { color: var(--ink-4); }
.shp-oko[aria-pressed="true"] { color: var(--ink); }


.shp-list .shp-row:not(.shp-ukryty) > .ot-g:not(:hover):not(:focus-within) .shp-oko, .shp-list .shp-row.shp-ukryty > .ot-g [data-act="dup"] { display: none; }

.shp-list .shp-row:not(.shp-zablok) > .ot-g:not(:hover):not(:focus-within) .shp-klodka { display: none; }
.shp-klodka, .shp-wezel .shp-w-blok { color: var(--ink-2); }
.shp-ico.shp-ico-pusty { padding: 0; width: 24px; height: 24px; cursor: default; }   
.shp-klodka[aria-pressed="true"], .shp-wezel .shp-w-blok[aria-pressed="true"] { color: var(--ink); }
.shp-klodka[aria-disabled="true"], .shp-wezel .shp-w-blok[aria-disabled="true"] { color: var(--ink-3); }

.shp-list .shp-row[data-wskaz] > .ot-g { background: var(--hover); }
.shp-list .shp-row:not(.shp-ukryty):not(.shp-wezel):not(.shp-nowa-w) > .ot-g:hover, .shp-list .shp-row:not(.shp-ukryty):not(.shp-wezel):not(.shp-nowa-w) > .ot-g:focus-within {
  grid-template-columns: 14px 14px minmax(0, 1fr) auto auto auto auto; }   

.shp-list .shp-wezel > .ot-g { grid-template-columns: 14px 14px minmax(0, 1fr); }

.shp-list .shp-wezel[data-w] > .ot-g { grid-template-columns: 14px 18px minmax(0, 1fr) 24px; }

.shp-list .shp-wezel[data-w] > .ot-g.shp-w-zarg { grid-template-columns: 14px 18px minmax(0, 1fr) 24px 24px; }

.shp-list .shp-wezel[data-w] > .ot-g.shp-w-blokg { grid-template-columns: 14px 18px minmax(0, 1fr) 24px 24px; }
.shp-list .shp-wezel[data-w] > .ot-g.shp-w-zarg.shp-w-blokg { grid-template-columns: 14px 18px minmax(0, 1fr) 24px 24px 24px; }
.shp-wezel .shp-w-blok { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; }
.shp-wezel .shp-w-zar { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; color: var(--ink-2); }
.shp-wezel .shp-w-zar[aria-pressed="true"] { color: var(--ink); }
.shp-wezel .shp-w-zar[aria-disabled="true"] { color: var(--ink-3); cursor: not-allowed; }   
.shp-wezel > .ot-g.shp-w-biez { background: var(--bone); }

.shp-w-pk { margin: 0 0 8px 8px; padding: 0 8px 0 12px; border-left: 1px solid var(--border); }
.shp-wezel .shp-w-bz { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; color: var(--ink); }

.shp-wezel .shp-w-bz[aria-pressed="false"] .ik { visibility: hidden; color: var(--ink-3); }
.shp-wezel > .ot-g:hover .shp-w-bz[aria-pressed="false"] .ik, .shp-wezel > .ot-g:focus-within .shp-w-bz[aria-pressed="false"] .ik { visibility: visible; }
.shp-w-ukr > .ot-g .ot-kolor::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c); }

#shpWarstwaPole select { width: 100%; padding-right: 28px; }   
.shp-w-nazwa { font: 600 var(--fs-small) var(--font-body); color: var(--ink); width: 100%; min-width: 0; padding: 0 var(--s-2);
  margin-left: calc(-1 * (var(--s-2) + 1px)); background: var(--paper); box-sizing: border-box; }
.shp-list .shp-wezel[data-w] > .ot-g.shp-w-edyt { grid-template-columns: 14px 18px minmax(0, 1fr); align-items: start; padding-block: 5px; }

.shp-w-edyt > .ot-c { align-self: start; margin-top: calc((var(--s-8) - 14px) / 2); }
.shp-w-edyt > .ot-kolor { margin-top: calc((var(--s-8) - 24px) / 2); translate: -6px 0; }
.shp-w-edyt > .shp-w-bz, .shp-w-edyt > .shp-w-linijka, .shp-w-edyt > .shp-w-zar { display: none; }

.shp-wezel .shp-w-linijka { display: grid; place-items: center; width: 24px; height: 24px; color: var(--ink-3); }
.shp-w-pole { display: grid; overflow: visible; white-space: normal; }
.shp-w-blad:empty { display: block; margin: 0; padding: 0; border: 0; }


.shp-w-dalej { font-size: var(--fs-opis); line-height: 1.35; color: var(--ink-3); font-weight: 400; margin-top: var(--s-1); }
.shp-w-opis { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }


#shpNowaW:not(:empty) { box-shadow: 0 1px 0 var(--border); }
#shpNowaW .shp-nowa-w > .ot-g { grid-template-columns: 14px 14px minmax(0, 1fr); color: var(--ink-2); }
.shp-nowa-w > .ot-g .ot-n { font-weight: 600; }
.shp-nowa-w > .ot-g:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }

.shp-sw.shp-sw-war::before { background: radial-gradient(circle, var(--c) 0 2.5px, var(--paper) 3px 4.5px, var(--c) 5px); }
.shp-wezel > .ot-g .ot-n small { font-weight: 400; }

.shp-bezop > .ot-g .ot-n { font-weight: 400; }
.shp-kropka.shp-kropka-w { display: block; }
.shp-w-ukr > .ot-g .ot-n { color: var(--ink-3); }
.shp-w-ukr > .ot-g .shp-kropka-w { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c); }
.shp-wezel > .ot-g .ot-n[data-act]:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.ot-q {
  display: grid; grid-template-columns: 12px 16px 14px minmax(0, 1fr) auto; align-items: center; gap: 6px;
  min-height: 30px; padding: 0 8px 0 4px; white-space: nowrap; min-width: 0;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2); cursor: grab;
}
.ot-q:hover { background: var(--bone); }
.ot-q .ik { color: var(--ink-3); }
.ot-q .h { color: var(--ink-4); font-size: var(--fs-caption); letter-spacing: -2px; }
.ot-q[aria-current="true"] { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); color: var(--ink); }
.ot-q[aria-current="true"] .ik { color: var(--ink); }

.shp-wstaw-przed, .shp-wstaw-za { position: relative; }
.shp-wstaw-przed::after, .shp-wstaw-za::after { content: ""; position: absolute; left: 0; right: 0; height: 3px; background: var(--ink); pointer-events: none; }
.shp-wstaw-przed::after { top: 0; }
.shp-wstaw-za::after { bottom: 0; }

.shp-list.shp-w-ciagnie .shp-wezel[data-w] > .ot-kids { display: none; }
.shp-w-zrodlo > .ot-g { color: var(--ink-3); outline: 1px dashed var(--ink-3); outline-offset: -1px; }   

.shp-sr { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.shp-wezel[data-w] > .ot-g[draggable="true"] { cursor: grab; }
.shp-wezel[data-w] > .ot-g[draggable="true"] button, .shp-wezel[data-w] > .ot-g[draggable="true"] .ot-n { cursor: pointer; }

.ot-gr { display: grid; grid-template-columns: 14px minmax(0, 1fr); align-items: center; gap: 6px; width: 100%; min-height: 30px;
  margin-top: 6px; padding: 0 8px 0 4px; border: 0; border-top: 1px solid var(--border); background: none; cursor: pointer; text-align: left;
  font: 600 var(--fs-small) var(--font-body); color: var(--ink-2); white-space: nowrap; }
.ot-gr:hover { background: var(--bone); }
.ot-gr:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.ot-gr .ik { color: var(--ink-3); }
.ot-gr small { font-weight: 400; }

.ot-gr.ot-gr-mat { grid-template-columns: minmax(0, 1fr); padding-left: 8px; cursor: default; color: var(--ink); }
.ot-gr.ot-gr-mat:hover { background: none; }
.ot-gr-mat .ot-n small { margin-left: 6px; color: var(--ink-2); }
.ot-tc.ot-tc-mat { color: var(--ink); font-weight: 600; }
.ot-q.ot-q-poza { cursor: pointer; }
.ot-q.ot-q-poza .ot-n-t { color: var(--ink-3); }

.shp-row > .ot-g .ot-n[tabindex]:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }

.ot-q.ot-skorka { cursor: pointer; }
.ot-tc { font: var(--fs-caption)/1 var(--font-mono); color: var(--ink-3); padding: 5px 8px 5px 50px; white-space: nowrap; }
.wc-ops .ot-q { padding: 0 14px 0 10px; }

.shp-list .ot-q { grid-template-columns: 12px 16px 14px minmax(0, 1fr) auto 24px; padding-right: 4px; }
.shp-list .ot-q .shp-ico-del { visibility: hidden; }
.shp-list .ot-q:hover .shp-ico-del, .shp-list .ot-q:focus-within .shp-ico-del, .shp-list .ot-q[aria-current="true"] .shp-ico-del { visibility: visible; }
.shp-list .ot-q .shp-ico-del { color: var(--ink-3); }   
.shp-list .ot-q .shp-ico-del .ik { color: inherit; }

.shp-usun-wsp { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; }
.shp-ico {
  flex: 0 0 auto; display: flex; padding: 5px; cursor: pointer;
  background: none; border: none; border-radius: 6px; color: var(--ink-4);
  transition: color var(--dur-fast) var(--ease-out);
}
.shp-ico:hover, .shp-ico:focus-visible { color: var(--ink); }
.shp-ico-del:hover, .shp-ico-del:focus-visible { color: var(--clay); }

.shp-list .shp-row .ot-o[data-op] .shp-ico-del .ik { color: inherit; }

.sbt {
  display: inline-flex; align-items: center; gap: 2px; cursor: pointer;
  background: none; border: none; border-radius: 6px; padding: 2px 4px;
  font-family: var(--font-mono); font-size: var(--fs-small); color: var(--ink-3);
}
.sbt:hover { color: var(--ink); }
.sbt .ar { order: -1; font-size: var(--fs-caption); visibility: hidden; }
.sbt[aria-pressed="true"] { color: var(--ink); }
.sbt[aria-pressed="true"] .ar { visibility: visible; }
.sortbar { display: contents; }   

.grp { border-top: 1px solid var(--border); margin-top: 10px; }
.grp:first-of-type { border-top: none; }
.grp-h {
  display: grid; align-items: center; column-gap: var(--c-gap);
  grid-template-columns: minmax(0, 1fr) var(--c-dia) var(--c-z) var(--c-t);
  padding: 8px var(--c-pad) 4px 0;
}
.grp-t {
  grid-column: 1; grid-row: 1; justify-self: start;
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  background: none; border: none; padding: 2px 0;
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption);
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
}
.grp-t:hover { color: var(--ink); }
.grp-t .car { font-size: var(--fs-caption); color: var(--ink-4); transition: transform var(--dur-fast) var(--ease-out); }
.grp[data-open="0"] .grp-t .car { transform: rotate(-90deg); }
.grp-t .cnt { color: var(--ink-3); font-weight: 500; }
.grp-h .sbt.nazwa { grid-column: 1; grid-row: 1; justify-self: end; }
.grp-h .gap { display: none; }

.grp-h .sbt[data-sort="dia"] { grid-column: 2; grid-row: 1; justify-self: end; }
.grp-h .sbt[data-sort="z"] { grid-column: 3; grid-row: 1; justify-self: end; }

.grp-h .sbt { padding-right: 0; }
.grp-h .sortbar > span { grid-column: 4; grid-row: 1; }   
.grp[data-open="0"] .grp-b { display: none; }
.grp-b { margin: 2px 0 6px; }


.nrz-wrap { position: relative; }
.nrz {
  display: grid; width: 100%; column-gap: var(--c-gap); align-items: baseline;
  grid-template-columns: 20px minmax(0, 1fr) var(--c-dia) var(--c-z) var(--c-t);
  padding: 5px var(--c-pad) 5px 2px; cursor: pointer; text-align: left;
  background: none; border: none; border-radius: 8px;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
  transition: background var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out);
}
.nrz:hover { background: var(--bone); }

.nrz-edyt {
  margin: 4px 0 10px; border-radius: 8px;
  background: var(--linen); box-shadow: inset 2px 0 0 var(--clay);
}

.nrz-edyt .nrz, .nrz-edyt .nrz:hover { background: none; }
.nrz-edyt .nrz { padding-left: 4px; }

.nrz .ico { grid-column: 1; grid-row: 1 / 3; align-self: center; display: flex; color: var(--ink-3); }
.nrz .nm {
  grid-column: 2; grid-row: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nrz .dia, .nrz .zz {
  grid-row: 1 / 3; align-self: center; text-align: right;
  font-family: var(--font-mono); font-size: var(--fs-opis); color: var(--ink-2);
}
.nrz .dia { grid-column: 3; }
.nrz .zz  { grid-column: 4; }
.nrz .tno { grid-column: 5; grid-row: 1 / 3; align-self: center; justify-self: end; }
.nrz .sub {
  grid-column: 2; grid-row: 2; min-width: 0;
  font-size: var(--fs-opis); color: var(--ink-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nrz .sub:empty { display: none; }

.tno {
  font-family: var(--font-mono); font-size: var(--fs-caption); line-height: 1.4;
  padding: 1px 0; min-width: var(--c-t); text-align: center; border-radius: 6px;
  border: 1px solid transparent;
}
.tno.live { background: var(--clay); border-color: var(--clay); color: var(--bone); }
.tno.live.manual { background: none; border-color: var(--ochre); color: var(--ochre-deep); }
.tno.pocket { border-color: var(--plaster); color: var(--ink-3); }
.tno.ghost { color: var(--plaster); }

.del {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  display: flex; padding: 4px; cursor: pointer; opacity: 0;
  background: none; border: none; border-radius: 6px; color: var(--ink-4);
  transition: opacity var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nrz-wrap:hover .del, .del:focus-visible { opacity: 1; }
.del:hover { color: var(--clay); }
.empty { font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-3); margin: 10px 0; }

#magBody mark { background: var(--linen); color: inherit; border-radius: 2px; padding: 0 1px; }

.shp-nowy-frez { margin-top: 12px; padding: 10px 12px 12px; border: 1px solid var(--border); border-radius: 8px; }
.shp-nowy-frez[hidden] { display: none; }
.shp-nf-blad { margin: 8px 0 0; padding-left: 8px; border-left: 2px solid var(--clay); font: 600 var(--fs-small)/1.5 var(--font-body); color: var(--clay-deep); }
.shp-nf-blad[hidden] { display: none; }
.row2 > .pole-blad { grid-column: 1 / -1; }
.shp-nf-akcje { display: flex; justify-content: flex-end; gap: var(--s-2); margin-top: 10px; }

.shp-szkic-pasek { position: sticky; bottom: -14px; z-index: 2; display: flex; justify-content: flex-end; gap: var(--s-2); margin: 0 -16px; padding: 10px 16px; background: var(--paper); border-top: 1px solid var(--border); }
.shp-szkic-pasek[hidden] { display: none; }
.shp-szkic-pasek kbd { font: 500 1em var(--font-mono); margin-left: 4px; color: inherit; }

.mag-warn {
  font-family: var(--font-body); font-size: var(--fs-opis); line-height: 1.5;
  color: var(--ochre-deep); border-left: 2px solid var(--ochre);
  padding-left: 8px; margin: 8px 0 0;
}
.mag-warn[hidden] { display: none; }

.shp-kieszen-sciana { display: block; }
.shp-kieszen-sciana > .btn-mini { display: block; margin-top: var(--s-1); }

.shp-plan-wybieg { font-family: var(--font-body); font-size: var(--fs-body); line-height: 1.5; color: var(--ink-2);
  background: var(--linen); border-left: 2px solid var(--ochre); padding: var(--s-2) var(--s-3); margin: var(--s-2) 0 0; }
.shp-plan-wybieg[hidden] { display: none; }

.mag-bezobr { margin-top: 12px; padding: 8px 12px 10px; border: 1px dashed var(--border); border-radius: 8px; }
.mag-bezobr[hidden] { display: none; }

.file-blk { margin-bottom: 4px; }
.trow {
  display: flex; align-items: center; gap: 8px; margin-top: 8px;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink-2);
  
  position: relative;
}
.trow .t { font-family: var(--font-mono); font-weight: 600; width: 28px; flex-shrink: 0; }
.trow .slot { flex: 1; min-width: 0; }

.trow .vis { width: 14px; height: 14px; margin: 0; flex-shrink: 0; accent-color: var(--clay); cursor: pointer; }
.trow .bezt { width: auto; color: var(--ink-3); }
.trow .bezt-note { font-size: var(--fs-opis); color: var(--ink-3); }
.trow .auto { display: flex; gap: 6px; flex-shrink: 0; }

.rst {
  background: none; border: none; border-radius: 6px; padding: 2px 4px;
  cursor: pointer; font-size: var(--fs-opis); line-height: 1; color: var(--ink-3);
}
.rst:hover { color: var(--ink); }

.file-note { font-family: var(--font-body); font-size: var(--fs-opis); color: var(--ink-3); margin: 10px 0 0; line-height: 1.5; }
.file-note b { color: var(--sage); font-weight: 600; }
.file-note i { color: var(--ochre-deep); font-style: normal; }
.file-blk .check { margin-top: 10px; }
.check.off { opacity: 0.55; }
.ovr-note { font-family: var(--font-body); font-size: var(--fs-opis); color: var(--ink-3); margin: 6px 0 0; line-height: 1.5; }
.ovr-note.ok { color: var(--sage); }


.pick { position: static; min-width: 0; }
.pick-btn {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
  background: var(--bone); border: 1px solid var(--border); border-radius: 8px;
  padding: 7px 8px; cursor: pointer; outline: none; min-width: 0;
  transition: border-color var(--dur-fast) var(--ease-out);
}

.pick-btn:hover, .pick-btn:focus-visible, .pick-btn.open { border-color: var(--ink); }
.pick-btn .ico { display: flex; flex-shrink: 0; color: var(--ink-3); }
.pick-btn .lbl { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.pick-btn:not(.none) .lbl { display: flex; align-items: baseline; gap: 8px; }
.pick-btn .lbl .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: var(--fs-opis); color: var(--ink-3); }
.pick .sd {
  display: inline-flex; align-items: baseline; flex-shrink: 0; white-space: nowrap;
  font-weight: 700; font-size: 14px; line-height: 1.2; color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.pick .sd .fi {
  width: 0.78em; height: 0.78em; flex: none; margin-right: 1px; overflow: visible;
  fill: none; stroke: currentColor; stroke-width: 1.15;
}
.pick-btn.none .lbl { color: var(--ink-3); }
.pick-btn .tno { margin-left: auto; flex-shrink: 0; }
.pick-btn .tno + .car { margin-left: 0; }
.pick-btn .car { margin-left: auto; flex-shrink: 0; font-size: var(--fs-caption); color: var(--ink-4); }

.pop {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 60;
  background: var(--bone); border: 1px solid var(--ink-4); border-radius: 0;   
  box-shadow: var(--shadow-3); padding: 8px;
}
.pop[hidden] { display: none; }
.pick.up .pop { top: auto; bottom: calc(100% + 4px); }
.pop .shapebar { margin: 6px 0; }
.pop-list { max-height: 248px; overflow-y: auto; }   

.pop-g {
  position: sticky; top: 0; z-index: 1; background: var(--paper);
  display: flex; align-items: center; gap: 6px; padding: 6px 4px 4px;
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-caption);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3);
}
.pop-g svg { display: block; }
.pop-g .cnt { margin-left: auto; font-weight: 500; }

.pop-g.grp-h { display: grid; padding: 6px 6px 4px 0; text-transform: none; letter-spacing: 0; }
.pop-g .grp-t { cursor: default; }
.pop-g .grp-t .cnt { margin-left: 0; }
.opt {
  display: grid; align-items: center; column-gap: 8px; width: 100%;
  grid-template-columns: 18px 80px minmax(0, 1fr) auto 14px;
  padding: 5px 6px; cursor: pointer; text-align: left;
  background: none; border: none; border-radius: 8px;
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--ink);
}
.opt:hover, .opt.act { background: var(--bone); }
.opt .ico { grid-column: 1; display: flex; color: var(--ink-3); }
.opt .nm { grid-column: 3; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-small); color: var(--ink-2); }
.opt .tick { grid-column: 5; text-align: center; color: var(--sage); }

.opt.nrz {
  grid-template-columns: 20px minmax(0, 1fr) var(--c-dia) var(--c-z) var(--c-t);
  column-gap: var(--c-gap); align-items: baseline; padding: 5px 6px 5px 2px;
}
.opt.nrz .nm { grid-column: 2; font-size: inherit; color: var(--ink); }
.opt.cur .nm { font-weight: 600; }

.opt.none .nm { grid-column: 1 / 5; color: var(--ink-3); }
.opt.none .tick { grid-column: 5; }
.pop-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--border);
  font-family: var(--font-body); font-size: var(--fs-caption); color: var(--ink-3);
}
.pop-foot kbd {
  font-family: var(--font-mono); font-size: var(--fs-caption); color: var(--ink-3);
  border: 1px solid var(--border); border-radius: 4px; padding: 0 4px;
}



#presetBar .mag-head:first-child { margin-top: 14px; }

#machBar .mag-row:first-child { margin-top: 14px; }

#magZgodaPodglad {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--fs-opis);
  color: var(--ink-2); background: var(--bone); border: 1px solid var(--border);
  border-radius: 8px; padding: 10px; margin: 10px 0 0; max-height: 260px;
  overflow: auto; white-space: pre; line-height: 1.45;
}

.btn {
  font-family: var(--font-body); font-weight: 600; font-size: var(--fs-small);
  padding: 14px 22px; border: 1px solid var(--ink); cursor: pointer;
  letter-spacing: -0.005em; border-radius: 0; white-space: nowrap; width: 100%;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.btn:disabled { opacity: 0.35; cursor: default; }

.btn[aria-disabled="true"] { background: var(--linen); color: var(--ink-3); border-color: var(--border); cursor: default; }
.btn.busy { opacity: 1; cursor: progress; }
.btn .spin {
  display: inline-block; width: 13px; height: 13px; margin-right: 10px;
  border: 2px solid rgba(var(--bone-rgb), 0.35); border-top-color: var(--bone);
  border-radius: 50%; vertical-align: -2px;
  animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.btn-primary { background: var(--ink); color: var(--bone); margin-top: 16px; }
.btn-primary:hover:not(:disabled):not([aria-disabled="true"]) { background: var(--ink-2); }
.btn-accent { background: var(--clay); border-color: var(--clay); color: #fff; margin-top: 12px; display: none; }

.btn-accent:hover { filter: brightness(0.88); }

.cv-akcje .btn {
  margin: 0; width: auto; height: 28px; padding: 0 14px; font-size: var(--fs-opis);
  font-variant-numeric: tabular-nums;
}
.cv-akcje #btnConv { min-width: 96px; }
.cv-akcje .btn .spin { width: 10px; height: 10px; margin-right: 8px; vertical-align: -1px; }

#stats { font-family: var(--font-mono); font-size: var(--fs-opis); line-height: 1.8; color: var(--ink-3); margin-top: 18px; white-space: pre-line; }
#stats b { color: var(--ink); font-weight: 500; }
#stats.flash { animation: statFlash .8s ease-out; }
#chipStats {
  font-family: var(--font-mono); font-size: var(--fs-opis); line-height: 1.8;
  color: var(--ink-3); margin-top: 14px; white-space: pre-line;
  padding-top: 12px; border-top: 1px solid var(--border);
}
#chipStats[hidden] { display: none; }
#chipStats b { color: var(--ink); font-weight: 500; }
#chipStats i { font-style: normal; color: var(--ink-3); font-size: var(--fs-opis); }
@keyframes statFlash { 0% { background: var(--linen); } 100% { background: transparent; } }
#err { color: var(--clay); margin-top: 12px; font-size: var(--fs-opis); white-space: pre-wrap; }
#err:empty { display: none; }

canvas { width: 100%; height: auto; background: var(--paper); border: 1px solid var(--border); display: block; cursor: grab; }
.cv-wrap { position: relative; }

.cv-bar {
  position: sticky; top: 111px; z-index: 30;   
  display: flex; align-items: center; gap: 14px 20px; flex-wrap: wrap;
  background: rgba(var(--bone-rgb), 0.84);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--border);
  padding: 10px 14px; margin-bottom: -1px;   
}
.cv-mode { display: flex; gap: 6px; margin-left: auto; }
.cv-mode + .cv-mode { margin-left: 0; }   
.cv-mode button {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em;
  padding: 6px 12px; cursor: pointer;
  background: var(--paper); color: var(--ink-3);
  border: 1px solid var(--border); border-radius: 0;
  transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.cv-mode button:hover { color: var(--ink); border-color: var(--ink); }
.cv-mode button.active { background: var(--ink); color: var(--bone); border-color: var(--ink); }
#legend { min-width: 180px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); }
#legend > div { flex: 1 1 auto; }
#legFeed, #legDyn, #legChip { display: flex; align-items: center; gap: 12px; }
#legFeed[hidden], #legDyn[hidden], #legChip[hidden] { display: none; }
#legDyn, #legChip { flex-wrap: wrap; gap: 6px 16px; }
#legDyn span, #legChip span { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
#legDyn .sw, #legChip .sw { width: 14px; height: 3px; display: block; }
.sw-dec { background: var(--clay); }
.sw-acc { background: var(--sage); }
.sw-hold { background: var(--ochre); }

.sw-cru { background: var(--plum); height: 1.5px !important; }

.sw-none { background: var(--ash); height: 1.5px !important; }
#grad { flex: 1; min-width: 100px; height: 8px; background: linear-gradient(90deg, var(--clay), var(--sage)); }
.cv-help { margin-top: 12px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); line-height: 1.6; }


#pieceTip {
  position: absolute; z-index: 20; pointer-events: none;
  background: var(--ink); color: var(--bone);
  font-family: var(--font-mono); font-size: var(--fs-opis); line-height: 1.7;
  letter-spacing: 0.02em; padding: 9px 12px; box-shadow: var(--shadow-3);
  white-space: nowrap;
}
#pieceTip[hidden] { display: none; }
#pieceTip b { color: var(--bone); font-weight: 600; }


#kursorXY {
  font-family: var(--font-mono); font-size: var(--fs-opis);
  color: var(--ink-3); white-space: pre; font-variant-numeric: tabular-nums;
  display: block; line-height: 30px; padding: 0 var(--s-3); min-width: calc(30ch + 2 * var(--s-3) + 2px); box-sizing: border-box;
  contain: layout style;   
  position: relative; z-index: 1;   
}
.shp-tryb-rysuj #kursorXY { min-width: calc(24ch + 2 * var(--s-3) + 2px); }
#kursorXY[hidden] { display: block; visibility: hidden; }
#kursorXY b { font-weight: 400; color: var(--ink-3); }
#kursorXY b { display: inline-block; min-width: 8ch; text-align: right; }   
#kursorXY .kxy-x, #kursorXY .kxy-y, #kursorXY .kxy-z {
  font-weight: 600; color: var(--ink-2);
  text-decoration: underline 2px; text-underline-offset: 3px;
}
#kursorXY .kxy-zz[hidden] { display: none; }
#kursorXY .kxy-z { text-decoration-color: var(--brass); }
#kursorXY .kxy-x { text-decoration-color: var(--clay); }
#kursorXY .kxy-y { text-decoration-color: var(--sage); }

#toast {
  position: fixed; right: 24px; bottom: 24px; z-index: 60;
  background: var(--ink); color: var(--bone);
  padding: 12px 18px; font-family: var(--font-body); font-weight: 600; font-size: var(--fs-opis);
  box-shadow: var(--shadow-3);
  opacity: 0; transform: translateY(8px);
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
  pointer-events: none;
}
#toast.show { opacity: 1; transform: translateY(0); }



.shp-toggle { display: grid; grid-template-columns: 1fr 1fr; }
.shp-toggle button {
  position: relative; min-width: 0; text-align: center;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em;
  padding: 8px 12px; cursor: pointer;
  background: var(--paper); color: var(--ink-3);
  border: 1px solid var(--border); border-radius: 0;
  transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.shp-toggle button + button { border-left-width: 0; }

.shp-toggle .beta {
  position: absolute; top: -8px; right: -6px; z-index: 1; pointer-events: none;
  padding: 1px 6px; white-space: nowrap;
  font-family: var(--font-mono); font-size: 9px; font-weight: 600; line-height: 1.5;
  letter-spacing: 0.1em; color: var(--bone); background: var(--clay);
  border-radius: 999px; box-shadow: 0 0 0 2px var(--paper);
}
.shp-toggle button:hover { color: var(--ink); border-color: var(--ink); }
.shp-toggle button.active { background: var(--ink); color: var(--bone); border-color: var(--ink); }

.shp-pick { position: relative; }

.shp-zoom {
  position: absolute; top: 8px; right: 8px; z-index: 5; cursor: pointer;
  font-family: var(--font-mono); font-size: 11px; padding: 5px 10px;
  background: var(--paper); color: var(--ink); border: 1px solid var(--border);
  border-radius: 8px; box-shadow: var(--shadow-1);
}
.shp-zoom:hover { border-color: var(--ink); }
.shp-zoom[hidden] { display: none; }

.shp-snap {
  position: absolute; top: 8px; left: 8px; z-index: 5;
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  font-family: var(--font-mono); font-size: 11px; padding: 4px 6px 4px 10px;
  background: var(--paper); color: var(--ink); border: 1px solid var(--border);
  border-radius: 8px; box-shadow: var(--shadow-1);
}
.shp-snap[hidden] { display: none; }
.shp-snap-tyt { color: var(--ink-3); }
.shp-snap label { display: flex; align-items: center; gap: 6px; white-space: nowrap; cursor: pointer; user-select: none; }
.shp-snap input { accent-color: var(--clay); margin: 0; cursor: pointer; }
.shp-snap select {
  font: inherit; color: var(--ink); background: var(--bone); height: 24px; padding: 0 22px 0 6px;
}

.shp-snap-para { display: flex; align-items: center; gap: 4px 8px; }
.shp-snap label:has(> input:disabled) { opacity: .5; cursor: default; }
.shp-snap input:disabled { cursor: default; }
.shp-snap-sep { width: 1px; align-self: stretch; background: var(--border); margin: 2px 2px; }

.shp-cmd {
  position: absolute; z-index: 5; bottom: 48px; width: max-content;
  left: calc((100% + var(--wc-zasl-l, 0px) - var(--wc-zasl-p, 0px)) / 2); transform: translateX(-50%);
  max-width: calc(100% - var(--wc-zasl-l, 0px) - var(--wc-zasl-p, 0px) - 16px);
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 12px;
  font-size: var(--fs-opis); padding: 6px 8px 6px 12px; white-space: nowrap; pointer-events: none;
  background: var(--paper); color: var(--ink); border: 1px solid var(--border);
  border-radius: 8px; box-shadow: var(--shadow-2);
}
.shp-cmd[hidden] { display: none; }
.shp-cmd-nm { font: 500 10px/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--clay); }
.shp-cmd-st { font: 500 10.5px var(--font-mono); color: var(--ink-3); }
.shp-cmd-q { font-weight: 700; }

.shp-cmd-czas { display: inline-block; width: 15ch; white-space: nowrap; font-variant-numeric: tabular-nums; }
.shp-cmd-narz { display: inline-block; min-width: 7ch; white-space: nowrap; font-variant-numeric: tabular-nums; }   
.shp-cmd-q.warn { color: var(--ochre-deep); }

.shp-cmd-q.kotw { display: inline-grid; }
.shp-cmd-q.kotw > * { grid-area: 1 / 1; }
.shp-cmd-q .ukryj { visibility: hidden; }
.shp-cmd-f { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); }
.shp-cmd-in {
  display: inline-flex; align-items: center; height: 26px; min-width: 64px; padding: 0 8px;
  font: 500 var(--fs-opis) var(--font-mono); color: var(--ink);
  background: var(--bone); border: 1px solid var(--ink-4);
}

.shp-cmd-opcja { pointer-events: auto; cursor: pointer; }

.shp-cmd-ikony { display: inline-flex; align-items: center; gap: 2px; pointer-events: auto; }
.shp-cmd-ikb { padding: 3px 5px; }
.shp-cmd-sep { width: 1px; height: 18px; margin: 0 4px; background: var(--border); }
.shp-cmd-opcja:hover { border-color: var(--ink-3); }

.shp-cmd-in[data-pole] { pointer-events: auto; cursor: text; }   
.shp-cmd-in.on { border-color: var(--cobalt); box-shadow: 0 0 0 1px var(--cobalt), var(--fokus-poswiata) color-mix(in srgb, var(--cobalt) var(--fokus-krycie), transparent); }

.shp-cmd-akcja {
  pointer-events: auto; cursor: pointer; height: 26px; padding: 0 10px;
  font: 600 var(--fs-opis) var(--font-body); color: var(--ink); background: var(--paper);
  border: 1px solid var(--ink-3); border-radius: 0;
}
.shp-cmd-akcja:hover { border-color: var(--ink); }
.shp-cmd-akcja:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
.shp-cmd-keys { font: 10.5px var(--font-mono); color: var(--ink-3); border-left: 1px solid var(--border); padding-left: 10px; white-space: normal; }   
.shp-cmd-k { white-space: nowrap; }

.shp-cmd.z-postepem { padding-bottom: 14px; }

.shp-cmd-postep { position: absolute; left: var(--s-2); right: var(--s-2); bottom: 4px; height: 4px; background: var(--border); overflow: hidden; }
.shp-cmd-postep > i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--ink); }
.shp-cmd-postep > b { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--paper); }
.shp-cmd-skala { display: inline-block; width: 80px; height: 12px; border: 1px solid var(--border);
  background: linear-gradient(90deg, var(--skala-a, var(--bryla-material)) 50%, var(--skala-b, var(--bryla-obrobione)) 50%); }   

.menu-kontekst {
  position: absolute; z-index: 70; min-width: 190px;
  display: flex; flex-direction: column; padding: 4px;
  font-family: var(--font-mono); font-size: var(--fs-opis);
  
  background: var(--bone); color: var(--ink); border: 1px solid var(--ink-4);
  border-radius: 0; box-shadow: var(--shadow-3);
}
.menu-kontekst[hidden] { display: none; }
.menu-kontekst button {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font: inherit; color: inherit; text-align: left; background: transparent;
  border: 0; border-radius: 0; padding: 6px 8px; cursor: pointer;
}

.menu-kontekst:not(:has([data-nad])) button:hover:not(:disabled), .menu-kontekst button:focus-visible, .menu-kontekst button[data-nad] { background: var(--hover); outline: none; }

.menu-kontekst:not(:has([data-nad])) button:hover:not(:disabled) kbd, .menu-kontekst button:focus-visible kbd, .menu-kontekst button[data-nad] kbd { color: var(--ink-2); }
.menu-kontekst:not(:has([data-nad])) button[aria-checked="true"]:hover:not(:disabled)::before,
.menu-kontekst button[aria-checked="true"]:focus-visible::before,
.menu-kontekst button[aria-checked="true"][data-nad]::before { color: var(--ink); }

.menu-kontekst button:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.menu-kontekst button:disabled { color: var(--ink-4); cursor: default; }

.menu-kontekst button[aria-checked="true"]::before { content: "✓ "; color: var(--clay); }

.menu-kontekst button[role="menuitemcheckbox"] { justify-content: flex-start; }
.menu-kontekst button[role="menuitemcheckbox"]:not([aria-checked="true"])::before { content: "✓ "; visibility: hidden; }
.menu-kontekst button[role="menuitemcheckbox"] kbd { margin-left: auto; }

.menu-kontekst:has([role="menuitemcheckbox"]) button { justify-content: flex-start; }
.menu-kontekst:has([role="menuitemcheckbox"]) button[role="menuitem"]::before { content: "✓ "; visibility: hidden; }
.menu-kontekst:has([role="menuitemcheckbox"]) button kbd { margin-left: auto; }

.menu-kontekst kbd { font: inherit; color: var(--ink-3); }

.menu-kontekst button:disabled kbd { color: var(--ink-2); }

.menu-kontekst-poz { display: inline-flex; align-items: center; gap: 8px; }
.menu-kontekst-sep { height: 1px; background: var(--border); margin: 4px 2px; }

.shp-znak { flex: none; fill: none; stroke: var(--clay); stroke-width: 1.6; }

.shp-snap-rozwin {
  font: inherit; color: var(--ink); background: var(--bone);
  border: 1px solid var(--border); border-radius: 6px; padding: 0 6px; cursor: pointer;
  
  min-width: 24px; min-height: 24px; font-size: 14px; line-height: 1;
}
.shp-snap-rozwin[aria-expanded="true"] { background: var(--linen); }
#shpHelp { margin-top: 10px; }

#shapeCv { cursor: none; }

#shapeCv { background: var(--plotno, var(--kanwa)); }

.cv-bar[hidden] { display: none; }
canvas[hidden] { display: none; }

.cv-wrap.shp-rysuj > canvas:not(#shapeCv):not(.shp-gl) { display: none; }

.cv-wrap:not(.shp-rysuj) > canvas.shp-gl { display: none; }

@media (max-width: 900px) {
  .cv-bar { top: 107px; }   
  .panel { position: static; }   
  
  .cv-akcje { flex: 1 0 100% !important; }
  .cv-akcje .btn { flex: 1; }
}


@media (prefers-reduced-motion: reduce) {
  .panel *, .cv-bar *, .pop * { transition: none !important; animation: none !important; }
}


.ik { display: block; flex: none; overflow: visible; fill: none; stroke: currentColor;
  stroke-width: var(--sw, 1.5); stroke-linecap: round; stroke-linejoin: round; }


.shp-list .ot-o.shp-wym-o[aria-current="true"] { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); }
.shp-zm-akcje { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-3); }


.shp-cmd-tx {
  pointer-events: auto; min-width: 14ch; width: 18ch; max-width: 32ch;
  font: 500 var(--fs-opis) var(--font-body); padding: 0 8px; border-radius: 0;
}
.shp-cmd-tx:focus { outline: none; border-color: var(--cobalt); box-shadow: 0 0 0 1px var(--cobalt), var(--fokus-poswiata) color-mix(in srgb, var(--cobalt) var(--fokus-krycie), transparent); }
.shp-cmd-txslot { display: inline-flex; }
.shp-tx { display: grid; gap: 0; margin-top: var(--s-3); }
.shp-tx[hidden] { display: none; }
#shpTekst textarea { font-family: var(--font-body); font-size: var(--fs-small); resize: vertical; min-height: 64px; }
#shpTekst [data-tx-bezm] { margin: 0; }

.shp-tx-cz {
  display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%;
  padding: 10px 13px; background: var(--bone); border: 1px solid var(--border); border-radius: 8px;
  font: 500 var(--fs-lead)/1.2 var(--font-body); color: var(--ink); cursor: pointer; text-align: left;
}
.shp-tx-cz:hover { border-color: var(--ink); }
.shp-tx-cz:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.shp-tx-cz-z { font: 600 var(--fs-caption) var(--font-body); color: var(--ink-3); }
.shp-tx-cz.shp-tx-brak .shp-tx-cz-n { color: var(--ink-3); }

.shp-tx-lista { border: 1px solid var(--border); border-radius: 8px; background: var(--bone); max-height: 360px; overflow-y: auto; margin-top: 6px; }
.shp-tx-lista[hidden] { display: none; }
.shp-tx-poz {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px; width: 100%;
  padding: 8px 12px; border: 0; border-bottom: 1px solid var(--linen); background: none; color: var(--ink); cursor: pointer; text-align: left;
}
.shp-tx-poz:hover, .shp-tx-poz:focus-visible { background: var(--hover); outline: none; }
.shp-tx-poz:focus-visible { box-shadow: inset 0 0 0 2px var(--ink); }
.shp-tx-poz[aria-selected="true"] { background: var(--linen); box-shadow: inset 3px 0 0 var(--clay); }
.shp-tx-poz-n { font: 600 var(--fs-opis) var(--font-body); color: var(--ink-2); }
.shp-tx-poz-n small { display: block; font: 500 var(--fs-caption) var(--font-body); color: var(--ink-3); margin-top: 1px; }

.shp-tx-poz:hover .shp-tx-poz-n small, .shp-tx-poz:focus-visible .shp-tx-poz-n small { color: var(--ink-2); }
.shp-tx-poz-p { font-size: var(--fs-h6); line-height: 1.2; white-space: nowrap; }

.shp-tx-lista { position: relative; }
.shp-tx-wirt { position: relative; }
.shp-tx-wirt > .shp-tx-poz, .shp-tx-wirt > .shp-tx-gr { position: absolute; left: 0; right: 0; box-sizing: border-box; }
.shp-tx-wirt > .shp-tx-poz { height: 52px; align-items: center; overflow: hidden; }
.shp-tx-poz-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shp-tx-poz-p { overflow: hidden; flex-shrink: 1; }

.shp-tx-gr { display: flex; justify-content: space-between; align-items: center; gap: var(--s-2); height: 30px; padding: 0 var(--s-3);
  font: 600 var(--fs-caption) var(--font-body); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--ink-3); background: var(--linen); }

.shp-tx-glowa { display: grid; gap: var(--s-2); margin-top: var(--s-2); }
.shp-tx-glowa[hidden], .shp-tx-pod[hidden], .shp-tx-wlasna[hidden], #shpTxStylPole[hidden], #shpTxUsunBox[hidden] { display: none; }
.shp-tx-szukaj { width: 100%; }
.shp-tx-zrodla { display: grid; gap: var(--s-2); }
.shp-tx-zr-przyc { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.shp-tx-zrodla .mag-note, .shp-tx-pod .mag-note { margin: 0; }
.shp-tx-pod { display: grid; gap: var(--s-1); margin-top: var(--s-2); }
.shp-tx-wlasna { display: grid; gap: var(--s-2); margin-top: var(--s-2); }
.shp-tx-wlasna .mag-note { margin: 0; }
.shp-tx-wlasna .shp-tx-akcje { margin-top: 0; }
.shp-tx-seg { display: flex; gap: 6px; flex-wrap: wrap; }
.shp-tx-seg .btn-mini[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--bone); }
.shp-tx-akcje { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.shp-tx-akcje[hidden] { display: none; }
.shp-tx-opis { margin-top: 10px !important; }
.shp-tx-opis:empty { display: none; }
.shp-tx-opis2 { margin: 12px 0 0; }


#shapeBox.shp-obr-akt > :not(#shpObrPanel) { display: none !important; }
#shpObrPanel .mag-note { margin: 0 0 var(--s-3); }
.shp-obr-akcje { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-3); }
.shp-obr-akcje .btn-mini { display: inline-flex; align-items: center; gap: var(--s-1); }

.shp-cmd-opcja[aria-disabled="true"], .shp-cmd-opcja[aria-disabled="true"]:hover { color: var(--ink-3); border-color: var(--linen); cursor: default; }


#plMat { margin-bottom: var(--s-4); }
.pl-mat-wiersz { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: var(--s-2); text-align: left; }
.pl-mat-form { margin-top: var(--s-3); }
.pl-mat-sug { margin-top: var(--s-2); align-items: center; flex-wrap: wrap; gap: var(--s-2); }
.pl-mat-sug .mag-note { margin: 0; }
.pl-mat-brak { color: var(--ochre-deep); }
.pl-mat .sbtn[data-nie] { opacity: .45; }


.lic-akcje { display: flex; flex-wrap: wrap; gap: var(--s-2); }


.shp-stepa-modul { padding: 0 var(--s-2) var(--s-1) 52px;    font-size: var(--fs-caption); color: var(--ink-2); }
.shp-stepa-ponow { vertical-align: middle; margin-left: var(--s-1); color: var(--ink-2); }   



.wc-app {
  --ui: 13px;
  --wc-bar-h: 48px; --wc-status-h: 26px;
  width: 100%; height: 100%; min-height: 640px;
  display: grid; grid-template-rows: var(--wc-bar-h) minmax(0, 1fr) var(--wc-status-h);
  background: var(--bone); color: var(--ink);
  font-family: var(--font-body); font-size: var(--ui); line-height: 1.45;
  -webkit-font-smoothing: antialiased; overflow: hidden; position: relative;
}
.wc-app, .wc-app * { box-sizing: border-box; }
.wc-app button { font-family: inherit; }


@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .wc-app {
    --ink: #F0EFEC; --ink-2: #D2C8B8; --ink-3: #9B9182; --ink-4: #8C8171;
    --bone: #151515; --paper: #1B1B1B; --linen: #222222; --stone: #2C2C2C; --plaster: #3A3A3A; --hover: #3D3D3D;
    --clay: #D97C55; --clay-soft: #4A2E22; --sage: #8FA47C; --ochre: #E3B15C; --brass: #C7A968;
    --shp-1: #6FA2E0; --shp-2: #4DB8AC; --shp-3: #94B06F; --shp-4: #AE90DC; --shp-5: #E07AB4;
    
    --clay-deep: #D97C55; --ochre-soft: #3A2B12; --ochre-deep: #E3B15C; --sage-soft: #26321A; --sage-deep: #8FA47C; --patina: #57ADA2; --patina-soft: #0C3531; --patina-deep: #57ADA2; --cobalt: #5896D9; --cobalt-soft: #1D2F44; --cobalt-deep: #5896D9; --plum: #7C68A6; --plum-soft: #312941; --plum-deep: #7C68A6; --heather: #CB7196; --heather-soft: #40242F; --heather-deep: #CB7196; --ash: #A8A399; --kanwa: #1E2125;
    --plotno: var(--paper);
    --border: #2A2A2A; --border-strong: #F0EFEC;
  }
}
html[data-theme="dark"] .wc-app {
  --ink: #F0EFEC; --ink-2: #D2C8B8; --ink-3: #9B9182; --ink-4: #8C8171;
  --bone: #151515; --paper: #1B1B1B; --linen: #222222; --stone: #2C2C2C; --plaster: #3A3A3A; --hover: #3D3D3D;
  --clay: #D97C55; --clay-soft: #4A2E22; --sage: #8FA47C; --ochre: #E3B15C; --brass: #C7A968;
  --shp-1: #6FA2E0; --shp-2: #4DB8AC; --shp-3: #94B06F; --shp-4: #AE90DC; --shp-5: #E07AB4;
  --clay-deep: #D97C55; --ochre-soft: #3A2B12; --ochre-deep: #E3B15C; --sage-soft: #26321A; --sage-deep: #8FA47C; --patina: #57ADA2; --patina-soft: #0C3531; --patina-deep: #57ADA2; --cobalt: #5896D9; --cobalt-soft: #1D2F44; --cobalt-deep: #5896D9; --plum: #7C68A6; --plum-soft: #312941; --plum-deep: #7C68A6; --heather: #CB7196; --heather-soft: #40242F; --heather-deep: #CB7196; --ash: #A8A399; --kanwa: #1E2125;
  --plotno: var(--paper);
  --border: #2A2A2A; --border-strong: #F0EFEC;
}


html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
@media (prefers-color-scheme: dark) { html:not([data-theme]) { color-scheme: dark; } }
.wc-app { scrollbar-color: var(--ink-4) transparent; accent-color: var(--clay); }

.wc-app select option { background-color: var(--paper); color: var(--ink); }

.wc-app input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none; appearance: none; width: 12px; height: 12px; cursor: pointer; background: var(--ink-2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 2l8 8M10 2l-8 8' stroke='%23000' stroke-width='1.75'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 2l8 8M10 2l-8 8' stroke='%23000' stroke-width='1.75'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}
.wc-app input[type="search"]::-webkit-search-cancel-button:hover { background: var(--ink); }

.wc-app input:-webkit-autofill, .wc-app input:-webkit-autofill:hover {
  -webkit-text-fill-color: var(--ink); caret-color: var(--ink); box-shadow: 0 0 0 1000px var(--paper) inset;
}
.wc-app input:-webkit-autofill:focus { -webkit-text-fill-color: var(--ink); box-shadow: 0 0 0 1000px var(--paper) inset, 0 0 0 1px var(--cobalt); }


.wc-bar { display: flex; align-items: center; gap: 10px; padding: 0 12px 0 16px; background: var(--paper); border-bottom: 1px solid var(--border); min-width: 0; white-space: nowrap; }
.wc-bar > * { flex: none; }
.wc-logo { display: flex; align-items: center; gap: 7px; padding-right: 14px; border-right: 1px solid var(--border); height: 28px; }
.wc-logo b { font-weight: 800; font-size: 15px; letter-spacing: var(--brand-tracking); white-space: nowrap; }

.wc-logo-fala { width: 1.3em; height: .75em; margin: 0 .08em; vertical-align: -.02em; fill: none; stroke: var(--clay); stroke-width: 5.5; stroke-linecap: round; stroke-linejoin: round; }
.wc-logo span { font: 500 9.5px/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }

.wc-logo .wc-ver { display: inline-flex; align-items: center; gap: var(--s-1); position: relative; cursor: pointer;
  font: 500 var(--fs-overline)/1 var(--font-mono); letter-spacing: .06em; text-transform: none; color: var(--ink-3);
  background: none; border: 0; padding: 9px var(--s-1); margin: -9px calc(-1 * var(--s-1)); }
.wc-logo .wc-ver[hidden] { display: none; }

.wc-logo .wc-ver-n { display: inline; font: inherit; letter-spacing: inherit; text-transform: none; color: inherit;
  text-decoration: underline dotted; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.wc-logo .wc-ver:hover .wc-ver-n, .wc-logo .wc-ver[aria-expanded="true"] .wc-ver-n { text-decoration-style: solid; }
.wc-logo .wc-ver:hover, .wc-logo .wc-ver[aria-expanded="true"] { color: var(--ink); }
.wc-logo .wc-ver:focus-visible { outline: 2px solid var(--clay); outline-offset: 2px; color: var(--ink); }

.wc-logo .wc-ver-plak { display: inline-block; min-width: 20px; height: 20px; padding: 0 var(--s-1); border-radius: var(--r-pill);
  background: var(--clay-deep); color: var(--bone); font: 600 var(--fs-caption)/20px var(--font-mono); letter-spacing: 0; text-align: center; }
.wc-logo .wc-ver-plak[hidden] { display: none; }
.wc-logo .wc-ver::after {
  content: attr(data-tip) attr(data-nw); position: absolute; top: calc(100% + 12px); left: -10px;
  background: var(--ink); color: var(--bone); padding: 10px 12px; box-shadow: var(--shadow-3);
  font: 400 var(--fs-opis)/1.5 var(--font-body); letter-spacing: 0; white-space: normal;
  width: max-content; max-width: min(340px, calc(100vw - 150px));
  opacity: 0; transform: translateY(-4px); pointer-events: none; z-index: 100;
  transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.wc-logo .wc-ver:hover::after, .wc-logo .wc-ver:focus-visible::after { opacity: 1; transform: none; }

.wc-bar > .wc-file { flex: 0 100 auto; display: flex; flex-direction: column; justify-content: center; min-width: 48px; padding-left: 4px; }
.wc-file b, .wc-file span { overflow: hidden; text-overflow: ellipsis; }
.wc-file b { font: 500 var(--fs-opis)/1.25 var(--font-mono); }
.wc-file span { font-size: var(--fs-opis); color: var(--ink-3); }
.wc-bar > #btnNewFile { flex: none; }
.wc-file.none b { color: var(--ink-4); font-family: var(--font-body); font-weight: 500; }


.wc-app.shp-tryb-rysuj .wc-bar > .wc-file.wc-proj { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; align-content: center; position: relative; height: 36px; padding: 0 10px; border: 1px solid var(--border); background: var(--bone); cursor: pointer; }
.wc-proj > b, .wc-proj > span { grid-column: 1; }
.wc-proj > .wc-car { grid-column: 2; grid-row: 1 / 3; align-self: center; font-style: normal; color: var(--ink-3); font-size: 10px; }
.wc-proj:hover, .wc-proj[aria-expanded="true"] { border-color: var(--ink); }
.wc-proj:focus-visible { outline: 2px solid var(--clay); outline-offset: 1px; }
.wc-proj > .wc-drawer { left: 0; right: auto; width: 380px; }
.wc-proj > span.wc-proj-uwaga { color: var(--ochre-deep); }   
.proj-nowsza > .mag-note { flex: 1; min-width: 0; margin: 0; color: var(--ochre-deep); }
.proj-zapis { display: grid; gap: 10px; }
.proj-zapis .wc-kr-akcje { gap: 8px; flex-wrap: wrap; }
.proj-zapis .bib-gdzie select { width: auto; }

.proj-zapis .btn-mini kbd { font: 500 var(--fs-caption) var(--font-mono); color: var(--ink-3); margin-left: 4px; }
.proj-zapis .mag-note { margin: 0; }
.proj-zapis .proj-blad { color: var(--clay); }
.wc-app.shp-tryb-rysuj .wc-bar > #btnNewFile { display: none; }

.wc-bar > .wc-sp { flex: 1 1 0; }

.wc-bar > .wc-ctx { flex: 0 1 auto; min-width: 0; max-width: 240px; }
.wc-bar > #matChip { flex-shrink: 0; }
.wc-ctx { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px; border: 1px solid var(--border); background: var(--bone); font-size: var(--fs-opis); cursor: pointer; position: relative; }
.wc-ctx > span:not(.wc-car) { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.wc-ctx > small, .wc-ctx > .wc-car, .wc-ctx > .wc-dot { flex: none; }
.wc-ctx small { color: var(--ink-3); font-size: 11px; }
.wc-ctx .wc-car { color: var(--ink-3); font-size: 10px; }
.wc-ctx .wc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ochre); }
.wc-ctx.wc-warn { border-color: var(--ochre); }
.wc-ctx:not(.wc-warn) .wc-dot { display: none; }

.wc-icon { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--border); background: transparent; color: var(--ink-2); font-size: 15px; cursor: pointer; padding: 0; }
.wc-icon:hover { border-color: var(--ink); color: var(--ink); }

.wc-ust { position: relative; display: flex; }
#btnUst[aria-expanded="true"] { border-color: var(--ink); color: var(--ink); }
#ustDrawer .shp-toggle.ust-3 { grid-template-columns: 1fr 1fr 1fr; }
#ustDrawer .shp-toggle { margin-bottom: 12px; }
#ustBox[hidden] { display: none; }
.ust-rz { display: grid; grid-template-columns: 104px auto minmax(0, 1fr); align-items: center; gap: 10px; margin: 4px 0; }
.ust-rz .shp-sw-rz { margin: 0; flex-wrap: nowrap; }
.ust-rz .shp-kolor-n { margin-left: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ust-rz .shp-sw::before { box-shadow: inset 0 0 0 1px var(--ink-4); }
.ust-rz .shp-sw-plus::before { display: none; }
.ust-m { font-size: var(--fs-opis); color: var(--ink-2); }
.ust-stopka { margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--border); font: var(--fs-opis) var(--font-mono); color: var(--ink-3); }

.ust-stopka a { color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }


.wc-bar .cv-akcje { flex: none !important; display: flex; align-items: center; gap: 8px; }
.wc-bar .btn { margin: 0; width: auto; height: 32px; padding: 0 14px; font-size: var(--fs-opis); font-variant-numeric: tabular-nums; }

.wc-bar .btn-mini { font-size: var(--fs-opis); padding-inline: 6px; }
.wc-bar #btnConv { min-width: 96px; background: transparent; color: var(--ink); border-color: var(--border); }
.wc-bar #btnConv:not(:disabled):hover { border-color: var(--ink); }
.wc-bar #btnConv kbd { font: 500 10px var(--font-mono); opacity: .6; margin-left: 2px; }
.wc-bar .btn .spin { width: 10px; height: 10px; margin-right: 8px; vertical-align: -1px; }
.wc-bar .btn-accent { display: none; }


.wc-bar .shp-toggle { display: flex; }
.wc-bar .shp-toggle button {
  font: 600 var(--fs-opis)/1 var(--font-body); letter-spacing: 0;
  height: 28px; padding: 0 11px; display: inline-flex; align-items: center; gap: 6px;
}
.wc-bar .shp-toggle .beta {
  position: static; box-shadow: none; padding: 0 5px; font-size: 8.5px; line-height: 14px;
}

.wc-bar > .wc-sp { display: flex; justify-content: center; }
.wc-bar .shp-toggle[hidden] { display: none; }

.shp-proj #shpList .ot-kids, .shp-proj #shpList [data-act="plus"], .shp-proj #btnShpNew { display: none !important; }

.shp-proj #shpList .ot-c { display: none; }
.shp-proj #shpList .shp-kropka { display: block; }

.shp-proj #shpList .shp-wezel > .ot-kids { display: block !important; }

.shp-proj #shpList .shp-wezel > .ot-g > .ot-c, .shp-proj #shpNowaW .shp-nowa-w > .ot-g > .ot-c { display: grid; }

.wc-app.shp-tryb-rysuj.shp-proj .cv-akcje, .shp-proj .shp-gen-nota { display: none; }

.wc-app.shp-tryb-rysuj.shp-proj [data-tab="narzedzia"], .wc-app.shp-proj label.shp-luki { display: none; }   

#btnShpGen .wc-gen-m { display: inline-block; max-width: 9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.wc-bar .wc-gen-strz { margin-left: calc(-1 * var(--s-2)); padding-inline: var(--s-2); border-left: 1px solid color-mix(in srgb, var(--bone) 45%, transparent); }
.wc-gen-strz[hidden] { display: none; }

.shp-proj .shp-ib-mat .shp-ibtn[data-narz="material"] { display: none; }   

#btnShpGen[aria-disabled="true"] + .wc-gen-strz { background: var(--linen); color: var(--ink-3); border-color: var(--border); }
.wc-bar .shp-tryb-kr { display: none; }


.shp-bryla-odstep { display: flex; margin-top: var(--s-2); }

.shp-bryla-odstep .btn-mini { display: inline-flex; align-items: center; gap: var(--s-1); }

.shp-bryla-odstep .btn-mini.primary { flex: 1; justify-content: center; }
.shp-zero { display: flex; gap: var(--s-4); align-items: flex-start; margin: var(--s-2) 0 var(--s-3); }
.shp-zero-siatka { display: grid; grid-template-columns: repeat(3, 30px); grid-template-rows: repeat(3, 30px); gap: var(--s-2);
  padding: var(--s-2); border: 1px solid var(--ink-3); background: var(--material); border-radius: var(--r-1); flex: none; }

.shp-zero-siatka .sbtn[aria-checked="true"] { background: var(--clay); border-color: var(--clay); color: var(--bone); }

.shp-zero-menu [data-akcja="info"]:disabled, .shp-szkic-menu [data-akcja="info"]:disabled, .shp-ukr-menu [data-akcja="info"]:disabled, .shp-dubel-menu [data-akcja="info"]:disabled, .shp-ukr-menu [data-akcja="pamiec"]:disabled { color: var(--ink-2); }
.proj-nowy-menu [data-akcja="info"]:disabled, .konto-konflikt-menu [data-akcja="info"]:disabled, .proj-frezy-menu [data-akcja]:disabled { color: var(--ink-2); }   

.proj-frezy-menu { max-width: min(96ch, calc(100% - 8px)); }
.proj-frezy-menu .menu-kontekst-poz { display: block; }
.shp-zero-siatka .sbtn { width: 30px; height: 30px; padding: 0; justify-content: center; }
.shp-zero-siatka .sbtn i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; display: block; }
.shp-zero-bok { display: grid; gap: var(--s-2); justify-items: start; min-width: 0; }
#shpUstawBox .sbtn[disabled] { opacity: .45; cursor: default; }

#shpUstawBox [data-mat-pl][hidden], #shpUstawBox [data-mat-rys][hidden] { display: none; }
#shpMatWiersz.shp-mat-sam > label:not([hidden]) { grid-column: 1; grid-row: 1; }
#shpMatWiersz.shp-mat-sam > input:not([hidden]) { grid-column: 1; grid-row: 2; }


.wc-app { --wc-szer-l: clamp(300px, 22.2vw, 380px); --wc-szer-p: clamp(280px, 20.8vw, 360px); --wc-szyna: 36px; }
.wc-mid {
  display: grid; min-height: 0; position: relative;
  grid-template-columns: var(--wc-kol-l, var(--wc-szyna)) minmax(0, 1fr) var(--wc-kol-p, var(--wc-szyna));
}
.wc-przyp-l { --wc-kol-l: var(--wc-szer-l); }
.wc-przyp-p { --wc-kol-p: var(--wc-szer-p); }


.wc-side, .wc-insp { background: var(--paper); display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; min-height: 0; min-width: 0; }
.wc-side { border-right: 1px solid var(--border); }
.wc-insp { border-left: 1px solid var(--border); }
.wc-tabs { display: flex; border-bottom: 1px solid var(--border); padding: 0 12px; gap: 2px; }
.wc-tabs button { border: 0; background: none; padding: 12px 10px 10px; font-size: var(--fs-opis); font-weight: 600; color: var(--ink-3); border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
.wc-tabs button.wc-on { color: var(--ink); border-bottom-color: var(--clay); }
.wc-tabs .wc-cnt { font: 500 10.5px var(--font-mono); color: var(--ink-4); margin-left: 4px; }
.wc-ph { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.wc-ph h4 { font-size: var(--fs-small); font-weight: 700; letter-spacing: 0; margin: 0; }
.wc-ph span { font: var(--fs-opis) var(--font-mono); color: var(--ink-3); }
.wc-ph span.wc-nieakt { color: var(--ink); }   
.wc-foot { border-top: 1px solid var(--border); padding: 10px 16px; font-size: var(--fs-opis); color: var(--ink-3); }
.wc-foot:empty { display: none; }
.wc-pane[hidden] { display: none; }


.wc-scrollpane { overflow-y: auto; overflow-x: hidden; padding: 14px 16px; display: flex; flex-direction: column; gap: 14px; min-height: 0; scrollbar-width: none; }
.wc-scrollpane::-webkit-scrollbar { display: none; }

.wc-scrollpane.panel { background: transparent; border: 0; border-radius: 0; box-shadow: none; position: static; top: auto; z-index: auto; }


.wc-scrollpane .field:first-child, .wc-scrollpane .row2:first-child { margin-top: 0; }
.wc-scrollpane label.check { margin-top: 16px; }
.wc-scrollpane .wc-grpl + .field, .wc-scrollpane .wc-grpl + .row2 { margin-top: 14px; }
.wc-scrollpane .wc-grpl + label.check { margin-top: 12px; }
.wc-grpl { display: block; font: 500 var(--fs-caption)/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }

.wc-mat { display: grid; gap: var(--s-2); margin: var(--s-3) 0; }
.wc-mat-uw { margin: 0; font: 500 var(--fs-opis)/1.4 var(--font-body); color: var(--ochre-deep); }
.wc-mat .wc-tt tr.wc-mat-akt td:first-child { font-weight: 700; }
.wc-mat-start { margin: 0; padding: var(--s-3) var(--s-3) var(--s-3) var(--s-6); display: grid; gap: var(--s-2); background: var(--material);
  border: 1px solid var(--ink-3); border-radius: var(--r-2); font: 600 var(--fs-opis)/1.4 var(--font-body); color: var(--ink); }
.wc-mat-start small { display: block; font-weight: 500; color: var(--ink-2); }
.wc-mat-pliki { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-1); }
.wc-mat-pliki li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 4px var(--s-2); align-items: center; font: 500 var(--fs-opis)/1.4 var(--font-mono); color: var(--ink-2); }

.wc-mat-pliki li > span { grid-column: 1 / -1; overflow-wrap: anywhere; }
.wc-mat-pliki em { font: 500 var(--fs-opis) var(--font-body); font-style: normal; color: var(--ink-3); }
.wc-hr { height: 1px; background: var(--border); margin: 20px 0 18px; }
#wcResult .wc-hr, #wcDet .wc-hr { margin: 0; }
.wc-scrollpane .wc-hr-top { margin: 0 0 18px; }
.wc-scrollpane .mag-head { font-family: var(--font-mono); font-weight: 500; letter-spacing: 0.12em; }

#magPlik .file-blk { margin: 0 0 20px; }
#magPlik .file-blk > .mag-head:first-child { margin-top: 0; }


.wc-scrollpane .field label, .wc-scrollpane .row2 label {
  display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: first baseline; column-gap: 6px;
  font: 500 var(--fs-small)/1.35 var(--font-body); letter-spacing: 0; text-transform: none; color: var(--ink-2);
}
.wc-scrollpane .field label .nb, .wc-scrollpane .row2 label .nb { flex: none; margin-left: auto; color: var(--ink-3); font-size: var(--fs-caption); font-weight: 400; }
.wc-scrollpane .row2 { gap: 6px 12px; }

.wc-app .hint::after {
  position: fixed; left: var(--tip-l, -9999px); top: var(--tip-t, 0); right: auto; bottom: auto;
  width: var(--tip-w, 250px); box-sizing: border-box; z-index: 100;
}
.wc-scrollpane .field input, .wc-scrollpane .row2 input, .wc-scrollpane .field textarea {
  height: var(--s-8); padding: 0 9px; font: 500 var(--fs-small) var(--font-mono); color: var(--ink);
}
.wc-scrollpane .field input[type="text"], .wc-scrollpane .row2 input[type="text"] { font-family: var(--font-body); }
.wc-scrollpane .field textarea { height: auto; padding: 9px; }
.wc-scrollpane select { height: var(--s-8); font-family: var(--font-body); font-weight: 500; }

:is(.wc-scrollpane, #magBody) select { padding-top: 0; padding-bottom: 0; }
.wc-scrollpane .btn-mini, .wc-scrollpane .sbtn, .wc-scrollpane .pick-btn,
.wc-scrollpane .nrz, .wc-scrollpane .tno, .wc-scrollpane .gcode-tpl { border-radius: 0; }


.wc-view { position: relative; background: var(--paper); min-width: 0; min-height: 0; overflow: hidden; }
.wc-view .cv-wrap { position: absolute; inset: 0; }

.wc-app { --plotno: var(--kanwa); }
.shp-tryb-rysuj .wc-view { background: var(--plotno); }
.wc-view .cv-wrap > canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0 !important; display: block; }
.wc-view .cv-wrap > canvas[hidden] { display: none; }
.wc-view .cv-wrap.shp-rysuj > canvas:not(#shapeCv):not(.shp-gl) { display: none; }

.wc-view .cv-wrap:not(.shp-rysuj) > canvas.shp-gl { display: none; }

.wc-view .shp-snap { top: auto; right: auto; bottom: var(--s-3); left: 200px; border-radius: 0; background: var(--bone); }
.wc-view .shp-snap .shp-snap-rozwin { border-radius: 0; }
.wc-view .shp-cmd { border-radius: 0; background: var(--bone); }
.wc-view .shp-zoom { top: auto; right: calc(var(--wc-zasl-p, 0px) + var(--s-3)); bottom: 70px; border-radius: 0; background: var(--bone); }
.wc-view .shp-zoom:hover { color: var(--clay); }

.wc-view .shp-zoom[aria-disabled="true"], .wc-view .shp-zoom[aria-disabled="true"]:hover { color: var(--ink-3); cursor: default; }
.wc-view .menu-kontekst, .wc-view .menu-kontekst button { border-radius: 0; }
.wc-view .menu-kontekst:not(:has([data-nad])) button:hover:not(:disabled), .wc-view .menu-kontekst button:focus-visible, .wc-view .menu-kontekst button[data-nad] { background: var(--hover); }

.shp-ibar { position: absolute; top: 12px; left: calc(12px + var(--wc-zasl-l, 0px)); z-index: 5; display: grid; grid-template-columns: auto minmax(0, auto); gap: 6px; justify-items: start; align-items: start;
  max-width: calc(100% - 24px - var(--wc-zasl-l, 0px) - var(--wc-zasl-p, 0px)); }
.shp-ibar[hidden] { display: none; }
.shp-ib-wskaz { grid-column: 1; grid-row: 1; }
.shp-ib-ksztalty { grid-column: 2; grid-row: 1; }
.shp-ib-przeks { grid-column: 2; grid-row: 2; }

.shp-ib-mat { grid-column: 1; grid-row: 2; }

:root:not([data-podpisy="0"]) .shp-ib-mat { display: grid; grid-template-columns: repeat(2, auto); }
.shp-ibar-box { display: flex; flex-wrap: wrap; max-width: 100%; gap: 2px; padding: 2px; background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-1); }

.shp-ibtn { width: 34px; height: 34px; display: grid; place-items: center; border: 0; padding: 0; background: transparent; color: var(--ink-2); cursor: pointer; }
.shp-ibtn:hover:not([aria-pressed="true"]) { background: var(--linen); color: var(--ink); }
.shp-ibtn[aria-pressed="true"] { background: var(--ink); color: var(--bone); }

.shp-ibtn { --ik-kol: var(--clay); }
.shp-ibtn[aria-pressed="true"] { --ik-kol: currentColor; }
.shp-ibtn:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }

.shp-ipodpis { display: none; }
:root:not([data-podpisy="0"]) .shp-ibtn { width: auto; min-width: 34px; height: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2px var(--s-1) 3px; }
:root:not([data-podpisy="0"]) .shp-ipodpis { display: block; font-size: var(--fs-opis); line-height: 1.1; font-weight: 500; white-space: nowrap; }

.shp-itip { position: absolute; background: var(--ink); color: var(--bone); font-size: var(--fs-small); line-height: 1.4; font-weight: 600; padding: 8px 12px; box-shadow: var(--shadow-2); width: max-content; max-width: 360px; white-space: normal; overflow-wrap: anywhere; z-index: 2; pointer-events: none; }
.shp-itip[hidden] { display: none; }
.shp-itip kbd { font: 500 var(--fs-caption) var(--font-mono); border: 1px solid color-mix(in srgb, var(--bone) 40%, transparent); padding: 0 4px; margin-left: 6px; }
.shp-itip small { display: block; margin-top: 2px; font-weight: 400; font-size: var(--fs-caption); line-height: 1.45; }
.shp-itip::before { content: ""; position: absolute; top: -4px; left: var(--strz, 14px); margin-left: -4px; width: 8px; height: 8px; background: var(--ink); transform: rotate(45deg); }


.wc-view .cv-bar {
  position: absolute; inset: 12px; z-index: 5; margin: 0; padding: 0; max-width: none;
  display: grid; grid-template-columns: auto auto 1fr auto auto; grid-template-rows: auto 1fr auto; gap: 8px;
  align-items: start; pointer-events: none;
  background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
.wc-view .cv-bar { left: calc(12px + var(--wc-zasl-l, 0px)); right: calc(12px + var(--wc-zasl-p, 0px)); }
.wc-view .cv-bar[hidden] { display: none; }
.wc-view .cv-bar > * { pointer-events: auto; }
.wc-view .cv-bar > .cv-mode:has(#btnFeed) { grid-column: 1; grid-row: 1; justify-self: start; }

.wc-view .cv-bar > #toolPanel { grid-column: 4; grid-row: 1; justify-self: end; max-width: 50vw; flex-wrap: wrap; }
.wc-view .cv-bar > .cv-mode:has(#btnG0) { grid-column: 5; grid-row: 1; justify-self: end; }
.wc-view .cv-bar > #toolPanel,
.wc-view .cv-bar > .cv-mode {
  display: flex; align-items: center; gap: 0; padding: 0; margin: 0;
  background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-1);
}
.wc-view .cv-bar > #toolPanel[hidden] { display: none; }
.wc-view .cv-bar .cv-mode button {
  font: 600 var(--fs-opis) var(--font-body); letter-spacing: 0; padding: 7px 10px;
  background: transparent; border: 0; border-radius: 0; color: var(--ink-3);
}

.wc-nakl { position: absolute; z-index: 5; left: calc(var(--s-3) + var(--wc-zasl-l, 0px)); bottom: calc(var(--kod-h) + var(--nakl-dol, var(--s-3)));
  display: flex; flex-direction: column-reverse; align-items: flex-start; gap: var(--s-2); pointer-events: none; }
.wc-nakl > * { box-sizing: border-box; background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-1); border-radius: 0; }
.wc-nakl > #legend { align-self: stretch; }
.wc-nakl > :not(.wc-nakl-os) { min-height: 32px; display: flex; align-items: center; padding: 0 var(--s-3); }
.wc-nakl > [hidden], .wc-nakl > #legend[hidden] { display: none; }
.wc-nakl > .wc-nakl-os { margin-bottom: var(--nakl-os-nad, 0px); }
.wc-nakl-os canvas { display: block; }

.shp-tryb-rysuj .wc-nakl > :is(#legend, .wc-nakl-zoom) { display: none; }

.wc-nakl > .wc-nakl-tryb { padding: 0; gap: 0; pointer-events: auto; }
.wc-nakl-tryb button, .wc-nakl-widok button { font: 600 var(--fs-opis) var(--font-body); letter-spacing: 0; padding: 7px 10px; min-height: 32px;
  background: transparent; border: 0; border-radius: 0; color: var(--ink-3); cursor: pointer; }
.wc-nakl-tryb button:hover, .wc-nakl-widok button:hover { color: var(--ink); }
.wc-nakl-tryb button.active { color: var(--ink); box-shadow: inset 0 -2px 0 var(--clay); }
.wc-nakl-tryb button:focus-visible, .wc-nakl-widok button:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.shp-tryb-rysuj .wc-nakl > .wc-nakl-tryb { display: none; }

.shp-tryb-rysuj.shp-meble .wc-nakl > .wc-nakl-tryb { display: flex; }
.shp-tryb-rysuj.shp-3d .wc-nakl > .wc-nakl-os { pointer-events: auto; cursor: pointer; }

.wc-nakl > .wc-nakl-widok { display: none; flex-direction: column; align-items: stretch; padding: 0; gap: 0; pointer-events: auto; }
.shp-tryb-rysuj.shp-meble .wc-nakl > .wc-nakl-widok { display: flex; }
.wc-nakl-widok button { position: relative; display: grid; place-items: center; padding: 2px 3px; min-height: 34px; min-width: 34px; }

.wc-nakl-widok button[data-tip]:hover::after, .wc-nakl-widok button[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; left: calc(100% + 6px); top: 50%;
  transform: translateY(-50%); background: var(--ink); color: var(--bone); font: 500 var(--fs-opis)/1.4 var(--font-body); padding: 4px 8px; white-space: nowrap;
  box-shadow: var(--shadow-3); pointer-events: none; z-index: 100; }
.wc-nakl-widok button.active { color: var(--ink); box-shadow: inset 2px 0 0 var(--clay); }
.wc-nakl-widok button.nieczynny { color: var(--ink-4); cursor: default; }

.wc-nakl > .wc-nakl-sym { margin-bottom: var(--s-2); }
.shp-tryb-rysuj.shp-meble .wc-nakl > .wc-nakl-sym[hidden] { display: none; }
.wc-nakl-sym button.nieaktualna { color: var(--ochre-deep); }
.wc-nakl-sym button.nieaktualna svg { stroke-dasharray: 2 1.8; }

.shp-tryb-rysuj.shp-3d #kursorXY:not([hidden]) { visibility: visible; }
#kursorXY .kxy-uk { position: relative; display: inline-grid; place-items: center; width: 28px; height: 24px; padding: 0; margin-right: 8px; border: 1px solid var(--border);
  background: var(--bone); color: var(--ink-2); cursor: pointer; pointer-events: auto; vertical-align: middle; }
#kursorXY .kxy-uk:hover { color: var(--ink); }
#kursorXY .kxy-uk:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
#kursorXY .kxy-uk[data-tip]:hover::after, #kursorXY .kxy-uk[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; left: 0; bottom: calc(100% + 6px);
  background: var(--ink); color: var(--bone); font: 500 var(--fs-opis)/1.4 var(--font-body); padding: 4px 8px; white-space: nowrap; box-shadow: var(--shadow-3); pointer-events: none; z-index: 100; }
#kursorXY.kxy-przygas > :not(.kxy-uk) { opacity: 0.45; }

.wc-nakl > .wc-nakl-pl { display: none; }
.shp-tryb-rysuj .wc-nakl > .wc-nakl-pl:not(:empty) { display: flex; font: 600 var(--fs-body)/1.3 var(--font-body); color: var(--ink); padding: 3px 8px; min-height: 30px; }
.shp-tryb-rysuj .wc-nakl > .wc-nakl-os { pointer-events: auto; cursor: pointer; }

.wc-nakl > .wc-nakl-os { position: relative; }
.wc-nakl-os[data-tip]::after { content: attr(data-tip); position: absolute; left: calc(100% + 6px); top: 50%; transform: translateY(-50%); background: var(--ink); color: var(--bone);
  font: 500 var(--fs-opis)/1.4 var(--font-body); padding: 4px 8px; white-space: nowrap; box-shadow: var(--shadow-3); pointer-events: none; z-index: 100; }
.shp-tryb-rysuj.shp-3d .shp-ibar .shp-ibtn[aria-disabled="true"] { opacity: .4; }

.shp-tryb-rysuj.shp-3d .shp-snap > :not(.shp-snap-para), .shp-tryb-rysuj.shp-3d .shp-snap-para > :not(.shp-snap-obr) { display: none; }
.shp-tryb-rysuj.shp-3d #kursorXY { visibility: hidden; }

.shp-tryb-rysuj.shp-3d #shapeCv { cursor: default; }
.wc-nakl-zoom { font: 500 var(--fs-opis)/1.2 var(--font-mono); color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.wc-view .cv-bar .cv-mode button:hover { color: var(--ink); }
.wc-view .cv-bar .cv-mode button.active { background: transparent; color: var(--ink); box-shadow: inset 0 -2px 0 var(--clay); }


.shp-tryb-rysuj #wcInspDrawer, .shp-tryb-rysuj #btnResultToggle { display: none; }
.wc-app:not(.shp-tryb-rysuj) .wc-ops, .wc-app:not(.shp-tryb-rysuj) #btnOpsToggle { display: none; }
.wc-app:not(.shp-tryb-rysuj) #btnShpGen { display: none; }   
.wc-ops .wc-scrollpane { padding: 6px 0; gap: 0; }
.wc-ops .shp-list { margin-top: 0; }
.wc-ops .ot-g { padding: 0 14px 0 12px; }
.wc-ops .ot-o { padding-right: 14px; }
.wc-ops .ot-kids { margin-left: 18px; }

.wc-ops .shp-wezel[data-w] > .ot-kids { margin-left: 9px; }
.wc-ops .wc-scrollpane > .mag-note { margin: 8px 16px; }
.wc-ops .wc-ph .btn-mini { margin: -4px 0; }
.wc-ops-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; font-family: var(--font-mono); font-size: var(--fs-opis); }
.wc-ops-foot span { min-width: 0; }   


.wc-view #drop {
  position: absolute; inset: 20px; z-index: 6; border: 1.5px dashed var(--plaster);
  display: grid; place-items: center; background: var(--paper); padding: 0; margin: 0; cursor: default;
}
.wc-view #drop.hover { border-color: var(--clay); }
.wc-view #drop[hidden] { display: none; }

.wc-view:has(> #drop:not([hidden])) > :is(.cv-bar, .wc-nakl) { visibility: hidden; }
.wc-drop-in { text-align: center; display: grid; gap: 14px; justify-items: center; max-width: 520px; padding: 0 24px; }
.wc-drop-in .wc-ico { width: 64px; height: 64px; border: 1.5px solid var(--ink-3); display: grid; place-items: center; font: 500 var(--fs-opis) var(--font-mono); color: var(--ink-3); }
.wc-drop-in h3 { font-size: 24px; font-weight: 800; letter-spacing: -0.03em; margin: 0; }
.wc-drop-in .wc-fmt { font: var(--fs-small) var(--font-mono); color: var(--ink-3); }
.wc-drop-in .wc-acts { display: flex; gap: 10px; margin-top: 4px; justify-content: center; }
.wc-drop-in .wc-acts .btn { width: auto; margin: 0; padding: 10px 18px; }

.wc-drop-in .btn-ghost { background: transparent; color: var(--ink); border-color: var(--border); }
.wc-drop-in .btn-ghost:hover { border-color: var(--ink); }


.wc-liczy { position: absolute; inset: 0; z-index: 20; display: grid; place-items: center; pointer-events: none; }

.wc-liczy[hidden], .wc-liczy [hidden] { display: none; }

.wc-liczy.nad-wynikiem { background: rgba(var(--bone-rgb), 0.84); pointer-events: auto; }
.wc-liczy-in { pointer-events: auto; width: calc(100% - var(--s-8)); max-width: 480px; display: grid; gap: var(--s-3);
  padding: var(--s-6); background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-2); color: var(--ink); }
.wc-liczy-nad { font: 500 var(--fs-caption)/1.2 var(--font-mono); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--ink-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wc-liczy h3 { margin: 0; font: 800 var(--fs-h6)/1.2 var(--font-body); letter-spacing: var(--tracking-snug); }
.wc-liczy-tor { height: var(--s-2); background: var(--linen); box-shadow: var(--shadow-inset); }
.wc-liczy-tor > i { display: block; height: 100%; width: 0; background: var(--ink); transition: width var(--dur-base) var(--ease-out); }
.wc-liczy-liczby { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-4);
  font: 500 var(--fs-body)/1.3 var(--font-mono); font-variant-numeric: tabular-nums; }
.wc-liczy-droga, .wc-liczy-etapy, .wc-liczy-opis { font-size: var(--fs-small); color: var(--ink-3); margin: 0; }
.wc-liczy-droga { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.wc-liczy-etapy { list-style: none; padding: var(--s-3) 0 0; border-top: 1px solid var(--border); display: grid; gap: var(--s-1); }
.wc-liczy-etapy li { display: flex; gap: var(--s-2); }
.wc-liczy-etapy li b { width: 1em; font-weight: 600; }
.wc-liczy-etapy li span { margin-left: auto; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.wc-liczy-etapy li.teraz { color: var(--ink); font-weight: 600; }
.wc-liczy-akcje { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--s-2); }
.wc-liczy-akcje .btn { width: auto; margin: 0; padding: 10px 18px; }
.wc-liczy .btn-ghost { background: transparent; color: var(--ink); border-color: var(--border); }
.wc-liczy .btn-ghost:hover { border-color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .wc-liczy-tor > i { transition: none; } }

.wc-liczy.wc-blad .wc-liczy-in { border-left: var(--s-1) solid var(--clay); }
.wc-blad .wc-liczy-nad { color: var(--clay-deep); }
.wc-blad-opis { margin: 0; font: 400 var(--fs-body)/1.5 var(--font-body); color: var(--ink-2); }
.wc-blad-dot { margin: 0; font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }

.ma-blad::before { content: "!"; display: inline-block; width: var(--s-5); height: var(--s-5); margin-right: var(--s-2); vertical-align: middle;
  background: var(--clay-deep); color: var(--paper); box-shadow: 0 0 0 1px var(--paper);
  font: 800 var(--fs-small)/var(--s-5) var(--font-body); text-align: center; }

.wc-view.wc-bez-wyniku .cv-wrap > canvas:not(#shapeCv):not(.shp-gl) { visibility: hidden; }
#wcResult.wc-wynik-liczy > :not(.wc-wynik-pusty) { display: none; }
.wc-drop-in .wc-ex { margin-top: 12px; font-size: var(--fs-small); color: var(--ink-3); }
.wc-drop-in .wc-ex button { font: inherit; color: var(--ink); background: none; border: 0; border-bottom: 1px solid var(--clay); padding: 0; cursor: pointer; }
.wc-drop-in .wc-priv { margin-top: 18px; font-size: var(--fs-small); color: var(--ink-3); }


.shp-pusto { position: absolute; inset: 0 var(--wc-zasl-p, 0px) 0 var(--wc-zasl-l, 0px); display: grid; place-items: start center; padding-top: max(var(--s-32), calc(var(--shp-belka-dol, 0px) + var(--s-6))); pointer-events: none; z-index: 2; }
.shp-pusto[hidden] { display: none; }

.shp-izol { position: absolute; top: var(--s-8); right: calc(var(--wc-zasl-p, 0px) + var(--s-3)); z-index: 3;
  display: flex; align-items: center; gap: var(--s-3); padding: var(--s-1) var(--s-1) var(--s-1) var(--s-3);
  background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-1); font: 500 var(--fs-small)/1.2 var(--font-mono); color: var(--ink); white-space: nowrap; }
.shp-izol[hidden], .cv-wrap:not(.shp-rysuj) > .shp-izol { display: none; }
.shp-pusto .wc-drop-in { gap: 10px; max-width: 480px; text-shadow: 0 0 3px var(--plotno), 0 0 3px var(--plotno), 0 0 6px var(--plotno), 0 0 10px var(--plotno); }
.shp-pusto .wc-ex { margin-top: 0; }

.shp-pusto .wc-acts { pointer-events: auto; margin-top: 8px; }
.shp-pusto .btn { text-shadow: none; }

.shp-dymek { position: absolute; z-index: 3; pointer-events: none; white-space: nowrap;
  font: 500 var(--fs-body)/1 var(--font-mono); letter-spacing: -0.01em; font-variant-numeric: tabular-nums;
  padding: 7px 9px; background: var(--ink); color: var(--paper); box-shadow: 0 0 0 1px var(--plotno); }
.shp-dymek[hidden] { display: none; }
.shp-dymek-kot { display: block; margin-top: 6px; font-size: var(--fs-opis); }   

.shp-zm-pom { position: absolute; z-index: 3; pointer-events: none; white-space: nowrap;
  font: 500 var(--fs-body)/1 var(--font-mono); letter-spacing: -0.01em; font-variant-numeric: tabular-nums;
  padding: 6px 8px; background: var(--bone); color: var(--ink); border: 1px solid var(--ink-3); }
.shp-zm-et[hidden], .cv-wrap:not(.shp-rysuj) > .shp-zm-et { display: none; }
.shp-dymek-akt { display: inline-block; background: var(--paper); color: var(--ink); padding: 2px 4px; margin: -2px 1px; }
.shp-dymek-kur { display: inline-block; width: 1.5px; height: 1em; background: currentColor; vertical-align: top; margin-left: 1px; animation: shp-dymek-mig 1.1s steps(1) infinite; }
@keyframes shp-dymek-mig { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .shp-dymek-kur { animation: none; } }
.shp-pusto-tryb { font: 500 var(--fs-caption)/1 var(--font-mono); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--ink-3); }


.wc-app #stats, .wc-app #chipStats { display: none; }
#wcDet { display: flex; flex-direction: column; gap: 14px; }
#wcDet:empty { display: none; }
.wc-kpi { display: grid; gap: 4px; }
.wc-kpi .wc-v { font: 800 30px/1 var(--font-display); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.wc-kpi .wc-v small { font: 600 var(--fs-opis) var(--font-body); color: var(--ink-3); letter-spacing: 0; margin: 0 6px 0 2px; }

.wc-kpi .wc-ref { font-size: var(--fs-small); line-height: 1.4; color: var(--ink-2); }
.wc-kpi .wc-ref small { font-size: var(--fs-opis); color: var(--ink-3); }

.wc-ruch > .wc-statl { margin-top: var(--s-3); }

.wc-ruch > summary { flex-wrap: wrap; row-gap: 4px; white-space: nowrap; }
.wc-ruch > summary .nm { white-space: normal; overflow: visible; }
.wc-alerts { font-size: var(--fs-opis); line-height: 1.5; color: var(--ink-2); padding: 10px 12px; background: var(--linen); border-left: 2px solid var(--ochre); }
.wc-alerts i { font-style: normal; }

.wc-przed-start { display: grid; gap: var(--s-2); }

.wc-narz { display: grid; gap: var(--s-1); padding: var(--s-2) var(--s-3); background: var(--linen); border-left: 2px solid var(--clay); }
.wc-narz.wc-narz-uw { border-left-color: var(--ochre); }
.wc-narz-w { font: 700 var(--fs-body)/1.35 var(--font-body); color: var(--ink); overflow-wrap: anywhere; }
.wc-narz-w span { font-weight: 500; color: var(--ink-2); }
.wc-narz small { font-size: var(--fs-small); line-height: 1.4; color: var(--ink-2); }
.wc-przed-start > small, .wc-narz-dalej small, .wc-narz-plik small { font-size: var(--fs-small); line-height: 1.4; color: var(--ink-2); }


.wc-narz-dalej { margin-top: 0; }
.wc-narz-dalej summary { cursor: pointer; font: 600 var(--fs-small)/1.4 var(--font-body); letter-spacing: normal; text-transform: none; color: var(--ink); padding: var(--s-1) 0; }
.wc-narz-lista { list-style: none; margin: 0 0 var(--s-2); padding: 0; font-size: var(--fs-small); line-height: 1.4; color: var(--ink-2); }

.wc-narz-lista.wc-dluga { max-height: calc(8 * (2 * 1.4em + 2 * var(--s-1))); overflow-y: auto; }
.wc-narz-lista li { padding: var(--s-1) 0; border-top: 1px solid var(--border); overflow-wrap: anywhere; }
.wc-narz-pliki { display: grid; gap: var(--s-2); }

.wc-narz-m6.shp-mat-uw { margin: 0; }
.wc-narz-plik { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); justify-content: space-between; padding-top: var(--s-2); border-top: 1px solid var(--border); font-size: var(--fs-small); color: var(--ink-2); }
.wc-narz-plik.wc-on { color: var(--ink); font-weight: 600; }
.wc-tt { width: 100%; border-collapse: collapse; font-size: var(--fs-opis); }
.wc-tt td { padding: 6px 0; border-top: 1px solid var(--border); vertical-align: top; }
.wc-tt td.wc-n { text-align: right; font: 500 var(--fs-opis) var(--font-mono); white-space: nowrap; padding-left: 8px; }
.wc-tt small { display: block; color: var(--ink-3); font-size: var(--fs-opis); }
.wc-meter { height: 8px; background: var(--linen); display: flex; margin-top: 8px; }
.wc-meter i { display: block; height: 100%; }
.wc-mlab { display: flex; justify-content: space-between; gap: 8px; font-size: var(--fs-opis); color: var(--ink-3); margin-top: 5px; }
.wc-statl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 10px; font-size: var(--fs-opis); margin: 0; }
.wc-statl dt { color: var(--ink-3); margin: 0; }
.wc-statl dd { margin: 0; font: 500 var(--fs-opis) var(--font-mono); text-align: right; }


.wc-drawer {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 40;
  width: 420px; max-width: calc(100vw - 24px); max-height: min(70vh, 560px);
  overflow-y: auto; overflow-x: hidden; white-space: normal; cursor: default;
  background: var(--paper); border: 1px solid var(--border); box-shadow: var(--shadow-3); padding: 16px;
}
.wc-drawer[hidden] { display: none; }
.wc-drawer .wc-scrollpane { padding: 0; overflow: visible; }


.wc-status { display: flex; align-items: center; gap: 18px; padding: 0 14px; background: var(--paper); border-top: 1px solid var(--border); font: 11px var(--font-mono); color: var(--ink-3); white-space: nowrap; overflow: hidden; }
.wc-status > * { flex: none; }
.wc-status .wc-ok::before { content: "●"; color: var(--sage); margin-right: 6px; }
.wc-status .wc-zle::before { content: "●"; color: var(--clay); margin-right: 6px; }
.wc-status #cvHelp { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.wc-status .wc-lock { margin-left: auto; }


.wc-szyna { display: none; }
.wc-app:not(.wc-przyp-l) .wc-szyna-l, .wc-app:not(.wc-przyp-p) .wc-szyna-p {
  display: flex; flex-direction: column; gap: 2px; padding: 6px 0; min-height: 0; background: var(--paper);
}
.wc-szyna-l { border-right: 1px solid var(--border); }
.wc-szyna-p { border-left: 1px solid var(--border); }

.wc-szyna button {
  writing-mode: vertical-rl; display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 12px 0; border: 0; background: none; cursor: pointer;
  color: var(--ink-3); font: 600 var(--fs-opis)/1 var(--font-body); white-space: nowrap;
}
.wc-szyna-l button { transform: rotate(180deg); }
.wc-szyna-l button .ik { transform: rotate(180deg); }
.wc-szyna button:hover { color: var(--ink); background: var(--bone); }
.wc-szyna button.wc-on { color: var(--ink); background: var(--bone); box-shadow: inset 2px 0 0 var(--clay); }
.wc-szyna button:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.wc-szyna .wc-cnt { font: 500 10.5px var(--font-mono); color: var(--ink-4); }
.shp-tryb-rysuj .wc-szyna [data-panel="wcInspDrawer"],
.wc-app:not(.shp-tryb-rysuj) .wc-szyna [data-panel="wcOpsDrawer"] { display: none; }

.wc-app:not(.wc-przyp-l) .wc-side, .wc-app:not(.wc-przyp-p) .wc-insp {
  position: absolute; top: 0; bottom: 0; z-index: 60; box-shadow: var(--shadow-3);
}
.wc-app:not(.wc-przyp-l) .wc-side { left: var(--wc-szyna); width: var(--wc-szer-l); }
.wc-app:not(.wc-przyp-p) .wc-insp { right: var(--wc-szyna); width: var(--wc-szer-p); }
.wc-app:not(.wc-przyp-l) .wc-side:not(.wc-open),
.wc-app:not(.wc-przyp-p) .wc-insp:not(.wc-open) { display: none; }


.wc-app.wc-z-l { --wc-zasl-l: var(--wc-szer-l); }
.wc-app.wc-z-p { --wc-zasl-p: var(--wc-szer-p); }


.wc-przypnij { width: 28px; height: 28px; flex: none; display: grid; place-items: center; padding: 0; border: 0; background: none; color: var(--ink-3); cursor: pointer; }
.wc-przypnij:hover { color: var(--ink); background: var(--linen); }
.wc-przypnij:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.wc-tabs .wc-przypnij { align-self: center; margin: 0 -6px 0 auto; }
.wc-ph h4 { margin-right: auto; }
.wc-ph .wc-przypnij { margin: -6px -8px -6px 0; }
.wc-app:not(.wc-przyp-l) .wc-side .ik-zwin, .wc-przyp-l .wc-side .ik-przypnij,
.wc-app:not(.wc-przyp-p) .wc-insp .ik-zwin, .wc-przyp-p .wc-insp .ik-przypnij { display: none; }

@media (max-width: 1279px) {
  
  .wc-bar { gap: 8px; padding-left: 12px; }
  .wc-bar #btnConv kbd, .wc-logo span { display: none; }
  .wc-logo { padding-right: 10px; }
  
  .wc-logo .wc-ver { gap: 0; }
  .wc-logo .wc-ver-plak { min-width: 16px; height: 16px; padding: 0 3px; line-height: 16px; margin-left: 2px; }
  
  .wc-ctx > small { display: none; }
  .wc-bar > .wc-ctx { max-width: 200px; }
  
  .wc-bar .shp-tryb-dl { display: none; }
  .wc-bar .shp-tryb-kr { display: inline; }
  .wc-bar .shp-tryb button { padding: 0 9px; }
  .wc-app.shp-tryb-rysuj .wc-bar > .wc-file { min-width: 0; padding-left: 0; }
}


.wc-kr-tlo { position: absolute; inset: 0; z-index: 90; display: grid; grid-template-rows: minmax(0, 1fr); place-items: center; padding: 32px; background: rgba(0, 0, 0, .35); }
.wc-kr-tlo[hidden] { display: none; }
.wc-kr { width: 800px; max-width: 100%; height: min(660px, 100%); display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; background: var(--paper); color: var(--ink); border: 1px solid var(--border); box-shadow: var(--shadow-3); font-size: var(--fs-opis); }
.wc-kr.wc-kr-bez-szyny { grid-template-rows: auto minmax(0, 1fr) auto; }
.wc-kr-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 16px; }
.wc-kr-head h2 { margin: 8px 0 0; font: 800 22px/1.2 var(--font-body); letter-spacing: -0.02em; color: var(--ink); }
.wc-kr-head-akcje { display: flex; align-items: center; gap: 12px; flex: none; }

.wc-kr-jezyk { display: flex; }
.wc-kr-jezyk button { height: 28px; min-width: 38px; padding: 0 8px; font: 500 var(--fs-small)/1 var(--font-mono); letter-spacing: .1em; }
.wc-kr-szyna { list-style: none; margin: 0; padding: 0 24px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 12px; border-bottom: 1px solid var(--border); }
.wc-kr-szyna li { display: flex; align-items: center; gap: 8px; padding-bottom: 12px; margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: var(--fs-small); font-weight: 600; color: var(--ink-3); }
.wc-kr-szyna i { width: 20px; height: 20px; display: grid; place-items: center; font: 500 var(--fs-caption)/1 var(--font-mono); font-style: normal; border: 1px solid var(--plaster); color: var(--ink-3); }
.wc-kr-szyna .wc-on { color: var(--ink); border-bottom-color: var(--clay); }
.wc-kr-szyna .wc-on i { background: var(--clay); border-color: var(--clay); color: var(--paper); }
.wc-kr-szyna .wc-done { color: var(--ink-2); }
.wc-kr-szyna .wc-done i { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.wc-kr-body { display: grid; grid-template-columns: minmax(0, 1fr) 256px; min-height: 0; }
.wc-kr-body.wc-kr-jedna { grid-template-columns: minmax(0, 1fr); }
.wc-kr-body > .wc-scrollpane { padding: 20px 24px 8px; gap: 0; }
.wc-kr-po { border-left: 1px solid var(--border); background: var(--bone); padding: 20px; display: flex; flex-direction: column; gap: 12px; overflow-y: auto; font-size: var(--fs-small); line-height: 1.55; color: var(--ink-2); }
.wc-kr-po p { margin: 0; font-size: inherit; line-height: inherit; color: inherit; }
.wc-kr-po b { color: var(--ink); font-weight: 600; }
.wc-kr-foot { display: flex; align-items: center; gap: 10px; padding: 14px 24px; border-top: 1px solid var(--border); }
.wc-kr-info { margin-right: auto; font-size: var(--fs-opis); color: var(--ink-3); }
.wc-kr-info.wc-kr-blad { color: var(--clay); font-weight: 600; }
.wc-kr-foot .btn { margin: 0; width: auto; height: 34px; padding: 0 16px; font-size: var(--fs-small); }
.wc-kr-foot .btn-mini { height: 34px; padding: 0 12px; }
.wc-kr-foot .btn-mini:not(.ghost) { border-color: var(--ink-3); color: var(--ink); }
.wc-kr .row2 .shp-toggle { display: flex; height: 34px; }
.wc-kr .row2 .shp-toggle button { flex: 1; }
.wc-kr-lead { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ink-2); max-width: 58ch; }
.wc-kr-kroki { list-style: none; margin: 18px 0 0; padding: 0; border-top: 1px solid var(--border); }
.wc-kr-kroki li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--border); }
.wc-kr-kroki i { font: 500 var(--fs-caption)/1 var(--font-mono); font-style: normal; color: var(--clay); }
.wc-kr-kroki b { font-size: 14px; font-weight: 700; display: block; }
.wc-kr-kroki span { color: var(--ink-3); font-size: var(--fs-small); }
.wc-kr-kroki small { font: var(--fs-opis) var(--font-mono); color: var(--ink-3); }

.wc-kr-tag { display: inline-block; font: 500 var(--fs-caption)/1.5 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; padding: 1px 6px; border: 1px solid var(--ochre); color: var(--ink-2); white-space: nowrap; }
.wc-kr-akcje { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

.wc-kr-foot .btn[aria-disabled="true"] { opacity: .35; cursor: default; }
.wc-kr select { width: 100%; background: var(--bone); color: var(--ink); padding: 0 28px 0 10px; font: 500 var(--fs-small) var(--font-body); }

.wc-kr-nrz { --c-dia: 48px; --c-z: 16px; --c-t: 26px; --c-gap: 10px; --c-pad: 8px; margin: 10px 0 0; }
.wc-kr-nrz-h { display: grid; grid-template-columns: 20px minmax(0, 1fr) var(--c-dia) var(--c-z) var(--c-t); column-gap: var(--c-gap); padding: 0 var(--c-pad) 4px 2px; font: 500 var(--fs-caption)/1 var(--font-mono); letter-spacing: .1em; color: var(--ink-3); text-transform: uppercase; }
.wc-kr-nrz-h span:nth-child(n+3) { text-align: right; }
.wc-kr .nrz, .wc-kr .nrz:hover { cursor: default; background: none; }
.wc-kr-sum { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; margin: 0; border-top: 1px solid var(--border); }
.wc-kr-sum > * { padding: 11px 0; border-bottom: 1px solid var(--border); margin: 0; }
.wc-kr-sum dt { font: 500 var(--fs-caption)/1.6 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.wc-kr-sum dd { font-size: var(--fs-small); line-height: 1.5; color: var(--ink); font-variant-numeric: tabular-nums; }
.wc-kr-sum dd small { display: block; color: var(--ink-3); font-size: var(--fs-small); }
.wc-kr-sum button { justify-self: end; align-self: start; }

.wc-kr.wc-kr-waskie { width: 520px; height: auto; max-height: 100%; }
.wc-kr-waskie .wc-kr-akcje { margin: 14px 0; }
.wc-kr-waskie .field { margin-top: 4px; }
.wc-kr-waskie .field .wc-kr-akcje { margin: 0; flex-wrap: nowrap; }
.wc-kr-waskie .field input { flex: 1; font-family: var(--font-body); }

.bib-zapis { display: grid; gap: 10px; padding-bottom: 16px; margin-bottom: 14px; border-bottom: 1px solid var(--border); }
.bib-zapis .wc-kr-akcje, .bib-filtr { gap: 8px; flex-wrap: wrap; }
.bib-projekt input, .bib-filtr input { flex: 1; min-width: 160px; padding: 0 9px; background: var(--bone); color: var(--ink); font: 500 var(--fs-small) var(--font-body); }
.wc-kr .bib-filtr select, .wc-kr .bib-gdzie select { width: auto; }
.bib-gdzie { display: flex; align-items: center; gap: 10px; font-size: var(--fs-small); color: var(--ink-2); }
.bib-lista { list-style: none; margin: 12px 0 0; padding: 0; border-top: 1px solid var(--border); }
.bib-lista li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--border); }
.bib-lista li[aria-busy="true"] { opacity: .5; }
.bib-lista .wc-kr-akcje { grid-column: 1 / -1; gap: 6px; }
.bib-nazwa b { display: block; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.bib-nazwa small { color: var(--ink-3); font-size: var(--fs-opis); }
.bib-miejsce { font: 500 var(--fs-caption)/1.5 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }
.bib-lista .btn-mini.bib-uwaga { color: var(--clay); border-color: var(--clay); }
.bib-pytanie { font-size: var(--fs-small); color: var(--ink-2); margin-right: 2px; }


.wc-maly { display: none; }
html.wc-blokada .wc-app { grid-template-rows: minmax(0, 1fr); min-height: 0; }
html.wc-blokada .wc-app > :not(.wc-maly) { display: none !important; }
html.wc-blokada .wc-maly { display: grid; place-items: center; background: var(--bone); color: var(--ink); overflow: auto; }
html.wc-blokada .wc-maly .wc-logo { border-right: 0; padding-right: 0; }
html.wc-blokada .wc-maly .wc-logo span { display: inline; }
html.wc-blokada .wc-maly p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink-2); }


#btnKonto[aria-pressed="true"] { border-radius: 50%; background: var(--accent); border-color: var(--accent); color: var(--accent-fg); }
.wc-konto-ini { font: 700 var(--fs-opis)/1 var(--font-body); }

.wc-kr .btn-mini.wc-uwaga:not(:disabled) { color: var(--clay); border-color: var(--clay); }


.wc-wylog { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; background: var(--bone); color: var(--ink); overflow: auto; }
.wc-wylog[hidden] { display: none; }
.wc-wylog .wc-logo { border-right: 0; padding-right: 0; }
.wc-wylog p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink-2); }


.wc-view { --kod-h: 0px; }
.wc-view .cv-wrap { bottom: var(--kod-h); }
.wc-view .cv-bar { bottom: calc(var(--kod-h) + 12px); }
.wc-kod-otworz { position: absolute; right: calc(12px + var(--wc-zasl-p, 0px)); bottom: 12px; z-index: 6; display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px 0 12px; background: var(--bone); border: 1px solid var(--border); box-shadow: var(--shadow-1); font: 600 var(--fs-opis) var(--font-body); color: var(--ink); cursor: pointer; }
.wc-kod-otworz:hover { border-color: var(--ink); }
.wc-kod-otworz small { font: 500 11px var(--font-mono); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.wc-kod-otworz kbd { font: 500 10px var(--font-mono); color: var(--ink-3); border: 1px solid var(--border); padding: 0 4px; line-height: 16px; }
.wc-kod-otworz[hidden], .wc-kod[hidden] { display: none; }

.wc-kod { position: absolute; left: 0; right: 0; bottom: 0; height: var(--kod-h); z-index: 7; display: grid; grid-template-rows: auto auto minmax(0, 1fr); background: var(--paper); border-top: 1px solid var(--border); box-shadow: var(--shadow-2); }
.wc-kod-uchwyt { position: absolute; left: 0; right: 0; top: -4px; height: 8px; cursor: ns-resize; z-index: 1; }
.wc-kod-uchwyt::after { content: ""; position: absolute; left: 50%; top: 3px; width: 32px; height: 2px; margin-left: -16px; background: var(--plaster); }
.wc-kod-head { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px 0 14px; border-bottom: 1px solid var(--border); min-width: 0; white-space: nowrap; }
.wc-kod-head > * { flex: none; }
.wc-kod-tytul { font-weight: 700; font-size: var(--fs-opis); color: var(--ink); }
.wc-kod-meta { font: 11px var(--font-mono); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.wc-kod-seg { display: inline-flex; }
.wc-kod-seg button { border: 0; background: transparent; font: 600 var(--fs-opis) var(--font-body); color: var(--ink-3); padding: 0 10px; height: 40px; cursor: pointer; }
.wc-kod-seg button:hover { color: var(--ink); }
.wc-kod-seg button.wc-on { color: var(--ink); box-shadow: inset 0 -2px 0 var(--clay); }
.wc-kod-sp { flex: 1 1 0; min-width: 0; }
.wc-kod-nav { display: inline-flex; align-items: center; height: 28px; border: 1px solid var(--ink-4); background: var(--bone); }
.wc-kod-typ { height: 100%; border: 0; border-right: 1px solid var(--border); background: transparent; color: var(--ink); font: 500 var(--fs-opis) var(--font-body); padding: 0 24px 0 8px; cursor: pointer; }
.wc-kod-nav button, .wc-kod-szukaj button { width: 26px; height: 100%; border: 0; background: transparent; color: var(--ink-2); font-size: var(--fs-opis); cursor: pointer; padding: 0; }
.wc-kod-nav button:hover, .wc-kod-szukaj button:hover { color: var(--ink); background: var(--linen); }
.wc-kod-licz { font: 500 var(--fs-opis) var(--font-mono); color: var(--ink-2); padding: 0 4px; font-variant-numeric: tabular-nums; min-width: 64px; text-align: center; }
.wc-kod-idz { height: 28px; width: 104px; background: var(--bone); font: 500 var(--fs-opis) var(--font-mono); padding: 0 8px; color: var(--ink); }
.wc-kod-idz::placeholder, .wc-kod-szukaj input::placeholder { font-family: var(--font-body); font-weight: 500; }

.wc-kod-szukaj input:is(:hover, :focus), .wc-kod-nav .wc-kod-typ:is(:hover, :focus) { border-color: var(--border); box-shadow: none; }
.wc-kod-nav:has(> .wc-kod-typ:focus), .wc-kod-szukaj:has(> input:focus) {
  border-color: var(--cobalt); box-shadow: 0 0 0 1px var(--cobalt), var(--fokus-poswiata) color-mix(in srgb, var(--cobalt) var(--fokus-krycie), transparent);
}
.wc-kod-x { width: 28px; height: 28px; font-size: var(--fs-opis); }

.wc-kod-cols, .wc-kod-row { display: grid; grid-template-columns: 64px 16px minmax(0, 1fr) 52px 76px 96px; column-gap: 10px; padding: 0 24px 0 6px; align-items: center; }
.wc-kod-cols { height: 24px; font: 500 9.5px/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-4); border-bottom: 1px solid var(--border); white-space: nowrap; }
.wc-kod-cols span:first-child, .wc-kod-cols span:nth-child(4) { text-align: right; }
.wc-kod-cols .dwie { grid-column: 5 / 7; }
.wc-kod-wyjscie .wc-kod-cols .dwie { text-align: right; }
.wc-kod-body { position: relative; min-height: 0; }
.wc-kod-rows { position: absolute; inset: 0 12px 0 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; outline: none; }
.wc-kod-rows::-webkit-scrollbar { display: none; }
.wc-kod-in { position: relative; }
.wc-kod-in > .wc-kod-row { position: absolute; left: 0; right: 0; }
.wc-kod-row { height: 20px; font: 12px/20px var(--font-mono); color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; cursor: pointer; }
.wc-kod-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.wc-kod-row .n { text-align: right; color: var(--ink-4); }
.wc-kod-row .ev { text-align: center; font-size: 10.5px; align-self: stretch; position: relative; }
.wc-kod-row .ev-z { color: var(--ochre-deep); }
.wc-kod-row .ev-p { color: var(--ink-2); font-weight: 500; }
.wc-kod-row .ev-t { color: var(--clay); font-weight: 500; }
.wc-kod-row .k b { color: var(--ink); font-weight: 500; }
.wc-kod-row .k em { font-style: normal; color: var(--ink-3); }
.wc-kod-row .k .c { color: var(--ink-4); }
.wc-kod-row mark { background: var(--clay-soft); color: var(--ink); }
.wc-kod-row .f { text-align: right; color: var(--ink); }
.wc-kod-row .f.mod, .wc-kod-row .z.mod { color: var(--ink-4); }
.wc-kod-row .f.zl { color: var(--ink-3); }

.wc-kod-spark { width: 72px; height: 16px; display: block; border: 0; background: transparent; cursor: inherit; }
.wc-kod-row .z { text-align: right; color: var(--ink); }
.wc-kod-row.hov { background: var(--linen); }
.wc-kod-row.sel { background: var(--linen); box-shadow: inset 2px 0 0 var(--clay); }
.wc-kod-row.sel .n { color: var(--ink); font-weight: 500; }
.wc-kod-row.traf .n { color: var(--clay); }

.wc-kod-row .ev.luk::before { content: ""; position: absolute; left: 7px; width: 2px; top: 0; bottom: 0; background: var(--ink-3); }
.wc-kod-row .ev.luk-s::before { top: 5px; }
.wc-kod-row .ev.luk-e::before { bottom: 5px; }
.wc-kod-row .ev.luk-s::after, .wc-kod-row .ev.luk-e::after { content: ""; position: absolute; left: 7px; width: 6px; height: 2px; background: var(--ink-3); }
.wc-kod-row .ev.luk-s::after { top: 5px; }
.wc-kod-row .ev.luk-e::after { bottom: 5px; }
.wc-kod-row .ev.luk > span { position: relative; z-index: 1; background: var(--paper); }
.wc-kod-row.hov .ev.luk > span, .wc-kod-row.sel .ev.luk > span { background: var(--linen); }   
.wc-kod-wyj { position: absolute; left: 0; right: 0; background: var(--bone); border-left: 2px solid var(--clay); padding: 4px 0; overflow: hidden; }
.wc-kod-wyj-h { font-size: var(--fs-opis); line-height: 18px; color: var(--ink-3); padding: 0 24px 4px 96px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wc-kod-wyj-h b { color: var(--ink); font-weight: 600; }
.wc-kod-wyj .wc-kod-row { height: 18px; line-height: 18px; font-size: var(--fs-opis); color: var(--ink-3); padding-left: 4px; cursor: default; }
.wc-kod-wyj .wc-kod-row .n, .wc-kod-wyj .wc-kod-row .ev { color: var(--clay); }
.wc-kod-wyj .wc-kod-row .z { color: var(--ink-4); }
.wc-kod-gap .k { color: var(--ink-4); }
.wc-kod-ruler { position: absolute; top: 0; right: 0; bottom: 0; width: 12px; height: 100%; border: 0; border-left: 1px solid var(--border); background: var(--bone); cursor: pointer; }
.wc-kod-szukaj { position: absolute; top: 6px; right: 24px; z-index: 2; display: flex; align-items: center; height: 30px; background: var(--bone); border: 1px solid var(--ink-4); box-shadow: var(--shadow-2); }
.wc-kod-szukaj[hidden] { display: none; }
.wc-kod-szukaj input { width: 200px; height: 100%; border: 0; border-right: 1px solid var(--border); background: transparent; font: 500 var(--fs-opis) var(--font-mono); color: var(--ink); padding: 0 8px; }
.wc-kod-szukaj.brak input { color: var(--clay); }


.wc-app { --wc-nw-w: calc(var(--wc-szer-l) + var(--s-10)); }
.wc-app.wc-z-nw:not(.wc-przyp-h) { --wc-zasl-p: var(--wc-nw-w); }
.wc-app.wc-z-nw.wc-z-p:not(.wc-przyp-h) { --wc-zasl-p: calc(var(--wc-szer-p) + var(--wc-nw-w)); }
.wc-app.wc-z-nw:not(.wc-przyp-h) .wc-view > .wc-liczy { right: var(--wc-nw-w); }
.wc-app.wc-z-nw:not(.wc-przyp-h) .wc-kod { right: var(--wc-zasl-p); }

.wc-app.wc-z-nw:not(.wc-przyp-h) .wc-view #drop { right: calc(20px + var(--wc-nw-w)); }
.wc-nw { position: absolute; top: 0; right: 0; bottom: 0; z-index: 12; width: min(var(--wc-nw-w), 100%);
  display: flex; flex-direction: column; background: var(--paper); border-left: 1px solid var(--border); box-shadow: var(--shadow-3);
  font-family: var(--font-body); color: var(--ink); }
.wc-app.wc-z-p:not(.wc-przyp-p) .wc-nw { right: var(--wc-szer-p); }
.wc-nw[hidden] { display: none; }
.wc-nw-head { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3) var(--s-3) var(--s-3) var(--s-4); border-bottom: 1px solid var(--border); }
.wc-nw-head h2 { flex: 1; margin: 0; font: 700 var(--fs-body)/1.3 var(--font-body); letter-spacing: 0; }
.wc-nw-head h2:focus { outline: none; }
.wc-nw-zamknij { width: 32px; height: 32px; flex: none; display: grid; place-items: center; padding: 0; border: 1px solid transparent; background: none;
  color: var(--ink-2); font: 400 var(--fs-h6)/1 var(--font-body); cursor: pointer; }
.wc-nw-zamknij:hover { border-color: var(--border); color: var(--ink); }
.wc-nw-zamknij:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.wc-nw-body { flex: 1; min-height: 0; overflow: auto; padding: var(--s-4) var(--s-4) var(--s-6); font: 400 var(--fs-body)/1.5 var(--font-body); }
.wc-nw-info { margin: 0 0 var(--s-4); font-size: var(--fs-small); color: var(--ink-2); }
.wc-nw-tydz + .wc-nw-tydz { margin-top: var(--s-6); }
.wc-nw-tydz h3 { margin: 0; font: 800 var(--fs-h6)/1.25 var(--font-body); letter-spacing: var(--tracking-snug); }
.wc-nw-zakres { margin: 2px 0 0; padding-bottom: var(--s-2); border-bottom: 1px solid var(--border);
  font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }
.wc-nw-tydz h4 { margin: var(--s-4) 0 var(--s-1); font: 700 var(--fs-body)/1.3 var(--font-body); }
.wc-nw-lista { list-style: none; margin: 0; padding: 0; }
.wc-nw-lista li { padding: var(--s-2) 0; border-bottom: 1px solid var(--border); }
.wc-nw-lista li:last-child { border-bottom: 0; }
.wc-nw-lista p { margin: 0; }
.wc-nw-glowna > p:last-child { font-weight: 700; }
.wc-nw-meta { font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }
.wc-nw-meta span { color: var(--ink-2); }
.wc-nw-meta b { margin-left: var(--s-1); color: var(--clay-deep); font-weight: 600; }


.sz-pal { position: absolute; top: var(--s-2); left: 50%; transform: translateX(-50%); z-index: 80; width: min(620px, calc(100% - var(--s-8)));
  display: flex; flex-direction: column; max-height: calc(100% - var(--s-4)); background: var(--bone); color: var(--ink);
  border: 1px solid var(--ink-4); border-radius: 0; box-shadow: var(--shadow-3); font-family: var(--font-body); }
.sz-pal[hidden] { display: none; }
.sz-in { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-2) var(--s-3); border-bottom: 1px solid var(--border); color: var(--ink-2); }
.sz-in input { flex: 1; min-width: 0; font-size: var(--fs-body); }
.sz-in kbd, .sz-w kbd { margin: 0; font: 500 var(--fs-opis) var(--font-mono); color: var(--ink-2); border: 1px solid var(--border); background: var(--paper); padding: 1px 6px; }
.sz-lista { flex: 1; min-height: 0; overflow: auto; padding: var(--s-1) 0 var(--s-2); }
.sz-gr { padding: var(--s-3) var(--s-3) var(--s-1); font: 600 var(--fs-caption)/1.2 var(--font-mono); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--ink-3); }
.sz-w { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto 24px; column-gap: var(--s-3); row-gap: 2px; align-items: center;
  padding: 7px var(--s-3); border-left: 3px solid transparent; cursor: pointer; }
.sz-w[aria-selected="true"] { background: var(--hover); border-left-color: var(--ink); }
.sz-ik { grid-row: span 2; display: grid; place-items: center; color: var(--ink-2); }
.sz-ik svg { width: 20px; height: 20px; }
.sz-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 600 var(--fs-small)/1.35 var(--font-body); }
.sz-n u { text-decoration: underline; text-decoration-color: var(--clay); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.sz-n small { margin-left: var(--s-2); font: 400 var(--fs-opis) var(--font-body); color: var(--ink-3); }
.sz-w kbd, .sz-cel { grid-row: span 2; }

.sz-w[aria-selected="true"] .sz-n small, .sz-w[aria-selected="true"] .sz-cel, .sz-w[aria-selected="true"][aria-disabled="true"] .sz-n { color: var(--ink-2); }
.sz-wiecej-btn { grid-row: span 2; width: 24px; height: 24px; padding: 0; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 0;
  background: var(--paper); color: var(--ink-2); font: 600 var(--fs-opis)/1 var(--font-body); cursor: pointer; }
.sz-wiecej-btn:hover, .sz-wiecej-btn[aria-expanded="true"] { border-color: var(--ink); color: var(--ink); }
.sz-cel { font: 500 var(--fs-opis) var(--font-mono); color: var(--ink-3); }
.sz-o { grid-column: 2; min-width: 0; font: 400 var(--fs-opis)/1.4 var(--font-body); color: var(--ink-2); }
.sz-w[aria-disabled="true"] { cursor: default; }
.sz-w[aria-disabled="true"] .sz-n { color: var(--ink-3); }
.sz-w[aria-disabled="true"] .sz-o::before { content: "⊘ "; color: var(--ochre-deep); }
.sz-wiecej { grid-column: 2 / -1; margin: var(--s-1) 0 0; font: 400 var(--fs-opis)/1.5 var(--font-body); color: var(--ink); white-space: normal; }
.sz-pusto { padding: var(--s-3); font: 400 var(--fs-small)/1.5 var(--font-body); color: var(--ink-2); }
.sz-pusto p { margin: 0; }
.sz-stopka { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-4); padding: var(--s-2) var(--s-3); border-top: 1px solid var(--border); font: 500 var(--fs-opis)/1.4 var(--font-mono); color: var(--ink-3); }
.sz-stopka kbd { margin: 0; font: inherit; color: var(--ink-2); }
#szLupa[aria-expanded="true"] { background: var(--ink); border-color: var(--ink); color: var(--bone); }

.sz-pole { outline: 2px solid var(--ink) !important; outline-offset: 2px; box-shadow: 0 0 0 7px var(--sel) !important; }
.sz-mig { outline: 3px solid var(--sel); outline-offset: 1px; }

#btnNewFile .sz-nf-ik { display: none; }
@media (max-width: 1279px) {
  .wc-app.sz-wl .cv-akcje kbd { display: none; }
  .wc-app.sz-wl #btnNewFile .sz-nf-t { display: none; }
  .wc-app.sz-wl #btnNewFile .sz-nf-ik { display: inline-grid; }
}


.wc-app.wc-przyp-h .wc-mid { grid-template-columns: var(--wc-kol-l, var(--wc-szyna)) minmax(0, 1fr) var(--wc-nw-w) var(--wc-kol-p, var(--wc-szyna)); }
.wc-app.wc-przyp-h .wc-mid > .wc-szyna-l, .wc-app.wc-przyp-h .wc-mid > .wc-side { grid-column: 1; grid-row: 1; }
.wc-app.wc-przyp-h .wc-mid > .wc-view { grid-column: 2; grid-row: 1; }
.wc-app.wc-przyp-h .wc-mid > .wc-nw { grid-column: 3; grid-row: 1; position: relative; inset: auto; width: auto; min-width: 0; min-height: 0; box-shadow: none; z-index: auto; }
.wc-app.wc-przyp-h .wc-mid > .wc-insp, .wc-app.wc-przyp-h .wc-mid > .wc-szyna-p { grid-column: 4; grid-row: 1; }
.wc-app:not(.wc-przyp-h) .wc-nw .ik-zwin, .wc-przyp-h .wc-nw .ik-przypnij { display: none; }
.wc-nw-head .pm-pin { margin: -6px 0; }
.wc-nw[data-tresc="pomoc"] .wc-nw-body h3 { margin: 0 0 var(--s-2); font: 800 var(--fs-h5)/1.25 var(--font-body); }
.wc-nw[data-tresc="pomoc"] .wc-nw-body h4 { margin: var(--s-4) 0 var(--s-1); font: 700 var(--fs-body)/1.3 var(--font-body); }
.wc-nw[data-tresc="pomoc"] .wc-nw-body p { margin: 0 0 var(--s-2); }
.wc-nw[data-tresc="pomoc"] .wc-nw-body a { color: var(--ink); text-decoration-color: var(--clay); text-underline-offset: 2px; }
.wc-nw[data-tresc="pomoc"] .wc-nw-body kbd { margin: 0; font: 500 var(--fs-small) var(--font-mono); color: var(--ink); border: 1px solid var(--border); background: var(--bone); padding: 0 5px; }
.pm-sciezka { font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }
.wc-nw[data-tresc="pomoc"] .wc-nw-body code { font: 500 var(--fs-small) var(--font-mono); background: var(--bone); border: 1px solid var(--border); padding: 0 4px; }
.pm-meta { margin: 0 0 var(--s-3) !important; font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }
.pm-kroki { margin: 0 0 var(--s-2); padding-left: var(--s-5); }
.pm-kroki li { margin: 0 0 var(--s-1); }
.pm-linki { line-height: 1.9; }
.pm-pole { margin: 0 calc(-1 * var(--s-2)); padding: 0 var(--s-2); border-left: 3px solid transparent; }
.pm-pole.pm-kotwica { background: var(--hover); border-left-color: var(--ink); padding-block: var(--s-1); }
.pm-stopa { margin-top: var(--s-4) !important; padding-top: var(--s-2); border-top: 1px solid var(--border); font: 500 var(--fs-small)/1.4 var(--font-mono); color: var(--ink-3); }
.pm-szuk { display: flex; align-items: center; gap: var(--s-2); width: 100%; margin: 0 0 var(--s-3); padding: var(--s-2) var(--s-3); border: 1px solid var(--border); background: var(--bone);
  color: var(--ink-2); font: 500 var(--fs-body) var(--font-body); text-align: left; cursor: pointer; }
.pm-szuk:hover { border-color: var(--ink); color: var(--ink); }
.pm-szuk kbd { margin-left: auto !important; }

.pm-pasek-link { pointer-events: auto; display: inline-flex; align-items: center; min-height: 26px; padding: 0 var(--s-1); border: 0; background: none; cursor: pointer;
  font: inherit; font-size: var(--fs-opis); font-weight: 600; color: var(--ink); text-decoration: underline; text-decoration-color: var(--clay); text-underline-offset: 2px; }
.pm-pasek-link:hover { background: var(--hover); }