/* v326 — Prop Hunt.
 *
 * A separate stylesheet so styles.css is untouched. Colours are the site's own
 * tokens (#020b16 ground, #173b5d edge, #4dbfff accent, #8de22f positive), so
 * this reads as the same product rather than a bolted-on page.
 */
.ph-wrap{max-width:1180px;margin:0 auto;padding:18px 12px 60px}
.ph-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;justify-content:space-between;margin-bottom:14px}
.ph-head h1{font-family:'Space Grotesk',Inter,sans-serif;font-size:30px;margin:4px 0 2px;letter-spacing:.02em}
.ph-head p{margin:0;color:#7fa0ba;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.ph-tabs{display:flex;gap:6px;flex-wrap:wrap}
.ph-tab{border:1px solid #173b5d;background:#07192b;color:#9bc4e2;border-radius:999px;
  padding:9px 16px;font-size:12px;font-weight:700;cursor:pointer;letter-spacing:.03em}
.ph-tab[aria-selected="true"]{border-color:#2f8fd6;background:linear-gradient(150deg,#0d3f6d,#06203a);color:#e8f5ff;
  box-shadow:0 0 0 1px rgba(77,191,255,.25)}
.ph-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;
  border:1px solid #173b5d;border-radius:12px;background:linear-gradient(150deg,#07192b,#04111e);padding:12px 14px;margin-bottom:14px}
.ph-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:#7d98ad}
.ph-meta b{color:#cfe6f7}
.ph-note{font-size:10px;color:#6b869b;line-height:1.5;margin:10px 2px 0}

.ph-game{border:1px solid #173b5d;border-radius:12px;background:linear-gradient(150deg,#07192b,#04111e);margin-bottom:12px;overflow:hidden}
.ph-game-top{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;
  padding:13px 15px;border-bottom:1px solid #12304a;background:#061a2d}
.ph-match{display:flex;align-items:center;gap:9px;font-weight:800;font-size:15px}
.ph-vs{color:#5f819a;font-weight:600;font-size:11px}
.ph-when{font-size:11px;color:#88a5ba;text-align:right}
.ph-count{font-size:10px;color:#6f8fa6;letter-spacing:.08em}

.ph-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:11px;align-items:center;
  padding:11px 15px;border-top:1px solid #102a42;cursor:pointer}
.ph-row:hover{background:#08203550}
.ph-row:first-child{border-top:0}
.ph-who b{display:block;font-size:13px}
.ph-who small{display:block;color:#7b96aa;font-size:10px;margin-top:2px}
.ph-line{text-align:right;font-size:12px;color:#cfe6f7;white-space:nowrap}
.ph-line small{display:block;color:#6f8fa6;font-size:9px;margin-top:2px}
.ph-score{min-width:58px;text-align:center;border:1px solid #2f8fd6;border-radius:9px;
  background:#08213a;padding:6px 8px}
.ph-score b{display:block;font-size:17px;color:#7fd0ff;line-height:1}
.ph-score small{display:block;font-size:8px;color:#6f9dbd;letter-spacing:.06em;margin-top:3px}
.ph-score.unrated{border-color:#2a3f52;background:#0a1826}
.ph-score.unrated b{font-size:11px;color:#7d95a8;padding:3px 0}

.ph-detail{display:none;padding:0 15px 15px;border-top:1px solid #102a42;background:#04111e}
.ph-detail.open{display:block}
.ph-panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-top:12px}
.ph-panel{border:1px solid #173b5d;border-radius:10px;background:#061726;padding:12px}
.ph-panel h4{margin:0 0 9px;font-size:10px;letter-spacing:.1em;color:#4dbfff;text-transform:uppercase}
.ph-stat{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:11px;margin-bottom:8px;align-items:center}
.ph-stat span{color:#90aac0}
.ph-stat b{color:#e3f1fb}
.ph-stat i{grid-column:1/-1;height:4px;border-radius:999px;background:#102a41;display:block}
.ph-stat i>u{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2b8eff,#7fd0ff)}
.ph-empty{color:#6f8fa6;font-size:11px;padding:14px 2px}
.ph-abstain{color:#7d95a8;font-size:10px;font-style:normal;line-height:1.5}

/* Trend chart. Plain SVG, no library. */
.ph-chart{width:100%;height:96px;display:block}
.ph-chart .ln{fill:none;stroke:#4dbfff;stroke-width:2}
.ph-chart .dot{fill:#7fd0ff}
.ph-chart .lineref{stroke:#8de22f;stroke-width:1;stroke-dasharray:4 3}
.ph-chart .gridline{stroke:#12304a;stroke-width:1}
.ph-chartlab{display:flex;justify-content:space-between;font-size:9px;color:#6b869b;margin-top:3px}

/* Pitch mix */
.ph-mix{display:grid;gap:7px}
.ph-mixrow{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:11px;align-items:center}
.ph-mixrow span{color:#b9d3e6}
.ph-mixrow b{color:#e3f1fb}
.ph-mixrow i{grid-column:1/-1;height:5px;border-radius:999px;background:#102a41;display:block}
.ph-mixrow i>u{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2b8eff,#7fd0ff)}
.ph-mixrow.unmatched b,.ph-mixrow.unmatched span{color:#6f8fa6}
.ph-mixrow.unmatched i>u{background:#243c52}

.ph-pill{display:inline-block;border:1px solid #173b5d;border-radius:999px;padding:4px 9px;
  font-size:9px;color:#9bc4e2;margin:0 5px 5px 0;letter-spacing:.05em}
.ph-pill.good{border-color:#2f6b1f;color:#8de22f}
.ph-pill.warn{border-color:#5c4a1d;color:#ffce61}

@media (max-width:620px){
  .ph-row{grid-template-columns:1fr auto;gap:8px}
  .ph-line{grid-column:1;text-align:left}
  .ph-head h1{font-size:24px}
}

/* ===== v327 — premium player cards =====
 * Colour discipline, per spec:
 *   cyan  #7fd0ff  data values
 *   blue  #2f8fd6  active / structure
 *   purple#9b7cff  secondary model signals only, sparingly
 *   green #8de22f  confirmed positive EV only
 *   red   #ff6b6b  risk / negative movement only
 * Everything else stays the existing slate palette.
 */
.ph-card{border-top:1px solid #102a42;background:transparent}
.ph-card:first-of-type{border-top:0}
.ph-card.is-open{background:#06192c}

.ph-top{display:grid;grid-template-columns:26px 44px 1fr auto auto 22px;gap:11px;
  align-items:center;padding:12px 15px;cursor:pointer}
.ph-top:hover{background:#08203550}
.ph-rank{font-size:11px;font-weight:800;color:#5f819a;text-align:center}
.ph-face{width:44px;height:44px;border-radius:50%;overflow:hidden;background:#0a2033;
  border:1px solid #1d4a70;display:grid;place-items:center}
.ph-face img{width:100%;height:100%;object-fit:cover;display:block}
.ph-face .ph-facefall{width:100%;height:100%;display:grid;place-items:center}
.ph-id b{display:block;font-size:14px;letter-spacing:.01em}
.ph-id small{display:block;color:#7b96aa;font-size:10px;margin-top:3px}
.ph-id .ph-mkt{color:#9bc4e2}
.ph-best{text-align:right;white-space:nowrap}
.ph-best b{display:block;font-size:13px;color:#7fd0ff}
.ph-best small{display:block;font-size:9px;color:#6f8fa6;margin-top:2px}
.ph-best.awaiting b{color:#7d95a8;font-weight:600;font-size:11px}

.ph-rs{min-width:62px;text-align:center;border:1px solid #2f8fd6;border-radius:10px;
  background:linear-gradient(150deg,#0d3f6d,#06203a);padding:7px 9px}
.ph-rs b{display:block;font-size:19px;line-height:1;color:#9fdcff}
.ph-rs small{display:block;font-size:7px;color:#6f9dbd;letter-spacing:.1em;margin-top:4px}
.ph-rs.unrated{border-color:#2a3f52;background:#0a1826}
.ph-rs.unrated b{font-size:10px;color:#7d95a8;line-height:1.3;padding:4px 0;font-weight:700}
.ph-caret{color:#4a7b9c;font-size:12px;transition:transform .18s ease;text-align:center}
.ph-card.is-open .ph-caret{transform:rotate(180deg)}

.ph-body{display:none;padding:0 15px 16px}
.ph-card.is-open .ph-body{display:block}
.ph-loading{color:#6f8fa6;font-size:11px;padding:12px 2px}

/* component breakdown */
.ph-comp{display:grid;gap:9px;margin-top:4px}
.ph-comprow{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:11px;align-items:baseline}
.ph-comprow span{color:#9bb6c9}
.ph-comprow b{color:#7fd0ff;font-variant-numeric:tabular-nums}
.ph-comprow i{grid-column:1/-1;height:5px;border-radius:999px;background:#102a41;display:block}
.ph-comprow i>u{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#2b8eff,#7fd0ff)}
.ph-comprow.na b{color:#7d95a8;font-size:10px;font-weight:600}
.ph-comprow.na i>u{width:0}
.ph-compnote{font-size:9px;color:#6b869b;grid-column:1/-1;line-height:1.45;margin-top:-3px}

/* why the edge */
.ph-drivers{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:9px}
.ph-driver{border:1px solid #1d4a70;border-radius:9px;background:#08213a;padding:10px 11px}
.ph-driver b{display:block;font-size:11px;color:#9fdcff;margin-bottom:4px}
.ph-driver span{font-size:10px;color:#93aec2;line-height:1.5}

/* market edge */
.ph-me{display:grid;gap:7px}
.ph-merow{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:11px;
  padding:6px 0;border-bottom:1px solid #102a42}
.ph-merow:last-child{border-bottom:0}
.ph-merow span{color:#90aac0}
.ph-merow b{color:#cfe6f7;font-variant-numeric:tabular-nums}
.ph-merow b.pos{color:#8de22f}
.ph-merow b.neg{color:#ff6b6b}
.ph-merow b.model{color:#9b7cff}
.ph-merow b.na{color:#7d95a8;font-weight:600;font-size:10px}

/* matchup dna */
.ph-dna{display:grid;gap:7px}
.ph-dnarow{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:11px;align-items:center}
.ph-dnarow span{color:#b9d3e6}
.ph-dnarow b{color:#7fd0ff;font-variant-numeric:tabular-nums}
.ph-dnarow i{grid-column:1/-1;height:5px;border-radius:999px;background:#102a41;display:block}
.ph-dnarow i>u{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#2b8eff,#7fd0ff)}
.ph-dnarow.unmatched span,.ph-dnarow.unmatched b{color:#6f8fa6}
.ph-dnarow.unmatched i>u{background:#243c52}

.ph-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}
.ph-kv{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:11px;padding:5px 0}
.ph-kv span{color:#90aac0}
.ph-kv b{color:#7fd0ff;font-variant-numeric:tabular-nums}
.ph-kv b.na{color:#7d95a8;font-size:10px;font-weight:600}

.ph-heur{font-size:9px;color:#6b869b;line-height:1.5;margin:10px 2px 0;
  border-top:1px solid #102a42;padding-top:9px}

@media (max-width:620px){
  /* Cards expand vertically. No modal, no popup, per spec.
     The collapsed row is deliberately DENSE: the avatar and score span both
     lines while name and price stack in the middle column, so a card is one
     compact block rather than two stacked rows. */
  .ph-top{grid-template-columns:18px 38px 1fr auto 14px;gap:0 9px;row-gap:1px;
    padding:9px 12px;align-items:center}
  .ph-rank{grid-column:1;grid-row:1/3;font-size:10px}
  .ph-face{grid-column:2;grid-row:1/3;width:38px;height:38px}
  .ph-id{grid-column:3;grid-row:1;min-width:0}
  .ph-id b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ph-id small{margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ph-best{grid-column:3;grid-row:2;text-align:left;margin:0;
    display:flex;align-items:baseline;gap:6px}
  .ph-best b{font-size:12px}
  .ph-best small{margin:0}
  .ph-rs{grid-column:4;grid-row:1/3;min-width:52px;padding:5px 7px}
  .ph-rs b{font-size:17px}
  .ph-rs small{font-size:6.5px;margin-top:3px}
  .ph-rs.unrated b{font-size:9.5px}
  .ph-caret{grid-column:5;grid-row:1/3;font-size:11px}
  .ph-body{padding:0 12px 14px}
  .ph-drivers,.ph-grid{grid-template-columns:1fr}
  .ph-panels{gap:8px;margin-top:10px}
}

/* ===== v329: filters, per-game banner, market note ===== */
.ph-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  justify-content:space-between;margin:0 0 14px}
.ph-filters .ph-chips{display:flex;flex-wrap:wrap;gap:8px}
.ph-chip{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.04em;
  text-transform:uppercase;color:#9fb0c7;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);border-radius:999px;padding:8px 14px;
  cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.ph-chip:hover{color:#e8eefb;border-color:rgba(255,255,255,.22)}
.ph-chip.on{color:#04121f;background:linear-gradient(135deg,#6ee7ff,#7c9cff);
  border-color:transparent}
.ph-banner{margin:0 0 10px;padding:9px 13px;border-radius:10px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);
  color:#9fb0c7;font:500 12.5px/1.45 Inter,system-ui,sans-serif}
@media (max-width:560px){
  .ph-filters{gap:8px}
  .ph-chip{padding:7px 11px;font-size:11px}
  .ph-banner{font-size:11.5px;padding:8px 11px}
}

/* ===== v330: confidence chip, game state ===== */
/* The chip sits UNDER the score and is deliberately quieter than it. A data
   quality note must never compete with the ranking it describes. */
.ph-conf{display:block;margin-top:3px;font:700 8.5px/1 Inter,system-ui,sans-serif;
  letter-spacing:.09em;text-transform:uppercase;color:#8fb4d6;opacity:.92}
.ph-conf.good{color:#6ee7a8}
.ph-conf.warn{color:#9fb0c7}
.ph-rs.unrated small{display:block;margin-top:3px;font:500 9px/1.25 Inter,system-ui,sans-serif;
  letter-spacing:.02em;text-transform:none;color:#8497ad;max-width:96px;white-space:normal}
.ph-state{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:999px;
  font:700 9px/1.35 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
  color:#cfe2f5;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
@media (max-width:620px){
  .ph-conf{font-size:8px}
  .ph-rs.unrated small{font-size:8.5px;max-width:78px}
}

/* v330: the badge now carries a score, a label and a confidence chip. On a wide
   screen it spells REVEALSCORE; in the narrow mobile row, where the badge has a
   fixed grid column, it says SCORE instead of overflowing the card. */
.ph-rs{min-width:74px}
.ph-rs small{letter-spacing:.06em;white-space:nowrap}
.ph-rs small i,.ph-conf i{font-style:normal}
.ph-rs small .sm{display:none}
@media (max-width:620px){
  .ph-rs{min-width:52px;max-width:62px;padding:5px 5px}
  .ph-rs small{font-size:6.5px;letter-spacing:.04em}
  .ph-rs small .lg{display:none}
  .ph-rs small .sm{display:inline}
  .ph-conf{white-space:nowrap;font-size:7.5px;letter-spacing:.04em}
  .ph-conf .cn{display:none}
}

/* ===== v331: two named scores, kickoff windows, two-level expansion ===== */

/* A RevealScore is a claim about a market and gets the stronger treatment.
   A Player Rating is a measured profile and is deliberately quieter, so it can
   never be mistaken for a betting call. */
.ph-rs.is-reveal{border-color:#3aa0e8;background:linear-gradient(180deg,rgba(58,160,232,.18),rgba(10,26,42,.6))}
.ph-rs.is-reveal b{color:#bfe9ff}
.ph-rs.is-rating{border-color:#2a4257;background:rgba(255,255,255,.03)}
.ph-rs.is-rating b{color:#cfe0ee;font-size:17px}
.ph-rs .ph-rs-top{display:block;font-size:6.5px;letter-spacing:.12em;color:#7f9bb5;margin:0 0 1px}

/* Kickoff-window section headings. These make schedule completeness visible:
   a missing late-afternoon block is obvious at a glance. */
.ph-window{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin:20px 2px 10px;padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.09)}
.ph-window span{font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;
  text-transform:uppercase;color:#9fc4e4}
.ph-window b{font:600 11px/1 Inter,system-ui,sans-serif;letter-spacing:.06em;color:#7f9bb5}
.ph-window:first-child{margin-top:4px}

/* Second analysis level. The first level is four factors and the market; this
   opens everything else without collapsing the card. */
.ph-more{display:block;width:100%;margin:8px 0 2px;padding:9px 12px;cursor:pointer;
  font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:#9fc4e4;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);
  border-radius:9px;transition:background .15s,color .15s}
.ph-more:hover{color:#dceeff;background:rgba(255,255,255,.07)}
.ph-panels-1{margin-bottom:2px}
.ph-warn b{color:#ffc46b}

@media (max-width:620px){
  .ph-window{margin:14px 2px 8px}
  .ph-window span{font-size:10px;letter-spacing:.1em}
  .ph-window b{font-size:10px}
  .ph-more{padding:10px 12px;font-size:10.5px}
  .ph-rs.is-rating b{font-size:15px}
  .ph-rs .ph-rs-top{font-size:6px}
  /* Tighter expanded sections: less vertical whitespace on a phone. */
  .ph-panels{gap:8px}
  .ph-panel{padding:10px 11px}
}

/* ===== v333: rating tiers, lineup lifecycle, quieter market copy ========== */

/* The tier is a FIXED band on the 0-100 rating, not a ranking against tonight's
   board. Colour rises with the band so a slate can be read at a glance, and no
   tier is ever filled to a quota - an all-grey board is a truthful board. */
.ph-tier{display:block;margin-top:3px;padding:2px 4px;border-radius:5px;
  font:800 7px/1.1 Inter,system-ui,sans-serif;letter-spacing:.08em;white-space:nowrap;
  color:#8fa8bd;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.ph-tier i{font-style:normal}
.ph-tier .sm{display:none}
.ph-tier.t-elite{color:#ffe9a8;background:rgba(226,178,52,.18);border-color:rgba(226,178,52,.45)}
.ph-tier.t-very-strong{color:#bfe9ff;background:rgba(58,160,232,.20);border-color:rgba(58,160,232,.48)}
.ph-tier.t-strong{color:#a9dcff;background:rgba(58,160,232,.12);border-color:rgba(58,160,232,.30)}
.ph-tier.t-above-average{color:#a6d8c4;background:rgba(86,190,150,.12);border-color:rgba(86,190,150,.28)}
.ph-tier.t-average{color:#9fb4c6}
.ph-tier.t-below-average{color:#9aa7b2}
.ph-tier.t-weak{color:#b79a8e;background:rgba(196,120,90,.10);border-color:rgba(196,120,90,.24)}
.ph-tier.t-very-weak{color:#c08a80;background:rgba(196,90,90,.12);border-color:rgba(196,90,90,.28)}

/* Lineup lifecycle. "Expected" is a projection and is styled as one; it must
   never look like a club has posted a card it has not posted. */
.ph-lineup{display:inline-block;margin-left:6px;padding:1px 5px;border-radius:5px;
  font:700 8.5px/1.35 Inter,system-ui,sans-serif;letter-spacing:.07em;white-space:nowrap;
  vertical-align:1px}
.ph-lineup.ok{color:#a8e6c4;background:rgba(86,190,150,.14);border:1px solid rgba(86,190,150,.32)}
.ph-lineup.exp{color:#9fb9d2;background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.20)}
.ph-lineup.off{color:#9aa7b2;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10)}

/* No posted line is a fact about the SPORTSBOOK, not about the player, so it is
   the quietest thing on the row. The rating stays the headline. */
.ph-best.none b{color:#6f8697;font-weight:600;font-size:10.5px;letter-spacing:.01em}
.ph-best.none small{color:#5d7385}

@media (max-width:620px){
  /* The badge grows a little to hold the tier word rather than clipping it. */
  .ph-rs{max-width:70px}
  .ph-tier{font-size:6px;letter-spacing:0;padding:2px 2px}
  .ph-tier .lg{display:none}
  .ph-tier .sm{display:inline}
  .ph-lineup{font-size:8px;margin-left:4px;padding:1px 4px}
  .ph-best.none b{font-size:9.5px;white-space:normal}
}

/* The market cell now carries a long and a short wording, like the badge does.
   Desktop shows the full sentence; the dense mobile row shows the short one. */
.ph-best.none b i{font-style:normal}
.ph-best.none b .sm{display:none}
@media (max-width:620px){
  .ph-best.none b{white-space:nowrap}
  .ph-best.none b .lg{display:none}
  .ph-best.none b .sm{display:inline}
  /* A row carrying a lineup chip is allowed a second line rather than cutting
     the chip off behind an ellipsis - the chip is the point of the row. */
  .ph-id small:has(.ph-lineup){white-space:normal;overflow:visible;line-height:1.45}
}

/* v379: AP rank beside a college team. */
.ph-rank{font-style:normal;font-size:10px;color:#7fa0ba;font-weight:700}

/* ===== v381: NCAAF rows - projection, chance, score + data confidence ===== */
.ph-top.nc{grid-template-columns:26px 44px 1fr auto auto 22px}
.ph-nc{display:grid;grid-template-columns:repeat(3,minmax(64px,auto));gap:6px;align-items:stretch}
.nc-col{border:1px solid #173b5d;border-radius:9px;background:#061726;padding:6px 7px;text-align:center;min-width:64px}
.nc-col small{display:block;font-size:8px;color:#7d98ad;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.nc-col b{display:block;font-size:16px;color:#e3f1fb;line-height:1.2;margin-top:2px;font-family:'Space Grotesk',Inter,sans-serif}
.nc-col i{display:block;font-style:normal;font-size:8.5px;color:#6f8fa6;margin-top:1px;white-space:nowrap}
.nc-col.na b{color:#5f7d93}
.nc-score b em{display:block;font-style:normal;font-size:7px;letter-spacing:.1em;color:#6f9dbd;font-family:Inter,sans-serif}
.nc-score.is-reveal{border-color:#2f8fd6;background:linear-gradient(150deg,#0d3f6d,#06203a)}
.nc-score.is-reveal b{color:#9fdcff}
.ph-dc{display:inline-block;margin-top:3px;border-radius:999px;padding:1px 6px;font-size:7.5px;font-weight:800;letter-spacing:.03em;white-space:nowrap;border:1px solid}
.ph-dc.ok{color:#9af23c;border-color:#2d6a3a;background:#0f2a17}
.ph-dc.mid{color:#7fd0ff;border-color:#1d5a8a;background:#08223a}
.ph-dc.warn{color:#f2c94c;border-color:#6b5a1e;background:#1f1a08}
.ph-dc.bad{color:#ff9a9a;border-color:#6b2a2a;background:#241010}
.ph-intel{border:1px solid #1d4a70;border-radius:12px;background:#051523;padding:12px;margin-top:10px}
.ph-intel h4{margin:0 0 10px;font-size:11px;letter-spacing:.1em;color:#4dbfff;text-transform:uppercase}
.ph-itiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ph-itile{border:1px solid #173b5d;border-radius:10px;background:#061a2d;padding:9px}
.ph-itile small{display:block;font-size:9px;color:#7d98ad;letter-spacing:.06em;text-transform:uppercase}
.ph-itile b{display:block;font-size:20px;color:#e3f1fb;margin-top:3px;font-family:'Space Grotesk',Inter,sans-serif}
.ph-itile b span{font-size:10px;color:#7d98ad;font-family:Inter,sans-serif}
.ph-itile i{display:block;font-style:normal;font-size:9.5px;color:#6f8fa6;margin-top:2px}
.ph-itabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.ph-itab{display:flex;align-items:center;gap:6px;justify-content:center;border:1px solid #1d4a70;background:#07192b;color:#cfe6f7;
  border-radius:9px;padding:8px 6px;font:600 11px/1.2 Inter,system-ui,sans-serif;cursor:pointer;text-align:left}
.ph-itab.on{border-color:#4dbfff;background:#0b2a47;color:#fff}
.ph-ibody{margin-top:10px}
.ph-ibody .ph-panel{margin:0}
.ph-kv b .l3{font-style:normal;font-size:9.5px;color:#7d98ad;font-weight:500;margin-left:4px}
@media (max-width:620px){
  .ph-top.nc{grid-template-columns:18px 34px 1fr 14px;row-gap:6px}
  .ph-top.nc .ph-rank{grid-row:1/3}
  .ph-top.nc .ph-face{grid-row:1/3;width:34px;height:34px}
  .ph-top.nc .ph-best{grid-column:3;grid-row:2}
  .ph-top.nc .ph-nc{grid-column:2/4;grid-row:3;grid-template-columns:repeat(3,1fr)}
  .ph-top.nc .ph-caret{grid-column:4;grid-row:1/3}
  .nc-col{min-width:0}
  .ph-itiles{grid-template-columns:repeat(3,1fr);gap:6px}
  .ph-itile{padding:7px}
  .ph-itile b{font-size:16px}
  .ph-itabs{grid-template-columns:repeat(2,1fr)}
}
