:root{font-family:system-ui,"Microsoft YaHei",sans-serif;color:#20352e;background:#f4f6f2;font-size:15px}*{box-sizing:border-box}body{margin:0}header{background:#fff;border-bottom:1px solid #e0e6df;padding:20px 5%;display:flex;justify-content:space-between;align-items:center}header>div{display:flex;align-items:center;gap:14px}header small{color:#748579}.mark{background:#244f41;color:white;padding:8px 12px;border-radius:12px;font-weight:700}main{max-width:1180px;margin:48px auto;padding:0 24px}h1{font-size:34px;letter-spacing:-1px;margin:12px 0}h2{font-size:21px}.eyebrow{font-size:11px;letter-spacing:3px;color:#6c8b7b;font-weight:700}.muted{color:#738076;line-height:1.8}#auth{max-width:570px;margin:70px auto;background:white;padding:40px;border:1px solid #dfe6dc;border-radius:18px}label{display:block;margin:18px 0;font-size:13px;font-weight:600}input,select{display:block;width:100%;margin-top:8px;padding:11px;border:1px solid #ced9d0;background:white;border-radius:7px;color:#20352e;font:inherit}input[type=checkbox]{display:inline;width:auto;margin-right:9px}button{cursor:pointer;background:#285541;color:white;border:1px solid transparent;border-radius:7px;padding:10px 18px;font:inherit}button:hover{filter:brightness(.94)}button:disabled{opacity:.5;cursor:wait}.secondary{background:#fff;border-color:#d4ded4;color:#335443}.danger{color:#a23b3b;background:white;border-color:#ebd6d6}.actions{display:flex;gap:10px;margin-top:24px}.welcome{display:flex;align-items:center;justify-content:space-between}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:26px 0}.stat{background:#fff;border:1px solid #e0e6dd;border-radius:12px;padding:20px}.stat strong{display:block;font-size:28px;margin-bottom:8px}.stat span{color:#7b877d;font-size:13px}nav{display:flex;gap:6px;margin:30px 0 18px}nav button{background:transparent;color:#6b7b6f}.selected{background:#e2ebe1;color:#234c37}.panel{background:white;border:1px solid #dfe6dc;border-radius:14px;padding:24px;overflow:auto}#toolbar{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-bottom:18px}#toolbar select{max-width:400px;margin:0}table{border-collapse:collapse;width:100%;white-space:nowrap}th,td{text-align:left;padding:15px 12px;border-bottom:1px solid #e8ece5;font-size:13px}th{color:#7b867d;font-weight:500;background:#f7f9f5}td button{padding:5px 10px;margin-right:6px;font-size:12px}td input,td select{min-width:95px;padding:7px;margin:0}td input[type=number]{width:85px;min-width:60px}.empty{padding:50px 20px;text-align:center;color:#849185}.notice{padding:14px;background:#faf5e8;color:#877048;font-size:13px;line-height:1.7;border-radius:8px}dialog{border:1px solid #d2ddd2;border-radius:14px;width:440px;max-width:94vw;padding:28px}dialog::backdrop{background:#152c2266}#authError,#editError{color:#a33e3e;line-height:1.7}footer{text-align:center;color:#8f9d92;font-size:12px;margin:60px 0 30px}#account{font-size:12px}@media(max-width:700px){header small{display:none}header{gap:10px;padding:15px}#account{gap:6px;flex-wrap:wrap;justify-content:flex-end}main{margin-top:25px;padding:0 14px}.stats{grid-template-columns:repeat(2,1fr);gap:10px}#auth{padding:25px;margin:30px auto}h1{font-size:27px}.panel{padding:15px}nav{gap:0}nav button{padding:10px 13px}.welcome{gap:10px}.welcome button{white-space:nowrap}}

#toolbar{flex-wrap:wrap}#toolbar>div{display:flex;gap:8px;flex-wrap:nowrap;flex-shrink:0}#toolbar button{white-space:nowrap}nav{flex-wrap:wrap}fieldset{border:1px solid #dfe6dc;border-radius:8px;margin-top:18px}legend{font-size:13px;color:#738076}
@media(max-width:700px){
  #toolbar{gap:10px;align-items:stretch;justify-content:flex-start}
  #toolbar>select{flex:0 0 100%;width:100%;max-width:none;min-width:0}
  #toolbar>strong{flex:0 0 100%}
  #toolbar>div{flex:0 0 100%;gap:8px;justify-content:flex-end}
  #toolbar button{font-size:13px;padding:8px 12px;min-height:36px;flex:0 0 auto}
  #toolbar>button{margin-left:auto}
}
[hidden]{display:none!important}
#toolbar>select{flex:1 1 150px;min-width:0}
#toolbar>#eventSelect{flex:2 1 240px}
@media(max-width:700px){
 #toolbar>#monthSelect,#toolbar>#voiceFilter{flex:1 1 calc(50% - 5px);width:calc(50% - 5px)}
 #toolbar>#monthSelect{order:0}
 #toolbar>#voiceFilter{order:1}
 #toolbar>#eventSelect{flex:0 0 100%;width:100%;order:2}
 #toolbar>div,#toolbar>button{order:3}
}
.section-heading th{background:#e2ebe1;color:#234c37;font-weight:700;border-top:2px solid #ced9d0}
.status-options{display:flex;flex-wrap:wrap;gap:6px;white-space:normal;max-width:560px}.status-options label{margin:0;cursor:pointer;font-size:13px;font-weight:400}.status-options input{width:16px;min-width:0;display:inline-block;margin:0 5px 0 0;padding:0;accent-color:#285541}.status-options label{display:flex;align-items:center;min-height:36px;padding:6px 9px;border:1px solid #d4ded4;border-radius:7px}.status-options label:has(input:checked){background:#e2ebe1;border-color:#285541}.status-options label:has(input:disabled){opacity:.6;cursor:wait}.save-status{display:block;font-size:11px;color:#738076;min-height:16px;margin-top:3px}@media(max-width:700px){.status-options{max-width:320px;min-width:210px}.status-options label{font-size:12px;padding:5px 7px}}
.status-options{align-items:center}.rare-statuses{display:contents}.status-toggle{display:none}.save-status{display:none}@media(max-width:700px){#tabs{flex-wrap:nowrap;gap:2px}#tabs button{white-space:nowrap;flex:1 1 auto;padding:9px 6px;font-size:13px}.status-options{min-width:0}.collapsible-options{min-width:190px;max-width:320px}.collapsible-options .status-toggle{display:inline-flex;align-items:center;justify-content:center;padding:4px;margin:0;min-width:28px;min-height:34px}.collapsible-options .rare-statuses{display:none}.collapsible-options.expanded .rare-statuses{display:flex;gap:6px;flex-basis:100%;flex-wrap:wrap}.collapsible-options.expanded .status-toggle{transform:rotate(180deg)}}

td input[data-score=sight]{width:58px;min-width:58px;padding:7px 5px}
#toolbar>.activity-picker{flex:1 1 280px;display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0}#toolbar>.activity-picker #eventSelect{flex:1 1 0;width:0;max-width:none;min-width:0}#toolbar>.activity-actions{flex:0 0 auto;gap:8px}@media(max-width:700px){#toolbar>.activity-picker{flex:0 0 100%;order:2}#toolbar>.activity-actions{order:3;margin-left:auto}}
.kpi-table th:nth-child(3),.kpi-table td:nth-child(3),.kpi-table th:nth-child(5),.kpi-table td:nth-child(5){width:1%;padding-left:4px;padding-right:4px}.kpi-table input[data-score]{width:46px;min-width:46px;padding:6px 3px}.kpi-table th:nth-child(4),.kpi-table td:nth-child(4){width:1%;padding-left:3px;padding-right:3px;text-align:center}.kpi-table input[data-exempt]{display:block;width:16px;min-width:16px;height:16px;margin:0 auto;padding:0}
#accountError{color:#a33e3e;line-height:1.7}#account{flex-wrap:wrap;justify-content:flex-end}#accountDialog input[readonly]{background:#f4f6f2}
.kpi-table input[data-score=sight][readonly]{background:#e9ede9;color:#7b867d;border-color:#d9dfd8;cursor:default}
.date-with-clear{display:flex;align-items:center;gap:8px}.date-with-clear input{flex:1;min-width:0;margin:0}.date-with-clear button{flex:none;white-space:nowrap}
#toolbar>#monthSelect{flex:0 0 100%;width:100%;max-width:none;order:0}#toolbar:has(>#monthSelect)>.activity-picker{flex:0 0 100%;order:1}#toolbar:has(>#monthSelect)>.activity-actions{order:2;margin-left:auto}
#toolbar>.activity-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;flex:0 0 100%;min-width:0;order:1}#toolbar>.monthly-row{grid-template-columns:minmax(0,1fr) minmax(130px,190px) auto}.activity-row select{min-width:0;width:100%;max-width:none!important}.activity-row .activity-actions{display:flex;gap:8px;white-space:nowrap}@media(max-width:700px){#toolbar>.monthly-row{grid-template-columns:minmax(0,1fr) minmax(0,.7fr)}.monthly-row>.activity-actions{grid-column:1/-1;justify-content:flex-end}.activity-row select{font-size:13px;padding:10px 7px}}
@media(max-width:700px){#toolbar>.monthly-row{grid-template-columns:minmax(0,1fr) auto;gap:8px}.monthly-row>#eventSelect{grid-column:1/-1}.monthly-row>#voiceFilter{grid-column:1;grid-row:2}.monthly-row>.activity-actions{grid-column:2;grid-row:2;justify-content:flex-end;gap:5px}.monthly-row>.activity-actions button{padding:8px}.monthly-row>#voiceFilter{padding-left:6px;padding-right:6px}}
@media(max-width:700px){#toolbar>.activity-row:not(.monthly-row){grid-template-columns:minmax(0,1fr)}.activity-row:not(.monthly-row)>#eventSelect{grid-column:1}.activity-row:not(.monthly-row)>.activity-actions{grid-column:1;justify-content:flex-end}}
#toolbar>.activity-row:not(.monthly-row){grid-template-columns:minmax(0,1fr) minmax(130px,190px) auto}@media(max-width:700px){#toolbar>.activity-row:not(.monthly-row){grid-template-columns:minmax(0,1fr) auto;gap:8px}.activity-row:not(.monthly-row)>#eventSelect{grid-column:1/-1;grid-row:1}.activity-row:not(.monthly-row)>#voiceFilter{grid-column:1;grid-row:2}.activity-row:not(.monthly-row)>.activity-actions{grid-column:2;grid-row:2;gap:5px}.activity-row:not(.monthly-row)>.activity-actions button{padding:8px}}
.mobile-picker{width:calc(100% - 16px);max-width:540px;box-shadow:0 12px 40px #152c2226;max-height:75vh;max-height:75dvh;margin:auto auto max(12px,env(safe-area-inset-bottom));padding:0;border:1px solid #dfe6dc;border-radius:18px;background:#fff;color:#20352e;overflow:hidden}.mobile-picker::backdrop{background:#152c2266}.mobile-picker-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#f7f9f5;border-bottom:1px solid #e0e6dd}.mobile-picker-header h2{margin:0;font-size:15px;font-weight:600}.mobile-picker-header button{padding:7px 12px;font-size:13px}.mobile-picker-list{max-height:calc(75vh - 78px);max-height:calc(75dvh - 78px);overflow-y:auto;overscroll-behavior:contain;padding:5px}.mobile-picker-option{display:block;width:100%;min-height:44px;background:white;border:1px solid transparent;color:#20352e;text-align:left;font-size:13px;font-weight:400;padding:10px 25px 10px 9px;border-radius:7px;white-space:normal;overflow-wrap:anywhere;word-break:normal;line-height:1.55;position:relative}.mobile-picker-option[aria-selected=true]{background:#e2ebe1;color:#234c37;border-color:#d4ded4;font-weight:500}.mobile-picker-option[aria-selected=true]::after{content:'✓';position:absolute;right:7px;top:10px;font-size:13px}.mobile-picker-option:focus-visible{outline:2px solid #285541;outline-offset:-2px}.mobile-picker-option:disabled{opacity:.45;cursor:default}@media(max-width:700px){select{cursor:pointer}}
.desktop-picker{position:fixed;margin:0;right:auto;top:auto;bottom:auto;max-width:none;border-radius:10px;border-color:#d4ded4;box-shadow:0 8px 26px #152c2226}.desktop-picker::backdrop{background:transparent}.desktop-picker .mobile-picker-header{padding:9px 12px}.desktop-picker .mobile-picker-header h2{font-size:13px}.desktop-picker .mobile-picker-header button{padding:4px 9px;font-size:12px}.desktop-picker .mobile-picker-list{padding:5px}.desktop-picker .mobile-picker-option{min-height:36px;padding-top:7px;padding-bottom:7px;font-size:13px}.desktop-picker .mobile-picker-option[aria-selected=true]::after{top:7px}
@media(max-width:700px){select,.mobile-picker,.mobile-picker button{-webkit-tap-highlight-color:transparent}select:focus:not(:focus-visible),.mobile-picker:focus,.mobile-picker button:focus:not(:focus-visible){outline:none}.mobile-picker-option:focus{outline:none}.mobile-picker-option:focus-visible{outline:2px solid #285541;outline-offset:-2px}}
@media(max-width:700px){*{-webkit-tap-highlight-color:transparent}button:focus:not(:focus-visible),a:focus:not(:focus-visible),input:focus:not(:focus-visible),select:focus:not(:focus-visible),summary:focus:not(:focus-visible),[role=button]:focus:not(:focus-visible){outline:none}button:focus-visible,a:focus-visible,input[type=radio]:focus-visible,input[type=checkbox]:focus-visible,select:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:2px solid #285541;outline-offset:2px}}
#content thead th:not(:first-child),#content tbody td:not(:first-child){text-align:center;vertical-align:middle}#content .section-heading th{text-align:left}#content td:not(:first-child) input[type=number]{margin-left:auto;margin-right:auto;text-align:center}#content td:not(:first-child) .status-options{justify-content:center;margin-left:auto;margin-right:auto}#content td:not(:first-child) .rare-statuses{justify-content:center}
#content thead th:first-child{text-align:center}
#toolbar>.activity-row:has(>.kpi-export){grid-template-columns:minmax(0,1fr) minmax(130px,190px) auto auto}.activity-row>.kpi-export{white-space:nowrap}@media(max-width:700px){#toolbar>.activity-row:has(>.kpi-export){grid-template-columns:minmax(0,1fr) auto}.activity-row:has(>.kpi-export)>#eventSelect{grid-column:1;grid-row:1}.activity-row:has(>.kpi-export)>.kpi-export{grid-column:2;grid-row:1}.activity-row:has(>.kpi-export)>#voiceFilter{grid-column:1;grid-row:2}.activity-row:has(>.kpi-export)>.activity-actions{grid-column:2;grid-row:2}}
#toolbar .activity-row>.kpi-export{background:#285541;color:#fff;border-color:#285541}
@media(max-width:700px){#toolbar .activity-row>.kpi-export{justify-self:end;padding:8px}}

@media(max-width:700px){#toolbar>.activity-row:has(>.kpi-export){grid-template-columns:minmax(0,1fr) auto auto}.activity-row:has(>.kpi-export)>#eventSelect{grid-column:1/3}.activity-row:has(>.kpi-export)>.kpi-export{grid-column:3}.activity-row:has(>.kpi-export)>.activity-actions{grid-column:2/4}}

input[type=date]:not(:disabled):not([readonly]),select:not([multiple]),#toolbar select:not([multiple]),.activity-row select:not([multiple]){appearance:none;-webkit-appearance:none;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,#335443 50%),linear-gradient(135deg,#335443 50%,transparent 50%);background-position:right 18px center,right 14px center;background-size:4px 4px;background-repeat:no-repeat}

input[type=date]:not(:disabled):not([readonly])::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer;width:20px;height:20px;margin:0 -24px 0 0;padding:0}

#toolbar>.activity-row.personal-records{grid-template-columns:minmax(0,1fr)}#toolbar>.personal-records>#eventSelect{grid-column:1/-1}

.personal-history .record-song{white-space:normal;overflow-wrap:anywhere;text-align:left}.record-status{display:inline-block;padding:5px 9px;border-radius:6px;white-space:nowrap}.record-done{background:#e2ebe1;color:#234c37}.record-makeup{background:#faf0d8;color:#805d17}.record-pending{background:#f9e9e6;color:#943e32}@media(max-width:700px){.personal-history th,.personal-history td{padding:12px 7px}.personal-history td:first-child{font-size:12px}.personal-history .record-status{padding:4px 6px;font-size:12px}}

#toolbar>.activity-view-switch{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 100%;margin:0;font-size:13px;font-weight:400;order:-1}.activity-view-switch input[role=switch]{appearance:none;-webkit-appearance:none;display:inline-block;position:relative;width:38px;height:22px;flex:0 0 38px;margin:0;padding:0;border:0;border-radius:12px;background:#8c9d92;cursor:pointer}.activity-view-switch input[role=switch]:checked{background:#285541}.activity-view-switch input[role=switch]::before{content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}.activity-view-switch input[role=switch]:checked::before{transform:translateX(16px)}

.stats-toggle{display:none}@media(max-width:700px){.stats-panel{margin:14px 0 0;border:1px solid #e0e6dd;border-radius:10px;background:#fff;overflow:hidden}.stats-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:42px;margin:0;padding:10px 12px;border:0;border-radius:0;background:transparent;color:#335443;text-align:left;font-size:13px}.stats-toggle>span:last-child{color:#738076;font-size:12px}.stats-panel #stats{display:none;margin:0;padding:0 10px 10px;gap:8px}.stats-panel[data-expanded=true] #stats{display:grid}.stats-panel .stat{padding:10px 12px;border-radius:8px;background:#f7f9f5}.stats-panel .stat strong{font-size:21px;margin-bottom:3px}.stats-panel .stat span{font-size:12px}}

#workspace>.panel{overflow:hidden}
#content{max-height:80vh;max-height:80svh;overflow:auto;overscroll-behavior-x:contain;overscroll-behavior-y:auto;scrollbar-gutter:stable both-edges;-webkit-overflow-scrolling:touch}
#content thead th{position:sticky;top:0;z-index:1}
dialog:not(.mobile-picker){max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto}
.password-field{display:block;position:relative;margin-top:8px}.password-field input{margin-top:0;padding-right:48px}.password-eye{position:absolute;right:3px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:40px;height:38px;padding:0;background:transparent;color:#335443;border:0;border-radius:6px;touch-action:none;user-select:none;-webkit-user-select:none}.password-eye svg{pointer-events:none}.password-eye[aria-pressed=true]{background:#e2ebe1}.password-eye:disabled{cursor:default;opacity:.4}.password-field input::-ms-reveal{display:none}

@media(max-width:700px){.workspace-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:stretch}.workspace-summary>.welcome,.workspace-summary>.stats-panel{display:contents}.workspace-summary>.welcome>div{display:none}.workspace-summary #refresh{grid-column:2;grid-row:1;min-height:42px;padding:10px 14px;font-size:13px;background:#fff}.workspace-summary .stats-toggle{grid-column:1;grid-row:1;border:1px solid #e0e6dd;border-radius:10px;background:#fff;gap:12px}.workspace-summary .stats-panel #stats{grid-column:1/-1;grid-row:2;width:100%;padding:10px;border:1px solid #e0e6dd;border-radius:10px;background:#fff}}
body:has(#workspace:not([hidden]))>main{margin-bottom:0;padding-bottom:max(10px,env(safe-area-inset-bottom))}
html:has(#workspace:not([hidden])){overscroll-behavior-x:none;overscroll-behavior-y:none}
.personal-kpi{width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere}.kpi-period-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #e0e6dd}.kpi-period-card>div{min-width:0}.kpi-period-card strong{font-size:14px;line-height:1.6}.kpi-period-card p{margin:5px 0 0;font-size:13px;color:#738076}.kpi-period-card b{color:#285541;font-size:22px;margin-left:5px}.kpi-period-card button{flex-shrink:0;padding:8px 12px}.kpi-period-range{font-size:13px;line-height:1.6;margin:12px 0}.kpi-personal-total{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#e2ebe1;color:#234c37;padding:12px 14px;border-radius:10px;margin-bottom:10px}.kpi-personal-total strong{font-size:28px}.personal-kpi small{font-size:12px;font-weight:400}.kpi-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kpi-metric{min-width:0;padding:10px;background:#f7f9f5;border:1px solid #e0e6dd;border-radius:8px}.kpi-metric>span{display:block;font-size:12px;color:#738076}.kpi-metric>strong{display:block;font-size:20px;margin:4px 0;color:#285541}.kpi-metric>p{font-size:11px;line-height:1.5;margin:0;color:#738076}@media(min-width:701px){.kpi-metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.kpi-metric{padding:8px}.kpi-metric>strong{font-size:18px;margin:2px 0}.kpi-metric>p{font-size:10px;line-height:1.4}.kpi-personal-total{padding:8px 12px;margin-bottom:8px}.kpi-period-range{font-size:12px;margin:8px 0}.personal-kpi>button{padding:7px 10px;font-size:12px}}

#content .name-table tbody td:first-child{position:sticky;left:0;z-index:2;background:#fff;box-shadow:1px 0 0 #e0e6dd}
#content .name-table thead th{z-index:3}
#content .name-table thead th:first-child{left:0;z-index:4;background:#f7f9f5;box-shadow:1px 0 0 #e0e6dd}
#content .section-heading .section-label{display:inline-block;position:sticky;left:12px;background:#e2ebe1}
.personal-member,.member-binding-choices{min-width:0;white-space:normal;overflow-wrap:anywhere}.member-binding-choices>button{display:block;width:100%;margin-top:12px;min-height:44px}.member-info{margin:16px 0}.member-info>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid #e8ece5;font-size:13px}.member-info dt{color:#738076}.member-info dd{margin:0}.member-claim-card{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #e8ece5}.member-claim-card>div{min-width:0}.member-claim-card p{font-size:12px;color:#738076;margin:5px 0}.member-claim-card>button{flex-shrink:0;padding:8px 10px}
.member-claim-card{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px}.member-claim-card>strong{min-width:0;font-size:13px;overflow-wrap:anywhere}.member-claim-date{font-size:12px;color:#738076;white-space:nowrap}.member-claim-card>button{font-size:13px}

#content .kpi-table{--kpi-name-width:72px}
#content .kpi-table thead th:first-child,#content .kpi-table tbody td:first-child{width:var(--kpi-name-width);min-width:var(--kpi-name-width);max-width:var(--kpi-name-width);white-space:normal;overflow-wrap:anywhere}
#content .kpi-table tbody td:nth-child(2){position:sticky;left:var(--kpi-name-width);z-index:2;background:#fff;min-width:64px;box-shadow:1px 0 0 #e0e6dd}
#content .kpi-table thead th:nth-child(2){left:var(--kpi-name-width);z-index:4;background:#f7f9f5;min-width:64px;box-shadow:1px 0 0 #e0e6dd}
@media(max-width:700px){#content .kpi-table{--kpi-name-width:68px}}/* Rounded list headers retain the existing sticky column rules. */
#content table{border-collapse:separate;border-spacing:0}
#content thead tr:first-child>th:first-child{border-top-left-radius:8px}
#content thead tr:first-child>th:last-child{border-top-right-radius:8px}
#content .section-heading>th{border-radius:7px 7px 0 0}
#content .section-heading .section-label{border-radius:5px}
@media(max-width:700px){body:has(#workspace:not([hidden]))>main{padding-inline:max(8px,env(safe-area-inset-left),env(safe-area-inset-right))}#workspace>.panel{padding-left:8px;padding-right:8px}#content{scrollbar-gutter:stable both-edges}}

#content .kpi-table thead th:first-child,#content .kpi-table tbody td:first-child{padding-left:6px;padding-right:6px}#content .kpi-table thead th:nth-child(2),#content .kpi-table tbody td:nth-child(2){padding-left:6px;padding-right:6px}
/* Keep table views compact; restore the inset for profile and music pages. */
@media(max-width:700px){#workspace>.panel:has(#content>:is(.personal-member,.member-binding-choices,.personal-kpi,.music-page,.empty)){padding-left:15px;padding-right:15px}#content:has(>:is(.personal-member,.member-binding-choices,.personal-kpi,.music-page,.empty)){scrollbar-gutter:auto}}
#toolbar>.detail-heading{display:flex;flex:1 0 100%;min-width:0;align-items:center;justify-content:space-between;gap:10px}#toolbar>.detail-heading>strong{min-width:0;font-size:15px}#toolbar .detail-back{flex:0 0 auto;min-height:34px;padding:6px 10px;line-height:20px;font-size:13px;white-space:nowrap}
#toolbar>.user-search{flex:0 0 100%;width:100%;max-width:none;min-width:0;margin:0}
#content .personal-history thead th:first-child{text-align:left}

/* Match the desktop toolbar to the list viewport, including scrollbar gutters. */
@media(min-width:701px){#toolbar{overflow:hidden;scrollbar-gutter:stable both-edges}}

/* Keep scrolling cells from showing through the fixed header corner. */
#content:has(>table){border-radius:8px 8px 0 0;isolation:isolate}#content .name-table thead tr:first-child>th:first-child::after{content:"";position:absolute;top:0;left:0;width:8px;height:8px;background:radial-gradient(circle at bottom right,transparent 8px,#fff 8px);pointer-events:none;z-index:1}

/* Mask both visible group edges using the scroll viewport width. */
#content .section-heading .section-corners{display:block;position:sticky;left:0;width:0;height:0;margin-left:-12px;transform:translateY(-17px);z-index:3;pointer-events:none}#content .section-corners::before,#content .section-corners::after{content:"";position:absolute;top:0;width:7px;height:7px;pointer-events:none}#content .section-corners::before{left:0;background:radial-gradient(circle at bottom right,transparent 7px,#fff 7px)}#content .section-corners::after{left:calc(var(--list-viewport-width,100%) - 7px);background:radial-gradient(circle at bottom left,transparent 7px,#fff 7px)}
.invitation-page{white-space:normal;min-width:0}.invitation-page h3{margin:0 0 10px;font-size:15px}.invitation-create{padding-bottom:14px;border-bottom:1px solid #dfe6dc;margin-bottom:14px}.invitation-fields{display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px}.invitation-fields label{margin:0;flex:1 1 170px}.invitation-fields input,.invitation-fields select{margin-top:6px}.invitation-fields>button{flex:0 0 auto}.invitation-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #e0e6dd}.invitation-item>div:first-child{min-width:0}.invitation-item code{display:block;overflow-wrap:anywhere;font-size:14px;font-weight:600}.invitation-item p{font-size:12px;margin:5px 0;color:#335443}.invitation-item small{font-size:11px;color:#738076}.invitation-actions{display:flex;gap:6px;flex-shrink:0}.invitation-actions button{padding:6px 9px;font-size:12px}#invitationError{color:#a33e3e}#invitationError:empty{display:none}@media(max-width:700px){.invitation-fields label{flex-basis:100%}.invitation-item{gap:8px}.invitation-item code{font-size:12px}.invitation-actions{flex-direction:column}}

#invitationLinkDialog{width:600px}#invitationLinkDialog h2{margin-top:0}#invitationLinkValue{font-size:13px}#invitationLinkError{color:#a33e3e}#invitationLinkError:empty{display:none}.invitation-actions{flex-wrap:wrap;justify-content:flex-end}@media(max-width:700px){.invitation-actions{flex-wrap:nowrap}}

@media(max-width:700px){#toolbar:has(>#manageInvitations){display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}#toolbar:has(>#manageInvitations)>strong{grid-column:1/-1;grid-row:1}#toolbar:has(>#manageInvitations)>.muted{grid-column:1/-1;grid-row:2}#toolbar:has(>#manageInvitations)>#userSearch{grid-column:1;grid-row:3;width:100%;min-width:0;margin:0}#toolbar>#manageInvitations{grid-column:2;grid-row:3;min-height:42px;margin:0;padding:8px 12px}}

.invitation-create-actions{display:flex;justify-content:flex-end;margin-top:12px}
/* Assignment song suggestions share the workspace picker colors and spacing. */
#editor .song-suggestions{position:relative;min-width:0}#editor #assignmentSong{margin:0}#editor label[for=assignmentSong]{margin-bottom:8px}.song-suggestion-list{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:10;max-height:220px;overflow-y:auto;overscroll-behavior:contain;padding:4px;border:1px solid #d4ded4;border-radius:8px;background:#fff;box-shadow:0 8px 24px #152c2226}#editor .song-suggestion-option{display:block;width:100%;min-height:38px;padding:9px 10px;margin:0;border:0;border-radius:5px;background:transparent;color:#20352e;text-align:left;font-size:13px;font-weight:400;line-height:1.5;white-space:normal;overflow-wrap:anywhere}#editor .song-suggestion-option:hover,#editor .song-suggestion-option[aria-selected=true]{background:#e2ebe1;color:#234c37;filter:none}.song-suggestion-hint{padding:10px;font-size:12px;color:#738076;line-height:1.5}@media(max-width:700px){.song-suggestion-list{max-height:190px}#editor .song-suggestion-option{min-height:42px}}

@media(max-width:700px){.collapsible-options:not(.expanded):has(.rare-statuses input:checked) .status-toggle{background:#e2ebe1;border-color:#285541;color:#335443}}

@media(max-width:700px){.collapsible-options.expanded .rare-statuses{display:contents}}
#personalMemberLookup{position:relative;margin:0 15px 16px;min-width:0}#personalMemberLookup>label{font-size:13px;margin:0 0 6px;font-weight:600}.personal-lookup-field{position:relative;min-width:0}#personalLookupInput{margin:0;width:100%;font-size:14px}.personal-lookup-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:8;max-height:240px;overflow-y:auto;overscroll-behavior:contain;padding:4px;border:1px solid #d4ded4;border-radius:8px;background:#fff;box-shadow:0 8px 24px #152c2226}#personalMemberLookup .personal-lookup-option{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:40px;margin:0;padding:9px 10px;border:0;border-radius:5px;background:transparent;color:#20352e;text-align:left;font-size:13px;font-weight:400;white-space:normal}#personalMemberLookup .personal-lookup-option>span{min-width:0;overflow-wrap:anywhere}.personal-lookup-option small{font-size:11px;color:#738076;flex-shrink:0}#personalMemberLookup .personal-lookup-option:hover,#personalMemberLookup .personal-lookup-option[aria-selected=true]{background:#e2ebe1;color:#234c37;filter:none}.personal-lookup-hint{padding:10px;font-size:12px;color:#738076}@media(max-width:700px){#personalMemberLookup{margin-left:0;margin-right:0}.personal-lookup-list{max-height:210px}#personalMemberLookup .personal-lookup-option{min-height:42px}}

@media(max-width:700px){#toolbar>#monthSelect,#toolbar>.monthly-row>#eventSelect{font-size:15px}}

/* Personal KPI periods share the compact, grouped presentation of music files. */
.personal-kpi>.kpi-period-list{margin:0;padding:10px 12px;border:1px solid #dfe6dc;border-radius:8px;background:#f4f7f2}
.kpi-period-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;padding-bottom:7px;border-bottom:1px solid #d5dfd3}
.kpi-period-heading h3{margin:0;font-size:14px;color:#285541}.kpi-period-heading small{color:#738076}
.kpi-period-list>.kpi-period-card{display:flex;flex-direction:column;width:100%;align-items:flex-start;justify-content:flex-start;gap:4px;padding:10px 0;border:0;border-bottom:1px solid #e0e6dd;border-radius:0;background:transparent;color:inherit;text-align:left;white-space:normal;box-shadow:none}
.kpi-period-list>.kpi-period-card:last-child{border-bottom:0}.kpi-period-card>strong{min-width:0;max-width:100%;font-size:clamp(12px,4.1vw,16px);white-space:nowrap}.kpi-period-card>span{flex-shrink:0;font-size:13px;color:#738076}.kpi-period-card>span>b{font-size:22px}.kpi-period-list>.kpi-period-card:hover{filter:none;background:#eaf1e8}.kpi-period-list>.kpi-period-card:focus-visible{outline:2px solid #6c9279;outline-offset:2px}
@media(max-width:700px){.personal-kpi>.kpi-period-list{padding:9px 10px}.kpi-period-list>.kpi-period-card{flex-wrap:wrap}}

/* Hide cached page snapshots without destroying the live account controls. */
html[data-session-suspended] body{visibility:hidden}

/* Choir branding stays beside the title without shrinking the account controls. */
header .site-brand{gap:12px;min-width:0}header .site-logo{display:block;flex:none;width:48px;height:40px;object-fit:contain}header .site-brand strong{white-space:nowrap}
@media(max-width:700px){header .site-brand{gap:7px}header .site-logo{width:36px;height:32px}}