/* Homepage visual layer only. No layout/logic changes inside the training workbench. */
.learnerShell{background:#f4f6f7;font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
.learnerShell>.topbar{min-height:76px;padding:16px max(24px,calc((100vw - 1192px)/2));color:#233b45;background:#fff;border-bottom:1px solid #e6ecee;box-shadow:none;gap:24px}
.learnerShell .topbar .brand{gap:12px}.learnerShell .topbar .brandMark{width:41px;height:41px;border-radius:13px;background:#205951;color:#fff;font-family:Georgia,serif;font-size:24px;box-shadow:0 3px 8px #20595118}.learnerShell .topbar .brand b{font-size:16px;letter-spacing:.025em;font-weight:650}.learnerShell .topbar .brand small{font-size:10px;letter-spacing:.14em;opacity:1;color:#5e7179;margin-top:4px}.learnerShell .topHint{font-size:12px;opacity:1;color:#5e7179;letter-spacing:.045em}
.learnerShell #userPanel{padding:24px 0 22px;align-items:center;gap:20px}.learnerShell #userPanel .eyebrow{color:#617d79;font-size:10px;letter-spacing:.12em;font-weight:600}.learnerShell #welcomeName{margin:9px 0 10px;font-size:clamp(23px,2.5vw,30px);font-weight:650;letter-spacing:-.025em;color:#213c45;line-height:1.35}.learnerShell .portalGreeting{color:#5e7179;font-size:13px;line-height:1.8}.learnerShell .portalSettings{align-self:center;margin:0}.learnerShell .portalSettings summary{color:#586d77;font-size:12px;font-weight:500;border:1px solid #e0e7ea;padding:10px 14px;border-radius:10px;background:#ffffffb3}.learnerShell .portalSettings[open] summary{background:#fff;border-color:#abc4bd}.learnerShell .portalSettings .userActions{top:43px;box-shadow:0 16px 45px #163d491c;border-color:#e2e9eb;gap:6px}.learnerShell .portalSettings .userActions button{font-weight:500}
.learnerShell .portalNav{display:flex;gap:5px;background:#e9eef0;border:1px solid #e1e7ea;border-radius:12px;padding:5px;margin-bottom:26px}.learnerShell .portalNav button{border:0;border-radius:8px;padding:10px 19px;margin:0;gap:8px;background:transparent;color:#6a7d85;font-weight:550;font-size:13px;min-height:40px}.learnerShell .portalNav button[aria-current=page]{background:#fff;color:#205951;border:0;box-shadow:0 2px 6px #233f4a0c}.learnerShell .portalNav button:hover{transform:none;filter:none;background:#f8fafb;color:#205951}.learnerShell .portalNav svg{width:17px;height:17px}.learnerShell .portalNav #returnSessionBtn{font-size:12px;color:#28685d}
.learnerShell #homeDashboard{grid-template-columns:minmax(0,1.23fr) minmax(340px,1fr);gap:20px;align-items:stretch;margin-bottom:22px}.learnerShell #homeDashboard>.nextTrainingCard{position:relative;isolation:isolate;overflow:hidden;min-height:332px;padding:32px 34px;border-radius:20px;border:1px solid #285c57;background:radial-gradient(ellipse at 105% 5%,#43897846 0,transparent 58%),linear-gradient(125deg,#183b3f,#20564e);box-shadow:0 12px 28px #1b4b4714;justify-content:flex-start;align-items:flex-start;gap:0;color:#fff}.learnerShell #nextTrainingCard .eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:500;letter-spacing:.16em;color:#bcd8ce;line-height:1.5}.learnerShell #nextTrainingCard .eyebrow:before{content:"";width:5px;height:5px;background:#b7d4a5;border-radius:50%}.learnerShell #nextTrainingCard h2{font-size:15px;font-weight:500;color:#d0e2dc;margin:12px 0 0;letter-spacing:.01em}.learnerShell #nextTrainingCard h3{font-size:clamp(20px,2vw,25px);font-weight:600;line-height:1.6;letter-spacing:-.025em;margin:10px 0 6px;max-width:100%;color:#fff}.learnerShell #nextTrainingCard>p{font-size:12px;font-weight:400;color:#bfcec9;line-height:1.8;margin:4px 0 13px;max-width:100%;overflow-wrap:anywhere}.learnerShell #nextTrainingCard .currentGoal{border:1px solid #ffffff18;border-radius:10px;background:#ffffff09;padding:11px 13px;font-size:12px;color:#e1ebe6;width:100%;margin:8px 0 20px}.learnerShell #nextTrainingCard .currentGoal b{font-weight:500;color:#acccc0}.learnerShell #nextTrainingCard button{margin-top:auto;padding:12px 19px;min-height:43px;border-radius:9px;background:#e9f0dd;color:#234e43;font-weight:650;font-size:13px;box-shadow:0 3px 10px #071d2118}.learnerShell #nextTrainingCard button:hover{background:#f6f9ee;filter:none;box-shadow:0 5px 15px #071d2124}.learnerShell #nextTrainingCard:has(#dashboardNew)>h2{font-size:25px;color:#fff;line-height:1.5;font-weight:600;margin:27px 0 14px}.learnerShell #nextTrainingCard:has(#dashboardNew)>p{font-size:14px;line-height:1.9;max-width:33em}
.learnerShell .portalActions{gap:11px}.learnerShell .portalAction{min-height:103px;padding:20px 23px;gap:17px;border:1px solid #e3e9eb;background:#fff;border-radius:15px;box-shadow:0 2px 5px #203b4303;transition:border-color .16s,box-shadow .16s,transform .16s;filter:none}.learnerShell .portalAction:hover{background:#fff;border-color:#b8cdc5;box-shadow:0 6px 18px #284f4810;transform:translateY(-2px)}.learnerShell .portalIcon{width:46px;height:46px;background:#edf4f1;border-radius:13px;color:#3d7565}.learnerShell .portalIcon svg{width:23px;height:23px;stroke-width:1.5}.learnerShell .action-actual .portalIcon{background:#eef2f7;color:#627e9a}.learnerShell .action-growth .portalIcon{background:#f7f2e9;color:#9b8150}.learnerShell .portalActionCopy{gap:6px;min-width:0}.learnerShell .portalActionCopy strong{font-size:16px;font-weight:600;letter-spacing:-.015em;color:#29434c}.learnerShell .portalActionCopy>span{font-size:12px;font-weight:400;color:#5e7179;line-height:1.65}.learnerShell .portalActionLink{font-size:11px;font-weight:500;color:#617d75;line-height:1.5}
.learnerShell .portalTip{position:relative;padding:15px 20px;gap:18px;background:#f2f1e9;border:1px solid #e8e6da;border-radius:12px;color:#77745d;margin-top:0;font-size:12px}.learnerShell .portalTip b{font-size:12px;font-weight:600;color:#716a45;display:inline-flex;align-items:center;gap:9px}.learnerShell .portalTip b:before{content:"";width:5px;height:17px;border-radius:3px;background:#c6b880}.learnerShell .portalTip p{line-height:1.8}
.learnerShell #homeDashboard>.recentCustomers{padding:24px 26px 26px;border-radius:18px!important;border:1px solid #e1e8eb;background:#fff;box-shadow:0 3px 10px #243f4803}.learnerShell .recentCustomers .sectionHead{gap:16px}.learnerShell .recentCustomers .eyebrow{font-size:9px;font-weight:500;letter-spacing:.15em;color:#5e7179}.learnerShell .recentCustomers h2{font-size:18px;font-weight:600;color:#29434c;margin:6px 0 0}.learnerShell .recentCustomers .textButton{background:transparent;border:1px solid #e3eaed;border-radius:8px;color:#648077;padding:8px 11px;min-height:34px;font-size:11px;font-weight:500}.learnerShell #recentCustomerList{gap:12px;margin-top:21px}.learnerShell .recentCustomer{display:flex;flex-direction:column;align-items:flex-start;padding:18px!important;background:#f8fafb;border-color:#e7edef!important;border-radius:12px;gap:10px;position:relative}.learnerShell .recentCustomer:before{content:"";width:24px;height:3px;border-radius:3px;background:#9fbdb2;margin-bottom:2px}.learnerShell .recentCustomer:nth-child(2):before{background:#aabccb}.learnerShell .recentCustomer:nth-child(3):before{background:#cbbd9a}.learnerShell .recentCustomer b{font-size:13px;line-height:1.8;font-weight:550;color:#34505a}.learnerShell .recentCustomer small{font-size:11px;color:#5e7179;margin-top:8px;line-height:1.5}.learnerShell .recentCustomer .textButton{margin-top:auto;align-self:flex-end;border:0;background:#edf3f0;color:#487365;padding:6px 12px;font-size:11px;min-height:30px}.learnerShell #recentCustomerList>.hint{grid-column:1/-1;margin:0;padding:26px 18px;border:1px dashed #dce7e2;border-radius:12px;background:#f8fbfa;color:#5e7179;text-align:center;font-size:13px;line-height:1.9}.learnerShell>footer{color:#5e7179;font-size:11px;letter-spacing:.02em;padding:22px 16px 28px}
.learnerShell #loginPanel{border:1px solid #e0e8e7;box-shadow:0 16px 48px #274b4210;border-radius:20px}.learnerShell #loginPanel h1{color:#244b43;font-size:28px;font-weight:600}.learnerShell #loginPanel .eyebrow{color:#608576;font-weight:500}.learnerShell #loginPanel button{background:#285f52;font-weight:600}.learnerShell #loginPanel p{font-size:13px;line-height:1.8}
.learnerShell #homeDashboard :is(button,a):focus-visible,.learnerShell .portalNav button:focus-visible{outline:3px solid #4d9d85;outline-offset:4px}
@media(min-width:901px) and (max-width:1120px){.learnerShell .portalAction{padding:19px 17px;gap:12px}.learnerShell .portalActionLink{max-width:48px;white-space:normal}.learnerShell .portalActionCopy>span{font-size:11px}.learnerShell #homeDashboard>.nextTrainingCard{padding:28px}}
@media(max-width:900px){.learnerShell #homeDashboard{grid-template-columns:1fr;gap:17px}.learnerShell #homeDashboard>.nextTrainingCard{min-height:280px}.learnerShell .portalActions{grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.learnerShell .portalAction{padding:19px 17px;align-items:flex-start;flex-direction:column;gap:12px;min-height:190px}.learnerShell .portalActionCopy strong{font-size:15px}.learnerShell .portalActionLink{margin:3px 0 0}.learnerShell #recentCustomerList{grid-template-columns:repeat(3,minmax(0,1fr))}.learnerShell .portalTip{grid-column:1/-1}}
@media(max-width:600px){.learnerShell>.topbar{min-height:67px;padding:13px 19px}.learnerShell .topbar .brand b{font-size:15px}.learnerShell .topbar .brand small{font-size:9px}.learnerShell .topbar .brandMark{width:36px;height:36px;border-radius:11px;font-size:21px}.learnerShell #userPanel{padding:18px 1px 19px;align-items:flex-start;gap:10px}.learnerShell #welcomeName{font-size:23px;margin:8px 0}.learnerShell .portalGreeting{font-size:12px;max-width:23em}.learnerShell .portalSettings{min-width:89px;align-self:flex-start;margin-top:17px}.learnerShell .portalSettings summary{padding:8px 10px;font-size:11px;white-space:nowrap}.learnerShell .portalSettings .userActions{top:38px}.learnerShell .portalNav{gap:2px;padding:4px;margin-bottom:20px;flex-wrap:wrap}.learnerShell .portalNav button{flex:1;padding:9px 6px;font-size:11px;gap:4px;white-space:nowrap}.learnerShell .portalNav svg{width:15px;height:15px}.learnerShell .portalNav #returnSessionBtn{flex-basis:100%;margin:0}.learnerShell #homeDashboard>.nextTrainingCard{padding:26px 24px;border-radius:17px;min-height:280px}.learnerShell #nextTrainingCard h3{font-size:22px}.learnerShell #nextTrainingCard button{width:100%;margin-top:15px}.learnerShell #nextTrainingCard:has(#dashboardNew)>h2{font-size:24px;margin-top:22px}.learnerShell .portalActions{grid-template-columns:1fr;gap:10px}.learnerShell .portalAction{padding:18px;min-height:94px;flex-direction:row;align-items:center;gap:14px;border-radius:13px}.learnerShell .portalIcon{width:42px;height:42px;flex-shrink:0;border-radius:11px}.learnerShell .portalActionCopy>span{font-size:11px}.learnerShell .portalActionLink{margin-left:auto;font-size:10px;max-width:51px;flex-shrink:0}.learnerShell .portalTip{padding:14px 17px;font-size:11px}.learnerShell .portalTip p{margin-top:7px}.learnerShell #homeDashboard>.recentCustomers{padding:21px 18px}.learnerShell #recentCustomerList{grid-template-columns:1fr;gap:10px;margin-top:17px}.learnerShell .recentCustomer{padding:15px!important;gap:8px}.learnerShell .recentCustomer .textButton{position:static}.learnerShell .recentCustomer b{font-size:13px}.learnerShell .recentCustomers .textButton{font-size:10px;white-space:nowrap}.learnerShell>footer{font-size:10px;line-height:1.8}}
@media(prefers-reduced-motion:reduce){.learnerShell .portalAction{transition:none}.learnerShell .portalAction:hover{transform:none}}

/* V2 task-room visual direction: meaningful game feedback, no leaderboard. */
.learnerShell{--game-deep:#102f36;--game-teal:#2c7467;--game-mint:#bdddba;--game-gold:#d7b66c;background:radial-gradient(circle at 8% 4%,#dfeeea 0,transparent 25rem),linear-gradient(180deg,#eef4f3,#f7f8f8 46rem)}
.learnerShell>.topbar{position:relative;background:#102f36;color:#fff;border:0;box-shadow:0 10px 32px #102f3620}.learnerShell>.topbar:after{content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,transparent,#9dcdbd 22%,#d7b66c 70%,transparent)}.learnerShell .topbar .brandMark{background:linear-gradient(145deg,#d9ecd9,#a9cfae);color:#163d39;box-shadow:0 0 0 1px #ffffff25,0 8px 18px #061b1a55}.learnerShell .topbar .brand b{color:#fff}.learnerShell .topbar .brand small,.learnerShell .topHint{color:#b9d0cc}.learnerShell .portalNav{background:#dfe9e7;border-color:#cfddda;box-shadow:inset 0 1px #fff}.learnerShell .portalNav button[aria-current=page]{color:#174f47;box-shadow:0 5px 16px #183f3810}.learnerShell #homeDashboard>.nextTrainingCard{min-height:370px;background:radial-gradient(circle at 91% 13%,#badaac2b 0 9rem,transparent 9.2rem),linear-gradient(138deg,#102f36,#1f6157 68%,#2d7668);box-shadow:0 24px 58px #153f3822}.learnerShell #homeDashboard>.nextTrainingCard:before{content:"ACTIVE MISSION";align-self:flex-end;padding:7px 10px;border:1px solid #ffffff24;border-radius:999px;color:#c8dfd8;font-size:9px;letter-spacing:.16em}.learnerShell #nextTrainingCard .currentGoal{border-left:3px solid var(--game-gold);background:#091d1d30}.learnerShell .portalAction{position:relative;overflow:hidden}.learnerShell .portalAction:after{content:"";position:absolute;right:-20px;bottom:-30px;width:78px;height:78px;border:15px solid #2d74670a;border-radius:50%}.learnerShell #homeDashboard>.recentCustomers{box-shadow:0 13px 34px #284a4310}.learnerShell .recentCustomer{border-left:3px solid #a9cdbf!important;background:linear-gradient(100deg,#f5faf8,#fff)}.learnerShell .recentCustomer:before{display:none}.learnerShell .portalTip{background:linear-gradient(100deg,#f4f0df,#faf9f3);border-color:#e6dec1}.abilityMap{padding:24px;border:1px solid #d8e6e1;border-radius:18px;background:linear-gradient(145deg,#f2f8f6,#fff)}.abilityMapHead{display:flex;justify-content:space-between;gap:20px;align-items:end}.abilityMapHead h3{margin:5px 0}.abilityMapHead p{max-width:340px;color:#677d78;font-size:13px}.portalAbilities .abilityNode{border-left:0;padding:18px;background:#fff}.abilityNodeTop{display:flex;align-items:center;gap:10px}.abilityNodeTop i{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#e1f0eb;color:#27675b;font-style:normal;font-size:12px}.abilityNodeTop b{flex:1}.abilityNodeTop strong{color:#397a6c;font-size:14px}.abilityTrack{height:7px;margin:14px 0 10px;border-radius:999px;background:#e8efed;overflow:hidden}.abilityTrack span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4c8f80,#d0bd76)}
@media(max-width:600px){.abilityMap{padding:17px}.abilityMapHead{display:block}.learnerShell #homeDashboard>.nextTrainingCard{min-height:330px}}