body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
/**
* KCMinishop — public Storefront-Styles (Kunden-CI via --shop-* Custom Properties)
*
* BEWUSST OHNE --cbk-*-Tokens: der Shop traegt das CI des Kunden, nicht den
* CBK-Look (Spec §10 + §14 R8; das CBK-Design-System ist zudem login-gated).
* Farbwerte kommen aus tl_KCMinishop_shops.ci_* (injiziert in :root).
*
* Beads: cbk-ht1w.11, Epic: cbk-ht1w
*/
.msh-shop {
font-family: var(--shop-font, system-ui, sans-serif);
color: #26292e;
background: #fff;
min-height: 100vh;
display: flex;
flex-direction: column;
line-height: 1.5;
font-size: 16px;
}
.msh-shop *, .msh-shop *::before, .msh-shop *::after { box-sizing: border-box; }
.msh-shop img { max-width: 100%; height: auto; }
/* A11y-Fix (Design-Gate Blocker): --shop-primary roh als TEXTfarbe auf weissem Grund
ist gegen eine helle Kunden-CI ungeschuetzt (sanitizeHex prueft nur das Format, nicht
die Helligkeit) — --shop-primary-text faellt bei zu geringem Kontrast auf eine dunkle
Ersatzfarbe zurueck (KCMinishopColor::textFor). */
.msh-shop a { color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
/* ---------- Header ---------- */
.msh-header {
background: var(--shop-primary, #1f3a5f);
color: #fff;
}
.msh-header-inner {
max-width: 1100px;
margin: 0 auto;
padding: 14px 20px;
display: flex;
align-items: center;
gap: 20px;
}
.msh-brand { display: flex; align-items: center; text-decoration: none; color: inherit; }
/* A11y-Fix (B2): ".msh-shop a" (0-0-1-1) schlug bisher "color: inherit" oben und
faerbte den logo-losen Markentitel (.msh-brand-title) in --shop-primary ein — auf
Header-Hintergrund background: --shop-primary war der Text damit UNSICHTBAR
(Text == Hintergrund) fuer jeden Shop ohne Logo. Erzwingt die kontrastsichere
--shop-primary-ink-Farbe. */
.msh-shop a.msh-brand { color: var(--shop-primary-ink, #fff); }
.msh-logo { max-height: 48px; width: auto; }
.msh-brand-title { font-size: 1.4rem; font-weight: 700; letter-spacing: .02em; }
.msh-header-text { font-size: .85rem; opacity: .85; flex: 1; }
/* MA-5: Katalog-Nav-Link -- nur gerendert wenn ein aktiver Blaetterkatalog mit Seiten
existiert (ModuleKCMinishopPublic::setCommonTemplateVars). Sitzt links vom Warenkorb-
Link, dessen "margin-left: auto" schiebt beide gemeinsam an den rechten Rand. */
.msh-catalog-link {
display: flex;
align-items: center;
gap: 6px;
margin-left: auto;
color: var(--shop-primary-ink, #fff);
text-decoration: none;
padding: 8px 12px;
border-radius: 6px;
font-size: .9rem;
}
.msh-catalog-link:hover { background: rgba(255,255,255,.12); }
.msh-shop a.msh-catalog-link { color: var(--shop-primary-ink, #fff); }
.msh-catalog-link + .msh-cart-link { margin-left: 0; }
.msh-cart-link {
margin-left: auto;
display: flex;
align-items: center;
gap: 6px;
color: var(--shop-primary-ink, #fff);
text-decoration: none;
padding: 8px 12px;
border-radius: 6px;
background: rgba(255,255,255,.12);
}
/* A11y-Fix: ".msh-shop a" (0-0-1-1) schlug bisher die Basisregel oben (0-0-1-0) und
faerbte den Header-Warenkorb-Link (inkl. SVG-Icon via stroke=currentColor) in
--shop-primary statt weiss/dunkel-sicher ein. Hoehere Spezifitaet erzwingt den Sieg
der kontrastsicheren --shop-primary-ink-Farbe unabhaengig von der Kunden-CI. */
.msh-shop a.msh-cart-link { color: var(--shop-primary-ink, #fff); }
.msh-cart-link:hover { background: rgba(255,255,255,.22); }
.msh-cart-count {
background: var(--shop-accent, #c93a30);
/* A11y-Fix (W2): fest weisser Text auf --shop-accent kann je Kunden-CI kollabieren
— an die kontrastgeprüfte --shop-accent-ink-Variable anschliessen. */
color: var(--shop-accent-ink, #fff);
border-radius: 999px;
font-size: .75rem;
font-weight: 700;
min-width: 20px;
height: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 6px;
}
/* ---------- Layout ---------- */
.msh-main {
max-width: 1100px;
width: 100%;
margin: 0 auto;
padding: 24px 20px 48px;
flex: 1;
}
/* A11y-Fix (Design-Gate Blocker): --shop-primary als TEXTfarbe -> --shop-primary-text
(Kaskade Kommentar bei ".msh-shop a" oben). */
.msh-main h1 { font-size: 1.6rem; margin: 0 0 18px; color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
.msh-list { display: grid; grid-template-columns: 230px 1fr; gap: 28px; }
@media (max-width: 760px) { .msh-list { grid-template-columns: 1fr; } }
/* ---------- Sidebar / Rubriken ---------- */
/* A11y-Fix (Design-Gate Blocker): --shop-primary als TEXTfarbe -> --shop-primary-text. */
.msh-sidebar-title { font-size: 1rem; margin: 0 0 10px; color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
.msh-rubrics { list-style: none; margin: 0; padding: 0; font-size: .95rem; }
.msh-rubrics a {
display: block;
padding: 7px 10px;
text-decoration: none;
border-radius: 6px;
color: #26292e;
}
.msh-rubrics a:hover { background: var(--shop-secondary, #f5f6f8); }
.msh-rubrics li.active > a {
background: var(--shop-primary, #1f3a5f);
/* A11y-Fix (W2): fest weisser Text auf --shop-primary kann je Kunden-CI kollabieren
— an die kontrastgeprüfte --shop-primary-ink-Variable anschliessen. */
color: var(--shop-primary-ink, #fff);
font-weight: 600;
}
.msh-rubrics ul { list-style: none; margin: 0 0 0 12px; padding: 0; }
/* ---------- Artikel-Grid ---------- */
.msh-list-meta { font-size: .85rem; color: #6b7280; margin-bottom: 12px; }
.msh-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 18px;
}
.msh-card {
border: 1px solid #e5e7eb;
border-radius: 10px;
overflow: hidden;
display: flex;
flex-direction: column;
background: #fff;
transition: box-shadow .15s ease;
}
.msh-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.msh-card-imagelink {
display: block;
aspect-ratio: 4 / 3;
background: var(--shop-secondary, #f5f6f8);
overflow: hidden;
}
.msh-card-imagelink img { width: 100%; height: 100%; object-fit: contain; }
.msh-noimage {
width: 100%; height: 100%;
min-height: 120px;
display: flex; align-items: center; justify-content: center;
/* A11y-Fix (B3): #6b7280 auf --shop-secondary faellt bei heller Kunden-CI unter
WCAG-AA (4.5:1), wie beim bereits gefixten Footer. #565c66 haelt sicher darueber. */
color: #565c66; font-size: .85rem;
background: var(--shop-secondary, #f5f6f8);
}
.msh-card-body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.msh-card-title { font-size: .95rem; margin: 0; line-height: 1.35; }
.msh-card-title a { text-decoration: none; color: #26292e; }
/* A11y-Fix (Design-Gate Blocker): --shop-primary als TEXTfarbe -> --shop-primary-text. */
.msh-card-title a:hover { color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
.msh-artnr { font-size: .78rem; color: #6b7280; margin: 0; }
.msh-card-price { margin-top: auto; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
/* A11y-Fix (Design-Gate Blocker, KRITISCH): Preisanzeige nutzte --shop-primary roh als
Textfarbe auf weissem Grund — bei heller Kunden-CI (z.B. #ffd23f, 1,44:1 gegen Weiss)
war der Preis unlesbar. --shop-primary-text schuetzt via KCMinishopColor::textFor. */
.msh-price { font-weight: 700; color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); font-size: 1.05rem; }
.msh-price small { font-weight: 400; color: #6b7280; font-size: .72rem; }
.msh-price--gross { font-size: .9rem; }
.msh-price--onrequest { color: #6b7280; font-weight: 500; font-size: .9rem; }
.msh-vpe { font-size: .78rem; color: #6b7280; }
/* ---------- Buttons ---------- */
.msh-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
border: 1px solid transparent;
border-radius: 7px;
padding: 9px 16px;
font-size: .9rem;
font-weight: 600;
cursor: pointer;
text-decoration: none;
font-family: inherit;
transition: filter .12s ease;
}
.msh-btn--primary { background: var(--shop-accent, #c93a30); color: var(--shop-accent-ink, #fff); }
/* A11y-Fix: ".msh-shop a" (0-0-1-1) schlug bisher die Basisregel oben (0-0-1-0) und
faerbte "In den Warenkorb"/"Zur Reservierung" (jeweils ) in --shop-primary statt
Weiss ein — bei brauner Kunden-CI kollabierte der Kontrast auf 1,67:1. Hoehere
Spezifitaet erzwingt den Sieg der kontrastsicheren --shop-accent-ink-Farbe, egal
welche Kunden-CI-Farbe konfiguriert ist. */
.msh-shop a.msh-btn--primary { color: var(--shop-accent-ink, #fff); }
.msh-btn--primary:hover { filter: brightness(.92); }
.msh-btn--ghost {
background: transparent;
/* --shop-primary-text: primary selbst, ausser die Farbe waere auf weiss zu hell
lesbar (dann faellt der PHP-Helfer auf einen dunklen Text zurueck) — schuetzt
den Ghost-Button ohne fuer jede Kunden-CI-Kombination extra Regeln zu bauen. */
border-color: var(--shop-primary-text, var(--shop-primary, #1f3a5f));
color: var(--shop-primary-text, var(--shop-primary, #1f3a5f));
}
/* A11y-Fix (B1): ".msh-shop a" (0-0-1-1) schlug bisher die Basisregel oben (0-0-1-0)
und faerbte Ghost-Buttons/Links ("Weiter einkaufen"/"Details"/"Zur Artikeluebersicht",
jeweils ) fest in --shop-primary statt in die
kontrastgeprüfte --shop-primary-text-Variante. Analog zu .msh-btn--primary/.msh-cart-link
erzwingt hoehere Spezifitaet den Sieg der sicheren Farbe. */
.msh-shop a.msh-btn--ghost { color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
.msh-btn--ghost:hover { background: var(--shop-secondary, #f5f6f8); }
.msh-btn--sm { padding: 7px 12px; font-size: .82rem; }
.msh-btn--lg { padding: 12px 22px; font-size: 1rem; width: 100%; }
/* ---------- Pagination ---------- */
.msh-pagination { margin-top: 24px; display: flex; gap: 6px; flex-wrap: wrap; }
.msh-pagination a, .msh-pagination .current {
padding: 6px 12px;
border-radius: 6px;
text-decoration: none;
border: 1px solid #e5e7eb;
font-size: .9rem;
}
/* A11y-Fix (W2): fest weisser Text auf --shop-primary kann je Kunden-CI kollabieren
— an die kontrastgeprüfte --shop-primary-ink-Variable anschliessen. */
.msh-pagination .current { background: var(--shop-primary, #1f3a5f); color: var(--shop-primary-ink, #fff); border-color: var(--shop-primary, #1f3a5f); }
/* ---------- Detail ---------- */
.msh-breadcrumb { font-size: .85rem; margin-bottom: 16px; color: #6b7280; }
.msh-detail-grid { display: grid; grid-template-columns: minmax(280px, 460px) 1fr; gap: 32px; }
@media (max-width: 760px) { .msh-detail-grid { grid-template-columns: 1fr; } }
.msh-detail-image {
border: 1px solid #e5e7eb;
border-radius: 10px;
background: var(--shop-secondary, #f5f6f8);
display: flex; align-items: center; justify-content: center;
min-height: 280px;
padding: 12px;
}
.msh-detail-image img { max-height: 420px; object-fit: contain; }
.msh-detail-info h1 { margin-top: 0; }
.msh-description { color: #4b5563; }
.msh-extras { display: grid; grid-template-columns: auto 1fr; gap: 4px 16px; font-size: .9rem; margin: 14px 0; }
.msh-extras dt { color: #6b7280; }
.msh-extras dd { margin: 0; }
.msh-price-block { display: flex; flex-direction: column; gap: 4px; margin: 16px 0; }
.msh-price-block .msh-price { font-size: 1.5rem; }
.msh-price-block .msh-price--gross { font-size: 1.05rem; }
.msh-delivery { font-size: .85rem; color: #15803d; }
.msh-addtocart { display: flex; gap: 10px; margin-top: 12px; }
.msh-qty {
width: 76px;
padding: 8px 10px;
border: 1px solid #d1d5db;
border-radius: 7px;
font-size: .95rem;
font-family: inherit;
}
/* ---------- Cart ---------- */
.msh-cart-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.msh-cart-table th, .msh-cart-table td { padding: 10px 8px; border-bottom: 1px solid #e5e7eb; text-align: left; vertical-align: middle; }
.msh-cart-table th.num, .msh-cart-table td.num { text-align: right; }
.msh-cart-img img { width: 56px; height: 56px; object-fit: contain; background: var(--shop-secondary, #f5f6f8); border-radius: 6px; }
.msh-remove {
border: none; background: transparent; color: #6b7280;
font-size: 1.3rem; cursor: pointer; line-height: 1; padding: 4px 8px;
}
/* A11y-Fix (Design-Gate Warnung 1): --shop-accent als TEXTfarbe -> --shop-accent-text
(dieselbe Fehlerklasse wie --shop-primary oben, hier auf den Accent-Ton bezogen). */
.msh-remove:hover { color: var(--shop-accent-text, var(--shop-accent, #c93a30)); }
.msh-totals { margin: 18px 0 0 auto; max-width: 340px; font-size: .95rem; }
.msh-totals > div { display: flex; justify-content: space-between; padding: 4px 0; }
.msh-totals-gross { border-top: 2px solid var(--shop-primary, #1f3a5f); font-size: 1.05rem; margin-top: 6px; padding-top: 8px !important; }
.msh-cart-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.msh-cart-hint { font-size: .82rem; color: #6b7280; margin-top: 14px; }
/* ---------- Checkout ---------- */
.msh-checkout-grid { display: grid; grid-template-columns: 1fr 320px; gap: 32px; align-items: start; }
@media (max-width: 860px) { .msh-checkout-grid { grid-template-columns: 1fr; } }
/* A11y-Fix (Design-Gate Blocker): --shop-primary als TEXTfarbe -> --shop-primary-text. */
.msh-form h2 { font-size: 1.1rem; color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
.msh-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.msh-form-row--zip { grid-template-columns: 130px 1fr; }
@media (max-width: 560px) { .msh-form-row { grid-template-columns: 1fr; } }
.msh-field { margin-bottom: 14px; }
.msh-field label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 4px; }
.msh-field input[type="text"], .msh-field input[type="email"], .msh-field textarea {
width: 100%;
padding: 9px 12px;
border: 1px solid #d1d5db;
border-radius: 7px;
font-size: .95rem;
font-family: inherit;
}
/* A11y-Fix (Design-Gate Warnung 2, WCAG 1.4.11): Ring/Rand hier sitzt auf hellem/weissem
Grund (Formularfelder) — --shop-primary als roher Ring-/Randton ist gegen eine helle
Kunden-CI ungeschuetzt, --shop-primary-text sichert >=3:1 gegen Weiss. */
.msh-field input:focus, .msh-field textarea:focus, .msh-qty:focus {
outline: 2px solid var(--shop-primary-text, var(--shop-primary, #1f3a5f));
outline-offset: 1px;
border-color: var(--shop-primary-text, var(--shop-primary, #1f3a5f));
}
/* ---------- Fokus (Tastatur-Bedienung, WCAG 2.4.7) ---------- */
/* Bisher nur der duenne Browser-Default-Outline auf Buttons/Links — ein deutlicher,
CI-farbiger Ring fuer alle interaktiven Storefront-Elemente. */
/* A11y-Fix (Design-Gate Warnung 2, WCAG 1.4.11): diese Elemente sitzen auf hellem/
weissem Seitenhintergrund — der Ring liegt AUSSERHALB des Elements auf diesem hellen
Grund, --shop-primary roh ist daher derselbe Blocker wie oben; --shop-primary-text
sichert >=3:1 gegen Weiss. */
.msh-btn:focus-visible,
.msh-card-title a:focus-visible,
.msh-rubrics a:focus-visible,
.msh-pagination a:focus-visible,
.msh-remove:focus-visible,
.msh-link:focus-visible,
.msh-footer-nav a:focus-visible {
outline: 3px solid var(--shop-primary-text, var(--shop-primary, #1f3a5f));
outline-offset: 2px;
}
/* .msh-cart-link sitzt auf dunklem Header-Hintergrund (background: --shop-primary) —
ein Ring in derselben Farbe waere dort unsichtbar; heller, kontrastsicherer Ring. */
.msh-shop a.msh-cart-link:focus-visible,
.msh-shop a.msh-catalog-link:focus-visible {
outline: 3px solid var(--shop-primary-ink, #fff);
outline-offset: 2px;
}
/* A11y-Fix (W3): .msh-brand (Logo-/Markentitel-Link) fehlte bisher komplett in der
Fokus-Liste — sitzt wie .msh-cart-link auf dunklem Header-Hintergrund, daher derselbe
kontrastsichere Ring statt --shop-primary. */
.msh-shop a.msh-brand:focus-visible {
outline: 3px solid var(--shop-primary-ink, #fff);
outline-offset: 2px;
}
.msh-field--error input, .msh-field--error textarea { border-color: #dc2626; }
.msh-field-error { color: #dc2626; font-size: .8rem; }
.msh-field--consent label { font-weight: 400; font-size: .85rem; display: flex; gap: 8px; align-items: flex-start; }
.msh-field--consent input { margin-top: 3px; }
.msh-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.msh-summary {
border: 1px solid #e5e7eb;
border-radius: 10px;
padding: 18px;
background: var(--shop-secondary, #f5f6f8);
}
.msh-summary h2 { margin-top: 0; font-size: 1.05rem; }
.msh-summary-list { list-style: none; margin: 0 0 12px; padding: 0; font-size: .88rem; }
.msh-summary-list li { display: flex; gap: 8px; padding: 4px 0; border-bottom: 1px dashed #e5e7eb; }
/* A11y-Fix (B3): #6b7280 auf --shop-secondary faellt bei heller Kunden-CI unter
WCAG-AA (4.5:1), wie beim bereits gefixten Footer. #565c66 haelt sicher darueber. */
.msh-summary-list .qty { color: #565c66; min-width: 34px; }
.msh-summary-list .name { flex: 1; }
.msh-summary-list .sum { white-space: nowrap; }
.msh-summary .msh-totals { max-width: none; }
.msh-link { font-size: .85rem; }
.msh-confirmation { max-width: 620px; margin: 40px auto; text-align: center; }
/* ---------- Sonstiges ---------- */
.msh-notice { padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; font-size: .9rem; }
.msh-notice--warn { background: #fef3c7; color: #92400e; }
.msh-notice--error { background: #fee2e2; color: #991b1b; }
.msh-empty { text-align: center; padding: 48px 20px; color: #6b7280; }
.msh-offline { text-align: center; padding: 80px 20px; color: #6b7280; font-family: system-ui, sans-serif; }
.msh-legal-text { max-width: 760px; white-space: normal; }
/* ---------- Footer ---------- */
.msh-footer {
background: var(--shop-secondary, #f5f6f8);
border-top: 1px solid #e5e7eb;
padding: 20px;
text-align: center;
font-size: .85rem;
/* A11y-Fix (Lighthouse-Diagnose): #6b7280 auf --shop-secondary rendert bei heller
Kunden-CI (Beispiel #f4f1ea) nur 4,28:1 (< WCAG-AA 4.5:1 fuer Fliesstext) und
liegt selbst gegen den CSS-Default-Fallback #f5f6f8 knapp DARUNTER (4,47:1,
ebenfalls < 4,5:1 — kein Grenzfall, sondern derselbe Verstoss).
#565c66 haelt gegen beide Hintergruende sicher ueber 5:1. */
color: #565c66;
}
.msh-footer-nav { display: flex; gap: 18px; justify-content: center; margin-top: 6px; }
.msh-footer-nav a { color: #565c66; text-decoration: none; }
/* A11y-Fix (Design-Gate Blocker): --shop-primary als TEXTfarbe -> --shop-primary-text. */
.msh-footer-nav a:hover { color: var(--shop-primary-text, var(--shop-primary, #1f3a5f)); }
/* ---------- Toast ---------- */
.msh-toast {
position: fixed;
bottom: 24px;
left: 50%;
transform: translateX(-50%);
background: var(--shop-primary, #1f3a5f);
/* A11y-Fix (W2): fest weisser Text auf --shop-primary kann je Kunden-CI kollabieren
— an die kontrastgeprüfte --shop-primary-ink-Variable anschliessen. */
color: var(--shop-primary-ink, #fff);
padding: 10px 20px;
border-radius: 8px;
font-size: .9rem;
box-shadow: 0 6px 20px rgba(0,0,0,.25);
z-index: 9999;
}
/**
* KCMinishop — Blätterkatalog-Styles (MA-5, 3D-Flipbook via self-hosted StPageFlip)
*
* BEWUSST OHNE --cbk-*-Tokens (wie KCMinishopShop.css): der Shop trägt Kunden-CI, nicht
* den CBK-Look (Spec docs/specs/minishop.md §10/§14 R8). Nur auf der Katalog-Seite
* geladen (ModuleKCMinishopCatalog::compileShop() — schlanke restliche Shop-Seiten).
* Bedienleisten-/Zoom-Icons sind Font Awesome 5 ("fas", CBK-Standard, self-hosted --
* NICHT FA6) statt Inline-SVG/Unicode (Owner-Korrektur 2026-07-10).
*
* page-flip.browser.js injiziert selbst ein