/* SAJUROK · Scientific Myeongri Observatory · sitewide layer
 * Page-specific Hero Objects with a shared archival UI language.
 * Loaded by v2-chrome.js; calculation, payment and binder markup stays intact.
 */
:root {
  --obs-void: #070a0b;
  --obs-graphite: #111516;
  --obs-paper: #f0ece1;
  --obs-paper-muted: rgba(240, 236, 225, .66);
  --obs-line: rgba(240, 236, 225, .18);
  --obs-brass: #bea260;
  --obs-brass-hi: #e1ca8b;
  --obs-seal: #9e3731;
  --obs-mono: "JetBrains Mono", "DM Mono", monospace;
}

body.obs-site {
  /* Lock the complete page to the Observatory theme. Legacy page styles
   * continue to work through this semantic-token bridge. */
  --C-paper: #0a0c0e;
  --C-paper-2: #14181b;
  --C-paper-3: #1a1f22;
  --C-ink: #eeeae1;
  --C-ink-1: #eeeae1;
  --C-ink-2: #c8c3b8;
  --C-ink-3: #918d84;
  --C-line: rgba(226, 214, 190, .14);
  --C-line-1: rgba(226, 214, 190, .14);
  --C-line-2: rgba(226, 214, 190, .28);
  --C-gold: #c2a56b;
  --C-gold-2: #e0c488;
  --C-seal: #d16a60; /* 2026-10-30 대비: #a9473f(3.1:1) → 5:1 이상 */
  color: var(--C-ink);
  background: var(--C-paper);
  color-scheme: dark;
}

/* The Hero image owns atmosphere. The lower UI must not repeat a fixed
 * background photo or synthetic grain across every page. */
body.obs-site:not([data-page="home"])::before,
body.obs-site:not([data-page="home"])::after { content: none !important; }

body.obs-site :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--obs-brass-hi);
  outline-offset: 3px;
}
body.obs-site main :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline-color: var(--C-gold-2);
}

body.obs-site .v2-nav {
  background: rgba(7, 10, 11, .97);
  border-bottom-color: var(--obs-line);
}
body.obs-site .v2-nav .v2-logo-svg > text { fill: var(--obs-paper); }
body.obs-site .v2-nav .v2-logo-svg g rect:first-child { fill: transparent; stroke: var(--obs-brass); stroke-width: 9; }
body.obs-site .v2-nav .v2-logo-svg g rect:nth-child(2) { fill: none; stroke: var(--obs-brass); }
body.obs-site .v2-nav .v2-logo-svg g text { fill: var(--obs-brass-hi); }
body.obs-site .v2-nav-links a,
body.obs-site .v2-nav-ghost { color: rgba(240, 236, 225, .62); }
body.obs-site .v2-nav-links a:hover,
body.obs-site .v2-nav-links a.is-active { color: var(--obs-paper); }
body.obs-site .v2-nav-links .new { color: var(--obs-brass-hi); }
body.obs-site .v2-nav-links > span { background: var(--obs-line) !important; }
body.obs-site .v2-nav-cta {
  color: #0b0d0e;
  background: var(--obs-brass-hi);
  border: 1px solid var(--obs-brass-hi);
  border-radius: 0;
  box-shadow: none;
}
body.obs-site .v2-nav-cta:hover { color: #0b0d0e; background: var(--obs-paper); transform: translateY(-1px); }
body.obs-site .v2-nav-cta:hover .new { color: #0b0d0e !important; }

.obs-page-hero {
  --obs-copy-side: left;
  position: relative;
  min-height: clamp(650px, 82dvh, 850px);
  overflow: hidden;
  isolation: isolate;
  color: var(--obs-paper);
  background: var(--obs-void);
  border-bottom: 1px solid rgba(190, 162, 96, .42);
}
.obs-page-hero__asset,
.obs-page-hero__shade { position: absolute; inset: 0; pointer-events: none; }
.obs-page-hero__asset { z-index: -3; overflow: hidden; }
.obs-page-hero__asset picture { display: block; width: 100%; height: 100%; }
.obs-page-hero__asset img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--obs-object-position, center);
  filter: saturate(.72) brightness(.8) contrast(1.06);
  transform: scale(1.035) translate3d(calc(var(--obs-px, 0) * 9px), calc(var(--obs-py, 0) * 6px), 0);
  transition: transform 700ms cubic-bezier(.16, 1, .3, 1);
}
.obs-page-hero__shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(4,6,7,.93) 0%, rgba(4,6,7,.74) 31%, rgba(4,6,7,.14) 58%, rgba(4,6,7,.52) 100%),
    linear-gradient(0deg, rgba(4,6,7,.9) 0%, transparent 45%),
    linear-gradient(180deg, rgba(4,6,7,.26), transparent 26%);
}
.obs-page-hero.is-copy-right .obs-page-hero__shade {
  background:
    linear-gradient(90deg, rgba(4,6,7,.24) 0%, rgba(4,6,7,.08) 45%, rgba(4,6,7,.76) 65%, rgba(4,6,7,.96) 100%),
    linear-gradient(0deg, rgba(4,6,7,.86), transparent 42%);
}
.obs-page-hero__inner {
  position: relative;
  z-index: 4;
  width: min(100% - 84px, 1380px);
  min-height: inherit;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 520px);
  align-items: center;
  padding: 78px 0 124px;
}
.obs-page-hero.is-copy-right .obs-page-hero__inner { grid-template-columns: 1fr minmax(420px, 500px); }
.obs-page-hero__copy { max-width: 545px; }
.obs-page-hero.is-copy-right .obs-page-hero__copy { grid-column: 2; }
.obs-page-hero__eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  color: var(--obs-brass-hi);
  font: 500 10px/1 var(--obs-mono);
  letter-spacing: .16em;
}
.obs-page-hero__eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--obs-brass); }
.obs-page-hero :is(h1, .obs-page-hero__title) {
  margin: 0;
  color: var(--obs-paper);
  font-family: var(--font-serif-kr, "Noto Serif KR", serif);
  font-size: clamp(46px, 5.2vw, 78px);
  font-weight: 300;
  line-height: 1.13;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.obs-page-hero :is(h1, .obs-page-hero__title) em { color: var(--obs-brass-hi); font-style: normal; font-weight: 400; }
.obs-page-hero__desc {
  max-width: 480px;
  margin: 20px 0 0;
  color: rgba(240, 236, 225, .74);
  font-size: 14px;
  line-height: 1.85;
  word-break: keep-all;
}
.obs-page-hero__metrics {
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--obs-brass);
  border-bottom: 1px solid var(--obs-line);
}
.obs-page-hero__metric { min-height: 72px; padding: 13px 12px 12px 0; border-right: 1px solid var(--obs-line); }
.obs-page-hero__metric + .obs-page-hero__metric { padding-left: 14px; }
.obs-page-hero__metric:last-child { border-right: 0; }
.obs-page-hero__metric small { display: block; color: var(--obs-paper-muted); font: 400 7px/1 var(--obs-mono); letter-spacing: .11em; }
.obs-page-hero__metric b { display: block; margin-top: 9px; color: var(--obs-paper); font-size: 15px; font-weight: 400; }
.obs-page-hero__actions { display: flex; align-items: center; gap: 19px; margin-top: 28px; }
.obs-page-action {
  min-width: 218px;
  min-height: 56px;
  display: grid;
  grid-template-columns: 1fr 56px;
  align-items: center;
  color: var(--obs-paper);
  border: 1px solid rgba(225,202,139,.72);
  background: rgba(7,10,11,.86);
  box-shadow: inset 3px 0 0 var(--obs-brass);
  text-decoration: none;
}
.obs-page-action span { padding-left: 17px; font-size: 13px; white-space: nowrap; }
.obs-page-action b { align-self: stretch; display: grid; place-items: center; border-left: 1px solid var(--obs-line); color: var(--obs-brass-hi); font-size: 18px; font-weight: 400; }
.obs-page-action:hover { color: var(--obs-void); background: var(--obs-brass-hi); }
.obs-page-action:hover b { color: var(--obs-void); border-left-color: rgba(7,10,11,.24); }
.obs-page-action:focus-visible,
.obs-page-link:focus-visible { outline: 2px solid var(--obs-paper); outline-offset: 4px; }
.obs-page-link { color: var(--obs-paper-muted); font-size: 11px; text-underline-offset: 5px; display: inline-flex; align-items: center; min-height: 44px; } /* 2026-10-30 탭 타깃 13px → 44px */
.obs-price { display: flex; align-items: center; gap: 12px; margin-top: 22px; }
.obs-price strong { color: var(--obs-paper); font-size: 28px; font-weight: 400; }
.obs-price del { color: rgba(240,236,225,.68); font-size: 13px; }
.obs-price span { padding: 7px 9px; color: #fff; background: #9e3731; font-size: 10px; font-weight: 700; }

.obs-page-hero__rail {
  position: absolute;
  z-index: 6;
  left: 42px;
  right: 42px;
  bottom: 28px;
  min-height: 66px;
  display: grid;
  grid-template-columns: 1.2fr repeat(4, 1fr);
  border-top: 1px solid var(--obs-brass);
  border-bottom: 1px solid var(--obs-line);
  background: rgba(7,10,11,.74);
}
.obs-page-hero__rail > span { display: flex; align-items: center; color: var(--obs-brass); font: 400 8px/1 var(--obs-mono); letter-spacing: .15em; }
.obs-page-hero__rail > span,
.obs-page-hero__rail > div { padding: 0 17px; }
.obs-page-hero__rail > div { display: grid; align-content: center; gap: 6px; border-left: 1px solid var(--obs-line); }
.obs-page-hero__rail b { font-size: 14px; font-weight: 500; }
.obs-page-hero__rail small { color: var(--obs-paper-muted); font-size: 9px; }
.obs-page-hero__rail .is-current { background: rgba(190,162,96,.11); box-shadow: inset 0 -2px var(--obs-brass-hi); }
.obs-page-hero__rail .is-current b { color: var(--obs-brass-hi); }

/* Palja uses four physical pillars as separate depth layers. */
.obs-kind-palja { --obs-object-position: 58% center; }
.obs-kind-palja .obs-pillar-rack { position: absolute; z-index: 2; left: 43%; right: 1%; top: 13%; bottom: 8%; pointer-events: none; }
.obs-kind-palja .obs-pillar-rack figure { --x: 0%; --y: 0px; position: absolute; left: var(--x); bottom: var(--y); width: 28%; margin: 0; opacity: .48; filter: brightness(.72) saturate(.62); transition: opacity 350ms ease, filter 350ms ease, transform 550ms cubic-bezier(.16,1,.3,1); }
.obs-kind-palja .obs-pillar-rack figure:nth-child(1) { --x: 2%; --y: 88px; }
.obs-kind-palja .obs-pillar-rack figure:nth-child(2) { --x: 24%; --y: 58px; width: 30%; }
.obs-kind-palja .obs-pillar-rack figure:nth-child(3) { --x: 48%; --y: 29px; width: 31%; }
.obs-kind-palja .obs-pillar-rack figure:nth-child(4) { --x: 72%; --y: 0px; }
.obs-kind-palja .obs-pillar-rack figure.is-active { opacity: 1; filter: brightness(1.08) saturate(.84) drop-shadow(0 6px 8px rgba(0,0,0,.5)); transform: translateY(-7px); }
.obs-kind-palja .obs-pillar-rack img { width: 100%; height: auto; display: block; filter: url(#obs-pillar-cutout); }

/* Utility scenes are explanatory instruments, not mood geometry. */
.obs-utility-scene { position: absolute; z-index: 2; right: 5%; top: 19%; width: min(48vw, 690px); min-height: 390px; pointer-events: none; }
.obs-calendar-board { padding: 28px; border: 1px solid rgba(225,202,139,.42); background: #101415; box-shadow: 0 34px 70px rgba(0,0,0,.48); transform: perspective(900px) rotateY(-9deg) rotateX(4deg); }
.obs-calendar-board header { display: flex; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--obs-brass); color: var(--obs-brass-hi); font: 400 11px/1 var(--obs-mono); letter-spacing: .12em; }
.obs-calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); }
.obs-calendar-grid span { min-height: 55px; display: grid; place-items: center; border-right: 1px solid var(--obs-line); border-bottom: 1px solid var(--obs-line); color: var(--obs-paper-muted); font: 400 11px/1 var(--obs-mono); }
.obs-calendar-grid span:nth-child(7n) { border-right: 0; }
.obs-calendar-grid span.good { color: var(--obs-brass-hi); box-shadow: inset 0 0 0 1px var(--obs-brass); }
.obs-cycle-rail { position: absolute; left: 4%; right: 0; top: 45%; height: 86px; border-top: 1px solid var(--obs-brass); border-bottom: 1px solid var(--obs-line); transform: perspective(800px) rotateY(-8deg); }
.obs-cycle-rail::before { content: ""; position: absolute; left: 12%; right: 7%; top: 42px; height: 3px; background: linear-gradient(90deg, #34393a 0 30%, var(--obs-brass) 30% 68%, #34393a 68%); }
.obs-cycle-rail i { position: absolute; top: 26px; width: 31px; height: 31px; border: 1px solid var(--obs-line); background: #0b0e0f; transform: rotate(45deg); }
.obs-cycle-rail i:nth-child(1) { left: 28%; }
.obs-cycle-rail i:nth-child(2) { left: 50%; border-color: var(--obs-brass-hi); background: var(--obs-brass); }
.obs-cycle-rail i:nth-child(3) { left: 71%; }
.obs-name-wave { position: absolute; inset: 16% 0 8%; background: linear-gradient(var(--obs-line) 1px, transparent 1px) 0 0 / 100% 52px; }
.obs-name-wave::before,
.obs-name-wave::after { content: ""; position: absolute; left: 4%; right: 3%; top: 45%; height: 3px; transform-origin: center; }
.obs-name-wave::before { background: linear-gradient(90deg, transparent, #6d7e84 16%, var(--obs-paper) 45%, #6d7e84 78%, transparent); transform: skewY(8deg); }
.obs-name-wave::after { background: linear-gradient(90deg, transparent, #7e6845 18%, var(--obs-brass-hi) 52%, #7e6845 82%, transparent); transform: skewY(-8deg); }
.obs-zodiac-index { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--obs-brass); border-left: 1px solid var(--obs-line); transform: perspective(900px) rotateY(-7deg); }
.obs-zodiac-index span { min-height: 92px; display: grid; place-items: center; border-right: 1px solid var(--obs-line); border-bottom: 1px solid var(--obs-line); color: rgba(240,236,225,.56); background: rgba(7,10,11,.76); font-size: 27px; }
.obs-zodiac-index span.is-year { color: var(--obs-brass-hi); background: rgba(190,162,96,.13); }

/* Existing content joins the language without erasing its information architecture. */
body.obs-site main:not(.obs-page-hero) { position: relative; }
body.obs-site .v2-wrap,
body.obs-site .v2-wrap-narrow,
body.obs-site .C-wrap { scroll-margin-top: 90px; }
body.obs-site #paljaForm,
body.obs-site #compatForm,
body.obs-site #pg-form,
body.obs-site #py-form,
body.obs-site #wl-form-section,
body.obs-site #td-form-section { scroll-margin-top: 84px; }
body.obs-site .v2-section,
body.obs-site .tool-guide,
body.obs-site .rd-sec { border-radius: 0 !important; }
body.obs-site .v2-btn,
body.obs-site button,
body.obs-site input,
body.obs-site select,
body.obs-site textarea { border-radius: 0 !important; }
body.obs-site .v2-btn { box-shadow: none; }
body.obs-site .v2-btn:active,
body.obs-site button:active { transform: translateY(1px); }
body.obs-site .v2-btn-primary,
body.obs-site .v2-btn-gold { color: #111 !important; background: var(--obs-brass-hi) !important; border-color: #8f7845 !important; }
body.obs-site .v2-btn-primary:hover,
body.obs-site .v2-btn-gold:hover { background: #f0ece1 !important; }
body.obs-site .card,
body.obs-site [class*="-card"],
body.obs-site [class*="-col"] { border-radius: 0 !important; box-shadow: none; }
body.obs-site .card { border-color: var(--obs-line); }
body.obs-site .tool-guide__card { background: var(--obs-surface); border-top: 1px solid var(--obs-line); border-left: 0; border-right: 0; border-bottom: 0; }
body.obs-site .tool-guide__link {
  color: var(--obs-ink);
  background: var(--obs-surface);
  border-color: var(--obs-line);
  border-radius: 0;
}
body.obs-site .tool-guide__cta { border-radius: 0; }

/* Utility archives used translucent white paper in the previous theme. The
 * Observatory continuation turns those repeated floating cards into one
 * measured record surface: graphite fields, shared rules and brass states. */
body.obs-kind-taekil :where(.tk-toolbar, .tk-month, .tk-card),
body.obs-kind-samjae :where(.sj-panel, .sj-card, .sj-table),
body.obs-kind-name-compat :where(.nc-tool, .nc-card),
body.obs-kind-zodiac :where(.zd-finder, .zd-card, .zd-notes article) {
  color: var(--obs-ink);
  background: var(--obs-surface);
  border-color: var(--obs-line);
  border-radius: 0;
  box-shadow: none;
}
body.obs-kind-taekil :where(.tk-months, .tk-grid),
body.obs-kind-samjae .sj-grid,
body.obs-kind-name-compat .nc-grid,
body.obs-kind-zodiac :where(.zd-grid, .zd-notes) {
  gap: 0;
  border-top: 1px solid var(--obs-line);
  border-left: 1px solid var(--obs-line);
}
body.obs-kind-taekil :where(.tk-month, .tk-card),
body.obs-kind-samjae .sj-card,
body.obs-kind-name-compat .nc-card,
body.obs-kind-zodiac :where(.zd-card, .zd-notes article) {
  border-top: 0;
  border-left: 0;
  border-right: 1px solid var(--obs-line);
  border-bottom: 1px solid var(--obs-line);
}
body.obs-kind-taekil .tk-month:hover,
body.obs-kind-taekil .tk-card:hover,
body.obs-kind-samjae .sj-card:hover,
body.obs-kind-name-compat .nc-card:hover,
body.obs-kind-zodiac .zd-card:hover {
  color: var(--obs-ink);
  background: var(--obs-surface-2);
  border-color: var(--obs-line-strong);
  transform: none;
}
body.obs-kind-samjae .sj-table-wrap {
  border-color: var(--obs-line);
  border-radius: 0;
}
body.obs-kind-samjae .sj-table :where(th, td) { border-color: var(--obs-line); }
body.obs-kind-samjae .sj-table th { color: var(--obs-brass-hi); background: rgba(190,162,96,.08); }
body.obs-kind-taekil .tk-tab,
body.obs-kind-samjae .sj-field input,
body.obs-kind-name-compat .nc-field input,
body.obs-kind-zodiac .zd-field input {
  color: var(--obs-ink);
  background: #0f1214;
  border-color: var(--obs-line);
}
body.obs-kind-taekil .tk-tab.is-on {
  color: var(--obs-ink);
  background: var(--obs-surface-2);
  border-color: var(--obs-brass);
}

/* Legacy C-ink used --C-ink both as text and as an inverse dark surface.
 * In the Observatory theme text is light, so those inverse panels need an
 * explicit graphite surface instead of turning into bright paper blocks. */
body.obs-site .card-ink,
body.obs-site .cta-strip,
body.obs-site .rd-keiun,
body.obs-site .ss-unlock-cta,
body.obs-site .sg-unlock-cta,
body.obs-site .sy-unlock-cta,
body.obs-site .sy-year-plate .big,
body.obs-site .sy-ritual-row .q,
body.obs-site .sy-mo.is-active,
body.obs-site .ptab-btn.on,
body.obs-site .summary .grade,
body.obs-site .person .bd,
body.obs-site .ftag.is-ink,
body.obs-site .mr-filter.is-on,
body.obs-site [style*="background:var(--C-ink)"],
body.obs-site [style*="background: var(--C-ink)"] {
  color: var(--C-ink) !important;
  border-color: var(--C-line-2) !important;
  background: #111518 !important;
}
body.obs-site .ss-unlock-cta h3,
body.obs-site .sg-unlock-cta h3,
body.obs-site .sy-unlock-cta h3,
body.obs-site .card-ink :where(h2, h3, h4, p, strong, span),
body.obs-site .cta-strip :where(h2, h3, h4, p, strong),
body.obs-site .aside-block[style*="C-ink"] :where(h3, h4, p, strong) {
  color: var(--C-ink) !important;
}
body.obs-site .ss-unlock-cta p,
body.obs-site .sg-unlock-cta p,
body.obs-site .sy-unlock-cta p,
body.obs-site .cta-strip p,
body.obs-site .aside-block[style*="C-ink"] p { color: var(--C-ink-2) !important; }

/* Product Saju has one compact purchase composition; keep its footer from
 * drifting away after the two-column atlas ends. */
body.obs-kind-product-saju .pro-hero { padding-bottom: 48px; }
body.obs-kind-product-saju .v2-foot { margin-top: 48px; }

/* Hide only the replaced top introductions. Forms and results stay live. */
body.obs-kind-palja .palja-hero,
body.obs-kind-free-result .r-head,
body.obs-kind-wealth .wl-hero,
body.obs-kind-today .td-hero,
body.obs-kind-product-saju .pro-hero > .pills,
body.obs-kind-product-saju .pro-hero > h1,
body.obs-kind-product-saju .pro-hero > .C-lead,
body.obs-kind-product-gunghap .pg-hero,
body.obs-kind-product-yearly .py-hero,
body.obs-kind-guide .gd-hero,
body.obs-kind-saved .mr-hero { display: none !important; }
body.obs-kind-compat .v2-wrap > header:first-child { display: none !important; }
body.obs-reading-atlas main > header:first-child { display: none !important; }
body.obs-kind-taekil .tk-hero > .tk-kicker,
body.obs-kind-taekil .tk-hero > h1,
body.obs-kind-taekil .tk-hero > .tk-lead,
body.obs-kind-taekil .tk-hero > .tk-source,
body.obs-kind-samjae .sj-hero > .sj-hero__kicker,
body.obs-kind-samjae .sj-hero > h1,
body.obs-kind-samjae .sj-hero > .sj-hero__lead,
body.obs-kind-name-compat .nc-hero > .nc-kicker,
body.obs-kind-name-compat .nc-hero > h1,
body.obs-kind-name-compat .nc-hero > .nc-lead,
body.obs-kind-zodiac .zd-hero > .zd-kicker,
body.obs-kind-zodiac .zd-hero > h1,
body.obs-kind-zodiac .zd-hero > .zd-lead { display: none !important; }
body.obs-kind-archive .column-hero { display: none !important; }
body.obs-kind-legal .legal-head { display: none !important; }
body.obs-kind-legal .obs-page-hero { min-height: 560px; }
body.obs-kind-legal .obs-page-hero__inner { padding-bottom: 106px; }
body.obs-kind-product-saju .pro-hero { padding-top: 72px; padding-bottom: 56px; }
body.obs-kind-product-saju .pro-hero .layout { margin-top: 0; }
body.obs-kind-product-saju #saju-checkout { scroll-margin-top: 96px; }
body.obs-kind-taekil .tk-hero,
body.obs-kind-samjae .sj-hero,
body.obs-kind-name-compat .nc-hero,
body.obs-kind-zodiac .zd-hero { padding-top: 54px; }

body.obs-kind-archive .column-page { max-width: 1220px; padding: 72px 24px 100px; }
body.obs-kind-archive .cat-tabs { gap: 0; padding: 0 0 28px; border-bottom: 1px solid var(--obs-line); }
body.obs-kind-archive .cat-tab { padding: 10px 16px; color: var(--obs-ink-3); background: transparent; border: 0; border-right: 1px solid var(--obs-line); border-radius: 0; }
body.obs-kind-archive .cat-tab--active { color: var(--obs-ink); box-shadow: inset 0 -2px var(--obs-brass); }
body.obs-kind-archive .column-grid { display: block; border-top: 1px solid var(--obs-line-strong); }
body.obs-kind-archive .column-card { position: relative; min-height: 156px; display: grid; grid-template-columns: 104px minmax(0,1fr); align-items: stretch; gap: 0; color: var(--obs-ink); background: transparent; border: 0; border-bottom: 1px solid var(--obs-line); overflow: hidden; }
body.obs-kind-archive .column-card:hover { border-color: var(--obs-line-strong); background: var(--obs-surface); transform: none; }
body.obs-kind-archive .obs-column-glyph { display: grid; place-items: center; color: var(--obs-brass-2); border-right: 1px solid var(--obs-line); font-family: var(--font-serif-kr, serif); font-size: 42px; font-weight: 400; }
body.obs-kind-archive .column-card-img { display: none; }
body.obs-kind-archive .column-card-body { padding: 25px 28px; }
body.obs-kind-archive .column-card-cat { color: var(--obs-brass); font: 500 9px/1 var(--obs-mono); letter-spacing: .1em; }
body.obs-kind-archive .column-card-title { margin: 12px 0 8px; color: var(--obs-ink); font-family: var(--font-serif-kr, serif); font-size: 22px; font-weight: 500; line-height: 1.45; }
body.obs-kind-archive .column-card-desc { color: var(--obs-ink-2); line-height: 1.7; }
body.obs-kind-archive .column-card-meta { color: var(--obs-ink-3); font: 400 9px/1 var(--obs-mono); letter-spacing: .06em; }

/* Reading atlas: fixed section index plus strong editorial sections. */
.obs-reading-progress {
  position: sticky;
  z-index: 12;
  top: 67px;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 48px;
  padding: 0 max(20px, calc((100vw - 1280px)/2));
  color: var(--obs-paper);
  background: rgba(7,10,11,.96);
  border-bottom: 1px solid rgba(190,162,96,.45);
  overflow-x: auto;
  scrollbar-width: none;
}
.obs-reading-progress::-webkit-scrollbar { display: none; }
.obs-reading-progress > span { flex: 0 0 auto; color: var(--obs-brass-hi); font: 400 8px/1 var(--obs-mono); letter-spacing: .13em; }
.obs-reading-progress a { flex: 0 0 auto; padding: 17px 7px 14px; color: rgba(240,236,225,.55); border-bottom: 2px solid transparent; font-size: 10px; text-decoration: none; }
.obs-reading-progress a.is-active { color: var(--obs-paper); border-bottom-color: var(--obs-brass-hi); }
body.obs-reading-atlas .rd-sec { border-top: 1px solid var(--obs-line); background: transparent; }
body.obs-reading-atlas .rd-mini { display: none !important; }
body.obs-reading-atlas .past .a,
body.obs-reading-atlas .past .t { color: var(--obs-ink-3) !important; }
body.obs-reading-atlas .rs-tc.past { opacity: 1 !important; background: var(--obs-surface); }
body.obs-reading-atlas .rd-toc-item.is-locked { opacity: 1 !important; }
body.obs-reading-atlas .rd-toc-item.is-locked .idx,
body.obs-reading-atlas .rd-toc-item.is-locked .t { color: var(--obs-ink-3) !important; }
body.obs-reading-atlas .rd-keiun .lbl,
body.obs-reading-atlas .cta-strip .v2-kicker,
body.obs-reading-atlas .aside-block[style*="background:var(--C-ink)"] .lbl,
body.obs-reading-atlas .aside-block[style*="background:var(--C-ink)"] h4 em { color: var(--obs-brass-hi) !important; }
body.obs-reading-atlas .aside-block[style*="C-ink"] .lbl,
body.obs-reading-atlas .aside-block[style*="C-ink"] h4 em,
body[class*="obs-kind-sample"] .rd-toc > div[style*="C-ink"] > span,
body[class*="obs-kind-sample"] .ss-unlock-cta-kicker,
body[class*="obs-kind-sample"] .ss-unlock-cta h3 em,
body[class*="obs-kind-sample"] .sg-unlock-cta-kicker,
body[class*="obs-kind-sample"] .sg-unlock-cta h3 em,
body[class*="obs-kind-sample"] .sy-unlock-cta-kicker,
body[class*="obs-kind-sample"] .sy-unlock-cta h3 em,
body.obs-kind-sample-gunghap .rd-stem-rel .ch,
body.obs-kind-sample-yearly .sy-year-plate .gz { color: var(--obs-brass-hi) !important; }
body[class*="obs-kind-sample"] .ss-unlock-cta .price .was,
body[class*="obs-kind-sample"] .sg-unlock-cta .price .was,
body[class*="obs-kind-sample"] .sy-unlock-cta .price .was,
body.obs-reading-atlas .aside-block[style*="C-ink"] div > span { color: rgba(240,236,225,.7) !important; }
body.obs-site .v2-btn-gold .tool-guide__price { color: rgba(17,17,17,.68); }
body.obs-kind-product-gunghap .pg-ribbon-item .k,
body.obs-kind-product-yearly .py-ribbon-item .k,
body.obs-kind-product-gunghap .pg-sample-card h4 em { color: var(--obs-brass-hi); }
body.obs-site .sj-old-price,
body.obs-site .nc-old,
body.obs-site .zd-old,
body.obs-site .tk-old { color: var(--obs-ink-3); }
body.obs-site .v2-btn-gold :is(.sj-old-price, .nc-old, .zd-old, .tk-old) { color: #4a4438; }
body.obs-kind-taekil .tk-day.past { opacity: 1; color: var(--obs-ink-3); background: var(--obs-surface); }
body.obs-kind-taekil .tk-day.weekend { color: var(--obs-brass-2); }
body.obs-kind-ilju-record .ij-tag { color: var(--obs-brass); }
body.obs-kind-ilju-record .ij-cta .kicker,
body.obs-kind-ilju-record .ij-cta h2 em { color: var(--obs-brass-hi) !important; }
body.obs-kind-free-result .tc.past { opacity: 1; background: var(--obs-surface); }
body.obs-kind-free-result .tc.past .a,
body.obs-kind-free-result .tc.past .t { color: var(--obs-ink-3); }
body.obs-kind-free-result .upsell .k,
body.obs-kind-free-result .upsell .pr .now { color: var(--obs-brass-hi) !important; }
body.obs-kind-free-result .upsell .C-btn {
  color: #111 !important;
  background: var(--obs-brass-hi) !important;
}
body.obs-kind-reading-yearly .sy-mo.is-active .lbl,
body.obs-kind-reading-yearly .sy-ritual-row .q .ql,
body.obs-kind-guide .gd-pull blockquote em { color: var(--obs-brass-hi) !important; }

.obs-reveal { transform: translateY(18px); transition: transform 650ms cubic-bezier(.16,1,.3,1); }
.obs-reveal.is-visible { transform: none; }

@media (max-width: 980px) {
  .obs-page-hero__inner { width: min(100% - 42px, 1380px); grid-template-columns: minmax(0, 1fr) minmax(360px, 430px); }
  .obs-page-hero :is(h1, .obs-page-hero__title) { font-size: clamp(42px, 6vw, 62px); }
  .obs-kind-palja .obs-pillar-rack { left: 47%; right: -12%; }
  .obs-page-hero__rail { left: 22px; right: 22px; }
}

@media (max-width: 767px) {
  body.obs-site { padding-bottom: 64px; }
  body.obs-site .v2-tabbar { background: rgba(7,10,11,.98); border-top-color: var(--obs-line); }
  body.obs-site .v2-tab { color: rgba(240,236,225,.5); }
  body.obs-site .v2-tab.is-active { color: var(--obs-paper); }
  body.obs-site .v2-tab.is-active::before { background: var(--obs-brass-hi); }
  .obs-page-hero { min-height: 860px; }
  .obs-page-hero__asset img { object-position: var(--obs-mobile-position, 48% center); transform: scale(1.02); }
  .obs-page-hero__shade,
  .obs-page-hero.is-copy-right .obs-page-hero__shade { background: linear-gradient(180deg, rgba(4,6,7,.16) 0%, rgba(4,6,7,.5) 38%, rgba(4,6,7,.96) 62%, #070a0b 100%); }
  .obs-page-hero__inner,
  .obs-page-hero.is-copy-right .obs-page-hero__inner { width: auto; min-height: inherit; margin: 0 18px; display: block; padding: 390px 0 110px; }
  .obs-page-hero__copy,
  .obs-page-hero.is-copy-right .obs-page-hero__copy { max-width: none; grid-column: auto; }
  .obs-page-hero__eyebrow { font-size: 8px; }
  .obs-page-hero :is(h1, .obs-page-hero__title) { font-size: clamp(38px, 12vw, 52px); line-height: 1.16; }
  .obs-page-hero__desc { font-size: 12px; line-height: 1.75; }
  .obs-page-hero__metrics { margin-top: 22px; }
  .obs-page-hero__metric { min-height: 64px; padding-right: 8px; }
  .obs-page-hero__metric + .obs-page-hero__metric { padding-left: 9px; }
  .obs-page-hero__metric b { font-size: 12px; word-break: keep-all; }
  .obs-page-hero__actions { align-items: flex-start; flex-direction: column; gap: 13px; }
  .obs-page-action { width: 100%; }
  .obs-price { flex-wrap: wrap; }
  .obs-page-hero__rail { left: 18px; right: 18px; bottom: 20px; min-height: 58px; grid-template-columns: repeat(4, 1fr); }
  .obs-page-hero__rail > span { display: none; }
  .obs-page-hero__rail > div { padding: 8px 5px; text-align: center; border-left: 1px solid var(--obs-line); }
  .obs-page-hero__rail > div:first-of-type { border-left: 0; }
  .obs-page-hero__rail small { font-size: 7px; }
  .obs-kind-palja .obs-pillar-rack { left: 0; right: -18%; top: 4%; bottom: auto; height: 410px; }
  .obs-kind-palja .obs-pillar-rack figure:nth-child(1) { --y: 50px; }
  .obs-kind-palja .obs-pillar-rack figure:nth-child(2) { --y: 34px; }
  .obs-kind-palja .obs-pillar-rack figure:nth-child(3) { --y: 17px; }
  .obs-kind-palja .obs-pillar-rack figure:nth-child(4) { --y: 0px; }
  .obs-kind-palja .obs-page-hero__inner { padding-top: 390px; }
  .obs-utility-scene { top: 72px; left: 18px; right: 18px; width: auto; min-height: 300px; }
  .obs-calendar-board { padding: 14px; transform: none; }
  .obs-calendar-grid span { min-height: 38px; }
  .obs-zodiac-index { transform: none; }
  .obs-zodiac-index span { min-height: 62px; }
  .obs-reading-progress { top: 58px; padding: 0 14px; }
  body.obs-kind-archive .column-page { padding: 44px 18px 72px; }
  body.obs-kind-archive .column-card { min-height: 0; grid-template-columns: 58px 1fr; }
  body.obs-kind-archive .obs-column-glyph { grid-row: 1; font-size: 26px; }
  body.obs-kind-archive .column-card-img { display: none; }
  body.obs-kind-archive .column-card-body { grid-column: 2; padding: 20px 16px; }
  body.obs-kind-archive .column-card-title { font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .obs-page-hero__asset img,
  .obs-kind-palja .obs-pillar-rack figure,
  .obs-reveal { transition: none !important; transform: none !important; }
}

/* 2026-10-30 jury 수정 ------------------------------------------------------- */
/* 궁합·신년 상품 리본: 원래 글자색이 --C-paper(관측실 테마에서 먹색)라 어두운 리본 위에서 1.03:1로 안 보였음 */
body.obs-site .pg-ribbon-price .now,
body.obs-site .pg-ribbon-item .v,
body.obs-site .py-ribbon-price .now,
body.obs-site .py-ribbon-item .v { color: var(--obs-paper); }
body.obs-site .pg-ribbon-price .tag,
body.obs-site .py-ribbon-price .tag { color: #0b0d0e; }
/* 내비 자리 미리 잡기: v2-chrome.js가 DOMContentLoaded에 내비를 그려 넣어 첫 화면이 59/71px 밀리던 것(CLS) */
body.obs-site #v2-nav-slot { display: block; height: 71px; }
@media (max-width: 767px) { body.obs-site #v2-nav-slot { height: 59px; } }
/* 궁합 상품 '샘플 먼저' 카드: 원래 먹색 바탕이 관측실 테마에서 밝은 바탕이 되어 글자가 1.1:1로 안 보였음 */
body.obs-site .pg-sample-card { background: #111518; color: var(--obs-paper); border: 1px solid var(--obs-line); }
body.obs-site .pg-sample-card p { color: rgba(240, 236, 225, .72); }
/* 무료 결과 '다음 단계' 버튼: 인주(산호)색 → 다른 주요 CTA와 같은 금색 채움·금색 외곽선, 각진 모서리, hover는 크림색 채움 */
body.obs-site .rf-next-btn { border-radius: 0; border-color: var(--obs-brass); color: var(--obs-brass-hi); background: transparent; }
body.obs-site .rf-next-btn.is-main { color: #111; background: var(--obs-brass-hi); border-color: #8f7845; }
body.obs-site .rf-next-btn:hover,
body.obs-site .rf-next-btn.is-main:hover { color: #0b0d0e; background: var(--obs-paper); border-color: var(--obs-paper); }
/* hover 반응: 카카오 공유, 로고 */
body.obs-site .v2-share-btn.kakao { transition: background-color .16s ease, border-color .16s ease; }
body.obs-site .v2-share-btn.kakao:hover { color: #1b1b1b; background: #ffe45c; border-color: #ffe45c; }
.v2-logo { transition: opacity .18s ease; }
.v2-logo:hover { opacity: .74; }
/* 화면 밖 제목(검색·화면낭독용 h1; 숨겨진 원래 h1의 글) */
.obs-sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* 한글 가짜 이탤릭 방지: 한글 글꼴에는 이탤릭이 없어 브라우저가 기울여 그린다 */
html:lang(ko) :is(em, i, cite) { font-synthesis: weight; } /* 기울임 합성만 끔(굵기 합성은 유지) */

/* 2026-10-30 jury 2차 ------------------------------------------------------- */
/* 관측실 테마가 숨긴 원래 h1(→ p로 바뀜)은 계속 숨긴다 */
.obs-legacy-title { display: none !important; }
/* 상단 메뉴: hover 때 활성 탭과 같은 금색 1px 선이 왼쪽에서 그려진다. 누를 자리 14px → 26px(위아래 6px) */
body.obs-site .v2-nav-links a { padding: 6px 0; }
body.obs-site .v2-nav-links a::after,
body.obs-site .v2-nav-links a.is-active::after {
  content: ""; position: absolute; right: 0; bottom: -11px; left: 0; height: 1px; background: var(--obs-brass);
  transform: scaleX(0); transform-origin: left center; transition: transform .22s ease;
}
body.obs-site .v2-nav-links a:hover::after,
body.obs-site .v2-nav-links a.is-active::after { transform: scaleX(1); }
/* 택일 연도 버튼 */
body.obs-kind-taekil .tk-tab { transition: border-color .16s ease, background-color .16s ease, color .16s ease; }
body.obs-kind-taekil .tk-tab:hover { color: var(--obs-paper); background: var(--obs-surface-2); border-color: var(--obs-brass-hi); }
/* 삼재 관련 글 카드·본문 링크 */
body.obs-kind-samjae .sj-link { border-color: var(--obs-line); border-radius: 0; background: var(--obs-surface); transition: border-color .16s ease, background-color .16s ease; }
body.obs-kind-samjae .sj-link strong { display: inline-block; transition: transform .16s ease, color .16s ease; }
body.obs-kind-samjae .sj-link:hover { border-color: var(--obs-brass); background: var(--obs-surface-2); }
body.obs-kind-samjae .sj-link:hover strong { color: var(--obs-brass-hi); transform: translateX(4px); }
body.obs-kind-samjae .sj-note a { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: color .16s ease, text-decoration-color .16s ease; }
body.obs-kind-samjae .sj-note a:hover { color: var(--obs-brass-hi); text-decoration-color: currentColor; }
/* 하단 CTA 상자: 둥근 모서리 → 나머지 각진 프레임과 같게 */
body.obs-kind-zodiac .zd-cta,
body.obs-kind-samjae .sj-cta,
body.obs-kind-taekil .tk-cta,
body.obs-kind-name-compat .nc-funnel article { border-radius: 0; }
@media (prefers-reduced-motion: reduce) {
  body.obs-site .v2-nav-links a::after,
  body.obs-kind-samjae .sj-link strong { transition: none; }
}