/* PEGNIO desktop gaming directory; does not change phone or small-tablet UI. */
#peg-desktop-feed{display:none}
@media(min-width:900px){
  :root{--peg-desk-sidebar:76px}
  html,body{background:#101117!important}
  .brod-head{height:66px!important;min-height:66px!important;padding:0 24px!important;background:#171820!important;border-color:#31313c!important}
  .brod-logo{width:172px!important;font-size:26px!important;letter-spacing:-1.5px!important}
  .brod-sidebar{
    display:flex!important;flex-direction:column!important;align-items:center!important;
    position:fixed!important;left:0!important;top:66px!important;bottom:0!important;
    width:var(--peg-desk-sidebar)!important;padding:13px 6px!important;
    background:#191a24!important;border-right:1px solid #30323f!important;
    overflow-y:auto!important;scrollbar-width:none!important;z-index:40!important;
  }
  .brod-sidebar::-webkit-scrollbar{display:none}
  .brod-sidebar .side-nav{display:flex!important;flex-direction:column!important;align-items:center!important;gap:8px!important;width:100%!important}
  .brod-sidebar .side-link{
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;gap:2px!important;
    width:54px!important;min-width:54px!important;height:51px!important;
    margin:0!important;padding:5px 1px!important;
    font-size:0!important;text-align:center!important;
    border-radius:12px!important;line-height:0!important;
  }
  .brod-sidebar .side-ico{font-size:23px!important;line-height:1!important;margin:0!important}
  .brod-sidebar .side-divider,.brod-sidebar .side-heading,
  .brod-sidebar .side-blurb,.brod-sidebar .side-note,
  .brod-sidebar .side-cta,.brod-sidebar .peg-v2-navgroup,
  .brod-sidebar .peg-v2-navlabel{display:none!important}
  .main-brod{margin-left:var(--peg-desk-sidebar)!important;padding:19px 24px 24px!important;background:#101117!important}
  .page-body{max-width:none!important;margin:0!important;width:100%!important}
  .new-home{width:100%!important}
  .new-home #peg-live-feed{display:none!important}
  .new-home>.peg-v2-tabs{display:none!important}
  #peg-desktop-feed{
    display:block!important;width:100%!important;max-width:1850px;
    margin:0 auto!important;padding:0 0 28px!important;
    color:#f4f4f8;
  }
  .peg-desk-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:1px 0 20px}
  .peg-desk-page-title{font:850 clamp(21px,2vw,27px)/1.2 system-ui!important;letter-spacing:-.5px;color:#faf9ff;margin:0!important}
  .peg-desk-page-sub{font:500 12px system-ui;color:#9597ac;margin:6px 0 0!important}
  .peg-desk-total{white-space:nowrap;font:750 12px system-ui;color:#c7b5ef;background:#282339;padding:8px 11px;border-radius:8px}
  .peg-desk-section{position:relative;display:block;width:100%;margin:0 0 25px}
  .peg-desk-rowheading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 11px}
  .peg-desk-rowheading h2{display:flex;align-items:baseline;gap:10px;font:850 19px/1.25 system-ui!important;letter-spacing:-.35px;color:#f8f8fc;margin:0!important}
  .peg-desk-rowheading h2 small{font:550 11px system-ui!important;letter-spacing:0;color:#9697a9}
  .peg-desk-rowbuttons{display:flex;gap:7px;align-items:center}
  .peg-desk-arrow{
    display:grid;place-items:center;cursor:pointer;
    width:34px;height:34px;min-width:34px;margin:0;padding:0;
    border:1px solid #383849;border-radius:50%;
    background:#242530;color:#f6f2ff;
    font:400 25px/1 system-ui;
    box-shadow:none;transition:background .14s,border-color .14s;
  }
  .peg-desk-arrow:hover:not(:disabled){background:#47345e;border-color:#9978d0}
  .peg-desk-arrow:disabled{opacity:.35;cursor:default}
  .peg-desk-track{
    display:flex;gap:11px;align-items:stretch;
    width:100%;padding:1px 1px 5px!important;box-sizing:border-box;
    height:139px;overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x proximity;overscroll-behavior-inline:contain;
    scrollbar-width:none;scroll-behavior:smooth;
  }
  .peg-desk-track::-webkit-scrollbar{display:none}
  .peg-desk-game{
    position:relative;display:block;flex:0 0 clamp(164px,13.4vw,199px)!important;
    height:125px;min-height:125px;max-height:125px;
    margin:0;padding:0;border:0;min-width:0;
    border-radius:12px;background:#282735;
    overflow:hidden;cursor:pointer;scroll-snap-align:start;
    box-shadow:inset 0 0 0 1px #ffffff12;
  }
  .peg-desk-game-large{flex-basis:295px!important}
  .peg-desk-game img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .2s}
  .peg-desk-game:hover img{transform:scale(1.045)}
  .peg-desk-game:hover{box-shadow:0 0 0 2px #b49aec}
  .peg-desk-game:focus-visible,.peg-desk-arrow:focus-visible{outline:3px solid #bc9cff;outline-offset:3px}
  .peg-desk-section:first-of-type .peg-desk-track{height:242px}
  .peg-desk-section:first-of-type .peg-desk-game{height:116px;max-height:none;min-height:0}
  .peg-desk-featured .peg-desk-track{
    display:grid!important;grid-auto-flow:column;grid-auto-columns:clamp(155px,13.2vw,183px);
    grid-template-rows:116px 116px;gap:10px;align-items:stretch;
    height:247px!important;
  }
  .peg-desk-featured .peg-desk-game{
    width:100%!important;min-width:0!important;height:100%!important;
    max-height:none!important;min-height:0!important;flex-basis:auto!important;
  }
  .peg-desk-featured .peg-desk-game-large{
    grid-column:span 2;grid-row:span 2;height:100%!important;width:100%!important;
  }
  .peg-desk-empty{padding:20px 0;color:#a6a6ba}
  .site-caution{font-size:10px!important;opacity:.6}
}
@media(min-width:900px) and (max-width:1199px){
 .main-brod{padding:17px 17px 20px!important}
 .peg-desk-game{flex-basis:165px!important}
 .peg-desk-game-large{flex-basis:275px!important}
 .peg-desk-featured .peg-desk-track{grid-auto-columns:160px}
}
@media(min-width:900px) and (max-height:720px){
 .peg-desk-section{margin-bottom:18px}
 .peg-desk-intro{margin-bottom:14px}
}
/* Desktop v3: compact hi-res game cards, overlaid carousel arrows, expandable menu. */
@media(min-width:900px){
  :root{
    --peg-desk-tile-w:clamp(180px,15.2vw,270px);
    --peg-desk-tile-h:clamp(102px,8.55vw,152px);
    --peg-desk-gap:10px;
  }
  .brod-head{gap:13px!important;padding:0 17px!important}
  .peg-desktop-menu-toggle{
    display:grid!important;place-items:center!important;flex:0 0 40px!important;
    width:40px!important;height:44px!important;min-width:40px!important;
    padding:6px!important;margin:0!important;background:transparent!important;
    border:0!important;border-radius:8px!important;cursor:pointer;color:#f4f4fa;
  }
  .peg-desktop-menu-toggle:hover,.peg-desktop-menu-toggle[aria-expanded="true"]{background:#2a2836!important}
  .peg-menu-lines{width:23px;display:flex;flex-direction:column;gap:5px}
  .peg-menu-lines i{display:block;width:100%;height:3px;border-radius:6px;background:#f8f7ff}
  .peg-menu-lines i:nth-child(2){width:17px}
  .brod-logo{width:155px!important;min-width:130px!important}
  .brod-sidebar{transition:width .18s ease,box-shadow .18s ease}
  .peg-desktop-extra-cats{display:none!important}
  .peg-desktop-sidebar-scrim{display:none}
  body.peg-menu-open .brod-sidebar{
    z-index:92!important;width:252px!important;align-items:stretch!important;
    padding:12px 12px 20px!important;overflow-y:auto!important;
    background:#11121b!important;border-right:1px solid #383849!important;
    box-shadow:9px 0 28px #0008!important;
    scrollbar-width:thin!important;
  }
  body.peg-menu-open .brod-sidebar .side-nav{
    align-items:stretch!important;gap:4px!important;width:100%!important;
  }
  body.peg-menu-open .brod-sidebar .side-link{
    flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
    gap:15px!important;
    width:100%!important;min-width:0!important;height:44px!important;
    padding:8px 13px!important;
    border-radius:10px!important;font:750 13px/1.4 system-ui!important;
    white-space:nowrap!important;line-height:1.4!important;
    text-align:left!important;
  }
  body.peg-menu-open .brod-sidebar .side-ico{
    flex:0 0 25px!important;font-size:23px!important;line-height:1.2!important;
    text-align:center!important;
  }
  body.peg-menu-open .brod-sidebar .peg-desktop-extra-cats{
    display:flex!important;flex-direction:column;gap:2px;
    margin-top:13px;padding-top:10px;
    border-top:1px solid #30313e;
  }
  .peg-desktop-catlabel{font:800 10px/1.4 system-ui;color:#aaa2bc;letter-spacing:1.1px;padding:9px 13px}
  .peg-desktop-catlink{
    display:block;text-align:left;background:transparent;border:0;border-radius:9px;
    color:#d4d2e1;padding:9px 14px;font:700 13px/1.4 system-ui;cursor:pointer;
  }
  .peg-desktop-catlink:hover,.peg-desktop-catlink:focus-visible{background:#343048;color:white}
  body.peg-menu-open .peg-desktop-sidebar-scrim{
    display:block!important;position:fixed;inset:66px 0 0 0;z-index:80!important;
    width:100vw;height:calc(100dvh - 66px);border:0;background:#07070f30;cursor:default;
  }
  .peg-desk-section{margin-bottom:23px!important}
  .peg-desk-rowheading{min-height:31px!important;margin-bottom:7px!important}
  .peg-desk-rowheading h2{font-size:20px!important;font-weight:900!important}
  .peg-desk-viewport{position:relative!important;width:100%;isolation:isolate}
  .peg-desk-rowbuttons{
    position:absolute!important;inset:0!important;z-index:5!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    pointer-events:none!important;padding:0 10px!important;
  }
  .peg-desk-arrow{
    display:grid!important;place-items:center!important;
    flex:0 0 55px!important;width:55px!important;height:55px!important;
    background:#0d0c14ed!important;color:#fff!important;
    border:2px solid #ffffffb5!important;border-radius:50%!important;
    box-shadow:0 5px 17px #000b!important;
    font:500 37px/1 system-ui!important;
    cursor:pointer!important;pointer-events:auto!important;
    transition:background .14s,transform .14s!important;
  }
  .peg-desk-arrow:not(:disabled):hover{background:#332747!important;transform:scale(1.08)}
  .peg-desk-arrow:disabled{opacity:0!important;pointer-events:none!important}
  .peg-desk-track{
    display:flex!important;gap:var(--peg-desk-gap)!important;
    height:calc(var(--peg-desk-tile-h) + 6px)!important;
    scroll-padding-left:4px!important;scroll-padding-right:4px!important;
    overflow-x:auto!important;overflow-y:hidden!important;
  }
  .peg-desk-game,
  .peg-desk-section:first-of-type .peg-desk-game{
    flex:0 0 var(--peg-desk-tile-w)!important;
    width:var(--peg-desk-tile-w)!important;
    min-width:var(--peg-desk-tile-w)!important;
    height:var(--peg-desk-tile-h)!important;
    min-height:var(--peg-desk-tile-h)!important;
    max-height:var(--peg-desk-tile-h)!important;
    border-radius:13px!important;
    background:#1f2030!important;box-shadow:none!important;
  }
  .peg-desk-game-large{flex-basis:var(--peg-desk-tile-w)!important}
  .peg-desk-game img{
    display:block!important;
    width:100%!important;height:100%!important;
    object-fit:cover!important;image-rendering:auto!important;
    filter:saturate(1.18) contrast(1.09) brightness(1.035);
    transform:translateZ(0);transition:filter .16s,transform .16s!important;
  }
  .peg-desk-game:hover img{
    filter:saturate(1.24) contrast(1.10) brightness(1.08);
    transform:scale(1.045)!important;
  }
  .peg-desk-featured .peg-desk-track,
  .peg-desk-section:first-of-type.peg-desk-featured .peg-desk-track{
    display:grid!important;
    grid-auto-flow:column!important;
    grid-auto-columns:var(--peg-desk-tile-w)!important;
    grid-template-rows:repeat(2,var(--peg-desk-tile-h))!important;
    gap:var(--peg-desk-gap)!important;
    height:calc(2 * var(--peg-desk-tile-h) + var(--peg-desk-gap) + 5px)!important;
    align-items:stretch!important;
  }
  .peg-desk-featured .peg-desk-game,
  .peg-desk-section:first-of-type.peg-desk-featured .peg-desk-game{
    width:100%!important;min-width:0!important;
    height:100%!important;min-height:0!important;max-height:none!important;
    flex-basis:auto!important;
  }
  .peg-desk-featured .peg-desk-game-large,
  .peg-desk-section:first-of-type.peg-desk-featured .peg-desk-game-large{
    grid-column:span 2!important;grid-row:span 2!important;
    width:100%!important;height:100%!important;
  }
}