/* One content grid across public, player and club pages. */
:root{--content-width:1520px;--page-gutter:40px}
.public-site main,.public-site.auth-redesign .public-auth,.public-site .public-legal,
.editorial-main,.personal-main,.concept-main,.onboarding-layout,
.public-site .public-header,.concept-header,.onboarding-header,
.public-footer,.concept-footer,.auth-bottom,
.cm-main,.cm-header,.cm-footer{
 box-sizing:border-box;width:calc(100% - 2 * var(--page-gutter));max-width:var(--content-width);
 margin-left:auto;margin-right:auto;padding-left:0;padding-right:0;
}
.public-site .public-legal{max-width:var(--content-width)}
.public-site .public-legal>p{max-width:850px}
.public-site.auth-redesign .public-auth{gap:64px}
.auth-redesign .public-auth-panel{padding-left:0;padding-right:0}
.onboarding-layout{gap:64px}
.cm-settings{max-width:none}
/* Keep full-width colour bands, with their contents on the same grid. */
.public-how,.public-level{margin-left:calc(-1 * var(--page-gutter));margin-right:calc(-1 * var(--page-gutter));padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
@media(min-width:1600px){
 .public-how,.public-level{margin-left:calc((1520px - 100vw) / 2);margin-right:calc((1520px - 100vw) / 2);padding-left:calc((100vw - 1520px) / 2);padding-right:calc((100vw - 1520px) / 2)}
}
@media(max-width:1100px){:root{--page-gutter:24px}.public-site.auth-redesign .public-auth,.onboarding-layout{gap:32px}}

/* Keep game rows within the same content grid, including long club names. */
.personal-top-grid>*,.personal-block,.public-tonight,.concept-games-section{min-width:0}
.concept-game-grid,.public-tonight-grid,.personal-tonight{width:100%;min-width:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.concept-game-grid>.concept-game,.public-tonight-grid>.concept-game,.personal-tonight>.concept-game{width:auto;min-width:0;max-width:100%;box-sizing:border-box;margin:0}
.concept-card-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
.concept-card-meta>span{min-width:0;overflow-wrap:anywhere}
.concept-card-title{min-width:0;overflow-wrap:anywhere}
.concept-card-bottom{flex-wrap:wrap;row-gap:12px}
.personal-top-grid .catalog-game{min-width:0;width:100%;box-sizing:border-box}

/* A single heading scale and spacing rhythm for player pages. */
:root{--page-title-size:56px;--page-title-leading:1.08;--page-description-size:16px;--page-heading-gap:18px}
.personal-main{padding-top:0}
.editorial-app .editorial-breadcrumb{padding:24px 0 0;margin:0;min-height:40px;box-sizing:border-box;align-items:center;font-size:11px;line-height:16px;font-weight:400;letter-spacing:0;color:#999}
.editorial-app .page-header,.editorial-app .courts-heading,.editorial-app .personal-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin:36px 0 28px;padding:0 0 28px;border-bottom:1px solid #565656;min-height:132px;box-sizing:border-box}
.editorial-app .page-header>div:first-child,.editorial-app .courts-heading>div:first-child,.editorial-app .personal-heading>div:first-child{min-width:0;flex:1}
.editorial-app .page-header h1,.editorial-app .courts-heading h1,.editorial-app .personal-heading h1{font-family:Arial,Helvetica,sans-serif;font-size:var(--page-title-size);font-weight:700;line-height:var(--page-title-leading);letter-spacing:-.035em;text-transform:uppercase;margin:0;max-width:1100px;overflow-wrap:break-word}
.editorial-app .page-header p,.editorial-app .courts-heading p,.editorial-app .personal-heading p{font-family:Arial,Helvetica,sans-serif;font-size:var(--page-description-size);font-weight:400;line-height:1.5;letter-spacing:0;text-transform:none;color:#aaa;margin:var(--page-heading-gap) 0 0}
.editorial-app .personal-heading .personal-day{font-size:12px;line-height:1.5;white-space:nowrap}
.editorial-app .personal-profile-strip{margin:0 0 28px;border-top:0;padding-top:0;padding-bottom:24px}
@media(max-width:1350px){:root{--page-title-size:48px}.editorial-app .page-header,.editorial-app .courts-heading,.editorial-app .personal-heading{gap:24px}}

/* Full-width sticky background, with navigation on the shared content grid. */
.public-site .public-header{width:100%;max-width:none;margin-left:0;margin-right:0;padding-left:max(var(--page-gutter),calc((100% - var(--content-width)) / 2));padding-right:max(var(--page-gutter),calc((100% - var(--content-width)) / 2))}
.public-site .public-header.is-scrolled{background:#080808;border-bottom-color:#444}

/* Keep the illustration identical across login and registration. */
@media(min-width:1024px){
 .public-site.auth-redesign .public-auth{align-items:stretch}
 .auth-redesign .auth-four{contain:none;height:45rem;min-height:max-content;align-self:start;box-sizing:border-box}
 .auth-redesign .auth-court{height:auto;min-height:180px;flex:1 1 0}
}

/* Profile preferences are the primary control for game recommendations. */
.editorial-app .personal-profile-strip{background:var(--graemo-green);color:#111;border:0;padding:20px 24px;gap:16px 24px;flex-wrap:wrap}
.editorial-app .personal-profile-strip>span{color:#111;font-size:16px;font-weight:600;line-height:1.4}
.editorial-app .personal-profile-strip>span+span{border-left:1px solid #1114;padding-left:24px}
.editorial-app .personal-profile-strip>button{background:#111;color:var(--graemo-green);border:1px solid #111;min-height:48px;padding:12px 18px;font-size:14px;font-weight:600;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,color .15s}
.editorial-app .personal-profile-strip>button:hover{background:#292929;color:#fff}
.editorial-app .personal-profile-strip>button:focus-visible{outline:2px solid #111;outline-offset:4px}
@media(max-width:1100px){.editorial-app .personal-profile-strip{gap:16px}.editorial-app .personal-profile-strip>span+span{padding-left:16px}}
@media(max-width:600px){.editorial-app .personal-profile-strip{display:grid;grid-template-columns:1fr 1fr;padding:20px;gap:16px 12px}.editorial-app .personal-profile-strip>span{font-size:14px}.editorial-app .personal-profile-strip>span+span{border:0;padding-left:0}.editorial-app .personal-profile-strip>button{grid-column:1/-1;width:100%;margin:4px 0 0;justify-content:space-between}}
