
body{color:var(--text);font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;line-height:1.55;word-break:keep-all;overflow-wrap:anywhere}
h1{font-size:26px;line-height:1.18;letter-spacing:0;margin:0 0 8px;font-weight:850;color:var(--text)}
h1,h2,p{margin-top:0}
.ts-ch2-ch2-5-frame{display:grid;gap:0;border:1px solid var(--line);border-radius:8px;padding:20px;background:var(--paper)}
.ts-ch2-ch2-5-badge{display:inline-flex;align-items:center;justify-self:start;border:1px solid color-mix(in srgb,var(--track) 34%,var(--line));background:var(--track-tint);color:var(--track-strong);border-radius:7px;padding:4px 9px;font-size:12px;font-weight:800;margin-bottom:10px}
.ts-ch2-ch2-5-lead{margin:0;color:var(--muted);font-size:15px}
.ts-ch2-ch2-5-path,.ts-ch2-ch2-5-cards,.ts-ch2-ch2-5-states,.ts-ch2-ch2-5-layers,.ts-ch2-ch2-5-timeline{display:grid;gap:10px;margin-top:18px}
.ts-ch2-ch2-5-path{grid-template-columns:repeat(var(--cols,4),minmax(0,1fr))}
.ts-ch2-ch2-5-cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.ts-ch2-ch2-5-states{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}
.ts-ch2-ch2-5-layers{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.ts-ch2-ch2-5-timeline{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.ts-ch2-ch2-5-step,.ts-ch2-ch2-5-card,.ts-ch2-ch2-5-state,.ts-ch2-ch2-5-layer,.ts-ch2-ch2-5-time{position:relative;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:12px;min-width:0}
.ts-ch2-ch2-5-path .ts-ch2-ch2-5-step{min-height:112px}
.ts-ch2-ch2-5-step:not(:last-child)::after{content:"→";position:absolute;right:-14px;top:50%;transform:translateY(-50%);color:var(--line-strong);font-weight:900;background:var(--paper);padding:0 2px}
.ts-ch2-ch2-5-loop{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px}
.ts-ch2-ch2-5-loop .ts-ch2-ch2-5-step::after{content:"↻";right:-15px;color:var(--track)}
.ts-ch2-ch2-5-loop .ts-ch2-ch2-5-step:last-child::after{content:"↺";right:8px;top:10px;transform:none;background:transparent}
.ts-ch2-ch2-5-num,.ts-ch2-ch2-5-label{display:block;color:var(--track-strong);font-size:12px;font-weight:850;margin-bottom:6px}
.ts-ch2-ch2-5-name{font-weight:850;color:var(--text);font-size:17px;margin-bottom:5px}
.ts-ch2-ch2-5-desc{color:var(--muted);font-size:14px}
.ts-ch2-ch2-5-matrix{width:100%;border-collapse:separate;border-spacing:0;margin-top:12px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ts-ch2-ch2-5-matrix th,.ts-ch2-ch2-5-matrix td{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;font-size:14px}
.ts-ch2-ch2-5-matrix th{background:var(--surface);color:var(--text);font-weight:850}
.ts-ch2-ch2-5-matrix tr:last-child td{border-bottom:0}
.ts-ch2-ch2-5-matrix th:last-child,.ts-ch2-ch2-5-matrix td:last-child{border-right:0}
.ts-ch2-ch2-5-term{color:var(--track-strong);font-weight:850;white-space:nowrap}
.ts-ch2-ch2-5-note{margin:12px 0 0;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:11px 12px;color:var(--muted);font-size:14px}
.ts-ch2-ch2-5-note b{color:var(--track)}
code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;background:var(--track-tint);border:1px solid color-mix(in srgb,var(--track) 30%,var(--line));border-radius:6px;padding:1px 4px;color:var(--track-strong);overflow-wrap:anywhere}
@media (max-width:640px){
  .ts-ch2-ch2-5-frame{padding:16px}
  h1{font-size:24px}
  .ts-ch2-ch2-5-path,.ts-ch2-ch2-5-loop,.ts-ch2-ch2-5-cards,.ts-ch2-ch2-5-states,.ts-ch2-ch2-5-layers,.ts-ch2-ch2-5-timeline{grid-template-columns:1fr}
  .ts-ch2-ch2-5-path .ts-ch2-ch2-5-step{min-height:auto}
  .ts-ch2-ch2-5-step:not(:last-child)::after,.ts-ch2-ch2-5-loop .ts-ch2-ch2-5-step::after,.ts-ch2-ch2-5-loop .ts-ch2-ch2-5-step:last-child::after{content:"";display:none}
}
@media (max-width:360px){
  .ts-ch2-ch2-5-frame{padding:14px}
  h1{font-size:22px}
  .ts-ch2-ch2-5-lead{font-size:14px}
  .ts-ch2-ch2-5-matrix th,.ts-ch2-ch2-5-matrix td{padding:8px 9px;font-size:13px}
  .ts-ch2-ch2-5-term{white-space:normal}
}
