/* Colour tokens. Fairway (the default) is the classic clubhouse look: deep green bars, white scoreboard panels and a
   yellow accent. --brand is the header and panel-title green, --gold the accent, --under and --over the leaderboard's
   red (under par) and green (level or over). Each colour theme has a light and a dark version. */
:root{--bg:#f3f1e9;--panel:#fff;--line:#e2ded1;--ink:#17261d;--mute:#5b675f;--flag:#006747;--onflag:#fff;--field:#faf9f5;--bad:#b3261e;
  --brand:#006747;--onbrand:#fff;--gold:#f2c94c;--under:#c8102e;--over:#006747;--ta:#c8102e;--tb:#1f4fd1;--onteam:#fff;--trophy:#f2c94c;--ontrophy:#1b2a10;color-scheme:light}
:root:not([data-theme=light]){--bg:#08150f;--panel:#10231a;--line:#21402f;--ink:#eef3ee;--mute:#9fb4a7;--flag:#f2c94c;--onflag:#1b2a10;--field:#0b1b13;--bad:#ff9d8f;
  --brand:#00563b;--onbrand:#fff;--under:#ff6b6b;--over:#6fd19e;--ta:#ff7a7a;--tb:#86a8ff;--onteam:#0d1418;color-scheme:dark}
/* --ta and --tb are the two teams' colours (red and blue, Ryder Cup style) in every theme */
:root[data-palette=links]:not([data-theme=light]){--bg:#0c1c2b;--panel:#132a3f;--line:#24425e;--ink:#eaf2f8;--mute:#9cb3c6;--flag:#7fd1c7;--onflag:#0a2230;--field:#0a1724;--brand:#0b3a5c;--over:#7fd1c7}
:root[data-palette=links][data-theme=light]{--bg:#eef4f8;--panel:#fff;--line:#cfdbe5;--ink:#10283d;--mute:#52687b;--flag:#00707a;--onflag:#fff;--field:#f7fafc;--brand:#0b3a5c;--over:#00707a}
:root[data-palette=heather]:not([data-theme=light]){--bg:#1d1527;--panel:#2a1f38;--line:#433456;--ink:#f3eef7;--mute:#b6a8c4;--flag:#e8a8d8;--onflag:#2a1030;--field:#171020;--brand:#3d2352;--over:#c9b3e8}
:root[data-palette=heather][data-theme=light]{--bg:#f6f1f8;--panel:#fff;--line:#e0d5e6;--ink:#2a1838;--mute:#6b5a78;--flag:#8a2f7a;--onflag:#fff;--field:#fbf8fc;--brand:#3d2352;--over:#5b3a8a}
:root[data-palette=clubhouse]:not([data-theme=light]){--bg:#24120f;--panel:#341a16;--line:#523029;--ink:#f7ede4;--mute:#c4aa9c;--flag:#e2b66b;--onflag:#2a1508;--field:#1c0e0b;--brand:#5a1a14;--over:#e2b66b}
:root[data-palette=clubhouse][data-theme=light]{--bg:#f8f2ea;--panel:#fffdf9;--line:#e6d8c8;--ink:#3a1612;--mute:#7a5a50;--flag:#8c2a1e;--onflag:#fff;--field:#fdf9f4;--brand:#5a1a14;--over:#6b4a12}
:root[data-palette=slate]:not([data-theme=light]){--bg:#16181b;--panel:#202328;--line:#343941;--ink:#eef0f2;--mute:#a3a9b1;--flag:#f0a04b;--onflag:#241302;--field:#121417;--brand:#2b3037;--over:#9fb4c8}
:root[data-palette=slate][data-theme=light]{--bg:#f3f4f6;--panel:#fff;--line:#d8dce1;--ink:#1c2026;--mute:#5c636d;--flag:#b45309;--onflag:#fff;--field:#f8f9fa;--brand:#2b3037;--over:#2f4a63}

/* The golfer of the year banner takes each theme's highlight colour, the same in light and dark */
:root[data-palette=links]{--trophy:#7fd1c7;--ontrophy:#0a2230}
:root[data-palette=heather]{--trophy:#e8a8d8;--ontrophy:#2a1030}
:root[data-palette=clubhouse]{--trophy:#e2b66b;--ontrophy:#2a1508}
:root[data-palette=slate]{--trophy:#f0a04b;--ontrophy:#241302}

/* Base */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-feature-settings:"tnum" 1,"cv11" 1;-webkit-font-smoothing:antialiased}
main{max-width:32rem;margin:0 auto;padding:1.25rem max(1rem,env(safe-area-inset-right)) calc(8.5rem + env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}
h1,h2,.num{font-family:"DM Serif Display",Georgia,serif;font-weight:400;letter-spacing:.005em}
h1{font-size:2.5rem;line-height:1.05;margin:1rem 0 .4rem}
h2{font-size:1.45rem;margin:0 0 .5rem;line-height:1.15}
p{margin:.25rem 0 1rem;color:var(--mute)}
b{font-weight:600}
.sub{color:var(--mute);font-size:.85rem;line-height:1.35}
.lead{color:var(--flag)}
.err{color:var(--bad);margin-top:.6rem}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.eyebrow{display:flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}

/* Top bar: a solid clubhouse-green band with the club badge in the middle */
.topbar{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:5.5rem 1fr 5.5rem;align-items:center;
  padding:.4rem max(.75rem,calc((100vw - 32rem) / 2 + .75rem));background:var(--brand);color:var(--onbrand);box-shadow:inset 0 -3px 0 var(--gold),0 2px 12px rgba(0,0,0,.18)}
#mb{display:flex;flex-direction:column;justify-content:center;gap:5px;width:2.75rem;height:2.75rem;padding:0 .7rem;border:0;background:none}
#mb span{display:block;height:2px;border-radius:2px;background:var(--onbrand)}
.brand{justify-self:center;border:0;background:none;padding:.15rem .5rem}
.brand img{display:block;height:1.9rem;width:auto}

/* Panels: white scoreboard cards; a card's first heading becomes a green title bar */
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:1rem;margin:0 0 1.1rem;box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 24px -16px rgba(0,0,0,.35);overflow:hidden}
.card>h2:first-child{margin:-1rem -1rem 1rem;padding:.65rem 1rem .6rem;background:var(--brand);color:var(--onbrand);font-size:1.2rem;border-bottom:3px solid var(--gold)}
.card h3{margin:1.25rem 0 .5rem;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
#hist h2:not(:first-child){margin:1.5rem 0 .5rem}
.row2{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line)}
.row2:last-child{border-bottom:0}
.row2>button{flex:none;padding:.45rem .85rem;border-radius:99px;border-color:color-mix(in srgb,var(--flag) 45%,var(--line));color:var(--flag);font-size:.85rem;font-weight:600}
.row2>button::after{content:" ›"}
.row2>span>button{padding:.45rem .8rem;border-radius:99px;font-size:.85rem}

/* Forms and buttons */
label{display:block;font-size:.8rem;font-weight:600;color:var(--mute);margin:.9rem 0 .3rem}
input,select{width:100%;padding:.8rem .9rem;border-radius:8px;border:1px solid var(--line);background:var(--field);color:var(--ink);font:inherit}
input:focus,select:focus{outline:none;border-color:var(--flag);box-shadow:0 0 0 3px color-mix(in srgb,var(--flag) 25%,transparent)}
label.check{display:flex;align-items:center;gap:.6rem;font-size:1rem;font-weight:500;color:var(--ink);margin-top:1rem}
label.check input{width:1.25rem;height:1.25rem;accent-color:var(--flag)}
button{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--ink);padding:.8rem 1rem;transition:background .15s,border-color .15s,color .15s}
button:hover{border-color:var(--flag)}
button.go{display:block;width:100%;margin-top:1.1rem;padding:.95rem 1rem;border:0;border-radius:99px;background:var(--flag);color:var(--onflag);font-weight:700;letter-spacing:.02em;box-shadow:0 6px 16px -8px color-mix(in srgb,var(--flag) 80%,transparent)}
#evn{margin-bottom:1.1rem}
button.go:hover{filter:brightness(1.08)}
button.ghost{border-radius:99px;font-weight:600}
button.link{border:0;background:none;color:var(--mute);padding:.4rem 0;text-decoration:underline;text-underline-offset:3px}
.tsel{width:auto;margin-top:.45rem;padding:.4rem .6rem}

/* Home hero: club badge on a mown-stripe green */
.hero{position:relative;margin:-1.25rem -1rem 1.25rem;padding:1.75rem 1.25rem 1.5rem;color:var(--onbrand);text-align:center;
  background:repeating-linear-gradient(100deg,rgba(255,255,255,.055) 0 2.25rem,transparent 2.25rem 4.5rem),linear-gradient(170deg,color-mix(in srgb,var(--brand) 85%,#fff 6%),var(--brand))}
.hero .logo{display:block;width:min(70%,15rem);height:auto;margin:0 auto .75rem;filter:drop-shadow(0 6px 14px rgba(0,0,0,.3))}
.hero p{color:color-mix(in srgb,var(--onbrand) 82%,transparent);margin:0 auto 1.1rem;max-width:20rem}
.hero-cta{display:flex;gap:.6rem;justify-content:center}
.hero-cta button{margin:0;width:auto;flex:1;max-width:12rem;padding:.8rem 1rem}
.hero .go{background:var(--gold);color:#1b2a10}
.hero .ghost{color:var(--onbrand);border-color:rgba(255,255,255,.55)}
.logo{display:block;width:min(72%,17rem);height:auto}

/* Tournament header and tabs */
.t-head{margin:.25rem 0 1rem}
.t-head h1{margin:.35rem 0 .2rem}
.t-head p{margin:0}
.pill{display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .6rem;border-radius:99px;font-size:.72rem;letter-spacing:.08em;border:1px solid var(--line);color:var(--mute)}
.pill.live{color:var(--under);border-color:color-mix(in srgb,var(--under) 45%,transparent)}
.pill.live::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:currentColor;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25}}
.tabs{display:flex;gap:0;margin:0 0 1.1rem;border-bottom:1px solid var(--line)}
.tabs button{flex:1;border:0;border-radius:0;background:none;padding:.8rem .5rem;color:var(--mute);font-weight:600;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs .cur{color:var(--ink);border-bottom-color:var(--gold)}
.holes{display:flex;gap:.4rem;overflow-x:auto;padding:.1rem .1rem .7rem;margin-bottom:.4rem;scrollbar-width:none}
.holes button{flex:none;padding:.5rem .9rem;border-radius:99px;white-space:nowrap;font-size:.9rem;font-weight:600;color:var(--mute)}
.holes .cur{background:var(--brand);border-color:var(--brand);color:var(--onbrand)}
/* Hole picker: little golf balls, filled once a score is in */
.holes button[data-h]{width:2.5rem;height:2.5rem;padding:0;border-radius:50%;color:var(--ink)}
.holes button[data-h].done{background:color-mix(in srgb,var(--flag) 14%,var(--panel));border-color:color-mix(in srgb,var(--flag) 45%,var(--line));color:var(--flag)}
.holes button[data-h].cur{background:var(--gold);border-color:var(--gold);color:#1b2a10;box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 35%,transparent)}

/* Scoring a hole */
.card.hole .eyebrow{margin-bottom:.15rem}
.card.hole h2{font-size:2rem;margin-bottom:.75rem}
.facts{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.facts div{padding:.55rem .6rem;text-align:center;border-left:1px solid var(--line);background:var(--field)}
.facts div:first-child{border-left:0}
.facts small{display:block;font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.facts b{font-size:1.25rem}
.step{display:flex;align-items:center;justify-content:center;gap:1.25rem;margin:1.5rem 0 .5rem}
.step button{width:3.6rem;height:3.6rem;padding:0;border-radius:50%;font-size:1.8rem;line-height:1;color:var(--flag);border-width:2px}
.ball{display:grid;place-items:center;align-content:center;width:8.5rem;height:8.5rem;border-radius:50%;background:radial-gradient(circle at 35% 28%,var(--panel),var(--field) 70%);border:2px solid var(--line);box-shadow:inset 0 -6px 14px rgba(0,0,0,.08)}
.ball .num{font-size:4.25rem;line-height:1}
.ball small{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}

/* Leaderboard: scoreboard rows, red under par, green over */
.card.board{padding-top:0}
.lb-head{display:grid;grid-template-columns:2.4rem 1fr auto;gap:.75rem;margin:0 -1rem;padding:.55rem 1rem;background:var(--brand);color:var(--onbrand);font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-bottom:3px solid var(--gold)}
.row{display:grid;grid-template-columns:2.4rem 1fr auto;gap:.75rem;align-items:center;width:100%;padding:.8rem 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.row:hover{background:color-mix(in srgb,var(--flag) 5%,transparent)}
.row[aria-expanded=true]{border-bottom-color:transparent}
.row .num{font:700 1.6rem/1 Inter,system-ui,sans-serif;min-width:3rem;text-align:right}
.under{color:var(--under)!important}
.over,.even{color:var(--over)}
.pos{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;font:700 .85rem/1 Inter,system-ui,sans-serif;color:var(--ink);background:var(--field);border:1px solid var(--line)}
.pos.p1{background:linear-gradient(145deg,#f6dc7a,#c99a1c);border-color:transparent;color:#2a1d00}
.pos.p2{background:linear-gradient(145deg,#eef0f2,#a7afb8);border-color:transparent;color:#1b1f24}
.pos.p3{background:linear-gradient(145deg,#e7a36a,#a8612a);border-color:transparent;color:#2a1405}
.medal{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;margin-right:.3rem;vertical-align:.05em}
.medal.m1{background:#d9ae2f}.medal.m2{background:#b4bcc5}.medal.m3{background:#c27a3e}
.detail{padding:.25rem 0 1rem;border-bottom:1px solid var(--line)}
.pl-btn{border:0;padding:0;background:none;color:var(--ink);font-weight:600;text-align:left}
.pl-btn::after{content:" ▸";color:var(--mute);font-size:.75em}
.pl-btn[aria-expanded=true]::after{content:" ▾"}
.holes-t tr.open>*{background:color-mix(in srgb,var(--flag) 7%,transparent)}
.holes-t tr.exp>td{padding:0;text-align:left;border-bottom:2px solid var(--brand)}
/* The results table can be wider than the screen; keep the opened scorecard pinned to the visible width */
.holes-t tr.exp .detail{position:sticky;left:0;width:calc(min(32rem,100vw - 2rem) - 2rem - 2px);padding:.5rem .25rem .75rem;border:0}
.holes-t tr.exp .holes-t{font-size:.8rem}

/* Scorecards and results tables */
.scroll{overflow-x:auto;margin:.25rem 0 .75rem}
.holes-t{width:100%;border-collapse:collapse;font-size:.85rem;text-align:center}
.holes-t th,.holes-t td{padding:.4rem .2rem;border-bottom:1px solid var(--line)}
.holes-t tr:first-child th{background:var(--field);color:var(--mute);font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.holes-t th{color:var(--mute);font-weight:500}
.holes-t th:first-child{text-align:left;padding-right:.5rem}
.holes-t th.nm,.holes-t td.nm{color:var(--ink);font-weight:600;text-align:left}
.holes-t td span{display:inline-grid;place-items:center;min-width:1.6rem;height:1.6rem}
.holes-t td span.b,.key .b{border:1.5px solid var(--under);border-radius:50%;color:var(--under)}
.holes-t td span.e,.key .e{border:1.5px solid var(--under);border-radius:50%;color:var(--under);box-shadow:0 0 0 2px var(--panel),0 0 0 3.5px var(--under)}
.holes-t td span.bo,.key .bo{border:1.5px solid var(--mute);border-radius:3px}
.holes-t td span.db,.key .db{border:1.5px solid var(--mute);border-radius:3px;box-shadow:0 0 0 2px var(--panel),0 0 0 3.5px var(--mute)}
.key{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .5rem;font-size:.75rem;margin:.25rem 0 0}
.key span{display:inline-grid;place-items:center;width:1.35rem;height:1.35rem;font-size:.72rem;color:var(--ink);margin-left:.3rem}
.key span:first-child{margin-left:0}

/* Stats */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.tiles.t3{grid-template-columns:repeat(3,1fr)}
.tile{padding:.75rem .8rem;border:1px solid var(--line);border-radius:8px;background:var(--field);border-top:3px solid var(--brand)}
.tile small{display:block;font-size:.75rem;line-height:1.3;color:var(--mute)}
.tile small:first-child{font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tile .num{font-size:2rem;line-height:1.15;margin:.1rem 0}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{padding:.25rem .7rem;border:1px solid var(--line);border-radius:99px;background:var(--field);font-weight:600;font-size:.9rem}
.teams{display:flex;align-items:center;justify-content:space-around;gap:.5rem;text-align:center}
.team small{display:block;color:var(--mute);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.team .num{font-size:2.8rem;line-height:1.1}
.team.first .num{color:var(--flag)}
.vs{color:var(--mute);font-family:"DM Serif Display",Georgia,serif;font-style:italic}

/* Settings */
.pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.5rem}
.pal button{display:flex;align-items:center;gap:.6rem;padding:.65rem .75rem;text-align:left}
.pal button[aria-checked=true]{border-color:var(--flag);box-shadow:0 0 0 1px var(--flag)}
.sw{display:inline-flex;flex:none}
.sw i{width:1rem;height:1rem;border-radius:50%;border:1px solid rgba(128,128,128,.45);margin-right:-.3rem}

/* Side menu */
#scrim{position:fixed;inset:0;z-index:10;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .2s}
#scrim.open{opacity:1;pointer-events:auto}
#nav{position:fixed;top:0;bottom:0;left:0;z-index:20;width:min(84vw,19rem);padding:0 .75rem 1rem;overflow-y:auto;background:var(--panel);box-shadow:8px 0 30px rgba(0,0,0,.25);transform:translateX(-100%);visibility:hidden;transition:transform .22s ease,visibility .22s}
#nav.open{transform:none;visibility:visible}
.nav-h{display:flex;align-items:center;gap:.6rem;margin:0 -.75rem .75rem;padding:.75rem 1rem;background:var(--brand);color:var(--onbrand);border-bottom:3px solid var(--gold);font:1.35rem "DM Serif Display",Georgia,serif}
.nav-h img{height:1.6rem;width:auto}
.nav-h span{flex:1}
#mx{border:0;padding:.2rem .5rem;font-size:1.8rem;line-height:1;color:var(--onbrand);background:none}
.nav-i,.nav-g{display:flex;align-items:center;gap:.8rem;width:100%;padding:.8rem .75rem;border:0;border-radius:8px;text-align:left;font-weight:500}
.nav-i:hover,.nav-s:hover{background:var(--field)}
.nav-i svg,.nav-g svg{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:var(--flag);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-g{padding-bottom:.25rem;cursor:default;color:var(--mute);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.nav-sep{border:0;border-top:1px solid var(--line);margin:.5rem 0}
.nav-s{display:block;width:100%;padding:.55rem .75rem .55rem 2.8rem;border:0;border-radius:8px;text-align:left}
.nav-s[aria-expanded]::after{content:"▸";float:right;color:var(--mute)}
.nav-s[aria-expanded="true"]::after{content:"▾"}
.nav-y{padding:.4rem .75rem .4rem 3.8rem;font-size:.9rem;color:var(--mute)}

/* Setting up: segmented buttons and option cards, both radio buttons underneath */
.lbl{font-size:.8rem;font-weight:600;color:var(--mute);margin:1rem 0 .4rem}
.seg{display:flex;gap:.35rem}
.seg label{flex:1 1 0;min-width:0;margin:0}
.seg input,.opts input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.seg span{display:block;padding:.6rem .7rem;border:1px solid var(--line);border-radius:99px;background:var(--field);color:var(--ink);font-size:.92rem;font-weight:600;text-align:center;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s,border-color .15s}
.seg input:checked+span{background:var(--brand);border-color:var(--brand);color:var(--onbrand)}
.seg input:focus-visible+span,.opts input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.opts{display:grid;gap:.45rem}
.opts label{margin:0}
.opts span{position:relative;display:block;padding:.7rem .85rem .7rem 2.5rem;border:1px solid var(--line);border-radius:10px;background:var(--field);cursor:pointer;transition:background .15s,border-color .15s}
.opts span::before{content:"";position:absolute;left:.85rem;top:.9rem;width:1.05rem;height:1.05rem;border-radius:50%;border:2px solid var(--line);background:var(--panel)}
.opts b{display:block;color:var(--ink);font-size:.95rem}
.opts small{display:block;margin-top:.1rem;color:var(--mute);font-size:.8rem;line-height:1.35}
.opts input:checked+span{border-color:var(--flag);background:color-mix(in srgb,var(--flag) 8%,var(--field));box-shadow:0 0 0 1px var(--flag)}
.opts input:checked+span::before{border-color:var(--flag);background:radial-gradient(circle,var(--flag) 42%,var(--panel) 47%)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
#apf{margin:.25rem 0 .25rem}
.ap{padding:.55rem 0}
.ap>div:first-child{min-width:0}
.ap .seg{flex:0 0 auto;width:min(16rem,66%);gap:.25rem}
.ap .seg span{padding:.4rem .3rem;font-size:.8rem}
.ap .seg label:first-child{flex:0 0 2.6rem}
.ap .seg label:first-child input:checked+span{background:var(--field);border-color:var(--line);color:var(--mute)}
.ap .seg label:nth-child(2) input:checked+span{background:var(--ta);border-color:var(--ta);color:var(--onteam)}
.ap .seg label:nth-child(3) input:checked+span{background:var(--tb);border-color:var(--tb);color:var(--onteam)}
.ap.hide{display:none}
.card.sum{position:sticky;bottom:.5rem;z-index:2;padding:.6rem .85rem .75rem;border-top:3px solid var(--gold)}
.card.sum p{margin:.15rem 0 0;color:var(--ink);font-size:.85rem;font-weight:500;line-height:1.35}
.card.sum .go{margin-top:.55rem;padding:.8rem 1rem}
.card.sum .err:empty{display:none}
.warn{color:var(--bad)}
/* A result decided by more than the scores (see winning_team and note) */
.note{padding:.55rem .75rem;border-left:3px solid var(--gold);border-radius:4px;background:color-mix(in srgb,var(--gold) 12%,var(--field));color:var(--ink);font-size:.88rem}
.pill.win{margin-left:.3rem;padding:.05rem .45rem;border-color:var(--gold);background:color-mix(in srgb,var(--gold) 25%,transparent);color:var(--ink);font-size:.62rem;font-weight:700;text-transform:uppercase;vertical-align:.1em}
.nw{white-space:nowrap}
.cg{table-layout:fixed;margin:.75rem 0 .25rem}
.cg th:first-child{width:2.4rem}
.cg td{padding:.15rem .08rem}
.hc{padding:.45rem 0;text-align:center;border-radius:6px;font-size:.95rem}
button:disabled{opacity:.4;cursor:default}
button:disabled:hover{border-color:var(--line)}

/* Scoring a hole: quick picks, previous hole, and hole buttons tinted by result */
.hole-top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.res{margin:.15rem 0 0;text-align:center;color:var(--ink);font-weight:600}
.quick{display:grid;grid-template-columns:repeat(5,1fr);gap:.35rem;margin-top:.9rem}
.quick button{display:grid;gap:.05rem;padding:.4rem .15rem;line-height:1.15;background:var(--field)}
.quick b{font-size:1.15rem}
.quick small{font-size:.62rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.quick .cur{background:var(--brand);border-color:var(--brand);color:var(--onbrand)}
.quick .cur small{color:inherit}
.nav2{display:flex;gap:.5rem;align-items:center;margin-top:1.1rem}
.nav2 .go{flex:1;margin:0}
#prv{flex:none;width:3.1rem;height:3.1rem;padding:0;border-radius:50%;font-size:1.6rem;line-height:1;color:var(--flag)}
.holes button[data-h].done.b,.holes button[data-h].done.e{color:var(--under);border-color:color-mix(in srgb,var(--under) 50%,var(--line));background:color-mix(in srgb,var(--under) 10%,var(--panel))}
.holes button[data-h].done.bo,.holes button[data-h].done.db{color:var(--mute);border-color:var(--line);background:var(--field)}
.holes-t tr:first-child th.cur,.holes-t td.cur{background:color-mix(in srgb,var(--gold) 30%,transparent)}
.holes-t th button{width:100%;padding:0;border:0;border-radius:0;background:none;color:inherit;font:inherit}
.sec{margin:1.4rem 0 .5rem;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}

/* Team scoreboard */
.th{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;text-align:center}
.tside small{display:block;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tside.a small{color:var(--ta)}.tside.b small{color:var(--tb)}
.tside .num{font-size:3rem;line-height:1.05}
.tside.lead.a .num{color:var(--ta)}.tside.lead.b .num{color:var(--tb)}
.tstrip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.3rem .6rem;margin:0 0 1rem;padding:.55rem .8rem;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.tstrip>span{font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.tstrip>span b{font:400 1.35rem/1 "DM Serif Display",Georgia,serif;letter-spacing:0;vertical-align:-.1em}
.tstrip .a{color:var(--ta)}.tstrip .b{color:var(--tb)}
.tstrip .tbar{margin:0;height:.55rem}
.tstrip p{grid-column:1/-1;margin:0;text-align:center;font-size:.78rem}
.tbar{position:relative;display:flex;height:.75rem;margin:.75rem 0 .45rem;border-radius:99px;overflow:hidden;background:var(--field);border:1px solid var(--line)}
.tbar i{display:block;height:100%}
.tbar span{flex:1}
.tbar .a{background:var(--ta)}.tbar .b{background:var(--tb)}
.tbar .l{opacity:.35}
.tbar em{position:absolute;left:50%;top:-2px;bottom:-2px;width:2px;margin-left:-1px;background:var(--ink);opacity:.55}
.tline{margin:0;text-align:center;font-size:.88rem;color:var(--ink)}
.tline.sub{margin-top:.4rem;color:var(--mute)}

/* Matches and groups */
.mcard{margin:0 0 .6rem;padding:.65rem .75rem;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.mcard.la,.mcard.t0{box-shadow:inset 4px 0 0 var(--ta)}
.mcard.lb,.mcard.t1{box-shadow:inset -4px 0 0 var(--tb)}
.card>.mcard:last-child{margin-bottom:0}
.mhead{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.35rem}
.mhead small{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.mhead b{font:700 1.3rem/1 Inter,system-ui,sans-serif}
.mrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem}
.ms{display:flex;flex-direction:column;min-width:0;font-weight:600;line-height:1.3}
.ms.b{text-align:right}
.ms .me{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.la .ms.a{color:var(--ta)}.lb .ms.b{color:var(--tb)}
.mst{display:grid;justify-items:center;min-width:4.75rem;text-align:center}
.mst b{padding:.2rem .65rem;border:1px solid var(--line);border-radius:99px;background:var(--panel);font:700 1.1rem/1.2 Inter,system-ui,sans-serif;white-space:nowrap}
.la .mst b{background:var(--ta);border-color:var(--ta);color:var(--onteam)}
.lb .mst b{background:var(--tb);border-color:var(--tb);color:var(--onteam)}
.mst small{margin-top:.2rem;font-size:.72rem;color:var(--mute)}
.strip{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:2px;margin:.65rem 0 .1rem}
.strip i{height:.55rem;border-radius:2px;background:var(--line)}
.strip i.a{background:var(--ta)}.strip i.b{background:var(--tb)}
.strip i.h{background:var(--mute);opacity:.55}
.strip i.now{outline:2px solid var(--gold);outline-offset:1px}
.mhere{display:grid;grid-template-columns:auto repeat(var(--c),1fr);gap:.6rem;align-items:start;margin-top:.55rem;padding-top:.5rem;border-top:1px dashed var(--line);font-size:.85rem}
.mhere>small{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding-top:.1rem}
.mhere .ms{font-weight:500}
.mhere b.b,.mhere b.e{color:var(--under)}

@media (prefers-reduced-motion:reduce){#nav,#scrim,button{transition:none}.pill.live::before{animation:none}}

/* Leaderboards page */
.lbd{margin:.45rem 0 0}
.lbo{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem}
.lbo button{padding:.45rem .9rem;font-size:.85rem}
.lbe{padding:1rem 0 0}

/* Live ticker: a leaderboard strip fixed under the top bar while a tournament is being played. It scrolls sideways;
   the round badge and the All players / Favourites switch stay pinned on the left. */
#tick{position:sticky;top:calc(3.55rem + env(safe-area-inset-top));z-index:4;background:var(--panel);border-bottom:1px solid var(--line);box-shadow:0 2px 10px -6px rgba(0,0,0,.35)}
#tick[hidden]{display:none}
.tkr{display:flex;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.tkr::-webkit-scrollbar{display:none}
.tkl{position:sticky;left:0;z-index:1;flex:none;display:flex;align-items:center;gap:.5rem;padding:.45rem .6rem;background:var(--panel);border-right:1px solid var(--line)}
.tkl>div{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.tkrd{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;border:2px solid var(--flag);color:var(--flag);font:1.05rem/1 "DM Serif Display",Georgia,serif}
.tkname{max-width:6.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.7rem;color:var(--ink)}
.tkl div button{border:0;padding:.05rem 0;font-size:.68rem;color:var(--mute);display:flex;align-items:center;gap:.3rem;border-radius:4px}
.tkl div button::before{content:"";width:.4rem;height:.4rem;border-radius:50%;border:1px solid currentColor}
.tkl div button.on{color:var(--flag);font-weight:600}
.tkl div button.on::before{background:currentColor}
.tki{flex:none;position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:0 .45rem;width:11.5rem;padding:.45rem .55rem .45rem 1.45rem;border-right:1px solid var(--line);scroll-snap-align:start}
.tki.me{background:color-mix(in srgb,var(--gold) 14%,var(--panel))}
.tkp{position:absolute;top:.3rem;left:.4rem;font:.85rem/1 "DM Serif Display",Georgia,serif;color:var(--ink)}
.tka{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--brand);color:var(--onbrand);font-size:.8rem;font-weight:700;letter-spacing:.03em}
.tka.t0{background:var(--ta);color:var(--onteam)}.tka.t1{background:var(--tb);color:var(--onteam)}
.tkn{min-width:0;border:0;padding:0;text-align:left;display:flex;flex-direction:column;border-radius:4px}
.tkn b{font:.85rem/1.2 "DM Serif Display",Georgia,serif;text-transform:uppercase;letter-spacing:.04em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tkn span{font-size:.68rem;color:var(--mute);white-space:nowrap}
.tkn em{font:1.2rem/1.1 "DM Serif Display",Georgia,serif;font-style:normal;color:var(--ink);margin-right:.15rem}
.tkn em small{font:600 .6rem Inter,system-ui,sans-serif;margin-left:.1rem;color:var(--mute)}
.tks{align-self:start;border:0;padding:0 .1rem;font-size:1rem;line-height:1;color:var(--mute)}
.tks.on{color:var(--gold)}
.tkt{width:auto;padding:.45rem .8rem;display:flex;gap:.8rem;border-width:0 1px 0 0;border-radius:0;text-align:left}
.tkt span{display:flex;flex-direction:column;padding-left:.45rem;border-left:4px solid var(--ta)}
.tkt span.t1{border-color:var(--tb)}
.tkt b{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.tkt em{font:1.3rem/1.1 "DM Serif Display",Georgia,serif;font-style:normal}
.tkt .lead b{color:var(--ink)}
.tke{margin:0;padding:.9rem 1rem;font-size:.8rem;white-space:nowrap}
@media (min-width:48rem){.tkr{justify-content:safe center}}
/* On a phone the left panel scrolls away with the players, so more of the leaderboard fits */
@media (max-width:40rem){.tkl{position:static}.tki{width:10rem}.tkname{max-width:5.5rem}}

/* Chevron golfer of the year: the latest Chevron Invitational champion, on a highlight-colour banner with mown stripes */
.goty{display:block;width:100%;margin:0 0 1.1rem;padding:0;border:0;border-radius:10px;text-align:left;color:var(--ontrophy);overflow:hidden;
  background:radial-gradient(120% 90% at 85% 10%,rgba(255,255,255,.35),transparent 60%),repeating-linear-gradient(100deg,rgba(255,255,255,.09) 0 2.25rem,transparent 2.25rem 4.5rem),linear-gradient(170deg,var(--trophy),color-mix(in srgb,var(--trophy) 88%,#000));
  box-shadow:inset 0 -3px 0 color-mix(in srgb,var(--ontrophy) 25%,transparent)}
.goty:hover{border:0}
.gtop{display:flex;align-items:center;gap:.6rem;padding:.75rem 1rem .25rem}
.gpos{font:600 .9rem/1 Inter,system-ui,sans-serif}
.gstar{font-size:.95rem;opacity:.75}
.gtitle{flex:1;min-width:0;text-align:right;font:.74rem/1.15 "DM Serif Display",Georgia,serif;text-transform:uppercase;letter-spacing:.08em}@media (min-width:26rem){.gtitle{letter-spacing:.12em}}
.gbox{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:2.6rem;padding:.3rem .4rem;border-radius:3px;background:color-mix(in srgb,#fff 35%,transparent);line-height:1}
.gbox em{font:1rem/1 "DM Serif Display",Georgia,serif;font-style:normal}
.gbox small{font-size:.55rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.75;margin-top:.15rem}
.gbox:not(.f):not(.r){background:var(--brand);color:var(--onbrand);box-shadow:inset 0 3px 0 color-mix(in srgb,#000 25%,transparent)}
.gbody{display:flex;align-items:flex-end;gap:1rem;padding:.25rem 1rem 1.1rem}
.gbody svg{flex:none;width:5.5rem;height:auto;fill:color-mix(in srgb,var(--ontrophy) 85%,transparent);filter:drop-shadow(0 6px 10px rgba(0,0,0,.2))}
.gwho{display:flex;flex-direction:column;min-width:0}
.gyr{font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.75;margin-bottom:.35rem}
.gfirst{font-weight:600;font-size:1.05rem;line-height:1.1}
.glast{font:3.4rem/.95 "DM Serif Display",Georgia,serif;text-transform:uppercase;letter-spacing:.01em;overflow-wrap:anywhere}
.gnote{font-size:.8rem;margin-top:.35rem;opacity:.85}
.grds{display:flex;gap:.35rem;margin-top:.55rem}
.grds span{display:flex;align-items:baseline;gap:.3rem;padding:.2rem .5rem;border-radius:3px;background:color-mix(in srgb,#fff 35%,transparent);font:1rem/1.2 "DM Serif Display",Georgia,serif}
.grds small{font:600 .6rem Inter,system-ui,sans-serif;letter-spacing:.06em;opacity:.75}
.gstrip{display:flex;gap:2px;margin-top:.6rem}
.gstrip i{width:.8rem;height:.4rem;background:color-mix(in srgb,var(--ontrophy) 20%,transparent)}
.gstrip i.u{background:var(--ta)}.gstrip i.e{background:color-mix(in srgb,#fff 55%,transparent)}.gstrip i.o{background:var(--brand)}
@media (min-width:33rem){.glast{font-size:4.2rem}.gbody svg{width:7rem}}
/* With the champion's cutout photo, it stands on the bottom-left corner of the banner, beside the name */
.goty{position:relative}
.gbody.ph{padding-left:calc(var(--gph) + .9rem);min-height:calc(var(--gph) - 1rem)}
.goty:has(.gph){--gph:10rem}
.gph{position:absolute;left:.4rem;bottom:0;width:var(--gph);height:auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.25))}
@media (min-width:33rem){.goty:has(.gph){--gph:13rem}}

/* Players list: a club badge for each major won, beside the name */
.mjb{display:inline-flex;flex:none;gap:.15rem}
.dname{display:flex;align-items:center;gap:.4rem;white-space:nowrap}
.dhcp{font-size:.75rem}
.mjb img{display:block;height:1.15rem;width:auto}
/* The ticker's round badge is a button to the tournament leaderboard */
button.tkrd{padding:0;background:none;cursor:pointer}
button.tkrd:hover{background:color-mix(in srgb,var(--flag) 12%,transparent);border-color:var(--flag)}

/* A major edition's photo: full width across its results card, with the edition name over the bottom */
.edimg{position:relative;margin:.25rem -1rem 1rem;overflow:hidden}
.edimg img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.edimg figcaption{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;padding:2.5rem 1rem .7rem;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6));text-shadow:0 1px 3px rgba(0,0,0,.4)}
.edimg b{font:1.6rem/1.1 "DM Serif Display",Georgia,serif;font-weight:400}
.edimg span{font-size:.8rem;opacity:.9}

/* The hole in one's column on its scorecard */
.holes-t .ace{background:color-mix(in srgb,var(--gold) 35%,transparent)}
.links{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem}

/* Profile photos: round, with the club's gold ring; initials when there's no photo */
.av{display:inline-grid;place-items:center;flex:none;border-radius:50%;overflow:hidden;background:var(--brand);color:var(--onbrand);font-weight:700;box-shadow:0 0 0 3px var(--gold)}
.av img{display:block;width:100%;height:100%;object-fit:cover}
.av.xl{width:5.5rem;height:5.5rem;font-size:1.6rem}
.avedit{display:flex;align-items:center;gap:1.1rem;margin:.25rem 0 1rem}
.avedit .ghost{width:auto;padding:.55rem .9rem;margin-right:.6rem}
.avedit .sub{margin-top:.35rem}
.phead{display:flex;align-items:center;gap:1rem;margin:1rem 0 .75rem}
.phead h1{margin:0}
.tka{overflow:hidden}.tka img{display:block;width:100%;height:100%;object-fit:cover}

/* User management: each account, with the temporary password and Share button after creating or resetting one */
.um{align-items:flex-start}
.um.new{margin:0 -1rem;padding:.75rem 1rem;background:color-mix(in srgb,var(--gold) 16%,transparent)}
.umb{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.4rem;flex:none;max-width:45%}
.umb button{white-space:nowrap}
.ued>div{flex:1}
.ued .umb{justify-content:flex-start;align-items:center;max-width:none;margin-top:.75rem}
.ued .umb button.go{width:auto;margin:0;padding:.6rem 1.4rem}
.tpw{margin-top:.4rem;font-size:.85rem}
.tpw code{display:inline-block;margin-left:.25rem;padding:.15rem .45rem;border-radius:5px;background:var(--field);border:1px solid var(--line);font:600 .95rem ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;color:var(--ink);user-select:all}
.row2>span>button.wa{background:#25d366;border-color:#25d366;color:#fff;font-weight:600}
.row2>span>button.wa:hover{background:#1fb855}

/* Events: sign-up buttons, who's going, and round statuses */
.rsvp{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.25rem 0 .5rem}
.rsvp button{padding:.8rem 1rem;border-radius:99px;font-weight:700}
.rsvp button.cur{background:var(--flag);border-color:var(--flag);color:var(--onflag)}
.evps{display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0}
.evp{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .7rem .2rem .2rem;border:1px solid var(--line);border-radius:99px;font-size:.9rem}
.evp .av{width:1.7rem;height:1.7rem;font-size:.7rem;box-shadow:none}
.pill.scheduled{color:var(--ink)}
.row2>span>button.go-s{background:var(--flag);border-color:var(--flag);color:var(--onflag);font-weight:600}
.holes button.scheduled{opacity:.55;border-style:dashed}
.holes button.finished{opacity:.75}

/* Course directory: filters, map and the list of courses by country */
.cdc{flex-wrap:wrap}
.cdc button i,.cdkey i,.cdk{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-right:.35rem;vertical-align:.05rem}
.cdk{width:.75rem;height:.75rem;box-shadow:0 0 0 2px #fff}
.cdn{float:right;font:600 .85rem Inter,system-ui,sans-serif;opacity:.8;margin-top:.3rem}
.cdf input[type=range]{width:100%;accent-color:var(--flag)}
.cdmap{position:relative;z-index:0;height:min(60vh,26rem);margin:-.25rem 0 .5rem;border-radius:10px;overflow:hidden;background:var(--field);border:1px solid var(--line)}
.cdmap>p{padding:1rem}
.cdmap .leaflet-popup-content{font:400 .85rem/1.4 Inter,system-ui,sans-serif;color:#17261d}
.cdmap .leaflet-popup-content a{color:#006747;font-weight:600}
.cdkey{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.85rem;color:var(--mute)}
.cdr{align-items:flex-start}
.cdr>div{flex:1;min-width:0}
.cdrk{flex:none;display:inline-grid;place-items:center;min-width:2rem;height:2rem;padding:0 .3rem;border-radius:99px;background:var(--field);border:1px solid var(--line);font-weight:700;font-size:.85rem;color:var(--mute)}
.cdpr{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}
.cdpr b{font-size:1.05rem}
.cdts{display:flex;flex-wrap:wrap;gap:.3rem;margin:.3rem 0 .15rem}
.cdt{padding:.05rem .5rem;border-radius:99px;border:1px solid var(--line);font-size:.72rem;color:var(--mute);white-space:nowrap}
.cdt.on{border-color:color-mix(in srgb,var(--flag) 50%,var(--line));color:var(--flag)}
.cdw{color:var(--bad)}

/* Navigation: the back arrow beside the menu button, and the tab bar along the bottom for the main sections */
.tl{display:flex;align-items:center}
#bkb{display:grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;border:0;background:none;color:var(--onbrand)}
#bkb[hidden]{display:none}
#bkb svg{width:1.6rem;height:1.6rem;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
#tabbar{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;justify-content:center;gap:.15rem;
  padding:.3rem max(.5rem,calc((100vw - 32rem) / 2)) calc(.3rem + env(safe-area-inset-bottom));
  background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -4px 16px -10px rgba(0,0,0,.35)}
#tabbar button{flex:1;max-width:6.5rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.35rem .2rem .3rem;
  border:0;border-radius:10px;background:none;color:var(--mute);font-size:.7rem;font-weight:600;letter-spacing:.01em}
#tabbar svg{width:1.4rem;height:1.4rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#tabbar button.cur{color:var(--flag);background:color-mix(in srgb,var(--flag) 10%,transparent)}
@media (prefers-reduced-motion:no-preference){#tabbar button{transition:color .15s,background .15s}}

/* Where we've played: gold crown markers on the map, and the crown beside each round's best player */
.cdpm{display:grid;place-items:center;color:#c99a06}
.cdpm svg{width:18px;height:18px;filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 1px 1px rgba(0,0,0,.4))}
svg.crown{fill:currentColor;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.cdcw{display:flex;align-items:center;gap:.35rem;margin-top:.25rem;font-size:.9rem}
.cdcw svg.crown{flex:none;width:1.15rem;height:1.15rem;color:#c99a06}
.cdkey .pk{display:inline-flex;align-items:center;gap:.3rem}
.cdkey .pk svg.crown{width:.95rem;height:.95rem;color:#c99a06}
.cdt.pl{display:inline-flex;align-items:center;gap:.25rem;border-color:#e2bf55;color:#8a6a00}
.cdt.pl svg.crown{width:.8rem;height:.8rem}
.cdmap .pr{margin-top:.45rem;padding-top:.45rem;border-top:1px solid #e2ded1}
.cdmap .pr .cdcw{font-size:.85rem}
:root:not([data-theme=light]) .cdt.pl{border-color:#8a6a00;color:#f2c94c}

/* Install the app, in App settings */
#inst .ok{color:var(--flag);font-weight:600}
#inst .steps{margin:.25rem 0 0;padding-left:1.3rem}
#inst .steps li{margin:.3rem 0}

/* iPhone notch, clock and home bar: the top bar, menu and tab bar reach under them, with their contents kept clear
   (the insets are 0 everywhere else, so this changes nothing in a normal browser) */
.topbar{padding-top:calc(.4rem + env(safe-area-inset-top));padding-left:max(.75rem,env(safe-area-inset-left),calc((100vw - 32rem) / 2 + .75rem));padding-right:max(.75rem,env(safe-area-inset-right),calc((100vw - 32rem) / 2 + .75rem))}
#nav{padding-left:max(.75rem,env(safe-area-inset-left));padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
.nav-h{padding-top:calc(.75rem + env(safe-area-inset-top));margin-left:calc(-1 * max(.75rem,env(safe-area-inset-left)))}

/* Courses added by players: the add card, flag markers, stars, and the add/edit form with its map and star rating */
.pca{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.pca>div{flex:1 1 14rem}
.pca h2{margin-bottom:.2rem}
.pca .go{width:auto;margin:0;padding:.75rem 1.3rem}
svg.pcfl{fill:currentColor;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.pcm span{display:block;width:28px;height:28px}
.pcm svg{width:28px;height:28px;filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 1px 1px rgba(0,0,0,.45))}
.cdkey .pk svg.pcfl{width:.9rem;height:.9rem;vertical-align:-.12rem;margin-right:.3rem;color:var(--mute)}
.cdt.pcb{display:inline-flex;align-items:center;gap:.25rem}
.cdt.pcb svg.pcfl{width:.75rem;height:.75rem}
.cdrk.pcr{color:#a07800;font-size:.8rem}
.stars{color:#e0a800;letter-spacing:.05em;font-size:.95rem}
.stars>span{color:var(--line)}
.pcloc{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-bottom:.6rem}
.pcloc .ghost{padding:.6rem 1rem}
.pcmap{margin:0 0 .4rem;cursor:crosshair}
.pcfee{display:flex;gap:.5rem}
.pcfee select{width:4.5rem;flex:none}
fieldset.rate{border:0;padding:0;margin:1rem 0 0}
fieldset.rate legend{font-size:.8rem;font-weight:600;color:var(--mute);padding:0;margin-bottom:.2rem}
.rstars{display:inline-flex}
.rstars input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.rstars label{margin:0;padding:0 .1rem;font-size:2.1rem;line-height:1;color:#e0a800;cursor:pointer}
.rstars:not(:has(:checked)) label,.rstars input:checked + label ~ label{color:var(--line)}
.rstars.rstars:hover label{color:#e0a800}
.rstars.rstars:hover label:hover ~ label{color:var(--line)}
.rstars input:focus-visible + label{outline:2px solid var(--flag);outline-offset:2px;border-radius:4px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Hole-in-one quotes (home page and the picker on Profile) */
.aq{margin:.45rem 0 0;padding:.1rem 0 .1rem .7rem;border-left:3px solid var(--gold);color:var(--ink);font-size:1.1rem;line-height:1.3;overflow-wrap:anywhere}
.qf-playfair{font-family:"Playfair Display",Georgia,serif;font-style:italic}
.qf-dancing{font-family:"Dancing Script",cursive;font-weight:600;font-size:1.25em}
.qf-vibes{font-family:"Great Vibes",cursive;font-size:1.4em}
.qf-pacifico{font-family:Pacifico,cursive}
.qf-caveat{font-family:Caveat,cursive;font-weight:600;font-size:1.3em}
.qf-lobster{font-family:Lobster,cursive}
.qf-satisfy{font-family:Satisfy,cursive;font-size:1.15em}
.qf-marker{font-family:"Permanent Marker",cursive}
.qf-cormorant{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:1.2em}
.qf-kaushan{font-family:"Kaushan Script",cursive}
.qf-inter{font-family:Inter,system-ui,sans-serif}
.qf-dmserif{font-family:"DM Serif Display",Georgia,serif}
#aqt{width:100%;padding:.8rem .9rem;border-radius:8px;border:1px solid var(--line);background:var(--field);color:var(--ink);font:inherit;resize:vertical}
#aqf{font-size:1.1rem}
#aqf optgroup{font:600 .8rem Inter,system-ui,sans-serif;color:var(--mute)}
#aqf option{font-size:1.1rem;color:var(--ink)}
.aqprev{padding:.6rem .75rem;border:1px dashed var(--line);border-radius:10px}
.aqprev .aq{margin:0}
#aq .go{margin-top:1rem}
/* The quote tile on a player's page: small until it's opened to edit */
#aq{padding:.75rem 1rem}
#aq.open{padding:1rem}
.aqhead{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:2rem}
.aqhead small{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.aqhead .ghost{width:auto;padding:.35rem .85rem;border-radius:99px;font-size:.85rem}
#aq>.aq{margin-top:.35rem}
#aq>.sub{margin:.35rem 0 0}
.aqok{color:var(--flag)}
/* Each hole in one on the home page: one tile to tap for its scorecard, with the player's photo on the right */
.acet{display:flex;align-items:center;gap:.9rem;width:100%;margin:0;padding:.85rem 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.acet:last-child{border-bottom:0}
.acei{flex:1;min-width:0;display:flex;flex-direction:column}
.acei .aq{display:block}
.acep{flex:none;display:flex;flex-direction:column;align-items:center;gap:.45rem}
.acep .av{width:4.75rem;height:4.75rem}
.acel{color:var(--flag);font-size:.85rem;font-weight:600;white-space:nowrap}
@media (hover:hover){.acet:hover .acel{text-decoration:underline}}
