/* Tales by Dots and Lines — chapter-specific additions only.
   Shared tokens, layout and components come from lessons/shared/class8-maths.css (loaded first). */
.tdl-fig{max-width:100%;width:100%;height:auto;display:block;margin:14px auto;color:var(--dm-ink)}
.dm-explain .tdl-fig{color:var(--dm-cream)}
.tdl-fig-dots{max-width:480px}
.tdl-fig-line{max-width:640px}
.tdl-fig-strip{max-width:640px}

.tdl-fig-sheet{max-width:100%}
.tdl-ss{border-collapse:collapse;font-size:13px;min-width:420px}
.tdl-ss th,.tdl-ss td{border:1px solid currentColor;border-opacity:0.25;padding:4px 8px;text-align:center;white-space:nowrap}
.tdl-ss th{background:rgba(255,255,255,0.06);font-weight:700}
.tdl-ss td.tdl-ss-head{font-weight:700}
.tdl-ss td.tdl-ss-hi{background:#D0483C;color:#fff;font-weight:700}
.tdl-ss-bar{display:flex;gap:10px;align-items:center;border:1px solid currentColor;border-opacity:0.25;border-radius:8px;padding:6px 10px;margin-bottom:8px;font-size:13px;font-family:monospace}
.tdl-ss-ref{font-weight:700;min-width:32px}
.tdl-ss-fx{opacity:0.6;font-style:italic}
.tdl-ss-formula{color:#3E8FA0;font-weight:650}
.dm-explain .tdl-ss-formula{color:#8fd6e6}