/* Profile revamp — scoped to .acct */
.acct{--acct-hue:#6488ff;--acct-hue-2:#9db1ff;--acct-card:color-mix(in srgb,var(--surface-raised) 82%,transparent);--acct-line:color-mix(in srgb,var(--outline) 70%,transparent)}
.acct .account-inner{width:min(980px,100%);padding:22px 20px 72px}

.acct-hero{position:relative;overflow:hidden;margin-bottom:16px;padding:26px 24px 18px;border:1px solid color-mix(in srgb,var(--acct-hue) 35%,var(--outline));border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--acct-hue) 22%,var(--surface-raised)),var(--surface-raised) 55%,color-mix(in srgb,var(--acct-hue-2) 12%,var(--surface-raised)));box-shadow:0 18px 40px -26px color-mix(in srgb,var(--acct-hue) 70%,transparent)}
.acct-hero-glow{position:absolute;inset:-40% -10% auto auto;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--acct-hue) 40%,transparent),transparent 65%);filter:blur(10px);pointer-events:none;animation:acct-drift 14s ease-in-out infinite alternate}
@keyframes acct-drift{to{transform:translate(-60px,40px) scale(1.15)}}
.acct-hero-main{position:relative;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.acct-avatar{width:84px;height:84px;flex:none;border-radius:22px;object-fit:cover;background:var(--site-bg);box-shadow:0 0 0 3px var(--surface-raised),0 0 0 5px var(--acct-hue),0 10px 24px -8px color-mix(in srgb,var(--acct-hue) 80%,transparent)}
.acct-who{flex:1;min-width:200px}
.acct .account-name-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.acct .account-name-line h1{margin:0;color:var(--prose);font:800 clamp(26px,4.4vw,38px)/1.05 var(--font-ui);letter-spacing:.01em;text-transform:none}
.acct-who>p{margin:6px 0 0;color:var(--prose-3);font-size:12px}
.acct-social{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.acct-social span{padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--site-bg) 60%,transparent);border:1px solid var(--acct-line);color:var(--prose-2);font-size:12px}
.acct-social b{color:var(--prose);font-weight:800}
.acct-hero-links{display:flex;flex-wrap:wrap;gap:8px;align-self:flex-start;margin-left:auto}
.acct-btn,.acct .account-settings-link{display:inline-flex;align-items:center;gap:6px;margin:0;padding:8px 13px;border:1px solid var(--acct-line);border-radius:10px;background:color-mix(in srgb,var(--site-bg) 55%,transparent);color:var(--prose);font:700 13px var(--font-ui);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.acct-btn:hover:not(:disabled):not(.is-static),.acct .account-settings-link:hover{border-color:var(--acct-hue);background:color-mix(in srgb,var(--acct-hue) 18%,var(--site-bg));transform:translateY(-1px)}
.acct-btn:disabled{opacity:.6;cursor:wait}.acct-btn.is-static{cursor:default;color:var(--prose-2)}
.acct-hero-actions{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0 0;padding-top:14px;border-top:1px solid var(--acct-line)}
.acct-hero-actions:empty{display:none}

.acct-panel{margin:0 0 14px;padding:18px;border:1px solid var(--acct-line);border-radius:16px;background:var(--acct-card)}
.acct details.profile-admin{padding:12px 16px}
.acct details.profile-admin>summary{cursor:pointer;color:var(--prose-2);font-weight:800;font-size:13px}
.acct details.profile-admin[open]>summary{margin-bottom:12px}

.acct-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:16px}
.acct-stats>div{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px;border:1px solid var(--acct-line);border-radius:14px;background:var(--acct-card)}
.acct-stats span{color:var(--prose-3);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.acct-stats strong{overflow:hidden;color:var(--prose);font:800 22px/1.1 var(--font-ui);text-overflow:ellipsis;white-space:nowrap}
.acct-stats small{color:var(--prose-3);font-size:11px}
.acct-stats>.is-main{border-color:color-mix(in srgb,var(--acct-hue) 45%,var(--outline));background:linear-gradient(160deg,color-mix(in srgb,var(--acct-hue) 20%,var(--surface-raised)),var(--surface-raised))}
.acct-stats>.is-main strong{color:color-mix(in srgb,var(--acct-hue) 55%,var(--prose))}
.acct .account-elo{margin:0;font-size:inherit}

.acct-tabs{position:sticky;top:0;z-index:5;display:flex;gap:4px;margin:0 0 14px;padding:5px;overflow-x:auto;border:1px solid var(--acct-line);border-radius:14px;background:color-mix(in srgb,var(--site-bg) 85%,transparent);backdrop-filter:blur(10px);scrollbar-width:none}
.acct-tabs button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border:0;border-radius:10px;background:transparent;color:var(--prose-2);font:700 13px var(--font-ui);white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.acct-tabs button:hover{color:var(--prose);background:var(--surface-raised)}
.acct-tabs button[aria-selected=true]{color:var(--prose);background:color-mix(in srgb,var(--acct-hue) 24%,var(--surface-raised));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acct-hue) 50%,transparent)}
.acct-tabs small{padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--site-bg) 70%,transparent);color:var(--prose-3);font-size:11px;font-weight:800}
.acct-pane{animation:acct-in .22s ease-out}
@keyframes acct-in{from{opacity:0;transform:translateY(6px)}}

.acct .account-section{margin:0 0 14px}
.acct .account-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:14px}
.acct .account-section-heading h2{margin:0;font:800 16px var(--font-ui);color:var(--prose)}
.acct .account-section-heading>span{color:var(--prose-3);font-size:12px}

.acct .account-badge-groups{display:flex;flex-direction:column;gap:12px}
.acct-badge-group{--tier:var(--prose-3);padding:12px 12px 12px 14px;border:1px solid var(--acct-line);border-left:3px solid var(--tier);border-radius:12px;background:linear-gradient(90deg,color-mix(in srgb,var(--tier) 9%,transparent),transparent 60%)}
.acct-badge-group h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--tier);font:800 12px var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
.acct-badge-group h3 small{padding:1px 7px;border-radius:999px;background:var(--site-bg);color:var(--prose-2);font-size:11px;letter-spacing:0}
.acct-badge-group .account-badges{margin:0}

.acct-settings>h2{margin:0 0 14px;font:800 20px var(--font-ui)}
.acct .account-danger{border-radius:16px}

@media (max-width:640px){
  .acct .account-inner{padding:12px 10px 60px}
  .acct-hero{padding:18px 16px 14px;border-radius:16px}
  .acct-avatar{width:64px;height:64px;border-radius:18px}
  .acct-hero-links{margin-left:0;width:100%}
  .acct-stats{grid-template-columns:repeat(2,1fr)}
  .acct-stats>.is-main{grid-column:1/-1}
  .acct-tabs button{flex:none}
}

/* Polish pass */
.acct-btn.is-gift{border-color:color-mix(in srgb,#f59e0b 55%,transparent);background:color-mix(in srgb,#f59e0b 16%,var(--site-bg))}
.acct-tabs button svg{opacity:.75}.acct-tabs button[aria-selected=true] svg{opacity:1;color:var(--acct-hue)}
.acct-panel{box-shadow:0 1px 0 color-mix(in srgb,#fff 5%,transparent) inset,0 10px 30px -22px rgba(0,0,0,.5)}
.acct .account-section-heading h2{display:flex;align-items:center;gap:8px}
.acct .account-section-heading h2::before{content:"";width:4px;height:16px;border-radius:2px;background:linear-gradient(var(--acct-hue),var(--acct-hue-2))}

/* Valuable entries: cards keep their natural width */
.acct .account-valuable{padding:18px;border:1px solid var(--acct-line);border-radius:16px;background:var(--acct-card)}
.acct .account-valuable-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}
.acct .account-valuable-row{grid-template-columns:auto max-content 1fr;gap:10px;padding:8px 12px;border-color:var(--acct-line);background:color-mix(in srgb,var(--site-bg) 50%,transparent);transition:border-color .15s,transform .15s}
.acct .account-valuable-row:hover{border-color:var(--acct-hue);transform:translateY(-1px)}
.acct .account-valuable-row>b{min-width:38px;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--acct-hue) 18%,transparent);color:var(--prose);font-size:12px;text-align:center}
.acct .account-valuable-row>:nth-child(2){width:max-content!important;max-width:100%;justify-self:start;min-width:0}
.acct .account-valuable-row>span{justify-self:end;font-size:12px}
.acct .account-valuable-tabs button[aria-selected=true]{border-color:var(--acct-hue);background:color-mix(in srgb,var(--acct-hue) 18%,var(--surface-raised))}

/* Top 3 */
.acct .account-top-three{gap:12px}
.acct .account-top-slot{border-radius:14px;transition:transform .2s}
.acct .account-top-slot:hover{transform:translateY(-3px)}

/* Minigames */
.acct .account-mini-scores{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.acct .account-mini-scores>div{position:relative;display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto auto;column-gap:10px;row-gap:1px;align-items:center;padding:11px 12px;border-radius:13px;border-color:var(--acct-line);background:color-mix(in srgb,var(--site-bg) 45%,transparent);transition:transform .15s,border-color .15s}
.acct .account-mini-scores>div:hover{transform:translateY(-2px);border-color:var(--outline-strong)}
.acct .acct-mini-icon{grid-row:1/4}
.acct .account-mini-scores span{font-size:11.5px;font-weight:700;color:var(--prose-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acct .account-mini-scores strong{font:800 16px var(--font-ui)}
.acct .account-mini-scores small{font-size:10.5px}

/* Recent rolls */
.acct .account-rolls{gap:7px}
.acct .account-roll{border-radius:12px;border-color:var(--acct-line);background:color-mix(in srgb,var(--site-bg) 45%,transparent);transition:border-color .15s}
.acct .account-roll:hover{border-color:var(--outline-strong)}
.acct .account-roll-meta strong{color:color-mix(in srgb,var(--acct-hue) 45%,var(--prose))}
.acct .account-load-more,.acct .account-games-more{border-radius:10px;border-color:var(--acct-line);background:color-mix(in srgb,var(--site-bg) 50%,transparent)}
.acct .account-load-more:hover,.acct .account-games-more:hover{border-color:var(--acct-hue)}

/* Badges */
.acct .account-badge-entry small{opacity:.8}
.acct-badge-group{transition:border-color .15s}

.practice-icon{margin-bottom:4px;border-radius:8px;box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
.mini-icon{border-radius:25%}

/* profile description (profile-bio.jsx) */
.acct-bio{position:relative;max-width:520px;margin:6px 0 4px;padding-right:26px}
.acct-bio p{margin:0;font-size:14px;line-height:1.45;color:var(--prose-2);white-space:pre-wrap;overflow-wrap:anywhere;text-transform:none}
.acct-bio-edit{position:absolute;right:0;top:0;width:22px;height:22px;border:0;border-radius:6px;background:transparent;color:var(--prose-3);cursor:pointer;opacity:.6}
.acct-bio:hover .acct-bio-edit,.acct-bio-edit:focus-visible{opacity:1;background:color-mix(in srgb,currentColor 12%,transparent)}
.acct-bio-add{margin:6px 0 4px;padding:0;border:0;background:none;color:var(--prose-3);font:inherit;font-size:13px;cursor:pointer;text-transform:none}
.acct-bio-add:hover{color:var(--prose)}
.acct-bio.is-editing{padding-right:0;width:min(520px,100%)}
.acct-bio textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;min-height:64px;padding:8px 10px;border-radius:10px;border:1px solid var(--outline);background:var(--surface-dim,transparent);color:var(--prose);font:inherit;font-size:14px;line-height:1.4;text-transform:none}
.acct-bio-bar{display:flex;align-items:center;gap:8px;margin-top:6px}
.acct-bio-bar small{margin-right:auto;font-size:11px;color:var(--prose-3)}
.acct-bio-bar .acct-bio-error{color:#ff6b6b}
.acct-bio-bar small+.acct-bio-error{margin-right:auto}