:root { color-scheme:dark; --bg:#0c0f16; --card:#1b2230; --field:#151c28; --text:#f7f9ff; --muted:#c5d1e0; --cyan:#36d5ff; --gold:#ffd25a; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; min-width:320px; min-height:100dvh; color:var(--text); background:radial-gradient(circle at 80% 0%,rgba(164,50,255,.16),transparent 34rem),var(--bg); }
button,input,select,a { font:inherit; }
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible { outline:3px solid var(--cyan); outline-offset:3px; }
.players-screen { width:min(1180px,100%); min-height:100dvh; margin:0 auto; padding:max(16px,env(safe-area-inset-top)) 18px max(28px,env(safe-area-inset-bottom)); }
.back-link { min-height:44px; display:inline-flex; align-items:center; color:var(--cyan); font-size:1.06rem; font-weight:850; text-decoration:none; }
.players-layout { margin-top:10px; }
h1 { margin:0; font-size:2.13rem; line-height:1; letter-spacing:-.035em; }
.description { margin:6px 0 0; color:var(--muted); font-size:.94rem; line-height:1.45; }
form { position:relative; }
input[type="text"],select { width:100%; height:52px; border:1px solid rgba(255,255,255,.08); border-radius:13px; color:var(--text); background:var(--field); }
input[type="text"] { height:54px; margin-top:20px; padding:0 15px; font-size:1.06rem; }
select { margin-top:5px; padding:0 12px; }
.field-label,legend,.result-heading label span { display:block; color:var(--muted); font-size:.75rem; font-weight:850; letter-spacing:.04em; text-transform:uppercase; }
.field-label { margin-top:16px; }
fieldset { margin:16px 0 0; padding:0; border:0; }
fieldset label { width:49%; min-height:48px; display:inline-flex; align-items:center; gap:5px; }
input[type="radio"] { accent-color:var(--cyan); }
.search-button { width:100%; min-height:54px; margin-top:12px; border:0; border-radius:15px; color:var(--text); background:linear-gradient(135deg,#1cb8ee,#8747e8); font-size:1.06rem; font-weight:900; cursor:pointer; }
.search-button:disabled { opacity:.65; cursor:progress; }
.error-message { margin:16px 0 0; padding:16px; border-radius:14px; color:#ff8b8b; background:var(--card); text-align:center; }
.history-panel { position:absolute; top:78px; left:0; right:0; z-index:4; padding:14px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:#151b27; box-shadow:0 20px 45px rgba(0,0,0,.45); }
.history-heading { display:flex; justify-content:space-between; gap:12px; }
.history-heading button,.history-row button { border:0; color:var(--cyan); background:transparent; cursor:pointer; }
.history-row { min-height:48px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; border-top:1px solid rgba(255,255,255,.07); }
.history-row:first-child { margin-top:8px; }
.history-select { min-width:0; padding:8px 0; border:0; color:var(--text); background:transparent; text-align:left; cursor:pointer; }
.history-select small { display:block; color:var(--muted); }
.results-panel { margin-top:22px; }
.player-card { position:relative; isolation:isolate; overflow:hidden; padding:20px; border:1px solid rgba(85,218,255,.45); border-radius:26px; background:linear-gradient(180deg,rgba(5,12,23,.16) 0%,rgba(4,10,20,.78) 34%,rgba(5,9,18,.93) 68%,rgba(16,8,29,.78) 100%),url("../assets/player-card-background-v2.png") center/cover no-repeat; box-shadow:0 22px 70px rgba(0,0,0,.42),inset 0 0 70px rgba(0,0,0,.28); }
.player-card::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.16; background-image:linear-gradient(rgba(84,216,255,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(84,216,255,.24) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(to bottom,#000,transparent 75%); }
.player-card::after { content:""; position:absolute; z-index:-1; width:180px; height:180px; right:-70px; top:80px; border:1px solid rgba(196,74,255,.42); border-radius:50%; box-shadow:0 0 0 24px rgba(196,74,255,.04),0 0 0 50px rgba(54,213,255,.025); }
.card-glow { position:absolute; z-index:-2; border-radius:50%; filter:blur(28px); opacity:.2; }
.card-glow-one { width:180px; height:180px; top:-90px; left:-60px; background:#22caff; }
.card-glow-two { width:170px; height:170px; right:-80px; bottom:-80px; background:#a848ff; }
.card-watermark { position:absolute; z-index:0; width:48%; max-width:220px; height:auto; left:78%; top:15%; opacity:.42; transform:translate(-50%,-50%); filter:saturate(1.14) drop-shadow(0 0 18px rgba(62,210,255,.38)); pointer-events:none; }
.player-kicker { color:var(--cyan); font-size:.62rem; font-weight:900; letter-spacing:.18em; }
.player-identity { position:relative; z-index:1; margin:12px 0 22px; padding:12px 14px; border-left:4px solid var(--cyan); background:linear-gradient(90deg,rgba(3,9,19,.9) 0%,rgba(3,9,19,.72) 48%,rgba(3,9,19,.12) 72%,transparent 100%); text-shadow:0 2px 12px rgba(0,0,0,.9); }
.player-identity h2 { overflow:hidden; margin:5px 0 0; font-size:clamp(2rem,10vw,3.4rem); line-height:.96; letter-spacing:-.055em; text-overflow:ellipsis; white-space:nowrap; }
#battle-pass { margin:5px 0 0; color:var(--gold); font-size:.94rem; font-weight:850; }
.headline-stats { position:relative; z-index:1; margin-top:12px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.headline-stats article { --stat-color:#4edbff; position:relative; overflow:hidden; min-width:0; min-height:102px; padding:15px 7px; display:flex; align-items:center; justify-content:center; border:1px solid color-mix(in srgb,var(--stat-color) 45%,transparent); border-radius:14px; background:linear-gradient(145deg,color-mix(in srgb,var(--stat-color) 18%,rgba(5,10,20,.86)),rgba(5,10,20,.78)); box-shadow:inset 0 0 24px color-mix(in srgb,var(--stat-color) 8%,transparent),0 8px 20px rgba(0,0,0,.18); text-align:center; }
.headline-stats article::after { content:""; position:absolute; left:10px; right:10px; bottom:7px; height:3px; border-radius:3px; background:var(--stat-color); box-shadow:0 0 10px var(--stat-color); }
.headline-stats .stat-wins { --stat-color:#3d9dff; }
.headline-stats .stat-matches { --stat-color:#30dfa3; }
.headline-stats .stat-kills { --stat-color:#ff4f68; }
.headline-stats span,.detail-stats span { display:block; color:#aebbd0; font-size:.68rem; font-weight:900; letter-spacing:.04em; }
.headline-stats strong { display:block; overflow:hidden; margin-top:4px; color:#fff; font-size:clamp(1.02rem,4.4vw,1.55rem); letter-spacing:-.035em; text-overflow:ellipsis; }
.mode-control { position:relative; z-index:1; display:block; margin-top:0; }
.mode-control > span { display:block; margin-bottom:5px; color:#9eacc1; font-size:.66rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.mode-control select { height:45px; margin:0; border-color:rgba(64,210,255,.32); background:rgba(9,17,31,.84); }
.detail-stats { position:relative; z-index:1; margin-top:10px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.detail-stats article { position:relative; overflow:hidden; min-height:102px; padding:15px 7px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid color-mix(in srgb,currentColor 38%,rgba(255,255,255,.1)); border-radius:15px; background:linear-gradient(145deg,color-mix(in srgb,currentColor 11%,rgba(22,30,47,.9)),rgba(15,22,37,.9)); box-shadow:0 8px 20px rgba(0,0,0,.2); text-align:center; }
.detail-stats article::after { content:""; position:absolute; inset:auto 9px 8px; height:3px; border-radius:3px; background:currentColor; opacity:.8; }
.detail-stats strong { display:block; overflow:hidden; margin-top:9px; color:#fff; font-size:clamp(.92rem,4.2vw,1.55rem); letter-spacing:-.035em; text-overflow:ellipsis; white-space:nowrap; }
.stat-kd { color:#a55fff; box-shadow:inset 0 0 22px rgba(165,95,255,.08); }
.stat-rate { color:#ffd33d; box-shadow:inset 0 0 22px rgba(255,211,61,.08); }
.stat-time { color:#2cdcff; box-shadow:inset 0 0 22px rgba(44,220,255,.08); }
.result-actions { margin-top:12px; padding:16px; border:1px solid rgba(255,255,255,.08); border-radius:20px; background:rgba(27,34,48,.92); }
.result-actions p { margin:0 0 12px; font-weight:900; }
.result-actions > div { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.result-actions button { min-width:0; min-height:50px; display:flex; align-items:center; justify-content:center; gap:8px; border-radius:14px; color:#fff; font-weight:900; cursor:pointer; }
.result-actions svg { width:20px; height:20px; fill:currentColor; }
.download-action { border:1px solid rgba(255,255,255,.24); background:transparent; }
.share-action { border:0; background:linear-gradient(135deg,#16bee8,#884ee9); }
.share-status { display:block; margin-top:9px; color:var(--muted); font-size:.72rem; text-align:center; }
.privacy-note { margin:16px 0 0; color:var(--muted); font-size:.76rem; line-height:1.45; text-align:center; }
.results-placeholder { display:none; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

@media (min-width:760px) {
  .players-screen { padding:30px 34px 48px; }
  .players-layout { margin-top:24px; display:grid; grid-template-columns:minmax(320px,420px) minmax(0,1fr); gap:32px; align-items:start; }
  .search-panel,.results-panel,.results-placeholder { margin:0; padding:28px; border:1px solid rgba(255,255,255,.07); border-radius:24px; background:rgba(20,27,40,.82); box-shadow:0 18px 48px rgba(0,0,0,.2); }
  h1 { font-size:3.6rem; }
  .results-placeholder { min-height:520px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--muted); text-align:center; }
  .results-placeholder span { color:var(--cyan); font-size:5rem; }
  .results-panel { min-height:520px; }
  .player-card { max-width:570px; margin:0 auto; padding:26px; }
  .result-actions { max-width:570px; margin:14px auto 0; }
}
@media (min-width:1080px) { .players-screen { padding:38px 48px 64px; } .players-layout { grid-template-columns:420px minmax(0,1fr); gap:42px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; } }