:root{--code:#79e6c0;--design:#f3b9d7;--data:#aeb8ff;--project:#f1cf76}
.career-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:24px;align-items:stretch}
.career-compass{background:#111f32;border:1px solid #486980;border-radius:22px;padding:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.career-compass span{min-height:92px;border:1px solid currentColor;border-radius:14px;padding:14px;display:flex;align-items:flex-end;font-weight:700}
.career-compass span:nth-child(1){color:var(--code)}.career-compass span:nth-child(2){color:var(--design)}.career-compass span:nth-child(3){color:var(--data)}.career-compass span:nth-child(4){color:var(--project)}
.career-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:34px}
.career-role{background:#142235;border:1px solid #49677f;border-radius:22px;padding:26px}
.career-role[data-role=code]{border-color:#4f9a83}.career-role[data-role=design]{border-color:#9a6e88}.career-role[data-role=data]{border-color:#7379ae}.career-role[data-role=project]{border-color:#a18645}
.career-role h2{margin:10px 0}.career-role h3{font-size:18px;margin:24px 0 8px}.career-role ul{padding-left:22px}
.role-signal{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:18px 0}
.role-signal span{background:#0d1a2b;border:1px solid #45627c;border-radius:10px;padding:10px 6px;text-align:center;font-size:13px;font-weight:700}
.career-lessons{display:grid;gap:10px;margin:18px 0}
.career-lessons a{display:block;background:#0d1a2b;border:1px solid #3c5872;border-radius:12px;padding:12px 14px;text-decoration:none}
.career-lessons a:hover{background:#172b42}.career-lessons a:active{transform:translateY(1px)}
.career-caution{background:#251d1a;border:1px solid #9c7651;border-radius:14px;padding:14px 16px}
.career-phrase{background:#102a28;border:1px solid #4d897b;border-radius:14px;padding:14px 16px}
.career-project{margin-top:38px}
.career-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.career-project-grid article{background:#0d1a2b;border:1px solid #3f5c75;border-radius:14px;padding:16px}
.career-project-grid h3{margin-top:0}
.career-safety{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.career-safety div{background:#111f32;border:1px solid #486980;border-radius:14px;padding:16px}
.career-safety strong{display:block;color:var(--mint);margin-bottom:6px}
@media(max-width:760px){.career-intro,.career-grid,.career-project-grid,.career-safety{grid-template-columns:1fr}.career-compass{grid-template-columns:1fr 1fr}.career-role{padding:22px}}
@media(max-width:430px){.career-compass{grid-template-columns:1fr}.role-signal{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.career-lessons a:active{transform:none}}