html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

body:not(.route-variant-a) {
  min-height: 100dvh !important;
  --shell-width: 393px !important;
  --font-ui: var(--font-playful) !important;
  --font-display: var(--font-playful) !important;
  --font-mystic: var(--font-playful) !important;
  --font-voice: var(--font-playful) !important;
  --gb-outline-strong: 3.24px;
  --gb-outline-mid: 3.24px;
  --gb-outline-soft: 3.24px;
  --gb-outline-unified: 3.24px;
  --gb-outline-color: #847198;
  --gb-shadow-strong: none;
  --gb-shadow-mid: none;
  --gb-shadow-soft: none;
  background:
    #d7a7cf
    url("./designer/main/global-bg.webp")
    center center / cover no-repeat fixed !important;
  color: #5d4c8f !important;
  font-family: var(--font-ui) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  font-kerning: normal;
  font-synthesis-weight: none;
}

body:not(.route-variant-a) .site-shell :where(
    p,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    span,
    strong,
    small,
    em,
    b,
    label,
    button,
    a,
    li,
    dt,
    dd,
    input,
    textarea,
    select
  ):not(.sr-only):not(.boot-task):not(.boot-progress-value):not(.boot-progress-count) {
  font-family: var(--font-playful), "Hakgyoansim Tteokbokki", sans-serif !important;
}

body:not(.route-variant-a) .site-shell input::placeholder,
body:not(.route-variant-a) .site-shell textarea::placeholder {
  font-family: var(--font-playful), "Hakgyoansim Tteokbokki", sans-serif !important;
}

body.scene-intro-active:not(.route-variant-a),
body.scene-form-active:not(.route-variant-a),
body.scene-question-active:not(.route-variant-a),
body.scene-loading-active:not(.route-variant-a) {
  overflow: hidden !important;
}

body:not(.route-variant-a)::before,
body:not(.route-variant-a)::after,
body:not(.route-variant-a) .ambient-grid,
body:not(.route-variant-a) .ambient-noise,
body:not(.route-variant-a) .top-rail,
body:not(.route-variant-a) .scene-transition,
body:not(.route-variant-a) .app-frame::before,
body:not(.route-variant-a) .app-frame::after,
body:not(.route-variant-a) .scene-panel::before,
body:not(.route-variant-a) .scene-panel::after,
body:not(.route-variant-a) .hero-visual-scrim,
body:not(.route-variant-a) .hero-visual-frame,
body:not(.route-variant-a) .hero-visual::before,
body:not(.route-variant-a) .hero-visual::after {
  display: none !important;
  content: none !important;
}

body:not(.route-variant-a) .site-shell {
  display: flex !important;
  justify-content: center !important;
  align-items: stretch !important;
  min-height: 100dvh !important;
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
}

body:not(.route-variant-a) .app-frame {
  position: relative !important;
  width: min(100vw, var(--shell-width)) !important;
  max-width: var(--shell-width) !important;
  min-height: 100dvh !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body:not(.route-variant-a) .scene,
body:not(.route-variant-a) .scene-active,
body:not(.route-variant-a) .scene-panel {
  min-height: 100dvh !important;
  height: 100dvh !important;
}

body:not(.route-variant-a) .scene-panel {
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) img[draggable="false"],
body:not(.route-variant-a) .hero-title-art,
body:not(.route-variant-a) .hero-logo-image,
body:not(.route-variant-a) .hero-desc-art,
body:not(.route-variant-a) .question-scene-main,
body:not(.route-variant-a) .question-scene-title {
  -webkit-user-drag: none !important;
  user-drag: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
  pointer-events: none !important;
  image-rendering: auto !important;
  backface-visibility: hidden !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-intro .scene-panel-hero,
body:not(.route-variant-a) #scene-question .scene-panel-question {
  position: relative !important;
  isolation: isolate !important;
}

body:not(.route-variant-a) #scene-intro .scene-panel-hero::before,
body:not(.route-variant-a) #scene-question .scene-panel-question::before {
  content: "" !important;
  display: none !important;
}

body:not(.route-variant-a) #scene-intro .scene-panel-hero {
  background: transparent !important;
  overflow: hidden !important;
}

body.scene-intro-blur-pending:not(.route-variant-a) #scene-intro .scene-panel-hero {
  cursor: pointer !important;
}

body.scene-intro-blur-pending:not(.route-variant-a) .app-frame::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 80 !important;
  display: block !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 76% 16%, rgba(255, 255, 255, 0.48), transparent 22%),
    radial-gradient(circle at 28% 74%, rgba(255, 218, 189, 0.34), transparent 28%),
    conic-gradient(from 138deg at 50% 46%, rgba(255, 255, 255, 0.18), rgba(132, 113, 152, 0.18), rgba(255, 231, 197, 0.2), rgba(255, 255, 255, 0.18)),
    repeating-linear-gradient(112deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 10px) !important;
  opacity: 1 !important;
  backdrop-filter: blur(18px) saturate(1.35) contrast(0.92) brightness(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.35) contrast(0.92) brightness(1.08) !important;
  transform: scale(1.012) !important;
  transform-origin: center center !important;
  transition:
    opacity 180ms cubic-bezier(0.22, 0.8, 0.22, 1),
    transform 180ms cubic-bezier(0.22, 0.8, 0.22, 1),
    backdrop-filter 180ms ease,
    -webkit-backdrop-filter 180ms ease !important;
  will-change: opacity, transform, backdrop-filter !important;
}

body.scene-intro-blur-pending:not(.route-variant-a) .app-frame::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 81 !important;
  display: block !important;
  pointer-events: none !important;
  background:
    linear-gradient(100deg, transparent 0 37%, rgba(255, 255, 255, 0.3) 44%, transparent 52%),
    radial-gradient(circle at 50% 50%, transparent 0 48%, rgba(255, 255, 255, 0.18) 69%, transparent 100%) !important;
  mix-blend-mode: soft-light !important;
  opacity: 0.72 !important;
  transition: opacity 180ms ease !important;
}

body.scene-intro-pressing:not(.route-variant-a) .app-frame::before,
body.scene-intro-pressing:not(.route-variant-a) .app-frame::after {
  opacity: 0 !important;
  transform: scale(1) !important;
  backdrop-filter: blur(0) saturate(1) contrast(1) brightness(1) !important;
  -webkit-backdrop-filter: blur(0) saturate(1) contrast(1) brightness(1) !important;
}

body:not(.route-variant-a) .app-frame > #soundToggle {
  position: absolute !important;
  top: max(12px, calc(env(safe-area-inset-top, 0px) + 6px)) !important;
  right: 14px !important;
  z-index: 24 !important;
  margin: 0 !important;
}

body:not(.route-variant-a) #soundToggle {
  all: unset !important;
  position: relative !important;
  display: block !important;
  width: 36px !important;
  height: 36px !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  user-select: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  transform: none !important;
}

body:not(.route-variant-a) #soundToggle[aria-pressed="false"] {
  background: transparent !important;
  opacity: 1 !important;
}

body:not(.route-variant-a) #soundToggle .sound-toggle-icon {
  width: 36px !important;
  height: 36px !important;
}

body:not(.route-variant-a) #soundToggle:not(:disabled):hover,
body:not(.route-variant-a) #soundToggle:focus-visible,
body:not(.route-variant-a) #soundToggle:not(:disabled):active {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  outline: none !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-breeze {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 2 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  transition: opacity 360ms ease-out !important;
  perspective: 1200px !important;
  perspective-origin: 50% 38% !important;
  transform-style: preserve-3d !important;
}

body.scene-intro-active:not(.route-variant-a) #scene-intro .hero-breeze {
  opacity: 1 !important;
}

body:not(.route-variant-a) #scene-intro .hero-drift {
  position: absolute !important;
  left: 0;
  top: 0;
  display: block !important;
  opacity: 0;
  pointer-events: none !important;
  transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
  transform-origin: center center !important;
  backface-visibility: hidden !important;
  will-change: transform, opacity !important;
  animation-name: hero-drift-flight !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-fill-mode: both !important;
  animation-direction: alternate !important;
  filter: blur(var(--drift-blur, 0px)) drop-shadow(0 1px 2px rgba(255, 255, 255, var(--drift-shadow, 0.08)));
}

body:not(.route-variant-a) #scene-intro .hero-drift-dot {
  width: var(--drift-size, 4px) !important;
  height: var(--drift-size, 4px) !important;
  border-radius: 999px !important;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.98) 0 36%, rgba(255, 255, 255, 0.76) 58%, rgba(255, 255, 255, 0) 100%) !important;
}

body:not(.route-variant-a) #scene-intro .hero-drift-back {
  --drift-shadow: 0.03;
}

body:not(.route-variant-a) #scene-intro .hero-drift-mid {
  --drift-shadow: 0.06;
}

body:not(.route-variant-a) #scene-intro .hero-drift-front {
  --drift-shadow: 0.1;
}

body:not(.route-variant-a) #scene-question .scene-panel-question {
  background:
    url("./designer/question/bg.webp")
    center top / cover no-repeat !important;
}

body:not(.route-variant-a) #scene-intro #introEyebrow,
body:not(.route-variant-a) #scene-question .progress-head,
body:not(.route-variant-a) #scene-question .status-badge,
body:not(.route-variant-a) #scene-question #questionMeta,
body:not(.route-variant-a) #scene-question .question-kicker,
body:not(.route-variant-a) #scene-question .question-copy,
body:not(.route-variant-a) #scene-question .question-whisper,
body:not(.route-variant-a) #scene-question .question-visual,
body:not(.route-variant-a) #scene-question .question-scene-title,
body:not(.route-variant-a) #scene-intro .hero-wordmark-art,
body:not(.route-variant-a) #scene-intro .hero-meta,
body:not(.route-variant-a) #scene-intro .hero-lead,
body:not(.route-variant-a) #scene-intro .hero-note {
  display: none !important;
}

body:not(.route-variant-a) #scene-question .progress-head,
body:not(.route-variant-a) #scene-question .progress-head *,
body:not(.route-variant-a) #scene-question .ai-status {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-copy,
body:not(.route-variant-a) #scene-question .scene-panel-question {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
}

body:not(.route-variant-a) #scene-intro .hero-bg-art,
body:not(.route-variant-a) #scene-question .question-scene-art,
body:not(.route-variant-a) #scene-question .question-scene-main {
  display: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-visual {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-loop-video {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  pointer-events: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-header {
  position: absolute !important;
  top: max(14px, env(safe-area-inset-top, 0px) + 8px) !important;
  z-index: 5 !important;
  width: min(calc(100% - 44px), 336px) !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-title-art {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-mark {
  display: block !important;
  position: absolute !important;
  top: 44.8% !important;
  z-index: 5 !important;
  width: min(calc(100% - 96px), 254px) !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  transform: translateY(-50%) !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  filter: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-support {
  position: absolute !important;
  bottom: clamp(188px, 30svh, 270px) !important;
  z-index: 5 !important;
  width: min(calc(100% - 30px), 338px) !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-desc-art {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

body:not(.route-variant-a) #scene-intro .hero-actions {
  position: absolute !important;
  bottom: max(22px, env(safe-area-inset-bottom, 0px) + 14px) !important;
  z-index: 5 !important;
  display: grid !important;
  gap: clamp(9px, 1.5svh, 13px) !important;
  width: min(calc(100% - 42px), 316px) !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  aspect-ratio: 427 / 129 !important;
  padding: 0 22px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 3px !important;
  background:
    url("./designer/main/main-button.png")
    center center / 100% 100% no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta-label {
  display: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta-title,
body:not(.route-variant-a) #scene-intro .hero-cta-meta {
  margin: 0 !important;
  color: #ffffff !important;
  text-align: center !important;
  letter-spacing: -0.04em !important;
  text-shadow: var(--gb-shadow-strong) !important;
  -webkit-text-stroke: var(--gb-outline-mid) #8d76b8 !important;
  paint-order: stroke fill !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta-title {
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.18rem, 4.35vw, 1.58rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta-meta {
  font-family: var(--font-playful), "Hakgyoansim Tteokbokki", sans-serif !important;
  font-size: clamp(0.88rem, 2.95vw, 1rem) !important;
  font-weight: 800 !important;
  line-height: 1.06 !important;
  -webkit-text-stroke: var(--gb-outline-soft) #8d76b8 !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .scene-panel-form {
  min-height: 100dvh !important;
  height: 100dvh !important;
  padding:
    max(12px, env(safe-area-inset-top, 0px) + 8px)
    16px
    max(12px, env(safe-area-inset-bottom, 0px) + 8px) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body:not(.route-variant-a) #scene-form .panel-head {
  width: min(calc(100% - 8px), 336px) !important;
  margin: 0 auto 8px !important;
  text-align: center !important;
  gap: 2px !important;
}

body:not(.route-variant-a) #scene-form .eyebrow {
  color: #6f5aa4 !important;
  letter-spacing: 0 !important;
  font-size: 0.88rem !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.76) !important;
}

body:not(.route-variant-a) #scene-form .panel-title {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  text-align: center !important;
  color: #ffffff !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.54rem, 5vw, 1.92rem) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
  -webkit-text-stroke: var(--gb-outline-strong) #8d76b8 !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-strong) !important;
}

body:not(.route-variant-a) #scene-form .panel-copy {
  color: #6b5a9d !important;
  font-size: 0.9rem !important;
  line-height: 1.34 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

body:not(.route-variant-a) #scene-form .issuance-form {
  width: min(calc(100% - 8px), 336px) !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 10px !important;
  align-content: start !important;
}

body:not(.route-variant-a) #scene-form .oracle-field {
  position: relative !important;
  min-height: 90px !important;
  padding: 14px 18px 16px !important;
  background:
    url("./designer/info/info-frame.png")
    center center / 100% 100% no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body:not(.route-variant-a) #scene-form .oracle-field::before,
body:not(.route-variant-a) #scene-form .oracle-field::after {
  display: none !important;
  content: none !important;
}

body:not(.route-variant-a) #scene-form .field-label,
body:not(.route-variant-a) #scene-form .field-meta {
  color: #6d5ba3 !important;
  -webkit-text-stroke: 0.36px rgba(139, 116, 181, 0.72) !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .field-label {
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
}

body:not(.route-variant-a) #scene-form .field-meta {
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell {
  background: rgba(255, 255, 255, 0.26) !important;
  border: 1px solid rgba(133, 111, 186, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52) !important;
}

body:not(.route-variant-a) #scene-form .stepper-shell {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-prefix,
body:not(.route-variant-a) #scene-form .stepper-unit {
  color: #7a66ad !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell input,
body:not(.route-variant-a) #scene-form .stepper-value {
  color: #5e4e95 !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell input {
  font-size: 1.16rem !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  color: #564689 !important;
  text-shadow: var(--gb-shadow-mid) !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell input::placeholder {
  font-size: 1.12rem !important;
  font-weight: 700 !important;
  color: #7564a8 !important;
  opacity: 0.96 !important;
}

body:not(.route-variant-a) #scene-form .name-seal-button {
  --button-text-offset-rest: 2px;
  --button-text-offset-hover: 1px;
  --button-text-offset-active: 0px;
  min-width: 92px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(248, 244, 255, 0.94), rgba(234, 214, 252, 0.9)) !important;
  border: 2px solid rgba(138, 118, 186, 0.72) !important;
  box-shadow:
    0 5px 0 rgba(142, 124, 181, 0.72),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  color: #745fa5 !important;
}

body:not(.route-variant-a) #scene-form .name-seal-button-kicker,
body:not(.route-variant-a) #scene-form .name-seal-button-label {
  display: block !important;
  color: #745fa5 !important;
  transform: translateY(calc(-1 * var(--button-text-offset-rest))) !important;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1) !important;
  -webkit-text-stroke: 0.34px rgba(141, 118, 184, 0.66) !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .blood-matrix {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

body:not(.route-variant-a) #scene-form .blood-button {
  --button-text-offset-rest: 2px;
  --button-text-offset-hover: 1px;
  --button-text-offset-active: 0px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 0 !important;
  aspect-ratio: 118 / 70 !important;
  padding: 0 0 6px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    url("./designer/info/info-blood-button.png")
    center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  color: #6a5aa0 !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.03em !important;
  -webkit-text-stroke: 0.44px rgba(141, 118, 184, 0.8) !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-mid) !important;
}

body:not(.route-variant-a) #scene-form .blood-button-label,
body:not(.route-variant-a) #scene-form .stepper-button-label {
  display: block !important;
  line-height: 1 !important;
  transform: translateY(calc(-1 * var(--button-text-offset-rest))) !important;
}

body:not(.route-variant-a) #scene-form .blood-button-label {
  transition: none !important;
}

body:not(.route-variant-a) #scene-form .stepper-button-label {
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body:not(.route-variant-a) #scene-form .blood-button:hover,
body:not(.route-variant-a) #scene-form .blood-button:focus-visible,
body:not(.route-variant-a) #scene-form .blood-button.is-selected {
  background:
    url("./designer/info/info-blood-button-active.png")
    center center / 100% 100% no-repeat !important;
  color: #7a629e !important;
  padding-bottom: 2px !important;
  transform: translateY(-1px) !important;
  filter: saturate(1.02) brightness(1.01) !important;
}

body:not(.route-variant-a) #scene-form .chrono-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  margin-top: 8px !important;
}

body:not(.route-variant-a) #scene-form .oracle-field-stepper {
  display: grid !important;
  gap: 10px !important;
  min-height: 0 !important;
}

body:not(.route-variant-a) #scene-form .stepper-shell {
  min-height: 62px !important;
  margin-top: 0 !important;
  align-items: center !important;
}

body:not(.route-variant-a) #scene-form .stepper-value-wrap {
  display: inline-flex !important;
  min-height: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}

body:not(.route-variant-a) #scene-form .stepper-unit {
  display: inline !important;
  font-size: 0.86rem !important;
  line-height: 1 !important;
  transform: translateY(0) !important;
}

body:not(.route-variant-a) #scene-form .stepper-value {
  font-size: 1.42rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-form .stepper-button {
  --button-text-offset-rest: 2px;
  --button-text-offset-hover: 1px;
  --button-text-offset-active: 0px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 47px !important;
  min-height: 47px !important;
  padding: 0 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    url("./designer/info/info-stepper-button.png")
    center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  color: #6a5aa0 !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1.2rem !important;
  font-weight: 900 !important;
  -webkit-text-stroke: 0.42px rgba(141, 118, 184, 0.78) !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) #scene-form .stepper-button:hover,
body:not(.route-variant-a) #scene-form .stepper-button:focus-visible {
  padding-bottom: 3px !important;
  transform: translateY(-1px) !important;
  filter: saturate(1.03) brightness(1.01) !important;
}

body:not(.route-variant-a) #scene-form .form-footer {
  display: grid !important;
  gap: 10px !important;
  padding-top: 2px !important;
}

body:not(.route-variant-a) #scene-form .form-hint {
  color: #6b5a9d !important;
  font-size: 0.78rem !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-form .form-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
}

body:not(.route-variant-a) #scene-form .cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 262 / 83 !important;
  padding: 0 18px 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("./designer/info/info-action-button.png") center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1.34rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.04em !important;
  -webkit-text-stroke: var(--gb-outline-strong) #866eb7 !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-strong) !important;
}

body:not(.route-variant-a) #scene-form .cta:hover,
body:not(.route-variant-a) #scene-form .cta:focus-visible {
  padding-bottom: 6px !important;
  transform: translateY(-1px) !important;
  filter: saturate(1.03) brightness(1.01) !important;
}

body:not(.route-variant-a) .modal-cta {
  --modal-cta-border-y: 18px;
  --modal-cta-border-x: 42px;
  margin-top: 14px !important;
  min-height: 72px !important;
  padding: 0 18px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-style: solid !important;
  border-color: transparent !important;
  border-width: var(--modal-cta-border-y) var(--modal-cta-border-x) !important;
  border-radius: 0 !important;
  background: transparent !important;
  border-image-source: url("./designer/info/info-action-button.png") !important;
  border-image-slice: 24 42 24 42 fill !important;
  border-image-width: var(--modal-cta-border-y) var(--modal-cta-border-x) !important;
  border-image-repeat: stretch !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.04rem, 2.8vw, 1.18rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  letter-spacing: -0.04em !important;
  text-align: center !important;
  -webkit-text-stroke: var(--gb-outline-mid) #8d76b8 !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-mid) !important;
}

body:not(.route-variant-a) .modal-cta:hover,
body:not(.route-variant-a) .modal-cta:focus-visible {
  padding-bottom: 10px !important;
  transform: translateY(-1px) !important;
  filter: saturate(1.03) brightness(1.01) !important;
}

body:not(.route-variant-a) #scene-question .question-card {
  position: absolute !important;
  top: clamp(154px, 23.8svh, 212px) !important;
  left: 50% !important;
  z-index: 4 !important;
  width: min(calc(100% - 36px), 352px) !important;
  aspect-ratio: 498 / 310 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  isolation: isolate !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-question .question-card::before {
  content: attr(data-progress) !important;
  position: absolute !important;
  top: 9.5% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  font-family: var(--font-playful), "Hakgyoansim Tteokbokki", sans-serif !important;
  font-size: clamp(1rem, 2.85vw, 1.18rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  color: #6d59a7 !important;
  -webkit-text-stroke: 0.34px rgba(141, 118, 184, 0.62) !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-soft) !important;
  z-index: 2 !important;
}

body:not(.route-variant-a) #scene-question .question-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background: url("./designer/question/question-frame.png") center center / 100% 100% no-repeat !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body:not(.route-variant-a) #scene-question .question-card.is-loading-state::after {
  animation: question-card-breathe 2.8s ease-in-out infinite !important;
}

body:not(.route-variant-a) #scene-question .question-title {
  position: absolute !important;
  top: 54% !important;
  left: 50% !important;
  z-index: 2 !important;
  width: 82% !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.88rem, 6.25vw, 2.54rem) !important;
  font-weight: 900 !important;
  line-height: 1.34 !important;
  letter-spacing: -0.04em !important;
  color: #ffffff !important;
  text-align: center !important;
  -webkit-text-stroke: 1.76px #8365b3 !important;
  paint-order: stroke fill !important;
  text-shadow: none !important;
}

body:not(.route-variant-a) #scene-question .question-title.is-loading {
  letter-spacing: -0.02em !important;
  -webkit-text-stroke: 1.46px #8365b3 !important;
  text-shadow: none !important;
}

@keyframes question-card-breathe {
  0%,
  100% {
    opacity: 1;
    filter: saturate(1) brightness(1);
  }
  50% {
    opacity: 0.44;
    filter: saturate(0.92) brightness(1.06);
  }
}

body:not(.route-variant-a) #scene-question .answer-stack {
  position: absolute !important;
  left: 50% !important;
  bottom: max(28px, env(safe-area-inset-bottom, 0px) + 20px) !important;
  z-index: 4 !important;
  display: grid !important;
  gap: clamp(10px, 1.5svh, 14px) !important;
  width: min(calc(100% - 36px), 352px) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
}

body:not(.route-variant-a) #scene-question .answer-button {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  aspect-ratio: 496 / 101 !important;
  padding: 0 28px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  background: url("./designer/question/question-button.png") center center / 100% 100% no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-question .answer-button::before,
body:not(.route-variant-a) #scene-question .answer-button::after,
body:not(.route-variant-a) #scene-question .answer-button-mark {
  display: none !important;
}

body:not(.route-variant-a) #scene-question .answer-button-text {
  max-width: 82% !important;
  margin: 0 auto !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.06rem, 3.55vw, 1.24rem) !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.04em !important;
  color: #ffffff !important;
  text-align: center !important;
  -webkit-text-stroke: var(--gb-outline-mid) #9177ba !important;
  paint-order: stroke fill !important;
  text-shadow: var(--gb-shadow-mid) !important;
}

body:not(.route-variant-a) #scene-question .answer-button:hover,
body:not(.route-variant-a) #scene-question .answer-button:focus-visible,
body:not(.route-variant-a) #scene-question .answer-button.is-active,
body:not(.route-variant-a) #scene-intro .hero-cta:hover,
body:not(.route-variant-a) #scene-intro .hero-cta:focus-visible {
  transform: translateY(-1px) !important;
  filter: brightness(1.02) saturate(1.03) !important;
}

body:not(.route-variant-a) #scene-question .answer-button:active,
body:not(.route-variant-a) #scene-intro .hero-cta:active,
body:not(.route-variant-a) #scene-form .blood-button:active,
body:not(.route-variant-a) #scene-form .stepper-button:active,
body:not(.route-variant-a) #scene-form .name-seal-button:active,
body:not(.route-variant-a) #scene-form .cta:active {
  transform: translateY(1px) scale(0.992) !important;
  filter: brightness(0.985) saturate(0.98) !important;
}

body:not(.route-variant-a) #scene-form .blood-button:active {
  padding-bottom: 1px !important;
}

body:not(.route-variant-a) #scene-form .stepper-button:active {
  padding-bottom: 2px !important;
}

body:not(.route-variant-a) #scene-form .cta:active {
  padding-bottom: 5px !important;
}

body:not(.route-variant-a) .modal-cta:active {
  padding-bottom: 9px !important;
}

body:not(.route-variant-a) #scene-form .name-seal-button:hover .name-seal-button-kicker,
body:not(.route-variant-a) #scene-form .name-seal-button:hover .name-seal-button-label,
body:not(.route-variant-a) #scene-form .name-seal-button:focus-visible .name-seal-button-kicker,
body:not(.route-variant-a) #scene-form .name-seal-button:focus-visible .name-seal-button-label {
  transform: translateY(calc(-1 * var(--button-text-offset-hover))) !important;
}

body:not(.route-variant-a) #scene-form .blood-button:hover .blood-button-label,
body:not(.route-variant-a) #scene-form .blood-button:focus-visible .blood-button-label,
body:not(.route-variant-a) #scene-form .blood-button.is-selected .blood-button-label {
  transform: translateY(2px) !important;
}

body:not(.route-variant-a) #scene-form .stepper-button:hover .stepper-button-label,
body:not(.route-variant-a) #scene-form .stepper-button:focus-visible .stepper-button-label {
  transform: translateY(-2.5px) !important;
}

body:not(.route-variant-a) #scene-form .name-seal-button:active .name-seal-button-kicker,
body:not(.route-variant-a) #scene-form .name-seal-button:active .name-seal-button-label {
  transform: translateY(calc(-1 * var(--button-text-offset-active))) !important;
}

body:not(.route-variant-a) #scene-form .blood-button:active .blood-button-label,
body:not(.route-variant-a) #scene-form .stepper-button:active .stepper-button-label {
  transform: translateY(calc(-1 * var(--button-text-offset-active))) !important;
}

body:not(.route-variant-a) #scene-form .blood-button:active .blood-button-label {
  transform: translateY(3px) !important;
}

body:not(.route-variant-a) .panel-copy,
body:not(.route-variant-a) .field-label,
body:not(.route-variant-a) .field-meta,
body:not(.route-variant-a) .form-hint,
body:not(.route-variant-a) .loading-step,
body:not(.route-variant-a) .result-summary,
body:not(.route-variant-a) .result-job,
body:not(.route-variant-a) .result-chip,
body:not(.route-variant-a) .reason-list li,
body:not(.route-variant-a) .archive-card-title,
body:not(.route-variant-a) .archive-card-sub {
  color: #5f4f98 !important;
  text-shadow: var(--gb-shadow-soft) !important;
}

body:not(.route-variant-a) .panel-title,
body:not(.route-variant-a) .loading-step,
body:not(.route-variant-a) .result-summary,
body:not(.route-variant-a) .result-job,
body:not(.route-variant-a) .archive-card-title {
  color: #5f4f98 !important;
  text-shadow: var(--gb-shadow-mid) !important;
}

body:not(.route-variant-a) .oracle-field,
body:not(.route-variant-a) .question-card,
body:not(.route-variant-a) .answer-button,
body:not(.route-variant-a) .loading-step,
body:not(.route-variant-a) .result-card,
body:not(.route-variant-a) .archive-card,
body:not(.route-variant-a) .modal-panel {
  box-shadow: none !important;
  border-color: rgba(141, 119, 186, 0.26) !important;
}

@media (max-width: 767px) {
  body:not(.route-variant-a) .app-frame {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}

@media (max-width: 390px) {
  body:not(.route-variant-a) #scene-intro .hero-header {
    width: min(calc(100% - 30px), 318px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-logo-mark {
    top: 42.6% !important;
    width: min(calc(100% - 108px), 252px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-support {
    bottom: clamp(176px, 29svh, 232px) !important;
    width: min(calc(100% - 24px), 320px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-actions {
    bottom: max(18px, env(safe-area-inset-bottom, 0px) + 10px) !important;
    width: min(calc(100% - 48px), 286px) !important;
    gap: 10px !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-cta-title {
    font-size: clamp(1.24rem, 4.85vw, 1.56rem) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-cta-meta {
    font-size: clamp(0.84rem, 3vw, 0.94rem) !important;
  }

  body:not(.route-variant-a) #scene-form .panel-head,
  body:not(.route-variant-a) #scene-form .issuance-form {
    width: min(calc(100% - 2px), 324px) !important;
  }

  body:not(.route-variant-a) #scene-form .oracle-field {
    padding: 12px 16px 14px !important;
  }

  body:not(.route-variant-a) #scene-form .blood-matrix {
    gap: 8px !important;
  }

  body:not(.route-variant-a) #scene-form .form-actions {
    gap: 10px !important;
  }

  body:not(.route-variant-a) #scene-form .cta {
    font-size: 0.98rem !important;
  }

  body:not(.route-variant-a) #scene-question .question-card {
    top: clamp(136px, 21.2svh, 176px) !important;
    width: min(calc(100% - 28px), 332px) !important;
  }

  body:not(.route-variant-a) #scene-question .question-title {
    width: 80% !important;
    font-size: clamp(1.47rem, 5.12vw, 1.86rem) !important;
    line-height: 1.32 !important;
  }

  body:not(.route-variant-a) #scene-question .answer-stack {
    bottom: max(22px, env(safe-area-inset-bottom, 0px) + 14px) !important;
    width: min(calc(100% - 28px), 332px) !important;
    gap: 10px !important;
  }

  body:not(.route-variant-a) #scene-question .answer-button-text {
    font-size: clamp(0.98rem, 3.4vw, 1.1rem) !important;
    line-height: 1.16 !important;
  }
}

@media (max-width: 390px) and (max-height: 700px) {
  body:not(.route-variant-a) #scene-intro .scene-panel-hero::before,
  body:not(.route-variant-a) #scene-question .scene-panel-question::before {
    top: max(8px, env(safe-area-inset-top, 0px)) !important;
    right: 8px !important;
    font-size: 0.78rem !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-logo-mark {
    top: 43.4% !important;
    width: min(calc(100% - 98px), 198px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-support {
    bottom: clamp(170px, 29.5svh, 216px) !important;
    width: min(calc(100% - 18px), 266px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-actions {
    bottom: max(14px, env(safe-area-inset-bottom, 0px) + 8px) !important;
    width: min(calc(100% - 18px), 272px) !important;
  }

  body:not(.route-variant-a) #scene-question .question-card {
    top: clamp(118px, 19svh, 152px) !important;
    width: min(calc(100% - 24px), 314px) !important;
  }

  body:not(.route-variant-a) #scene-question .answer-stack {
    bottom: max(18px, env(safe-area-inset-bottom, 0px) + 12px) !important;
    width: min(calc(100% - 24px), 314px) !important;
  }
}

body:not(.route-variant-a) #scene-intro .hero-copy {
  --hero-header-top: max(14px, env(safe-area-inset-top, 0px) + 8px);
  --hero-actions-bottom: max(22px, env(safe-area-inset-bottom, 0px) + 14px);
  --hero-support-bottom: clamp(188px, 30svh, 270px);
  --hero-middle-top: 196px;
  --hero-middle-bottom: 452px;
  --hero-logo-center-y: 324px;
  --hero-logo-max-height: 220px;
  position: relative !important;
  width: 100% !important;
  min-height: 100% !important;
  overflow: hidden !important;
}

body:not(.route-variant-a) #scene-intro .hero-header {
  top: var(--hero-header-top) !important;
}

body:not(.route-variant-a) #scene-intro .hero-visual {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-mark {
  top: var(--hero-logo-center-y) !important;
  max-height: var(--hero-logo-max-height) !important;
  display: grid !important;
  place-items: center !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-image {
  width: auto !important;
  max-width: 100% !important;
  max-height: var(--hero-logo-max-height) !important;
  height: auto !important;
}

body:not(.route-variant-a) #scene-intro .hero-support {
  bottom: var(--hero-support-bottom) !important;
}

body:not(.route-variant-a) #scene-intro .hero-actions {
  bottom: var(--hero-actions-bottom) !important;
}

@keyframes hero-drift-flight {
  0% {
    transform: translate3d(0, 0, var(--drift-z-start)) rotate(var(--drift-rotate-start)) scale(var(--drift-scale-start));
    opacity: calc(var(--drift-opacity) * 0.88);
  }
  18% {
    opacity: var(--drift-opacity);
  }
  22% {
    transform: translate3d(calc(var(--drift-x1) * 0.78), calc(var(--drift-y1) * 0.78), calc(var(--drift-z-mid) * 0.82)) rotate(calc(var(--drift-rotate-start) * 0.62 + var(--drift-rotate-mid) * 0.38)) scale(calc(var(--drift-scale-start) + 0.02));
    opacity: var(--drift-opacity);
  }
  48% {
    transform: translate3d(var(--drift-x2), var(--drift-y2), var(--drift-z-mid)) rotate(var(--drift-rotate-mid)) scale(calc(var(--drift-scale-start) + 0.05));
    opacity: var(--drift-opacity);
  }
  74% {
    transform: translate3d(var(--drift-x3), var(--drift-y3), calc(var(--drift-z-mid) * 0.72)) rotate(calc(var(--drift-rotate-mid) * 0.5 + var(--drift-rotate-end) * 0.5)) scale(calc(var(--drift-scale-start) + 0.03));
    opacity: var(--drift-opacity);
  }
  100% {
    transform: translate3d(var(--drift-x4), var(--drift-y4), var(--drift-z-end)) rotate(var(--drift-rotate-end)) scale(var(--drift-scale-end));
    opacity: calc(var(--drift-opacity) * 0.84);
  }
}

body:not(.route-variant-a) #scene-intro .hero-drift-loose {
  animation-name: hero-drift-loose-flight !important;
}

@keyframes hero-drift-loose-flight {
  0% {
    transform: translate3d(0, 0, var(--drift-z-start)) rotate(var(--drift-rotate-start)) scale(var(--drift-scale-start));
    opacity: calc(var(--drift-opacity) * 0.82);
  }
  18% {
    opacity: calc(var(--drift-opacity) * 0.92);
  }
  42% {
    transform: translate3d(calc(var(--drift-x1) * 0.92), calc(var(--drift-y1) * 0.92), calc(var(--drift-z-mid) * 0.78)) rotate(calc(var(--drift-rotate-mid) * 0.7)) scale(calc(var(--drift-scale-start) + 0.02));
    opacity: calc(var(--drift-opacity) * 0.92);
  }
  76% {
    transform: translate3d(calc(var(--drift-x3) * 0.88), calc(var(--drift-y3) * 0.88), calc(var(--drift-z-mid) * 0.56)) rotate(calc(var(--drift-rotate-end) * 0.8)) scale(calc(var(--drift-scale-start) + 0.03));
    opacity: calc(var(--drift-opacity) * 0.88);
  }
  100% {
    transform: translate3d(var(--drift-x4), var(--drift-y4), var(--drift-z-end)) rotate(var(--drift-rotate-end)) scale(var(--drift-scale-end));
    opacity: calc(var(--drift-opacity) * 0.8);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.route-variant-a) #scene-intro .hero-breeze {
    display: none !important;
  }
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
) {
  cursor: pointer !important;
  outline: none !important;
  transition:
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
    filter 180ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 140ms ease !important;
  will-change: transform, filter !important;
  backface-visibility: hidden !important;
  transform-origin: center center !important;
  -webkit-tap-highlight-color: transparent !important;
  touch-action: manipulation !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button
) {
  filter: drop-shadow(0 4px 10px rgba(113, 92, 166, 0.08)) !important;
}

body:not(.route-variant-a) :where(.archive-card, .rail-ghost, #soundToggle, .modal-close, [data-close]) {
  filter: drop-shadow(0 2px 6px rgba(113, 92, 166, 0.05)) !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
):not(:disabled):hover,
body:not(.route-variant-a) :is(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
):focus-visible {
  transform: translateY(-1px) !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button
):not(:disabled):hover,
body:not(.route-variant-a) :is(
  .hero-cta,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button
):focus-visible {
  filter: brightness(1.015) saturate(1.02) drop-shadow(0 8px 16px rgba(113, 92, 166, 0.11)) !important;
}

body:not(.route-variant-a) :where(.archive-card, .rail-ghost, #soundToggle, .modal-close, [data-close]):not(:disabled):hover,
body:not(.route-variant-a) :where(.archive-card, .rail-ghost, #soundToggle, .modal-close, [data-close]):focus-visible {
  filter: brightness(1.012) saturate(1.015) drop-shadow(0 5px 10px rgba(113, 92, 166, 0.08)) !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
):not(:disabled):active {
  transform: translateY(0) scale(0.992) !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button
):not(:disabled):active {
  filter: brightness(0.992) saturate(0.99) drop-shadow(0 2px 6px rgba(113, 92, 166, 0.08)) !important;
}

body:not(.route-variant-a) :where(.archive-card, .rail-ghost, #soundToggle, .modal-close, [data-close]):not(:disabled):active {
  filter: brightness(0.994) saturate(0.992) drop-shadow(0 1px 4px rgba(113, 92, 166, 0.06)) !important;
}

body:not(.route-variant-a) .blood-button.is-selected,
body:not(.route-variant-a) .name-seal-button.is-confirmed,
body:not(.route-variant-a) .archive-card.is-selected,
body:not(.route-variant-a) #scene-question .answer-button.is-active {
  filter: brightness(1.018) saturate(1.02) drop-shadow(0 7px 14px rgba(113, 92, 166, 0.1)) !important;
}

body:not(.route-variant-a) .ambient-pointer-burst {
  position: fixed !important;
  left: 0;
  top: 0;
  width: 28px !important;
  height: 28px !important;
  margin: -14px 0 0 -14px !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  z-index: 120 !important;
  border: 2px solid rgba(255, 255, 255, 0.98) !important;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.54) 0%, rgba(255, 255, 255, 0.22) 42%, rgba(255, 255, 255, 0) 72%) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.28),
    0 0 30px rgba(255, 255, 255, 0.34) !important;
  transform: translate3d(0, 0, 0) scale(0.18);
  opacity: 0;
  animation: ambient-pointer-burst 720ms cubic-bezier(0.16, 0.84, 0.24, 1) forwards !important;
}

body:not(.route-variant-a) .ambient-pointer-burst::before,
body:not(.route-variant-a) .ambient-pointer-burst::after {
  content: "" !important;
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  border-radius: 999px !important;
  pointer-events: none !important;
}

body:not(.route-variant-a) .ambient-pointer-burst::before {
  width: 72px !important;
  height: 72px !important;
  margin: -36px 0 0 -36px !important;
  border: 1.5px solid rgba(255, 255, 255, 0.58) !important;
  opacity: 0.9;
  animation: ambient-pointer-ring 720ms cubic-bezier(0.14, 0.72, 0.26, 1) forwards !important;
}

body:not(.route-variant-a) .ambient-pointer-burst::after {
  width: 12px !important;
  height: 12px !important;
  margin: -6px 0 0 -6px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.38) !important;
  animation: ambient-pointer-core 720ms ease-out forwards !important;
}

@keyframes ambient-pointer-burst {
  0% {
    opacity: 0.92;
    transform: translate3d(0, 0, 0) scale(0.18);
  }
  42% {
    opacity: 0.78;
    transform: translate3d(0, 0, 0) scale(1.2);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(2.1);
  }
}

@keyframes ambient-pointer-ring {
  0% {
    opacity: 0.82;
    transform: scale(0.22);
  }
  100% {
    opacity: 0;
    transform: scale(1.72);
  }
}

@keyframes ambient-pointer-core {
  0% {
    opacity: 0.96;
    transform: scale(0.8);
  }
  52% {
    opacity: 0.7;
    transform: scale(1.1);
  }
  100% {
    opacity: 0;
    transform: scale(0.12);
  }
}

body:not(.route-variant-a) {
  --qa-outline: #847198 !important;
  --qa-frame-fill: #add3ff !important;
  --qa-button-fill: #c8fcfe !important;
  --qa-button-bottom: #92bcbd !important;
}

body:not(.route-variant-a) #scene-intro .scene-panel-hero::before,
body:not(.route-variant-a) #scene-question .scene-panel-question::before,
body:not(.route-variant-a) #introEyebrow,
body:not(.route-variant-a) .status-badge {
  display: none !important;
  content: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-header {
  top: max(16px, env(safe-area-inset-top, 0px) + 10px) !important;
  width: min(calc(100% - 40px), 340px) !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-mark {
  top: 43.2% !important;
  width: min(calc(100% - 94px), 252px) !important;
}

body:not(.route-variant-a) #scene-intro .hero-support {
  bottom: clamp(192px, 29svh, 252px) !important;
  width: min(calc(100% - 32px), 344px) !important;
}

body:not(.route-variant-a) #scene-intro .hero-actions {
  bottom: max(22px, env(safe-area-inset-bottom, 0px) + 14px) !important;
  width: min(calc(100% - 44px), 314px) !important;
  gap: 11px !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta,
body:not(.route-variant-a) #scene-question .answer-button,
body:not(.route-variant-a) .modal-cta {
  box-shadow: none !important;
  outline: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-cta:hover,
body:not(.route-variant-a) #scene-intro .hero-cta:focus-visible,
body:not(.route-variant-a) #scene-question .answer-button:hover,
body:not(.route-variant-a) #scene-question .answer-button:focus-visible,
body:not(.route-variant-a) .modal-cta:hover,
body:not(.route-variant-a) .modal-cta:focus-visible {
  box-shadow: none !important;
  outline: none !important;
}

body:not(.route-variant-a) #scene-form .panel-copy,
body:not(.route-variant-a) #scene-question .question-card::before,
body:not(.route-variant-a) #scene-question .question-title,
body:not(.route-variant-a) #scene-question .answer-button-text,
body:not(.route-variant-a) #scene-result .detail-label,
body:not(.route-variant-a) #scene-result .result-title,
body:not(.route-variant-a) #scene-result .result-summary,
body:not(.route-variant-a) #scene-result .result-job,
body:not(.route-variant-a) #scene-form .cta {
  -webkit-text-stroke-color: var(--qa-outline) !important;
}

body:not(.route-variant-a) #scene-question .question-card {
  top: clamp(150px, 23.2svh, 208px) !important;
}

body:not(.route-variant-a) #scene-question .question-card::before {
  top: 10.8% !important;
  font-size: clamp(1.02rem, 2.95vw, 1.16rem) !important;
  color: var(--qa-outline) !important;
}

body:not(.route-variant-a) #scene-question .question-title {
  top: 55.4% !important;
  width: 81.5% !important;
  font-size: clamp(1.48rem, 4.85vw, 1.98rem) !important;
  line-height: 1.32 !important;
  color: #ffffff !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.38),
    0 2px 0 rgba(132, 113, 152, 0.38),
    0 4px 8px rgba(132, 113, 152, 0.22) !important;
}

body:not(.route-variant-a) #scene-question .answer-button-text {
  font-size: clamp(1.12rem, 3.7vw, 1.28rem) !important;
  line-height: 1.18 !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.34),
    0 2px 0 rgba(132, 113, 152, 0.34),
    0 4px 8px rgba(132, 113, 152, 0.2) !important;
}

body:not(.route-variant-a) .scene-panel-result,
body.scene-result-active:not(.route-variant-a) .scene-panel-result {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  align-content: start !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  padding-bottom: max(32px, env(safe-area-inset-bottom, 0px) + 24px) !important;
}

body:not(.route-variant-a) .scene-panel-result::-webkit-scrollbar,
body.scene-result-active:not(.route-variant-a) .scene-panel-result::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) {
  overflow-y: auto !important;
}

body:not(.route-variant-a) #resultOrbHero,
body:not(.route-variant-a) #openArchive,
body:not(.route-variant-a) #archiveModal {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-title {
  font-size: clamp(1.72rem, 5.2vw, 2.18rem) !important;
  line-height: 1.12 !important;
}

body:not(.route-variant-a) #scene-result .result-job {
  display: inline-flex !important;
  align-self: flex-start !important;
  margin: 8px 0 0 !important;
  padding: 5px 12px 6px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.58) !important;
  border: 1px solid rgba(132, 113, 152, 0.24) !important;
}

body:not(.route-variant-a) #scene-result .future-slot {
  margin-bottom: max(18px, env(safe-area-inset-bottom, 0px) + 8px) !important;
}

body:not(.route-variant-a) :is(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
) {
  outline: none !important;
}

body:not(.route-variant-a) :where(
  .hero-cta,
  .rail-ghost,
  .blood-button,
  .stepper-button,
  .name-seal-button,
  #scene-form .cta,
  .modal-cta,
  #scene-question .answer-button,
  .archive-card,
  #soundToggle,
  .modal-close,
  [data-close]
):focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-question .question-card::before {
  top: 10.2% !important;
  font-size: clamp(1.04rem, 3vw, 1.2rem) !important;
  -webkit-text-stroke: 0.72px rgba(132, 113, 152, 0.82) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45) !important;
}

body:not(.route-variant-a) #scene-question .question-title {
  top: 54.8% !important;
  width: 82.4% !important;
  font-size: clamp(1.88rem, 6.25vw, 2.54rem) !important;
  -webkit-text-stroke: 1.76px #8365b3 !important;
  text-shadow: none !important;
}

body:not(.route-variant-a) #scene-question .answer-stack {
  bottom: max(26px, env(safe-area-inset-bottom, 0px) + 18px) !important;
}

body:not(.route-variant-a) #scene-question .answer-button-text {
  -webkit-text-stroke-width: 0.96px !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.44),
    0 2px 0 rgba(132, 113, 152, 0.24) !important;
}

body:not(.route-variant-a) #scene-result .result-card,
body:not(.route-variant-a) #scene-result .result-reasons,
body:not(.route-variant-a) #scene-result .result-deep-dive,
body:not(.route-variant-a) #scene-result .future-slot {
  position: relative !important;
  height: max-content !important;
  min-height: max-content !important;
  align-self: start !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-result .result-card {
  padding: 20px 20px 24px !important;
}

body:not(.route-variant-a) #scene-result :is(
  .result-card,
  .result-reasons,
  .result-deep-dive,
  .future-slot
)::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
  border-style: solid !important;
  border-color: transparent !important;
  border-width: 32px 36px !important;
  border-image-source: url("./designer/result/frame.png") !important;
  border-image-slice: 40 fill !important;
  border-image-width: 32px 36px !important;
  border-image-repeat: stretch !important;
}

body:not(.route-variant-a) #scene-result :is(
  .result-card,
  .result-reasons,
  .result-deep-dive,
  .future-slot
) > * {
  position: relative !important;
  z-index: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-aurora,
body:not(.route-variant-a) #scene-result .result-constellation,
body:not(.route-variant-a) #scene-result .result-card::after {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-title {
  font-size: clamp(1.62rem, 5.05vw, 2rem) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.045em !important;
  -webkit-text-stroke-width: 1.02px !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.44),
    0 2px 0 rgba(132, 113, 152, 0.2) !important;
}

body:not(.route-variant-a) #scene-result .result-summary,
body:not(.route-variant-a) #scene-result .result-job,
body:not(.route-variant-a) #scene-result .result-panel-copy,
body:not(.route-variant-a) #scene-result .result-keyword-copy,
body:not(.route-variant-a) #scene-result .result-detail-copy,
body:not(.route-variant-a) #scene-result .result-axis-copy,
body:not(.route-variant-a) #scene-result .future-slot p {
  color: #5d4c95 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 16px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  display: grid !important;
  gap: 4px !important;
  min-height: 86px !important;
  padding: 12px 12px 13px !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.46) !important;
  border: 1px solid rgba(132, 113, 152, 0.22) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-kicker,
body:not(.route-variant-a) #scene-result .result-detail-label,
body:not(.route-variant-a) #scene-result .result-axis-label,
body:not(.route-variant-a) #scene-result .result-radar-label {
  font-size: 0.7rem !important;
  letter-spacing: 0.02em !important;
  color: rgba(93, 76, 149, 0.72) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-title,
body:not(.route-variant-a) #scene-result .result-detail-title,
body:not(.route-variant-a) #scene-result .result-axis-active {
  color: #ffffff !important;
  font-size: 1rem !important;
  line-height: 1.14 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-copy,
body:not(.route-variant-a) #scene-result .result-detail-copy,
body:not(.route-variant-a) #scene-result .result-axis-copy,
body:not(.route-variant-a) #scene-result .result-panel-copy {
  margin: 0 !important;
  font-size: 0.84rem !important;
  line-height: 1.34 !important;
}

body:not(.route-variant-a) #scene-result .result-reasons {
  display: grid !important;
  gap: 14px !important;
  padding-top: 22px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel,
body:not(.route-variant-a) #scene-result .result-detail-card,
body:not(.route-variant-a) #scene-result .result-axis-row {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(132, 113, 152, 0.22) !important;
  border-radius: 18px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  padding: 14px 14px 16px !important;
}

body:not(.route-variant-a) #scene-result .result-panel-headline {
  display: grid !important;
  gap: 4px !important;
  margin-bottom: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-shell {
  display: grid !important;
  gap: 14px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-chart {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
}

body:not(.route-variant-a) #scene-result .result-radar-chart svg {
  width: min(100%, 274px) !important;
  height: auto !important;
  overflow: visible !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring,
body:not(.route-variant-a) #scene-result .result-radar-spoke {
  fill: none !important;
  stroke: rgba(132, 113, 152, 0.16) !important;
  stroke-width: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-area {
  stroke: none !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline {
  fill: none !important;
  stroke: rgba(132, 113, 152, 0.78) !important;
  stroke-width: 2.2 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point {
  fill: #ffffff !important;
  stroke: rgba(132, 113, 152, 0.86) !important;
  stroke-width: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend,
body:not(.route-variant-a) #scene-result .result-detail-grid,
body:not(.route-variant-a) #scene-result .result-axis-stack {
  display: grid !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric {
  display: grid !important;
  justify-items: center !important;
  gap: 2px !important;
  padding: 8px 4px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.58) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-value {
  color: #ffffff !important;
  font-size: 1.02rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 5px !important;
  width: 100% !important;
  padding: 14px 14px !important;
  min-height: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-deep-dive {
  display: grid !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row {
  display: grid !important;
  gap: 8px !important;
  padding: 12px 14px 14px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-head,
body:not(.route-variant-a) #scene-result .result-axis-scale {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-end {
  width: 74px !important;
  font-size: 0.72rem !important;
  line-height: 1.15 !important;
  color: rgba(93, 76, 149, 0.68) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-end:last-child {
  text-align: right !important;
}

body:not(.route-variant-a) #scene-result .result-axis-track {
  position: relative !important;
  flex: 1 !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.55), rgba(214, 188, 236, 0.84)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-dot {
  position: absolute !important;
  top: 50% !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 3px solid rgba(132, 113, 152, 0.92) !important;
  transform: translate(-50%, -50%) !important;
}

body:not(.route-variant-a) #scene-result .result-reasons .section-head {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: start !important;
  width: calc(100% - 2px) !important;
  margin: 0 auto !important;
}

body:not(.route-variant-a) #scene-result .result-actions .cta {
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 269 / 129 !important;
  height: auto !important;
  padding: 0 10px 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    url("./designer/result/result-button-short.png")
    center center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  color: #ffffff !important;
  text-align: center !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: clamp(1.18rem, 4.35vw, 1.58rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  letter-spacing: -0.04em !important;
  white-space: nowrap !important;
  -webkit-text-stroke-width: 3.12px !important;
  -webkit-text-stroke-color: #8365b3 !important;
  text-shadow: none !important;
  paint-order: stroke fill !important;
}

body:not(.route-variant-a) #scene-result .result-actions .cta::before {
  content: none !important;
}

body:not(.route-variant-a) #scene-result .result-actions .cta::after {
  content: none !important;
}

@media (max-width: 420px) {
  body:not(.route-variant-a) #scene-result .result-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body:not(.route-variant-a) #scene-result .result-radar-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Final intro viewport sizing */
body:not(.route-variant-a) .site-shell,
body:not(.route-variant-a) .app-frame,
body:not(.route-variant-a) #scene-intro,
body:not(.route-variant-a) #scene-intro.scene-active,
body:not(.route-variant-a) #scene-intro .scene-panel-hero {
  min-height: 100dvh !important;
  height: 100dvh !important;
}

body:not(.route-variant-a) #scene-intro .scene-panel-hero {
  padding: 0 !important;
}

body:not(.route-variant-a) #scene-intro .hero-copy {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto !important;
  align-items: start !important;
  row-gap: clamp(10px, 1.8svh, 16px) !important;
  min-height: 100% !important;
  height: 100% !important;
  padding:
    max(14px, env(safe-area-inset-top, 0px) + 8px)
    0
    max(18px, env(safe-area-inset-bottom, 0px) + 12px) !important;
}

body:not(.route-variant-a) #scene-intro .hero-visual {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  display: block !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body:not(.route-variant-a) #scene-intro .hero-loop-video,
body:not(.route-variant-a) #scene-intro .hero-bg-art {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

body:not(.route-variant-a) #scene-intro .hero-header,
body:not(.route-variant-a) #scene-intro .hero-logo-mark,
body:not(.route-variant-a) #scene-intro .hero-support,
body:not(.route-variant-a) #scene-intro .hero-actions {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 auto !important;
  z-index: 5 !important;
}

body:not(.route-variant-a) #scene-intro .hero-header {
  width: min(calc(100% - 40px), 336px) !important;
  justify-items: center !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-mark {
  align-self: center !important;
  place-self: center !important;
  width: min(calc(100% - 88px), 252px) !important;
  max-height: min(33dvh, 252px) !important;
  display: grid !important;
  place-items: center !important;
}

body:not(.route-variant-a) #scene-intro .hero-logo-image {
  width: auto !important;
  max-width: 100% !important;
  max-height: min(33dvh, 252px) !important;
  height: auto !important;
}

body:not(.route-variant-a) #scene-intro .hero-support {
  align-self: end !important;
  width: min(calc(100% - 28px), 330px) !important;
  margin-bottom: clamp(4px, 1svh, 10px) !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-intro .hero-desc-art {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

body:not(.route-variant-a) #scene-intro .hero-actions {
  align-self: end !important;
  width: min(calc(100% - 48px), 304px) !important;
  gap: 11px !important;
}

@media (max-width: 390px) {
  body:not(.route-variant-a) #scene-intro .hero-header {
    width: min(calc(100% - 28px), 318px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-logo-mark {
    width: min(calc(100% - 104px), 228px) !important;
    max-height: min(29dvh, 212px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-logo-image {
    max-height: min(29dvh, 212px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-support {
    width: min(calc(100% - 20px), 312px) !important;
  }

  body:not(.route-variant-a) #scene-intro .hero-actions {
    width: min(calc(100% - 36px), 286px) !important;
  }
}

body:not(.route-variant-a) .toast {
  top: 50% !important;
  bottom: auto !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

body:not(.route-variant-a) :is(
  #scene-intro .hero-cta-title,
  #scene-intro .hero-cta-meta,
  #scene-form .eyebrow,
  #scene-form .panel-title,
  #scene-form .panel-copy,
  #scene-form .field-label,
  #scene-form .field-meta,
  #scene-form .oracle-input-prefix,
  #scene-form .oracle-input-shell input,
  #scene-form .oracle-input-shell input::placeholder,
  #scene-form .stepper-unit,
  #scene-form .stepper-value,
  #scene-form .blood-button,
  #scene-form .blood-button-label,
  #scene-form .stepper-button,
  #scene-form .stepper-button-label,
  #scene-form .form-hint,
  #scene-form .cta,
  .modal-cta,
  #scene-question .question-card::before,
  #scene-question .question-title,
  #scene-question .answer-button-text,
  #scene-result #resultEyebrow,
  #scene-result .result-code,
  #scene-result .result-type,
  #scene-result .result-title,
  #scene-result .result-summary,
  #scene-result .result-job,
  #scene-result .result-keyword-kicker,
  #scene-result .result-keyword-title,
  #scene-result .result-keyword-copy,
  #scene-result .result-panel-copy,
  #scene-result .result-radar-label,
  #scene-result .result-radar-value,
  #scene-result .result-detail-label,
  #scene-result .result-detail-title,
  #scene-result .result-detail-copy,
  #scene-result .result-axis-label,
  #scene-result .result-axis-active,
  #scene-result .result-axis-end,
  #scene-result .result-axis-copy,
  #scene-result .detail-label,
  #scene-result .detail-block p,
  #scene-result .reason-list li,
  #scene-result .future-label,
  #scene-result .future-slot p,
  #scene-result .result-actions .cta,
  .video-status
) {
  text-shadow: none !important;
  -webkit-text-stroke-color: var(--gb-outline-color) !important;
  paint-order: stroke fill !important;
}

body:not(.route-variant-a) :is(
  #scene-intro .hero-cta-title,
  #scene-intro .hero-cta-meta,
  #scene-form .eyebrow,
  #scene-form .panel-title,
  #scene-form .panel-copy,
  #scene-form .field-label,
  #scene-form .field-meta,
  #scene-form .oracle-input-prefix,
  #scene-form .oracle-input-shell input,
  #scene-form .oracle-input-shell input::placeholder,
  #scene-form .stepper-unit,
  #scene-form .stepper-value,
  #scene-form .blood-button,
  #scene-form .blood-button-label,
  #scene-form .stepper-button,
  #scene-form .stepper-button-label,
  #scene-form .form-hint,
  #scene-form .cta,
  .modal-cta,
  #scene-question .question-card::before,
  #scene-question .question-title,
  #scene-question .answer-button-text,
  #scene-result #resultEyebrow,
  #scene-result .result-code,
  #scene-result .result-type,
  #scene-result .result-title,
  #scene-result .result-summary,
  #scene-result .result-job,
  #scene-result .result-keyword-kicker,
  #scene-result .result-keyword-title,
  #scene-result .result-keyword-copy,
  #scene-result .result-panel-copy,
  #scene-result .result-radar-label,
  #scene-result .result-radar-value,
  #scene-result .result-detail-label,
  #scene-result .result-detail-title,
  #scene-result .result-detail-copy,
  #scene-result .result-axis-label,
  #scene-result .result-axis-active,
  #scene-result .result-axis-end,
  #scene-result .result-axis-copy,
  #scene-result .detail-label,
  #scene-result .detail-block p,
  #scene-result .reason-list li,
  #scene-result .future-label,
  #scene-result .future-slot p,
  #scene-result .result-actions .cta
) {
  -webkit-text-stroke-width: var(--gb-outline-unified) !important;
}

body:not(.route-variant-a) #scene-result :is(
  #resultEyebrow,
  .result-code,
  .result-type,
  .result-title,
  .result-summary,
  .result-job,
  .result-keyword-kicker,
  .result-keyword-title,
  .result-keyword-copy,
  .result-panel-copy,
  .result-radar-label,
  .result-radar-value,
  .result-detail-label,
  .result-detail-title,
  .result-detail-copy,
  .result-axis-label,
  .result-axis-active,
  .result-axis-end,
  .result-axis-copy,
  .detail-label,
  .detail-block p,
  .reason-list li,
  .future-label,
  .future-slot p
) {
  color: #ffffff !important;
  -webkit-text-stroke-color: var(--gb-outline-color) !important;
  text-shadow: none !important;
  paint-order: stroke fill !important;
}

body:not(.route-variant-a) #scene-result :is(
  #resultEyebrow,
  .result-code,
  .result-type,
  .result-keyword-kicker,
  .result-radar-label,
  .result-detail-label,
  .result-axis-label,
  .result-axis-end,
  .detail-label,
  .future-label
) {
  font-size: 0.86rem !important;
}

body:not(.route-variant-a) #scene-result :is(
  .result-summary,
  .result-panel-copy,
  .result-keyword-copy,
  .result-detail-copy,
  .result-axis-copy,
  .detail-block p,
  .reason-list li,
  .future-slot p
) {
  font-size: 1.08rem !important;
  line-height: 1.62 !important;
}

body:not(.route-variant-a) #scene-form :is(
  .eyebrow,
  .panel-copy,
  .field-label,
  .field-meta,
  .oracle-input-prefix,
  .oracle-input-shell input,
  .oracle-input-shell input::placeholder,
  .stepper-unit,
  .stepper-value,
  .blood-button,
  .blood-button-label,
  .stepper-button,
  .stepper-button-label,
  .form-hint
) {
  -webkit-text-stroke-color: #8d76b8 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.56) !important;
}

body:not(.route-variant-a) #scene-form .eyebrow {
  color: #ffffff !important;
  -webkit-text-stroke-width: 1.1px !important;
}

body:not(.route-variant-a) #scene-form .panel-title {
  color: #ffffff !important;
  -webkit-text-stroke-color: #8d76b8 !important;
  -webkit-text-stroke-width: 2.18px !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

body:not(.route-variant-a) #scene-form .panel-copy,
body:not(.route-variant-a) #scene-form .field-label,
body:not(.route-variant-a) #scene-form .field-meta,
body:not(.route-variant-a) #scene-form .oracle-input-prefix,
body:not(.route-variant-a) #scene-form .stepper-unit,
body:not(.route-variant-a) #scene-form .form-hint {
  color: #ffffff !important;
  -webkit-text-stroke-width: 1.28px !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell input,
body:not(.route-variant-a) #scene-form .stepper-value {
  color: #ffffff !important;
  -webkit-text-stroke-width: 1.4px !important;
}

body:not(.route-variant-a) #scene-form .oracle-input-shell input::placeholder {
  color: rgba(255, 255, 255, 0.92) !important;
  -webkit-text-stroke-width: 1.18px !important;
  opacity: 0.96 !important;
}

body:not(.route-variant-a) #scene-form :is(
  .blood-button,
  .blood-button-label,
  .stepper-button,
  .stepper-button-label
) {
  color: #ffffff !important;
  -webkit-text-stroke-width: 1.46px !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.48) !important;
}

body:not(.route-variant-a) #scene-question .question-card {
  background: url("./designer/question/question-frame.png") center center / 100% 100% no-repeat !important;
}

body:not(.route-variant-a) #scene-question .question-card::after {
  content: none !important;
  display: none !important;
}

body:not(.route-variant-a) #scene-question .question-card.is-loading-state {
  background: transparent !important;
}

body:not(.route-variant-a) #scene-result :is(
  #resultEyebrow,
  .result-code,
  .result-type,
  .result-job,
  .result-summary,
  .result-chip,
  .result-keyword-kicker,
  .result-keyword-title,
  .result-keyword-copy,
  .detail-label,
  .result-panel-copy,
  .result-radar-label,
  .result-radar-value,
  .result-detail-label,
  .result-detail-title,
  .result-detail-copy,
  .result-axis-label,
  .result-axis-active,
  .result-axis-end,
  .result-axis-copy,
  .future-label,
  .future-slot p
) {
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke-width: 0 !important;
  -webkit-text-stroke-color: transparent !important;
  text-shadow: none !important;
  paint-order: normal !important;
}

body:not(.route-variant-a) #scene-question .question-card::before {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  transform: none !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-question .question-card.is-loading-state::before {
  content: none !important;
  display: none !important;
}

body:not(.route-variant-a) #scene-question .question-title.is-loading {
  font-size: clamp(1.58rem, 5.25vw, 2.08rem) !important;
}

body:not(.route-variant-a) #scene-question .answer-button,
body:not(.route-variant-a) #scene-question .answer-button *,
body:not(.route-variant-a) #scene-question .answer-button-text {
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke: 0 transparent !important;
  -webkit-text-stroke-width: 0px !important;
  -webkit-text-stroke-color: rgba(0, 0, 0, 0) !important;
  text-shadow: none !important;
  paint-order: normal !important;
}

body:not(.route-variant-a) #scene-question .answer-button-text {
  transform: translateY(-5%) !important;
}

body:not(.route-variant-a) #scene-question .answer-stack .answer-button > .answer-button-text.answer-button-text {
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke: 0px rgba(0, 0, 0, 0) !important;
  -webkit-text-stroke-width: 0px !important;
  -webkit-text-stroke-color: rgba(0, 0, 0, 0) !important;
  text-shadow: none !important;
  paint-order: normal !important;
  transform: translateY(-5%) !important;
}

body.scene-trailer-active:not(.route-variant-a) {
  overflow: hidden !important;
  background: #050407 !important;
}

body.scene-trailer-active:not(.route-variant-a) #soundToggle,
body.scene-x-ending-active:not(.route-variant-a) #soundToggle,
body.scene-x-ending-final:not(.route-variant-a) #soundToggle {
  display: none !important;
}

body.scene-x-ending-active:not(.route-variant-a),
body.scene-x-ending-final:not(.route-variant-a) {
  overflow: hidden !important;
  background: #000000 !important;
}

body.scene-x-ending-active:not(.route-variant-a) .ambient-grid,
body.scene-x-ending-active:not(.route-variant-a) .ambient-noise,
body.scene-x-ending-final:not(.route-variant-a) .ambient-grid,
body.scene-x-ending-final:not(.route-variant-a) .ambient-noise,
body.scene-x-ending-final:not(.route-variant-a) .scene-transition {
  display: none !important;
}

body:not(.route-variant-a) #scene-x-ending {
  background: #000000 !important;
}

body:not(.route-variant-a) #scene-x-ending .scene-panel-x-ending {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 100dvh !important;
  height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #000000 !important;
}

body:not(.route-variant-a) #scene-x-ending .scene-panel-x-ending::before,
body:not(.route-variant-a) #scene-x-ending .scene-panel-x-ending::after {
  content: none !important;
  display: none !important;
}

body:not(.route-variant-a) #scene-x-ending .x-ending-video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  background: #000000 !important;
}

body.scene-x-ending-final:not(.route-variant-a) #scene-x-ending .x-ending-video,
body.scene-x-ending-final:not(.route-variant-a) .scene:not(#scene-x-ending) {
  display: none !important;
}

body.scene-x-ending-final:not(.route-variant-a) #scene-x-ending,
body.scene-x-ending-final:not(.route-variant-a) #scene-x-ending .scene-panel-x-ending {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: #000000 !important;
}

@media (min-width: 768px) {
  body.scene-x-ending-active:not(.route-variant-a) .site-shell,
  body.scene-x-ending-final:not(.route-variant-a) .site-shell {
    align-items: stretch !important;
    justify-content: center !important;
    background: #000000 !important;
  }

  body.scene-x-ending-active:not(.route-variant-a) .app-frame,
  body.scene-x-ending-final:not(.route-variant-a) .app-frame {
    width: min(100vw, var(--shell-width)) !important;
    max-width: var(--shell-width) !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
    margin: 0 auto !important;
    background: #000000 !important;
  }
}

body:not(.route-variant-a) #scene-trailer .scene-panel-trailer {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 100dvh !important;
  height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #050407 !important;
  isolation: isolate !important;
}

body:not(.route-variant-a) #scene-trailer .scene-panel-trailer::before,
body:not(.route-variant-a) #scene-trailer .scene-panel-trailer::after {
  content: none !important;
  display: none !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-video {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #050407 !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-vignette {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(5, 4, 7, 0.28) 0%, rgba(5, 4, 7, 0) 30%, rgba(5, 4, 7, 0.16) 56%, rgba(5, 4, 7, 0.78) 100%),
    radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.14), transparent 34%) !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-controls {
  position: absolute !important;
  left: 22px !important;
  right: 22px !important;
  bottom: max(24px, calc(env(safe-area-inset-bottom, 0px) + 18px)) !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 14px !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-progress {
  width: 100% !important;
  height: 4px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.24) !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-progress span {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: #ffffff !important;
  transform: scaleX(0) !important;
  transform-origin: left center !important;
  transition: transform 0.18s linear !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-action {
  appearance: none !important;
  min-height: 42px !important;
  padding: 10px 12px 11px !important;
  border: 1px solid rgba(255, 255, 255, 0.42) !important;
  border-radius: 999px !important;
  background: rgba(5, 4, 7, 0.42) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--font-playful) !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
  text-shadow: none !important;
  backdrop-filter: blur(10px) !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-video:fullscreen {
  width: 100vw !important;
  height: 100vh !important;
  object-fit: contain !important;
  background: #050407 !important;
}

body:not(.route-variant-a) #scene-trailer .result-trailer-action[hidden] {
  display: none !important;
}

/* Result page visual label system */
body:not(.route-variant-a) #scene-result .result-card-top {
  align-items: center !important;
  gap: 8px !important;
}

body:not(.route-variant-a) #scene-result :is(.result-code, .result-type, .result-chip) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 26px !important;
  width: fit-content !important;
  padding: 5px 10px 6px !important;
  border: 1px solid rgba(132, 113, 152, 0.28) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 245, 252, 0.52)) !important;
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke-width: 0 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 6px 14px rgba(132, 113, 152, 0.1) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  position: relative !important;
  align-content: start !important;
  gap: 7px !important;
  padding: 12px 12px 14px !important;
  overflow: hidden !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.74), rgba(255, 240, 250, 0.46)),
    radial-gradient(circle at 100% 0%, rgba(132, 113, 152, 0.12), transparent 42%) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card::before {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 13px !important;
  background:
    linear-gradient(135deg, rgba(132, 113, 152, 0.22), rgba(255, 255, 255, 0.1)) !important;
  transform: rotate(8deg) !important;
  opacity: 0.7 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-kicker,
body:not(.route-variant-a) #scene-result .result-detail-label,
body:not(.route-variant-a) #scene-result .result-axis-label,
body:not(.route-variant-a) #scene-result .detail-label,
body:not(.route-variant-a) #scene-result .result-radar-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: 22px !important;
  padding: 4px 9px 5px !important;
  border: 1px solid rgba(132, 113, 152, 0.34) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
  letter-spacing: 0.03em !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-kicker::before,
body:not(.route-variant-a) #scene-result .result-detail-label::before,
body:not(.route-variant-a) #scene-result .result-axis-label::before,
body:not(.route-variant-a) #scene-result .detail-label::before {
  content: "" !important;
  width: 6px !important;
  height: 6px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: #847198 !important;
  box-shadow: 0 0 0 3px rgba(132, 113, 152, 0.12) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-title,
body:not(.route-variant-a) #scene-result .result-detail-title {
  display: block !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 7px 10px 8px !important;
  border: 1px solid rgba(132, 113, 152, 0.24) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(180deg, rgba(132, 113, 152, 0.16), rgba(132, 113, 152, 0.08)) !important;
  color: #847198 !important;
  -webkit-text-fill-color: #847198 !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.98rem !important;
  line-height: 1.18 !important;
  text-shadow: none !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.76), rgba(255, 245, 252, 0.46)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-head {
  align-items: flex-start !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 28px !important;
  max-width: 58% !important;
  padding: 6px 11px 7px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(132, 113, 152, 0.92), rgba(132, 113, 152, 0.7)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.86rem !important;
  line-height: 1.05 !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 7px 16px rgba(132, 113, 152, 0.18) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric {
  border: 1px solid rgba(132, 113, 152, 0.22) !important;
  background: rgba(255, 255, 255, 0.68) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label {
  min-height: 20px !important;
  padding: 3px 7px 4px !important;
  font-size: 0.66rem !important;
}

body:not(.route-variant-a) #scene-result .result-radar-value {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 36px !important;
  min-height: 30px !important;
  padding: 4px 7px !important;
  border-radius: 11px !important;
  background: rgba(132, 113, 152, 0.88) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.94rem !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

body:not(.route-variant-a) #scene-result#scene-result :is(.result-axis-active, .result-radar-value) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  -webkit-text-stroke-color: transparent !important;
  text-shadow: none !important;
}

/* Result page expanded accent palette */
body:not(.route-variant-a) #scene-result {
  --result-ink: #847198;
  --result-lime: #a7c957;
  --result-mint: #6ec6a3;
  --result-sky: #72b8e8;
  --result-peach: #f0a66b;
  --result-pink: #d889b8;
  --result-card-accent: var(--result-ink);
  --result-card-tint: rgba(132, 113, 152, 0.12);
  --result-card-fill: rgba(255, 255, 255, 0.72);
}

body:not(.route-variant-a) #scene-result :is(.result-code, .result-type) {
  border-color: rgba(114, 184, 232, 0.42) !important;
  background:
    linear-gradient(180deg, rgba(240, 250, 255, 0.88), rgba(218, 242, 255, 0.58)) !important;
  color: #5a7fa0 !important;
  -webkit-text-fill-color: #5a7fa0 !important;
}

body:not(.route-variant-a) #scene-result .result-chip {
  border-color: rgba(110, 198, 163, 0.44) !important;
  background:
    linear-gradient(180deg, rgba(235, 255, 247, 0.9), rgba(205, 244, 224, 0.62)) !important;
  color: #4b8f77 !important;
  -webkit-text-fill-color: #4b8f77 !important;
}

body:not(.route-variant-a) #scene-result .result-chip-risk {
  border-color: rgba(240, 166, 107, 0.48) !important;
  background:
    linear-gradient(180deg, rgba(255, 244, 232, 0.92), rgba(255, 220, 190, 0.62)) !important;
  color: #a96f45 !important;
  -webkit-text-fill-color: #a96f45 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(1) {
  --result-card-accent: var(--result-mint);
  --result-card-tint: rgba(110, 198, 163, 0.16);
  --result-card-fill: rgba(235, 255, 247, 0.78);
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(2) {
  --result-card-accent: var(--result-sky);
  --result-card-tint: rgba(114, 184, 232, 0.18);
  --result-card-fill: rgba(236, 248, 255, 0.78);
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(3) {
  --result-card-accent: var(--result-peach);
  --result-card-tint: rgba(240, 166, 107, 0.18);
  --result-card-fill: rgba(255, 244, 232, 0.78);
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(4) {
  --result-card-accent: var(--result-pink);
  --result-card-tint: rgba(216, 137, 184, 0.18);
  --result-card-fill: rgba(255, 239, 249, 0.78);
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  border-color: color-mix(in srgb, var(--result-card-accent) 38%, transparent) !important;
  background:
    linear-gradient(135deg, var(--result-card-fill), rgba(255, 255, 255, 0.48)),
    radial-gradient(circle at 100% 0%, var(--result-card-tint), transparent 46%) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card::before {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--result-card-accent) 34%, transparent), rgba(255, 255, 255, 0.14)) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card :is(.result-keyword-kicker, .result-keyword-title) {
  border-color: color-mix(in srgb, var(--result-card-accent) 42%, transparent) !important;
  background: color-mix(in srgb, var(--result-card-accent) 16%, white) !important;
  color: color-mix(in srgb, var(--result-card-accent) 68%, #5d4c95) !important;
  -webkit-text-fill-color: color-mix(in srgb, var(--result-card-accent) 68%, #5d4c95) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-kicker::before {
  background: var(--result-card-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--result-card-accent) 22%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  border-color: rgba(167, 201, 87, 0.34) !important;
  background:
    linear-gradient(180deg, rgba(249, 255, 235, 0.72), rgba(255, 255, 255, 0.44)) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-area {
  fill: rgba(178, 224, 94, 0.5) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline {
  stroke: rgba(110, 150, 62, 0.82) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point {
  stroke: rgba(110, 150, 62, 0.9) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n + 1) {
  --result-card-accent: var(--result-lime);
  --result-card-fill: rgba(249, 255, 235, 0.82);
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n + 2) {
  --result-card-accent: var(--result-mint);
  --result-card-fill: rgba(235, 255, 247, 0.82);
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n) {
  --result-card-accent: var(--result-sky);
  --result-card-fill: rgba(236, 248, 255, 0.82);
}

body:not(.route-variant-a) #scene-result .result-radar-metric {
  border-color: color-mix(in srgb, var(--result-card-accent) 38%, transparent) !important;
  background: var(--result-card-fill) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label {
  border-color: color-mix(in srgb, var(--result-card-accent) 42%, transparent) !important;
  background: color-mix(in srgb, var(--result-card-accent) 18%, white) !important;
  color: color-mix(in srgb, var(--result-card-accent) 64%, #5d4c95) !important;
  -webkit-text-fill-color: color-mix(in srgb, var(--result-card-accent) 64%, #5d4c95) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value {
  background: color-mix(in srgb, var(--result-card-accent) 78%, #847198) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(1) {
  --result-card-accent: var(--result-peach);
  --result-card-fill: rgba(255, 244, 232, 0.76);
}

body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(2) {
  --result-card-accent: var(--result-mint);
  --result-card-fill: rgba(235, 255, 247, 0.76);
}

body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(3) {
  --result-card-accent: var(--result-pink);
  --result-card-fill: rgba(255, 239, 249, 0.76);
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  border-color: color-mix(in srgb, var(--result-card-accent) 38%, transparent) !important;
  background:
    linear-gradient(90deg, var(--result-card-fill), rgba(255, 255, 255, 0.46)) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card :is(.result-detail-label, .result-detail-title) {
  border-color: color-mix(in srgb, var(--result-card-accent) 42%, transparent) !important;
  background: color-mix(in srgb, var(--result-card-accent) 16%, white) !important;
  color: color-mix(in srgb, var(--result-card-accent) 66%, #5d4c95) !important;
  -webkit-text-fill-color: color-mix(in srgb, var(--result-card-accent) 66%, #5d4c95) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-label::before {
  background: var(--result-card-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--result-card-accent) 22%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 1) {
  --result-card-accent: var(--result-sky);
}

body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 2) {
  --result-card-accent: var(--result-lime);
}

body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 3) {
  --result-card-accent: var(--result-peach);
}

body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n) {
  --result-card-accent: var(--result-pink);
}

body:not(.route-variant-a) #scene-result .result-axis-row {
  border-color: color-mix(in srgb, var(--result-card-accent) 34%, transparent) !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--result-card-accent) 13%, white), rgba(255, 255, 255, 0.48)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-label {
  border-color: color-mix(in srgb, var(--result-card-accent) 42%, transparent) !important;
  background: color-mix(in srgb, var(--result-card-accent) 16%, white) !important;
  color: color-mix(in srgb, var(--result-card-accent) 68%, #5d4c95) !important;
  -webkit-text-fill-color: color-mix(in srgb, var(--result-card-accent) 68%, #5d4c95) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-label::before {
  background: var(--result-card-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--result-card-accent) 22%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-active {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--result-card-accent) 82%, #847198), color-mix(in srgb, var(--result-card-accent) 58%, #847198)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-track {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.68), color-mix(in srgb, var(--result-card-accent) 52%, white)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-dot {
  border-color: color-mix(in srgb, var(--result-card-accent) 72%, #847198) !important;
}

/* Result page flat high-readability palette */
body:not(.route-variant-a) #scene-result {
  --result-flat-ink: #4f3f72;
  --result-flat-purple: #847198;
  --result-flat-mint: #d8f4e7;
  --result-flat-mint-strong: #37a978;
  --result-flat-lime: #eef7c8;
  --result-flat-lime-strong: #7ca52d;
  --result-flat-blue: #dcedff;
  --result-flat-blue-strong: #3f8fd2;
  --result-flat-peach: #ffe6cf;
  --result-flat-peach-strong: #d97934;
  --result-flat-pink: #ffe0f0;
  --result-flat-pink-strong: #c85f9a;
}

body:not(.route-variant-a) #scene-result :is(.result-code, .result-type) {
  border-color: var(--result-flat-blue-strong) !important;
  background: var(--result-flat-blue) !important;
  color: #2f6fa8 !important;
  -webkit-text-fill-color: #2f6fa8 !important;
}

body:not(.route-variant-a) #scene-result .result-chip {
  border-color: var(--result-flat-mint-strong) !important;
  background: var(--result-flat-mint) !important;
  color: #247f59 !important;
  -webkit-text-fill-color: #247f59 !important;
}

body:not(.route-variant-a) #scene-result .result-chip-risk {
  border-color: var(--result-flat-peach-strong) !important;
  background: var(--result-flat-peach) !important;
  color: #a7501d !important;
  -webkit-text-fill-color: #a7501d !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card,
body:not(.route-variant-a) #scene-result .result-detail-card,
body:not(.route-variant-a) #scene-result .result-axis-row,
body:not(.route-variant-a) #scene-result .result-radar-panel,
body:not(.route-variant-a) #scene-result .result-radar-metric {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.48),
    0 8px 18px rgba(132, 113, 152, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(1),
body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(2) {
  --result-card-strong: var(--result-flat-mint-strong);
  --result-card-ink: #247f59;
  background: var(--result-flat-mint) !important;
  border-color: var(--result-flat-mint-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(2),
body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 1) {
  --result-card-strong: var(--result-flat-blue-strong);
  --result-card-ink: #2f6fa8;
  background: var(--result-flat-blue) !important;
  border-color: var(--result-flat-blue-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(3),
body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(1),
body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 3) {
  --result-card-strong: var(--result-flat-peach-strong);
  --result-card-ink: #a7501d;
  background: var(--result-flat-peach) !important;
  border-color: var(--result-flat-peach-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(4),
body:not(.route-variant-a) #scene-result .result-detail-card:nth-child(3),
body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n) {
  --result-card-strong: var(--result-flat-pink-strong);
  --result-card-ink: #9f3f78;
  background: var(--result-flat-pink) !important;
  border-color: var(--result-flat-pink-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row:nth-child(4n + 2) {
  --result-card-strong: var(--result-flat-lime-strong);
  --result-card-ink: #617f20;
  background: var(--result-flat-lime) !important;
  border-color: var(--result-flat-lime-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card::before {
  background: var(--result-card-strong) !important;
  opacity: 0.16 !important;
}

body:not(.route-variant-a) #scene-result :is(
  .result-keyword-kicker,
  .result-keyword-title,
  .result-detail-label,
  .result-detail-title,
  .result-axis-label,
  .detail-label
) {
  border-color: var(--result-card-strong, var(--result-flat-purple)) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
}

body:not(.route-variant-a) #scene-result :is(
  .result-keyword-kicker,
  .result-detail-label,
  .result-axis-label,
  .detail-label
)::before {
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active,
body:not(.route-variant-a) #scene-result .result-radar-value {
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body:not(.route-variant-a) #scene-result .result-axis-track {
  background: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid var(--result-card-strong, var(--result-flat-purple)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-dot {
  background: #ffffff !important;
  border-color: var(--result-card-strong, var(--result-flat-purple)) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  background: var(--result-flat-lime) !important;
  border-color: var(--result-flat-lime-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-area {
  fill: rgba(124, 165, 45, 0.58) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline,
body:not(.route-variant-a) #scene-result .result-radar-point {
  stroke: #617f20 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n + 1) {
  --result-card-strong: var(--result-flat-lime-strong);
  --result-card-ink: #617f20;
  background: #f7ffd7 !important;
  border-color: var(--result-flat-lime-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n + 2) {
  --result-card-strong: var(--result-flat-mint-strong);
  --result-card-ink: #247f59;
  background: #e5fff2 !important;
  border-color: var(--result-flat-mint-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric:nth-child(3n) {
  --result-card-strong: var(--result-flat-blue-strong);
  --result-card-ink: #2f6fa8;
  background: #eaf6ff !important;
  border-color: var(--result-flat-blue-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-label {
  border-color: var(--result-card-strong, var(--result-flat-purple)) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card :is(.result-keyword-kicker, .result-keyword-title),
body:not(.route-variant-a) #scene-result .result-detail-card :is(.result-detail-label, .result-detail-title),
body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-label {
  border-color: var(--result-card-strong, var(--result-flat-purple)) !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-active,
body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value {
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Mobile radar legend redesign */
body:not(.route-variant-a) #scene-result .result-radar-legend {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric {
  display: grid !important;
  grid-template-rows: auto auto !important;
  justify-items: stretch !important;
  gap: 8px !important;
  min-height: 72px !important;
  padding: 9px 10px 10px !important;
  border-width: 2px !important;
  border-radius: 15px !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.62),
    0 7px 12px rgba(79, 63, 114, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  font-size: 0.88rem !important;
  line-height: 1.05 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label::before {
  content: "" !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  vertical-align: 0.08em !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  min-width: 34px !important;
  min-height: 28px !important;
  padding: 4px 7px !important;
  border-radius: 10px !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.86rem !important;
  line-height: 1 !important;
  box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-meter {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 8px !important;
  overflow: hidden !important;
  border: 1px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.76) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-meter-fill {
  display: block !important;
  width: var(--metric-value, 0%) !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
}

@media (max-width: 360px) {
  body:not(.route-variant-a) #scene-result .result-radar-legend {
    grid-template-columns: 1fr !important;
  }
}

/* Result save/share action redesign */
body:not(.route-variant-a) #scene-result .result-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 4px auto 0 !important;
}

body:not(.route-variant-a) #scene-result .result-restart-footer {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 12px auto 0 !important;
  padding: 4px 0 2px !important;
}

body:not(.route-variant-a) #scene-result #restartTest {
  flex: 0 0 auto !important;
  margin: 0 auto !important;
}

body:not(.route-variant-a) #scene-result .result-action-section {
  display: grid !important;
  gap: 10px !important;
  padding: 13px 14px 14px !important;
  border: 2px solid var(--result-flat-purple) !important;
  border-radius: 20px !important;
  background: #fff7fb !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.64),
    0 8px 18px rgba(79, 63, 114, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-action-section-save {
  border-color: var(--result-flat-blue-strong) !important;
  background: var(--result-flat-blue) !important;
}

body:not(.route-variant-a) #scene-result .result-action-section-share {
  border-color: var(--result-flat-mint-strong) !important;
  background: var(--result-flat-mint) !important;
}

body:not(.route-variant-a) #scene-result .result-action-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-action-head h3 {
  width: 100% !important;
  margin: 0 !important;
  color: var(--result-flat-ink) !important;
  -webkit-text-fill-color: var(--result-flat-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1.02rem !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-result .result-action-kicker {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 22px !important;
  padding: 4px 9px 5px !important;
  border: 1px solid currentColor !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--result-flat-purple) !important;
  -webkit-text-fill-color: var(--result-flat-purple) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.68rem !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
}

body:not(.route-variant-a) #scene-result .result-save-button {
  appearance: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 18px 11px !important;
  border: 2px solid var(--result-flat-blue-strong) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #2f6fa8 !important;
  -webkit-text-fill-color: #2f6fa8 !important;
  -webkit-text-stroke-width: 0 !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  box-shadow: 0 5px 0 rgba(63, 143, 210, 0.2) !important;
}

body:not(.route-variant-a) #scene-result .result-save-button:active {
  transform: translateY(2px) !important;
  box-shadow: 0 3px 0 rgba(63, 143, 210, 0.2) !important;
}

body:not(.route-variant-a) #scene-result :is(.result-save-button, .result-share-button):disabled,
body:not(.route-variant-a) #scene-result :is(.result-save-button, .result-share-button).is-busy {
  cursor: wait !important;
  opacity: 0.62 !important;
  transform: none !important;
}

body:not(.route-variant-a) #scene-result .result-action-icon,
body:not(.route-variant-a) #scene-result .result-share-button {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
}

body:not(.route-variant-a) #scene-result .result-action-icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: var(--result-flat-blue-strong) !important;
  color: #ffffff !important;
}

body:not(.route-variant-a) #scene-result .result-action-icon svg,
body:not(.route-variant-a) #scene-result .result-share-button svg {
  width: 18px !important;
  height: 18px !important;
}

body:not(.route-variant-a) #scene-result .result-action-icon path,
body:not(.route-variant-a) #scene-result .result-share-button-native path,
body:not(.route-variant-a) #scene-result .result-share-button-kakao path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-x path {
  fill: currentColor !important;
  stroke: none !important;
}

body:not(.route-variant-a) #scene-result .result-share-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}

body:not(.route-variant-a) #scene-result .result-share-button {
  appearance: none !important;
  width: 46px !important;
  height: 46px !important;
  padding: 0 !important;
  border: 2px solid currentColor !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  box-shadow: 0 5px 0 rgba(79, 63, 114, 0.12) !important;
}

body:not(.route-variant-a) #scene-result .result-share-button:active {
  transform: translateY(2px) !important;
  box-shadow: 0 3px 0 rgba(79, 63, 114, 0.12) !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-native {
  color: var(--result-flat-mint-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-kakao {
  color: #6f5900 !important;
  background: #fee84f !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-x {
  color: #ffffff !important;
  background: #111111 !important;
  border-color: #111111 !important;
}

/* Result detail visual cards */
body:not(.route-variant-a) #scene-result .result-detail-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 13px 14px 14px !important;
  border-width: 2px !important;
  border-radius: 18px !important;
  overflow: hidden !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-top,
body:not(.route-variant-a) #scene-result .result-detail-main,
body:not(.route-variant-a) #scene-result .result-detail-tags {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-top,
body:not(.route-variant-a) #scene-result .result-detail-main {
  justify-content: space-between !important;
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-symbol {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  min-width: 38px !important;
  height: 30px !important;
  padding: 0 8px !important;
  border: 2px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 0.74rem !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-label {
  margin-left: auto !important;
  min-height: 24px !important;
  padding: 5px 9px 6px !important;
  border-width: 1px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-label::before {
  display: none !important;
  content: none !important;
}

body:not(.route-variant-a) #scene-result .result-detail-title {
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  font-size: clamp(1.06rem, 4.2vw, 1.22rem) !important;
  line-height: 1.16 !important;
  letter-spacing: -0.035em !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 54px !important;
  height: 50px !important;
  border: 2px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score-number {
  font-family: var(--font-playful), "HakgyoansimTteokbokki", sans-serif !important;
  font-size: 1.12rem !important;
  line-height: 0.95 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score-label {
  font-size: 0.58rem !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  opacity: 0.82 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-meter {
  display: block !important;
  width: 100% !important;
  height: 10px !important;
  overflow: hidden !important;
  border: 1px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-meter-fill {
  display: block !important;
  width: var(--detail-value, 70%) !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-tags {
  flex-wrap: wrap !important;
  gap: 6px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 4px 8px 5px !important;
  border: 1px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.64) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-copy {
  margin: 0 !important;
  padding: 9px 10px 10px !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, 0.58) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.88rem !important;
  line-height: 1.36 !important;
  letter-spacing: -0.02em !important;
}

/* Result detail hierarchy refinement: 1 hero + 2 compact cards */
body:not(.route-variant-a) #scene-result .result-detail-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  min-width: 0 !important;
  padding: 12px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 {
  grid-column: 1 / -1 !important;
  grid-template-columns: minmax(0, 1fr) 70px !important;
  grid-template-areas:
    "top score"
    "title score"
    "meter meter"
    "tags tags"
    "copy copy" !important;
  align-items: center !important;
  min-height: 174px !important;
  padding: 14px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) {
  align-content: start !important;
  gap: 8px !important;
  min-height: 178px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-card-top {
  grid-area: top !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-title {
  grid-area: title !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-score {
  grid-area: score !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-meter {
  grid-area: meter !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-tags {
  grid-area: tags !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-copy {
  grid-area: copy !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-main {
  display: contents !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-score {
  width: 66px !important;
  height: 66px !important;
  border-radius: 20px !important;
  background: #ffffff !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-score-number {
  font-size: 1.42rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-main {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 46px !important;
  align-items: start !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-card-top {
  gap: 6px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-symbol {
  min-width: 34px !important;
  height: 26px !important;
  padding: 0 7px !important;
  font-size: 0.64rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-label {
  max-width: 88px !important;
  padding: 4px 7px 5px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 0.64rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-title {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-title {
  font-size: 0.94rem !important;
  line-height: 1.14 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score {
  width: 46px !important;
  height: 44px !important;
  border-radius: 14px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score-number {
  font-size: 1rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score-label {
  font-size: 0.52rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-meter {
  height: 8px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-copy {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-copy {
  padding: 7px 8px 8px !important;
  font-size: 0.78rem !important;
  line-height: 1.3 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-tags {
  gap: 4px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-tags span {
  min-height: 20px !important;
  padding: 3px 6px 4px !important;
  font-size: 0.64rem !important;
}

@media (max-width: 360px) {
  body:not(.route-variant-a) #scene-result .result-detail-grid {
    grid-template-columns: 1fr !important;
  }

  body:not(.route-variant-a) #scene-result .result-detail-card-1 {
    grid-template-columns: minmax(0, 1fr) 62px !important;
  }
}

/* Result axis choice-map redesign */
body:not(.route-variant-a) #scene-result .result-axis-stack {
  gap: 10px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-section-head {
  display: grid !important;
  gap: 6px !important;
  padding: 2px 2px 0 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-section-head .detail-label {
  border-color: var(--result-flat-purple) !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: var(--result-flat-ink) !important;
  -webkit-text-fill-color: var(--result-flat-ink) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-section-head .detail-label::before {
  background: var(--result-flat-purple) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-section-head p {
  margin: 0 !important;
  color: var(--result-flat-ink) !important;
  -webkit-text-fill-color: var(--result-flat-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.9rem !important;
  line-height: 1.36 !important;
  letter-spacing: -0.02em !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row {
  display: grid !important;
  gap: 10px !important;
  padding: 13px 14px 14px !important;
  border: 1px solid rgba(132, 113, 152, 0.22) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.54),
    0 8px 16px rgba(79, 63, 114, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-label {
  justify-self: start !important;
  min-height: 26px !important;
  padding: 5px 10px 6px !important;
  border: 1px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  font-size: 0.76rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row .result-axis-label::before {
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 30px !important;
  max-width: none !important;
  padding: 4px 5px 4px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.78rem !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active span {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active em {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 42px !important;
  height: 22px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  font-style: normal !important;
  font-size: 0.68rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice-map {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 7px 9px 8px !important;
  border: 2px solid rgba(255, 255, 255, 0.76) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.54) !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.78rem !important;
  line-height: 1.1 !important;
  text-align: center !important;
  opacity: 0.62 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-choice-left,
body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-choice-right {
  border-color: var(--result-card-strong, var(--result-flat-purple)) !important;
  background: #ffffff !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  box-shadow: 0 4px 0 color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 24%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-choice-left::before,
body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-choice-right::before {
  content: "NOW" !important;
  margin-right: 6px !important;
  padding: 3px 5px !important;
  border-radius: 999px !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.52rem !important;
  line-height: 1 !important;
  letter-spacing: 0.04em !important;
}

body:not(.route-variant-a) #scene-result .result-axis-scale {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-scale .result-axis-end {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-axis-track {
  position: relative !important;
  width: 100% !important;
  height: 14px !important;
  overflow: hidden !important;
  border: 2px solid var(--result-card-strong, var(--result-flat-purple)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-track::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 2 !important;
  width: 2px !important;
  height: 100% !important;
  background: rgba(79, 63, 114, 0.3) !important;
  transform: translate(-50%, -50%) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-fill {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  border-radius: inherit !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-fill {
  left: 50% !important;
  width: max(0%, calc(var(--axis-ratio, 50%) - 50%)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-fill {
  left: var(--axis-ratio, 50%) !important;
  width: max(0%, calc(50% - var(--axis-ratio, 50%))) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-dot {
  top: 50% !important;
  width: 24px !important;
  height: 24px !important;
  border: 4px solid #ffffff !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  box-shadow: 0 0 0 2px var(--result-card-strong, var(--result-flat-purple)) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-copy {
  margin: 0 !important;
  padding: 0 2px !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-fill-color: var(--result-card-ink, var(--result-flat-ink)) !important;
  -webkit-text-stroke-width: 0 !important;
  font-size: 0.84rem !important;
  line-height: 1.34 !important;
  letter-spacing: -0.02em !important;
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin-top: 15px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(1) {
  --keyword-bg: #e5fff2;
  --keyword-strong: #33ae79;
  --keyword-ink: #247f59;
  --keyword-soft: rgba(51, 174, 121, 0.18);
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(2) {
  --keyword-bg: #eaf6ff;
  --keyword-strong: #5da8e1;
  --keyword-ink: #2f6fa8;
  --keyword-soft: rgba(93, 168, 225, 0.18);
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(3) {
  --keyword-bg: #fff0df;
  --keyword-strong: #f0a66b;
  --keyword-ink: #a7501d;
  --keyword-soft: rgba(240, 166, 107, 0.2);
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  grid-template-areas:
    "index body"
    "meter meter" !important;
  gap: 9px 11px !important;
  min-height: 104px !important;
  padding: 12px 12px 11px !important;
  overflow: hidden !important;
  border: 2px solid var(--keyword-strong) !important;
  border-radius: 20px !important;
  background:
    linear-gradient(90deg, var(--keyword-soft) 0 56px, transparent 56px),
    var(--keyword-bg) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.62),
    0 7px 0 rgba(132, 113, 152, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card::before {
  content: "" !important;
  position: absolute !important;
  top: -18px !important;
  right: -18px !important;
  left: auto !important;
  bottom: auto !important;
  width: 84px !important;
  height: 84px !important;
  border-radius: 28px !important;
  background: var(--keyword-strong) !important;
  opacity: 0.13 !important;
  transform: rotate(18deg) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-index {
  position: relative !important;
  z-index: 1 !important;
  grid-area: index !important;
  align-self: start !important;
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  height: 44px !important;
  border: 2px solid var(--keyword-strong) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  box-shadow: 0 4px 0 var(--keyword-soft) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-body {
  position: relative !important;
  z-index: 1 !important;
  grid-area: body !important;
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-kicker {
  min-height: 20px !important;
  padding: 3px 8px 4px !important;
  border: 1px solid var(--keyword-strong) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  font-size: 0.66rem !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-kicker::before {
  background: var(--keyword-strong) !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-title {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 1.08rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-copy {
  margin: 0 !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 0.82rem !important;
  line-height: 1.28 !important;
  letter-spacing: -0.025em !important;
  opacity: 0.82 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-meter {
  position: relative !important;
  z-index: 1 !important;
  grid-area: meter !important;
  display: block !important;
  height: 10px !important;
  overflow: hidden !important;
  border: 1px solid var(--keyword-strong) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-meter > span {
  display: block !important;
  width: var(--keyword-value, 72%) !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: var(--keyword-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  position: relative !important;
  overflow: hidden !important;
  border: 2px solid #71b8ee !important;
  background:
    radial-gradient(circle at 18% 10%, rgba(122, 191, 255, 0.26), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(126, 116, 241, 0.18), transparent 30%),
    linear-gradient(180deg, #eaf6ff 0%, #f4fbff 52%, #eef4ff 100%) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 10px !important;
  pointer-events: none !important;
  border: 1px dashed rgba(79, 141, 245, 0.28) !important;
  border-radius: 18px !important;
  opacity: 0.75 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel > * {
  position: relative !important;
  z-index: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-chart svg {
  filter: drop-shadow(0 8px 10px rgba(38, 90, 168, 0.12)) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring,
body:not(.route-variant-a) #scene-result .result-radar-spoke {
  stroke: rgba(64, 119, 190, 0.2) !important;
  stroke-dasharray: 680 !important;
  stroke-dashoffset: 680 !important;
  animation: resultRadarTrace 1.05s cubic-bezier(0.18, 0.86, 0.28, 1) forwards !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring:nth-of-type(2) {
  animation-delay: 0.08s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring:nth-of-type(3) {
  animation-delay: 0.16s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring:nth-of-type(4) {
  animation-delay: 0.24s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-spoke {
  animation-delay: 0.26s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-area {
  fill: rgba(79, 141, 245, 0.46) !important;
  opacity: 0 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: resultRadarBloom 0.72s cubic-bezier(0.18, 0.86, 0.28, 1) 0.72s forwards !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline {
  stroke: #326ec7 !important;
  stroke-width: 2.8 !important;
  stroke-linejoin: round !important;
  stroke-dasharray: 760 !important;
  stroke-dashoffset: 760 !important;
  animation: resultRadarTrace 1s cubic-bezier(0.18, 0.86, 0.28, 1) 0.54s forwards !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point {
  fill: #ffffff !important;
  stroke: #326ec7 !important;
  stroke-width: 2.4 !important;
  opacity: 0 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: resultRadarPointPop 0.34s cubic-bezier(0.18, 1.3, 0.28, 1) forwards !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(1) {
  animation-delay: 1.08s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(2) {
  animation-delay: 1.14s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(3) {
  animation-delay: 1.2s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(4) {
  animation-delay: 1.26s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(5) {
  animation-delay: 1.32s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point:nth-of-type(6) {
  animation-delay: 1.38s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric {
  --result-card-strong: var(--metric-strong) !important;
  --result-card-ink: var(--metric-ink) !important;
  border-color: var(--metric-strong) !important;
  background: var(--metric-bg) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric {
  --result-card-strong: var(--metric-strong) !important;
  --result-card-ink: var(--metric-ink) !important;
  border-color: var(--metric-strong) !important;
  background: var(--metric-bg) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label {
  color: var(--metric-ink) !important;
  -webkit-text-fill-color: var(--metric-ink) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label::before,
body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value,
body:not(.route-variant-a) #scene-result .result-radar-meter-fill {
  background: var(--metric-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body:not(.route-variant-a) #scene-result .result-radar-meter {
  border-color: var(--metric-strong) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-meter-fill {
  width: var(--metric-value, 0%) !important;
  transform-origin: left center !important;
  transform: scaleX(0) !important;
  animation: resultRadarMeterFill 0.86s cubic-bezier(0.18, 0.86, 0.28, 1) 0.28s forwards !important;
}

@keyframes resultRadarTrace {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes resultRadarBloom {
  0% {
    opacity: 0;
    transform: scale(0.18) rotate(-9deg);
  }

  72% {
    opacity: 0.9;
    transform: scale(1.04) rotate(1deg);
  }

  100% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes resultRadarPointPop {
  0% {
    opacity: 0;
    transform: scale(0.2);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes resultRadarMeterFill {
  to {
    transform: scaleX(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.route-variant-a) #scene-result .result-radar-ring,
  body:not(.route-variant-a) #scene-result .result-radar-spoke,
  body:not(.route-variant-a) #scene-result .result-radar-area,
  body:not(.route-variant-a) #scene-result .result-radar-outline,
  body:not(.route-variant-a) #scene-result .result-radar-point,
  body:not(.route-variant-a) #scene-result .result-radar-meter-fill {
    animation: none !important;
    opacity: 1 !important;
    stroke-dashoffset: 0 !important;
    transform: none !important;
  }
}

body:not(.route-variant-a) #scene-result #resultCard.result-card {
  --result-pass-blue: #4f8df5;
  --result-pass-cyan: #35b7d5;
  --result-pass-violet: #7e74f1;
  --result-pass-ink: #284f9e;
  isolation: isolate !important;
  display: grid !important;
  gap: 13px !important;
  min-height: 0 !important;
  padding: 22px 18px 20px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 90% 8%, rgba(126, 116, 241, 0.24), transparent 32%),
    radial-gradient(circle at 10% 0%, rgba(53, 183, 213, 0.22), transparent 34%),
    linear-gradient(180deg, #eef7ff 0%, #f8fbff 46%, #eef4ff 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.68),
    inset 0 0 0 4px rgba(79, 141, 245, 0.1),
    0 16px 28px rgba(79, 63, 114, 0.12) !important;
  animation: resultPassEnter 0.62s cubic-bezier(0.18, 0.86, 0.28, 1) both !important;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
  border: 2px solid rgba(79, 141, 245, 0.52) !important;
  border-radius: inherit !important;
  border-image-source: none !important;
  background:
    linear-gradient(90deg, rgba(79, 141, 245, 0.12) 1px, transparent 1px) 0 0 / 18px 18px,
    linear-gradient(180deg, rgba(79, 141, 245, 0.08) 1px, transparent 1px) 0 0 / 18px 18px,
    linear-gradient(135deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0)) !important;
  opacity: 0.9 !important;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card::after {
  content: "" !important;
  position: absolute !important;
  left: -35% !important;
  right: -35% !important;
  top: 0 !important;
  z-index: 0 !important;
  display: block !important;
  height: 52px !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.78), transparent) !important;
  opacity: 0.48 !important;
  transform: translateY(-120%) rotate(-8deg) !important;
  animation: resultPassScan 3.8s ease-in-out 0.5s infinite !important;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card > * {
  position: relative !important;
  z-index: 1 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-aurora,
body:not(.route-variant-a) #scene-result #resultCard .result-constellation {
  display: block !important;
  position: absolute !important;
  pointer-events: none !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-aurora {
  inset: auto -54px -62px auto !important;
  z-index: 0 !important;
  width: 190px !important;
  height: 190px !important;
  border-radius: 42px !important;
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.96), rgba(79, 141, 245, 0.34) 30%, rgba(126, 116, 241, 0.18) 58%, transparent 72%) !important;
  filter: blur(1px) !important;
  opacity: 0.85 !important;
  transform: rotate(14deg) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-constellation {
  top: 16px !important;
  right: 18px !important;
  z-index: 0 !important;
  width: 86px !important;
  height: 86px !important;
  opacity: 0.34 !important;
  background:
    radial-gradient(circle, var(--result-pass-blue) 0 2px, transparent 2.5px) 8px 10px / 28px 28px,
    radial-gradient(circle, var(--result-pass-violet) 0 1.5px, transparent 2px) 0 0 / 19px 19px !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-card-top {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 82px !important;
  align-items: stretch !important;
  gap: 10px !important;
  margin: 0 0 2px !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code {
  position: relative !important;
  display: flex !important;
  align-items: end !important;
  justify-content: flex-start !important;
  min-height: 58px !important;
  width: 100% !important;
  padding: 24px 12px 9px !important;
  overflow-wrap: anywhere !important;
  border: 2px solid rgba(79, 141, 245, 0.46) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: #265aa8 !important;
  -webkit-text-fill-color: #265aa8 !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 0.7rem !important;
  line-height: 1.05 !important;
  letter-spacing: 0.015em !important;
  box-shadow: 0 5px 0 rgba(79, 141, 245, 0.12) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code::before {
  content: "COORD ID" !important;
  position: absolute !important;
  top: 8px !important;
  left: 12px !important;
  color: rgba(38, 90, 168, 0.68) !important;
  -webkit-text-fill-color: rgba(38, 90, 168, 0.68) !important;
  font-size: 0.58rem !important;
  line-height: 1 !important;
  letter-spacing: 0.1em !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-type {
  position: relative !important;
  display: grid !important;
  place-items: end center !important;
  min-height: 58px !important;
  width: 100% !important;
  padding: 19px 8px 8px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 25% 18%, rgba(255, 255, 255, 0.34), transparent 34%),
    linear-gradient(150deg, var(--result-pass-blue), var(--result-pass-violet)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 1.36rem !important;
  line-height: 0.94 !important;
  letter-spacing: -0.04em !important;
  box-shadow:
    inset 0 -3px 0 rgba(0, 0, 0, 0.12),
    0 7px 0 rgba(79, 141, 245, 0.16) !important;
  animation: resultTypePop 0.52s cubic-bezier(0.18, 1.28, 0.28, 1) 0.12s both !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-type::before {
  content: "TYPE" !important;
  position: absolute !important;
  top: 8px !important;
  left: 0 !important;
  right: 0 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.55rem !important;
  line-height: 1 !important;
  letter-spacing: 0.14em !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-title {
  margin: 2px 0 0 !important;
  color: #315fae !important;
  -webkit-text-fill-color: #315fae !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: clamp(1.86rem, 6.6vw, 2.42rem) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.075em !important;
  text-wrap: balance !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 6px 11px 7px !important;
  border: 2px solid rgba(53, 183, 213, 0.46) !important;
  border-radius: 999px !important;
  background: #e4fbff !important;
  color: #19718a !important;
  -webkit-text-fill-color: #19718a !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 0.86rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job::before {
  content: "ROLE" !important;
  margin-right: 7px !important;
  padding: 3px 5px !important;
  border-radius: 999px !important;
  background: #35b7d5 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.55rem !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-summary {
  max-width: none !important;
  margin: 0 !important;
  padding: 12px 13px 13px 15px !important;
  border-left: 5px solid var(--result-pass-blue) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: #3c5798 !important;
  -webkit-text-fill-color: #3c5798 !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  font-size: 0.92rem !important;
  line-height: 1.38 !important;
  letter-spacing: -0.03em !important;
  box-shadow: inset 0 0 0 1px rgba(79, 141, 245, 0.13) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-keyword-grid {
  margin-top: 0 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-orb-hero {
  display: block !important;
  position: absolute !important;
  right: -42px !important;
  bottom: 118px !important;
  z-index: 0 !important;
  width: 154px !important;
  height: 154px !important;
  opacity: 0.22 !important;
  filter: saturate(1.1) blur(0.2px) !important;
  box-shadow: none !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-tags {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-chip {
  justify-content: flex-start !important;
  min-height: 34px !important;
  width: 100% !important;
  padding: 8px 11px 9px !important;
  border-width: 2px !important;
  border-radius: 14px !important;
  background: rgba(229, 255, 242, 0.9) !important;
  color: #247f59 !important;
  -webkit-text-fill-color: #247f59 !important;
  font-size: 0.78rem !important;
  line-height: 1.15 !important;
  box-shadow: 0 4px 0 rgba(51, 174, 121, 0.13) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-chip-risk {
  background: rgba(255, 240, 223, 0.94) !important;
  color: #a7501d !important;
  -webkit-text-fill-color: #a7501d !important;
  box-shadow: 0 4px 0 rgba(240, 166, 107, 0.14) !important;
}

@keyframes resultPassEnter {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes resultPassScan {
  0%,
  42% {
    transform: translateY(-130%) rotate(-8deg);
  }

  72%,
  100% {
    transform: translateY(680%) rotate(-8deg);
  }
}

@keyframes resultTypePop {
  from {
    opacity: 0;
    transform: scale(0.84) rotate(-3deg);
  }

  to {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.route-variant-a) #scene-result #resultCard.result-card,
  body:not(.route-variant-a) #scene-result #resultCard.result-card::after,
  body:not(.route-variant-a) #scene-result #resultCard .result-type {
    animation: none !important;
    transform: none !important;
  }
}

/* Result visual diversity pass: reduce repeated horizontal gauges. */
body:not(.route-variant-a) #scene-result .result-keyword-meter,
body:not(.route-variant-a) #scene-result .result-radar-meter,
body:not(.route-variant-a) #scene-result .result-detail-meter,
body:not(.route-variant-a) #scene-result .result-axis-scale,
body:not(.route-variant-a) #scene-result .result-axis-track {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  grid-template-columns: 48px minmax(0, 1fr) 58px !important;
  grid-template-areas:
    "index body seal"
    "sparks body seal" !important;
  align-items: center !important;
  min-height: 112px !important;
  animation: resultKeywordStickerIn 0.44s cubic-bezier(0.18, 1.14, 0.28, 1) both !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(2) {
  animation-delay: 0.05s !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(3) {
  animation-delay: 0.1s !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card.is-dominant {
  min-height: 128px !important;
  transform-origin: center !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card.is-dominant .result-keyword-index {
  border-radius: 50% !important;
  box-shadow:
    0 0 0 6px var(--keyword-soft),
    0 5px 0 color-mix(in srgb, var(--keyword-strong) 24%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-seal {
  position: relative !important;
  z-index: 1 !important;
  grid-area: seal !important;
  display: grid !important;
  place-items: center !important;
  width: 54px !important;
  height: 54px !important;
  justify-self: end !important;
  border-radius: 50% !important;
  background:
    conic-gradient(var(--keyword-strong) 0 var(--keyword-angle, 260deg), rgba(255, 255, 255, 0.7) var(--keyword-angle, 260deg) 360deg) !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  -webkit-text-stroke-width: 0 !important;
  text-shadow: none !important;
  box-shadow: 0 6px 0 color-mix(in srgb, var(--keyword-strong) 18%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-seal::before {
  content: "" !important;
  position: absolute !important;
  inset: 6px !important;
  border: 1px solid color-mix(in srgb, var(--keyword-strong) 50%, #ffffff) !important;
  border-radius: inherit !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-seal strong,
body:not(.route-variant-a) #scene-result .result-keyword-seal em {
  position: relative !important;
  z-index: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-seal strong {
  font-size: 0.94rem !important;
  line-height: 0.9 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-seal em {
  margin-top: -4px !important;
  font-style: normal !important;
  font-size: 0.46rem !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  opacity: 0.72 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-sparks {
  position: relative !important;
  z-index: 1 !important;
  grid-area: sparks !important;
  display: grid !important;
  grid-template-columns: repeat(2, 10px) !important;
  gap: 5px !important;
  align-self: end !important;
  justify-self: center !important;
  transform: rotate(-8deg) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-sparks span {
  width: 10px !important;
  height: 10px !important;
  border: 1px solid var(--keyword-strong) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.76) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-sparks span.is-on {
  background: var(--keyword-strong) !important;
  box-shadow: 0 0 0 3px var(--keyword-soft) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 54px !important;
  padding: 9px 10px !important;
  opacity: 0 !important;
  transform: translateY(10px) scale(0.98) !important;
  animation: resultMetricChipIn 0.42s cubic-bezier(0.18, 0.86, 0.28, 1) forwards !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric:nth-child(2) {
  animation-delay: 0.04s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric:nth-child(3) {
  animation-delay: 0.08s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric:nth-child(4) {
  animation-delay: 0.12s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric:nth-child(5) {
  animation-delay: 0.16s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric:nth-child(6) {
  animation-delay: 0.2s !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric.is-top {
  border-width: 2px !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.72),
    0 6px 0 color-mix(in srgb, var(--metric-strong) 18%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-pips {
  display: inline-grid !important;
  grid-template-columns: repeat(5, 7px) !important;
  gap: 4px !important;
  justify-content: end !important;
}

body:not(.route-variant-a) #scene-result .result-radar-pips span {
  width: 7px !important;
  height: 7px !important;
  border: 1px solid var(--metric-strong) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.72) !important;
  opacity: 0.76 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-pips span.is-on {
  background: var(--metric-strong) !important;
  opacity: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  position: relative !important;
  overflow: hidden !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 {
  grid-template-areas:
    "top score"
    "title score"
    "tags tags"
    "copy copy" !important;
}

body:not(.route-variant-a) #scene-result .result-detail-orbit {
  position: absolute !important;
  right: -34px !important;
  bottom: -38px !important;
  width: 116px !important;
  height: 116px !important;
  border: 1px dashed color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 40%, transparent) !important;
  border-radius: 38px !important;
  opacity: 0.5 !important;
  transform: rotate(18deg) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score {
  position: relative !important;
  isolation: isolate !important;
  width: 58px !important;
  height: 58px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 50% !important;
  background:
    conic-gradient(var(--result-card-strong, var(--result-flat-purple)) 0 var(--detail-angle, 252deg), rgba(255, 255, 255, 0.72) var(--detail-angle, 252deg) 360deg) !important;
  box-shadow: 0 6px 0 color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 18%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card .result-detail-score {
  background:
    conic-gradient(var(--result-card-strong, var(--result-flat-purple)) 0 var(--detail-angle, 252deg), rgba(255, 255, 255, 0.72) var(--detail-angle, 252deg) 360deg) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score::before {
  content: "" !important;
  position: absolute !important;
  inset: 7px !important;
  z-index: 0 !important;
  border-radius: inherit !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 38%, #ffffff) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score-number,
body:not(.route-variant-a) #scene-result .result-detail-score-label {
  position: relative !important;
  z-index: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 .result-detail-score {
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  background:
    conic-gradient(var(--result-card-strong, var(--result-flat-purple)) 0 var(--detail-angle, 252deg), rgba(255, 255, 255, 0.72) var(--detail-angle, 252deg) 360deg) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score {
  width: 54px !important;
  height: 54px !important;
  border-radius: 50% !important;
  background:
    conic-gradient(var(--result-card-strong, var(--result-flat-purple)) 0 var(--detail-angle, 252deg), rgba(255, 255, 255, 0.72) var(--detail-angle, 252deg) 360deg) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at var(--axis-ratio, 50%) 58%, color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 18%, transparent), transparent 34%),
    rgba(255, 255, 255, 0.66) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice-map {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 58px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice {
  min-height: 52px !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-choice-left,
body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-choice-right {
  transform: translateY(-4px) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 32%, #ffffff),
    0 5px 0 color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 16%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass-ring {
  position: absolute !important;
  inset: 8px !important;
  border: 1px dashed color-mix(in srgb, var(--result-card-strong, var(--result-flat-purple)) 46%, transparent) !important;
  border-radius: inherit !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass-needle {
  position: absolute !important;
  top: 8px !important;
  bottom: 8px !important;
  left: calc(50% - 2px) !important;
  width: 4px !important;
  border-radius: 999px !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  transform-origin: 50% 50% !important;
  animation: resultAxisNeedleSettle 0.62s cubic-bezier(0.18, 1.26, 0.28, 1) 0.12s both !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass-needle::before {
  content: "" !important;
  position: absolute !important;
  top: -4px !important;
  left: 50% !important;
  width: 10px !important;
  height: 10px !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  transform: translateX(-50%) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass-core {
  position: relative !important;
  z-index: 1 !important;
  width: 15px !important;
  height: 15px !important;
  border: 3px solid #ffffff !important;
  border-radius: 50% !important;
  background: var(--result-card-strong, var(--result-flat-purple)) !important;
  box-shadow: 0 0 0 1px var(--result-card-strong, var(--result-flat-purple)) !important;
}

@keyframes resultKeywordStickerIn {
  from {
    opacity: 0;
    transform: translateY(12px) rotate(-1.5deg) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) rotate(0deg) scale(1);
  }
}

@keyframes resultMetricChipIn {
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes resultAxisNeedleSettle {
  from {
    transform: rotate(0deg) scaleY(0.48);
  }

  72% {
    transform: rotate(calc(var(--axis-angle, 0deg) * 1.08)) scaleY(1.04);
  }

  to {
    transform: rotate(var(--axis-angle, 0deg)) scaleY(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.route-variant-a) #scene-result .result-keyword-card,
  body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric,
  body:not(.route-variant-a) #scene-result .result-axis-compass-needle {
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
  }
}

/* Result tone harmonization: keep the result identity, but pull it back into the site pastel mood. */
body:not(.route-variant-a) #scene-result {
  --result-flat-ink: #5d4c8f;
  --result-flat-blue: #eef1fb;
  --result-flat-blue-strong: #7e92c4;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card {
  --result-pass-blue: #7e92c4;
  --result-pass-cyan: #6eaeb8;
  --result-pass-violet: #8f80b8;
  --result-pass-ink: #5d4c8f;
  background:
    radial-gradient(circle at 90% 8%, rgba(217, 167, 207, 0.18), transparent 32%),
    radial-gradient(circle at 10% 0%, rgba(126, 146, 196, 0.18), transparent 34%),
    linear-gradient(180deg, #f2f1fb 0%, #fbf8ff 46%, #f1eef9 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.68),
    inset 0 0 0 4px rgba(132, 113, 152, 0.08),
    0 16px 28px rgba(79, 63, 114, 0.12) !important;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card::before {
  border-color: rgba(132, 113, 152, 0.34) !important;
  background:
    linear-gradient(90deg, rgba(132, 113, 152, 0.09) 1px, transparent 1px) 0 0 / 18px 18px,
    linear-gradient(180deg, rgba(132, 113, 152, 0.07) 1px, transparent 1px) 0 0 / 18px 18px,
    linear-gradient(135deg, rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0)) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-aurora {
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.96), rgba(217, 167, 207, 0.24) 30%, rgba(126, 146, 196, 0.18) 58%, transparent 72%) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code {
  border-color: rgba(132, 113, 152, 0.34) !important;
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
  box-shadow: 0 5px 0 rgba(132, 113, 152, 0.1) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code::before {
  color: rgba(93, 76, 143, 0.62) !important;
  -webkit-text-fill-color: rgba(93, 76, 143, 0.62) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-title {
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job {
  border-color: rgba(132, 113, 152, 0.32) !important;
  background: #f6eff9 !important;
  color: #665889 !important;
  -webkit-text-fill-color: #665889 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job::before {
  background: #8f80b8 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-summary {
  border-left-color: #8f80b8 !important;
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
  box-shadow: inset 0 0 0 1px rgba(132, 113, 152, 0.1) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:nth-child(2) {
  --keyword-bg: #eef1fb;
  --keyword-strong: #7e92c4;
  --keyword-ink: #586a9e;
  --keyword-soft: rgba(126, 146, 196, 0.18);
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  border-color: #9d8bb0 !important;
  background:
    radial-gradient(circle at 18% 10%, rgba(217, 167, 207, 0.2), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(126, 146, 196, 0.14), transparent 30%),
    linear-gradient(180deg, #f4eff9 0%, #fbf8ff 52%, #f1eef9 100%) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring,
body:not(.route-variant-a) #scene-result .result-radar-spoke {
  stroke: rgba(132, 113, 152, 0.22) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline {
  stroke: #7e92c4 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-point {
  stroke: #7e92c4 !important;
}

/* Result readability overhaul: stronger hierarchy, tighter scan rhythm, clearer visual roles. */
body:not(.route-variant-a) .scene-panel-result {
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.34), transparent 28%),
    linear-gradient(180deg, rgba(255, 246, 253, 0.38) 0%, rgba(255, 255, 255, 0.08) 28%, rgba(244, 224, 242, 0.22) 100%) !important;
}

body:not(.route-variant-a) #scene-result .scene-panel-result {
  display: block !important;
  padding-inline: 0 !important;
}

body:not(.route-variant-a) #scene-result .scene-panel-result > :is(.result-card, .result-reasons, .result-deep-dive, .result-actions, .result-restart-footer) {
  width: calc(100% - 36px) !important;
  margin-inline: auto !important;
}

body:not(.route-variant-a) #scene-result #resultCard.result-card {
  gap: 12px !important;
  margin-top: 0 !important;
  padding: 19px 18px 18px !important;
  border: 2px solid rgba(132, 113, 152, 0.22) !important;
  background:
    radial-gradient(circle at 92% 7%, rgba(217, 167, 207, 0.24), transparent 31%),
    radial-gradient(circle at 9% 3%, rgba(255, 255, 255, 0.9), transparent 35%),
    linear-gradient(180deg, #f7f3fb 0%, #fffaff 47%, #f4eef9 100%) !important;
  box-shadow:
    inset 0 0 0 3px rgba(255, 255, 255, 0.72),
    0 12px 0 rgba(132, 113, 152, 0.08),
    0 18px 30px rgba(79, 63, 114, 0.12) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-card-top {
  grid-template-columns: minmax(0, 1fr) 76px !important;
  gap: 9px !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code {
  min-height: 52px !important;
  padding: 22px 11px 8px !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.66rem !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-type {
  min-height: 52px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.34), transparent 34%),
    linear-gradient(150deg, #8d80b6, #71659e) !important;
  box-shadow:
    inset 0 -3px 0 rgba(55, 44, 86, 0.18),
    0 6px 0 rgba(132, 113, 152, 0.18) !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-title {
  margin-top: 1px !important;
  color: #563f8c !important;
  -webkit-text-fill-color: #563f8c !important;
  font-size: clamp(2rem, 7vw, 2.52rem) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.07em !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job {
  min-height: 32px !important;
  padding: 6px 12px 7px !important;
  border-color: rgba(132, 113, 152, 0.36) !important;
  background: #fff7fc !important;
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-summary {
  padding: 12px 13px 13px 16px !important;
  border-left-width: 6px !important;
  border-left-color: #8f80b8 !important;
  background: rgba(255, 255, 255, 0.86) !important;
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
  font-size: 0.98rem !important;
  line-height: 1.42 !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-keyword-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 2px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  grid-template-areas:
    "index body"
    "sparks body" !important;
  gap: 7px 9px !important;
  min-height: 92px !important;
  padding: 10px 10px 10px !important;
  border-width: 2px !important;
  border-radius: 18px !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--keyword-soft) 72%, white) 0 48px, transparent 48px),
    var(--keyword-bg) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.64),
    0 5px 0 color-mix(in srgb, var(--keyword-strong) 12%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card.is-dominant {
  grid-column: 1 / -1 !important;
  grid-template-columns: 50px minmax(0, 1fr) 60px !important;
  grid-template-areas:
    "index body seal"
    "sparks body seal" !important;
  min-height: 106px !important;
  padding: 11px 12px !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--keyword-soft) 84%, white) 0 62px, transparent 62px),
    var(--keyword-bg) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-seal {
  position: absolute !important;
  top: 9px !important;
  right: 9px !important;
  width: 38px !important;
  height: 38px !important;
  opacity: 0.96 !important;
  box-shadow: 0 3px 0 color-mix(in srgb, var(--keyword-strong) 12%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-seal::before {
  inset: 5px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-seal strong {
  font-size: 0.72rem !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-seal em {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-copy {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-body {
  align-content: center !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-title {
  font-size: 1.1rem !important;
  line-height: 1.05 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-index {
  width: 38px !important;
  height: 38px !important;
  border-radius: 14px !important;
  font-size: 0.82rem !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card.is-dominant .result-keyword-index {
  width: 46px !important;
  height: 46px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-body {
  gap: 4px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-kicker {
  width: fit-content !important;
  min-height: 19px !important;
  padding: 3px 8px 4px !important;
  font-size: 0.64rem !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) .result-keyword-kicker {
  max-width: calc(100% - 42px) !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-title {
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  font-size: 1.02rem !important;
  line-height: 1.08 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card.is-dominant .result-keyword-title {
  font-size: 1.2rem !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-card .result-keyword-copy {
  color: color-mix(in srgb, var(--keyword-ink) 78%, #4f3f72) !important;
  -webkit-text-fill-color: color-mix(in srgb, var(--keyword-ink) 78%, #4f3f72) !important;
  font-size: 0.78rem !important;
  line-height: 1.24 !important;
  opacity: 0.94 !important;
  -webkit-line-clamp: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-sparks {
  grid-template-columns: repeat(2, 8px) !important;
  gap: 4px !important;
}

body:not(.route-variant-a) #scene-result .result-keyword-sparks span {
  width: 8px !important;
  height: 8px !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-tags {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-chip {
  justify-content: center !important;
  min-height: 32px !important;
  padding: 8px 8px 9px !important;
  border: 1px solid rgba(132, 113, 152, 0.2) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
  font-size: 0.72rem !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-result .result-reasons,
body:not(.route-variant-a) #scene-result .result-deep-dive {
  margin-top: 18px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel,
body:not(.route-variant-a) #scene-result .result-detail-card,
body:not(.route-variant-a) #scene-result .result-axis-row,
body:not(.route-variant-a) #scene-result .result-action-section {
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.56),
    0 8px 0 rgba(132, 113, 152, 0.06),
    0 14px 24px rgba(79, 63, 114, 0.08) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-panel {
  padding: 15px 14px 16px !important;
  border: 2px solid rgba(132, 113, 152, 0.34) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 22% 10%, rgba(255, 255, 255, 0.72), transparent 32%),
    linear-gradient(180deg, #f7f0fa 0%, #fffaff 54%, #f2eef9 100%) !important;
}

body:not(.route-variant-a) #scene-result .result-panel-headline,
body:not(.route-variant-a) #scene-result .result-axis-section-head {
  display: grid !important;
  justify-items: start !important;
  gap: 7px !important;
  margin-bottom: 12px !important;
}

body:not(.route-variant-a) #scene-result .result-panel-headline .detail-label,
body:not(.route-variant-a) #scene-result .result-axis-section-head .detail-label {
  min-height: 30px !important;
  padding: 7px 12px 8px !important;
  border: 2px solid #8f80b8 !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #5d4c8f !important;
  -webkit-text-fill-color: #5d4c8f !important;
  font-size: 0.82rem !important;
}

body:not(.route-variant-a) #scene-result .result-panel-copy,
body:not(.route-variant-a) #scene-result .result-axis-section-head p {
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
  font-size: 0.9rem !important;
  line-height: 1.34 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-shell {
  gap: 12px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-chart {
  min-height: 0 !important;
  padding: 2px 0 0 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-chart svg {
  width: min(100%, 252px) !important;
  filter: drop-shadow(0 8px 8px rgba(79, 63, 114, 0.1)) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-area {
  fill: rgba(143, 128, 184, 0.42) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-outline,
body:not(.route-variant-a) #scene-result .result-radar-point {
  stroke: #74649c !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-legend .result-radar-metric {
  min-height: 58px !important;
  padding: 9px 8px !important;
  border-width: 1px !important;
  border-radius: 16px !important;
  background: color-mix(in srgb, var(--metric-bg) 78%, #ffffff) !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric-head {
  display: grid !important;
  justify-items: center !important;
  gap: 5px !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-label {
  font-size: 0.74rem !important;
  line-height: 1 !important;
}

body:not(.route-variant-a) #scene-result .result-radar-metric .result-radar-value {
  min-width: 38px !important;
  min-height: 30px !important;
  border-radius: 999px !important;
  font-size: 0.92rem !important;
}

body:not(.route-variant-a) #scene-result .result-radar-pips {
  justify-content: center !important;
}

body:not(.route-variant-a) #scene-result .result-detail-grid {
  gap: 9px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card {
  border-radius: 22px !important;
  padding: 13px 14px !important;
  border-color: color-mix(in srgb, var(--result-card-strong, #847198) 72%, #ffffff) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-1 {
  min-height: 150px !important;
  background:
    radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--result-card-strong) 18%, transparent), transparent 30%),
    var(--result-flat-peach) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card-top {
  gap: 8px !important;
}

body:not(.route-variant-a) #scene-result .result-detail-symbol {
  min-width: 42px !important;
  height: 30px !important;
  border-radius: 999px !important;
  font-size: 0.7rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-label {
  margin-left: 0 !important;
  color: var(--result-card-ink, #5d4c8f) !important;
  -webkit-text-fill-color: var(--result-card-ink, #5d4c8f) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-title {
  color: var(--result-card-ink, #5d4c8f) !important;
  -webkit-text-fill-color: var(--result-card-ink, #5d4c8f) !important;
  font-size: clamp(1.08rem, 4.4vw, 1.34rem) !important;
  line-height: 1.1 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-title {
  font-size: 1rem !important;
}

body:not(.route-variant-a) #scene-result .result-detail-score {
  box-shadow:
    0 5px 0 color-mix(in srgb, var(--result-card-strong, #847198) 18%, transparent),
    0 0 0 5px rgba(255, 255, 255, 0.28) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-tags span {
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--result-card-ink, #5d4c8f) !important;
  -webkit-text-fill-color: var(--result-card-ink, #5d4c8f) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-copy {
  background: rgba(255, 255, 255, 0.66) !important;
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
  font-size: 0.86rem !important;
  line-height: 1.34 !important;
}

body:not(.route-variant-a) #scene-result .result-axis-stack {
  gap: 9px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row {
  gap: 9px !important;
  padding: 12px 12px 13px !important;
  border-width: 2px !important;
  border-radius: 22px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-head {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-active {
  justify-self: end !important;
  max-width: 100% !important;
  background: var(--result-card-strong, #847198) !important;
  box-shadow: 0 4px 0 color-mix(in srgb, var(--result-card-strong, #847198) 18%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice-map {
  grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr) !important;
  gap: 6px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-choice {
  min-height: 46px !important;
  border-color: rgba(255, 255, 255, 0.78) !important;
  background: rgba(255, 255, 255, 0.46) !important;
  font-size: 0.76rem !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-choice-left,
body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-choice-right {
  border-color: var(--result-card-strong, #847198) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--result-card-ink, #5d4c8f) !important;
  -webkit-text-fill-color: var(--result-card-ink, #5d4c8f) !important;
}

body:not(.route-variant-a) #scene-result .result-axis-compass {
  width: 48px !important;
  height: 48px !important;
}

body:not(.route-variant-a) #scene-result .result-axis-copy {
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
  font-size: 0.84rem !important;
  line-height: 1.34 !important;
  -webkit-line-clamp: 2 !important;
}

body:not(.route-variant-a) #scene-result .result-actions {
  margin-top: 18px !important;
}

body:not(.route-variant-a) #scene-result .result-action-section {
  border-radius: 24px !important;
  border-width: 2px !important;
  background: rgba(255, 255, 255, 0.66) !important;
}

body:not(.route-variant-a) #scene-result .result-action-head {
  justify-items: center !important;
  text-align: center !important;
}

body:not(.route-variant-a) #scene-result .result-action-head h3 {
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
  font-size: 1.02rem !important;
}

body:not(.route-variant-a) #scene-result .result-save-button {
  min-height: 56px !important;
  border-color: #8f80b8 !important;
  color: #4f3f72 !important;
  -webkit-text-fill-color: #4f3f72 !important;
}

body:not(.route-variant-a) #scene-result .result-action-icon {
  background: #8f80b8 !important;
}

@media (max-width: 360px) {
  body:not(.route-variant-a) #scene-result #resultCard .result-keyword-grid,
  body:not(.route-variant-a) #scene-result .result-radar-legend {
    grid-template-columns: 1fr !important;
  }

  body:not(.route-variant-a) #scene-result .result-keyword-card:not(.is-dominant) {
    grid-template-columns: 40px minmax(0, 1fr) 44px !important;
    grid-template-areas:
      "index body seal"
      "sparks body seal" !important;
  }
}

/* Result UX polish: Korean labels, readable body copy, clearer share actions, local focus restoration. */
body:not(.route-variant-a) #scene-result :is(
  .result-summary,
  .result-panel-copy,
  .result-keyword-copy,
  .result-detail-copy,
  .result-axis-copy
) {
  font-family: "Pretendard", var(--font-playful), sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  word-break: keep-all !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-code::before {
  content: "쿼드번호" !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-type::before {
  content: "유형" !important;
}

body:not(.route-variant-a) #scene-result #resultCard .result-job::before {
  content: "포지션" !important;
}

body:not(.route-variant-a) #scene-result .result-axis-row.is-left .result-axis-choice-left::before,
body:not(.route-variant-a) #scene-result .result-axis-row.is-right .result-axis-choice-right::before {
  content: "현재" !important;
}

body:not(.route-variant-a) #scene-result .result-radar-ring,
body:not(.route-variant-a) #scene-result .result-radar-spoke {
  animation: none !important;
  stroke-dashoffset: 0 !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score {
  width: 46px !important;
  height: 46px !important;
  box-shadow: 0 4px 0 color-mix(in srgb, var(--result-card-strong, #847198) 12%, transparent) !important;
}

body:not(.route-variant-a) #scene-result .result-detail-card:not(.result-detail-card-1) .result-detail-score-label {
  display: none !important;
}

body:not(.route-variant-a) #scene-result .result-share-buttons {
  gap: 9px !important;
}

body:not(.route-variant-a) #scene-result .result-share-button {
  display: grid !important;
  grid-template-rows: 24px auto !important;
  place-items: center !important;
  width: 64px !important;
  height: 58px !important;
  border-radius: 19px !important;
}

body:not(.route-variant-a) #scene-result .result-share-button::after {
  display: block !important;
  margin-top: 1px !important;
  font-family: "Pretendard", var(--font-playful), sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-native::after {
  content: "일반" !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-kakao::after {
  content: "카카오" !important;
}

body:not(.route-variant-a) #scene-result .result-share-button-x::after {
  content: "X" !important;
}

body:not(.route-variant-a) #scene-result :is(#downloadCard, #shareResult, #shareKakao, #shareX, #restartTest):focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.92) !important;
  outline-offset: 3px !important;
  box-shadow:
    0 0 0 6px rgba(132, 113, 152, 0.42),
    0 5px 0 rgba(79, 63, 114, 0.12) !important;
}

@media (prefers-reduced-motion: reduce) {
  body:not(.route-variant-a) #scene-result .result-radar-outline,
  body:not(.route-variant-a) #scene-result .result-radar-point {
    animation: none !important;
    opacity: 1 !important;
    stroke-dashoffset: 0 !important;
    transform: none !important;
  }
}

/* Result readable v2: conclusion-first mobile layout with clearer visual roles. */
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] {
  --result-v2-ink: #594678;
  --result-v2-muted: #7b6a95;
  --result-v2-line: rgba(132, 113, 152, 0.28);
  --result-v2-surface: rgba(255, 250, 255, 0.88);
  --result-v2-surface-strong: #ffffff;
  --result-v2-accent: #8272af;
  --result-v2-accent-soft: rgba(130, 114, 175, 0.16);
  --result-v2-blue: #6f8ec8;
  --result-v2-blue-soft: rgba(111, 142, 200, 0.16);
  --result-v2-mint: #54a989;
  --result-v2-mint-soft: rgba(84, 169, 137, 0.16);
  --result-v2-peach: #d8896d;
  --result-v2-peach-soft: rgba(216, 137, 109, 0.16);
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .scene-panel-result {
  padding-top: 12px !important;
  padding-bottom: 28px !important;
  background:
    radial-gradient(circle at 50% -4%, rgba(255, 255, 255, 0.46), transparent 30%),
    linear-gradient(180deg, rgba(255, 245, 253, 0.34), rgba(244, 231, 247, 0.18) 42%, rgba(235, 225, 246, 0.26)) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .scene-panel-result > :is(.result-card, .result-actions, .result-reasons, .result-deep-dive, .result-restart-footer) {
  width: calc(100% - 30px) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard.result-card {
  position: relative !important;
  gap: 8px !important;
  padding: 14px 14px 15px !important;
  border-color: rgba(132, 113, 152, 0.3) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(216, 137, 184, 0.16), transparent 30%),
    radial-gradient(circle at 12% 2%, rgba(255, 255, 255, 0.8), transparent 34%),
    linear-gradient(180deg, #fbf6fd 0%, #fffaff 48%, #f2edf8 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.72),
    0 8px 0 rgba(132, 113, 152, 0.07),
    0 14px 24px rgba(79, 63, 114, 0.1) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard.result-card::after {
  opacity: 0.22 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-orb-hero,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-constellation {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-card-top {
  grid-template-columns: minmax(0, 1fr) 56px !important;
  gap: 7px !important;
  margin: 0 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-code {
  min-height: 38px !important;
  padding: 17px 9px 6px !important;
  border-radius: 14px !important;
  font-size: 0.56rem !important;
  letter-spacing: 0 !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 3px 0 rgba(132, 113, 152, 0.08) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-code::before,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-type::before {
  top: 5px !important;
  font-size: 0.48rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-type {
  min-height: 38px !important;
  padding: 15px 6px 5px !important;
  border-radius: 14px !important;
  font-size: 1rem !important;
  box-shadow: inset 0 -2px 0 rgba(55, 44, 86, 0.16), 0 4px 0 rgba(132, 113, 152, 0.14) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-title {
  margin: 1px 0 0 !important;
  font-size: clamp(1.68rem, 6vw, 2.12rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.072em !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-job {
  justify-self: start !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 27px !important;
  padding: 5px 10px 6px 23px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.74rem !important;
  line-height: 1 !important;
  box-shadow: 0 3px 0 rgba(132, 113, 152, 0.08) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-job::before {
  left: 9px !important;
  width: 7px !important;
  height: 7px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-summary {
  display: -webkit-box !important;
  max-height: none !important;
  padding: 9px 10px 10px 13px !important;
  overflow: hidden !important;
  border-left-width: 5px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: var(--result-v2-ink) !important;
  -webkit-text-fill-color: var(--result-v2-ink) !important;
  font-family: "Pretendard", var(--font-playful), sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 750 !important;
  line-height: 1.34 !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-keyword-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin-top: 1px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid > .result-keyword-card {
  min-height: 48px !important;
  padding: 8px 9px !important;
  border-width: 1px !important;
  border-radius: 16px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.54), 0 4px 0 rgba(132, 113, 152, 0.06) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid > .result-keyword-card::before {
  content: none !important;
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid > .result-keyword-card.is-dominant {
  grid-column: 1 / -1 !important;
  grid-template-columns: 40px minmax(0, 1fr) 48px !important;
  grid-template-areas: "index body seal" !important;
  min-height: 74px !important;
  padding: 9px 10px !important;
  border-width: 2px !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--keyword-soft) 78%, white) 0 52px, transparent 52px),
    var(--keyword-bg) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid > .result-keyword-card:not(.is-dominant) {
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas: "body seal" !important;
  gap: 6px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-index,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-sparks {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .is-dominant .result-keyword-index {
  display: grid !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 12px !important;
  font-size: 0.76rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-body {
  min-width: 0 !important;
  gap: 3px !important;
  align-content: center !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-kicker {
  min-height: 17px !important;
  padding: 3px 7px !important;
  font-size: 0.58rem !important;
  line-height: 1 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-title {
  overflow: hidden !important;
  color: var(--keyword-ink) !important;
  -webkit-text-fill-color: var(--keyword-ink) !important;
  font-size: 0.96rem !important;
  line-height: 1.06 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .is-dominant .result-keyword-title {
  white-space: normal !important;
  font-size: 1.08rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-copy {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .is-dominant .result-keyword-copy {
  display: -webkit-box !important;
  font-size: 0.74rem !important;
  font-weight: 750 !important;
  line-height: 1.24 !important;
  -webkit-line-clamp: 1 !important;
  -webkit-box-orient: vertical !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-seal {
  position: relative !important;
  grid-area: seal !important;
  align-self: center !important;
  width: 34px !important;
  height: 34px !important;
  overflow: hidden !important;
  box-shadow: 0 3px 0 color-mix(in srgb, var(--keyword-strong) 12%, transparent) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .is-dominant .result-keyword-seal {
  width: 44px !important;
  height: 44px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-seal::before {
  inset: 5px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-seal strong {
  font-size: 0.66rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .is-dominant .result-keyword-seal strong {
  font-size: 0.8rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultKeywordGrid .result-keyword-seal em {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-tags {
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #resultCard .result-chip {
  min-height: 27px !important;
  padding: 6px 7px 7px !important;
  border-radius: 999px !important;
  font-size: 0.64rem !important;
  line-height: 1 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-actions {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-section {
  align-content: center !important;
  gap: 6px !important;
  min-height: 76px !important;
  padding: 9px 10px !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.62) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-section-save {
  min-width: 0 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-section-share {
  width: 154px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-head h3 {
  font-size: 0.74rem !important;
  letter-spacing: -0.04em !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-save-button {
  min-height: 44px !important;
  padding: 8px 11px 9px !important;
  gap: 6px !important;
  font-size: 0.78rem !important;
  box-shadow: 0 4px 0 rgba(132, 113, 152, 0.13) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-icon {
  width: 22px !important;
  height: 22px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-buttons {
  gap: 6px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-button {
  grid-template-rows: 1fr !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 0 rgba(79, 63, 114, 0.12) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-button::after {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-button svg {
  width: 18px !important;
  height: 18px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-reasons,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-deep-dive {
  margin-top: 14px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-panel {
  padding: 12px !important;
  border-color: rgba(111, 142, 200, 0.5) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 14% 8%, rgba(255, 255, 255, 0.76), transparent 28%),
    linear-gradient(180deg, #f1f5ff 0%, #fbf9ff 52%, #f1edf8 100%) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-panel::before {
  inset: 8px !important;
  border-color: rgba(111, 142, 200, 0.22) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-panel-headline,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-section-head {
  margin-bottom: 9px !important;
  gap: 5px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-panel-headline .detail-label,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-section-head .detail-label {
  min-height: 26px !important;
  padding: 6px 10px 7px !important;
  border-color: rgba(132, 113, 152, 0.68) !important;
  font-size: 0.72rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-panel-copy,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-section-head p {
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  line-height: 1.34 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-shell {
  display: grid !important;
  grid-template-columns: 122px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-chart {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-chart svg {
  width: 122px !important;
  max-width: 122px !important;
  filter: drop-shadow(0 5px 5px rgba(79, 63, 114, 0.1)) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-ring,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-spoke {
  stroke: rgba(100, 127, 183, 0.28) !important;
  stroke-dashoffset: 0 !important;
  animation: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-area {
  fill: rgba(111, 142, 200, 0.46) !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-outline,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-point {
  stroke: #647fb7 !important;
  opacity: 1 !important;
  stroke-dashoffset: 0 !important;
  transform: none !important;
  animation: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-outline {
  stroke-width: 3 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-point {
  fill: #ffffff !important;
  stroke-width: 2.5 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-legend {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  align-content: center !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-legend .result-radar-metric {
  min-height: 0 !important;
  height: 45px !important;
  padding: 5px !important;
  overflow: hidden !important;
  border-color: rgba(132, 113, 152, 0.18) !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, 0.64) !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-legend .result-radar-metric.is-top {
  border-color: var(--metric-strong) !important;
  background: color-mix(in srgb, var(--metric-bg) 70%, #ffffff) !important;
  transform: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-metric-head {
  gap: 3px !important;
  align-content: center !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-metric .result-radar-label {
  min-height: 16px !important;
  padding: 2px 5px !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 0.58rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-metric .result-radar-label::before {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-metric .result-radar-value {
  min-width: 30px !important;
  min-height: 24px !important;
  font-size: 0.76rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-pips {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-grid {
  gap: 8px !important;
  margin-top: 10px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card {
  min-height: 0 !important;
  padding: 10px 11px !important;
  border-radius: 18px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.52), 0 5px 0 rgba(132, 113, 152, 0.05) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card[data-card-kind="spark"] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 58px !important;
  grid-template-areas:
    "top score"
    "main score"
    "tags copy" !important;
  gap: 7px 10px !important;
  background:
    radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--result-card-strong, #8272af) 16%, transparent), transparent 34%),
    rgba(255, 248, 244, 0.78) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card:not([data-card-kind="spark"]) {
  grid-template-columns: minmax(0, 1fr) 42px !important;
  grid-template-areas:
    "top score"
    "main score"
    "copy copy" !important;
  gap: 6px 8px !important;
  background: rgba(255, 255, 255, 0.64) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-orbit {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card-top {
  grid-area: top !important;
  gap: 6px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-main {
  display: contents !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-symbol {
  min-width: 32px !important;
  height: 24px !important;
  font-size: 0.58rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-label {
  min-height: 22px !important;
  padding: 4px 8px 5px !important;
  font-size: 0.62rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-title {
  grid-area: main !important;
  align-self: center !important;
  font-size: 0.98rem !important;
  line-height: 1.12 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card[data-card-kind="spark"] .result-detail-title {
  font-size: 1.08rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-score {
  grid-area: score !important;
  align-self: center !important;
  justify-self: end !important;
  width: 46px !important;
  height: 46px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card[data-card-kind="spark"] .result-detail-score {
  width: 58px !important;
  height: 58px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-score-number {
  font-size: 0.82rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-score-label {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-tags {
  grid-area: tags !important;
  gap: 4px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card:not([data-card-kind="spark"]) .result-detail-tags {
  display: none !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-tags span {
  min-height: 22px !important;
  padding: 4px 7px 5px !important;
  font-size: 0.58rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-copy {
  grid-area: copy !important;
  align-self: center !important;
  padding: 7px 8px !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  -webkit-line-clamp: 2 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card[data-card-kind="spark"] .result-detail-copy {
  -webkit-line-clamp: 3 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-stack {
  gap: 7px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-row {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  padding: 9px 10px 10px !important;
  border-radius: 18px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-head {
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 6px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-label {
  min-height: 23px !important;
  padding: 5px 8px 6px !important;
  font-size: 0.62rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-active {
  min-height: 25px !important;
  padding: 4px 5px 4px 9px !important;
  border-radius: 999px !important;
  font-size: 0.7rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-active em {
  height: 18px !important;
  padding: 3px 6px !important;
  font-size: 0.52rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-choice-map {
  grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr) !important;
  gap: 5px !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-choice {
  min-height: 34px !important;
  padding: 5px 6px !important;
  font-size: 0.62rem !important;
  opacity: 0.54 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-row.is-left .result-axis-choice-left,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-row.is-right .result-axis-choice-right {
  opacity: 1 !important;
  box-shadow: 0 3px 0 color-mix(in srgb, var(--result-card-strong, #847198) 12%, transparent) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-choice::before {
  top: -6px !important;
  right: 8px !important;
  min-height: 16px !important;
  padding: 2px 5px !important;
  font-size: 0.48rem !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-compass {
  width: 34px !important;
  height: 34px !important;
  opacity: 0.9 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-copy {
  padding-top: 0 !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  -webkit-line-clamp: 1 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-restart-footer {
  margin-top: 14px !important;
}

@media (max-width: 360px) {
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .scene-panel-result > :is(.result-card, .result-actions, .result-reasons, .result-deep-dive, .result-restart-footer) {
    width: calc(100% - 22px) !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-actions {
    grid-template-columns: 1fr !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-action-section-share {
    width: 100% !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-shell {
    grid-template-columns: 1fr !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-radar-chart svg {
    width: 156px !important;
    max-width: 156px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] * {
    scroll-behavior: auto !important;
  }
}

/* Result motion pass: one-time reveals and tactile affordances. */
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready {
  --result-motion-ease: cubic-bezier(0.18, 0.88, 0.2, 1);
  --result-motion-snap: cubic-bezier(0.18, 1.28, 0.26, 1);
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-motion-node:not(.is-motion-seen) {
  opacity: 0 !important;
  transform: translate3d(0, 18px, 0) scale(0.985) !important;
  filter: blur(8px) saturate(0.92) !important;
  will-change: opacity, transform, filter;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-motion-node.is-motion-seen {
  animation: resultOnceRise 560ms var(--result-motion-ease) var(--motion-delay, 0ms) both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.motion-hero:not(.is-motion-seen) {
  clip-path: inset(3% 2% 3% 2% round 28px) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.motion-hero.is-motion-seen {
  animation-name: resultPosterUnlock !important;
  animation-duration: 660ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard :is(
  .result-card-top,
  .result-title,
  .result-job,
  .result-summary,
  .result-keyword-card,
  .result-tags
) {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  will-change: opacity, transform;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen :is(
  .result-card-top,
  .result-title,
  .result-job,
  .result-summary,
  .result-keyword-card,
  .result-tags
) {
  animation: resultChildStep 460ms var(--result-motion-ease) both;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-card-top {
  animation-delay: 90ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-title {
  animation-delay: 145ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-job {
  animation-delay: 190ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-summary {
  animation-delay: 235ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-keyword-card[data-rank="1"] {
  animation-delay: 292ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-keyword-card[data-rank="2"] {
  animation-delay: 342ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-keyword-card[data-rank="3"] {
  animation-delay: 382ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-tags {
  animation-delay: 430ms;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-type {
  animation: resultTypePulse 520ms var(--result-motion-snap) 190ms both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready #resultCard.is-motion-seen .result-keyword-seal {
  animation: resultSealStamp 560ms var(--result-motion-snap) calc(360ms + var(--motion-delay, 0ms)) both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-actions.is-motion-seen .result-action-section-save {
  animation: resultActionFloat 520ms var(--result-motion-ease) 90ms both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-actions.is-motion-seen .result-action-section-share {
  animation: resultActionFloat 520ms var(--result-motion-ease) 150ms both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel:not(.is-motion-seen) :is(
  .result-radar-ring,
  .result-radar-spoke,
  .result-radar-area,
  .result-radar-outline,
  .result-radar-point,
  .result-radar-metric
) {
  opacity: 0 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel:not(.is-motion-seen) :is(.result-radar-ring, .result-radar-spoke, .result-radar-outline) {
  stroke-dashoffset: 760 !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen :is(.result-radar-ring, .result-radar-spoke) {
  opacity: 1 !important;
  stroke-dasharray: 680 !important;
  stroke-dashoffset: 680 !important;
  animation: resultRadarTraceOnce 520ms var(--result-motion-ease) 120ms forwards !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-area {
  opacity: 0;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: resultRadarAreaBloom 520ms var(--result-motion-snap) 430ms forwards !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-outline {
  opacity: 1 !important;
  stroke-dasharray: 760 !important;
  stroke-dashoffset: 760 !important;
  animation: resultRadarTraceOnce 620ms var(--result-motion-ease) 300ms forwards !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point {
  opacity: 0;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: resultPointPop 320ms var(--result-motion-snap) forwards !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(1) {
  animation-delay: 760ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(2) {
  animation-delay: 800ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(3) {
  animation-delay: 840ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(4) {
  animation-delay: 880ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(5) {
  animation-delay: 920ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-point:nth-of-type(6) {
  animation-delay: 960ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric {
  opacity: 0;
  transform: translate3d(0, 9px, 0) scale(0.96);
  animation: resultMetricChipReveal 440ms var(--result-motion-ease) forwards !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="1"] {
  animation-delay: 520ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="2"] {
  animation-delay: 565ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="3"] {
  animation-delay: 610ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="4"] {
  animation-delay: 655ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="5"] {
  animation-delay: 700ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-radar-panel.is-motion-seen .result-radar-metric[data-rank="6"] {
  animation-delay: 745ms !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-detail-card[data-card-kind="spark"].is-motion-seen {
  animation-name: resultSparkCardReveal !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-detail-card.is-motion-seen .result-detail-score {
  animation: resultScorePop 620ms var(--result-motion-snap) 180ms both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-axis-row.is-motion-seen .result-axis-compass-needle {
  animation: resultAxisNeedleOnce 680ms var(--result-motion-snap) 130ms both !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"].result-motion-ready .result-axis-row.is-motion-seen :is(.result-axis-choice-left, .result-axis-choice-right) {
  transition: opacity 260ms ease, transform 260ms ease, box-shadow 260ms ease;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] :is(.result-save-button, .result-share-button, #restartTest) {
  transition:
    transform 160ms ease,
    box-shadow 160ms ease,
    filter 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease;
}

@media (hover: hover) and (pointer: fine) {
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-save-button:hover {
    transform: translateY(-2px) scale(1.01) !important;
    filter: saturate(1.05) brightness(1.02) !important;
    box-shadow: 0 6px 0 rgba(132, 113, 152, 0.16), 0 10px 18px rgba(79, 63, 114, 0.1) !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-button:hover {
    transform: translateY(-2px) rotate(-3deg) scale(1.04) !important;
    filter: saturate(1.08) brightness(1.02) !important;
  }

  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-detail-card:hover,
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-axis-row:hover {
    transform: translateY(-2px) !important;
    filter: saturate(1.03) !important;
  }
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-save-button:active,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-share-button:active,
body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] #restartTest:active {
  transform: translateY(2px) scale(0.97) !important;
}

body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] :is(.result-save-button, .result-share-button, #restartTest):focus-visible {
  animation: resultFocusGlow 820ms ease both !important;
}

@keyframes resultPosterUnlock {
  0% {
    opacity: 0;
    clip-path: inset(4% 3% 5% 3% round 30px);
    filter: blur(12px) saturate(0.86);
    transform: translate3d(0, 18px, 0) scale(0.976);
  }

  72% {
    opacity: 1;
    clip-path: inset(0% 0% 0% 0% round 24px);
    filter: blur(0) saturate(1.04);
    transform: translate3d(0, -2px, 0) scale(1.006);
  }

  100% {
    opacity: 1;
    clip-path: inset(0% 0% 0% 0% round 24px);
    filter: blur(0) saturate(1);
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes resultOnceRise {
  0% {
    opacity: 0;
    filter: blur(8px) saturate(0.92);
    transform: translate3d(0, 18px, 0) scale(0.985);
  }

  100% {
    opacity: 1;
    filter: blur(0) saturate(1);
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes resultChildStep {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes resultTypePulse {
  0% {
    transform: translateY(4px) scale(0.92);
  }

  68% {
    transform: translateY(-1px) scale(1.06);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes resultSealStamp {
  0% {
    opacity: 0;
    transform: rotate(-8deg) scale(0.72);
  }

  66% {
    opacity: 1;
    transform: rotate(3deg) scale(1.08);
  }

  100% {
    opacity: 1;
    transform: rotate(0deg) scale(1);
  }
}

@keyframes resultActionFloat {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes resultRadarTraceOnce {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes resultRadarAreaBloom {
  0% {
    opacity: 0;
    transform: scale(0.2) rotate(-7deg);
  }

  75% {
    opacity: 0.92;
    transform: scale(1.04) rotate(1deg);
  }

  100% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes resultPointPop {
  from {
    opacity: 0;
    transform: scale(0.32);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes resultMetricChipReveal {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes resultSparkCardReveal {
  0% {
    opacity: 0;
    filter: blur(8px) saturate(0.9);
    transform: translate3d(0, 18px, 0) scale(0.985);
  }

  72% {
    opacity: 1;
    filter: blur(0) saturate(1.06);
    transform: translate3d(0, -2px, 0) scale(1.006);
  }

  100% {
    opacity: 1;
    filter: blur(0) saturate(1);
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes resultScorePop {
  0% {
    transform: rotate(-8deg) scale(0.82);
  }

  68% {
    transform: rotate(3deg) scale(1.08);
  }

  100% {
    transform: rotate(0deg) scale(1);
  }
}

@keyframes resultAxisNeedleOnce {
  0% {
    transform: rotate(calc(var(--axis-angle, 0deg) * -0.55)) scaleY(0.48);
  }

  72% {
    transform: rotate(calc(var(--axis-angle, 0deg) * 1.12)) scaleY(1.05);
  }

  100% {
    transform: rotate(var(--axis-angle, 0deg)) scaleY(1);
  }
}

@keyframes resultFocusGlow {
  0% {
    box-shadow:
      0 0 0 0 rgba(255, 255, 255, 0.92),
      0 0 0 0 rgba(132, 113, 152, 0.42);
  }

  100% {
    box-shadow:
      0 0 0 3px rgba(255, 255, 255, 0.92),
      0 0 0 7px rgba(132, 113, 152, 0.32);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-motion-node,
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] .result-motion-node *,
  body.scene-result-active:not(.route-variant-a) #scene-result[data-result-ui="readable-v2"] :is(.result-radar-ring, .result-radar-spoke, .result-radar-area, .result-radar-outline, .result-radar-point, .result-radar-metric) {
    opacity: 1 !important;
    animation: none !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
    stroke-dashoffset: 0 !important;
  }
}