/* Group avatars use the same layered renderer and portrait framing as site rankings. */
.cgr-panel .cgr-face{--cgr-face-size:40px;position:relative;display:block;width:var(--cgr-face-size);height:var(--cgr-face-size);overflow:hidden;isolation:isolate;border-radius:14px;background:#edf0ff;flex:none}
.cgr-panel .cgr-podium .cgr-face{--cgr-face-size:70px;border-radius:22px;margin-bottom:8px}
.cgr-panel .cgr-face>.cogo-avatar{position:absolute!important;inset:auto!important;left:50%!important;top:calc(var(--cgr-face-size) * -.1)!important;width:calc(var(--cgr-face-size) * 2.4)!important;height:calc(var(--cgr-face-size) * 2.4)!important;min-width:0!important;max-width:none!important;min-height:0!important;max-height:none!important;aspect-ratio:1!important;transform:translateX(-50%)!important;transform-origin:center!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;overflow:visible!important;pointer-events:none}
.cgr-panel .cgr-face .cogo-avatar>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important;transform:none!important;margin:0!important;border-radius:0!important}
.cgr-panel .cgr-face .cae-skin-r1{display:none!important}
.cgr-panel .member-link283{display:inline-block!important;max-width:100%;min-width:0;min-height:0;margin:0;padding:2px 0!important;border:0!important;border-radius:3px;background:transparent!important;box-shadow:none!important;color:inherit!important;font:inherit!important;font-weight:750!important;line-height:1.5;text-align:inherit;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.cgr-panel .member-link283:hover{text-decoration:underline;text-underline-offset:3px}
.cgr-panel .member-link283:focus-visible{outline:3px solid #9ca6ff!important;outline-offset:-1px}
.cgr-panel .cgr-row>span>strong{min-width:0;flex:0 1 auto}
.cgr-panel .cgr-row em{flex:none}
[data-theme="dark"] .cgr-panel .cgr-face{background:#334263}
@media(max-width:600px){.cgr-panel .cgr-row .cgr-face{--cgr-face-size:34px;border-radius:11px}.cgr-panel .cgr-podium .cgr-face{--cgr-face-size:58px;border-radius:19px}}

/* Compact group ranking. Keep overflow available on unusually short screens. */
html body #modal[open]:has(.cgr-active3){width:min(1100px,calc(100vw - 40px))!important;max-width:1100px!important;max-height:calc(100dvh - 32px)!important;padding:0!important;overflow:hidden!important}
html body #modal:has(.cgr-active3)>.dialog-head{min-height:0!important;height:54px!important;padding:12px 24px!important;display:flex!important;align-items:center!important}
html body #modal:has(.cgr-active3) #modalContent{padding:0!important;max-height:calc(100dvh - 98px)!important;overflow:auto!important}
html body #cogoGroupsPanel.cgr-active3{padding:0!important;max-width:none!important}
.cgr-active3 .cgl-hero,.cgr-active3>.cogo-g-heading{display:none!important}
.cgr-active3 .cgr-tabs{padding:0 24px!important;gap:16px}
.cgr-active3 .cgr-tabs button{padding:11px 5px;font-size:13px}
.cgr-active3 .cgr-panel{width:100%;max-width:none!important;padding:15px 24px 12px!important}
.cgr-active3 .cgr-head{gap:12px;margin-bottom:13px}
.cgr-active3 .cgr-head>div:first-child{min-width:0}
.cgr-active3 .cgr-head h3{font-size:21px;line-height:1.3;letter-spacing:-.6px;margin:0 0 4px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.cgr-active3 .cgr-head p{font-size:11px;line-height:1.4;margin:0}
.cgr-active3 .cgr-head p span{color:#8d98ad}
.cgr-tools3{display:flex;gap:7px;align-items:center;flex:none}
.cgr-period3{display:flex;padding:3px;background:#f0f2fb;border-radius:11px;gap:3px}
.cgr-active3 .cgr-period3 button{border:0;background:transparent;padding:7px 14px;font-size:12px;white-space:nowrap}
.cgr-active3 .cgr-period3 button[aria-pressed=true]{background:#fff;color:#515be8;box-shadow:0 2px 5px #24385810}
.cgr-active3 [data-cgr-refresh]{font-size:19px!important;padding:4px 9px!important;line-height:1.4}
.cgr-active3 .cgr-top{gap:12px;margin:0 0 11px}
.cgr-active3 .cgr-podium{display:grid;grid-template-columns:minmax(100px,48%) minmax(0,1fr);height:154px;padding:0 14px 0 0;gap:2px;border-radius:17px;overflow:hidden;text-align:left}
.cgr-active3 .cgr-podium[data-place="2"]{background:linear-gradient(125deg,#edf4ff,#fcfdff)}
.cgr-active3 .cgr-podium[data-place="3"]{background:linear-gradient(125deg,#f2efff,#fff)}
.cgr-full3{display:block;position:relative;width:100%;height:100%;isolation:isolate;pointer-events:none}
.cgr-full3::before{content:"";position:absolute;left:13%;right:13%;bottom:14px;height:14px;border-radius:50%;background:#62699a13;filter:blur(2px)}
html body .cgr-panel .cgr-full3>.cogo-avatar{position:absolute!important;inset:auto!important;left:50%!important;top:50%!important;width:150px!important;height:150px!important;min-width:0!important;max-width:none!important;min-height:0!important;max-height:none!important;aspect-ratio:1!important;transform:translate(-50%,-50%)!important;transform-origin:center!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;overflow:visible!important;background:none!important}
html body .cgr-panel .cgr-full3 .cogo-avatar>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important;transform:none!important;margin:0!important;border-radius:0!important}
.cgr-winner3{display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:7px;position:relative;z-index:1}
.cgr-winner3 .cgr-medal{margin:0;font-size:12px;line-height:1.4}
.cgr-winner3>strong{display:block;max-width:100%;min-width:0;font-size:14px}
.cgr-winner3>b{font-size:25px;line-height:1.25;letter-spacing:-.5px}
.cgr-active3 .cgr-me{padding:8px 13px;gap:12px;margin-bottom:11px;min-height:41px;font-size:11px}
.cgr-active3 .cgr-me>strong{font-size:19px}
.cgr-active3 .cgr-me button{padding:5px 9px;font-size:11px}
.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:42px minmax(130px,1fr) minmax(120px,1.35fr) 90px;gap:12px;padding:7px 14px!important}
.cgr-active3 .cgr-table-head{min-height:30px;font-size:11px}
.cgr-active3 .cgr-row{min-height:44px;font-size:13px}
.cgr-active3 .cgr-row>span{min-width:0}
.cgr-active3 .cgr-row .cgr-face{--cgr-face-size:30px;border-radius:10px}
.cgr-active3 .cgr-row .cgr-student3{gap:8px}
.cgr-active3 .cgr-row .cgr-motto3{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:1.6;color:#64748d;font-weight:400}
.cgr-active3 .cgr-row .cgr-motto3.is-empty{color:#98a3b6;font-size:11px}
.cgr-active3 .cgr-footer{margin-top:9px;gap:8px;font-size:10px;flex-direction:row;align-items:center}
.cgr-active3 .cgr-footer>div{gap:8px}
.cgr-active3 .cgr-footer button{padding:5px 9px;font-size:11px;border-radius:8px}
.cgr-active3 .cgl-footer{padding:7px 24px!important;min-height:0!important;font-size:10px!important}
.cgr-active3 .cgl-footer button{padding:2px 0!important;font-size:10px!important}
[data-theme="dark"] .cgr-active3 .cgr-podium{background:linear-gradient(130deg,#28324a,#1c273e);border-color:#394660}
[data-theme="dark"] .cgr-active3 .cgr-podium[data-place="1"]{background:linear-gradient(130deg,#3d3626,#242938);border-color:#716247}
[data-theme="dark"] .cgr-period3{background:#222e49}
[data-theme="dark"] .cgr-active3 .cgr-period3 button[aria-pressed=true]{background:#3a4668;color:#eef0ff}
[data-theme="dark"] .cgr-active3 .cgr-row .cgr-motto3{color:#b3bfd7}
[data-theme="dark"] .cgr-active3 .cgr-row .cgr-motto3.is-empty{color:#7f8eaa}
@media(max-width:760px){.cgr-active3 .cgr-podium{grid-template-columns:minmax(74px,46%) minmax(0,1fr);padding-right:8px}.cgr-winner3>strong{font-size:12px}.cgr-winner3>b{font-size:22px}.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:30px minmax(115px,1fr) minmax(85px,1fr) 70px;gap:8px}}
@media(max-width:600px){
html body #modal[open]:has(.cgr-active3){width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:20px!important}
html body #modal:has(.cgr-active3)>.dialog-head{padding:12px 15px!important}
html body #modal:has(.cgr-active3) #modalContent{max-height:calc(100dvh - 72px)!important}
.cgr-active3 .cgr-tabs{padding:0 14px!important}.cgr-active3 .cgr-tabs button{padding:9px 3px;font-size:12px}
.cgr-active3 .cgr-panel{padding:12px 12px 10px!important}
.cgr-active3 .cgr-head{gap:9px;margin-bottom:10px;align-items:center}
.cgr-active3 .cgr-head h3{font-size:16px}.cgr-active3 .cgr-head p{font-size:10px}.cgr-active3 .cgr-head p span{display:none}
.cgr-tools3{gap:4px}.cgr-active3 .cgr-period3 button{padding:7px 8px;font-size:10px}.cgr-active3 [data-cgr-refresh]{padding:3px 6px!important;font-size:17px!important}
.cgr-active3 .cgr-top{gap:7px;margin-bottom:9px}.cgr-active3 .cgr-podium{display:flex;flex-direction:column;height:194px;padding:0 5px 10px;gap:0;text-align:center;border-radius:13px}
.cgr-active3 .cgr-full3{height:128px;flex:none}html body .cgr-panel .cgr-full3>.cogo-avatar{width:128px!important;height:128px!important}
.cgr-winner3{align-items:center;width:100%;gap:1px}.cgr-winner3 .cgr-medal{font-size:10px}.cgr-winner3>strong{font-size:11px;line-height:1.35}.cgr-winner3>b{font-size:20px}.cgr-winner3 small{font-size:9px}
.cgr-active3 .cgr-me{padding:7px 9px;gap:8px;font-size:10px;margin-bottom:9px;min-height:36px}.cgr-active3 .cgr-me>strong{font-size:17px}.cgr-active3 .cgr-me button{font-size:9px;padding:5px 6px;white-space:nowrap}
.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:23px minmax(92px,1.05fr) minmax(64px,1fr) 57px;gap:6px;padding:6px 7px!important}
.cgr-active3 .cgr-table-head{font-size:9px;min-height:28px}.cgr-active3 .cgr-row{font-size:11px;min-height:49px}
.cgr-active3 .cgr-row .cgr-face{--cgr-face-size:25px;border-radius:8px}.cgr-active3 .cgr-row .cgr-student3{gap:5px}.cgr-active3 .cgr-row small{font-size:9px;margin-left:2px}
.cgr-active3 .cgr-row .cgr-motto3{font-size:10px;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:anywhere;line-height:1.5}.cgr-active3 .cgr-row .cgr-motto3.is-empty{font-size:9px}
.cgr-active3 .cgr-row em{font-size:8px;padding:2px 3px}
.cgr-active3 .cgr-footer{font-size:9px;gap:6px}.cgr-active3 .cgr-footer>div{gap:5px}.cgr-active3 .cgr-footer button{font-size:10px;padding:5px 7px}.cgr-active3 .cgl-footer{padding:6px 15px!important}
}

html body #modal:has(.cgr-active3) #modalTitle{margin:0!important;padding:0!important;font-size:13px!important;line-height:1.5!important}

.cgr-xp-label4{display:inline-block;padding:7px 11px;border-radius:10px;background:#f0f2ff;color:#626adb;font-size:11px;white-space:nowrap}
.cgr-active3 .cgr-winner3{gap:3px}.cgr-level4{font-size:11px;font-weight:700;color:#7e899f;line-height:1.4}
.cgr-active3 .cgr-winner3>b{font-size:23px;white-space:nowrap;letter-spacing:-.5px}
.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:42px minmax(130px,1fr) minmax(100px,1.3fr) 125px}
.cgr-active3 .cgr-row .cgr-score4{display:flex;flex-direction:column;gap:1px;align-items:flex-end;line-height:1.25;white-space:nowrap}
.cgr-active3 .cgr-score4>small{font-size:10px;color:#8994aa;margin:0;line-height:1.3}.cgr-active3 .cgr-score4>b{font-size:13px}.cgr-active3 .cgr-score4>b>small{font-size:9px;margin-left:3px;color:#8592a8}
[data-theme="dark"] .cgr-xp-label4{background:#2a3652;color:#c1c8ff}[data-theme="dark"] .cgr-level4{color:#b6c2da}
@media(max-width:760px){.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:30px minmax(105px,1fr) minmax(80px,1fr) 100px}}
@media(max-width:600px){.cgr-xp-label4{font-size:9px;padding:6px}.cgr-active3 .cgr-podium{height:199px}.cgr-active3 .cgr-full3{height:121px}.cgr-active3 .cgr-winner3{gap:0}.cgr-active3 .cgr-winner3>b{font-size:17px;letter-spacing:-.5px}.cgr-active3 .cgr-winner3>b>small{font-size:8px;margin-left:2px}.cgr-level4{font-size:9px}.cgr-active3 .cgr-table-head,.cgr-active3 .cgr-row{grid-template-columns:22px minmax(83px,1.1fr) minmax(48px,1fr) 79px;gap:5px}.cgr-active3 .cgr-score4>b{font-size:10px}.cgr-active3 .cgr-score4>small{font-size:9px}.cgr-active3 .cgr-score4>b>small{font-size:8px;margin-left:2px}.cgr-active3 .cgr-me{gap:7px}.cgr-active3 .cgr-me>span:nth-of-type(2){font-size:9px}.cgr-active3 .cgr-me button{padding:5px;font-size:9px}}

@media(max-width:600px){html body .cgr-panel .cgr-full3>.cogo-avatar{width:121px!important;height:121px!important}}
