:root { --master-paper: #fff4f1; --master-ink: #202033; --master-coral: #fa8d84; }
html, body, #app { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body.master-presentation-active { background: #211f29; color: var(--master-ink); }
body.master-presentation-active * { box-sizing: border-box; }
.master-presentation, .master-presentation-shell { position: fixed; inset: 0; overflow: hidden; }
.master-presentation-shell { background: #211f29; }
.presentation-stage {
  --presentation-scale: 1;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1080px;
  overflow: hidden;
  transform: translate(-50%, -50%) scale(var(--presentation-scale));
  transform-origin: 50% 50%;
  background: var(--master-paper);
  opacity: 1;
  padding: 0;
  isolation: isolate;
}
.master-slide-image, .master-mask-layer, .master-motion-layer, .master-editable-overlay-layer,
.master-focus-curtain, .master-focus-card, .master-plan-targets, .master-click-surface {
  position: absolute;
  inset: 0;
  width: 1920px;
  height: 1080px;
}
.master-slide-image { z-index: 1; display: block; object-fit: fill; pointer-events: none; user-select: none; }
.master-mask-layer { z-index: 35; pointer-events: none; }
.master-mask {
  position: absolute;
  left: var(--mask-x);
  top: var(--mask-y);
  width: var(--mask-w);
  height: var(--mask-h);
  border-radius: var(--mask-radius);
  background: var(--mask-color);
  opacity: 1;
  transition: opacity 360ms ease;
  pointer-events: none;
}
.master-mask.is-revealed, .presentation-stage.is-master-ready .master-mask--auto { opacity: 0; }
.master-motion-layer { z-index: 36; pointer-events: none; }
.master-road-patch, .master-road-strip, .master-passed-card {
  position: absolute;
  left: var(--motion-x);
  top: var(--motion-y);
  width: var(--motion-w);
  height: var(--motion-h);
  pointer-events: none;
}
.master-road-patch, .master-road-strip { display: block; }
.master-moving-car {
  position: absolute;
  left: var(--car-x);
  top: var(--car-y);
  width: var(--car-w);
  height: var(--car-h);
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 3px 2px rgb(32 32 51 / .12));
}
.master-moving-car.is-moving { animation: master-car-move 520ms cubic-bezier(.22,1,.36,1) both; }
@keyframes master-car-move {
  from { transform: translate(var(--car-dx), var(--car-dy)); }
  to { transform: translate(0, 0); }
}
.master-passed-card { border-radius: 28px; background: rgb(252 240 238 / .32); }
.master-license-celebration {
  position: absolute;
  left: 1475px;
  top: 800px;
  width: 397px;
  height: 230px;
  border-radius: 34px;
  box-shadow: 0 0 0 0 rgb(255 90 130 / 0);
  animation: master-license-pulse 820ms ease-out both;
}
@keyframes master-license-pulse {
  0% { transform: scale(.98); box-shadow: 0 0 0 0 rgb(255 90 130 / .32); }
  45% { transform: scale(1.025); box-shadow: 0 0 0 26px rgb(255 90 130 / .12); }
  100% { transform: scale(1); box-shadow: 0 0 0 42px rgb(255 90 130 / 0); }
}
.master-editable-overlay-layer { z-index: 30; pointer-events: none; }
.master-edit-mask, .master-edit-text {
  position: absolute;
  left: var(--edit-x);
  top: var(--edit-y);
  width: var(--edit-w);
  height: var(--edit-h);
  pointer-events: none;
}
.master-edit-mask { background: var(--edit-color); }
.master-edit-text {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  color: var(--master-ink);
  font-family: "Hiragino Sans", "Yu Gothic", sans-serif;
  font-size: 43px;
  font-weight: 800;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow: hidden;
}
.master-edit-text.coral { color: var(--master-coral); }
.master-edit-text.inverse { color: #fff; }
.master-edit-text.heading { justify-content: flex-start; font-size: 52px; }
.master-edit-text.title { font-size: 54px; white-space: nowrap; }
.master-edit-text.body { justify-content: flex-start; align-items: flex-start; font-size: 29px; font-weight: 500; line-height: 2; }
.master-edit-text.school-name { font-size: 55px; letter-spacing: .12em; }
.master-edit-text.final { font-size: 47px; }
.master-edit-text.support-label { font-size: 54px; }
.master-edit-text.support-value { font-size: 88px; }
.master-edit-text.voice-name { font-size: 30px; }
.master-edit-text.voice-sub { font-size: 19px; font-weight: 500; }
.master-edit-text.voice-body { align-items: flex-start; justify-content: flex-start; font-size: 24px; font-weight: 500; line-height: 1.62; }
.master-click-surface {
  z-index: 40;
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  appearance: none;
  background: transparent;
  outline: 0;
  cursor: pointer;
}
.master-plan-targets { z-index: 50; pointer-events: none; }
.master-plan-target {
  position: absolute;
  left: var(--target-x);
  top: var(--target-y);
  width: var(--target-w);
  height: var(--target-h);
  padding: 0;
  border: 0;
  border-radius: 34px;
  background: transparent;
  appearance: none;
  pointer-events: auto;
  cursor: pointer;
}
.master-plan-target:focus-visible { outline: 6px solid #2489ff; outline-offset: -10px; }
.master-focus-curtain { z-index: 25; background: var(--master-paper); pointer-events: none; }
.master-focus-card { z-index: 26; left: 654px; top: 111px; width: 612px; height: 858px; pointer-events: none; filter: drop-shadow(0 12px 30px rgb(32 32 51 / .14)); }
.master-focus-card img { display: block; width: 612px; height: 858px; border-radius: 34px; pointer-events: none; }
.master-price-mask, .master-price-offer {
  position: absolute;
  z-index: 35;
  left: var(--price-x);
  top: 307px;
  width: 520px;
  height: 104px;
  pointer-events: none;
}
.master-price-mask { background: #fff; }
.master-price-offer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  color: var(--price-color);
  font-family: "Hiragino Sans", "Yu Gothic", sans-serif;
  font-weight: 800;
  white-space: nowrap;
}
.master-price-offer del { color: #777; font-size: 25px; text-decoration-thickness: 3px; }
.master-price-offer b { font-size: 52px; }
.master-price-offer small { color: #111; font-size: 23px; }
.master-price-mask.is-focused, .master-price-offer.is-focused { left: 702px; top: 238px; }
.master-ui-layer, .master-modal-layer { position: fixed; inset: 0; z-index: 150; pointer-events: none; font-family: "Hiragino Sans", "Yu Gothic", sans-serif; }
.master-counter { position: absolute; right: 18px; bottom: 14px; padding: 6px 11px; border-radius: 999px; background: rgb(32 32 51 / .62); color: #fff; font-size: 13px; opacity: .75; }
.master-nav { position: absolute; left: 20px; right: 20px; bottom: 18px; display: flex; justify-content: space-between; opacity: 0; transition: opacity 180ms ease; }
.master-nav.is-visible { opacity: .78; }
.master-nav button, .master-menu button, .master-price-editor button { pointer-events: auto; cursor: pointer; }
.master-nav button { border: 0; border-radius: 999px; padding: 9px 16px; background: var(--master-ink); color: #fff; }
.master-modal-layer { z-index: 220; }
.master-menu { position: absolute; inset: 0; display: grid; place-items: center; background: rgb(32 32 51 / .93); pointer-events: auto; }
.master-menu > div { width: min(1140px, 82vw); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.master-menu button { min-height: 90px; border: 0; border-radius: 13px; padding: 13px; text-align: left; background: #fff; color: var(--master-ink); font: inherit; }
.master-menu b { display: block; margin-bottom: 5px; color: var(--master-coral); font-size: 22px; }
.master-price-editor { position: fixed; inset: 0; width: min(430px, 90vw); height: max-content; margin: auto; padding: 25px; border: 0; border-radius: 20px; box-shadow: 0 18px 60px rgb(0 0 0 / .36); pointer-events: auto; }
.master-price-editor h2 { margin: 0 0 18px; font-size: 22px; }
.master-price-editor > button[data-close] { position: absolute; right: 11px; top: 8px; border: 0; background: none; font-size: 24px; }
.master-price-editor label { display: block; margin: 12px 0; font-weight: 700; }
.master-price-editor input, .master-price-editor select { display: block; width: 100%; margin-top: 5px; padding: 10px; border: 1px solid #d8d8df; border-radius: 8px; font: inherit; }
.master-price-editor div { display: flex; gap: 10px; }
.master-price-editor div button { border: 0; border-radius: 999px; padding: 9px 15px; background: var(--master-coral); color: #fff; }
.master-qa-mode .master-ui-layer, .master-qa-mode .master-modal-layer { display: none !important; }
@media (max-width: 760px) { .master-menu > div { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .master-mask, .master-nav { transition-duration: 1ms; } }