/* UX refinement layer: compact discovery, stronger hierarchy, and touch-first controls. */
.library-intro{display:grid;gap:13px;justify-items:start}.library-intro p{margin:0}.library-badge{padding:7px 10px;border:1px solid rgba(85,226,209,.4);background:rgba(85,226,209,.08);color:var(--teal);font-size:9px;font-weight:800;letter-spacing:.13em}.filter-panel{padding:14px 15px 7px;margin-bottom:18px;border:1px solid var(--line);background:linear-gradient(105deg,rgba(32,59,110,.48),rgba(8,22,47,.62))}.filter-caption{display:flex;align-items:center;justify-content:space-between;margin:0 0 11px;color:#aebbd1;font-size:10px;font-weight:800;letter-spacing:.13em}.filter-caption button{border:0;background:transparent;color:var(--teal);font:inherit;font-size:10px;letter-spacing:.1em;cursor:pointer}.filter-row{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-inline:contain;padding-bottom:9px;scrollbar-width:thin;scrollbar-color:var(--teal) transparent}.filter-row::-webkit-scrollbar{height:5px}.filter-row::-webkit-scrollbar-thumb{background:var(--teal);border-radius:10px}.filter{white-space:nowrap;min-height:38px}.result-status{display:flex;align-items:center;gap:10px;color:#9caac2;font-size:11px}.result-status #active-filter{padding:5px 8px;background:rgba(143,120,255,.15);color:#d5ccff;font-weight:bold}.result-status #game-count{white-space:nowrap}.game-card{border-radius:3px}.game-card:focus-within{outline:2px solid var(--lime);outline-offset:3px}.game-card .cover{transition:transform .45s ease,filter .45s ease}.game-card:hover .cover{transform:scale(1.05);filter:saturate(1.15)}.game-card a{padding:8px 0}.quick-play{position:fixed;z-index:9;right:24px;bottom:23px;border:1px solid rgba(202,238,115,.7);background:rgba(7,17,36,.9);backdrop-filter:blur(12px);color:var(--lime);display:flex;align-items:center;gap:9px;padding:10px 12px;box-shadow:var(--shadow);font:800 10px Arial,sans-serif;letter-spacing:.1em;cursor:pointer;transition:.2s transform,.2s background}.quick-play span{font-size:18px}.quick-play i{font-style:normal;font-size:16px}.quick-play:hover{transform:translateY(-3px);background:#173045}.control-map{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;margin-top:18px;padding:27px;border:1px solid var(--line);background:linear-gradient(120deg,rgba(12,28,59,.9),rgba(26,52,91,.6))}.map-title{display:block;color:var(--teal);font-size:10px;font-weight:800;letter-spacing:.16em;margin-bottom:7px}.control-map b{font-size:18px;letter-spacing:.04em}.control-map p{max-width:330px;margin:9px 0 0;color:#b3c0d5;font-size:12px}.button-map{position:relative;min-height:150px;border-radius:78px;background:linear-gradient(145deg,#dce4ef,#8e9cb3);box-shadow:inset 7px 7px 12px #fff,inset -9px -9px 15px #657389;color:#23324f}.button-map span{position:absolute;display:grid;place-items:center}.button-map .dpad{left:44px;top:48px;width:48px;height:48px;border-radius:50%;font-size:36px;color:#35445d}.button-map .mid{left:50%;top:92px;transform:translateX(-50%);font-size:8px;font-weight:bold;color:#43516b}.button-map .face{width:25px;height:25px;border-radius:50%;color:#fff;font-size:11px;font-weight:bold}.button-map .y{right:120px;top:76px;background:#5d74b3}.button-map .x{right:88px;top:44px;background:#7559af}.button-map .b{right:88px;top:108px;background:#8061bf}.button-map .a{right:56px;top:76px;background:#6d5aa8}.button-map .shoulder{top:10px;left:33px;padding:5px 11px;border-radius:8px;background:#687895;color:#f4f7ff;font-size:10px}.button-map .right{left:auto;right:31px}@media(max-width:800px){.topbar{position:sticky}.topbar nav.open{display:flex;position:absolute;top:65px;left:0;right:0;padding:16px 24px;flex-direction:column;gap:15px;background:rgba(7,17,36,.98);border-bottom:1px solid var(--line)}.section-heading .library-intro{margin-top:6px}.filter-panel{margin-inline:-4px}.library-tools{align-items:stretch}.search{width:100%}.result-status{justify-content:space-between}.control-map{grid-template-columns:1fr}.button-map{min-height:135px}.quick-play{right:16px;bottom:15px}.quick-play b{display:none}}@media(max-width:460px){.library-badge{font-size:8px}.result-status{font-size:10px}.button-map .dpad{left:22px}.button-map .y{right:89px}.button-map .x,.button-map .b{right:61px}.button-map .a{right:33px}.button-map .mid{font-size:7px}.quick-play{padding:9px 11px}}
