:root{--tief:#101418;--blech:#181d23;--blech-hoch:#1e242b;--kante:#262d35;--gravur:#38424d;--text:#e6eaee;--matt:#939fac;--politur:#eef2f5;--warnung:#e5595e;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;--spur:.09em;--radius:3px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--tief);color:var(--text);font-family:var(--sans);margin:0;font-size:16px;line-height:1.5}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--politur);outline-offset:2px}.kopf{border-bottom:1px solid var(--kante);justify-content:space-between;align-items:baseline;gap:1rem;padding:1rem 1.25rem;display:flex}.kopf-marke{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);font-size:.75rem}.kopf-marke:hover{color:var(--text)}.kopf-nav{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);align-items:baseline;gap:1rem;font-size:.75rem;display:flex}.kopf-nav a,.kopf-nav .nav-knopf{color:var(--matt)}.kopf-nav a:hover,.kopf-nav .nav-knopf:hover{color:var(--text)}.nav-knopf{font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;background:0 0;border:none;padding:0}.inhalt{max-width:52rem;margin:0 auto;padding:1.75rem 1.25rem 5rem}.titel{text-transform:uppercase;letter-spacing:-.005em;margin:0;font-size:clamp(1.6rem,6vw,2.1rem);font-weight:800;line-height:1.1}.untertitel{color:var(--matt);margin:.35rem 0 0;font-size:1.05rem}.etikett{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);font-size:.7rem}.abschnitt-kopf{justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1rem;display:flex}.regal{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.regal-zeile{background:var(--blech);border-radius:var(--radius);align-items:center;gap:.8rem;padding:.7rem 1rem .7rem 1.35rem;display:flex;position:relative}.zeile-bild{object-fit:cover;background:var(--blech-hoch);border-radius:2px;flex:none;width:3.25rem;height:3.25rem}.zeile-bild-leer{background:color-mix(in srgb, var(--kanten-farbe) 16%, var(--blech-hoch))}.zeile-text{flex:auto;min-width:0}.regal-zeile:before{content:"";border-radius:var(--radius) 0 0 var(--radius);background:var(--kanten-farbe);width:4px;transition:width .12s;position:absolute;inset:0 auto 0 0}.regal-zeile:hover,.regal-zeile:focus-visible{background:var(--blech-hoch)}.regal-zeile:hover:before,.regal-zeile:focus-visible:before{width:7px}.zeile-marke{text-transform:uppercase;letter-spacing:.005em;font-size:1.02rem;font-weight:800;line-height:1.2}.zeile-geschmack{color:var(--matt);margin-top:.1rem;font-size:.95rem}.zeile-daten{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);margin-top:.45rem;font-size:.68rem}.trenner{color:var(--gravur);margin:0 .45rem}.marker{border:1px solid var(--gravur);font-family:var(--mono);letter-spacing:var(--spur);text-transform:uppercase;color:var(--matt);vertical-align:.1em;border-radius:2px;margin-left:.5rem;padding:0 .3rem;font-size:.62rem;display:inline-block}.kopfzeile-detail{align-items:stretch;gap:1rem;display:flex}.kopf-kante{border-radius:var(--radius);background:var(--kanten-farbe);flex:0 0 4px;min-height:3.25rem}.datenblatt{grid-template-columns:minmax(6.5rem,auto) 1fr;align-items:baseline;gap:.1rem 1.25rem;margin:1.75rem 0 0;display:grid}.datenblatt dt{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);padding-top:.35rem;font-size:.7rem}.datenblatt dd{margin:0;padding-top:.2rem}.wert-mono{font-family:var(--mono);font-size:.92rem}.notizen{border-top:1px solid var(--kante);white-space:pre-wrap;margin-top:1.75rem;padding-top:1.25rem}.formular{flex-direction:column;gap:1.15rem;max-width:32rem;margin-top:1.75rem;display:flex}.feld{flex-direction:column;gap:.4rem;display:flex}input[type=text],input[type=date],input[type=number],input[type=password],textarea{font:inherit;width:100%;min-height:2.9rem;color:var(--text);background:var(--blech);border:1px solid var(--kante);border-radius:var(--radius);padding:.6rem .75rem}textarea{resize:vertical;min-height:6rem}input:focus,textarea:focus{border-color:var(--gravur)}.feld-fehler input,.feld-fehler textarea{border-color:var(--warnung)}.fehlertext{color:var(--warnung);font-size:.85rem}.hinweis{color:var(--matt);font-size:.85rem}.segmente{gap:2px;display:flex}.segment{flex:1;position:relative}.segment input{opacity:0;cursor:pointer;position:absolute;inset:0}.segment span{text-align:center;background:var(--blech);border:1px solid var(--kante);border-radius:var(--radius);font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);padding:.7rem .4rem;font-size:.72rem;display:block}.segment input:checked+span{background:var(--blech-hoch);border-color:var(--politur);color:var(--text)}.segment input:focus-visible+span{outline:2px solid var(--politur);outline-offset:2px}.schalter{cursor:pointer;align-items:center;gap:.6rem;display:flex}.schalter input{width:1.1rem;height:1.1rem;accent-color:var(--politur)}.knopf-reihe{flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:.5rem;display:flex}.knopf{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);border-radius:var(--radius);cursor:pointer;min-height:2.75rem;color:var(--text);background:0 0;border:1px solid #0000;padding:.75rem 1.1rem;font-size:.73rem;display:inline-block}.knopf-haupt{background:var(--politur);color:#11151a;font-weight:600}.knopf-haupt:hover{background:#fff}.knopf-still{border-color:var(--kante);color:var(--matt)}.knopf-still:hover{border-color:var(--gravur);color:var(--text)}.knopf-gefahr{border-color:var(--kante);color:var(--warnung)}.knopf-gefahr:hover{border-color:var(--warnung)}.knopf[disabled]{opacity:.55;cursor:default}.leer{border:1px dashed var(--kante);border-radius:var(--radius);text-align:center;padding:2.5rem 1.5rem}.leer p{color:var(--matt);margin:0 0 1.25rem}.karte{border:1px solid var(--kante);border-radius:var(--radius);background:var(--blech);max-width:26rem;padding:1.5rem}.zurueck{font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--matt);margin-bottom:1.25rem;font-size:.7rem;display:inline-block}.zurueck:hover{color:var(--text)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.galerie{margin-top:1.75rem}.galerie-titel{border-radius:var(--radius);background:var(--blech);display:block;overflow:hidden}.galerie-titel img{width:100%;height:auto;display:block}.galerie-streifen{grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:2px;margin:2px 0 0;padding:0;list-style:none;display:grid}.galerie-streifen img{aspect-ratio:1;object-fit:cover;border-radius:var(--radius);background:var(--blech);width:100%;display:block}.fotoliste{flex-direction:column;gap:2px;margin:2rem 0 0;padding:0;list-style:none;display:flex}.fotoliste-eintrag{background:var(--blech);border-radius:var(--radius);flex-wrap:wrap;gap:1rem;padding:.85rem;display:flex}.fotoliste-bild{flex:none}.fotoliste-bild img{object-fit:cover;border-radius:var(--radius);background:var(--tief);width:5.5rem;height:5.5rem;display:block}.fotoliste-steuerung{flex-direction:column;flex:16rem;gap:.55rem;display:flex}.fotoliste-steuerung>.etikett{margin:0}.reihe{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.reihe .knopf{min-height:2.4rem;padding:.45rem .75rem}select{font:inherit;min-height:2.4rem;color:var(--text);background:var(--blech-hoch);border:1px solid var(--kante);border-radius:var(--radius);padding:.35rem .5rem}input[type=file]{font:inherit;width:100%;color:var(--matt);background:var(--blech);border:1px dashed var(--kante);border-radius:var(--radius);padding:.6rem}input[type=file]::file-selector-button{font:inherit;font-family:var(--mono);text-transform:uppercase;letter-spacing:var(--spur);color:var(--text);background:var(--blech-hoch);border:1px solid var(--kante);border-radius:var(--radius);cursor:pointer;margin-right:.75rem;padding:.5rem .8rem;font-size:.72rem}.erfolgstext{color:var(--text);font-size:.85rem}.barcode-hilfe{border:1px solid var(--kante);border-radius:var(--radius);flex-direction:column;gap:.5rem;margin-top:-.4rem;padding:.85rem;display:flex}.barcode-hilfe p{margin:0}.warntext{color:var(--text);font-size:.85rem}.verweis{color:var(--text);text-underline-offset:2px;text-decoration:underline}.scanner{flex-direction:column;gap:.6rem;width:100%;display:flex}.scanner-rahmen{border-radius:var(--radius);background:var(--tief);position:relative;overflow:hidden}.scanner-bild{object-fit:cover;width:100%;max-height:60vh;display:block}.scanner-linie{background:var(--warnung);opacity:.75;pointer-events:none;height:2px;position:absolute;top:50%;left:8%;right:8%;transform:translateY(-1px)}.suche{flex-direction:column;gap:.6rem;margin-bottom:1.25rem;display:flex}.suche-zeile{gap:.5rem;display:flex}.suche-zeile input[type=search]{font:inherit;min-width:0;min-height:2.9rem;color:var(--text);background:var(--blech);border:1px solid var(--kante);border-radius:var(--radius);flex:1;padding:.6rem .75rem}.suche-zeile input[type=search]:focus{border-color:var(--gravur)}.suche-zeile .knopf{flex:none;margin:0}.suche-filter{flex-wrap:wrap;align-items:flex-end;gap:.5rem;display:flex}.suche-auswahl{flex-direction:column;gap:.2rem;display:flex}.suche-auswahl .etikett{padding-left:.15rem}.suche-filter .knopf{min-height:2.4rem;padding:.45rem .8rem}
