/* Nerddi OS Run 49.2 — protected game art + responsive console tile system.
   This file intentionally loads after nerddi-system.css so legacy Run 45/48/adaptive
   sizing can never crop artwork or force cards outside their containers. */

:root{
  --r492-tile-gap:clamp(14px,1.35vw,22px);
  --r492-card-radius:clamp(18px,1.5vw,24px);
  --r492-card-line:rgba(163,226,255,.105);
  --r492-card-bg:linear-gradient(160deg,rgba(10,19,31,.94),rgba(3,8,14,.985));
}

/* Shared protected 16:9 artwork stage. */
.game-art-frame{
  position:relative;
  width:100%;
  max-width:100%;
  min-width:0;
  aspect-ratio:16/9;
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--tile-accent,var(--game-accent,#63f3ff)) 16%,transparent),transparent 42%),
    linear-gradient(145deg,rgba(12,24,36,.88),rgba(4,9,15,.98));
}
.game-art-frame:before{
  content:"";
  position:absolute;
  width:58%;
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--tile-accent,var(--game-accent,#63f3ff)) 20%,transparent);
  box-shadow:0 0 55px color-mix(in srgb,var(--tile-accent,var(--game-accent,#63f3ff)) 10%,transparent);
  opacity:.82;
  z-index:0;
}
.game-art-frame:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.025) 50%,transparent 72%);
  pointer-events:none;
}
.game-art-frame img{
  position:relative;
  z-index:2;
  display:block;
  width:auto!important;
  height:auto!important;
  max-width:78%;
  max-height:76%;
  min-width:0;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.58)) drop-shadow(0 0 24px color-mix(in srgb,var(--tile-accent,var(--game-accent,#63f3ff)) 13%,transparent));
}

/* HOME — true responsive console library, no forced whole-card aspect ratio. */
body[data-os-page="home"] .cc-games-rail[data-run45-game-grid]{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
  gap:var(--r492-tile-gap)!important;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:visible!important;
  padding:4px 0 12px!important;
  scroll-snap-type:none!important;
}
body[data-os-page="home"] .cc-games-rail[data-run45-game-grid] .console-game-card{
  display:flex!important;
  flex-direction:column;
  position:relative;
  width:auto!important;
  max-width:100%;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  padding:0!important;
  overflow:hidden;
  border:1px solid var(--r492-card-line)!important;
  border-radius:var(--r492-card-radius)!important;
  background:var(--r492-card-bg)!important;
  box-shadow:0 16px 38px rgba(0,0,0,.2)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  contain:layout paint;
}
body[data-os-page="home"] .cc-games-rail[data-run45-game-grid] .console-game-card:before{display:none!important;}
body[data-os-page="home"] .console-game-art-frame{border-bottom:1px solid rgba(255,255,255,.055);}
body[data-os-page="home"] .console-game-meta{
  position:relative;
  z-index:2;
  min-width:0;
  padding:clamp(14px,1.3vw,19px) clamp(15px,1.45vw,20px) clamp(16px,1.5vw,21px);
  display:grid;
  gap:5px;
}
body[data-os-page="home"] .console-game-meta small,
body[data-os-page="home"] .console-game-meta b,
body[data-os-page="home"] .console-game-meta span{display:block;min-width:0;margin:0!important;}
body[data-os-page="home"] .console-game-meta small{
  color:var(--tile-accent,#63f3ff)!important;
  font-size:clamp(7px,.62vw,9px)!important;
  line-height:1.2;
  letter-spacing:.14em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body[data-os-page="home"] .console-game-meta b{
  color:#eefaff;
  font-size:clamp(16px,1.25vw,21px)!important;
  line-height:1.08;
  overflow-wrap:anywhere;
}
body[data-os-page="home"] .console-game-meta span{
  color:#6f899a!important;
  font-size:clamp(8px,.7vw,10px)!important;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body[data-os-page="home"] .console-game-card.is-selected,
body[data-os-page="home"] .console-game-card.os-focused,
body[data-os-page="home"] .console-game-card:focus-visible,
body[data-os-page="home"] .console-game-card:hover{
  transform:translateY(-3px)!important;
  border-color:color-mix(in srgb,var(--tile-accent,#63f3ff) 52%,rgba(255,255,255,.14))!important;
  box-shadow:0 20px 48px rgba(0,0,0,.32),inset 0 0 0 1px color-mix(in srgb,var(--tile-accent,#63f3ff) 9%,transparent),0 0 34px color-mix(in srgb,var(--tile-accent,#63f3ff) 8%,transparent)!important;
  outline:none;
}

/* LIBRARY — same art contract, responsive cards instead of fixed two-row horizontal lanes. */
body[data-os-page="library"] .console-page{max-width:1800px;margin:0 auto;min-width:0;}
body[data-os-page="library"] .library-full{
  display:grid!important;
  grid-auto-flow:row!important;
  grid-template-rows:none!important;
  grid-auto-columns:auto!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,390px),1fr));
  gap:var(--r492-tile-gap)!important;
  height:auto!important;
  min-height:0!important;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:visible!important;
  padding:clamp(26px,3vw,42px) 0 24px!important;
  scroll-snap-type:none!important;
}
body[data-os-page="library"] .library-console-card{
  display:flex!important;
  flex-direction:column;
  min-width:0;
  max-width:100%;
  height:auto!important;
  min-height:0!important;
  overflow:hidden;
  border:1px solid var(--r492-card-line)!important;
  border-radius:var(--r492-card-radius)!important;
  background:var(--r492-card-bg)!important;
  box-shadow:0 16px 38px rgba(0,0,0,.2);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body[data-os-page="library"] .library-console-art{
  min-height:0!important;
  border-radius:0!important;
  border-bottom:1px solid rgba(255,255,255,.055);
}
body[data-os-page="library"] .library-console-art>i{display:none;}
body[data-os-page="library"] .library-console-art>span{
  z-index:4;
  left:clamp(11px,1.2vw,16px);
  bottom:clamp(10px,1.1vw,15px);
  max-width:calc(100% - 22px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body[data-os-page="library"] .library-console-copy{
  min-width:0;
  flex:1;
  padding:clamp(19px,2vw,27px)!important;
}
body[data-os-page="library"] .library-console-copy h2{font-size:clamp(24px,2.2vw,34px);overflow-wrap:anywhere;}
body[data-os-page="library"] .library-console-copy p{font-size:clamp(10px,.86vw,13px);}
body[data-os-page="library"] .library-console-copy footer{gap:14px;flex-wrap:wrap;}
body[data-os-page="library"] .library-console-card:hover,
body[data-os-page="library"] .library-console-card.os-focused,
body[data-os-page="library"] .library-console-card:focus-visible{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--tile-accent,#63f3ff) 50%,rgba(255,255,255,.14))!important;
  box-shadow:0 22px 52px rgba(0,0,0,.3),0 0 34px color-mix(in srgb,var(--tile-accent,#63f3ff) 7%,transparent);
  outline:none;
}

/* OPENED GAME — the mode tiles were another clipping source. Let content define height,
   constrain both grid columns, and never force a horizontal strip on desktop. */
body[data-os-page="game"] .game-detail{
  width:min(100%,1680px);
  max-width:100%;
  height:auto!important;
  min-height:calc(100dvh - 64px)!important;
  margin:0 auto;
  overflow:visible!important;
  grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr)!important;
  padding:clamp(28px,4.5vw,68px) max(clamp(18px,4vw,64px),env(safe-area-inset-left)) clamp(42px,6vw,84px)!important;
  gap:clamp(28px,4vw,64px)!important;
}
body[data-os-page="game"] .detail-art{min-width:0;max-width:100%;}
body[data-os-page="game"] .detail-art img{object-fit:contain;max-width:72%;}
body[data-os-page="game"] .detail-copy{min-width:0;max-width:100%;max-height:none!important;overflow:visible!important;}
body[data-os-page="game"] .mode-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
  align-items:stretch;
  width:100%;
  max-width:100%;
  min-width:0;
  gap:clamp(10px,1vw,14px)!important;
  overflow:visible!important;
  padding:6px 0 10px!important;
}
body[data-os-page="game"] .mode-card{
  min-width:0;
  max-width:100%;
  width:100%;
  height:auto!important;
  min-height:clamp(148px,14vw,182px)!important;
  padding:clamp(17px,1.5vw,22px)!important;
  overflow:hidden;
  overflow-wrap:anywhere;
  transform:none!important;
}
body[data-os-page="game"] .mode-card small,
body[data-os-page="game"] .mode-card b,
body[data-os-page="game"] .mode-card span{max-width:100%;min-width:0;overflow-wrap:anywhere;}
body[data-os-page="game"] .mode-card span{display:block;overflow:visible;-webkit-line-clamp:unset;}
body[data-os-page="game"] .mode-card:hover,
body[data-os-page="game"] .mode-card.os-focused,
body[data-os-page="game"] .mode-card:focus-visible{
  transform:translateY(-3px)!important;
  outline:none;
  border-color:color-mix(in srgb,var(--game-accent,#63f3ff) 54%,#234157);
  box-shadow:0 16px 38px rgba(0,0,0,.26),0 0 28px color-mix(in srgb,var(--game-accent,#63f3ff) 7%,transparent);
}
body[data-os-page="game"] .detail-meta{min-width:0;max-width:100%;}
body[data-os-page="game"] .detail-meta>div{min-width:0;}
body[data-os-page="game"] .detail-meta b{overflow-wrap:anywhere;}

@media(max-width:980px){
  body[data-os-page="game"] .game-detail{
    grid-template-columns:1fr!important;
    align-items:start!important;
  }
  body[data-os-page="game"] .detail-art{
    width:min(100%,640px);
    justify-self:center;
    height:clamp(230px,46vw,360px)!important;
    aspect-ratio:16/9;
  }
  body[data-os-page="game"] .detail-art img{max-height:70%!important;}
}

@media(max-width:760px){
  body[data-os-page="home"] .cc-games-rail[data-run45-game-grid]{
    display:flex!important;
    gap:12px!important;
    width:calc(100% + 14px);
    max-width:none;
    overflow-x:auto!important;
    overflow-y:visible!important;
    padding:4px 14px 16px 2px!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:2px;
    scrollbar-width:none;
  }
  body[data-os-page="home"] .cc-games-rail[data-run45-game-grid]::-webkit-scrollbar{display:none;}
  body[data-os-page="home"] .cc-games-rail[data-run45-game-grid] .console-game-card{
    flex:0 0 min(78vw,292px);
    width:min(78vw,292px)!important;
    max-width:min(78vw,292px);
    scroll-snap-align:start;
  }
  body[data-os-page="home"] .game-art-frame img{max-width:74%;max-height:72%;}

  body[data-os-page="library"] .console-page{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right));}
  body[data-os-page="library"] .library-full{grid-template-columns:1fr!important;padding-top:22px!important;}
  body[data-os-page="library"] .library-console-copy{padding:18px!important;}

  body[data-os-page="game"] .game-detail{
    width:100%;
    padding:18px max(14px,env(safe-area-inset-left)) 48px!important;
    gap:20px!important;
  }
  body[data-os-page="game"] .detail-art{height:clamp(190px,56vw,280px)!important;opacity:1!important;}
  body[data-os-page="game"] .detail-art img{max-width:58%;max-height:68%!important;}
  body[data-os-page="game"] .detail-copy h1{font-size:clamp(38px,13vw,58px)!important;overflow-wrap:anywhere;}
  body[data-os-page="game"] .detail-copy .lead{-webkit-line-clamp:unset!important;display:block!important;overflow:visible!important;}
  body[data-os-page="game"] .mode-grid{grid-template-columns:1fr!important;}
  body[data-os-page="game"] .mode-card{min-height:0!important;padding:18px!important;}
  body[data-os-page="game"] .detail-meta{grid-template-columns:1fr!important;gap:10px;}
}

@media(prefers-reduced-motion:reduce){
  body[data-os-page="home"] .console-game-card,
  body[data-os-page="library"] .library-console-card,
  body[data-os-page="game"] .mode-card{transition:none!important;}
}