/* OWS Contest Finder — same palette and type as the betting calculator,
   the Stacks tool and the One Prop Season hub.
   Everything fits the page width; the table never scrolls sideways. */
#ows-cf{
  --page:#f7f1ea;--surface:#f2e9de;--line:#d8cec1;--ink:#171512;--muted:#5f564d;
  --orange:#ff7a00;--orange-dark:#c95f00;--green:#237a4a;--red:#9c3029;--hit:#fde3c8;
  --display:Knockout-Heavy,"Arial Narrow",Arial,sans-serif;
  --sans:Knockout-Narrow,"Arial Narrow",Arial,sans-serif;
  --ui:Knockout,"Knockout 31",Oswald,system-ui,sans-serif;
  /* Matches the Stacks tool exactly. The page also has to be on the theme's
     single-fullwidth.php template or the wrapper squeezes it regardless. */
  color:var(--ink);font-family:var(--ui);max-width:1140px;margin:0 auto;padding:0 20px 56px;
}
#ows-cf *{box-sizing:border-box}
#ows-cf h1,#ows-cf h2,#ows-cf h3,#ows-cf p{color:inherit;margin:0}
#ows-cf a{color:inherit}
#ows-cf button,#ows-cf input,#ows-cf select{font-family:var(--ui)}
#ows-cf.is-embed{padding-bottom:28px}

/* ---- hero ---- */
.cf-kicker{color:var(--orange-dark);font-family:var(--sans);font-size:13px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.cf-hero{padding:34px 0 20px}
.cf-title{margin:6px 0 0!important;font-family:var(--display)!important;font-size:clamp(52px,7vw,88px);font-weight:900;line-height:.9;letter-spacing:-.035em}
.cf-intro{margin:12px 0 0!important;max-width:640px;color:var(--muted);font-size:19px;line-height:1.4}
.cf-stamp{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.cf-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-family:var(--sans);font-size:11.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.cf-chip b{color:var(--ink)}
.cf-chip-live{border-color:var(--orange);background:var(--hit);color:var(--orange-dark)}
.cf-chip-live b{color:var(--orange-dark)}

.cf-h2{margin:0 0 14px!important;font-family:var(--display);font-size:38px;line-height:1;letter-spacing:-.025em}

/* ---- labels + fields ---- */
.cf-label{display:block;margin-bottom:6px;font-family:var(--sans);font-size:11.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cf-sel{width:100%;padding:10px 10px;border:2px solid var(--ink);border-radius:3px;background:#fff;color:var(--ink);font-size:16px}
.cf-sel:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,122,0,.2)}
.cf-money{display:flex;align-items:center;border:2px solid var(--ink);border-radius:3px;background:#fff;overflow:hidden}
.cf-money em{padding:0 2px 0 10px;font-style:normal;font-size:20px;color:var(--muted)}
.cf-money input{width:100%;padding:9px 8px 9px 4px;border:0;background:transparent;color:var(--ink);font-size:20px;line-height:1.1}
.cf-money input:focus{outline:none}
.cf-money:focus-within{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,122,0,.2)}
.cf-note{margin:8px 0 0!important;color:var(--muted);font-size:13px;line-height:1.45}
.cf-check{display:flex;align-items:center;gap:8px;cursor:pointer;text-transform:none;letter-spacing:.04em;font-size:13.5px;color:var(--ink)}
.cf-check input{width:17px;height:17px;accent-color:var(--orange);margin:0}

/* ---- attack plan ---- */
.cf-plan{margin-top:26px;padding:22px 22px 24px;border:2px solid var(--ink);background:var(--surface)}
.cf-ask{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.cf-odds{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.cf-odds div{flex:1 1 180px;padding:12px 14px;border:1px solid var(--line);background:#fff}
.cf-odds span{display:block;font-family:var(--sans);font-size:10.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.cf-odds strong{display:block;margin-top:3px;font-size:30px;font-weight:600;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cf-odds div:first-child strong{color:var(--orange-dark)}
/* sits above the options now, so it reads as a heading for them */
.cf-plan-note{margin:20px 0 0!important;max-width:92ch;color:var(--ink);font-size:15.5px;line-height:1.5}
.cf-none{margin:18px 0 0!important;color:var(--muted);font-size:16px;line-height:1.5}
.cf-table-plan{border:0;background:#fff}
.cf-table-plan .cf-c-name{width:30%}
/* "top 6 of 2,400" needs room; at an even share it truncated to "top 6 of 2,…" */
.cf-c-need{width:14%}

/* the five ways to spend it */
.cf-plans{display:grid;gap:14px;margin-top:20px}
.cf-opt{border:1px solid var(--line);background:#fff}
.cf-opt-best{border:2px solid var(--orange);box-shadow:0 0 0 4px rgba(255,122,0,.10)}
.cf-opt-h{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 22px;padding:13px 16px;border-bottom:1px solid var(--line);background:var(--surface)}
.cf-opt-t{flex:1 1 260px}
.cf-opt h3{display:flex;align-items:center;gap:9px;font-family:var(--display);font-size:25px;line-height:1;letter-spacing:-.02em}
.cf-best{padding:3px 8px;border-radius:2px;background:var(--orange);color:#fff;font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.cf-opt-t p{margin-top:5px!important;max-width:60ch;color:var(--muted);font-size:13.5px;line-height:1.45}
.cf-opt-n{flex:0 0 auto;min-width:96px;text-align:right}
.cf-opt-n span{display:block;font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cf-opt-n strong{display:block;margin-top:2px;font-size:26px;font-weight:600;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cf-opt-h .cf-opt-n:first-of-type strong{color:var(--orange-dark)}
.cf-opt-left{margin:0!important;padding:9px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}

/* ---- board ---- */
.cf-board{margin-top:34px}
.cf-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:16px 18px;border:1px solid var(--line);border-top:2px solid var(--ink);background:var(--surface)}
.cf-controls .cf-money{max-width:none}
.cf-field-wide{grid-column:1/-1}
.cf-count{margin:14px 0 8px!important;color:var(--muted);font-size:14px}

/* ---- table: fixed layout so nothing overflows sideways ---- */
.cf-table{width:100%;table-layout:fixed;border-collapse:collapse;margin:0}
.cf-table th,.cf-table td{padding:9px 4px;text-align:right;font-size:14.5px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* overflow must stay visible here or the hover note gets clipped by the cell */
.cf-table th{font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--surface);border-bottom:1px solid var(--ink);overflow:visible;position:relative}
.cf-table th:first-child,.cf-table td:first-child{text-align:left;padding-left:12px}
.cf-table th:last-child,.cf-table td:last-child{padding-right:12px}
.cf-c-name{width:24%}
.cf-c-cap{color:var(--muted)}
.cf-dim{color:var(--muted)}

/* sortable headings */
.cf-sortable{cursor:pointer;user-select:none;position:relative}
.cf-sortable:hover{color:var(--ink);background:var(--hit)}
.cf-sortable:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.cf-arrow{display:inline-block;width:0;height:0;margin-left:4px;vertical-align:middle;opacity:0}
.cf-sortable[data-dir="up"] .cf-arrow{opacity:1;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:5px solid var(--orange-dark)}
.cf-sortable[data-dir="down"] .cf-arrow{opacity:1;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--orange-dark)}
.cf-sortable[data-dir] .cf-arrow{opacity:1}
.cf-sortable[data-dir=""] .cf-arrow{opacity:0}

/* collapsed explainers — one above each half, closed until asked for */
.cf-help{margin-bottom:16px;border:1px solid var(--line);background:#fff}
.cf-plan .cf-help{background:rgba(255,255,255,.65)}
.cf-help summary{padding:11px 16px;font-family:var(--sans);font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--orange-dark);cursor:pointer;list-style:none}
.cf-help summary::-webkit-details-marker{display:none}
.cf-help summary::before{content:"+";display:inline-block;width:14px;font-size:15px;line-height:1}
.cf-help[open] summary::before{content:"\2013"}
.cf-help summary:hover{background:var(--hit)}
.cf-help summary:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.cf-help-in{padding:4px 16px 16px;border-top:1px solid var(--line)}
.cf-help-in p{max-width:84ch;margin-top:12px!important;color:var(--muted);font-size:14.5px;line-height:1.55}
.cf-help-in p b{color:var(--ink);font-weight:600}
.cf-help-foot{padding-top:12px;border-top:1px solid var(--line)}
/* one boxed card per column, so the heading and its meaning stay together */
.cf-legend{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin:14px 0 0}
.cf-leg{padding:11px 13px;border:1px solid var(--line);border-left:3px solid var(--orange);background:var(--surface)}
.cf-leg h4{margin:0 0 5px!important;font-family:var(--display);font-size:19px;font-weight:900;line-height:1.05;letter-spacing:-.01em;color:var(--ink)}
.cf-leg p{margin:0!important;max-width:none;color:var(--muted);font-size:13.5px;line-height:1.45}
.cf-leg p b{color:var(--ink);font-weight:600}
/* the one-line summary, first thing inside the how-to panel */
.cf-help-lede{margin-top:12px!important;max-width:80ch;color:var(--ink)!important;font-size:16px!important;line-height:1.5!important}
.cf-table tbody tr:last-child td{border-bottom:0}
.cf-row{cursor:pointer}
.cf-row:hover td{background:rgba(255,122,0,.06)}
.cf-of{color:var(--muted);font-size:13px}
.cf-x{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:2px;background:var(--line);color:var(--muted);font-family:var(--sans);font-size:10.5px;font-weight:900;letter-spacing:.06em;vertical-align:1px}
.cf-ov{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:2px;background:var(--green);color:#fff;font-family:var(--sans);font-size:10.5px;font-weight:900;letter-spacing:.06em;vertical-align:1px}
/* add-to-slate control, and the state of a contest you can no longer join */
.cf-add{flex:none;width:19px;height:19px;margin-right:7px;padding:0;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--orange-dark);font-family:var(--ui);font-size:15px;font-weight:600;line-height:1;cursor:pointer;vertical-align:1px}
.cf-add:hover{border-color:var(--orange);background:var(--orange);color:#fff}
.cf-add:focus-visible{outline:2px solid var(--orange);outline-offset:1px}
/* already on the slate — settled, not inviting another click */
.cf-add.is-in{border-color:var(--green);background:var(--green);color:#fff}
.cf-add.is-in:hover{border-color:var(--green);background:var(--green);opacity:.75}
.cf-add-wide.is-in{border-color:var(--green);background:var(--green);color:#fff!important}
.cf-full{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:2px;background:var(--red);color:#fff;font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;vertical-align:1px}
.cf-row-full td{opacity:.55}
.cf-row-full .cf-full{opacity:1}

/* jump bar — sticks so you can move between the three sections anywhere */
.cf-tabs{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;gap:4px;margin:24px 0 0;padding:6px;border:1px solid var(--line);background:var(--surface)}
/* #ows-cf a{color:inherit} sits higher up with an id, so these need the id
   too or the active tab ends up ink on ink. */
/* This theme pins link colour so hard that even an inline !important on the
   anchor does not move it. So the active tab is marked with a light ground and
   an orange underline instead of light text on a dark one — no colour override
   needed, and it reads the same either way. */
#ows-cf .cf-tabs a{flex:1 1 auto;padding:10px 14px 8px;border-radius:3px 3px 0 0;border-bottom:3px solid transparent;font-family:var(--sans);font-size:12.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;text-align:center;text-decoration:none;white-space:nowrap}
#ows-cf .cf-tabs a:hover{background:var(--hit);border-bottom-color:var(--line)}
#ows-cf .cf-tabs a.is-here{background:#fff;border-bottom-color:var(--orange)}
.cf-tab-n{display:inline-block;min-width:19px;margin-left:6px;padding:1px 5px;border-radius:999px;background:var(--line);color:var(--muted);font-size:11px}
.cf-tab-n-on{background:var(--orange);color:#fff}

/* your own slate */
.cf-cart{margin-top:22px;padding:20px 20px 16px;border:2px solid var(--orange);background:#fff}
.cf-empty-note{margin:6px 0 0!important;max-width:70ch;color:var(--muted);font-size:15.5px;line-height:1.5}
.cf-empty-note a{color:var(--orange-dark);font-weight:600}
.cf-tot{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 16px}
.cf-tot div{flex:1 1 130px;padding:10px 13px;border:1px solid var(--line);background:var(--surface)}
.cf-tot span{display:block;font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.cf-tot strong{display:block;margin-top:2px;font-size:26px;font-weight:600;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cf-tot-win{border-color:var(--orange)!important;background:var(--hit)!important}
.cf-tot-win strong{color:var(--orange-dark)}
/* A scattergun slate can run to twenty contests. Keep the whole thing one
   block on screen and let the list scroll inside it, rather than pushing the
   totals and the rest of the page miles down. */
.cf-cart-wrap{max-height:340px;overflow-y:auto;border:1px solid var(--line)}
.cf-table-cart{border:0}
.cf-table-cart .cf-c-name{width:36%}
.cf-table-cart thead th{position:sticky;top:0;z-index:2}
.cf-table-cart td{padding-top:7px;padding-bottom:7px}
.cf-qty{white-space:nowrap}
.cf-qty b{display:inline-block;min-width:34px;padding:0 4px;font-weight:600;text-align:center}
.cf-step{width:22px;height:22px;padding:0;border:1px solid var(--line);border-radius:3px;background:var(--surface);color:var(--ink);font-family:var(--ui);font-size:14px;line-height:1;cursor:pointer;vertical-align:middle}
.cf-step:hover{border-color:var(--orange);background:var(--orange);color:#fff}
.cf-x-btn{width:22px;height:22px;padding:0;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--muted);font-family:var(--ui);font-size:15px;line-height:1;cursor:pointer}
.cf-x-btn:hover{border-color:var(--red);background:var(--red);color:#fff}
.cf-take{margin:10px 0 0!important;padding:6px 12px;font-size:11px}
/* Enter button and the remove × share one cell, so there is no dead gap
   between them and the pair sits centred under its heading. */
.cf-c-go{width:196px;text-align:center!important;white-space:nowrap}
.cf-c-go .cf-btn{vertical-align:middle}
.cf-c-go .cf-x-btn{margin-left:8px;vertical-align:middle}
/* .cf-btn is declared further down and would otherwise win on source order */
#ows-cf .cf-go{margin:0;padding:6px 12px;font-size:11px;background:var(--orange);border-color:var(--orange);color:#fff!important;white-space:nowrap}
#ows-cf .cf-go:hover{background:var(--orange-dark);border-color:var(--orange-dark);color:#fff!important}
/* .cf-btn is declared later in this file, so these need the id to win on
   specificity — otherwise the two buttons come out different sizes. */
.cf-pay-go{display:flex;flex-wrap:wrap;gap:10px;padding:0 14px 13px}
#ows-cf .cf-pay-go .cf-btn{margin:0;padding:9px 16px;font-size:12px;line-height:1.2;text-align:center}
.cf-jump{margin-top:16px!important}
.cf-jump .cf-btn{margin:0}
.cf-table tfoot td{border-top:2px solid var(--ink);font-weight:600;background:var(--surface)}

.cf-good{color:var(--green);font-weight:600}
.cf-mid{color:var(--orange-dark)}
.cf-bad{color:var(--red)}
.cf-empty td{text-align:center;color:var(--muted);padding:28px;white-space:normal}

/* payout ladder, revealed by clicking a row */
.cf-pay td{background:var(--hit);padding:0;white-space:normal}
.cf-pay-in{display:flex;flex-wrap:wrap;gap:8px 26px;padding:12px 14px}
.cf-pay-in span{font-size:15px;font-variant-numeric:tabular-nums}
.cf-pay-in b{display:block;font-family:var(--sans);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-dark)}

/* ---- copy ---- */
.cf-explain{margin-top:24px;display:grid;gap:10px}
.cf-explain p{max-width:82ch;color:var(--muted);font-size:14.5px;line-height:1.55}
.cf-explain b{color:var(--ink);font-weight:600}
.cf-caveat{padding:14px 16px;border-left:4px solid var(--orange);background:var(--surface)}
.cf-foot{margin-top:22px!important;padding-top:16px;border-top:1px solid var(--line);max-width:82ch;color:var(--muted);font-size:13.5px;line-height:1.6}
.cf-legal{margin-top:10px!important;color:var(--muted);font-size:12px;letter-spacing:.04em}

/* ---- gate ---- */
.cf-gate{margin-top:22px;padding:26px 24px;border:2px solid var(--ink);background:#fff}
.cf-gate h2{font-family:var(--display);font-size:34px;line-height:1;letter-spacing:-.02em}
.cf-gate p{margin-top:10px!important;max-width:60ch;color:var(--muted);font-size:16px;line-height:1.5}
.cf-btn{display:inline-block;margin:14px 10px 0 0;padding:11px 20px;border:2px solid var(--ink);border-radius:3px;background:var(--ink);color:var(--page)!important;font-family:var(--sans);font-size:13px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.cf-btn:hover{background:var(--orange-dark);border-color:var(--orange-dark)}
.cf-btn-ghost{background:#fff;color:var(--ink)!important}

/* Shed columns rather than scroll sideways.
   Columns are: 1 Contest, 2 Buy-in, 3 Entry, 4 Field, 5 Full, 6 Cash, 7 10x,
   8 Win it, 9 Rake, 10 1st, 11 Top 5, 12 Regulars, 13 Their lineups.
   (Everything from 7 shifted down one when the 2x column came out — these are
   nth-child positions, so they must be renumbered whenever a column is added
   or removed, and nothing will warn you if they are not.)
   Order of sacrifice, least load-bearing first: Top 5, then Rake, then Full,
   then 1st, then Regulars. What survives to the narrowest screen is the buy-in,
   the field, the three lines you have to beat, and whose lineups you face. */
@media (max-width:1240px){
  .cf-board .cf-table th:nth-child(11),.cf-board .cf-table td:nth-child(11){display:none}
}
@media (max-width:1100px){
  .cf-board .cf-table th:nth-child(9),.cf-board .cf-table td:nth-child(9){display:none}
}
@media (max-width:1000px){
  .cf-board .cf-table th:nth-child(5),.cf-board .cf-table td:nth-child(5){display:none}
}
@media (max-width:920px){
  .cf-ask,.cf-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cf-c-name{width:28%}
  .cf-board .cf-table th:nth-child(10),.cf-board .cf-table td:nth-child(10){display:none}
}
@media (max-width:820px){
  .cf-board .cf-table th:nth-child(12),.cf-board .cf-table td:nth-child(12){display:none}
}
@media (max-width:700px){
  .cf-board .cf-table th:nth-child(3),.cf-board .cf-table td:nth-child(3){display:none}
}

/* ---- the hover note on a column heading -----------------------------------
   The ? sits in the heading; the bubble does NOT. `.cf-table th` is
   overflow:hidden for the ellipsis and the shedding above, so a bubble inside
   the heading is clipped to the heading — the reason the first version of
   these notes showed nothing. One .cf-tipbox lives on #ows-cf instead and is
   moved by the script, which keeps the table's overflow rules untouched. */
.cf-tip{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;margin-left:4px;border:1px solid var(--line);border-radius:50%;background:var(--page);color:var(--muted);font-family:var(--sans);font-size:9px;font-weight:900;line-height:1;cursor:help;vertical-align:1px;user-select:none}
.cf-tip:hover,.cf-tip:focus{border-color:var(--orange);background:var(--hit);color:var(--orange-dark);outline:none}
/* width:max-content and the two wrap resets are all load-bearing. The theme
   sets overflow-wrap:break-word on everything, which drops this box's
   min-content width to a single character; an absolutely positioned box then
   shrink-to-fits to about 55px and the note renders as a tall sliver one word
   wide. Same global rule that once turned the "Entry" heading into "Entr" + a
   lone "y". max-content sizes it to the sentence, max-width still caps it. */
.cf-tipbox{position:absolute;z-index:40;width:max-content;max-width:230px;overflow-wrap:normal;word-break:normal;padding:7px 10px;border:1px solid var(--ink);border-radius:3px;background:var(--ink);color:var(--page);font-family:var(--ui);font-size:12.5px;font-weight:400;line-height:1.35;letter-spacing:0;text-transform:none;text-align:left;white-space:normal;pointer-events:none;box-shadow:0 3px 10px rgba(23,21,18,.22)}
/* The bubble is positioned against #ows-cf, so the section has to be the
   containing block. It is the page wrapper and is not itself positioned. */
#ows-cf{position:relative}
/* A heading is centred text; the ? must not drag the label off-centre on the
   narrow widths where headings wrap to two lines. */
@media (max-width:1040px){.cf-tip{width:12px;height:12px;margin-left:3px;font-size:8.5px}}
@media (max-width:640px){
  .cf-ask,.cf-controls{grid-template-columns:minmax(0,1fr)}
  .cf-table th,.cf-table td{padding:8px 3px;font-size:13px}
  .cf-c-name{width:36%}
}
@media (prefers-reduced-motion:reduce){#ows-cf *{transition:none!important;animation:none!important}}

/* ---- beige treatment (Aaron, 2026-09-24) ----------------------------------
   "Your slate" and "Build me a slate" were white panels sitting on a beige
   page. They popped, but next to "Add my own" they read cheap: that section
   has no background of its own, and its structure comes from borders plus a
   --surface tint, so it belongs to the page instead of floating on top of it.
   This puts the other two on the same rule.

   Kept as one override block at the end rather than edits scattered through
   the file, so reverting is a single deletion. Form inputs stay white on
   purpose: a white field reads as "type here" and "Add my own" keeps them
   white too. */
.cf-plan{padding:0;border:0;background:transparent}
/* the ask row now carries the structure, exactly as .cf-controls does */
.cf-ask{padding:16px 18px;border:1px solid var(--line);border-top:2px solid var(--ink);background:var(--surface)}
.cf-plan .cf-help{margin-bottom:16px;background:var(--surface)}
.cf-help{background:var(--surface)}
.cf-opt{background:var(--surface)}
.cf-table-plan{background:transparent}
.cf-cart{background:var(--surface)}

/* ---- softer controls, and the slate reads as theirs (Aaron, 2026-09-24) ----
   A white button on a beige card is the same cheap pop as a white panel was,
   so the ghost buttons lose their white fill. "Take this whole plan" is the
   one action inside each option, so it gets the warm --hit tint the palette
   already uses for a highlight rather than a new colour. "Empty the slate"
   stays quiet: it throws work away, so it should not compete. */
.cf-btn-ghost{background:transparent;color:var(--ink)!important}
.cf-btn-ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--page)!important}
.cf-take{background:var(--hit);border-color:var(--orange-dark);color:var(--orange-dark)!important}
.cf-take:hover{background:var(--orange-dark);border-color:var(--orange-dark);color:var(--page)!important}
.cf-x-btn{background:transparent}

/* Your slate is the member's own card, and four rows of it read flat. Two
   cheap signals fix that without a new colour: an orange rule down the left of
   every row, the same idiom .cf-leg and .cf-caveat already use, and a light
   band on alternate rows so a list of picks is easy to scan. The contest name
   carries full ink weight because it is the thing they are looking for. */
.cf-table-cart tbody td:first-child{border-left:3px solid var(--orange);color:var(--ink);font-weight:600}
.cf-table-cart tbody tr:nth-child(even) td{background:var(--page)}
.cf-table-cart tbody tr:hover td{background:var(--hit)}

/* ---- section controls (Aaron, 2026-09-24) ---------------------------------
   Build me a slate and Add my own open as before; these only let somebody fold
   one away when it is in the way, and reset the plan to nothing. */
.cf-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px 18px;flex-wrap:wrap}
.cf-sec-tools{display:flex;align-items:center;gap:8px}
.cf-mini{padding:6px 12px;border:1px solid var(--line);border-radius:3px;background:transparent;color:var(--muted);font-family:var(--sans);font-size:11px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.cf-mini:hover{border-color:var(--ink);background:var(--hit);color:var(--ink)}
.cf-sec-clear{margin:0!important;padding:6px 12px!important;font-size:11px!important}
/* The heading stays so a folded section can still be found and opened, and so
   does its one-line description (2026-10-15: both sections now open folded, so
   that line is what tells someone what is inside). Clear is no use on a folded
   section, so it waits for Expand. */
.cf-plan.is-min > :not(.cf-sec-head):not(.cf-sec-lede),.cf-board.is-min > :not(.cf-sec-head):not(.cf-sec-lede){display:none}
.cf-plan.is-min .cf-sec-clear,.cf-board.is-min .cf-sec-clear{display:none}
.cf-sec-lede{margin:6px 0 14px!important;max-width:72ch;color:var(--muted);font-size:15.5px;line-height:1.45}
.cf-plan.is-min .cf-sec-lede,.cf-board.is-min .cf-sec-lede{margin-bottom:0!important}
/* Folded, the Expand button is the way in, so it reads as one. */
.cf-plan.is-min .cf-mini,.cf-board.is-min .cf-mini{border-color:var(--ink);background:var(--ink);color:var(--page)}

/* ---- last of the white (Aaron, 2026-09-25) --------------------------------
   House rule now: the only white left is where you type or choose something.
   Inputs and dropdowns keep it, because a white field reads as "enter here".
   Everything else belongs to the beige.

   The jump bar's active tab was white. It cannot become dark: the theme pins
   link colour hard enough that even an inline !important on the anchor does
   not move it (see the note beside .cf-tabs above), so the active tab has to
   stay a LIGHT ground with dark text. Hover already used --hit, so the two
   swap rather than collide: hover lifts to --page, and the active tab takes
   the warm --hit plus the orange underline it already had. That pops more
   than white did in brand terms, and the two states stay distinguishable. */
#ows-cf .cf-tabs a:hover{background:var(--page);border-bottom-color:var(--line)}
#ows-cf .cf-tabs a.is-here{background:var(--hit);border-bottom-color:var(--orange)}
#ows-cf .cf-tabs a.is-here:hover{background:var(--hit)}

/* The small + / tick control sat white on a beige row. Its own .is-in rule is
   more specific, so the ticked state is untouched. */
.cf-add{background:transparent}

/* The signed-out gate card, the last white panel on the page. */
.cf-gate{background:var(--surface)}

/* ---- turn your phone sideways (Aaron, 2026-09-25) -------------------------
   The board is a wide table. Portrait on a phone is close to unusable, and
   landscape is fine, so say so rather than leaving people to work it out. It
   shows ONLY on a narrow screen held upright: on a desktop, on a tablet, or
   the moment the phone is turned, it is not there to nag. */
/* "DraftKings only, and here is why." A caveat, so it is built like one:
   muted, a size down, and set off by a rule rather than a box, so it reads as a
   footnote to the tool rather than a banner competing with the heading. Always
   shown — in the embed inside /stacks/ there is no hero to carry it. */
.cf-onlydk{margin:14px 0 0;padding-left:12px;border-left:3px solid var(--line);
  color:var(--muted);font-size:14px;line-height:1.5;max-width:70ch}
.cf-onlydk b{color:var(--ink);font-weight:600}

.cf-rotate{display:none}
@media (max-width:820px) and (orientation:portrait){
  .cf-rotate{display:block;margin:18px 0 0;padding:11px 14px;border:1px solid var(--line);
    border-left:3px solid var(--orange);background:var(--surface);
    color:var(--ink);font-size:14.5px;line-height:1.45}
  .cf-rotate b{font-weight:600}
}

/* ---- one set of filters, drawn twice (Aaron, 2026-09-29) ------------------
   Contest type, entry caps and contest size are multi-select now: "single
   entry AND 3-max" is a real way to play a week and a dropdown could not say
   it. Ticking nothing in a row means all of it.

   The same state runs Build me a slate and Add my own. The controls appear in
   both sections but carry no ids -- the script finds every copy by data-f and
   moves them together -- so the two halves cannot drift apart and either Clear
   resets both.

   Pills rather than a column of checkboxes: they wrap into the space there is,
   they are big enough to hit with a thumb, and a ticked one reads at a glance
   from across the page. */
.cf-filters{padding:14px 18px 13px;border:1px solid var(--line);border-top:0;background:var(--surface);display:grid;gap:13px}
.cf-field-chips{min-width:0}
.cf-chips{display:flex;flex-wrap:wrap;gap:7px}
.cf-ck{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--line);border-radius:999px;background:var(--page);cursor:pointer;font-family:var(--sans);font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;line-height:1;color:var(--muted);user-select:none}
.cf-ck input{width:15px;height:15px;margin:0;accent-color:var(--orange);cursor:pointer}
.cf-ck:hover{border-color:var(--ink);color:var(--ink)}
.cf-ck.is-on{border-color:var(--orange);background:var(--hit);color:var(--orange-dark)}
.cf-ck:focus-within{outline:2px solid var(--orange);outline-offset:1px}
.cf-filters-note{margin:0!important;padding-top:2px;max-width:88ch;color:var(--muted);font-size:13px;line-height:1.5}
.cf-filters-note b{color:var(--ink);font-weight:600}
.cf-filters-note a{color:var(--orange-dark);font-weight:600}
/* Budget, target, lineups and slate are the ask row. This block sits after the
   responsive rules further up the file, so it has to restate them: same
   specificity, and source order would otherwise leave a phone showing four
   columns squeezed into 375px. */
.cf-ask{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1040px){.cf-ask{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cf-ask{grid-template-columns:minmax(0,1fr)}}

/* A count, not an amount, so there is no $ sitting in front of it — which means
   the input has to carry the left padding the missing <em> used to provide. */
.cf-money-n input{padding-left:10px}
.cf-money-n input::placeholder{color:var(--muted);opacity:1;font-size:16px}

/* ---- the counts, on the card ----------------------------------------------
   A plan named "All in on one contest" was hiding the fact that five lineups
   were going into it. The name says the shape, this line says the arithmetic:
   how many lineups, into how many contests. Nothing else — it replaced a
   sentence of strategy advice, so it had better not become one. */
.cf-opt-sub{margin-top:6px!important;color:var(--orange-dark);font-family:var(--sans);font-size:11.5px;font-weight:900;letter-spacing:.055em;text-transform:uppercase;line-height:1.45}

/* ---- multiplier badge -----------------------------------------------------
   A multiplier pays every place the same multiple of the buy-in, so the
   multiple is the whole contest. It sits beside the name in the palette's
   quiet ink, so it does not compete with the green overlay flag. */
.cf-mx{display:inline-block;margin-left:6px;padding:1px 6px;border:1px solid var(--orange-dark);border-radius:2px;color:var(--orange-dark);font-family:var(--sans);font-size:10.5px;font-weight:900;letter-spacing:.06em;vertical-align:1px}

/* ---- payouts open inside Your slate too -----------------------------------
   Same click, same table as the board. The striping and the orange rule down
   each row are more specific than .cf-pay's own background, so the opened
   strip has to say it again here or it comes out the wrong colour on every
   second row. */
.cf-table-cart tbody tr.cf-pay td{background:var(--hit);border-left:0;font-weight:400}
.cf-table-cart tbody tr.cf-pay:hover td{background:var(--hit)}
.cf-table-cart .cf-pay-in{padding:11px 13px}
/* ---- the plan table on a narrow screen (Aaron, 2026-09-29) ----------------
   "Build me a slate" lays out nine columns and had no responsive rules at all,
   so on a phone it ran about 60px wider than the screen and dragged the whole
   page sideways with it. The board beside it has shed columns since it was
   built; this gives the plan table the same treatment.

   Two separate causes, both fixed here.

   FIRST: the headers were BIGGER on a phone than on a desktop. The rule up in
   the max-width:640 block reads `.cf-table th,.cf-table td{font-size:13px}`.
   Shrinking the data from 14.5px to 13px is the point of it; taking the
   headers UP from their 10px was collateral, and it made every heading on both
   tables 30% wider than it needs to be. Put them back.

   SECOND: nine columns is too many. Order of sacrifice, least load-bearing
   first: Regulars, then Entry, then Field, then Buy-in. What survives to the
   narrowest screen is the contest, how many lineups, what it costs, what first
   pays and where you have to finish — which is the plan. Buy-in goes last of
   the four because Cost already says what it takes, and Lineups is beside it.
   Entry and Field go early because you chose them in the filters to get here,
   and "You need" already reads "top 6 of 2,400". */
@media (max-width:640px){
  .cf-table th{font-size:10px}
}
@media (max-width:1040px){
  .cf-table-plan th:nth-child(9),.cf-table-plan td:nth-child(9){display:none}
}
@media (max-width:900px){
  .cf-table-plan th:nth-child(5),.cf-table-plan td:nth-child(5){display:none}
}
@media (max-width:800px){
  .cf-table-plan th:nth-child(6),.cf-table-plan td:nth-child(6){display:none}
}
@media (max-width:700px){
  .cf-table-plan th:nth-child(3),.cf-table-plan td:nth-child(3){display:none}
  /* Five columns left, so the two that carry words rather than figures can
     have the room back. "top 6 of 2,400" is the widest thing in the table. */
  .cf-table-plan .cf-c-name{width:30%}
  .cf-table-plan .cf-c-need{width:26%}
}
/* A guarantee rather than a calculation: whatever a heading still does not fit
   becomes an ellipsis instead of pushing the page sideways. Safe here without
   any more thought, because these headings are not sortable and have no arrow
   sitting beside them to clip. */
@media (max-width:820px){
  .cf-table-plan th{overflow:hidden}
}

/* ---- and the board's own headings ----------------------------------------
   The plan table was the loud half of this, but the board spills its headings
   too — 23px at 375px and as much as 28px at tablet width, which today lands
   in the page padding and two pixels of sideways scroll. Fixing only the plan
   would leave that resting on padding this file does not own.

   So here the headings wrap and then clip, and nothing leaves the cell. Two
   words become two lines rather than hanging out of the cell, and only what is
   still too long after that is cut ("Their lineup…" at 375px, which is the one
   heading in the table that will not fit however it is sliced).

   These headings ARE sortable, so the arrow cannot simply be clipped away with
   the text: it is lifted out of the flow into the corner of the cell, which
   .cf-sortable's own position:relative already allows.

   It runs to 1040px rather than to phones only, because the spill peaks at
   tablet width — 700-900px was still dragging sideways under a phones-only
   version of this. Above 1040 the cells are wide enough that what spills is
   16-18px against 35px of padding, and the board is left reading exactly as it
   does today.

   The overflow:visible this overrides was there to keep a .cf-tip hover note
   from being clipped. Nothing renders a .cf-tip any more — the only mention
   left in the whole plugin is a defensive guard in the click handler. */
@media (max-width:1040px){
  /* overflow-wrap and word-break are reset explicitly: the theme sets
     break-word globally, which turned "Entry" into "Entr" and a lone "y" on
     the next line. Words wrap between themselves or not at all. */
  .cf-board .cf-table th{overflow:hidden;white-space:normal;overflow-wrap:normal;word-break:normal;hyphens:none;line-height:1.15;vertical-align:bottom}
  /* Only the sorted column has an arrow, so only it pays for the room. Giving
     every heading that padding cost 7px each and was the difference between
     "Entry" fitting and not. markHeaders() puts data-dir on exactly one. */
  .cf-board .cf-table th[data-dir="up"],.cf-board .cf-table th[data-dir="down"]{padding-right:11px}
  .cf-board .cf-table th .cf-arrow{position:absolute;right:2px;bottom:10px;margin:0}
}