:root .in[data-page="profile"] #center { grid-column:2/-1; min-width:0; }
:root .in[data-page="profile"] #right { display:none; }
:root .profile-home:has(.profile-dashboard) { max-width:none; }
.profile-dashboard { display:grid; gap:12px; min-width:0; }
.pd-hero,.meath-profile-cover {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#132946;
}
.pd-hero::before,.meath-profile-cover::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    repeating-radial-gradient(ellipse at 86% 55%,transparent 0 21px,#ffffff17 22px 23px,transparent 24px 42px),
    radial-gradient(ellipse at 86% 50%,hsl(var(--badge-hue,218) 52% 46%),transparent 58%),
    linear-gradient(var(--cover-angle,112deg),#101b32,hsl(var(--badge-hue,218) 42% 25%));
}
.pd-hero::after,.meath-profile-cover::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,#0c1933ed,#1028478c),linear-gradient(0deg,#0c1933bb,transparent 70%);
}
.pd-hero { padding:18px; color:#fff; border:1px solid #ffffff20; border-radius:14px; }
:root .profile-public-card .meath-profile-cover { min-height:125px; padding:12px; display:flex; justify-content:flex-end; align-items:flex-start; }
.pd-identity { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; }
.pd-avatar,.pd-friends > span { display:grid; place-items:center; flex:none; overflow:hidden; border-radius:50%; background:#254778; color:#fff; }
.pd-avatar { width:70px; height:70px; border:2px solid #b6d2f1; font-size:28px; }
.pd-avatar img,.pd-friends img { width:100%; height:100%; object-fit:cover; }
:root .pd-identity h2 { margin:0; color:#fff; font-size:clamp(23px,3vw,34px); line-height:1.15; }
.pd-identity p { margin:4px 0 0; color:#e1ebf8; font-size:13px; }
.pd-identity .pd-handle { color:#abd7ff; }
.pd-identity .pd-bio { max-width:56ch; overflow-wrap:anywhere; }
.pd-hero-bottom { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-top:12px; }
.pd-hero-bottom small { color:#e1ebf8; }
:root .pd-hero button { background:#12294be6; border-color:#a8c9ef7a; color:#fff; }
.pd-league { display:inline-flex; align-items:center; gap:7px; padding:4px 8px 4px 5px; border:1px solid #b6d2f16b; background:#102544; border-radius:10px; color:#fff; }
.pd-league img { display:block; width:43px; height:auto; }
.pd-league b { display:block; font-size:12px; margin-top:2px; }
.pd-emblem { width:28px; height:31px; display:grid; place-items:center; background:hsl(var(--badge-hue,218) 65% 80%); color:#162b48; clip-path:polygon(50% 0,95% 18%,95% 68%,50% 100%,5% 68%,5% 18%); }
.pd-emblem .ico { width:17px; height:17px; }
.pd-panel { min-width:0; padding:13px; background:var(--s1); border:1px solid var(--line); border-radius:12px; }
:root .pd-panel h3 { display:flex; align-items:center; gap:6px; margin:0 0 7px; font-size:16px; line-height:1.25; }
:root .pd-panel .pd-subheading { margin-top:14px; }
.pd-panel p { color:var(--mute); font-size:13px; margin:6px 0; }
:root .profile-dashboard button { min-height:42px; padding:6px 9px; font-size:13px; }
.pd-stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); padding:8px; }
.pd-stats > div { display:flex; justify-content:center; align-items:center; gap:7px; border-inline-start:1px solid var(--line); padding:4px; }
.pd-stats > div:first-child { border:0; }
.pd-stats b,.pd-stats small { display:block; }
.pd-stats b { font-size:17px; line-height:1.2; font-variant-numeric:tabular-nums; }
.pd-stats small,.pd-list small { color:var(--mute); font-size:12px; }
.pd-stats .ico,.pd-panel h3 .ico { width:18px; height:18px; flex:none; color:var(--ind); }
.pd-tabs { display:flex; flex-wrap:wrap; gap:6px; }
:root .pd-tabs button { display:inline-flex; align-items:center; gap:6px; color:var(--ink); background:var(--s1); }
:root .pd-tabs button[aria-pressed="true"] { background:#155bb4; border-color:#155bb4; color:#fff; }
.pd-tabs .ico { width:16px; height:16px; }
.pd-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,240px); gap:10px; align-items:start; }
.pd-content { min-width:0; }
.pd-grid,.pd-rail { display:grid; gap:10px; }
.pd-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.profile-dashboard [hidden] { display:none!important; }
.pd-accuracy { display:flex; align-items:baseline; gap:7px; }
.pd-accuracy b { font-size:24px; }
.pd-accuracy small { color:var(--mute); }
.pd-subjects { display:grid; gap:4px; margin:6px 0 10px; }
.pd-subjects > div { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:4px 6px; font-size:12px; }
.pd-subjects svg { width:16px; height:16px; color:var(--ind); }
.pd-subjects progress { grid-column:2/4; width:100%; height:6px; accent-color:#155bb4; }
.pd-match-strip,.pd-list,.pd-streak { padding:0; margin:8px 0; list-style:none; }
.pd-match-strip,.pd-friends { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0; }
.pd-match-strip li,.pd-friends > span { width:29px; height:29px; display:grid; place-items:center; border-radius:50%; background:var(--s2); color:var(--ink); }
.pd-match-strip li[data-result="Won"] { background:#14664e; color:#fff; }
.pd-match-strip li[data-result="Lost"] { background:#963b52; color:#fff; }
.pd-match-strip .ico,.pd-list .ico,.pd-streak .ico { width:15px; height:15px; }
.pd-list li { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:6px; padding:7px 0; border-top:1px solid var(--line); font-size:13px; }
.pd-list small { display:block; }
.pd-list .ico { color:var(--ind); }
.pd-streak { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.pd-streak li { display:grid; justify-items:center; gap:3px; }
.pd-streak span { display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--s2); border:1px solid var(--line2); }
.pd-streak span.is-active { background:#14664e; color:#fff; border-color:#14664e; }
.pd-streak small { font-size:10px; color:var(--mute); }
@media(max-width:1050px) {
 .pd-layout { grid-template-columns:minmax(0,1fr); }
 .pd-rail { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:620px) {
 .pd-hero { padding:12px; }
 .pd-identity { grid-template-columns:auto minmax(0,1fr); gap:8px; }
 .pd-identity button { grid-column:2; justify-self:start; }
 .pd-avatar { width:52px; height:52px; }
 .pd-grid,.pd-rail { grid-template-columns:minmax(0,1fr); }
 .pd-stats > div { flex-direction:column; text-align:center; gap:3px; }
 .pd-stats b { font-size:14px; }
 .pd-stats small { font-size:11px; }
 :root .pd-tabs button { min-height:44px; }
}

.pd-badge-collection { margin:8px 0 12px; }
.pd-badge-collection summary { cursor:pointer; color:var(--ink); font-weight:650; }
.pd-badge-collection ol { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr)); gap:8px; padding:0; list-style:none; }
.pd-badge-collection li { display:grid; gap:4px; align-content:start; padding:6px; border:1px solid var(--line); border-radius:9px; }
.pd-badge-collection li[aria-current="true"] { border-color:var(--ind); }
.pd-badge-collection li small { color:var(--mute); font-size:12px; }
.pd-badge-collection .pd-league { justify-self:start; }

#avatarCrop { display:grid; gap:8px; }
#avatarCrop h3,#avatarCrop p { margin:0; }
#avatarCrop #avatarCanvas { width:min(100%,220px,34dvh); aspect-ratio:1; margin:0 auto; }
#avatarCrop label { display:grid; gap:3px; margin:0; }
#avatarCrop input[type="range"] { margin:0; min-height:32px; }
.avatar-actions { display:flex; flex-wrap:wrap; gap:6px; }
:root .in[data-page="public-profile"] #center { grid-column:2/-1; min-width:0; }
:root .in[data-page="public-profile"] #right,
body[data-page="public-profile"] > .hero { display:none; }
:root .pd-hero.pd-creator {
  padding:0;
  background:var(--s1);
  color:var(--ink);
  border-color:var(--line);
}
.pd-creator::before,.pd-creator::after { display:none; }
.pd-banner {
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:clamp(142px,20vw,220px);
  padding:52px 16px 40px;
  overflow:hidden;
  background:linear-gradient(var(--cover-angle,112deg),hsl(var(--badge-hue,218) 40% 28%),hsl(var(--badge-hue,218) 47% 54%));
  color:#fff;
}
.pd-banner strong {
  z-index:1;
  max-width:100%;
  text-align:center;
  font:800 clamp(25px,5.2vw,58px)/1.08 Sora,Inter,sans-serif;
  letter-spacing:-.03em;
  text-shadow:2px 3px 0 #101926;
  overflow-wrap:anywhere;
}
.pd-banner-pattern {
  position:absolute;
  inset:auto;
  width:130%;
  transform:rotate(-14deg);
  text-align:center;
  color:#fff;
  opacity:.2;
  font-size:clamp(62px,12vw,166px);
  font-weight:800;
  letter-spacing:.15em;
  white-space:nowrap;
}
.pd-cover-actions { display:flex; gap:6px; position:absolute; z-index:2; top:9px; right:9px; }
:root .pd-hero button.pd-cover-action {
  display:grid; place-items:center; width:42px; height:42px; min-height:42px; padding:0;
  color:#fff; background:#111c2ce0; border:1px solid #ffffff59;
}
.pd-cover-action .ico { width:19px; height:19px; }
.pd-creator .pd-identity { display:grid; grid-template-columns:minmax(0,1fr); padding:0 16px; gap:5px; }
.pd-creator .pd-avatar { position:relative; margin-top:-31px; border:3px solid var(--s1); }
:root .pd-creator .pd-identity h2 { color:var(--ink); }
.pd-creator .pd-identity p,.pd-creator .pd-hero-bottom small { color:var(--mute); }
.pd-creator .pd-identity .pd-handle { color:var(--ind); }
.pd-creator .pd-hero-bottom { padding:0 16px 12px; }
:root .profile-public-wrap { max-width:850px; }
:root .profile-public-card { padding:0; }
:root .profile-public-card .profile-person { position:relative; margin-top:-29px; }
:root .profile-public-card .profile-avatar { border-color:var(--s1); }
:root .profile-public-card .profile-username { overflow-wrap:anywhere; }
:root .profile-public-wrap .profile-back { display:inline-block; margin:0 0 9px; }
.profile-session { align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.profile-session small { display:block; color:var(--mute); overflow-wrap:anywhere; }
.profile-session > div { min-width:0; }
.online-player-id a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
:root dialog.meath-auth {
  width:min(440px,calc(100% - 24px)); max-height:calc(100dvh - 24px); padding:18px;
  border:1px solid var(--line2); background:var(--s1); color:var(--ink);
}
.meath-auth .auth-logo { display:block; width:90px; height:auto; margin:0 0 10px; }
:root[data-theme="light"] .meath-auth .auth-logo { filter:brightness(0) opacity(.85); }
.meath-auth h3 { margin:0 0 8px; }
.meath-auth label { display:block; margin-top:8px; color:var(--ink); }
.meath-auth input,.meath-auth select { width:100%; margin:3px 0 0; }
.meath-auth p { margin:7px 0; }
.meath-auth a { color:var(--ind); }
@media(max-width:620px) {
 .pd-banner { min-height:135px; padding:51px 10px 31px; }
 .pd-cover-actions { top:6px; right:6px; }
 .pd-creator .pd-identity,.pd-creator .pd-hero-bottom { padding-inline:12px; }
 .pd-creator .pd-avatar { width:64px; height:64px; }
 .pd-tabs { flex-wrap:nowrap; overflow-x:auto; padding:2px 1px 6px; }
 .pd-tabs button { flex:none; }
}

.pd-public-action { display:flex; align-items:center; gap:8px; }
.pd-public-stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
.pd-public .pd-list .subject-symbol svg { display:block; width:17px; height:17px; color:var(--ind); }
.pd-match-cards { display:grid; gap:6px; padding:0; margin:8px 0; list-style:none; }
.pd-match-card {
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center;
  gap:8px; min-width:0; padding:8px; border:1px solid var(--line);
  border-radius:12px; background:var(--s2);
}
.pd-match-avatar {
  display:grid; place-items:center; overflow:hidden; border-radius:50%;
  width:34px; height:34px; color:var(--ind); background:var(--s1);
}
.pd-match-avatar img { width:100%; height:100%; object-fit:cover; }
.pd-match-name { min-width:0; overflow-wrap:anywhere; }
.pd-match-name b,.pd-match-name small { display:block; }
.pd-match-name b,.pd-match-outcome b { font-size:13px; }
.pd-match-name small,.pd-score-key { color:var(--mute); font-size:12px; }
.pd-match-outcome { display:grid; justify-items:end; gap:2px; font-variant-numeric:tabular-nums; }
.pd-match-result { padding:2px 6px; border-radius:8px; background:var(--s1); color:var(--ink); font-size:11px; font-weight:700; }
.pd-match-result[data-result="Win"] { background:#14664e; color:#fff; }
.pd-match-result[data-result="Loss"] { background:#963b52; color:#fff; }
.pd-score-key { display:block; margin:0 0 7px; }

/* Compact cover and independent panel heights. */
.profile-dashboard{gap:12px}
.profile-dashboard .pd-grid{align-items:start}
.profile-dashboard .pd-recent-matches{grid-column:1/-1;grid-row:1}
:root .pd-hero.pd-creator{gap:0}
.pd-creator .pd-banner{min-height:140px;padding:22px 64px 22px 22px;justify-items:start}
.pd-cover-title{position:relative;display:grid;gap:4px;text-align:left;color:#fff}
.pd-cover-title small{font-size:11px;letter-spacing:.14em;font-weight:750}
.pd-cover-title strong{font-size:clamp(26px,3vw,46px);line-height:1.08;text-shadow:0 2px 10px #0b172b88}
.pd-creator .pd-banner-pattern{opacity:.12}
.pd-creator .pd-identity{grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:12px 16px}
.pd-creator .pd-avatar{margin-top:-32px;width:64px;height:64px}
.profile-dashboard .pd-match-card{padding:7px 10px}
:root .profile-account{max-width:none;margin:12px 0 0;padding:14px;display:grid;gap:8px}
.profile-account h3,.profile-account p{margin:0}
.profile-account p span{color:var(--mute);overflow-wrap:anywhere}
.profile-account-actions{display:flex;flex-wrap:wrap;gap:8px}
.profile-account details{border-top:1px solid var(--line);padding-top:8px}
.profile-account details[open] p{margin:6px 0}
@media(max-width:620px){
 .pd-creator .pd-banner{min-height:116px;padding:22px 96px 20px 12px}
 .pd-creator .pd-identity{padding:10px 12px;gap:8px}
 .pd-creator .pd-avatar{width:52px;height:52px;margin-top:-23px}
 .profile-dashboard .pd-tabs{flex-wrap:wrap;overflow:visible}
 .profile-dashboard .pd-tabs button{min-height:42px;padding:7px 9px;font-size:12px}
 .profile-account-actions button{min-height:44px}
}

.profile-dashboard .pd-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.profile-dashboard .pd-public-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:460px){
 .profile-dashboard .pd-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .profile-dashboard .pd-public-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
}
