*{box-sizing:border-box}body{margin:0;background:#f5f6f2;color:#22251c;font:14px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible{outline:3px solid #8fae2e;outline-offset:3px}h1,h2,h3,p{margin:0}button{border:0}input,select{width:100%;border:1px solid #d9ddcf;border-radius:7px;background:#fff;padding:12px;color:#22251c;min-height:44px}input:focus,select:focus{outline:2px solid #bdd956;outline-offset:1px}input[type=checkbox]{width:18px;min-height:18px;height:18px;accent-color:#738e2a}label{display:block;font-size:12px;font-weight:600;color:#555d49}label>input,label>select{margin-top:8px}small{font-size:11px}button.primary,.primary{background:#d5f76a;color:#242e0e;padding:12px 18px;border-radius:7px;font-weight:650;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:43px}.primary:hover{background:#c7e758}.secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 14px;border:1px solid #dfe3d5;border-radius:7px;background:#fff;font-size:12px;font-weight:550;color:#555d49}.secondary:hover{background:#f0f3e7}.danger{color:#b35042;border-color:#e9c6be}.muted{color:#8b9281}.brand{display:flex;gap:12px;align-items:center}.brand-symbol{font:39px Impact,"Arial Narrow",sans-serif;letter-spacing:-5px;transform:skew(-8deg);color:#d5f76a;padding-right:5px}.brand-name{font-size:8px;font-weight:750;letter-spacing:.5px;line-height:1.6;color:#fff}.brand-name small{display:block;font-size:12px;letter-spacing:3px}.login-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-art{background:#161914;position:relative;padding:45px 10%;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;color:#fff}.login-art:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#151714f0, #1517145e),url('hero.webp') center/cover;opacity:.6}.login-art>*{position:relative}.login-headline{margin:100px 0 50px;font:clamp(54px,6vw,89px)/1.08 Impact,"Arial Narrow",sans-serif;letter-spacing:-1px}.login-headline span{color:#d5f76a}.login-art p{color:#bdc4b1;font-size:13px;line-height:1.8;max-width:330px;margin-top:22px}.login-art>small{font-size:10px;color:#a7af9b}.login-main{display:flex;align-items:center;justify-content:center;padding:45px}.login-card{width:100%;max-width:345px}.overline{font-size:9px;letter-spacing:2px;color:#90997f;font-weight:700;margin-bottom:16px}.login-card h1{font-size:31px;letter-spacing:-1px}.login-card>p{margin:13px 0 32px;line-height:1.7;font-size:13px;color:#828b74}.login-card label{margin-bottom:19px}.login-card .primary{width:100%;margin-top:8px}.login-back{display:inline-block;margin-top:32px;color:#7a846b;font-size:11px}.form-error{color:#b84739;background:#fff0ed;border-radius:5px;padding:12px;font-size:12px;line-height:1.6;margin:15px 0}.form-error:empty{display:none}.login-note{font-size:11px;color:#8f977e;margin-top:25px;line-height:1.7}.app-shell{min-height:100vh;display:grid;grid-template-columns:230px 1fr}.sidebar{background:#151914;color:#b7c0a7;position:fixed;inset:0 auto 0 0;width:230px;display:flex;flex-direction:column;padding:31px 23px}.sidebar .brand{margin-bottom:49px}.sidebar-label{font-size:8px;letter-spacing:2px;margin:0 13px 14px;color:#6e7c5f}.sidebar nav{display:flex;flex-direction:column;gap:7px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;padding:13px 14px;font-size:12px;font-weight:550;color:#9da98b;background:transparent;text-align:left;border-radius:7px}.nav-item.active{color:#d5f76a;background:#d5f76a12}.nav-item:hover{background:#ffffff0a;color:#d5f76a}.nav-item .nav-icon{font-size:18px;width:22px;text-align:center}.sidebar-bottom{margin-top:auto;padding-top:30px;border-top:1px solid #ffffff13}.sidebar-bottom>a{font-size:11px;display:block;padding:8px 12px;color:#a8b497}.profile{display:flex;gap:10px;align-items:center;margin:20px 7px 10px}.avatar{width:35px;height:35px;background:#d5f76a22;color:#d5f76a;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;border-radius:9px}.profile-name{font-size:11px;color:#e6ebde;max-width:120px;overflow:hidden;text-overflow:ellipsis}.profile-role{font-size:9px;color:#7e8b6d;margin-top:5px}.account-actions{display:flex;gap:13px;padding:9px 7px}.account-actions button{background:none;color:#8c9b77;font-size:10px;padding:0}.main-area{grid-column:2;min-width:0}.app-topbar{height:76px;background:#fff;border-bottom:1px solid #e7ebdf;padding:0 42px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#8c957e}.app-topbar strong{color:#4c5a3d;font-size:11px}.app-content{padding:35px 42px 60px;max-width:1600px;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.page-heading h1{font-size:28px;letter-spacing:-.8px;font-weight:650}.page-heading p{font-size:12px;margin-top:9px;color:#90997f}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-bottom:26px}.summary-card{background:#fff;border:1px solid #e4e9da;border-radius:9px;padding:22px;display:flex;justify-content:space-between;align-items:center}.summary-card .number{font-size:31px;font-weight:650;letter-spacing:-1px;margin:11px 0 0;line-height:1}.summary-card .label{font-size:10px;color:#899477}.summary-icon{background:#f2f6e7;color:#8ca853;border-radius:10px;width:43px;height:43px;display:flex;justify-content:center;align-items:center;font-size:20px}.panel{background:#fff;border:1px solid #e1e7d7;border-radius:10px;overflow:hidden}.panel-header{padding:21px 23px;border-bottom:1px solid #e9eddf;display:flex;justify-content:space-between;align-items:center;gap:20px}.panel-header h2{font-size:14px;font-weight:650}.filter-bar{display:flex;align-items:center;gap:10px}.filter-bar select{min-height:35px;padding:7px 10px;font-size:11px;width:auto}.month-nav{display:flex;align-items:center;gap:6px}.month-nav button{background:#f3f6ec;border-radius:5px;height:33px;width:30px;color:#6d7c58;font-size:18px}.month-nav input{width:157px;min-height:34px;padding:6px 9px;font-size:11px}.training-list{padding:0 23px}.training-row{display:grid;grid-template-columns:72px 1fr 115px 120px 106px;gap:17px;align-items:center;padding:22px 0;border-bottom:1px solid #ecf0e5}.training-row:last-child{border-bottom:0}.date-block{display:flex;flex-direction:column;gap:5px}.date-block strong{font-size:22px;letter-spacing:-.5px}.date-block span{font-size:9px;color:#98a187}.training-info h3{font-size:13px;font-weight:650;margin:7px 0}.training-info p{font-size:10px;color:#8e987e;line-height:1.5}.badge{display:inline-flex;padding:4px 7px;border-radius:4px;font-size:8px;font-weight:650;background:#eff6df;color:#6d842c;letter-spacing:.2px}.badge.cal{background:#eef0fa;color:#707ea4}.badge.cancelled{background:#faece7;color:#ae7366}.badge.private{background:#f0f1eb;color:#8a917d}.row-time{font-size:11px;font-weight:550}.row-time small{display:block;font-size:9px;font-weight:400;color:#9aa48a;margin-top:7px}.attendance-count{font-size:11px;color:#75865c}.attendance-count small{display:block;font-size:9px;color:#9aa38e;margin-top:5px}.row-action{font-size:10px;padding:9px 10px;min-height:33px}.training-row.is-cancelled .training-info h3{text-decoration:line-through;color:#8b947e}.empty{padding:50px 24px;text-align:center;line-height:1.7}.empty-icon{font-size:31px;color:#a0b57a;margin-bottom:15px}.empty h3{font-size:15px;margin-bottom:9px}.empty p{font-size:12px;color:#919b80;max-width:390px;margin:0 auto 20px}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;color:#798768;font-size:13px}.search-input{max-width:275px;min-height:37px;padding:8px 12px;font-size:11px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font-size:9px;color:#93a17d;text-transform:uppercase;letter-spacing:.7px;font-weight:650;background:#fafbf7;padding:16px 23px}td{font-size:12px;padding:19px 23px;border-top:1px solid #edf0e7}td small{color:#919c7d}td .member-avatar{display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;border-radius:7px;background:#eff3e6;color:#778962;font-size:10px;margin-right:10px}.table-actions{display:flex;gap:8px}.table-actions button{border:0;background:none;color:#758363;font-size:10px;padding:7px}.table-actions button:hover{background:#f3f6ed;border-radius:4px}.attendance-layout{display:grid;grid-template-columns:1fr 260px;gap:22px}.detail-title{display:flex;align-items:center;gap:8px;font-size:11px;color:#83916b;margin-bottom:23px}.detail-title button{background:none;color:inherit;padding:0}.training-details{padding:23px;border-bottom:1px solid #e9eddf}.training-details h2{font-size:19px;margin:10px 0}.training-meta{display:flex;gap:20px;flex-wrap:wrap;color:#879575;font-size:11px;margin-top:17px}.attendance-toolbar{padding:20px 23px;display:flex;gap:15px;justify-content:space-between;align-items:center}.attendance-roster{padding:0 23px 12px}.roster-row{padding:17px 0;border-top:1px solid #eef1e6;display:flex;align-items:center;justify-content:space-between;gap:15px}.roster-name{font-size:12px;line-height:1.7}.roster-name small{font-size:9px;color:#a0a88f;display:block}.status-group{display:flex;gap:4px;flex-wrap:wrap}.status-group button{background:#f4f6ef;color:#98a384;font-size:9px;padding:8px 10px;border:1px solid transparent;border-radius:5px;min-height:33px}.status-group button.chosen{border-color:#a8c75b;background:#eaf3d6;color:#668329}.status-group button.chosen.absent{border-color:#e3b6aa;background:#faece7;color:#aa6250}.status-group button.chosen.excused{border-color:#d6c59b;background:#fcf5e6;color:#9b864a}.status-group button.chosen.unset{border-color:#cbd2bd;background:#eff2e7;color:#7e8d6a}.detail-side{display:flex;flex-direction:column;gap:18px}.side-card{background:#fff;border:1px solid #e2e8d8;border-radius:9px;padding:22px}.side-card h3{font-size:12px;margin-bottom:18px}.attendance-summary{display:flex;justify-content:space-between;margin:14px 0;font-size:11px;color:#8b987a}.attendance-summary strong{font-size:14px;color:#627746}.side-card .primary{width:100%;margin-top:10px}.save-hint{font-size:10px;line-height:1.6;color:#9da78d;margin-top:13px;text-align:center}.training-actions{display:flex;flex-direction:column;gap:10px}.training-actions button{width:100%}dialog{width:min(560px,calc(100% - 30px));border:1px solid #e1e7d6;border-radius:13px;max-height:92vh;padding:0;box-shadow:0 25px 90px #15171430;color:#333d29}dialog::backdrop{background:#13181077;backdrop-filter:blur(4px)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:25px 27px;border-bottom:1px solid #e8ecdf}.modal-header h2{font-size:19px}.modal-header button{font-size:21px;background:#f4f6ed;color:#7f8d6a;width:31px;height:31px;border-radius:6px}.modal-body{padding:26px 27px}.modal-body label{margin-bottom:18px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:17px}.check-label{display:flex;align-items:center;gap:11px;font-size:12px;line-height:1.6;margin:20px 0!important}.check-label>input{margin:0}.repeat-fields{background:#f5f8ed;border-radius:7px;padding:19px;margin:15px 0 22px}.repeat-fields .form-row label:last-child{grid-column:1/-1}.repeat-preview{font-size:11px;color:#819360;line-height:1.7;margin-top:5px}.modal-footer{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.form-help{font-size:10px;color:#96a384;line-height:1.7}.help-inline{font-size:11px;color:#8f9c7b;margin-bottom:22px;line-height:1.7}.hidden{display:none!important}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(100px);max-width:min(520px,90vw);padding:15px 22px;background:#28331e;color:#eff5e7;border-radius:8px;font-size:12px;box-shadow:0 8px 30px #0002;z-index:100;transition:transform .2s;line-height:1.7}#toast.visible{transform:translateX(-50%) translateY(0)}#toast.error{background:#894b3d}.cancel-notice{padding:15px 23px;background:#fdf1ed;color:#aa7766;font-size:12px;line-height:1.7}.mobile-brand{display:none}@media(max-width:1150px){.app-shell{grid-template-columns:200px 1fr}.sidebar{width:200px;padding:27px 18px}.app-content{padding:30px 25px}.app-topbar{padding:0 25px}.training-row{grid-template-columns:65px 1fr 95px 90px;gap:12px}.attendance-count{display:none}.attendance-layout{grid-template-columns:1fr 230px;gap:17px}.summary-card{padding:18px}.roster-row{align-items:flex-start;flex-direction:column}.attendance-toolbar{flex-wrap:wrap}}@media(max-width:820px){.app-shell{display:block}.sidebar{position:static;width:auto;padding:0;display:block;background:#151914}.sidebar>.brand,.sidebar-label,.sidebar-bottom{display:none}.sidebar nav{flex-direction:row;padding:8px 18px;overflow-x:auto;gap:5px}.nav-item{justify-content:center;width:auto;white-space:nowrap;padding:11px;font-size:11px}.nav-item .nav-icon{font-size:15px;width:17px}.app-topbar{height:63px;padding:0 22px}.mobile-brand{display:flex;gap:8px;align-items:center;color:#617441;font-size:10px;font-weight:700}.mobile-account{display:flex;align-items:center;gap:9px}.mobile-account button{background:none;color:#8a9677;font-size:10px}.app-topbar>.topbar-date{display:none}.app-content{padding:25px 20px 40px}.page-heading h1{font-size:24px}.page-heading p{font-size:11px}.attendance-layout{grid-template-columns:1fr}.detail-side{display:grid;grid-template-columns:1.3fr 1fr}.training-actions{justify-content:flex-start}.login-main{padding:30px}.login-art{padding:35px 9%}.login-headline{font-size:60px}.login-layout{grid-template-columns:.8fr 1fr}.summary-grid{gap:10px}.summary-card{padding:17px}.summary-icon{display:none}.panel-header{padding:18px}.training-list{padding:0 18px}.training-row{grid-template-columns:55px 1fr 93px;gap:13px}.row-time{display:none}}@media(min-width:821px){.mobile-account{display:none}}@media(max-width:520px){.login-layout{display:block}.login-art{padding:25px 30px;height:100px}.login-art:before{background-position:center 45%}.login-art>div:last-of-type,.login-art>small{display:none}.login-main{padding:40px 28px;align-items:flex-start}.login-card h1{font-size:29px}.page-heading{align-items:flex-start}.page-heading h1{font-size:22px}.page-heading p{max-width:190px;line-height:1.6}.page-heading>.primary{font-size:10px;gap:5px;min-height:39px;padding:10px 11px;white-space:nowrap}.app-content{padding:24px 14px}.app-topbar{padding:0 17px}.summary-grid{gap:8px}.summary-card{padding:16px 12px}.summary-card .label{font-size:8px;line-height:1.6}.summary-card .number{font-size:26px}.panel-header{align-items:flex-start;flex-direction:column;gap:15px;padding:18px}.filter-bar{width:100%;justify-content:space-between;gap:8px}.filter-bar select{max-width:122px;font-size:10px}.month-nav input{width:136px;font-size:10px}.month-nav{gap:4px}.month-nav button{width:24px}.training-row{grid-template-columns:43px 1fr 76px;gap:11px;padding:20px 0}.date-block strong{font-size:18px}.date-block span{font-size:8px}.training-info h3{font-size:12px}.training-info p{font-size:9px}.training-info .badge{font-size:7px}.row-action{font-size:9px;padding:8px 7px}.detail-side{grid-template-columns:1fr}.side-card{padding:19px}.attendance-layout{gap:15px}.attendance-toolbar{padding:18px}.attendance-toolbar .search-input{max-width:100%}.attendance-roster{padding:0 18px 10px}.status-group{gap:4px}.status-group button{font-size:9px;padding:8px 9px}.roster-name{font-size:12px}.training-details{padding:19px}.training-details h2{font-size:18px}.training-meta{gap:12px;font-size:10px}.form-row{gap:13px}.modal-body{padding:22px}.modal-header{padding:22px}td{padding:16px 18px}th{padding:14px 18px}.mobile-account>span{display:none}.sidebar nav{padding:8px 10px}.nav-item{font-size:10px;padding:11px 9px}}@media(prefers-reduced-motion:reduce){#toast{transition:none}}

.status-group button{color:#6b785c}.save-hint,.form-help,.help-inline{color:#748063}.training-meta,.training-info p,.date-block span{color:#748263}

.delete-warning{font-size:13px;line-height:1.8;margin-bottom:18px;color:#805246}.primary.danger{background:#a5483a;color:#fff}.primary.danger:hover{background:#923e32}

.row-actions{display:flex;flex-direction:column;gap:6px}.row-actions .row-action{width:100%}.modal-footer:has(#delete-from-edit),.modal-footer:has(.modal-delete){flex-wrap:wrap}#delete-from-edit,.modal-delete{margin-right:auto}#trainer-filter{max-width:180px}
.member-dashboard-panel{margin-top:24px}.member-profile{padding:0 24px;display:grid;grid-template-columns:100px 1fr;gap:12px}.member-profile dt{color:#687064}.member-profile dd{margin:0;overflow-wrap:anywhere}.member-profile-help{padding:8px 24px 24px;color:#687064}
.person-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;vertical-align:middle}.person-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.person-photo[hidden]{display:none}.profile-avatar{width:80px;height:80px;border-radius:50%;background:#e9eddf;color:#384522;font-weight:700;font-size:25px}.photo-editor{display:flex;gap:20px;align-items:center;margin:20px 0}.photo-editor>div:last-child{flex:1;min-width:0}.photo-editor input[type=file]{width:100%;font-size:13px}.profile-photo-block{padding:0 24px 16px}.instagram-link{color:#4b6124;text-decoration:none;font-size:13px}.instagram-link:hover{text-decoration:underline}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.period-tabs{display:flex;gap:6px;flex-wrap:wrap}.period-tabs button{background:#f5f6f1;border:1px solid #e1e6d8;border-radius:8px;padding:11px 16px;font-weight:650;font-size:12px;color:#7a856b;min-height:43px}.period-tabs button.selected{background:#26321e;color:#e7f5cf;border-color:#26321e}.period-tabs button:hover{border-color:#879a68}.training-filters .filter-bar{width:auto}.training-table-heading{display:grid;grid-template-columns:1fr 142px 156px;gap:20px;padding:17px 23px;font-size:10px;color:#8a967a;border-bottom:1px solid #edf0e7}.training-date-heading{font-size:13px;font-weight:600;color:#758266;padding:23px 0 8px;text-transform:none}.training-list .training-row{grid-template-columns:70px minmax(0,1fr) 142px 156px;gap:20px;padding:18px 0 23px}.training-row .date-block strong{font-size:20px;color:#688c30}.training-row .date-block span{font-size:11px}.training-info small{color:#909d80;font-size:10px}.training-row .row-actions{flex-direction:row;gap:7px}.training-row .row-actions .row-action{width:auto;flex:1}.attendance-chips{display:flex;align-items:center;gap:7px}.attendance-chip{min-width:32px;height:32px;border-radius:7px;display:inline-flex;justify-content:center;align-items:center;font-size:12px;font-weight:700}.attendance-chip.unset{background:#e9ece5;color:#737c6a}.attendance-chip.present{background:#69ad4e;color:#fff}.attendance-chip.absent{background:#ef4a36;color:#fff}
.attendance-toolbar{flex-wrap:wrap;gap:10px}.attendance-toolbar #consistency-filter{width:auto;max-width:160px;font-size:11px;min-height:37px;padding:8px 10px}.attendance-toolbar #all-present{font-size:10px;min-height:37px;margin-left:auto}.attendance-toolbar .search-input{flex:1;min-width:140px}.attendance-status-tabs{display:flex;flex-wrap:wrap;gap:7px;padding:0 23px 20px}.attendance-status-tabs button{display:inline-flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #e2e6da;border-radius:7px;background:#fff;color:#818c73;font-size:11px;font-weight:600;min-height:39px}.attendance-status-tabs button span{background:#edf0e7;padding:3px 6px;border-radius:5px;font-size:10px}.attendance-status-tabs button.selected{border-color:#86986b;background:#f0f4e8;color:#465835}.attendance-status-tabs button.present{color:#509637}.attendance-status-tabs button.present span{background:#69ad4e;color:#fff}.attendance-status-tabs button.absent{color:#dd4635}.attendance-status-tabs button.absent span{background:#ef4a36;color:#fff}.roster-heading{display:grid;grid-template-columns:minmax(0,1fr) 98px 136px;gap:16px;padding:0 23px 13px;color:#8c967e;font-size:10px}.attendance-roster .roster-row{display:grid;grid-template-columns:minmax(0,1fr) 98px 136px;gap:16px;align-items:center;padding:18px 0}.roster-person{display:flex;align-items:center;gap:12px;min-width:0}.roster-person .member-avatar{width:39px;height:39px;border-radius:50%;background:#edf0e6;color:#7c8a69;font-size:12px;font-weight:650}.roster-person .roster-name{overflow-wrap:anywhere;line-height:1.5}.consistency-badge{display:inline-flex;align-items:center;justify-self:start;padding:5px 8px;border-radius:5px;font-size:9px;white-space:nowrap;background:#f0f2ec;color:#929a86}.consistency-badge.regular{background:#edf5df;color:#6f8f37}.consistency-badge.occasional{background:#f8f1e0;color:#ab8b3f}.attendance-roster .status-group{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;min-width:0}.attendance-roster .status-group button{width:44px;height:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:1.5px solid #dfe5d7;border-radius:8px;background:#fff;flex-shrink:0}.attendance-roster .status-group button.present{color:#69ad4e}.attendance-roster .status-group button.absent{color:#ef4a36}.attendance-roster .status-group button.chosen.present{background:#69ad4e;border-color:#69ad4e;color:#fff}.attendance-roster .status-group button.chosen.absent{background:#ef4a36;border-color:#ef4a36;color:#fff}.attendance-roster .status-group button:hover{border-color:currentColor;box-shadow:0 2px 6px #202a1510}.attendance-roster .status-group .clear-attendance{width:26px;background:transparent;border-color:transparent;color:#a0a995;font-size:21px}.attendance-summary.present strong{color:#579b3b}.attendance-summary.absent strong{color:#e44a36}.attendance-summary.unset strong{color:#88927c}
@media(max-width:1100px){.training-table-heading{grid-template-columns:1fr 120px 140px;gap:12px}.training-list .training-row{grid-template-columns:60px minmax(0,1fr) 120px 140px;gap:12px}.attendance-layout{grid-template-columns:minmax(0,1fr)}.detail-side{display:grid;grid-template-columns:1fr 1fr}.attendance-toolbar #all-present{margin-left:0}}
@media(max-width:650px){.training-filters{align-items:stretch;gap:12px}.training-filters .filter-bar{width:100%;justify-content:flex-start}.training-filters #type-filter{max-width:none;flex:1}.training-table-heading{display:none}.training-list .training-row{grid-template-columns:56px minmax(0,1fr);gap:12px}.training-row .attendance-chips{grid-column:1/2}.training-row .row-actions{grid-column:2/3;justify-content:flex-end}.training-row .row-actions .row-action{flex:none;padding:9px 12px}.training-row .date-block strong{font-size:18px}.attendance-chip{min-width:24px;height:27px;font-size:10px}.attendance-chips{gap:4px}.period-tabs button{padding:10px 13px;font-size:11px}.attendance-status-tabs{padding:0 18px 16px;gap:6px}.attendance-status-tabs button{padding:8px 9px;font-size:10px;gap:6px}.roster-heading{grid-template-columns:1fr 136px;padding:0 18px 12px}.roster-heading>span:nth-child(2){display:none}.attendance-roster .roster-row{grid-template-columns:minmax(0,1fr) 136px;gap:7px 10px;padding:16px 0}.roster-row .status-group{grid-column:2;grid-row:1/3}.roster-row .consistency-badge{grid-column:1;margin-left:48px}.roster-person{gap:10px}.roster-person .member-avatar{width:36px;height:36px;font-size:11px}.roster-person .roster-name{font-size:11px}.detail-side{grid-template-columns:1fr}.attendance-toolbar #consistency-filter{max-width:none;flex:1}.attendance-toolbar #all-present{width:100%}}

.training-date-heading::first-letter{text-transform:uppercase}
.autosave-status{border-radius:7px;background:#f0f5e8;color:#668441;padding:12px 10px;margin-top:17px;font-size:11px}.autosave-status.save-pending{background:#f7f4e8;color:#9d8749}.autosave-status.save-error{background:#fff0ed;color:#b74839}.side-card #retry-autosave,.side-card #reload-attendance{width:100%;margin-top:10px}
.attendance-toolbar #attendance-status-filter{width:auto;max-width:165px;min-height:37px;padding:8px 10px;font-size:11px}
@media(max-width:650px){.attendance-toolbar .search-input{flex-basis:100%;max-width:none}.attendance-toolbar #attendance-status-filter,.attendance-toolbar #consistency-filter{flex:1;min-width:0;max-width:none}}
.roster-overview{padding:0 23px 23px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}.roster-members-summary{display:flex;align-items:center;gap:15px}.roster-members-summary h2{font-size:18px;font-weight:650}.roster-members-summary .attendance-chip{min-width:29px;height:30px}.autosave-inline{max-width:330px}.autosave-inline .autosave-status{margin:0;padding:8px 10px;font-size:10px}.autosave-inline .secondary{margin-top:8px;font-size:10px}.detail-side{display:flex;flex-direction:column}
@media(max-width:650px){.roster-overview{padding:0 18px 19px;gap:10px}.autosave-inline{max-width:none;width:100%}.autosave-inline .autosave-status{text-align:left;background:transparent;padding:0}.autosave-inline .save-error{padding:10px;background:#fff0ed}.roster-members-summary h2{font-size:17px}}
.attendance-layout.attendance-only{grid-template-columns:minmax(0,1fr)}
.attendance-training-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.training-header-info{min-width:0}.attendance-training-header .roster-overview{align-self:flex-end;padding:0;flex-direction:column;align-items:flex-end;justify-content:flex-start;gap:12px;flex-shrink:0}.attendance-training-header .roster-members-summary h2{font-size:14px;margin:0}.attendance-training-header .autosave-inline{max-width:300px}.attendance-training-header .autosave-status{text-align:right}
@media(max-width:650px){.attendance-training-header{flex-direction:column;gap:18px}.attendance-training-header .roster-overview{align-self:stretch;align-items:flex-end}.attendance-training-header .autosave-inline{width:auto;max-width:100%}.attendance-training-header .roster-members-summary{gap:12px}}

.attendance-training-header .roster-members-summary .attendance-chip{min-width:48px;height:48px;padding:0 12px;font-size:20px;border-radius:9px}.attendance-training-header .attendance-chips{gap:9px}.attendance-training-header .autosave-inline:has(.autosave-status.hidden){display:none}

/* Shared select styling, including the dropdown in supporting browsers. */
select{appearance:none;-webkit-appearance:none;border:2px solid #dde2d5;border-radius:10px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23828e74' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding:11px 42px 11px 14px;min-height:46px;font-weight:600;cursor:pointer;transition:border-color .15s,box-shadow .15s,background-color .15s}
select:hover:not(:disabled){border-color:#aab89a;background-color:#fafcf6}select:focus-visible{outline:0;border-color:#8eaa53;box-shadow:0 0 0 3px #a7c65b22}select:disabled{cursor:not-allowed;opacity:.55;background-color:#f3f5ef}
.filter-bar select,.attendance-toolbar select{padding:10px 38px 10px 13px;min-height:42px;border-radius:10px;background-position:right 10px center;font-size:12px;max-width:100%}
@supports(appearance:base-select){
 select,select::picker(select){appearance:base-select}
 select{background-image:none;align-items:center;gap:18px;padding-right:14px}
 .filter-bar select,.attendance-toolbar select{padding-right:13px}
 select::picker-icon{content:"";width:8px;height:8px;border-right:2px solid #828e74;border-bottom:2px solid #828e74;rotate:45deg;translate:0 -2px;transition:rotate .15s;flex-shrink:0}
 select:open::picker-icon{rotate:225deg;translate:0 2px}
 select:open{border-color:#aab89a;background:#f9fbf5}
 select::picker(select){margin-top:5px;padding:7px;border:2px solid #dde2d5;border-radius:12px;background:#fff;box-shadow:0 12px 32px #26341a1c;max-height:320px;overflow:auto;color:#68745b}
 select option{padding:12px 14px;border-radius:7px;min-height:42px;font:inherit;font-weight:550;cursor:pointer;gap:12px}
 select option:hover,select option:focus{background:#f1f5e8;color:#354820;outline:none}
 select option:checked{background:#edf4de;color:#65842c;font-weight:700}
 select option::checkmark{display:none}
}

/* Attendance payments share the attendance autosave and version lock. */
.roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(140px,1fr) 86px 264px 64px;gap:16px}
.payment-cell{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.payment-options{display:flex;gap:5px;align-items:center}
.payment-option{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 9px;border:1.5px solid #dfe5d7;border-radius:8px;background:transparent;color:#758363;font-size:11px;font-weight:650;white-space:nowrap}
.payment-option.chosen{background:#edf5df;border-color:#8aac60;color:#4b752f}
.payment-option:disabled{opacity:1;cursor:default}
.payment-confirm{background:#fbf3df;color:#987329;border:1px solid #d9c28c;border-radius:6px;min-height:30px;padding:5px 9px;font-size:10px;font-weight:600}
.payment-confirm.confirmed{background:#edf5df;border-color:#8aac60;color:#4b752f}
.payment-mobile-label{display:none}
@media(min-width:651px) and (max-width:1250px){
 .roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(120px,1fr) 264px 64px;gap:8px 14px}
 .roster-heading>span:nth-child(2){display:none}
 .roster-row .roster-person{grid-column:1;grid-row:1}
 .roster-row .consistency-badge{grid-column:1;grid-row:2;margin-left:51px}
 .roster-row .status-group{grid-column:2;grid-row:1/3}
 .roster-row .payment-cell{grid-column:2;grid-row:1/3}
 .roster-row .attendance-indicator{grid-column:3;grid-row:1/3}
}
@media(max-width:650px){
 .roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(0,1fr) 44px;gap:8px 10px}
 .roster-heading>span:nth-child(3){display:none}
 .roster-row .roster-person{grid-column:1;grid-row:1}
 .roster-row .consistency-badge{grid-column:1;grid-row:2}
 .roster-row .status-group{grid-column:2;grid-row:1/3}
 .roster-row .payment-cell{grid-column:1;grid-row:3;align-items:flex-start;margin-top:7px}
 .roster-row .attendance-indicator{grid-column:2;grid-row:3;align-self:center;justify-self:end}
 .payment-mobile-label{display:block;font-size:10px;color:#8c967e}
 .payment-options{flex-wrap:wrap}.payment-option{min-height:40px}
}

.attendance-indicator{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:22px;color:#8b9585;background:#edf0e7}.attendance-indicator.present{background:#69ad4e;color:#fff}.attendance-indicator.absent{background:#ef4a36;color:#fff}
@media(max-width:650px){.payment-options{gap:4px}.payment-option{padding:7px 6px;gap:4px;font-size:10px}.payment-option svg{width:15px;height:15px}}

/* Money totals are shown before the possible / actual attendance counts. */
.training-overview{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.money-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.money-card{min-width:85px;padding:8px 10px;border:1px solid #dce3d3;border-radius:8px;background:#f3f6ed}
.money-label{display:flex;align-items:center;gap:5px;font-size:9px;color:#7e8e6d;white-space:nowrap;margin-bottom:6px}
.money-label svg{width:13px;height:13px}.money-card strong{font-size:13px;white-space:nowrap}.money-card.total{border-color:#aabd86}
.training-overview>.attendance-chips{margin-left:auto}
.attendance-training-header{flex-wrap:wrap}
.attendance-training-header .roster-overview{max-width:100%}
.attendance-training-header .training-overview{justify-content:flex-end}
.attendance-training-header .money-card{padding:9px 11px;min-width:90px}
.attendance-training-header .money-card strong{font-size:15px}
.training-table-heading{grid-template-columns:1fr 380px 156px}
.training-list .training-row{grid-template-columns:64px minmax(140px,1fr) 380px 156px;gap:16px}
.training-row .training-overview{gap:8px;flex-wrap:nowrap}
.training-row .money-card{min-width:75px;padding:8px}
.training-row .attendance-chip{min-width:30px}
@media(max-width:1400px){
 .training-table-heading{display:none}
 .training-list .training-row{grid-template-columns:64px minmax(0,1fr) 156px;gap:12px}
 .training-row .training-overview{grid-column:1/3;grid-row:2;justify-content:flex-start;max-width:100%}
 .training-row .row-actions{grid-column:3;grid-row:1/3}
}
@media(max-width:650px){
 .training-list .training-row{grid-template-columns:56px minmax(0,1fr)}
 .training-row .training-overview{grid-column:1/-1;grid-row:2;flex-wrap:wrap;width:100%}
 .training-row .row-actions{grid-column:2;grid-row:3}
 .attendance-training-header .roster-overview{width:100%}
 .attendance-training-header .training-overview{gap:12px}
 .attendance-training-header .money-summary{width:100%}
 .attendance-training-header .money-card{min-width:0;padding:9px}
 .attendance-training-header .money-card strong{font-size:14px}
 .training-row .training-overview>.attendance-chips{grid-column:auto}
}

/* Date-led training list, with all desktop values aligned in one row. */
.training-list .training-row{display:grid;grid-template-columns:78px minmax(110px,1fr) 92px 316px 138px;gap:16px;align-items:center;padding:26px 0}
.training-row .training-calendar-date{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.training-row .training-calendar-date strong{font-size:28px;letter-spacing:-1.2px;line-height:1.1;white-space:nowrap;color:inherit}
.training-row .training-calendar-date span{font-size:10px;text-transform:uppercase;letter-spacing:1px}
.training-calendar-date small{font-size:9px;color:#8d9980}
.training-hours{font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums;display:flex;gap:2px;justify-content:center}
.training-row .training-info h3{font-size:13px;line-height:1.4;margin:7px 0}
.training-row .training-info p{font-size:11px;line-height:1.5}
.training-row .training-info small{display:block;margin-top:5px}
.training-row .training-overview{grid-column:auto;grid-row:auto;display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:12px;width:auto;max-width:none}
.training-row .money-summary{gap:5px;min-width:0}
.training-row .money-card{min-width:68px;padding:9px 7px}
.training-row .money-card strong{font-size:12px}
.training-row .money-label{font-size:8px;gap:4px}
.training-row .money-label svg{width:12px;height:12px}
.training-row .attendance-chips{margin-left:0;gap:5px;flex-shrink:0;grid-column:auto}
.training-row .attendance-chip{min-width:31px;height:35px;font-size:12px}
.training-row .row-actions{grid-column:auto;grid-row:auto;display:flex;flex-direction:row;gap:6px;align-items:center}
.training-row .row-actions .row-action{font-size:10px;padding:10px 8px;min-height:36px;flex:1;white-space:nowrap}
@media(min-width:1081px) and (max-width:1250px){
 .training-list{padding:0 20px}
 .training-list .training-row{grid-template-columns:65px minmax(100px,1fr) 78px 292px 126px;gap:10px}
 .training-row .training-calendar-date strong{font-size:25px}
 .training-row .training-overview{gap:9px}
 .training-row .money-card{min-width:64px;padding:9px 6px}
 .training-row .training-info h3{font-size:12px}
 .training-hours{font-size:11px}
}
@media(max-width:1080px){
 .training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto;gap:16px}
 .training-row .training-hours{grid-column:3;grid-row:1;align-self:center;font-size:12px}
 .training-row .training-overview{grid-column:1/3;grid-row:2;justify-content:flex-start}
 .training-row .row-actions{grid-column:3;grid-row:2;justify-content:flex-end}
}
@media(max-width:580px){
 .training-list .training-row{grid-template-columns:65px minmax(0,1fr);gap:12px;padding:22px 0}
 .training-row .training-calendar-date strong{font-size:26px}
 .training-row .training-info h3{font-size:13px}
 .training-row .training-hours{grid-column:2;grid-row:2;justify-content:flex-start;font-size:12px}
 .training-row .training-overview{grid-column:1/-1;grid-row:3;width:100%;justify-content:space-between;gap:8px}
 .training-row .money-card{min-width:0;padding:9px 7px}
 .training-row .money-card strong{font-size:12px}
 .training-row .row-actions{grid-column:1/-1;grid-row:4;justify-content:flex-end}
 .training-row .row-actions .row-action{flex:none;padding:10px 15px}
}

/* The list keeps only a compact total; attendance details retain the breakdown. */
.training-total{display:inline-flex;align-items:center;gap:7px;padding:9px 10px;border:1px solid #aabd86;border-radius:8px;background:#f3f6ed;white-space:nowrap}
.training-total>span{font-size:13px;opacity:.75}
.training-total strong{font-size:12px;font-variant-numeric:tabular-nums}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 105px 180px 138px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(100px,1fr) 90px 165px 126px}}
@media(max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:580px){.training-list .training-row{grid-template-columns:65px minmax(0,1fr)}}

/* Keep attendance before the financial total in the training list. */
.training-row .training-overview>.attendance-chips{order:0}
.training-row .training-overview>.training-total{order:1}
.training-row .training-hours{font-size:15px;font-weight:600;gap:3px}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 125px 180px 138px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(100px,1fr) 120px 165px 126px}}
@media(max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:580px){.training-list .training-row{grid-template-columns:65px minmax(0,1fr)}}

/* Stable columns keep attendance fixed regardless of the amount's length. */
.training-row .training-overview{display:grid;grid-template-columns:114px 112px;gap:10px;justify-content:end}
.training-row .training-overview>.attendance-chips{order:0;display:grid;grid-template-columns:54px 54px;gap:6px}
.training-row .attendance-chip{width:54px;gap:5px;padding:0 5px}
.training-row .attendance-chip>span[aria-hidden]{font-size:14px}
.training-row .training-total{order:1;justify-content:center;min-width:0;width:112px;box-sizing:border-box}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 125px 236px 138px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(100px,1fr) 120px 236px 126px;gap:10px}}
@media(max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}.training-row .training-overview{justify-content:start}}
@media(max-width:580px){.training-list .training-row{grid-template-columns:65px minmax(0,1fr)}.training-row .training-overview{justify-content:space-between}}

/* One attendance total: trainers + members, alongside a four-digit amount. */
.training-row .training-overview{grid-template-columns:83px 88px;gap:10px}
.training-row .training-overview>.attendance-chips{display:flex;gap:0}
.training-row .attendance-chip{width:83px;box-sizing:border-box;white-space:nowrap;gap:6px}
.training-row .training-total{width:88px;padding:9px 7px;gap:6px}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 125px 181px 138px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(100px,1fr) 120px 181px 126px}}
@media(max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:580px){.training-list .training-row{grid-template-columns:65px minmax(0,1fr)}}

/* Give the date breathing room and balance the time in the middle. */
.training-row .training-info{padding-left:14px}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 165px 181px 138px}
.training-row .training-hours{justify-content:center}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(110px,1fr) 160px 181px 126px}}
@media(max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:580px){.training-list .training-row{grid-template-columns:65px minmax(0,1fr)}.training-row .training-info{padding-left:6px}.training-row .training-hours{justify-content:flex-start;padding-left:6px}}

/* Match the detail summary to the list and center payment controls. */
.attendance-training-header .money-card{display:flex;align-items:center;gap:7px;min-width:0;padding:10px}
.attendance-training-header .money-label{margin:0}
.attendance-training-header .money-card strong{font-size:13px}
.attendance-training-header .attendance-chip{min-width:83px;gap:6px;padding:0 9px;white-space:nowrap;font-size:14px}
@media(min-width:651px){
 .roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(140px,1fr) 280px minmax(64px,1fr);gap:8px 16px}
 .roster-heading>span:nth-child(2){display:none}
 .roster-heading>span:nth-child(3){grid-column:2;justify-self:center}
 .roster-heading>span:nth-child(4){grid-column:3;justify-self:end}
 .roster-row .roster-person{grid-column:1;grid-row:1}
 .roster-row .consistency-badge{grid-column:1;grid-row:2;margin-left:51px;justify-self:start}
 .roster-row .payment-cell{grid-column:2;grid-row:1/3;align-items:center;justify-self:center}
 .roster-row .attendance-indicator{grid-column:3;grid-row:1/3;justify-self:end;align-self:center}
}
@media(min-width:651px) and (max-width:800px){.roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(130px,1fr) 264px minmax(44px,1fr);gap:8px 10px}}

/* Per-person notes for this training; payments return to the right-hand columns. */
.attendance-note-cell{display:block;min-width:0;margin:0}
.attendance-note{display:block;width:100%;min-height:39px;max-height:130px;resize:vertical;padding:10px;font:inherit;font-size:11px;line-height:1.5;border:1px solid #dfe5d7;border-radius:7px;background:transparent;color:inherit}
.attendance-note:focus{outline:2px solid #9ebc72;outline-offset:2px}
.note-mobile-label{display:none}
@media(min-width:651px){
 .roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(140px,1fr) 264px 44px minmax(110px,150px);gap:8px 16px}
 .roster-heading>span:nth-child(3){grid-column:2;justify-self:start}
 .roster-heading>span:nth-child(4){grid-column:3;justify-self:center}
 .roster-heading>span:nth-child(5){grid-column:4;justify-self:start}
 .roster-row .payment-cell{grid-column:2;align-items:flex-start;justify-self:start}
 .roster-row .attendance-indicator{grid-column:3;justify-self:center}
 .roster-row .attendance-note-cell{grid-column:4;grid-row:1/3;align-self:center}
}
@media(min-width:651px) and (max-width:900px){
 .roster-heading,.attendance-roster .roster-row{grid-template-columns:minmax(125px,1fr) 240px 44px 110px;gap:8px 10px}
 .payment-option{padding:8px 7px;gap:4px}
}
@media(max-width:650px){
 .roster-heading>span:nth-child(5){display:none}
 .roster-row .attendance-note-cell{grid-column:1/-1;grid-row:4;width:100%;margin-top:6px}
 .note-mobile-label{display:block;font-size:10px;color:#8c967e;margin-bottom:6px}
}

.attendance-lock-icon{display:inline-block;vertical-align:middle;flex-shrink:0}
.attendance-lock-icon.closed{color:#f45450}
.attendance-lock-icon.open{color:#79bf60}
.attendance-lock-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;min-height:42px}
.attendance-lock-toggle:disabled{opacity:.65;cursor:wait}
.row-actions [data-detail]{display:inline-flex;align-items:center;justify-content:center;gap:5px}
.row-actions [data-detail] .attendance-lock-icon{width:14px;height:14px}
.attendance-locked-notice{display:flex;align-items:center;gap:9px;padding:13px 26px;border-top:1px solid #3c3032;border-bottom:1px solid #3c3032;color:#c8babb;background:#241d20;font-size:11px;line-height:1.6}
.payment-option:disabled,.payment-confirm:disabled,.attendance-note:disabled{cursor:default;opacity:.65}
@media(max-width:580px){.page-heading:has(.attendance-lock-toggle){flex-wrap:wrap;gap:15px}.attendance-lock-toggle{font-size:11px}.attendance-locked-notice{padding:12px 18px}}

.row-actions:has(.attendance-lock-icon) .row-action{padding:9px 5px;font-size:9px}
.row-actions:has(.attendance-lock-icon) [data-detail]{flex:1.25}
.row-actions:has(.attendance-lock-icon) [data-edit-training]{flex:.85}

/* Phone-first club tools: compact rows, generous payment targets, notes on demand. */
.roster-note-toggle{background:none;border:0;padding:0;color:inherit;text-align:left;font:inherit;min-width:0;width:100%;cursor:pointer}
.roster-note-toggle:focus-visible{outline:2px solid #9ebc72;outline-offset:4px;border-radius:6px}
.mobile-consistency,.note-toggle-icon{display:none}
@media(max-width:650px){
 .app-content{padding:16px 12px 28px}
 .sidebar{position:sticky;top:0;z-index:30}
 .sidebar nav{padding:5px 10px;gap:6px}
 .nav-item{min-height:42px;padding:9px 12px;font-size:11px}
 .app-topbar{height:38px;padding:0 14px;font-size:10px}
 .mobile-brand{font-size:9px}.mobile-account button{padding:9px 6px;min-height:36px;font-size:10px}
 .page-heading{margin-bottom:14px;gap:10px;align-items:center}
 .page-heading h1{font-size:21px;line-height:1.2}
 .page-heading p{font-size:11px;line-height:1.4;margin-top:5px}
 .detail-title{margin-bottom:12px;font-size:11px}
 .detail-title button{padding:4px 0;min-height:28px}
 .attendance-lock-toggle{min-height:40px;padding:9px 11px;font-size:11px;gap:6px}
 .page-heading:has(.attendance-lock-toggle){flex-wrap:nowrap;gap:8px}
 .page-heading:has(.attendance-lock-toggle) p{font-size:10px}
 .summary-grid{margin-bottom:14px;gap:6px}
 .summary-card{padding:11px 9px}.summary-card .number{font-size:23px;line-height:1.2;margin-top:6px}
 .summary-card .label{font-size:8px;line-height:1.4}
 .panel-header{padding:12px;gap:10px}
 .training-filters{gap:10px}.period-tabs{width:100%;gap:5px}
 .period-tabs button{min-height:42px;flex:1;padding:9px 10px}
 .training-filters .filter-bar{width:100%}
 .training-filters #type-filter{min-height:40px;font-size:12px;padding:8px 32px 8px 10px}
 .training-list{padding:0 12px}
 .training-list .training-row{padding:16px 0;gap:8px;grid-template-columns:58px minmax(0,1fr)}
 .training-row .training-calendar-date{gap:4px}
 .training-row .training-calendar-date strong{font-size:25px}
 .training-row .training-calendar-date span{font-size:9px}
 .training-row .training-info{padding-left:6px}
 .training-row .training-info h3{font-size:13px;margin:5px 0}
 .training-row .training-info p{font-size:11px}
 .training-row .training-info .badge{font-size:8px}
 .training-row .training-hours{grid-column:2;grid-row:2;justify-content:flex-start;padding-left:6px;font-size:13px}
 .training-row .training-overview{grid-column:1/-1;grid-row:3;justify-self:start;justify-content:start;width:auto;grid-template-columns:70px 78px;gap:6px}
 .training-row .training-overview>.attendance-chips{width:70px}
 .training-row .attendance-chip{width:70px;height:38px;font-size:12px;gap:5px}
 .training-row .training-total{width:78px;padding:9px 5px;gap:4px;min-height:38px}
 .training-row .training-total strong{font-size:11px}
 .training-row .row-actions{grid-column:1/-1;grid-row:3;justify-self:end;width:auto;gap:5px}
 .training-row .row-actions .row-action{min-height:40px;flex:none;font-size:10px;padding:9px 8px}
 .training-row .row-actions:has(.attendance-lock-icon) .row-action{font-size:9px;padding:9px 6px}
 .training-details.attendance-training-header{padding:12px;gap:10px}
 .training-details h2{font-size:17px;line-height:1.25;margin:7px 0 9px}
 .training-meta{gap:6px 12px;font-size:10px;line-height:1.5}
 .attendance-training-header .roster-overview,.attendance-training-header .roster-members-summary,#attendance-counts{width:100%}
 .attendance-training-header .training-overview{width:100%;display:flex;flex-wrap:nowrap;gap:7px;justify-content:space-between}
 .attendance-training-header .money-summary{width:auto;flex:1;gap:5px}
 .attendance-training-header .money-card{min-width:0;padding:8px 5px;gap:4px;justify-content:center}
 .attendance-training-header .money-label svg{width:12px;height:12px}
 .attendance-training-header .money-card strong{font-size:11px}
 .attendance-training-header .roster-members-summary .attendance-chip{min-width:64px;height:36px;padding:0 8px;font-size:14px;border-radius:7px;gap:5px}
 .attendance-training-header .attendance-chip svg{width:15px;height:15px}
 .attendance-locked-notice{padding:9px 12px;font-size:10px}
 .attendance-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:12px}
 .attendance-toolbar .search-input{grid-column:1/-1;width:100%;max-width:none;min-height:40px;font-size:16px;padding:8px 11px}
 .attendance-toolbar select{width:100%;min-width:0;min-height:40px;font-size:12px;padding:8px 30px 8px 10px}
 .roster-heading{display:none}
 .attendance-roster{padding:0 12px 6px}
 .attendance-roster .roster-row{display:grid;grid-template-columns:minmax(0,1fr) 32px;gap:7px 10px;padding:10px 0;align-items:center}
 .roster-row .roster-person{grid-column:1;grid-row:1;display:flex;gap:9px;min-height:36px;align-items:center}
 .roster-person .member-avatar{width:32px;height:32px;font-size:10px}
 .roster-person .roster-name{font-size:13px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
 .roster-name .roster-role{margin-top:2px;font-size:10px;line-height:1.35}
 .mobile-consistency{display:inline}
 .roster-row>.consistency-badge{display:none}
 .note-toggle-icon{display:inline-flex;flex-shrink:0;margin-left:auto;opacity:.6}
 .note-visible .note-toggle-icon{opacity:1;color:#d5f76a}
 .roster-row .attendance-indicator{grid-column:2;grid-row:1;align-self:center;width:32px;height:32px;font-size:18px}
 .attendance-indicator svg{width:20px;height:20px}
 .roster-row .payment-cell{grid-column:1/-1;grid-row:2;align-items:stretch;margin:0;gap:6px}
 .payment-mobile-label{display:none}
 .payment-options{display:flex;gap:6px;flex-wrap:nowrap}
 .payment-option{min-height:42px;flex:1;padding:9px 8px;font-size:12px;gap:6px}
 .payment-option svg{width:17px;height:17px}
 .payment-options:has(>.payment-option:only-child) .payment-option{flex:none;min-width:90px}
 .payment-confirm{min-height:34px;align-self:flex-start;font-size:11px;padding:6px 10px}
 .roster-row .attendance-note-cell{display:none;grid-column:1/-1;grid-row:3;margin:0}
 .roster-row.note-visible .attendance-note-cell{display:block}
 .attendance-note-cell .note-mobile-label{display:none}
 .attendance-note{min-height:40px;padding:8px 10px;font-size:16px;line-height:1.4;resize:vertical}
 #member-table td{padding:12px 14px}
 #member-table .table-actions button{min-height:40px}
 .panel-header .filter-bar{flex-wrap:wrap;gap:7px}
 .panel-header .filter-bar .search-input{width:100%;max-width:none;min-height:40px;font-size:16px}
 .panel-header .filter-bar select{max-width:none;flex:1;font-size:12px;min-height:40px}
 .modal-header{padding:16px}.modal-body{padding:16px}
 .modal-body input:not([type=checkbox]),.modal-body select,.modal-body textarea{font-size:16px;min-height:44px}
 .modal-body label{margin-bottom:13px}.modal-footer{gap:8px;flex-wrap:wrap;margin-top:18px}
 .modal-footer button{min-height:44px}.form-row{gap:10px}
}
@media(max-width:350px){
 .training-row .row-actions{grid-row:4}.training-row .training-overview{grid-row:3;width:100%;justify-content:start}
 .page-heading:has(.attendance-lock-toggle){flex-wrap:wrap}
 .attendance-training-header .training-overview{gap:5px}.attendance-training-header .money-card{gap:3px;padding:8px 4px}
 .attendance-training-header .money-card strong{font-size:10px}
}

@media(max-width:650px){
 .training-list .training-row{grid-template-columns:58px minmax(0,1fr) 58px;gap:12px 8px}
 .training-row .training-calendar-date{grid-column:1;grid-row:1}
 .training-row .training-info{grid-column:2;grid-row:1}
 .training-row .training-hours{grid-column:3;grid-row:1;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;padding:0;gap:4px;font-size:14px}
 .training-hours-end{font-size:12px;font-weight:500;color:#a1aaa8}
 .training-row .training-overview{grid-row:2;grid-column:1/-1}
 .training-row .row-actions{grid-row:2;grid-column:1/-1}
}
@media(max-width:350px){
 .training-list .training-row{grid-template-columns:50px minmax(0,1fr) 53px;gap:10px 6px}
 .training-row .row-actions{grid-row:3}
 .training-row .training-overview{grid-row:2}
 .training-row .training-calendar-date strong{font-size:22px}
}

@media(max-width:650px){
 #member-table .table-wrap{overflow:visible}
 #member-table table,#member-table tbody{display:block;min-width:0;width:100%}
 #member-table thead{display:none}
 #member-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:14px 12px;border-bottom:1px solid #30373c}
 #member-table td{display:block;padding:0;border:0;font-size:12px;min-width:0;overflow-wrap:anywhere}
 #member-table td:first-child{grid-column:1;grid-row:1;display:flex;align-items:center;gap:9px;font-weight:600}
 #member-table td:first-child .member-avatar{width:32px;height:32px;font-size:10px;margin:0;flex-shrink:0}
 #member-table td:nth-child(2){grid-column:1/-1;grid-row:2;color:#a1aaa8;font-size:12px;line-height:1.7}
 #member-table td:nth-child(3){grid-column:1;grid-row:3}
 #member-table td:nth-child(3) small{font-size:10px}
 #member-table td:nth-child(4){grid-column:2;grid-row:3;align-self:start;text-align:right}
 #member-table td:last-child{grid-column:2;grid-row:1;align-self:center}
 #member-table .table-actions button{padding:8px 10px;font-size:11px}
}

/* Clearer member identity, quieter payment and note controls. */
.roster-person .roster-name{font-weight:700;font-size:14px}
.roster-person .roster-role,.roster-person .mobile-consistency{font-weight:400}
.attendance-note{font-weight:400;font-size:12px}
@media(max-width:650px){
 .roster-person .member-avatar{width:42px;height:42px;font-size:13px}
 .roster-row .roster-person{min-height:44px;gap:10px}
 .roster-person .roster-name{font-size:15px;font-weight:700;line-height:1.35}
 .roster-name .roster-role{font-size:10px;font-weight:400;margin-top:3px}
 .payment-option{min-height:36px;padding:7px 8px;font-size:11px;border-radius:7px}
 .payment-option svg{width:15px;height:15px}
 .payment-options{gap:5px}
 .payment-options:has(>.payment-option:only-child) .payment-option{min-width:86px}
 .payment-confirm{min-height:30px;padding:5px 9px;font-size:10px}
 .attendance-note{font-size:12px;font-weight:400;line-height:1.5;min-height:36px;padding:8px 10px}
}

.payment-none-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;font-size:19px;font-weight:400;line-height:1;flex-shrink:0}
@media(max-width:650px){.payment-none-icon{width:15px;height:15px;font-size:18px}}

@media(max-width:650px){
 .roster-person .note-toggle-icon{width:40px;min-width:40px;height:40px;margin-left:auto;padding:0;align-items:center;justify-content:center;border-radius:7px;cursor:pointer}
 .roster-person .note-toggle-icon:hover{background:#ffffff08}
 .roster-person .roster-name{flex:1}
}

@media(max-width:650px){
 .training-list .training-row{grid-template-columns:58px minmax(0,1fr) 102px}
 .training-row .training-hours{flex-direction:row;align-items:center;justify-content:flex-end;gap:3px;font-size:13px;white-space:nowrap}
 .training-row .training-hours-end{font-size:13px;font-weight:600;color:inherit}
}
@media(max-width:350px){
 .training-list .training-row{grid-template-columns:50px minmax(0,1fr) 94px}
 .training-row .training-hours,.training-row .training-hours-end{font-size:12px}
}

/* More space after the date; group the lower row beside its actions. */
@media(max-width:650px){
 .training-list .training-row{grid-template-columns:68px minmax(0,1fr) 102px}
 .training-row .training-info{padding-left:9px}
 .training-row .training-overview{justify-self:end;margin-right:132px}
 .training-row:has(.row-actions .attendance-lock-icon) .training-overview{margin-right:142px}
}
@media(max-width:350px){
 .training-list .training-row{grid-template-columns:60px minmax(0,1fr) 94px}
 .training-row .training-info{padding-left:6px}
 .training-row .training-overview,.training-row:has(.row-actions .attendance-lock-icon) .training-overview{width:auto;margin-right:0;justify-self:end}
}

.member-details-fields,.guardian-fields{border:1px solid #30373c;border-radius:9px;padding:16px;margin:0 0 20px;min-width:0}
.member-details-fields legend,.guardian-fields legend{padding:0 7px;color:#c7cfca;font-size:13px;font-weight:650}
.member-details-fields textarea{width:100%;margin-top:8px;font:inherit;font-size:13px;line-height:1.5;resize:vertical}
.guardian-fields{margin:0 0 16px;background:#ffffff03}
.application-check{padding:12px;border:1px solid #506b3e;background:#293322;border-radius:8px;color:#c3dfa4!important;font-weight:600}
.application-check:has(input:not(:checked)){background:#3b2225;border-color:#97504d;color:#ff9b91!important}
.application-check input{flex-shrink:0}
.application-missing{display:block;color:#ff9388!important;font-size:10px;font-weight:500;margin-top:5px;line-height:1.5}
@media(max-width:650px){.member-details-fields,.guardian-fields{padding:12px;margin-bottom:16px}.member-details-fields .form-row{grid-template-columns:1fr;gap:0}.application-check{font-size:12px;line-height:1.5}#member-table td:first-child{flex-wrap:wrap}#member-table .application-missing{width:100%;margin:0 0 0 41px;font-size:10px}}

.training-row .training-calendar-date span{order:-1;font-size:11px;letter-spacing:.7px}
.member-training-weekday{display:block;font-size:12px;font-weight:600;margin-bottom:5px;text-transform:capitalize}
@media(max-width:650px){.training-row .training-calendar-date span{font-size:10px;letter-spacing:.5px}}

/* Attendance count opens the roster; edit actions use one accessible icon. */
.attendance-chip[data-detail]{border:0;cursor:pointer;font:inherit;font-weight:700}
.attendance-chip[data-detail]:hover{filter:brightness(1.1)}
.attendance-chip[data-detail]:focus-visible,.icon-edit-button:focus-visible{outline:2px solid #d5f76a;outline-offset:3px}
.attendance-chip[data-detail] .attendance-lock-icon{width:16px;height:16px}
.icon-edit-button{display:inline-flex;align-items:center;justify-content:center;width:40px;min-width:40px;height:40px;min-height:40px;padding:8px!important;border-radius:8px}
.training-row .row-actions .icon-edit-button{flex:none}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 140px 181px 40px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(110px,1fr) 130px 181px 40px}}
@media(min-width:651px) and (max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:650px){
 .training-list .training-row{grid-template-columns:68px minmax(0,1fr) 102px}
 .training-row .training-overview,.training-row:has(.row-actions .attendance-lock-icon) .training-overview{margin-right:46px;justify-self:end}
 .training-row .row-actions{width:40px}
 .training-row .attendance-chip[data-detail]{min-height:40px}
 #member-table .table-actions .icon-edit-button{width:40px;min-height:40px}
}
@media(max-width:350px){
 .training-list .training-row{grid-template-columns:60px minmax(0,1fr) 94px}
 .training-row .training-overview{grid-row:2;width:auto;margin-right:46px}
 .training-row .row-actions{grid-row:2}
}

a.mobile-brand{text-decoration:none;min-height:38px;align-items:center}
a.mobile-brand:focus-visible{outline:2px solid #d5f76a;outline-offset:3px;border-radius:4px}

/* Phone experiment: put the full time range below the date. */
@media(max-width:650px){
 .training-list .training-row{grid-template-columns:88px minmax(0,1fr);gap:7px 12px}
 .training-row .training-calendar-date{grid-column:1;grid-row:1;align-self:end}
 .training-row .training-info{grid-column:2;grid-row:1/3;align-self:center;padding-left:6px}
 .training-row .training-hours{grid-column:1;grid-row:2;justify-content:flex-start;align-self:start;gap:2px;padding:0;font-size:10px;line-height:1.4;white-space:nowrap}
 .training-row .training-hours-end{font-size:10px;font-weight:500;color:inherit}
 .training-row .training-overview{grid-column:1/-1;grid-row:3}
 .training-row .row-actions{grid-column:1/-1;grid-row:3}
}
@media(max-width:350px){.training-list .training-row{grid-template-columns:80px minmax(0,1fr);gap:7px 10px}}

/* Closed attendance keeps its count badge inside a neutral lock frame. */
.attendance-closed-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:3px 6px 3px 3px;background:#282e33;border:1px solid #434c53;border-radius:10px;cursor:pointer;color:#fff;font:inherit;box-sizing:border-box}
.attendance-closed-button .attendance-chip{flex-shrink:0}
.attendance-closed-button .attendance-lock-icon{width:17px;height:17px}
.attendance-closed-button .attendance-lock-icon{order:-1}
.attendance-closed-button{padding:3px 3px 3px 6px}
.attendance-closed-button:hover{border-color:#69737b;background:#30373d}
.attendance-closed-button:focus-visible{outline:2px solid #d5f76a;outline-offset:3px}
.training-row .training-overview{grid-template-columns:117px 88px}
.training-row .training-overview>.attendance-chips{justify-content:flex-end}
.training-list .training-row{grid-template-columns:78px minmax(110px,1fr) 140px 215px 40px}
@media(min-width:1081px) and (max-width:1250px){.training-list .training-row{grid-template-columns:65px minmax(110px,1fr) 130px 215px 40px}}
@media(min-width:651px) and (max-width:1080px){.training-list .training-row{grid-template-columns:72px minmax(0,1fr) auto}}
@media(max-width:650px){
 .training-list .training-row{grid-template-columns:88px minmax(0,1fr)}
 .training-row .training-overview{grid-template-columns:104px 78px}
 .training-row .training-overview>.attendance-chips{width:104px}
 .training-row .attendance-closed-button{gap:0;padding:0;height:40px}
}
@media(max-width:350px){.training-list .training-row{grid-template-columns:80px minmax(0,1fr)}}

/* Join the lock segment directly to the count without adding an outer rim. */
.training-row .attendance-closed-button{padding:0;gap:0;height:35px;border:0;border-radius:7px;overflow:hidden}
.training-row .attendance-closed-button .attendance-lock-icon{box-sizing:content-box;align-self:stretch;height:auto;width:17px;padding:0 8px;background:#343b40}
.training-row .attendance-closed-button .attendance-chip{height:100%;border-radius:0 7px 7px 0}
@media(max-width:650px){
 .training-row .attendance-closed-button{height:40px}
 .training-row .attendance-closed-button .attendance-lock-icon{padding:0 7px}
}

/* Match all financial and attendance summary badges in the detail header. */
.roster-group-heading{display:flex;align-items:center;gap:8px;padding:16px 0 10px;color:#aab4b3}
.roster-group-heading h3{margin:0;font-size:12px;font-weight:650;line-height:1.4}
.roster-group-heading>span{display:inline-flex;align-items:center;justify-content:center;min-width:23px;height:23px;padding:0 6px;border-radius:6px;background:#30373c;font-size:11px;font-weight:650;font-variant-numeric:tabular-nums}
.roster-group-heading.attending{color:#a6d491}
.roster-group-heading.attending>span{background:#2b3e27;color:#b5e29e}
.roster-row+.roster-group-heading.not-attending{border-top:2px solid #465158;margin-top:12px;padding-top:18px}
@media(max-width:650px){.roster-group-heading{padding:12px 0 6px}.roster-group-heading h3{font-size:11px}.roster-row+.roster-group-heading.not-attending{margin-top:8px;padding-top:14px}}

.attendance-training-header .money-card,
.attendance-training-header .roster-members-summary .attendance-chip{box-sizing:border-box;height:48px;min-height:48px;padding-top:0;padding-bottom:0;align-items:center}
@media(max-width:650px){
 .attendance-training-header .money-card,
 .attendance-training-header .roster-members-summary .attendance-chip{height:40px;min-height:40px}
}

/* Clear controls work consistently across search fields and browsers. */
.search-field{position:relative;min-width:0}
.search-field .search-input{box-sizing:border-box;width:100%;max-width:none;padding-right:40px!important}
.search-field input[type=search]::-webkit-search-cancel-button{appearance:none;-webkit-appearance:none}
.search-clear{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#aebbb6;cursor:pointer}
.search-clear[hidden]{display:none}
.search-clear:hover{background:#ffffff0c;color:#fff}
.search-clear:focus-visible{outline:2px solid #d5f76a;outline-offset:-2px}
.attendance-toolbar .search-field{flex:1;min-width:140px;max-width:330px}
.panel-header .filter-bar .search-field{flex:1;min-width:140px;max-width:260px}

/* A restrained section band makes the split easier to scan. */
.roster-group-heading{padding:13px 12px;margin:8px 0 0;border-radius:7px;background:#ffffff06;color:#c6cfcc}
.roster-group-heading h3{font-size:13px;font-weight:700;letter-spacing:.15px}
.roster-group-heading.attending{background:#72ac5010;color:#b4dc9f}
.roster-row+.roster-group-heading.not-attending{border-top:3px solid #58656b;margin-top:23px;padding-top:14px;box-shadow:0 -8px 0 #1b2125}
.roster-footer{padding:20px 23px 24px;border-top:1px solid #354047;margin-top:10px}
.quick-add-member{min-height:44px;padding:11px 16px;font-size:13px}
.roster-new-member{background:#d5f76a0a;box-shadow:inset 0 3px #a6cd54}
@media(max-width:650px){
 .attendance-toolbar .search-field{grid-column:1/-1;width:100%;max-width:none;min-width:0}
 .panel-header .filter-bar .search-field{flex-basis:100%;max-width:none}
 .roster-group-heading{padding:10px;margin-top:6px}
 .roster-group-heading h3{font-size:12px}
 .roster-row+.roster-group-heading.not-attending{margin-top:20px;padding-top:12px}
 .roster-footer{padding:16px 12px 18px}
 .quick-add-member{width:100%;font-size:12px}
}