.mg-ask {
  --ga-bg: var(--card, #fff);
  --ga-surface: var(--card, #fff);
  --ga-surface-2: var(--card2, #f4f4f5);
  --ga-surface-3: var(--bg, #fafafa);
  --ga-line: var(--border, #e4e4e7);
  --ga-line-2: var(--border2, #d4d4d8);
  --ga-text: var(--fg, #09090b);
  --ga-text-2: var(--fg2, #71717a);
  --ga-text-3: var(--fg2, #71717a);
  --ga-accent: var(--fg, #09090b);
  --ga-accent-ink: var(--bg, #fafafa);
  --ga-accent-soft: color-mix(in srgb, var(--fg, #09090b) 10%, transparent);
  --ga-up: #12865a;
  --ga-up-soft: rgba(18, 134, 90, .12);
  --ga-down: #c93c33;
  --ga-down-soft: rgba(201, 60, 51, .12);
  position: relative;
  z-index: 1;
  max-width: 1024px;
  margin: 12px auto 0;
  padding: 36px 24px 96px;
  color: var(--ga-text);
}
[data-theme="dark"] .mg-ask {
  --ga-up: #34d399;
  --ga-up-soft: rgba(52, 211, 153, .16);
  --ga-down: #f87171;
  --ga-down-soft: rgba(248, 113, 113, .16);
}
.mg-ask * { box-sizing: border-box; }
.mg-ask__kicker {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 720px;
  margin: 0 auto 12px;
  color: var(--ga-text-3);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.mg-ask__kicker i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ga-accent);
  box-shadow: 0 0 0 5px var(--ga-accent-soft);
}
.mg-ask h2 {
  max-width: 720px;
  min-height: 1.02em;
  margin: 0 auto 22px;
  color: var(--ga-text);
  font-family: Syne, ui-sans-serif, sans-serif;
  font-size: clamp(34px, 4.6vw, 56px);
  font-weight: 700;
  letter-spacing: -.045em;
  line-height: .96;
  text-transform: uppercase;
}
.mg-ask h2 .caret {
  display: inline-block;
  width: 2px;
  height: .72em;
  margin-left: 4px;
  background: var(--ga-accent);
  vertical-align: -1px;
  animation: mg-ask-blink 1s steps(1) infinite;
}
.mg-ask.is-done h2 .caret { display: none; }
.mg-ask__window {
  position: relative;
  display: flex;
  flex-direction: column;
  max-width: 720px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--ga-line-2);
  border-radius: 24px;
  background: var(--ga-bg);
  box-shadow: 0 28px 70px -40px rgba(0, 0, 0, .7);
}
.mg-ask__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ga-line);
}
.mg-ask__mark {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: var(--ga-accent);
  color: var(--ga-accent-ink);
  font-size: 14px;
  font-weight: 800;
}
.mg-ask__bar b { display: block; font-size: 14px; letter-spacing: -.02em; }
.mg-ask__bar small { color: var(--ga-text-3); font-size: 12px; }
.mg-ask__desk {
  margin-left: auto;
  padding: 7px 12px;
  border: 1px solid var(--ga-line-2);
  border-radius: 999px;
  color: var(--ga-text);
  font-size: 12px;
  font-weight: 700;
}
.mg-ask__log {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-height: min(62vh, 560px);
  padding: 16px;
  overflow: auto;
  scroll-behavior: smooth;
}
.mg-ask__msg { max-width: 100%; font-size: 14.5px; line-height: 1.5; }
.mg-ask__msg--user {
  align-self: flex-end;
  max-width: min(440px, 88%);
  padding: 10px 13px;
  border-radius: 16px 16px 5px 16px;
  background: var(--ga-accent);
  color: var(--ga-accent-ink);
  font-weight: 600;
}
.mg-ask__msg--ai {
  transition: opacity .45s ease, transform .45s ease;
}
.mg-ask__msg--ai.is-leaving,
.mg-ask__react.is-leaving {
  opacity: 0;
  transform: translateY(-10px);
}
.mg-ask__react {
  position: relative;
  align-self: flex-end;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin-top: -16px;
  font-size: 34px;
  line-height: 1;
  animation: mg-ask-pop .62s cubic-bezier(.17, 1.55, .32, 1) both;
  filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .22));
}
.mg-ask__react i {
  position: absolute;
  inset: 2px;
  border: 2px solid var(--fg, #09090b);
  border-radius: 50%;
  opacity: 0;
  animation: mg-ask-ring .62s ease-out both;
}
.mg-ask__window.is-buzz,
.mg-ask__window.is-finale {
  animation: mg-ask-buzz .46s linear;
}
.mg-ask__window.is-finale { animation-duration: .7s; }
.mg-ask__react.is-finale span {
  display: block;
  animation: mg-ask-pop .7s cubic-bezier(.17, 1.55, .32, 1) both;
}
.mg-ask__burst {
  position: absolute;
  inset: 0;
  z-index: 6;
  overflow: hidden;
  pointer-events: none;
}
.mg-ask__burst-head {
  position: absolute;
  left: 50%;
  bottom: 22%;
  font-size: 84px;
  line-height: 1;
  filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .28));
  animation: mg-ask-head 1.2s cubic-bezier(.16, 1.35, .32, 1) both;
}
.mg-ask__burst-bit {
  position: absolute;
  left: 50%;
  bottom: 18%;
  font-size: 30px;
  line-height: 1;
  animation: mg-ask-fly 1.05s cubic-bezier(.15, .7, .2, 1) both;
}
.mg-ask__burst-spark {
  position: absolute;
  left: 50%;
  bottom: 30%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fe6e00;
  box-shadow: 0 0 0 3px rgba(254, 110, 0, .25);
  animation: mg-ask-spark .85s ease-out both;
}
.mg-ask__approve {
  display: grid;
  gap: 10px;
}
.mg-ask__approve p {
  margin: 0;
  color: var(--ga-text-2);
  font-size: 13px;
}
.mg-ask__approve-actions {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 8px;
}
.mg-ask__approve button {
  padding: 12px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 750;
}
.mg-ask__approve .no {
  border: 1px solid var(--ga-line-2);
  background: transparent;
  color: var(--ga-text);
}
.mg-ask__approve .yes {
  border: 0;
  background: var(--ga-accent);
  color: var(--ga-accent-ink);
}
.mg-ask__approve button.is-press {
  transform: translateY(1px);
  outline: 2px solid var(--ga-text);
}
.mg-ask__msg--ai p {
  max-width: 46em;
  margin: 0 0 10px;
  color: var(--ga-text);
}
.mg-ask__widget {
  overflow: hidden;
  border: 1px solid var(--ga-line);
  border-radius: 16px;
  background: var(--ga-surface);
}
.mg-ask__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--ga-line);
}
.mg-ask__pair {
  padding: 5px 10px;
  border: 1px solid var(--ga-line-2);
  border-radius: 999px;
  background: var(--ga-surface-3);
  font-size: 12px;
  font-weight: 750;
}
.mg-ask__px { text-align: right; font-variant-numeric: tabular-nums; }
.mg-ask__px b { display: block; font-size: 15px; }
.mg-ask__px b.up { color: var(--ga-up); }
.mg-ask__px b.down { color: var(--ga-down); }
.mg-ask__px span {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  color: var(--ga-text-3);
  font-size: 11px;
}
.mg-ask__px i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ga-up);
}
.mg-ask__chart { height: 120px; background: var(--bg, #fafafa); border-bottom: 1px solid var(--ga-line); }
.mg-ask__chart canvas { display: block; width: 100%; height: 100%; }
.mg-ask__body { display: grid; gap: 12px; padding: 12px; }
.mg-ask__label {
  display: block;
  margin-bottom: 6px;
  color: var(--ga-text-3);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.mg-ask__durs,
.mg-ask__quick { display: flex; flex-wrap: wrap; gap: 6px; }
.mg-ask__durs button,
.mg-ask__quick button {
  padding: 6px 10px;
  border: 1px solid var(--ga-line);
  border-radius: 8px;
  background: transparent;
  color: var(--ga-text-2);
  font-size: 12px;
}
.mg-ask__durs button.is-on {
  border-color: var(--ga-accent);
  background: var(--ga-accent-soft);
  color: var(--ga-accent);
  font-weight: 750;
}
.mg-ask__stake {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border: 1px solid var(--ga-line);
  border-radius: 10px;
  background: var(--ga-bg);
  font-weight: 750;
}
.mg-ask__stake em { color: var(--ga-text-3); font-style: normal; font-size: 12px; }
.mg-ask__meta { color: var(--ga-text-3); font-size: 12px; }
.mg-ask__meta b { color: var(--ga-up); }
.mg-ask__sides { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mg-ask__sides button {
  padding: 12px;
  border: 0;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
}
.mg-ask__sides .up { background: var(--ga-up); color: #f0fdf4; }
.mg-ask__sides .down { background: var(--ga-down); color: #fff; }
.mg-ask__sides .is-press { transform: translateY(1px); outline: 2px solid var(--ga-text); }
.mg-ask__confirm p { margin: 0; color: var(--ga-text-2); font-size: 13px; line-height: 1.5; }
.mg-ask__confirm p b { color: var(--ga-text); }
.mg-ask__confirm-actions { display: flex; gap: 8px; }
.mg-ask__confirm-actions button {
  flex: 1;
  padding: 11px 12px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 750;
}
.mg-ask__confirm-actions .no {
  border: 1px solid var(--ga-line-2);
  background: transparent;
  color: var(--ga-text-2);
}
.mg-ask__confirm-actions .yes {
  border: 0;
  background: var(--ga-accent);
  color: var(--ga-accent-ink);
}
.mg-ask__clock { text-align: center; }
.mg-ask__clock small {
  color: var(--ga-text-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.mg-ask__clock b {
  display: block;
  font-variant-numeric: tabular-nums;
  font-size: 40px;
  letter-spacing: -.04em;
  line-height: 1.1;
}
.mg-ask__barline { height: 3px; overflow: hidden; border-radius: 99px; background: var(--ga-surface-3); }
.mg-ask__barline span { display: block; height: 100%; background: var(--ga-accent); }
.mg-ask__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--ga-line);
  border-radius: 10px;
  background: var(--ga-line);
}
.mg-ask__grid div { padding: 8px 6px; background: var(--ga-bg); text-align: center; }
.mg-ask__grid small { display: block; color: var(--ga-text-3); font-size: 11px; }
.mg-ask__grid b { font-variant-numeric: tabular-nums; }
.mg-ask__grid .good { color: var(--ga-up); }
.mg-ask__grid .bad { color: var(--ga-down); }
.mg-ask__out { display: grid; gap: 10px; }
.mg-ask__out-head { display: flex; align-items: center; gap: 10px; }
.mg-ask__out-ic {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  font-weight: 800;
}
.mg-ask__out.won .mg-ask__out-ic { background: var(--ga-up-soft); color: var(--ga-up); }
.mg-ask__out.lost .mg-ask__out-ic { background: var(--ga-down-soft); color: var(--ga-down); }
.mg-ask__out strong { display: block; font-size: 15px; }
.mg-ask__out small { color: var(--ga-text-3); font-size: 12px; }
.mg-ask__kv { display: grid; gap: 1px; overflow: hidden; border: 1px solid var(--ga-line); border-radius: 10px; background: var(--ga-line); }
.mg-ask__kv div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 12px; background: var(--ga-bg); font-size: 12px; }
.mg-ask__kv span { color: var(--ga-text-3); }
.mg-ask__kv b { font-variant-numeric: tabular-nums; }
.mg-ask__recorded {
  color: var(--ga-text-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.mg-ask__compose {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 16px 16px;
  min-height: 48px;
  padding: 8px 8px 8px 14px;
  border: 1px solid var(--ga-line-2);
  border-radius: 999px;
  color: var(--ga-text-2);
  font-size: 14px;
}
.mg-ask__compose b { color: var(--ga-text-3); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
@keyframes mg-ask-blink { 50% { opacity: 0; } }
@keyframes mg-ask-pop {
  0% { transform: scale(.12) translateY(18px) rotate(-14deg); }
  52% { transform: scale(1.34) translateY(-10px) rotate(7deg); }
  76% { transform: scale(.92) translateY(2px) rotate(-2deg); }
  100% { transform: scale(1) translateY(0) rotate(0); }
}
@keyframes mg-ask-ring {
  0% { transform: scale(.35); opacity: .7; }
  100% { transform: scale(1.7); opacity: 0; }
}
@keyframes mg-ask-head {
  0% { transform: translate(-50%, 48px) scale(.15) rotate(-16deg); opacity: 0; }
  18% { opacity: 1; }
  42% { transform: translate(-50%, -28px) scale(1.42) rotate(8deg); }
  62% { transform: translate(-50%, 6px) scale(.9) rotate(-4deg); }
  80% { transform: translate(-50%, -8px) scale(1.12) rotate(2deg); }
  100% { transform: translate(-50%, -20px) scale(.8) rotate(0); opacity: 0; }
}
@keyframes mg-ask-fly {
  0% { transform: translate(-50%, 12px) scale(.35) rotate(0); opacity: 0; }
  16% { opacity: 1; }
  100% { transform: translate(calc(-50% + var(--x)), var(--y)) scale(1.05) rotate(var(--r)); opacity: 0; }
}
@keyframes mg-ask-spark {
  0% { transform: translate(-50%, 0) scale(1); opacity: 1; }
  100% { transform: translate(calc(-50% + var(--x)), var(--y)) scale(.2); opacity: 0; }
}
@keyframes mg-ask-buzz {
  0%, 100% { transform: translate3d(0, 0, 0); }
  14% { transform: translate3d(-2px, 1px, 0); }
  28% { transform: translate3d(3px, -1px, 0); }
  42% { transform: translate3d(-3px, 1px, 0); }
  56% { transform: translate3d(2px, -1px, 0); }
  70% { transform: translate3d(-1px, 1px, 0); }
  84% { transform: translate3d(1px, 0, 0); }
}
@media (max-width: 700px) {
  .mg-ask { padding: 20px 16px 72px; }
  .mg-ask h2 { font-size: 32px; }
  .mg-ask__grid { grid-template-columns: 1fr; }
  .mg-ask__desk { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mg-ask h2 .caret { animation: none; }
  .mg-ask__msg--ai,
  .mg-ask__react,
  .mg-ask__react.is-finale span,
  .mg-ask__burst-head,
  .mg-ask__burst-bit,
  .mg-ask__burst-spark,
  .mg-ask__window.is-buzz,
  .mg-ask__window.is-finale { animation: none; transition: none; }
}