*,*::before,*::after{box-sizing:border-box}
html{background:var(--wk-bg-deep);color-scheme:dark}
html,body{overflow-x:hidden}body{margin:0;background:var(--wk-bg);color:var(--wk-text);font:var(--wk-fs-body);-webkit-font-smoothing:antialiased;min-block-size:100dvh}
:focus-visible{outline:var(--wk-focus);outline-offset:var(--wk-focus-off);border-radius:var(--wk-r-chip)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
a{color:var(--wk-accent-text)}
h1,h2,h3,p{margin:0}
.num,.code,.mono{font-family:var(--wk-font-mono);font-variant-numeric:tabular-nums}
.label{font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);text-transform:uppercase;color:var(--wk-text-muted)}
.sr{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Shell ---------- */
.app{display:grid;grid-template-rows:var(--wk-topbar-h) 1fr var(--wk-tabbar-h);min-block-size:100dvh}
.topbar{display:flex;align-items:center;gap:var(--wk-s-4);padding-inline:var(--wk-gutter);border-block-end:1px solid var(--wk-line);background:var(--wk-bg);position:sticky;inset-block-start:0;z-index:5}
.brand{font:900 18px/1 var(--wk-font-sans);letter-spacing:var(--wk-ls-tight);text-transform:uppercase;display:flex;align-items:center;gap:var(--wk-s-3)}
.brand i{inline-size:10px;block-size:10px;border-radius:50%;background:var(--wk-accent);box-shadow:var(--wk-glow-dot)}
.topbar .spacer{flex:1}
.avatar{inline-size:36px;block-size:36px;border-radius:50%;background:var(--wk-accent);color:var(--wk-on-accent);font:800 14px/1 var(--wk-font-sans);display:grid;place-items:center;box-shadow:var(--wk-glow-dot)}
.search-btn{gap:8px;color:var(--wk-text-muted);min-block-size:36px}
.search-btn .sk{display:none}
@media (min-width:900px){.search-btn .sk{display:inline}.search-btn{min-inline-size:220px;justify-content:flex-start}}
.search-btn kbd{font:var(--wk-fs-code);border:1px solid var(--wk-line-strong);border-radius:4px;padding:2px 5px;margin-inline-start:auto}
.printer-pill{white-space:nowrap;display:inline-flex;align-items:center;gap:var(--wk-s-3);block-size:36px;padding-inline:var(--wk-s-5);border:1px solid var(--wk-line-hot);background:var(--wk-accent-soft);border-radius:var(--wk-r-pill);font:var(--wk-fs-num-s)}
.printer-pill b{color:var(--wk-accent-text)}
main{padding:var(--wk-s-6) var(--wk-gutter) var(--wk-s-8);container-type:inline-size;max-inline-size:1400px;inline-size:100%;margin-inline:0}
.tabbar{position:sticky;inset-block-end:0;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border-block-start:1px solid var(--wk-line);background:var(--wk-bg);z-index:5}
.tabbar button{display:grid;place-items:center;gap:3px;min-block-size:var(--wk-touch);font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);text-transform:uppercase;color:var(--wk-text-muted);padding-block:var(--wk-s-3)}
.tabbar button b{font-weight:inherit}.tabbar button span{font-size:18px;font-family:var(--wk-font-sans);font-weight:800;letter-spacing:0;text-transform:none}
.tabbar button[aria-current]{color:var(--wk-text)}
@media (max-width:400px){.tabbar button{font-size:8px;letter-spacing:.04em}}
.tabbar button[aria-current] span{color:var(--wk-accent-text)}
@media (min-width:900px){
  :root{--wk-gutter:22px}
  .app{grid-template-rows:var(--wk-topbar-h) 1fr;grid-template-columns:220px 1fr}
  .topbar{grid-column:1/-1}
  main{grid-column:2;grid-row:2}
  .tabbar{grid-column:1;grid-row:2;position:sticky;inset-block-start:var(--wk-topbar-h);align-self:start;align-content:start;grid-auto-flow:row;grid-auto-columns:auto;grid-auto-rows:var(--wk-touch);border:0;border-inline-end:1px solid var(--wk-line);padding:var(--wk-s-5);gap:var(--wk-s-1);block-size:calc(100dvh - var(--wk-topbar-h))}
  .tabbar button{grid-template-columns:28px 1fr;justify-items:start;text-align:start;padding:0 var(--wk-s-4);border-radius:var(--wk-r-row)}
  .tabbar button[aria-current]{background:var(--wk-surface-2)}
}

/* ---------- Bausteine ---------- */
.page-head{display:flex;align-items:end;justify-content:space-between;gap:var(--wk-s-5);margin-block-end:var(--wk-s-6);flex-wrap:wrap}
.page-head h1{font:var(--wk-fs-h1);font-size:clamp(22px,7cqi,38px);letter-spacing:var(--wk-ls-tight);text-transform:uppercase;overflow-wrap:anywhere;min-inline-size:0}
.page-head h1 small{display:block;font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);color:var(--wk-text-muted);margin-block-end:var(--wk-s-3)}
.grid{display:grid;gap:var(--wk-s-5)}
@container (min-width:640px){.grid.two{grid-template-columns:1fr 1fr}.grid.three{grid-template-columns:repeat(3,1fr)}}
@container (min-width:960px){.grid.main-side{grid-template-columns:2fr 1fr}}
.card{background:var(--wk-surface-card);border:1px solid var(--wk-line);border-radius:var(--wk-r-card);padding:var(--wk-s-6)}
.card.hot{background:var(--wk-surface-hot);border-color:var(--wk-line-hot)}
.card h2{font:var(--wk-fs-card);margin-block-end:var(--wk-s-5);display:flex;justify-content:space-between;align-items:center;gap:var(--wk-s-4)}
.card h2 .label{font-weight:600}
.kpi{display:grid;gap:var(--wk-s-2)}
.kpi .v{font:var(--wk-fs-num-xl);font-size:clamp(28px,4cqi,38px);letter-spacing:-.02em;white-space:nowrap}
.kpi .v em{display:block;font-style:normal;font-size:14px;color:var(--wk-text-muted);margin-block-start:6px;white-space:normal}
.bar{display:block;block-size:var(--wk-bar-h);background:var(--wk-track);border-radius:var(--wk-r-pill);overflow:hidden}
.bar i{display:block;block-size:100%;background:var(--wk-bar-fill);box-shadow:var(--wk-glow-bar);border-radius:inherit;transition:inline-size .4s}
.bar.ok i{background:var(--wk-ok);box-shadow:none}
.bar.wait i{background:var(--wk-wait);box-shadow:none}
.chip{display:inline-flex;align-items:center;gap:6px;block-size:26px;padding-inline:10px;border-radius:var(--wk-r-pill);font:var(--wk-fs-num-s);white-space:nowrap}
.chip::before{content:var(--g,"○")}
.chip.open{background:var(--wk-idle-soft);color:var(--wk-idle);--g:"○"}
.chip.sliced{background:var(--wk-wait-soft);color:var(--wk-wait);--g:"◐"}
.chip.running{background:var(--wk-accent-soft);color:var(--wk-accent-text);--g:"▶"}
.chip.done{background:var(--wk-ok-soft);color:var(--wk-ok);--g:"✓"}
.chip.post{background:var(--wk-ok-soft);color:var(--wk-ok);--g:"✦"}
.chip.built{background:var(--wk-ok-soft);color:var(--wk-ok);--g:"■"}
.chip.fail{background:var(--wk-fail-soft);color:var(--wk-fail);--g:"✕"}
.rows{display:grid;gap:var(--wk-s-3)}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--wk-s-4);min-block-size:var(--wk-row-h);padding:var(--wk-s-4) var(--wk-s-5);background:var(--wk-surface-2);border:1px solid var(--wk-line);border-radius:var(--wk-r-row)}
.row.hot{background:var(--wk-surface-hot);border-color:var(--wk-line-hot)}
.row .t{font:var(--wk-fs-card);display:flex;gap:var(--wk-s-3);align-items:center;flex-wrap:wrap}
.row .m{font:var(--wk-fs-code);color:var(--wk-text-muted);margin-block-start:5px;display:flex;gap:var(--wk-s-4);flex-wrap:wrap}
.row .m b{color:var(--wk-text-2);font-weight:400}
.row button.rowbtn{min-inline-size:var(--wk-touch);min-block-size:36px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--wk-s-3);min-block-size:var(--wk-touch);padding-inline:var(--wk-s-6);border-radius:var(--wk-r-pill);font:700 14px/1 var(--wk-font-sans);border:1px solid var(--wk-line-strong);background:var(--wk-surface-3);color:var(--wk-text);transition:transform .12s}
.btn:active{transform:scale(.97)}
.btn.prim{background:var(--wk-accent);color:var(--wk-on-accent);border-color:transparent;box-shadow:var(--wk-glow-btn)}
.btn.sm{min-block-size:36px;padding-inline:var(--wk-s-5);font-size:13px}
.btn.icon{inline-size:var(--wk-touch);padding:0;font-family:var(--wk-font-mono)}
.tabs{display:flex;gap:var(--wk-s-2);margin-block-end:var(--wk-s-6);overflow-x:auto;scrollbar-width:none;padding-block-end:2px}
.tabs button{flex:0 0 auto;min-block-size:40px;padding-inline:var(--wk-s-6);border-radius:var(--wk-r-pill);border:1px solid var(--wk-line);background:var(--wk-surface-2);font:700 13px/1 var(--wk-font-sans);color:var(--wk-text-2)}
.tabs button[aria-selected=true]{background:var(--wk-accent);color:var(--wk-on-accent);border-color:transparent;box-shadow:var(--wk-glow-btn)}
.field{display:grid;gap:6px}
.field input,.field select{block-size:var(--wk-touch);background:var(--wk-surface-2);border:1px solid var(--wk-line-strong);border-radius:var(--wk-r-row);color:var(--wk-text);padding-inline:var(--wk-s-5);font:var(--wk-fs-num-s);font-size:15px;inline-size:100%}
.inline-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--wk-s-3);align-items:end}
.inline-form>*{min-inline-size:0}
@container (max-width:420px){.inline-form{grid-template-columns:1fr!important}}
.toast{position:fixed;inset-inline:var(--wk-gutter);inset-block-end:calc(var(--wk-tabbar-h) + var(--wk-s-5));margin-inline:auto;max-inline-size:420px;background:var(--wk-surface-3);border:1px solid var(--wk-line-hot);border-radius:var(--wk-r-row);padding:var(--wk-s-5) var(--wk-s-6);font:var(--wk-fs-small);box-shadow:var(--wk-glow-panel);z-index:20;opacity:0;translate:0 10px;transition:.25s;pointer-events:none}
.toast.show{opacity:1;translate:0 0}
@media (min-width:900px){.toast{inset-block-end:var(--wk-s-6)}}
.empty{padding:var(--wk-s-8);text-align:center;color:var(--wk-text-muted);border:1px dashed var(--wk-line-strong);border-radius:var(--wk-r-card)}

@container (max-width:400px){.row{grid-template-columns:1fr}.row>:last-child:not(:first-child){justify-self:end}}
.grid>*,.spool>*,.price>*{min-inline-size:0}
/* Lager */
.spool{display:grid;grid-template-columns:auto 1fr;gap:var(--wk-s-5);align-items:center}
.spool .disc{inline-size:52px;block-size:52px;border-radius:50%;background:conic-gradient(var(--c,#ccc) calc(var(--p)*1%),var(--wk-track) 0);display:grid;place-items:center;position:relative}
.spool .disc::after{content:"";inline-size:28px;block-size:28px;border-radius:50%;background:var(--wk-surface-1);border:1px solid var(--wk-line-strong)}
.price-list{display:grid;gap:var(--wk-s-2);margin-block-start:var(--wk-s-4)}
.price{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:var(--wk-s-4);min-block-size:44px;padding-inline:var(--wk-s-4);background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);text-decoration:none;color:var(--wk-text)}
.price .store{font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);text-transform:uppercase;color:var(--wk-text-muted);inline-size:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.price .p{font:var(--wk-fs-num-s);font-size:15px}
.price.best{border-color:var(--wk-line-hot);background:var(--wk-accent-soft)}
.price.best .p{color:var(--wk-accent-text)}
.price .age{font:var(--wk-fs-code);color:var(--wk-text-dim)}


/* Lager: Kacheln + Detail */
.tabs button .cnt{opacity:.6;font-family:var(--wk-font-mono);font-weight:400}
.tabs.sub{margin-block-start:calc(var(--wk-s-4) * -1)}
.tabs.sub button{min-block-size:32px;padding-inline:var(--wk-s-4);font-size:12px}
.lager-layout{display:grid;gap:var(--wk-s-5);align-items:start}
@container (min-width:900px){.lager-layout{grid-template-columns:minmax(0,1fr) 360px}.ldetail-wrap{position:sticky;inset-block-start:calc(var(--wk-topbar-h) + var(--wk-s-6))}}
.lgroup{margin:var(--wk-s-6) 0 var(--wk-s-3);color:var(--wk-accent-text);display:flex;gap:8px}
.tiles-wrap>.lgroup:first-child{margin-block-start:0}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--wk-s-3)}
@container (max-width:420px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.tile{padding:var(--wk-s-2)}.tname{font-size:12px}}
.tile{display:grid;gap:5px;padding:var(--wk-s-3);text-align:start;background:var(--wk-surface-card);border:1px solid var(--wk-line);border-radius:var(--wk-r-row);min-inline-size:0;transition:border-color .15s}
.tile:hover{border-color:var(--wk-line-strong)}
.tile.hot{background:var(--wk-surface-hot);border-color:var(--wk-line-hot)}
.tile.sel{border-color:var(--wk-accent);box-shadow:var(--wk-glow-bar)}
.timg{position:relative;display:block;aspect-ratio:1;background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);overflow:hidden}
.timg svg{inline-size:100%;block-size:100%;display:block;padding:8%}
.tflag{position:absolute;inset-block-start:6px;inset-inline-end:6px;inline-size:20px;block-size:20px;border-radius:50%;background:var(--wk-accent);color:var(--wk-on-accent);display:grid;place-items:center;font:700 11px/1 var(--wk-font-mono);font-style:normal}
.tname{font:600 13px/1.25 var(--wk-font-sans);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tstock{font:var(--wk-fs-code);font-size:11px;color:var(--wk-text-muted)}.tstock b{color:var(--wk-text);font-weight:700}
.tprice{font:var(--wk-fs-num-s);font-size:13px}.tprice small{font-size:10px;color:var(--wk-text-dim);font-weight:400}
.mdetail{display:grid;gap:var(--wk-s-5)}
.mhead{display:grid;grid-template-columns:72px 1fr auto;gap:var(--wk-s-4);align-items:center}
.mimg{display:block;inline-size:72px;aspect-ratio:1;background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);overflow:hidden}
.mimg svg{inline-size:100%;block-size:100%;padding:6%}
.mstock{display:flex;align-items:baseline;gap:var(--wk-s-4);flex-wrap:wrap}
.mstock em{font-style:normal;font-size:14px;color:var(--wk-text-muted);margin-inline-start:4px}
.spec{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0;font:var(--wk-fs-code);font-size:12px;line-height:1.5}
.spec dt{color:var(--wk-text-muted)}.spec dd{margin:0;color:var(--wk-text-2)}
@container (max-width:899px){
  .ldetail-wrap:empty{display:none}
  .has-detail .ldetail-wrap{position:fixed;inset:0;z-index:25;background:rgba(7,7,10,.7);padding:var(--wk-s-5);display:grid;align-items:end;overflow:auto}
  .has-detail .mdetail{max-block-size:92dvh;overflow:auto;border-radius:var(--wk-r-panel)}
  .lager-layout:not(.has-detail) .ldetail-wrap{display:none}
}

/* Projekt-Kacheln */
.ptiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--wk-s-4)}
.ptiles.compact{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
@container (max-width:520px){.ptiles{grid-template-columns:1fr}}
.ptile{background:var(--wk-surface-card);border:1px solid var(--wk-line);border-radius:var(--wk-r-card);overflow:hidden;display:grid;min-inline-size:0}
.ptile.hot{background:var(--wk-surface-hot);border-color:var(--wk-line-hot)}
.ptile.done{opacity:.85}
.pmain{display:grid;text-align:start;inline-size:100%}
.pcover{position:relative;display:block;aspect-ratio:16/9;background:var(--wk-surface-1);border-block-end:1px solid var(--wk-line)}
.pcover svg{inline-size:100%;block-size:100%;display:block}
.pcode{position:absolute;inset-block-start:8px;inset-inline-start:10px;font:var(--wk-fs-code);color:var(--wk-text-muted);background:var(--wk-bg);padding:3px 6px;border-radius:4px;border:1px solid var(--wk-line)}
.pbody{display:grid;gap:8px;padding:var(--wk-s-4) var(--wk-s-5) var(--wk-s-5)}
.pname{font:700 15px/1.25 var(--wk-font-sans)}
.pmeta{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font:var(--wk-fs-code);color:var(--wk-text-muted)}
.pmeta b{color:var(--wk-text-2);font-weight:400}
.pbar{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;font:var(--wk-fs-num-s)}
.pactions{display:flex;gap:8px;padding:0 var(--wk-s-5) var(--wk-s-5)}
.pactions .btn{flex:1}.pactions .btn.icon{flex:0 0 var(--wk-touch)}


/* Teile-Kacheln, 3D-Viewer, Druckauftrag */
.parts{display:grid;gap:var(--wk-s-3)}
.part{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--wk-s-4);padding:var(--wk-s-3);background:var(--wk-surface-2);border:1px solid var(--wk-line);border-radius:var(--wk-r-row)}
.part.hot{background:var(--wk-surface-hot);border-color:var(--wk-line-hot)}
.pthumb{position:relative;aspect-ratio:1;background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);overflow:hidden}
.pthumb svg{inline-size:100%;block-size:100%;display:block}
.p3d{position:absolute;inset-block-end:5px;inset-inline-end:5px;font:700 10px/1 var(--wk-font-mono);background:var(--wk-accent);color:var(--wk-on-accent);padding:3px 5px;border-radius:4px}
.overlay{position:fixed;inset:0;z-index:40;background:rgba(7,7,10,.78);display:grid;place-items:center;padding:var(--wk-s-5);overflow:auto}
.viewer{background:var(--wk-bg);border:1px solid var(--wk-line-hot);border-radius:var(--wk-r-panel);box-shadow:var(--wk-glow-panel);inline-size:min(1100px,100%);display:grid;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) 300px;grid-template-areas:"h h" "s a";overflow:hidden;max-block-size:calc(100dvh - 2*var(--wk-s-5))}
.vhead{grid-area:h;display:flex;justify-content:space-between;align-items:center;gap:var(--wk-s-4);padding:var(--wk-s-5) var(--wk-s-6);border-block-end:1px solid var(--wk-line)}
.vstage{grid-area:s;position:relative;min-block-size:420px;background:radial-gradient(600px 300px at 50% 100%,rgba(255,47,58,.12),transparent 70%),var(--wk-bg-deep)}
.vstage canvas{inline-size:100%;block-size:100%;display:block;touch-action:none}
.vdrop{position:absolute;inset:var(--wk-s-5);border:2px dashed var(--wk-line-strong);border-radius:var(--wk-r-card);display:grid;place-items:center;text-align:center;color:var(--wk-text-muted);font:var(--wk-fs-small);pointer-events:none;opacity:0;transition:.15s}
.vdrop small{color:var(--wk-text-dim)}
.vdrop.on{opacity:1;border-color:var(--wk-accent);background:var(--wk-accent-soft)}
.vhint{position:absolute;inset-block-end:10px;inset-inline-start:14px;font:var(--wk-fs-code);color:var(--wk-text-dim);pointer-events:none}
.vside{grid-area:a;padding:var(--wk-s-6);display:grid;gap:var(--wk-s-5);align-content:start;border-inline-start:1px solid var(--wk-line);overflow:auto}
@media (max-width:760px){.viewer{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"h" "s" "a"}.vstage{min-block-size:300px}.vside{border:0;border-block-start:1px solid var(--wk-line)}}
.jobcard{inline-size:min(640px,100%);display:grid;gap:var(--wk-s-6);border-color:var(--wk-line-hot);box-shadow:var(--wk-glow-panel)}
.jsum{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--wk-s-3)}
.jsum>div{display:grid;gap:4px;background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);padding:var(--wk-s-4)}
.jsum small{color:var(--wk-text-dim);font-size:11px}
@container (max-width:420px){.jsum{grid-template-columns:1fr}}


/* Scan & Etiketten */
.camwrap{position:relative;aspect-ratio:4/3;background:var(--wk-bg-deep);border:1px solid var(--wk-line);border-radius:var(--wk-r-card);overflow:hidden}
.camwrap video{inline-size:100%;block-size:100%;object-fit:cover}
.scanbox{position:absolute;inset:18%;border:2px solid var(--wk-accent);border-radius:var(--wk-r-card);box-shadow:0 0 0 999px rgba(7,7,10,.45),var(--wk-glow-bar)}
.camoff{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:var(--wk-s-5);padding:var(--wk-s-6);text-align:center;color:var(--wk-text-muted);font:var(--wk-fs-small)}
.demoqrs{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:var(--wk-s-3)}
.dq{display:grid;gap:4px;justify-items:center;padding:6px;background:#fff;border-radius:var(--wk-r-chip);color:#000;font-size:10px}
.dq svg{inline-size:100%;block-size:auto}
.scanres{display:grid;gap:var(--wk-s-5);align-content:start}
@container (max-width:959px){.scanres.hot,.scanres:has(.mhead){order:-1}}
.scannum{display:grid;gap:4px}
.scannum .big{font:var(--wk-fs-num-xl);font-size:44px}
.scannum em{font-style:normal;font-size:16px;color:var(--wk-text-muted);margin-inline-start:6px}
.delta{font:var(--wk-fs-num);font-size:18px}.delta.minus{color:var(--wk-accent-text)}.delta.plus{color:var(--wk-ok)}
.presets{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:var(--wk-s-3)}
.presets .btn{min-block-size:var(--wk-touch-shop);padding-inline:6px;font-family:var(--wk-font-mono);font-size:16px}
.presets .btn.ok{border-color:rgba(56,209,122,.4);color:var(--wk-ok)}
.lbpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px;max-block-size:180px;overflow:auto;padding:2px}
.lbitem{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center;padding:6px 10px;border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);font:var(--wk-fs-small);cursor:pointer}
.lbitem.on{border-color:var(--wk-line-hot);background:var(--wk-accent-soft)}
.lbitem input{inline-size:18px;block-size:18px;margin:0}
.lbitem .code{color:var(--wk-text-muted)}
.lbsheet{display:flex;flex-wrap:wrap;gap:6px;padding:var(--wk-s-4);background:#2a2a30;border-radius:var(--wk-r-chip);max-block-size:260px;overflow:auto}
.lbl{background:#fff;color:#000;display:grid;grid-template-columns:auto 1fr;gap:2mm;align-items:center;padding:1.5mm;border-radius:1mm;box-sizing:border-box;overflow:hidden}
.lbl svg{block-size:100%;inline-size:auto}
.lbtxt{display:grid;gap:.6mm;min-inline-size:0;font-family:var(--wk-font-sans);line-height:1.1}
.lbtxt b{font-weight:800;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lbtxt span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333}
.lbtxt .code{color:#000}
.lbsheet[data-fmt=ql] .lbl{inline-size:62mm;block-size:29mm;font-size:9pt}.lbsheet[data-fmt=ql] .lbtxt b{font-size:11pt}
.lbsheet[data-fmt=nb] .lbl{inline-size:50mm;block-size:30mm;font-size:8pt}.lbsheet[data-fmt=nb] .lbtxt b{font-size:10pt}
.lbsheet[data-fmt=mini] .lbl{inline-size:40mm;block-size:12mm;font-size:5.5pt;padding:.8mm;gap:1mm}.lbsheet[data-fmt=mini] .lbtxt b{font-size:6.5pt;-webkit-line-clamp:1}.lbsheet[data-fmt=mini] .lbtxt span:not(.code){display:none}
@media print{body>*{display:none!important}body{background:#fff}.overlay{display:block!important;position:static;background:none;padding:0}.overlay>.jobcard>*{display:none!important}.overlay>.jobcard{display:block!important;border:0;box-shadow:none;background:none;padding:0}.lbsheet{display:block!important;background:none;padding:0;max-block-size:none;overflow:visible}.lbl{page-break-after:always;break-after:page;border-radius:0}}


/* Fotos, Rollen */
.fotos{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.fotos img{inline-size:56px;block-size:56px;object-fit:cover;border-radius:var(--wk-r-chip);border:1px solid var(--wk-line)}
.fotobtn{position:relative;overflow:hidden;cursor:pointer}
.fotobtn input{position:absolute;inset:0;opacity:0;cursor:pointer}
.rolle.sel{border-color:var(--wk-accent);box-shadow:var(--wk-glow-bar)}
img.img{inline-size:100%;aspect-ratio:16/9;border-radius:var(--wk-r-card)}
input[type=range]{inline-size:100%;accent-color:var(--wk-accent)}


/* Menü */
.menu{position:absolute;z-index:15;margin-block-start:44px;background:var(--wk-surface-3);border:1px solid var(--wk-line-strong);border-radius:var(--wk-r-row);padding:6px;display:grid;min-inline-size:230px;box-shadow:var(--wk-glow-panel)}
.menu button{text-align:start;min-block-size:40px;padding-inline:12px;border-radius:var(--wk-r-chip);font:600 14px/1 var(--wk-font-sans)}
.menu button:hover{background:var(--wk-surface-2)}
.menu button.danger{color:var(--wk-fail)}
.menu hr{border:0;border-block-start:1px solid var(--wk-line);margin:4px 0}


/* Login, Konto, Galerie */
.loginwrap{min-block-size:100dvh;display:grid;place-items:center;padding:var(--wk-s-6);background:radial-gradient(700px 400px at 50% 110%,rgba(255,47,58,.18),transparent 70%),var(--wk-bg-deep)}
.logincard{inline-size:min(420px,100%);background:var(--wk-surface-card);border:1px solid var(--wk-line-hot);border-radius:var(--wk-r-panel);padding:var(--wk-s-8) var(--wk-s-7);display:grid;gap:var(--wk-s-5);box-shadow:var(--wk-glow-panel)}
.lh{font:var(--wk-fs-h2);letter-spacing:var(--wk-ls-tight);margin:0}
.lp{font:var(--wk-fs-small);color:var(--wk-text-muted);margin:0}
.lrow{display:flex;justify-content:space-between;gap:8px}
.lrow button{font:600 13px/1 var(--wk-font-sans);color:var(--wk-accent-text);min-block-size:var(--wk-touch)}
.otp{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.otp input{block-size:56px;text-align:center;font:700 24px/1 var(--wk-font-mono);background:var(--wk-surface-2);border:1px solid var(--wk-line-strong);border-radius:var(--wk-r-chip);color:var(--wk-text);inline-size:100%}
.pwmeter{block-size:6px;background:var(--wk-track);border-radius:999px;overflow:hidden}.pwmeter i{display:block;block-size:100%;background:var(--wk-ok)}
.sel-sm{block-size:36px;background:var(--wk-surface-3);border:1px solid var(--wk-line-strong);border-radius:var(--wk-r-pill);color:var(--wk-text);padding-inline:12px;font:600 13px/1 var(--wk-font-sans)}
.feat{margin:var(--wk-s-4) 0 var(--wk-s-5);padding:0;list-style:none;display:grid;gap:6px;font:var(--wk-fs-small);color:var(--wk-text-2)}
.feat li::before{content:"✓ ";color:var(--wk-ok)}
.api{margin:0;padding:var(--wk-s-4);background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);font:var(--wk-fs-code);font-size:12px;line-height:1.6;color:var(--wk-text-2);overflow:auto}
code{font-family:var(--wk-font-mono);font-size:.9em;background:var(--wk-surface-1);padding:1px 5px;border-radius:4px}
a.row{text-decoration:none;color:inherit}

/* Drucker */
.printer{display:grid;gap:var(--wk-s-5)}
.printer .big{font:var(--wk-fs-num-xl);letter-spacing:-.02em}
.temps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--wk-s-3)}
.temps div{background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);padding:var(--wk-s-4)}
.temps .num{font:var(--wk-fs-num);display:block;margin-block-start:4px}
.ams{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--wk-s-3)}
.ams div{background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);padding:var(--wk-s-3);display:grid;gap:4px;justify-items:center;font:var(--wk-fs-code);color:var(--wk-text-muted)}
.ams i{inline-size:22px;block-size:22px;border-radius:50%;background:var(--c);border:2px solid var(--wk-line-strong)}
.ams b{color:var(--wk-text-2);font-weight:400}
.live{display:inline-flex;align-items:center;gap:6px;font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);text-transform:uppercase;color:var(--wk-accent-text)}
.live::before{content:"";inline-size:8px;block-size:8px;border-radius:50%;background:var(--wk-accent);box-shadow:var(--wk-glow-dot)}
@media (prefers-reduced-motion:no-preference){.live::before{animation:pulse 1.4s infinite}}
@keyframes pulse{50%{opacity:.35}}

/* Warteschlange: Drag */
.row[draggable=true]{cursor:grab}
.row.dragging{opacity:.4}
.row.over{border-color:var(--wk-accent);box-shadow:var(--wk-glow-bar)}
.handle{color:var(--wk-text-dim);font-family:var(--wk-font-mono);padding-inline-end:var(--wk-s-3)}

/* Werkstatt-Modus */
.shop{position:fixed;inset:0;background:var(--wk-bg-deep);z-index:30;display:grid;grid-template-rows:auto 1fr auto;padding:var(--wk-s-6) var(--wk-gutter);gap:var(--wk-s-6)}
.shop header{display:flex;justify-content:space-between;align-items:center}
.shop .stage{display:grid;align-content:start;gap:var(--wk-s-6);max-inline-size:640px;inline-size:100%;margin-inline:auto}
.shop .pos{font:var(--wk-fs-num-xl);color:var(--wk-accent-text)}
.shop h3{font:var(--wk-fs-h3);letter-spacing:var(--wk-ls-tight)}
.shop .body{font:400 clamp(16px,2vw,18px)/1.5 var(--wk-font-sans);color:var(--wk-text-2)}
.shop .needs{display:flex;flex-wrap:wrap;gap:var(--wk-s-3)}
.shop .img{aspect-ratio:16/9;border:1px dashed var(--wk-line-strong);border-radius:var(--wk-r-card);display:grid;place-items:center;color:var(--wk-text-dim);font:var(--wk-fs-code)}
.shop footer{display:grid;grid-template-columns:var(--wk-touch-shop) 1fr var(--wk-touch-shop);gap:var(--wk-s-3);max-inline-size:640px;inline-size:100%;margin-inline:auto}
.shop footer .btn{min-block-size:var(--wk-touch-prim);font-size:16px}
.shop footer .btn.icon{inline-size:auto;font-size:22px}
.shop .prog{display:grid;grid-template-columns:1fr auto;gap:var(--wk-s-4);align-items:center;font:var(--wk-fs-num-s)}

/* ===== Ergänzungen für die PHP-App ===== */
a.brand,a.pmain,a.tile,a.tab,a.price,a.row,.tabbar a{text-decoration:none;color:inherit}
.tabbar a{display:grid;place-items:center;gap:3px;min-block-size:var(--wk-touch);font:var(--wk-fs-label);letter-spacing:var(--wk-ls-label);text-transform:uppercase;color:var(--wk-text-muted);padding-block:var(--wk-s-3)}
.tabbar a span{font-size:18px;font-family:var(--wk-font-sans);font-weight:800;letter-spacing:0;text-transform:none}
.tabbar a b{font-weight:inherit}
.tabbar a[aria-current]{color:var(--wk-text)}
.tabbar a[aria-current] span{color:var(--wk-accent-text)}
@media (min-width:900px){.tabbar a{grid-template-columns:28px 1fr;justify-items:start;text-align:start;padding:0 var(--wk-s-4);border-radius:var(--wk-r-row)}.tabbar a[aria-current]{background:var(--wk-surface-2)}}
.tabs .tab{flex:0 0 auto;min-block-size:40px;padding:0 var(--wk-s-6);display:inline-flex;align-items:center;border-radius:var(--wk-r-pill);border:1px solid var(--wk-line);background:var(--wk-surface-2);font:700 13px/1 var(--wk-font-sans);color:var(--wk-text-2)}
.tabs .tab[aria-selected=true]{background:var(--wk-accent);color:var(--wk-on-accent);border-color:transparent;box-shadow:var(--wk-glow-btn)}
.timg.spool,.mimg.spool{background:radial-gradient(circle at 50% 50%,var(--wk-surface-1) 0 26%,var(--wk-line-strong) 26% 28%,var(--c) 28% 44%,rgba(0,0,0,.25) 44% 46%,var(--c) 46% 62%,transparent 62%)}
.timg:not(.spool)::after{content:"";position:absolute;inset:30%;background:var(--wk-line-strong);border-radius:6px}
.pcover.cover-rc{background:radial-gradient(240px 60px at 50% 80%,#3a1418,transparent),var(--wk-surface-1)}
.pcover.cover-galabau{background:linear-gradient(180deg,var(--wk-surface-1) 60%,#2a2a20 60%)}
.pcover.cover-druck{background:linear-gradient(180deg,var(--wk-surface-1),var(--wk-surface-2))}
.pmeta .warn{color:var(--wk-accent-text)}
.h2{font:var(--wk-fs-h2);font-size:22px;letter-spacing:var(--wk-ls-tight);margin:0}
.big{font:var(--wk-fs-num-xl);font-size:34px}
.dim{color:var(--wk-text-dim)}
.ok{color:var(--wk-ok)}.acc{color:var(--wk-accent-text)}
.flash{margin:0;padding:var(--wk-s-4) var(--wk-s-5);border-radius:var(--wk-r-chip);font:var(--wk-fs-small)}
.flash.fail{background:var(--wk-fail-soft);color:var(--wk-fail)}.flash.ok{background:var(--wk-ok-soft);color:var(--wk-ok)}
.otpwide{text-align:center;font:700 24px/1 var(--wk-font-mono)!important;letter-spacing:.3em}
.empty.sticky{position:sticky;inset-block-start:calc(var(--wk-topbar-h) + var(--wk-s-6))}
.menu-wrap{position:relative}.menu-wrap summary{list-style:none;cursor:pointer}.menu-wrap summary::-webkit-details-marker{display:none}
.menu-wrap[open] .menu{position:absolute;inset-inline-end:0;margin-block-start:6px}
.menu form{display:grid;gap:8px;padding:6px}
section[hidden]{display:none}
body.bare{background:var(--wk-bg-deep)}

/* ===== V1.1: Konto, Scan, Etiketten, Queue ===== */
.field.check{display:flex;gap:10px;align-items:flex-start;font:var(--wk-fs-small)}
.field.check input{inline-size:20px;block-size:20px;flex:none;margin:0}
.codes{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-block:var(--wk-s-4)}
.codes .code{background:var(--wk-surface-1);border:1px solid var(--wk-line);border-radius:var(--wk-r-chip);padding:8px 10px;font-size:14px;text-align:center;letter-spacing:.08em}
.qrbox{inline-size:min(220px,100%);aspect-ratio:1;background:#fff;padding:10px;border-radius:var(--wk-r-chip);margin-block:var(--wk-s-4)}
.qrbox svg{inline-size:100%;block-size:100%}
.lp.warn{color:var(--wk-accent-text)}
.dot{inline-size:10px;block-size:10px;border-radius:50%;background:var(--c);border:1px solid var(--wk-line-strong);display:inline-block;flex:none}
.labels-page{padding:var(--wk-s-6);min-block-size:100dvh}
.labels-toolbar{display:flex;gap:var(--wk-s-4);align-items:end;flex-wrap:wrap;margin-block-end:var(--wk-s-6)}
.labels-page .lbsheet{max-block-size:none}
.qr svg{block-size:100%;inline-size:auto}
@media print{
  body{background:#fff}
  .noprint{display:none!important}
  .labels-page{padding:0}
  .lbsheet{display:block;background:none;padding:0;overflow:visible}
  .lbl{page-break-after:always;break-after:page;border-radius:0}
  @page{margin:0}
}

/* Dialoge, Bilder in Kacheln */
dialog.dlg{border:1px solid var(--wk-line-hot);border-radius:var(--wk-r-panel);background:var(--wk-bg);color:var(--wk-text);padding:0;inline-size:min(720px,calc(100% - 2*var(--wk-s-5)));max-block-size:calc(100dvh - 2*var(--wk-s-5));box-shadow:var(--wk-glow-panel)}
dialog.dlg::backdrop{background:rgba(7,7,10,.78)}
.timg.has-img img,.mimg.has-img img{inline-size:100%;block-size:100%;object-fit:cover;display:block}
.timg.has-img::after{display:none}
.timg.kat-schrauben::after{inset:38% 44%;border-radius:2px}
.timg.kat-mechanik::after{border-radius:50%;inset:28%}
.timg.kat-elektronik::after{inset:28% 34%;border-radius:8px}
details.edit summary{list-style:none;cursor:pointer;display:inline-flex}
details.edit summary::-webkit-details-marker{display:none}
.fotos form.fotobtn{position:relative;overflow:hidden;cursor:pointer;margin:0}
.fotos form.fotobtn input{position:absolute;inset:0;opacity:0;cursor:pointer}

/* Viewer-Dialog, Teile, Formulare */
dialog.viewer-dlg{inline-size:min(1100px,calc(100% - 2*var(--wk-s-5)))}
dialog.viewer-dlg .viewer{border:0;box-shadow:none;max-block-size:calc(100dvh - 2*var(--wk-s-5))}
.pthumb.has-img img{inline-size:100%;block-size:100%;object-fit:cover}
.pthumb:not(.has-img)::before{content:"";position:absolute;inset:30%;background:var(--wk-line-strong);border-radius:6px}
textarea{background:var(--wk-surface-2);border:1px solid var(--wk-line-strong);border-radius:var(--wk-r-row);color:var(--wk-text);padding:var(--wk-s-4) var(--wk-s-5);font:var(--wk-fs-body);inline-size:100%;resize:vertical}
.menu a{display:block;text-align:start;min-block-size:40px;padding:12px;border-radius:var(--wk-r-chip);font:600 14px/1 var(--wk-font-sans);color:inherit;text-decoration:none}
.menu a:hover{background:var(--wk-surface-2)}
.menu form{display:grid;gap:4px}
.shop footer a.btn{text-decoration:none}
@container (max-width:640px){form[style*="grid-template-columns:2fr"]{grid-template-columns:1fr 1fr!important}}

/* Drucker */
.otpc{display:grid;place-items:center;block-size:56px;font:700 24px/1 var(--wk-font-mono);background:var(--wk-surface-1);border:1px solid var(--wk-line-hot);border-radius:var(--wk-r-chip)}
.temps small.dim{font-size:12px}
.plthumb{inline-size:56px;block-size:56px;object-fit:cover;border-radius:var(--wk-r-chip);border:1px solid var(--wk-line);background:#fff}

/* Kopfzeile: Aktionen rechts in einer Reihe */
.page-head{align-items:center}
.page-head>h1{flex:1 1 320px}
.page-head>div,.page-head>form{flex:0 0 auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-inline-size:100%}
.page-head>form.inline-form{display:grid}
.prog-head{display:flex;justify-content:space-between;font:var(--wk-fs-num-s);margin-block-end:6px}
/* Bearbeiten-Dialog Lager */
.dlg .price-grid{display:grid;grid-template-columns:100px 1fr;gap:6px 8px;align-items:end}
@container (min-width:640px){.dlg .price-grid{grid-template-columns:100px 1fr 100px 1fr}}