.mb-hero, .mb-day {
  --mn: #1d3461; --mn-tint: #f4f6fb; --mn-soft: #e3e9f6; --mo: #ea6a1c;
}
.mb-hero .gk-stagerow + .marquee { margin-top: -1px; }

.mb-stage { padding: 24px 32px 32px; }
.mb { padding: 24px 28px 28px; }

.mb-cres { margin: 0; padding: 0; border: 0; min-width: 0; }
.mb-label {
  padding: 0; margin-bottom: 12px;
  font: 500 11.5px/1 var(--font-ui); letter-spacing: .09em; text-transform: uppercase; color: var(--gk-soft);
}
.mb-cres__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.mb-cre {
  position: relative; display: flex; flex-direction: column; min-width: 0;
  padding: 10px 10px 9px; border-radius: 12px;
  background: #fff; border: 1px solid var(--gk-line);
  cursor: pointer;
  transition: background-color .15s ease;
}
.mb-cre:hover { background: #fafafc; }
.mb-cre:has(:checked) { outline: 2px solid #fff; outline-offset: 3px; }
.mb-cre:has(:focus-visible) { outline: 2px solid #a5b4ff; outline-offset: 3px; }
.mb-cre__radio { position: absolute; opacity: 0; pointer-events: none; }
.mb-cre__head { display: flex; align-items: center; gap: 6px; min-width: 0; }
.mb-cre__head img { flex: none; width: 14px; height: 14px; }
.mb-cre__src { font: 500 11.5px/1 var(--font-ui); color: var(--ink-nav); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mb-cre__angle { margin-left: auto; flex: none; padding: 3px 6px; border-radius: 5px; background: #f3f4f6; font: 500 10.5px/1 var(--font-ui); color: #6b7280; }
.mb-cre__live {
  position: absolute; left: 16px; top: 38px; z-index: 2;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 7px; border-radius: 6px; background: #e7f6ec; color: #15803d;
  font: 500 10.5px/1 var(--font-ui);
}
.mb-cre__live[hidden] { display: none; }
.mb-cre__live i { width: 6px; height: 6px; border-radius: 50%; background: #16a34a; }

.mbc { display: flex; flex-direction: column; min-width: 0; margin-top: 8px; }
.mbc__art { position: relative; display: block; height: 84px; border-radius: 8px; overflow: hidden; background: #eef1f5; }
.mbc__art svg { display: block; width: 100%; height: 100%; }
.mbc__hook {
  margin-top: 8px; min-height: 2.7em;
  font: 500 12.5px/1.35 var(--font-ui); color: var(--ink-nav);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.mbc__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 7px; font: 400 10.5px/1 var(--font-ui); color: #8b8f9a; }
.mbc__foot b { padding: 4px 7px; border-radius: 5px; background: #f1f2f4; font-weight: 500; color: #4f5461; }
.mbc-a__sky { fill: #dfe9f5; }
.mbc-a__wall { fill: #c9d6e6; }
.mbc-a__unit { fill: #f7f9fc; stroke: #9fb0c8; stroke-width: 1.4; }
.mbc-a__fan { fill: #e6ecf5; stroke: #9fb0c8; stroke-width: 1.4; }
.mbc-a__grill { stroke: #9fb0c8; stroke-width: 1.2; }
.mbc-a__panel { fill: #d5deea; }
.mbc-a__tag { fill: var(--mo); }
.mbc-a__price { fill: #fff; font: 700 9.5px/1 var(--font-ui); }
.mbc-a__dark { fill: #15171d; }
.mbc-a__tank { fill: #2a2e38; stroke: #8a93a6; stroke-width: 1.4; }
.mbc-a__pipe { stroke: #8a93a6; stroke-width: 2.4; stroke-linecap: round; }
.mbc-a__drip { fill: #60a5fa; }
.mbc__cap {
  position: absolute; left: 8px; bottom: 8px;
  padding: 3px 6px; border-radius: 4px; background: rgb(0 0 0 / .55);
  font: 700 10px/1.2 var(--font-ui); color: #fff;
}
.mbc__play {
  position: absolute; right: 7px; top: 7px;
  display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%;
  background: rgb(255 255 255 / .18);
}
.mbc__play svg { width: 11px; height: 11px; fill: #fff; }
.mbc__photo { display: block; width: 100%; height: 100%; background: #dfe3ea url(/assets/img/pages/roof.jpg) center 40% / cover no-repeat; }
.mbc__list {
  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 5px;
  padding: 0 38px 0 16px; background: #1d1520;
}
.mbc__list span { display: flex; justify-content: space-between; font: 500 10.5px/1 var(--font-ui); color: rgb(255 255 255 / .82); }
.mbc__list b { font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }

.mb-work { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 16px; margin-top: 22px; align-items: stretch; }

.mb-win { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.mb-win__bar { display: flex; align-items: center; gap: 10px; flex: none; height: 32px; padding: 0 10px; border-bottom: 1px solid #f0f1f3; }
.mb-win__dots { display: flex; gap: 4px; flex: none; }
.mb-win__dots i { width: 7px; height: 7px; border-radius: 50%; background: #e3e5ea; }
.mb-win__url {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 5px;
  height: 20px; padding: 0 8px; border-radius: 6px; background: #f4f5f7;
  font: 400 10.5px/1 var(--font-ui); color: #8b8f9a;
}
.mb-win__url svg { flex: none; width: 10px; height: 10px; fill: none; stroke: #16a34a; stroke-width: 1.3; stroke-linejoin: round; }
.mb-win__addr { display: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mb-win__addr b { font-weight: 500; color: #4f5461; }
.mb-win__page { position: relative; flex: 1; min-height: 340px; font-size: 10px; overflow: hidden; }
.mb-page { position: absolute; inset: 0; display: none; }

.mb-side { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.mb-ai { display: flex; flex-direction: column; padding: 12px 14px 0; }
.mb-ai__head { display: flex; align-items: center; gap: 8px; margin: 0; font: 600 12.5px/1 var(--font-ui); color: #0f1115; }
.mb-ai__mark { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: #0a0a0b; }
.mb-ai__mark svg { width: 8px; fill: #fff; }
.mb-ai__run { display: none; }
.mb-ai__ask {
  margin: 10px 0 0; padding: 8px 10px; border-radius: 10px; background: #f3f4f6;
  font: 400 12px/1.4 var(--font-ui); color: var(--ink-nav);
}
.mb-ai__ask span { display: inline-block; margin-left: 4px; padding: 2px 6px; border-radius: 5px; background: #fff; border: 1px solid var(--gk-line); font-size: 11px; color: #6b7280; }
.mb-ai__log { display: grid; gap: 7px; margin: 10px 0 12px; padding: 0; list-style: none; }
.mb-ai__log li { display: flex; align-items: flex-start; gap: 7px; font: 400 12px/1.35 var(--font-ui); color: var(--ink-nav); transition: opacity .3s ease; }
.mb-ai__log svg {
  flex: none; width: 15px; height: 15px; margin-top: 1px; padding: 2.5px; border-radius: 50%;
  background: rgb(35 71 255 / .1); fill: none; stroke: var(--brand); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;
}
.mb.is-building .mb-ai__log li:not(.is-shown) { opacity: 0; }
.mb-ai__foot { display: flex; align-items: center; min-height: 46px; margin-top: auto; border-top: 1px solid #f0f1f3; }
.mb-ai__launch {
  height: 30px; padding: 0 12px; border: 0; border-radius: 7px;
  background: var(--brand); color: #fff; font: 500 12.5px/1 var(--font-ui); cursor: pointer;
  transition: background-color .15s ease;
}
.mb-ai__launch:hover { background: #1b3be0; }
.mb-ai__launch:disabled { background: #c7cfe9; cursor: default; }
.mb-ai__launch[hidden], .mb-ai__status[hidden] { display: none; }
.mb-ai__launch:focus-visible, .mb-board__sort button:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.mb-ai__status { display: flex; align-items: center; gap: 7px; margin: 0; min-width: 0; font: 400 12px/1.3 var(--font-ui); color: #15803d; }
.mb-ai__status i { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #16a34a; }
.mb-ai__status span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.mb-board { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.mb-board__head { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 14px; border-bottom: 1px solid #f0f1f3; }
.mb-board__title { font: 600 12.5px/1 var(--font-ui); color: #0f1115; }
.mb-board__title em { margin-left: 4px; font-style: normal; font-weight: 400; color: #8b8f9a; }
.mb-board__sort { margin-left: auto; display: inline-flex; padding: 2px; border-radius: 7px; background: #f3f4f6; }
.mb-board__sort button {
  height: 22px; padding: 0 8px; border: 0; border-radius: 5px; background: transparent;
  font: 500 11px/1 var(--font-ui); color: #6b7280; cursor: pointer;
}
.mb-board__sort button[aria-pressed="true"] { background: #fff; color: var(--ink-nav); }
.mb-board__table { width: 100%; border-collapse: collapse; table-layout: fixed; font: 400 12px/1.2 var(--font-ui); }
.mb-board__table th { padding: 8px 10px; text-align: right; font: 400 10.5px/1 var(--font-ui); color: #8b8f9a; border-bottom: 1px solid #f0f1f3; white-space: nowrap; }
.mb-board__table th:first-child { width: 46%; text-align: left; padding-left: 14px; }
.mb-board__table td { padding: 0 10px; height: 34px; text-align: right; color: var(--ink-nav); font-variant-numeric: tabular-nums; border-bottom: 1px solid #f4f5f7; white-space: nowrap; }
.mb-board__table tbody tr:last-child td { border-bottom: 0; }
.mb-board__table tr.is-new td { animation: mbRow 1.6s ease; }
.mb-board__name { text-align: left !important; padding-left: 14px !important; }
.mb-board__name { display: flex; align-items: center; gap: 6px; height: 34px; }
.mb-board__name img { flex: none; width: 13px; height: 13px; }
.mb-board__name span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.mb-board__best { flex: none; padding: 2px 5px; border-radius: 4px; background: #e7f6ec; color: #15803d; font: 500 10px/1.2 var(--font-ui); font-style: normal; }
.mb-board__best[hidden] { display: none; }
.mb-board__empty { margin: 0; padding: 10px 14px 12px; font: 400 11.5px/1.4 var(--font-ui); color: #8b8f9a; }
.mb-board__empty[hidden] { display: none; }

.mb:has(input[value="loss"]:checked) [data-for="loss"],
.mb:has(input[value="story"]:checked) [data-for="story"],
.mb:has(input[value="curious"]:checked) [data-for="curious"],
.mb:has(input[value="proof"]:checked) [data-for="proof"] { display: block; }
.mb:has(input[value="loss"]:checked) .mb-win__addr[data-for="loss"],
.mb:has(input[value="story"]:checked) .mb-win__addr[data-for="story"],
.mb:has(input[value="curious"]:checked) .mb-win__addr[data-for="curious"],
.mb:has(input[value="proof"]:checked) .mb-win__addr[data-for="proof"] { display: inline; }

.mbl [data-b] { transition: opacity .35s ease, transform .35s ease; }
.mb.is-building .mb-page .mbl [data-b]:not(.is-shown) { opacity: 0; transform: translateY(5px); }

@keyframes mbRow { 0%, 30% { background: #f2f4ff; } 100% { background: transparent; } }

.mbl { display: flex; flex-direction: column; height: 100%; background: #fff; font-family: var(--font-ui); }
.mbl__nav { display: flex; align-items: center; gap: 1.4em; flex: none; height: 3.4em; padding: 0 1.8em; border-bottom: 1px solid #eef0f4; }
.mbl__logo { display: inline-flex; align-items: center; gap: .6em; }
.mbl__logo i { display: grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: .4em; background: var(--mn); }
.mbl__logo svg { width: 1.05em; height: 1.05em; fill: none; stroke: #fff; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.mbl__logo b { width: 5.2em; height: .6em; border-radius: .3em; background: #1f2937; opacity: .75; }
.mbl__links { display: inline-flex; gap: 1em; margin-left: auto; }
.mbl__links b { width: 2.6em; height: .45em; border-radius: .25em; background: #d6d9df; }
.mbl__btn { width: 5.6em; height: 1.9em; border-radius: .45em; background: var(--mo); }

.mbl__hero {
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.6em; align-items: center;
  padding: 2em 2.2em; background: var(--mn-tint);
}
.mbl__copy { display: flex; flex-direction: column; min-width: 0; }
.mbl__kicker {
  align-self: flex-start;
  padding: .35em .65em; border-radius: .4em; background: var(--mn-soft);
  font: 600 .78em/1 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--mn);
}
.mbl__h { margin-top: .6em; font: 700 2.1em/1.12 var(--font-ui); letter-spacing: -.022em; color: #0f1d3a; text-wrap: balance; }
.mbl__sub { margin-top: .6em; font: 400 1em/1.45 var(--font-ui); color: #5b6475; }
.mbl__card { display: grid; gap: .6em; margin-top: 1.1em; padding: .8em; border-radius: .8em; background: #fff; border: 1px solid #e2e7f1; }
.mbl__fields { display: grid; grid-template-columns: 1fr 1fr; gap: .5em; }
.mbl__field {
  display: flex; align-items: center; height: 2.6em; padding: 0 .8em;
  border-radius: .5em; border: 1px solid #e5e7eb;
  font: 400 .92em/1 var(--font-ui); color: #9ca3af; white-space: nowrap; overflow: hidden;
}
.mbl__cta { display: grid; place-items: center; height: 2.8em; border-radius: .55em; background: var(--mo); color: #fff; font: 600 1em/1 var(--font-ui); }
.mbl__fine { text-align: center; font: 400 .8em/1 var(--font-ui); color: #8b8f9a; }
.mbl__side { display: grid; place-items: center; min-width: 0; }
.mbl__art { width: 100%; max-width: 20em; height: auto; }
.mbl-a__disc { fill: var(--mn-soft); }
.mbl-a__unit { fill: #fff; stroke: #c8d1e3; stroke-width: 2; }
.mbl-a__fan { fill: #eef2f9; stroke: #b9c3d8; stroke-width: 2; }
.mbl-a__grill { stroke: #b9c3d8; stroke-width: 1.6; }
.mbl-a__panel { fill: #dfe5f1; }
.mbl-a__feet { stroke: #9aa6bd; stroke-width: 3; stroke-linecap: round; }
.mbl-a__tag { fill: var(--mo); }
.mbl-a__price { fill: #fff; font: 700 13px/1 var(--font-ui); }
.mbl__claims { display: flex; flex-direction: column; gap: .5em; width: 100%; max-width: 19em; padding: 1em; border-radius: .8em; background: #fff; border: 1px solid #e2e7f1; }
.mbl__claims-h { font: 600 .82em/1 var(--font-ui); color: #6b7280; }
.mbl__claim { display: flex; align-items: center; gap: .6em; padding-top: .55em; border-top: 1px solid #f0f2f6; font: 500 1em/1 var(--font-ui); color: #1f2937; }
.mbl__claim i { width: .7em; height: .7em; border-radius: 50%; background: #16a34a; }
.mbl__claim b { margin-left: auto; color: var(--mn); font-variant-numeric: tabular-nums; }

.mbl__quiz { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 1.8em 2em; background: var(--mn-tint); text-align: center; }
.mbl__quiz .mbl__kicker { align-self: center; }
.mbl__h--c { max-width: 18em; font-size: 1.95em; }
.mbl__qcard { width: min(30em, 100%); margin-top: 1em; text-align: left; }
.mbl__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35em; }
.mbl__steps i { height: .3em; border-radius: .15em; background: #e5e7eb; }
.mbl__steps i.is-on { background: var(--mo); }
.mbl__q { font: 600 1.2em/1.2 var(--font-ui); color: #0f1d3a; }
.mbl__opts { display: grid; grid-template-columns: 1fr 1fr; gap: .45em; }
.mbl__opt { display: flex; align-items: center; gap: .5em; height: 2.6em; padding: 0 .7em; border-radius: .5em; border: 1px solid #e5e7eb; font: 500 .92em/1 var(--font-ui); color: #374151; white-space: nowrap; }
.mbl__opt i { flex: none; width: .9em; height: .9em; border-radius: 50%; border: 1px solid #c9ced6; }
.mbl__opt.is-picked { border-color: var(--mo); background: #fff5ee; }
.mbl__opt.is-picked i { border: .28em solid var(--mo); }

.mbl__news { flex: 1; display: flex; flex-direction: column; background: #fff; }
.mbl__mast { display: flex; align-items: center; height: 3.2em; padding: 0 1.8em; border-bottom: 2px solid #111827; }
.mbl__mlogo { display: inline-flex; align-items: center; gap: .55em; }
.mbl__mlogo i { width: 1.3em; height: 1.3em; border-radius: 50%; background: #111827; }
.mbl__mlogo b { width: 6em; height: .7em; border-radius: .2em; background: #111827; }
.mbl__date { margin-left: auto; font: 400 .82em/1 var(--font-ui); color: #6b7280; }
.mbl__story { display: flex; flex-direction: column; width: min(38em, 100%); margin: 0 auto; padding: 1.4em 1.8em; }
.mbl__cat { font: 700 .78em/1 var(--font-ui); letter-spacing: .1em; text-transform: uppercase; color: #b42318; }
.mbl__nh { margin-top: .5em; font: 700 1.9em/1.15 Georgia, "Times New Roman", serif; color: #111827; letter-spacing: -.01em; text-wrap: balance; }
.mbl__dek { margin-top: .5em; font: 400 1.02em/1.45 Georgia, serif; color: #4b5563; }
.mbl__by { display: flex; align-items: center; gap: .5em; margin-top: .7em; font: 500 .8em/1 var(--font-ui); color: #6b7280; }
.mbl__by i { width: 1.4em; height: 1.4em; border-radius: 50%; background: #d1d5db; }
.mbl__photo { display: block; height: 7.5em; margin-top: .9em; border-radius: .4em; background: #e5e7eb url(/assets/img/pages/roof.jpg) center 40% / cover no-repeat; }
.mbl__lines { display: grid; gap: .45em; margin-top: .9em; }
.mbl__lines b { height: .55em; border-radius: .3em; background: #e5e7eb; }
.mbl__lines b.short { width: 70%; }
.mbl__cta--inline { justify-self: start; align-self: flex-start; margin-top: .9em; padding: 0 1.4em; }

.mb-stop { display: flex; flex-direction: column; padding: 32px; }
.mb-stop .gk-cell__title { margin-top: 10px; }
.mb-stop__time { margin: 20px 0 0; font: 500 11.5px/1 ui-monospace, "SF Mono", Menlo, monospace; color: var(--sk-faint, #b4b7bf); font-variant-numeric: tabular-nums; }

.mb-sk .sk-frame__in { display: flex; flex-direction: column; gap: 8px; }
.mb-sk p { margin: 0; }
.mb-sk__head { display: flex; align-items: center; gap: 7px; height: 16px; margin-bottom: 2px !important; font: 500 11.5px/1 var(--font-ui); color: var(--sk-ink); }
.mb-sk__head img { width: 12px; height: 12px; }
.mb-sk__head em { margin-left: auto; font: 500 10.5px/1 ui-monospace, "SF Mono", Menlo, monospace; font-style: normal; color: var(--sk-mute); }

.mb-sk__rep {
  position: relative; display: grid; grid-template-columns: 12px minmax(0, 1fr) 30% 2.8em; align-items: center; gap: 9px;
  height: 30px; padding: 0 9px; border-radius: 7px; border: 1px solid #f1f1f4;
}
.mb-sk__rep img { width: 12px; height: 12px; }
.mb-sk__rep b { text-align: right; font: 500 11.5px/1 ui-monospace, "SF Mono", Menlo, monospace; color: var(--sk-ink); }
.mb-sk__bar { height: 5px; border-radius: 3px; background: var(--sk-bone-lo); overflow: hidden; }
.mb-sk__bar i { display: block; width: var(--w); height: 100%; border-radius: inherit; background: #c3cbff; transform-origin: left; }
.mb-sk__rep.is-pick .mb-sk__bar i { background: var(--brand); }
.mb-sk__rep.is-low { opacity: .5; }

.mb-sk__var {
  position: relative; display: flex; align-items: center; gap: 10px;
  height: 36px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--sk-edge);
  font: 500 12.5px/1 var(--font-ui); color: var(--sk-ink);
}
.mb-sk__var b { margin-left: auto; font: 500 11.5px/1 ui-monospace, "SF Mono", Menlo, monospace; }
.mb-sk__k { flex: none; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 5px; background: var(--sk-bone); font: 600 10.5px/1 var(--font-ui); color: var(--sk-mute); }
.mb-sk__var.is-off b { color: var(--sk-faint); text-decoration: line-through; }
.mb-sk__var.is-pick .mb-sk__k { background: var(--brand); color: #fff; }
.mb-sk__var.is-pick b { color: var(--brand); }
.mb-sk__var.is-ghost { border-color: #f3f3f5; }

.mb-sk__row {
  position: relative; display: flex; align-items: center; gap: 9px;
  height: 34px; padding: 0 10px; border-radius: 8px; border: 1px solid #f1f1f4;
  font: 400 12.5px/1 var(--font-ui); color: var(--sk-ink); white-space: nowrap;
}

.mb-sk__link {
  position: relative; display: flex; align-items: center; gap: 7px; min-width: 0;
  height: 34px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--sk-edge);
  font: 400 11.5px/1 ui-monospace, "SF Mono", Menlo, monospace; white-space: nowrap;
}
.mb-sk__link s { flex: none; color: var(--sk-faint); }
.mb-sk__link b { font-weight: 500; color: var(--sk-ink); overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.mb-sk__link svg { flex: none; width: 12px; height: 12px; fill: none; stroke: #a8adb8; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.mb-sk__pages { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.mb-sk__page { position: relative; display: flex; flex-direction: column; gap: 4px; height: 52px; padding: 6px; border-radius: 6px; border: 1px solid var(--sk-edge); }
.mb-sk__page b { margin-top: auto; height: 7px; border-radius: 2px; background: #d9defe; }
.mb-sk__page em { position: absolute; right: -6px; top: -6px; }
.mb-sk__page em svg { display: block; width: 15px; height: 15px; padding: 2.5px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #d7dcfb; fill: none; stroke: var(--brand); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.mb-sk__lang { margin-left: auto; font: 500 10.5px/1 ui-monospace, "SF Mono", Menlo, monospace; color: var(--sk-mute); }
.mb-sk__en { display: grid; gap: 7px; padding: 10px; border-radius: 8px; background: var(--sk-ground); }
.mb-sk__es { position: relative; padding: 9px 10px; border-radius: 8px; border: 1px solid var(--sk-edge); font: 500 12.5px/1.4 var(--font-ui); color: var(--sk-ink); }

.mb-sk__fld {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  height: 32px; padding: 0 10px; border-radius: 8px; border: 1px solid #f1f1f4;
  font: 400 12px/1 var(--font-ui); color: var(--sk-mute);
}
.mb-sk__fld b { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; color: var(--sk-ink); }
.mb-sk__fld img { width: 12px; height: 12px; }
.mb-sk__btn { align-self: flex-end; margin-top: 2px; padding: 8px 11px; border-radius: 7px; background: var(--brand); color: #fff; font: 500 11.5px/1 var(--font-ui); }

@media (prefers-reduced-motion: no-preference) {
  .pg-js .mb-stop:not(.is-in) .mb-sk__bar i { transform: scaleX(0); }
  .mb-sk__bar i { transition: transform .8s cubic-bezier(.2, .8, .3, 1) calc(.2s + var(--j) * .1s); }
  .pg-js .mb-stop:not(.is-in) .mb-sk__page em { opacity: 0; transform: scale(.6); }
  .mb-sk__page em { transition: opacity .3s ease calc(.3s + var(--j) * .12s), transform .3s ease calc(.3s + var(--j) * .12s); }
}

.mb-sig__frame { padding: 32px; }
.mb-sig__tabs { display: inline-flex; gap: 2px; margin: 0; padding: 3px; border: 0; border-radius: 10px; background: #f0f1f4; }
.mb-sig__tab {
  position: relative; display: inline-flex; align-items: center; gap: 7px;
  height: 32px; padding: 0 13px; border-radius: 8px;
  font: 500 13px/1 var(--font-ui); color: var(--gk-soft); cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.mb-sig__tab input { position: absolute; opacity: 0; pointer-events: none; }
.mb-sig__tab img { width: 14px; height: 14px; }
.mb-sig__tab:has(:checked) { background: #fff; color: var(--ink-nav); }
.mb-sig__tab:has(:focus-visible) { outline: 2px solid var(--brand); outline-offset: 1px; }
.mb-sig__desc { display: none; }

.mb-sig__sk {
  margin-top: 16px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 56px), transparent calc(100% - 6px));
  mask-image: linear-gradient(to bottom, #000 calc(100% - 56px), transparent calc(100% - 6px));
}
.mb-sig__sk > .sk-frame { margin-bottom: -24px; }
.mb-sig__sk .sk-frame__in { padding: 32px 28px 64px; }

.mb-sig__flow {
  position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr) 30px minmax(0, 1fr) 30px minmax(0, 1.3fr) 30px minmax(0, .9fr);
  align-items: center;
}
.mb-node { position: relative; display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 12px 13px 14px; border-radius: 10px; border: 1px solid var(--sk-edge); }
.mb-node.is-pick { border-color: var(--sk-brand-edge); }
.mb-node__k { font: 500 10px/1 var(--sk-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--sk-faint); }
.mb-node__v { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.mb-node__v[data-src] { display: none; }
.mb-node__name { display: flex; align-items: center; gap: 7px; height: 14px; }
.mb-node__name img { width: 14px; height: 14px; }
.mb-node__v code { max-width: 100%; font: 500 11px/1.35 var(--sk-mono); color: var(--sk-ink); overflow-wrap: anywhere; }
.mb-node__form { gap: 6px; }
.mb-node__form i { display: flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 5px; border: 1px solid #f1f1f4; }
.mb-node__form em { display: grid; place-items: center; height: 20px; border-radius: 5px; background: var(--sk-ground); }
.mb-node__form .sk-tick { width: 14px; height: 14px; }
.mb-node__form .sk-tick svg { width: 9px; height: 9px; }
.mb-sig__arrow { display: grid; place-items: center; }
.mb-sig__arrow svg { width: 22px; height: 12px; fill: none; stroke: #d4d7de; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mb-sig__dot { position: absolute; left: 0; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--brand); opacity: 0; pointer-events: none; }

.mb-sig__back { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 18px; }
.mb-ret { display: flex; flex-direction: column; gap: 9px; min-width: 0; padding: 12px 14px 13px; border-radius: 10px; border: 1px solid var(--sk-edge); }
.mb-ret__head { display: flex; align-items: center; gap: 7px; font: 500 12px/1 var(--font-ui); color: var(--sk-ink); }
.mb-ret__head svg { width: 14px; height: 14px; fill: none; stroke: var(--sk-mute); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mb-ret__url { display: flex; align-items: center; gap: 3px; min-width: 0; height: 28px; padding: 0 9px; border-radius: 7px; background: var(--sk-ground); }
.mb-ret__url code { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 10.5px/1.4 var(--sk-mono); color: #4b4f58; }
.mb-ret__ok { display: flex; align-items: center; gap: 8px; }
.mb-ret__ok .sk-tick { width: 16px; height: 16px; }
.mb-ret__ok .sk-tick svg { width: 10px; height: 10px; }
.mb-ret__set { display: none; flex-direction: column; gap: 9px; }
.mb-ret__ev { display: flex; align-items: center; gap: 7px; padding-top: 9px; border-top: 1px solid #f3f3f5; font: 400 12px/1 var(--font-ui); color: var(--sk-ink); }
.mb-ret__ev img { width: 12px; height: 12px; }

.mb-sig:has([value="meta"]:checked) [data-src="meta"],
.mb-sig:has([value="tiktok"]:checked) [data-src="tiktok"],
.mb-sig:has([value="taboola"]:checked) [data-src="taboola"] { display: flex; }
.mb-sig:has([value="meta"]:checked) .mb-sig__desc[data-src="meta"],
.mb-sig:has([value="tiktok"]:checked) .mb-sig__desc[data-src="tiktok"],
.mb-sig:has([value="taboola"]:checked) .mb-sig__desc[data-src="taboola"] { display: block; }

@media (prefers-reduced-motion: no-preference) {
  .mb-sig:has([value="meta"]:checked) .mb-sig__sk.is-in .mb-sig__dot { animation: mbRunA 2.6s cubic-bezier(.45, 0, .3, 1) .2s both; }
  .mb-sig:has([value="tiktok"]:checked) .mb-sig__sk.is-in .mb-sig__dot { animation: mbRunB 2.6s cubic-bezier(.45, 0, .3, 1) .1s both; }
  .mb-sig:has([value="taboola"]:checked) .mb-sig__sk.is-in .mb-sig__dot { animation: mbRunC 2.6s cubic-bezier(.45, 0, .3, 1) .1s both; }
}
@keyframes mbRunA { 0% { left: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: calc(100% - 8px); opacity: 0; } }
@keyframes mbRunB { 0% { left: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: calc(100% - 8px); opacity: 0; } }
@keyframes mbRunC { 0% { left: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: calc(100% - 8px); opacity: 0; } }

@media (max-width: 1100px) {
  .mb { padding: 20px 18px 22px; }
  .mb-win__page { font-size: 9px; }
  .mb-sig__sk .sk-frame__in { padding: 28px 20px 60px; }
}
@media (max-width: 900px) {
  .mb-stage { padding: 16px; }
  .mb { padding: 16px 12px 16px; }
  .mb-cres__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mb-work { grid-template-columns: minmax(0, 1fr); }
  .mb-win__page { min-height: 300px; font-size: 9.6px; }
  .mb-stop, .mb-sig__frame { padding: 24px; }
  .mb-sig__flow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 10px; }
  .mb-sig__arrow, .mb-sig__dot { display: none; }
  .mb-sig__back { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}
@media (max-width: 640px) {
  .mb-cres__row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 8px; margin: -4px -4px 0; scrollbar-width: none; }
  .mb-cres__row::-webkit-scrollbar { display: none; }
  .mb-cre { flex: none; width: 216px; scroll-snap-align: start; }
  .mb-win__page { font-size: 7.4px; min-height: 270px; }
  .mbl__hero { grid-template-columns: minmax(0, 1fr); padding: 1.8em; }
  .mbl__side { display: none; }
  .mbl__links { display: none; }
  .mbl__btn { margin-left: auto; }
  .mb-sig__flow { grid-template-columns: minmax(0, 1fr); }
  .mb-sig__tabs { display: flex; }
  .mb-sig__tab { flex: 1; justify-content: center; padding: 0 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .mbl [data-b], .mb-ai__log li { transition: none; }
  .mb-board__table tr.is-new td { animation: none; }
}