/* ==========================================================================
   WEEK 1 PLAYER PROFILE — design V1, "Team Broadcast".
   Shared byte-for-byte by the desktop build and the app, like _la.css.

   COLOUR. --acc and --gnd are set per player from the club pair by the
   renderer, and they are IDENTITY ONLY: the broadcast bar, the rules, the
   logo ring. They never encode a value. Club colour on a value would mean
   "Cincinnati orange" reads as a magnitude, and half the league's second
   colour is near-black. Data marks stay on the fixed set below (one blue for
   magnitude with the subject emphasised, an ordinal ramp for the ordered
   scoring funnel, status tokens only for threshold pass/fail).

   Every class is prefixed w1- precisely because this mounts INSIDE the
   player-card modal, which has its own .nm, .v, .row and .card. A bare class
   name here would be overwritten by, or would overwrite, the host page.
   ========================================================================== */
.w1{
  --w1-surf:#131519; --w1-surf2:#191c21; --w1-line:rgba(255,255,255,.09);
  --w1-ink:#fff; --w1-ink2:#b9c0c9; --w1-ink3:#7d848e;
  --w1-grid:#242830; --w1-mute:#3a4049;
  --w1-s1:#3987e5; --w1-o1:#86b6ef; --w1-o2:#3987e5; --w1-o3:#184f95;
  --w1-ok:#3ddb3d; --w1-no:#f07a7a; --w1-warn:#fab219;
  --acc:#69be28; --gnd:#002244;
  background:var(--w1-surf); color:var(--w1-ink);
  font:15px/1.55 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  border-radius:12px; overflow:hidden; -webkit-font-smoothing:antialiased;
}
.w1 *{box-sizing:border-box}
.w1 h3,.w1 h4{margin:0;font-weight:800;letter-spacing:-.015em}
.w1 p{margin:0}

/* ---- broadcast header ---- */
.w1-top{display:flex;gap:16px;align-items:center;padding:18px 20px;position:relative;overflow:hidden;
  background:linear-gradient(100deg,var(--gnd) 0%,color-mix(in srgb,var(--gnd) 72%,#0b1622) 100%)}
.w1-top:after{content:'';position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(115deg,transparent,transparent 22px,
    rgba(255,255,255,.035) 22px,rgba(255,255,255,.035) 24px)}
.w1-top>*{position:relative;z-index:1}
.w1-logo{width:72px;height:72px;flex:none;border-radius:50%;object-fit:contain;display:block;
  box-shadow:0 0 0 2px var(--acc),0 8px 22px -8px #000;background:rgba(0,0,0,.2)}
.w1-id{flex:1;min-width:0}
.w1-eyeb{font:700 10px/1 system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--acc)}
.w1-id h3{font-size:clamp(23px,3.2vw,36px);line-height:.96;text-transform:uppercase;margin:8px 0 6px;
  letter-spacing:-.022em}
.w1-mt{font-size:12px;color:rgba(255,255,255,.72);letter-spacing:.04em}
.w1-sc{text-align:right;flex:none}
.w1-sc b{font-size:clamp(32px,4.8vw,50px);font-weight:700;line-height:.9;display:block;letter-spacing:-.035em}
.w1-sc s{text-decoration:none;font:700 10px/1 system-ui,sans-serif;letter-spacing:.14em;
  color:var(--acc);text-transform:uppercase}
.w1-bar{background:var(--acc);color:#07120a;padding:8px 20px;font:800 10px/1 system-ui,sans-serif;
  letter-spacing:.24em;text-transform:uppercase}

/* ---- stat cards ---- */
.w1-cards{display:grid;gap:1px;background:var(--w1-line)}
.w1-c7{grid-template-columns:repeat(7,1fr)}
.w1-c4{grid-template-columns:repeat(4,1fr)}
.w1-cards>div{background:var(--w1-surf2);padding:14px 13px;min-width:0}
.w1-cards s{text-decoration:none;display:flex;align-items:center;gap:5px;font:700 10px/1.2 system-ui,sans-serif;
  letter-spacing:.12em;text-transform:uppercase;color:var(--w1-ink3)}
.w1-cards b{display:block;font-size:30px;font-weight:700;line-height:1;margin-top:8px;letter-spacing:-.03em;
  overflow-wrap:anywhere}
.w1-cards em{font-style:normal;display:block;font-size:10.5px;color:var(--w1-ink3);margin-top:6px;line-height:1.4}
.w1-cards .w1-dim b{color:var(--w1-ink3);font-size:24px}

/* the verification mark, as a dot rather than a glyph the reader must decode */
.w1-mk{width:5px;height:5px;border-radius:50%;flex:none;display:inline-block}
.w1-mk-single{background:var(--w1-warn)}
.w1-mk-derived{background:var(--w1-s1)}
.w1-mk-none,.w1-mk-pending{background:var(--w1-mute)}
.w1-mk-conflict{background:var(--w1-no)}

/* ---- charts ---- */
.w1-charts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--w1-line)}
.w1-charts>div{background:var(--w1-surf);padding:15px 16px;min-width:0}
.w1-ct{font:700 10.5px/1 system-ui,sans-serif;letter-spacing:.15em;text-transform:uppercase;
  color:var(--w1-ink3);margin-bottom:11px;display:flex;justify-content:space-between;gap:9px}
.w1-row{display:grid;grid-template-columns:minmax(52px,auto) 1fr auto;align-items:center;gap:9px;
  padding:4px 0;font-size:12.5px}
.w1-row .nm{color:var(--w1-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w1-row .nm.me{color:var(--w1-ink);font-weight:700}
.w1-row .trk{height:10px;background:var(--w1-grid);border-radius:99px;overflow:hidden}
.w1-row .trk i{display:block;height:100%;border-radius:99px;background:var(--w1-mute)}
.w1-row .trk i.me{background:var(--w1-s1)}
.w1-row .vl{font-variant-numeric:tabular-nums;color:var(--w1-ink2);font-size:12px;min-width:44px;text-align:right}
.w1-row .vl.me{color:var(--w1-ink);font-weight:700}
.w1-funnel{display:flex;flex-direction:column;gap:2px}
.w1-funnel div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;
  border-radius:8px;font-size:12.5px;color:#fff}
.w1-funnel .f1{background:var(--w1-o1);color:#0a0b0d}
.w1-funnel .f2{background:var(--w1-o2)}
.w1-funnel .f3{background:var(--w1-o3)}
.w1-funnel b{font-weight:800;font-size:15px}
.w1-none{font-size:12px;color:var(--w1-ink3);line-height:1.55}
.w1-note{font-size:11.5px;color:var(--w1-ink3);line-height:1.55;padding:11px 18px 15px}
.w1-dimtxt{color:var(--w1-ink3)}

/* ---- thresholds ---- */
.w1-thr{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid var(--w1-grid);
  font-size:12.5px}
.w1-thr:last-child{border-bottom:0}
.w1-thr .l{flex:1;color:var(--w1-ink2);display:flex;align-items:center;gap:6px}
.w1-thr .n{font-variant-numeric:tabular-nums;font-weight:700}
.w1-pill{font:800 10px/1 system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;
  padding:4px 7px;border-radius:5px;white-space:nowrap}
.w1-pill.ok{background:rgba(12,163,12,.16);color:var(--w1-ok)}
.w1-pill.no{background:rgba(208,59,59,.16);color:var(--w1-no)}
.w1-pill.na{background:rgba(250,178,25,.16);color:var(--w1-warn)}
.w1-pill.neutral{background:rgba(255,255,255,.06);color:var(--w1-ink3)}

/* ---- the signal block ---- */
.w1-fx{background:linear-gradient(160deg,#0f1822,var(--w1-surf2));border-top:2px solid var(--acc)}
.w1-fx-h{display:flex;gap:12px;align-items:baseline;justify-content:space-between;flex-wrap:wrap;
  padding:15px 18px 0}
.w1-fx-h h4{font-size:16px;text-transform:uppercase}
.w1-st{font:700 10px/1 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--w1-warn)}
.w1-terms{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--w1-line);margin-top:13px}
.w1-terms>div{background:var(--w1-surf2);padding:13px 14px}
.w1-terms s{text-decoration:none;display:block;font:700 10px/1.2 system-ui,sans-serif;letter-spacing:.12em;
  text-transform:uppercase;color:var(--w1-ink3)}
.w1-terms b{display:block;font-size:27px;font-weight:700;line-height:1;margin-top:7px;letter-spacing:-.03em}
.w1-terms em{font-style:normal;display:block;font-size:10px;color:var(--w1-ink3);margin-top:5px;line-height:1.45}
.w1-terms .locked{background:repeating-linear-gradient(135deg,var(--w1-surf2),var(--w1-surf2) 7px,
  #1d2128 7px,#1d2128 14px)}
.w1-terms .locked b{color:var(--w1-ink3)}
.w1-eq{padding:13px 18px;font-size:13px;color:var(--w1-ink2);border-top:1px solid var(--w1-line);
  font-variant-numeric:tabular-nums;line-height:1.7}
.w1-eq b{color:var(--w1-ink);font-weight:700}
.w1-eq b.big{font-size:19px}
.w1-eq .op{color:var(--acc)}
.w1-grid{display:grid;grid-template-columns:auto repeat(3,1fr);gap:1px;background:var(--w1-line);
  font-variant-numeric:tabular-nums}
.w1-grid>div{background:var(--w1-surf2);padding:9px 11px;font-size:12.5px;text-align:right}
.w1-grid .hd{background:#20242a;color:var(--w1-ink3);font:700 10px/1.3 system-ui,sans-serif;
  letter-spacing:.1em;text-transform:uppercase}
.w1-grid .rh{text-align:left;color:var(--w1-ink2)}
.w1-grid .hot{color:var(--w1-ink);font-weight:700}

/* ---- analysis ---- */
.w1-an{padding:16px 18px;border-top:1px solid var(--w1-line);display:grid;
  grid-template-columns:1.5fr 1fr;gap:24px}
.w1-prose h4{font:700 10px/1 system-ui,sans-serif;letter-spacing:.15em;text-transform:uppercase;
  color:var(--acc);margin-bottom:9px}
.w1-prose p{font-size:13px;line-height:1.62;color:var(--w1-ink2);margin-bottom:9px}
.w1-prose p:last-child{margin-bottom:0}

/* ---- limited role ---- */
.w1-lim{padding:16px 18px}
.w1-lim-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:7px}
.w1-lim-h b{font-size:17px;font-weight:700}
.w1-lim-h span{font-size:11.5px;color:var(--w1-ink3);letter-spacing:.06em;text-transform:uppercase}
.w1-lim .w1-note{padding:0 0 13px}
.w1-lim .w1-cards{border-radius:9px;overflow:hidden}

@media(max-width:980px){
  .w1-c7{grid-template-columns:repeat(4,1fr)}
  .w1-charts{grid-template-columns:1fr}
}
@media(max-width:700px){
  .w1-c7,.w1-c4{grid-template-columns:repeat(2,1fr)}
  .w1-terms{grid-template-columns:1fr 1fr}
  .w1-an{grid-template-columns:1fr}
  .w1-cards b{font-size:25px}
}
/* Phone. flex-wrap alone was not enough: .w1-id is flex:1 with min-width:0, so
   instead of pushing the score onto its own line it just shrank until the name
   and the score overlapped. A grid states the intent — crest and name on the
   first row, score across the full width underneath — and cannot collapse. */
@media(max-width:560px){
  .w1-top{display:grid;grid-template-columns:54px minmax(0,1fr);gap:9px 12px;
    align-items:center;padding:15px 16px}
  .w1-logo{width:54px;height:54px}
  .w1-id{grid-column:2}
  .w1-id h3{font-size:22px;margin:6px 0 5px}
  .w1-eyeb{font-size:10px;letter-spacing:.13em}
  .w1-mt{font-size:11px}
  .w1-sc{grid-column:1/-1;text-align:left;display:flex;align-items:baseline;gap:10px}
  .w1-sc b{font-size:36px}
  .w1-bar{padding:8px 16px;letter-spacing:.18em}
  .w1-cards>div{padding:12px}
  .w1-cards b{font-size:23px}
  .w1-charts>div,.w1-an{padding:14px 16px}
  .w1-eq,.w1-fx-h{padding-left:16px;padding-right:16px}
  .w1-grid>div{padding:8px 9px;font-size:12px}
}