/* A website explainer, not a simulated app or a drag-and-drop control. */
.team-map { max-width: 1120px; margin: 40px auto 0; color: #1d2119; text-align: left; scroll-margin-top: 96px; }
.team-map, .team-map * { box-sizing: border-box; }
.team-map [hidden] { display: none !important; }
.team-map__intro { margin-bottom: 22px; }
.team-map__eyebrow { margin: 0 0 7px; color: #677433; font-size: 11px; font-weight: 600; letter-spacing: .065em; text-transform: uppercase; }
.team-map__intro .team-map__title { margin: 0 0 8px; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.2; font-weight: 500; letter-spacing: -.035em; }
.team-map__intro > p:last-child { margin: 0; color: #65685f; font-size: 15px; line-height: 1.6; }
.team-map__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; }
.team-map__tabs button { min-height: 44px; padding: 10px 22px; border: 1px solid #e3e6da; border-radius: 9px; background: #fff; color: #5b6154; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
.team-map__tabs button:hover { background: #f7f8f1; }
.team-map__tabs button[aria-selected=true] { border-color: #64752b; background: #eef2df; color: #36471e; }
.team-map :is(button, a, summary):focus-visible { outline: 2px solid #64752b; outline-offset: 4px; }
.team-map__panel:focus-visible { outline: 2px solid #64752b; outline-offset: 4px; }
.team-map__panel { border: 1px solid #e1e5d7; border-radius: 20px; background: #f8f9f4; overflow: hidden; }
.team-map__panel + .team-map__panel { margin-top: 24px; }
.team-map[data-enhanced] .team-map__panel { margin-top: 0; }
.team-map__room { padding: 26px 28px 20px; }
.team-map__room-heading { display: flex; gap: 10px; align-items: center; }
.team-map__room-label { color: #5c6b2f; font-size: 12px; font-weight: 600; }
.team-map__room-kind { border: 1px solid #d8ddcb; border-radius: 5px; color: #677159; padding: 2px 6px; font-size: 10px; }
.team-map__room .team-map__question { margin: 12px 0; font-size: clamp(20px, 2.1vw, 26px); font-weight: 500; letter-spacing: -.03em; line-height: 1.3; }
.team-map__context { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 12px; margin: 0; color: #646b59; font-size: 13px; line-height: 1.6; }
.team-map__context > span { color: #68715c; }
.team-map__roster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; list-style: none; margin: 0; padding: 0 28px 22px; }
.team-map__mate { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 18px; border: 1px solid #e4e4dc; border-radius: 13px; background: #fff; box-shadow: 0 3px 9px #20291d04; }
.team-map__identity { display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.team-map__identity:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.team-map__identity > img { display: block; width: 64px; height: 64px; flex: 0 0 64px; object-fit: contain; border-radius: 50%; }
.team-map__identity strong { display: block; font-size: 17px; font-weight: 500; line-height: 1.4; }
.team-map__identity > span > span { display: block; color: #696b60; font-size: 11px; line-height: 1.4; }
.team-map__mate > p { flex: 1; margin: 15px 0 18px; font-size: 14px; line-height: 1.5; color: #4c5046; }
.team-map__model { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: 10px; color: #7a635e; border: 1px solid #ece0dc; border-radius: 5px; padding: 3px 7px; }
.team-map__model > span { width: 5px; height: 5px; border-radius: 50%; background: #b27969; }
.team-map__memory { display: flex; align-items: center; gap: 12px; margin: 0 28px 22px; padding: 13px 16px; border: 1px dashed #d1d8bd; border-radius: 9px; }
.team-map__memory-mark { color: #758340; font-size: 22px; line-height: 1; }
.team-map__memory p { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0; font-size: 12px; line-height: 1.6; }
.team-map__memory strong { color: #586532; font-weight: 500; }
.team-map__memory p > span { color: #656e59; }
.team-map__decision { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 22px 28px; border-top: 1px solid #e3e6d9; background: #fff; }
.team-map__human { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #eaf0d9; color: #586a2e; font-size: 12px; font-weight: 500; }
.team-map__decision div > p:last-child { margin: 0; color: #555c4b; font-size: 13px; line-height: 1.6; max-width: 62ch; }
.team-map__decision > a { display: block; white-space: nowrap; color: #3f5029; font-size: 13px; line-height: 1.5; text-decoration: underline; text-underline-offset: 4px; }
.team-map__lesson { background: #fff; border-top: 1px solid #edf0e6; padding: 0 28px; }
.team-map__lesson > summary { padding: 16px 0; cursor: pointer; color: #646d55; font-size: 13px; }
.team-map__lesson > div { padding: 0 0 20px; }
.team-map__lesson p { margin: 0; font-size: 14px; line-height: 1.6; color: #424c35; }
.team-map__lesson p + p { margin-top: 8px; font-size: 13px; color: #6e7465; }
.team-map__lesson a, .team-map__caption a { color: #586b32; text-decoration: underline; text-underline-offset: 3px; }
.team-map__caption { margin: 15px 0 0; font-size: 12px; line-height: 1.6; color: #676f5c; }
.product-team-explainer { padding: 0 24px; margin: 50px auto 70px; }
@media (max-width: 800px) {
  .team-map__roster { gap: 10px; padding-inline: 20px; }
  .team-map__mate { padding: 14px; }
  .team-map__identity { flex-direction: column; align-items: flex-start; }
  .team-map__room { padding-inline: 20px; }
  .team-map__memory { margin-inline: 20px; }
  .team-map__decision { grid-template-columns: 38px 1fr; padding: 20px; gap: 12px; }
  .team-map__decision > a { grid-column: 2; max-width: none; }
  .team-map__lesson { padding-inline: 20px; }
}
@media (max-width: 560px) {
  .team-map { margin-top: 28px; }
  .team-map__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
  .team-map__tabs button { padding-inline: 12px; }
  .team-map__panel { border-radius: 16px; }
  .team-map__room { padding: 20px 18px 18px; }
  .team-map__context { display: block; }
  .team-map__context > span { display: block; margin-bottom: 4px; }
  .team-map__roster { grid-template-columns: 1fr; padding: 0 18px 18px; }
  .team-map__mate { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 9px 10px; padding: 13px; }
  .team-map__identity { flex-direction: row; align-items: center; }
  .team-map__identity > img { width: 48px; height: 48px; flex-basis: 48px; }
  .team-map__mate > p { grid-row: 2; grid-column: 1 / -1; margin: 0; font-size: 13px; }
  .team-map__model { grid-column: 2; grid-row: 1; align-self: center; }
  .team-map__memory { margin: 0 18px 18px; padding: 10px 12px; }
  .team-map__memory p { display: block; }
  .team-map__memory p > span { display: block; margin-top: 3px; }
  .team-map__decision { padding-inline: 18px; }
  .team-map__lesson { padding-inline: 18px; }
  .product-team-explainer { padding-inline: 18px; margin-block: 32px 48px; }
}
@media (forced-colors: active) {
  .team-map__tabs button[aria-selected=true] { outline: 2px solid Highlight; outline-offset: -3px; }
  .team-map__human, .team-map__mate, .team-map__memory { border: 1px solid CanvasText; }
}