/* Desktop diagrams keep their original layout and controls. */
.diagram-mobile-overview,
.diagram-mobile-detail,
.diagram-mobile-content { display:contents; }
.diagram-mobile-steps,
.diagram-mobile-detail>summary { display:none; }

@media(max-width:760px) {
  .diagram-mobile-overview { display:block; min-width:0; }
  .diagram-mobile-steps {
    display:block;
    list-style:none;
    counter-reset:diagram-step;
    margin:0;
    padding:0;
    border-top:1px solid var(--line,#cbd0c7);
  }
  .diagram-mobile-steps>li {
    counter-increment:diagram-step;
    position:relative;
    padding:20px 0 20px 40px;
    border-bottom:1px solid var(--line,#cbd0c7);
  }
  .diagram-mobile-steps>li::before {
    content:counter(diagram-step,decimal-leading-zero);
    position:absolute;
    top:23px;
    left:0;
    color:var(--lavender-ink,var(--lavender-ink));
    font:400 11px/1.5 var(--font-mono,Consolas,monospace);
  }
  .diagram-mobile-steps strong {
    display:block;
    color:var(--ink,#1e2a24);
    font:400 18px/1.4 var(--font-sans,Pretendard,sans-serif);
    letter-spacing:-.02em;
  }
  .diagram-mobile-steps p {
    margin:6px 0 0;
    max-width:42ch;
    color:var(--muted,var(--muted));
    font:400 14px/1.65 var(--font-sans,Pretendard,sans-serif);
  }
  .diagram-mobile-detail { display:block; }
  .diagram-mobile-detail>summary {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    min-height:60px;
    padding:14px 0;
    list-style:none;
    cursor:pointer;
    color:var(--ink,#1e2a24);
    font:400 14px/1.5 var(--font-sans,Pretendard,sans-serif);
  }
  .diagram-mobile-detail>summary::-webkit-details-marker { display:none; }
  .diagram-mobile-detail>summary::after {
    content:'+';
    flex:none;
    color:var(--lavender-ink,var(--lavender-ink));
    font-size:24px;
    line-height:1;
  }
  .diagram-mobile-detail[open]>summary::after { content:'−'; }
  .diagram-mobile-detail>summary:focus-visible {
    outline:2px solid var(--lavender-ink,var(--lavender-ink));
    outline-offset:3px;
  }
  .diagram-mobile-detail[open]>.diagram-mobile-content { display:block; padding-top:12px; }
  .diagram-mobile-detail:not([open])>.diagram-mobile-content { display:none; }
}