/* Member platform — premium refinement 2026-10-16
 * Builds on member-shell.css while keeping legacy application features intact.
 */
body.member-shell-active{--member-green:#a4d7ae;--member-green-bright:#bdedc6;--member-line:#283b30;--member-surface:#101813;--member-surface-alt:#151f18}
body.member-shell-active:not(.member-focus-mode) #workspace{scroll-behavior:auto;scrollbar-gutter:stable;isolation:isolate}
body.member-shell-active:not(.member-focus-mode) #workspace .workspaceinner{
  box-sizing:border-box;display:flex;flex-direction:column;position:relative;overflow:visible;
  padding:0!important;width:min(1130px,100%);animation:memberReveal .25s ease both
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead{
  position:relative!important;top:auto!important;z-index:auto!important;inset:auto!important;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px!important;
  align-items:center!important;margin:0 0 27px!important;padding:0 0 23px!important;
  border-bottom:1px solid var(--member-line)!important;
  background:none!important;backdrop-filter:none!important;box-shadow:none!important;
  transform:none!important;min-height:0!important
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead>div{min-width:0}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead .eyebrow{
  color:#8ac89a;letter-spacing:.155em;font-size:10px;line-height:1.4;font-weight:800
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead h2{
  color:#f6faf6;font-size:clamp(25px,2.8vw,36px)!important;line-height:1.13;
  letter-spacing:-.042em;margin:7px 0 6px!important;max-width:850px
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead p{
  font-size:13px!important;line-height:1.55!important;color:#94a89a!important;
  margin:0!important;max-width:690px
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead>button{
  align-self:center!important;justify-self:end!important;white-space:nowrap;
  padding:10px 14px!important;color:#b9d4be!important;border:1px solid #304d37!important;
  border-radius:10px!important;background:#132019!important;
  transition:background .16s,border-color .16s!important
}
body.member-shell-active:not(.member-focus-mode) #workspace .workhead>button:hover{
  background:#1e3325!important;border-color:#64916c!important;transform:none!important
}
body.member-shell-active:not(.member-focus-mode) #workContent{
  position:relative!important;z-index:auto!important;min-width:0;width:100%;
  isolation:isolate;animation:memberFade .2s ease both
}
body.member-shell-active:not(.member-focus-mode) #workContent>*{max-width:100%}
body.member-shell-active:not(.member-focus-mode) #workspace .membercard,
body.member-shell-active:not(.member-focus-mode) #workspace .workitem{
  border:1px solid #283b30;background:#101713;border-radius:16px;
  box-shadow:none;min-width:0
}
body.member-shell-active:not(.member-focus-mode) #workspace .membercard{padding:24px}
body.member-shell-active:not(.member-focus-mode) #workspace .workitem{padding:20px}
body.member-shell-active:not(.member-focus-mode) #workspace .workitem h3{font-size:17px;line-height:1.3;margin:10px 0}
body.member-shell-active:not(.member-focus-mode) #workspace .workitem p{font-size:12px;line-height:1.6;color:#a4b1a7}
body.member-shell-active:not(.member-focus-mode) #workspace .modulebadge{color:#9acda2;letter-spacing:.15em;font-size:10px}
body.member-shell-active:not(.member-focus-mode) #workspace .btn{transition:background .16s,border-color .16s,color .16s,transform .16s}
body.member-shell-active:not(.member-focus-mode) #workspace .btn:not(.ghost){background:#c0ebbe;color:#102014;border:1px solid #c0ebbe}
body.member-shell-active:not(.member-focus-mode) #workspace .btn:not(.ghost):hover{background:#d4f7cf}
body.member-shell-active:not(.member-focus-mode) #workspace .btn.ghost{background:#19251d;color:#dfede1;border-color:#37503c}
body.member-shell-active:not(.member-focus-mode) #workspace .btn:disabled{opacity:.6;cursor:not-allowed;background:#1a241e!important;color:#8da294!important;border-color:#28372c!important}
body.member-shell-active:not(.member-focus-mode) #workspace :is(button,input,select,textarea):focus-visible,
#memberAppNav button:focus-visible{outline:2px solid #a9deb3!important;outline-offset:3px}
body.member-shell-active:not(.member-focus-mode) #workspace input,
body.member-shell-active:not(.member-focus-mode) #workspace textarea,
body.member-shell-active:not(.member-focus-mode) #workspace select{min-width:0;max-width:100%}
body.member-shell-active:not(.member-focus-mode) #workspace .workgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
body.member-shell-active:not(.member-focus-mode) #workspace .setupgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice{
  background:linear-gradient(145deg,#131d16,#101511);border:1px solid #304738;
  border-radius:17px;min-width:0;min-height:210px;padding:24px;transition:transform .18s,border-color .18s,background .18s
}
body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice:hover{
  transform:translateY(-3px);border-color:#74a880;background:#18281e
}
body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice h3{font-size:20px;line-height:1.2;margin:22px 0 9px}
body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice p{font-size:12px;line-height:1.6;color:#9fb0a1}
body.member-shell-active:not(.member-focus-mode) #workspace .briefitem{margin-top:16px;border-color:#304637;background:#101813;border-radius:15px}
body.member-shell-active:not(.member-focus-mode) #workspace .briefitem>div{font-size:12px;line-height:1.7}
body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-section-grid{gap:14px}
body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-feature{
  background:linear-gradient(140deg,#121c16,#0d1310);border-color:#2c4233;min-height:165px
}
body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-feature:hover{border-color:#73a77d;background:#18291d}
body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-section-intro{
  background:linear-gradient(105deg,#14251b,#101811);border-color:#294b34;color:#a7c5ae;
  padding:15px 19px;margin-bottom:16px;font-size:12px
}
body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workitem{min-height:158px;display:flex;flex-direction:column}
body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workitem p{margin:4px 0 14px}
body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workitem .btn{align-self:flex-start;margin-top:auto;padding:9px 12px;font-size:11px}
body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workitem .btn:disabled{background:transparent!important;border-color:#304337!important}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-panel{display:grid;gap:17px;max-width:100%}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview{
  display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.65fr);gap:20px;
  padding:24px;border:1px solid #355542;background:linear-gradient(120deg,#17281d,#0d1511);
  border-radius:21px;overflow:hidden;position:relative
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview:before{
  content:"";position:absolute;width:340px;height:340px;right:-170px;top:-190px;
  background:radial-gradient(circle,rgba(117,192,134,.13),transparent 70%);pointer-events:none
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-kicker{display:block;font-size:10px;font-weight:800;color:#94d0a3;letter-spacing:.16em}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview h3{
  color:#f1f7f1;letter-spacing:-.036em;font-size:clamp(22px,3vw,31px);line-height:1.16;margin:12px 0 9px
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview p,
body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini p{color:#a6b9a9;line-height:1.6;font-size:13px;margin:0}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-average{display:flex;justify-content:center;align-items:center}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring{
  --score:0%;width:160px;aspect-ratio:1;border-radius:50%;
  background:conic-gradient(#9fddb0 var(--score),#2b4132 0);
  display:grid;place-items:center;position:relative
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring:after{content:"";position:absolute;inset:11px;background:#14221a;border-radius:50%}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring>div{z-index:1;text-align:center}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring strong{font-size:37px;letter-spacing:-.05em;line-height:1;color:#f5fff6}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring span{display:block;font-size:10px;letter-spacing:.08em;color:#91ab98;margin-top:7px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-summary{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini{border:1px solid #263c2f;border-radius:16px;padding:20px;background:#111a14;min-width:0}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini strong{display:block;color:#f0f9f1;font-size:19px;letter-spacing:-.03em;margin:9px 0 6px;overflow-wrap:anywhere}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-section{
  padding:24px;border:1px solid #293e32;background:#101813;border-radius:19px;min-width:0
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-section-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:20px
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-section-head h3{font-size:22px;margin:6px 0 0;letter-spacing:-.03em}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-section-head>span{font-size:11px;color:#859d8b}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-list{display:grid;gap:16px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill{min-width:0}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:9px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-name{color:#dbe8dd;font-size:13px;font-weight:700;overflow-wrap:anywhere}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-rank{color:#778f7b;font-size:10px;font-weight:700;display:inline-block;min-width:25px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-value{color:#d7f3de;font-size:15px;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-value small{color:#7f9987;font-size:10px;font-weight:600}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-track{height:9px;background:#233429;border:1px solid #2d4032;border-radius:999px;overflow:hidden}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-track span{display:block;height:100%;width:var(--fill);max-width:100%;border-radius:999px;background:linear-gradient(90deg,#477a58,#a9dbb3);transform-origin:left;animation:pmBar .72s cubic-bezier(.2,.7,.2,1) both}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill.is-priority .pm-track span{background:linear-gradient(90deg,#647252,#b1bb85)}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent{display:grid;gap:9px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-row{
  display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 15px;
  border:1px solid #283b30;border-radius:12px;background:#131d16
}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-row strong{display:block;font-size:13px;font-weight:750;color:#dbe9dc;margin-bottom:4px}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-row span{color:#849d89;font-size:11px;line-height:1.4}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-score{font-weight:850;font-size:18px;white-space:nowrap;color:#d7f5de}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-score small{font-size:10px;color:#8ba594}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-action{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body.member-shell-active:not(.member-focus-mode) #workspace .pm-action p{font-size:12px;line-height:1.6;color:#95ad9c;margin:0;flex:1;min-width:190px}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page{
  overflow:hidden!important;overscroll-behavior:none!important
}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .workspaceinner{height:100%;max-width:none!important}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .workhead{display:none!important}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page #workContent{
  flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden
}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .member-workplace-frame{
  flex:1;min-height:0;display:flex;flex-direction:column;border:0;background:transparent;border-radius:0
}
body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .member-workplace-frame iframe{
  flex:1;height:100%!important;min-height:0!important;border-radius:0
}
.member-workplace-toolbar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 4px 16px;border-bottom:1px solid #293e32;margin-bottom:4px}
.member-workplace-toolbar strong{display:block;color:#f0faf2;font-size:17px;letter-spacing:-.02em}
.member-workplace-toolbar span{font-size:10px;color:#8fae98;letter-spacing:.09em}
.member-workplace-toolbar button{border:1px solid #355340;background:#17261c;color:#bfdfc6;font-size:12px;font-weight:700;padding:9px 12px;border-radius:9px;cursor:pointer;white-space:nowrap}
@keyframes memberFade{from{opacity:.25}to{opacity:1}}
@keyframes memberReveal{from{opacity:.75;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes pmBar{from{transform:scaleX(.05)}to{transform:scaleX(1)}}
@media(max-width:1050px){
 body.member-shell-active:not(.member-focus-mode) #workspace{padding:30px 25px 70px 279px}
 body.member-shell-active:not(.member-focus-mode) #workspace .setupgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
 body.member-shell-active:not(.member-focus-mode) #workspace{
   padding:16px 16px calc(90px + env(safe-area-inset-bottom,0px))!important;
   overflow-x:hidden!important;overflow-y:auto!important
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .workspaceinner{
   width:100%!important;padding:0!important;overflow:visible;animation:memberFade .18s ease both
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead{
   display:flex!important;flex-direction:column-reverse!important;align-items:stretch!important;
   gap:10px!important;margin:0 0 18px!important;padding:0 0 18px!important;
   position:relative!important;top:auto!important;z-index:auto!important;
   background:none!important;box-shadow:none!important;backdrop-filter:none!important
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead>button{
   align-self:flex-start!important;justify-self:start!important;
   background:transparent!important;border:0!important;color:#91bd9b!important;
   padding:2px 0!important;font-size:11px!important;min-height:26px
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead .eyebrow{font-size:9px!important;letter-spacing:.12em}
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead h2{
   font-size:26px!important;line-height:1.11!important;margin:5px 0 7px!important;max-width:100%!important
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead p{
   font-size:12px!important;line-height:1.45!important;color:#95a99b!important;max-width:100%!important
 }
 body.member-shell-active:not(.member-focus-mode) #workspace #workContent{padding:0!important;margin:0!important;z-index:auto!important}
 body.member-shell-active:not(.member-focus-mode) #workspace .membercard{padding:17px!important}
 body.member-shell-active:not(.member-focus-mode) #workspace .workitem{padding:16px!important}
 body.member-shell-active:not(.member-focus-mode) #workspace .workgrid,
 body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workgrid{grid-template-columns:1fr;gap:10px}
 body.member-shell-active:not(.member-focus-mode) #workspace.module-page .workitem{min-height:auto}
 body.member-shell-active:not(.member-focus-mode) #workspace .setupgrid{grid-template-columns:1fr;gap:9px}
 body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice{
   min-height:0;padding:17px;border-radius:14px
 }
 body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice h3{font-size:18px;margin:8px 0 6px}
 body.member-shell-active:not(.member-focus-mode) #workspace .setupchoice p{font-size:12px}
 body.member-shell-active:not(.member-focus-mode) #workspace .briefitem{margin-top:10px;padding:14px}
 body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-section-grid{grid-template-columns:1fr;gap:9px}
 body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-feature{min-height:118px;padding:17px;gap:6px}
 body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-feature .member-feature-icon{margin-bottom:4px}
 body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-feature strong{font-size:15px}
 body.member-shell-active:not(.member-focus-mode) #workspace .member-shell-section-intro{margin-bottom:12px;padding:13px 15px;font-size:12px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-panel{gap:11px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview{grid-template-columns:1fr;gap:13px;padding:17px;border-radius:16px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview h3{font-size:22px;margin:8px 0}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-overview p{font-size:12px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring{width:124px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-ring strong{font-size:30px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-average{justify-content:flex-start}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-summary{grid-template-columns:1fr 1fr;gap:9px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini{padding:13px;min-width:0}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini strong{font-size:15px;margin:5px 0}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-mini p{font-size:11px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-section{padding:16px;border-radius:15px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-section-head h3{font-size:19px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-skill-list{gap:15px}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-recent-row{padding:12px}
 body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page{
   padding:0 0 calc(73px + env(safe-area-inset-bottom,0px))!important;overflow:hidden!important
 }
 body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .workspaceinner{height:100%!important}
 body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .member-workplace-toolbar{padding:12px 15px;margin:0;border-bottom-color:#253c2d}
 body.member-shell-active:not(.member-focus-mode) #workspace.workplace-page .member-workplace-frame iframe{height:100%!important}
}
@media(max-width:410px){
 body.member-shell-active:not(.member-focus-mode) #workspace{padding-left:12px!important;padding-right:12px!important}
 body.member-shell-active:not(.member-focus-mode) #workspace .pm-summary{grid-template-columns:1fr}
 body.member-shell-active:not(.member-focus-mode) #workspace .workhead h2{font-size:24px!important}
}
@media(prefers-reduced-motion:reduce){
 body.member-shell-active #workspace *,body.member-shell-active .member-shell-quick-card{
  animation-duration:.01ms!important;transition-duration:.01ms!important
 }
}