/* Shared visual language for player search, rankings and profiles. */
.site-experience { --bg:#0a0a0c; --bg-2:#08080a; --card:#111114; --card-2:#16161b; --raise:#1c1c22; --ink:#efe9dd; --dim:#9d968a; --faint:#898377; --gold:#ffb800; --gold-hi:#ffd166; --line:rgba(255,255,255,.09); --line-2:rgba(255,184,0,.22); --hair:rgba(255,255,255,.065); --r:8px; background:var(--bg); }
.site-experience::before { background:radial-gradient(ellipse at 85% 0%,rgba(255,184,0,.055),transparent 55%); animation:none; mask-image:none; }
.site-experience .site-head { background:rgba(10,10,12,.94); border-color:var(--line); backdrop-filter:blur(12px); }
.site-experience .site-nav a { font-size:12px; padding-bottom:3px; }
.site-experience .site-nav a.on { color:var(--ink); }
.site-experience .site-nav a::after { background:var(--gold); }
.site-experience .btn { border-radius:5px; }
.site-experience .btn::before { display:none; }
.site-experience .btn--primary { background:var(--gold); color:#100f0b; border-color:var(--gold); box-shadow:none; }
.site-experience .btn--primary:hover { background:var(--gold-hi); }
.site-experience .head-user .btn { background:transparent; color:var(--dim); border-color:var(--line); }
.site-experience .page-head { padding:40px 0 30px; }
.site-experience .page-head h1 { font-size:clamp(32px,4vw,48px); letter-spacing:-.045em; }
.site-experience .page-head p { color:var(--dim); max-width:620px; font-size:13px; }
.site-experience .page-head .okruchy { color:var(--gold); font:10px var(--mono); text-transform:uppercase; letter-spacing:.12em; margin-bottom:14px; }
.site-experience .card { box-shadow:0 14px 40px #0002; border-color:var(--line); transform:none; }
.site-experience .card:hover { transform:none; border-color:var(--line-2); }
.site-experience .card::after { display:none; }
.site-experience .card-head { padding:18px 21px; }
.site-experience .card-head h2, .site-experience .card-head h3 { font-size:14px; letter-spacing:-.015em; }
.site-experience .card__body { padding:21px; }
.site-experience .blank { color:var(--faint); font-size:12px; }
.site-experience .blank strong { color:var(--dim); font-weight:500; }
.site-experience .site-foot { background:var(--bg); margin-top:56px; padding:30px 0; border-color:var(--line); }
.site-experience .foot-grid { display:block; }
.site-experience .foot-grid > :not(.foot-brand) { display:none; }
.site-experience .foot-brand { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-experience .foot-brand p { margin:0; font-size:10px; text-align:right; }
.site-experience .foot-brand p br, .site-experience .foot-brand p a { display:none; }
.site-experience a:focus-visible, .site-experience button:focus-visible, .site-experience summary:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
.site-experience .suggest { background:#17171b; border-color:var(--line-2); border-radius:7px; box-shadow:0 18px 45px #0008; padding:6px; }
.site-experience .suggest a { padding:12px 14px; border:0; border-radius:4px; gap:12px; color:var(--ink); }
.site-experience .suggest a.on, .site-experience .suggest a:hover { background:#28251e; color:var(--gold); }
.search-feedback { min-height:1.5em; margin-top:9px; color:var(--dim); font-size:11px; }
.search-feedback:empty { display:none; }
.site-experience .search[aria-busy=true] input { cursor:progress; }
.site-experience .zestawienia { margin-bottom:25px; padding:18px 20px; border:1px solid var(--line); border-radius:8px; background:var(--card); }
.site-experience .zestawienia__grupa { gap:12px; }
.site-experience .zestawienia__nazwa { color:var(--faint); font-size:10px; }
.site-experience .tabbar { flex-wrap:wrap; }
.site-experience .tabbar a { border-radius:4px; font-size:11px; padding:7px 10px; }
.site-experience .tabbar a.on { background:#2b2519; color:var(--gold); border-color:transparent; }
.site-experience .rank-layout { grid-template-columns:230px minmax(0,1fr); gap:24px; }
.site-experience .champion { background:radial-gradient(ellipse at 50% 35%,#ffb80015,transparent 65%),var(--card); padding:26px 18px; }
.site-experience .champion .body { filter:drop-shadow(0 12px 12px #0005); }
.site-experience .champion h3 { font-size:18px; overflow-wrap:anywhere; }
.site-experience table.rank { table-layout:auto; }
.site-experience table.rank thead th { padding:12px 18px; background:#0e0e11; color:var(--faint); font-size:10px; }
.site-experience table.rank td { padding:14px 18px; border-color:var(--line); }
.site-experience table.rank tbody tr:hover td { background:#1e1d19; }
.site-experience table.rank .who { min-width:0; }
.site-experience table.rank .who a { color:var(--ink); overflow-wrap:anywhere; }
.site-experience .medal--1 { background:#ffb8001c; color:var(--gold); }
.site-experience .medal--1::after { display:none; }
.site-experience .strony { padding:18px; border-top:1px solid var(--line); }
.experience-back { display:inline-flex; align-items:center; gap:8px; color:var(--faint); font-size:11px; margin:28px 0 18px; }
.experience-back:hover { color:var(--ink); }
.site-experience .profile-head { position:relative; display:grid; grid-template-columns:120px minmax(0,1fr) auto; gap:30px; align-items:center; padding:34px 30px; background:radial-gradient(ellipse at 8% 65%,#ffb80014,transparent 55%),var(--card); overflow:visible; }
.site-experience .profile-head::before { content:""; position:absolute; left:0; top:20%; bottom:20%; width:2px; background:linear-gradient(transparent,var(--gold),transparent); pointer-events:none; }
.site-experience .profile-head > .body { width:88px; justify-self:center; filter:drop-shadow(0 10px 12px #0007); }
.site-experience .profile-head h1 { font-size:clamp(28px,4vw,46px); letter-spacing:-.045em; overflow-wrap:anywhere; }
.site-experience .profile-meta { margin-top:13px; gap:7px; }
.site-experience .profile-meta .faint { width:100%; font-size:11px; margin-top:4px; }
.site-experience .profile-actions { display:flex; flex-direction:column; gap:8px; }
.site-experience .profile-actions .btn { font-size:11px; }
.site-experience .pozycje { margin:20px 0; gap:12px; }
.site-experience .pozycja { border-radius:6px; background:var(--card); border:1px solid var(--line); padding:16px 18px; }
.site-experience .pozycja:hover { border-color:var(--line-2); background:#242119; }
.site-experience .hud { gap:12px; border:0; background:transparent; }
.site-experience .hud > div { border:1px solid var(--line); border-radius:7px; background:var(--card); padding:21px; }
.site-experience .hud .v { font-size:clamp(18px,2.2vw,28px); }
.site-experience .hud .k { font-size:10px; letter-spacing:.05em; }
.site-experience .skills { border:0; border-radius:0; background:transparent; gap:10px; }
.site-experience .skills li { position:relative; padding:17px; border:1px solid var(--line); border-radius:6px; background:#101013; }
.site-experience .skills li::after { display:none; }
.site-experience .skills li:not(.zero)::before { content:""; position:absolute; left:17px; right:17px; bottom:0; height:2px; background:var(--gold); opacity:.45; transform:scaleX(var(--skill-ratio,0)); transform-origin:left; }
.site-experience .skills li:hover { transform:translateY(-3px); border-color:var(--line-2); }
.site-experience .skills .name { color:var(--dim); }
.site-experience .skills .xp { display:block; margin:6px 0 0; }
.site-experience .nick-form input { background:#101013; border-color:var(--line-2); border-radius:5px; }
.site-experience .profile-page { padding-bottom:12px; }
.dashboard-rank[aria-busy=true] .dashboard-table, .dashboard-rank[aria-busy=true] .dashboard-empty { opacity:.4; transition:opacity .15s; }
.dashboard-tabs a.is-pending { color:var(--gold); }
@media (prefers-reduced-motion:no-preference) {
 .site-experience .page-head, .site-experience .profile-head { animation:experience-arrive .45s ease-out both; }
 .site-experience .profile-head > .body { animation:experience-avatar 7s ease-in-out infinite; }
 .dashboard-rank[aria-busy=true]::before { animation:experience-loading 1s ease-in-out infinite alternate; }
}
@keyframes experience-arrive { from { opacity:.4; translate:0 9px; } to { opacity:1; translate:0 0; } }
@keyframes experience-avatar { 0%,100% { translate:0 0; } 50% { translate:0 -4px; } }
@keyframes experience-loading { from { translate:-25% 0; opacity:.3; } to { translate:25% 0; opacity:1; } }
.site-experience.motion-paused .profile-head > .body { animation-play-state:paused; }
@media (max-width:900px) { .site-experience .rank-layout { grid-template-columns:1fr; } .site-experience .rank-layout > div:first-child { display:grid; grid-template-columns:1fr 1fr; gap:16px; } .site-experience .rank-layout > div:first-child > :nth-child(3) { display:none; } .site-experience .rank-layout > div:first-child > .card { margin:0!important; } }
@media (max-width:700px) {
 .site-experience .page-head { padding:28px 0 23px; }
 .site-experience .profile-head { grid-template-columns:66px minmax(0,1fr); gap:20px; padding:25px 20px; }
 .site-experience .profile-head > .body { width:58px; }
 .site-experience .profile-actions { grid-column:1/-1; flex-direction:row; }
 .site-experience .profile-actions .btn { flex:1; }
 .site-experience .profile-head h1 { font-size:clamp(23px,6.5vw,34px); }
 .site-experience .hud > div { padding:16px; }
 .site-experience .rank-layout { gap:16px; }
 .site-experience table.rank td, .site-experience table.rank thead th { padding:12px 10px; }
 .site-experience table.rank .extra { display:none; }
 .site-experience table.rank .val { font-size:11px; }
 .site-experience .zestawienia { padding:14px; }
 .site-experience .zestawienia__grupa { display:block; }
 .site-experience .zestawienia__nazwa { display:block; margin:8px 0; }
 .site-experience .rank-layout > div:first-child { grid-template-columns:1fr; }
 .site-experience .rank-layout > div:first-child > :nth-child(2) { display:none; }
 .site-experience .foot-brand p { max-width:160px; }
}
.site-experience .card__body.search { margin:0; max-width:none; width:auto; }
.site-experience .search-card { overflow:visible; position:relative; z-index:2; }
.site-experience .search-card .suggest { left:21px; right:21px; top:calc(100% - 38px); }
.site-experience .rank-picker { border:1px solid var(--line); border-radius:7px; margin:0 0 24px; background:var(--card); }
.site-experience .rank-picker > summary, .site-experience .profile-secondary > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px; list-style:none; padding:17px 20px; color:var(--dim); font-size:12px; }
.site-experience .rank-picker > summary::-webkit-details-marker, .site-experience .profile-secondary > summary::-webkit-details-marker { display:none; }
.site-experience .rank-picker > summary > span { display:flex; align-items:center; gap:8px; }
.site-experience .rank-picker > summary > span:first-child { color:var(--gold); }
.site-experience .rank-picker summary svg, .site-experience .profile-secondary summary svg { transition:transform .2s; }
.site-experience .rank-picker[open] summary > span:last-child svg, .site-experience .profile-secondary[open] summary svg { transform:rotate(180deg); }
.site-experience .rank-picker .zestawienia { margin:0; border:0; border-top:1px solid var(--line); border-radius:0; }
.site-experience .profile-secondary { border-top:1px solid var(--line); margin-top:26px; }
.site-experience .profile-secondary > summary { padding:20px 0; }
.site-experience .grid-2 > *, .site-experience .nick-form { min-width:0; }
.site-experience .card__body.search .nick-form input { width:0; flex:1 1 0%; }
.site-experience .card__body.search .nick-form .btn { flex:none; padding-left:14px; padding-right:14px; }
.site-experience .compare-page { max-width:1040px; }
.site-experience .porownaj input { border-radius:5px; background:#101013; border-color:var(--line-2); }
.site-experience .starcie-glowy { background:radial-gradient(ellipse at 50% 65%,#ffb8000b,transparent 65%); padding:30px 22px; gap:clamp(24px,8vw,100px); }
.site-experience .starcie-gracz { min-width:0; }
.site-experience .starcie-gracz .nick { font-size:clamp(12px,2vw,19px); overflow-wrap:anywhere; text-align:center; }
.site-experience .starcie { padding:14px 0; gap:20px; }
.site-experience .starcie__pasek { height:3px; }
.site-experience .starcie__wartosc { color:var(--dim); font-size:13px; overflow-wrap:anywhere; }
.site-experience .starcie__wartosc.wygrywa { color:var(--gold); }
.site-experience .starcie__nazwa { font-size:11px; }
@media (prefers-reduced-motion:no-preference) { .site-experience .starcie__lewy { transform-origin:left; animation:experience-bar .6s ease-out both; } }
@keyframes experience-bar { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media (max-width:700px) { .site-experience .starcie { gap:8px; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr); } .site-experience .starcie__wartosc { font-size:10px; } .site-experience .starcie-glowy { gap:14px; } }
.preview-toggle { display:inline-grid; place-items:center; width:28px; height:28px; margin-left:8px; border:1px solid #d7b15b55; border-radius:5px; color:#efcb78; background:#d2aa4412; cursor:pointer; flex:none; }
.preview-toggle:hover,.preview-toggle:focus-visible { background:#d2aa4433; outline:1px solid #edc571; }
.dashboard-table td:nth-child(2) > a { display:inline-flex; }
tr.preview-active { background:#cda84b12; }
.player-preview[hidden] { display:none; }
.player-preview { position:fixed; z-index:900; width:min(318px,calc(100vw - 32px)); padding:23px; box-sizing:border-box; border:1px solid #e3bb63; border-radius:16px; color:#f5f2e9; background:linear-gradient(130deg,#282115f5,#0c0c0dfc 43%,#15120dfc); box-shadow:0 0 0 3px #edc5670b,0 0 27px #efb94424,0 18px 65px #000a,inset 0 0 20px #e9c4660c; backdrop-filter:blur(18px); font-family:var(--sans,Arial,sans-serif); }
.player-preview__head { display:flex; align-items:center; gap:12px; padding-right:5px; }
.player-preview__head img { border-radius:5px; image-rendering:pixelated; flex:none; }
.player-preview__head strong { font-size:17px; overflow-wrap:anywhere; }
.player-preview__head p { font-size:11px; color:#b9b2a3; margin-top:5px; }
.player-preview__place { margin-left:auto; display:grid; place-items:center; flex:none; width:48px; height:48px; border-radius:50%; border:2px solid #e5b858; box-shadow:0 0 12px #ffd47533; font-size:19px; font-weight:600; }
.player-preview__stat { display:flex; flex-direction:column; gap:7px; margin-top:20px; padding:17px 0; border-top:1px solid #fff1; border-bottom:1px solid #fff1; }
.player-preview__stat span { color:#b9b2a3; font-size:12px; }
.player-preview__stat strong { color:#f6cf77; font-size:25px; font-variant-numeric:tabular-nums; }
.player-preview__link { display:flex; justify-content:space-between; padding-top:17px; color:#e9d6ac; font-size:13px; text-decoration:none; }
.player-preview__close { position:absolute; top:4px; right:5px; width:26px; height:26px; background:none; border:0; color:#b9b2a3; font-size:21px; cursor:pointer; }
@media(prefers-reduced-motion:reduce) { .preview-toggle,[data-player-preview] { transition:none!important; } }