.sl-sofia-story { max-width: 68rem; margin: 0 auto; color: var(--app-ink); }
.sl-sofia-story__header { display: block; margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--app-border); }
.sl-sofia-story__header h1 { margin: 0; font: 600 clamp(2rem, 4vw, 3.4rem)/1.05 ui-sans-serif, system-ui, sans-serif; letter-spacing: -.03em; }
.sl-sofia-story__author { margin: .45rem 0 0; color: var(--app-muted); }
.sl-sofia-story__feed { display: grid; gap: 1rem; }
.sl-sofia-story__part { margin: 1rem 0 -.25rem; color: var(--app-muted); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sl-sofia-story__empty { padding: 2rem; border: 1px dashed var(--app-border); color: var(--app-muted); text-align: center; }
.sl-sofia-story-card { overflow: hidden; border: 1px solid var(--app-border); border-radius: 1.25rem; background: #fff; box-shadow: 0 .4rem 1.6rem rgb(15 23 42 / 6%); }
.sl-sofia-story-card.is-sofia-card-closing { transition: height .25s ease; }
.sl-sofia-story-card.is-sofia-card-closing--direct { transition-duration: .75s; }
.sl-sofia-story-card details { display: block; }
.sl-sofia-story-card summary { display: grid; grid-template-columns: minmax(8rem, 14rem) minmax(0, 1fr); gap: 1.5rem; padding: 1rem; cursor: pointer; list-style: none; }
.sl-sofia-story-card summary::-webkit-details-marker { display: none; }
.sl-sofia-story-card summary::after { position: absolute; }
.sl-sofia-story-card__media { display: block; aspect-ratio: 1 / 1; overflow: hidden; border-radius: .85rem; background: var(--app-raised); }
.sl-sofia-story-card__media img, .sl-sofia-story-card__placeholder { display: grid; width: 100%; height: 100%; place-items: center; object-fit: cover; }
.sl-sofia-story-card__placeholder { color: var(--app-muted); font: 600 3rem/1 ui-sans-serif, system-ui, sans-serif; }
.sl-sofia-story-card__copy { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: .5rem 1rem .5rem 0; }
.sl-sofia-story-card__label { color: var(--app-muted); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sl-sofia-story-card__title { margin-top: .3rem; font: 600 clamp(1.35rem, 2vw, 2rem)/1.15 ui-sans-serif, system-ui, sans-serif; }
.sl-sofia-story-card__teaser { margin-top: .65rem; color: var(--app-muted); font-size: .92rem; line-height: 1.45; }
.sl-sofia-story-card__summary-text { margin-top: .55rem; max-width: 46rem; line-height: 1.55; }
.sl-sofia-story-card__detail {
  display: grid;
  grid-template-rows: 0fr;
  padding: 0 1.5rem;
  border-top: 1px solid transparent;
  opacity: 0;
  transition: grid-template-rows .25s ease, padding .25s ease, border-color .25s ease, opacity .25s ease;
}
.sl-sofia-story-card__detail-content {
  min-height: 0;
  overflow: hidden;
}
.sl-sofia-story-card details[open] .sl-sofia-story-card__detail {
  grid-template-rows: 1fr;
  padding-bottom: 1.5rem;
  border-top-color: var(--app-border);
  opacity: 1;
}
.sl-sofia-story-card__fallback { margin: 1rem 0 0; font-size: .8rem; }
.sl-sofia-story-card__fallback a { color: var(--app-link, #4f46e5); font-weight: 700; }
.sl-sofia-story-card__loading { display: block; margin-top: .8rem; color: var(--app-muted); font-size: .85rem; }
.sl-sofia-story-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; padding-top: 1.25rem; }
.sl-sofia-story-detail__section h3 { margin: 0 0 .75rem; font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sl-sofia-story-detail__events {
  --sofia-event-marker-left: -1.25rem;
  --sofia-event-marker-size: 1rem;
  --sofia-event-marker-radius: .5rem;
  --sofia-event-rail-left: calc(var(--sofia-event-marker-left) + var(--sofia-event-marker-radius));
  --sofia-event-gap: .65rem;
  position: relative;
  display: grid;
  gap: var(--sofia-event-gap);
  margin: 0;
  padding: 0 0 0 1.25rem;
  list-style: none;
}
.sl-sofia-story-detail__events li {
  position: relative;
  display: block;
  width: 100%;
  padding: .75rem 1rem;
  border: 1px solid rgb(218 225 234 / .9);
  border-radius: .75rem;
  background: #fff;
  box-shadow: 0 .2rem .6rem rgb(15 23 42 / .06);
}
.sl-sofia-story-detail__events li::before,
.sl-sofia-story-detail__events li::after {
  position: absolute;
  left: var(--sofia-event-rail-left);
  z-index: 0;
  width: 2px;
  background: rgb(74 222 128 / .72);
  content: "";
  pointer-events: none;
}
/* The rail is intentionally painted as overlapping segments.  A segment
   must cover the full inter-card gap, with a small overlap at each edge;
   ending both pieces exactly at a card border can expose a 1px seam after
   fractional layout rounding. */
.sl-sofia-story-detail__events li:not(:first-child)::before {
  top: calc(0rem - var(--sofia-event-gap) - 1px);
  bottom: 50%;
}
.sl-sofia-story-detail__events li:not(:last-child)::after {
  top: 50%;
  bottom: calc(0rem - var(--sofia-event-gap) - 1px);
}
.sl-sofia-story-detail__events li > span { position: absolute; top: 50%; z-index: 1; left: var(--sofia-event-marker-left); width: var(--sofia-event-marker-size); height: var(--sofia-event-marker-size); margin-top: 0; transform: translateY(-50%); border: 3px solid var(--app-surface); border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 1px rgb(74 222 128 / 40%); }
.sl-sofia-story-detail__events p { display: block; width: 100%; min-width: 0; margin: 0; line-height: 1.5; }
.sl-sofia-story-detail__connections { display: flex; flex-wrap: wrap; gap: .55rem; }
.sl-sofia-story-connection.is-sofia-connection-unseen { border-color: #2563eb; background: #eff6ff; color: #1d4ed8; box-shadow: 0 0 0 .12rem rgb(59 130 246 / 16%); }
.sl-sofia-story-detail__access-note { margin: 0; color: var(--app-muted); font-size: .85rem; line-height: 1.5; }
.sl-sofia-story-connection-form { display: contents; }
.sl-sofia-story-connection { display: inline-flex; min-width: 0; max-width: 100%; align-items: center; gap: .67rem; padding: .47rem .67rem .47rem .4rem; border: 2px solid var(--app-border); border-radius: 999px; }
.sl-sofia-story-connection { background: transparent; color: inherit; cursor: pointer; font: inherit; text-align: left; }
.sl-sofia-story-connection.is-sofia-connection-glowing { animation: sofia-connection-ai-glow .5s ease-out both; }
@keyframes sofia-connection-ai-glow {
  0% { border-color: #93c5fd; box-shadow: 0 0 0 0 rgb(59 130 246 / 0%), 0 0 0 rgb(59 130 246 / 0%); }
  18% { border-color: #2563eb; box-shadow: 0 0 0 .24rem rgb(96 165 250 / 45%), 0 0 1.35rem rgb(37 99 235 / 80%); }
  52% { border-color: #60a5fa; box-shadow: 0 0 0 .14rem rgb(147 197 253 / 35%), 0 0 1rem rgb(59 130 246 / 62%); }
  100% { border-color: var(--app-border); box-shadow: 0 0 0 0 rgb(59 130 246 / 0%), 0 0 0 rgb(59 130 246 / 0%); }
}
@media (prefers-reduced-motion: reduce) {
  .sl-sofia-story-connection.is-sofia-connection-glowing { animation: none; border-color: #2563eb; box-shadow: 0 0 0 .2rem rgb(59 130 246 / 35%); }
}
.sl-sofia-story-connection img, .sl-sofia-story-connection > span:first-child { display: grid; width: 2.67rem; height: 2.67rem; flex: 0 0 2.67rem; place-items: center; border-radius: 50%; background: var(--app-raised); object-fit: cover; font: 600 1rem/1 ui-sans-serif, system-ui, sans-serif; }
.sl-sofia-story-connection strong { overflow: hidden; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.sl-sofia-story-detail__empty { margin: 1.25rem 0 0; color: var(--app-muted); }
@media (max-width: 760px) {
  .sl-sofia-story-card summary { grid-template-columns: 6.5rem minmax(0, 1fr); gap: .9rem; padding: .75rem; }
  .sl-sofia-story-card__copy { padding-right: .25rem; }
  .sl-sofia-story-card__summary-text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
  .sl-sofia-story-card__detail { padding-inline: .9rem; }
  .sl-sofia-story-card details[open] .sl-sofia-story-card__detail { padding-bottom: .9rem; }
  .sl-sofia-story-detail { grid-template-columns: 1fr; gap: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .sl-sofia-story-card.is-sofia-card-closing { transition: none; }
  .sl-sofia-story-card__detail { transition: none; }
}