
:root{
  --mks-di-purple:#8222ee;
  --mks-di-indigo:#5b2cff;
  --mks-di-blue:#1673ff;
  --mks-di-ink:#171426;
  --mks-di-muted:#625f73;
  --mks-di-line:#e8e4f5;
  --mks-di-soft:#f7f3ff;
  --mks-di-good:#0a8f55;
  --mks-di-bad:#c62828;
}
.mks-di-lesson,.mks-di-dashboard-widget{
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--mks-di-ink);
  line-height:1.6;
  max-width:1100px;
  margin:0 auto;
}
.mks-di-hero,.mks-di-section,.mks-di-card,.mks-di-question-card,.mks-di-test-box,.mks-di-dashboard-panel{
  background:#fff;
  border:1px solid var(--mks-di-line);
  border-radius:20px;
  box-shadow:0 12px 35px rgba(35,18,79,.08);
  padding:24px;
  margin:20px 0;
}
.mks-di-hero{
  background:linear-gradient(135deg,var(--mks-di-purple),var(--mks-di-indigo),var(--mks-di-blue));
  color:#fff;
}
.mks-di-badge,.mks-di-chip,.mks-di-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--mks-di-soft);
  color:var(--mks-di-indigo);
  font-size:12px;
  font-weight:700;
  margin:4px 6px 4px 0;
}
.mks-di-hero .mks-di-badge{background:rgba(255,255,255,.16);color:#fff;}
.mks-di-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.mks-di-grid.three{grid-template-columns:repeat(3,minmax(0,1fr));}
.mks-di-grid.four{grid-template-columns:repeat(4,minmax(0,1fr));}
.mks-di-card h3,.mks-di-section h2,.mks-di-question-card h3{margin-top:0;}
.mks-di-table-wrap{overflow-x:auto;border:1px solid var(--mks-di-line);border-radius:16px;margin:16px 0;background:#fff;}
.mks-di-table{width:100%;border-collapse:collapse;min-width:620px;}
.mks-di-table th{background:linear-gradient(135deg,#f4edff,#eef5ff);text-align:left;color:var(--mks-di-indigo);}
.mks-di-table th,.mks-di-table td{padding:12px 14px;border-bottom:1px solid var(--mks-di-line);}
.mks-di-table tr:last-child td{border-bottom:none;}
.mks-di-graphic{border:1px solid var(--mks-di-line);border-radius:18px;background:linear-gradient(180deg,#fff,#fbf9ff);padding:16px;margin:16px 0;overflow-x:auto;}
.mks-di-graphic svg{width:100%;height:auto;max-width:760px;display:block;margin:auto;}
.mks-di-axis{stroke:#a7a1bf;stroke-width:2;}
.mks-di-gridline{stroke:#e8e4f5;stroke-width:1;}
.mks-di-bar{fill:var(--mks-di-indigo);}
.mks-di-line-chart{fill:none;stroke:var(--mks-di-blue);stroke-width:4;}
.mks-di-dot{fill:var(--mks-di-purple);}
.mks-di-label{font-size:13px;fill:#2c2840;font-weight:600;}
.mks-di-caption{font-size:13px;color:var(--mks-di-muted);text-align:center;margin-top:8px;}
.mks-di-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;}
.mks-di-tab-btn{border:1px solid var(--mks-di-line);border-radius:999px;background:#fff;color:var(--mks-di-indigo);padding:9px 14px;font-weight:700;cursor:pointer;}
.mks-di-tab-btn.active{background:linear-gradient(135deg,var(--mks-di-purple),var(--mks-di-blue));color:#fff;}
.mks-di-tab-panel{display:none;border:1px solid var(--mks-di-line);border-radius:16px;padding:16px;background:#fff;}
.mks-di-tab-panel.active{display:block;}
.mks-di-tpa-grid,.mks-di-yn-grid{overflow-x:auto;border:1px solid var(--mks-di-line);border-radius:16px;margin:14px 0;}
.mks-di-tpa-grid table,.mks-di-yn-grid table{width:100%;min-width:560px;border-collapse:collapse;}
.mks-di-tpa-grid th,.mks-di-tpa-grid td,.mks-di-yn-grid th,.mks-di-yn-grid td{padding:12px;border-bottom:1px solid var(--mks-di-line);text-align:center;}
.mks-di-tpa-grid th:first-child,.mks-di-tpa-grid td:first-child,.mks-di-yn-grid th:first-child,.mks-di-yn-grid td:first-child{text-align:left;}
.mks-di-option-list label{display:block;margin:10px 0;padding:12px;border:1px solid var(--mks-di-line);border-radius:14px;background:#fff;cursor:pointer;}
.mks-di-option-list label:hover{border-color:var(--mks-di-indigo);background:#fbf8ff;}
.mks-di-tools{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.mks-di-btn{border:none;border-radius:999px;padding:10px 16px;background:linear-gradient(135deg,var(--mks-di-purple),var(--mks-di-blue));color:#fff;font-weight:800;cursor:pointer;}
.mks-di-btn.secondary{background:#fff;color:var(--mks-di-indigo);border:1px solid var(--mks-di-line);}
.mks-di-explanation{display:none;margin-top:14px;border-left:4px solid var(--mks-di-indigo);background:#fbf8ff;border-radius:12px;padding:12px 14px;}
.mks-di-question-card.is-correct{border-color:rgba(10,143,85,.55);}
.mks-di-question-card.is-incorrect{border-color:rgba(198,40,40,.55);}
.mks-di-result{font-weight:800;margin-top:10px;}
.mks-di-result.good{color:var(--mks-di-good);}
.mks-di-result.bad{color:var(--mks-di-bad);}
.mks-di-test-bar{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#f8f4ff;border:1px solid var(--mks-di-line);border-radius:16px;padding:12px 16px;margin-bottom:16px;}
.mks-di-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0;}
.mks-di-stat{background:linear-gradient(180deg,#fff,#f8f4ff);border:1px solid var(--mks-di-line);border-radius:16px;padding:14px;}
.mks-di-stat strong{display:block;font-size:26px;color:var(--mks-di-indigo);}
.mks-di-list{margin:12px 0;padding:0;list-style:none;}
.mks-di-list li{border:1px solid var(--mks-di-line);border-radius:14px;margin:8px 0;padding:12px;background:#fff;}
@media(max-width:800px){
  .mks-di-grid,.mks-di-grid.three,.mks-di-grid.four,.mks-di-stat-grid{grid-template-columns:1fr;}
  .mks-di-hero,.mks-di-section,.mks-di-card,.mks-di-question-card,.mks-di-test-box,.mks-di-dashboard-panel{padding:18px;border-radius:16px;}
  .mks-di-test-bar{display:block;}
}
