/* The Group 4 marks calculator (tnpsc-group-4-answer-key.html). Colours are
   the palette's tokens only. */
.mc{margin-top:38px;padding:22px 20px;border-radius:var(--r-lg);border:1px solid var(--line-2);background:var(--page);}
.mc h2{margin-top:0;}
.mc-flag{margin-top:10px;padding:12px 14px;border-radius:var(--r-md);background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber-ink);font-size:14.5px;}
.mc-formula{margin-top:16px;padding:14px 16px;border-radius:var(--r-md);background:var(--sunk);}
.mc-formula p{margin-top:6px;font-size:15px;}
.mc-formula .mc-formula-h{margin-top:0;font-weight:700;color:var(--ink);}
.mc-form{margin-top:18px;}
.mc-form[hidden]{display:none;}
.mc-how{font-size:15px;}
.mc-parts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px;}
.mc-part{border:1px solid var(--line-2);border-radius:var(--r-md);padding:14px 14px 10px;margin:0;min-width:0;}
.mc-part legend{padding:0 6px;font-size:14px;font-weight:700;color:var(--ink);}
.mc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.mc-field{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--ink-2);}
.mc-field input{
  width:100%;min-height:44px;padding:8px 10px;border-radius:var(--r-sm);
  border:1px solid var(--line-2);background:var(--page);color:var(--ink);font:inherit;font-size:16px;
}
.mc-field input:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px;}
.mc-left{margin-top:8px!important;font-size:13.5px!important;color:var(--ink-3)!important;min-height:1.2em;}
.mc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.mc-out{margin-top:16px;}
.mc-out.is-shown,.mc-out.is-error{padding:14px 16px;border-radius:var(--r-md);}
.mc-out.is-shown{background:var(--blue-tint);border:1px solid var(--blue-line);}
.mc-out.is-error{background:var(--amber-bg);border:1px solid var(--amber-line);}
.mc-out p{margin-top:6px;font-size:15px;}
.mc-out p:first-child{margin-top:0;}
.mc-note{font-size:14px!important;color:var(--ink-3)!important;}

@media (max-width:640px){
  .mc{padding:18px 14px;}
  .mc-parts{grid-template-columns:1fr;}
}
