.premaculture-network,
.premaculture-network * {
  box-sizing: border-box;
  font-family: "DM Sans", Helvetica, Arial, sans-serif !important;
}

.premaculture-network {
  width: min(100%, 980px);
  max-width: 100%;
  margin: 0 auto clamp(2.4rem, 6vw, 5rem);
  padding: 0;
  font-family: "DM Sans", Helvetica, Arial, sans-serif;
}

.premaculture-network button,
.premaculture-network a {
  font-family: inherit;
}

.premaculture-network-directory {
  overflow: hidden;
  padding: clamp(0.95rem, 2vw, 1.35rem);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 22px;
  background: #47626d !important;
  color: #fff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.12);
}

.premaculture-network-directory__header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 1rem;
  padding: 0.1rem 0.35rem 0.35rem;
}

.premaculture-network-directory__count {
  min-width: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: right;
}

.premaculture-network-directory__status {
  padding: clamp(1.6rem, 4vw, 3rem) 1rem;
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.17);
  color: rgba(255, 255, 255, 0.76);
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
}

.premaculture-network-directory__status[hidden] {
  display: none;
}

.premaculture-network-directory__status.is-error {
  color: #ffd9d2;
}

.premaculture-network-directory__list {
  display: grid;
  gap: 0.55rem;
  overflow-x: auto;
  padding: 0.65rem 0.35rem 0.9rem;
  scrollbar-color: rgba(255, 255, 255, 0.38) transparent;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
  scroll-padding-inline: 0.35rem;
}

.premaculture-network-ecosystem {
  width: 100%;
  min-width: 103rem;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.premaculture-network-ecosystem__summary {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 15rem 11rem minmax(59rem, 1fr) 8rem 3.6rem;
  gap: 0.8rem;
  align-items: center;
  min-width: 103rem;
  min-height: 10rem;
  padding: 0.75rem 1.1rem 0.75rem 0;
}

.premaculture-network-ecosystem__summary::before {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: 0.35rem;
  left: 0.35rem;
  height: calc(8.5rem * 0.82);
  border-radius: 0 2rem 2rem 0;
  background: linear-gradient(
    90deg,
    transparent 0,
    rgba(0, 0, 0, 0.06) calc(8.5rem * 0.18),
    rgba(0, 0, 0, 0.34) calc(8.5rem * 1.15),
    rgba(0, 0, 0, 0.34) 100%
  );
  content: "";
  pointer-events: none;
  transform: translateY(-50%);
}

.premaculture-network-ecosystem__summary > * {
  position: relative;
  z-index: 1;
}

.premaculture-network-card-stack {
  position: relative;
  width: 100%;
  height: 8.5rem;
  min-width: 0;
  overflow: visible;
}

.premaculture-network-card-stack__card {
  position: absolute;
  top: 0;
  left: calc(var(--network-card-left) * 1%);
  display: grid;
  width: 8.5rem;
  max-width: none;
  min-width: 0;
  aspect-ratio: 1;
  place-items: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  box-shadow: none;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.premaculture-network-card-stack__card.is-inactive {
  filter: grayscale(0.75);
  opacity: 0.64;
}

.premaculture-network-card-stack__card img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.premaculture-network-card-stack__card .is-e-design {
  z-index: 1;
}

.premaculture-network-card-stack__card .is-e-contour {
  z-index: 2;
}

.premaculture-network-card-stack__card .is-i-design {
  z-index: 3;
  inset: auto;
  top: 84.846875%;
  left: 83.825742%;
  width: 35%;
  height: 35%;
  transform: translate(-50%, -50%);
}

.premaculture-network-card-stack__card .is-e-contour,
.premaculture-network-card-stack__card .is-i-design {
  pointer-events: none;
}

.premaculture-network-card-stack__empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 0;
  color: rgba(255, 255, 255, 0.56);
  font-size: 0.75rem;
  font-weight: 800;
}

.premaculture-network-ecosystem__name {
  position: relative;
  display: grid;
  width: 100%;
  grid-template-rows: minmax(2.25rem, auto) auto;
  align-content: center;
  gap: 0.65rem;
  min-height: 6rem;
  padding: 0.55rem 2.15rem 0.55rem 0.65rem;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #fff;
  cursor: pointer;
  text-align: left;
}

.premaculture-network-ecosystem__title {
  display: -webkit-box;
  overflow: hidden;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.premaculture-network-ecosystem__meta {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}

.premaculture-network-ecosystem__meta small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
}

.premaculture-network-ecosystem__name svg {
  position: absolute;
  top: 50%;
  right: 0.55rem;
  width: 1.45rem;
  height: 1.45rem;
  transform: translateY(-50%);
  transition: transform 180ms ease;
}

.premaculture-network-ecosystem__name svg path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.premaculture-network-ecosystem__name[aria-expanded="true"] svg {
  transform: translateY(-50%) rotate(180deg);
}

.premaculture-network-ecosystem__name:hover,
.premaculture-network-ecosystem__name:focus-visible {
  background: rgba(255, 255, 255, 0.08);
}

.premaculture-network-ecosystem__name:focus-visible,
.premaculture-network-action:focus-visible {
  outline: 3px solid #f4d35e;
  outline-offset: 2px;
}

.premaculture-network-metrics {
  display: grid;
  grid-template-columns: repeat(9, minmax(6.1rem, 1fr));
  gap: 0.35rem;
  min-width: 0;
}

.premaculture-network-metric {
  display: grid;
  min-width: 0;
  min-height: 7.2rem;
  grid-template-rows: 4.7rem minmax(1.55rem, auto);
  align-items: center;
  justify-items: center;
  padding: 0.3rem 0.12rem;
  border-radius: 12px;
  text-align: center;
}

.premaculture-network-metric:hover {
  background: rgba(255, 255, 255, 0.07);
}

.premaculture-network-metric img {
  display: block;
  width: 4.5rem;
  height: 4.5rem;
  object-fit: contain;
}

.premaculture-network-metric strong {
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

.premaculture-network-metric__values {
  display: grid;
  gap: 0.2rem;
  justify-items: center;
  white-space: nowrap;
}

.premaculture-network-metric--practicality strong,
.premaculture-network-metric--productivity strong,
.premaculture-network-metric--harmony strong {
  color: #f4d35e;
}

.premaculture-network-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
}

.premaculture-network-action {
  display: grid;
  width: 3.6rem;
  min-width: 3.6rem;
  height: 3.6rem;
  min-height: 3.6rem;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f7aa35;
  color: #263b43 !important;
  text-decoration: none !important;
  transition: filter 160ms ease, transform 160ms ease;
}

.premaculture-network-action--calendar {
  background: #65ad9e;
}

.premaculture-network-action--contact {
  background: #f4d35e;
}

.premaculture-network-action:hover {
  filter: brightness(1.12);
  transform: translateY(-1px);
}

.premaculture-network-action svg {
  width: 2.2rem;
  height: 2.2rem;
}

.premaculture-network-action svg path,
.premaculture-network-action svg rect {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.premaculture-network-details {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(15rem, 1fr);
  gap: 1rem;
  padding: 0 1.2rem 1.2rem;
}

.premaculture-network-details[hidden] {
  display: none;
}

.premaculture-network-details > div {
  padding: 0.9rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.07);
}

.premaculture-network-details h3 {
  margin: 0 0 0.55rem;
  padding: 0;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.premaculture-network-details__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.38rem;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.74rem;
  line-height: 1.25;
}

.premaculture-network-details__chips span {
  padding: 0.28rem 0.52rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.88);
  font-weight: 700;
}

.premaculture-network-details__chips span.is-inactive {
  opacity: 0.45;
  text-decoration: line-through;
}

@media (max-width: 900px) {
  .premaculture-network-details {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .premaculture-network {
    margin-bottom: 2.5rem;
  }

  .premaculture-network-directory {
    margin-inline: -0.35rem;
    padding: 0.72rem;
    border-radius: 22px;
  }

  .premaculture-network-directory__header {
    padding-right: 0.2rem;
  }

  .premaculture-network-directory__count {
    min-width: 0;
  }

  .premaculture-network-details {
    padding: 0 0.72rem 0.72rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .premaculture-network-ecosystem__name svg,
  .premaculture-network-action {
    transition: none;
  }
}

.premaculture-network-creator{display:grid;place-items:center;width:3.6rem;height:3.6rem;border:2px solid rgba(255,255,255,.65);border-radius:50%;overflow:hidden;background:#4d616c}.premaculture-network-creator img{display:block;width:100%;height:100%;object-fit:cover}

/* Solid ecosystem bars with independent card and synchronized value carousels. */
.premaculture-network{width:100%}.premaculture-network-ecosystem{min-width:860px;border-radius:24px;background:#334047}.premaculture-network-ecosystem__summary{min-width:860px;grid-template-columns:76px minmax(135px,1fr) 154px 164px 88px 48px;gap:12px;min-height:150px;padding:16px;border-radius:24px;background:#334047}.premaculture-network-ecosystem__summary::before{display:none}.premaculture-network-creator{width:48px;height:48px;border:0;background:transparent;box-shadow:none}.network-ecosystem-photo{position:relative;text-align:center}.network-ecosystem-photo>img{width:72px;height:72px;object-fit:cover;border-radius:50%;display:block}.network-photo-upload{font-size:10px!important;background:none;border:0;color:#edf3f6;text-decoration:underline;cursor:pointer;margin-top:8px}.network-photo-status{display:block;color:#edf3f6;font-size:10px;max-width:76px}.network-photo-status:empty{display:none}.premaculture-network-ecosystem__name{padding:8px 16px 8px 0;gap:8px;min-height:80px}.premaculture-network-ecosystem__meta{flex-wrap:wrap;gap:6px}.premaculture-network-ecosystem__title{font-size:15px}.network-carousel{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;gap:3px;align-items:center;min-width:0}.network-carousel-arrow{display:grid;place-items:center;background:none;border:0;padding:0;width:24px;height:36px;color:#edf3f6;cursor:pointer}.network-carousel-arrow:disabled{opacity:.2;cursor:default}.network-carousel-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.network-carousel-arrow:focus-visible,.network-photo-upload:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:6px}.network-carousel .premaculture-network-card-stack{height:104px;width:100%}.network-carousel .premaculture-network-card-stack__card{position:relative;top:auto;left:auto!important;width:100%;height:104px;aspect-ratio:1;z-index:auto!important}.network-carousel [hidden]{display:none!important}.network-carousel .premaculture-network-metrics{display:block}.network-carousel .premaculture-network-metric{grid-template-rows:54px 18px auto;min-height:104px;padding:0;gap:4px}.network-carousel .premaculture-network-metric img{width:52px;height:52px}.network-metric-label{font-size:10px;color:#edf3f6;line-height:1.1}.network-carousel .premaculture-network-metric strong{font-size:11px}.premaculture-network-actions{gap:8px}.premaculture-network-action,.premaculture-network-action--calendar{width:40px;min-width:40px;height:40px;min-height:40px;background:#4d616c;color:#edf3f6!important;border-radius:12px}.premaculture-network-action svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.premaculture-network-details{background:#334047;border-radius:0 0 24px 24px}.premaculture-network-ecosystem__summary:has(+.premaculture-network-details:not([hidden])){border-radius:24px 24px 0 0}

.network-ecosystem-photo>img.is-default-logo{object-fit:contain;border-radius:0;padding:4px}.premaculture-network-creator img[src*="/platform/logo.svg"]{object-fit:contain;padding:6px;border-radius:0}

/* Fully rounded row ends, including when the portion details are open. */
.premaculture-network-ecosystem{border-radius:0;background:transparent;overflow:visible}
.premaculture-network-ecosystem__summary,
.premaculture-network-ecosystem__summary:has(+.premaculture-network-details:not([hidden])){border-radius:9999px;padding-inline:32px}
.premaculture-network-details{margin-top:8px;border-radius:24px}

/* Show only the circular value artwork; its name remains available to assistive technology. */
.network-carousel .premaculture-network-metric{grid-template-rows:54px auto;align-content:center;gap:8px}
.network-metric-icon{display:block;position:relative;width:52px;height:52px;overflow:hidden;border-radius:50%;justify-self:center}
.network-carousel .network-metric-icon img{position:absolute;width:66.667px;height:66.667px;max-width:none;left:-7.333px;top:-8.667px}

/* Expand portion stacks within the row; keep every value visible for comparison. */
.premaculture-network-ecosystem{min-width:1414px;width:max-content;min-width:max(100%,1414px)}
.premaculture-network-ecosystem__summary{width:max-content;min-width:100%;grid-template-columns:76px 150px var(--portion-width,148px) 576px 216px 104px;gap:16px}
.network-portion-toggle{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;text-align:left}
.network-portion-toggle:disabled{cursor:default;opacity:1}
.network-portion-toggle:focus-visible{outline:2px solid #edf3f6;outline-offset:6px;border-radius:12px}
.network-portion-toggle .premaculture-network-card-stack{height:104px;width:148px}
.network-portion-toggle .premaculture-network-card-stack__card{width:104px;height:104px;left:calc(var(--network-card-left) * 1px)}
.has-expanded-portions .premaculture-network-card-stack{display:flex;width:max-content;gap:12px}
.has-expanded-portions .premaculture-network-card-stack__card{position:relative;left:auto;flex:0 0 104px}
.premaculture-network-metrics{grid-template-columns:repeat(9,64px);gap:0;align-items:center}
.premaculture-network-metric{grid-template-rows:54px auto;align-content:center;min-height:104px;padding:0;gap:8px}
.network-metric-icon img{position:absolute;width:66.667px!important;height:66.667px!important;max-width:none;left:-7.333px;top:-8.667px}
.premaculture-network-metric strong{font-size:11px}
.premaculture-network-creator{width:104px;height:104px}
.premaculture-network-actions{display:flex;gap:8px}
.premaculture-network-action,.premaculture-network-action--calendar{width:104px;min-width:104px;height:104px;min-height:104px;border-radius:50%;background:#4d616c;border:0;box-shadow:none}
.premaculture-network-action svg{width:56px;height:56px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.premaculture-network-creator img{width:104px;height:104px;min-width:0;min-height:0;box-sizing:border-box}

/* Equal circle sizes and concise numeric values. */
.premaculture-network-ecosystem{min-width:max(100%,2028px)}
.premaculture-network-ecosystem__summary{grid-template-columns:104px 280px var(--portion-width,148px) 1032px 216px 104px;min-height:166px}
.network-ecosystem-photo>img{width:104px;height:104px}
.premaculture-network-metrics{grid-template-columns:repeat(9,104px);gap:12px}
.premaculture-network-metric{grid-template-rows:104px 18px;gap:8px;min-height:130px}
.network-metric-icon{width:104px;height:104px}
.network-metric-icon img{width:133.334px!important;height:133.334px!important;left:-14.667px;top:-17.334px}
.premaculture-network-metric strong{font-size:13px;line-height:18px;white-space:nowrap}
.network-portion-toggle,.premaculture-network-actions,.premaculture-network-creator,.network-ecosystem-photo{margin-bottom:0}

/* A single top portion card, with one proportional position segment per portion. */
.network-portion-toggle{margin-bottom:0;width:120px;align-self:center}
.network-portion-toggle .premaculture-network-card-stack{width:120px;height:104px}
.network-portion-toggle .premaculture-network-card-stack__card{width:111.569px;height:111.569px;left:-2.004px;top:-3.633px}
.network-portion-toggle .premaculture-network-card-stack__card[hidden]{display:none!important}
.network-portion-markers{position:absolute;top:116px;left:0;display:flex;width:104px;height:4px;gap:2px;margin:0}
.network-portion-markers>span{flex:1;min-width:0;border-radius:2px;background:rgba(237,243,246,.12)}
.network-portion-markers>span.is-current{background:rgba(237,243,246,.4)}
.network-portion-markers:empty{display:none}
.premaculture-network-metric{grid-template-rows:104px;min-height:104px;margin-bottom:0}

/* Place numeric values below centered circles without shifting the circles upward. */
.premaculture-network-metric{position:relative}
.premaculture-network-metric>strong{position:absolute;top:112px;left:0;width:100%;text-align:center}

/* Lock the pill and circle geometry independently of the labels beneath. */
.premaculture-network-ecosystem{padding-bottom:0}
.premaculture-network-ecosystem__summary,
.premaculture-network-ecosystem__summary:has(+.premaculture-network-details:not([hidden])){height:160px;min-height:160px;grid-template-rows:104px;padding-block:28px;box-sizing:border-box;align-items:center}

/* Center each smaller value circle and its caption together inside the row. */
.premaculture-network-metric{grid-template-rows:80px 18px;gap:6px;min-height:104px;height:104px;align-content:center}
.premaculture-network-metric .network-metric-icon{width:80px;height:80px}
.premaculture-network-metric .network-metric-icon img{width:102.565px!important;height:102.565px!important;left:-11.282px;top:-13.334px}
.premaculture-network-metric>strong{position:static;width:100%;text-align:center;align-self:center}

/* One identity language for account ecosystems and the editable Protocol bar. */
.network-meta-actions .ecosystem-summary-location,
.protocol-summary-details .ecosystem-summary-location {
  display:flex; align-items:center; gap:6px; min-width:0; width:auto; height:20px;
  padding:0; transform:none; color:#edf3f6!important; background:transparent;
  font-size:11px; font-weight:700; line-height:16px; text-decoration:none!important;
}
.ecosystem-summary-location svg,
.network-meta-actions .ecosystem-summary-location svg {
  width:14px; height:14px; flex:none; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.ecosystem-summary-location span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ecosystem-summary-location:focus-visible { outline:2px solid #f4d35e; outline-offset:3px; border-radius:4px; }
.network-name-meta-row .ecosystem-summary-stat,
.protocol-summary-fields .ecosystem-summary-stat {
  display:grid; grid-template-columns:14px minmax(0,1fr); align-items:center;
  gap:6px; margin:0; padding:0; color:rgba(255,255,255,.72);
  font-size:11px; font-weight:700; line-height:16px;
}
.ecosystem-summary-stat .ecosystem-summary-symbol {
  display:grid; place-items:center; width:14px; height:16px; padding:0;
  font-size:14px; line-height:1; font-weight:500; color:inherit;
}
