/* Draw-mode article: existing editorial palette and readable comparison tables. */
.draw-modes .rules-hero>img{object-fit:cover}
.draw-modes .draw-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-block:1px solid var(--page-line);padding:22px 0;margin-top:24px}
.draw-summary strong,.draw-summary span{display:block}.draw-summary strong{font-size:18px;margin-bottom:7px}.draw-summary span{font-size:16px;line-height:1.5}
.draw-modes .draw-table th:first-child{width:28%}.draw-modes .draw-table th:nth-child(2){width:34%}
.draw-modes .rules-body h3{font-size:21px;line-height:1.35;margin:23px 0 10px}
.draw-modes .draw-example{margin:20px 0;padding:20px;background:var(--panel);border:1px solid var(--page-line);border-radius:6px}
.draw-example figcaption{font-size:15px;line-height:1.5;margin-top:14px;max-width:50ch}
.draw-fan{display:flex;align-items:center;padding-left:0;min-height:123px}.draw-fan .demo-card{width:82px;height:auto}.draw-fan .demo-card+.demo-card{margin-left:-32px}
.draw-site-rules{background:var(--panel);border-left:3px solid var(--green);padding:3px 20px 20px;margin-top:24px}
.draw-modes .draw-site-rules h3{margin-top:18px}
@media(max-width:760px){.draw-modes .draw-summary{gap:14px}.draw-modes .contents nav{display:block}.draw-modes .contents a{padding-inline:0}.draw-modes .contents{max-height:none}}
@media(max-width:540px){.draw-modes .draw-summary{grid-template-columns:1fr;gap:15px;padding-block:18px}.draw-summary strong{font-size:17px;margin-bottom:3px}.draw-modes .draw-table th:first-child{width:29%}.draw-modes .draw-table th:nth-child(2){width:33%}.draw-modes .draw-table td,.draw-modes .draw-table th{padding:9px 6px;hyphens:auto}.draw-modes .draw-example{padding:16px}.draw-site-rules{padding-inline:15px}}
@media(min-width:761px){.draw-modes .contents{max-height:calc(100dvh - 40px);overflow-y:auto;scrollbar-width:thin}}
