:root{--blue:#153768;--red:#b82032;--yellow:#f4c641;--ink:#202e43;--muted:#5c6879;--line:#dee3eb;--paper:#f5f6f8;--white:#fff;--radius:16px;font-family:'Segoe UI',Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:var(--blue)}[hidden]{display:none!important}:focus-visible{outline:3px solid #bc8414;outline-offset:4px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(28px,3vw,42px);letter-spacing:-1.2px;line-height:1.15;margin-bottom:12px}h2{font-size:21px;letter-spacing:-.4px;margin-bottom:10px}h3{font-size:17px;margin-bottom:8px}p{line-height:1.65}small{line-height:1.5}.topbar{background:white;border-bottom:1px solid var(--line);padding:20px max(24px,calc((100vw - 1240px)/2));display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:4px solid var(--red)}.brand{display:flex;gap:14px;align-items:center;text-decoration:none;font-size:17px;font-weight:700;color:var(--blue)}.brand img{width:58px;height:58px;object-fit:contain}.brand small{display:block;font-size:10px;font-weight:700;letter-spacing:2.5px;margin-top:5px;color:var(--muted)}.header-actions{display:flex;gap:18px;align-items:center}.session-label{font-size:12px;color:var(--muted)}main{max-width:1240px;margin:auto;padding:32px 24px 48px;min-height:75vh}.eyebrow{display:block;font-size:11px;letter-spacing:1.8px;font-weight:750;color:var(--red);margin-bottom:12px}.muted{color:var(--muted);font-size:14px}.button{border:1px solid transparent;border-radius:8px;min-height:44px;padding:11px 19px;font-weight:650;font-size:14px;transition:background .15s}.primary{background:var(--blue);color:white}.primary:hover{background:#234c87}.subtle{background:white;border-color:var(--line);color:var(--blue)}.subtle:hover{background:#edf1f6}button:disabled{opacity:.5;cursor:not-allowed}.full{width:100%}.auth-layout{display:grid;grid-template-columns:1.05fr 1fr;background:white;border-radius:20px;overflow:hidden;border:1px solid var(--line);max-width:1050px;margin:30px auto;box-shadow:0 15px 45px #15376809}.auth-story{padding:60px 48px;min-height:590px;background:var(--blue);color:white;display:flex;flex-direction:column;position:relative}.auth-story .eyebrow{color:var(--yellow)}.auth-story h1{font-family:Georgia,serif;font-size:clamp(34px,3.5vw,47px);font-weight:400;letter-spacing:-1px;line-height:1.18;margin-top:35px}.auth-story>p{color:#dbe5f5;max-width:330px}.story-bottom{margin-top:auto;padding-top:55px;font-size:13px;color:#dbe5f5}.brand-rule{display:block;height:4px;width:72px;background:var(--yellow);margin-bottom:20px}.story-bottom strong{font-weight:500;color:white}.auth-panel{padding:46px 40px}.tabs{display:flex;border-bottom:1px solid var(--line);gap:12px;margin:24px 0}.tabs button{background:none;border:0;border-bottom:3px solid transparent;border-radius:0;min-height:46px;padding:8px 0;font-size:12px;color:var(--muted)}.tabs button.active{border-color:var(--red);color:var(--blue);font-weight:700}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}.field label{font-size:13px;font-weight:650}.field small{color:var(--muted);font-size:11px}input:not([type=range]):not([type=checkbox]),select,textarea{border:1px solid #cbd3df;border-radius:8px;background:white;color:var(--ink);padding:11px 12px;min-height:44px;width:100%;max-width:100%}input:read-only{background:#f0f2f6;color:var(--muted)}textarea{min-height:94px;resize:vertical}.security-note,.fine-print{font-size:12px;color:var(--muted);line-height:1.6}.security-note{margin-top:24px;margin-bottom:0}.form-message{font-size:13px;margin:8px 0 16px;min-height:0;white-space:pre-wrap}.form-message:empty{display:none}.form-message.error{color:#a31b2c}.form-message.success{color:#246042}.section-nav{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-bottom:32px;overflow:auto}.section-nav a{font-size:13px;font-weight:650;white-space:nowrap;padding:8px 0 18px;text-decoration:none}.section-nav a.active{border-bottom:3px solid var(--red)}.welcome{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.welcome p{margin-bottom:0}.avatar-button{padding:0;position:relative;border:0;background:var(--blue);border-radius:50%;width:88px;height:88px;flex-shrink:0;color:white;overflow:visible}.avatar-button img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar-initials{font-size:25px;font-weight:650}.avatar-edit{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);white-space:nowrap;background:white;color:var(--blue);padding:5px 10px;border:1px solid var(--line);border-radius:20px;font-size:10px}.notice{background:#fff5d7;border:1px solid #e6cf87;border-radius:10px;padding:15px 18px;color:#654e14;font-size:13px;line-height:1.6;margin-bottom:22px}.counts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:24px}.count-card{background:white;padding:22px 24px;border:1px solid var(--line);border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;gap:12px}.count-card strong{font-size:32px;letter-spacing:-1px;color:var(--blue);font-variant-numeric:tabular-nums}.count-card h2{font-size:14px;margin-bottom:5px}.count-card p{font-size:11px;color:var(--muted);margin:0}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:26px;margin-bottom:24px}.overview-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:24px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}.section-heading .eyebrow{margin-bottom:8px}.section-heading h2{margin-bottom:0}.badge{display:inline-flex;padding:6px 10px;border-radius:5px;background:#edf1f7;color:var(--blue);font-size:11px;font-weight:650;white-space:nowrap}.badge.yellow{background:#fff2c7;color:#705410}.progress-block{border-top:1px solid var(--line);padding:18px 0}.progress-block .section-heading{margin-bottom:8px}.progress-block p{font-size:12px;margin-bottom:10px;color:var(--muted)}.progress-row{display:grid;grid-template-columns:90px 1fr 44px;align-items:center;gap:12px;font-size:12px;margin:10px 0}progress{appearance:none;width:100%;height:7px;border:0;border-radius:8px;overflow:hidden;background:#e9edf4}progress::-webkit-progress-bar{background:#e9edf4}progress::-webkit-progress-value{background:var(--blue);border-radius:8px}progress::-moz-progress-bar{background:var(--blue)}.progress-panel .fine-print{margin:0}.schedule-item{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}.schedule-item:last-child{border-bottom:0}.date-block{background:#edf1f7;border-radius:7px;text-align:center;height:55px;padding:5px;color:var(--blue);font-weight:700}.date-block small{display:block;font-size:10px;font-weight:500;text-transform:uppercase}.schedule-item h3{font-size:14px;line-height:1.5;margin:0 0 4px}.schedule-item p{font-size:12px;color:var(--muted);margin:0}.filters{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1fr;gap:12px}.filters label{font-size:11px}.filters input,.filters select{font-size:12px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px;text-align:left}th{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);padding:14px 12px;background:#f5f7fa;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:18px 12px;border-bottom:1px solid var(--line);line-height:1.5}td:first-child{min-width:200px;font-weight:600}td:nth-child(2){white-space:nowrap}.pagination{display:flex;align-items:center;justify-content:space-between;padding-top:20px;gap:12px}.pagination>div{display:flex;gap:8px}.pagination .muted{font-size:12px}.empty{color:var(--muted);font-size:13px;text-align:center;padding:28px 10px}.profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 20px;margin-top:24px}.form-footer{border-top:1px solid var(--line);padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:20px}.site-footer{max-width:1240px;margin:auto;padding:22px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.boot{padding:80px;text-align:center;color:var(--muted)}.fatal{max-width:600px;margin:60px auto}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--blue);color:white;border-radius:10px;padding:15px 24px;max-width:calc(100vw - 32px);z-index:10;box-shadow:0 8px 30px #0003;font-size:13px}dialog{border:1px solid var(--line);border-radius:18px;padding:26px;max-width:560px;width:calc(100vw - 32px);max-height:90vh;overflow:auto;color:var(--ink)}dialog::backdrop{background:#10243b99}#crop-canvas{display:block;width:240px;max-width:100%;height:auto;margin:12px auto;background:#edf1f7;border-radius:50%;touch-action:none}.crop-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}input[type=range]{width:100%;min-height:44px;accent-color:var(--blue)}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip:focus{position:fixed;top:8px;left:8px;padding:10px;background:white;z-index:20}section[id]{scroll-margin-top:20px}@media(max-width:900px){.auth-story{padding:40px 30px}.auth-panel{padding:36px 28px}.overview-grid{grid-template-columns:1fr}.filters{grid-template-columns:repeat(3,1fr)}.filters .field:first-child{grid-column:span 2}.profile-grid{grid-template-columns:repeat(2,1fr)}.session-label{display:none}}@media(max-width:600px){.topbar{padding:14px 18px;gap:12px;flex-wrap:wrap}.topbar .section-nav{order:3;width:100%;margin:6px 0 0;border-bottom:0;padding-bottom:2px}.brand{font-size:12px;gap:9px}.brand img{width:43px;height:43px}.brand small{font-size:8px;letter-spacing:1.6px}.header-actions .button{font-size:11px;padding:8px 10px}main{padding:18px 16px 32px}.auth-layout{grid-template-columns:1fr;margin:10px auto}.auth-story{padding:26px;min-height:0}.auth-story h1{font-size:30px;margin-top:12px}.auth-story>p{font-size:13px;margin-bottom:0}.story-bottom{display:none}.auth-panel{padding:28px 24px}.counts{gap:9px}.count-card{padding:15px 12px;display:block}.count-card strong{display:block;font-size:25px;margin-top:12px}.count-card h2{font-size:11px}.count-card p{font-size:10px}.section-nav{gap:24px;margin-bottom:24px}.panel{padding:20px 16px}.welcome{gap:20px}.welcome h1{font-size:28px}.avatar-button{width:65px;height:65px}.avatar-edit{font-size:9px}.welcome p{font-size:12px}.filters{grid-template-columns:1fr 1fr}.filters .field:first-child{grid-column:span 2}.filters .field{margin-bottom:12px}.profile-grid{grid-template-columns:1fr}.pagination .button{padding:9px 12px;font-size:12px}.pagination{align-items:flex-start}.site-footer{padding:20px 16px;gap:16px;flex-wrap:wrap}.crop-controls{grid-template-columns:1fr;gap:0}.crop-controls .field{margin-bottom:6px}.form-footer{align-items:flex-start;flex-direction:column}.form-footer .button{width:100%}}.welcome h1{overflow-wrap:anywhere}.schedule-item h3{overflow-wrap:anywhere}@media(max-width:600px){.attendance-panel table,.attendance-panel tbody,.attendance-panel tr,.attendance-panel td{display:block}.attendance-panel thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.attendance-panel tr{padding:14px 0;border-bottom:1px solid var(--line)}.attendance-panel td{border:0;padding:4px 0;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere;font-size:12px;display:grid;grid-template-columns:90px minmax(0,1fr);gap:8px}.attendance-panel td::before{content:attr(data-label);font-size:11px;font-weight:500;color:var(--muted)}.attendance-panel td:first-child{font-size:14px;padding-bottom:8px}.count-card p{font-size:11px}.fine-print{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Member self-service: keep private details readable at narrow widths. */
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:24px}
.feature-grid>*,.directory-grid>*,.panel,.dashboard{min-width:0}
.record-list{display:grid;gap:14px;margin-bottom:20px}
.record-card{border:1px solid var(--line);border-radius:10px;padding:18px;background:#fafbfd;overflow-wrap:anywhere}
.record-card h3,.record-card h4{font-size:15px;margin:0 0 10px;line-height:1.5}
.record-card p{font-size:13px;margin-bottom:12px;white-space:pre-wrap}
.record-card p:last-child{margin-bottom:0}
.record-card .badge{margin-bottom:12px}
.record-card form{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.record-card label{font-size:13px;font-weight:650}
.record-card button{justify-self:start}
.directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.privacy-form{background:#edf1f7;border-radius:10px;padding:20px;margin:20px 0 28px}
.checkbox-label{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.5;cursor:pointer;margin-bottom:18px;min-height:44px}
.checkbox-label input[type=checkbox]{width:22px;height:22px;min-height:22px;flex:0 0 22px;margin:0;accent-color:var(--blue)}
.directory-search{display:flex;align-items:flex-end;gap:12px;margin-bottom:20px}
.directory-search .field{flex:1;min-width:0;margin-bottom:0}
.section-nav{flex-wrap:wrap;gap:0 24px;overflow:visible}
/* The base .section-nav sets overflow:auto for horizontal scrolling on narrow
   screens, which CLIPS the absolutely-positioned Attendance submenu. Keep the
   nav unclipped at every width; the submenu switches to static under 600px. */
.section-nav{overflow:visible}
.section-nav a{padding-bottom:12px;min-height:44px}
.form-message,.panel .muted,.fine-print,.record-card{overflow-wrap:anywhere}
@media(max-width:900px){.feature-grid{grid-template-columns:1fr;gap:24px}.directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.directory-grid{grid-template-columns:1fr}.directory-search{align-items:stretch;flex-direction:column}.privacy-form{padding:16px}.privacy-form .button{width:100%}.feature-grid .section-heading,#review-section>.section-heading{flex-wrap:wrap}.section-nav{gap:0 18px}.directory-grid .empty{padding:20px 0}.record-card{padding:16px}#directory-section .pagination{flex-wrap:wrap}}
/* Nav group with submenu (Attendance > history / corrections / RSVP) */
.nav-group{position:relative;display:flex;align-items:center}
.nav-group-head{display:flex;align-items:center;gap:2px}
.nav-group-head>a{padding-bottom:18px}
.nav-toggle{background:none;border:0;padding:0 4px 14px;min-height:44px;color:var(--blue);font-size:12px;line-height:1;border-radius:6px}
.nav-toggle:hover,.nav-group:hover .nav-toggle,.nav-toggle[aria-expanded=true]{color:var(--red)}
.nav-toggle[aria-expanded=true] span{display:inline-block;transform:rotate(180deg)}
.nav-group:hover .nav-group-head>a,.nav-group-head>a.active{color:var(--blue)}
.nav-submenu{position:absolute;top:calc(100% - 6px);left:0;z-index:50;background:var(--white);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 38px #1537682e;padding:8px;display:none;gap:2px;min-width:210px;max-width:calc(100vw - 32px)}
/* Open on hover wherever hover exists (CSS, so it works even if JS hover
   detection is unavailable), and via the .open class for click/touch. */
@media(hover:hover){
  .nav-group:hover .nav-submenu,.nav-group:focus-within .nav-submenu{display:grid}
}
.nav-group.open .nav-submenu{display:grid}
.nav-submenu a{padding:10px 12px;border-radius:8px;font-size:13px;font-weight:600;white-space:nowrap;text-decoration:none}
.nav-submenu a:hover{background:#edf1f6}
.nav-submenu a.active{background:#edf1f7;color:var(--blue)}
.nav-submenu a.active::after{content:none}
/* Tablet and below: the nav wraps onto its own row and the submenu becomes part of
   the flow, so it can never overflow the viewport. The group stacks vertically
   rather than placing the menu beside its heading. */
@media(max-width:900px){
  .topbar{flex-wrap:wrap}
  .topbar .section-nav{order:3;width:100%;margin:6px 0 0;border-bottom:0}
  .nav-group{flex-direction:column;align-items:stretch}
  .nav-group-head{justify-content:flex-start}
  .nav-submenu{position:static;box-shadow:none;border:0;border-left:2px solid var(--line);border-radius:0;padding:0 0 10px 12px;min-width:0;max-width:none;width:100%;background:none}
  .nav-submenu a{padding:9px 0;font-size:13px}
}
@media(max-width:600px){
  .nav-toggle{padding-bottom:10px}
  .nav-group-head>a{padding-bottom:12px}
  .nav-submenu{padding-left:10px}
}

/* Directory contact details */
.directory-contacts{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.directory-contact{display:grid;grid-template-columns:120px minmax(0,1fr);gap:10px;font-size:12px;align-items:baseline}
.directory-contact em{font-style:normal;color:var(--muted);font-size:11px}
.directory-contact a,.directory-contact span{overflow-wrap:anywhere}
@media(max-width:600px){.directory-contact{grid-template-columns:1fr;gap:2px}}

/* Settings page — table row actions */
.term-form .form-actions{display:flex;gap:10px;align-items:center}
.danger{color:#a31b2c;border-color:#e7c6cb}
.danger:hover{background:#fdf2f3}
#settings-section table td:last-child{white-space:nowrap}
#settings-section table td:last-child .button{padding:7px 12px;min-height:36px;font-size:12px;margin-right:6px}
#settings-section table td:last-child .button:last-child{margin-right:0}

/* Settings page — member picker */
.member-results{display:grid;gap:6px;border:1px solid var(--line);border-radius:10px;padding:8px;background:var(--white);max-height:260px;overflow-y:auto;margin-bottom:12px}
.member-result{display:grid;gap:2px;text-align:left;background:none;border:0;border-radius:8px;padding:10px 12px;min-height:44px;cursor:pointer}
.member-result:hover,.member-result:focus-visible{background:#edf1f6}
.member-result strong{font-size:14px;color:var(--blue)}
.member-result .muted{font-size:12px}
.member-selected{background:#edf1f7;border-left:4px solid var(--blue);border-radius:10px;padding:14px 16px;margin-bottom:16px;display:grid;gap:4px;justify-items:start}
.member-selected strong{font-size:16px}
.member-selected p{margin:0}
.member-selected .button{margin-top:8px}

/* Settings page */
.active-term{background:#edf1f7;border-left:4px solid var(--blue);border-radius:10px;padding:18px 20px;margin-bottom:24px}
.active-term.warning{background:#fdf3e3;border-left-color:#bc8414}
.active-term strong{display:block;font-size:18px;margin-bottom:6px}
.active-term p{margin:0}
.term-form{background:#fafbfd;border:1px solid var(--line);border-radius:10px;padding:20px;margin-bottom:28px;display:grid;gap:14px;max-width:520px}
.term-form h2{margin:0}
.term-form .field{display:grid;gap:6px}
.term-form input{min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:8px}
.term-form .button{justify-self:start}

/* RSVP page */
.rsvp-list{display:grid;gap:1rem;margin-top:1.5rem}
.rsvp-item{display:grid;grid-template-columns:80px 1fr auto;gap:1.25rem;align-items:center;padding:1.25rem 1.5rem;background:var(--white);border:1px solid var(--line);border-radius:12px}
.rsvp-item .date-block{text-align:center}
.rsvp-item .date-block span{display:block;font-size:1.5rem;font-weight:700;color:var(--blue)}
.rsvp-item .date-block small{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}
.rsvp-details h3{margin:0 0 .25rem;font-size:1.1rem}
.rsvp-details p{margin:0;color:var(--muted);font-size:.9rem}
.rsvp-meta{display:flex;gap:.75rem;margin-top:.5rem;align-items:center}
.rsvp-meta .badge{font-size:.75rem;padding:.15rem .5rem;border-radius:999px;background:var(--paper);color:var(--muted)}
.rsvp-meta .badge.green{background:#dcfce7;color:#166534}
.rsvp-actions{display:flex;gap:.5rem}
@media(max-width:640px){.rsvp-item{grid-template-columns:1fr;text-align:center}.rsvp-item .date-block span{display:inline;font-size:1.2rem}.rsvp-item .date-block small{display:inline;margin-left:.5rem}.rsvp-actions{justify-content:center}}