/* ============================================
   LASUISUI Oracle — 神谕测试 v2.0
   撕裂边纸卡 · 收集式答题 · 纸片重组
   ============================================ */

.oracle { width: 100vw; min-height: 100vh; position: relative; display: flex; flex-direction: column; }

.question-screen { padding: 60px 32px; width: 100%; }

/* 5 身份预览行（01 测试入口） */
.entrance-five-row {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
}
.ef-cell {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.ef-cell img {
  width: 100%; aspect-ratio: 3/4;
  object-fit: cover; display: block;
  border: 2px solid var(--c-ink);
  box-shadow: 2px 3px 0 rgba(20, 10, 5, 0.4);
  background: var(--c-paper);
}
.ef-cell span {
  font-family: var(--font-hand);
  font-size: 11px; color: var(--c-gold);
  letter-spacing: 0.2em;
}

/* === Screen 01: 神谕测试入口 === */
.entrance-content { padding: 100px 32px 60px; width: 100%; }

/* === Screen 02: 问题页 === */
.answers-grid { display: flex; flex-direction: column; gap: 14px; margin-top: 20px; }
.answer-card { text-align: left !important; }

/* === Screen 04: Loading === */
.loading-screen { padding: 100px 32px 60px; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 80vh; }

/* === Screen 05: 结果 === */
.result-screen {
  width: 100%;
  padding: 60px 20px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: stretch;
  max-width: 1280px;
  margin: 0 auto;
}
.result-portrait-panel {
  display: flex; flex-direction: column; align-items: center;
  position: sticky; top: 80px;
}
.result-portrait-panel .identity-portrait { max-width: 380px; }

.result-info-panel {
  display: flex; flex-direction: column;
  background: var(--c-paper);
  border: 2px solid var(--c-ink);
  box-shadow: 5px 7px 0 rgba(20, 10, 5, 0.5);
  padding: 32px 28px;
  position: relative;
  clip-path: polygon(0% 2%, 3% 0%, 6% 2%, 9% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.result-info-panel::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2' seed='5'/%3E%3CfeColorMatrix values='0 0 0 0 0.4 0 0 0 0 0.32 0 0 0 0 0.2 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: multiply; opacity: 0.28;
}
.result-title {
  font-family: var(--font-hand);
  font-size: 64px; font-weight: 700;
  color: var(--c-ink); letter-spacing: 0.15em;
  line-height: 1.05; margin-bottom: 12px;
}
.result-en {
  font-family: var(--font-sans);
  font-size: 12px; color: var(--c-gold-dim);
  letter-spacing: 0.5em; margin-bottom: 12px;
}
.result-keywords {
  font-family: var(--font-hand);
  font-size: 16px; color: var(--c-ink-light);
  letter-spacing: 0.3em;
  margin-bottom: 24px; padding-bottom: 20px;
  border-bottom: 1px dashed rgba(42, 24, 16, 0.3);
}
.result-desc {
  font-family: var(--font-serif);
  font-size: 15px; color: var(--c-ink);
  line-height: 2; letter-spacing: 0.05em;
  margin-bottom: 24px;
}
.oracle-msg {
  background: rgba(201, 160, 64, 0.1);
  border-left: 3px solid var(--c-gold-dim);
  padding: 18px 22px; margin-bottom: 28px;
  font-family: var(--font-serif);
  font-size: 15px; color: var(--c-ink);
  letter-spacing: 0.05em; line-height: 2;
  font-style: italic;
}
.actions-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 24px; }

/* === 推荐故事 === */
.archive-rec { max-width: 1280px; margin: 60px auto 0; padding: 0 32px; }
.archive-rec-header { display: flex; align-items: baseline; gap: 16px; margin-bottom: 24px; padding-bottom: 12px; border-bottom: 1px dashed rgba(201, 160, 64, 0.3); }
.archive-rec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.archive-rec-footer { margin-top: 32px; text-align: center; padding-bottom: 60px; }