#public-access{max-width:960px;margin:24px auto 64px;padding:32px 28px;display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center;background:#fff}.public-intro h1{font-size:clamp(32px,5vw,48px);line-height:1.25;letter-spacing:-2px}.public-intro h1 em{color:var(--blue);font-style:normal}.public-intro>p:not(.eyebrow){color:var(--muted);font-size:14px}.public-promo{display:inline-block;color:var(--blue);font-size:13px;margin-top:16px}.public-entry{margin:0;box-shadow:0 16px 48px #17233b08}.public-tabs{display:flex;gap:8px;margin-bottom:26px}.public-tabs button{flex:1;font-size:13px;padding:10px}.public-tabs [aria-pressed=true]{background:var(--wash);color:var(--blue);border-color:var(--blue)}#public-submit{width:100%;margin-top:8px}#public-error{color:#b43b24;font-size:13px}#public-access[hidden]{display:none}@media(max-width:700px){#public-access{grid-template-columns:1fr;gap:24px;margin-top:0;padding:18px}.public-intro h1{margin-top:10px}.public-entry{padding:22px}}
.field-error{display:block;color:#b43b24;font-size:12px;font-weight:400;line-height:1.6;margin-top:6px}.field-error:empty{display:none}#public-login input[aria-invalid=true]{border-color:#b43b24}#public-password-help{display:block;margin:6px 0 0}
body>.public-header #public-home{margin-left:auto;flex-shrink:0;font-size:13px;padding:8px 12px}@media(max-width:700px){body>.public-header #public-home{margin-left:0;padding:8px;font-size:11px}}
#public-logout{margin-left:0;flex-shrink:0;font-size:13px;padding:8px 12px}body>.public-header:has(#public-logout){flex-wrap:wrap}
.demo-banner{max-width:960px;margin:12px auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--muted);background:var(--wash)}.demo-banner a{color:var(--blue);font-weight:700;text-decoration:underline}

html,body,body>footer{background:#fff}html,body{min-height:100%}body>.public-header{justify-content:flex-start;gap:20px;border-bottom:1px solid var(--line)}body>.public-header .brand{display:block;margin:0}body>.public-header .brand img{width:76px;height:auto;object-fit:contain}.public-site-title{font-size:28px;letter-spacing:-1px;line-height:1.3;margin:0}#public-form-title{font-size:22px;margin:0 0 24px}.public-switch{text-align:center;font-size:13px;color:var(--muted);margin:20px 0 0}.public-switch button{border:0;background:transparent;color:var(--blue);padding:6px;min-height:36px;text-decoration:underline;text-underline-offset:4px}@media(max-width:700px){body>.public-header{gap:14px;padding:18px}.public-header .public-site-title{font-size:22px}body>.public-header .brand img{width:64px}}
#public-saved{max-width:520px;margin:40px auto;padding:28px}.public-saved-card{display:flex;flex-direction:column;gap:12px;text-align:left;width:100%;padding:22px;margin:12px 0 20px}.public-saved-card strong{font-size:18px}.public-saved-card span{font-size:13px;color:var(--muted);font-weight:400}@media(max-width:700px){#public-saved{margin:24px 18px;padding:22px}}
body>.public-header{position:relative;gap:8px}body>.public-header .public-site-title{position:absolute;left:50%;transform:translateX(-50%);text-align:center;white-space:nowrap}body>.public-header #back{margin-left:auto}body>.public-header #public-logout{margin-left:0}body>.public-header:not(:has(#back:not([hidden]))) #public-logout{margin-left:auto}@media(max-width:700px){body>.public-header{flex-wrap:wrap}body>.public-header .public-site-title{position:static;transform:none;order:2;flex-basis:100%;margin-top:6px}}
@media(max-width:700px){body>.public-header{flex-wrap:nowrap;gap:10px;padding:16px}body>.public-header .brand{flex-shrink:0}body>.public-header .public-site-title{position:static;transform:none;order:0;flex:1 1 auto;min-width:0;margin:0;font-size:clamp(15px,4.3vw,22px);letter-spacing:-.7px;white-space:nowrap;text-align:center}body>.public-header .brand img{width:56px}body>.public-header #back,body>.public-header #public-logout{flex-shrink:0;margin-left:0;padding:8px;font-size:11px}}.demo-help{margin:-4px 0 16px;font-size:12px;line-height:1.8;color:var(--muted);word-break:keep-all}
@media(min-width:1100px){
body:has(>.public-header) #workspace #players button{font-size:15px}
body:has(>.public-header) #workspace #players button small{font-size:12px}
body:has(>.public-header) #workspace #players h3{font-size:14px}
body:has(>.public-header) #workspace .roster>.hint,body:has(>.public-header) #workspace #players .attendance-check-hint{font-size:14px}
body:has(>.public-header) #workspace .roster-actions button{font-size:15px}
body:has(>.public-header) #workspace>.roster .matching-guide summary{font-size:16px}
body:has(>.public-header) #workspace>nav,body:has(>.public-header) #tab-games,body:has(>.public-header) #tab-viewer{width:75%;margin-left:auto;margin-right:auto}
html.compact-games body:has(>.public-header) .team>button,html.compact-games body:has(>.public-header) .team>span,html.compact-games body:has(>.public-header) .team>div{font-size:19px}
html.compact-games body:has(>.public-header) .court-card .court-head{font-size:15px}
html.compact-games body:has(>.public-header) .court-head .court-label{font-size:14px}
html.compact-games body:has(>.public-header) .game-no{font-size:18px}
html.compact-games body:has(>.public-header) .court-head .badge{font-size:13px}
html.compact-games body:has(>.public-header) .vs{font-size:14px}
html.compact-games body:has(>.public-header) .court-card .actions>button,html.compact-games body:has(>.public-header) .court-card .actions>.primary,html.compact-games body:has(>.public-header) .court-card .actions>.game-delete{font-size:14px;min-height:36px}
html.compact-games body:has(>.public-header) .cycle-heading{font-size:18px}
}
@media(min-width:1100px){
body:has(>.public-header) #tab-games>.section-title{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
body:has(>.public-header) #tab-games>.section-title>h2{margin:0;flex-shrink:0}
body:has(>.public-header) #tab-games>.section-title>[data-action=propose]{position:static;transform:none;flex:0 0 auto;margin:0;padding:10px 16px;min-height:42px;font-size:14px;white-space:nowrap}
body:has(>.public-header) #tab-games>.section-title>.compact-toggle{margin-left:auto}
html.compact-games body:has(>.public-header) .team>button,html.compact-games body:has(>.public-header) .team>span,html.compact-games body:has(>.public-header) .team>div{font-size:17px}
body:has(>.public-header) #workspace #players button{font-size:17px}
body:has(>.public-header) #workspace #players button small{font-size:14px}
body:has(>.public-header) #workspace #players h3{font-size:16px}
body:has(>.public-header) #workspace .roster>.hint,body:has(>.public-header) #workspace #players .attendance-check-hint{font-size:16px}
body:has(>.public-header) #workspace .roster-actions button{font-size:17px}
}
@media(min-width:1100px){body:has(>.public-header) #workspace>nav,body:has(>.public-header) #tab-games{width:100%}body:has(>.public-header) #tab-games>#games{width:75%;margin-left:auto;margin-right:auto}body:has(>.public-header) #tab-games>#end{margin-left:12.5%}}