.nc{
  --nc-vis:var(--nc-vis-desktop,2); --nc-gap:20px; --nc-edge:32px; --nc-radius:24px;
  --nc-text:#1d1d1f; --nc-muted:#6e6e73; --nc-accent:#0071e3;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased; color:var(--nc-text);
}
.nc *{box-sizing:border-box}
.nc-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 6px}
.nc-title{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2}

/* Fortschritt */
.nc-progress{display:flex;gap:6px}
.nc-seg{position:relative;width:28px;height:4px;border-radius:99px;border:0;padding:0;cursor:pointer;
  background:rgba(0,0,0,.12);overflow:hidden;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.nc-seg::before{content:"";position:absolute;inset:-10px 0}
.nc-seg.on{width:52px}
.nc-fill{position:absolute;inset:0;border-radius:inherit;background:var(--nc-text);transform:scaleX(0);transform-origin:left}
.nc-seg.on .nc-fill.run{animation:nc-fill var(--nc-pause,4000ms) linear forwards}
.nc.paused .nc-fill{animation-play-state:paused!important}
@keyframes nc-fill{to{transform:scaleX(1)}}

/* Scrollbereich: Ränder weich ausblenden statt hart abschneiden */
.nc-viewport{margin:0 calc(-1 * var(--nc-edge)) -40px;
  -webkit-mask-image:linear-gradient(90deg,transparent calc(var(--nc-edge) + 2px - var(--nc-gap)),#000 var(--nc-edge),#000 calc(100% - var(--nc-edge)),transparent calc(100% - var(--nc-edge) - 2px + var(--nc-gap)));
          mask-image:linear-gradient(90deg,transparent calc(var(--nc-edge) + 2px - var(--nc-gap)),#000 var(--nc-edge),#000 calc(100% - var(--nc-edge)),transparent calc(100% - var(--nc-edge) - 2px + var(--nc-gap)))}
.nc-track{display:flex;gap:var(--nc-gap);padding:16px var(--nc-edge) 40px;scroll-padding-inline:var(--nc-edge);
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.nc-track::-webkit-scrollbar{display:none}
.nc-track.dragging{cursor:grabbing;scroll-snap-type:none}
.nc-track.dragging .nc-card{pointer-events:none}
.nc.is-static .nc-track{overflow:hidden;cursor:default}

/* Karten */
.nc-card{flex:0 0 calc((100% - var(--nc-gap) * (var(--nc-vis) - 1)) / var(--nc-vis));min-width:0;
  scroll-snap-align:start;background:#fff;border-radius:var(--nc-radius);overflow:hidden;
  text-decoration:none!important;color:inherit;display:flex;flex-direction:column;
  -webkit-user-drag:none;user-select:none;
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.06);
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.nc-card:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(0,0,0,.05),0 12px 26px rgba(0,0,0,.10)}
.nc-imgwrap{overflow:hidden;position:relative}
.nc-img{aspect-ratio:var(--nc-ratio,16/9);background:#f5f5f7 center/cover no-repeat;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.nc-card:hover .nc-img{transform:scale(1.04)}
.nc-date{position:absolute;right:14px;top:14px;padding:6px 11px;border-radius:99px;font-size:12px;font-weight:600;
  color:var(--nc-text);background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(14px) saturate(1.6);
  backdrop-filter:blur(14px) saturate(1.6);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.nc-body{padding:18px 22px 20px;display:flex;flex-direction:column;gap:12px;flex:1}
.nc-h{margin:0;font-size:18px;font-weight:600;line-height:1.3;letter-spacing:-.015em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nc-more{margin-top:auto;align-self:flex-start;position:relative;font-size:15px;font-weight:500;color:var(--nc-accent)}
.nc-more::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1.5px;border-radius:2px;
  background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nc-card:hover .nc-more::after{transform:scaleX(1)}

.nc-empty{color:var(--nc-muted);font-size:15px;padding:20px 0}
.nc.is-static .nc-progress{display:none}
@media (max-width:700px){.nc{--nc-vis:1;--nc-gap:16px;--nc-edge:14px}.nc-title{font-size:20px}.nc-seg{width:18px}.nc-seg.on{width:36px}}
@media (prefers-reduced-motion:reduce){.nc-card,.nc-img{transition:none!important}}