/* RC326-U2: shared accessible radio marker for topic and grade tests.
 * Never force a light surface in dark/dim; keep the indicator circular even
 * when a host theme sizes input elements with global selectors.
 * Every selected option has exactly one small white centre dot.
 */
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"] {
  -webkit-appearance:none!important;appearance:none!important;
  display:block!important;box-sizing:border-box!important;position:relative!important;
  flex:0 0 18px!important;float:none!important;
  width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;
  max-width:18px!important;max-height:18px!important;aspect-ratio:1/1!important;
  padding:0!important;margin:0!important;border:2px solid var(--ls-line-strong,#7793b0)!important;
  border-radius:50%!important;background:var(--ls-surface-2,#f4f7fb)!important;
  box-shadow:none!important;filter:none!important;transform:none!important;opacity:1!important;
  cursor:pointer!important;vertical-align:middle!important;color-scheme:var(--ls-color-scheme,light);
}
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"]:checked {
  background:var(--ls-primary,#296ac3)!important;border-color:var(--ls-primary,#296ac3)!important;
}
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"]::before {
  content:none!important;display:none!important;
}
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"]::after {
  content:""!important;display:block!important;position:absolute!important;
  left:50%!important;top:50%!important;width:6px!important;height:6px!important;
  border-radius:50%!important;background:#ffffff!important;box-shadow:none!important;
  transform:translate(-50%,-50%)!important;opacity:0!important;
}
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"]:checked::after {
  opacity:1!important;
}
:is(.sk-content-practice-shell .sk-content-options,.sk-grade-test-focus .sk-grade-test-options) input[type="radio"]:focus-visible {
  outline:3px solid var(--ls-focus,#fbbf24)!important;outline-offset:3px!important;
}
:is(.sk-content-practice-shell .sk-content-options>label:nth-child(5) .sk-content-option-key,.sk-grade-test-focus .sk-grade-test-options>label:nth-child(5) .sk-grade-option-key) {
  background:#334155!important;color:#ffffff!important;opacity:1!important;
}
.sk317-mode-tabs { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px; margin:14px 0 20px; }
.sk317-mode-tabs a { display:inline-flex; align-items:center; justify-content:center; min-height:48px;
  flex:1 1 150px; padding:10px 17px; border-radius:14px; font-size:15px; font-weight:750;
  text-align:center; background:var(--ls-surface,#fff); color:var(--ls-text,#172033);
  border:1px solid var(--ls-line,#d5e0ee); text-decoration:none!important;
}
.sk317-mode-tabs a.is-selected { background:var(--ls-primary,#2563eb); color:#fff!important;
  border-color:var(--ls-primary,#2563eb); box-shadow:0 6px 17px rgba(37,99,235,.12); }
.sk317-mode-tabs a:focus-visible { outline:3px solid #fbbf24; outline-offset:3px; }
.sk317-empty-mode { padding:16px; border-radius:12px; background:var(--ls-surface-2,#f1f5f9);
  color:var(--ls-text,#172033); }
@media(max-width:650px) { .sk317-mode-tabs {gap:7px} .sk317-mode-tabs a { flex:1 1 calc(50% - 8px); min-height:45px; padding:9px 7px; font-size:13px; } }
@media (prefers-reduced-motion: reduce) { .sk317-mode-tabs a {transition:none!important;} }
