/* MatchPoint clean pass (3 Nov, Joshua: "the pop-up seems grey, then light purple on the boxes… it seems off. Go through the whole app:
   clean, the Apple feel, but also a MatchPoint feel"). Loaded LAST, round 2 look only (html.pm2), so ?look=old / r1 are untouched.

   The rules, everywhere:
   · pages     Apple grey (#F2F2F7) with white cards
   · pop-ups   white; anything boxed inside sits on ONE soft grey (#F2F2F7): no lavender boxes, no hairline-white rows
   · purple    only the main button, what's picked (pale purple + purple ring), and brand tags
   · meaning   court green = done / won / yes · ball yellow = tickets & stars · clay orange = "a bit" · red = what to fix */
html.pm2{--mp-fill:#F2F2F7;--mp-fill-dn:#E8E8ED;--mp-on:#F3EEFF;--mp-ring:0 0 0 2px #7C3AED inset;--mp-ink2:#6E6E73;--mp-tix:#FFF6D9;--mp-tix-ink:#7A4A00;--mp-tix-ic:#E0A100}

/* ---------- pop-ups: white sheet ---------- */
html.pm2 #sheet{background:#fff}
html.pm2 #sheet .grab{background:#D1D1D6}

/* everything boxed inside a pop-up: one grey fill, no outline */
html.pm2 #sheet .hwin,html.pm2 #sheet .jn-box,html.pm2 #sheet .jn-dl,html.pm2 #sheet .chlist button,html.pm2 #sheet .ex,html.pm2 #sheet .jn-opts button,
html.pm2 #sheet .jn-chips button,html.pm2 #sheet .jn-seg.feel button,html.pm2 #sheet .jn-score input,html.pm2 #sheet .fcs-pick button,
html.pm2 #sheet .qz-prize span,html.pm2 #sheet .insight,html.pm2 #sheet .tkline,html.pm2 #sheet .tkrow,html.pm2 #sheet .earn div,html.pm2 #sheet .tix-won.miss,
html.pm2 #sheet .g-rows,html.pm2 #sheet .arr-r button,html.pm2 #sheet .px-n,html.pm2 #sheet .px-look,html.pm2 #sheet .px-harder,html.pm2 #sheet .px-feel button,
html.pm2 #sheet .fcs-now,html.pm2 #sheet .hwpv,html.pm2 #sheet .mycoach{background:var(--mp-fill) !important;border:0 !important;box-shadow:none !important}
html.pm2 #sheet .ex button+button{border-top:1px solid rgba(60,60,67,.08)}
html.pm2 #sheet .ex button:active,html.pm2 #sheet .fcs-pick button:active{background:var(--mp-fill-dn) !important}
html.pm2 #sheet .b3.white{background:var(--mp-fill) !important;box-shadow:none !important;color:var(--pm-ink) !important}

/* what's picked: pale purple + purple ring, the same in every pop-up */
html.pm2 #sheet .jn-opts button.on,html.pm2 #sheet .jn-seg.feel button.on,html.pm2 #sheet .px-feel button.on,html.pm2 #sheet .fcs-pick button.on{background:var(--mp-on) !important;box-shadow:var(--mp-ring) !important}

/* text boxes: grey to show where to type, white + purple ring while typing (one ring only) */
html.pm2 #sheet .hwin textarea,html.pm2 #sheet .hwin input{background:transparent !important;box-shadow:none !important}
html.pm2 #sheet .hwin:focus-within{background:#fff !important;box-shadow:0 0 0 2px var(--pm-purple) !important}
html.pm2 #sheet .jn-box textarea{background:#fff !important}
html.pm2 #sheet .jn-score input:focus{background:#fff !important;box-shadow:0 0 0 2px var(--pm-purple) !important}
html.pm2 #sheet input:not([type=range]):not([type=checkbox]):not([type=color]){background:var(--mp-fill)}
html.pm2 #sheet .micsm{background:#fff !important;box-shadow:0 1px 3px rgba(16,24,40,.12) !important}

/* segmented controls on white: grey track, white pill */
html.pm2 #sheet .who3,html.pm2 #sheet .jn-seg:not(.feel){background:var(--mp-fill) !important}

/* ticket goals are golden like the tickets themselves (was a lavender box) */
html.pm2 #sheet .tix-note{background:var(--mp-tix) !important;color:var(--mp-tix-ink) !important;box-shadow:none !important}
html.pm2 #sheet .tix-note b{color:var(--mp-tix-ink) !important}
html.pm2 #sheet .tix-note svg{color:var(--mp-tix-ic) !important}
/* prize rows: dark words, coloured icons (star gold, trophy purple) */
html.pm2 #sheet .qz-prize span{color:var(--mp-ink2) !important}
html.pm2 #sheet .qz-prize b{color:var(--pm-ink) !important}

/* journal pop-ups: the pinned Save fades into white now */
html.pm2 #sheet .jn-sh .jn-save{background:linear-gradient(180deg,rgba(255,255,255,0),#fff 34%)}

/* ---------- pages: soft purple boxes inside white cards → the same grey ---------- */
html.pm2 .myf-row,html.pm2 .myf-now,html.pm2 .myf-ed,html.pm2 .myf-shic,html.pm2 .h4-nx,html.pm2 .g-rows,html.pm2 .mt-tabs{background:var(--mp-fill) !important}
html.pm2 .myf-row s{background:rgba(60,60,67,.14) !important}
/* prize lines: one grouped list (Apple style) instead of separate boxes */
html.pm2 #sheet .qz-prize{gap:0 !important;border-radius:16px;overflow:hidden;background:var(--mp-fill)}
html.pm2 #sheet .qz-prize span{border-radius:0 !important;background:none !important}
html.pm2 #sheet .qz-prize span+span{border-top:1px solid rgba(60,60,67,.1)}

/* ---------- one main button colour across the app: MatchPoint purple (green stayed on some flows, purple on others) ----------
   white / ghost / small / slam-coloured / recording / disabled / custom-coloured (player) buttons keep their own look */
html.pm2 .b3:not(.ghost):not(.white):not(.slb):not(.rec):not(.blue):not(.lk):not([disabled]):not([style*="--c"]){background:linear-gradient(180deg,#8B5CF6,#7C3AED) !important;color:#fff !important;box-shadow:0 12px 24px -12px rgba(124,58,237,.8) !important;border:0 !important}
html.pm2 .b3:not(.ghost):not(.white):not(.slb):not(.rec):not(.blue):not(.lk):not([disabled]):not([style*="--c"]):active{background:#6D28D9 !important}

/* ---------- tournament draw: one tidy header line (the class was shared with another header) ---------- */
html.pm2 .draw .dr-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:18px 2px 10px}
html.pm2 .draw .dr-h b{display:inline;font-size:20px;line-height:1.2;letter-spacing:-.02em;margin:0;white-space:nowrap}
html.pm2 .draw .dr-h small{display:inline;font-size:13.5px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--mp-ink2);text-align:right}
/* the tournament / Slam footer button too (it stays white on the coloured trophy screens, .cerf) */
html.pm2 .flow:not(.cerf) .b3.slb:not([disabled]){background:linear-gradient(180deg,#8B5CF6,#7C3AED) !important;color:#fff !important;box-shadow:0 12px 24px -12px rgba(124,58,237,.8) !important;border:0 !important}

/* ---------- Profile: same grey page as every other tab (it was faintly lavender); tickets = a white card with a gold ticket ---------- */
html.pm2 .app[data-tab=me] .scroll{background:transparent !important}
html.pm2 .tkrow{background:#fff !important;box-shadow:var(--pm-sh) !important;border:0 !important}
html.pm2 .tkrow b{color:var(--pm-ink) !important}
html.pm2 .tkrow svg{color:var(--mp-tix-ic) !important}
html.pm2 .tkrow>svg,html.pm2 .tkrow>i,html.pm2 .tkrow>span:first-child{color:var(--mp-tix-ic) !important}
/* picked chips (What did you practise?) — the grey fill above was hiding them: same pale purple + ring as every other pick */
html.pm2 #sheet .jn-chips button.on{background:var(--mp-on) !important;color:#5B21B6 !important;box-shadow:var(--mp-ring) !important}
html.pm2 #sheet .jn-chips button.on svg{color:#7C3AED !important}
/* Journal page: Joshua's hand-drawn tennis doodles behind it (3 Nov). Two halves (top + bottom) so nothing gets cut off on any phone height;
   they sit on the page itself, so they stay put while the journal scrolls over them */
html.pm #app.app[data-tab=mine]{background:url(assets/journal/doodle-top.webp?v=1) center top/100% auto no-repeat,url(assets/journal/doodle-bot.webp?v=1) center bottom 58px/100% auto no-repeat !important;background-color:#F2F2F7 !important}