/* Home: a big "Hello" header, a friends row with presence icons, then game cards. */
.home-page{max-width:1250px}
.home-hero{display:flex;align-items:center;gap:32px;margin:6px 0 22px}
.home-portrait{flex:none;display:block;width:190px;height:190px;border-radius:50%;overflow:hidden;background:#e3e9f1;border:1px solid #d5dbe4}
.home-portrait canvas{display:block;width:100%;height:100%;object-fit:cover}
.home-hero h1{margin:0 0 10px;font-size:42px;font-weight:600;line-height:1.1;overflow-wrap:anywhere}
.home-badges{display:flex;align-items:center;gap:4px;min-height:20px}
.home-badges .account-badge{margin-left:0}
.home-profile-link{display:inline-block;margin-top:10px;font-size:13px;color:#2f6be0;text-decoration:underline;cursor:pointer}
.home-friends-card{background:#fff;border:1px solid #d5dbe4;border-radius:6px;padding:16px 18px;overflow:hidden}
.home-friends{display:flex;gap:16px;overflow-x:auto;padding-bottom:4px}
.home-friend{flex:none;display:flex;flex-direction:column;align-items:center;width:104px;text-align:center;color:inherit}
.home-friend-face{position:relative;display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:#e8edf4;border:1px solid #d5dbe4}
.home-friend-face canvas{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.home-presence{position:absolute;right:-2px;bottom:-2px;width:28px;height:28px;border-radius:50%;box-shadow:0 0 0 2px #fff}
.home-friend-name{margin-top:8px;max-width:100%;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-friend-game{max-width:100%;min-height:15px;font-size:11px;color:#667184;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-friend:hover .home-friend-name{text-decoration:underline}
.home-add-face{font-size:44px;font-weight:300;color:#3b4a5e}
.home-add:hover .home-add-face{background:#dbe4f0}
.game-card-playing{font-weight:700}
html[data-theme=dark] .home-portrait,html[data-theme=dark] .home-friend-face{background:#2f3742;border-color:#3a4656}
html[data-theme=dark] .home-friends-card{background:#1d2733;border-color:#3a4656}
html[data-theme=dark] .home-presence{box-shadow:0 0 0 2px #1d2733}
html[data-theme=dark] .home-friend-game{color:#b0bccb}
html[data-theme=dark] .home-add-face{color:#e7edf5}
html[data-theme=dark] .home-profile-link{color:#7db1ff}
@media(max-width:640px){.home-hero{flex-direction:column;align-items:flex-start;gap:16px}.home-portrait{width:150px;height:150px}.home-hero h1{font-size:32px}.home-friend{width:88px}.home-friend-face{width:78px;height:78px}}
.home-friend-tile{position:relative;flex:none}
.home-join{position:absolute;left:50%;top:58px;transform:translateX(-50%);padding:5px 14px;border-radius:14px;background:#00a2ff;color:#fff;font:700 12px Arial,sans-serif;box-shadow:0 2px 6px #0004;opacity:0;pointer-events:none;transition:opacity .15s}
.home-friend-tile.can-join:hover .home-join,.home-friend-tile.can-join:focus-within .home-join,.home-join:focus{opacity:1;pointer-events:auto}
@media(hover:none){.home-friend-tile.can-join .home-join{opacity:1;pointer-events:auto;top:auto;bottom:-6px}}
.love-most{font-size:13px;font-weight:800;color:#1b8a4c}html[data-theme=dark] .love-most{color:#59d58b}html[data-blocktober=live] .love-most{color:#7be3a2}
.home-page #love-games .game-card p:last-child{display:block!important}