/*
 * BooksOnline Komponenten – Kopie von docs/design-system/components/bundle.css (bin/build-design-system).
 * Nicht von Hand ändern: bundle.css ändern und neu erzeugen. Projekt-Ergänzungen in assets/styles/app.css.
 */
/* Schriften kommen lokal aus assets/styles/design/fonts.css (kein Google-Fonts-Import, keine externen Ressourcen). */
/* BookOnline — Schwester-System von BagsData. Klassen mit Präfix bo-, Wrapper .bo. Eckig (radius-none), nur Cover mit radius-cover. */
.bo, .bo *{box-sizing:border-box}
.bo{font-family:var(--font-sans);font-size:15px;line-height:24px;color:var(--ink-body);background:var(--surface-100);-webkit-font-smoothing:antialiased}
.bo :where(h1,h2,h3,h4,h5){font-family:var(--font-sans);color:var(--ink);margin:0}
.bo :where(p,ul,ol){margin:0;padding:0}
.bo :where(a){color:var(--accent-ink);text-decoration:none}
.bo :where(a,button,input):focus-visible{outline:3px solid var(--accent-ink);outline-offset:3px}
.bo-container{max-width:1240px;margin:0 auto;padding:0 24px}
.bo-section{padding:var(--space-6) 0}
.bo-section--alt{background:var(--surface-200)}
.bo-night{background:var(--night-100);color:var(--on-night-body)}
.bo-night :where(h1,h2,h3,h4,h5){color:var(--on-night)}
.bo-night :where(a){color:var(--link-on-night)}
.bo-night :where(a,button,input):focus-visible{outline-color:var(--link-on-night)}

/* Zickzack-Titel (wie BagsData) */
.bo-zigzag{display:block;width:40px;height:12px;margin-bottom:10px;color:var(--accent)}
.bo-zigzag path{fill:none;stroke:currentColor;stroke-width:2.5}
.bo-title{font-size:36px;line-height:40px;font-weight:700;letter-spacing:-1.8px;color:var(--ink)}
.bo-lead{font-family:var(--font-serif);font-size:20px;line-height:32px;font-weight:500;color:var(--ink-body);margin-top:16px;max-width:640px}
.bo-stand{font-family:var(--font-serif);font-size:13px;line-height:20px;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-muted)}
.bo-sectionhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:48px}

/* Buttons */
.bo-btn{display:inline-flex;align-items:center;gap:14px;font-family:var(--font-sans);font-size:15px;line-height:24px;font-weight:600;padding:13px 24px;border:3px solid var(--primary);border-radius:0;background:transparent;color:var(--ink);cursor:pointer;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s}
.bo-btn:hover{background:var(--primary);color:var(--on-primary)}
.bo-btn__arrow{width:18px;height:12px;flex:none}
.bo-btn__arrow path{fill:none;stroke:currentColor;stroke-width:2}
.bo-btn--solid{background:var(--primary);color:var(--on-primary)}
.bo-btn--solid:hover{background:var(--primary-strong);border-color:var(--primary-strong)}
.bo-btn--link{padding:0;border:0;color:var(--accent-ink);font-weight:700}
.bo-btn--link:hover{background:none;color:var(--ink)}
.bo-btn--sm{padding:7px 14px;font-size:14px;border-width:2px}
.bo-night .bo-btn:not(.bo-btn--solid):not(.bo-btn--link){border-color:var(--accent);color:var(--on-night)}
.bo-night .bo-btn:not(.bo-btn--solid):not(.bo-btn--link):hover{background:var(--accent);color:var(--night-100)}
.bo-night .bo-btn--link{color:var(--link-on-night)}
.bo-night .bo-btn--link:hover{color:var(--on-night)}

/* Badges */
.bo-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:11px;line-height:16px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;white-space:nowrap;padding:3px 8px;border-radius:0;background:var(--surface-300);color:var(--ink)}
.bo-badge--top{background:var(--highlight);color:var(--on-highlight)}
.bo-badge--new{background:var(--primary);color:var(--on-primary)}
.bo-badge--outline{background:transparent;box-shadow:inset 0 0 0 1.5px var(--border-strong);color:var(--ink-muted)}
.bo-night .bo-badge:not(.bo-badge--top):not(.bo-badge--new){background:var(--night-200);color:var(--on-night)}

/* Trend */
.bo-trend{display:inline-flex;align-items:center;gap:3px;font-size:13px;line-height:20px;font-weight:600;font-variant-numeric:tabular-nums}
.bo-trend svg{width:10px;height:10px}
.bo-trend--up{color:var(--trend-up)}
.bo-trend--down{color:var(--trend-down)}
.bo-trend--same{color:var(--ink-muted)}
.bo-trend--new{color:var(--highlight-ink)}

/* Buchcover */
.bo-cover{position:relative;display:block;width:120px;aspect-ratio:2/3;border-radius:var(--radius-cover);overflow:hidden;box-shadow:var(--shadow-cover);background:var(--surface-300);flex:none}
.bo-cover img{display:block;width:100%;height:100%;object-fit:cover}
/* Mit Bild: das Cover liegt über dem Platzhalter (der beim Laden oder ohne Bild sichtbar bleibt), die Rückenlinie darüber */
.bo-cover img{position:absolute;inset:0;z-index:1}
.bo-cover::after{z-index:2}
.bo-cover::after{content:"";position:absolute;top:0;bottom:0;left:4px;width:2px;background:rgba(0,0,0,.16)}
.bo-cover--xs{width:44px}
.bo-cover--sm{width:72px}
.bo-cover--lg{width:200px}
/* Platzhalter ohne Bild: Titel und Autor:in auf Markenfarbe */
.bo-cover__ph{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:12% 12% 14% 16%;color:#ffffff}
.bo-cover__ph b{font-family:var(--font-serif);font-weight:700;font-size:1em;line-height:1.15}
.bo-cover__ph i{font-style:normal;font-family:var(--font-sans);font-size:.62em;line-height:1.3;font-weight:500;opacity:.85}
.bo-cover__ph::before{content:"";position:absolute;left:16%;bottom:34%;width:22%;height:2px;background:var(--on-primary-accent)}
.bo-cover--navy{background:var(--brand-navy)}
.bo-cover--teal{background:#1f6f73}
.bo-cover--night{background:var(--night-200)}
.bo-cover--amber{background:var(--highlight)}
.bo-cover--amber .bo-cover__ph{color:var(--on-highlight)}
.bo-cover--amber .bo-cover__ph::before{background:var(--night-100)}
.bo-cover{font-size:15px}
.bo-cover--xs{font-size:0}
.bo-cover--sm{font-size:10px}
.bo-cover--lg{font-size:22px}
/* Gestaltetes Cover für Ausgaben ohne Bild: Gattung oben, Titel und Autor:in, Verlag unten */
.bo-cover--edition .bo-cover__ph{justify-content:flex-start;gap:.45em}
.bo-cover--edition .bo-cover__ph::before{content:none}
.bo-cover__kicker{font-family:var(--font-sans);font-size:.5em;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1.3;opacity:.8;padding-bottom:.6em;border-bottom:1px solid currentColor}
.bo-cover--edition .bo-cover__ph b{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;margin-top:.3em;overflow-wrap:anywhere;hyphens:auto}
.bo-cover__imprint{margin-top:auto;font-family:var(--font-sans);font-size:.48em;font-weight:500;line-height:1.3;opacity:.75;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bo-cover__imprint::before{content:"";display:block;width:2.6em;height:2px;margin-bottom:.7em;background:var(--on-primary-accent)}
.bo-cover--amber .bo-cover__imprint::before{background:var(--night-100)}
.bo-cover__kicker,.bo-cover--edition .bo-cover__ph i{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bo-cover--edition .bo-cover__ph i{-webkit-line-clamp:3}
/* Klein (Listen): nur Gattung und Titel – Autor:in und Verlag stehen daneben */
.bo-cover--edition.bo-cover--sm .bo-cover__ph i,.bo-cover--edition.bo-cover--sm .bo-cover__imprint{display:none}
.bo-cover--edition.bo-cover--sm .bo-cover__ph b{-webkit-line-clamp:5}

/* Buch-Karte */
.bo-book{display:flex;flex-direction:column;gap:16px;color:inherit;text-decoration:none}
.bo-book__cover{position:relative;align-self:flex-start}
.bo-book__cover .bo-badge{position:absolute;left:-6px;top:10px;z-index:1}
.bo-book__title{font-family:var(--font-serif);font-size:19px;line-height:25px;font-weight:700;color:var(--ink);transition:color .2s}
.bo-book__author{font-size:14px;line-height:20px;font-weight:500;color:var(--ink-muted);margin-top:4px}
.bo-book__meta{display:flex;align-items:center;gap:8px;font-size:13px;line-height:20px;color:var(--ink-muted);margin-top:8px}
.bo-book:hover .bo-book__title{color:var(--accent-ink)}
.bo-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:48px 24px}
.bo-shelf .bo-book__cover{align-self:stretch}
.bo-shelf .bo-cover{width:100%}

/* Bestsellerliste */
.bo-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--border)}
.bo-row{display:grid;grid-template-columns:64px 44px 1fr auto;align-items:center;gap:24px;padding:16px;border-bottom:1px solid var(--border);color:inherit;text-decoration:none;transition:background-color .2s}
.bo-row:hover{background:var(--surface-200)}
.bo-row__rank{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.bo-row__rank strong{font-size:40px;line-height:40px;font-weight:800;letter-spacing:-2px;color:var(--ink);font-variant-numeric:tabular-nums}
.bo-row--top .bo-row__rank strong{color:var(--highlight-ink)}
.bo-row__title{font-family:var(--font-serif);font-size:19px;line-height:25px;font-weight:700;color:var(--ink)}
.bo-row__author{font-size:14px;line-height:20px;font-weight:500;color:var(--ink-muted);margin-top:2px}
.bo-row__side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right;font-size:13px;line-height:20px;color:var(--ink-muted)}
.bo-row:hover .bo-row__title{color:var(--accent-ink)}
.bo-source{font-size:13px;line-height:20px;color:var(--ink-muted);margin-top:16px}

/* Listen-Tabs */
.bo-tabs{display:flex;flex-wrap:wrap;gap:8px}
.bo-tab{font-family:var(--font-sans);font-size:15px;line-height:24px;font-weight:600;padding:8px 16px;border:2px solid var(--border-strong);border-radius:0;background:transparent;color:var(--ink);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.bo-tab:hover{border-color:var(--primary)}
.bo-tab[aria-selected="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}

/* Suche */
.bo-search{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;background:var(--surface-100);border:2px solid var(--border-strong);border-radius:0;min-width:260px}
.bo-search svg{width:18px;height:18px;flex:none;color:var(--ink-muted)}
.bo-search svg *{fill:none;stroke:currentColor;stroke-width:2}
.bo-search input{flex:1;min-width:0;border:0;background:transparent;font-family:var(--font-sans);font-size:15px;color:var(--ink);outline:none}
.bo-search input::placeholder{color:var(--ink-muted);opacity:1}
.bo-search:focus-within{border-color:var(--accent-ink);outline:1px solid var(--accent-ink)}
.bo-night .bo-search{background:var(--night-200);border-color:#66748f}
.bo-night .bo-search svg{color:var(--on-night-body)}
.bo-night .bo-search input{color:var(--on-night)}
.bo-night .bo-search input::placeholder{color:var(--on-night-body)}
.bo-night .bo-search:focus-within{border-color:var(--link-on-night);outline-color:var(--link-on-night)}

/* Header */
.bo-header{background:var(--night-100);color:var(--on-night-body)}
.bo-header .bo-container{display:flex;align-items:center;gap:32px;height:88px}
.bo-wordmark{display:inline-flex;align-items:center;gap:0;white-space:nowrap;font-family:var(--font-sans);font-size:24px;line-height:24px;font-weight:800;letter-spacing:-1.2px;color:var(--on-night) !important;text-decoration:none}
.bo-wordmark span{color:var(--link-on-night)}
.bo-wordmark svg{width:26px;height:20px;margin-right:10px;color:var(--accent)}
.bo-wordmark svg path{fill:none;stroke:currentColor;stroke-width:3}
.bo-wordmark--ink{color:var(--ink) !important}
.bo-wordmark--ink span{color:var(--accent-ink)}
.bo-nav{display:flex;gap:4px;margin-right:auto}
.bo-nav a{font-size:15px;line-height:24px;font-weight:600;letter-spacing:-.5px;color:var(--on-night) !important;padding:6px 12px;transition:color .2s}
.bo-nav a:hover,.bo-nav a[aria-current="page"]{color:var(--link-on-night) !important}
.bo-nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--accent)}

/* Hero: Buch der Woche */
.bo-hero{position:relative;overflow:hidden;background:var(--night-100);color:var(--on-night-body);padding:72px 0 120px}
.bo-hero .bo-container{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;gap:64px;align-items:center}
.bo-hero__kicker{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.bo-hero h1{font-size:48px;line-height:54px;font-weight:800;letter-spacing:-2.4px;color:var(--on-night);margin:0 0 24px;max-width:640px}
.bo-hero h1 em{font-style:normal;color:var(--link-on-night)}
.bo-hero__book{font-family:var(--font-serif);font-size:34px;line-height:40px;font-weight:700;letter-spacing:-.5px;color:var(--on-night)}
.bo-hero__author{font-size:15px;color:var(--on-night-body);margin:4px 0 16px}
.bo-hero__blurb{font-family:var(--font-serif);font-size:17px;line-height:28px;max-width:560px;margin-bottom:32px}
.bo-hero__actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.bo-hero__stage{position:relative;padding:24px 40px 0 0}
.bo-hero__stage::before{content:"";position:absolute;right:0;top:0;width:200px;height:260px;background:var(--primary)}
.bo-hero__stage .bo-cover{position:relative}
.bo-hero__angle{position:absolute;left:-5%;right:-5%;bottom:-56px;height:100px;background:var(--surface-100);transform:rotate(-2deg);z-index:3}
.bo-circle{position:absolute;z-index:2;border-radius:50%;pointer-events:none}
.bo-circle--1{width:33px;height:33px;background:var(--accent)}
.bo-circle--2{width:14px;height:14px;background:var(--highlight)}

/* Footer */
.bo-footer{background:var(--night-200);color:var(--on-night-body);padding:72px 0 40px;font-size:13px;line-height:20px}
.bo-footer__top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px}
.bo-footer p{font-size:15px;line-height:24px;max-width:380px;margin-top:16px}
.bo-footer h5{font-size:15px;line-height:24px;font-weight:700;color:var(--on-night);margin-bottom:12px}
.bo-footer ul{list-style:none}
.bo-footer li{margin-bottom:8px}
.bo-footer li a{color:var(--on-night-body) !important;font-size:14px}
.bo-footer li a:hover{color:var(--link-on-night) !important}
.bo-footer__bottom{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid #2a3350;margin-top:48px;padding-top:24px}

/* Hero mit Bild (Lummi-Motiv): Bild rechts, links mit night-100 abgedunkelt */
.bo-hero--image{background:var(--night-100) var(--bo-img) right center/cover no-repeat}
.bo-hero--image::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--night-100) 0%,var(--night-100) 34%,rgba(0,0,0,0) 78%)}
.bo-hero--image::after{content:"";position:absolute;inset:0;z-index:1;background:var(--night-100);opacity:.62}
.bo-hero--image .bo-hero__stage::before{display:none}
/* Genre-Teaser mit Bild */
.bo-genres{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.bo-genre{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:280px;padding:24px;overflow:hidden;background:var(--night-200) var(--bo-img) center/cover no-repeat;color:var(--on-night) !important;text-decoration:none}
/* Ohne --bo-img ist die Kurzschreibweise oben ungültig (transparent): die Fläche bleibt dann night-200 */
.bo-genre{background-color:var(--night-200)}
.bo-hero{background-color:var(--night-100)}
.bo-genre::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--night-100) 0%,rgba(0,0,0,.35) 60%,rgba(0,0,0,.1) 100%);transition:opacity .3s}
.bo-genre > *{position:relative}
.bo-genre b{font-size:22px;line-height:28px;font-weight:700;letter-spacing:-.8px}
.bo-genre span{font-size:14px;color:var(--on-night-body)}
.bo-genre:hover::before{opacity:.85}

/* ===== Domains: Genre-Regeln. Gelten unter data-theme="<genre>" (auf <html> der Domain oder einem Wrapper). ===== */
/* Krimi – größter Abstand: Noir, Rot, Oswald in Versalien, harte Kanten, steile Schräge */
[data-theme="krimi"] .bo-title,[data-theme="krimi"] .bo-hero h1,[data-theme="krimi"] .bo-genre b{font-family:var(--font-krimi);text-transform:uppercase;letter-spacing:0;font-weight:700}
[data-theme="krimi"] .bo-hero h1{font-size:56px;line-height:56px}
[data-theme="krimi"] .bo-row__rank strong{font-family:var(--font-krimi);letter-spacing:0}
[data-theme="krimi"] .bo-zigzag{height:6px;width:56px;background:var(--accent)}
[data-theme="krimi"] .bo-zigzag path{display:none}
[data-theme="krimi"] .bo-hero__angle{transform:rotate(-4deg);bottom:-70px}
[data-theme="krimi"] .bo-cover{border-radius:0;filter:saturate(.7) contrast(1.1)}
[data-theme="krimi"] .bo-wordmark span{color:var(--link-on-night)}
/* Romance – mittlerer Abstand: Rosé, Playfair kursiv, Pillen statt Ecken */
[data-theme="romance"] .bo-title,[data-theme="romance"] .bo-hero h1,[data-theme="romance"] .bo-genre b{font-family:var(--font-romance);font-style:italic;font-weight:600;letter-spacing:0}
[data-theme="romance"] .bo-btn,[data-theme="romance"] .bo-tab,[data-theme="romance"] .bo-badge,[data-theme="romance"] .bo-search{border-radius:var(--radius-pill)}
[data-theme="romance"] .bo-cover{border-radius:4px}
[data-theme="romance"] .bo-hero__angle{transform:none;height:80px;bottom:-40px;border-radius:50% 50% 0 0 / 100% 100% 0 0;left:-10%;right:-10%}
[data-theme="romance"] .bo-hero__stage::before{border-radius:999px 999px 0 0}
/* Sachbuch – kleinster Abstand: Grundfarben, kühles Papier, Mono-Labels, Linien statt Flächen */
[data-theme="sachbuch"] .bo-stand,[data-theme="sachbuch"] .bo-badge,[data-theme="sachbuch"] .bo-row__side{font-family:var(--font-mono);letter-spacing:.8px}
[data-theme="sachbuch"] .bo-row__rank strong{font-family:var(--font-mono);font-weight:500;font-size:32px;letter-spacing:-1px}
[data-theme="sachbuch"] .bo-badge:not(.bo-badge--top):not(.bo-badge--new){background:transparent;box-shadow:inset 0 0 0 1.5px var(--border-strong);color:var(--ink)}
[data-theme="sachbuch"] .bo-zigzag{height:2px;width:40px;background:var(--accent)}
[data-theme="sachbuch"] .bo-zigzag path{display:none}
[data-theme="sachbuch"] .bo-hero__angle{transform:none;height:0}
/* Kinderbuch – großer Abstand: Gelb/Blau, Fredoka, runde Formen, Versatz-Schatten */
:is([data-theme="kinder"],[data-theme="mini"]) .bo-title,:is([data-theme="kinder"],[data-theme="mini"]) .bo-hero h1,:is([data-theme="kinder"],[data-theme="mini"]) .bo-genre b,:is([data-theme="kinder"],[data-theme="mini"]) .bo-wordmark{font-family:var(--font-kinder);letter-spacing:-.5px}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-btn,:is([data-theme="kinder"],[data-theme="mini"]) .bo-tab,:is([data-theme="kinder"],[data-theme="mini"]) .bo-badge{border-radius:var(--radius-pill)}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-btn--solid,:is([data-theme="kinder"],[data-theme="mini"]) .bo-tab[aria-selected="true"]{box-shadow:var(--shadow-pop)}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-search,:is([data-theme="kinder"],[data-theme="mini"]) .bo-genre,:is([data-theme="kinder"],[data-theme="mini"]) .bo-hero__stage::before{border-radius:var(--radius-soft)}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-cover{border-radius:10px;box-shadow:var(--shadow-pop)}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-cover::after{display:none}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-zigzag{color:var(--accent);width:56px;height:16px}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-zigzag path{stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-hero__angle{transform:none;height:60px;bottom:-30px;border-radius:50%;left:-20%;right:-20%}
:is([data-theme="kinder"],[data-theme="mini"]) .bo-row:hover{background:var(--surface-200);border-radius:var(--radius-soft)}

/* Responsiv */
@media (max-width:760px){
  .bo-genres{grid-template-columns:1fr 1fr}
  .bo-hero .bo-container{grid-template-columns:1fr}
  .bo-hero h1{font-size:36px;line-height:40px;letter-spacing:-1.8px}
  .bo-row{grid-template-columns:44px 44px 1fr;gap:16px;padding:12px 0}
  .bo-row__side{display:none}
  .bo-footer__top{grid-template-columns:1fr 1fr}
  .bo-nav{display:none}
  .bo-section{padding:var(--space-5) 0}
}
@media (prefers-reduced-motion:reduce){.bo *{transition:none !important}}

/* ===== Listen-Darstellungen je Domain (Site::listLayout): list = .bo-list, shelf = .bo-shelfpick, carousel = .bo-carousel ===== */

/* Buch-Details: Panel zum ausgewählten Buch in Regal und Karussell */
.bo-detail{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;padding:32px;background:var(--surface-200)}
.bo-detail[hidden]{display:none}
.bo-detail__rank{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.bo-detail__title{font-family:var(--font-serif);font-size:34px;line-height:40px;font-weight:700;letter-spacing:-.5px;color:var(--ink)}
.bo-detail__author{font-size:15px;line-height:24px;font-weight:500;color:var(--ink-muted);margin-top:4px}
.bo-detail__facts{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:16px;font-size:13px;line-height:20px;color:var(--ink-muted)}
.bo-detail__facts strong{display:block;font-size:22px;line-height:28px;font-weight:700;color:var(--ink)}
.bo-detail__rating strong{color:var(--highlight-ink)}

/* Buchregal: Cover stehen auf einem Brett; ein Klick wählt ein Buch, das Panel darunter zeigt es */
.bo-shelfpick__shelf{list-style:none;margin:0;padding:0 8px;display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,104px));justify-content:center;align-items:end;gap:16px}
.bo-shelfpick__book{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;transition:transform .25s}
.bo-shelfpick__book .bo-cover{width:100%;font-size:11px}
.bo-shelfpick__book:hover{transform:translateY(-6px)}
.bo-shelfpick__book[aria-expanded="true"]{transform:translateY(-14px)}
.bo-shelfpick__book[aria-expanded="true"] .bo-cover{outline:3px solid var(--accent);outline-offset:3px}
.bo-shelfpick__book .bo-badge{position:absolute;left:-6px;top:8px;z-index:1}
.bo-shelfpick__board{height:12px;margin:0 0 32px;background:var(--ink);box-shadow:0 6px 0 var(--surface-300)}
.bo-shelfpick__details{display:grid;gap:16px}
.bo-shelfpick.is-enhanced .bo-shelfpick__details{gap:0}

/* Karussell: Cover auf einem drehbaren Ring; ohne JavaScript eine wischbare Reihe */
.bo-carousel__stage{position:relative;outline:none}
.bo-carousel__ring{list-style:none;margin:0;padding:8px 0 24px;display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory}
.bo-carousel__item{flex:none;scroll-snap-align:center}
.bo-carousel__item .bo-cover{width:140px;font-size:13px}
.bo-carousel__controls{display:flex;align-items:center;justify-content:center;gap:24px;margin:8px 0 32px}
.bo-carousel__status{min-width:160px;text-align:center;font-size:13px;line-height:20px;color:var(--ink-muted)}
.bo-carousel__details{display:grid;gap:16px}
.bo-carousel:not(.is-enhanced) .bo-carousel__controls{display:none}
/* Mit JavaScript: echter Ring in 3D. --n Bücher, --i Platz im Ring, --turn aktuelles Buch, --radius vom Controller */
.bo-carousel.is-enhanced .bo-carousel__stage{height:300px;perspective:1100px;overflow:hidden}
.bo-carousel.is-enhanced .bo-carousel__ring{position:absolute;left:50%;top:24px;width:140px;height:210px;margin-left:-70px;padding:0;overflow:visible;transform-style:preserve-3d;transform:translateZ(calc(var(--radius) * -1)) rotateY(calc(var(--turn) * -360deg / var(--n)));transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.bo-carousel.is-enhanced .bo-carousel__item{position:absolute;inset:0;transform:rotateY(calc(var(--i) * 360deg / var(--n))) translateZ(var(--radius));transition:opacity .4s;opacity:.45;cursor:pointer}
.bo-carousel.is-enhanced .bo-carousel__item.is-current{opacity:1;cursor:default}
.bo-carousel.is-enhanced .bo-carousel__details{gap:0}

@media (max-width:760px){
  .bo-detail{grid-template-columns:1fr;padding:24px}
  .bo-detail .bo-cover--lg{width:120px;font-size:15px}
  .bo-shelfpick__shelf{display:flex;justify-content:flex-start;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-top:20px;margin-top:-20px}
  .bo-shelfpick__shelf > li{flex:0 0 76px;scroll-snap-align:start}
  .bo-carousel.is-enhanced .bo-carousel__stage{perspective:800px}
  .bo-carousel__controls{gap:12px}
  .bo-carousel__status{min-width:0;flex:1}
}
@media (prefers-reduced-motion:reduce){.bo-carousel.is-enhanced .bo-carousel__ring,.bo-shelfpick__book{transition:none}}
/* Karussell mit three.js (Klasse is-webgl vom Controller): das Canvas ersetzt den CSS-Ring; Screenreader bekommen das Buch über Statuszeile und Info-Panel */
.bo-carousel__canvas{display:none}
.bo-carousel.is-webgl .bo-carousel__canvas{display:block;position:absolute;inset:0;width:100%;height:100%;cursor:grab}
.bo-carousel.is-webgl .bo-carousel__ring{visibility:hidden}

/* Genre-Seiten: Genre-Navigation als Links (ListTabs-Klassen, aktive Seite über aria-current) */
.bo-tab[aria-current="page"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
a.bo-tab{display:inline-block;text-decoration:none}
.bo-genre-nav{margin-top:48px}

/* Kauf-Link (Amazon-Partnerlink, als Werbung mit * gekennzeichnet) */
.bo-buy{display:inline-block;margin-top:4px;font-size:13px;line-height:20px;font-weight:600;color:var(--accent-ink)}
.bo-buy:hover{color:var(--ink)}
.bo-detail__buy{margin-top:24px}
.bo-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bo-detail__original{font-family:var(--font-serif);font-style:italic;font-size:14px;line-height:20px;color:var(--ink-muted);margin-top:4px}