/* 用户锁定 Tarotoo 舞台方向（ccb00be5）：紫晶空间、居中牌面、连续抽牌。
   样式限定在公开前台，独立后台保持现有布局。 */
.oracle-page {
  --o-night: #170e29;
  --o-ink: #231237;
  --o-violet: #623790;
  --o-gold: #e0bd85;
  --o-text: #faf1e6;
  --o-muted: #d1bfe0;
  --o-line: #b394c85c;
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  overflow: clip;
  background: var(--o-night);
  color: var(--o-text);
  font-size: 16px;
  line-height: 1.65;
  scrollbar-color: #9875b4 #20132f;
}
html:has(.oracle-page) {
  scrollbar-gutter: stable;
}
.oracle-page button {
  cursor: pointer;
}
.oracle-page button:disabled {
  cursor: default;
}
.oracle-page :focus-visible {
  outline: 2px solid var(--o-gold);
  outline-offset: 5px;
}
.oracle-page ::selection {
  background: #d8b3ef;
  color: #24132f;
}
.oracle-page h1,
.oracle-page h2,
.oracle-page h3 {
  text-wrap: balance;
}
.oracle-sky {
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: max(1100px, 115svh);
  pointer-events: none;
  overflow: hidden;
  background: radial-gradient(
    ellipse at 50% 38%,
    #8251b9 0%,
    #573181 24%,
    #321c4e 51%,
    #170e29 78%
  );
}
.oracle-sky::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 73%, var(--o-night));
}
.oracle-sky canvas {
  position: absolute;
  width: 100%;
  height: 100%;
}
.oracle-astrolabe {
  width: min(1500px, 130vw);
  height: auto;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  color: #ddbbf02b;
}
.oracle-eclipse {
  position: absolute;
  top: 420px;
  width: 76px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #241336;
  box-shadow:
    -5px 4px 0 -1px #efd4a5,
    -8px 5px 20px -3px #cda2768f;
}
.eclipse-left {
  left: 11%;
}
.eclipse-right {
  right: 11%;
  transform: rotate(180deg);
}
.oracle-header {
  position: relative;
  z-index: 30;
  width: min(1100px, calc(100% - 64px));
  margin: auto;
  padding-top: 28px;
}
.oracle-header-top {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 60px;
}
.oracle-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  font-size: 32px;
  letter-spacing: 0.16em;
  font-weight: 500;
  line-height: 1.4;
}
.oracle-wordmark span {
  font-size: 14px;
  letter-spacing: 0.2em;
  font-weight: 400;
}
.oracle-header-top > .oracle-wordmark {
  grid-column: 2;
}
.oracle-journal-link {
  font-size: 14px;
  color: var(--o-muted);
  justify-self: start;
}
.oracle-header-tools {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
}
.oracle-icon-button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  border-radius: 50%;
}
.oracle-icon-button:hover {
  background: #e6c7ff15;
}
.oracle-login-link {
  font-size: 14px;
  padding: 10px 12px;
}
.oracle-menu-toggle {
  display: none;
}
.oracle-arched-nav {
  display: flex;
  justify-content: center;
  gap: clamp(24px, 4vw, 65px);
  padding: 25px 0 32px;
}
.oracle-arched-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  min-width: 65px;
  transition:
    color 0.2s,
    transform 0.25s;
}
.oracle-arched-nav svg {
  color: var(--o-gold);
}
.oracle-arched-nav a:nth-child(1),
.oracle-arched-nav a:nth-child(6) {
  transform: translateY(27px);
}
.oracle-arched-nav a:nth-child(2),
.oracle-arched-nav a:nth-child(5) {
  transform: translateY(10px);
}
.oracle-arched-nav a:hover {
  color: var(--o-gold);
}
.oracle-mobile-menu {
  position: absolute;
  left: 0;
  right: 0;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  background: #261538;
  border: 1px solid var(--o-line);
  border-radius: 18px;
  box-shadow: 0 16px 40px #0e081766;
}
.oracle-mobile-menu a {
  padding: 12px;
}
.oracle-home-stage {
  position: relative;
  text-align: center;
  padding: 5px 20px 46px;
}
/* 首页只有一个旋转实体；光场与星仪外框不做平移。 */
.oracle-single-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: min(650px, 100%);
  height: 335px;
  margin: 0 auto;
  perspective: 1500px;
}
.oracle-single-halo {
  position: absolute;
  width: 470px;
  max-width: 95vw;
  aspect-ratio: 1;
  pointer-events: none;
  background: radial-gradient(
    ellipse,
    #e8d9ff85,
    #c29aee36 31%,
    #ab76da0a 54%,
    transparent 68%
  );
  animation: oracle-halo-light 8s ease-in-out infinite;
}
.oracle-single-rock {
  position: relative;
  width: 168px;
  aspect-ratio: 518 / 920;
  transform-style: preserve-3d;
  animation: oracle-card-rock 8s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.oracle-single-turn,
.oracle-reveal-turn {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}
.oracle-single-front,
.oracle-single-back,
.oracle-reveal-front,
.oracle-reveal-back {
  position: absolute;
  inset: 0;
  border-radius: 9px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
  box-shadow: 0 18px 30px #10071866;
}
.oracle-single-front {
  transform: translateZ(1px);
}
.oracle-single-back,
.oracle-reveal-front {
  transform: rotateY(180deg) translateZ(1px);
}
.oracle-single-front img,
.oracle-reveal-front img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.oracle-art-sheen {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    115deg,
    transparent 25%,
    #f9e4ba28 45%,
    transparent 65%
  );
  opacity: 0.35;
  animation: oracle-ink-light 8s ease-in-out infinite;
}
.oracle-single-stage[data-motion='paused'] *,
.oracle-single-stage[data-motion='paused'] *::before,
.oracle-single-stage[data-motion='paused'] *::after,
.oracle-sky[data-motion='paused'] *,
.oracle-sky[data-motion='paused'] *::before,
.oracle-sky[data-motion='paused'] *::after,
.oracle-header[data-motion='paused'] * {
  animation-play-state: paused !important;
}
.oracle-nebula {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 40%, #975ddd38, transparent 60%);
  animation: oracle-halo-light 14s ease-in-out infinite;
}
.oracle-fixed-marks {
  color: #e2bc84;
  opacity: 0.76;
}
.oracle-sun-rays {
  transform-origin: 160px 220px;
  animation: oracle-orbit-turn 24s linear infinite;
}
.oracle-compass-rotor {
  transform-origin: 1240px 220px;
  animation: oracle-orbit-turn 18s linear infinite reverse;
}
.oracle-lunar-dial {
  transform-origin: 1210px 780px;
  animation: oracle-orbit-turn 32s linear infinite;
}
.oracle-eye-pupil {
  animation: oracle-ink-light 5s ease-in-out infinite;
}
.oracle-eclipse {
  animation: none;
}
.oracle-eclipse::after {
  content: '';
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1px solid #e9c58b38;
  animation: oracle-ink-light 9s ease-in-out infinite;
}
.oracle-header-seal {
  width: 34px;
  height: 34px;
  margin: 9px auto 7px;
  color: var(--o-text);
}
.oracle-header-seal svg {
  width: 100%;
  height: 100%;
}
.oracle-arched-nav .oracle-sigil {
  width: 38px;
  height: 42px;
}
.sigil-inner {
  transform-origin: 24px 24px;
  animation: oracle-orbit-turn 18s linear infinite;
}
.sigil-0 .sigil-inner,
.sigil-5 .sigil-inner {
  animation: oracle-ink-light 5s ease-in-out infinite;
}
.sigil-1 .sigil-inner {
  animation-duration: 24s;
}
@keyframes oracle-orbit-turn {
  to {
    transform: rotate(360deg);
  }
}
@keyframes oracle-card-rock {
  0%,
  100% {
    transform: rotate(-9deg);
  }
  50% {
    transform: rotate(9deg);
  }
}
@keyframes oracle-halo-light {
  0%,
  100% {
    opacity: 0.66;
  }
  50% {
    opacity: 1;
  }
}
@keyframes oracle-ink-light {
  0%,
  100% {
    opacity: 0.3;
  }
  50% {
    opacity: 0.8;
  }
}
.oracle-welcome h1 {
  margin: 14px 0 8px;
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  letter-spacing: 0.04em;
}
.oracle-welcome p {
  margin: 0 0 22px;
  color: var(--o-muted);
  font-size: 15px;
}
.oracle-phases {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
  height: 20px;
  color: var(--o-gold);
}
.oracle-phases i {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  box-shadow: -3px 0 currentColor;
}
.oracle-phases i:nth-child(2) {
  box-shadow: -5px 0 currentColor;
}
.oracle-phases i:nth-child(3) {
  background: currentColor;
  box-shadow: none;
}
.oracle-phases i:nth-child(4) {
  box-shadow: 5px 0 currentColor;
}
.oracle-phases i:nth-child(5) {
  box-shadow: 3px 0 currentColor;
}
.oracle-primary {
  position: relative;
  display: inline-flex;
  min-height: 54px;
  min-width: 248px;
  padding: 12px 30px;
  align-items: center;
  justify-content: center;
  gap: 22px;
  border: 1px solid #d8cfe05c;
  border-radius: 999px;
  background: #2a193bcc;
  color: var(--o-text);
  box-shadow: 0 12px 28px #10061e2e, inset 0 1px 0 #f4ecff12;
  transition:
    background 0.25s,
    box-shadow 0.25s,
    transform 0.25s;
}
.oracle-primary::before {
  content: none;
}
.oracle-primary:hover:not(:disabled) {
  background: #3c2850;
  border-color: #e2d8ed8f;
  box-shadow: 0 15px 34px #10061e4a, inset 0 1px 0 #f4ecff20;
  transform: translateY(-2px);
}
.oracle-primary:disabled {
  opacity: 0.45;
}
.oracle-explore-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: max-content;
  margin: 22px auto 0;
  color: var(--o-muted);
  font-size: 13px;
}
.oracle-experiences {
  width: min(1040px, calc(100% - 64px));
  margin: 30px auto 90px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  position: relative;
}
.oracle-portal {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 20px 24px;
  background: #190f2be6;
  border-radius: 110px 110px 22px 22px;
  box-shadow: 0 18px 36px #0c061b30;
  overflow: hidden;
  transition:
    background 0.3s,
    transform 0.4s;
}
.oracle-portal:nth-child(3n + 2) {
  transform: translateY(-16px);
}
.oracle-portal > svg {
  color: var(--o-gold);
}
.oracle-portal h2 {
  font-size: 22px;
  font-weight: 500;
  margin: 10px 0 18px;
}
.oracle-portal-art {
  position: relative;
  width: 132px;
  perspective: 900px;
}
.oracle-portal-art img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.oracle-portal:hover {
  background: #2c1842;
}
.oracle-portal:hover img {
  transform: translateY(-9px) rotateY(-10deg) rotateZ(3deg);
}
.oracle-portal p {
  font-size: 14px;
  color: var(--o-muted);
  margin: 19px 0 13px;
}
.oracle-portal-action {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--o-gold);
}
.oracle-journal-preview {
  width: min(1040px, calc(100% - 64px));
  margin: 0 auto 70px;
}
.oracle-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 24px;
}
.oracle-section-title h2 {
  font-size: 25px;
  font-weight: 500;
  margin: 0;
}
.oracle-section-title > a {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--o-gold);
  font-size: 14px;
}
.oracle-article-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.oracle-article {
  display: grid;
  grid-template-columns: 68px 1fr;
  gap: 17px;
  padding-top: 22px;
  border-top: 1px solid var(--o-line);
}
.oracle-article > img {
  display: block;
  width: 68px;
  height: auto;
  border-radius: 5px;
}
.oracle-article span {
  color: var(--o-gold);
  font-size: 12px;
}
.oracle-article h3 {
  font-size: 16px;
  line-height: 1.6;
  margin: 5px 0;
  font-weight: 500;
}
.oracle-article p {
  color: var(--o-muted);
  font-size: 13px;
  line-height: 1.7;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.oracle-footer {
  text-align: center;
  padding: 35px 24px 45px;
  border-top: 1px solid var(--o-line);
}
.oracle-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  font-size: 14px;
  margin: 20px 0;
}
.oracle-footer p {
  color: var(--o-muted);
  font-size: 12px;
}
.motion-paused *,
.motion-paused *::before,
.motion-paused *::after {
  animation-play-state: paused !important;
}
@keyframes oracle-breathe {
  0%,
  100% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-9px) rotate(2deg);
  }
}
@media (max-width: 700px) {
  .oracle-header {
    width: calc(100% - 32px);
    padding-top: max(12px, env(safe-area-inset-top));
  }
  .oracle-header-top {
    min-height: 54px;
  }
  .oracle-wordmark {
    font-size: 26px;
    gap: 6px;
  }
  .oracle-wordmark span {
    font-size: 12px;
  }
  .oracle-journal-link {
    font-size: 12px;
  }
  .oracle-login-link {
    display: none;
  }
  .oracle-header-tools {
    gap: 0;
  }
  .oracle-menu-toggle {
    display: grid;
  }
  .oracle-arched-nav {
    gap: 0;
    justify-content: space-between;
    padding: 16px 0 22px;
  }
  .oracle-arched-nav a {
    min-width: 0;
    font-size: 12px;
    gap: 9px;
  }
  .oracle-arched-nav svg {
    width: 23px;
    height: 23px;
  }
  .oracle-arched-nav a:nth-child(1),
  .oracle-arched-nav a:nth-child(6) {
    transform: translateY(18px);
  }
  .oracle-home-stage {
    padding: 0 16px 25px;
  }
  .oracle-welcome h1 {
    font-size: 25px;
  }
  .oracle-welcome p {
    font-size: 14px;
  }
  .oracle-eclipse {
    width: 34px;
    top: 372px;
  }
  .eclipse-left {
    left: 4%;
  }
  .eclipse-right {
    right: 4%;
  }
  .oracle-astrolabe {
    width: 960px;
    top: 10px;
  }
  .oracle-sky {
    height: 1100px;
    background: radial-gradient(
      ellipse at 50% 30%,
      #8150b7,
      #4b286f 38%,
      #170e29 77%
    );
  }
  .oracle-experiences {
    width: calc(100% - 32px);
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 30px auto 50px;
  }
  .oracle-portal {
    padding: 22px 9px 20px;
    border-radius: 85px 85px 18px 18px;
  }
  .oracle-portal:nth-child(3n + 2) {
    transform: none;
  }
  .oracle-portal h2 {
    font-size: 19px;
  }
  .oracle-portal-art {
    width: 104px;
  }
  .oracle-portal p {
    font-size: 12px;
    text-align: center;
  }
  .oracle-journal-preview {
    width: calc(100% - 36px);
    margin-bottom: 45px;
  }
  .oracle-section-title h2 {
    font-size: 21px;
  }
  .oracle-section-title > a {
    font-size: 12px;
  }
  .oracle-article-grid {
    grid-template-columns: 1fr;
  }
  .oracle-article {
    grid-template-columns: 60px 1fr;
  }
  .oracle-article > img {
    width: 60px;
  }
  .oracle-footer {
    padding-bottom: max(30px, env(safe-area-inset-bottom));
  }
}
@media (prefers-reduced-motion: reduce) {
  .oracle-page *,
  .oracle-page *::before,
  .oracle-page *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* 提问、牌桌、解读是一套共享空间，不沿用旧版面板布局。 */
/* 内容页用更安静的紫色纸面承接牌桌；这些选择器不会命中控制台。 */
:is(
  .library-page,
  .daily-page,
  .journal-page,
  .articles-page,
  .article-detail-page
) {
  --night: #190f2c;
  --deep: #2b193e;
  --line: #bd9bd73d;
  --gold-bright: #e0bd85;
  --paper: #faf1e6;
  --paper-muted: #d1bfe0;
  background:
    radial-gradient(ellipse at 50% 0, #4d2a6b 0, transparent 620px), #190f2c;
  color: #faf1e6;
}
.inner-header {
  grid-template-columns: 1fr auto 1fr;
  height: auto;
  min-height: 82px;
  padding: 15px 0;
  border-color: #b394c83b;
}
.inner-brand {
  font-size: 25px;
  font-weight: 500;
  letter-spacing: 0.15em;
}
.inner-brand svg {
  display: none;
}
.inner-header nav {
  color: #d1bfe0;
  gap: 22px;
}
.inner-back {
  border-color: #b394c859;
}
.library-intro {
  padding: 56px 0 34px;
}
.library-intro h1,
.articles-intro h1 {
  font-size: 42px;
  font-weight: 500;
}
.library-intro p,
.articles-intro p {
  color: #d1bfe0;
  font-size: 16px;
}
.library-filters {
  margin-bottom: 46px;
  background: #2b193e;
  backdrop-filter: none;
}
.library-filters a {
  color: #d1bfe0;
  font-size: 14px;
}
.card-family {
  padding-bottom: 68px;
}
.family-title h2 {
  font-size: 27px;
}
.family-title p {
  color: #c5aed8;
}
.library-card-image {
  background: #261438;
}
.library-card span {
  color: #c5aed8;
  font-size: 12px;
}
.library-card p {
  color: #d1bfe0;
  font-size: 13px;
}
.library-card h3 {
  font-size: 17px;
}
.articles-intro {
  padding: 56px 0 32px;
}
.article-row h2 {
  font-size: 25px;
  font-weight: 500;
}
.article-row p {
  color: #d1bfe0;
  font-size: 15px;
}
.article-row span,
.article-body > header span {
  font-size: 13px;
}
.article-row img {
  background: transparent;
}
.article-body {
  padding-top: 42px;
}
.article-body > header h1 {
  font-size: 36px;
  font-weight: 500;
}
.article-body > header p,
.article-body > footer p,
.article-body figcaption {
  color: #d1bfe0;
}
.article-prose p {
  color: #eee2f4;
  font-size: 16px;
  line-height: 1.95;
}
.daily-copy h1 {
  font-size: clamp(28px, 3.5vw, 43px);
  font-weight: 500;
}
.daily-copy > p {
  color: #d1bfe0;
  font-size: 16px;
}
.daily-stage::before {
  border-color: #b394c83d;
}
.daily-reading {
  background: #28153e;
}
.daily-card {
  max-width: 300px;
  justify-self: center;
}
.daily-front img {
  object-fit: contain;
}
.journal-heading h1 {
  font-size: 36px;
  font-weight: 500;
}
.journal-heading p {
  color: #d1bfe0;
}
.journal-list article {
  background: #28183a;
}
.journal-list h2 {
  font-size: 21px;
}
.journal-date,
.journal-list figcaption {
  color: #d1bfe0;
  font-size: 12px;
}
.card-detail-page {
  color: #f7edfa;
  background:
    radial-gradient(ellipse at 22% 30%, #4d2a6b, transparent 60%), #190f2c;
}
.detail-header {
  border-color: #b394c844;
}
.detail-header > a:first-child,
.detail-header > span,
.card-detail p {
  color: #d1bfe0;
}
.detail-brand svg,
.card-detail > article > span {
  color: #e0bd85;
}
.card-detail h1 {
  font-size: 46px;
  font-weight: 500;
}
.card-detail > article > small {
  color: #c5aed8;
  font-size: 12px;
}
.card-detail li {
  color: #e0bd85;
  border-color: #b394c85c;
  font-size: 13px;
}
.card-detail article > section {
  border-color: #b394c83d;
}
.auth-visual {
  background: radial-gradient(ellipse at 50% 40%, #75439e, #221132 70%);
}
.auth-page {
  background: #f4eff8;
}
.auth-form h1 {
  font-size: 34px;
}
.auth-form input {
  background: #fdfaff;
}
.auth-submit {
  background: #452362;
}
.auth-visual blockquote {
  font-weight: 400;
}
@media (max-width: 700px) {
  .inner-header {
    width: calc(100% - 32px);
    grid-template-columns: 44px 1fr;
    gap: 10px;
  }
  .inner-brand {
    justify-self: center;
    margin-right: 44px;
  }
  .inner-header nav {
    grid-column: 1/-1;
    justify-self: center;
    gap: 22px;
    font-size: 13px;
    padding: 8px 0 3px;
  }
  .library-intro {
    padding: 36px 0 26px;
  }
  .library-intro h1,
  .articles-intro h1 {
    font-size: 31px;
  }
  .library-intro p {
    margin-top: 16px;
    font-size: 15px;
  }
  .library-filters {
    margin-bottom: 35px;
  }
  .family-title h2 {
    font-size: 24px;
  }
  .articles-intro {
    padding-top: 36px;
  }
  .article-row h2 {
    font-size: 21px;
  }
  .article-body > header h1 {
    font-size: 28px;
  }
  .card-detail h1 {
    font-size: 36px;
  }
  .daily-stage {
    gap: 30px;
    padding-top: 38px;
  }
  .daily-card {
    width: 220px;
  }
  .daily-copy h1 {
    font-size: 28px;
  }
  .journal-heading h1 {
    font-size: 30px;
  }
}
.oracle-reading .oracle-sky {
  position: fixed;
  height: 110svh;
}
.oracle-reading .oracle-sky::after {
  background: linear-gradient(transparent 78%, #170e2980);
}
.oracle-question-stage {
  position: relative;
  width: min(820px, calc(100% - 40px));
  margin: 65px auto 0;
  min-height: 620px;
  text-align: center;
}
.oracle-question-stage > h1 {
  font-size: clamp(32px, 4.5vw, 58px);
  font-weight: 400;
  margin: 0 0 14px;
  letter-spacing: 0.03em;
  position: relative;
}
.oracle-question-stage > p {
  margin: 0 0 36px;
  color: var(--o-muted);
}
.oracle-question-stage form {
  position: relative;
  margin-top: 20px;
}
.oracle-question-stage form > label {
  display: block;
  text-align: left;
  font-size: 14px;
  color: var(--o-muted);
  margin: 0 0 8px 22px;
}
.oracle-question-field {
  position: relative;
  background: #251336b8;
  padding: 18px 22px 28px;
  border-radius: 38px 18px 38px 18px;
  box-shadow: 0 12px 30px #10061e26;
}
.oracle-question-field:focus-within {
  box-shadow: 0 14px 34px #10061e38, 0 0 0 3px #d9caef18;
}
.oracle-question-field textarea {
  width: 100%;
  resize: vertical;
  min-height: 72px;
  max-height: 170px;
  border: 0;
  background: transparent;
  outline: none;
  color: var(--o-text);
  font-size: 20px;
  line-height: 1.6;
  caret-color: var(--o-gold);
}
.oracle-question-field textarea::placeholder {
  color: #c5aed8;
}
.oracle-question-field textarea:focus-visible {
  outline: none;
}
.oracle-question-field > span {
  position: absolute;
  right: 24px;
  bottom: 9px;
  color: var(--o-muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.oracle-spread-choices {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 0;
  margin: 22px 0 26px;
  border: 0;
  flex-wrap: wrap;
}
.oracle-spread-choices legend {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.oracle-spread-choices label {
  cursor: pointer;
  position: relative;
}
.oracle-spread-choices input {
  position: absolute;
  opacity: 0;
  inset: 0;
}
.oracle-spread-choices span {
  display: block;
  padding: 10px 15px;
  border: 1px solid #c5a5d755;
  border-radius: 24px;
  font-size: 14px;
  color: var(--o-muted);
}
.oracle-spread-choices input:checked + span {
  background: #ddc0ee24;
  border-color: var(--o-gold);
  color: var(--o-text);
}
.oracle-spread-choices input:focus-visible + span {
  outline: 2px solid var(--o-gold);
  outline-offset: 3px;
}
.oracle-note {
  display: block;
  color: var(--o-muted);
  font-size: 13px;
  margin: 19px auto;
  max-width: 540px;
  line-height: 1.7;
  min-height: 22px;
}
.oracle-question-ghosts {
  position: absolute;
  inset: 30px -150px auto;
  height: 230px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  opacity: 0.1;
  pointer-events: none;
  filter: blur(3px);
}
.oracle-question-ghosts > span {
  width: 126px;
  transform: rotate(-27deg);
}
.oracle-question-ghosts > span:nth-child(2) {
  visibility: hidden;
}
.oracle-question-ghosts > span:last-child {
  transform: rotate(27deg);
}
.oracle-card-back {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 518/920;
  background: linear-gradient(145deg, #48295f, #241735 55%, #382046);
  border-radius: 9px;
  color: #d7b982;
  box-shadow:
    0 6px 13px #0f071555,
    inset 0 0 0 1px #bd9d676b;
}
.oracle-card-back svg {
  width: 100%;
  height: 100%;
  stroke: currentColor;
  stroke-width: 0.7;
  opacity: 0.8;
}
.oracle-draw-stage {
  width: min(1120px, 100%);
  margin: 15px auto 0;
  text-align: center;
  min-height: 710px;
}
.oracle-draw-title > p {
  width: min(600px, calc(100% - 40px));
  margin: 0 auto 10px;
  font-size: 14px;
  color: var(--o-muted);
  overflow-wrap: anywhere;
}
.oracle-draw-title h1 {
  font-size: 32px;
  font-weight: 400;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 18px;
  justify-content: center;
}
.oracle-draw-title h1 > span {
  font-size: 42px;
  width: 65px;
  height: 65px;
  border: 1px solid var(--o-gold);
  border-radius: 50%;
  display: grid;
  place-items: center;
  line-height: 1;
  font-weight: 400;
  animation: oracle-number 0.3s ease-out;
}
.oracle-draw-status {
  color: var(--o-muted);
  font-size: 13px;
  margin: 10px 0;
  min-height: 22px;
}
.oracle-fan-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  width: 100%;
  scrollbar-width: thin;
  scrollbar-color: #b89acb55 transparent;
  overscroll-behavior-x: contain;
  margin-top: 20px;
}
.oracle-fan-board {
  position: relative;
  height: 460px;
  width: 100%;
  min-width: 0;
  isolation: isolate;
  perspective: 1400px;
}
.oracle-deck-card {
  position: absolute;
  left: 50%;
  top: 5px;
  width: 126px;
  padding: 0;
  border: 0;
  background: transparent;
  opacity: 1;
}
.oracle-deck-card > span {
  pointer-events: none;
  transition:
    transform 0.24s,
    filter 0.24s;
}
.oracle-deck-card:hover:not(:disabled) {
  z-index: 25;
}
.oracle-deck-card:focus-visible {
  z-index: 25;
}
.oracle-deck-card:hover:not(:disabled) > span,
.oracle-deck-card:focus-visible > span {
  transform: translateY(-14px);
  filter: brightness(1.2);
}
.oracle-deck-card.is-picked {
  visibility: visible;
  pointer-events: none;
  z-index: 26;
}
.oracle-deck-card:disabled:not(.is-picked) {
  cursor: wait;
}
.oracle-dialog-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: #36204b;
  color: #faf1e6;
  cursor: pointer;
}
.oracle-dialog-close:focus-visible {
  outline: 2px solid #e0bd85;
  outline-offset: 3px;
}
@media (min-width: 701px) and (max-height: 780px) {
  .oracle-home .oracle-header {
    padding-top: 15px;
  }
  .oracle-home .oracle-arched-nav {
    padding-top: 14px;
    padding-bottom: 22px;
  }
  .oracle-home .oracle-welcome h1 {
    font-size: 30px;
    margin-top: 8px;
  }
  .oracle-home .oracle-welcome p {
    margin-bottom: 15px;
  }
}
.oracle-deck-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  margin: 0 auto 12px;
}
.oracle-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  background: transparent;
  border: 1px solid var(--o-line);
  border-radius: 30px;
  padding: 8px 19px;
  font-size: 14px;
  color: var(--o-text);
}
.oracle-secondary:hover:not(:disabled) {
  background: #bc8fde22;
}
.oracle-secondary:disabled {
  opacity: 0.45;
}
.mobile-deck-arrow,
.oracle-swipe-hint {
  display: none;
}
.oracle-ready {
  padding: 38px 15px 80px;
}
.oracle-ready .oracle-phases {
  margin-bottom: 24px;
}
.oracle-reading-footer {
  display: flex;
  justify-content: center;
  gap: 32px;
  padding: 24px 16px 30px;
  color: var(--o-muted);
  font-size: 13px;
}
.oracle-reading-footer > span {
  color: var(--o-gold);
}
.oracle-results {
  width: min(1160px, calc(100% - 48px));
  margin: 38px auto 0;
  padding-bottom: 45px;
}
.oracle-result-heading {
  text-align: center;
}
.oracle-result-heading h1 {
  font-size: clamp(23px, 3vw, 36px);
  font-weight: 400;
  line-height: 1.6;
  margin: 17px auto 10px;
  max-width: 820px;
  overflow-wrap: anywhere;
}
.oracle-result-heading > p {
  color: var(--o-muted);
  font-size: 14px;
}
.oracle-result-cards {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin: 34px auto 48px;
}
.oracle-result-cards figure {
  margin: 0;
  width: 200px;
  text-align: center;
}
.oracle-result-cards.count-1 figure {
  width: 240px;
}
.oracle-result-cards.count-5 figure {
  width: 166px;
}
.oracle-result-cards figure button {
  position: relative;
  border: 0;
  padding: 0;
  width: 100%;
  background: none;
  border-radius: 10px;
  box-shadow: 0 18px 35px #10051d66;
}
.oracle-result-cards img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
}
.oracle-result-cards button svg {
  position: absolute;
  right: 9px;
  bottom: 9px;
  padding: 5px;
  box-sizing: content-box;
  border-radius: 50%;
  background: #170e29d9;
  color: #fff;
}
.oracle-result-cards figcaption {
  font-size: 17px;
  margin-top: 12px;
}
.oracle-result-cards figcaption span {
  display: block;
  font-size: 13px;
  color: var(--o-muted);
  margin-top: 2px;
}
.oracle-reading-text {
  max-width: 820px;
  margin: auto;
}
.oracle-verdict {
  text-align: center;
  border-top: 1px solid var(--o-line);
  border-bottom: 1px solid var(--o-line);
  padding: 32px 20px;
}
.oracle-verdict > span {
  color: var(--o-gold);
  font-size: 14px;
}
.oracle-verdict h2 {
  font-size: 29px;
  font-weight: 500;
  margin: 10px 0 16px;
}
.oracle-verdict p {
  font-size: 17px;
  line-height: 1.9;
  margin: 0;
}
.oracle-evidence {
  padding: 32px 0;
}
.oracle-reading-text h2 {
  font-size: 24px;
  font-weight: 500;
  margin: 0 0 18px;
}
.oracle-evidence > p {
  color: var(--o-muted);
  font-size: 16px;
  line-height: 1.95;
}
.oracle-evidence dl {
  display: grid;
  gap: 18px;
  margin-top: 24px;
}
.oracle-evidence dl > div {
  display: grid;
  grid-template-columns: 85px 1fr;
  gap: 18px;
}
.oracle-evidence dt {
  font-size: 14px;
  color: var(--o-gold);
  padding-top: 3px;
}
.oracle-evidence dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.9;
  color: var(--o-text);
}
.oracle-card-meanings > article {
  display: grid;
  grid-template-columns: 145px 1fr;
  align-items: start;
  gap: 30px;
  padding: 28px 0;
  border-top: 1px solid var(--o-line);
}
.oracle-meaning-image {
  background: none;
  padding: 0;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
}
.oracle-meaning-image img {
  display: block;
  width: 100%;
  height: auto;
}
.oracle-card-meanings article > div > span {
  color: var(--o-gold);
  font-size: 13px;
}
.oracle-card-meanings h3 {
  font-size: 23px;
  font-weight: 500;
  margin: 5px 0 12px;
}
.oracle-card-meanings p {
  font-size: 16px;
  line-height: 1.9;
  color: var(--o-muted);
  margin: 0 0 16px;
}
.oracle-card-meanings .oracle-advice {
  color: var(--o-text);
}
.oracle-card-meanings summary {
  cursor: pointer;
  font-size: 14px;
  color: var(--o-gold);
  padding: 8px 0;
}
.oracle-card-meanings details p {
  font-size: 14px;
}
.oracle-card-meanings small {
  font-size: 12px;
  color: var(--o-muted);
}
.oracle-boundary {
  padding: 20px 0;
  border-top: 1px solid var(--o-line);
  font-size: 13px;
  color: var(--o-muted);
  line-height: 1.8;
}
.oracle-result-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin-top: 22px;
}
.oracle-result-actions > a {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}
.oracle-results .oracle-note {
  text-align: center;
}
.oracle-card-dialog {
  background: #231333 !important;
  color: #faf1e6 !important;
  max-width: min(92vw, 480px) !important;
  max-height: 94svh;
  overflow: auto;
  text-align: center;
  border: 1px solid #b99ccc55;
  padding: 20px !important;
  border-radius: 16px !important;
}
.oracle-card-dialog > img {
  width: auto;
  max-width: 100%;
  height: min(72svh, 690px);
  object-fit: contain;
  margin: auto;
  display: block;
}
.oracle-card-dialog [data-slot='dialog-title'] {
  font-size: 22px;
}
.oracle-card-dialog [data-slot='dialog-description'] {
  color: #d1bfe0;
}
.oracle-card-dialog [data-slot='dialog-close'] {
  color: #fff;
  background: #332045;
  min-width: 36px;
  min-height: 36px;
}
@keyframes oracle-number {
  from {
    opacity: 0.4;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes oracle-scrim {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (max-width: 950px) and (min-width: 701px) {
  .oracle-result-cards.count-5 {
    gap: 15px;
  }
  .oracle-result-cards.count-5 figure {
    width: 145px;
  }
}
@media (max-width: 700px) {
  .oracle-question-stage {
    width: calc(100% - 32px);
    margin-top: 55px;
    min-height: 610px;
  }
  .oracle-question-stage > h1 {
    font-size: 31px;
  }
  .oracle-question-stage > p {
    font-size: 14px;
    margin-bottom: 30px;
  }
  .oracle-question-field {
    padding: 16px 18px 26px;
    border-radius: 24px 12px 24px 12px;
  }
  .oracle-question-field textarea {
    font-size: 17px;
    min-height: 88px;
  }
  .oracle-spread-choices {
    gap: 8px;
    margin: 18px 0 24px;
  }
  .oracle-spread-choices span {
    padding: 9px 12px;
    font-size: 13px;
  }
  .oracle-note {
    font-size: 12px;
  }
  .oracle-question-ghosts {
    inset: 15px -22px auto;
  }
  .oracle-question-ghosts > span {
    width: 80px;
  }
  .oracle-draw-stage {
    margin-top: 23px;
    min-height: calc(100svh - 155px);
  }
  .oracle-draw-title > p {
    font-size: 13px;
    max-width: 300px;
  }
  .oracle-draw-title h1 {
    font-size: 25px;
    gap: 12px;
  }
  .oracle-draw-title h1 > span {
    width: 51px;
    height: 51px;
    font-size: 32px;
  }
  .oracle-draw-status {
    margin: 8px 0;
  }
  .oracle-fan-board {
    min-width: 100%;
    height: 330px;
  }
  .oracle-deck-card {
    width: 94px;
    top: 10px;
  }
  .oracle-fan-scroll {
    margin-top: 10px;
    overflow-x: hidden;
    touch-action: manipulation;
  }
  .mobile-deck-arrow {
    display: none;
  }
  .oracle-deck-controls {
    margin-top: 2px;
    margin-bottom: 0;
  }
  .oracle-swipe-hint {
    display: block;
    color: var(--o-muted);
    font-size: 12px;
    margin: 6px 0 18px;
  }
  .oracle-reading-footer {
    gap: 20px;
    font-size: 12px;
    padding: 20px 12px max(20px, env(safe-area-inset-bottom));
  }
  .oracle-reading-footer > span {
    display: none;
  }
  .oracle-ready {
    padding-top: 45px;
  }
  .oracle-results {
    width: calc(100% - 32px);
    margin-top: 25px;
  }
  .oracle-result-heading h1 {
    font-size: 24px;
  }
  .oracle-result-cards {
    display: grid;
    justify-content: center;
    align-items: start;
    gap: 20px 12px;
    width: 100%;
    max-width: 340px;
    overflow: visible;
    margin: 25px auto 34px;
    padding: 0;
  }
  .oracle-result-cards figure,
  .oracle-result-cards.count-5 figure,
  .oracle-result-cards.count-1 figure {
    width: auto;
    min-width: 0;
  }
  .oracle-result-cards.count-1 {
    grid-template-columns: minmax(0, 190px);
  }
  .oracle-result-cards.count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 288px;
  }
  .oracle-result-cards.count-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 324px;
  }
  .oracle-result-cards.count-5 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .oracle-result-cards.count-5 figure:nth-child(1) { grid-column: 2 / span 2; grid-row: 1; }
  .oracle-result-cards.count-5 figure:nth-child(2) { grid-column: 4 / span 2; grid-row: 1; }
  .oracle-result-cards.count-5 figure:nth-child(3) { grid-column: 1 / span 2; grid-row: 2; }
  .oracle-result-cards.count-5 figure:nth-child(4) { grid-column: 3 / span 2; grid-row: 2; }
  .oracle-result-cards.count-5 figure:nth-child(5) { grid-column: 5 / span 2; grid-row: 2; }
  .oracle-result-cards:is(.count-3, .count-5) figcaption {
    font-size: 14px;
    line-height: 1.4;
  }
  .oracle-result-cards:is(.count-3, .count-5) figcaption span {
    font-size: 12px;
  }
  .oracle-result-cards figcaption {
    font-size: 16px;
  }
  .oracle-verdict {
    padding: 24px 0;
  }
  .oracle-verdict h2 {
    font-size: 25px;
  }
  .oracle-verdict p {
    font-size: 16px;
  }
  .oracle-reading-text h2 {
    font-size: 22px;
  }
  .oracle-evidence {
    padding: 26px 0;
  }
  .oracle-evidence dl > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .oracle-evidence dl {
    gap: 15px;
  }
  .oracle-evidence dd {
    font-size: 15px;
  }
  .oracle-card-meanings > article {
    grid-template-columns: 86px 1fr;
    gap: 17px;
    padding: 23px 0;
  }
  .oracle-card-meanings h3 {
    font-size: 21px;
  }
  .oracle-card-meanings p {
    font-size: 15px;
  }
  .oracle-card-meanings summary {
    font-size: 13px;
  }
  .oracle-result-actions {
    gap: 15px;
  }
  .oracle-result-actions .oracle-primary {
    width: 100%;
  }
  .oracle-reading-text .oracle-note {
    padding: 0 10px;
  }
}

/* 2026-09-04：固定式星仪 + 单牌旋转。所有覆盖限定公开前台。 */
.oracle-home .oracle-sky {
  background: radial-gradient(
    ellipse at 50% 34%,
    #8652ba 0%,
    #643692 24%,
    #361e53 51%,
    #170e29 78%
  );
}
.oracle-home .oracle-astrolabe {
  width: min(1720px, 100vw);
  top: -72px;
  color: #ddbbf024;
}
.oracle-home .oracle-arched-nav {
  padding: 12px 0 20px;
}
.oracle-home-stage {
  padding: 0 20px 20px;
}
.oracle-welcome h1 {
  font-size: clamp(26px, 2.5vw, 32px);
  font-weight: 400;
  margin: 8px 0 6px;
  letter-spacing: 0.025em;
}
.oracle-welcome .oracle-phases {
  display: none;
}
.oracle-welcome p {
  font-size: 14px;
  margin-bottom: 16px;
}
.oracle-home-stage > .oracle-primary {
  min-height: 46px;
  min-width: 218px;
  padding: 9px 24px;
  font-size: 14px;
}
.oracle-explore-link {
  margin-top: 14px;
}
.oracle-home .oracle-experiences {
  max-width: 920px;
  margin-top: 30px;
}
.oracle-portal {
  border-radius: 95px 48px 18px 18px;
  background: #170d25;
  box-shadow: none;
}
.oracle-portal h2 {
  font-weight: 400;
}
.oracle-portal:hover .oracle-portal-art img {
  transform: none;
  filter: brightness(1.08);
}
.oracle-reveal-stage {
  position: relative;
  margin: 34px auto 0;
  min-height: 630px;
}
.oracle-reveal-heading {
  text-align: center;
  margin: 0 20px 28px;
}
.oracle-reveal-heading h1 {
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 400;
  margin: 0 0 6px;
}
.oracle-reveal-heading p {
  font-size: 14px;
  color: var(--o-muted);
}
.oracle-reveal-row {
  display: flex;
  justify-content: center;
  gap: clamp(16px, 3vw, 48px);
  max-width: 1190px;
  margin: auto;
  padding: 8px 24px 55px;
}
.oracle-reveal-item {
  margin: 0;
  width: clamp(140px, 15vw, 185px);
  flex: 0 0 auto;
  text-align: center;
}
.oracle-reveal-position {
  display: block;
  font-size: 13px;
  color: var(--o-muted);
  margin-bottom: 14px;
}
.oracle-reveal-item > button {
  display: block;
  border: 0;
  padding: 0;
  background: transparent;
  width: 100%;
  aspect-ratio: 518 / 920;
  perspective: 1300px;
  border-radius: 9px;
}
.oracle-reveal-item > button:not(:disabled):hover {
  outline: 1px solid #e0bd8580;
  outline-offset: 5px;
}
.oracle-reveal-item figcaption {
  font-size: 15px;
  margin-top: 16px;
  color: var(--o-gold);
}
.oracle-reveal-row.count-3 .oracle-reveal-item:nth-child(2) {
  margin-top: 28px;
}
.oracle-reveal-row.count-5 .oracle-reveal-item:nth-child(2),
.oracle-reveal-row.count-5 .oracle-reveal-item:nth-child(4) {
  margin-top: 22px;
}
.oracle-reveal-row.count-5 .oracle-reveal-item:nth-child(3) {
  margin-top: 38px;
}
.oracle-reveal-hint {
  text-align: center;
  margin: 0 20px 24px;
  color: var(--o-muted);
  font-size: 12px;
}
.oracle-mobile-reveal-hint {
  display: none;
}
.oracle-results {
  animation: oracle-result-in 0.5s ease-out;
}
@keyframes oracle-result-in {
  from {
    opacity: 0.3;
  }
  to {
    opacity: 1;
  }
}
@media (max-width: 700px) {
  .oracle-header-seal {
    width: 25px;
    height: 25px;
    margin: 0 auto 4px;
  }
  .oracle-home .oracle-arched-nav {
    padding: 8px 0 18px;
  }
  .oracle-arched-nav .oracle-sigil {
    width: 29px;
    height: 33px;
  }
  .oracle-arched-nav a {
    gap: 5px;
  }
  .oracle-home .oracle-astrolabe {
    width: min(100vw, 420px);
    left: 50%;
    top: 158px;
  }
  .oracle-home .oracle-astrolabe > g:first-child {
    opacity: 0.55;
  }
  .oracle-home .oracle-fixed-marks {
    opacity: 0.68;
  }
  .oracle-solar-emblem > circle:first-child {
    stroke-width: 1.6;
    opacity: 0.85;
  }
  .oracle-home .oracle-eclipse {
    width: 27px;
    top: 348px;
  }
  .oracle-home .eclipse-left {
    left: 5%;
  }
  .oracle-home .eclipse-right {
    right: 5%;
  }
  .oracle-single-stage {
    height: 282px;
  }
  .oracle-single-rock {
    width: 139px;
  }
  .oracle-single-halo {
    width: 340px;
  }
  .oracle-home-stage {
    padding: 0 16px 18px;
  }
  .oracle-home .oracle-welcome h1 {
    font-size: 24px;
  }
  .oracle-welcome p {
    font-size: 13px;
    margin-bottom: 14px;
  }
  .oracle-home .oracle-experiences {
    margin-top: 25px;
  }
  .oracle-portal {
    border-radius: 72px 35px 16px 16px;
  }
  .oracle-reveal-stage {
    min-height: 560px;
    margin-top: 26px;
  }
  .oracle-reveal-heading {
    margin-bottom: 20px;
  }
  .oracle-reveal-heading h1 {
    font-size: 25px;
  }
  .oracle-reveal-row {
    overflow-x: auto;
    justify-content: flex-start;
    gap: 19px;
    padding: 8px 25px 45px;
    scroll-snap-type: x proximity;
    scroll-padding: 25px;
  }
  .oracle-reveal-item {
    width: 158px;
    scroll-snap-align: center;
  }
  .oracle-reveal-row.count-1 {
    justify-content: center;
  }
  .oracle-reveal-row.count-1 .oracle-reveal-item {
    width: 200px;
  }
  .oracle-reveal-row:is(.count-3, .count-5) .oracle-reveal-item:nth-child(n) {
    margin-top: 0;
  }
  .oracle-mobile-reveal-hint {
    display: inline;
  }
  .oracle-reveal-row {
    scrollbar-width: thin;
    scrollbar-color: #d1bfe044 transparent;
  }
  .oracle-reveal-row.count-2 {
    justify-content: center;
    gap: 16px;
    padding-inline: 15px;
  }
  .oracle-reveal-row.count-2 .oracle-reveal-item {
    width: min(158px, 42vw);
  }
  .oracle-fan-scroll {
    margin-top: 10px;
  }
  .oracle-fan-board {
    height: 390px;
  }
}
@media (min-width: 701px) and (max-height: 780px) {
  .oracle-home .oracle-header {
    padding-top: 10px;
  }
  .oracle-header-seal {
    width: 27px;
    height: 27px;
    margin: 0 auto 2px;
  }
  .oracle-single-stage {
    height: 275px;
  }
  .oracle-single-rock {
    width: 140px;
  }
  .oracle-home .oracle-welcome h1 {
    font-size: 27px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .oracle-single-rock,
  .oracle-nebula,
  .oracle-sigil *,
  .oracle-fixed-marks *,
  .oracle-art-sheen,
  .oracle-results {
    animation: none !important;
  }
  .oracle-single-rock {
    transform: none;
  }
}

/* 局部光场与居中揭牌：固定几何位置，材质内部有持续变化。 */
.oracle-nebula-canvas {
  opacity: 0.96;
}
.oracle-stars-canvas {
  z-index: 1;
}
.oracle-sky .oracle-astrolabe {
  z-index: 2;
}
.oracle-sky .oracle-eclipse {
  z-index: 3;
}
.oracle-sky::after {
  z-index: 4;
}
.oracle-solar-emblem {
  opacity: 0.95;
}
.oracle-eclipse {
  overflow: hidden;
  background: #e8c69b;
  box-shadow:
    0 0 18px #e7bb7355,
    0 0 40px #d5a46d18;
}
.oracle-eclipse::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #211233;
  animation: oracle-lunar-shadow 12s ease-in-out infinite alternate;
}
.eclipse-right::before {
  animation-delay: -6s;
}
@keyframes oracle-lunar-shadow {
  from {
    transform: translateX(-7%);
  }
  to {
    transform: translateX(7%);
  }
}
.oracle-sun-aura {
  animation: oracle-solar-pulse 4.6s ease-in-out infinite;
}
.oracle-guide-lines {
  opacity: 0.65;
}
@keyframes oracle-solar-pulse {
  0%,
  100% {
    opacity: 0.48;
  }
  50% {
    opacity: 1;
  }
}
.oracle-selected-strip {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin: 22px auto 0;
  padding: 0 18px;
}
.oracle-drawn-slot {
  width: 84px;
  flex: 0 0 auto;
  text-align: center;
}
.oracle-drawn-slot > button {
  width: 100%;
  aspect-ratio: 518/920;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid #d9bbd638;
  border-radius: 6px;
  background: #24133835;
  overflow: hidden;
}
.oracle-drawn-slot > button:has(img) {
  border: 0;
}
.oracle-drawn-slot > button > span {
  font-size: 23px;
  color: #cfb2d2;
  font-weight: 400;
}
.oracle-drawn-slot img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.oracle-drawn-slot > span {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--o-muted);
}
.oracle-reading .oracle-deck-card:is(.is-picked, .is-in-flight) {
  visibility: hidden;
  pointer-events: none;
}
.oracle-reading .oracle-fan-board {
  height: 395px;
}
.oracle-reading .oracle-fan-scroll {
  margin-top: 12px;
}
.oracle-pick-dialog {
  position: fixed;
  inset: 0;
  top: 0;
  left: 0;
  translate: 0 0 !important;
  transform: none !important;
  width: 100vw;
  max-width: none;
  height: 100svh;
  max-height: none;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  display: block;
  background: transparent;
  box-shadow: none;
  z-index: 80;
  animation: none !important;
  color: #faf1e6;
  font-family: var(--font-body);
}
.oracle-pick-shade {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, #47246688, #10091de8 78%);
  pointer-events: none;
}
.oracle-pick-aura {
  position: absolute;
  width: min(780px, 110vw);
  aspect-ratio: 1;
  top: 50%;
  left: 50%;
  translate: -50% -53%;
  pointer-events: none;
  background: radial-gradient(
    ellipse,
    #d7aaf54a 0%,
    #c48ee528 24%,
    #b77ed111 43%,
    transparent 65%
  );
  opacity: 0;
}
.oracle-pick-card {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(300px, 66vw, calc((100svh - 180px) *0.563));
  aspect-ratio: 518/920;
  perspective: 1400px;
  opacity: 0;
}
.oracle-pick-turn {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}
.oracle-pick-front,
.oracle-pick-back {
  position: absolute;
  inset: 0;
  border-radius: 9px;
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  box-shadow: 0 24px 55px #08031177;
}
.oracle-pick-front {
  transform: rotateY(180deg) translateZ(1px);
  background: #251337;
}
.oracle-pick-back {
  transform: translateZ(1px);
  background: #251337;
}
.oracle-pick-front img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.oracle-pick-glint {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 25%,
    #ffecbc22 48%,
    transparent 65%
  );
  pointer-events: none;
}
.oracle-pick-caption {
  position: absolute;
  top: calc(100% + 13px);
  left: -45px;
  right: -45px;
  display: grid;
  text-align: center;
  gap: 3px;
}
.oracle-pick-caption > span {
  color: #e0bd85;
  font-size: 13px;
}
.oracle-pick-caption > strong {
  font-size: 24px;
  font-weight: 500;
}
.oracle-pick-caption > small {
  color: #ddcce8;
  font-size: 13px;
}
.oracle-pick-skip {
  position: absolute;
  bottom: max(18px, env(safe-area-inset-bottom));
  right: 24px;
  min-height: 44px;
  padding: 8px 18px;
  border: 1px solid #d7bbdf66;
  border-radius: 28px;
  background: #251337a6;
  cursor: pointer;
  font-size: 13px;
}
.oracle-pick-skip:focus-visible {
  outline: 2px solid #e0bd85;
  outline-offset: 4px;
}
@media (max-width: 700px) {
  .oracle-selected-strip {
    gap: 10px;
    padding-inline: 14px;
    margin-top: 18px;
  }
  .oracle-drawn-slot {
    width: 63px;
  }
  .oracle-selected-strip.count-5 {
    gap: 8px;
  }
  .oracle-selected-strip.count-5 .oracle-drawn-slot {
    width: calc((100vw - 66px) /5);
    max-width: 62px;
  }
  .oracle-drawn-slot > span {
    font-size: 12px;
    white-space: nowrap;
  }
  .oracle-reading .oracle-fan-board {
    height: 342px;
  }
  .oracle-reading .oracle-fan-board::before,
  .oracle-reading .oracle-fan-board::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 153px;
    pointer-events: none;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 0;
  }
  .oracle-reading .oracle-fan-board::before {
    width: 174px;
    height: 174px;
    border: 1px solid #d9b7893d;
    background:
      radial-gradient(circle, #d8b58f18 0 4%, transparent 5% 38%, #d9b78916 39% 40%, transparent 41%),
      conic-gradient(from 12deg, transparent 0 11%, #d9b7891c 12%, transparent 13% 36%, #d9b78918 37%, transparent 38% 61%, #d9b7891c 62%, transparent 63% 86%, #d9b78918 87%, transparent 88%);
    box-shadow: 0 0 34px #b982d32b, inset 0 0 28px #cba5df12;
  }
  .oracle-reading .oracle-fan-board::after {
    width: 10px;
    height: 10px;
    border: 1px solid #e5c49c9c;
    box-shadow: 0 0 18px #d9b3f0b8, 0 0 46px #b877d56b;
  }
  .oracle-reading .oracle-fan-scroll {
    margin-top: 4px;
  }
  .oracle-reading .oracle-deck-card {
    width: 70px;
  }
  .oracle-reading .oracle-deck-card:active:not(:disabled) > span {
    filter: brightness(1.32) drop-shadow(0 0 8px #d5b0e5a8);
  }
  .oracle-pick-caption > strong {
    font-size: 22px;
  }
  .oracle-pick-skip {
    right: 16px;
    bottom: max(12px, env(safe-area-inset-bottom));
  }
}
@media (prefers-reduced-motion: reduce) {
  .oracle-sun-aura {
    animation: none;
  }
}