/*
 * Experience UI v1
 * Presentation-only layer. Engine values, grades, copy sources and navigation
 * remain owned by app-v2.js.
 */

html.experience-v1 {
  color-scheme: light;
  --ex-paper: #eef4f6;
  --ex-paper-deep: #e5edef;
  --ex-surface: rgba(250, 252, 251, 0.92);
  --ex-surface-solid: #fafcfb;
  --ex-ink: #102532;
  --ex-ink-soft: #50646e;
  --ex-ink-faint: #586b75;
  --ex-line: rgba(38, 77, 94, 0.15);
  --ex-line-strong: rgba(38, 77, 94, 0.28);
  --ex-blue: #2d66bd;
  --ex-blue-soft: #8fb8f0;
  --ex-blue-wash: rgba(47, 111, 218, 0.09);
  --ex-jade: #2f7664;
  --ex-jade-soft: #9fd2c2;
  --ex-amber: #c88a25;
  --ex-amber-ink: #9a6214;
  --ex-amber-soft: #e9c47d;
  --ex-coral: #a44c40;
  --ex-coral-soft: #efb1a4;
  --ex-radius: 8px;
  --ex-nav-height: 74px;
  --ex-shadow: 0 18px 42px rgba(24, 54, 67, 0.13);
  background: #dfe8eb;
  color: var(--ex-ink);
}

html.experience-v1 *,
html.experience-v1 *::before,
html.experience-v1 *::after {
  box-sizing: border-box;
  letter-spacing: 0;
}

html.experience-v1 body {
  min-height: 100%;
  margin: 0;
  background: #dfe8eb !important;
  color: var(--ex-ink) !important;
  font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html.experience-v1 button,
html.experience-v1 input,
html.experience-v1 select,
html.experience-v1 textarea {
  font: inherit;
}

html.experience-v1 button,
html.experience-v1 a,
html.experience-v1 summary,
html.experience-v1 label {
  touch-action: manipulation;
}

html.experience-v1 button:focus-visible,
html.experience-v1 a:focus-visible,
html.experience-v1 input:focus-visible,
html.experience-v1 summary:focus-visible {
  outline: 2px solid rgba(47, 111, 218, 0.72) !important;
  outline-offset: 3px;
}

html.experience-v1 .site-stage {
  position: relative;
  isolation: isolate;
  width: min(100%, 430px) !important;
  min-height: 100dvh;
  margin: 0 auto !important;
  overflow-x: clip;
  background: var(--ex-paper) !important;
  box-shadow: var(--ex-shadow) !important;
}

html.experience-v1 .experience-energy-canvas,
html.experience-v1 .experience-paper-grain {
  position: fixed;
  z-index: 0;
  pointer-events: none;
}

html.experience-v1 .experience-energy-canvas {
  opacity: 0.72;
}

html.experience-v1 .experience-paper-grain {
  opacity: 0.16;
  background-image:
    repeating-linear-gradient(0deg, rgba(16, 37, 50, 0.022) 0, rgba(16, 37, 50, 0.022) 1px, transparent 1px, transparent 5px),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.3) 0, rgba(255, 255, 255, 0.3) 1px, transparent 1px, transparent 8px);
}

html.experience-v1 .screen,
html.experience-v1 .bottom-nav,
html.experience-v1 .page-transition-loader,
html.experience-v1 .share-sheet,
html.experience-v1 .saved-profile-manager,
html.experience-v1 .toast {
  position: relative;
  z-index: 2;
}

html.experience-v1 .screen {
  min-height: 100dvh !important;
  color: var(--ex-ink) !important;
  background: transparent !important;
}

html.experience-v1 .screen-report,
html.experience-v1 .screen-daily,
html.experience-v1 .screen-detail,
html.experience-v1 .screen-more {
  padding-bottom: calc(var(--ex-nav-height) + 28px + env(safe-area-inset-bottom)) !important;
}

html.experience-v1 .report-appbar,
html.experience-v1 .daily-page-appbar,
html.experience-v1 .more-page-appbar,
html.experience-v1 .input-appbar,
html.experience-v1 .intro-appbar {
  position: sticky !important;
  z-index: 24 !important;
  top: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 62px !important;
  padding: env(safe-area-inset-top) 18px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(38, 77, 94, 0.1) !important;
  background: rgba(238, 244, 246, 0.86) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) saturate(125%);
}

html.experience-v1 .report-appbar > strong,
html.experience-v1 .daily-page-appbar > strong,
html.experience-v1 .more-page-appbar > strong {
  color: var(--ex-ink) !important;
  font-size: 16px !important;
  font-weight: 780 !important;
}

html.experience-v1 .icon-button,
html.experience-v1 .input-page-back,
html.experience-v1 .share-button {
  min-height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ex-ink-soft) !important;
}

html.experience-v1 .icon-button svg,
html.experience-v1 .input-page-back svg,
html.experience-v1 .share-button svg {
  width: 21px !important;
  height: 21px !important;
  color: currentColor !important;
  stroke: currentColor !important;
}

html.experience-v1 .back-button,
html.experience-v1 .input-page-back,
html.experience-v1 .share-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 680 !important;
}

html.experience-v1 .back-button,
html.experience-v1 .input-page-back { justify-self: start; }
html.experience-v1 .share-button { justify-self: end; }

html.experience-v1 .bottom-nav {
  position: fixed !important;
  z-index: 32 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  width: min(100%, 430px) !important;
  min-height: calc(var(--ex-nav-height) + env(safe-area-inset-bottom)) !important;
  margin: 0 auto !important;
  padding: 7px 7px env(safe-area-inset-bottom) !important;
  border: 0 !important;
  border-top: 1px solid rgba(38, 77, 94, 0.14) !important;
  background: rgba(250, 252, 251, 0.94) !important;
  box-shadow: none !important;
  backdrop-filter: blur(20px) saturate(120%);
  transform: none !important;
}

html.experience-v1 .bottom-nav.is-hidden { display: none !important; }

html.experience-v1 .bottom-nav button {
  position: relative;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #566a75 !important;
  font-size: 10.5px !important;
  font-weight: 690 !important;
  line-height: 1.2 !important;
}

html.experience-v1 .bottom-nav button::before {
  content: "";
  position: absolute;
  top: 0;
  width: 24px;
  height: 2px;
  background: transparent;
}

html.experience-v1 .bottom-nav button svg {
  width: 22px !important;
  height: 22px !important;
  color: currentColor !important;
  stroke: currentColor !important;
}

html.experience-v1 .bottom-nav button.is-active {
  color: var(--ex-blue) !important;
}

html.experience-v1 .bottom-nav button.is-active::before {
  background: var(--ex-blue);
}

/* Splash */
html.experience-v1 .screen-splash.is-active {
  display: grid !important;
  place-items: center;
  overflow: hidden;
  background: var(--ex-paper) !important;
}

html.experience-v1 .screen-splash:not(.is-active) {
  display: none !important;
}

html.experience-v1 .splash-card {
  position: relative;
  display: grid;
  justify-items: center;
  width: 100% !important;
  padding: 42px 24px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .splash-emblem {
  width: 186px !important;
  height: 186px !important;
  opacity: 0.42;
  filter: saturate(0.82);
}

html.experience-v1 .brand-seal {
  display: inline-flex !important;
  align-items: center !important;
  gap: 13px !important;
  margin-top: -42px !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .brand-seal-glyph {
  font-family: "Noto Serif KR", "Batang", serif !important;
  font-size: 38px !important;
  font-weight: 760 !important;
}

html.experience-v1 .brand-seal-divider {
  width: 30px !important;
  height: 1px !important;
  background: var(--ex-amber) !important;
  transform: rotate(-24deg);
}

html.experience-v1 .splash-card > p {
  margin: 18px 0 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 13px !important;
  font-weight: 630 !important;
}

html.experience-v1 .splash-thread i,
html.experience-v1 .splash-thread b {
  background: var(--ex-blue) !important;
}

/* Intro */
html.experience-v1 .screen-intro {
  padding-bottom: 26px !important;
}

html.experience-v1 .intro-appbar {
  grid-template-columns: 1fr !important;
}

html.experience-v1 .input-appbar {
  grid-template-columns: 72px minmax(0, 1fr) 72px !important;
}

html.experience-v1 .internal-brand-lockup {
  justify-self: start;
  color: var(--ex-ink) !important;
  font-family: "Noto Serif KR", "Batang", serif !important;
  font-size: 15px !important;
  font-weight: 750 !important;
}

html.experience-v1 .intro-appbar .internal-brand-lockup {
  justify-self: center !important;
}

html.experience-v1 .input-appbar .internal-brand-lockup {
  grid-column: 2;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  justify-self: center !important;
  overflow: hidden;
  font-size: 12px !important;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.experience-v1 .intro-content {
  position: relative;
  padding: 42px 24px 12px !important;
  overflow: hidden;
}

html.experience-v1 .intro-content::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 44px;
  right: -74px;
  width: 226px;
  height: 226px;
  border: 1px solid rgba(47, 111, 218, 0.22);
  border-radius: 50%;
  box-shadow:
    inset 0 0 0 34px rgba(60, 146, 125, 0.04),
    inset 0 0 0 67px rgba(211, 154, 53, 0.04);
}

html.experience-v1 .intro-brand-mark {
  display: grid !important;
  place-items: center !important;
  width: 54px !important;
  height: 54px !important;
  margin: 0 0 25px !important;
  overflow: hidden;
  border: 1px solid rgba(47, 111, 218, 0.28) !important;
  border-radius: 50% !important;
  background: rgba(250, 252, 251, 0.72) !important;
  box-shadow: 0 12px 30px rgba(47, 111, 218, 0.09) !important;
}

html.experience-v1 .intro-brand-mark img {
  width: 46px !important;
  height: 46px !important;
  object-fit: contain;
}

html.experience-v1 .intro-hero-title {
  max-width: 330px;
  margin: 0 !important;
  color: var(--ex-ink) !important;
  font-size: 38px !important;
  line-height: 1.22 !important;
  font-weight: 840 !important;
  word-break: keep-all;
}

html.experience-v1 .intro-hero-title span { display: block; }

html.experience-v1 .intro-hero-context {
  margin: 13px 0 0 !important;
}

html.experience-v1 .intro-eyebrow-context {
  color: var(--ex-amber-ink) !important;
  font-size: 13px !important;
  font-weight: 720 !important;
}

html.experience-v1 .intro-description {
  max-width: 335px;
  margin: 18px 0 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  word-break: keep-all;
}

html.experience-v1 .intro-scope {
  margin: 34px 0 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .intro-scope-item {
  display: grid !important;
  grid-template-columns: 38px 1fr !important;
  gap: 12px !important;
  align-items: center !important;
  min-height: 72px !important;
  padding: 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: transparent !important;
}

html.experience-v1 .intro-scope-item:last-child { border-bottom: 0 !important; }

html.experience-v1 .intro-scope-icon {
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(47, 111, 218, 0.28) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
}

html.experience-v1 .intro-scope-icon svg { width: 21px !important; height: 21px !important; }
html.experience-v1 .intro-scope-item strong { color: var(--ex-ink) !important; font-size: 14px !important; }
html.experience-v1 .intro-scope-item small { margin-top: 3px !important; color: var(--ex-ink-soft) !important; font-size: 11px !important; }

html.experience-v1 .saved-profile-card {
  margin-top: 28px !important;
  padding: 18px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .intro-actions {
  padding: 18px 24px 28px !important;
}

html.experience-v1 .intro-primary-button,
html.experience-v1 .gold-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 54px !important;
  border: 1px solid var(--ex-blue) !important;
  border-radius: var(--ex-radius) !important;
  background: var(--ex-blue) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(47, 111, 218, 0.2) !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}

html.experience-v1 .intro-primary-button svg { width: 20px !important; height: 20px !important; }

html.experience-v1 .intro-discovery-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px 14px !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html.experience-v1 .intro-discovery-links a {
  padding: 2px 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 11px !important;
  text-decoration: none !important;
}

html.experience-v1 .intro-trust-note,
html.experience-v1 .brand-continuity-note,
html.experience-v1 .input-trust-note,
html.experience-v1 .loading-auto-note {
  color: var(--ex-ink-faint) !important;
  font-size: 10px !important;
  line-height: 1.55 !important;
}

html.experience-v1 .input-trust-note a,
html.experience-v1 .brand-continuity-note,
html.experience-v1 .blog-entry-button {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 44px !important;
}

/* Input */
html.experience-v1 .home-hero {
  padding: 30px 22px 24px !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 .input-progress {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-bottom: 19px !important;
}

html.experience-v1 .input-progress i {
  width: 38px !important;
  height: 2px !important;
  border-radius: 99px !important;
  background: rgba(47, 111, 218, 0.18) !important;
}

html.experience-v1 .input-progress i.is-active { background: var(--ex-blue) !important; }
html.experience-v1 .input-progress span { margin-left: auto !important; color: var(--ex-ink-faint) !important; font-size: 10px !important; }
html.experience-v1 .home-hero .eyebrow { margin: 0 0 7px !important; color: var(--ex-blue) !important; font-size: 11px !important; font-weight: 760 !important; }

html.experience-v1 .home-hero h1 {
  margin: 0 !important;
  color: var(--ex-ink) !important;
  font-size: 28px !important;
  line-height: 1.32 !important;
  font-weight: 830 !important;
}

html.experience-v1 .v2-form {
  display: grid !important;
  gap: 14px !important;
  padding: 0 18px 34px !important;
}

html.experience-v1 .input-identity-card,
html.experience-v1 .input-card {
  margin: 0 !important;
  padding: 20px 16px !important;
  border: 1px solid var(--ex-line) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(250, 252, 251, 0.82) !important;
  box-shadow: none !important;
}

html.experience-v1 .input-identity-editor {
  display: grid !important;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr) !important;
  gap: 15px !important;
}

html.experience-v1 .field > span,
html.experience-v1 .input-card-title-row h2 {
  color: var(--ex-ink) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

html.experience-v1 .field input[type="text"],
html.experience-v1 .birth-direct-entry input,
html.experience-v1 .birth-time-known input {
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ex-ink) !important;
  box-shadow: none !important;
}

html.experience-v1 .segmented {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 4px !important;
  padding: 3px !important;
  border: 1px solid var(--ex-line) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(38, 77, 94, 0.05) !important;
}

html.experience-v1 .segmented label span {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--ex-ink-soft) !important;
  box-shadow: none !important;
}

html.experience-v1 .segmented label input:checked + span {
  background: var(--ex-surface-solid) !important;
  color: var(--ex-blue) !important;
  box-shadow: 0 2px 8px rgba(24, 54, 67, 0.08) !important;
}

html.experience-v1 .input-card-title-row {
  margin-bottom: 14px !important;
}

html.experience-v1 .birth-input-mode-toggle {
  min-height: 44px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(47, 111, 218, 0.28) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  font-size: 10px !important;
  font-weight: 730 !important;
}

html.experience-v1 .birth-wheel-picker {
  min-height: 174px !important;
  border: 0 !important;
  background:
    linear-gradient(to bottom, transparent 0 59px, rgba(47, 111, 218, 0.08) 59px 115px, transparent 115px),
    transparent !important;
}

html.experience-v1 .birth-wheel-picker::before,
html.experience-v1 .birth-wheel-picker::after {
  border-color: rgba(47, 111, 218, 0.24) !important;
}

html.experience-v1 .birth-wheel-column {
  color: var(--ex-ink-soft) !important;
  scrollbar-width: none;
}

html.experience-v1 .birth-wheel-column [aria-selected="true"] {
  color: var(--ex-ink) !important;
  font-weight: 810 !important;
}

html.experience-v1 .birth-wheel-column [aria-selected="false"] {
  color: #84959d !important;
  opacity: 0.78 !important;
}

html.experience-v1 .input-card-title-badges span {
  border: 1px solid rgba(60, 146, 125, 0.3) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--ex-jade) !important;
}

html.experience-v1 .birth-time-stage {
  min-height: 95px !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 .birth-time-known input {
  width: 58px !important;
  color: var(--ex-blue) !important;
  font-size: 30px !important;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

html.experience-v1 .birth-time-known b { color: var(--ex-blue) !important; }
html.experience-v1 .birth-time-divider { background: var(--ex-line) !important; }
html.experience-v1 .birth-time-unknown-toggle {
  min-height: 44px !important;
  color: var(--ex-ink-soft) !important;
}

html.experience-v1 .birth-time-switch {
  background: rgba(38, 77, 94, 0.16) !important;
}

html.experience-v1 #birth-time-unknown:checked + .birth-time-switch {
  background: var(--ex-blue) !important;
}

html.experience-v1 .gold-button { width: 100% !important; margin-top: 4px !important; }

/* Analysis loading */
html.experience-v1 .screen-loading {
  overflow: hidden;
  padding: 0 22px 30px !important;
  background: transparent !important;
}

html.experience-v1 .loading-brand {
  min-height: 62px !important;
  padding: 20px 0 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-ink) !important;
  font-family: "Noto Serif KR", "Batang", serif !important;
  font-size: 16px !important;
  text-align: left !important;
}

html.experience-v1 .loading-intro {
  padding: 46px 0 30px !important;
  text-align: left !important;
}

html.experience-v1 .loading-intro > span { color: var(--ex-jade) !important; font-size: 11px !important; font-weight: 760 !important; }
html.experience-v1 .loading-intro h1 { margin: 9px 0 12px !important; color: var(--ex-ink) !important; font-size: 29px !important; line-height: 1.35 !important; }
html.experience-v1 .loading-intro p { color: var(--ex-ink-soft) !important; font-size: 13px !important; }

html.experience-v1 .loading-report-stack {
  display: grid !important;
  gap: 0 !important;
  margin: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .loading-report-sheet {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  display: grid !important;
  grid-template-columns: 36px 1fr auto !important;
  gap: 12px !important;
  min-height: 67px !important;
  padding: 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .loading-report-sheet:last-child { border-bottom: 0 !important; }

html.experience-v1 .loading-report-icon {
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(47, 111, 218, 0.3) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  font-family: "Noto Serif KR", serif !important;
}

html.experience-v1 .loading-report-sheet b { color: var(--ex-ink-faint) !important; font-size: 10px !important; }
html.experience-v1 .loading-report-sheet.is-active b,
html.experience-v1 .loading-report-sheet.is-complete b { color: var(--ex-blue) !important; }

html.experience-v1 .loading-panel {
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .loading-bar {
  height: 5px !important;
  background: rgba(38, 77, 94, 0.1) !important;
}

html.experience-v1 .loading-bar i {
  background: linear-gradient(90deg, var(--ex-blue), var(--ex-jade)) !important;
  box-shadow: 0 0 10px rgba(47, 111, 218, 0.2) !important;
}

html.experience-v1 .screen-loading .report-brand-continuity {
  margin-top: 28px !important;
}

/* Fortune list / report home */
html.experience-v1 .report-root,
html.experience-v1 #report-root {
  position: relative;
  padding: 0 0 26px !important;
  background: transparent !important;
}

html.experience-v1 .report-hero.report-personality-dashboard {
  position: relative;
  display: block !important;
  min-height: 322px !important;
  margin: 0 !important;
  padding: 38px 22px 40px !important;
  overflow: hidden;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .report-personality-copy {
  position: relative;
  z-index: 3;
  max-width: 280px;
}

html.experience-v1 .report-personality-type-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--ex-amber-ink) !important;
  font-size: 11px !important;
  font-weight: 770 !important;
}

html.experience-v1 .report-personality-type-label::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .report-personality-copy h2 {
  max-width: 270px;
  margin: 10px 0 13px !important;
  color: var(--ex-ink) !important;
  font-size: 32px !important;
  line-height: 1.25 !important;
  font-weight: 840 !important;
  word-break: keep-all;
}

html.experience-v1 .report-personality-copy > p {
  max-width: 256px;
  margin: 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 14px !important;
  line-height: 1.72 !important;
  word-break: keep-all;
}

html.experience-v1 .report-personality-actions { margin-top: 23px !important; }

html.experience-v1 .report-personality-detail-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

html.experience-v1 .report-personality-detail-link i {
  width: 8px !important;
  height: 8px !important;
  border-top: 1px solid currentColor !important;
  border-right: 1px solid currentColor !important;
  transform: rotate(45deg);
}

html.experience-v1 .report-personality-type-icon {
  position: absolute !important;
  z-index: 1 !important;
  right: -36px !important;
  bottom: 12px !important;
  display: grid !important;
  place-items: center !important;
  width: 206px !important;
  height: 206px !important;
  border: 1px solid rgba(47, 111, 218, 0.22) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  box-shadow: inset 0 0 0 28px rgba(60, 146, 125, 0.035) !important;
  opacity: 0.78;
  transform: rotate(-9deg);
}

html.experience-v1 .report-personality-type-icon::before,
html.experience-v1 .report-personality-type-icon::after {
  content: "";
  position: absolute;
  inset: 34px;
  border: 1px solid rgba(60, 146, 125, 0.38);
  transform: rotate(45deg);
}

html.experience-v1 .report-personality-type-icon::after {
  inset: 68px;
  border-color: rgba(200, 138, 37, 0.58);
  border-radius: 50%;
  transform: none;
}

html.experience-v1 .report-personality-type-icon-svg {
  z-index: 2;
  width: 70px !important;
  height: 70px !important;
  stroke-width: 1.35 !important;
  transform: rotate(9deg);
}

html.experience-v1 .report-primary-menu,
html.experience-v1 .report-content-board {
  margin: 0 !important;
  padding: 32px 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .report-dashboard-head,
html.experience-v1 .report-content-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 20px 14px !important;
}

html.experience-v1 .report-dashboard-head h3,
html.experience-v1 .report-content-head h3 {
  margin: 0 !important;
  color: var(--ex-ink) !important;
  font-size: 23px !important;
  line-height: 1.3 !important;
  font-weight: 820 !important;
}

html.experience-v1 .report-analysis-menu-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 44px !important;
  padding: 0 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 750 !important;
}

html.experience-v1 .report-analysis-menu-chevron {
  width: 16px !important;
  height: 16px !important;
  color: currentColor !important;
}

html.experience-v1 .report-primary-menu-grid {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: 67% !important;
  grid-template-columns: none !important;
  gap: 10px !important;
  overflow-x: auto !important;
  padding: 0 20px 6px !important;
  scroll-snap-type: inline mandatory;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

html.experience-v1 .report-primary-menu-grid::-webkit-scrollbar { display: none; }

html.experience-v1 .report-primary-menu-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 48px 1fr !important;
  grid-template-rows: auto auto !important;
  gap: 6px 14px !important;
  align-content: center !important;
  min-width: 0 !important;
  min-height: 158px !important;
  padding: 20px !important;
  overflow: hidden;
  border: 1px solid var(--ex-line) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(250, 252, 251, 0.72) !important;
  box-shadow: none !important;
  color: var(--ex-ink) !important;
  text-align: left !important;
  scroll-snap-align: start;
}

html.experience-v1 .report-primary-menu-card::after {
  content: "";
  position: absolute;
  right: -30px;
  bottom: -50px;
  width: 132px;
  height: 132px;
  border: 1px solid color-mix(in srgb, var(--portal-tone, var(--ex-blue)) 58%, transparent);
  border-radius: 50%;
  box-shadow: inset 0 0 0 30px color-mix(in srgb, var(--portal-tone, var(--ex-blue)) 5%, transparent);
}

html.experience-v1 .report-primary-menu-card[data-portal-tone="jade"] { --portal-tone: var(--ex-jade); }
html.experience-v1 .report-primary-menu-card[data-portal-tone="amber"] { --portal-tone: var(--ex-amber); }
html.experience-v1 .report-primary-menu-card[data-portal-tone="coral"] { --portal-tone: var(--ex-coral); }

html.experience-v1 .report-primary-menu-card > .has-report-icon {
  grid-row: 1 / span 2 !important;
  display: grid !important;
  place-items: center !important;
  align-self: start;
  width: 46px !important;
  height: 46px !important;
  border: 1px solid color-mix(in srgb, var(--portal-tone, var(--ex-blue)) 42%, transparent) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--portal-tone, var(--ex-blue)) !important;
}

html.experience-v1 body.is-report-view .report-primary-menu-card > .has-report-icon,
html.experience-v1 body.is-report-view .report-content-feature > .report-content-topic-icon {
  border: 1px solid color-mix(in srgb, var(--portal-tone, var(--ex-blue)) 42%, transparent) !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .report-primary-menu-card .report-category-icon {
  width: 27px !important;
  height: 27px !important;
  color: currentColor !important;
  stroke-width: 1.75 !important;
}

html.experience-v1 .report-primary-menu-card > strong {
  position: relative;
  z-index: 2;
  align-self: end;
  color: var(--ex-ink) !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 790 !important;
}

html.experience-v1 .report-primary-menu-card > small.experience-menu-description {
  position: relative;
  z-index: 2;
  display: block;
  max-width: 150px;
  color: var(--ex-ink-soft);
  font-size: 11px;
  line-height: 1.5;
  word-break: keep-all;
}

html.experience-v1 .report-primary-menu-more {
  display: grid !important;
  grid-template-rows: 0fr !important;
  padding: 0 20px !important;
  opacity: 0;
  transition: grid-template-rows 380ms cubic-bezier(.2,.75,.2,1), opacity 260ms ease !important;
}

html.experience-v1 .report-primary-menu-more:not([aria-hidden="true"]) {
  grid-template-rows: 1fr !important;
  padding-top: 12px !important;
  opacity: 1;
}

html.experience-v1 .report-primary-menu-more-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  overflow: hidden;
}

html.experience-v1 .report-primary-menu-more-card {
  grid-template-columns: 36px 1fr !important;
  min-height: 78px !important;
  padding: 13px !important;
}

html.experience-v1 .report-primary-menu-more-card > .has-report-icon {
  width: 34px !important;
  height: 34px !important;
}

html.experience-v1 .report-primary-menu-more-card .report-category-icon { width: 20px !important; height: 20px !important; }
html.experience-v1 .report-primary-menu-more-card > strong { font-size: 13px !important; }
html.experience-v1 .report-primary-menu-more-card > small { display: none !important; }
html.experience-v1 .report-primary-menu-more-card::after { display: none; }

html.experience-v1 .report-content-board {
  margin: 36px 20px 0 !important;
  padding: 26px 0 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
}

html.experience-v1 .report-content-board .report-content-head { padding: 0 0 14px !important; }

html.experience-v1 .report-content-list {
  display: grid !important;
  gap: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .report-content-feature {
  display: grid !important;
  grid-template-columns: 44px 1fr auto !important;
  gap: 13px !important;
  align-items: center !important;
  min-height: 86px !important;
  padding: 15px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
}

html.experience-v1 .report-content-topic-icon {
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(200, 138, 37, 0.46) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ex-amber) !important;
}

html.experience-v1 .report-content-topic-icon svg { width: 24px !important; height: 24px !important; color: currentColor !important; }
html.experience-v1 .report-content-feature-copy strong { color: var(--ex-ink) !important; font-size: 16px !important; line-height: 1.4 !important; }
html.experience-v1 .report-content-feature-meta small { color: var(--ex-ink-faint) !important; font-size: 10px !important; }

html.experience-v1 .report-content-new-badge {
  min-height: 20px !important;
  padding: 0 7px !important;
  border: 1px solid rgba(200, 138, 37, 0.55) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #956515 !important;
  font-size: 9px !important;
}

html.experience-v1 .report-content-feature > i {
  width: 8px !important;
  height: 8px !important;
  border-top: 1px solid var(--ex-ink-soft) !important;
  border-right: 1px solid var(--ex-ink-soft) !important;
  transform: rotate(45deg);
}

/* Daily fortune */
html.experience-v1 #daily-root {
  position: relative;
  padding: 0 0 28px !important;
  background: transparent !important;
}

html.experience-v1 .daily-date-navigation {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 20px 22px 8px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-date-navigation button {
  display: grid !important;
  justify-items: start !important;
  gap: 2px !important;
  min-width: 0 !important;
  min-height: 48px !important;
  width: 100% !important;
  justify-self: stretch !important;
  padding: 6px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ex-ink-faint) !important;
}

html.experience-v1 .daily-date-navigation button:first-child { justify-items: start !important; padding-left: 4px !important; }
html.experience-v1 .daily-date-navigation button:nth-child(2) { justify-items: center !important; }
html.experience-v1 .daily-date-navigation button:last-child { justify-items: end !important; padding-right: 4px !important; }
html.experience-v1 .daily-date-navigation button span { font-size: 11px !important; font-weight: 720 !important; }
html.experience-v1 .daily-date-navigation button small { font-size: 10px !important; }
html.experience-v1 .daily-date-navigation button.is-active { color: var(--ex-blue) !important; }
html.experience-v1 .daily-date-navigation button.is-active span { font-size: 13px !important; }

html.experience-v1 .daily-home-overview {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 132px !important;
  align-items: center !important;
  min-height: 354px !important;
  margin: 0 !important;
  padding: 24px 18px 104px 23px !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-overview::before,
html.experience-v1 .daily-home-overview::after {
  content: "";
  position: absolute;
  right: -54px;
  bottom: 78px;
  width: 204px;
  height: 204px;
  border: 1px solid rgba(47, 111, 218, 0.26);
  border-radius: 50%;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none;
}

html.experience-v1 .daily-home-overview::after {
  right: -19px;
  bottom: 111px;
  width: 138px;
  height: 138px;
  border-color: rgba(60, 146, 125, 0.35);
  border-style: dashed;
}

html.experience-v1 .daily-home-intro {
  position: relative;
  z-index: 2;
  align-self: start;
  padding-top: 18px !important;
}

html.experience-v1 .daily-home-intro > p {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 12px !important;
  color: var(--ex-jade) !important;
  font-size: 11px !important;
  font-weight: 770 !important;
}

html.experience-v1 .daily-home-intro > p::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .daily-home-intro h1 {
  max-width: 224px;
  margin: 0 !important;
  color: var(--ex-ink) !important;
  font-size: 27px !important;
  line-height: 1.34 !important;
  font-weight: 840 !important;
  word-break: keep-all;
}

html.experience-v1 .daily-home-score-card {
  position: relative;
  z-index: 2;
  display: grid !important;
  align-content: center !important;
  justify-items: center !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-gauge {
  width: 130px !important;
  height: 98px !important;
  margin: 0 !important;
}

html.experience-v1 .daily-home-gauge svg {
  width: 130px !important;
  height: 88px !important;
  overflow: visible;
}

html.experience-v1 .daily-home-gauge-track,
html.experience-v1 .daily-home-gauge-value {
  stroke-width: 7px !important;
  stroke-linecap: round !important;
}

html.experience-v1 .daily-home-gauge-track { stroke: rgba(38, 77, 94, 0.1) !important; }
html.experience-v1 .daily-home-gauge-value { stroke: var(--daily-score-color, var(--ex-blue)) !important; filter: drop-shadow(0 0 4px color-mix(in srgb, var(--daily-score-color, var(--ex-blue)) 35%, transparent)); }

html.experience-v1 .daily-home-score-number {
  top: 39px !important;
  gap: 3px !important;
}

html.experience-v1 .daily-home-score-number strong {
  color: var(--daily-score-ink, var(--ex-blue)) !important;
  font-size: 44px !important;
  line-height: 1 !important;
  font-weight: 790 !important;
  font-variant-numeric: tabular-nums;
}

html.experience-v1 .daily-home-score-number small { color: var(--ex-ink-faint) !important; font-size: 10px !important; }

html.experience-v1 .daily-home-score-label {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin-top: 7px !important;
}

html.experience-v1 .daily-home-score-label span { color: var(--ex-ink-soft) !important; font-size: 10px !important; }
html.experience-v1 .daily-home-score-label strong { padding: 4px 9px !important; border: 1px solid color-mix(in srgb, var(--daily-score-color, var(--ex-blue)) 40%, transparent) !important; border-radius: 999px !important; background: color-mix(in srgb, var(--daily-score-color, var(--ex-blue)) 9%, transparent) !important; color: var(--daily-score-ink, var(--ex-blue)) !important; font-size: 10px !important; }

html.experience-v1 .daily-home-guidance {
  position: relative !important;
  z-index: 4 !important;
  display: block !important;
  margin: -84px 15px 30px !important;
  padding: 10px 18px 0 !important;
  border: 1px solid var(--ex-line-strong) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(250, 252, 251, 0.94) !important;
  box-shadow: 0 18px 42px rgba(25, 59, 73, 0.15) !important;
  backdrop-filter: blur(20px) saturate(120%);
}

html.experience-v1 .daily-home-guidance::before {
  content: "";
  display: block;
  width: 36px;
  height: 3px;
  margin: 0 auto 8px;
  border-radius: 99px;
  background: rgba(16, 37, 50, 0.18);
}

html.experience-v1 .daily-home-focus {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  padding: 8px 0 10px !important;
}

html.experience-v1 .daily-home-focus article {
  min-width: 0 !important;
  min-height: 122px !important;
  padding: 10px 14px 10px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-focus article + article {
  padding-right: 0 !important;
  padding-left: 16px !important;
  border-left: 1px solid var(--ex-line) !important;
}

html.experience-v1 .daily-home-focus article::before,
html.experience-v1 .daily-home-focus article::after {
  display: none !important;
  content: none !important;
}

html.experience-v1 .daily-guidance-label {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin: 0 0 9px !important;
  color: var(--daily-score-ink, var(--ex-ink-soft)) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
}

html.experience-v1 .daily-guidance-label svg { width: 16px !important; height: 16px !important; color: currentColor !important; }
html.experience-v1 .daily-home-focus article > strong { display: block !important; color: var(--ex-ink) !important; font-size: 17px !important; line-height: 1.3 !important; }
html.experience-v1 .daily-home-focus article > p { margin: 7px 0 0 !important; color: var(--ex-ink-soft) !important; font-size: 11px !important; line-height: 1.6 !important; word-break: keep-all; }

html.experience-v1 .daily-home-action {
  display: grid !important;
  grid-template-columns: 86px 1fr !important;
  gap: 12px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 16px 0 18px !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-action .daily-guidance-label { margin: 1px 0 0 !important; color: var(--ex-jade) !important; }
html.experience-v1 .daily-home-action > strong { color: var(--ex-ink) !important; font-size: 13px !important; line-height: 1.65 !important; font-weight: 690 !important; word-break: keep-all; }

html.experience-v1 .daily-home-categories {
  margin: 0 !important;
  padding: 0 20px 24px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-categories > header {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 0 14px !important;
  border: 0 !important;
}

html.experience-v1 .daily-home-categories > header h2 { margin: 0 !important; color: var(--ex-ink) !important; font-size: 23px !important; font-weight: 820 !important; }
html.experience-v1 .daily-home-categories > header span { color: var(--ex-ink-faint) !important; font-size: 10px !important; }

html.experience-v1 .daily-fortune-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .daily-fortune-disclosure {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-fortune-disclosure:last-child { border-bottom: 0 !important; }

html.experience-v1 .daily-fortune-disclosure > summary {
  display: grid !important;
  grid-template-columns: 38px 1fr 18px !important;
  gap: 11px !important;
  align-items: center !important;
  min-height: 72px !important;
  padding: 10px 0 !important;
  list-style: none;
}

html.experience-v1 .daily-fortune-row-icon {
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid color-mix(in srgb, var(--daily-score-color, var(--ex-blue)) 38%, transparent) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--daily-score-ink, var(--ex-blue)) !important;
}

html.experience-v1 .daily-fortune-row-icon svg { width: 20px !important; height: 20px !important; color: currentColor !important; }
html.experience-v1 .daily-fortune-row-main { display: grid !important; grid-template-columns: 96px 1fr !important; gap: 10px !important; align-items: center !important; }
html.experience-v1 .daily-fortune-row-meta { display: grid !important; gap: 3px !important; }
html.experience-v1 .daily-fortune-row-meta strong { color: var(--ex-ink) !important; font-size: 13px !important; }
html.experience-v1 .daily-fortune-row-meta em { color: var(--daily-score-ink, var(--ex-ink-soft)) !important; font-size: 9px !important; font-style: normal !important; }
html.experience-v1 .daily-fortune-row-scoreline { display: grid !important; grid-template-columns: 1fr 26px !important; gap: 8px !important; align-items: center !important; }
html.experience-v1 .daily-fortune-row-score { justify-self: end !important; color: var(--daily-score-ink, var(--ex-blue)) !important; font-size: 14px !important; font-variant-numeric: tabular-nums; }
html.experience-v1 .daily-fortune-row-bar { height: 5px !important; background: rgba(38, 77, 94, 0.1) !important; }
html.experience-v1 .daily-fortune-row-bar i { background: var(--daily-score-color, var(--ex-blue)) !important; box-shadow: 0 0 8px color-mix(in srgb, var(--daily-score-color, var(--ex-blue)) 38%, transparent) !important; }
html.experience-v1 .daily-fortune-row-chevron { width: 16px !important; height: 16px !important; color: var(--ex-ink-faint) !important; transition: transform 260ms ease !important; }
html.experience-v1 .daily-fortune-disclosure[open] .daily-fortune-row-chevron { transform: rotate(90deg) !important; }

html.experience-v1 .daily-fortune-row-detail {
  padding: 0 0 20px 49px !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 .daily-target-score-list { padding: 5px 0 13px !important; border-top: 1px solid var(--ex-line) !important; }
html.experience-v1 .daily-target-score { grid-template-columns: 78px 1fr 28px !important; min-height: 34px !important; color: var(--ex-ink-soft) !important; font-size: 10px !important; }
html.experience-v1 .daily-target-score-bar { height: 4px !important; background: rgba(38, 77, 94, 0.1) !important; }
html.experience-v1 .daily-target-score-bar i { background: var(--daily-score-color, var(--ex-blue)) !important; }
html.experience-v1 .daily-fortune-row-summary { margin: 0 !important; color: var(--ex-ink-soft) !important; font-size: 12px !important; line-height: 1.75 !important; word-break: keep-all; }

html.experience-v1 .daily-home-rationale {
  margin: 12px 20px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .daily-home-rationale > summary { min-height: 66px !important; padding: 0 !important; color: var(--ex-ink) !important; }
html.experience-v1 .daily-home-rationale-title { font-size: 15px !important; font-weight: 760 !important; }
html.experience-v1 .daily-home-rationale-summary-meta { color: var(--ex-ink-faint) !important; font-size: 10px !important; }
html.experience-v1 .daily-home-rationale-body { padding: 3px 0 22px !important; color: var(--ex-ink-soft) !important; }
html.experience-v1 .daily-rationale-flow,
html.experience-v1 .daily-rationale-overall { padding: 20px 0 !important; border-top: 1px solid var(--ex-line) !important; background: transparent !important; }

/* Shared detail surfaces */
html.experience-v1 #detail-root,
html.experience-v1 .detail-root,
html.experience-v1 .light-surface {
  padding: 0 !important;
  background: transparent !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .paper-card {
  border-color: var(--ex-line) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(250, 252, 251, 0.78) !important;
  box-shadow: none !important;
}

html.experience-v1 .domain-detail-head {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .personality-domain-intro,
html.experience-v1 .annual-detail-intro {
  position: relative;
  min-height: 172px;
  padding: 35px 22px 27px !important;
  overflow: hidden;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  background: transparent !important;
}

html.experience-v1 .personality-domain-intro::after,
html.experience-v1 .annual-detail-intro::after {
  content: "";
  position: absolute;
  right: -58px;
  bottom: -96px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(47, 111, 218, 0.2);
  border-radius: 50%;
  box-shadow: inset 0 0 0 35px rgba(60, 146, 125, 0.035);
}

html.experience-v1 .personality-domain-intro span,
html.experience-v1 .annual-detail-intro > span {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--ex-amber-ink) !important;
  font-size: 11px !important;
  font-weight: 760 !important;
}

html.experience-v1 .personality-domain-intro span::before,
html.experience-v1 .annual-detail-intro > span::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .personality-domain-intro h2,
html.experience-v1 .annual-detail-intro h2 {
  position: relative;
  z-index: 2;
  max-width: 300px;
  margin: 10px 0 0 !important;
  color: var(--ex-ink) !important;
  font-size: 31px !important;
  line-height: 1.3 !important;
  font-weight: 840 !important;
  word-break: keep-all;
}

html.experience-v1 .domain-radar-section {
  position: relative !important;
  min-height: 360px !important;
  margin: 0 !important;
  padding: 28px 10px 30px !important;
  overflow: hidden;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: rgba(250, 252, 251, 0.38) !important;
}

html.experience-v1 .domain-radar-section::before {
  content: "성향의 결";
  position: absolute;
  top: 24px;
  left: 22px;
  color: var(--ex-blue);
  font-size: 11px;
  font-weight: 760;
}

html.experience-v1 .report-personality-radar {
  width: min(100%, 388px) !important;
  margin-inline: auto !important;
}

html.experience-v1 .report-radar-plot {
  width: 278px !important;
  height: 238px !important;
  margin: 52px auto 0 !important;
  overflow: visible !important;
}

html.experience-v1 .report-radar-grid polygon,
html.experience-v1 .report-radar-grid line {
  stroke: rgba(38, 77, 94, 0.18) !important;
  stroke-width: 0.65px !important;
}

html.experience-v1 .report-radar-area {
  fill: rgba(47, 111, 218, 0.15) !important;
}

html.experience-v1 .report-radar-stroke {
  fill: none !important;
  stroke: var(--ex-blue-soft) !important;
  stroke-width: 1.15px !important;
  filter: drop-shadow(0 0 3px rgba(47, 111, 218, 0.2));
}

html.experience-v1 .report-radar-point {
  stroke: var(--ex-surface-solid) !important;
  stroke-width: 0.7px !important;
}

html.experience-v1 .report-radar-caption {
  color: var(--ex-ink-soft) !important;
}

html.experience-v1 .report-radar-label {
  color: var(--ex-ink) !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  font-weight: 690 !important;
  text-shadow: none !important;
}

html.experience-v1 .report-radar-grade-bg {
  min-width: 29px !important;
  height: 24px !important;
  padding: 0 5px !important;
  border-radius: 5px !important;
  background: var(--metric-bar-color, var(--ex-blue)) !important;
  box-shadow: none !important;
}

html.experience-v1 .report-radar-grade {
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 780 !important;
  text-shadow: none !important;
}

html.experience-v1 .domain-metric-overview {
  margin: 0 !important;
  padding: 34px 20px 28px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .domain-metric-overview-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 0 14px !important;
  border: 0 !important;
}

html.experience-v1 .domain-metric-overview-head strong {
  color: var(--ex-ink) !important;
  font-size: 23px !important;
  line-height: 1.3 !important;
  font-weight: 820 !important;
}

html.experience-v1 .domain-metric-overview-head span { color: var(--ex-ink-faint) !important; font-size: 10px !important; }

html.experience-v1 .domain-metric-overview-list {
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .domain-metric-overview-item {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .domain-metric-overview-item:last-child { border-bottom: 0 !important; }

html.experience-v1 .domain-metric-overview-row {
  display: grid !important;
  grid-template-columns: 36px minmax(84px, auto) minmax(54px, 1fr) 38px 16px !important;
  gap: 8px !important;
  align-items: center !important;
  min-height: 66px !important;
  padding: 8px 0 !important;
  list-style: none;
  color: var(--ex-ink) !important;
}

html.experience-v1 .domain-metric-overview-icon {
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  border: 1px solid color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 36%, transparent) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--metric-bar-color, var(--ex-blue)) !important;
}

html.experience-v1 .domain-metric-overview-icon svg { width: 19px !important; height: 19px !important; color: currentColor !important; }

html.experience-v1 .domain-metric-overview-row > span:not(.domain-metric-overview-icon) {
  min-width: 0;
  color: var(--ex-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 690 !important;
  word-break: keep-all;
}

html.experience-v1 .domain-metric-overview-bar .metric-bar,
html.experience-v1 .metric-bar {
  height: 5px !important;
  overflow: hidden;
  border-radius: 99px !important;
  background: rgba(38, 77, 94, 0.1) !important;
}

html.experience-v1 .metric-bar i {
  height: 100% !important;
  border-radius: inherit !important;
  background: var(--metric-bar-color, var(--ex-blue)) !important;
  box-shadow: 0 0 7px color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 34%, transparent) !important;
}

html.experience-v1 .metric-level-badge {
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 30px !important;
  padding: 0 !important;
  border: 1px solid color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 52%, transparent) !important;
  border-radius: 5px !important;
  background: color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 10%, transparent) !important;
  color: var(--metric-bar-color, var(--ex-blue)) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 780 !important;
}

html.experience-v1 .domain-metric-overview-chevron {
  width: 15px !important;
  height: 15px !important;
  color: var(--ex-ink-faint) !important;
  transition: transform 260ms ease !important;
}

html.experience-v1 .domain-metric-overview-item[open] .domain-metric-overview-chevron { transform: rotate(90deg) !important; }

html.experience-v1 .domain-metric-overview-explanation {
  margin: 0 !important;
  padding: 3px 0 24px 44px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-ink-soft) !important;
}

html.experience-v1 .domain-metric-overview-explanation p {
  margin: 0 0 13px !important;
  color: var(--ex-ink-soft) !important;
  font-size: 13px !important;
  line-height: 1.84 !important;
  word-break: keep-all;
}

html.experience-v1 .domain-metric-overview-explanation p:last-child { margin-bottom: 0 !important; }
html.experience-v1 .domain-metric-overview-explanation strong { color: var(--ex-ink) !important; font-weight: 770 !important; }

html.experience-v1 .domain-metric-overview-rest {
  margin: 13px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .domain-metric-overview-rest-toggle,
html.experience-v1 .domain-metric-overview-rest-close {
  min-height: 54px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 730 !important;
}

html.experience-v1 .domain-related-content,
html.experience-v1 .personality-related-content {
  margin: 26px 20px 0 !important;
  padding: 24px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Annual fortune */
html.experience-v1 .annual-detail,
html.experience-v1 .annual-detail-head {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .annual-experience-intro {
  display: grid !important;
  gap: 24px !important;
  min-height: 0 !important;
  padding: 34px 22px 30px !important;
}

html.experience-v1 .annual-experience-intro::after {
  right: -74px !important;
  bottom: -118px !important;
  width: 222px !important;
  height: 222px !important;
  opacity: 0.76;
}

html.experience-v1 .annual-experience-intro > div:first-child {
  position: relative;
  z-index: 2;
  min-width: 0;
}

html.experience-v1 .annual-experience-intro > div:first-child > span {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--ex-amber-ink) !important;
  font-size: 11px !important;
  font-weight: 760 !important;
}

html.experience-v1 .annual-experience-intro > div:first-child > span::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .annual-experience-intro h2 {
  margin: 10px 0 0 !important;
  font-size: 30px !important;
}

html.experience-v1 .annual-experience-intro p {
  position: relative;
  z-index: 2;
  max-width: 305px;
  margin: 12px 0 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 14px !important;
  line-height: 1.72 !important;
  font-weight: 610 !important;
  word-break: keep-all;
}

html.experience-v1 .annual-focus-strip {
  position: relative;
  z-index: 2;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--ex-line) !important;
}

html.experience-v1 .annual-focus-strip > span {
  flex: 0 0 auto;
  color: var(--ex-ink-faint) !important;
  font-size: 10px !important;
  font-weight: 690 !important;
}

html.experience-v1 .annual-focus-strip > div {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 6px !important;
}

html.experience-v1 .annual-focus-strip b {
  min-height: 27px !important;
  padding: 5px 9px !important;
  border: 1px solid color-mix(in srgb, var(--ex-blue) 24%, transparent) !important;
  border-radius: 99px !important;
  background: color-mix(in srgb, var(--ex-blue) 7%, transparent) !important;
  color: var(--ex-blue) !important;
  font-size: 10px !important;
  line-height: 1.45 !important;
  font-weight: 760 !important;
}

html.experience-v1 .annual-flow-overview {
  margin: 0 !important;
  padding: 30px 20px 32px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  background: transparent !important;
}

html.experience-v1 .annual-flow-overview-head,
html.experience-v1 .annual-breakdown-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 15px !important;
}

html.experience-v1 .annual-flow-overview-head strong,
html.experience-v1 .annual-breakdown-head strong {
  color: var(--ex-ink) !important;
  font-size: 21px !important;
  line-height: 1.35 !important;
  font-weight: 820 !important;
}

html.experience-v1 .annual-flow-overview-head span,
html.experience-v1 .annual-breakdown-head span {
  flex: 0 0 auto;
  color: var(--ex-ink-faint) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}

html.experience-v1 .annual-flow-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .annual-flow-item {
  min-width: 0;
  padding: 16px 12px 17px !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .annual-flow-item:nth-child(odd) {
  padding-left: 0 !important;
  border-right: 1px solid var(--ex-line) !important;
}

html.experience-v1 .annual-flow-item:nth-child(even) { padding-right: 0 !important; }
html.experience-v1 .annual-flow-item:nth-last-child(-n + 2) { border-bottom: 0 !important; }

html.experience-v1 .annual-flow-item-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 11px !important;
}

html.experience-v1 .annual-flow-item-head strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ex-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 720 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.experience-v1 .annual-flow-item-head em {
  flex: 0 0 auto;
  min-width: 30px !important;
  height: 24px !important;
  padding: 0 5px !important;
  border: 1px solid color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 45%, transparent) !important;
  border-radius: 5px !important;
  background: color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 8%, transparent) !important;
  color: var(--metric-bar-color, var(--ex-blue)) !important;
  font-size: 9px !important;
  line-height: 22px !important;
  font-style: normal !important;
  font-weight: 790 !important;
  text-align: center;
}

html.experience-v1 .annual-flow-item .metric-bar { width: 100% !important; }

html.experience-v1 .annual-breakdown {
  margin: 0 !important;
  padding: 30px 20px 34px !important;
}

html.experience-v1 .annual-score-status {
  margin: 20px 22px 0 !important;
  padding: 16px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .annual-group-overview {
  margin: 0 !important;
  padding: 0 0 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .annual-group-head {
  border-color: var(--ex-line) !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .annual-group-overview-list,
html.experience-v1 .annual-group-list {
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 .annual-metric-group {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .annual-group-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto 16px !important;
  gap: 10px !important;
  align-items: center !important;
  min-height: 62px !important;
  padding: 0 !important;
}

html.experience-v1 .annual-group-head > strong {
  color: var(--ex-ink) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  font-weight: 730 !important;
}

html.experience-v1 .annual-group-head > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

html.experience-v1 .annual-group-head > span > em {
  color: var(--ex-ink-faint) !important;
  font-size: 9px !important;
  line-height: 1.4 !important;
  font-style: normal !important;
  white-space: nowrap;
}

html.experience-v1 .annual-group-head .annual-score-status {
  display: grid !important;
  place-items: center !important;
  min-width: 34px !important;
  height: 27px !important;
  margin: 0 !important;
  padding: 0 5px !important;
  border: 1px solid color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 44%, transparent) !important;
  border-radius: 5px !important;
  background: color-mix(in srgb, var(--metric-bar-color, var(--ex-blue)) 8%, transparent) !important;
  color: var(--metric-bar-color, var(--ex-blue)) !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

html.experience-v1 .annual-metric-group[open] .annual-group-chevron { transform: rotate(90deg) !important; }
html.experience-v1 .annual-group-body { padding: 2px 0 20px !important; }
html.experience-v1 .annual-group-chevron { color: var(--ex-ink-faint) !important; }

@media (max-width: 360px) {
  html.experience-v1 .annual-flow-item { padding-inline: 9px !important; }
  html.experience-v1 .annual-flow-item:nth-child(odd) { padding-left: 0 !important; }
  html.experience-v1 .annual-flow-item:nth-child(even) { padding-right: 0 !important; }
  html.experience-v1 .annual-flow-item-head strong { font-size: 11px !important; }
  html.experience-v1 .annual-group-head > span > em { display: none !important; }
}

/* Timing */
html.experience-v1 .timing-life-page,
html.experience-v1 .timing-life-board {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .timing-life-intro {
  position: relative;
  min-height: 172px !important;
  padding: 34px 22px 27px !important;
  overflow: hidden;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  background: transparent !important;
}

html.experience-v1 .timing-life-intro::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -104px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(60, 146, 125, 0.3);
  border-radius: 50%;
  box-shadow: inset 0 0 0 40px rgba(47, 111, 218, 0.04);
}

html.experience-v1 .timing-life-intro h2 { margin: 0 0 12px !important; color: var(--ex-ink) !important; font-size: 30px !important; line-height: 1.32 !important; }
html.experience-v1 .timing-life-intro p { max-width: 290px; color: var(--ex-ink-soft) !important; font-size: 14px !important; line-height: 1.72 !important; }

html.experience-v1 .timing-life-overview {
  margin: 0 !important;
  padding: 30px 20px 24px !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 .timing-life-overview-track { height: 7px !important; border-radius: 99px !important; background: rgba(38, 77, 94, 0.1) !important; }
html.experience-v1 .timing-life-overview-labels {
  color: var(--ex-ink-soft) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
}

html.experience-v1 .timing-life-list {
  margin: 0 !important;
  padding: 0 20px 30px !important;
  border: 0 !important;
}

html.experience-v1 .timing-life-board > .timing-life-head {
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
  min-height: 52px !important;
  margin: 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: transparent !important;
}

html.experience-v1 .timing-life-board > .timing-life-head::after { content: none !important; }

html.experience-v1 .timing-life-board > .timing-life-head > strong {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0;
  color: var(--ex-ink-soft) !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 720 !important;
  white-space: nowrap;
}

html.experience-v1 .timing-life-board > .timing-life-head > strong.is-good { color: var(--ex-blue) !important; }
html.experience-v1 .timing-life-board > .timing-life-head > strong.is-caution { color: var(--ex-coral) !important; }

html.experience-v1 .timing-life-board > .timing-life-head > strong i {
  display: inline-grid !important;
  place-items: center !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 9px !important;
  font-style: normal !important;
}

html.experience-v1 .timing-life-board > .timing-life-head > strong.is-caution i::before {
  content: "!";
  display: grid;
  place-items: center;
  width: 12px;
  height: 12px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 8px;
  line-height: 1;
}

html.experience-v1 .timing-life-year-list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-content: flex-start !important;
  gap: 6px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html.experience-v1 .timing-life-row {
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .timing-life-row.is-good { border-left: 2px solid var(--ex-blue) !important; padding-left: 13px !important; }
html.experience-v1 .timing-life-row.is-caution { border-left: 2px solid var(--ex-coral) !important; padding-left: 13px !important; }
html.experience-v1 .timing-life-age { color: var(--ex-ink) !important; font-size: 13px !important; }
html.experience-v1 .timing-life-value { min-width: 0 !important; color: var(--ex-ink-soft) !important; font-size: 12px !important; line-height: 1.7 !important; }
html.experience-v1 .timing-life-node { box-shadow: none !important; }

html.experience-v1 .timing-life-year-list > span {
  min-height: 28px !important;
  padding: 5px 7px !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  white-space: nowrap;
}

/* Saju basis */
html.experience-v1 .manse-basis-card,
html.experience-v1 .contextual-evidence-section,
html.experience-v1 .contextual-evidence-card {
  margin: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .manse-basis-card {
  padding: 34px 20px 28px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
}

html.experience-v1 .manse-basis-head {
  margin-bottom: 22px !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .manse-basis-head h2 { font-size: 28px !important; }

html.experience-v1 .manse-pillars {
  overflow: hidden;
  border: 1px solid var(--ex-line-strong) !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(250, 252, 251, 0.68) !important;
}

html.experience-v1 .manse-row,
html.experience-v1 .manse-cell,
html.experience-v1 .manse-pillar-head {
  border-color: var(--ex-line) !important;
  background: transparent !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .manse-token,
html.experience-v1 .manse-row-token { font-family: "Noto Serif KR", "Batang", serif !important; }

html.experience-v1 .contextual-evidence-section {
  padding: 34px 20px 28px !important;
  border: 0 !important;
}

html.experience-v1 .contextual-evidence-section-head {
  margin-bottom: 16px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
}

html.experience-v1 .contextual-evidence-section-head h2 { color: var(--ex-ink) !important; font-size: 24px !important; }

html.experience-v1 .contextual-evidence-group,
html.experience-v1 .contextual-origin-group,
html.experience-v1 .contextual-evidence-card {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: transparent !important;
}

html.experience-v1 .contextual-evidence-summary-title,
html.experience-v1 .contextual-evidence-title-line {
  min-height: 60px !important;
  padding: 12px 0 !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .contextual-evidence-group-body,
html.experience-v1 .contextual-origin-detail,
html.experience-v1 .contextual-origin-details {
  padding: 4px 0 20px !important;
  color: var(--ex-ink-soft) !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
}

html.experience-v1 .contextual-keyword-group,
html.experience-v1 .contextual-origin-badge,
html.experience-v1 .manse-element-badge,
html.experience-v1 .manse-hidden-chip {
  border-color: var(--ex-line-strong) !important;
  border-radius: 999px !important;
  background: rgba(250, 252, 251, 0.65) !important;
  box-shadow: none !important;
}

html.experience-v1 body.is-detail-view .paper-card.contextual-palja-basis.manse-basis-card,
html.experience-v1 body.is-detail-view .contextual-evidence-groups {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 body.is-detail-view .contextual-evidence-group > summary {
  display: flex !important;
  align-items: center !important;
  min-height: 64px !important;
  padding: 8px 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 body.is-detail-view .contextual-evidence-summary-title {
  min-height: 0 !important;
  padding: 0 !important;
}

html.experience-v1 body.is-detail-view .contextual-evidence-group {
  margin: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
}

html.experience-v1 body.is-detail-view .contextual-keyword-groups {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  margin-top: 18px !important;
}

html.experience-v1 body.is-detail-view .contextual-keyword-group {
  display: grid !important;
  grid-template-columns: 66px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  min-width: 0 !important;
  min-height: 54px !important;
  padding: 11px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 body.is-detail-view .contextual-keyword-group b {
  color: var(--ex-amber-ink) !important;
  font-size: 11px !important;
  line-height: 1.6 !important;
  font-weight: 760 !important;
}

html.experience-v1 body.is-detail-view .contextual-keyword-group span {
  min-width: 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 12.5px !important;
  line-height: 1.72 !important;
  word-break: keep-all !important;
}

html.experience-v1 body.is-detail-view .report-content-personal-copy {
  font-size: 14.5px !important;
  line-height: 1.92 !important;
}

/* Topic content */
html.experience-v1 .report-content-topic-detail {
  padding: 0 !important;
  background: transparent !important;
}

html.experience-v1 .report-content-topic-hero {
  position: relative;
  display: grid;
  min-height: 226px !important;
  grid-template-rows: minmax(132px, auto) auto;
  margin: 0 !important;
  padding: 32px 22px 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .report-content-topic-hero-copy {
  position: relative;
  z-index: 2;
  width: min(68%, 270px);
}

html.experience-v1 .report-content-topic-hero-copy > span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ex-amber-ink) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 780 !important;
}

html.experience-v1 .report-content-topic-hero-copy > span::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .report-content-topic-hero h1,
html.experience-v1 .report-content-topic-hero h2 {
  max-width: 330px;
  color: var(--ex-ink) !important;
  font-size: 30px !important;
  line-height: 1.34 !important;
  font-weight: 840 !important;
  word-break: keep-all;
}

html.experience-v1 .report-content-topic-companion {
  position: absolute;
  z-index: 1;
  top: 34px;
  right: 13px;
  width: 118px;
  height: 118px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: contrast(1.05) saturate(0.88) drop-shadow(0 10px 17px rgba(37, 70, 87, 0.11));
}

html.experience-v1 .report-content-topic-companion.is-earth-calm {
  background-image: url("/assets/elements/states/element-earth-calm.png");
}

html.experience-v1 .report-content-topic-companion.is-metal-focused {
  background-image: url("/assets/elements/states/element-metal-focused.png");
}

html.experience-v1 .report-content-topic-tags {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 14px -22px 0;
  border-top: 1px solid var(--ex-line-strong);
  background: rgba(250, 252, 251, 0.52);
}

html.experience-v1 .report-content-topic-tags > span {
  position: relative;
  display: grid;
  min-height: 58px;
  place-items: center;
  padding: 10px 8px;
  color: var(--ex-ink-soft) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 690 !important;
  text-align: center;
  word-break: keep-all;
}

html.experience-v1 .report-content-topic-tags > span + span::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 1px;
  background: var(--ex-line);
}

html.experience-v1 .report-content-personal-result {
  margin: 0 !important;
  padding: 34px 22px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: rgba(250, 252, 251, 0.46) !important;
  box-shadow: none !important;
}

html.experience-v1 .report-content-personal-subtitle { color: var(--ex-amber-ink) !important; font-size: 11px !important; font-weight: 760 !important; }
html.experience-v1 .report-content-personal-result h2 { margin: 9px 0 20px !important; color: var(--ex-ink) !important; font-size: 25px !important; line-height: 1.4 !important; }
html.experience-v1 .report-content-personal-copy { color: var(--ex-ink-soft) !important; font-size: 14px !important; line-height: 1.9 !important; word-break: keep-all; }
html.experience-v1 .report-content-personal-copy p { margin: 0 0 18px !important; }

html.experience-v1 .report-content-topic-metrics {
  margin: 0 !important;
  padding: 32px 20px 28px !important;
  border: 0 !important;
  background: transparent !important;
}

html.experience-v1 .report-content-topic-bar,
html.experience-v1 .report-content-topic-metric { border-color: var(--ex-line) !important; background: transparent !important; }
html.experience-v1 .report-content-related-button { margin: 18px 20px 28px !important; border: 0 !important; border-top: 1px solid var(--ex-line-strong) !important; border-bottom: 1px solid var(--ex-line) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

html.experience-v1 body.is-detail-view .detail-root:has(> .contextual-palja-basis) {
  gap: 0 !important;
}

html.experience-v1 body.is-detail-view .contextual-palja-basis + .contextual-evidence-section {
  margin-top: 0 !important;
  padding-top: 24px !important;
}

/* More */
html.experience-v1 #more-root {
  display: flex !important;
  min-height: calc(100dvh - 62px - var(--ex-nav-height) - 84px);
  flex-direction: column;
  padding: 0 20px 16px !important;
  background: transparent !important;
}

html.experience-v1 .more-page-intro {
  min-height: 116px !important;
  margin: 0 -20px 20px !important;
  padding: 30px 22px 24px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .more-page-intro span { color: var(--ex-ink) !important; font-size: 27px !important; font-weight: 840 !important; }

html.experience-v1 .more-saved-section,
html.experience-v1 .more-input-section {
  margin: 0 0 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .more-section-button,
html.experience-v1 .more-birth-button,
html.experience-v1 .saved-profile-row {
  min-height: 72px !important;
  padding: 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 .more-section-icon,
html.experience-v1 .saved-profile-mark {
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  border: 1px solid rgba(47, 111, 218, 0.3) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ex-blue) !important;
}

html.experience-v1 .more-section-copy strong,
html.experience-v1 .saved-profile-copy strong { color: var(--ex-ink) !important; font-size: 14px !important; }
html.experience-v1 .more-section-copy small,
html.experience-v1 .saved-profile-copy small { color: var(--ex-ink-faint) !important; font-size: 10px !important; }
html.experience-v1 .more-section-action,
html.experience-v1 .saved-profile-recent { color: var(--ex-blue) !important; font-size: 10.5px !important; }

html.experience-v1 #more-root > .report-brand-continuity {
  margin-top: auto !important;
  padding-bottom: 12px !important;
}

/* Interaction polish: preserve the restrained visual language while making
   each actionable surface respond immediately to pointer and touch input. */
html.experience-v1 .report-primary-menu-card,
html.experience-v1 .report-content-feature,
html.experience-v1 .more-section-button,
html.experience-v1 .more-birth-button,
html.experience-v1 .saved-profile-row,
html.experience-v1 .domain-metric-overview-row,
html.experience-v1 .daily-fortune-row,
html.experience-v1 .share-sheet-option {
  transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease !important;
}

@media (hover: hover) {
  html.experience-v1 .report-primary-menu-card:hover,
  html.experience-v1 .report-content-feature:hover {
    border-color: rgba(45, 102, 189, 0.28) !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: 0 12px 28px rgba(24, 54, 67, 0.08) !important;
    transform: translateY(-2px);
  }

  html.experience-v1 .more-section-button:hover,
  html.experience-v1 .more-birth-button:hover,
  html.experience-v1 .saved-profile-row:hover,
  html.experience-v1 .domain-metric-overview-row:hover,
  html.experience-v1 .daily-fortune-row:hover,
  html.experience-v1 .share-sheet-option:hover {
    background: rgba(255, 255, 255, 0.56) !important;
  }
}

html.experience-v1 .report-primary-menu-card:active,
html.experience-v1 .report-content-feature:active,
html.experience-v1 .more-section-button:active,
html.experience-v1 .more-birth-button:active,
html.experience-v1 .saved-profile-row:active,
html.experience-v1 .domain-metric-overview-row:active,
html.experience-v1 .daily-fortune-row:active,
html.experience-v1 .share-sheet-option:active {
  transform: scale(0.988);
}

/* Sheets, toast and transition */
html.experience-v1 .share-sheet,
html.experience-v1 .saved-profile-manager,
html.experience-v1 .page-transition-loader { position: fixed !important; z-index: 80 !important; }

html.experience-v1 .share-sheet-panel,
html.experience-v1 .saved-profile-manager-panel {
  width: min(calc(100% - 24px), 406px) !important;
  border: 1px solid var(--ex-line-strong) !important;
  border-radius: var(--ex-radius) var(--ex-radius) 0 0 !important;
  background: rgba(250, 252, 251, 0.98) !important;
  color: var(--ex-ink) !important;
  box-shadow: 0 -18px 44px rgba(24, 54, 67, 0.18) !important;
}

html.experience-v1 .share-sheet-header,
html.experience-v1 .saved-profile-manager-header { border-color: var(--ex-line) !important; }
html.experience-v1 .share-sheet-option { border-color: var(--ex-line) !important; background: transparent !important; }
html.experience-v1 .share-sheet-option-icon { border: 1px solid rgba(47, 111, 218, 0.3) !important; border-radius: 50% !important; background: transparent !important; color: var(--ex-blue) !important; }
html.experience-v1 .share-sheet-option-copy strong { color: var(--ex-ink) !important; }
html.experience-v1 .share-sheet-option-copy small { color: var(--ex-ink-faint) !important; }

html.experience-v1 .page-transition-loader {
  background: rgba(238, 244, 246, 0.92) !important;
  backdrop-filter: blur(18px) saturate(120%);
}

html.experience-v1 .page-transition-loader-inner {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ex-ink) !important;
}

html.experience-v1 .page-transition-brand-mark {
  display: grid !important;
  place-items: center !important;
  width: 74px !important;
  height: 74px !important;
  overflow: visible !important;
  border: 1px solid rgba(47, 111, 218, 0.28) !important;
  border-radius: 50% !important;
  background: rgba(250, 252, 251, 0.7) !important;
}

html.experience-v1 .page-transition-brand-mark img { width: 62px !important; height: 62px !important; object-fit: contain !important; }
html.experience-v1 .page-transition-dots i { background: var(--ex-blue) !important; }

html.experience-v1 .toast {
  position: fixed !important;
  z-index: 90 !important;
  right: 18px !important;
  bottom: calc(var(--ex-nav-height) + 18px + env(safe-area-inset-bottom)) !important;
  left: 18px !important;
  max-width: 394px !important;
  margin: 0 auto !important;
  border-radius: var(--ex-radius) !important;
  background: rgba(16, 37, 50, 0.94) !important;
  color: #fff !important;
}

html.experience-v1 .report-brand-continuity {
  padding: 20px !important;
  border: 0 !important;
  background: transparent !important;
  text-align: center;
}

/* Grade palette: B- and higher read blue, middle stays restrained, caution is warm. */
html.experience-v1 .metric-grade-a-plus,
html.experience-v1 .metric-grade-a,
html.experience-v1 .metric-grade-a-minus,
html.experience-v1 .metric-grade-b-plus,
html.experience-v1 .metric-grade-b,
html.experience-v1 .metric-grade-b-minus {
  --metric-bar-color: #4f8bd5 !important;
  --metric-bar-ink: #2f6fba !important;
}

html.experience-v1 .metric-grade-c-plus,
html.experience-v1 .metric-grade-c,
html.experience-v1 .metric-grade-c-minus {
  --metric-bar-color: #7f939c !important;
  --metric-bar-ink: #586c75 !important;
}

html.experience-v1 .metric-grade-d-plus,
html.experience-v1 .metric-grade-d,
html.experience-v1 .metric-grade-d-minus {
  --metric-bar-color: #cb8057 !important;
  --metric-bar-ink: #a95e38 !important;
}

/* Product-light has a more specific card rule for detail radars. Keep the
   experience layout unframed so the chart reads as part of the page story. */
html.experience-v1 body.is-detail-view .domain-radar-section,
html.experience-v1 body.is-detail-view .report-personality-dashboard .domain-radar-section {
  margin: 0 !important;
  padding: 28px 10px 30px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ex-line) !important;
  border-radius: 0 !important;
  background: rgba(250, 252, 251, 0.38) !important;
  box-shadow: none !important;
}

html.experience-v1 body.is-report-view .report-primary-menu-card > .has-report-icon,
html.experience-v1 body.is-report-view .report-primary-menu-card > .has-report-icon::before,
html.experience-v1 body.is-report-view .report-content-feature > .report-content-topic-icon {
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Experience-led domain details: meaning first, full metrics on demand. */
html.experience-v1 body.is-detail-view .personality-domain-detail,
html.experience-v1 body.is-detail-view .topic-domain-detail {
  --detail-accent: var(--ex-blue);
  --detail-accent-ink: #2f6fba;
  --detail-accent-soft: rgba(79, 139, 213, 0.09);
}

html.experience-v1 body.is-detail-view .topic-domain-money,
html.experience-v1 body.is-detail-view .topic-domain-social {
  --detail-accent: #4f977f;
  --detail-accent-ink: #2f715f;
  --detail-accent-soft: rgba(79, 151, 127, 0.09);
}

html.experience-v1 body.is-detail-view .topic-domain-career,
html.experience-v1 body.is-detail-view .topic-domain-honor {
  --detail-accent: #c18a3f;
  --detail-accent-ink: #8c6229;
  --detail-accent-soft: rgba(193, 138, 63, 0.1);
}

html.experience-v1 body.is-detail-view .topic-domain-love,
html.experience-v1 body.is-detail-view .topic-domain-marriage {
  --detail-accent: #b57870;
  --detail-accent-ink: #8d544d;
  --detail-accent-soft: rgba(181, 120, 112, 0.09);
}

html.experience-v1 .experience-domain-hero {
  position: relative;
  min-height: 258px;
  padding: 30px 22px 0 !important;
  overflow: hidden;
  border-bottom: 1px solid var(--ex-line-strong) !important;
  background:
    linear-gradient(145deg, var(--detail-accent-soft), transparent 54%),
    rgba(250, 252, 251, 0.64) !important;
}

html.experience-v1 .experience-domain-hero-copy {
  position: relative;
  z-index: 2;
  width: min(72%, 276px);
  min-height: 142px;
}

html.experience-v1 .experience-domain-hero-copy > span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--detail-accent-ink);
  font-size: 11px;
  line-height: 1.4;
  font-weight: 780;
}

html.experience-v1 .experience-domain-hero-copy > span::before {
  content: "";
  width: 20px;
  height: 2px;
  background: currentColor;
}

html.experience-v1 .experience-domain-hero-copy h2 {
  max-width: 260px;
  margin: 8px 0 10px !important;
  color: var(--ex-ink) !important;
  font-size: 29px !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  word-break: keep-all;
}

html.experience-v1 .experience-domain-hero-copy p {
  margin: 0 !important;
  color: var(--ex-ink-soft) !important;
  font-size: 14px !important;
  line-height: 1.68 !important;
  font-weight: 520 !important;
  word-break: keep-all;
}

html.experience-v1 .experience-domain-companion {
  position: absolute;
  z-index: 1;
  top: 34px;
  right: 13px;
  width: 124px;
  height: 124px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: contrast(1.05) saturate(0.9) drop-shadow(0 10px 17px rgba(37, 70, 87, 0.11));
}

html.experience-v1 .experience-domain-companion.is-wood-curious { background-image: url("/assets/elements/states/element-wood-curious.png"); }
html.experience-v1 .experience-domain-companion.is-earth-calm { background-image: url("/assets/elements/states/element-earth-calm.png"); }
html.experience-v1 .experience-domain-companion.is-metal-focused { background-image: url("/assets/elements/states/element-metal-focused.png"); }
html.experience-v1 .experience-domain-companion.is-fire-bright { background-image: url("/assets/elements/states/element-fire-bright.png"); }
html.experience-v1 .experience-domain-companion.is-earth-comfort { background-image: url("/assets/elements/states/element-earth-comfort.png"); }
html.experience-v1 .experience-domain-companion.is-fire-confident { background-image: url("/assets/elements/states/element-fire-confident.png"); }
html.experience-v1 .experience-domain-companion.is-wood-bright { background-image: url("/assets/elements/states/element-wood-bright.png"); }

html.experience-v1 .experience-domain-keywords {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 18px -22px 0;
  border-top: 1px solid color-mix(in srgb, var(--detail-accent) 22%, var(--ex-line));
  background: rgba(250, 252, 251, 0.55);
}

html.experience-v1 .experience-domain-keywords > div {
  position: relative;
  min-width: 0;
  min-height: 92px;
  padding: 14px 12px 13px;
}

html.experience-v1 .experience-domain-keywords > div + div::before {
  content: "";
  position: absolute;
  top: 15px;
  bottom: 15px;
  left: 0;
  width: 1px;
  background: var(--ex-line);
}

html.experience-v1 .experience-domain-keywords b,
html.experience-v1 .experience-domain-keywords span,
html.experience-v1 .experience-domain-keywords em {
  display: block;
  min-width: 0;
  letter-spacing: 0;
  word-break: keep-all;
}

html.experience-v1 .experience-domain-keywords b {
  padding-right: 29px;
  color: var(--ex-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 780 !important;
}

html.experience-v1 .experience-domain-keywords span {
  margin-top: 6px;
  color: var(--ex-ink-soft) !important;
  font-size: 11px !important;
  line-height: 1.42 !important;
  font-weight: 610 !important;
}

html.experience-v1 .experience-domain-keywords em {
  position: absolute;
  top: 12px;
  right: 10px;
  color: var(--metric-bar-ink, var(--detail-accent-ink)) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 820 !important;
}

html.experience-v1 .experience-domain-stories {
  border-bottom: 1px solid var(--ex-line-strong);
}

html.experience-v1 .experience-domain-story {
  padding: 30px 22px 32px !important;
  border-bottom: 1px solid var(--ex-line) !important;
  background: rgba(250, 252, 251, 0.72) !important;
}

html.experience-v1 .experience-domain-story:nth-child(2) {
  background: rgba(238, 244, 246, 0.56) !important;
}

html.experience-v1 .experience-domain-story:last-child { border-bottom: 0 !important; }

html.experience-v1 .experience-domain-story > span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--detail-accent-ink) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 780 !important;
}

html.experience-v1 .experience-domain-story > span::before {
  content: "";
  width: 18px;
  height: 2px;
  background: var(--detail-accent);
}

html.experience-v1 .experience-domain-story h3 {
  margin: 10px 0 14px !important;
  color: var(--ex-ink) !important;
  font-size: 23px !important;
  line-height: 1.35 !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
  word-break: keep-all;
}

html.experience-v1 .experience-domain-story p {
  max-width: 356px;
  margin: 0 0 13px !important;
  color: var(--ex-ink-soft) !important;
  font-size: 15px !important;
  line-height: 1.82 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  word-break: keep-all;
}

html.experience-v1 .experience-domain-story p:last-child { margin-bottom: 0 !important; }
html.experience-v1 .experience-domain-story strong { color: var(--ex-ink) !important; font-weight: 760 !important; }

html.experience-v1 .domain-metric-overview.is-collapsed-all {
  padding: 24px 20px 32px !important;
}

html.experience-v1 .domain-metric-overview.is-collapsed-all .domain-metric-overview-list {
  border-top: 1px solid var(--ex-line-strong) !important;
  border-bottom: 1px solid var(--ex-line-strong) !important;
}

html.experience-v1 .domain-metric-overview-rest.is-full-disclosure {
  margin: 0 !important;
  border-top: 0 !important;
}

html.experience-v1 .domain-metric-overview-rest.is-full-disclosure > .domain-metric-overview-rest-toggle {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) 18px !important;
  gap: 12px !important;
  align-items: center !important;
  min-height: 76px !important;
  padding: 9px 8px !important;
  color: var(--detail-accent-ink) !important;
  text-align: left !important;
}

html.experience-v1 .experience-metric-guide {
  display: block !important;
  width: 48px;
  height: 48px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: contrast(1.08) saturate(0.86) drop-shadow(0 4px 7px rgba(37, 70, 87, 0.12));
  transform-origin: 50% 78%;
}

html.experience-v1 .experience-metric-guide.is-metal-focused {
  background-image: url("/assets/elements/states/element-metal-focused.png");
}

html.experience-v1 .domain-metric-overview-rest.is-full-disclosure.is-expanded .experience-metric-guide {
  animation: experience-guide-confirm 520ms cubic-bezier(.2,.75,.2,1) both;
}

html.experience-v1 .domain-metric-overview-rest.is-full-disclosure .domain-metric-overview-rest-toggle > span:nth-child(2) {
  color: var(--ex-ink) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 760 !important;
}

html.experience-v1 .domain-metric-overview-rest.is-full-disclosure .domain-metric-overview-rest-close {
  color: var(--detail-accent-ink) !important;
}

@keyframes experience-guide-confirm {
  0% { transform: translateY(0) rotate(0); }
  42% { transform: translateY(-3px) rotate(-3deg); }
  72% { transform: translateY(-1px) rotate(2deg); }
  100% { transform: translateY(0) rotate(0); }
}

/* Shared result links briefly restore their saved payload before the app shell
   mounts. Keep that transition in the same quiet visual language as the app. */
html.experience-v1.is-restoring-premium body::after {
  content: "분석 결과를 정리하고 있습니다" !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 142px 24px 24px !important;
  background:
    radial-gradient(circle at 50% 43%, rgba(80, 128, 188, 0.12), transparent 172px),
    linear-gradient(180deg, #f8fafc 0%, #eef3f8 100%) !important;
  color: #516174 !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

html.experience-v1.is-restoring-premium body::before {
  content: "";
  position: fixed;
  top: calc(50% - 58px);
  left: 50%;
  z-index: 12001;
  display: block;
  width: 96px;
  height: 96px;
  border: 1px solid rgba(76, 119, 174, 0.24);
  border-radius: 24px;
  background-color: rgba(255, 255, 255, 0.92);
  background-image: url("/hyunmyeong-icon-192.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 86px 86px;
  box-shadow: 0 18px 48px rgba(52, 78, 108, 0.12), inset 0 0 0 5px rgba(86, 134, 194, 0.025);
  transform: translate(-50%, -50%);
  animation: experience-restore-breathe 1.6s ease-in-out infinite;
}

@keyframes experience-restore-breathe {
  0%, 100% { transform: translate(-50%, -50%) scale(0.96); opacity: 0.76; }
  50% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

/* Responsive safeguards */
@media (min-width: 700px) {
  html.experience-v1 body { padding: 28px 0 !important; }
  html.experience-v1 .site-stage { min-height: calc(100dvh - 56px) !important; border-radius: 16px; }
  html.experience-v1 .screen { min-height: calc(100dvh - 56px) !important; }
  html.experience-v1 .bottom-nav { bottom: 28px !important; border-radius: 0 0 16px 16px; }
  html.experience-v1 #more-root { min-height: calc(100dvh - 56px - 62px - var(--ex-nav-height) - 84px); }
}

@media (max-width: 370px) {
  html.experience-v1 .intro-hero-title { font-size: 33px !important; }
  html.experience-v1 .input-identity-editor { grid-template-columns: 1fr !important; }
  html.experience-v1 .daily-home-overview {
    grid-template-columns: minmax(0, 1fr) 116px !important;
    min-height: 372px !important;
    padding-inline: 18px !important;
  }
  html.experience-v1 .daily-home-intro h1 { max-width: 200px; font-size: 24px !important; }
  html.experience-v1 .daily-home-gauge,
  html.experience-v1 .daily-home-gauge svg { width: 116px !important; }
  html.experience-v1 .daily-home-score-number strong { font-size: 40px !important; }
  html.experience-v1 .daily-home-guidance { margin-inline: 11px !important; padding-inline: 14px !important; }
  html.experience-v1 .daily-home-focus article { padding-right: 10px !important; }
  html.experience-v1 .daily-home-focus article + article { padding-left: 12px !important; }
  html.experience-v1 .daily-home-focus article > strong { font-size: 15px !important; }
  html.experience-v1 .report-primary-menu-grid { grid-auto-columns: 76% !important; }
  html.experience-v1 .domain-metric-overview-row { grid-template-columns: 32px 78px minmax(46px, 1fr) 36px 14px !important; gap: 6px !important; }
  html.experience-v1 .domain-metric-overview-explanation { padding-left: 38px !important; }
  html.experience-v1 .experience-domain-hero { padding-inline: 18px !important; }
  html.experience-v1 .experience-domain-hero-copy { width: 62%; min-height: 164px; }
  html.experience-v1 .experience-domain-hero-copy h2 { font-size: 26px !important; }
  html.experience-v1 .experience-domain-hero-copy p { font-size: 13px !important; }
  html.experience-v1 .experience-domain-companion { top: 62px; right: 0; width: 106px; height: 106px; }
  html.experience-v1 .experience-domain-keywords { margin-inline: -18px; }
  html.experience-v1 .experience-domain-keywords > div { min-height: 96px; padding-inline: 9px; }
  html.experience-v1 .experience-domain-keywords b { padding-right: 0; font-size: 11px !important; }
  html.experience-v1 .experience-domain-keywords span { font-size: 10px !important; }
  html.experience-v1 .experience-domain-keywords em { position: static; margin-top: 4px; }
  html.experience-v1 .experience-domain-story { padding-inline: 18px !important; }
  html.experience-v1 .experience-domain-story h3 { font-size: 21px !important; }
  html.experience-v1 .experience-domain-story p { font-size: 14px !important; }
  html.experience-v1 .report-content-topic-hero { min-height: 226px !important; padding-inline: 18px !important; }
  html.experience-v1 .report-content-topic-hero-copy { width: 72%; }
  html.experience-v1 .report-content-topic-hero h2 { font-size: 23px !important; line-height: 1.28 !important; }
  html.experience-v1 .report-content-topic-companion { top: 60px; right: 0; width: 88px; height: 88px; }
  html.experience-v1 .report-content-topic-tags { margin-inline: -18px; }
  html.experience-v1 .report-content-topic-tags > span { font-size: 10px !important; }
  html.experience-v1 .domain-metric-overview-rest.is-full-disclosure > .domain-metric-overview-rest-toggle {
    grid-template-columns: 42px minmax(0, 1fr) 16px !important;
    gap: 8px !important;
    padding-inline: 6px !important;
  }
  html.experience-v1 .experience-metric-guide {
    width: 42px;
    height: 42px;
  }
  html.experience-v1 .domain-metric-overview-rest.is-full-disclosure .domain-metric-overview-rest-toggle > span:nth-child(2) {
    font-size: 13px !important;
    white-space: nowrap;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.experience-v1 *,
  html.experience-v1 *::before,
  html.experience-v1 *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html.experience-v1 .experience-energy-canvas { display: none !important; }
}

/* Integrated topic radar v1.
   The type title, radar, representative character and three summaries form
   one complete opening section instead of separate stacked panels. */
html.experience-v1 body.is-detail-view .experience-domain-hero {
  min-height: 0;
  padding: 26px 22px 0 !important;
}

html.experience-v1 body.is-detail-view .experience-domain-hero-copy {
  width: 100%;
  min-height: 0;
}

html.experience-v1 body.is-detail-view .experience-domain-hero-copy h2 {
  max-width: none;
}

html.experience-v1 body.is-detail-view .experience-domain-hero-copy p {
  max-width: 440px;
}

html.experience-v1 body.is-detail-view .experience-domain-visual {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  align-items: center;
  gap: 12px;
  min-width: 0;
  margin: 12px 0 4px;
}

html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section {
  position: relative !important;
  width: min(100%, 330px) !important;
  height: 276px !important;
  min-height: 276px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section::before {
  display: none !important;
  content: none !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section > .report-radar-plot {
  position: absolute !important;
  top: 34px !important;
  left: 50% !important;
  display: block !important;
  width: min(76%, 250px) !important;
  height: auto !important;
  aspect-ratio: 6 / 5;
  margin: 0 !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption {
  width: clamp(74px, 28%, 92px) !important;
  gap: 3px !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-0 {
  top: 0 !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-1,
html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-5 {
  top: 45px !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-2,
html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-4 {
  bottom: 43px !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-3 {
  bottom: 0 !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-label {
  font-size: 10.5px !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-grade-bg {
  min-width: 28px !important;
  width: auto !important;
  height: 21px !important;
  padding: 0 5px !important;
}

html.experience-v1 body.is-detail-view .experience-domain-visual .experience-domain-companion {
  position: relative;
  top: auto;
  right: auto;
  width: 112px;
  height: 112px;
  justify-self: end;
}

html.experience-v1 body.is-detail-view .experience-domain-hero .experience-domain-keywords {
  margin-top: 10px;
}

@media (max-width: 520px) {
  html.experience-v1 body.is-detail-view .experience-domain-visual {
    grid-template-columns: minmax(0, 1fr) 80px;
    gap: 8px;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section {
    height: 252px !important;
    min-height: 252px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section > .report-radar-plot {
    top: 33px !important;
    width: 76% !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption {
    width: clamp(68px, 31%, 82px) !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-1,
  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-5 {
    top: 42px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-2,
  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption.is-axis-4 {
    bottom: 40px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-label {
    font-size: 9.7px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .experience-domain-companion {
    width: 80px;
    height: 80px;
  }
}

@media (max-width: 370px) {
  html.experience-v1 body.is-detail-view .experience-domain-hero-copy {
    width: 100%;
    min-height: 0;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual {
    grid-template-columns: minmax(0, 1fr) 66px;
    gap: 4px;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual > .domain-radar-section {
    height: 232px !important;
    min-height: 232px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-caption {
    width: 64px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .report-radar-label {
    font-size: 9px !important;
  }

  html.experience-v1 body.is-detail-view .experience-domain-visual .experience-domain-companion {
    top: auto;
    right: auto;
    width: 66px;
    height: 66px;
  }
}