/* Mind Quest: mobile diagrams contrast & responsive display, 2026-10-17.
   This sheet changes only display/interaction; quiz data and answer keys are untouched. */
:root,html{color-scheme:only light!important}
.graphic,.diagram{background:#ffffff!important;color:#183044;isolation:isolate}
.graphic svg,.diagram svg{color-scheme:only light!important}
.mq-art{
 display:block;max-width:100%;height:auto;object-fit:contain;
 background-color:#ffffff!important;color-scheme:only light!important;
 filter:none!important;-webkit-filter:none!important;
 image-rendering:auto;forced-color-adjust:none;
}
.graphic .mq-art,.diagram .mq-art{
 width:min(100%,var(--mq-intrinsic,680px));margin:0 auto;
 max-height:none!important;
}
.choice-body .mq-art,.choice .mq-art{
 width:min(100%,var(--mq-intrinsic,290px));
 max-height:none!important;margin:0 auto;
}
.graphic,.diagram{position:relative}
.mq-zoom-btn{
 display:flex;align-items:center;justify-content:center;gap:6px;
 margin:10px auto 0;padding:8px 18px;border:1px solid #9db6c8;
 border-radius:12px;background:#ffffff!important;color:#153a59!important;
 font:700 14px/1.5 Tahoma,Arial,sans-serif;cursor:pointer;
 box-shadow:0 2px 6px #14324e16;
}
.mq-zoom-btn:hover{border-color:#286f98;background:#eef8fd!important}
.mq-zoom-btn:focus-visible{outline:3px solid #f5ac2c;outline-offset:2px}
.mq-zoom-dialog{
 background:#fff!important;color:#153047!important;border:1px solid #b4c9d9;
 border-radius:18px;padding:20px;max-width:96vw;max-height:92dvh;width:min(760px,96vw);
 box-shadow:0 20px 70px #101e3099;overscroll-behavior:contain;
}
.mq-zoom-dialog::backdrop{background:rgba(8,20,37,.84)}
.mq-zoom-dialog .mq-close{display:block;margin:0 0 12px 0;border:1px solid #7f9aa9;
 padding:9px 18px;background:white!important;color:#143853!important;border-radius:10px;
 font:700 15px Tahoma,Arial,sans-serif;cursor:pointer}
.mq-zoom-dialog img{display:block;width:100%;max-width:100%;max-height:75dvh;
 height:auto;object-fit:contain;margin:auto;background:white!important;filter:none!important}
.mq-zoom-dialog p{font:14px/1.6 Tahoma,Arial,sans-serif;margin:10px 0 0}
@media(max-width:650px){
 .question-card{padding:12px!important}
 .paper{padding:12px!important}
 .graphic,.diagram{width:100%!important;max-width:100%!important;margin-inline:auto!important;
  padding:8px!important;border:2px solid #a4bbcb!important;border-radius:14px!important;background:#fff!important}
 .graphic .mq-art,.diagram .mq-art{width:100%!important;max-width:100%!important;
  max-height:none!important;min-width:0!important;}
 .graphic.science-v2-graphic .mq-art{width:max(100%,620px)!important;min-width:620px!important;max-width:none!important}
 .choices,.options{grid-template-columns:minmax(0,1fr)!important}
 .choices .choice,.options .choice{width:100%!important;min-width:0!important;
  padding:10px 9px!important;gap:9px!important;background:#fff!important}
 .choice-body,.choice .ch-visual{min-width:0;flex:1}
 .choice-body .mq-art,.choice .mq-art{width:min(100%,290px)!important;max-width:100%!important;
  max-height:310px!important;object-fit:contain;}
 .mq-zoom-btn{width:min(230px,100%);font-size:14px;padding:10px 14px}
 .mq-zoom-dialog{width:96vw;max-height:90dvh;padding:12px}
}