

:root[data-style="mc"] {
  color-scheme: dark;
  --bg:#000; --fg:#bebebe; --fg2:#8c8c8c; --fg3:#5f5f5f; --rule:#4a4a4a; --rule2:#1b1b1b; --panel:#0b0b0b;
  
  --c-b:#c98500; --c-p:#d55181; --c-z:#2a7fd4;
  --t-b:rgba(201,133,0,.26); --t-p:rgba(213,81,129,.26); --t-z:rgba(42,127,212,.28);
  --c-f:#2fa8a0; --c-c:#e0514a; --t-f:rgba(47,168,160,.28); --t-c:rgba(224,81,74,.26);   
  --hi:#ffffff;
  --w1:#e0591a; --w2:#c05ab8; --w3:#9085e9; --w4:#b58a1d; --w5:#e6d15c; --w-a:.62;
  --ink:190,190,190; --ink-a:.4; --mark:rgba(255,255,255,.06);
  --sans: "Die Grotesk", "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", sans-serif;
  --serif: var(--sans);
  --mono: "Berkeley Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --mc-dash: 1px dashed var(--fg2);
  
  --mute:#8c8c8c; --muted:#8c8c8c; --line:#3a3a3a; --card:#0b0b0b; --link:#bebebe; --sel:#1d1d1d; --code:#121212;
  --zero:#2a7fd4; --base:#c98500; --mid:#5f5f5f; --hl:#ffffff; --ok:#8fb35a; --okbg:#121a0c; --bad:#e0591a; --gate:#e0591a;
  --no:#e0591a; --pre:#1f1a08; --chip:#161616; --surface:#000; --grid:#1b1b1b; --axis:#4a4a4a;
  --panel2:#121212; --ink2:#8c8c8c;
}
:root[data-style="mc"][data-theme="light"], :root[data-style="mc"][data-theme="day"] {
  color-scheme: light;
  --bg:#8c8c8c; --fg:#000; --fg2:#282828; --fg3:#4a4a4a; --rule:#3a3a3a; --rule2:#7f7f7f; --panel:#858585;
  --c-b:#5c3300; --c-p:#e8b4cf; --c-z:#0d366b;
  --t-b:rgba(92,51,0,.22); --t-p:rgba(232,180,207,.45); --t-z:rgba(13,54,107,.22);
  --c-f:#8ee8dc; --c-c:#7a1a12; --t-f:rgba(142,232,220,.45); --t-c:rgba(122,26,18,.22);
  --hi:#000; --w1:#7d3700; --w2:#7a1c46; --w3:#38288c; --w4:#4f4300; --w5:#5c4a00; --w-a:.7;
  --ink:0,0,0; --ink-a:.5; --mark:rgba(0,0,0,.07);
  --mute:#282828; --muted:#282828; --line:#6e6e6e; --card:#858585; --link:#000; --sel:#7a7a7a; --code:#7e7e7e;
  --zero:#0d366b; --base:#5c3300; --mid:#4a4a4a; --hl:#000; --chip:#7e7e7e; --surface:#8c8c8c; --grid:#7f7f7f; --axis:#3a3a3a;
  --panel2:#7e7e7e; --ink2:#282828;
}


:root[data-style="mc"] body { background: var(--bg); color: var(--fg2); font: 17px/1.45 var(--sans); -webkit-font-smoothing: antialiased }
:root[data-style="mc"] ::selection { background: var(--fg2); color: var(--bg) }
:root[data-style="mc"] a { color: var(--fg2); text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 2px }
:root[data-style="mc"] a:hover { color: var(--fg); text-decoration: none }
:root[data-style="mc"] h1, :root[data-style="mc"] h2, :root[data-style="mc"] h3, :root[data-style="mc"] h4 {
  font-family: var(--sans); font-size: 18px; line-height: 1.3; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--fg) }
:root[data-style="mc"] b, :root[data-style="mc"] strong { color: var(--fg) }
:root[data-style="mc"] code, :root[data-style="mc"] kbd, :root[data-style="mc"] pre { font-family: var(--mono); font-size: .85em }
:root[data-style="mc"] hr { border: 0; border-top: 1px solid var(--fg2); margin: 2rem 0 }
:root[data-style="mc"] blockquote { border-left: var(--mc-dash); margin: 1.2rem 0; padding-left: 1rem; color: var(--fg2) }
:root[data-style="mc"] figcaption { font: 12px/1.35 var(--mono); color: var(--fg2) }
:root[data-style="mc"] table { font-family: var(--mono); font-size: 13px }
:root[data-style="mc"] th { font-weight: 700; color: var(--fg); border-bottom: 1px solid var(--fg2) }
:root[data-style="mc"] td { border-bottom: 1px dashed var(--rule) }
:root[data-style="mc"] button, :root[data-style="mc"] select, :root[data-style="mc"] input[type="text"], :root[data-style="mc"] input[type="search"] {
  font-family: var(--mono); border-radius: 0; box-shadow: none }
:root[data-style="mc"] select { background: var(--bg); color: var(--fg2); border: 1px dashed var(--fg3) }
:root[data-style="mc"] input[type="checkbox"], :root[data-style="mc"] input[type="radio"], :root[data-style="mc"] input[type="range"] { accent-color: var(--fg2) }
:root[data-style="mc"] summary { cursor: pointer; list-style: none; text-decoration: underline; text-underline-offset: 2px }
:root[data-style="mc"] summary::-webkit-details-marker { display: none }
:root[data-style="mc"] summary::before { content: "→"; display: inline-block; width: 1.4em; text-decoration: none }
:root[data-style="mc"] details[open] > summary::before { content: "↓" }
:root[data-style="mc"] summary:hover { color: var(--fg); text-decoration: none }
:root[data-style="mc"] * { scrollbar-color: var(--fg3) transparent }


:root[data-style="mc"] .jl-page { max-width: 1320px; padding-top: 0 }
:root[data-style="mc"] .jl-nav { font: 13px/1.5 var(--mono); color: var(--fg3); padding: 1rem 0; border-bottom: 1px solid var(--fg2); margin-bottom: 1.6rem }
:root[data-style="mc"] .jl-nav a { color: var(--fg2); text-decoration: none }
:root[data-style="mc"] .jl-nav a::before { content: "[" } :root[data-style="mc"] .jl-nav a::after { content: "]" }
:root[data-style="mc"] .jl-nav a:hover { color: var(--fg) }
:root[data-style="mc"] .jl-page h1 { font-size: 18px; margin: 0 0 1.2rem; line-height: 1.35 }
:root[data-style="mc"] .jl-page h2 { font-size: 18px; margin: 3.2rem 0 .75rem; border-top: 0; padding-top: 0 }
:root[data-style="mc"] .jl-page h3, :root[data-style="mc"] .jl-part > h3 { font-size: 18px; margin: 2.4rem 0 .5rem }
:root[data-style="mc"] .jl-lede, :root[data-style="mc"] .jl-sec { color: var(--fg2); max-width: 720px }
:root[data-style="mc"] .jl-page > p, :root[data-style="mc"] .jl-page section > p { max-width: 720px }
:root[data-style="mc"] .jl-draft { font: 400 12px var(--mono); color: var(--fg2); border: 0; border-radius: 0; padding: 0; margin-left: .4em; letter-spacing: 0; vertical-align: 1px }
:root[data-style="mc"] .jl-draft::before { content: "/ " }


:root[data-style="mc"] .jl-ctl { font: 12px var(--mono); color: var(--fg3); background: var(--bg); border-bottom: 1px solid var(--fg2); padding: .55rem 0; gap: 14px }
:root[data-style="mc"] .jl-seg button, :root[data-style="mc"] .jl-tog {
  font: 12px var(--mono); background: none; border: 0; border-radius: 0; margin: 0; padding: 0 .3em; color: var(--fg3); cursor: pointer }
:root[data-style="mc"] .jl-seg button:first-child { margin-left: .3em; border-radius: 0 } :root[data-style="mc"] .jl-seg button:last-child { border-radius: 0 }
:root[data-style="mc"] .jl-seg button:hover, :root[data-style="mc"] .jl-tog:hover { color: var(--fg2) }
:root[data-style="mc"] .jl-seg button.on, :root[data-style="mc"] .jl-tog.on { background: none; color: var(--fg); border: 0 }

:root[data-style="mc"] .jl-seg button::before, :root[data-style="mc"] .jl-tog::before { content: "["; color: transparent }
:root[data-style="mc"] .jl-seg button::after, :root[data-style="mc"] .jl-tog::after { content: "]"; color: transparent }
:root[data-style="mc"] .jl-seg button.on::before, :root[data-style="mc"] .jl-seg button.on::after,
:root[data-style="mc"] .jl-tog.on::before, :root[data-style="mc"] .jl-tog.on::after { color: inherit }
:root[data-style="mc"] .jl-seg.sm button, :root[data-style="mc"] .jl-tools .jl-seg.vt button { font: 12px var(--mono); padding: 0 .4em; color: var(--fg3) }
:root[data-style="mc"] .jl-seg.sm button.on, :root[data-style="mc"] .jl-tools .jl-seg.vt button.on { color: var(--fg) }
:root[data-style="mc"] .jl-how { font: 12px var(--mono); color: var(--fg2); background: none; border: 1px dashed var(--fg3); border-radius: 0; padding: 0 .6em }
:root[data-style="mc"] .jl-how[aria-expanded="true"] { background: var(--fg2); color: var(--bg); border-color: var(--fg2) }
:root[data-style="mc"] .jl-tools select, :root[data-style="mc"] .jl-casepick select { font: 12.5px var(--mono); color: var(--fg2); background: var(--bg); border: 1px dashed var(--fg3); border-radius: 0 }
:root[data-style="mc"] .jl-casepick button { font: 13px var(--mono); border: 1px dashed var(--fg3); border-radius: 0; color: var(--fg2) }
:root[data-style="mc"] .jl-tools .set, :root[data-style="mc"] .jl-casepick label { font-family: var(--mono) }


:root[data-style="mc"] .jl-cap { font: 12px/1.4 var(--mono); color: var(--fg2); max-width: 900px } :root[data-style="mc"] .jl-cap b { color: var(--fg); font-weight: 700 }
:root[data-style="mc"] .jl-legend { font: 12px/1.45 var(--mono); color: var(--fg2); border-bottom: 1px dashed var(--fg3) }
:root[data-style="mc"] .jl-legend b, :root[data-style="mc"] .jl-howto .t { text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 700 }
:root[data-style="mc"] .jl-howto { font: 12px/1.45 var(--mono); border-left: var(--mc-dash) }
:root[data-style="mc"] .jl-howpanel { background: var(--bg); border: var(--mc-dash); border-top: 0; border-radius: 0; box-shadow: none }
:root[data-style="mc"] .jl-tip { font: 12px/1.45 var(--mono); color: var(--fg2); background: var(--bg); border: var(--mc-dash); border-radius: 0; box-shadow: none }
:root[data-style="mc"] .jl-loupe { background: var(--bg); border: var(--mc-dash); box-shadow: none }
:root[data-style="mc"] .jl-notes { font: 12.5px/1.5 var(--mono); color: var(--fg2) }
:root[data-style="mc"] .jl-box { background: none; border: 0; border-top: var(--mc-dash); border-bottom: var(--mc-dash); border-radius: 0; padding: 1rem 0; font: 13.5px/1.55 var(--mono); color: var(--fg2) }
:root[data-style="mc"] .jl-box .tag { font: 700 12px var(--mono); letter-spacing: 0; text-transform: none; color: var(--fg) }
:root[data-style="mc"] .jl-quote, :root[data-style="mc"] .jl-ex { border-left: var(--mc-dash); font-style: normal }
:root[data-style="mc"] .jl-ex { font: 17px/1.45 var(--sans); color: var(--fg2) } :root[data-style="mc"] .jl-ex.small { font-size: 15.5px }
:root[data-style="mc"] .jl-ex .who { font: 12px var(--mono); text-transform: none; letter-spacing: 0; color: var(--fg3) }
:root[data-style="mc"] .jl-quote q { font: 14px var(--sans); font-style: normal }


:root[data-style="mc"] .jl-status { font: 12px var(--mono) }
:root[data-style="mc"] .jl-tag { border: 0; border-radius: 0; padding: 0; font: 12px var(--mono); color: var(--fg3) }
:root[data-style="mc"] .jl-tag b { text-transform: none; letter-spacing: 0; font-size: 12px; color: var(--fg2) }
:root[data-style="mc"] .jl-tag b::before { content: "[" } :root[data-style="mc"] .jl-tag b::after { content: "]" }
:root[data-style="mc"] .jl-tag.strong b { color: var(--fg) }
:root[data-style="mc"] .jl-summary { font: 13px var(--mono) }
:root[data-style="mc"] .jl-summary th { font: 700 12px var(--mono); text-transform: none; letter-spacing: 0; color: var(--fg); border-bottom: 1px solid var(--fg2) }
:root[data-style="mc"] .jl-summary td { border-bottom: 1px dashed var(--fg3) }
:root[data-style="mc"] .jl-facts { font: 16px/1.45 var(--sans); color: var(--fg2); max-width: 760px }
:root[data-style="mc"] .jl-claim.retired { border: 0; border-top: var(--mc-dash); border-bottom: var(--mc-dash); color: var(--fg3) }
:root[data-style="mc"] .jl-replies { font: 14.5px/1.45 var(--sans) }
:root[data-style="mc"] .jl-replies th { font: 700 12px var(--mono); border-bottom: 1px solid var(--fg2) }
:root[data-style="mc"] .jl-replies td { font-style: normal; color: var(--fg2); border-bottom: 1px dashed var(--fg3) }
:root[data-style="mc"] .jl-replies td.q { font: 12.5px var(--mono); color: var(--fg) }
:root[data-style="mc"] .jl-sw { border-radius: 0 }


:root[data-style="mc"] .jl-toc { font: 12px/1.4 var(--mono); color: var(--fg2) } :root[data-style="mc"] .jl-toc a { text-decoration: none; color: var(--fg2) }
:root[data-style="mc"] .jl-toc a:hover { color: var(--fg) }
@media (min-width: 1500px) {
  :root[data-style="mc"] .jl-toc { position: fixed; left: 1rem; bottom: 1rem; width: 200px; max-height: calc(100vh - 8rem); overflow-y: auto; display: block; z-index: 3 }
  :root[data-style="mc"] .jl-toc a, :root[data-style="mc"] .jl-toc .mute { display: block; padding: 1px 0 }
}


:root[data-style="mc"] .rh-w { font: 18px/1.35 var(--sans) }
:root[data-style="mc"] .rh-w.tpl { font: 11.5px/1.35 var(--mono); letter-spacing: 0 }
:root[data-style="mc"] .rh-head { border-radius: 0 }
:root[data-style="mc"] .rh-info { font: 12px var(--mono) }
:root[data-style="mc"] .jl-cols > div { font: 700 12.5px var(--mono) } :root[data-style="mc"] .jl-cols .lens { font-size: 11px }
:root[data-style="mc"] .jl-cols { border-bottom: 1px solid var(--fg2) }
:root[data-style="mc"] .jl-reps > div { font: 15px/1.45 var(--sans); font-style: normal; color: var(--fg2); border-bottom: 1px dashed var(--fg3) }
:root[data-style="mc"] .jl-reps > .lab { font: 11.5px/1.8 var(--mono); text-transform: none; letter-spacing: 0 }
:root[data-style="mc"] .jl-row > div { border-bottom-color: var(--rule2) }
:root[data-style="mc"] .jl-row.out > div { border-top: 1px solid var(--fg3) }
:root[data-style="mc"] .w { font-family: var(--sans) }
:root[data-style="mc"] figure.case .link, :root[data-style="mc"] .nextcase { font: 13px var(--mono); color: var(--fg2) }
:root[data-style="mc"] .x-th, :root[data-style="mc"] .x-ll { font-family: var(--mono); text-transform: none; letter-spacing: 0 }
:root[data-style="mc"] .x-tracker { border-top: var(--mc-dash) }
:root[data-style="mc"] .legend { font: 12.5px var(--mono) }
:root[data-style="mc"] details.tbl { font: 12px var(--mono) }
:root[data-style="mc"] .ramp span, :root[data-style="mc"] .hatch, :root[data-style="mc"] .focuskey { border-radius: 0 }
:root[data-style="mc"] .ring { border-radius: 0 }


:root[data-style="mc"] .jl-avg-top { font: 12.5px var(--mono) }
:root[data-style="mc"] .jl-avg .jl-seg.sm button { font: 12.5px var(--mono) }
:root[data-style="mc"] .avg-rh .rh-w { font-size: 16px }
:root[data-style="mc"] .jl-avg-h { font: 15px/1.45 var(--sans) }
:root[data-style="mc"] .avg-lists { font: 12px var(--mono) }
:root[data-style="mc"] .avg-lists .l span { border: 1px dashed var(--fg3); border-radius: 0; font-family: var(--sans) }
:root[data-style="mc"] .avg-lists .l span.sh { background: var(--fg2); color: var(--bg); border: 1px solid var(--fg2) }
:root[data-style="mc"] .avg-t th { font-family: var(--mono) } :root[data-style="mc"] .avg-t td { border-bottom: 0 }
:root[data-style="mc"] .avg-list { font: 12.5px var(--mono) }


.mc-switch { position: fixed; right: .7rem; bottom: .6rem; z-index: 40; font: 11px/1 ui-monospace, Menlo, monospace; opacity: .75 }
@media (max-width: 760px) { .mc-switch { position: static; display: block; text-align: right; padding: 14px 16px 18px } }  
.mc-switch a { color: inherit }
:root[data-style="mc"] .mc-switch { color: var(--fg3) }
@media print { .mc-switch { display: none } }


:root[data-style="mc"] .wm-key { font: 12px/1.45 var(--mono) } :root[data-style="mc"] .wm-key b { font-weight: 700 }
:root[data-style="mc"] .wm-h { font: 700 12.5px var(--mono) }
:root[data-style="mc"] .wm-t th, :root[data-style="mc"] .wm-t td { border-bottom: 0 }  
:root[data-style="mc"] .wm-t th.w { font: 400 12px var(--sans); color: var(--fg) } :root[data-style="mc"] .wm-t th.tick { font: 9.5px var(--mono); color: var(--fg3) }
:root[data-style="mc"] .jl-reps > .one .note { font: 12px var(--mono) }
:root[data-style="mc"] .jl-claim .scope { font: 12px/1.45 var(--mono) } :root[data-style="mc"] .jl-lead { font: 13px var(--mono) }
:root[data-style="mc"] .jl-reps .who { font: 700 11.5px var(--mono) } :root[data-style="mc"] .wm-t th.w .own { color: var(--fg); font-weight: 700 }
