*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background:#0a0b0d}:root{--bg: oklch(15% .005 260);--bg-2: oklch(18% .008 260);--bg-3: oklch(22% .01 260);--line: oklch(28% .01 260);--line-2: oklch(35% .012 260);--ink: oklch(96% .005 260);--ink-2: oklch(72% .008 260);--ink-3: oklch(52% .01 260);--ink-4: oklch(38% .01 260);--acc: oklch(78% .13 75);--acc-2: oklch(70% .13 75);--acc-soft: oklch(78% .13 75 / .15);--sans: "Inter Tight", "Inter", -apple-system, system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, Menlo, monospace}.app{position:relative;min-height:100vh;color:var(--ink);font-family:var(--sans);padding-bottom:80px}.app-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.app-bg__img{position:absolute;top:-40px;right:-40px;bottom:-40px;left:-40px;background-size:cover;background-position:center;filter:blur(80px) saturate(.4) brightness(.3);opacity:.25;transform:scale(1.1)}.app-bg__tint{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 80% 0%,oklch(78% .13 75 / .1) 0%,transparent 50%),linear-gradient(180deg,oklch(15% .005 260 / .92) 0%,var(--bg) 70%)}.app-bg__grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(oklch(28% .01 260 / .4) 1px,transparent 1px),linear-gradient(90deg,oklch(28% .01 260 / .4) 1px,transparent 1px);background-size:80px 80px;-webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 80%);mask-image:radial-gradient(ellipse at center,black 30%,transparent 80%);opacity:.4}.hd{position:sticky;top:0;z-index:100;padding:28px 48px 0;background:#0a0b0deb;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}.hd__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.hd__brand{display:flex;align-items:center;gap:18px}.hd__logo{display:flex;align-items:center;gap:10px;background:var(--ink);flex-shrink:0;border-radius:3px}.hd__logo-square{width:40px;height:40px;display:block;object-fit:contain;flex-shrink:0;border-radius:3px}.hd__logo-text{color:var(--bg);font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:-.02em}.hd__brand-meta{padding-left:18px;border-left:1px solid var(--line)}.hd__brand-title{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}.hd__brand-sub{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-top:2px}.hd__nav{display:flex;gap:2px;background:var(--bg-2);border:1px solid var(--line);padding:3px;border-radius:4px}.hd__nav-btn{background:transparent;border:none;padding:8px 16px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;font-weight:500;color:var(--ink-2);cursor:pointer;border-radius:3px;transition:all .15s}.hd__nav-btn:hover{color:var(--ink);background:var(--bg-3)}.hd__nav-btn.is-active{background:var(--ink);color:var(--bg);font-weight:700}.hd__controls{display:flex;gap:12px;align-items:stretch;margin-bottom:16px}.hd__search{flex:1;display:flex;align-items:center;gap:10px;background:var(--bg-2);border:1px solid var(--line);padding:10px 14px;border-radius:4px;color:var(--ink-3);transition:border-color .15s}.hd__search:focus-within{border-color:var(--acc);color:var(--ink-2)}.hd__search input{flex:1;background:transparent;border:none;outline:none;color:var(--ink);font-family:var(--sans);font-size:14px;font-weight:500}.hd__search input::placeholder{color:var(--ink-3)}.hd__search kbd{font-family:var(--mono);font-size:10px;padding:3px 7px;border:1px solid var(--line);border-radius:3px;color:var(--ink-3);background:var(--bg)}.hd__sort-group{display:flex;align-items:center;gap:8px;background:var(--bg-2);border:1px solid var(--line);padding:4px;border-radius:4px}.hd__sort-lbl{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink-3);padding-left:8px}.hd__sort-dir{width:28px;height:28px;background:var(--bg-3);border:1px solid var(--line);color:var(--acc);cursor:pointer;font-weight:700;border-radius:3px;transition:all .15s}.hd__sort-dir:hover{background:var(--acc);color:var(--bg);border-color:var(--acc)}.hd__sel{position:relative}.hd__sel-btn{display:flex;align-items:center;gap:6px;background:transparent;border:none;outline:none;color:var(--ink);font-family:var(--sans);font-size:13px;font-weight:600;padding:4px 8px;cursor:pointer;border-radius:3px;transition:background .12s}.hd__sel-btn:hover{background:var(--bg-3)}.hd__sel-btn svg{color:var(--ink-3);flex-shrink:0}.hd__sel-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:120px;background:var(--bg-2);border:1px solid var(--line-2);border-radius:4px;padding:4px;box-shadow:0 8px 24px #0006;z-index:200}.hd__sel-item{display:block;width:100%;text-align:left;background:transparent;border:none;padding:7px 10px;border-radius:3px;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--ink-2);cursor:pointer;transition:all .1s}.hd__sel-item:hover{background:var(--bg-3);color:var(--ink)}.hd__sel-item.is-active{color:var(--acc);font-weight:700}.hd__mode-toggle{position:relative;display:flex;background:var(--bg-2);border:1px solid var(--line);padding:3px;border-radius:4px}.hd__mode-toggle button{background:transparent;border:none;padding:8px 16px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;font-weight:600;color:var(--ink-3);cursor:pointer;border-radius:3px;transition:background .15s,color .15s;white-space:nowrap}.hd__mode-toggle button:hover{color:var(--ink);background:var(--bg-3)}.hd__mode-toggle button.is-active{background:var(--acc);color:var(--bg)}.hd__filters{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line);margin-top:4px}.hd__fgroup-lbl{font-family:var(--mono);font-size:9px;letter-spacing:.2em;color:var(--ink-3);padding-top:7px;flex-shrink:0}.hd__chips{display:flex;gap:6px;flex-wrap:wrap;flex:1}.hd__chip{background:var(--bg-2);border:1px solid var(--line);padding:5px 11px;font-family:var(--sans);font-size:11px;font-weight:600;color:var(--ink-2);cursor:pointer;border-radius:3px;transition:all .12s}.hd__chip:hover{border-color:var(--ink-3);color:var(--ink)}.hd__chip.is-on{background:var(--acc);border-color:var(--acc);color:var(--bg)}.resultmeta{position:relative;z-index:1;display:flex;align-items:center;gap:14px;padding:18px 48px;border-bottom:1px solid var(--line);margin-bottom:18px}.resultmeta__count{font-family:var(--mono);font-size:12px;color:var(--ink-3)}.resultmeta__count strong{color:var(--ink);font-weight:700}.resultmeta__summary{display:flex;gap:6px;flex-wrap:wrap}.resultmeta__tag{display:inline-flex;align-items:center;gap:6px;background:var(--bg-2);border:1px solid var(--line);padding:3px 4px 3px 10px;border-radius:3px;font-family:var(--mono);font-size:10px;color:var(--ink);font-weight:600}.resultmeta__tag:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);flex-shrink:0}.resultmeta__tag button{background:transparent;border:none;color:var(--ink-3);cursor:pointer;width:18px;height:18px;border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:10px}.resultmeta__tag button:hover{background:var(--bg-3);color:var(--ink)}.list{position:relative;z-index:1;padding:0 48px;display:flex;flex-direction:column;gap:10px}.list__empty{padding:80px 0;text-align:center;font-family:var(--mono);font-size:13px;color:var(--ink-3)}.card{position:relative;display:grid;grid-template-columns:40% 60%;height:180px;background:var(--bg-2);border:1px solid var(--line);overflow:hidden;border-radius:6px;cursor:pointer;transition:border-color .2s}.card:hover,.card.is-podium{border-color:var(--line-2)}.card.is-first{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc-soft),0 8px 32px #e8aa4e1f}.card__content{position:relative;overflow:hidden}.card__detail{height:100%;padding:16px 20px;display:flex;flex-direction:column;justify-content:space-between;min-width:0}.card__detail-top{min-width:0}.card__rank-row{display:flex;align-items:center;gap:8px;margin-bottom:5px}.card__rank-badge{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--ink-3);letter-spacing:.04em}.card.is-first .card__rank-badge{color:var(--acc)}.card__rank-pin{font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--acc);font-weight:700;background:var(--acc-soft);padding:2px 6px;border-radius:2px}.card__name{font-size:17px;font-weight:700;letter-spacing:-.015em;line-height:1.15;margin:0 0 5px;color:var(--ink);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.card__player{display:flex;align-items:baseline;gap:5px}.card__player-by{font-family:var(--mono);color:var(--ink-3);font-size:10px;letter-spacing:.1em}.card__player-name{color:var(--acc);font-weight:600;font-size:13px}.card__detail-bottom{display:flex;flex-direction:column;gap:8px}.card__stats{display:flex;gap:14px;padding:8px 0;border-top:1px solid var(--line)}.card__stats>div{display:flex;flex-direction:column;gap:1px}.lbl{font-family:var(--mono);font-size:8px;letter-spacing:.18em;color:var(--ink-3)}.val{font-family:var(--mono);font-size:12px;color:var(--ink);font-weight:600;font-feature-settings:"tnum"}.val i{font-style:normal;color:var(--ink-3);font-size:10px}.card__tags{display:flex;flex-wrap:wrap;gap:4px}.card__tag{font-family:var(--mono);font-size:9px;letter-spacing:.06em;font-weight:600;padding:2px 7px 2px 14px;border-radius:2px;text-transform:uppercase;position:relative;color:var(--acc);background:#e8aa4e1f}.card__tag:before{content:"";position:absolute;left:5px;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:currentColor}.card__thumb{position:relative;background:var(--bg-3);overflow:hidden}.card__thumb img{width:100%;height:100%;object-fit:cover;filter:saturate(1.1);transition:transform .5s}.card:hover .card__thumb img{transform:scale(1.04)}.card__thumb-placeholder{width:100%;height:100%;background:linear-gradient(135deg,var(--bg-3) 0%,oklch(20% .015 260) 100%)}.card__thumb-fade{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(270deg,transparent 60%,var(--bg-2) 100%)}.card__thumb-corner{position:absolute;bottom:12px;right:14px;display:flex;flex-direction:column;gap:2px;font-family:var(--mono);background:#010202eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:7px 11px;border-radius:4px;border:1px solid oklch(100% 0 0 / .12);box-shadow:0 4px 14px #0006;align-items:flex-end}.card__thumb-corner span{font-size:8px;letter-spacing:.2em;color:#acaeb1;text-transform:uppercase;font-weight:600}.card__thumb-corner strong{font-size:12px;color:#f6f9fc;font-weight:700;font-feature-settings:"tnum";letter-spacing:.02em}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:24px}.modal{position:relative;width:100%;max-width:640px;background:var(--bg-2);border:1px solid var(--line-2);border-radius:8px;overflow:hidden;box-shadow:0 24px 80px #0009;animation:modal-in .2s cubic-bezier(.2,0,0,1);max-height:90vh;overflow-y:auto}@keyframes modal-in{0%{opacity:0;transform:scale(.95) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal__close{position:sticky;top:14px;float:right;margin:14px 14px 0 0;z-index:10;width:32px;height:32px;background:#010202d9;border:1px solid var(--line-2);color:var(--ink-2);cursor:pointer;border-radius:4px;font-size:12px;display:flex;align-items:center;justify-content:center;transition:all .15s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.modal__close:hover{background:var(--acc);color:var(--bg);border-color:var(--acc)}.modal__thumb{position:relative;height:220px;background:var(--bg-3);overflow:hidden}.modal__thumb img{width:100%;height:100%;object-fit:cover;filter:saturate(1.1)}.modal__thumb-fade{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(0deg,var(--bg-2) 0%,transparent 60%)}.modal__body{padding:20px 28px 28px}.modal__top-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.modal__rank{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--acc);background:var(--acc-soft);padding:3px 8px;border-radius:3px;letter-spacing:.08em}.modal__tags{display:flex;flex-wrap:wrap;gap:4px}.modal__tag{font-family:var(--mono);font-size:9px;letter-spacing:.06em;font-weight:600;padding:2px 7px 2px 14px;border-radius:2px;text-transform:uppercase;position:relative;color:var(--acc);background:#e8aa4e1f}.modal__tag:before{content:"";position:absolute;left:5px;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:currentColor}.modal__name{font-size:24px;font-weight:800;letter-spacing:-.025em;line-height:1.1;color:var(--ink);margin-bottom:8px}.modal__player{display:flex;align-items:baseline;gap:6px;margin-bottom:20px}.modal__player-by{font-family:var(--mono);color:var(--ink-3);font-size:11px;letter-spacing:.1em}.modal__player-name{color:var(--acc);font-weight:600;font-size:15px}.modal__stats{display:flex;flex-wrap:wrap;gap:20px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:24px}.modal__stat{display:flex;flex-direction:column;gap:3px}.modal__stat .lbl{font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--ink-3)}.modal__stat .val{font-family:var(--mono);font-size:14px;color:var(--ink);font-weight:600}.modal__embed-section{margin-bottom:20px}.modal__embed-label{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.2em;color:var(--ink-3);margin-bottom:8px}.modal__embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:4px;border:1px solid var(--line);background:var(--bg-3)}.modal__embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.modal__links{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.modal__link{display:inline-flex;align-items:center;padding:10px 18px;border-radius:4px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.05em;text-decoration:none;background:var(--bg-3);border:1px solid var(--line);color:var(--ink-2);transition:all .15s}.modal__link:hover{border-color:var(--ink-3);color:var(--ink)}.modal__link--primary{background:var(--acc);border-color:var(--acc);color:var(--bg)}.modal__link--primary:hover{background:var(--acc-2);border-color:var(--acc-2);color:var(--bg)}