:root{
  --bg:#0b0f16; --bg2:#121824; --bg3:#1a2231; --line:#232c3d; --line2:#2f3a4f;
  --fg:#e8edf5; --fg2:#9aa8bd; --fg3:#6b7a91;
  --acc:#4da3ff; --good:#35d07f; --warn:#ffb545; --bad:#ff6d80;
  --QB:#ff6d80; --RB:#35d07f; --WR:#58a9ff; --TE:#ffb545;
  --K:#bf95ff; --DEF:#93a4bb; --DL:#ff9046; --LB:#2fd4c4; --DB:#d879e4;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);
  font:14px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased}
.pg-wrap{max-width:1080px;margin:0 auto;padding:0 18px}

.pg-top{border-bottom:1px solid var(--line);background:linear-gradient(180deg,#141c2b,#0d121b)}
.pg-top-in{display:flex;align-items:center;justify-content:space-between;padding:16px 18px}
.pg-brand{display:flex;align-items:center;gap:10px;font-size:19px;letter-spacing:-.01em}
.pg-mark{width:22px;height:22px;border-radius:6px;flex:none;
  background:conic-gradient(from 200deg,#ffb545,#ff6d80,#4da3ff,#35d07f,#ffb545)}
.pg-season{color:var(--fg3);font-weight:500;margin-left:8px;font-size:14px}
.pg-state{color:var(--fg2);font-size:12.5px;font-variant-numeric:tabular-nums}

.pg-nav{border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:5}
.pg-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.pg-tabs::-webkit-scrollbar{display:none}
.pg-tab{appearance:none;background:none;border:0;border-bottom:2px solid transparent;
  color:var(--fg3);font-family:inherit;font-weight:600;font-size:12.5px;line-height:1;
  letter-spacing:.03em;padding:13px 13px 11px;cursor:pointer;white-space:nowrap}
.pg-tab:hover{color:var(--fg2)}
.pg-tab-on{color:var(--fg);border-bottom-color:var(--acc)}

.pg-main{padding:22px 18px 60px;min-height:60vh}
.pg-loading{color:var(--fg3);padding:28px 0;font-size:13px}
.pg-err{background:rgba(255,109,128,.1);border:1px solid rgba(255,109,128,.3);
  border-radius:8px;padding:12px 14px;color:var(--bad);font-size:13px}

h2.pg-h{font-size:15px;margin:0 0 3px;letter-spacing:-.01em}
.pg-sub{color:var(--fg3);font-size:12px;margin:0 0 14px}
.pg-sec{margin-bottom:30px}

.pg-card{background:var(--bg2);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.pg-scroll{overflow-x:auto}
table.pg-t{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.pg-t th{font-weight:700;font-size:10px;line-height:1;letter-spacing:.07em;
  color:var(--fg3);text-align:right;padding:10px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--bg3)}
.pg-t th:first-child,.pg-t td:first-child{text-align:left}
.pg-t td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.pg-t tr:last-child td{border-bottom:0}
.pg-t tbody tr:hover{background:rgba(255,255,255,.022)}
.pg-team{font-weight:600;color:var(--fg)}
.pg-mgr{color:var(--fg3);font-size:11.5px;margin-left:6px;font-weight:400}
.pg-num{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}
.pg-dim{color:var(--fg3)}
.pg-good{color:var(--good)} .pg-bad{color:var(--bad)} .pg-warn{color:var(--warn)}

.pg-pos{display:inline-block;min-width:30px;text-align:center;border-radius:4px;
  padding:1px 5px;font-weight:700;font-size:9.5px;line-height:1.5;
  letter-spacing:.04em;color:#0b0f16}
.pg-pos-QB{background:var(--QB)} .pg-pos-RB{background:var(--RB)} .pg-pos-WR{background:var(--WR)}
.pg-pos-TE{background:var(--TE)} .pg-pos-K{background:var(--K)}  .pg-pos-DEF{background:var(--DEF)}
.pg-pos-DL{background:var(--DL)} .pg-pos-LB{background:var(--LB)} .pg-pos-DB{background:var(--DB)}

.pg-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.pg-chip{appearance:none;background:transparent;border:1px solid var(--line2);border-radius:20px;
  color:var(--fg2);font-family:inherit;font-weight:700;font-size:10.5px;line-height:1;
  letter-spacing:.05em;padding:6px 11px;cursor:pointer}
.pg-chip:hover{border-color:var(--fg3);color:var(--fg)}
.pg-chip-on{background:var(--fg);border-color:var(--fg);color:var(--bg)}

.pg-badge{display:inline-block;border-radius:4px;padding:1px 6px;
  font-weight:700;font-size:9.5px;line-height:1.6;letter-spacing:.05em}
.pg-badge-keep{background:rgba(255,181,69,.18);color:var(--warn)}
.pg-badge-div{background:rgba(77,163,255,.16);color:var(--acc)}
.pg-badge-in{background:rgba(53,208,127,.16);color:var(--good)}

@media(max-width:640px){
  .pg-wrap{padding:0 12px}
  /* Same specificity as .pg-wrap above and later in the file, so this is what
     keeps the header bar from collapsing to zero vertical padding. */
  .pg-top-in{padding:12px}
  .pg-main{padding:16px 12px 48px}
  .pg-t th,.pg-t td{padding:8px 7px;font-size:12.5px}
}

/* budget: proportion-remaining bar in the "$ left" cell */
.pg-budget-bar{width:100%;min-width:54px;height:3px;margin-top:5px;border-radius:2px;
  background:var(--line2);overflow:hidden}
.pg-budget-bar>i{display:block;height:100%;border-radius:2px;background:var(--good)}
.pg-budget-bar-warn>i{background:var(--warn)}
.pg-budget-bar-bad>i{background:var(--bad)}

/* draft: 12-wide board. Sticky round column, per-cell pick stack, filter dim. */
.pg-draft-b{width:auto;min-width:100%}
.pg-draft-b th,.pg-draft-b td{text-align:left;vertical-align:top;white-space:normal}
.pg-draft-b tr>:first-child{position:sticky;left:0;z-index:2;
  width:46px;min-width:46px;background:var(--bg3)}
.pg-draft-b thead th:not(:first-child){min-width:146px}
.pg-draft-b th .pg-team{font-weight:600;font-size:11.5px;line-height:1.3;letter-spacing:0}
.pg-draft-rd{font-size:12px;color:var(--fg2)}
.pg-draft-cell{line-height:1.35}
.pg-draft-meta{display:flex;align-items:center;gap:5px;margin-bottom:2px}
.pg-draft-no{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;color:var(--fg3);letter-spacing:.03em}
.pg-draft-name{font-size:12.5px;font-weight:600;color:var(--fg)}
.pg-draft-nfl{font-size:10.5px;color:var(--fg3);letter-spacing:.04em}
.pg-draft-swap{color:var(--acc);font-size:11px;cursor:help}
.pg-draft-off{opacity:.14}
.pg-draft-legend{display:flex;flex-wrap:wrap;gap:11px;align-items:center;margin:0 0 14px}
.pg-draft-lg{display:inline-flex;align-items:center;gap:5px;color:var(--fg2)}

/* ---------------------------------------------------------------- matchups
   Appended for js/matchups.js: the head-to-head cards and the expanded
   starter-by-starter grid. Every rule is prefixed pg-mu-. Colour comes from
   the variables at the top of this file; none of these rules set a colour on
   an element that also takes pg-good / pg-bad / pg-dim, so those keep winning. */
.pg-mu-week{color:var(--fg2);font-size:12.5px;margin:0 0 12px}
.pg-mu-week b{color:var(--fg);font-weight:600}
.pg-mu-note{display:block;color:var(--fg3);font-size:12px;margin-top:4px;max-width:62ch}
.pg-mu-retry{margin-top:12px}

.pg-mu-high{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px;
  background:var(--bg2);border:1px solid var(--line);border-radius:10px;
  padding:11px 13px;margin-bottom:14px}
.pg-mu-hs{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}

.pg-mu{margin-bottom:9px}
.pg-mu-head{display:grid;grid-template-columns:1fr 96px 1fr;align-items:center;gap:10px;
  width:100%;padding:12px 14px;background:none;border:0;font:inherit;text-align:left;
  cursor:pointer;color:var(--fg2)}
.pg-mu-head:hover{background:rgba(255,255,255,.03)}
.pg-mu-side{min-width:0}
.pg-mu-side-r{text-align:right}
.pg-mu-line{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-mu-score{display:block;margin-top:2px;letter-spacing:-.02em;font-size:21px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.pg-mu-mid{text-align:center;line-height:1.3}
.pg-mu-margin{display:block;font-size:13px;color:var(--fg);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.pg-mu-mlabel{display:block;font-weight:700;font-size:9px;line-height:1.5;
  letter-spacing:.09em;color:var(--fg3)}
.pg-mu-cue{display:block;font-size:10px;color:var(--fg3);transition:transform .12s}
.pg-mu-open .pg-mu-cue{color:var(--fg2);transform:rotate(180deg)}

.pg-mu-body{border-top:1px solid var(--line);background:rgba(0,0,0,.16)}
.pg-mu-body[hidden]{display:none}
.pg-mu-grid{min-width:540px;padding:5px 0}
.pg-mu-row{display:grid;grid-template-columns:1fr 60px 62px 60px 1fr;align-items:center;
  gap:8px;padding:5px 14px;color:var(--fg2)}
.pg-mu-row:hover{background:rgba(255,255,255,.022)}
.pg-mu-tot{border-top:1px solid var(--line);margin-top:5px;padding-top:8px;padding-bottom:9px}
.pg-mu-p{display:flex;align-items:center;gap:7px;min-width:0}
.pg-mu-p-r{flex-direction:row-reverse}
.pg-mu-pn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;color:var(--fg)}
.pg-mu-tm{flex:none;font-size:10.5px;letter-spacing:.04em}
.pg-mu-posx{background:var(--fg3)}
.pg-mu-pt{text-align:right;font-size:12.5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.pg-mu-pt-r{text-align:left}
.pg-mu-slot{text-align:center;font-weight:700;font-size:9px;line-height:1.5;
  letter-spacing:.07em;color:var(--fg3)}
.pg-mu-foot{padding:9px 14px 11px;border-top:1px solid var(--line);
  color:var(--fg3);font-size:11.5px}

/* rules: key-date strip, filter bar and collapsible constitution entries */
.pg-rules-dates{display:grid;grid-template-columns:repeat(auto-fit,minmax(156px,1fr));
  background:var(--bg2);border:1px solid var(--line);border-radius:10px;overflow:hidden}
/* Ring rather than gap, so an odd number of dates leaves card-coloured space
   instead of a lit-up empty cell when the grid wraps to two columns. */
.pg-rules-date{padding:11px 13px;box-shadow:0 0 0 1px var(--line)}
.pg-rules-next{box-shadow:inset 2px 0 0 var(--acc)}
.pg-rules-date-k{font-weight:700;font-size:9.5px;line-height:1.4;letter-spacing:.07em;
  color:var(--fg3);text-transform:uppercase}
.pg-rules-date-v{font-weight:600;font-size:13.5px;margin:3px 0 2px;font-variant-numeric:tabular-nums}
.pg-rules-date-m{font-size:11px}
.pg-rules-date-s{color:var(--fg3);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}

.pg-rules-find{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.pg-rules-in{flex:1 1 250px;min-width:0;background:var(--bg2);border:1px solid var(--line2);
  border-radius:8px;color:var(--fg);font-family:inherit;font-size:13px;line-height:1.4;
  padding:9px 11px;appearance:none}
.pg-rules-in::placeholder{color:var(--fg3)}
.pg-rules-in:focus{outline:none;border-color:var(--acc)}
.pg-rules-chips{margin-bottom:0}
.pg-rules-count{color:var(--fg3);font-size:11.5px;font-variant-numeric:tabular-nums;margin-left:auto}

.pg-rules-grp{margin-bottom:20px}
.pg-rules-grp[hidden]{display:none}
.pg-rules-grp-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin:0 0 7px;font-weight:400}
.pg-rules-grp-h b{font-weight:700;font-size:10.5px;line-height:1;letter-spacing:.09em;
  text-transform:uppercase;color:var(--fg2)}
.pg-rules-grp-h span{font-size:11.5px;color:var(--fg3)}

.pg-rules-item{border-bottom:1px solid var(--line)}
.pg-rules-item:last-child{border-bottom:0}
.pg-rules-item[hidden]{display:none}
.pg-rules-item>summary{display:flex;align-items:baseline;gap:10px;padding:11px 13px;
  cursor:pointer;list-style:none;user-select:none}
.pg-rules-item>summary::-webkit-details-marker{display:none}
.pg-rules-item>summary:hover{background:rgba(255,255,255,.025)}
.pg-rules-item>summary:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.pg-rules-item>summary::after{content:"+";flex:none;margin-left:auto;color:var(--fg3);
  font:700 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
.pg-rules-item[open]>summary::after{content:"\2212"}
.pg-rules-s{flex:none;min-width:52px;color:var(--acc);
  font:11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}
.pg-rules-t{flex:none;font-weight:600}
.pg-rules-one{flex:1 1 120px;min-width:0;color:var(--fg3);font-size:12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.pg-rules-body{padding:2px 13px 15px 75px}
.pg-rules-body p{margin:0 0 9px;max-width:74ch;color:var(--fg2);font-size:13px}
.pg-rules-body .pg-card{background:var(--bg)}
.pg-rules-ul{margin:0 0 9px;padding-left:18px;max-width:74ch;color:var(--fg2);font-size:13px}
.pg-rules-ul li{margin-bottom:4px}
.pg-rules-facts{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 11px}
.pg-rules-fact{background:var(--bg3);border:1px solid var(--line);border-radius:6px;
  padding:4px 9px;font-size:11.5px;color:var(--fg3)}
.pg-rules-fact b{margin-left:7px;color:var(--fg);font-variant-numeric:tabular-nums}
.pg-rules-tbl{max-width:520px;margin:0 0 11px}
.pg-rules-tables{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
  gap:14px;align-items:start;max-width:660px;margin:0 0 11px}
.pg-rules-tables .pg-rules-tbl{max-width:none;margin:0}
.pg-rules-cap{color:var(--fg3);font-size:11px;margin:0 0 5px}
.pg-rules-tbl .pg-rules-cap+.pg-card+.pg-rules-cap,.pg-rules-tbl .pg-card+.pg-rules-cap{margin:5px 0 0}
.pg-rules-tot td{border-top:1px solid var(--line2)}
.pg-rules-note{color:var(--fg3)!important;font-size:12px!important;border-left:2px solid var(--line2);
  padding-left:10px;margin-bottom:0!important}
.pg-rules-none{color:var(--fg3);font-size:13px;padding:18px 2px}

/* ------------------------------------------------------------- integration
   Added when the six section modules were merged into one site. Two things
   every section needs and none of them owned:

   .pg-l     opt a cell out of the table's right-alignment. pg-t right-aligns
             everything but the first column, which left the team name in the
             standings tables floating at the right edge while the same name
             sits hard left on every other tab. Any cell carrying a team name
             takes this instead.
   .pg-empty a settled "there is nothing here" card. Matchups had this as
             .pg-mu-empty and Budgets was borrowing .pg-loading for it, which
             says "still fetching" to anyone reading the class list. */
.pg-t .pg-l{text-align:left}
/* The footer disclaimer is meta prose and reads as it: dimmed, small, ruled off
   and given room underneath. The vertical padding sits here rather than on the
   inner .pg-wrap, which would lose to the media-query rule the same way
   .pg-top-in did. */
.pg-foot{border-top:1px solid var(--line);color:var(--fg3);font-size:12px;
  padding:20px 0 34px}
.pg-empty{padding:26px 16px;text-align:center;color:var(--fg3);font-size:13px}
.pg-empty .pg-sub{margin:6px auto 0;max-width:62ch}

/* Narrow viewports. The matchups and rules sections each appended their own
   @media(max-width:640px) block; merged here into one so the breakpoint is
   stated once and stays in step with the base block near the top. */
@media(max-width:640px){
  .pg-mu-head{grid-template-columns:1fr 72px 1fr;gap:6px;padding:11px}
  .pg-mu-score{font-size:18px}
  .pg-mu-row{padding:5px 11px}
  .pg-rules-one{display:none}
  .pg-rules-body{padding-left:13px}
  .pg-rules-count{margin-left:0}
}