/* The account pages share the public site's palette without changing the game table. */
body.account-mode{--ink:#202942;--green:#b83e2c;--paper:#fffaf1;--line:#ded8cd;--muted:#62697a;--gold:#efba9b;background:#fffaf1;color:#202942;font-family:'Trebuchet MS','Arial Rounded MT Bold',Arial,sans-serif}
.account-mode #app>header{max-width:1240px;padding:22px 32px;min-height:96px;gap:24px;align-items:center}.account-mode header nav{justify-content:flex-end;flex-wrap:wrap;gap:10px 18px;font-size:13px}.account-mode header nav a:hover{color:#b83e2c}.account-mode header nav button{font-size:12px;padding:7px 10px;min-height:38px}.account-mode h1,.account-mode h2,.account-mode h3,.account-mode .circle-card-heading h3{font-family:inherit;font-weight:800;color:#202942}.account-mode h1{letter-spacing:-.055em;line-height:1.05}.account-mode h2{letter-spacing:-.035em;line-height:1.15}.account-mode p{color:#62697a;font-size:15px;line-height:1.7}.account-mode .eyebrow{color:#b83e2c;font-size:10px;letter-spacing:.13em;font-weight:800}.account-mode small,.account-mode .muted,.account-mode .circle-help,.account-mode .circle-empty,.account-mode .circle-empty-small{color:#62697a}.account-mode .panel{background:#fffdf8;border:1px solid #ded8cd;border-radius:20px;box-shadow:none}.account-mode button,.account-mode .button{border-radius:10px;font-weight:800;min-height:46px}.account-mode .primary{background:#b83e2c;color:#fffaf1}.account-mode .outline{border-color:#c7c5c4;color:#202942;background:transparent}.account-mode a:focus-visible,.account-mode button:focus-visible,.account-mode input:focus-visible,.account-mode select:focus-visible,.account-mode summary:focus-visible{outline:3px solid #b83e2c;outline-offset:3px}.account-mode input:not([type=radio]):not([type=checkbox]),.account-mode select{background:#fffaf1;color:#202942;border:1px solid #c7c5c4;border-radius:9px;min-height:48px;font:inherit;padding:11px 13px;max-width:100%}.account-mode input[type=radio],.account-mode input[type=checkbox]{accent-color:#b83e2c}.account-mode label{color:#202942}.account-mode .circle-account-page{max-width:1120px;padding:44px 24px 60px}.account-mode .circle-account-heading{padding:30px 32px;background:#f1cbb7;border-radius:24px;align-items:center;margin-bottom:28px}.account-mode .circle-account-heading h1{font-size:60px;margin:15px 0}.account-mode .circle-account-heading p{max-width:600px;color:#434d61}.account-mode .circle-account-person{background:#fffaf1;padding:18px 20px;border-radius:18px;min-width:180px}.account-mode .circle-account-person>a{font-weight:800;text-underline-offset:4px}.account-mode .account-avatar{box-shadow:0 0 0 4px #fffaf1}.account-mode .circle-account-page>.panel{padding:30px;margin-bottom:24px}.account-mode .circle-section-heading h2{font-size:33px}.account-mode .circle-package-options{gap:18px}.account-mode .circle-package-option{border:2px solid #ded8cd;border-radius:15px;background:#fffaf1;padding:23px;gap:12px}.account-mode .circle-package-option:has(input:checked){background:#fbe9dd;border-color:#b83e2c}.account-mode .circle-package-option strong{font-size:36px;letter-spacing:-.04em}.account-mode .circle-package-option strong small{display:inline;color:#62697a;font-size:14px;letter-spacing:0}.account-mode .circle-package-option em{color:#a63829}.account-mode .circle-package-status,.account-mode .circle-free-badge,.account-mode .circle-list-count{background:#dbe3f2;color:#202942;font-weight:800}.account-mode .circle-package-status.is-active{background:#202942;color:#fffaf1}.account-mode .circle-pilot-note{background:#fbe9dd;border-left-color:#b83e2c;border-radius:0 10px 10px 0;color:#434d61}.account-mode .circle-quota{background:#edf0f8;border-color:#d3daea;border-radius:12px}.account-mode .circle-card{border:1px solid #ded8cd;border-radius:15px;padding:22px;background:#fffaf1}.account-mode .circle-card-heading h3{font-size:26px}.account-mode .circle-members>li,.account-mode .circle-pending,.account-mode .circle-pending li{border-color:#e7e1d8}.account-mode .circle-person-avatar{background:#dbe3f2}.account-mode .circle-member-faq{margin:20px 0 0;padding:18px 20px;border-radius:13px;background:#dbe3f2;color:#202942}.account-mode .circle-member-faq h3{font-size:18px;margin:0 0 8px}.account-mode .circle-member-faq p{margin:0;color:#434d61;font-size:14px}.account-mode .circle-package-explanation{font-size:13px}.account-mode .circle-rankings{border-color:#ded8cd}.account-mode .circle-rankings details{border-color:#ded8cd;border-radius:12px;overflow-x:auto}.account-mode .circle-rankings fieldset{min-width:0}.account-mode .identity-page{max-width:1120px;margin:48px auto;padding:0 24px;gap:48px;align-items:start}.account-mode .identity-intro{background:#f1cbb7;border-radius:24px;padding:36px}.account-mode .identity-intro h1{font-size:58px}.account-mode .identity-card{padding:32px}.account-mode .identity-card h2{font-size:32px}.account-mode .google-login{border-radius:10px}.account-mode .auth-divider{color:#62697a}.account-mode .profile-page{max-width:900px;margin:42px auto;padding:36px}.account-mode .profile-page h1{font-size:54px}.account-mode .avatar-picker{border-color:#ded8cd}.account-mode .avatar-picker h2{font-size:24px}.account-mode .avatar-option{border-radius:13px}.account-mode .avatar-option:has(input:checked){background:#fbe9dd;border-color:#b83e2c}.account-mode .own-photo{background:#edf0f8;border-radius:14px;padding:18px}.account-mode .circle-invite-page,.account-mode .auth-recovery{padding:32px;border-radius:20px}.account-mode .account-security{margin-top:28px}.account-mode .account-security>summary{font-weight:800;font-size:18px;color:#202942}.account-mode dialog{color:#202942;background:#fffaf1;border:1px solid #ded8cd;border-radius:20px}.account-mode dialog h2{font-family:inherit;font-weight:800}.account-mode .circle-invite-url{overflow-wrap:anywhere}
@media(max-width:760px){.account-mode #app>header{padding:18px 20px;align-items:flex-start;flex-wrap:wrap;gap:14px}.account-mode header nav{justify-content:flex-start;gap:6px 14px;width:100%;font-size:12px}.account-mode header nav button{min-height:38px}.account-mode .circle-account-page{padding:24px 16px 40px}.account-mode .circle-account-heading{padding:24px;gap:20px;align-items:flex-start;flex-wrap:wrap}.account-mode .circle-account-heading h1{font-size:48px}.account-mode .circle-account-heading p{font-size:14px}.account-mode .circle-account-person{min-width:0;max-width:100%;width:100%;grid-template-columns:52px minmax(0,1fr);justify-items:start;text-align:left;padding:14px;gap:5px 12px}.account-mode .circle-account-person .account-avatar{width:48px;height:48px;grid-row:1/3}.account-mode .circle-account-person>a{grid-column:2;font-size:12px}.account-mode .circle-account-person>strong{font-size:15px}.account-mode .circle-account-page>.panel{padding:23px 19px}.account-mode .circle-section-heading h2{font-size:29px}.account-mode .circle-package-options{grid-template-columns:1fr;gap:12px}.account-mode .circle-package-option{padding:18px}.account-mode .circle-package-option strong{font-size:32px}.account-mode .circle-package-option>span>span{font-size:13px}.account-mode .circle-package-option strong small{display:inline;font-size:13px}.account-mode .circle-package-option input{flex-basis:20px;width:20px;height:20px}.account-mode .circle-member-faq{padding:17px}.account-mode .circle-member-faq h3{line-height:1.4;font-size:17px}.account-mode .circle-card{padding:17px 14px}.account-mode .circle-card-heading h3{font-size:23px}.account-mode .circle-members>li{font-size:13px}.account-mode .circle-invite-form>button,.account-mode .circle-create-form>button{min-height:48px}.account-mode .identity-page{margin:24px auto;display:grid;grid-template-columns:1fr;padding:0 16px;gap:20px}.account-mode .identity-intro{padding:27px 23px}.account-mode .identity-intro h1{font-size:45px}.account-mode .identity-card{padding:25px 21px}.account-mode .profile-page{margin:24px 16px;padding:27px 21px;max-width:calc(100% - 32px)}.account-mode .profile-page h1{font-size:43px}.account-mode .profile-person{flex-wrap:wrap}.account-mode .profile-person label{min-width:0;flex:1}.account-mode .avatar-options{grid-template-columns:repeat(3,minmax(0,1fr))}.account-mode .avatar-option{min-width:0}.account-mode .avatar-option img{width:64px;height:64px;max-width:100%;object-fit:contain}.account-mode .avatar-option span{font-size:11px;overflow-wrap:anywhere}.account-mode .circle-invite-page,.account-mode .auth-recovery{margin:24px 16px;padding:27px 21px;max-width:calc(100% - 32px)}.account-mode .circle-invite-page h1{font-size:39px}.account-mode .identity-faces img{max-width:28%}}

/* Alias feedback includes text as well as color. */
#profile-alias-help,#profile-alias-status{display:block;font-size:13px;line-height:1.45;white-space:normal;font-weight:400;overflow-wrap:anywhere}
#profile-alias-help{margin-top:8px;color:#62697a}
#profile-alias-status{margin-top:6px;min-height:1.45em;color:#434d61}
#player-profile-name[data-alias-state="available"]{border:2px solid #247342;background:#edf8f0;color:#203b33}
#player-profile-name[data-alias-state="taken"],#player-profile-name[data-alias-state="invalid"]{border:2px solid #b3261e;background:#fff0ee;color:#6b1c17}
#player-profile-name[data-alias-state="available"]:focus-visible{outline-color:#247342}
#player-profile-name[data-alias-state="taken"]:focus-visible,#player-profile-name[data-alias-state="invalid"]:focus-visible{outline-color:#b3261e}
#player-profile-name[data-alias-state="locked"]{background:#f0eee8;color:#62697a}

/* The organizer's guest roster counts people, independent of game and circle count. */
.circle-friends-summary .circle-section-heading{align-items:center;gap:16px}
.account-mode .circle-friend-total{margin:0;padding:12px 18px;border-radius:14px;background:#edf4ed;color:#234b3c}
.circle-friend-total b{font-size:25px;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.account-mode .circle-friend-remaining{font-size:19px;line-height:1.4;font-weight:800;color:#234b3c;margin:18px 0 8px}
.account-mode .circle-friend-explanation{font-size:13px;line-height:1.6;max-width:760px;margin:8px 0 20px}
.circle-friend-roster{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:22px 0 0;padding:0}
.circle-friend-roster>li{display:flex;align-items:center;gap:12px;min-width:0;padding:13px;background:#fffaf1;border:1px solid #ded8cd;border-radius:12px}
.circle-friend-roster>li>span:last-child{font-size:15px;font-weight:800;overflow-wrap:anywhere;min-width:0}
.circle-friend-roster .circle-person-avatar{width:48px;height:48px;flex-basis:48px;box-shadow:0 0 0 2px #fff,0 0 0 3px #ded8cd}
.account-mode .circle-package-option.circle-package-popular{border:2px solid #b83e2c;background:#fff0e7;box-shadow:0 0 0 3px #b83e2c12}
.circle-package-option .circle-popular-badge,.circle-package-summary-badge{display:inline-block;width:fit-content;border-radius:20px;padding:6px 12px;background:#b83e2c;color:#fffaf1;font-size:12px;font-weight:800;line-height:1.25;letter-spacing:.02em}
.circle-package-option .circle-popular-badge{margin-bottom:8px}
.account-membership-details>summary{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.circle-package-summary-badge{font-size:11px}
@media(max-width:550px){.circle-friends-summary .circle-section-heading{align-items:flex-start;flex-direction:column;gap:10px}.circle-friend-total{width:100%}.circle-friend-total b{font-size:24px}.account-mode .circle-friend-remaining{font-size:18px}.circle-friend-roster{grid-template-columns:1fr;gap:9px}.circle-friend-roster>li{padding:12px}.circle-package-summary-badge{white-space:normal}}
