/* Search (js/search.js) and the team and player pages (js/views/club.js), in the workspace finish. */

/* ---------- search sheet ---------- */
html.srch-open,html.srch-open body{overflow:hidden}
.srch{position:fixed;inset:0;z-index:900;display:grid;justify-items:center;align-items:start;padding:min(12vh,96px) 16px 16px;background:color-mix(in oklab,var(--ground) 72%,transparent);backdrop-filter:blur(6px)}
.srch[hidden]{display:none}
.srch-box{width:min(640px,100%);max-height:min(72vh,640px);display:grid;grid-template-rows:auto 1fr;border-radius:18px;background:var(--raised);border:1px solid var(--hair-2);box-shadow:0 40px 80px -30px #000c;overflow:hidden;animation:srch-in .18s cubic-bezier(.2,.8,.2,1)}
@keyframes srch-in{from{opacity:0;transform:translateY(-8px) scale(.98)}}
.srch-in{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 18px;border-bottom:1px solid var(--hair)}
.srch-in svg{width:18px;height:18px;color:var(--muted);flex:none}
.srch-in input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:600 17px Manrope}
.srch-in input::-webkit-search-cancel-button{display:none}
.sr-list{overflow:auto;padding:8px;overscroll-behavior:contain}
.sr-k{margin:6px 10px 6px;font:600 11px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.sr{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;color:var(--ink);text-decoration:none}
.sr.on,.sr:hover{background:var(--well);box-shadow:inset 0 0 0 1px var(--hair-2)}
.sr-mark{display:grid;place-items:center;width:40px;height:40px}
.sr-main{display:grid;min-width:0}.sr-main b{font:800 14.5px Manrope;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-main small{font:600 12px Manrope;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-tag{font:700 10.5px/1 Manrope;letter-spacing:.08em;color:var(--muted);padding:5px 8px;border-radius:999px;border:1px solid var(--hair-2)}
.sr.on .sr-tag{color:var(--accent-ink);background:linear-gradient(var(--acc-top),var(--acc-bot));border-color:transparent}
.sr-empty{margin:18px 12px;color:var(--muted);font-size:14px}
@media (max-width:640px){.srch{padding:10px}.srch-box{max-height:calc(100dvh - 20px)}}

/* ---------- pages ---------- */
.cl{display:grid;gap:20px;padding-bottom:40px}
.cl-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px 22px;padding:20px 22px;border-radius:20px;background:radial-gradient(80% 140% at 0% 0%,var(--accent-soft),transparent 60%),var(--ground-2);border:1px solid var(--hair-2)}
.cl-head.skel{display:block}
.cl-mark{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--well);box-shadow:inset 0 2px 8px #0006,0 0 0 1px var(--hair-2)}
.cl-mark .kft-crest{--crest:58px}.cl-mark.kit .kit svg{width:60px;height:auto}
.cl-id{min-width:0}.cl-id .label a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:6px}.cl-id .label a:hover{color:var(--accent)}
.cl-id h1{font:600 clamp(28px,4.4vw,44px)/1.05 Sora;letter-spacing:-.035em;margin:4px 0 6px;overflow-wrap:anywhere}
.cl-id p{margin:0;color:var(--muted);font-weight:600}
.cl-act{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
.cl-news{margin:0;padding:10px 14px;border-radius:12px;background:color-mix(in oklab,var(--warn) 12%,var(--ground-2));border:1px solid color-mix(in oklab,var(--warn) 40%,transparent);color:var(--ink);font-weight:600}
.cl-news.out{background:color-mix(in oklab,var(--bad) 12%,var(--ground-2));border-color:color-mix(in oklab,var(--bad) 40%,transparent)}
.cl-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.cl-card{min-width:0;padding:16px 18px 14px;border-radius:18px;background:var(--ground-2);border:1px solid var(--hair)}
.cl-card h2{font:600 18px Sora;letter-spacing:-.02em;margin:0 0 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.cl-card h2 small{font:600 12px Manrope;letter-spacing:0;color:var(--muted)}
.cl-note{margin:10px 2px 0;font-size:12px;color:var(--muted)}
.cl-ros{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.cl-ro{display:grid;gap:4px;padding:12px 14px;border-radius:14px;background:var(--well);border:1px solid var(--well-edge);box-shadow:inset 0 2px 8px #0005}
[data-theme=light] .cl-ro{box-shadow:inset 0 2px 6px #0001}
.cl-ro b{font:600 24px/1 Sora;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.cl-ro small{font-size:11.5px;color:var(--muted)}

/* fixture rows: last five and next five */
.cl-list{display:grid;gap:8px}
.cl-res,.cl-nx{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;background:var(--well);border:1px solid var(--well-edge)}
.cl-nx{grid-template-columns:44px minmax(0,1fr) auto minmax(0,auto)}
.cl-opp{display:flex;align-items:center;gap:8px;min-width:0}.cl-on{display:grid;min-width:0}.cl-on b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cl-opp b{font:800 14px Manrope}.cl-opp small{font:600 11.5px Manrope;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-score{min-width:52px;text-align:center;padding:6px 8px;border-radius:8px;font:800 14px Manrope;font-variant-numeric:tabular-nums;color:var(--fdr-ink)}
.cl-score.r-W{background:var(--fdr1)}.cl-score.r-D{background:var(--fdr3)}.cl-score.r-L{background:var(--fdr5)}
.cl-xg{display:grid;grid-auto-flow:column;grid-template-rows:auto auto;align-items:end;justify-items:end;column-gap:12px;font-variant-numeric:tabular-nums}
.cl-xg b{font:800 14px Manrope}.cl-xg small{font:600 10.5px Manrope;color:var(--muted)}
.cl-fdr{display:inline-grid;place-items:center;min-width:48px;height:36px;padding:0 8px;border-radius:8px;border:0;cursor:pointer;font:800 12.5px/1 Manrope;color:var(--fdr-ink);background:var(--fdr3);gap:2px}
.cl-fdr small{font:800 9.5px/1 Manrope;opacity:.85}.cl-fdr:disabled{cursor:default;opacity:.6}
.cl-fdr.d1{background:var(--fdr1)}.cl-fdr.d2{background:var(--fdr2)}.cl-fdr.d3{background:var(--fdr3)}.cl-fdr.d4{background:var(--fdr4)}.cl-fdr.d5{background:var(--fdr5)}
.cl-fdr:hover{filter:brightness(1.1)}.cl-fdr:focus-visible,.cl-xp:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cl-xp{display:grid;justify-items:end;min-width:64px;padding:6px 10px;border-radius:8px;border:0;cursor:pointer;font:800 17px/1 Manrope;color:var(--accent-ink);background:linear-gradient(var(--acc-top),var(--acc-bot));font-variant-numeric:tabular-nums}
.cl-xp small{font:700 10px Manrope;opacity:.75}.cl-xp.none{background:none;color:var(--faint)}

/* charts in the rank graph's look */
.cl-scope{border-radius:14px;padding:8px 4px 0;background:linear-gradient(var(--hair) 1px,transparent 1px) 0 0/100% 43px,linear-gradient(90deg,var(--hair) 1px,transparent 1px) 0 0/55px 100%,var(--well);border:1px solid var(--well-edge);box-shadow:inset 0 3px 12px #0007}
[data-theme=light] .cl-scope{box-shadow:inset 0 3px 10px #0002}
.cl-chart{display:block;width:100%;height:auto}
.cl-chart text{fill:var(--muted);font:700 11px Manrope}.cl-chart text.now{fill:var(--accent);font-weight:800}
.cl-chart .gl{stroke:var(--hair-2);stroke-dasharray:2 5}
.cl-chart .ln{fill:none;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.cl-chart .ln.a{stroke:var(--accent);filter:drop-shadow(0 4px 8px #0006)}.cl-chart .ln.b{stroke:var(--muted)}.cl-chart .ln.p{stroke:var(--accent);stroke-dasharray:6 6;opacity:.85}
.cl-chart .d{fill:var(--well);stroke-width:2.5}.cl-chart .d.a,.cl-chart .d.p{stroke:var(--accent)}.cl-chart .d.b{stroke:var(--muted)}
.cl-key{display:flex;flex-wrap:wrap;gap:16px;margin:10px 2px 0;font:700 12px Manrope;color:var(--muted)}
.cl-key i{display:inline-block;width:18px;height:4px;border-radius:2px;margin-right:7px;vertical-align:middle;background:var(--accent)}
.cl-key i.b{background:var(--muted)}.cl-key i.p{background:repeating-linear-gradient(90deg,var(--accent) 0 5px,transparent 5px 9px)}
@media (max-width:560px){.cl-chart text{font-size:20px}.cl-chart .d{r:8px}}

/* one club's congestion, the landing's look */
.cg{--cw:36px;display:grid;gap:6px;width:calc(var(--n) * var(--cw));padding:4px 0 6px}
.cg-days,.cg-row{display:grid;grid-template-columns:repeat(var(--n),var(--cw))}
.cg-d{display:grid;justify-items:center;font:700 10px/1.2 Manrope;color:var(--faint)}.cg-d b{font:800 13px Manrope;color:var(--ink-2)}
.cg-d.we{color:var(--muted)}.cg-d.today b{display:grid;place-items:center;min-width:24px;height:22px;border-radius:6px;color:var(--accent-ink);background:linear-gradient(var(--acc-top),var(--acc-bot))}
.cg-row{position:relative;height:42px;align-items:center}
.cg-m{grid-row:1;grid-column:calc(var(--i) + 1);z-index:1;display:grid;place-content:center;height:30px;margin:0 2px;border-radius:7px;font:800 10.5px/1 Manrope;color:var(--accent-ink);background:linear-gradient(var(--acc-top),var(--acc-bot));box-shadow:0 2px 6px -2px #0006;text-align:center}
.cg-m.cup{color:var(--ink);background:var(--well);border:1px solid var(--hair-2);box-shadow:none}.cg-m small{font:800 8px/1 Manrope;margin-top:2px;color:var(--muted)}
.cg-rest{position:absolute;top:50%;height:4px;margin-top:-2px;border-radius:2px;left:calc((var(--a) + .5) * var(--cw));width:calc((var(--b) - var(--a)) * var(--cw));background:color-mix(in oklab,var(--ink) 22%,transparent)}
.cg-rest.short{background:var(--bad)}

/* best picks */
.cl-best{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cl-pick{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border-radius:14px;background:var(--well);border:1px solid var(--well-edge);color:var(--ink);text-decoration:none}
.cl-pick:hover{box-shadow:inset 0 0 0 1px var(--accent)}
.cl-rank{font:600 12px "JetBrains Mono",ui-monospace,monospace;color:var(--accent)}
.cl-pick b{display:block;font:800 15px Manrope;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cl-pick small{font:600 11.5px Manrope;color:var(--muted)}
.cl-pick>span:nth-child(3){min-width:0}
.cl-big{display:grid;justify-items:end;font:600 22px/1 Sora;color:var(--accent);letter-spacing:-.03em}.cl-big small{font:700 10px Manrope;color:var(--muted);letter-spacing:0}

/* tables */
.cl-tab{min-width:640px}
.cl-tab th,.cl-tab td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.cl-tab th.pl,.cl-tab td.pl{text-align:left}
.cl-tab th button{all:unset;cursor:pointer;font:inherit;color:inherit}.cl-tab th button:hover,.cl-tab th button[aria-sort=descending],.cl-tab th button[aria-sort=ascending]{color:var(--accent)}
.cl-tab td.pl a,.cl-tab td.pl{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none}
.cl-tab td.pl a:hover b{color:var(--accent)}
.cl-tab td.pl span{display:grid}.cl-tab td.pl small{font:600 11px Manrope;color:var(--muted)}
.cl-tab td.nx{font-weight:800;color:var(--accent)}

@media (max-width:900px){.cl-grid2{grid-template-columns:1fr}.cl-best{grid-template-columns:1fr}.cl-ros{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){
  .cl-head{grid-template-columns:auto minmax(0,1fr);padding:16px}
  .cl-mark{width:64px;height:64px}.cl-mark .kft-crest{--crest:44px}.cl-mark.kit .kit svg{width:46px}
  .cl-act{grid-column:1/-1;justify-content:stretch}.cl-act>*{flex:1}
  .cl-card{padding:14px 12px}
  .cl-ros{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cl-res,.cl-nx{grid-template-columns:38px minmax(0,1fr) auto;row-gap:8px}
  .cl-res .cl-xg,.cl-nx .cl-xg{grid-column:2/-1;justify-self:start;justify-items:start}
}