.concept {
  max-width: 760px;
  margin: 0 auto;
  color: #fff8ee;
  text-shadow: 0 1px 10px #0006;
}
.concept h2 {
  margin: 0;
  font: 600 clamp(32px, 3.2vw, var(--type-title, 46px))/1.08 var(--serif);
  letter-spacing: -.03em;
}
.concept-intro,
.concept-meaning,
.concept-cue {
  margin: 12px 0 0;
  max-width: 58ch;
  font: 400 18px/1.5 var(--serif);
}
.concept-cue { color: #ffdbb8; min-height: 2.6em; }
.concept-modes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.concept-modes button,
.concept-tools button {
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid #fff8ee66;
  border-radius: 3px;
  background: transparent;
  color: #fff8ee;
  font: 500 15px/1.3 var(--sans);
  text-shadow: none;
  cursor: pointer;
}
.concept-modes button[aria-pressed="true"] {
  background: #ffdbb8;
  border-color: #ffdbb8;
  color: #1b2433;
}
.concept-modes button:focus-visible,
.concept-tools button:focus-visible { outline: 2px solid #ffdbb8; outline-offset: 3px; }
.concept-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin-top: 16px;
}
.concept-bar .concept-modes { margin-top: 0; }
.concept-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-inline-start: auto; }
.concept-tools .is-quiet { min-height: 36px; padding: 4px 10px; font-size: 13px; }
.concept-tools button[aria-pressed="true"] {
  background: transparent;
  color: #fff8ee;
  border-color: #ffdbb8;
}
.concept-canvas.is-tap,
.concept-canvas.is-tap.is-dragging { cursor: pointer; }
.concept-canvas.is-network { height: 480px; }
.concept-canvas.is-over-node { cursor: pointer; }
.concept-canvas.is-material.is-over-node { cursor: grab; }
.concept-meaning.is-network,
.concept-cue.is-network { min-height: 4.8em; }
.concept-stage {
  margin-top: 14px;
  background: #0d1a2ed9;
  border-radius: 8px;
  touch-action: none;
}
.concept-canvas,
.concept-svg {
  display: block;
  width: 100%;
  height: 380px;
  cursor: grab;
}
.concept-svg { height: auto; }
.concept-canvas.is-dragging,
.concept-svg.is-dragging { cursor: grabbing; }
.concept-canvas.is-press,
.concept-canvas.is-press.is-dragging { cursor: pointer; }
.concept-note {
  margin: 10px 0 0;
  max-width: 58ch;
  font: 400 15px/1.45 var(--sans);
  color: #fff8eedd;
  text-shadow: none;
}
.concept-note a,
.concept-intro a.concept-link { color: #ffdbb8; }
.concept-intro a.concept-link { text-decoration: underline; text-underline-offset: .16em; text-decoration-thickness: 1px; }
.concept-loop {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}
.concept-loop li { display: flex; align-items: center; color: #fff8eebb; font: 500 14px/1.3 var(--sans); text-shadow: none; }
.concept-loop li span {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid #fff8ee44;
  border-radius: 999px;
}
.concept-loop li.is-on span { background: #ffdbb8; border-color: #ffdbb8; color: #1b2433; }
.concept-loop li.is-broken span { opacity: .4; }
.concept-loop li:not(:last-child)::after { content: "→"; margin: 0 8px; color: #ffdbb8cc; }
html[dir="rtl"] .concept-loop li:not(:last-child)::after { content: "←"; }
.concept-loop[data-open="false"] li[data-step="move"]::after { content: "×"; color: #fff8ee77; }
.concept-coil { fill: none; stroke: #ffdbb8; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.concept-rest { fill: none; stroke: #fff8ee55; stroke-width: 1.5; stroke-dasharray: 5 5; }
.concept-wall { fill: #ffdbb8; }
.concept-plate { fill: #fff8ee; stroke: #ffdbb8; stroke-width: 2; }
.concept-arrow { fill: none; stroke: #ffdbb8; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.concept-arrow.is-return { stroke: #fff8ee; }
.concept-arrow-label { fill: #fff8ee; font: 13px var(--sans); }
@media (max-width: 700px) {
  .concept-canvas { height: 300px; }
  .concept-canvas.is-network { height: 420px; }
  .concept-meaning.is-network,
  .concept-cue.is-network { min-height: 6.4em; }
  .concept-tools { margin-inline-start: 0; }
  .concept h2 { font-size: clamp(28px, 8vw, 36px); }
}