.dr-stage { font-family: 'Nunito', system-ui, sans-serif; }

.dr-prompt {
    font-weight: 700; font-size: 16px; color: #163a5f;
    background: #eef6ff; border: 1px solid #c7dcf2; border-radius: 10px;
    padding: 10px 14px; margin: 4px 0 14px;
}

.dr-table { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
.dr-table th, .dr-table td { border: 1px solid #cbd5e1; padding: 6px 8px; text-align: left; }
.dr-table th { background: #e6f4ea; font-weight: 800; color: #14532d; font-size: 14px; }
.dr-table input {
    width: 100%; border: none; background: transparent; font: inherit;
    font-weight: 700; color: #1f2a37; padding: 4px;
}
.dr-table input:focus { outline: 2px solid #1565c0; border-radius: 4px; background: #fff; }

.dr-actions { margin-bottom: 12px; }

.dr-chart-wrap { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 10px; }
.dr-chart { width: 100%; height: auto; }
.dr-bar { fill: #1565c0; }
.dr-axis { stroke: #94a3b8; stroke-width: 1.5; }
.dr-gridline { stroke: #e2e8f0; stroke-width: 1; }
.dr-label { font-family: 'Nunito', sans-serif; font-size: 13px; fill: #475569; }
.dr-val { font-family: 'Nunito', sans-serif; font-size: 12px; font-weight: 700; fill: #163a5f; }
.dr-point { fill: #1565c0; }
.dr-line { fill: none; stroke: #1565c0; stroke-width: 2.5; }

.dr-your-turn {
    margin-top: 16px; background: #fffaf0; border-left: 4px solid #dd6b20;
    border-radius: 8px; padding: 10px 14px;
}
.dr-your-turn-label { font-weight: 800; color: #9a3412; font-size: 13px; margin-bottom: 4px; }
#yourTurnList { margin: 0; padding-left: 18px; font-size: 14px; color: #334155; }

.activity-container.display-mode .dr-table input { pointer-events: none; }
.activity-container.display-mode .dr-actions { display: none; }

/* Keep a multi-column results table tidy on small tablets/phones. */
@media (max-width: 380px) {
    .dr-table th, .dr-table td { padding: 4px 5px; }
    .dr-table th { font-size: 12px; }
    .dr-table input { font-size: 13px; padding: 2px; }
}