/* Play2048 public player profile — page-scoped styles only. */
.p2048-profile { --profile-text:#eaf3ff; --profile-muted:#9db1ce; --profile-edge:rgba(159,192,235,.18); }
.p2048-profile .p2048-profile__heading { margin-bottom:22px; }
.p2048-profile .p2048-profile__hero { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:12px; min-height:360px; padding:42px 22px 34px; background:radial-gradient(ellipse at 50% -25%,rgba(76,121,203,.32),transparent 68%),linear-gradient(135deg,#17243d 0%,#101a2d 60%,#1d263e 100%); border:1px solid rgba(140,187,244,.26); border-radius:24px; color:var(--profile-text); }
.p2048-profile .p2048-profile__hero-glow { position:absolute; inset:0; pointer-events:none; z-index:-1; background:radial-gradient(circle at 50% 35%,rgba(38,193,198,.12),transparent 44%); }
.p2048-profile .p2048-profile__avatar { height:180px; width:180px; position:relative; border-radius:30px; background:#2b3950; padding:5px; box-shadow:0 0 0 1px rgba(240,248,255,.28),0 20px 44px rgba(0,0,0,.42); }
.p2048-profile .p2048-profile__avatar::before { content:""; position:absolute; inset:-6px; border:2px solid rgba(101,230,216,.45); border-radius:35px; pointer-events:none; }
.p2048-profile .p2048-profile__avatar img { display:block; height:100%; width:100%; object-fit:cover; border-radius:25px; }
.p2048-profile .p2048-profile__hero .eyebrow { color:#78e1d9; font-weight:800; letter-spacing:.14em; }
.p2048-profile .p2048-profile__name { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; margin:0; max-width:100%; overflow-wrap:anywhere; color:white; font-size:clamp(1.7rem,3.5vw,2.65rem); line-height:1.12; }
.p2048-profile .p2048-profile__flag { font-size:.72em; line-height:1; filter:drop-shadow(0 2px 6px rgba(0,0,0,.25)); }
.p2048-profile .p2048-profile__meta { margin:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; column-gap:11px; row-gap:3px; color:#b5c6dd; font-size:.88rem; }
.p2048-profile .p2048-profile__founder-badge { border:1px solid #d7b65c; border-radius:999px; padding:8px 15px; background:linear-gradient(105deg,#493517,#7a5a25,#493517); color:#ffedba; font-size:.75rem; letter-spacing:.11em; font-weight:900; }
.p2048-profile .p2048-profile__leaderboard { margin-top:8px; }
.p2048-profile .p2048-profile__stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin:18px 0; }
.p2048-profile .p2048-profile__stat { min-width:0; display:flex; flex-direction:column; gap:8px; padding:23px 20px; border:1px solid var(--profile-edge); border-radius:18px; background:linear-gradient(142deg,rgba(25,42,68,.96),rgba(16,28,48,.95)); }
.p2048-profile .p2048-profile__stat > span { font-size:.7rem; letter-spacing:.1em; font-weight:800; color:#9ddcda; }
.p2048-profile .p2048-profile__stat > strong { font-size:clamp(1.35rem,2vw,2.1rem); line-height:1.2; font-variant-numeric:tabular-nums; color:#fff; overflow-wrap:anywhere; }
.p2048-profile .p2048-profile__stat > small { font-size:.78rem; color:#acc0d7; line-height:1.45; }
.p2048-profile .p2048-profile__section { width:100%; min-width:0; padding:24px; margin:18px 0; border:1px solid var(--profile-edge); border-radius:20px; }
.p2048-profile .p2048-profile__section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; }
.p2048-profile .p2048-profile__section-heading h2 { margin:5px 0 0; font-size:clamp(1.25rem,2vw,1.7rem); }
.p2048-profile .p2048-profile__subheading { color:var(--profile-muted); font-size:.8rem; text-align:right; }
.p2048-profile .p2048-profile__table-wrap { overflow-x:auto; max-width:100%; border-radius:12px; border:1px solid var(--profile-edge); }
.p2048-profile .p2048-profile__table { border-collapse:collapse; width:100%; min-width:760px; font-size:.88rem; }
.p2048-profile .p2048-profile__table th,.p2048-profile .p2048-profile__table td { text-align:left; padding:14px 13px; border-bottom:1px solid var(--profile-edge); white-space:nowrap; }
.p2048-profile .p2048-profile__table th { color:var(--profile-muted); font-weight:800; font-size:.71rem; letter-spacing:.08em; text-transform:uppercase; background:rgba(57,84,121,.14); }
.p2048-profile .p2048-profile__table tbody tr:last-child td { border-bottom:0; }
.p2048-profile .p2048-profile__table tbody tr:hover { background:rgba(100,143,190,.08); }
.p2048-profile .p2048-profile__table td strong { font-variant-numeric:tabular-nums; }
.p2048-profile .p2048-profile__mode { display:inline-block; padding:5px 10px; border:1px solid rgba(116,197,210,.28); border-radius:999px; color:#89dcd7; background:rgba(60,172,184,.08); font-size:.77rem; font-weight:700; }
.p2048-profile .p2048-profile__result { color:#b7c9df; font-size:.82rem; }
.p2048-profile .p2048-profile__chart-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:24px; }
.p2048-profile .p2048-profile__chart-heading h3 { margin:0; font-size:1rem; }
.p2048-profile .p2048-profile__chart-heading span { color:var(--profile-muted); font-size:.76rem; }
.p2048-profile .p2048-profile__chart { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); align-items:end; min-height:154px; gap:12px; padding:14px 9px 0; border-bottom:1px solid var(--profile-edge); }
.p2048-profile .p2048-profile__bar-item { display:flex; flex-direction:column; height:140px; justify-content:flex-end; align-items:center; }
.p2048-profile .p2048-profile__bar { display:block; width:min(100%,55px); min-height:0; background:linear-gradient(0deg,#338a9d,#65e0bd); border-radius:8px 8px 0 0; }
.p2048-profile .p2048-profile__bar-item small { height:19px; padding-top:3px; color:var(--profile-muted); font-size:.72rem; }
.p2048-profile .p2048-profile__tiles { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.p2048-profile .p2048-profile__tile-item { display:flex; align-items:center; flex-direction:column; gap:9px; min-width:0; padding:10px; border:1px solid var(--profile-edge); border-radius:15px; background:rgba(91,126,162,.06); }
.p2048-profile .p2048-profile__tile { width:min(100%,112px); aspect-ratio:1; display:flex; align-items:center; justify-content:center; padding:5px; border-radius:13px; color:#372b25; text-shadow:none; box-shadow:inset 0 -5px 0 rgba(0,0,0,.1),0 7px 17px rgba(0,0,0,.16); }
.p2048-profile .p2048-profile__tile strong { font-size:clamp(.85rem,1.5vw,1.18rem); letter-spacing:-.04em; font-weight:900; font-variant-numeric:tabular-nums; }
.p2048-profile .p2048-profile__tile-item > span { font-weight:800; color:inherit; font-variant-numeric:tabular-nums; }
.p2048-profile .p2048-profile__tile-item > span small { color:var(--profile-muted); font-weight:500; }
.p2048-profile .p2048-profile__tile--4 { background:#ede0c8; }
.p2048-profile .p2048-profile__tile--8 { background:#f2b179; color:#fff; }
.p2048-profile .p2048-profile__tile--16 { background:#f59563; color:#fff; }
.p2048-profile .p2048-profile__tile--32 { background:#f67c5f; color:#fff; }
.p2048-profile .p2048-profile__tile--64 { background:#f65e3b; color:#fff; }
.p2048-profile .p2048-profile__tile--128 { background:#edcf72; color:#fff; }
.p2048-profile .p2048-profile__tile--256 { background:#edcc61; color:#fff; }
.p2048-profile .p2048-profile__tile--512 { background:#edc850; color:#fff; }
.p2048-profile .p2048-profile__tile--1024 { background:#edc53f; color:#fff; }
.p2048-profile .p2048-profile__tile--2048 { background:#edc22e; color:#fff; }
.p2048-profile .p2048-profile__tile--4096 { background:#9d83e0; color:#fff; }
.p2048-profile .p2048-profile__tile--8192 { background:#6379da; color:#fff; }
.p2048-profile .p2048-profile__tile--16384 { background:#267eae; color:#fff; }
.p2048-profile .p2048-profile__tile--32768 { background:#168d7a; color:#fff; }
.p2048-profile .p2048-profile__tile--65536 { background:#b44486; color:#fff; box-shadow:inset 0 -5px 0 rgba(0,0,0,.12),0 0 24px rgba(180,68,134,.32); }
.p2048-profile .p2048-profile__tile-note { margin:20px 0 5px; color:var(--profile-muted); line-height:1.6; font-size:.8rem; }
.p2048-profile .p2048-profile__milestones { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.p2048-profile .p2048-profile__milestone { min-width:0; display:flex; align-items:center; gap:12px; padding:14px; border-radius:14px; border:1px solid var(--profile-edge); background:rgba(53,77,106,.1); }
.p2048-profile .p2048-profile__milestone.is-achieved { border-color:rgba(68,210,171,.33); background:linear-gradient(100deg,rgba(26,132,110,.16),rgba(48,87,113,.08)); }
.p2048-profile .p2048-profile__milestone-symbol { flex:none; width:39px; height:39px; border-radius:11px; display:grid; place-items:center; font-size:1.2rem; background:rgba(127,149,175,.16); color:#8fa5bb; }
.p2048-profile .p2048-profile__milestone.is-achieved .p2048-profile__milestone-symbol { background:rgba(43,186,135,.22); color:#64e2b7; }
.p2048-profile .p2048-profile__milestone > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.p2048-profile .p2048-profile__milestone strong { font-size:.85rem; overflow-wrap:anywhere; }
.p2048-profile .p2048-profile__milestone small { font-size:.74rem; color:var(--profile-muted); }
.p2048-profile .p2048-profile__milestone-state { color:var(--profile-muted); white-space:nowrap; font-size:.72rem; }
.p2048-profile .p2048-profile__milestone.is-achieved .p2048-profile__milestone-state { color:#64e2b7; }
.p2048-profile .p2048-profile__notice { padding:20px; }
@media (max-width:1200px) { .p2048-profile .p2048-profile__stats { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:1050px) { .p2048-profile .p2048-profile__stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .p2048-profile .p2048-profile__milestones { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:740px) { .p2048-profile .p2048-profile__section { padding:18px 14px; } .p2048-profile .p2048-profile__tiles { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; } .p2048-profile .p2048-profile__milestones { grid-template-columns:1fr; } .p2048-profile .p2048-profile__section-heading { flex-direction:column; align-items:flex-start; } .p2048-profile .p2048-profile__subheading { text-align:left; } }
@media (max-width:480px) { .p2048-profile .p2048-profile__hero { padding:36px 12px 30px; } .p2048-profile .p2048-profile__avatar { width:150px; height:150px; } .p2048-profile .p2048-profile__stats { gap:9px; } .p2048-profile .p2048-profile__stat { padding:18px 12px; } .p2048-profile .p2048-profile__stat > strong { font-size:1.35rem; } .p2048-profile .p2048-profile__tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } .p2048-profile .p2048-profile__milestone { flex-wrap:wrap; } }
@media (prefers-reduced-motion:reduce) { .p2048-profile *, .p2048-profile *::before, .p2048-profile *::after { animation:none !important; transition:none !important; } }

@media (max-width:480px) { .p2048-profile .p2048-profile__chart { gap:5px; padding-left:0; padding-right:0; } .p2048-profile .p2048-profile__bar-item small { font-size:.63rem; } }

/* Light theme; tile colours remain part of the game identity. */
.p2048-profile{--profile-text:#2a261f;--profile-muted:#756e65;--profile-edge:rgba(92,75,52,.16)}
.p2048-profile .p2048-profile__hero{background:radial-gradient(ellipse at 50% -25%,rgba(229,138,58,.14),transparent 64%),linear-gradient(135deg,#fffaf2 0%,#f5efe5 62%,#edf6f2 100%);border-color:#ddd2c2;color:#2a261f;box-shadow:0 14px 36px rgba(76,61,43,.06)}
.p2048-profile .p2048-profile__hero-glow{background:radial-gradient(circle at 50% 35%,rgba(79,169,149,.10),transparent 44%)}
.p2048-profile .p2048-profile__avatar{background:#fff;padding:5px;box-shadow:0 13px 30px rgba(70,55,36,.13)}
.p2048-profile .p2048-profile__avatar::after{border-color:rgba(79,169,149,.42)}
.p2048-profile .p2048-profile__hero .eyebrow{color:#8c5b29}
.p2048-profile .p2048-profile__name{color:#2a261f}
.p2048-profile .p2048-profile__flag{filter:drop-shadow(0 2px 5px rgba(0,0,0,.12))}
.p2048-profile .p2048-profile__meta{color:#716a61}
.p2048-profile .p2048-profile__founder-badge{border-color:#d7b65c;background:linear-gradient(105deg,#fff0c9,#f4d88c,#fff0c9);color:#614511}
.p2048-profile .p2048-profile__stat{border-color:var(--profile-edge);background:#fff;box-shadow:0 8px 24px rgba(76,61,43,.04)}
.p2048-profile .p2048-profile__stat>span{color:#8f5e2f}
.p2048-profile .p2048-profile__stat>strong{color:#2b2721}
.p2048-profile .p2048-profile__stat>small{color:#756e65}
.p2048-profile .p2048-profile__section{background:#fff;border-color:var(--profile-edge);box-shadow:0 8px 24px rgba(76,61,43,.035)}
.p2048-profile .p2048-profile__table th{color:#70695f;background:#f5f1ea}
.p2048-profile .p2048-profile__table tbody tr:hover{background:#fcf8f2}
.p2048-profile .p2048-profile__mode{border-color:#b9d9d1;color:#337b6d;background:#eef7f4}
.p2048-profile .p2048-profile__result{color:#6f685f}
.p2048-profile .p2048-profile__bar{background:linear-gradient(0deg,#d9772a,#56ad98)}
.p2048-profile .p2048-profile__tile-item{background:#faf7f1}
.p2048-profile .p2048-profile__milestone{background:#faf7f1}
.p2048-profile .p2048-profile__milestone.is-achieved{border-color:#b8dbc9;background:linear-gradient(100deg,#edf8f2,#f7fbf9)}
.p2048-profile .p2048-profile__milestone-symbol{background:#eee9e1;color:#80786d}
.p2048-profile .p2048-profile__milestone.is-achieved .p2048-profile__milestone-symbol{background:#dff2e8;color:#2f805c}
.p2048-profile .p2048-profile__milestone.is-achieved .p2048-profile__milestone-state{color:#2f805c}