.circle-account-page{max-width:1120px;margin:0 auto;padding:32px 24px 60px}.circle-account-page>.panel{margin:0 0 24px}.circle-account-heading{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:30px}.circle-account-heading h1{font-size:54px;letter-spacing:-1.6px;margin:12px 0}.circle-account-heading p{max-width:560px;margin-bottom:0}.circle-account-person{display:grid;justify-items:center;gap:8px;flex-shrink:0;max-width:220px;text-align:center}.circle-account-person .account-avatar{width:80px;height:80px}.circle-account-person>strong{overflow-wrap:anywhere}.circle-account-person>a{font-size:12px}.circle-section-heading{display:flex;align-items:center;justify-content:space-between;gap:18px}.circle-section-heading h2{font-size:31px;margin:8px 0 12px}.circle-package-status,.circle-free-badge,.circle-list-count{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:#e9eddf;color:#395241;border-radius:30px;padding:8px 12px;font-size:12px;font-weight:650;line-height:1.3}.circle-package-status.is-active{background:#244f41;color:#fff}.circle-package-options{border:0;padding:0;margin:22px 0 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.circle-package-options>legend{font-size:13px;font-weight:700;margin-bottom:10px}.circle-package-option{display:flex;align-items:flex-start;gap:10px;padding:18px;border:2px solid #d7ddce;border-radius:12px;background:#fffefb;margin:0;cursor:pointer}.circle-package-option:has(input:checked){border-color:#5f7a50;background:#f0f5e9}.circle-package-option>input{flex:0 0 20px;width:20px;height:20px;min-height:0;margin:7px 0 0;accent-color:#244f41}.circle-package-option>span{display:grid;gap:7px;min-width:0}.circle-package-option strong{font-size:29px;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap}.circle-package-option strong small{font-size:14px;font-weight:400}.circle-package-option>span>span{font-size:13px;line-height:1.4}.circle-package-option em{font-size:12px;font-style:normal;font-weight:700;color:#4d6742}.circle-valid-until{font-size:13px;font-weight:650}.circle-membership>.circle-payment-unavailable{max-width:100%;margin-bottom:8px}.circle-membership>.muted{font-size:12px;line-height:1.55;margin:6px 0 18px}.circle-package-explanation{border-top:1px solid var(--line,#dfdfd3);padding-top:16px;font-size:12px;line-height:1.6;margin-bottom:0}.circle-quota{display:flex;flex-wrap:wrap;align-items:baseline;gap:7px 18px;border:1px solid #d1dbc5;border-radius:9px;background:#eef3e7;padding:14px 16px;margin:16px 0 22px}.circle-quota>strong{font-size:20px;font-variant-numeric:tabular-nums}.circle-quota>span{font-size:12px}.circle-quota.over-quota{background:#fff3e2;border-color:#d0a96e}.circle-quota>p{flex-basis:100%;font-size:12px;line-height:1.5;margin:3px 0 0}.circle-list{display:grid;gap:18px}.circle-card{border:1px solid #d9dfd1;border-radius:12px;background:#fffefb;padding:20px;min-width:0}.circle-card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.circle-card-heading h3{font-family:Georgia,serif;font-size:25px;font-weight:400;line-height:1.2;margin:0 0 5px;overflow-wrap:anywhere}.circle-card-heading p{font-size:12px;margin:0}.circle-card-heading>.button{font-size:12px;min-height:40px;padding:8px 12px;white-space:nowrap}.circle-expired{max-width:200px;font-size:12px;line-height:1.4;color:#8b5825}.circle-members,.circle-pending ul{list-style:none;margin:18px 0;padding:0}.circle-members>li{display:flex;align-items:center;gap:9px;min-width:0;border-top:1px solid #edf0e6;padding:9px 0;font-size:13px}.circle-members>li>span:nth-child(2){min-width:0;overflow-wrap:anywhere}.circle-person-avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;overflow:hidden;background:#e9eddf}.circle-person-avatar img{width:100%;height:100%;object-fit:cover}.circle-members>li>button{font-size:11px;min-height:34px;padding:6px;margin-left:auto;flex-shrink:0}.circle-members .circle-organizer>small{font-size:10px;margin-left:auto;color:#6c775f;max-width:130px;text-align:right}.circle-empty,.circle-empty-small{color:#6d7868;line-height:1.6;font-size:13px}.circle-empty{padding:18px 0;margin:0}.circle-empty-small{margin:8px 0 18px}.circle-invite-form,.circle-create-form{display:flex;align-items:flex-end;gap:12px;margin-top:18px;min-width:0}.circle-invite-form>label,.circle-create-form>label{flex:1;min-width:0;font-size:12px;margin:0}.circle-invite-form select,.circle-create-form input{width:100%;margin:6px 0 0;min-height:44px;font-size:13px;padding:10px}.circle-invite-form>button,.circle-create-form>button{min-height:44px;font-size:12px;padding:10px 14px;flex-shrink:0}.circle-create-form{padding-top:20px;border-top:1px solid var(--line,#dfdfd3);margin-top:22px}.circle-help{font-size:12px;line-height:1.5;margin:10px 0 0;color:#6d7868}.circle-pending{border-top:1px solid #edf0e6;padding-top:12px}.circle-pending>summary{font-size:12px;font-weight:650;cursor:pointer;min-height:30px;padding:5px 0}.circle-pending ul{margin:5px 0 10px}.circle-pending li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid #edf0e6;font-size:12px}.circle-pending li small{display:block;color:#6d7868;margin-top:3px}.circle-pending li button{font-size:11px;min-height:34px;padding:6px}.circle-inviting-owner,.circle-invite-owner{display:flex;align-items:center;gap:9px;margin:17px 0;font-size:14px}.circle-joined>p{font-size:13px;line-height:1.6}.circle-joined>button{font-size:12px;min-height:36px;padding:7px 0}.circle-games{padding-left:19px;font-size:13px;line-height:1.7;margin:14px 0}.circle-back-to-games{margin-top:0}.circle-invite-page{max-width:660px;margin:35px auto;padding:30px}.circle-invite-page h1{font-size:44px;letter-spacing:-1.2px;overflow-wrap:anywhere}.circle-invite-page>p{line-height:1.65}.circle-invite-page>.button,.circle-invite-page>button{max-width:100%}.circle-invite-message:empty{display:none}.circle-invite-message{font-weight:650;color:#36532c;margin-top:18px}.circle-invite-url{width:100%;font:13px/1.5 ui-monospace,monospace;min-height:48px;padding:10px;margin:3px 0 20px}.circle-link-dialog h2,.circle-confirm-dialog h2{font-size:28px}.circle-link-dialog p,.circle-confirm-dialog p{font-size:14px;line-height:1.6}.circle-link-dialog .row,.circle-confirm-dialog .row{justify-content:flex-end}
@media(max-width:700px){.circle-account-page{padding:24px 14px 38px}.circle-account-heading{align-items:flex-start;gap:12px;margin-bottom:24px}.circle-account-heading h1{font-size:39px;letter-spacing:-1px}.circle-account-heading p{font-size:12px}.circle-account-person{max-width:110px;font-size:12px}.circle-account-person .account-avatar{width:58px;height:58px}.circle-account-person>a{font-size:11px}.circle-account-page>.panel{padding:20px 16px;margin-bottom:18px}.circle-section-heading{align-items:flex-start;gap:12px;flex-wrap:wrap}.circle-section-heading h2{font-size:27px;margin-bottom:8px}.circle-package-status{padding:6px 9px;font-size:11px}.circle-package-options{gap:9px;margin-top:18px}.circle-package-option{padding:13px 10px;gap:6px}.circle-package-option>input{width:17px;height:17px;flex-basis:17px;margin-top:6px}.circle-package-option strong{font-size:23px;white-space:normal}.circle-package-option strong small{display:block;font-size:12px;margin-top:2px}.circle-package-option>span>span{font-size:11px}.circle-package-option em{font-size:10px}.circle-card{padding:16px 12px}.circle-card-heading{align-items:flex-start;gap:12px;flex-wrap:wrap}.circle-card-heading h3{font-size:23px}.circle-card-heading>.button{min-height:38px}.circle-members>li{gap:7px;font-size:12px}.circle-person-avatar{width:30px;height:30px;flex-basis:30px}.circle-members .circle-organizer>small{font-size:9px;max-width:95px}.circle-members>li>button{font-size:10px;padding:5px}.circle-invite-form,.circle-create-form{align-items:stretch;flex-direction:column;gap:9px}.circle-invite-form>button,.circle-create-form>button{width:100%}.circle-quota{padding:12px;gap:6px}.circle-quota>strong{font-size:19px}.circle-quota>span{font-size:11px}.circle-free-badge{font-size:10px;padding:6px 9px}.circle-invite-page{margin:20px 12px;padding:24px 18px;max-width:calc(100% - 24px)}.circle-invite-page h1{font-size:36px}.circle-link-dialog,.circle-confirm-dialog{padding:24px 18px}.circle-link-dialog .row button,.circle-confirm-dialog .row button{flex:1;font-size:12px;padding:10px}.circle-list-count{font-size:12px;min-width:30px;padding:6px 9px}}
@media(max-width:350px){.circle-package-options{grid-template-columns:1fr}.circle-account-heading{flex-wrap:wrap}.circle-account-person{grid-template-columns:45px 1fr;justify-items:start;max-width:100%;text-align:left}.circle-account-person .account-avatar{width:45px;height:45px;grid-row:1/3}.circle-account-person>a{grid-column:2}.circle-members>li>button{max-width:72px;white-space:normal;line-height:1.3}.circle-members .circle-organizer{flex-wrap:wrap}.circle-members .circle-organizer>small{max-width:none;margin-left:37px;text-align:left;flex-basis:100%}}

.circle-pilot-note{padding:12px 14px;border-left:3px solid var(--gold,#d8b771);background:#f4f0e4;border-radius:0 7px 7px 0;font-size:13px;line-height:1.6}
/* Ringin omat, pelikohtaiset rankinglistat. */
.circle-rankings{margin-top:24px;padding-top:18px;border-top:1px solid #b6c4bf}.circle-rankings h4{font-size:1.2rem;margin:0 0 10px}.circle-rankings>p{font-size:.9rem}.circle-rankings details{margin:12px 0;padding:12px;border:1px solid #b6c4bf;border-radius:8px}.circle-rankings form{display:grid;gap:14px;margin-top:20px}.circle-rankings fieldset{display:flex;flex-wrap:wrap;gap:10px}.circle-rankings .ranking-player-choice{display:flex;align-items:center;gap:8px}.circle-rankings .ranking-player-choice input{width:auto;min-height:22px}.circle-rankings table{width:100%;text-align:left;border-collapse:collapse}.circle-rankings th,.circle-rankings td{padding:8px;border-bottom:1px solid #b6c4bf}.circle-rankings caption{text-align:left;font-weight:bold;padding:8px}