:root{--color-black:#000;--color-cream:#fdf0d5;--color-error:#c33;--color-scene:#000;--color-logo:#fdf0d5;--color-field-border:#fdf0d5c7;--color-field-muted:#fdf0d59e;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--font-family:"Montserrat", system-ui, sans-serif;--font-weight:500;--text-body:16px;--text-small:14px;--text-heading:20px;--line-height-body:1.5;--line-height-heading:1.2;--timing-form-reveal:1.2s;--timing-success-form-fade:.7s;--timing-success-gap:.12s;--timing-success-message-fade:var(--timing-form-reveal);--timing-success-dismiss:.4s;--timing-success-spin-lead:.1s;--timing-ball-spin:2.083s;--viewport-height:100dvh;--logo-ball-transform:none;--logo-area-padding-top:clamp(var(--space-lg), 6vw, var(--space-3xl));--logo-area-padding-x:clamp(var(--space-lg), 6vw, var(--space-3xl));--logo-area-padding-bottom:clamp(190px, 24vh, 250px);--logo-width:min(70vw, 780px);--logo-offset-y:-34px;--form-side-padding:var(--space-xl);--form-bottom:clamp(108px, 17vh, 160px);--form-shell-width:min(100%, 360px);--field-min-height:54px;--submit-width:50%;--success-min-height:96px;--form-hidden-transform:translateY(8px);--form-visible-transform:translateY(0);--court-inset:var(--space-3xl);--court-inset-mobile:var(--space-lg)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{background-color:var(--color-scene);overflow:hidden}[hidden]{display:none!important}body{background-color:var(--color-scene);min-height:var(--viewport-height);height:var(--viewport-height);width:100%;font-family:var(--font-family);font-weight:var(--font-weight);color:var(--color-logo);display:flex;overflow:hidden}.court{min-height:var(--viewport-height);height:var(--viewport-height);background:var(--color-scene);border:0;flex-direction:column;flex:1;align-items:center;margin:0;display:flex;position:relative;overflow:visible}.logo-area{width:100%;padding:var(--logo-area-padding-top) var(--logo-area-padding-x) var(--logo-area-padding-bottom);z-index:1;place-items:center;display:grid;position:absolute;inset:0}.form-area{width:100%;padding:0 var(--form-side-padding);left:0;right:0;bottom:var(--form-bottom);opacity:0;pointer-events:none;transform:var(--form-hidden-transform);transition:opacity var(--timing-form-reveal) ease, transform var(--timing-form-reveal) ease;z-index:3;justify-content:center;align-items:center;display:flex;position:absolute}.form-shell{width:var(--form-shell-width);display:grid}.signup-form{opacity:1;visibility:visible;transition:opacity var(--timing-success-form-fade) ease, visibility 0s linear 0s;flex-direction:column;grid-area:1/1;gap:10px;display:flex}.field-stack{flex-direction:column;gap:10px;display:flex}.field{flex-direction:column;display:flex}.field-control,.submit-button{min-height:var(--field-min-height);font:inherit;letter-spacing:.01em;border-radius:4px}.field-control{border:1.5px solid var(--color-field-border);width:100%;color:var(--color-logo);background:0 0;outline:none;padding:0 18px;transition:background-color .15s,color .15s,border-color .15s}.field-control::placeholder{color:var(--color-field-muted)}.field-control:focus,.field[data-has-value=true] .field-control{background:var(--color-logo);color:var(--color-black);border-color:var(--color-logo);font-weight:500}.field-control:focus::placeholder,.field[data-has-value=true] .field-control::placeholder{color:#0000006b}.signup-form[data-state=error] .field-control{border-color:var(--color-error)}.submit-button{width:var(--submit-width);border:1.5px solid var(--color-logo);background:var(--color-logo);color:var(--color-black);cursor:pointer;align-self:center;padding:0 22px;font-weight:700;transition:background-color .15s,color .15s,border-color .15s}.submit-button:disabled{cursor:wait}.button-label{justify-content:center;align-items:center;display:inline-flex}@media (hover:hover) and (pointer:fine){.submit-button:hover:not(:disabled){background:var(--color-black);color:var(--color-logo);border-color:var(--color-logo)}}.submit-button:focus-visible,.submit-button:active:not(:disabled){background:var(--color-black);color:var(--color-logo);border-color:var(--color-logo)}.signup-form[data-busy=true] .submit-button{color:var(--color-logo);border-color:var(--color-logo);background:0 0}.button-label-loading,.signup-form[data-busy=true] .button-label-default{display:none}.signup-form[data-busy=true] .button-label-loading{display:inline-flex}.button-ball-spinner{fill:currentColor;width:22px;height:22px;animation:button-ball-spin var(--timing-ball-spin) linear infinite;display:block}.form-feedback{text-align:center;min-height:42px;font-size:var(--text-small);color:var(--color-logo);opacity:0;justify-content:center;align-items:flex-end;line-height:1.4;transition:opacity .15s;display:flex}.signup-form[data-state=error] .form-feedback{opacity:1}.success-panel{min-height:var(--success-min-height);text-align:center;opacity:0;pointer-events:none;visibility:hidden;transition:opacity var(--timing-success-message-fade) ease 0s, visibility 0s linear var(--timing-success-message-fade);grid-area:1/1;justify-content:center;align-items:center;display:flex}.success-message{cursor:pointer;font-size:clamp(22px,2.5vw,34px);line-height:1}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.logo{width:var(--logo-width);z-index:1;height:auto;transform:translateY(var(--logo-offset-y));display:block;position:relative}.logo path{fill:var(--color-logo)}.logo #ball{opacity:0;transform-box:fill-box;transform-origin:50%;transform:var(--logo-ball-transform)}.court[data-ball-state=success-spinning] #ball{animation:button-ball-spin var(--timing-ball-spin) linear infinite}.animation-layer{width:100vw;height:var(--viewport-height);pointer-events:none;z-index:2;position:fixed;inset:0}.court[data-ball-state=aligned] .animation-layer,.court[data-ball-state=settled] .animation-layer{opacity:0;transition:opacity .12s linear}.court[data-ball-state=success-spin-handoff] .animation-layer,.court[data-ball-state=success-spinning] .animation-layer{opacity:0;transition:none}.court[data-form-state=visible] .form-area{opacity:1;pointer-events:auto;transform:var(--form-visible-transform)}.form-area[data-signup-state=success] .success-panel{opacity:1;pointer-events:auto;visibility:visible;transition:opacity var(--timing-success-message-fade) ease calc(var(--timing-success-form-fade) + var(--timing-success-gap)), visibility 0s linear calc(var(--timing-success-form-fade) + var(--timing-success-gap))}.form-area[data-signup-state=success] .signup-form{opacity:0;pointer-events:none;visibility:hidden;transition:opacity var(--timing-success-form-fade) ease, visibility 0s linear var(--timing-success-form-fade)}.form-area[data-signup-state=resetting] .success-panel{opacity:0;pointer-events:none;visibility:hidden;cursor:default;transition:opacity var(--timing-success-dismiss) ease, visibility 0s linear var(--timing-success-dismiss)}.form-area[data-signup-state=resetting] .signup-form{opacity:0;pointer-events:none;visibility:hidden;transition:opacity var(--timing-form-reveal) ease, transform var(--timing-form-reveal) ease, visibility 0s linear 0s;transform:translateY(8px)}.form-area[data-signup-state=idle] .signup-form,.form-area[data-signup-state=error] .signup-form{transition:opacity var(--timing-form-reveal) ease, transform var(--timing-form-reveal) ease, visibility 0s linear 0s;transform:translateY(0)}.court[data-ball-state=settled] #ball,.court[data-ball-state=success-spin-handoff] #ball,.court[data-ball-state=success-spinning] #ball{opacity:1}.court[data-ball-state=logo-fade] #ball{opacity:1;transition:opacity .8s}@keyframes field-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes button-ball-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@media (width<=1024px) and (width>=769px){:root{--logo-area-padding-top:clamp(20px, 5vw, 40px);--logo-area-padding-x:clamp(20px, 4vw, 36px);--logo-area-padding-bottom:clamp(136px, 18vh, 176px);--logo-width:min(74vw, 600px);--logo-offset-y:-22px;--form-side-padding:24px;--form-bottom:clamp(132px, 15vh, 172px);--form-shell-width:min(100%, 324px)}}@media (width<=932px) and (height<=500px) and (orientation:landscape){:root{--logo-area-padding-top:18px;--logo-area-padding-x:18px;--logo-area-padding-bottom:18px;--logo-width:min(50vw, 308px);--logo-offset-y:0px;--form-side-padding:0px;--form-bottom:auto;--form-shell-width:min(100%, 240px);--field-min-height:38px;--submit-width:66%;--success-min-height:60px;--form-hidden-transform:translateY(calc(-50% + 8px));--form-visible-transform:translateY(-50%)}.logo-area{width:60%;padding:var(--logo-area-padding-top) var(--logo-area-padding-x) var(--logo-area-padding-bottom);left:0;right:auto}.form-area{justify-content:flex-end;width:min(38vw,248px);padding:0;inset:50% 14px auto auto}.form-feedback{min-height:28px;font-size:12px}.field-stack{gap:5px}.field-control,.submit-button{font-size:13px}.field-control{padding:0 13px}.button-ball-spinner{width:16px;height:16px}.success-message{font-size:clamp(17px,3.3vw,22px)}}@media (width<=480px) and (orientation:portrait){:root{--viewport-height:100svh;--logo-area-padding-top:18px;--logo-area-padding-x:18px;--logo-area-padding-bottom:108px;--logo-width:min(82vw, 296px);--logo-offset-y:-10px;--logo-ball-transform:none;--form-side-padding:36px;--form-bottom:clamp(148px, 20vh, 178px);--form-shell-width:min(100%, 264px);--field-min-height:46px;--submit-width:60%;--success-min-height:72px}.form-feedback{min-height:32px;font-size:12px}.field-stack{gap:7px}.field-control,.submit-button{font-size:14px}.field-control{padding:0 14px}.button-ball-spinner{width:18px;height:18px}.success-message{font-size:clamp(18px,5.8vw,24px)}}@media (width<=390px) and (orientation:portrait){:root{--logo-area-padding-top:16px;--logo-area-padding-bottom:100px;--logo-width:min(84vw, 280px);--form-side-padding:32px;--form-bottom:clamp(130px, 17vh, 155px);--form-shell-width:min(100%, 250px);--field-min-height:44px;--submit-width:62%}.success-message{font-size:clamp(17px,6.2vw,22px)}}
