/* Game-first discovery, in PI Play's existing purple / lime world. */
.game-cover{display:block;width:100%;height:100%;object-fit:cover}
.art-wrap>.game-cover{transition:transform 320ms var(--ease)}
.card-open:hover .art-wrap>.game-cover{transform:scale(1.035)}
.quick-art>.game-cover{width:100%;height:100%;object-fit:cover;transition:transform 250ms var(--ease)}
.quick-game:hover .quick-art>.game-cover{transform:scale(1.06)}
.spotlight-art>.game-cover{width:100%;height:auto;max-height:270px;aspect-ratio:4/3;object-fit:cover;border-radius:12px}
.cover-unavailable{display:grid;place-items:center;width:100%;height:100%;min-height:60px;aspect-ratio:4/3;color:var(--purple);background:var(--purple-light)}
.cover-unavailable>svg{width:44px;height:44px}
.game-label.platform-label{color:var(--ink);background:var(--surface)}
.dialog-copy a{color:var(--purple-hover);text-decoration:underline}
.card-meta .card-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.discovery-lead{display:grid;grid-template-columns:minmax(0,1fr) 246px;gap:18px;margin-bottom:28px}
.spotlight{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.9fr);align-items:center;gap:20px;min-height:326px;padding:30px 32px;border-radius:16px;overflow:hidden;color:white;background:var(--purple)}
.spotlight-copy{position:relative;z-index:1;min-width:0}
.spotlight h1{margin:0 0 16px;font-size:clamp(34px,3vw,48px);font-weight:700;line-height:1.16;letter-spacing:-.035em}
.spotlight h1 em{font-style:normal;color:var(--lime)}
.spotlight p{max-width:39ch;margin:0 0 23px;color:#f4efff;font-size:14px;line-height:1.8}
.spotlight-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 18px}
.spotlight-play{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 16px;border-radius:10px;color:var(--ink);background:var(--lime);font-size:14px;font-weight:650;transition:background-color 160ms}
.spotlight-play:hover{background:#e6ffab}
.spotlight-play svg{width:17px;height:17px}
.spotlight-browse{min-height:44px;padding:8px 0;border-radius:3px;color:white;background:transparent;font-size:13px;text-decoration:underline;text-decoration-color:#c1b2ff;text-underline-offset:5px}
.spotlight-browse:hover{text-decoration-color:white}
.spotlight button:focus-visible{outline-color:white}
.spotlight-note{display:flex;align-items:center;gap:7px;margin-top:19px;color:#eee7ff;font-size:11px;line-height:1.6}
.spotlight-note svg{width:14px;height:14px}
.spotlight-art{position:relative;min-width:0;margin:0 0 22px}
.spotlight-art>svg{display:block;width:100%;height:auto;max-height:270px;border-radius:12px}
.spotlight-art>span{position:absolute;left:0;right:0;bottom:-24px;text-align:center;color:#f4efff;font-size:12px;font-weight:500}
.lucky-pick{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:15px;min-width:0;padding:24px;border-radius:16px;color:var(--ink);background:var(--lime)}
.lucky-dice{color:var(--purple-hover)}
.lucky-dice svg{width:47px;height:47px;transform:rotate(-12deg)}
.lucky-pick h2{margin:0 0 12px;font-size:27px;line-height:1.2;font-weight:650;letter-spacing:-.025em}
.lucky-pick p{margin:0;color:#3c4c24;font-size:13px;line-height:1.7}
.lucky-pick>button{display:flex;align-items:center;justify-content:space-between;gap:12px;align-self:stretch;min-height:44px;padding:11px 13px;border-radius:10px;color:white;background:var(--ink);font-size:13px;font-weight:600}
.lucky-pick>button:hover{background:#41394f}
.lucky-pick>button svg{width:18px;height:18px}
.quick-start{margin:0 0 34px}
.quick-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.quick-heading h2{margin:0;font-size:19px;line-height:1.3;font-weight:600;letter-spacing:-.02em}
.quick-shuffle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 0 8px 10px;border-radius:8px;color:var(--purple-hover);background:transparent;font-size:12px;font-weight:600}
.quick-shuffle:hover{color:var(--ink)}
.quick-shuffle svg{width:19px;height:19px}
.quick-games{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.quick-game{display:flex;align-items:center;gap:12px;min-width:0;padding:0 0 14px;border-bottom:1px solid var(--border);background:transparent;text-align:left}
.quick-art{flex-shrink:0;width:78px;aspect-ratio:4/3;overflow:hidden;border-radius:10px;background:var(--purple-light)}
.quick-art svg{display:block;width:100%;height:100%;transition:transform 250ms var(--ease)}
.quick-game:hover .quick-art svg{transform:scale(1.06)}
.quick-copy{display:block;min-width:0}
.quick-copy strong{display:block;font-size:16px;font-weight:600;line-height:1.4}
.quick-copy small{display:block;margin-top:5px;color:var(--muted);font-size:11px;line-height:1.5}
.quick-arrow{margin-left:auto;color:var(--muted)}
.quick-arrow svg{width:18px;height:18px}
.game-label.new-label{color:var(--lime);background:var(--ink)}
#catalog-title{scroll-margin-top:24px}
.card-meta h3{font-weight:650}
.card-play{transition:color 160ms,background-color 160ms}
.card-open:hover .card-play{color:white;background:var(--purple)}
@media(min-width:1500px){.game-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 18px}.discovery-lead{grid-template-columns:minmax(0,1fr) 266px}.spotlight{padding:34px 38px;gap:30px}.spotlight h1{font-size:50px}.quick-art{width:90px}}
@media(max-width:1180px){.discovery-lead{grid-template-columns:minmax(0,1fr) 204px;gap:16px}.spotlight{padding:26px;gap:16px;grid-template-columns:minmax(0,1fr) minmax(180px,.9fr)}.spotlight h1{font-size:36px}.spotlight p{font-size:13px}.spotlight-browse{font-size:12px}.lucky-pick{padding:22px}.lucky-pick h2{font-size:23px}.lucky-pick p{font-size:12px}.quick-games{gap:18px}.quick-art{width:66px}.quick-copy strong{font-size:15px}.quick-arrow{display:none}}
@media(min-width:721px) and (max-width:980px){.discovery-lead{grid-template-columns:1fr}.lucky-pick{display:none}.spotlight{min-height:302px;padding:28px;grid-template-columns:minmax(0,1fr) minmax(180px,.85fr)}.spotlight h1{font-size:37px}.spotlight p{font-size:12px}.spotlight-play{font-size:13px;padding:12px}.quick-heading h2{font-size:18px}.quick-games{gap:14px}.quick-game{gap:9px}.quick-art{width:52px}.quick-copy strong{font-size:14px}.quick-copy small{font-size:10px}}
@media(max-width:720px){.discovery-lead{grid-template-columns:1fr;margin-bottom:24px}.lucky-pick{display:none}.spotlight{position:relative;display:block;min-height:310px;padding:25px 24px}.spotlight h1{font-size:36px;line-height:1.16;margin-bottom:13px}.spotlight p{max-width:29ch;font-size:13px;line-height:1.7;margin-bottom:16px}.spotlight-actions{flex-direction:column;align-items:flex-start;gap:3px}.spotlight-play{min-height:44px;padding:11px 13px;font-size:13px;gap:8px}.spotlight-play>svg:last-child{display:none}.spotlight-browse{font-size:12px;min-height:40px}.spotlight-note{display:none}.spotlight-art{position:absolute;right:-24px;bottom:8px;width:140px;margin:0;transform:rotate(-7deg)}.spotlight-art>svg{border-radius:10px}.spotlight-art>span{display:none}.quick-start{margin-bottom:28px}.quick-heading{gap:8px;margin-bottom:10px}.quick-heading h2{font-size:18px}.quick-shuffle{flex-shrink:0;min-width:44px;padding:10px}.quick-shuffle span{display:none}.quick-games{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 7px;scrollbar-width:thin;scrollbar-color:#b8a9d3 transparent}.quick-game{flex:0 0 210px;scroll-snap-align:start;gap:10px;padding-bottom:12px}.quick-art{width:68px}.quick-copy strong{font-size:15px}.quick-copy small{font-size:11px}.quick-games::-webkit-scrollbar{height:4px}.quick-games::-webkit-scrollbar-thumb{background:#b8a9d3;border-radius:8px}.quick-games::-webkit-scrollbar-track{background:transparent}.filter-pill{padding:10px 13px}}
@media(max-width:360px){.spotlight{padding:24px 22px;min-height:304px}.spotlight h1{font-size:32px}.spotlight p{font-size:12px;max-width:28ch}.spotlight-art{width:114px;right:-22px;bottom:12px}.quick-heading h2{font-size:16px}.quick-game{flex-basis:198px}.quick-copy strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.spotlight-art,.quick-art svg,.card-play{transition:none}}

#main h1[tabindex="-1"]:focus{outline:none}