/* Editorial look shared by Games and the Dashboard (the events pages carry the same rules inline).
   Stone ground, handwritten script headlines, small uppercase labels, flat square controls,
   one solid button per screen. Loaded after each page's own <style>, so it only restyles;
   class names, ids and scripts are untouched. */
@font-face{font-family:'Homemade Apple';src:url(fonts/homemade-apple.woff2) format('woff2');font-display:swap}
:root{--cream2:#f5f2eb;--cream3:#ddd6c8;--w:#fff;--stone:#cfc7b8;--script:'Homemade Apple','Snell Roundhand',cursive;--rsm:2px;--rlg:0;--rxl:2px}

/* controls: flat, square, uppercase */
.btn,.bi,.bg,.bo,.arc-btn{border-radius:2px;font-size:12px;font-weight:500;letter-spacing:.09em;text-transform:uppercase}
.btn{min-height:44px}
.bg{background:var(--ink)!important;border-color:var(--ink)!important;color:var(--cream)!important}
.bo{background:transparent!important;color:var(--ink)!important;border-color:var(--ink)!important}
.bo:hover{background:var(--ink)!important;color:var(--cream)!important}
.chip,.subtab,.mode-btn,.fb-btn{border-radius:2px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.chip.sel,.subtab.act{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.finp,.inp,input.finp,select.finp,textarea.finp{border-radius:2px}
.modal{border-radius:2px}

/* surfaces: flat, hairline borders, no lift */
.scard,.coach-card,.panel,.empty-state{border-radius:0}
.scard:hover,.coach-card:hover{box-shadow:none;transform:none;border-color:var(--ink)}
.account-dropdown,.host-menu div{border-radius:0;box-shadow:0 10px 24px rgba(0,0,0,.1)}
.sc-title{font-family:var(--sans);font-weight:600;font-size:18px;letter-spacing:-.005em}
.sc-match,.pill{border-radius:2px;text-transform:uppercase;letter-spacing:.08em;font-size:10.5px}

/* headlines in script */
.greet,.ph-title,.modal-title{font-family:var(--script);font-weight:400;letter-spacing:0;line-height:1.35}
.greet{font-size:30px}
.greet span{font-family:var(--sans);text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:400}

/* ── Games ── */
.announce{background:#e1e6de;text-align:center;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:10px 18px;color:var(--ink)}
.nav{background:var(--stone);color:var(--ink)}
.logo::after{content:'Games';font-family:var(--sans);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink)}
.nav-links a{color:var(--ink);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;border-radius:0}
.nav-links a:hover{background:none;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.hamburger span{background:var(--ink)}
.nav .bo{background:transparent!important;color:var(--ink)!important;border-color:var(--ink)!important}
.nav .bo:hover{background:var(--ink)!important;color:var(--cream)!important}
.nav .bi{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.nav .bg{background:var(--ink)!important}
@media(max-width:880px){.nav.menu-open .nav-menu{background:var(--stone);box-shadow:0 14px 28px rgba(0,0,0,.12)}}
.pagehead-wrap{background:var(--stone);color:var(--ink);position:relative;overflow:hidden;min-height:clamp(470px,44vw,520px);display:flex;align-items:flex-end;padding-bottom:36px}
.pagehead-wrap::after{content:'';position:absolute;right:max(-70px,calc(50% - 520px));top:14px;height:50%;aspect-ratio:1;background:url(golf/lyfe-golf-ball.webp) center/contain no-repeat;pointer-events:none;filter:drop-shadow(0 22px 28px rgba(60,50,30,.22))}
@media(min-width:861px){.pagehead-wrap::after{top:8%;height:84%;right:max(0px,calc(50% - 420px))}}
.pagehead{width:100%;position:relative;z-index:1}
.ph-eyebrow{color:var(--ink);opacity:.7;font-family:var(--sans);letter-spacing:.14em}
.ph-title{font-size:clamp(34px,5.6vw,60px);color:var(--ink);max-width:12em}
.ph-title em{font-style:normal;color:var(--gm)}
.ph-sub{color:var(--ink);font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;line-height:1.75;max-width:44ch}
.mode-toggle{background:none;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:0;gap:14px}
.mode-btn{border-radius:0;color:var(--ink);opacity:.65;padding:0 4px;min-height:44px;background:none;border-bottom:2px solid transparent}
.mode-btn:hover{opacity:1;color:var(--ink)}
.mode-btn.sel{background:none;color:var(--ink);opacity:1;border-bottom-color:var(--ink)}
.host-menu summary{border-radius:2px;background:var(--ink);color:var(--cream);font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.fm-banner{background:var(--w);border:1px solid var(--cream3);border-radius:0;color:var(--ink)}
.fm-b-eyebrow{color:var(--gm)}.fm-b-title{color:var(--ink);font-family:var(--sans);font-weight:600}.fm-b-sub{color:var(--ink3)}.fm-b-score{color:var(--gm)}.fm-b-score-lbl{color:var(--ink3)}
.fm-banner .bo{background:transparent!important;color:var(--ink)!important;border-color:var(--ink)!important}

/* ── Dashboard: the sidebar and bars take the stone ground ── */
.sb{background:var(--stone)}
.sblogo,.sbuser{border-bottom-color:rgba(28,50,38,.14)}
.sblogo a,.uname{color:var(--ink)}
.sb-close{color:var(--ink)}
.role-member{background:rgba(28,50,38,.08);color:var(--ink3)}
.role-host,.role-academy{background:rgba(63,107,76,.16);color:var(--gm)}
.role-pending{background:rgba(184,132,58,.2);color:#8a5f22}
.nslbl,.sb-more summary{color:rgba(28,50,38,.55)}
.xpbar{background:rgba(28,50,38,.12)}.xplbl{color:var(--ink3)}
.sbl{color:var(--ink);opacity:.8;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.sbl:hover{opacity:1;color:var(--ink);background:rgba(28,50,38,.06)}
.sbl.act{opacity:1;color:var(--ink);background:rgba(28,50,38,.08);border-left-color:var(--ink)}
.mobile-topbar{background:var(--stone)}
.mobile-topbar .logo-mini{color:var(--ink)}
.mb-hamburger span{background:var(--ink)}
.tabbar button{font-size:10px;letter-spacing:.07em;text-transform:uppercase}
.tabbar button.act{color:var(--ink)}
.sb-backdrop{background:rgba(28,50,38,.35)}
.active-round-card,.earn-card{background:var(--ink);border-radius:0;box-shadow:none}
.tripm{border-radius:2px}
.greet span{margin-top:10px}
.empty-state div[style*="serif"]{font-family:var(--sans)!important;font-weight:600;font-size:18px!important}
.ph-title{max-width:8.6em}
@media(max-width:600px){.ph-title{max-width:7em}}
.greet{margin-top:6px}
/* top-bar actions are quiet links, so the page keeps one solid button */
.nav .btn{background:transparent!important;border:0!important;color:var(--ink)!important;text-decoration:underline;text-underline-offset:4px;min-height:40px;padding:0 8px;font-size:11.5px}
.nav .btn:hover{background:transparent!important;text-decoration-thickness:2px}

/* ── screen pass ── */
.greet{padding-left:8px}
.greet span{padding-left:0}
/* date and time fields never push past their column */
.modal input,.modal select,.modal textarea,.modal-input{min-width:0;max-width:100%}
input[type=date],input[type=time]{min-width:0;max-width:100%}
/* on phones the ball is a small mark above the headline, never behind text */
@media(max-width:600px){
  .pagehead-wrap::after{top:12px;height:auto;width:150px;right:-34px}
}
/* list rows: every card can be acted on, but the buttons stay outlined so the page has one solid button */
.scard .btn.bi,.scard .btn.bg,.coach-card .btn.bi,.coach-card .btn.bg{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important}
.scard .btn.bi:hover,.scard .btn.bg:hover,.coach-card .btn.bi:hover,.coach-card .btn.bg:hover{background:var(--ink)!important;color:var(--cream)!important}
.ph-title{line-height:1.45;margin-bottom:18px}
#v-host-home .bfw{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important}
#v-host-home .bfw:hover{background:var(--ink)!important;color:var(--cream)!important}
#post-teetime-btn{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important}
#post-teetime-btn:hover{background:var(--ink)!important;color:var(--cream)!important}