:root{--bg:#f4f6f8;--ink:#1f2937;--muted:#627084;--blue:#2563eb;--line:#dce2e9;--nav:#101827;--red:#b42318;--green:#146c43}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button,.button{cursor:pointer;border:0;border-radius:10px;background:var(--blue);color:#fff;padding:11px 16px;font-weight:650;text-decoration:none;display:inline-block}
button:disabled{opacity:.55;cursor:wait}
button.secondary,.button.secondary{background:#eaf0f8;color:#253e63}
button.danger{color:var(--red);background:#fff0ed}
a{color:#174fb1}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #7c9ffb;outline-offset:3px}
input:not([type="checkbox"]):not([type="radio"]),textarea,select{width:100%;margin-top:6px;border:1px solid #bfc9d6;border-radius:9px;padding:11px 12px;background:#fff;color:var(--ink)}
textarea{resize:vertical;min-height:110px}
input[type=checkbox],input[type=radio]{flex:0 0 20px;width:20px;height:20px;margin:0;accent-color:var(--blue)}
label{display:block;font-size:.94rem;font-weight:650}
label.check{display:flex;align-items:center;gap:12px;font-weight:500;padding:12px 0}
.embed-options{border:0;padding:0;margin:0 0 20px}
.embed-options legend{font-size:.94rem;font-weight:650;margin-bottom:7px}
.embed-options .radio{display:flex;align-items:flex-start;gap:11px;padding:7px 0;font-weight:500}
.embed-options .radio span{line-height:1.35}
.field{margin-bottom:17px}
h1{font-size:2rem;letter-spacing:-.035em;margin:0}
h2{font-size:1.3rem;margin:0 0 18px}
h3{font-size:1rem;margin:0 0 10px}
p{margin:0 0 14px}
small,.muted{color:var(--muted);font-size:.9rem}
.help{font-size:.9rem;color:var(--muted);margin:7px 0 0}
.app-bar{position:sticky;top:0;z-index:10;display:flex;gap:16px;align-items:center;justify-content:space-between;min-height:82px;padding:14px 28px;border-bottom:1px solid var(--line);background:#fff}
.app-bar>div{flex:1}
.app-bar strong{display:block;font-size:1.05rem}
.app-bar span:not(.badge){font-size:.85rem;color:var(--muted)}
.icon{min-width:44px;min-height:44px;padding:5px;font-size:1.5rem}
#drawer{position:fixed;inset:0 auto 0 0;z-index:40;width:288px;max-width:88vw;background:var(--nav);color:#fff;padding:26px 18px;display:flex;flex-direction:column;transform:translateX(-105%);transition:transform .22s ease}
.drawer-heading{display:flex;align-items:start;justify-content:space-between;padding:0 8px 24px}
.drawer-heading strong{font-size:1.35rem;letter-spacing:-.03em}
.drawer-heading>div span{display:block;font-size:.87rem;color:#a9b4c6;margin-top:4px}
#drawer button{background:#202b3d;color:#fff}
nav{display:grid;gap:7px}
nav a{display:flex;align-items:center;gap:16px;padding:8px 12px;border-radius:15px;color:#dbe3ef;text-decoration:none;font-weight:500}
nav a:hover{background:#1d293b}
nav a.active{background:var(--blue);color:#fff}
.pin{font-size:.87rem;margin-bottom:18px;align-self:flex-end}
.logout{margin-top:26px}
.logout button{width:100%;text-align:left}
.drawer-footer{margin-top:auto;padding:25px 12px 0;font-size:.85rem;color:#a9b4c6}
.menu-open #drawer{transform:none}
#backdrop{position:fixed;inset:0;z-index:30;background:#0f172a80}
main{max-width:1450px;padding:30px;margin:auto}
.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}
.heading p{margin:5px 0 0}
.card{padding:24px;background:#fff;border:1px solid #e0e6ed;border-radius:14px;margin-bottom:22px;box-shadow:0 4px 14px #15213a05}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:22px}
.metric{border:1px solid var(--line);border-radius:12px;background:white;padding:17px}
.metric strong{display:block;font-size:1.9rem;letter-spacing:-.04em}
.metric span{font-size:.87rem;color:var(--muted)}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:14px;align-items:end;margin-bottom:18px}
.filters button{margin-bottom:0}
.table-wrap{overflow:auto}
table{border-collapse:collapse;width:100%;text-align:left;font-size:.94rem}
th{font-size:.85rem;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:12px 14px}
td{border-bottom:1px solid #edf0f4;padding:17px 14px;vertical-align:top}
td:first-child,th:first-child{padding-left:0}
td:last-child,th:last-child{padding-right:0}
.text-link{background:none;color:#174fb1;padding:0;border-radius:2px;text-align:left;font-weight:650}
.sub{display:block;font-size:.85rem;color:var(--muted);margin-top:3px}
.badge{display:inline-block;white-space:nowrap;background:#edf2f8;color:#37506e;font-size:.8rem;border-radius:6px;padding:4px 9px;font-weight:650}
.badge.new{background:#eaf1ff;color:#1c50ad}
.badge.good{background:#e8f5ee;color:var(--green)}
.badge.warn{background:#fff0d9;color:#825510}
.badge.bad{background:#fff0ed;color:var(--red)}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.spread{justify-content:space-between}
.pagination{margin-top:20px}
.empty{padding:45px 10px;text-align:center}
.empty h2{margin-bottom:8px}
.notice,#global-message{border-left:4px solid #2563eb;padding:15px 18px;background:#eaf2ff;border-radius:7px;margin-bottom:22px}
.notice.warning{background:#fff5e3;border-color:#b67a10}
#global-message.error{background:#fff0ed;border-color:var(--red)}
#global-message.success{background:#e8f5ee;border-color:var(--green)}
.details{display:grid;grid-template-columns:150px 1fr;gap:11px 20px;margin:0}
.details dt{font-size:.9rem;color:var(--muted)}
.details dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.wide{grid-column:1/-1}
.timeline{padding-left:22px}
.timeline li{padding:0 0 14px}
.code{font:14px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;min-height:170px;white-space:pre-wrap;overflow-wrap:anywhere}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.88rem}
.template-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px}
.template-item{display:block;width:100%;padding:15px;margin-bottom:10px;text-align:left;color:var(--ink);background:#fff;border:1px solid var(--line)}
.template-item.selected{border-color:var(--blue);background:#eef4ff}
.template-item .badge{margin-top:8px}
.rule-row{display:grid;grid-template-columns:1.2fr 1.6fr auto;gap:14px;align-items:end;padding:18px 0;border-bottom:1px solid var(--line)}
.rule-row button{margin-bottom:1px}
.class-admin{display:grid;grid-template-columns:330px minmax(0,1fr);gap:22px;align-items:start}
.admin-list-item,.booking-link{display:block;width:100%;text-align:left;background:#fff;color:var(--ink);border:1px solid var(--line);margin:0 0 9px;padding:12px}
.admin-list-item.selected{border-color:var(--blue);background:#eef4ff}
.admin-list-item span,.booking-link span{display:block;color:var(--muted);font-size:.84rem;margin-top:3px}
.schedule-rule{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;border:1px solid var(--line);border-radius:10px;padding:15px;margin:12px 0}
.rule-order{display:flex;flex-direction:column;gap:7px}.rule-order button{padding:6px 9px}
.rule-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0}
.booking-toolbar{display:flex;justify-content:space-between;align-items:end;gap:20px}.booking-toolbar label{min-width:280px}
.booking-calendar{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:22px}
.calendar-week,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-week strong{padding:10px;text-align:center;background:#edf2f7;color:var(--muted);font-size:.82rem}
.calendar-day{min-height:125px;border-top:1px solid var(--line);border-right:1px solid var(--line);padding:8px;overflow:hidden}.calendar-day:nth-child(7n){border-right:0}.calendar-day.blank{background:#f7f8fa}
.calendar-event{display:flex;justify-content:space-between;gap:5px;width:100%;padding:7px;margin-top:6px;border-radius:6px;background:#e9f2ff;color:#1c467d;font-size:.76rem;text-align:left}.calendar-event.closed{background:#f0f1f3;color:#667085}.calendar-event b{white-space:nowrap}
.booking-list{display:none}
dialog{width:min(820px,94vw);max-height:92vh;overflow:auto;border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:0 30px 100px #0004}
dialog::backdrop{background:#0f172a80}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.dialog-heading h2{margin:0}
#email-preview{width:100%;height:370px;border:1px solid var(--line);border-radius:8px;background:#fff}
summary{cursor:pointer;margin:15px 0}
.form-preview{width:100%;height:1100px;border:0;background:white}
code{background:#edf1f6;padding:2px 5px;border-radius:4px;font-size:.88rem}
.skip{position:fixed;left:10px;top:-100px;z-index:100;background:white;padding:10px}
.skip:focus{top:10px}
[hidden]{display:none!important}

@media(min-width:1080px){body.pinned #drawer{transform:none}
body.pinned main,body.pinned .app-bar{margin-left:288px}
body.pinned #open-menu,body.pinned #close-menu{display:none}
body.pinned main{max-width:none}
}
@media(max-width:1079px){.pin{display:none}
.menu-open{overflow:hidden}
.app-bar{padding:12px 18px}
main{padding:22px}
.template-layout{grid-template-columns:220px minmax(0,1fr)}
}
@media(max-width:740px){main{padding:20px 14px}
.heading{align-items:start}
h1{font-size:1.7rem}
.grid,.template-layout{grid-template-columns:1fr}
.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.metric{padding:13px}
.filters{grid-template-columns:1fr 1fr}
.filters .search-field{grid-column:1/-1}
.card{padding:18px}
.rule-row{grid-template-columns:1fr}
.details{grid-template-columns:1fr;gap:3px}
.details dd{margin-bottom:12px}
.app-bar span:not(.badge){font-size:.78rem}
.badge{font-size:.78rem}
td,th{padding:12px 9px}
.desktop-only{display:none}
.heading button{white-space:nowrap;font-size:.88rem}
.row button{flex-shrink:0}
.class-admin{grid-template-columns:1fr}.rule-fields{grid-template-columns:1fr}.booking-toolbar{display:grid}.booking-toolbar label{min-width:0}.booking-calendar{display:none}.booking-list{display:block}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}
}
.student-summary{border-top:1px solid var(--line);padding:14px 0}
.student-summary:first-of-type{border-top:0;padding-top:0}
.student-summary h3{margin:0 0 10px}
.student-summary p{overflow-wrap:anywhere}
input[readonly],select:disabled{background:#e9edf2;color:#657080;cursor:not-allowed;opacity:1}
.editor-dialog{width:min(850px,94vw);max-height:90vh;padding:26px;border:0;border-radius:14px;overflow-y:auto}.editor-dialog::backdrop{background:#10182799}
.automation-starters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.starter{display:flex;flex-direction:column;gap:14px;text-align:left;background:#fff;color:#172333;border:1px solid #d5dde7;padding:24px}.starter:hover{background:#f4f7fb}.starter strong{font-size:18px}.starter span{font-weight:400;line-height:1.5}.automation-tabs{margin:8px 0 24px}.journey{border-top:1px solid #e2e8f0;padding:16px 0}.journey summary{cursor:pointer;line-height:1.8}.flow-steps{max-width:850px}.flow-step{background:white;border:1px solid #d7e0eb;border-left:4px solid #e62b43;border-radius:12px;padding:24px;margin-bottom:24px;position:relative}.flow-step:not(:last-child):after{content:'↓';position:absolute;bottom:-25px;left:26px;color:#7b8698;font-size:20px}.flow-fields,.flow-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px}.flow-fields>label,.flow-links>label{flex:1;min-width:170px}.flow-actions{margin-top:24px}.flow-actions button{margin:0 8px 8px 0}.preview-step{padding:14px 0;border-bottom:1px solid #e2e8f0}.register-actor{display:block;max-width:320px;margin-bottom:24px}#student-register{scroll-margin-top:85px}#student-register select{min-width:150px}
@media(max-width:760px){.automation-starters{grid-template-columns:1fr}.editor-dialog{padding:18px}.flow-step{padding:18px}.flow-fields,.flow-links{display:block}.flow-fields label,.flow-links label{display:block;margin-bottom:12px}}

#delete-class{background:var(--red);color:white}
/* Full class register: large touch targets, saved attendance and belt progress. */
.attendance-toolbar{display:flex;align-items:end;gap:18px;flex-wrap:wrap}.attendance-toolbar label{flex:1;min-width:150px}.attendance-toolbar label:first-child{flex:2}.register-save{background:#65a30d;color:#fff;font-size:1.3rem;padding:12px 26px}.attendance-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(420px,1.2fr);gap:24px;align-items:start}.register-calendar-head,.register-calendar-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.register-calendar-head{background:#f3f5f8;border:1px solid #d9dee7}.register-calendar-head span{padding:10px 0;text-align:center;font-size:.8rem;font-weight:700}.register-calendar-days{border-left:1px solid #d9dee7;border-top:1px solid #d9dee7}.register-calendar-days>button,.register-calendar-blank{min-height:78px;border:0;border-right:1px solid #d9dee7;border-bottom:1px solid #d9dee7;border-radius:0;background:#fff;color:#334155;display:flex;flex-direction:column;align-items:start;gap:10px;padding:8px}.register-calendar-days>button:disabled{opacity:.45;cursor:default}.register-calendar-days>button.selected{background:#def2f4;outline:2px solid #ef4454;outline-offset:-2px}.register-calendar-days small{font-size:.72rem;background:#65a30d;color:#fff;border-radius:4px;padding:2px 4px;align-self:start;white-space:nowrap}.register-heading{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.register-heading>div{flex:1}.register-heading h2{margin-bottom:4px}.present-total{border-radius:30px;background:#e9f2df;color:#34445b;font-size:1.5rem;padding:8px 17px}.student{display:flex;gap:16px;align-items:center;padding:6px 0;min-height:50px}.student[hidden]{display:none}.attendance-btn{flex:0 0 40px;width:40px;height:40px;padding:0;border:1px solid #65a30d;background:#fff;color:#65a30d;border-radius:7px;font-size:1.6rem}.attendance-btn.btn-success{background:#65a30d;color:#fff}.student-name-div{display:flex;align-items:center;flex:1;gap:12px;flex-wrap:wrap;min-width:0}.student-name-div>.text-link{font-size:1.05rem;color:#34445b;text-align:left;overflow-wrap:anywhere}.student-name-div small{flex-basis:100%;color:#7b8490;font-size:.72rem;line-height:1;margin-top:-6px}.student-name-div small:empty{display:none}.grading-remaining{margin-left:auto;min-width:28px;text-align:center;color:#858585;font-size:1.2rem}.grading-ready{display:block;width:28px;height:28px;border-radius:50%;background:#66d68f}.grade-unknown{color:#8b94a0}.first-class-badge{background:#e8f0ff;color:#234b93}.register-footer{margin-top:26px;border-top:1px solid #e4e8ef;padding-top:18px}.profile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.profile-stats>div{padding:12px;background:#f2f5f9;border-radius:8px}.profile-stats span{display:block;font-size:.78rem;color:#657080}.profile-stats strong{display:block;margin-top:4px}.assignment-list{max-height:230px;overflow-y:auto;margin:16px 0;padding:12px;background:#f6f8fa;border-radius:8px}.profile-health-row{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center;margin-bottom:12px}.editor-dialog input[type=file]{margin:18px 0}
.belt{display:inline-flex;align-items:center;justify-content:center;flex:0 0 35px;width:35px;height:23px;border:1px solid #cbd0d5;font:10pt/1 Arial,sans-serif;color:grey;background:#fff;box-sizing:border-box;vertical-align:middle}
.belt[data-grade="WHITE"]{background:white}.belt[data-grade="9KYU"]{background:linear-gradient(yellow,yellow) 70% /20% 100% no-repeat,white}.belt[data-grade="8KYU"]{background:yellow}.belt[data-grade="7KYU-HO"]{background:linear-gradient(orange,orange) 70% /20% 100% no-repeat,yellow}.belt[data-grade="7KYU"]{background:orange}.belt[data-grade="6KYU"]{background:#1faa1f}.belt[data-grade="5KYU"]{background:blue}.belt[data-grade="4KYU"]{background:red}.belt[data-grade="3KYU"]{background:#bf572e}.belt[data-grade="2KYU"]{background:linear-gradient(black,black) 70% /20% 100% no-repeat,rgb(191,95,0)}.belt[data-grade="1KYU"]{background:linear-gradient(black,black) 30% /20% 100% no-repeat,linear-gradient(black,black) 70% /20% 100% no-repeat,rgb(191,95,0)}.belt[data-grade="SENSEI"]{background:linear-gradient(white,white) 70% /100% 30% no-repeat,black}.belt[data-grade="PROV"],.belt[data-grade="SHODAN-HO"],.belt[data-grade="1DAN"],.belt[data-grade="SHODAN"],.belt[data-grade="2DAN"],.belt[data-grade="NIDAN"],.belt[data-grade="3DAN"],.belt[data-grade="SANDAN"],.belt[data-grade="4DAN"],.belt[data-grade="YONDAN"]{background:black}
@media(max-width:1100px){.attendance-layout{grid-template-columns:1fr}.attendance-layout>aside{max-width:600px;width:100%;box-sizing:border-box}}@media(max-width:600px){.attendance-toolbar{gap:10px}.profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-health-row{grid-template-columns:1fr}.student{gap:10px}.student-name-div{gap:8px}.student-name-div>.text-link{font-size:1rem}.register-calendar-days>button,.register-calendar-blank{min-height:64px;padding:5px}.register-heading{gap:8px}.present-total{font-size:1.2rem}.grading-remaining{font-size:1rem}}
/* Fifth dan is included in the WellnessLiving report mapping. */
.belt[data-grade="5DAN"],.belt[data-grade="GODAN"]{background:#000;text-align:center}
#belts-preview .notice{max-height:260px;overflow:auto}
#register-add-results{margin:16px 0}
#register-add-results input[type="checkbox"]{width:22px;height:22px}
#register-save-state{margin-left:auto}

.component-variant{padding:16px;margin:16px 0;border:1px solid #dce3ec;border-radius:12px}.composed-row{display:flex;gap:8px;margin:10px 0}.composed-row select{flex:1;min-width:0}#component-trace,#composed-trace{white-space:pre-wrap;font-size:13px}.editor-dialog fieldset{margin:16px 0}
.reply-copy{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.6}.review-actions{flex-wrap:wrap;margin:1rem 0}#enquiry-journey-panel .journey{border-top:1px solid #dbe2eb;padding:1rem 0}#enquiry-journey-panel details{margin:.75rem 0}#register-dialog form>label:not(.check){display:block;margin:1rem 0}#register-dialog form>label>input:not([type="checkbox"]):not([type="radio"]),#register-dialog form>label>textarea,#register-dialog form>label>select{width:100%}
/* Keep navigation reachable on short screens and when zoomed. */
#drawer{overflow-y:auto;overscroll-behavior:contain}#drawer>*{flex-shrink:0}
input[readonly]{background:#edf1f5;color:#64748b;cursor:default}
.funnel-notes{white-space:pre-wrap;overflow-wrap:anywhere;max-width:360px}

/* Account access and sign-in */
[hidden]{display:none!important}.login-page{display:grid;place-items:center;min-height:100vh;padding:24px}.login-card{width:min(100%,440px);margin:0}.login-card label:not(.check),#staff-reauth label:not(.check){display:block;margin:16px 0}.login-card input:not([type="checkbox"]):not([type="radio"]),#staff-reauth input:not([type="checkbox"]):not([type="radio"]){width:100%}.login-card button{margin:10px 0}.login-card h1{margin-top:0}input[readonly]{background:#eef1f5;color:#64748b}#staff-user-form [data-start],#staff-user-form [data-end]{min-width:145px}.attendance-btn:disabled{cursor:default;opacity:.65}#staff-role-editor .check{margin:14px 0}#staff-permission-summary{margin:20px 0}#staff-reauth{max-width:480px}#drawer{max-height:100dvh;overflow-y:auto}#navigation{flex-shrink:0}.staff-audit pre{white-space:pre-wrap}

.payment-due-badge{display:inline-flex;background:#b91c1c!important;color:#fff!important;border:0;border-radius:50%;width:26px;height:26px;padding:2px;align-items:center;justify-content:center;margin-left:8px}.payment-due-badge:disabled{opacity:1;cursor:default}

.email-editor-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.email-editor-error{color:#b91c1c;white-space:pre-wrap}

.register-menu{position:relative}.register-menu summary{list-style:none;cursor:pointer;border:1px solid #cbd5e1;border-radius:6px;padding:4px 14px;font-size:24px;background:#ececec;color:#334155}.register-menu summary::-webkit-details-marker{display:none}.register-menu summary:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.register-menu-options{position:absolute;right:0;top:100%;z-index:10;min-width:130px;display:grid;gap:6px;padding:8px;background:white;border:1px solid #cbd5e1;border-radius:8px;box-shadow:0 4px 12px #0002}

.attendance-date-control{display:flex;flex-direction:column;gap:8px}.attendance-date-control>span{font-weight:600}#attendance_date[aria-expanded="false"]{background:#7890b0;color:#fff;border-color:#7890b0}#attendance_date[aria-expanded="true"]{background:#eaf0f8;color:#334155;border-color:#eaf0f8}.attendance-layout.calendar-collapsed{grid-template-columns:1fr}.register-footer>#register-save-state{display:block;margin-bottom:12px}.attendance-notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;gap:20px;max-width:min(600px,calc(100vw - 32px));width:max-content;box-sizing:border-box;padding:14px 18px;border:1px solid #b5d8c2;border-radius:10px;background:#eaf7ef;color:#16462c;box-shadow:0 5px 24px #0002;animation:attendance-notice-in .25s ease-out}.attendance-notice.is-error{background:#fff0ed;color:#8b2020;border-color:#e6b4ad}.attendance-notice>span{overflow-wrap:anywhere}.attendance-notice>button{flex-shrink:0}@keyframes attendance-notice-in{from{opacity:0;transform:translate(-50%,24px)}to{opacity:1;transform:translate(-50%,0)}}@media(prefers-reduced-motion:reduce){.attendance-notice{animation:none}}

.present-total{font-size:1.2rem}#session-notes.has-notes{background:#7890b0;color:#fff;border-color:#7890b0}

[data-template-table] th,[data-component-table] th,[data-template-table] th .text-link,[data-component-table] th .text-link{color:#000}

.email-engagement{margin:12px 0}.email-engagement details{margin:8px 0}.email-engagement td{overflow-wrap:anywhere;max-width:260px}

/* Compact attendance header; the date chevron follows the calendar's accessible state. */
#attendance_date{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;white-space:nowrap}
#attendance_date::after{content:"";width:8px;height:8px;flex:0 0 8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px}
#attendance_date[aria-expanded="true"]::after{transform:rotate(225deg);margin-top:4px}
.register-session-date p{margin:0}
@media(max-width:600px){
 body.attendance-page .app-bar{position:static}
 body.attendance-page .attendance-toolbar{position:sticky;top:0;z-index:9;background:#fff}
 body.attendance-page #full-register{scroll-margin-top:180px}
}

/* Respond to the register width, including calendar/sidebar space. */
#full-register{container:attendance-register / inline-size;min-width:0}
.register-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"date date" "filter actions";gap:16px;margin-bottom:18px;align-items:center}
.register-heading>.register-session-date{grid-area:date;text-align:center;min-width:0;overflow-wrap:anywhere}
.register-heading>#register-filter{grid-area:filter;width:100%;max-width:250px;min-width:0}
.register-heading>.register-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:12px;min-width:0}
@container attendance-register (min-width:48rem){
 .register-heading{grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr);grid-template-areas:"filter date actions"}
}
@container attendance-register (max-width:26rem){
 .register-heading{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"date date" "filter actions";gap:8px}
 .register-heading>#register-filter{max-width:none}
 .register-heading>.register-actions{justify-content:flex-end;gap:6px}
 .register-actions>button{padding:10px 8px;white-space:nowrap}
 .register-actions>.present-total{padding:8px 10px;white-space:nowrap}
 .register-actions>.register-menu{flex-shrink:0}
 .register-heading>#register-filter{padding-left:8px;padding-right:8px}
}

.no-recent-heading{margin:24px 0 12px;padding:10px 12px;background:#eaf0f8;border-radius:6px;font-size:1rem;color:#475569}

.register-menu summary:hover{background:#d6d5d5}
.register-menu-options>button{white-space:nowrap}
#save-register{padding:10px 14px;font-size:17px}
@media(max-width:600px){#main{padding-left:0;padding-right:0}}
.emergency-contact-details>summary{cursor:pointer;font-weight:600;color:#315581;padding:12px 0}

.student-reminder{display:inline-flex;align-items:center;justify-content:center;background:#999ffb;color:#fff;border-radius:50%;width:22px;height:22px;font-weight:800;margin-left:8px}

#attendance_date{font-size:15px;padding:10px 11px}
label.check.student-reminder-control{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;white-space:nowrap;width:100%}
.student-reminder-control input[type=checkbox]{flex:0 0 20px;width:20px;margin:0}
/* Mobile filter mode persists until explicitly closed or the viewport grows. */
body.attendance-page.register-filter-mode>.app-bar,
body.attendance-page.register-filter-mode>#drawer,
body.attendance-page.register-filter-mode>#backdrop,
body.attendance-page.register-filter-mode>.skip,
body.attendance-page.register-filter-mode #main>:not(#content),
body.attendance-page.register-filter-mode .attendance-layout>:not(#full-register),
body.attendance-page.register-filter-mode .attendance-toolbar{display:none!important}
body.attendance-page.register-filter-mode #main{margin:0;max-width:none;padding-top:0}
body.attendance-page.register-filter-mode .attendance-layout{grid-template-columns:minmax(0,1fr)}
body.attendance-page.register-filter-mode .register-heading{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"filter exit"}
body.attendance-page.register-filter-mode .register-heading>:not(#register-filter):not(#exit-register-filter){display:none}
body.attendance-page.register-filter-mode #register-filter{max-width:none}
#exit-register-filter{grid-area:exit;padding:8px 14px;background:#ececec;color:#334155;font-size:24px}
.attendance-toolbar.has-attendance-changes{justify-content:flex-end;align-items:center}

.register-edit-actions{display:flex;align-items:center;justify-content:flex-end;margin-left:auto;gap:12px}
#discard-register{background:#ececec;color:#334155;padding:10px 14px;font-size:17px}

body.attendance-page.register-filter-mode .register-heading{position:sticky;top:0;z-index:10;background:#fff;padding-top:10px;padding-bottom:10px}

@media(max-width:600px){
 body.attendance-page .attendance-toolbar{z-index:20}
 body.attendance-page #full-register .register-heading{position:sticky;top:var(--attendance-toolbar-height,0px);z-index:10;background:#fff;padding-top:10px;padding-bottom:10px;top:30px;}
 body.attendance-page.register-filter-mode #full-register .register-heading{top:0}
}

@media(max-width:600px){
 body.attendance-page .attendance-layout:not(.calendar-collapsed)>#full-register{display:none}
}

/* Header palette, scoped to keep other app controls unchanged. */
.app-bar{background:#667ea0;color:#fff;border-bottom-color:#667ea0}
.app-bar span:not(.badge){color:#fff}
.app-bar #open-menu{background:#7890b0;color:#fff;border-color:transparent}
.app-bar #open-menu:hover{background:#859bb8;color:#fff}
.app-bar #open-menu:focus-visible{outline:2px solid #fff;outline-offset:3px}

#attendance_class optgroup{color:#000;font-weight:700}
#attendance_class option{color:#222;font-weight:400}

label.check.student-reminder-control{display:flex!important;margin-top:-18px!important}

@media(max-width:600px){.heading{margin-left:20px;margin-right:20px}}

.text-link{font-weight:500}
.attendance-btn{flex:0 0 36px;width:36px;height:36px;font-size:1.0rem}
@media(max-width:600px){.student{gap:12px;padding:3px 0}}

/* Reserve the measured filter bar height when it leaves document flow. */
body.attendance-page.register-filter-mode #full-register .register-heading{position:fixed;top:0;left:0;right:0;margin:0;padding:10px 20px;box-sizing:border-box;z-index:25;background:#fff}
body.attendance-page.register-filter-mode #full-register{container-type:normal;margin-top:0;padding-top:calc(var(--register-filter-heading-height,70px) + 16px)}

.drawer-heading>#mode{grid-column:1 / -1;justify-self:start;margin:4px 0 0}
#attendance-date-slot:empty{display:none}
#attendance-date-slot{margin-left:auto;flex-shrink:0}
body.attendance-page.register-filter-mode .register-footer{display:none}
#full-register .register-heading{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"filter actions"}
body.attendance-page.register-filter-mode #full-register .register-heading{grid-template-areas:"filter exit"}
@media(max-width:600px){
 body.attendance-page .app-bar{gap:10px;flex-wrap:wrap}
 body.attendance-page .app-bar>div{min-width:0;flex:1}
 body.attendance-page .attendance-date-control:empty{display:none}
 body.attendance-page .attendance-toolbar>label{min-width:0;flex:1}
 body.attendance-page .register-edit-actions{flex-shrink:0}
}

.app-loading{min-height:65vh;display:flex;align-items:center;justify-content:center;text-align:center;margin:0;font-size:1.15rem}
@media(max-width:600px){
 body.attendance-page #full-register{container-type:normal}
 body.attendance-page .register-sticky-controls{position:sticky;top:0;z-index:25;background:#fff;padding-top:10px;padding-bottom:10px;margin-bottom:18px}
 body.attendance-page .register-sticky-controls>.attendance-toolbar{position:static;box-shadow:none;border:0;border-radius:0;padding:0;margin:0 0 10px;background:#fff}
 body.attendance-page #full-register .register-sticky-controls>.register-heading{position:static;padding:0;margin:0}
 body.attendance-page.register-filter-mode .register-sticky-controls{position:static;padding:0;margin:0}
 body.attendance-page.register-filter-mode #full-register .register-sticky-controls>.register-heading{position:fixed;top:0;left:0;right:0;padding:10px 20px;z-index:25}
}

#content{max-width:900px;margin:auto}
#attendance_class{text-align:center}

.register-calendar-days>button:not(:disabled):not(.selected):hover{background:pink}
.register-menu summary{margin:0}

.drawer-heading{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:start}
.drawer-heading>#pin-menu{margin:0;padding:8px;align-self:start}

.grade-order{white-space:nowrap}.grade-progress{margin:16px 0;padding:12px;border:1px solid #dbe3ef;border-radius:10px}

.student-reminder-control{max-width:fit-content;margin-left:auto;}

@media print{body:has(.grading-print-dialog)>*:not(.grading-print-dialog){display:none!important}.grading-print-dialog{position:static!important;max-width:none!important;width:100%!important;max-height:none!important;overflow:visible!important;border:0!important}.grading-print-dialog>header,.grading-print-dialog button{display:none!important}.grading-print-dialog::backdrop{display:none}.grading-print table{width:100%;border-collapse:collapse}.grading-print th,.grading-print td{padding:8px;border-bottom:1px solid #ccc}}

@media print{.grading-print-dialog>.heading,.grading-print-dialog>[data-dialog-error]{display:none!important}}

.dashboard-detail{padding:12px 0;border-bottom:1px solid #eaf0f8}.dashboard-detail summary{cursor:pointer;font-weight:600}.dashboard-detail li{margin:12px 0}.metrics a.metric{text-decoration:none;color:inherit}

#setup-menu{border:0;margin:0;padding:0}#setup-menu>summary{padding:14px 18px;color:inherit;font-weight:600;cursor:pointer;border-radius:12px}#setup-menu a{margin-left:14px}#setup-menu>summary:hover{background:#263348}

@media(max-width:600px){.awards-table,.awards-table tbody,.awards-table tr,.awards-table td{display:block;width:100%}.awards-table thead{display:none}.awards-table tr{padding:16px 0;border-bottom:1px solid #dbe3ef}.awards-table td{padding:5px 0;border:0;white-space:normal}.awards-table td[data-label]:before{content:attr(data-label) ": ";font-weight:600}.awards-table .sub{display:block}}

#content>.heading>div:first-child{min-width:0;overflow-wrap:anywhere}
.heading-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}
@media(max-width:600px){
 #content>.heading{flex-direction:row;align-items:flex-start;gap:14px}
 #content>.heading>div:first-child{flex:1 1 0}
 #content>.heading>.heading-actions{flex-direction:column;align-items:flex-end;gap:10px;max-width:50%}
 #content>.heading .heading-actions button,#content>.heading .heading-actions a{max-width:100%;white-space:normal}
 #content>.heading .heading-actions [id^="back-"],#content>.heading .heading-actions #components-back{order:-1}
}

.register-pay{margin-left:auto;flex-shrink:0;background:#16803c;color:white}.action-progress{position:fixed;inset:0;z-index:10000;background:rgba(244,246,248,.95);display:flex;align-items:center;justify-content:center;gap:1rem;padding:1.5rem;font-size:1.15rem;text-align:center}.action-spinner{width:2rem;height:2rem;flex-shrink:0;border:4px solid #ccd5e2;border-top-color:#2563eb;border-radius:50%;animation:action-spin .8s linear infinite}@keyframes action-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.action-spinner{animation:none}}

.sale-prepare-error{color:#b42318;background:#fff0ed;border:1px solid #b42318;border-radius:8px;padding:12px;margin:12px 0;font-weight:600;}
.notes-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.notes-calendar>strong{text-align:center}.notes-day{min-width:0;min-height:75px;padding:8px;text-align:left;overflow-wrap:anywhere}.notes-day small{display:block;font-size:.8em}.notes-day[aria-pressed=true],.notes-class-list button[aria-pressed=true]{background:#245eea;color:white}.notes-today{outline:2px solid #667ea0;outline-offset:-2px}.notes-layout{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,3fr);gap:20px}.notes-class-list button{display:block;width:100%;text-align:left;margin-bottom:8px;white-space:normal}.notes-class-list small{display:block}.notes-reference{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}#notes-editor [data-error]{color:#b42318}#notes-editor textarea{width:100%;box-sizing:border-box}@media(max-width:650px){.notes-layout{grid-template-columns:1fr}.notes-day{padding:4px;font-size:.8rem;min-height:65px}.notes-calendar{gap:3px}}
.notes-day[aria-pressed="true"],.notes-class-list button[aria-pressed="true"]{background:#4c46b0e6;color:white}.notes-day[aria-pressed="true"] small,.notes-day[aria-pressed="true"] .small,.notes-class-list button[aria-pressed="true"] small,.notes-class-list button[aria-pressed="true"] .small{color:white}

#register-dialog [data-buy],#register-dialog [data-buy-items]{background:#16803c;color:white}