/* IA beta refinement: balanced rhythm, lateral insets and structural title alignment in section 03. */

/* Desktop rhythm: equal top and bottom padding within each node family. */
.entry-node{padding:16px 24px!important}
.context-node{padding:18px!important}
.output-node{padding:18px!important}
.foundation-node{padding:18px!important}
.cycle-node{padding:14px!important}

/* Section 03: phase above, title centered on the same 50px row as the icon. */
.cycle-node{
  display:grid!important;
  grid-template-columns:50px minmax(0,1fr)!important;
  grid-template-rows:auto 50px auto!important;
  column-gap:13px;
  row-gap:4px;
  align-content:start;
}
.cycle-node-marker{
  grid-column:1!important;
  grid-row:2!important;
  align-self:center!important;
  margin:0!important;
}
.cycle-node-heading{
  display:contents!important;
  height:auto!important;
}
.cycle-node-heading .mini-label{
  grid-column:2!important;
  grid-row:1!important;
  align-self:end;
  margin:0 0 2px!important;
  line-height:1;
}
.cycle-node-heading h3{
  grid-column:2!important;
  grid-row:2!important;
  align-self:center!important;
  margin:0!important;
  line-height:1.2;
  min-width:0;
}
.cycle-node>p{
  grid-column:2!important;
  grid-row:3!important;
  margin:0!important;
  min-width:0;
}

@media (max-width:1100px), (pointer:coarse), (hover:none){
  /* Every mobile node keeps a real inset on both lateral edges. */
  .entry-node,
  .context-node,
  .output-node,
  .foundation-node,
  .cycle-node{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .entry-node{padding:16px 16px 16px 82px!important}
  .context-node,.context-node[data-node]{padding:16px 16px 16px 74px!important}
  .output-node,.output-node[data-side],.output-node[data-node]{padding:16px 16px 16px 75px!important}
  .foundation-node{padding:16px 16px 16px 75px!important}

  .entry-node .ic,
  .context-node .ic,
  .output-node .ic,
  .foundation-node .ic{
    top:16px!important;
    left:16px!important;
  }

  /* Re-center vertical circuit traces through the newly inset icons. */
  .entry-circuit::before{left:40px!important}
  .output-circuit::before{left:38px!important}
  .foundation-circuit::before{left:38px!important}
  .cycle-circuit::before{left:41px!important}

  .cycle-node{
    grid-template-columns:50px minmax(0,1fr)!important;
    grid-template-rows:auto 50px auto!important;
    column-gap:14px!important;
    row-gap:4px!important;
    padding:16px!important;
  }
  .cycle-node-marker{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    grid-column:1!important;
    grid-row:2!important;
    align-self:center!important;
  }
  .cycle-node-heading{
    display:contents!important;
  }
  .cycle-node-heading .mini-label{
    grid-column:2!important;
    grid-row:1!important;
    margin:0 0 2px!important;
  }
  .cycle-node-heading h3{
    grid-column:2!important;
    grid-row:2!important;
    align-self:center!important;
  }
  .cycle-node>p{
    grid-column:2!important;
    grid-row:3!important;
    margin:0!important;
  }
}