.social-tabs[hidden]{display:none}
#socialDialog{color:#fff;background:#0a2936;border:1px solid #a8deea55;border-radius:22px;width:min(520px,calc(100% - 20px));max-height:92dvh;padding:20px;overflow:auto;box-shadow:0 24px 80px #00131c88}
#socialDialog::backdrop{background:#062736b0;backdrop-filter:blur(4px)}
.social-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.social-heading strong{font-size:20px;color:#e5ff62}.social-heading button{min-height:44px;padding:8px 14px;border:1px solid #a8deea55;background:transparent;border-radius:8px}
.social-tabs{display:flex;gap:6px;margin:18px 0}.social-tabs button{flex:1;min-height:44px;background:#123c4a;border:1px solid #76949f;border-radius:8px;font-size:14px}.social-tabs button[aria-pressed="true"]{background:#e5ff62;color:#092834;border-color:#e5ff62}
#socialBody h2{font-size:28px;margin:16px 0}#socialBody h3{font-size:18px;margin-top:24px}#socialBody p,#socialMessage{font-size:16px;line-height:1.5;color:#c2d6df}#socialBody label{display:block;font-size:14px;font-weight:700;color:#c2d6df;margin:12px 0}#socialBody input,#socialBody select{display:block;width:100%;min-height:46px;font:inherit;font-size:16px;padding:10px;margin:6px 0;border:1px solid #76949f;border-radius:8px;background:#123c4a;color:#fff}#socialBody button{min-height:44px;margin:6px 0}#socialBody .secondary{width:100%;text-align:left;padding:12px;border:1px solid #76949f;background:#123c4a;border-radius:8px;font-size:15px}#socialBody .danger{width:100%;background:transparent;color:#ffb9aa;border:1px solid #d98a78;padding:12px;border-radius:8px}#socialBody button:disabled{opacity:.5;cursor:wait}#socialMessage.error{color:#ffb9aa}
#socialBody .rider-portrait{width:260px;height:260px;max-width:100%;margin:auto;background:radial-gradient(ellipse,#295767,transparent 70%);touch-action:auto}#socialBody .invite-qr{width:220px!important;height:220px!important;margin:12px auto;background:#fff;padding:0;touch-action:auto}.social-filters{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rankings{padding:0;list-style:none}.rankings li{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;border-bottom:1px solid #a8deea35;padding:8px 0}.rankings li button{border:0!important;background:transparent!important;padding-left:0!important}.rankings strong{color:#e5ff62;font-variant-numeric:tabular-nums}.rankings small{grid-column:1/-1;font-size:14px;color:#c2d6df}[data-ranked-status]{font-size:14px!important;line-height:1.4!important;color:#c2d6df!important}
@media(max-height:600px){#socialDialog{max-height:95dvh}.social-tabs{margin:8px 0}}
/* Multiplayer shares the existing dialog, button and lake palette. */
#socialBody .mp-friend{display:flex;align-items:center;gap:.6rem;padding:.5rem 0}
#socialBody .mp-friend input{width:1.2rem;min-height:1.2rem;margin:0;accent-color:#e5ff62}
#socialBody fieldset{border:1px solid #ffffff30;border-radius:12px;margin:1rem 0;padding:.8rem}
.mp-state{color:#e5ff62;font-weight:700}
#mpAttempt{position:absolute;top:140px;left:50%;transform:translateX(-50%);width:min(80%,400px);text-align:center;color:#e5ff62;font-size:12px;font-weight:700;pointer-events:none;text-shadow:0 1px 4px #092834}
#game[data-shootout=true] .stats>div:first-child,#game[data-shootout=true] #callout,#game[data-shootout=true] #trickIntent{visibility:hidden}
.feed-post{border:1px solid #a8deea55;border-radius:12px;padding:12px;margin:12px 0;background:#123c4a}
.feed-post video{display:block;width:100%;max-height:360px;border-radius:8px;background:#071b24}
.feed-post .feed-author{border:0;background:transparent;color:#e5ff62;font-weight:700;padding:0;text-align:left}
.feed-state{color:#e5ff62!important}.feed-compose{border:1px solid #a8deea55;border-radius:12px;padding:12px}.feed-chosen{overflow-wrap:anywhere}
.move-camera{display:block;width:100%;max-height:280px;object-fit:contain;background:#071b24;border-radius:8px}
/* Exactly five rows per board; each list scrolls independently. */
#socialDialog[data-view=rankings]{width:min(880px,calc(100% - 20px));padding:12px;overflow:hidden;box-sizing:border-box}
#socialDialog[data-view=rankings] #socialMessage:empty{display:none}
.world-boards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;--world-row:clamp(28px,calc((100dvh - 135px)/5),48px)}
.world-board{min-width:0;border:1px solid #a8deea55;border-radius:12px;overflow:hidden;background:#123c4a}
#socialBody .world-board h2{font-size:clamp(14px,2.5vw,19px);line-height:24px;margin:0;padding:8px 10px;white-space:nowrap}
.world-rankings{height:calc(5 * var(--world-row));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;list-style:none;padding:0;margin:0;scrollbar-width:thin}
.world-rankings li{height:var(--world-row);box-sizing:border-box;display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:6px;padding:0 10px;border-top:1px solid #ffffff20;font-size:13px}
#socialBody .world-rankings button{min-height:0;height:100%;min-width:0;margin:0;padding:0;border:0;background:transparent;color:inherit;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit}
.world-rankings strong{font-variant-numeric:tabular-nums;color:#e5ff62}.world-rank{opacity:.65}.world-empty{color:#b6cad1}.world-rankings .board-note{display:block}
@media(max-width:540px) and (min-height:540px){.world-boards{grid-template-columns:1fr;--world-row:clamp(30px,calc((100dvh - 210px)/10),44px)}}
#socialDialog[data-view=rankings] .social-heading{position:static;padding:0 0 6px;min-height:44px}
#socialDialog[data-view=rankings] .social-heading strong{font-size:clamp(15px,2.6vw,20px)}
@media(min-width:541px),(max-height:539px){.world-boards{--world-row:clamp(24px,calc((100dvh - 175px)/5),48px)}}
@media(max-width:540px) and (min-height:540px){.world-boards{--world-row:clamp(28px,calc((100dvh - 250px)/10),44px)}}

#socialDialog[data-view=rankings] .social-heading strong{flex:1;text-align:center}
#socialDialog[data-view=rankings] .world-boards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;--world-row:clamp(26px,calc((100dvh - 260px)/9),40px)}
#socialDialog[data-view=rankings] .world-board h2{text-align:center;white-space:normal;line-height:1.15;padding:7px 5px}
#socialDialog[data-view=rankings] .big-air-board{grid-column:1/-1}
#socialDialog[data-view=rankings] .big-air-board p{margin:0 0 4px!important;text-align:center;font-size:11px!important;line-height:1.2!important;color:#d5edf4!important}
#socialDialog[data-view=rankings] .big-air-board .world-rankings{height:calc(3 * var(--world-row))}
#socialDialog[data-view=rankings] .world-rankings li{padding-inline:6px;gap:4px;font-size:clamp(10px,2.8vw,13px)}
@media(max-width:540px){#socialDialog[data-view=rankings] .world-boards{grid-template-columns:1fr;--world-row:clamp(24px,calc((100dvh - 300px)/9),34px)}#socialDialog[data-view=rankings] .world-rankings{height:calc(3 * var(--world-row))}}