/* JanCares 2026 desktop-like mobile shell — shared member/admin. */
/* Loaded AFTER workspace styles so the permanent left-side menu wins over the old bottom nav. */
:root{--jc-side-desktop:238px;--jc-side-tablet:208px;--jc-side-mobile:78px;--jc-mobile-navy:#12386e}
html,body{max-width:100%;overflow-x:clip}
:where(.shell,.shell .main,.shell .side,.shell .workspace-view,.shell .jc-member-view){min-width:0}
body.admin-authenticated .shell,body.member-authenticated .shell{display:grid!important;grid-template-columns:var(--jc-side-desktop) minmax(0,1fr)!important;width:100%;min-height:100dvh;align-items:stretch}
body.admin-authenticated .side,body.member-authenticated .side{
 display:block!important;grid-column:1;grid-row:1;position:sticky!important;top:0!important;
 height:100dvh!important;max-height:100dvh;overflow-y:auto;overflow-x:hidden;
 padding:24px 14px!important;background:linear-gradient(177deg,#144a9d 0%,#12376b 52%,#122544 100%)!important;
 box-shadow:2px 0 15px #0c32781b;z-index:52;overscroll-behavior:contain;scrollbar-width:thin
}
body.admin-authenticated .main,body.member-authenticated .main{
 grid-column:2;grid-row:1;min-width:0;max-width:none!important;width:100%!important;
 margin:0!important;padding:27px clamp(17px,2.6vw,36px) calc(60px + env(safe-area-inset-bottom))!important;
 background:#f9fbff;min-height:100dvh;overflow-wrap:break-word
}
body.admin-authenticated .bottom,body.member-authenticated .bottom{display:none!important}
body.admin-authenticated .side .brand,body.member-authenticated .side .brand{color:#fff!important;font-weight:850;letter-spacing:-.04em;padding:0 8px!important}
body.admin-authenticated .side .brand small,body.member-authenticated .side .brand small{color:#d1e4ff!important}
body.admin-authenticated .side .nav,body.member-authenticated .side .nav{
 display:grid!important;grid-template-columns:minmax(0,1fr);flex-direction:column!important;
 overflow:visible!important;gap:5px!important;margin-top:21px!important;padding:0!important
}
body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button{
 display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
 text-align:left!important;gap:11px!important;width:100%!important;min-width:0;
 min-height:48px!important;padding:10px 12px!important;white-space:normal!important;
 border:1px solid transparent!important;border-radius:12px!important;color:#e1ecff!important;
 background:transparent!important;font-size:13px!important;font-weight:680!important;
 transition:background-color 135ms ease,color 135ms ease,border-color 135ms ease!important
}
body.admin-authenticated .side .nav button.active,body.member-authenticated .side .nav button.active{
 background:#ffffff!important;color:#124eae!important;border-color:#e4efff!important;
 box-shadow:0 3px 14px #06192c1a!important
}
body.admin-authenticated .side .nav button:not(.active):hover,body.member-authenticated .side .nav button:not(.active):hover{background:#ffffff1c!important;color:#fff!important}
.jc-nav-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:22px;font-size:20px;line-height:1.2}
.jc-nav-label{font-size:inherit;line-height:1.23;overflow-wrap:anywhere}
.jc-nav-trigger{display:none}
.jc-nav-backdrop[hidden]{display:none!important}
.jc-nav-backdrop{border:0;padding:0;margin:0;position:fixed;inset:0;background:rgba(4,17,34,.53);z-index:69;touch-action:manipulation;cursor:pointer}
body.admin-authenticated .top,body.member-authenticated .top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
body.admin-authenticated .top .eyebrow,body.member-authenticated .top .eyebrow{font-size:11px;color:#56779c}
body.admin-authenticated .top h1,body.member-authenticated .top h1{font-size:clamp(22px,3vw,32px)}
body.admin-authenticated .jc-2026-guide,body.member-authenticated .jc-2026-guide,
body.admin-authenticated .panel,body.member-authenticated .panel{border-color:#dfebfb;box-shadow:0 6px 21px #143c7f08}
body.admin-authenticated .stat,body.member-authenticated .stat{background:#fff;border-color:#e1ebf8!important}
body.admin-authenticated .workspace-view,body.member-authenticated .jc-member-view{min-width:0}
body.admin-authenticated .side button:focus-visible,body.member-authenticated .side button:focus-visible,
.jc-nav-trigger:focus-visible{outline:3px solid #ffda65!important;outline-offset:3px!important}
@media(max-width:920px){
 body.admin-authenticated .shell,body.member-authenticated .shell{display:grid!important;grid-template-columns:var(--jc-side-tablet) minmax(0,1fr)!important}
 body.admin-authenticated .side,body.member-authenticated .side{
  display:block!important;position:sticky!important;top:0!important;height:100dvh!important;
  padding:19px 10px!important;border-bottom:0!important;overflow-y:auto!important
 }
 body.admin-authenticated .side .nav,body.member-authenticated .side .nav{display:grid!important;overflow:visible!important;margin-top:20px!important}
 body.admin-authenticated .main,body.member-authenticated .main{padding:19px 16px calc(42px + env(safe-area-inset-bottom))!important}
 body.admin-authenticated .bottom,body.member-authenticated .bottom{display:none!important}
 body.admin-authenticated .workspace-view .layout,body.member-authenticated .jc-member-view .layout{grid-template-columns:1fr}
}
@media(max-width:600px){
 body.admin-authenticated .shell,body.member-authenticated .shell{
  display:grid!important;grid-template-columns:var(--jc-side-mobile) minmax(0,1fr)!important
 }
 body.admin-authenticated .side,body.member-authenticated .side{
  grid-column:1!important;position:sticky!important;top:0!important;
  width:var(--jc-side-mobile)!important;height:100dvh!important;
  padding:11px 5px calc(22px + env(safe-area-inset-bottom))!important;
  border-radius:0!important;border:0!important;overflow-y:auto!important;
  transition:width 135ms ease,box-shadow 135ms ease!important
 }
 body.admin-authenticated .main,body.member-authenticated .main{
  grid-column:2!important;margin:0!important;width:100%!important;min-width:0!important;
  padding:17px 11px calc(44px + env(safe-area-inset-bottom))!important
 }
 body.admin-authenticated .side .brand,body.member-authenticated .side .brand{display:none!important}
 .jc-nav-trigger{
  display:flex!important;align-items:center;justify-content:center;
  width:52px;min-height:48px;padding:0;margin:3px auto 9px;
  border:1px solid #ffffff35;border-radius:13px;color:white;background:#ffffff1a;
  font-size:23px;cursor:pointer;touch-action:manipulation
 }
 body.admin-authenticated .side .nav,body.member-authenticated .side .nav{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;overflow:visible!important;
  gap:6px!important;margin-top:5px!important;padding:0!important
 }
 body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:4px!important;min-height:63px!important;width:100%!important;max-width:100%;
  padding:8px 3px!important;font-size:10px!important;border-radius:11px!important;white-space:normal!important
 }
 body.admin-authenticated .side .nav .jc-nav-icon,body.member-authenticated .side .nav .jc-nav-icon{
  min-width:auto;font-size:21px
 }
 body.admin-authenticated .side .nav .jc-nav-label,body.member-authenticated .side .nav .jc-nav-label{
  text-align:center!important;font-size:10px!important;font-weight:750!important;line-height:1.14!important;
  word-break:normal
 }
 body.admin-authenticated .side.jc-expanded,body.member-authenticated .side.jc-expanded{
  position:fixed!important;left:0!important;top:0!important;bottom:0!important;
  width:min(262px,82vw)!important;z-index:71!important;box-shadow:10px 0 35px #061c3960!important;
  padding:18px 14px calc(20px + env(safe-area-inset-bottom))!important
 }
 body.admin-authenticated .side.jc-expanded .brand,body.member-authenticated .side.jc-expanded .brand{
  display:block!important;margin:0 0 10px;padding:0 6px!important;font-size:22px!important
 }
 body.admin-authenticated .side.jc-expanded .jc-nav-trigger,body.member-authenticated .side.jc-expanded .jc-nav-trigger{
  margin:0 0 10px auto!important;min-width:44px;min-height:44px
 }
 body.admin-authenticated .side.jc-expanded .nav button,body.member-authenticated .side.jc-expanded .nav button{
  display:flex!important;flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;
  text-align:left!important;min-height:48px!important;padding:10px 12px!important;gap:13px!important;font-size:13px!important
 }
 body.admin-authenticated .side.jc-expanded .nav .jc-nav-label,body.member-authenticated .side.jc-expanded .nav .jc-nav-label{
  text-align:left!important;font-size:13px!important;font-weight:680!important
 }
 body.admin-authenticated .side.jc-expanded .nav .jc-nav-icon,body.member-authenticated .side.jc-expanded .nav .jc-nav-icon{font-size:20px}
 body.admin-authenticated .top h1,body.member-authenticated .top h1{font-size:clamp(20px,6vw,27px)}
 body.admin-authenticated .top .avatar,body.member-authenticated .top .avatar{width:34px;height:34px}
 body.admin-authenticated .jc-admin-identity span,body.member-authenticated .jc-member-identity span{max-width:90px;font-size:10px}
 body.admin-authenticated .stat strong,body.member-authenticated .stat strong{font-size:clamp(17px,5vw,23px)}
 body.admin-authenticated .workspace-view .stats,body.member-authenticated .jc-member-view .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.admin-authenticated .workspace-view .stat:last-child,body.member-authenticated .jc-member-view .stat:last-child{grid-column:span 2}
 body.admin-authenticated .workspace-view .panel,body.member-authenticated .jc-member-view .panel{padding:15px}
 body.admin-authenticated .jc-book-grid,body.member-authenticated .jc-balance-grid{grid-template-columns:minmax(0,1fr)}
 body.admin-authenticated .top,body.member-authenticated .top{margin-bottom:14px!important}
 body.admin-authenticated .main select,body.admin-authenticated .main input,body.admin-authenticated .main textarea,
 body.member-authenticated .main select,body.member-authenticated .main input,body.member-authenticated .main textarea{
  font-size:16px!important;max-width:100%!important
 }
 body.admin-authenticated .main .panel,body.member-authenticated .main .panel{overflow-wrap:anywhere}
 body.admin-authenticated .jc-bank-admin-grid,body.member-authenticated #jcBankDestinations{grid-template-columns:minmax(0,1fr)}
 body.admin-authenticated .main .jc-application-toolbar,body.member-authenticated .main .jc-control-line{flex-wrap:wrap}
}
@media(max-width:370px){
 :root{--jc-side-mobile:69px}
 body.admin-authenticated .side .nav .jc-nav-label,body.member-authenticated .side .nav .jc-nav-label{font-size:9px!important}
 body.admin-authenticated .main,body.member-authenticated .main{padding-inline:9px!important}
 body.admin-authenticated .workspace-view .stats,body.member-authenticated .jc-member-view .stats{grid-template-columns:minmax(0,1fr)}
 body.admin-authenticated .workspace-view .stat:last-child,body.member-authenticated .jc-member-view .stat:last-child{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){
 body.admin-authenticated .side,body.member-authenticated .side,
 body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button{transition:none!important}
}
@media print{
 body.admin-authenticated .shell,body.member-authenticated .shell{display:block!important}
 body.admin-authenticated .side,body.member-authenticated .side,.jc-nav-backdrop,.jc-nav-trigger{display:none!important}
 body.admin-authenticated .main,body.member-authenticated .main{padding:0!important;width:100%!important}
}

/* Follow OS night mode while keeping the native-blue sidebar and real dark surfaces. */
html[data-jc-theme=dark] body.admin-authenticated .main,
html[data-jc-theme=dark] body.member-authenticated .main{background:#0b111b!important;color:#eaf2ff!important}
html[data-jc-theme=dark] body.admin-authenticated .side,
html[data-jc-theme=dark] body.member-authenticated .side{background:linear-gradient(160deg,#142640,#0a1628)!important}
html[data-jc-theme=dark] body.admin-authenticated .stat,
html[data-jc-theme=dark] body.member-authenticated .stat{background:#161f2d!important;color:#eaf2ff!important;border-color:#344359!important}
html[data-jc-theme=dark] body.admin-authenticated .workspace-view .panel,
html[data-jc-theme=dark] body.member-authenticated .jc-member-view .panel{border-color:#2d415a!important}
html[data-jc-theme=dark] body.admin-authenticated .side .nav button.active,
html[data-jc-theme=dark] body.member-authenticated .side .nav button.active{background:#daeaff!important;color:#11386c!important}


/* Allen T-inspired JanCares experience refresh. Purposefully visual-only:
   existing payment, application and authentication handlers remain authoritative. */
:root{--jc-surface:#fff;--jc-canvas:#f3f7fc;--jc-text:#17344f;--jc-muted:#637c95;--jc-outline:#dce7f2;--jc-accent:#147bd0}
body.admin-authenticated .main,body.member-authenticated .main{background:var(--jc-canvas)!important}
body.admin-authenticated .top,body.member-authenticated .top{
 border-bottom:1px solid var(--jc-outline)!important;padding-bottom:18px!important;margin-bottom:22px!important
}
body.admin-authenticated .top h1,body.member-authenticated .top h1{color:var(--jc-text);font-size:clamp(23px,2.8vw,32px)!important;letter-spacing:-.045em}
body.admin-authenticated .hero,body.member-authenticated .hero{
 background:linear-gradient(115deg,#1471d1 0%,#168bd9 52%,#1cb6ce 100%)!important;
 color:#fff!important;box-shadow:0 14px 28px #146db51b!important;
 border:1px solid #ffffff30!important;border-radius:23px!important;min-height:0!important
}
body.admin-authenticated .hero h2,body.member-authenticated .hero h2{color:#fff!important;line-height:1.18}
body.admin-authenticated .hero p,body.member-authenticated .hero p{color:#e2f6ff!important;max-width:560px!important}
body.admin-authenticated .stat,body.member-authenticated .stat,
body.admin-authenticated .panel,body.member-authenticated .panel{
 background:var(--jc-surface);border:1px solid var(--jc-outline)!important;
 border-radius:19px!important;box-shadow:0 6px 18px #163d6709!important;min-width:0
}
body.admin-authenticated .stat strong,body.member-authenticated .stat strong{color:var(--jc-text)}
body.admin-authenticated .panel h3,body.member-authenticated .panel h3{color:var(--jc-text)}
body.admin-authenticated .main input,body.member-authenticated .main input,
body.admin-authenticated .main select,body.member-authenticated .main select,
body.admin-authenticated .main textarea,body.member-authenticated .main textarea{
 box-sizing:border-box!important;width:100%;max-width:100%;min-width:0;
 border-radius:13px;min-height:46px
}
body.admin-authenticated .main input:focus-visible,body.member-authenticated .main input:focus-visible,
body.admin-authenticated .main select:focus-visible,body.member-authenticated .main select:focus-visible,
body.admin-authenticated .main textarea:focus-visible,body.member-authenticated .main textarea:focus-visible{
 outline:2px solid #2984d6!important;outline-offset:2px
}
.jc-display-name-form,.jc-display-name-form label{min-width:0;max-width:100%!important}
.jc-display-name-form input{width:100%!important;max-width:100%!important}
.jc-display-name-form button{max-width:100%;white-space:normal}
#jcAdminProfileDetails p,#jcMemberProfileDetails p{min-width:0;overflow-wrap:anywhere}
#jcAdminProfileDetails p span,#jcMemberProfileDetails p span{min-width:0;overflow-wrap:anywhere}
.jc-drawer-close,.jc-drawer-footer{display:none}
@media(max-width:920px){
 body.admin-authenticated .shell,body.member-authenticated .shell{
  display:block!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;min-height:100dvh!important
 }
 body.admin-authenticated .main,body.member-authenticated .main{
  display:block!important;grid-column:1!important;width:100%!important;max-width:100%!important;
  min-height:100dvh!important;min-width:0!important;margin:0!important;
  padding:0 16px calc(36px + env(safe-area-inset-bottom))!important
 }
 body.admin-authenticated .side,body.member-authenticated .side{
  position:fixed!important;z-index:101!important;top:0!important;bottom:0!important;left:0!important;
  grid-column:auto!important;grid-row:auto!important;height:100dvh!important;max-height:100dvh!important;
  width:min(330px,86vw)!important;border:0!important;border-radius:0!important;
  padding:26px 22px calc(20px + env(safe-area-inset-bottom))!important;
  background:#fff!important;color:#183d60!important;
  box-shadow:18px 0 50px #0c315f18!important;overflow-y:auto!important;
  transform:translate3d(-105%,0,0)!important;
  visibility:hidden!important;pointer-events:none!important;
  transition:transform 180ms cubic-bezier(.2,.8,.2,1),visibility 180ms!important
 }
 body.admin-authenticated .side.jc-expanded,body.member-authenticated .side.jc-expanded{
  transform:translate3d(0,0,0)!important;visibility:visible!important;pointer-events:auto!important;
  width:min(330px,86vw)!important;background:#fff!important;
  box-shadow:18px 0 50px #0c315f38!important
 }
 body.admin-authenticated .side .brand,body.member-authenticated .side .brand,
 body.admin-authenticated .side.jc-expanded .brand,body.member-authenticated .side.jc-expanded .brand{
  display:block!important;font-size:25px!important;color:#143b70!important;
  margin:0 0 20px!important;padding:0!important
 }
 body.admin-authenticated .side .brand small,body.member-authenticated .side .brand small{color:#7e93aa!important;font-size:9px!important;letter-spacing:.14em}
 body.admin-authenticated .side .nav,body.member-authenticated .side .nav{
  display:grid!important;gap:6px!important;margin:12px 0!important;padding:8px 0!important;
  border-top:1px solid #e5eef6!important
 }
 body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button,
 body.admin-authenticated .side.jc-expanded .nav button,body.member-authenticated .side.jc-expanded .nav button{
  display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
  text-align:left!important;gap:13px!important;min-height:53px!important;width:100%!important;
  border:1px solid transparent!important;border-left:3px solid transparent!important;
  border-radius:14px!important;background:transparent!important;color:#56718c!important;
  padding:10px 14px!important;font-size:14px!important;font-weight:660!important
 }
 body.admin-authenticated .side .nav button.active,body.member-authenticated .side .nav button.active{
  color:#0c6bb2!important;background:#eaf5ff!important;border-left-color:#1494d9!important;
  border-top-color:#e3f0fc!important;border-right-color:#e3f0fc!important;border-bottom-color:#e3f0fc!important;
  box-shadow:none!important
 }
 body.admin-authenticated .side .nav .jc-nav-icon,body.member-authenticated .side .nav .jc-nav-icon,
 body.admin-authenticated .side.jc-expanded .nav .jc-nav-icon,body.member-authenticated .side.jc-expanded .nav .jc-nav-icon{
  min-width:23px!important;font-size:22px!important;text-align:center!important
 }
 body.admin-authenticated .side .nav .jc-nav-label,body.member-authenticated .side .nav .jc-nav-label,
 body.admin-authenticated .side.jc-expanded .nav .jc-nav-label,body.member-authenticated .side.jc-expanded .nav .jc-nav-label{
  text-align:left!important;font-size:14px!important;line-height:1.2!important;font-weight:650!important
 }
 body.admin-authenticated .top,body.member-authenticated .top{
  display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:11px!important;
  min-width:0!important;margin:0 -16px 20px!important;padding:13px 16px!important;
  min-height:76px!important;background:#fff!important;border-bottom:1px solid #e1eaf3!important
 }
 body.admin-authenticated .top>div:first-of-type,body.member-authenticated .top>div:first-of-type{
  flex:1;min-width:0!important;overflow:hidden
 }
 body.admin-authenticated .top .eyebrow,body.member-authenticated .top .eyebrow{
  display:block;font-size:10px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#7389a0!important
 }
 body.admin-authenticated .top h1,body.member-authenticated .top h1{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:2px 0!important;
  font-size:clamp(18px,4.8vw,25px)!important
 }
 body.admin-authenticated .top>.avatar,body.member-authenticated .top>.avatar,
 body.admin-authenticated .jc-admin-identity,body.member-authenticated .jc-member-identity{display:none!important}
 .jc-nav-trigger{
  display:inline-flex!important;order:-1;flex:none;align-items:center;justify-content:center;
  width:48px!important;height:48px!important;min-height:48px!important;margin:0!important;
  border:0!important;border-radius:14px!important;background:#f0f6fb!important;
  color:#234c69!important;font-size:23px!important;box-shadow:none!important
 }
 .jc-nav-trigger:active{background:#e0f0ff!important}
 body.admin-authenticated .top .jc-theme-switch,body.member-authenticated .top .jc-theme-switch{
  order:3;flex:none;min-width:40px!important;width:44px!important;height:44px!important;
  padding:0!important;font-size:0!important;border-radius:13px!important
 }
 body.admin-authenticated .top .jc-theme-switch::first-letter,
 body.member-authenticated .top .jc-theme-switch::first-letter{font-size:20px!important}
 .jc-drawer-close{
  display:flex!important;align-items:center;justify-content:center;position:absolute;
  top:21px;right:16px;border:0!important;border-radius:13px;
  width:43px;height:43px;background:#f1f6fb!important;color:#274c69!important;font-size:26px
 }
 .jc-drawer-footer{
  display:grid!important;gap:4px;margin-top:22px;padding:18px 10px;
  border-top:1px solid #e4edf6;font-size:12px;color:#6d8198;overflow-wrap:anywhere
 }
 .jc-drawer-footer strong{color:#1b486f;font-size:13px}
 .jc-nav-backdrop{z-index:100!important;background:rgba(8,24,46,.42)!important;backdrop-filter:blur(2px)}
 body.jc-drawer-open{overflow:hidden!important}
 body.admin-authenticated .bottom,body.member-authenticated .bottom{display:none!important}
 body.admin-authenticated .hero,body.member-authenticated .hero{padding:22px!important;border-radius:22px!important}
 body.admin-authenticated .hero h2,body.member-authenticated .hero h2{font-size:clamp(23px,6vw,29px)!important}
 body.admin-authenticated .hero p,body.member-authenticated .hero p{font-size:13px!important;line-height:1.45!important}
 body.admin-authenticated .stats,body.member-authenticated .stats{gap:11px!important;margin:12px 0 19px!important}
 body.admin-authenticated .stat,body.member-authenticated .stat{padding:16px!important;border-radius:17px!important}
 body.admin-authenticated .stat span,body.member-authenticated .stat span{font-size:12px!important}
 body.admin-authenticated .stat strong,body.member-authenticated .stat strong{font-size:clamp(20px,5vw,26px)!important}
 body.admin-authenticated .panel,body.member-authenticated .panel{padding:18px!important;border-radius:18px!important}
 body.admin-authenticated .jc-display-name-form,body.member-authenticated .jc-display-name-form{width:100%!important;padding:16px!important}
 body.admin-authenticated #jcAdminProfileDetails p,body.member-authenticated #jcMemberProfileDetails p{
  display:grid!important;grid-template-columns:1fr!important;gap:5px!important
 }
 body.admin-authenticated #jcAdminProfileDetails p span,body.member-authenticated #jcMemberProfileDetails p span{
  display:block;text-align:left!important;overflow-wrap:anywhere
 }
}
@media(max-width:600px){
 body.admin-authenticated .shell,body.member-authenticated .shell{grid-template-columns:minmax(0,1fr)!important}
 body.admin-authenticated .main,body.member-authenticated .main{grid-column:1!important;padding:0 14px calc(36px + env(safe-area-inset-bottom))!important}
 body.admin-authenticated .top,body.member-authenticated .top{margin-inline:-14px!important;padding-inline:14px!important}
 body.admin-authenticated .side,body.member-authenticated .side{width:min(330px,86vw)!important}
 body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button{flex-direction:row!important;min-height:53px!important}
 body.admin-authenticated .workspace-view .stats,body.member-authenticated .jc-member-view .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.admin-authenticated .workspace-view .stat:last-child,body.member-authenticated .jc-member-view .stat:last-child{grid-column:auto!important}
 body.admin-authenticated .main input,body.member-authenticated .main input{min-width:0!important}
}
@media(max-width:370px){
 body.admin-authenticated .workspace-view .stats,body.member-authenticated .jc-member-view .stats{grid-template-columns:minmax(0,1fr)!important}
}
@media(prefers-reduced-motion:reduce){
 body.admin-authenticated .side,body.member-authenticated .side{transition:none!important}
}
/* Unauthenticated member entry: light by default, readable in either selected theme. */
body:not(.member-authenticated) .bottom{display:none!important}
#memberOnboarding{max-width:690px!important;margin:0 auto!important;padding:28px 16px 60px!important}
#memberOnboarding .welcome{
 max-width:620px!important;text-align:left!important;background:none!important;
 margin:0 auto 22px!important;padding:5px 3px 0!important;box-shadow:none!important
}
#memberOnboarding .welcome .brand{font-size:29px!important;color:#145fc1!important;letter-spacing:-.05em}
#memberOnboarding .welcome h1{font-size:clamp(23px,5vw,31px)!important;color:#183a59!important;line-height:1.18!important;margin:7px 0!important}
#memberOnboarding .welcome p{color:#63809b!important;line-height:1.5!important;font-size:13px!important}
#memberOnboarding .welcome .jc-theme-switch{margin-top:12px!important}
#memberOnboarding .lock,#memberOnboarding .jc-step{
 background:#fff!important;border:1px solid #dce8f4!important;
 border-radius:22px!important;box-shadow:0 9px 29px #16436e0c!important;
 padding:clamp(19px,4vw,29px)!important;color:#163b59!important;
}
#memberOnboarding .lock h2,#memberOnboarding .jc-step h2{color:#193b59!important;font-size:clamp(20px,5vw,25px)!important;line-height:1.22!important}
#memberOnboarding .lock p,#memberOnboarding .jc-step p{color:#617b95!important;font-size:12px!important;line-height:1.55!important}
#memberOnboarding input:not([type=checkbox]),#memberOnboarding select,#memberOnboarding textarea{
 box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
 min-height:49px!important;padding:12px 14px!important;
 border-radius:12px!important;border:1px solid #cdddea!important;background:#fff!important;color:#163b59!important;
 font-size:16px!important
}
#memberOnboarding input::placeholder,#memberOnboarding textarea::placeholder{color:#7b91a7!important;opacity:1!important}
#memberOnboarding label{color:#315572!important}
#memberOnboarding button:not(.jc-theme-switch){max-width:100%;border-radius:12px}
#memberOnboarding .jc-onboarding-more{background:#f4f8fc!important;color:#456785!important}
#memberOnboarding .jc-onboarding-more summary{color:#17558f!important}
#memberOnboarding .stage{min-width:0!important}
html[data-jc-theme=dark] body:not(.member-authenticated){background:#0b111a!important}
html[data-jc-theme=dark] #memberOnboarding .welcome h1{color:#ecf4ff!important}
html[data-jc-theme=dark] #memberOnboarding .welcome .brand{color:#6faaff!important}
html[data-jc-theme=dark] #memberOnboarding .welcome p{color:#b3c7dd!important}
html[data-jc-theme=dark] #memberOnboarding .lock,
html[data-jc-theme=dark] #memberOnboarding .jc-step{background:#151f2c!important;border-color:#35465d!important;color:#eaf3ff!important;box-shadow:none!important}
html[data-jc-theme=dark] #memberOnboarding .lock h2,
html[data-jc-theme=dark] #memberOnboarding .jc-step h2,
html[data-jc-theme=dark] #memberOnboarding .jc-identity-heading h2{color:#f2f7ff!important}
html[data-jc-theme=dark] #memberOnboarding .lock p,
html[data-jc-theme=dark] #memberOnboarding .jc-step p,
html[data-jc-theme=dark] #memberOnboarding .jc-identity-heading p{color:#b5c9df!important}
html[data-jc-theme=dark] #memberOnboarding input:not([type=checkbox]),
html[data-jc-theme=dark] #memberOnboarding select,
html[data-jc-theme=dark] #memberOnboarding textarea{
 background:#0d1723!important;color:#f0f6ff!important;border-color:#3a5067!important
}
html[data-jc-theme=dark] #memberOnboarding input::placeholder,
html[data-jc-theme=dark] #memberOnboarding textarea::placeholder{color:#a5bbd1!important}
html[data-jc-theme=dark] #memberOnboarding label{color:#d7e8f9!important}
html[data-jc-theme=dark] #memberOnboarding .jc-onboarding-more,
html[data-jc-theme=dark] #memberOnboarding .jc-dash-note,
html[data-jc-theme=dark] #memberOnboarding .jc-resume{background:#1c3047!important;color:#d5e8fc!important;border-color:#36516c!important}
html[data-jc-theme=dark] #memberOnboarding .jc-onboarding-more summary{color:#acd5ff!important}
html[data-jc-theme=dark] #memberOnboarding .jc-dash-note p{color:#c5d7e8!important}
html[data-jc-theme=dark] #memberOnboarding select option{background:#152437!important;color:#eef5ff!important}
/* Dashboard dark mode remains dark, but controls and titles must be legible. */
html[data-jc-theme=dark]{--jc-surface:#151f2c;--jc-canvas:#0b111b;--jc-text:#edf4ff;--jc-muted:#b0c6de;--jc-outline:#35465b}
html[data-jc-theme=dark] body.admin-authenticated .top,
html[data-jc-theme=dark] body.member-authenticated .top{background:#131e2b!important;border-color:#35465b!important}
html[data-jc-theme=dark] body.admin-authenticated .top h1,
html[data-jc-theme=dark] body.member-authenticated .top h1{color:#f1f7ff!important}
html[data-jc-theme=dark] body.admin-authenticated .panel,
html[data-jc-theme=dark] body.member-authenticated .panel,
html[data-jc-theme=dark] body.admin-authenticated .stat,
html[data-jc-theme=dark] body.member-authenticated .stat{background:#151f2c!important;color:#e3eef9!important;border-color:#35465b!important}
html[data-jc-theme=dark] body.admin-authenticated .stat strong,
html[data-jc-theme=dark] body.member-authenticated .stat strong{color:#f0f7ff!important}
html[data-jc-theme=dark] body.admin-authenticated .side,
html[data-jc-theme=dark] body.member-authenticated .side{background:#142235!important;color:#e8f3ff!important}
html[data-jc-theme=dark] body.admin-authenticated .side .brand,
html[data-jc-theme=dark] body.member-authenticated .side .brand{color:#f1f7ff!important}
html[data-jc-theme=dark] body.admin-authenticated .side .nav button,
html[data-jc-theme=dark] body.member-authenticated .side .nav button{color:#b9cde1!important}
html[data-jc-theme=dark] body.admin-authenticated .side .nav button.active,
html[data-jc-theme=dark] body.member-authenticated .side .nav button.active{background:#264b76!important;border-color:#5085b7!important;color:#f1f7ff!important}
html[data-jc-theme=dark] .jc-drawer-footer strong{color:#f3f8ff}
html[data-jc-theme=dark] .jc-drawer-footer{border-color:#36506b;color:#a9bfd5}

/* A compact accessible day/night control in the mobile header. */
@media(max-width:920px){
 body.admin-authenticated .top .jc-theme-switch::before,
 body.member-authenticated .top .jc-theme-switch::before{content:"☾";display:block;font-size:21px!important;line-height:1}
 body.admin-authenticated .top .jc-theme-switch[aria-pressed="true"]::before,
 body.member-authenticated .top .jc-theme-switch[aria-pressed="true"]::before{content:"☀"}
}


/* White Allen T-style desktop navigation and compact member resume state. */
@media(min-width:921px){
 body.admin-authenticated .side,body.member-authenticated .side{
  background:#fff!important;border-right:1px solid #dae6f1!important;
  box-shadow:none!important;color:#1c405f!important
 }
 body.admin-authenticated .side .brand,body.member-authenticated .side .brand{
  color:#123f69!important;font-size:24px!important
 }
 body.admin-authenticated .side .brand small,body.member-authenticated .side .brand small{color:#7c94a9!important}
 body.admin-authenticated .side .nav button,body.member-authenticated .side .nav button{
  color:#526d87!important;font-size:14px!important;font-weight:640!important;
  border-left:3px solid transparent!important
 }
 body.admin-authenticated .side .nav button.active,body.member-authenticated .side .nav button.active{
  background:#eaf5ff!important;border-left-color:#118ad2!important;
  color:#1269ac!important;box-shadow:none!important
 }
 body.admin-authenticated .side .nav button:not(.active):hover,body.member-authenticated .side .nav button:not(.active):hover{
  background:#f1f7fc!important;color:#1a568a!important
 }
 html[data-jc-theme=dark] body.admin-authenticated .side,
 html[data-jc-theme=dark] body.member-authenticated .side{
  background:#152234!important;border-color:#32465a!important
 }
 html[data-jc-theme=dark] body.admin-authenticated .side .brand,
 html[data-jc-theme=dark] body.member-authenticated .side .brand{color:#f0f6ff!important}
 html[data-jc-theme=dark] body.admin-authenticated .side .nav button,
 html[data-jc-theme=dark] body.member-authenticated .side .nav button{color:#b7cbdf!important}
 html[data-jc-theme=dark] body.admin-authenticated .side .nav button.active,
 html[data-jc-theme=dark] body.member-authenticated .side .nav button.active{
  background:#21446d!important;color:#e9f5ff!important
 }
}
#memberOnboarding .jc-resume-signin{
 background:#eaf5ff!important;color:#225b88!important;border:1px solid #c6e2fa!important;
 border-radius:12px!important;padding:11px 13px!important;font-size:12px!important;
 margin:0 0 15px!important;line-height:1.45!important
}
html[data-jc-theme=dark] #memberOnboarding .jc-resume-signin{
 background:#1c3a55!important;border-color:#3f6b8b!important;color:#d9edff!important
}
@media(max-width:600px){
 #memberOnboarding{padding:19px 16px calc(50px + env(safe-area-inset-bottom))!important}
 #memberOnboarding .welcome{margin-bottom:18px!important}
 #memberOnboarding .welcome .brand{font-size:25px!important}
 #memberOnboarding .welcome p{font-size:12px!important}
 #memberOnboarding .lock{margin:0 auto 15px!important}
 #memberOnboarding .lock p{line-height:1.45!important}
}
