.ksr-player {
  --ksr-gold: #d6ae57;
  --ksr-gold-bright: #f3d689;
  --ksr-ink: #080b12;
  --ksr-panel: #111723;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
  margin: 1.5rem 0;
  padding: 1.1rem;
  color: #edf1f7;
  border: 1px solid rgba(214, 174, 87, .45);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(17, 23, 35, .98), rgba(7, 10, 17, .98));
  box-shadow: 0 18px 50px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .04);
  font-family: inherit;
}

.ksr-player::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .16;
  pointer-events: none;
  background:
    linear-gradient(115deg, transparent 0 46%, rgba(243, 214, 137, .32) 46.2% 46.5%, transparent 46.7%),
    linear-gradient(25deg, transparent 0 72%, rgba(214, 174, 87, .22) 72.2% 72.5%, transparent 72.7%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 6px);
}

.ksr-player *, .ksr-player *::before, .ksr-player *::after { box-sizing: border-box; }
.ksr-glow { position: absolute; inset: -80% auto auto -15%; width: 260px; height: 260px; border-radius: 50%; background: rgba(214, 174, 87, .08); filter: blur(35px); pointer-events: none; }
.ksr-heading { position: relative; display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.ksr-heading strong { display: block; color: var(--ksr-gold-bright); font-size: 1rem; letter-spacing: .06em; text-transform: uppercase; }
.ksr-status { display: block; margin-top: .15rem; color: #aeb7c7; font-size: .82rem; }
.ksr-symbol { display: grid; place-items: center; flex: 0 0 42px; height: 42px; color: var(--ksr-ink); border: 2px solid #f5dda1; border-radius: 50%; background: radial-gradient(circle at 35% 25%, #ffe6a7, var(--ksr-gold) 65%, #866621); font-family: Georgia, serif; font-weight: 800; box-shadow: 0 0 24px rgba(214, 174, 87, .22), inset 0 0 0 3px rgba(25, 17, 5, .25); }
.ksr-controls { display: flex; flex-wrap: wrap; gap: .55rem; }
.ksr-audio-badge { position: relative; display: inline-flex; align-items: center; gap: .45rem; margin: -.25rem 0 .9rem; padding: .35rem .55rem; color: #e8d39b; border: 1px solid rgba(214, 174, 87, .26); border-radius: 999px; background: rgba(214, 174, 87, .08); font-size: .72rem; letter-spacing: .035em; }
.ksr-audio-badge span { color: var(--ksr-gold-bright); font-size: .6rem; }
.ksr-chapters { position: relative; margin: 0 0 1rem; border: 1px solid rgba(255, 255, 255, .08); border-radius: 9px; background: rgba(4, 7, 12, .38); }
.ksr-chapters > summary { display: flex; justify-content: space-between; gap: .7rem; padding: .75rem .85rem; color: #dbe1eb; cursor: pointer; font-size: .86rem; font-weight: 700; list-style-position: inside; }
.ksr-chapters > summary small { color: #9ca7b8; font-size: .72rem; font-weight: 400; }
.ksr-chapter-list { overflow: auto; max-height: 310px; margin: 0; padding: 0 .55rem .55rem; list-style: none; scrollbar-color: #69542b #151b25; }
.ksr-chapter-list li { margin: 0; padding: 0; }
.ksr-chapter { display: grid; grid-template-columns: 4.2rem minmax(0, 1fr) auto; align-items: center; gap: .65rem; width: 100%; min-height: 43px; padding: .5rem .6rem; color: #cbd3df; border: 0; border-top: 1px solid rgba(255, 255, 255, .055); background: transparent; cursor: pointer; text-align: left; }
.ksr-chapter:hover:not(:disabled), .ksr-chapter.is-active { color: #fff2ca; background: linear-gradient(90deg, rgba(214, 174, 87, .15), transparent); }
.ksr-chapter.is-active { box-shadow: inset 3px 0 var(--ksr-gold); }
.ksr-chapter:disabled { color: #737d8d; cursor: default; }
.ksr-chapter-number { color: var(--ksr-gold); font-size: .67rem; font-weight: 800; letter-spacing: .05em; }
.ksr-chapter-title { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.ksr-chapter-state { color: #909bad; font-size: .66rem; }
.ksr-chapter:not(:disabled) .ksr-chapter-state { color: var(--ksr-gold-bright); }
.ksr-button { appearance: none; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 42px; padding: .65rem .9rem; color: #eef2f8; border: 1px solid #374052; border-radius: 8px; background: #1a2230; cursor: pointer; font: 600 .9rem/1 inherit; transition: border-color .2s, transform .2s, background .2s; }
.ksr-button:hover:not(:disabled) { border-color: var(--ksr-gold); transform: translateY(-1px); }
.ksr-button:focus-visible, .ksr-settings summary:focus-visible, .ksr-player select:focus-visible, .ksr-player input:focus-visible { outline: 2px solid var(--ksr-gold-bright); outline-offset: 2px; }
.ksr-button:disabled { opacity: .42; cursor: not-allowed; }
.ksr-primary { color: #17120a; border-color: var(--ksr-gold); background: linear-gradient(135deg, var(--ksr-gold-bright), var(--ksr-gold)); box-shadow: 0 0 18px rgba(214, 174, 87, .16); }
.ksr-progress-wrap { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .75rem; margin-top: 1rem; }
.ksr-progress { overflow: hidden; height: 6px; border-radius: 10px; background: #303847; }
.ksr-progress span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #9c772e, var(--ksr-gold-bright)); transition: width .25s ease; }
.ksr-percent { min-width: 3.2rem; color: #aeb7c7; font-size: .78rem; text-align: right; }
.ksr-settings { margin-top: .9rem; border-top: 1px solid rgba(255, 255, 255, .08); }
.ksr-settings summary { padding-top: .85rem; color: #c9d0dc; cursor: pointer; font-size: .86rem; }
.ksr-settings-grid { display: grid; grid-template-columns: minmax(180px, 2fr) 1fr 1fr; gap: .85rem; padding-top: .8rem; }
.ksr-settings-grid label { color: #b9c1cf; font-size: .78rem; }
.ksr-settings-grid select, .ksr-settings-grid input { width: 100%; margin-top: .35rem; }
.ksr-settings-grid select { min-height: 38px; padding: .4rem; color: #eef2f8; border: 1px solid #3c4658; border-radius: 6px; background: #111723; }
.ksr-settings-grid output { float: right; color: var(--ksr-gold-bright); }
.ksr-notice { margin: .8rem 0 0; padding: .6rem .75rem; color: #ffd8d8; border-left: 3px solid #d75c5c; background: rgba(215, 92, 92, .1); font-size: .85rem; }
.ksr-reading-now { border-radius: 4px; background: linear-gradient(90deg, rgba(214, 174, 87, .18), transparent) !important; box-shadow: -5px 0 0 rgba(214, 174, 87, .75); transition: background .25s, box-shadow .25s; }

/* Der vom Shortcode gewählte Storybereich bleibt unabhängig vom Theme ein
   vertikaler Lesebereich. Das verhindert versehentliche Reihen-/Spaltenlayouts
   von Gutenberg-Gruppen und Theme-Buildern. */
.ksr-story-target {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  columns: auto !important;
  column-count: 1 !important;
  grid-template-columns: none !important;
  flex-direction: column !important;
  align-items: stretch !important;
}
.ksr-story-target.is-layout-flex,
.ksr-story-target .is-layout-flex,
.ksr-story-target .wp-block-group__inner-container {
  display: block !important;
  width: 100% !important;
  columns: auto !important;
  column-count: 1 !important;
  grid-template-columns: none !important;
}
.ksr-story-target > *,
.ksr-story-target .wp-block-group__inner-container > * {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.ksr-story-target p,
.ksr-story-target blockquote,
.ksr-story-target li {
  max-width: 78ch !important;
  margin-top: 0 !important;
  margin-bottom: 1.15rem !important;
  line-height: 1.75 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}
.ksr-story-target h1,
.ksr-story-target h2,
.ksr-story-target h3,
.ksr-story-target h4,
.ksr-story-target h5,
.ksr-story-target h6 {
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1.8em 0 .65em !important;
  white-space: normal !important;
  word-break: normal !important;
}
.ksr-story-target h1:first-child,
.ksr-story-target h2:first-child { margin-top: 0 !important; }
.ksr-player[data-state="playing"] .ksr-symbol { animation: ksr-pulse 2.2s ease-in-out infinite; }
@keyframes ksr-pulse { 50% { box-shadow: 0 0 34px rgba(243, 214, 137, .6); transform: scale(1.04); } }
@media (max-width: 640px) { .ksr-settings-grid { grid-template-columns: 1fr; } .ksr-button { flex: 1 1 28%; padding-inline: .6rem; } .ksr-primary { flex-basis: 100%; } .ksr-chapter { grid-template-columns: 3.6rem minmax(0, 1fr); } .ksr-chapter-state { display: none; } }
@media (prefers-reduced-motion: reduce) { .ksr-player *, .ksr-player *::before, .ksr-player *::after { animation: none !important; transition: none !important; } }