/* An image-led game shelf. The player keeps its dark, distraction-free chrome. */
body:is([data-page=home],[data-page=library]){background:#eeefeb;color:#202625;--line:#d1d6d0;--muted:#606b66;--accent:#165b48;--max:1560px}
html:has(body[data-page=home]),html:has(body[data-page=library]){color-scheme:light;scrollbar-width:thin;scrollbar-color:#a6b19f #eeefeb}
body:is([data-page=home],[data-page=library]) .site-header{color:#f2f5ef;background:#1b2525;border-color:#35413d}
body:is([data-page=home],[data-page=library]) .brand-accent{color:#b99a62}
.brand .brand-accent{color:#b99a62}
body:is([data-page=home],[data-page=library]) .top-links a:hover{color:#d9e8b7}
body:is([data-page=home],[data-page=library]) .hub-search{background:#293532;border-color:#53615b;border-radius:4px}
body:is([data-page=home],[data-page=library]) .hub-search input{color:#fff}
body:is([data-page=home],[data-page=library]) .hub-search input::placeholder,body:is([data-page=home],[data-page=library]) .saved-link{color:#bec9c2}
body:is([data-page=home],[data-page=library]) main{padding:32px 36px 0;max-width:1560px}
.shelf-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px;border-bottom:1px solid #cbd1ca;padding-bottom:25px}
.shelf-eyebrow{font:10px/1.4 'Courier New',monospace;letter-spacing:2px;color:#5b6d62;margin:0 0 9px}
.shelf-heading h1{font-size:38px;line-height:1.05;letter-spacing:-1.5px;margin:0;font-weight:750}
.heading-period{color:#33775b}
.shelf-intro{font-size:12px;line-height:1.7;color:#627168;margin:0;max-width:40ch}
.shelf-layout{display:grid;grid-template-columns:172px minmax(0,1fr);gap:32px;align-items:start}
.shelf-nav{position:sticky;top:25px;min-width:0}
.shelf-nav-label{font:10px/1.4 'Courier New',monospace;letter-spacing:1.6px;color:#68776e;margin:4px 0 14px;padding-left:10px}
.shelf-nav nav{display:grid;gap:5px}
.shelf-nav nav,.shelf-content .genre-tabs{scrollbar-width:none}
.shelf-nav nav::-webkit-scrollbar,.shelf-content .genre-tabs::-webkit-scrollbar{display:none}
.shelf-nav nav a{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:43px;padding:9px 10px;border-radius:4px;font-size:12px;line-height:1.4}
.shelf-nav nav a>span:last-child{font:10px 'Courier New',monospace;color:#7c8a80}
.shelf-nav nav a:hover{background:#e0e5dc}
.shelf-nav nav a[aria-current]{background:#1c5a47;color:white}
.shelf-nav nav a[aria-current]>span:last-child{color:#d2e8d0}
.shelf-help{border-top:1px solid #cbd1ca;margin-top:26px;padding:22px 10px 0;color:#68766c;font-size:11px;line-height:1.8}
.shelf-help strong{display:block;color:#2f4136;font-size:11px;line-height:1.5;margin:9px 0}
.shelf-help p{margin:7px 0 17px}
.shelf-help a{font-size:10px;text-decoration:underline;text-underline-offset:4px}
.status-dot{display:block;width:7px;height:7px;background:#46895d;border-radius:50%}
.shelf-content{min-width:0}
.shelf-recommendation{margin-top:36px;padding:18px;border:1px solid var(--line);border-radius:6px;background:#f7f8f3}
.shelf-recommendation-header{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px;margin-bottom:16px}
.shelf-recommendation-header h2{font-size:20px;line-height:1.3;margin:0}
.shelf-recommendation-header>a{font-size:13px;color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.shelf-recommendation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;margin:0;padding:0}
.shelf-recommendation-grid>li{overflow:hidden;border:1px solid var(--line);border-radius:5px;background:#fff}
.shelf-recommendation-card{display:block;color:inherit}
.shelf-recommendation-media{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
video.shelf-recommendation-media{background:#111}
.shelf-recommendation-copy{padding:12px}
.shelf-recommendation-copy h3{margin:4px 0 5px;font-size:16px;line-height:1.35;color:var(--accent)}
.shelf-recommendation-copy p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.shelf-recommendation-card:hover h3,.shelf-recommendation-card:focus-visible h3{text-decoration:underline;text-underline-offset:3px}
@media(max-width:600px){.shelf-recommendation{padding:14px}.shelf-recommendation-grid{grid-template-columns:1fr}}
.shelf-section-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 23px}
.shelf-section-bar h2{font-size:19px;letter-spacing:-.4px;line-height:1.2;margin:0 0 6px}
.shelf-section-bar span,.shelf-section-bar>a{font-size:11px;color:#69776d}
.shelf-section-bar>a{border-bottom:1px solid #a7b3a7;padding-bottom:3px;white-space:nowrap}
body:is([data-page=home],[data-page=library]) .game-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:29px 21px}
body:is([data-page=home],[data-page=library]) .game-card{min-width:0;transition:transform .17s ease}
body:is([data-page=home],[data-page=library]) .game-card__img-wrap{aspect-ratio:3/4;padding:5px 5px 5px 8px;background:#fafbf7;border:1px solid #c3cbc0;border-radius:6px;box-shadow:1px 2px 0 #b3bcae,3px 4px 7px #1f342119;overflow:visible}
body:is([data-page=home],[data-page=library]) .game-card__img-wrap:before{content:'';position:absolute;left:3px;top:8px;bottom:8px;width:2px;background:#d1d9cd;border-radius:2px}
body:is([data-page=home],[data-page=library]) .game-cover{overflow:hidden;border-radius:3px;background:#192a24;isolation:isolate}
body:is([data-page=home],[data-page=library]) .game-cover img{object-fit:cover;width:100%;height:100%;image-rendering:auto;filter:saturate(.95);transition:transform .3s ease}
body:is([data-page=home],[data-page=library]) .game-cover:after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#06120940,transparent 24%,transparent 46%,#03110aba 83%,#04110be8)}
body:is([data-page=home],[data-page=library]) .game-card[data-game=pokerogue] .game-cover img{object-fit:contain;object-position:center 25%;background:#414b96}
body:is([data-page=home],[data-page=library]) .game-card:is([data-game=diablo],[data-game=assaultcube]) .game-cover img{filter:brightness(1.15)}
.case-edition{position:absolute;left:12px;top:13px;z-index:2;color:#fff;font:8px/1.4 'Courier New',monospace;letter-spacing:1.7px;text-shadow:0 1px 4px #000b}
.case-title{position:absolute;left:12px;right:9px;bottom:22px;z-index:2;color:#f7f6e9;font-size:clamp(18px,1.8vw,30px);line-height:1.02;font-weight:800;letter-spacing:-.8px;overflow-wrap:anywhere;text-shadow:0 2px 8px #0008}
body:is([data-page=home],[data-page=library]) .game-card h2{font-size:12px;line-height:1.4;color:#213028;margin:12px 0 5px;font-weight:700;letter-spacing:0}
.case-meta{display:flex;flex-wrap:wrap;gap:2px 7px;justify-content:space-between;color:#7a877c;font-size:9px;line-height:1.6}
.launch-label{color:#36704f}
.launch-label.is-external{color:#7a7260}
body:is([data-page=home],[data-page=library]) .tile-play{z-index:3;color:white;font-size:26px;background:#0623133d}
body:is([data-page=home],[data-page=library]) .save-game{top:10px;right:10px;z-index:4;background:#102017e6;border-color:#ffffff50;color:#f5f5df}
body:is([data-page=home],[data-page=library]) .save-game[aria-pressed=true]{color:#ecffad}
body:is([data-page=home],[data-page=library]) .game-card:hover .game-card__img-wrap{border-color:#4b7660}
@media(hover:hover){body:is([data-page=home],[data-page=library]) .game-card:hover{transform:translateY(-3px)}body:is([data-page=home],[data-page=library]) .game-cover:hover img{transform:scale(1.04)}}
body:is([data-page=home],[data-page=library]) .game-card[data-collection=lab] .game-card__img-wrap{aspect-ratio:4/3;background:#e2e6dc}
body:is([data-page=home],[data-page=library]) .game-card[data-collection=lab] .game-cover img{object-fit:contain}
.game-card[data-collection=lab] .case-title,.game-card[data-collection=lab] .case-edition{display:none}
body:is([data-page=home],[data-page=library]) .game-card[data-collection=lab] .game-cover:after{display:none}
.shelf-more{display:flex;flex-wrap:wrap;gap:13px 25px;padding:25px 0;margin-top:35px;border-top:1px solid #cbd1ca;font-size:12px}
.shelf-more>span{color:#6e7a70;margin-right:auto}
.shelf-more>a{text-decoration:underline;text-underline-offset:4px}
body:is([data-page=home],[data-page=library]) .genre-tabs{margin:0 0 16px;gap:7px}
body:is([data-page=home],[data-page=library]) .genre-tabs button{background:#f5f6f1;border-color:#c7d0c2;color:#5b6b60;border-radius:4px;font-size:11px;padding:8px 13px}
body:is([data-page=home],[data-page=library]) .genre-tabs button[aria-pressed=true]{color:white;background:#1c5a47;border-color:#1c5a47}
body:is([data-page=home],[data-page=library]) .sort-bar select{background:#f7f8f3;border-color:#bac5b4;color:#344c3c}
body:is([data-page=home],[data-page=library]) .view-tabs button,body:is([data-page=home],[data-page=library]) .mode-tabs button{color:#798477}
body:is([data-page=home],[data-page=library]) .view-tabs button[aria-pressed=true],body:is([data-page=home],[data-page=library]) .mode-tabs button[aria-pressed=true]{color:#175b40;font-weight:700}
body:is([data-page=home],[data-page=library]) .catalog-controls>p{color:#6d7c6d}
body:is([data-page=home],[data-page=library]) .site-footer{background:#1b2525;color:#e6eee1;border-color:#35413d}
.game-requirements{padding:9px 11px;border-left:2px solid #a8bf7a;background:#ffffff06;font-size:12px!important;color:#c4cdb4!important}
.port-versions{margin-top:30px;padding-top:22px;border-top:1px solid #303438}.port-versions>p{color:#a3acb4;font-size:13px}.port-versions ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.port-versions li{border:1px solid #303438;padding:12px 15px;border-radius:4px;min-width:0}.port-versions a{color:#d6e4c5}.port-versions small{display:block;color:#8e989e;font-size:10px;margin-top:5px;overflow-wrap:anywhere}.case-title{overflow-wrap:anywhere}@media(max-width:600px){.port-versions ul{grid-template-columns:1fr}}
@media(min-width:1650px){body:is([data-page=home],[data-page=library]) .game-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1150px){.shelf-layout{grid-template-columns:150px minmax(0,1fr);gap:23px}body:is([data-page=home],[data-page=library]) .game-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 17px}.case-title{font-size:24px}}
@media(max-width:850px){body:is([data-page=home],[data-page=library]) main{padding:25px 20px 0}.shelf-layout{grid-template-columns:1fr;gap:24px}.shelf-nav{position:static}.shelf-nav-label,.shelf-help{display:none}.shelf-nav nav{display:flex;overflow:auto;gap:8px;padding:0 0 7px}.shelf-nav nav a{min-height:38px;white-space:nowrap;border:1px solid #c6d0be;gap:14px;padding:8px 12px}.shelf-heading{margin-bottom:22px;padding-bottom:21px}.shelf-heading h1{font-size:34px}.shelf-intro{font-size:11px}.shelf-section-bar{margin-bottom:18px}.case-title{font-size:26px}}
@media(max-width:600px){body:is([data-page=home],[data-page=library]) main{padding:24px 16px 0}.shelf-heading{display:block;margin-bottom:20px}.shelf-heading h1{font-size:34px}.shelf-intro{margin-top:13px;max-width:none}.shelf-intro br{display:none}.shelf-eyebrow{font-size:9px}.shelf-layout{gap:20px}.shelf-nav nav a{font-size:11px;min-height:36px}.shelf-section-bar{align-items:start;gap:8px}.shelf-section-bar h2{font-size:18px}.shelf-section-bar span,.shelf-section-bar>a{font-size:9px}.shelf-section-bar>a{max-width:100px;white-space:normal;text-align:right}body:is([data-page=home],[data-page=library]) .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 17px}.case-title{font-size:clamp(20px,6vw,30px);left:10px;right:8px;bottom:18px}.case-edition{font-size:7px;left:10px;top:11px;letter-spacing:1.2px}body:is([data-page=home],[data-page=library]) .game-card h2{font-size:12px;margin-top:11px}.case-meta{display:block;font-size:9px}.case-meta>span{display:block}.shelf-more{display:grid;gap:13px;font-size:11px;margin-top:28px}.shelf-more>span{margin:0}.shelf-content .sort-bar{gap:8px}.shelf-content .sort-bar label{font-size:10px}.shelf-content .mode-tabs{gap:15px}.shelf-content .catalog-controls{margin-bottom:18px}.shelf-content .catalog-controls>p{font-size:9px}}
@media(prefers-reduced-motion:reduce){body:is([data-page=home],[data-page=library]) .game-card,body:is([data-page=home],[data-page=library]) .game-cover img{transition:none;transform:none!important}}
.tested-guide{max-width:78ch;margin-top:24px}.guide-overview,.guide-detail p,.guide-notes p{color:#bfbfc7;font-size:14px;line-height:1.9}.guide-detail,.guide-notes{border-top:1px solid var(--line);padding:22px 0 8px}.guide-detail h2,.guide-notes h2{font-size:20px;line-height:1.35;margin:0 0 13px;letter-spacing:-.2px}.guide-notes{margin-top:18px}.guide-notes p,.guide-notes li{font-size:12px;color:#a6adb0}.guide-notes ul{padding-left:20px}.guide-notes a{color:#d6e4c5;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}.guide-shot{margin:24px 0}.guide-shot img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:4px}.guide-shot figcaption{font-size:12px;color:#a6adb0;margin-top:9px}.breadcrumbs{flex-wrap:wrap}.guide-notes time{white-space:nowrap}@media(max-width:650px){.guide-detail p,.guide-overview{font-size:13px}.guide-detail h2,.guide-notes h2{font-size:19px}.quick-panels{grid-template-columns:1fr}}
.launch-warning{font-size:12px;line-height:1.5;color:#fff1c4;background:#17221be6;border:1px solid #b99c63;padding:8px 12px;margin:0 0 15px;max-width:48ch}
.search-help{max-width:78ch;overflow-wrap:anywhere;margin-top:24px}.search-help h3{font-size:16px;line-height:1.5;margin:22px 0 8px}.search-help nav{margin-top:22px}.search-help nav ul{padding-left:20px}.search-help nav li{font-size:13px;line-height:1.8;margin:6px 0}.search-help a{color:#d6e4c5;text-decoration:underline;text-underline-offset:3px}@media(max-width:650px){.search-help h3{font-size:15px}.search-help nav li{font-size:12px}}
.guide-controls{margin:22px 0;padding:18px 20px;border:1px solid var(--line);border-radius:6px}
.guide-controls h2{margin:0 0 8px;font-size:18px}
.guide-controls p{font-size:14px;line-height:1.6}
.guide-controls table{width:100%;border-collapse:collapse;margin:13px 0;font-size:14px}
.guide-controls th,.guide-controls td{text-align:left;padding:8px;border-bottom:1px solid var(--line)}
.guide-controls tbody th{font-weight:500}
