/* games */
.games-top{display:grid;grid-template-columns:1fr 320px;gap:18px}
.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.game-card{position:relative;border:1.5px solid var(--line);background:var(--surface);border-radius:20px;padding:16px;text-align:left;display:flex;flex-direction:column;gap:8px}
.game-card:not([disabled]):hover{border-color:var(--accent);transform:translateY(-2px)}
.game-card[disabled]{opacity:.62;cursor:default}
.game-card .ge{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:30px;background:var(--accent-soft)}
.game-card h3{margin:0;font-size:17px}
.game-card p{margin:0;font-size:13px;color:var(--muted)}
.game-card .cap{font-size:12.5px;display:flex;justify-content:space-between;color:var(--muted)}
.game-card .cap b{color:var(--text)}
.side-card{border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:16px}
.rank{list-style:none;margin:8px 0 0;padding:0}
.rank li{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px dashed var(--line);font-size:14px}
.rank li:first-child{border-top:0}
.rank .no{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:12px;background:var(--surface-3)}
.rank li:nth-child(1) .no{background:#ffd54a;color:#5a3e00}
.rank li:nth-child(2) .no{background:#d5dde3;color:#33424d}
.rank li:nth-child(3) .no{background:#f0b88a;color:#5a2f10}
.rank .me{font-weight:900;color:var(--accent-deep)}
.rank .sc{margin-left:auto;font-weight:700}
.ach{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px dashed var(--line)}
.ach:first-of-type{border-top:0}
.ach .ai{font-size:22px;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--surface-3);flex:none}
.ach.done .ai{background:var(--gold-soft)}
.ach .at{font-size:13.5px;font-weight:700}
.ach .as{font-size:12px;color:var(--muted)}

