/* JOB MONEY STUDIO / INTERNAL FRAME — single shared sidebar/footer/navigation.
   This stylesheet is loaded by both workspace and client desk, LAST. */
:root{--jm-office-navy:#172b46;--jm-office-line:#e2eaf1;--jm-office-orange:#ec761d}
body:has(.jm-desk-grid){font-size:15px;line-height:1.5;background:#f5f7fb;color:#1b2d44;overflow-x:hidden}

/* Exactly one sidebar design on all management views. */
.jm-studio-workspace .sidebar.jm-internal-sidebar,
.jm-desk-grid .sidebar.jm-internal-sidebar{
 width:244px;flex:0 0 244px;background:#172b46;color:#fff;
 padding:30px 17px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
 border:0;margin:0;box-shadow:none;z-index:7;min-height:0
}
.jm-studio-workspace .sidebar .brand.jm-internal-brand,
.jm-desk-grid .sidebar .brand.jm-internal-brand{
 display:flex;align-items:center;gap:11px;padding:0 10px 22px;color:#fff;
 text-decoration:none;line-height:1.3;letter-spacing:normal;white-space:normal
}
.jm-studio-workspace .brand-symbol,.jm-desk-grid .brand-symbol{
 width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;position:relative;
 background:#fff;color:#1a334d;font-weight:900;font-size:14px;border-radius:12px;line-height:1
}
.jm-studio-workspace .jm-brand-dot,.jm-desk-grid .jm-brand-dot{
 position:absolute;right:-3px;bottom:-3px;width:10px;height:10px;
 border-radius:50%;border:2px solid #172b46;background:#e8955b
}
.jm-studio-workspace .jm-internal-brand b,.jm-desk-grid .jm-internal-brand b{
 display:block;font-size:13px;line-height:1.35;letter-spacing:.025em;font-weight:850
}
.jm-studio-workspace .jm-internal-brand small,.jm-desk-grid .jm-internal-brand small{
 display:block;margin-top:2px;color:#f6b88a;font-size:9px;font-weight:780;letter-spacing:.035em
}
.jm-studio-workspace .sidebar-nav,.jm-desk-grid .sidebar-nav{
 display:grid;gap:5px;align-items:stretch;justify-content:initial;margin:0;flex-wrap:nowrap
}
.jm-studio-workspace .sidebar-nav .navbtn,.jm-desk-grid .sidebar-nav .navbtn{
 width:100%;min-height:46px;display:flex;align-items:center;gap:13px;text-align:left;
 border:0;border-radius:12px;background:transparent;color:#cbd6e1;
 font-size:12px;font-weight:760;line-height:1.3;padding:11px 12px;
 letter-spacing:normal;text-decoration:none;white-space:normal;position:relative;box-shadow:none
}
.jm-studio-workspace .sidebar-nav .navbtn svg,.jm-desk-grid .sidebar-nav .navbtn svg{flex-shrink:0}
.jm-studio-workspace .sidebar-nav .navbtn span,.jm-desk-grid .sidebar-nav .navbtn span{min-width:0;overflow-wrap:anywhere}
.jm-studio-workspace .sidebar-nav .navbtn:hover,.jm-desk-grid .sidebar-nav .navbtn:hover{background:#304960;color:#fff}
.jm-studio-workspace .sidebar-nav .navbtn.active,.jm-desk-grid .sidebar-nav .navbtn.active{background:#344d68;color:#fff}
.jm-studio-workspace .sidebar-nav .navbtn.active:before,.jm-desk-grid .sidebar-nav .navbtn.active:before{
 content:"";width:3px;height:22px;flex:0 0 3px;border-radius:9px;
 background:#ec761d;margin-left:-9px
}
.jm-studio-workspace .sidebar-nav .jm-sidebar-client,.jm-desk-grid .sidebar-nav .jm-sidebar-client{
 margin-top:13px;border-top:1px solid #ffffff21;border-radius:0;padding-top:18px
}
.jm-studio-workspace .side-bottom,.jm-desk-grid .side-bottom{
 margin-top:auto;color:#b8c9d8;font-size:12px;padding:15px;
 display:block;min-width:0;text-align:left
}
.jm-studio-workspace .jm-sidebar-signed-in,.jm-desk-grid .jm-sidebar-signed-in{
 overflow-wrap:anywhere;font-weight:700;font-size:11px
}
.jm-studio-workspace .side-bottom button,.jm-desk-grid .side-bottom button{
 display:flex;align-items:center;gap:5px;margin-top:12px;background:transparent;color:#d5e4f0;
 border:1px solid #4a6380;border-radius:9px;padding:8px 12px;font-size:12px;min-height:35px;box-shadow:none
}
.jm-studio-workspace .jm-sidebar-note,.jm-desk-grid .jm-sidebar-note{
 color:#9cb1c3;font-size:10px;line-height:1.65;margin:14px 0 0;font-weight:400
}

/* Same content frame and footer position as the workspace. */
.jm-desk-grid{width:100%;display:flex;align-items:stretch;gap:0;max-width:none;margin:0;min-height:100vh}
.jm-desk-grid > .shell.main{
 flex:1;max-width:1490px;min-width:0;width:100%;margin:0 auto;
 padding:18px 23px 75px;display:block
}
.jm-desk-grid .page-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:5px 0 23px}
.jm-desk-grid .page-head h1{
 font-size:28px;letter-spacing:-.035em;margin:3px 0;color:#172b46;
 line-height:1.22;font-weight:850
}
.jm-desk-grid .page-head .eyebrow{
 font-size:10px!important;letter-spacing:.12em;font-weight:800;color:#8994a4
}
.jm-desk-grid .page-head p{font-size:13px;color:#69788d;line-height:1.55;margin:2px 0 0}
.jm-desk-grid .page-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.jm-desk-grid .page-actions .btn{min-height:40px}
.jm-desk-grid .jm-client-tab strong{font-size:15px}
.jm-desk-grid .jm-client-tab small{font-size:12px;line-height:1.35}
.jm-desk-grid .inbox-head h2{font-size:16px}
.jm-desk-grid .inbox-item strong{font-size:13px}
.jm-desk-grid .jm-lead-primary strong{font-size:13px}
.jm-desk-grid .jm-lead-list-header strong{font-size:14px}
.jm-desk-grid .jm-footer{
 margin:26px 0 0;border-radius:15px;padding:27px 25px;
 box-shadow:none;width:100%;max-width:none
}
.jm-desk-grid .jm-footer .jm-footer-grid{gap:14px}
.jm-desk-grid .jm-footer a{font-size:11px}
/* The desktop version has no separate top header or duplicated footer. */
.jm-desk-grid .bottom-nav{display:none}

@media(max-width:1100px){
 .jm-studio-workspace .sidebar.jm-internal-sidebar,
 .jm-desk-grid .sidebar.jm-internal-sidebar{width:212px;flex-basis:212px}
 .jm-desk-grid > .shell.main{padding:24px 24px 75px}
 .jm-desk-grid .page-head h1{font-size:26px}
}
@media(max-width:760px){
 .jm-studio-workspace .sidebar.jm-internal-sidebar,
 .jm-desk-grid .sidebar.jm-internal-sidebar{display:none!important}
 .jm-desk-grid{display:block;min-height:100vh}
 .jm-desk-grid > .shell.main{
  display:block;width:100%;max-width:520px;min-width:0;margin:0 auto;
  padding:18px 16px calc(95px + env(safe-area-inset-bottom))
 }
 .jm-desk-grid .page-head{gap:8px;align-items:flex-start;margin:0 0 17px}
 .jm-desk-grid .page-head h1{font-size:25px}
 .jm-desk-grid .page-head p{font-size:12px}
 .jm-desk-grid .page-actions{justify-content:flex-end}
 .jm-desk-grid .page-actions .sync{white-space:normal}
 .jm-desk-grid .bottom-nav{
  display:block;position:fixed;bottom:0;left:0;right:0;z-index:40;
  padding:8px 9px calc(8px + env(safe-area-inset-bottom));
  background:#fff;border-top:1px solid #e3e8ed;box-shadow:0 -7px 22px #1a2f4920
 }
 .jm-desk-grid .bottom-inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:520px;margin:0 auto}
 .jm-desk-grid .bottom-button{
  display:grid;justify-items:center;align-content:center;gap:4px;
  min-width:0;min-height:51px;padding:3px;border:0;background:transparent;
  color:#8491a2;font-size:11px;font-weight:500;text-decoration:none;white-space:nowrap
 }
 .jm-desk-grid .bottom-button.active{font-weight:750;color:#172b46}
 .jm-desk-grid .bottom-button .underline{height:3px;width:20px;background:transparent;border-radius:99px}
 .jm-desk-grid .bottom-button.active .underline{background:#ec761d}
 .jm-desk-grid .jm-footer{margin:22px 0 0;padding:24px 18px}
}
@media(max-width:410px){
 .jm-desk-grid > .shell.main{padding-left:11px;padding-right:11px}
 .jm-desk-grid .page-head{flex-wrap:wrap}
 .jm-desk-grid .page-head h1{font-size:23px}
}

@media(max-width:760px){.jm-studio-workspace .jm-internal-mobile .bottom-inner{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* JM 2026-11-08: three destinations, one centered navigation frame on iOS/Android. */
/* Override the legacy four-column !important rule in office-mobile-ux.css. */
@media(max-width:760px){
 .jm-studio-workspace .bottom-nav.jm-internal-mobile,
 .jm-desk-grid .bottom-nav.jm-internal-mobile{
  display:block!important;position:fixed!important;
  left:0!important;right:0!important;bottom:0!important;top:auto!important;
  width:100%!important;max-width:none!important;margin:0!important;
  padding:6px max(9px,env(safe-area-inset-right))
    calc(6px + env(safe-area-inset-bottom))
    max(9px,env(safe-area-inset-left))!important;
  background:#fff!important;border-top:1px solid #e0e7ee!important;
  box-shadow:0 -5px 18px #182f4214!important;z-index:45!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile > .bottom-inner,
 .jm-desk-grid .bottom-nav.jm-internal-mobile > .bottom-inner{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  grid-template-rows:minmax(58px,auto)!important;gap:0!important;
  max-width:520px!important;width:100%!important;
  margin:0 auto!important;padding:0!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button,
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;box-sizing:border-box!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  height:58px!important;min-height:58px!important;margin:0!important;
  padding:4px 2px!important;gap:3px!important;line-height:1.2!important;
  font-size:12px!important;font-weight:650!important;text-align:center!important;
  white-space:nowrap!important;text-decoration:none!important;
  color:#8491a2!important;overflow:hidden!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button.active,
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button.active{
  color:#172b46!important;font-weight:850!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button svg,
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button svg{
  width:22px!important;height:22px!important;flex:0 0 22px!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button > span:not(.underline),
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button > span:not(.underline){
  display:block!important;width:100%!important;max-width:100%!important;
  text-align:center!important;white-space:nowrap!important;overflow:hidden!important;
  text-overflow:ellipsis!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button > .underline,
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button > .underline{
  width:24px!important;height:3px!important;flex:0 0 3px!important;
  margin:0!important;border-radius:6px!important;background:transparent!important;
 }
 .jm-studio-workspace .bottom-nav.jm-internal-mobile .bottom-button.active > .underline,
 .jm-desk-grid .bottom-nav.jm-internal-mobile .bottom-button.active > .underline{
  background:#ec761d!important;
 }
}

/* JOB MONEY desktop-only inspiration; a flexible spacer between navigation and profile. */
.jm-studio-workspace .jm-inspiration,.jm-desk-grid .jm-inspiration{
 flex:1 1 auto;min-height:0;max-height:360px;margin:13px 3px 9px;padding:12px 7px 9px;
 display:flex;flex-direction:column;justify-content:center;gap:13px;overflow:hidden;
 color:#f3f8fc;background:transparent;box-sizing:border-box
}
.jm-inspiration-main{min-height:0;display:flex;flex-direction:column;gap:11px;overflow:hidden}
.jm-inspiration-kicker{font-size:10px;letter-spacing:.095em;font-weight:850;color:#f0a04b;flex:0 0 auto}
.jm-inspiration-kicker span{font-size:15px;vertical-align:middle;padding-right:4px}
.jm-inspiration-reading{border-left:2px solid #ed8936;padding:2px 0 2px 11px;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#4d667e transparent}
.jm-inspiration-text{font-size:14px;line-height:1.65;font-weight:530;color:#fff;letter-spacing:-.012em;margin:0;overflow-wrap:break-word}
.jm-inspiration-author{font-size:11px;line-height:1.5;font-weight:600;color:#adc4d6;margin:9px 0 0;overflow-wrap:break-word}
.jm-inspiration-bottom{border-top:1px solid #ffffff24;padding-top:9px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex:0 0 auto}
.jm-inspiration-counter{font-size:10px;color:#a5bacd;font-weight:650;font-variant-numeric:tabular-nums}
.jm-inspiration-controls{display:flex;gap:7px;align-items:center}
.jm-studio-workspace .jm-inspiration-controls button,.jm-desk-grid .jm-inspiration-controls button{
 width:28px;height:27px;min-height:27px;display:grid;place-items:center;padding:0;margin:0;
 border:1px solid #4a6380;background:#263e57;color:#f0a04b;border-radius:7px;
 font-size:22px;font-weight:500;line-height:1;cursor:pointer;box-shadow:none
}
.jm-studio-workspace .jm-inspiration-controls button:hover,.jm-desk-grid .jm-inspiration-controls button:hover{background:#34516f;color:#fff}
.jm-inspiration-controls button:focus-visible{outline:2px solid #f0a04b;outline-offset:2px}
@media (max-height:820px) and (min-width:761px){
 .jm-studio-workspace .jm-inspiration,.jm-desk-grid .jm-inspiration{margin:7px 2px 5px;padding:6px 7px;gap:8px}
 .jm-inspiration-text{font-size:12.5px;line-height:1.5}
 .jm-inspiration-author{font-size:10px;margin-top:6px}
 .jm-inspiration-main{gap:7px}
}
@media (max-height:625px) and (min-width:761px){
 .jm-studio-workspace .jm-inspiration,.jm-desk-grid .jm-inspiration{display:none}
}
@media (max-width:760px){
 .jm-studio-workspace .jm-inspiration,.jm-desk-grid .jm-inspiration{display:none!important}
}

/* Official long brand subtitle, safe wrap within narrow desktop sidebar. */
.jm-studio-workspace .jm-internal-brand small,.jm-desk-grid .jm-internal-brand small{font-size:8px;line-height:1.4;letter-spacing:.02em;white-space:normal;max-width:150px;overflow-wrap:normal}


/* 2026-11-11 Desktop-only fix. The mobile footer/menu is deliberately unchanged. */
@media (min-width:761px) {
 .jm-studio-workspace .sidebar.jm-internal-sidebar,
 .jm-desk-grid .sidebar.jm-internal-sidebar {
  box-sizing:border-box;
  min-width:0;
  overflow-x:hidden;
 }
 .jm-studio-workspace .jm-internal-sidebar .side-bottom,
 .jm-desk-grid .jm-internal-sidebar .side-bottom {
  min-width:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
 }
 .jm-studio-workspace .jm-internal-sidebar .side-bottom .jm-sidebar-profile,
 .jm-desk-grid .jm-internal-sidebar .side-bottom .jm-sidebar-profile {
  box-sizing:border-box;
  display:flex;
  align-items:center;
  min-width:0;
  width:100%;
  max-width:100%;
  padding:8px 9px;
  gap:8px;
  overflow:hidden;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-photo,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-photo {
  flex:0 0 35px;
  min-width:35px;
  width:35px;
  height:35px;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-caption,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-caption {
  flex:1 1 0;
  min-width:0;
  max-width:100%;
  display:grid;
  gap:3px;
  overflow:hidden;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-caption strong,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-caption strong,
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-caption small,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-caption small {
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow-wrap:normal;
 }
}


/* 2026-11-11: Desktop account opens from a round avatar, never a wide card.
   Mobile styles/navigation are intentionally untouched. */
@media (min-width:761px) {
 .jm-studio-workspace .jm-internal-sidebar .side-bottom button.jm-sidebar-profile,
 .jm-desk-grid .jm-internal-sidebar .side-bottom button.jm-sidebar-profile {
  display:grid;
  place-items:center;
  width:56px;
  min-width:56px;
  max-width:56px;
  height:56px;
  min-height:56px;
  max-height:56px;
  box-sizing:border-box;
  padding:3px;
  margin:0 auto 8px;
  border:2px solid #dbe7f2;
  border-radius:50%;
  background:transparent;
  overflow:hidden;
  aspect-ratio:1/1;
  cursor:pointer;
 }
 .jm-studio-workspace .jm-internal-sidebar .side-bottom button.jm-sidebar-profile:hover,
 .jm-desk-grid .jm-internal-sidebar .side-bottom button.jm-sidebar-profile:hover {
  border-color:#f0a04b;
  background:#ffffff16;
 }
 .jm-studio-workspace .jm-internal-sidebar .side-bottom button.jm-sidebar-profile:focus-visible,
 .jm-desk-grid .jm-internal-sidebar .side-bottom button.jm-sidebar-profile:focus-visible {
  outline:2px solid #f0a04b;
  outline-offset:3px;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-photo,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-photo {
  display:grid;
  place-items:center;
  width:46px;
  min-width:46px;
  max-width:46px;
  height:46px;
  min-height:46px;
  max-height:46px;
  flex:none;
  border-radius:50%;
  overflow:hidden;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-photo img,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
 }
 .jm-studio-workspace .jm-internal-sidebar .jm-sidebar-profile-caption,
 .jm-desk-grid .jm-internal-sidebar .jm-sidebar-profile-caption {
  display:none;
 }
}