/* The work map: four fields around one hub, drawn with the site's line icons and tokens.
   Connectors are measured in script from real button borders and never cross a label. */
.work-specimen{--map-accent:var(--ds-green);--map-soft:var(--ds-green-soft);min-width:0;overflow:hidden;border:1px solid var(--ds-line);border-radius:10px;background:var(--ds-surface)}
.specimen-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px 8px;color:var(--ds-ink);font-size:12px;font-weight:500}
.specimen-caption__detail{color:var(--ds-muted);font-size:11px;font-weight:400}
.work-map{position:relative;isolation:isolate;height:124px;margin:0 16px;border-radius:8px;background-image:radial-gradient(var(--ds-line-strong) .6px,transparent .6px);background-size:14px 14px}
.work-map__connections{position:absolute;inset:0;z-index:0;width:100%;height:100%;pointer-events:none}
.work-map__connections path{fill:none;stroke:var(--ds-line-strong);stroke-width:1.1;vector-effect:non-scaling-stroke;transition:stroke .18s}
.work-map__connections path.is-active{stroke:var(--map-accent);stroke-width:1.6}
.work-map__core{position:absolute;inset:50% auto auto 50%;z-index:1;display:grid;place-items:center;width:70px;height:70px;border:1px solid var(--ds-line);border-radius:19px;background:var(--ds-surface);box-shadow:0 0 0 7px var(--ds-surface),0 0 32px var(--map-soft);color:var(--map-accent);transform:translate(-50%,-50%);transition:color .18s}
.work-map__core svg{width:46px;height:46px}
.work-map__fields{position:absolute;inset:0;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 86px minmax(0,1fr);grid-template-rows:46px 32px 46px;column-gap:8px;pointer-events:none}
.work-map__fields button{display:flex;align-items:center;align-self:center;justify-content:center;gap:8px;min-width:0;min-height:46px;padding:8px;border:1px solid var(--ds-line);border-radius:8px;background:var(--ds-surface);color:var(--ds-body);font:500 13px/1.35 var(--ds-font);pointer-events:auto;cursor:pointer;transition:border-color .18s,background .18s,color .18s}
.work-map__fields button svg{flex:none;width:21px;height:21px;color:var(--field)}
.work-map__fields button[data-field=research]{--field:var(--ds-green);--field-soft:var(--ds-green-soft);grid-area:1/1}
.work-map__fields button[data-field=code]{--field:var(--ds-cyan);--field-soft:var(--ds-cyan-soft);grid-area:1/3}
.work-map__fields button[data-field=math]{--field:var(--ds-study);--field-soft:var(--ds-tint);grid-area:3/1}
.work-map__fields button[data-field=teaching]{--field:var(--ds-purple);--field-soft:var(--ds-purple-soft);grid-area:3/3}
.work-map__fields button:is(:hover,[aria-selected=true]){border-color:var(--field);background:var(--field-soft);color:var(--field)}
.work-map__fields button[aria-selected=true]{box-shadow:inset 0 0 0 .5px var(--field)}
.work-map__detail{display:flex;flex-direction:column;align-items:start;padding:12px 16px 6px}
.work-map__description{min-height:3.4em;max-width:52ch;color:var(--ds-body);font-size:var(--ds-text-sm);line-height:1.7}
.work-map__detail .text-link{display:inline-flex;align-items:center;min-height:44px}
@media (width < 1200px){
 .work-map__fields{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr)}
 .work-map__fields button{gap:6px;font-size:12px}
}
@media (width < 1000px){
 .work-map{height:148px}
 .work-map__fields{grid-template-rows:58px 32px 58px}
 .work-map__fields button{flex-direction:column;gap:3px;min-height:58px;padding:5px}
 .work-map__core{width:56px;height:56px;border-radius:14px}
 .work-map__core svg{width:38px;height:38px}
}
@media (width < 360px){
 .work-map__fields{grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr);column-gap:6px}
 .work-map__fields button{font-size:11px}
 .work-map__core{width:44px;height:44px;border-radius:12px}
 .work-map__core svg{width:30px;height:30px}
}
@media (prefers-reduced-motion:reduce){.work-map *{transition:none!important}}
@media (forced-colors:active){
 .work-map__fields button[aria-selected=true]{border-color:LinkText;color:LinkText}
 .work-map__connections path{stroke:CanvasText}
 .work-map__connections path.is-active{stroke:LinkText}
}
