@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#17233b;background:#f3f6fa;
  --navy:#123a67;--navy-2:#1a4b7a;--blue:#2b6ea6;--blue-2:#3b82bd;
  --ink:#17233b;--muted:#66758a;--line:#dce4ee;--surface:#fff;--soft:#f6f8fb;
  --shadow:0 8px 26px rgba(7,29,63,.07);--radius:16px
}
*{box-sizing:border-box}html{background:#f3f6fa}body{margin:0;background:#f3f6fa;color:var(--ink)}button,input,select,textarea{font:inherit}button{border:0;border-radius:10px;padding:10px 15px;background:var(--navy-2);color:#fff;font-weight:700;cursor:pointer;transition:.16s ease}button:hover{background:#103b72;transform:translateY(-1px)}button:active{transform:none}.secondary{background:#e9eef5;color:#17304f}.secondary:hover{background:#dde6f0}.msg{color:#b42318!important;min-height:20px}

/* Login */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#0f3158 0%,#174a78 55%,#2b6ea6 100%)}
.login-card{width:min(430px,100%);background:rgba(255,255,255,.985);padding:34px;border-radius:22px;box-shadow:0 28px 70px rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.35)}
.logo{width:260px;display:block;margin:0 auto 14px}.login-card h1{text-align:center;margin:6px 0 4px;font-size:27px;color:var(--navy)}.login-card p,.login-card small{text-align:center;display:block;color:#6a7687}.login-card label,.formcard label{font-size:12px;font-weight:800;display:block;margin:14px 0 6px;color:#34445b;letter-spacing:.01em}.login-card input,.formcard input,.formcard select,.toolbar input,.toolbar select,.titleline>input,textarea{width:100%;padding:11px 12px;border:1px solid #cfd9e6;border-radius:10px;background:#fff;color:var(--ink);outline:none;transition:.15s}.login-card input:focus,.formcard input:focus,.formcard select:focus,.toolbar input:focus,.toolbar select:focus,.titleline>input:focus,textarea:focus{border-color:#4a79aa;box-shadow:0 0 0 3px rgba(20,93,160,.10)}.login-card button{width:100%;margin-top:18px;padding:12px}.login-card small{margin-top:6px;font-size:11px}

/* App shell */
header{background:var(--navy);color:white;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;position:sticky;top:0;z-index:20;box-shadow:0 3px 14px rgba(4,18,39,.18)}
.brand,.user,.titleline,.toolbar{display:flex;align-items:center;gap:10px}.brand h1{font-size:21px;line-height:1.15;margin:0;font-weight:800;letter-spacing:-.01em}.brand small{display:block;margin-top:4px;opacity:.78;font-size:12px;letter-spacing:.015em}.user{flex-wrap:wrap;justify-content:flex-end}.sync{font-size:11px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.13);padding:7px 10px;border-radius:999px}.user #userChip{font-size:12px;font-weight:650;color:#eaf1f8}.user .secondary{background:#fff;color:var(--navy);padding:8px 12px}.user .secondary:hover{background:#edf3f8}
.scopebar{display:flex;gap:7px;padding:9px 24px;background:#1a4b7a;border:0;overflow:auto;position:sticky;top:65px;z-index:18}.scopebar button{white-space:nowrap;background:transparent;color:#cbd8e7;border:1px solid transparent;padding:8px 13px}.scopebar button:hover{background:rgba(255,255,255,.08);color:#fff;transform:none}.scopebar button.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.10)}
nav{display:flex;gap:4px;padding:0 24px;background:#fff;border-bottom:1px solid var(--line);overflow:auto;box-shadow:0 2px 8px rgba(7,29,63,.035);position:sticky;top:111px;z-index:17}nav button{white-space:nowrap;background:transparent;color:#5a687b;border-radius:0;padding:13px 12px;border-bottom:3px solid transparent;font-size:13px}nav button:hover{background:#f5f8fb;color:var(--navy);transform:none}nav button.active{background:transparent;color:var(--navy);border-bottom-color:var(--blue);font-weight:800}
main{padding:24px;max-width:1540px;margin:auto}.page{display:none}.page.active{display:block}

/* Content */
.hero,.cards article,.formcard,.groupcard,.tablewrap,.stats>div,#auditList details,.chartcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.hero{padding:24px 26px;border-top:4px solid var(--navy-2)}.hero h2{margin:0 0 7px;font-size:25px;color:var(--navy);letter-spacing:-.015em}.hero p{margin:0;color:var(--muted);max-width:900px;line-height:1.55}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}.cards article{padding:20px}.cards article h3{margin:0 0 7px;color:var(--navy);font-size:16px}.cards article p{margin:0 0 16px;color:var(--muted);line-height:1.5;font-size:13px}.cards article button{margin-top:auto}
.stats,.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}.stats>div,.summary>div{padding:16px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 4px 16px rgba(7,29,63,.045);border-left:4px solid #d7e2ef}.stats b,.summary b{display:block;font-size:25px;color:var(--navy);line-height:1.15}.stats span,.summary span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.045em;font-weight:700}
.titleline{justify-content:space-between;align-items:flex-end;margin:2px 0 16px;padding-bottom:13px;border-bottom:1px solid var(--line)}.titleline h2{margin:0 0 4px;color:var(--navy);font-size:23px}.titleline p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}.toolbar{flex-wrap:wrap}.toolbar button{min-height:40px}
.groupgrid{display:grid;grid-template-columns:repeat(5,minmax(210px,1fr));gap:12px}.groupcard{padding:12px;overflow:hidden}.groupcard h3{margin:0 -12px 8px;padding:3px 12px 11px;color:var(--navy);border-bottom:1px solid #e7edf4;font-size:15px}.memberrow{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;border-top:1px solid #edf1f5;padding:8px 2px;min-height:50px}.memberrow:first-of-type{border-top:0}.membertap{display:flex;align-items:center;gap:10px;cursor:pointer;min-width:0}.membertap input{width:25px;height:25px;accent-color:var(--navy-2)}.membername{font-size:13px;overflow:hidden;text-overflow:ellipsis}.remark{grid-column:1/-1;width:100%;padding:8px;border:1px solid #d8e0ea;border-radius:8px}.saving{opacity:.55}.saved{background:#f1f8f4}.error{background:#fff1f1}
.formcard{display:grid;grid-template-columns:repeat(5,1fr) auto;gap:12px;padding:16px;align-items:end}.tablewrap{overflow:auto;padding:0}table{border-collapse:collapse;width:100%;font-size:13px}th,td{padding:11px 12px;border-bottom:1px solid #e8edf3;text-align:left}th{background:#f5f8fb;position:sticky;top:0;color:#3b4a60;font-size:11px;text-transform:uppercase;letter-spacing:.035em}tbody tr:hover{background:#f8fafc}.pill{padding:4px 8px;border-radius:999px;background:#e9f1fa;color:#234d78;font-size:11px;font-weight:700}#auditList details{padding:13px 15px;margin:10px 0}#auditList summary{cursor:pointer;font-weight:700;color:var(--navy)}.future{opacity:.7}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0;padding:5px;background:#eaf0f6;border-radius:12px;width:max-content;max-width:100%}.tabs button{background:transparent;color:#52647a;padding:9px 12px}.tabs button:hover{background:#fff;color:var(--navy);transform:none}.tabs button.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(7,29,63,.08)}.lgview{margin-top:14px}textarea{box-sizing:border-box}.otherRow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px;border-bottom:1px solid #edf1f5}.lgmark,.lgfu{width:24px;height:24px;accent-color:var(--navy-2)}
.chartgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}.chartcard{padding:18px;min-height:320px}.chartcard h3{margin-top:0;color:var(--navy)}.chartcard canvas{max-height:300px}.status-ok,.status-warn{font-weight:700}.smartlist{margin:0;padding-left:20px}.smartlist li{margin:7px 0}

[hidden]{display:none!important}
@media(max-width:1100px){.groupgrid{grid-template-columns:repeat(3,1fr)}.cards{grid-template-columns:1fr 1fr}.formcard{grid-template-columns:1fr 1fr 1fr}.scopebar{top:65px}nav{top:111px}}
@media(max-width:700px){header{align-items:flex-start;flex-direction:column;padding:14px 16px}.user{justify-content:flex-start}.scopebar,nav{position:relative;top:auto;padding-left:12px;padding-right:12px}.scopebar{padding-top:8px;padding-bottom:8px}nav button{padding:12px 10px}main{padding:14px}.titleline{align-items:flex-start;flex-direction:column}.groupgrid,.cards,.stats,.summary{grid-template-columns:1fr}.formcard{grid-template-columns:1fr}.memberrow{min-height:58px}.brand h1{font-size:19px}.hero{padding:20px}.hero h2{font-size:22px}.tabs{width:100%;overflow:auto;flex-wrap:nowrap}.tabs button{white-space:nowrap}.chartgrid{grid-template-columns:1fr}}


/* v15 scope/search/export refinements */
.scoperow{display:flex;align-items:center;background:#1a4b7a;position:sticky;top:65px;z-index:18;padding-right:24px;gap:16px}.scoperow .scopebar{position:static;top:auto;flex:1}.header-search{position:relative;width:min(360px,38vw);flex:0 0 auto}.header-search input{width:100%;padding:9px 12px;border:1px solid rgba(255,255,255,.25);border-radius:10px;background:#fff;color:var(--ink);outline:none}.search-suggestions{position:absolute;right:0;top:calc(100% + 6px);width:min(430px,92vw);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px rgba(4,18,39,.22);overflow:hidden;z-index:40}.suggestion{display:flex;width:100%;flex-direction:column;align-items:flex-start;text-align:left;background:#fff;color:var(--ink);border-radius:0;border-bottom:1px solid #edf1f5;padding:11px 13px}.suggestion:hover{background:#f3f7fb;color:var(--navy);transform:none}.suggestion span{font-size:11px;color:var(--muted);margin-top:3px;text-transform:capitalize}.no-suggestion{padding:12px;color:var(--muted);font-size:13px}.scope-identity{margin:-4px 0 16px;padding:10px 14px;border-radius:10px;font-weight:800;letter-spacing:.055em;font-size:12px;border-left:5px solid var(--blue);background:#eaf2fa;color:#123a67}.scope-identity[data-scope="vienna"]{background:#edf4fb}.scope-identity[data-scope="donaustadt"]{background:#f4f0fa;color:#4c356f;border-left-color:#73549b}.scope-identity[data-scope="austria"]{background:#eaf5f1;color:#245744;border-left-color:#3d7a64}.helper,.muted,.dashboard-note{display:block;color:var(--muted);font-size:11px;margin-top:5px}.dashboard-note{margin:-7px 0 16px 3px}.membership-panel{margin:18px 0;padding:18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.membership-panel h3{margin:0 0 5px;color:var(--navy)}.membership-panel p{margin:0 0 14px;color:var(--muted);font-size:12px}.quarter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quarter-grid label{font-size:11px;font-weight:700;color:#42536a}.quarter-grid input{width:100%;margin-top:6px;padding:9px;border:1px solid #cfd9e6;border-radius:9px}
@media(max-width:700px){.scoperow{position:relative;top:auto;display:block;padding:0 12px 10px}.scoperow .scopebar{padding-left:0;padding-right:0}.header-search{width:100%}.scope-identity{margin-top:0}.quarter-grid{grid-template-columns:1fr 1fr}}
@media print{header,.scoperow,nav,.scope-identity,.toolbar,button{display:none!important}main{padding:0}.page{display:none!important}.page.active{display:block!important}.tablewrap{box-shadow:none;border:0;overflow:visible}table{font-size:10px}}

/* v18 — restore proven WHS/PRM layout and controls */
#attendance .groupgrid{display:block;max-width:980px;margin:0 auto}
#attendance .groupcard{margin:16px 0;padding:0;border-radius:22px;overflow:hidden}
#attendance .groupcard h3{margin:0;padding:18px 22px;font-size:22px;text-transform:uppercase;display:flex;align-items:center;gap:10px}
#attendance .groupcard .add-name-btn{margin:0 18px 18px;width:calc(100% - 36px);background:#fff;color:#2f6fe4;border:1px solid #d5deea}
.old-member-card{margin:14px 18px;padding:18px;border:1px solid #dce4ee;border-radius:18px;background:#fff}
.old-member-main{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:12px}
.old-present{width:34px;height:34px;accent-color:#2847d8}
.old-member-name{font-size:18px;font-weight:750;color:#17233b;overflow-wrap:anywhere}
.old-actions{display:flex;gap:8px;align-items:center}.old-actions button{min-height:42px;padding:8px 12px;border-radius:12px}
.note-btn,.edit-btn{background:#fff;color:#445064;border:1px solid #cfd8e5}.remove-x{width:42px;padding:0!important;border-radius:50%!important;background:#fff1f1!important;color:#d92d2d!important;border:1px solid #ffc9c9!important;font-size:24px!important}
.old-remark{display:none;margin-top:12px}.old-remark.open{display:block}.old-remark input{width:100%;padding:12px;border:1px solid #d4dde8;border-radius:12px;font-size:16px}
.chat-launcher{position:fixed;right:22px;bottom:22px;z-index:80;border-radius:999px;background:#3048d8;color:#fff;border:0;padding:17px 22px;font-size:18px;font-weight:800;box-shadow:0 10px 30px #17233b33}.chat-count{display:none;background:#fff;color:#3048d8;border-radius:999px;padding:2px 7px;margin-left:4px}
.chat-panel{position:fixed;right:22px;bottom:86px;width:min(390px,calc(100vw - 24px));height:min(600px,calc(100vh - 130px));z-index:90;background:#fff;border:1px solid #d8e0ea;border-radius:20px;box-shadow:0 18px 60px #17233b40;overflow:hidden;grid-template-rows:auto auto 1fr auto}.chat-panel:not([hidden]){display:grid}.chat-head{background:#213f6f;color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center}.chat-head small{display:block;opacity:.8;margin-top:3px}.chat-close{background:transparent;color:#fff;border:0;font-size:26px}.chat-conversations{max-height:120px;overflow:auto;border-bottom:1px solid #e5eaf0}.chat-conversations button{display:block;width:100%;text-align:left;background:#fff;color:#17233b;border:0;border-bottom:1px solid #edf1f5;padding:10px 14px}.chat-conversations button.active{background:#edf3ff}.chat-messages{overflow:auto;padding:12px;background:#f7f9fc}.chat-msg{max-width:82%;padding:9px 11px;border-radius:14px;margin:7px 0;background:#fff;border:1px solid #e0e6ef}.chat-msg.mine{margin-left:auto;background:#eaf0ff}.chat-msg small{display:block;color:#7a8494;margin-top:4px}.chat-compose{display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px;border-top:1px solid #e3e8ef}.chat-compose textarea{resize:none;min-height:52px;border:1px solid #cfd8e5;border-radius:12px;padding:10px}
@media(max-width:700px){#attendance .groupcard h3{font-size:19px}.old-member-main{grid-template-columns:48px minmax(0,1fr);}.old-actions{grid-column:1/-1;justify-content:flex-end}.old-member-card{margin:12px}.chat-launcher{right:18px;bottom:18px}.chat-panel{right:12px;bottom:78px}}


/* v19 — phone-specific collapsible WHS/PRM age groups */
.mobile-group-toggle{display:none}
.mobile-group-body{display:block}
@media(max-width:700px){
 #attendance .groupgrid{max-width:none}
 #attendance .groupcard{margin:10px 0;border-radius:16px;background:#fff;border:1px solid #dce4ee;box-shadow:0 4px 16px rgba(23,35,59,.06);overflow:hidden}
 #attendance .groupcard>h3{display:none}
 #attendance .mobile-group-toggle{display:grid;width:100%;grid-template-columns:minmax(0,1fr) auto 26px;align-items:center;gap:8px;text-align:left;background:#fff;color:#17233b;border:0;border-radius:0;padding:15px 16px;min-height:58px;box-shadow:none}
 #attendance .mobile-group-toggle:hover{transform:none;background:#f8fafc;color:#17233b}
 .mobile-group-title{font-size:17px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
 .mobile-group-meta{font-size:13px;font-weight:800;color:#445064;background:#eef2f7;border-radius:999px;padding:5px 9px;white-space:nowrap}
 .mobile-group-chevron{font-size:23px;line-height:1;text-align:center;transition:transform .18s ease}
 #attendance .groupcard:not(.mobile-open) .mobile-group-body{display:none}
 #attendance .groupcard.mobile-open .mobile-group-chevron{transform:rotate(180deg)}
 #attendance .groupcard.mobile-open .mobile-group-toggle{border-bottom:1px solid #e4e9ef;background:#f8fafc}
 #attendance .mobile-group-body{padding:1px 0 4px}
 #attendance .old-member-card{margin:9px 10px;padding:12px;border-radius:14px}
 #attendance .old-member-main{grid-template-columns:42px minmax(0,1fr);gap:8px}
 #attendance .old-present{width:30px;height:30px}
 #attendance .old-member-name{font-size:16px}
 #attendance .old-actions{grid-column:1/-1;justify-content:flex-end;gap:6px}
 #attendance .old-actions button{min-height:36px;padding:6px 10px;border-radius:10px;font-size:13px}
 #attendance .remove-x{width:36px;font-size:21px!important}
 #attendance .groupcard .add-name-btn{margin:4px 10px 10px;width:calc(100% - 20px);min-height:42px}
}


/* ===== v20 Full Feature Parity + Unified Austria Reporting ===== */
.danger{background:#fff;border:1px solid #b42318;color:#b42318}.danger:hover{background:#fff3f2}
.country-attendance-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.country-church-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}.country-church-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.country-church-head h3{margin:0;color:var(--navy)}
.v20-age-summary{margin-top:18px}.v20-age-summary h3{margin-bottom:8px}.protocol-progress{display:inline-flex;align-items:center;gap:6px;font-weight:700}.protocol-hit{color:#087443}.protocol-pending{color:#8a5b00}.notification-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;margin:10px 0;box-shadow:var(--shadow)}.notification-card.unread{border-left:5px solid var(--blue)}.notification-card small{color:var(--muted)}
.transfer-panel{margin-top:20px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:var(--shadow)}.transfer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}.transfer-grid label,.transfer-panel>label{display:flex;flex-direction:column;gap:6px;font-weight:600}.transfer-panel input,.transfer-panel select{width:100%}
.summary-section{margin-top:18px}.summary-section h3{margin:0 0 8px}.country-pill{font-size:12px;font-weight:700;color:var(--navy);background:#edf4fb;padding:5px 9px;border-radius:999px}
.old-member-card.row-sync-pending{outline:2px solid #d39b24}.old-member-card.row-sync-error{outline:2px solid #b42318}.protocol-badge{font-size:11px;font-weight:700;padding:3px 7px;border-radius:999px;background:#eef3f8;color:#334155}
@media(max-width:900px){.country-attendance-grid{grid-template-columns:1fr}.transfer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.transfer-grid{grid-template-columns:1fr}.country-church-panel{padding:10px}.country-church-head{position:sticky;top:0;background:#fff;z-index:3;padding:8px 0}.v20-wide-table{overflow:auto}.v20-wide-table table{min-width:720px}}

/* v20.1 — restore proven five-column WHS/PRM desktop layout.
   Phone layout remains the v19 collapsible one. */
@media (min-width:1200px){
  #attendance .groupgrid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    max-width:none;
    margin:0;
    align-items:start;
  }
  #attendance .groupcard{
    padding:8px;
    border-radius:12px;
    min-width:0;
  }
  #attendance .groupcard>h3{
    margin:0 -8px 5px;
    padding:2px 8px 8px;
    font-size:13px;
  }
  #attendance .mobile-group-toggle{display:none!important}
  #attendance .mobile-group-body{display:block!important;padding:0}
  #attendance .old-member-card{
    margin:0;
    padding:6px 4px;
    border:0;
    border-top:1px solid #e6ebf1;
    border-radius:0;
    background:#fff;
  }
  #attendance .old-member-card:first-child{border-top:0}
  #attendance .old-member-main{
    display:grid;
    grid-template-columns:28px minmax(0,1fr) auto;
    gap:5px;
    min-height:37px;
  }
  #attendance .old-present{width:21px;height:21px}
  #attendance .old-member-name{
    font-size:11px;
    font-weight:750;
    line-height:1.15;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }
  #attendance .old-actions{gap:3px}
  #attendance .old-actions button{
    min-height:28px;
    padding:4px 6px;
    border-radius:7px;
    font-size:10px;
  }
  #attendance .remove-x{
    width:27px!important;
    height:27px!important;
    min-height:27px!important;
    padding:0!important;
    font-size:16px!important;
  }
  #attendance .old-remark{margin-top:5px}
  #attendance .old-remark input{padding:7px;font-size:11px;border-radius:7px}
  #attendance .groupcard .add-name-btn{
    margin:6px 0 0;
    width:100%;
    min-height:31px;
    padding:5px 7px;
    font-size:10px;
  }
  #attendance .summary{
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
}
@media (min-width:701px) and (max-width:1199px){
  /* Keep the former WHS/PRM five-column desktop layout even when the browser window is narrower.
     The age-group strip scrolls horizontally instead of squeezing names letter-by-letter. */
  #attendance .groupgrid{
    display:grid;
    grid-template-columns:repeat(5,minmax(235px,1fr));
    gap:10px;
    max-width:none;
    margin:0;
    overflow-x:auto;
    padding-bottom:8px;
    align-items:start;
  }
  #attendance .groupcard{padding:8px;border-radius:12px;min-width:235px;margin:0}
  #attendance .groupcard>h3{margin:0 -8px 5px;padding:2px 8px 8px;font-size:13px}
  #attendance .mobile-group-toggle{display:none!important}
  #attendance .mobile-group-body{display:block!important;padding:0}
  #attendance .old-member-card{margin:0;padding:6px 4px;border:0;border-top:1px solid #e6ebf1;border-radius:0;background:#fff}
  #attendance .old-member-card:first-child{border-top:0}
  #attendance .old-member-main{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:5px;min-height:37px}
  #attendance .old-present{width:21px;height:21px}
  #attendance .old-member-name{font-size:11px;font-weight:750;line-height:1.15;overflow-wrap:normal;word-break:normal;hyphens:none}
  #attendance .old-actions{gap:3px;white-space:nowrap}
  #attendance .old-actions button{min-height:28px;padding:4px 6px;border-radius:7px;font-size:10px}
  #attendance .remove-x{width:27px!important;height:27px!important;min-height:27px!important;padding:0!important;font-size:16px!important}
  #attendance .groupcard .add-name-btn{margin:6px 0 0;width:100%;min-height:31px;padding:5px 7px;font-size:10px}
  #attendance .summary{grid-template-columns:repeat(6,minmax(110px,1fr));overflow-x:auto}
}
\n/* v20.3 — permanent WHS / PRM / Summaries navigation */
.primary-nav{display:flex;gap:8px;padding:8px 24px;background:#f7faff;border-bottom:1px solid var(--line);overflow-x:auto;position:sticky;top:111px;z-index:17}
.primary-nav button{white-space:nowrap;background:#e8f0f8;color:var(--navy);border:1px solid #d3dfec;border-radius:10px;padding:9px 20px;font-weight:800}
.primary-nav button:hover{background:#dce9f5;transform:none}.primary-nav button.active{background:var(--navy-2);color:#fff;border-color:var(--navy-2)}
#nav{top:160px}
@media(max-width:1100px){#nav{top:160px}}
@media(max-width:700px){.primary-nav{position:relative;top:auto;padding:8px 12px;gap:7px}.primary-nav button{flex:1;min-width:max-content;padding:10px 16px}#nav{top:auto}.dashboard-note{margin-bottom:0}}
@media print{.primary-nav{display:none!important}}


/* v20.4 — universal clean export menu */
.module-row{display:flex;align-items:stretch;background:#f7faff;border-bottom:1px solid var(--line);position:sticky;top:111px;z-index:18}
.module-row .primary-nav{flex:1;position:static;border-bottom:0}
.global-export{position:relative;display:flex;align-items:center;padding:7px 24px 7px 6px}
.export-main{white-space:nowrap;background:#fff!important;color:var(--navy)!important;border:1px solid #cbd8e6!important;border-radius:10px!important;padding:9px 15px!important;font-weight:800!important;min-height:40px}
.export-menu{position:absolute;right:24px;top:calc(100% - 2px);width:180px;background:#fff;border:1px solid #cfd9e6;border-radius:10px;box-shadow:0 14px 35px rgba(20,44,72,.18);padding:6px;z-index:1000}
.export-menu[hidden]{display:none!important}.export-menu button{display:block;width:100%;text-align:left;background:#fff;color:var(--navy);border:0;border-radius:7px;padding:10px 12px;font-weight:750}.export-menu button:hover{background:#eef4fa;transform:none}
@media(max-width:700px){.module-row{position:relative;top:auto}.module-row .primary-nav{padding-right:4px}.global-export{padding:7px 12px 7px 2px}.export-main{padding:10px 12px!important}.export-menu{right:12px}.module-row{overflow:visible}}
@media print{.module-row,.global-export{display:none!important}}

/* v20.5 — Austria-only country attendance accordion, active on desktop and mobile. */
#attendance .country-church-panel .country-age-group{
  margin:10px 0;
  padding:0;
  border:1px solid #dce4ee;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:none;
}
#attendance .country-church-panel .country-group-toggle{
  display:grid;
  width:100%;
  grid-template-columns:minmax(0,1fr) auto 26px;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  min-height:50px;
  text-align:left;
  background:#fff;
  color:#17233b;
  border:0;
  border-radius:0;
  box-shadow:none;
}
#attendance .country-church-panel .country-group-toggle:hover{transform:none;background:#f8fafc;color:#17233b}
#attendance .country-church-panel .country-group-body{display:none;padding:2px 4px 8px}
#attendance .country-church-panel .country-group-open .country-group-body{display:block}
#attendance .country-church-panel .country-group-open .country-group-toggle{background:#f8fafc;border-bottom:1px solid #e4e9ef}
#attendance .country-church-panel .country-group-chevron{font-size:22px;line-height:1;text-align:center;transition:transform .18s ease}
#attendance .country-church-panel .country-group-open .country-group-chevron{transform:rotate(180deg)}
#attendance .country-church-panel .country-age-group .old-member-card{margin:6px 4px}
#attendance .country-church-panel .country-age-group .add-name-btn{margin:6px 4px 2px;width:calc(100% - 8px)}
@media(max-width:700px){
 #attendance .country-church-panel .country-group-toggle{padding:14px 12px;min-height:56px}
 #attendance .country-church-panel .country-group-body{padding:2px 0 6px}
}

/* v20.6 continuous fiscal-year dashboard */
.dashboard-period{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:16px 0}
.dashboard-period label{display:grid;gap:6px;font-weight:600;min-width:180px}
.dashboard-period select{width:100%;padding:10px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;font:inherit}
@media(max-width:600px){.dashboard-period{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dashboard-period label{min-width:0;font-size:13px}}

/* v20.8 Dashboard MIS intelligence */
.dashboard-intel{margin-top:18px}.intel-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 10px}.intel-heading h3,.intel-card h3{margin:0;color:var(--navy)}.intel-heading p{margin:4px 0 0;color:var(--muted);font-size:12px}.intel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.trend-card,.intel-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:15px}.trend-card{display:flex;flex-direction:column;gap:4px}.trend-card b{font-size:19px;color:var(--navy)}.trend-card span{font-size:11px;color:var(--muted);font-weight:700}.intel-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.intel-card h3{font-size:15px;margin-bottom:10px}.intel-list,.attention-list{list-style:none;padding:0;margin:0}.intel-list li,.attention-list li{padding:8px 0;border-bottom:1px solid #edf1f5}.intel-list li:last-child,.attention-list li:last-child{border-bottom:0}.intel-list li{display:flex;flex-direction:column;gap:2px}.intel-list li b{font-size:12px}.intel-list li span,.attention-list li{font-size:11px;color:var(--muted)}.intel-list .threshold b{color:#245744}.mini-metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-metrics div,.age-snapshot-grid div{background:#f5f8fc;border-radius:10px;padding:12px}.mini-metrics b,.age-snapshot-grid b{display:block;font-size:22px;color:var(--navy)}.mini-metrics span,.age-snapshot-grid span{font-size:10px;text-transform:uppercase;font-weight:800;color:var(--muted)}.good-state{font-size:12px;color:#245744;font-weight:700}.age-snapshot{margin-bottom:20px}.age-snapshot-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.age-snapshot-grid div{text-align:center}
@media(max-width:800px){.intel-columns{grid-template-columns:1fr}.intel-grid{grid-template-columns:1fr 1fr 1fr}.age-snapshot-grid{grid-template-columns:repeat(5,minmax(76px,1fr));overflow-x:auto}.trend-card{padding:11px}.trend-card b{font-size:15px}.trend-card span{font-size:9px}}


/* v20.9 — iPhone sticky expanded age-group header.
   The selected WHS/PRM age-group tab stays reachable while scrolling its names,
   then naturally releases at the end of that group. */
@media(max-width:700px){
  #attendance .groupcard.mobile-open{overflow:visible}
  #attendance .groupcard.mobile-open .mobile-group-toggle{
    position:sticky;
    top:0;
    z-index:24;
    box-shadow:0 5px 14px rgba(23,35,59,.12);
  }
}

/* v20.10 — light navy sticky iPhone age-group header */
@media(max-width:700px){
  #attendance .groupcard.mobile-open .mobile-group-toggle{
    background:#dbe8f6;
    color:#173a63;
    border-bottom-color:#c3d7ec;
  }
  #attendance .groupcard.mobile-open .mobile-group-toggle:hover{
    background:#dbe8f6;
    color:#173a63;
  }
}

/* v20.11 — slightly darker navy sticky iPhone age-group header */
@media(max-width:700px){
  #attendance .groupcard.mobile-open .mobile-group-toggle{
    background:#b8cee6;
    color:#123a67;
    border-bottom-color:#9fbad8;
  }
  #attendance .groupcard.mobile-open .mobile-group-toggle:hover{
    background:#b8cee6;
    color:#123a67;
  }
}

/* v20.14 — Membership intelligence + protected DOB editor */
.smart-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.action-title{display:flex;align-items:center;justify-content:space-between}.action-badge{min-width:30px;height:30px;padding:0 9px;border-radius:999px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800}.health-score{display:flex;align-items:baseline;gap:7px;margin-bottom:8px}.health-score b{font-size:30px;color:var(--navy)}.health-score span{font-size:11px;text-transform:uppercase;font-weight:800;color:var(--muted)}
.member-dialog{width:min(720px,calc(100vw - 24px));border:0;border-radius:16px;padding:0;box-shadow:0 24px 70px rgba(0,0,0,.28)}.member-dialog::backdrop{background:rgba(15,23,42,.55)}.member-dialog form{padding:18px}.dialog-head{display:flex;justify-content:space-between;gap:14px;align-items:start}.dialog-head h3{margin:0;color:var(--navy)}.dialog-head p{margin:4px 0 14px;color:var(--muted);font-size:12px}.member-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.member-form-grid label{display:grid;gap:6px;font-weight:700;font-size:12px}.member-form-grid input,.member-form-grid select{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit}.dialog-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
@media(max-width:700px){.smart-action-grid{grid-template-columns:1fr}.member-dialog{width:calc(100vw - 16px)}.member-dialog form{padding:14px}.member-form-grid{grid-template-columns:1fr}.dialog-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}.member-edit-btn{min-height:38px}}
/* v20.15 actionable MIS dashboard */
.action-links{display:flex;flex-direction:column}.action-links button{appearance:none;border:0;border-bottom:1px solid #edf1f5;background:transparent;padding:10px 2px;display:grid;grid-template-columns:28px 1fr 18px;gap:6px;align-items:center;text-align:left;color:var(--muted);cursor:pointer;font:inherit}.action-links button:last-child{border-bottom:0}.action-links button:hover,.action-links button:focus{background:#f5f8fc;outline:none}.action-links button b{color:var(--navy);font-size:12px}.action-links button span{font-size:11px}.action-links button i{font-style:normal;font-size:20px;color:var(--navy);text-align:right}.action-badge{cursor:pointer}.membership-total-grid{grid-template-columns:repeat(3,1fr)}.record-health{display:flex;align-items:baseline;gap:7px;margin-bottom:8px}.record-health>b{font-size:28px;color:var(--navy)}.record-health>span{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--muted)}
/* v20.17 — dashboard WHS infographics + clickable intelligence */
.dashboard-whs-charts{margin-top:18px}.dashboard-chartgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-chartgrid .chartcard{min-height:320px}.dashboard-chartgrid canvas{height:245px!important}.clickable-intel{cursor:pointer}.clickable-intel:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(15,35,70,.10)}.intel-list li.clickable-intel,.attention-list li.clickable-intel{border-radius:10px;padding:8px}.membership-total-grid>div.clickable-intel{border-radius:12px;padding:8px}@media(max-width:800px){.dashboard-chartgrid{grid-template-columns:1fr}.dashboard-chartgrid .chartcard{min-height:300px}}

/* v20.19 — exact date in Upcoming Changes */
.upcoming-effective-date{display:block;margin-top:5px;font-size:.92rem;color:#46566d}
.upcoming-effective-date strong{color:#173f69;font-weight:700}


/* v20.20 — Back control, draggable chat, clickable Membership totals */
.membership-back{margin:0 0 12px;min-height:42px;padding:9px 15px}
.membership-stat-link{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.membership-stat-link:hover,.membership-stat-link:focus{transform:translateY(-1px);box-shadow:0 8px 22px rgba(15,35,70,.12);outline:2px solid rgba(30,92,145,.18)}
.chat-launcher{touch-action:none;user-select:none;-webkit-user-select:none}
@media(max-width:700px){.membership-back{position:sticky;top:4px;z-index:30;background:#eef3f9;color:#173f69}}


/* v20.21 — clearer Back button, compact draggable CHAT, Membership Records last on iPhone */
.membership-back{background:#1f5d91!important;color:#fff!important;border:2px solid #174b77!important;font-weight:800!important;box-shadow:0 4px 12px rgba(23,63,105,.18)}
.membership-back:hover,.membership-back:focus{background:#174b77!important;color:#fff!important;outline:3px solid rgba(31,93,145,.18)}
.chat-launcher{padding:11px 15px!important;font-size:14px!important;min-height:42px!important;box-shadow:0 7px 20px rgba(23,35,59,.20)!important}
@media(max-width:700px){
  .membership-back{top:6px!important;padding:10px 16px!important}
  .chat-launcher{padding:9px 13px!important;font-size:13px!important;min-height:38px!important;right:12px;bottom:12px}
  #home>.membership-records-card{margin-top:18px;margin-bottom:18px}
}


/* v20.22 — requested dashboard row order */
.dashboard-row{margin-top:18px}.dashboard-membership-row>.intel-card{width:100%}.dashboard-monthly-row .stats{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-action-row{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}.membership-records-card{margin-top:18px;margin-bottom:18px}
@media(max-width:700px){.dashboard-monthly-row .stats{grid-template-columns:1fr}.dashboard-action-row{grid-template-columns:1fr}.membership-records-card{margin-top:18px!important;margin-bottom:18px!important}}

/* v20.23 — iPhone/mobile dashboard custom order */
.dashboard-mobile-handle{display:none}
@media(max-width:700px){
  #home.mobile-dashboard-editable .mobile-sortable-card{position:relative;touch-action:pan-y}
  #home.mobile-dashboard-editable .dashboard-mobile-handle{display:flex;align-items:center;justify-content:center;gap:7px;width:max-content;max-width:100%;margin:8px 0 10px auto;padding:7px 11px;border:1px solid #b8c8dc;border-radius:999px;background:#eef4fb;color:#17365d;font-size:12px;font-weight:800;letter-spacing:.01em;user-select:none;-webkit-user-select:none;touch-action:none;cursor:grab}
  #home.mobile-dashboard-editable .dashboard-mobile-handle:before{content:'↕'}
  #home.mobile-dashboard-editable .mobile-sortable-card.dashboard-dragging{opacity:.72;transform:scale(.985);box-shadow:0 12px 28px rgba(15,35,70,.18);z-index:20}
  #home.mobile-dashboard-editable .mobile-sortable-card.dashboard-drop-before{border-top:3px solid #17365d;padding-top:8px}
  #home .dashboard-action-row.mobile-split{display:contents}
  #home .dashboard-action-row.mobile-split>article{margin-top:18px}
}

/* v20.24 — Membership AGN sections mirror WHS iPhone collapse + sticky behavior */
.membership-agn-toggle{display:none}
.membership-agn-body{display:block;overflow-x:auto}
@media(max-width:700px){
  #pis .membership-agn-section{margin:10px 0;border:1px solid #dce4ee;border-radius:16px;background:#fff;box-shadow:0 4px 16px rgba(23,35,59,.06);overflow:hidden}
  #pis .membership-agn-desktop-title{display:none}
  #pis .membership-agn-toggle{display:grid;width:100%;grid-template-columns:minmax(0,1fr) auto 26px;align-items:center;gap:8px;text-align:left;background:#fff;color:#17233b;border:0;border-radius:0;padding:15px 16px;min-height:58px;box-shadow:none}
  #pis .membership-agn-toggle:hover{transform:none}
  #pis .membership-agn-title{font-size:17px;font-weight:800;letter-spacing:.02em}
  #pis .membership-agn-count{font-size:13px;font-weight:800;color:#445064;background:#eef2f7;border-radius:999px;padding:5px 9px;white-space:nowrap}
  #pis .membership-agn-chevron{font-size:23px;line-height:1;text-align:center;transition:transform .18s ease}
  #pis .membership-agn-section:not(.mobile-open) .membership-agn-body{display:none}
  #pis .membership-agn-section.mobile-open{overflow:visible}
  #pis .membership-agn-section.mobile-open .membership-agn-chevron{transform:rotate(180deg)}
  #pis .membership-agn-section.mobile-open .membership-agn-toggle{position:sticky;top:0;z-index:24;background:#b8cee6;color:#123a67;border-bottom:1px solid #9fbad8;box-shadow:0 5px 14px rgba(23,35,59,.12)}
  #pis .membership-agn-section.mobile-open .membership-agn-toggle:hover{background:#b8cee6;color:#123a67}
  #pis .membership-agn-body{overflow-x:auto;-webkit-overflow-scrolling:touch}
  #pis .membership-agn-body table{margin:0;min-width:760px}
}


/* v20.25 — CHAT lives in the sticky app header and never covers page content */
header .chat-launcher{
  position:static!important;
  inset:auto!important;
  flex:0 0 auto;
  margin:0!important;
  padding:8px 13px!important;
  min-height:36px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:10px!important;
  background:#fff!important;
  color:var(--navy)!important;
  font-size:12px!important;
  font-weight:850!important;
  box-shadow:none!important;
  touch-action:manipulation!important;
  user-select:auto!important;
  -webkit-user-select:auto!important;
}
header .chat-launcher:hover,header .chat-launcher:focus{background:#edf3f8!important;color:var(--navy)!important;transform:none!important}
header .chat-launcher .chat-count{background:var(--navy)!important;color:#fff!important}
.chat-panel{top:74px!important;right:16px!important;bottom:auto!important;max-height:calc(100vh - 88px)!important}
/* Contrast fallback if CHAT is ever placed on a white header/surface. */
.white-surface .chat-launcher,.surface-white .chat-launcher{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
.white-surface .chat-launcher .chat-count,.surface-white .chat-launcher .chat-count{background:#fff!important;color:var(--navy)!important}
/* v20.29 — single authoritative app-header system.
   All v20.25-v20.28 header positioning/visibility overrides were removed. */
html,body{max-width:100%;overflow-x:hidden}
#app{width:100%;max-width:100%;overflow-x:clip}
#app > header{
  position:fixed!important;
  top:0!important;left:0!important;right:0!important;
  width:100%!important;max-width:100vw!important;box-sizing:border-box!important;
  margin:0!important;
  transform:translate3d(0,0,0)!important;
  transition:none!important;
  z-index:1000!important;
}
@media(max-width:700px){
  #app > header{
    padding:12px 82px 12px 16px!important;
    transition:transform .18s ease-out!important;
    will-change:transform;
  }
  #app > header.mobile-header-hidden{transform:translate3d(0,-110%,0)!important}
  #app > header.mobile-header-visible{transform:translate3d(0,0,0)!important}
  header .brand,header .user{min-width:0;max-width:100%}
  header .brand h1,header .brand small,header #userChip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  header .chat-launcher{position:absolute!important;right:12px!important;top:12px!important;max-width:68px!important;padding:8px 11px!important;min-height:34px!important}
  .scoperow,.module-row,nav,.primary-nav{max-width:100%;width:100%}
  .header-search{min-width:0!important;max-width:100%!important}
  main{max-width:100%;overflow-x:clip}
  .chat-panel{left:8px!important;right:8px!important;width:auto!important;max-width:none!important;top:8px!important;height:calc(100dvh - 16px)!important;max-height:none!important;z-index:1100!important}
}
@media(min-width:701px){
  #app > header{transform:none!important;transition:none!important}
}


/* v20.31 — DESKTOP-ONLY frozen navigation stack.
   Mobile/iPhone intentionally has NO sticky/fixed app header or navigation rows. */
@media (max-width:700px){
  #app{padding-top:0!important;overflow-x:clip}
  #app > header,
  #app > .scoperow,
  #app > .module-row,
  #app > nav#nav{
    position:static!important;
    top:auto!important;left:auto!important;right:auto!important;
    width:auto!important;max-width:100%!important;
    transform:none!important;transition:none!important;
    will-change:auto!important;
  }
  #app > header{margin:0!important;padding:14px 82px 14px 16px!important}
  #app > header.mobile-header-hidden,
  #app > header.mobile-header-visible{transform:none!important}
  #app > .scoperow{padding-right:12px}
  #app > .module-row{overflow:visible}
  #app > nav#nav{padding-left:12px;padding-right:12px}
}

@media (min-width:701px){
  #app{
    --v2031-header-h:0px;
    --v2031-scope-h:0px;
    --v2031-module-h:0px;
    --v2031-nav-h:0px;
    padding-top:calc(var(--v2031-header-h) + var(--v2031-scope-h) + var(--v2031-module-h) + var(--v2031-nav-h))!important;
  }
  #app > header{
    position:fixed!important;top:0!important;left:0!important;right:0!important;
    width:100%!important;max-width:none!important;z-index:1004!important;
    transform:none!important;transition:none!important;
  }
  #app > .scoperow{
    position:fixed!important;
    top:var(--v2031-header-h)!important;left:0!important;right:0!important;
    width:100%!important;z-index:1003!important;
  }
  #app > .module-row{
    position:fixed!important;
    top:calc(var(--v2031-header-h) + var(--v2031-scope-h))!important;
    left:0!important;right:0!important;width:100%!important;z-index:1002!important;
  }
  #app > nav#nav{
    position:fixed!important;
    top:calc(var(--v2031-header-h) + var(--v2031-scope-h) + var(--v2031-module-h))!important;
    left:0!important;right:0!important;width:100%!important;z-index:1001!important;
  }
}

/* v20.32 — Dashboard WHS infographics must fit completely inside the viewport/card. */
#home .dashboard-whs-charts,
#home .dashboard-chartgrid,
#home .dashboard-chartgrid .chartcard{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
#home .dashboard-chartgrid{
  width:100%!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  overflow:visible!important;
}
#home .dashboard-chartgrid .chartcard{
  width:100%!important;
  overflow:hidden!important;
}
#home .dashboard-chartgrid .chartcard canvas{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:245px!important;
}
@media(max-width:800px){
  #home .dashboard-chartgrid{grid-template-columns:minmax(0,1fr)!important}
  #home .dashboard-chartgrid .chartcard canvas{height:230px!important}
}

/* v20.33 LG summary totals + mobile FY horizontal scrolling */
.lg-summary-top{margin:0 0 16px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.lg-summary-top h3{margin:0 0 12px;color:var(--navy)}
.lg-summary-top .stats{margin:0}
.lg-fy-scroll{display:block;width:100%;max-width:100%;overflow-x:auto!important;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.lg-fy-scroll table{width:max-content!important;min-width:1120px!important;table-layout:auto!important}
.lg-fy-scroll th,.lg-fy-scroll td{white-space:nowrap}
.lg-fy-scroll th:first-child,.lg-fy-scroll td:first-child{position:sticky;left:0;z-index:2;background:var(--surface)}
.lg-fy-scroll th:first-child{z-index:3;background:#f5f8fb}
@media(max-width:700px){#lgFy{min-width:0!important;max-width:100%!important;overflow:visible!important}.lg-fy-scroll{touch-action:pan-x pan-y}.lg-summary-top .stats{grid-template-columns:1fr!important}}
/* v20.34 — Devo daily checklist */
.lg-devo-wrap table{min-width:max-content}.lg-devo-wrap th,.lg-devo-wrap td{padding:.45rem .38rem;text-align:center}.lg-devo-wrap th:nth-child(2),.lg-devo-wrap td:nth-child(2){position:sticky;left:0;background:var(--card,#fff);z-index:1;text-align:left;min-width:190px}.lg-devo-wrap input[type="checkbox"]{width:20px;height:20px}

/* v20.36 — Smart Devo calendar clarity */
.devo-instruction{margin:10px 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#f8fafc;font-size:.92rem;line-height:1.4}
.devo-range{margin:10px 0 8px;font-weight:700;color:var(--navy)}
.devo-day{min-width:58px;min-height:58px;display:inline-flex;position:relative;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:10px}
.devo-day-wd{font-size:.72rem;font-weight:700;line-height:1;text-transform:none}
.devo-day-num{font-size:1.05rem;font-weight:800;line-height:1.1}
.devo-day-check{position:absolute;right:5px;top:3px;font-size:.75rem;font-weight:900}
@media(max-width:700px){.devo-day{min-width:54px;min-height:56px}.devo-instruction{font-size:.88rem}}

/* v20.37 Dedicated Fiscal Year Overview */
.fy-master-intro{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin:0 0 18px;padding:14px 16px;border:1px solid var(--line,#dbe3ee);border-radius:14px;background:#fff}.fy-master-intro b{font-size:1.15rem}.fy-master-intro small{width:100%;opacity:.72}.fy-master-card{margin:0 0 22px;padding:16px;border:1px solid var(--line,#dbe3ee);border-radius:16px;background:#fff}.fy-master-head h3{margin-top:0}.fy-master-head .stats{margin-bottom:14px}.fy-inline-stats{margin:14px 0}.lg-devo-wrap{margin-bottom:18px}.devo-smart{border:1px solid var(--line,#dbe3ee);border-radius:16px;padding:14px;background:#fff}.devo-smart-head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.devo-smart-title{font-weight:800;font-size:1.05rem}.devo-smart-meta,.devo-instruction,.devo-progress{font-size:.88rem;opacity:.75}.devo-instruction{margin:10px 0}.devo-week-tabs{display:flex;gap:7px;overflow-x:auto;padding-bottom:8px}.devo-week-tab,.devo-today,.devo-day{min-height:44px}.devo-range{font-weight:700;margin:8px 0}.devo-grid{overflow-x:auto}.devo-table .member{min-width:190px;position:sticky;left:0;background:#fff;z-index:1}.devo-day{min-width:54px;width:100%;border-radius:10px}.devo-day-wd,.devo-day-num{display:block}.devo-qualified{display:inline-block;margin-left:7px;font-size:.68rem;font-weight:800}.devo-day.today{outline:2px solid currentColor}.devo-day.checked{font-weight:800}
@media(max-width:700px){.fy-master-card{padding:12px}.fy-master-head .stats{grid-template-columns:repeat(2,minmax(0,1fr))}.devo-table .member{min-width:155px}.devo-day{min-width:50px}}

/* v20.39 — iPhone navigation + reliable horizontal FY scrolling */
@media(max-width:700px){
  /* Secondary navigation must be discoverable without sideways hunting. */
  #app > nav#nav{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    overflow:visible!important;
    white-space:normal!important;
  }
  #app > nav#nav button{
    flex:0 1 auto!important;
    min-width:0!important;
    padding:9px 11px!important;
    font-size:12px!important;
  }
  #app > nav#nav button[data-page="fiscalyear"]{
    order:-1!important;
    flex:1 0 100%!important;
    font-size:14px!important;
    font-weight:800!important;
  }

  /* Do not let parent clipping suppress touch scrolling inside wide FY tables. */
  #lgFy,.fy-master-card,.fy-master-card .tablewrap{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  #lgFy .lg-fy-scroll,
  #fiscalyear .tablewrap{
    display:block!important;
    width:calc(100vw - 48px)!important;
    max-width:calc(100vw - 48px)!important;
    overflow-x:scroll!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x!important;
    overscroll-behavior-x:auto!important;
    scrollbar-width:auto!important;
    position:relative!important;
  }
  #lgFy .lg-fy-scroll table{min-width:1180px!important;width:1180px!important}
  #fiscalyear .tablewrap table{min-width:720px!important;width:720px!important}
  #lgFy .lg-fy-scroll:after,
  #fiscalyear .tablewrap:after{
    content:"Swipe left/right to see all months and FY totals";
    display:block;
    position:sticky;
    left:8px;
    width:max-content;
    padding:7px 9px;
    font-size:11px;
    font-weight:700;
    opacity:.65;
  }

  /* Devo must be a visible, touch-scrollable section on GGN Report. */
  #lgCurrent > h3:nth-of-type(2){
    margin-top:24px!important;
    padding-top:16px!important;
    border-top:2px solid var(--line)!important;
    color:var(--navy)!important;
    font-size:20px!important;
  }
  #lgDevo{
    display:block!important;
    width:calc(100vw - 48px)!important;
    max-width:calc(100vw - 48px)!important;
    overflow:visible!important;
  }
  #lgDevo .devo-smart{display:block!important;width:100%!important;box-sizing:border-box!important}
  #lgDevo .devo-grid{display:block!important;width:100%!important;max-width:100%!important;overflow-x:scroll!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important}
  #lgDevo .devo-table{width:max-content!important;min-width:560px!important}
}


/* v20.40 — iPhone hard fix: Devo visibility and real touch-scroll FY tables */
#lgDevoTitle{display:block!important;margin:24px 0 8px!important;color:var(--navy)!important}
#lgDevoNote{display:block!important;margin:0 0 10px!important}
#lgDevo{display:block!important;visibility:visible!important;opacity:1!important}
@media(max-width:700px){
  #lgDevoTitle{font-size:20px!important;border-top:2px solid var(--line)!important;padding-top:18px!important}
  #lgDevo{width:100%!important;max-width:100%!important;overflow:visible!important}
  #lgFy .lg-fy-scroll,#fiscalyear .tablewrap{overflow-x:auto!important;overflow-y:hidden!important;touch-action:auto!important;-webkit-overflow-scrolling:touch!important;isolation:isolate!important}
  #lgFy .lg-fy-scroll table{width:1250px!important;min-width:1250px!important}
  #fiscalyear .tablewrap table{width:760px!important;min-width:760px!important}
}

/* v20.52 — independent WHS/PRM age-group scrolling + wider attendance workspace */
@media (min-width:701px){
  main{max-width:1920px;width:100%;padding-left:16px;padding-right:16px}
  #attendance{width:100%}
  #attendance .groupgrid{width:100%;max-width:none}
  #attendance .groupcard{min-width:0}
  #attendance .groupcard .mobile-group-body{
    display:block!important;
    max-height:calc(100vh - 315px);
    min-height:280px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    -webkit-overflow-scrolling:touch;
  }
  #attendance .groupcard .add-name-btn{position:sticky;bottom:0;z-index:2;background:#fff}
}
@media (min-width:1200px){
  #attendance .groupgrid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
}

/* v20.55 persistent First-Timer / Visitor origin label */
.registration-carry-note{display:block;margin-top:3px;font-size:11px;font-weight:700;opacity:.72;line-height:1.2}

/* v20.63 — Devo mobile vertical page-scroll fix
   Do not lock touch gestures inside the horizontally scrollable Devo grid to pan-x.
   Safari can now pass vertical swipes to the page while retaining native horizontal scrolling. */
@media(max-width:700px){
  #lgDevo,
  #lgDevo .devo-smart,
  #lgDevo .devo-grid,
  #lgDevo .devo-table,
  #lgDevo .devo-table th,
  #lgDevo .devo-table td,
  #lgDevo .devo-day{
    touch-action:auto!important;
  }
  #lgDevo .devo-grid{
    overflow-x:auto!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain;
  }
}

/* v20.64 — Devo equal date-column width fix
   Keep every visible Devo day column the same width on desktop and mobile.
   The member column remains independent/sticky; horizontal scrolling is preserved. */
#lgDevo .devo-table{
  table-layout:fixed!important;
}
#lgDevo .devo-table th:not(.member),
#lgDevo .devo-table td:not(.member){
  width:72px!important;
  min-width:72px!important;
  max-width:72px!important;
  box-sizing:border-box!important;
}
#lgDevo .devo-table .devo-day{
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  box-sizing:border-box!important;
}
@media(max-width:700px){
  #lgDevo .devo-table th:not(.member),
  #lgDevo .devo-table td:not(.member){
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
  }
  #lgDevo .devo-table .devo-day{
    width:50px!important;
    min-width:50px!important;
    max-width:50px!important;
  }
}

/* v20.65 — Devo mobile horizontal layer fix
   The Member column stays frozen on the left. Every date column, including the
   first visible day, belongs to the same horizontal scrolling layer and passes
   underneath the Member column instead of overlapping its text. */
#lgDevo .devo-table th.member,
#lgDevo .devo-table td.member{
  position:sticky!important;
  left:0!important;
  background:#fff!important;
  background-clip:padding-box!important;
  z-index:8!important;
}
#lgDevo .devo-table th.member{
  z-index:9!important;
}
#lgDevo .devo-table th:not(.member),
#lgDevo .devo-table td:not(.member){
  position:relative!important;
  left:auto!important;
  z-index:0!important;
}
#lgDevo .devo-table .devo-day{
  z-index:0!important;
}
