/* v177: Lesbare Nebeninformationen, klare Spielansichten und ruhige Hardware.
   Schwarz bleibt Schwarz; Tiefe entsteht durch Abstand und feine Konturen. */
body.echo-kosmos #player :is(.pstate,.plist-kopf>span,.studio-kopf-titel){
  font-size:11px;line-height:1.45;letter-spacing:.075em;
}
body.echo-kosmos #player :is(.studio-fade-state,.studio-fade-state>i){font-size:11px}
body.echo-kosmos #aboutCard :is(.dat-k,.dat-v>small,.zit-kick){
  font-size:11px;line-height:1.5;letter-spacing:.08em;color:#bfc5ce;
}
body.echo-kosmos #aboutCard :is(.dat-sub,.bro-meta .bt){font-size:11px;line-height:1.5}
body.echo-kosmos #card .gta-feld>i{font-size:11px;letter-spacing:.09em}
body.echo-kosmos #gamesCard :is(.gallery-eyebrow,.area-marker>em,.career-grid small,.gm-summary-copy>small){
  font-size:11px;line-height:1.5;letter-spacing:.08em;color:#bfc5ce;
}
body.echo-kosmos #setupCard :is(.setup-chapter>span,.setup-label,.setup-rig-label>small,
  .hardware-product-category,.hardware-product-maker,.hardware-product-extra){
  font-size:11px;line-height:1.5;letter-spacing:.06em;color:#bfc5ce;
}
body.echo-kosmos #setupCard .setup-screen-readout small{font-size:11px}
body.echo-kosmos #setupCard .hardware-product .hardware-product-action{
  font-size:12px;line-height:1.4;letter-spacing:.015em;text-transform:none;color:#e0e4eb;
}
/* Auch ohne 3D-Modul bleibt genau eine sichtbare Oeffnen-Aktion. */
body.echo-kosmos #setupCard .hardware-visual::after{content:none!important}
body.echo-kosmos #setupCard .hardware-visual>.hardware-preview-badge{
  font-size:11px;letter-spacing:.04em;
}
body.echo-kosmos #setupCard .hardware-panel:not(.hardware-product) .hardware-product-action{
  position:absolute;inset:auto 8px 7px;display:block;text-align:right;
  color:#dce2eb;font:600 12px/1.5 'Rajdhani',sans-serif;
}

/* Ein gemeinsamer Dialog, eine bewusst andere Hierarchie fuer Spiele. */
body.echo-kosmos #detailGallery{
  background:rgba(0,0,0,.84);backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body.echo-kosmos #detailGallery .detail-close{
  background:#080a0d;border-color:#414851;color:#f4f6fa;
}
body.echo-kosmos #detailGallery :is(.gallery-eyebrow,.detail-source,.achievement-detail small){
  color:#bfc5ce;font-size:12px;line-height:1.55;
}
body.echo-kosmos #detailGallery.detail-game .detail-window{
  width:min(1000px,100%);padding:34px;background:#030405;
  border:1px solid #444a53;border-radius:26px;
  box-shadow:0 28px 90px #0009,inset 0 1px 0 #ffffff0a;
}
body.echo-kosmos #detailGallery.detail-game .detail-heading{margin:3px 55px 30px 0}
body.echo-kosmos #detailGallery.detail-game .detail-heading .gallery-eyebrow{
  text-transform:none;letter-spacing:.06em;
}
body.echo-kosmos #detailGallery.detail-game .detail-heading h2{
  color:#f2f5fa;font-size:clamp(30px,3.6vw,48px);line-height:1.06;
  letter-spacing:-.025em;margin:9px 0 0;text-wrap:balance;overflow-wrap:anywhere;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-layout{
  grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);gap:34px;align-items:start;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-cover{
  margin:0;min-width:0;overflow:hidden;border-radius:18px;background:#080a0d;
  border:1px solid #ffffff1d;aspect-ratio:2/3;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-art{
  display:block;width:100%;height:100%;max-height:none;border-radius:0;
  object-fit:contain;background:#080a0d;border:0;box-shadow:none;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-cover.art-unavailable{
  display:grid;place-items:center;min-height:240px;aspect-ratio:auto;padding:20px;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-art[hidden]{display:none}
body.echo-kosmos #detailGallery.detail-game .game-detail-fallback{
  color:#bfc5ce;font:500 14px/1.5 'Rajdhani',sans-serif;text-align:center;
}
body.echo-kosmos #detailGallery.detail-game .game-detail-record{min-width:0;padding-top:2px}
body.echo-kosmos #detailGallery.detail-game .detail-stats{
  margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 20px;
}
body.echo-kosmos #detailGallery.detail-game .detail-stats>div{min-width:0}
body.echo-kosmos #detailGallery.detail-game .detail-stats dt{
  font:500 12px/1.45 'Rajdhani',sans-serif;color:#bfc5ce;
}
body.echo-kosmos #detailGallery.detail-game .detail-stats dd{
  margin:6px 0 0;font:600 clamp(21px,2.4vw,29px)/1.2 'Rajdhani',sans-serif;
  letter-spacing:-.02em;color:#edf1f7;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;
}
body.echo-kosmos #detailGallery.detail-game .detail-stat-primary{
  grid-column:1/-1;padding-bottom:21px;border-bottom:1px solid #ffffff1b;
}
body.echo-kosmos #detailGallery.detail-game .detail-stat-primary dd{
  font-size:clamp(34px,4.5vw,58px);line-height:1.06;letter-spacing:-.04em;
}
body.echo-kosmos #detailGallery.detail-game .detail-stats>div:nth-child(2):last-child{grid-column:1/-1}
body.echo-kosmos #detailGallery.detail-game .achievement-detail{margin-top:26px;padding-top:23px}
body.echo-kosmos #detailGallery.detail-game .achievement-detail-heading{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;margin-bottom:14px;
}
body.echo-kosmos #detailGallery.detail-game .achievement-detail-heading>span{font-size:12px;color:#bfc5ce}
body.echo-kosmos #detailGallery.detail-game .achievement-detail b{margin:0;color:#f0f3f8;font-size:27px}
body.echo-kosmos #detailGallery.detail-game .achievement-detail b>span{font-size:17px;color:#aeb7c4}
body.echo-kosmos #detailGallery.detail-game .achievement-detail progress{height:7px;accent-color:#c9d2de}
body.echo-kosmos #detailGallery.detail-game .detail-links{gap:10px;margin-top:27px}
body.echo-kosmos #detailGallery.detail-game .detail-links a{
  min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;gap:18px;
  padding:11px 16px;border-radius:12px;border-color:#424a55;background:#0b0e12;
  font-size:13px;line-height:1.4;color:#e8edf5;
}
body.echo-kosmos #detailGallery.detail-game .detail-links .detail-link-primary{
  background:#e5eaf2;color:#080b10;border-color:#e5eaf2;font-weight:700;
}
body.echo-kosmos #detailGallery.detail-game .detail-source{
  margin:16px 0 0;max-width:48ch;color:#adb7c5;
}
body.echo-kosmos #detailGallery :is(button,a):focus-visible{outline:2px solid #eef3ff;outline-offset:3px}
@media (hover:hover) and (pointer:fine){
  body.echo-kosmos #detailGallery .detail-close:hover{background:#1b2028;border-color:#8491a4}
  body.echo-kosmos #detailGallery.detail-game .detail-links a:hover{border-color:#a5b3c7}
  body.echo-kosmos #detailGallery.detail-game .detail-link-primary:hover{background:#fff}
}
/* Kurze, einmalige Bewegungen; keinerlei Weichzeichnung oder Dauerschleife. */
@media (prefers-reduced-motion:no-preference){
  body.echo-kosmos #detailGallery.detail-game:not([hidden]) .game-detail-cover{
    animation:spielCoverEin 320ms cubic-bezier(.2,.7,.2,1) both;
  }
  body.echo-kosmos #detailGallery.detail-game:not([hidden]) .game-detail-record{
    animation:spielDatenEin 300ms 45ms cubic-bezier(.2,.7,.2,1) both;
  }
}
@keyframes spielCoverEin{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}
@keyframes spielDatenEin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:700px){
  body.echo-kosmos #detailGallery.detail-game .detail-window{padding:25px 21px;border-radius:22px}
  body.echo-kosmos #detailGallery.detail-game .detail-heading{margin-bottom:24px}
  body.echo-kosmos #detailGallery.detail-game .game-detail-layout{gap:22px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  body.echo-kosmos #detailGallery.detail-game .detail-stats{gap:18px 12px}
}
@media (max-width:520px){
  body.echo-kosmos #detailGallery.detail-game .game-detail-layout{grid-template-columns:1fr}
  body.echo-kosmos #detailGallery.detail-game .game-detail-cover{width:min(230px,75%);justify-self:center}
  body.echo-kosmos #detailGallery.detail-game .detail-heading h2{font-size:30px}
  body.echo-kosmos #detailGallery.detail-game .detail-stats dd{font-size:24px}
  body.echo-kosmos #detailGallery.detail-game .detail-stat-primary dd{font-size:40px}
  body.echo-kosmos #player .pstate{font-size:11px;letter-spacing:.035em}
}
@media (prefers-reduced-motion:reduce){
  body.echo-kosmos #detailGallery.detail-game :is(.game-detail-cover,.game-detail-record){animation:none;transform:none}
}