/* HAMBURG.GAMES // compact editorial depth deck V14 */
.hg-portal-feed {
  grid-template-columns: minmax(0, 1fr);
}

.hg-portal-feed-list[data-depth-ready="true"] + .hg-portal-feed-note {
  min-height: 74px;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  padding: 18px clamp(20px,4vw,42px);
}

.hg-portal-feed-list[data-depth-ready="true"] + .hg-portal-feed-note a { margin-top: 0; }

.hg-portal-feed-list[data-depth-ready="true"] {
  position: relative;
  min-width: 0;
  display: block;
  overflow: hidden;
  background: #080a0e;
  isolation: isolate;
}

.hg-feed-depth-stage {
  --hg-feed-card-w: min(74%, 720px);
  position: relative;
  min-width: 0;
  min-height: clamp(410px, 49vw, 570px);
  overflow: hidden;
  outline: none;
  perspective: 1250px;
  perspective-origin: 50% 44%;
  touch-action: pan-y;
  background:
    radial-gradient(circle at 50% 36%, rgba(255,255,255,.11), transparent 29%),
    linear-gradient(140deg, #16191f 0%, #07090c 42%, #16060a 100%);
}

.hg-feed-depth-stage:focus-visible { box-shadow: inset 0 0 0 2px #fff; }
.hg-feed-depth-rail { position: absolute; inset: 0 0 64px; transform-style: preserve-3d; }

.hg-feed-depth-card {
  position: absolute;
  top: clamp(18px, 3vw, 38px);
  left: calc(50% - var(--hg-feed-card-w) / 2);
  width: var(--hg-feed-card-w);
  height: calc(100% - clamp(34px, 6vw, 70px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 1fr);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 3px;
  background: #f4f0e9;
  color: #101116;
  box-shadow: 0 28px 90px rgba(0,0,0,.52);
  transform-origin: 50% 68%;
  transition: transform .72s cubic-bezier(.2,.82,.14,1), opacity .5s ease, filter .5s ease;
  will-change: transform, opacity;
}

.hg-feed-depth-card[data-depth-slot="0"] { z-index: 5; opacity: 1; transform: translate3d(0,0,40px) rotateY(0) scale(1); filter: none; }
.hg-feed-depth-card[data-depth-slot="-1"] { z-index: 3; opacity: .54; transform: translate3d(-64%,12px,-150px) rotateY(15deg) scale(.86); filter: saturate(.55) brightness(.62); cursor: pointer; }
.hg-feed-depth-card[data-depth-slot="1"] { z-index: 3; opacity: .54; transform: translate3d(64%,12px,-150px) rotateY(-15deg) scale(.86); filter: saturate(.55) brightness(.62); cursor: pointer; }
.hg-feed-depth-card[data-depth-slot="-2"] { z-index: 2; opacity: .14; transform: translate3d(-105%,26px,-300px) rotateY(21deg) scale(.73); filter: grayscale(.6) brightness(.38); }
.hg-feed-depth-card[data-depth-slot="2"] { z-index: 2; opacity: .14; transform: translate3d(105%,26px,-300px) rotateY(-21deg) scale(.73); filter: grayscale(.6) brightness(.38); }
.hg-feed-depth-card[data-depth-slot="hidden"] { z-index: 0; opacity: 0; pointer-events: none; transform: translate3d(0,40px,-520px) scale(.58); }

.hg-feed-depth-media { position: relative; min-width: 0; overflow: hidden; background: linear-gradient(150deg,#df001f,#890014 56%,#14161c); }
.hg-feed-depth-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,transparent 50%,rgba(8,9,12,.52)); }
.hg-feed-depth-media[data-image-state="unavailable"]::before { content: "HH // SIGNAL"; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.84); font-size: clamp(18px,3vw,38px); font-weight: 950; letter-spacing: -.05em; transform: rotate(-8deg); }
.hg-feed-depth-image { width: 100%; height: 100%; display: block; object-fit: cover; transform: scale(1.015); transition: transform 6s cubic-bezier(.18,.7,.1,1); }
.hg-feed-depth-card[data-depth-slot="0"] .hg-feed-depth-image { transform: scale(1.08); }
.hg-feed-depth-signal { position: absolute; z-index: 2; top: 14px; left: 14px; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; background: rgba(6,8,12,.5); color: #fff; font-size: 9px; font-weight: 950; backdrop-filter: blur(12px); }

.hg-feed-depth-body { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: clamp(20px,3.1vw,42px); }
.hg-feed-depth-meta { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.hg-feed-depth-category { padding: 6px 8px; background: #db001f; color: #fff; font-size: 8px; font-weight: 950; letter-spacing: .1em; }
.hg-feed-depth-date { color: #5f626a; font-size: 8px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.hg-feed-depth-title { margin: clamp(18px,2.4vw,30px) 0 12px; color: #0d0f13; font-size: clamp(24px,3vw,42px); font-weight: 950; letter-spacing: -.055em; line-height: .94; overflow-wrap: normal; hyphens: auto; }
.hg-feed-depth-venue { margin: 0 0 13px; color: #a80019; font-size: 9px; font-weight: 950; letter-spacing: .04em; text-transform: uppercase; }
.hg-feed-depth-summary { display: -webkit-box; margin: 0; overflow: hidden; color: #42454d; font-size: 10px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.hg-feed-depth-summary[hidden] { display: none; }
.hg-feed-depth-source { align-self: flex-start; max-width: 100%; margin-top: clamp(18px,2.6vw,30px); overflow: hidden; color: #111319; font-size: 8px; font-weight: 950; letter-spacing: .07em; text-decoration-thickness: 1px; text-underline-offset: 5px; text-overflow: ellipsis; white-space: nowrap; }
.hg-feed-depth-source:focus-visible { outline: 2px solid #db001f; outline-offset: 5px; }

.hg-feed-depth-controls { position: absolute; z-index: 9; right: clamp(14px,3vw,34px); bottom: 15px; left: clamp(14px,3vw,34px); height: 42px; display: grid; grid-template-columns: 42px minmax(70px,1fr) auto 42px; align-items: center; gap: 12px; }
.hg-feed-depth-arrow { width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(255,255,255,.08); color: #fff; font-size: 18px; cursor: pointer; backdrop-filter: blur(12px); transition: background .2s ease, transform .2s ease; }
.hg-feed-depth-arrow:hover { background: #db001f; transform: scale(1.05); }
.hg-feed-depth-arrow:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.hg-feed-depth-progress { height: 1px; overflow: hidden; background: rgba(255,255,255,.2); }
.hg-feed-depth-progress i { display: block; width: var(--hg-feed-progress, 10%); height: 100%; background: #fff; transition: width .55s ease; }
.hg-feed-depth-counter { min-width: 48px; color: #fff; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-align: center; }

@media (max-width: 760px) {
  .hg-feed-depth-stage { --hg-feed-card-w: calc(100% - 38px); min-height: 520px; }
  .hg-feed-depth-rail { bottom: 60px; }
  .hg-feed-depth-card { top: 14px; height: calc(100% - 24px); grid-template-columns: 1fr; grid-template-rows: minmax(205px,1.04fr) minmax(0,.96fr); }
  .hg-feed-depth-card[data-depth-slot="-1"] { transform: translate3d(-94%,5px,-150px) rotateY(10deg) scale(.92); opacity: .25; }
  .hg-feed-depth-card[data-depth-slot="1"] { transform: translate3d(94%,5px,-150px) rotateY(-10deg) scale(.92); opacity: .25; }
  .hg-feed-depth-card[data-depth-slot="-2"], .hg-feed-depth-card[data-depth-slot="2"] { opacity: 0; pointer-events: none; }
  .hg-feed-depth-body { justify-content: flex-start; padding: 19px 20px 22px; }
  .hg-feed-depth-title { margin: 14px 0 8px; font-size: clamp(26px,9vw,39px); }
  .hg-feed-depth-summary { -webkit-line-clamp: 2; }
  .hg-feed-depth-source { margin-top: auto; padding-top: 12px; }
  .hg-feed-depth-controls { right: 11px; bottom: 9px; left: 11px; grid-template-columns: 42px 1fr auto 42px; gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .hg-feed-depth-card, .hg-feed-depth-image, .hg-feed-depth-progress i, .hg-feed-depth-arrow { transition: none !important; }
}