/* ── ONE button for MCF (Alicia, 2026-11-10: "make sure all assignment, submit, signup buttons are wired correctly and
   actually working. you should use one global, change one change all, not one by one").

   Every Send an Assignment, submit and sign-up button on every MCF page carries .mcb (the blue pill) or .mcb.mcb-o
   (the gold outline, for the second choice beside it: Brochure, Call). Their whole look lives HERE and nowhere else;
   a page's own stylesheet may only place a button (margins, width on a phone, alignment) and set its SIZE through
   --mcb-h (height), --mcb-px (side padding), --mcb-fs (text size), --mcb-ws (wrapping) and --mcb-display, set on the
   button itself (the header's compact pill does this). Margins are never set here, so a page's spacing stays its own. Inside a dark band, mark the
   band .mcb-dark and the buttons stand off it (raised: light top edge, darker foot, cast shadow; Alicia, 2026-11-10:
   "make them bit 3D feel, now it is camouflaged").

   The colours are the Header & Footer page's Global "Buttons" rows (--ch-btn, --ch-btn-2, --ch-btn-ink); that page's
   saved Global prints at :root on every page, so a change there changes every button at once. This file is their ONE
   default: chrome.css no longer defines them.

   :is(html,#mcb) gives every rule here the weight of an id (an :is() takes its strongest argument; #mcb exists nowhere),
   so a page rule such as `#edWrap a{color}` or `#mcfArt .btn` can never repaint a button. The panel's Element pins
   (!important) still can, one element at a time. Load order does not matter. */
:root{--ch-btn:#0072CE;--ch-btn-2:#03467C;--ch-btn-ink:#FFFFFF;--ch-btn-o:#815C00;--ch-btn-o-edge:#D9A63C;--ch-btn-o-dark:#F2C75C;--ch-btn-fs:15px}

:is(html,#mcb) .mcb.mcb,:is(html,#mcb) .mcb.mcb:visited{position:relative;overflow:hidden;isolation:isolate;box-sizing:border-box;display:var(--mcb-display,inline-flex);align-items:center;justify-content:center;gap:8px;max-width:100%;min-height:var(--mcb-h,46px);padding:0 var(--mcb-px,24px);border:1px solid transparent;border-radius:999px;background-color:var(--ch-btn);background-image:linear-gradient(135deg,var(--ch-btn),var(--ch-btn-2));color:var(--ch-btn-ink);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:var(--mcb-fs,var(--ch-btn-fs));font-weight:600;font-style:normal;line-height:1.25;letter-spacing:0;text-align:center;text-transform:none;text-decoration:none;white-space:var(--mcb-ws,normal);cursor:pointer;box-shadow:0 14px 34px rgba(0,114,206,.24);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background-color .2s ease}
:is(html,#mcb) .mcb.mcb::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.3) 50%,transparent 65%);background-size:250% 100%;background-position:120% 0;transition:background-position .7s ease}
:is(html,#mcb) .mcb.mcb:hover,:is(html,#mcb) .mcb.mcb:focus-visible{transform:translateY(-1px);color:var(--ch-btn-ink);border-color:transparent;background-image:linear-gradient(135deg,var(--ch-btn),var(--ch-btn-2));box-shadow:0 18px 40px rgba(0,114,206,.34);text-decoration:none}
:is(html,#mcb) .mcb.mcb:hover::after,:is(html,#mcb) .mcb.mcb:focus-visible::after{background-position:-20% 0}
:is(html,#mcb) .mcb.mcb:focus-visible{outline:2px solid var(--ch-btn-o-edge);outline-offset:3px}
:is(html,#mcb) .mcb.mcb:disabled,:is(html,#mcb) .mcb.mcb[aria-disabled="true"]{opacity:.6;cursor:default;transform:none}

/* the second choice: gold outline, light glass fill */
:is(html,#mcb) .mcb.mcb-o,:is(html,#mcb) .mcb.mcb-o:visited{background-color:rgba(255,255,255,.82);background-image:none;border-color:var(--ch-btn-o-edge);color:var(--ch-btn-o);box-shadow:0 12px 30px rgba(28,36,75,.08)}
:is(html,#mcb) .mcb.mcb-o::after{background-image:linear-gradient(105deg,transparent 35%,rgba(217,166,60,.2) 50%,transparent 65%)}
:is(html,#mcb) .mcb.mcb-o:hover,:is(html,#mcb) .mcb.mcb-o:focus-visible{background-color:#fff;background-image:none;border-color:var(--ch-btn-o);color:var(--ch-btn-o);box-shadow:0 14px 34px rgba(28,36,75,.14)}

/* inside a dark band: raised */
:is(html,#mcb) .mcb-dark .mcb.mcb{border-color:rgba(255,255,255,.26);background-image:linear-gradient(180deg,color-mix(in srgb,var(--ch-btn) 72%,#fff) 0%,var(--ch-btn) 46%,var(--ch-btn-2) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 0 rgba(0,0,0,.22),0 2px 0 rgba(1,20,40,.55),0 12px 26px rgba(0,0,0,.4)}
:is(html,#mcb) .mcb-dark .mcb.mcb:hover,:is(html,#mcb) .mcb-dark .mcb.mcb:focus-visible{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 0 rgba(0,0,0,.22),0 3px 0 rgba(1,20,40,.55),0 18px 34px rgba(0,0,0,.46)}
:is(html,#mcb) .mcb-dark .mcb.mcb-o{border-color:var(--ch-btn-o-dark);background-color:transparent;background-image:linear-gradient(180deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.07) 50%,rgba(0,0,0,.14) 100%);color:var(--ch-btn-o-dark);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -2px 0 rgba(0,0,0,.2),0 2px 0 rgba(1,20,40,.5),0 12px 26px rgba(0,0,0,.36)}
:is(html,#mcb) .mcb-dark .mcb.mcb-o::after{background-image:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%)}
:is(html,#mcb) .mcb-dark .mcb.mcb-o:hover,:is(html,#mcb) .mcb-dark .mcb.mcb-o:focus-visible{border-color:var(--ch-btn-o-dark);background-color:rgba(242,199,92,.08);color:var(--ch-btn-o-dark);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -2px 0 rgba(0,0,0,.2),0 3px 0 rgba(1,20,40,.5),0 18px 34px rgba(0,0,0,.42)}

@media (prefers-reduced-motion:reduce){:is(html,#mcb) .mcb.mcb,:is(html,#mcb) .mcb.mcb::after{transition:none}:is(html,#mcb) .mcb.mcb:hover{transform:none}}
