.player-profile { --profile-accent:#285a72; --profile-accent-dark:#204b61; --profile-accent-soft:#eaf1f5; --profile-border:#dce4e9; --profile-heading:#26343d; --profile-muted:#65737c; background:#f5f8fa; color:var(--profile-heading); margin:91px -12px 0; min-height:70vh; padding:1.5rem .75rem 3rem; }
.player-profile *, .player-profile *::before, .player-profile *::after { box-sizing:border-box; }
.player-profile__container { margin:0 auto; max-width:1056px; }
.player-profile__hero, .player-profile__panel { background:#fff; border:1px solid var(--profile-border); border-radius:10px; box-shadow:0 10px 28px rgba(35,57,69,.06); }
.player-profile__hero { align-items:center; display:grid; gap:1.35rem; grid-template-columns:76px minmax(0,1fr); margin-bottom:1.5rem; padding:1.2rem; }
.player-profile__photo-link { border-radius:50%; display:block; height:76px; width:76px; }
.player-profile__photo { background:var(--profile-accent-soft); border:2px solid #d5e2e9; border-radius:50%; display:block; height:76px; object-fit:cover; width:76px; }
.player-profile__identity { min-width:0; }.player-profile__eyebrow { color:var(--profile-accent); font-family:Montserrat,Arial,sans-serif; font-size:.75rem; font-weight:700; letter-spacing:.08em; margin:0 0 .25rem; text-transform:uppercase; }
.player-profile h1, .player-profile h2, .player-profile h3 { color:var(--profile-heading); font-family:Montserrat,Arial,sans-serif; font-weight:700; }
.player-profile h1 { font-size:clamp(1.75rem,4vw,2.5rem); line-height:1.15; margin:0; }.player-profile__meta { color:var(--profile-muted); display:flex; flex-wrap:wrap; font-size:.9rem; gap:.45rem 1.15rem; margin-top:.65rem; }.player-profile__meta span { align-items:center; display:inline-flex; gap:.35rem; }.player-profile__meta i { color:#80929d; }.player-profile__club-logo { flex:0 0 18px; height:18px; object-fit:contain; width:18px; }
.player-profile__button { align-items:center; background:var(--profile-accent); border:1px solid var(--profile-accent); border-radius:8px; color:#fff; display:inline-flex; font-family:Montserrat,Arial,sans-serif; font-size:.82rem; font-weight:700; gap:.5rem; justify-content:center; min-height:42px; padding:.65rem .9rem; text-decoration:none; }.player-profile__button:hover { background:var(--profile-accent-dark); border-color:var(--profile-accent-dark); color:#fff; }
.player-profile__two-columns { display:grid; gap:1rem; grid-template-columns:1fr; }.player-profile__panel { margin-bottom:1rem; padding:1.2rem; }.player-profile__section-header { align-items:center; border-bottom:1px solid #e6ecef; display:flex; gap:.85rem; margin-bottom:1.25rem; padding-bottom:1rem; }.player-profile__section-header h2, .player-profile__rivals h2 { font-size:1.15rem; line-height:1.3; margin:0; }.player-profile__section-icon { align-items:center; background:var(--profile-accent-soft); border-radius:9px; color:var(--profile-accent); display:flex; flex:0 0 44px; height:44px; justify-content:center; width:44px; }
.player-profile__details { margin:0; }.player-profile__details > div { align-items:start; border-bottom:1px solid #edf1f3; display:grid; gap:.75rem; grid-template-columns:minmax(105px,.85fr) minmax(0,1.15fr); padding:.8rem 0; }.player-profile__details > div:first-child { padding-top:0; }.player-profile__details > div:last-child { border-bottom:0; padding-bottom:0; }.player-profile__details dt { color:var(--profile-muted); font-size:.84rem; font-weight:600; }.player-profile__details dd { color:var(--profile-heading); font-weight:700; margin:0; }.player-profile__details a, .player-profile__metric a, .player-profile__login-notice a { color:var(--profile-accent); text-decoration:none; }.player-profile__empty-value { color:#89969e; font-style:italic; font-weight:400; }
.player-profile__metrics, .player-profile__metrics--three { display:grid; gap:.75rem; grid-template-columns:repeat(2,minmax(0,1fr)); }.player-profile__metric { background:#f7f9fa; border:1px solid #e1e8ec; border-radius:10px; display:flex; flex-direction:column; gap:.35rem; min-height:98px; padding:1rem; }.player-profile__metric span { color:var(--profile-muted); font-size:.82rem; line-height:1.3; }.player-profile__metric strong, .player-profile__metric a { color:var(--profile-heading); font-family:Montserrat,Arial,sans-serif; font-size:1.3rem; font-weight:700; line-height:1.2; }.player-profile__metric a { color:var(--profile-accent); }.player-profile__metric small { font-size:.7em; }.player-profile__metric--linked { background:#f1f6f8; border-color:#d7e4ea; }
.player-profile__rankings { display:grid; gap:.8rem; grid-template-columns:1fr; }.player-profile__ranking-card { border:1px solid #dbe5ea; border-radius:10px; overflow:hidden; }.player-profile__ranking-card h3 { background:var(--profile-accent-soft); color:var(--profile-accent); font-size:.92rem; margin:0; padding:.75rem .9rem; text-transform:capitalize; }.player-profile__ranking-card dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; }.player-profile__ranking-card dl > div { padding:.85rem .9rem; }.player-profile__ranking-card dt { color:var(--profile-muted); font-size:.76rem; margin-bottom:.25rem; }.player-profile__ranking-card dd { color:var(--profile-heading); font-size:1.05rem; font-weight:700; margin:0; }.player-profile__empty-state { color:var(--profile-muted); padding:1.75rem 1rem; text-align:center; }.player-profile__empty-state i { color:#9badb7; font-size:1.65rem; }.player-profile__empty-state p { font-weight:600; margin:.65rem 0 0; }
.player-profile__podiums { display:grid; gap:.75rem; grid-template-columns:1fr; }.player-profile__podiums article { align-items:center; background:#f7f9fa; border:1px solid #e1e8ec; border-radius:10px; display:grid; gap:.75rem; grid-template-columns:36px minmax(0,1fr) auto; padding:.9rem; }.player-profile__podiums img { height:36px; object-fit:contain; width:36px; }.player-profile__podiums span { color:var(--profile-muted); font-size:.86rem; }.player-profile__podiums strong { font-size:1.25rem; }
.player-profile__score-groups { display:grid; gap:1rem; grid-template-columns:1fr; }.player-profile__score-group { background:#f7f9fa; border:1px solid #e1e8ec; border-radius:10px; padding:1rem; }.player-profile__score-group h3 { font-size:.95rem; margin:0 0 .55rem; }.player-profile__score-group dl { margin:0; }.player-profile__score-group dl > div { align-items:center; border-bottom:1px solid #e1e8ec; display:flex; gap:1rem; justify-content:space-between; padding:.55rem 0; }.player-profile__score-group dl > div:last-child { border-bottom:0; }.player-profile__score-group dt { color:var(--profile-muted); font-size:.82rem; }.player-profile__score-group dd { font-weight:700; margin:0; }
.player-profile__rivals { align-items:stretch; display:flex; flex-direction:column; gap:1.5rem; justify-content:space-between; }.player-profile__hero .player-profile__button { grid-column:1 / -1; justify-self:stretch; width:100%; }.player-profile__rivals .player-profile__button { width:100%; }.player-profile__rivals p:last-child { color:var(--profile-muted); margin:.4rem 0 0; }.player-profile__message-form textarea { border:1px solid #cbd8df; border-radius:8px; display:block; margin-bottom:.85rem; min-height:120px; padding:.75rem; resize:vertical; width:100%; }.player-profile__message-form textarea:focus { border-color:#6f9bb0; box-shadow:0 0 0 .2rem rgba(40,90,114,.14); outline:0; }.player-profile__message-form .errorlist { background:#fff2f1; border:1px solid #efc4c1; border-radius:8px; color:#a12622; list-style:none; margin:0 0 .8rem; padding:.7rem .85rem; }.player-profile__message-form button { cursor:pointer; }
.player-profile__login-notice { align-items:center; background:#f4f8fa; border:1px solid #dbe6eb; border-radius:9px; color:var(--profile-muted); display:flex; gap:.9rem; padding:1rem; }.player-profile__login-notice > i { color:var(--profile-accent); font-size:1.2rem; }.player-profile__login-notice strong { color:var(--profile-heading); }.player-profile__login-notice p { margin:.2rem 0 0; }.player-profile__messages { display:flex; flex-direction:column; }.player-profile__message { border-bottom:1px solid #e6ecef; display:grid; gap:1rem; grid-template-columns:52px minmax(0,1fr); padding:1.1rem 0; }.player-profile__message:first-child { padding-top:0; }.player-profile__message:last-child { border-bottom:0; padding-bottom:0; }.player-profile__message-avatar-link, .player-profile__message-avatar { border-radius:50%; height:42px; width:42px; }.player-profile__message-avatar { border:1px solid var(--profile-border); object-fit:cover; }.player-profile__message-body header { align-items:baseline; display:flex; flex-wrap:wrap; gap:.35rem .8rem; }.player-profile__message-body header a { color:var(--profile-heading); font-weight:700; text-decoration:none; }.player-profile__message-body time { color:var(--profile-muted); font-size:.78rem; }.player-profile__message-text p { color:#46565f; line-height:1.6; margin:.55rem 0 0; }.player-profile__delete-message { color:#9a302b; display:inline-block; font-size:.8rem; margin-top:.55rem; text-decoration:none; }
.player-profile__button:focus-visible, .player-profile__photo-link:focus-visible, .player-profile__message-avatar-link:focus-visible { outline:3px solid rgba(40,90,114,.28); outline-offset:3px; }
@media (min-width:601px) { .player-profile { padding:3rem 1rem 4rem; }.player-profile__hero, .player-profile__panel { border-radius:13px; }.player-profile__hero { grid-template-columns:96px minmax(0,1fr); padding:1.75rem 2rem; }.player-profile__photo, .player-profile__photo-link { height:96px; width:96px; }.player-profile__hero .player-profile__button { grid-column:1 / -1; justify-self:start; }.player-profile__two-columns, .player-profile__score-groups { grid-template-columns:repeat(2,minmax(0,1fr)); }.player-profile__panel { padding:1.5rem; }.player-profile__details > div { gap:1rem; grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr); }.player-profile__rankings { grid-template-columns:repeat(2,minmax(0,1fr)); }.player-profile__podiums { grid-template-columns:repeat(3,minmax(0,1fr)); }.player-profile__rivals { align-items:center; flex-direction:row; }.player-profile__rivals .player-profile__button { width:auto; } }
@media (min-width:901px) { .player-profile__hero { grid-template-columns:128px minmax(0,1fr) auto; }.player-profile__photo, .player-profile__photo-link { height:128px; width:128px; }.player-profile__hero .player-profile__button { grid-column:auto; justify-self:auto; }.player-profile__metrics { grid-template-columns:repeat(4,minmax(0,1fr)); }.player-profile__metrics--three { grid-template-columns:repeat(3,minmax(0,1fr)); }.player-profile__rankings { grid-template-columns:repeat(3,minmax(0,1fr)); } }
