:root {
  --canvas: #f8f8f6;
  --canvas-deep: #efefec;
  --paper: rgba(255, 255, 253, 0.94);
  --paper-solid: #fffffd;
  --ink: #171714;
  --ink-soft: #5f5d56;
  --line: rgba(34, 33, 28, 0.13);
  --line-strong: rgba(34, 33, 28, 0.22);
  --indigo: #27284f;
  --indigo-soft: #4b4d7c;
  --gold: #9b7744;
  --gold-pale: #d8c49c;
  --sidebar-width: 256px;
  --serif: "Songti SC", "STSong", "Noto Serif CJK SC", Georgia, serif;
  --sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-width: 320px;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }
body.auth-visible { overflow: hidden; }

button,
a { -webkit-tap-highlight-color: transparent; }

a { color: inherit; }

button { font: inherit; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.boot-screen {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-content: center;
  gap: 14px;
  background: var(--canvas);
  text-align: center;
}

.boot-screen[hidden] { display: none; }
.boot-screen .boot-mark { color: var(--indigo); font-size: 32px; animation: breathe 1.6s ease-in-out infinite; }
.boot-screen p { margin: 0; font-family: Georgia, var(--serif); font-size: 18px; }
.boot-screen.has-error p { max-width: 360px; color: #9a433d; font-family: var(--sans); font-size: 14px; }

@keyframes breathe { 50% { opacity: 0.35; transform: scale(0.85); } }

.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  grid-template-columns: minmax(360px, 0.82fr) minmax(520px, 1.18fr);
  background: var(--canvas);
  overflow: auto;
}

.auth-gate[hidden],
.onboarding[hidden] { display: none; }

.auth-visual {
  position: relative;
  display: flex;
  min-height: 100vh;
  justify-content: flex-end;
  flex-direction: column;
  overflow: hidden;
  background: #20203c;
  color: #f4efe2;
  padding: 68px;
}

.auth-visual::before {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(244, 239, 227, 0.24) 0.65px, transparent 0.8px);
  background-size: 28px 28px;
  opacity: 0.5;
  content: "";
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}

.auth-visual > p { position: relative; margin: 0 0 14px; color: var(--gold-pale); font-size: 10px; font-weight: 700; letter-spacing: 0.18em; }
.auth-visual blockquote { position: relative; max-width: 470px; margin: 0; font-family: var(--serif); font-size: clamp(29px, 3.4vw, 48px); line-height: 1.36; }

.auth-orbit {
  position: absolute;
  left: 50%;
  top: 13%;
  display: grid;
  width: min(420px, 70%);
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(216, 196, 156, 0.2);
  border-radius: 50%;
  transform: translateX(-50%);
}

.auth-orbit::before,
.auth-orbit::after { position: absolute; inset: 13%; border: 1px solid rgba(216, 196, 156, 0.2); border-radius: 50%; content: ""; transform: scaleY(0.42) rotate(30deg); }
.auth-orbit::after { transform: scaleY(0.42) rotate(-30deg); }
.auth-orbit span { color: var(--gold-pale); font-size: 28px; }

.auth-panel { display: flex; min-height: 100vh; align-items: center; justify-content: center; flex-direction: column; padding: 34px 36px 54px; }
.auth-toolbar { position: absolute; top: 24px; right: 28px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.auth-brand { display: none; align-items: center; gap: 9px; color: var(--ink); text-decoration: none; }
.auth-brand strong { font-family: Georgia, var(--serif); }
.auth-card { width: min(460px, 100%); }
.auth-card h1,
.onboarding-card h1 { margin: 12px 0 10px; font-family: var(--serif); font-size: clamp(38px, 4.2vw, 54px); font-weight: 600; letter-spacing: -0.045em; line-height: 1.15; }
.auth-lead,
.onboarding-card > p:not(.kicker) { margin: 0; color: var(--ink-soft); font-size: 14px; }

.segment-control {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 30px 0 22px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--canvas-deep);
  padding: 4px;
}

.segment-control button,
.email-mode-tabs button { border: 0; border-radius: 9px; background: transparent; color: var(--ink-soft); cursor: pointer; font-size: 13px; padding: 10px; }
.segment-control button.is-active,
.email-mode-tabs button.is-active { background: var(--paper-solid); color: var(--ink); box-shadow: 0 4px 14px rgba(28, 27, 23, 0.06); }

.email-mode-tabs { display: flex; gap: 22px; margin: 0 0 18px; border-bottom: 1px solid var(--line); }
.email-mode-tabs[hidden] { display: none; }
.email-mode-tabs button { position: relative; border-radius: 0; padding: 8px 2px 11px; }
.email-mode-tabs button.is-active { background: transparent; box-shadow: none; }
.email-mode-tabs button.is-active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--gold); content: ""; }

.auth-form,
.profile-form { display: grid; gap: 16px; }
.auth-form[hidden] { display: none; }
.auth-form label,
.profile-form label { display: grid; gap: 7px; color: var(--ink-soft); font-size: 12px; }
.auth-form input,
.profile-form input,
.profile-form select {
  width: 100%;
  min-height: 47px;
  border: 1px solid var(--line);
  border-radius: 11px;
  outline: 0;
  background: rgba(255, 255, 255, 0.66);
  color: var(--ink);
  padding: 0 13px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.auth-form input:focus,
.profile-form input:focus,
.profile-form select:focus { border-color: rgba(39, 40, 79, 0.44); box-shadow: 0 0 0 3px rgba(39, 40, 79, 0.08); }
.field-action { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.text-button { border: 0; background: transparent; color: var(--indigo-soft); cursor: pointer; font-size: 12px; font-weight: 650; padding: 5px; }
.field-action .text-button { min-width: 98px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, 0.48); }
.text-button:disabled { cursor: wait; opacity: 0.52; }
.button.full { width: 100%; }
.form-feedback { min-height: 21px; margin: -2px 0 0; color: var(--ink-soft); font-size: 12px; }
.form-feedback[data-kind="error"] { color: #9a433d; }
.form-feedback[data-kind="success"] { color: #42644e; }
.auth-note { margin: 18px 0 0; color: var(--ink-soft); font-size: 11px; text-align: center; }
.location-status { margin: 10px 0 0; color: var(--ink-soft); font-size: 10px; line-height: 1.6; }
.auth-method-note { margin: -5px 0 0; color: #8b5a31; font-size: 10px; line-height: 1.6; }
.agreement-consent { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 9px; margin-top: 16px; color: var(--ink-soft); font-size: 10px; line-height: 1.75; }
.agreement-consent[hidden] { display: none; }
.agreement-consent input { width: 16px; height: 16px; margin: 3px 0 0; accent-color: var(--indigo); }
.agreement-consent a { color: var(--indigo); text-underline-offset: 2px; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; color: var(--ink-soft); font-size: 10px; }
.auth-divider::before,.auth-divider::after { height: 1px; flex: 1; background: var(--line); content: ""; }
.google-auth > p { margin: 8px 0 0; color: var(--ink-soft); font-size: 9px; line-height: 1.55; text-align: center; }
.google-button { display: flex; min-height: 42px; justify-content: center; }

.select-shell {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.48);
  padding: 0 9px;
}
.select-shell select { border: 0; outline: 0; background: transparent; color: var(--ink); cursor: pointer; font-size: 12px; }
.select-shell svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.compact-select { min-height: 36px; }

.onboarding {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  overflow: auto;
  background: radial-gradient(circle at 50% 10%, rgba(155, 119, 68, 0.09), transparent 38%), var(--canvas);
  padding: 40px 20px;
}
.onboarding-card { width: min(560px, 100%); border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 30px 80px rgba(38, 35, 27, 0.08); padding: 44px; }
.onboarding-step { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; color: var(--gold); font: 11px Georgia, serif; }
.onboarding-step i { width: 58px; height: 1px; background: var(--line-strong); }
.onboarding-card .profile-form { margin-top: 28px; }
.calendar-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; border: 0; padding: 0; }
.calendar-switch legend { margin-bottom: 7px; color: var(--ink-soft); font-size: 12px; }
.calendar-switch label { position: relative; display: block; }
.calendar-switch input { position: absolute; opacity: 0; }
.calendar-switch span { display: flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.5); cursor: pointer; }
.calendar-switch input:checked + span { border-color: var(--indigo); color: var(--indigo); box-shadow: inset 0 0 0 1px var(--indigo); }
.leap-field { grid-template-columns: auto 1fr !important; align-items: center; }
.leap-field input { width: 18px; min-height: 18px; }
.profile-form small { color: var(--ink-soft); font-size: 10px; }

.ambient {
  position: fixed;
  z-index: -1;
  border-radius: 50%;
  filter: blur(2px);
  pointer-events: none;
}

.ambient-one {
  top: -180px;
  right: 8%;
  width: 430px;
  height: 430px;
  border: 1px solid rgba(39, 40, 79, 0.08);
}

.ambient-two {
  left: 36%;
  top: 64%;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(155, 119, 68, 0.09);
}

.app-shell { min-height: 100vh; }

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  display: flex;
  width: var(--sidebar-width);
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: rgba(239, 239, 237, 0.94);
  padding: 28px 20px 22px;
  backdrop-filter: blur(18px);
}

.brand,
.mobile-brand {
  display: flex;
  align-items: center;
  color: var(--ink);
  text-decoration: none;
}

.brand { gap: 12px; padding: 0 8px 28px; }

.brand-mark {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-items: center;
  color: var(--indigo);
}

.brand-mark svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.25; }
.brand-mark svg circle:last-child { fill: var(--canvas); }
.brand-mark.small { width: 30px; height: 30px; }

.brand-copy { display: flex; flex-direction: column; line-height: 1.15; }
.brand-copy strong,
.mobile-brand strong { font-family: Georgia, var(--serif); font-size: 20px; letter-spacing: -0.02em; }
.brand-copy small { margin-top: 6px; color: var(--ink-soft); font-size: 10px; letter-spacing: 0.18em; }

.primary-nav { display: flex; flex-direction: column; gap: 6px; }

.nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--ink-soft);
  font-size: 14px;
  text-decoration: none;
  padding: 0 13px;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.nav-item svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.4;
}

.nav-item svg .fill { fill: currentColor; stroke: none; }

.nav-item:hover { color: var(--ink); transform: translateX(2px); }

.nav-item.is-active {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.58);
  color: var(--ink);
  box-shadow: 0 8px 24px rgba(30, 28, 21, 0.04);
}

.nav-item.is-active::after {
  position: absolute;
  right: 12px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  content: "";
}

.sidebar-foot { display: flex; margin-top: auto; flex-direction: column; gap: 14px; }

.principle-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
  font-family: var(--serif);
  font-size: 12px;
  letter-spacing: 0.06em;
  padding: 20px 8px 4px;
}

.principle-note p { margin: 0; }
.principle-dot { width: 5px; height: 5px; margin-top: 7px; border-radius: 50%; background: var(--gold); }

.language-switch {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.42);
  color: var(--ink);
  cursor: pointer;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.12em;
  transition: background 180ms ease, border-color 180ms ease;
}

.language-switch:hover { border-color: var(--line-strong); background: rgba(255, 255, 255, 0.76); }
.language-switch svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.4; }

.mobile-bar,
.scrim { display: none; }

.main { min-height: 100vh; margin-left: var(--sidebar-width); outline: none; }
.page { min-height: calc(100vh - 140px); }

.workspace-bar {
  position: sticky;
  top: 0;
  z-index: 25;
  display: flex;
  height: 64px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgba(248, 248, 246, 0.88);
  padding: 0 34px;
  backdrop-filter: blur(18px);
}

.workspace-context { display: flex; align-items: center; gap: 9px; color: var(--ink-soft); font-size: 13px; }
.workspace-name { color: var(--ink); font-weight: 650; }
.context-separator { color: rgba(23, 23, 20, 0.28); }
.workspace-language { width: auto; min-width: 68px; min-height: 38px; padding: 0 13px; }
.workspace-actions { display: flex; align-items: center; gap: 9px; }
.account-trigger {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255,255,255,.5);
  color: var(--ink);
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px 4px 5px;
}
.account-avatar,
.compact-account span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; background: var(--indigo); color: #fff; font-size: 12px; font-weight: 700; }
.compact-account { min-height: 36px; padding: 2px; }
.compact-account span { width: 30px; height: 30px; }

.section-wrap { width: min(1120px, calc(100% - 80px)); margin-inline: auto; }

.hero {
  position: relative;
  display: flex;
  min-height: 660px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-block: 100px 90px;
  overflow: hidden;
  text-align: center;
}

.hero::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-strong), transparent);
  content: "";
}

.hero-orbit {
  position: absolute;
  right: 50%;
  top: 40px;
  width: min(34vw, 360px);
  aspect-ratio: 1;
  opacity: 0.18;
  transform: translateX(50%);
}

.orbit { position: absolute; inset: 9%; border: 1px solid rgba(39, 40, 79, 0.18); border-radius: 50%; }
.orbit-one { transform: rotate(-18deg) scaleY(0.46); }
.orbit-two { transform: rotate(54deg) scaleY(0.46); border-color: rgba(155, 119, 68, 0.23); }
.orbit-core { position: absolute; inset: 0; display: grid; place-items: center; color: var(--indigo); font-size: 28px; }
.hero-orbit::before,
.hero-orbit::after { position: absolute; border-radius: 50%; background: var(--gold); content: ""; }
.hero-orbit::before { left: 14%; top: 45%; width: 5px; height: 5px; }
.hero-orbit::after { right: 19%; top: 31%; width: 3px; height: 3px; }

.eyebrow,
.kicker { margin: 0; color: var(--gold); font-size: 11px; font-weight: 650; letter-spacing: 0.22em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow > span:first-child { width: 28px; height: 1px; background: currentColor; }

h1,
h2,
h3,
p { overflow-wrap: break-word; }

h1,
h2,
.system-card h3,
.placeholder-wrap h1 { font-family: var(--serif); font-weight: 600; }

.hero h1 {
  max-width: 720px;
  margin: 20px 0 16px;
  font-size: clamp(52px, 6vw, 74px);
  font-weight: 500;
  letter-spacing: -0.06em;
  line-height: 1.04;
}

.hero-lead { max-width: 610px; margin: 0; color: var(--ink-soft); font-size: 17px; line-height: 1.9; }
.hero-actions { display: flex; justify-content: center; gap: 12px; margin-top: 36px; }

.button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 18px;
  border: 1px solid var(--line-strong);
  border-radius: 11px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0 20px;
  text-decoration: none;
  transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.button:hover { transform: translateY(-2px); }
.button.primary { border-color: var(--ink); background: var(--ink); color: var(--paper-solid); box-shadow: 0 10px 28px rgba(23, 23, 20, 0.14); }
.button.primary:hover { box-shadow: 0 14px 34px rgba(23, 23, 20, 0.19); }
.button.secondary { background: rgba(255, 255, 255, 0.35); }
.button.secondary:hover { background: rgba(255, 255, 255, 0.76); }
.button:disabled { cursor: not-allowed; opacity: .38; transform: none; }
.button:disabled:hover { box-shadow: none; transform: none; }
.button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.5; }

.systems-section,
.roots-section,
.guide-section,
.comparison-section { padding-block: 110px; scroll-margin-top: 20px; }

.section-heading { display: grid; grid-template-columns: 1fr minmax(280px, 400px); align-items: end; gap: 56px; margin-bottom: 40px; }
.section-heading h2,
.roots-copy h2 { margin: 11px 0 0; font-size: clamp(34px, 4vw, 52px); letter-spacing: -0.04em; line-height: 1.2; }
.section-heading > p { margin: 0; color: var(--ink-soft); font-size: 14px; }
.compact-heading { grid-template-columns: 1fr; }

.system-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.system-card {
  position: relative;
  min-height: 530px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
  box-shadow: 0 18px 60px rgba(40, 37, 28, 0.05);
  padding: 34px;
}

.system-card::before {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 100% 0, rgba(155, 119, 68, 0.11), transparent 42%);
  content: "";
  pointer-events: none;
}

.western-card::before { background: radial-gradient(circle at 100% 0, rgba(39, 40, 79, 0.13), transparent 42%); }
.card-topline { position: relative; display: flex; align-items: center; justify-content: space-between; }

.system-seal {
  display: grid;
  width: 49px;
  height: 49px;
  place-items: center;
  border: 1px solid rgba(155, 119, 68, 0.35);
  border-radius: 50%;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 18px;
}

.star-seal { border-color: rgba(39, 40, 79, 0.3); color: var(--indigo); }
.system-index { color: rgba(23, 23, 20, 0.26); font-family: Georgia, serif; font-size: 12px; letter-spacing: 0.16em; }
.card-kicker { position: relative; margin: 46px 0 8px; color: var(--ink-soft); font-size: 10px; font-weight: 700; letter-spacing: 0.18em; }
.system-card h3 { position: relative; margin: 0; font-size: 34px; letter-spacing: -0.035em; }
.system-summary { position: relative; max-width: 480px; margin: 14px 0 32px; color: var(--ink-soft); font-size: 14px; }
.system-groups { position: relative; display: flex; flex-direction: column; gap: 22px; border-top: 1px solid var(--line); padding-top: 26px; }
.system-group { display: flex; flex-direction: column; gap: 9px; }
.group-label { color: var(--ink); font-family: var(--serif); font-size: 14px; }
.tag-list { display: flex; flex-wrap: wrap; gap: 7px; }
.tag-list span { border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, 0.46); color: var(--ink-soft); font-size: 12px; padding: 6px 10px; }

.roots-section { padding-top: 24px; }
.roots-card { display: grid; grid-template-columns: 0.86fr 1.14fr; min-height: 550px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #20203c; color: #f3efe3; box-shadow: 0 24px 70px rgba(24, 24, 44, 0.14); }
.roots-visual { position: relative; display: grid; min-height: 500px; place-items: center; overflow: hidden; background: radial-gradient(circle, rgba(214, 193, 151, 0.12), transparent 50%); }
.roots-visual::before { position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(244, 239, 227, 0.3) 0.65px, transparent 0.8px); background-size: 24px 24px; content: ""; mask-image: linear-gradient(to right, black, transparent); }
.celestial-disc { position: relative; width: min(70%, 300px); aspect-ratio: 1; border: 1px solid rgba(216, 196, 156, 0.28); border-radius: 50%; }
.disc-ring { position: absolute; inset: 14%; border: 1px solid rgba(216, 196, 156, 0.28); border-radius: 50%; }
.ring-b { inset: 31%; }
.disc-axis { position: absolute; inset: 50% 5% auto; height: 1px; background: rgba(216, 196, 156, 0.24); transform-origin: center; }
.axis-b { transform: rotate(90deg); }
.celestial-disc::before,
.celestial-disc::after { position: absolute; inset: 18%; border: 1px solid rgba(216, 196, 156, 0.22); border-radius: 50%; content: ""; }
.celestial-disc::before { transform: scaleY(0.38) rotate(30deg); }
.celestial-disc::after { transform: scaleY(0.38) rotate(-30deg); }
.disc-center { position: absolute; inset: 0; display: grid; place-items: center; color: var(--gold-pale); font-family: var(--serif); font-size: 22px; }
.roots-copy { display: flex; justify-content: center; flex-direction: column; padding: 68px 70px 68px 20px; }
.roots-copy .kicker { color: var(--gold-pale); }
.roots-copy h2 { max-width: 560px; }
.roots-copy > p:not(.kicker) { max-width: 590px; margin: 20px 0 34px; color: rgba(243, 239, 227, 0.66); font-size: 14px; }
.roots-list { margin: 0; }
.roots-list > div { display: grid; grid-template-columns: 84px 1fr; gap: 20px; border-top: 1px solid rgba(243, 239, 227, 0.12); padding: 15px 0; }
.roots-list dt { color: var(--gold-pale); font-size: 11px; letter-spacing: 0.1em; }
.roots-list dd { margin: 0; color: rgba(243, 239, 227, 0.78); font-size: 13px; }

.guide-section { padding-top: 28px; }
.guide-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; list-style: none; padding: 0; }
.guide-grid li { display: flex; min-height: 150px; gap: 20px; border-top: 1px solid var(--line-strong); padding: 25px 24px 20px 0; }
.guide-grid li + li { border-left: 1px solid var(--line); padding-left: 24px; }
.guide-number { color: var(--gold); font-family: Georgia, serif; font-size: 10px; letter-spacing: 0.14em; }
.guide-grid h3 { margin: 0 0 8px; font-family: var(--serif); font-size: 18px; font-weight: 600; }
.guide-grid p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.comparison-section { padding-top: 28px; padding-bottom: 130px; }
.table-shell { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 16px 46px rgba(40, 37, 28, 0.04); outline: none; }
.table-shell:focus-visible { box-shadow: 0 0 0 3px rgba(39, 40, 79, 0.18); }
table { width: 100%; border-collapse: collapse; table-layout: fixed; }
th,
td { text-align: left; vertical-align: top; }
th { background: rgba(39, 40, 79, 0.045); color: var(--ink); font-family: var(--serif); font-size: 14px; font-weight: 600; padding: 19px 20px; }
td { border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 13px; line-height: 1.75; padding: 24px 20px; }
th + th,
td + td { border-left: 1px solid var(--line); }
th:nth-child(1) { width: 17%; }
th:nth-child(2) { width: 22%; }
th:nth-child(3) { width: 30%; }
th:nth-child(4) { width: 31%; }
td:first-child { color: var(--ink); font-family: var(--serif); font-size: 15px; }

.page-placeholder { display: grid; place-items: center; padding: 80px 40px; }
.placeholder-wrap { display: flex; width: min(680px, 100%); align-items: center; flex-direction: column; text-align: center; }
.placeholder-symbol { position: relative; display: grid; width: 110px; height: 110px; margin-bottom: 34px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--indigo); font-size: 32px; }
.eastern-symbol span { position: absolute; left: 28px; right: 28px; height: 1px; background: var(--indigo); }
.eastern-symbol span:first-child { transform: rotate(45deg); }
.eastern-symbol span:last-child { transform: rotate(-45deg); }
.eastern-symbol::before,
.eastern-symbol::after { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--gold); content: ""; }
.eastern-symbol::before { top: 18px; }
.eastern-symbol::after { bottom: 18px; }
.western-symbol { font-size: 28px; }
.western-symbol::before { position: absolute; inset: 15px; border: 1px solid rgba(39, 40, 79, 0.22); border-radius: 50%; content: ""; transform: scaleY(0.4) rotate(30deg); }
.placeholder-wrap h1 { margin: 22px 0 14px; font-size: clamp(42px, 6vw, 68px); letter-spacing: -0.055em; line-height: 1.12; }
.placeholder-wrap > p:not(.eyebrow) { margin: 0 0 34px; color: var(--ink-soft); }

.admin-page { padding: 94px 0 130px; }
.admin-wrap { width: min(1040px, calc(100% - 80px)); }
.admin-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin: 12px 0 42px; }
.admin-heading h1 { margin: 0 0 10px; font-family: var(--serif); font-size: clamp(42px, 5vw, 64px); font-weight: 600; letter-spacing: -0.05em; }
.admin-heading p { max-width: 660px; margin: 0; color: var(--ink-soft); font-size: 13px; }
.account-count { display: grid; width: 54px; height: 54px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold); font: 18px Georgia, serif; }
.admin-list { display: grid; gap: 12px; color: var(--ink-soft); }
.account-card { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 24px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); padding: 25px; }
.account-card-identity { display: flex; min-width: 0; align-items: center; gap: 14px; }
.account-card-identity > span { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 12px; background: var(--indigo); color: #fff; font-weight: 700; }
.account-card h2 { margin: 0; overflow: hidden; font-family: var(--sans); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.account-card-identity p { margin: 3px 0 0; color: var(--ink-soft); font-size: 11px; }
.profile-status { align-self: start; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-soft); font-size: 10px; padding: 5px 9px; }
.profile-status.complete { border-color: rgba(66,100,78,.24); background: rgba(66,100,78,.07); color: #42644e; }
.account-card dl { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; border-top: 1px solid var(--line); padding-top: 18px; }
.account-card dl > div { min-width: 0; padding: 6px 16px 6px 0; }
.account-card dt { color: var(--gold); font-size: 9px; letter-spacing: .08em; }
.account-card dd { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--ink); font-size: 12px; }

.daily-oracle-page,
.eastern-tools-page,
.reports-page { padding: 92px 0 130px; }
.daily-oracle-wrap,
.eastern-tools-wrap,
.reports-wrap { width: min(1040px, calc(100% - 80px)); }
.daily-oracle-heading { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);align-items:end;gap:42px;margin-bottom:28px; }
.daily-oracle-heading h1 { max-width:680px;margin:8px 0 12px;font:600 clamp(42px,5vw,64px)/1.18 var(--serif);letter-spacing:-.05em; }
.daily-oracle-heading > div > p:last-child { max-width:620px;margin:0;color:var(--ink-soft);font-size:13px;line-height:1.9; }
.daily-quote-card { min-height:170px;margin:0;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,253,.94),rgba(239,237,226,.9));padding:30px; }
.daily-quote-card p { margin:0;font:600 25px/1.55 var(--serif); }
.daily-quote-card cite { display:block;margin-top:18px;color:var(--gold);font-size:10px;font-style:normal;letter-spacing:.08em; }
.daily-context-strip { display:flex;flex-wrap:wrap;gap:9px;margin-bottom:24px; }
.daily-context-strip span { border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.45);color:var(--ink-soft);font-size:10px;padding:7px 11px; }
.daily-choice-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px; }
.daily-choice-card { position:relative;display:flex;min-height:245px;overflow:hidden;align-items:flex-start;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:var(--paper);color:var(--ink);cursor:pointer;padding:23px;text-align:left;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.daily-choice-card::after { position:absolute;right:-60px;top:-60px;width:160px;height:160px;border:1px solid rgba(155,119,68,.12);border-radius:50%;content:""; }
.daily-choice-card:hover { border-color:rgba(39,40,79,.28);box-shadow:0 22px 60px rgba(37,35,28,.08);transform:translateY(-3px); }
.daily-choice-card:focus-visible { outline:3px solid rgba(39,40,79,.15);outline-offset:3px; }
.daily-choice-card > span { color:var(--gold);font:11px Georgia,serif;letter-spacing:.12em; }
.daily-choice-card > b { display:grid;width:58px;height:58px;margin:28px 0 22px;place-items:center;border:1px solid rgba(39,40,79,.18);border-radius:50%;color:var(--indigo);font:500 24px/1 var(--serif); }
.daily-choice-card > strong { font:600 25px/1.25 var(--serif); }
.daily-choice-card > small { margin-top:9px;color:var(--ink-soft);font-size:11px;line-height:1.75; }
.metaphysics-system-switch {
  display: inline-flex;
  gap: 4px;
  margin-bottom: 34px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.52);
  padding: 4px;
}
.metaphysics-system-switch button {
  min-height: 38px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ink-soft);
  cursor: pointer;
  font: 650 12px var(--sans);
  padding: 0 20px;
  transition: background 180ms ease, box-shadow 180ms ease, color 180ms ease;
}
.metaphysics-system-switch button.is-active {
  background: var(--paper-solid);
  box-shadow: 0 5px 16px rgba(28,27,23,.08);
  color: var(--indigo);
}
.metaphysics-system-switch button:focus-visible { outline: 3px solid rgba(39,40,79,.15); outline-offset: 2px; }
.eastern-tools-heading { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr); align-items: end; gap: 42px; margin: 12px 0 48px; }
.eastern-tools-heading > div,
.tool-copy { min-width: 0; }
.eastern-tools-heading h1,
.reports-heading h1 { max-width: 760px; margin: 8px 0 0; font-family: var(--serif); font-size: clamp(42px, 5vw, 64px); font-weight: 600; letter-spacing: -0.05em; line-height: 1.18; }
.eastern-tools-heading > p,
.reports-heading p { margin: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.9; }
.eastern-tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.eastern-tool-card { position: relative; display: flex; min-height: 330px; overflow: hidden; align-items: flex-start; flex-direction: column; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); color: var(--ink); cursor: pointer; padding: 24px; text-align: left; transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.eastern-tool-card:hover { border-color: rgba(39,40,79,.28); box-shadow: 0 22px 60px rgba(37,35,28,.08); transform: translateY(-2px); }
.eastern-tool-card:focus-visible { outline: 3px solid rgba(39,40,79,.16); outline-offset: 3px; }
.eastern-tool-card.is-primary { background: linear-gradient(150deg, #fffffd 10%, #f1f0e9 100%); }
.eastern-tool-card::after { position: absolute; right: -52px; top: -52px; width: 170px; height: 170px; border: 1px solid rgba(39,40,79,.1); border-radius: 50%; content: ""; }
.tool-index { color: var(--gold); font: 11px Georgia, serif; letter-spacing: .12em; }
.tool-symbol { display: grid; width: 70px; height: 70px; margin: 40px 0 32px; place-items: center; border: 1px solid rgba(39,40,79,.22); border-radius: 50%; color: var(--indigo); font: 32px var(--serif); }
.tool-copy { display: grid; width: 100%; max-width: 100%; gap: 9px; }
.tool-copy strong { max-width: 100%; overflow-wrap: anywhere; font: 600 27px var(--serif); }
.tool-copy small { max-width: 100%; overflow-wrap: anywhere; color: var(--ink-soft); font-size: 12px; line-height: 1.8; }
.tool-state { margin-top: auto; color: var(--indigo); font-size: 11px; font-weight: 650; }
.tool-state.muted { color: var(--ink-faint); }
.western-tools-heading { align-items: start; }
.scripture-source { display: block; margin-top: 12px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.western-tool-grid { align-items: stretch; }
.western-tool-card { min-height: 400px; background: linear-gradient(155deg, #fffffd 0%, #f6f5f0 100%); }
.western-tool-card::before { position: absolute; inset: 0; background: radial-gradient(circle at 100% 0, rgba(39,40,79,.09), transparent 42%); content: ""; pointer-events: none; }
.reports-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin: 12px 0 42px; }
.reports-heading p { max-width: 670px; margin-top: 10px; }
.report-count { display: grid; width: 54px; height: 54px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold); font: 18px Georgia, serif; }
.report-list { display: grid; gap: 12px; color: var(--ink-soft); }
.report-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 24px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); padding: 23px 25px; }
.report-card-title { display: flex; min-width: 0; align-items: center; gap: 14px; }
.report-card-seal { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(39,40,79,.24); border-radius: 50%; color: var(--indigo); font: 20px var(--serif); }
.report-card h2 { margin: 0; overflow: hidden; font: 600 17px var(--serif); text-overflow: ellipsis; white-space: nowrap; }
.report-card-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 5px 0 0; color: var(--ink-soft); font-size: 10px; }
.report-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.report-card-actions .button { min-height: 38px; padding: 0 15px; font-size: 11px; }

dialog { color: var(--ink); }
dialog::backdrop { background: rgba(22, 21, 18, .34); backdrop-filter: blur(6px); }
.account-dialog,
.contact-dialog,
.assessment-dialog,
.daily-oracle-dialog,
.report-reader-dialog,
.export-dialog { width: min(720px, calc(100% - 32px)); max-height: min(84vh, 820px); overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--paper-solid); box-shadow: 0 36px 100px rgba(21,20,17,.2); padding: 0; }
.account-dialog[open] { display: grid; height: min(84vh,820px); grid-template-rows: auto minmax(0,1fr); }
.contact-dialog { width: min(470px, calc(100% - 32px)); }
.assessment-dialog { width: min(660px, calc(100% - 32px)); }
.assessment-dialog[open] { display: grid; height: min(84vh, 820px); grid-template-rows: auto minmax(0, 1fr) auto; }
.daily-oracle-dialog { width:min(650px,calc(100% - 32px));max-height:90vh; }
.daily-oracle-dialog[open] { display:grid;grid-template-rows:auto minmax(0,1fr); }
.daily-oracle-dialog-body { min-height:0;overflow:auto;padding:28px; }
.daily-oracle-loading,.daily-oracle-error { display:flex;min-height:500px;align-items:center;justify-content:center;flex-direction:column;text-align:center; }
.daily-oracle-loading h3,.daily-oracle-error h3,.daily-oracle-result h3 { margin:10px 0 8px;font:600 31px/1.25 var(--serif); }
.daily-oracle-loading > p:last-child,.daily-oracle-error > p { max-width:460px;margin:0;color:var(--ink-soft);font-size:12px; }
.oracle-stream.is-daily-oracle { background:radial-gradient(circle at 50% 45%,rgba(216,196,156,.24),transparent 26%),repeating-radial-gradient(ellipse at 50% 110%,transparent 0 18px,rgba(39,40,79,.08) 19px 20px); }
.oracle-stream.is-daily-oracle::before { inset:14px;border-style:dashed;transform:scaleY(.62) rotate(18deg);animation-duration:13s; }
.oracle-stream.is-daily-oracle::after { inset:48px;border-style:dotted;transform:scaleY(.6) rotate(-32deg);animation-duration:9s; }
.oracle-stream.is-daily-oracle > span svg,
.oracle-stream.is-daily-oracle > b svg { width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.35; }
.daily-oracle-result { display:flex;align-items:center;flex-direction:column;text-align:center; }
.daily-share-card-panel { display:grid;width:min(100%,440px);gap:12px;margin-top:22px;border:1px solid var(--line);border-radius:18px;background:#f5f3ed;padding:14px;text-align:left; }
.daily-share-card-panel canvas { display:block;width:100%;height:auto;aspect-ratio:4/5;border-radius:12px;background:#20203c;box-shadow:0 18px 42px rgba(24,23,39,.15); }
.daily-share-card-panel > p { margin:0;color:var(--ink-soft);font-size:10px;line-height:1.7;text-align:center; }
.daily-share-card-panel.is-card-revealing { perspective:1400px;overflow:hidden; }
.daily-oracle-again { width:min(100%,440px);margin-top:12px; }
.daily-share-card-panel canvas[class*="daily-card-"] { transform-origin:50% 50%;will-change:transform,opacity,filter,clip-path;animation-duration:5s;animation-fill-mode:both;animation-timing-function:cubic-bezier(.16,.82,.2,1); }
.daily-card-orbit_bloom { animation-name:dailyOrbitBloom; }
.daily-card-ink_ripple { animation-name:dailyInkRipple; }
.daily-card-luminous_path { animation-name:dailyLuminousPath; }
.daily-card-aurora_fold { animation-name:dailyAuroraFold; }
.daily-card-celestial_turn { animation-name:dailyCelestialTurn; }
.daily-card-rising_constellation { animation-name:dailyRisingConstellation; }
.export-dialog { width: min(480px, calc(100% - 32px)); }
.report-reader-dialog { width: min(1180px, calc(100% - 28px)); height: min(90vh, 920px); max-height: 90vh; }
.dialog-top { display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 24px 26px 20px; }
.dialog-top h2 { margin: 7px 0 0; font-family: var(--serif); font-size: 30px; }
.dialog-close { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 10px; background: transparent; cursor: pointer; font-size: 22px; line-height: 1; }
.dialog-scroll { min-height: 0; max-height: calc(84vh - 92px); overflow: auto; padding: 0 26px 26px; }
.dialog-section { padding: 25px 0; }
.dialog-section + .dialog-section { border-top: 1px solid var(--line); }
.dialog-section h3 { margin: 0 0 15px; font-family: var(--serif); font-size: 18px; }
.contact-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding: 14px 0; }
.contact-row:last-child { border-bottom: 1px solid var(--line); }
.contact-row > div { display: grid; gap: 3px; }
.contact-row span { color: var(--ink-soft); font-size: 10px; }
.contact-row strong { font-size: 13px; font-weight: 600; }
.profile-form.two-column { grid-template-columns: 1fr 1fr; }
.profile-form .span-two { grid-column: 1 / -1; }
.logout-button { position: sticky; z-index: 3; bottom: 0; width: 100%; border: 1px solid rgba(154,67,61,.2); border-radius: 11px; background: #fffaf8; box-shadow: 0 -12px 24px rgba(255,255,253,.94); color: #8b3f39; cursor: pointer; padding: 12px; }
.comparison-history-dialog { width:min(560px,calc(100% - 32px));max-height:90vh;overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--paper-solid);box-shadow:0 36px 100px rgba(21,20,17,.2);padding:0; }
.comparison-history-dialog[open] { display:grid;grid-template-rows:auto minmax(0,1fr); }
.comparison-history-body { min-height:0;overflow:auto;padding:22px; }
.comparison-history-body canvas { display:block;width:min(100%,440px);height:auto;aspect-ratio:4/5;margin:0 auto 14px;border-radius:18px;background:transparent;box-shadow:0 18px 42px rgba(24,23,39,.15); }
.contact-dialog #contact-form { padding: 25px 26px 28px; }
.assessment-body { min-height: 0; max-height: none; overflow-y: auto; padding: 28px; }
.assessment-start-action { position: relative; z-index: 2; border-top: 1px solid var(--line); background: rgba(255,255,253,.96); box-shadow: 0 -12px 30px rgba(31,29,24,.05); padding: 12px 28px 18px; }
.assessment-start-action .form-feedback { min-height: 16px; margin: 0 0 7px; }
.assessment-intro { margin: 0 0 24px; color: var(--ink-soft); line-height: 1.9; }
.assessment-user-field,
.export-form label { display: grid; gap: 8px; color: var(--ink-soft); font-size: 11px; }
.assessment-user-field select,
.export-form select { width: 100%; min-height: 46px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink); padding: 0 13px; }
.assessment-profile { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 22px 0; border-block: 1px solid var(--line); }
.assessment-profile div { min-width: 0; padding: 14px 12px 14px 0; }
.assessment-profile span { display: block; margin-bottom: 4px; color: var(--gold); font-size: 9px; letter-spacing: .08em; }
.assessment-profile strong { display: block; overflow-wrap: anywhere; font-size: 12px; font-weight: 550; }
.decision-fields { display: grid; gap: 16px; margin: 4px 0 20px; }
.decision-fields > label { display: grid; gap: 8px; color: var(--ink-soft); font-size: 11px; }
.decision-fields select,
.decision-fields textarea { width: 100%; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink); font: inherit; padding: 12px 13px; }
.decision-fields select { min-height: 46px; }
.decision-fields textarea { min-height: 82px; resize: vertical; line-height: 1.65; }
.western-assessment-fields { display: grid; gap: 16px; margin: 4px 0 20px; }
.western-assessment-fields > label { display: grid; gap: 8px; color: var(--ink-soft); font-size: 11px; }
.western-assessment-fields textarea { width: 100%; min-height: 112px; resize: vertical; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink); font: inherit; line-height: 1.65; padding: 12px 13px; }
.tarot-selection { display:grid;gap:14px;border:1px solid #d8cdbb;border-radius:18px;background:linear-gradient(145deg,#faf4e8,#e7d2aa);padding:18px; }
.tarot-selection-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:18px; }
.tarot-selection-heading h3 { margin:5px 0 0;font:600 23px/1.2 var(--serif); }
.tarot-selection-heading strong { color:var(--gold);font:600 20px/1 var(--serif); }
.tarot-selection > p { margin:0;color:#6d5b49;font-size:11px; }
.tarot-selected-slots { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }
.tarot-selected-card { display:flex;min-height:122px;flex-direction:column;justify-content:space-between;margin:0;border:1px dashed rgba(91,57,33,.3);border-left:1px dashed rgba(91,57,33,.3);border-radius:13px;background:rgba(255,252,243,.56);padding:12px; }
.tarot-selected-card.is-filled { border-style:solid;background:#fffaf0;box-shadow:0 10px 24px rgba(87,54,30,.1); }
.tarot-selected-card span,.tarot-selected-card small { color:#8c643d;font-size:9px;letter-spacing:.08em; }
.tarot-selected-card strong { font:600 15px/1.3 var(--serif); }
.tarot-deck-grid { display:grid;max-height:255px;grid-template-columns:repeat(13,minmax(30px,1fr));gap:5px;overflow:auto;padding:6px;border:1px solid rgba(91,57,33,.18);border-radius:13px;background:rgba(70,39,25,.06); }
.tarot-deck-card { display:grid;min-width:0;aspect-ratio:.62;place-items:center;border:1px solid rgba(235,211,164,.46);border-radius:5px;background:radial-gradient(circle at 50% 40%,rgba(232,202,137,.23),transparent 28%),linear-gradient(145deg,#382118,#75502f);color:#ebd1a0;cursor:pointer;padding:2px;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease; }
.tarot-deck-card:hover:not(:disabled),.tarot-deck-card:focus-visible { transform:translateY(-3px);box-shadow:0 8px 16px rgba(68,39,22,.22); }
.tarot-deck-card:disabled { cursor:not-allowed;opacity:.28; }
.tarot-deck-card.is-selected { background:linear-gradient(145deg,#fff6de,#c99b58);color:#48291b;border-color:#81542f; }
.tarot-deck-card span { font:600 13px/1 var(--serif); }
.tarot-deck-card small { font-size:7px;opacity:.72; }
.decision-time-card { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 14px; border: 1px solid rgba(155,119,68,.2); border-radius: 14px; background: rgba(155,119,68,.05); padding: 14px 16px; }
.decision-time-card > span { color: var(--gold); font-size: 9px; letter-spacing: .08em; }
.decision-time-card strong { justify-self: end; color: var(--indigo); font: 600 14px Georgia,var(--sans); }
.decision-time-card small { grid-column: 1 / -1; color: var(--ink-soft); font-size: 10px; }
.decision-cast-panel { border: 1px solid var(--line); border-radius: 17px; background: #f7f5ef; padding: 17px; }
.decision-cast-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.decision-cast-heading .kicker { display: block; font-size: 9px; }
.decision-cast-heading h3 { margin: 5px 0 0; font: 600 18px var(--serif); }
.decision-cast-heading > strong { flex: 0 0 auto; color: var(--gold); font: 16px Georgia,serif; }
.decision-lines { display: grid; gap: 7px; margin: 17px 0; padding: 0; list-style: none; }
.decision-lines li { display: grid; min-height: 43px; grid-template-columns: 54px 86px minmax(105px,1fr) 76px; align-items: center; gap: 10px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 11px; padding: 8px 2px; }
.decision-lines li:last-child { border-bottom: 1px solid var(--line); }
.decision-line-coins { display: flex; gap: 5px; }
.decision-coin { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(155,119,68,.36); border-radius: 50%; background: #fffaf0; color: var(--gold); font-size: 9px; }
.decision-line-form { color: var(--indigo); font: 600 16px/1 monospace; letter-spacing: 2px; white-space: nowrap; }
.decision-line-state { justify-self: end; font-size: 10px; }
.decision-cast-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.decision-cast-actions .button { width: 100%; min-height: 42px; }
.decision-cast-hint { margin: 11px 0 0; color: var(--ink-soft); font-size: 10px; line-height: 1.7; }
.oracle-stream.is-decision::before { inset: 13px; transform: scaleY(.48) rotate(0); animation-duration: 12s; }
.oracle-stream.is-decision::after { inset: 51px; border-style: dashed; transform: scaleY(.48) rotate(90deg); animation-duration: 8s; }
.assessment-generating,
.assessment-result { display: flex; min-height: 400px; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.assessment-generating h3,
.assessment-result h3 { margin: 12px 0 8px; font: 600 32px var(--serif); }
.assessment-generating > p:last-child,
.assessment-result > p:last-of-type { margin: 0; color: var(--ink-soft); font-size: 12px; }
.oracle-glyph-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.oracle-stream { position: relative; width: 260px; height: 230px; overflow: hidden; margin-bottom: 22px; border: 1px solid rgba(39,40,79,.12); border-radius: 50%; background: radial-gradient(circle,rgba(155,119,68,.1),transparent 64%); }
.oracle-stream::before,
.oracle-stream::after { position: absolute; inset: 22px; border: 1px solid rgba(39,40,79,.14); border-radius: 50%; content: ""; animation: oracleOrbit 7s linear infinite; transform: scaleY(.38) rotate(22deg); }
.oracle-stream::after { animation-direction: reverse; transform: scaleY(.38) rotate(-28deg); }
.oracle-stream span { position: absolute; left: calc(50% - 16px); top: 50%; color: var(--indigo); opacity: .75; animation: oracleFlow 4.8s ease-in-out infinite; }
.oracle-stream svg { display: block; width: 34px; height: 34px; overflow: visible; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.oracle-stream span:nth-child(1) { --x:-92px; --y:-68px; animation-delay:-.4s; }
.oracle-stream span:nth-child(2) { --x:-36px; --y:-88px; animation-delay:-1.1s; }
.oracle-stream span:nth-child(3) { --x:45px; --y:-72px; animation-delay:-1.8s; }
.oracle-stream span:nth-child(4) { --x:86px; --y:-8px; animation-delay:-2.5s; }
.oracle-stream span:nth-child(5) { --x:54px; --y:62px; animation-delay:-3.2s; }
.oracle-stream span:nth-child(6) { --x:-8px; --y:82px; animation-delay:-3.9s; }
.oracle-stream span:nth-child(7) { --x:-72px; --y:58px; animation-delay:-4.6s; }
.oracle-stream span:nth-child(8) { --x:-90px; --y:2px; animation-delay:-2.1s; }
.oracle-stream span:nth-child(9) { --x:2px; --y:-8px; animation-delay:-3.1s; }
.oracle-stream b { position: absolute; inset: 0; display: grid; place-items: center; color: var(--gold); font: 30px/1 var(--serif); animation: oraclePulse 1.8s ease-in-out infinite; }
.oracle-stream b svg { width: 44px; height: 44px; stroke-width: 2.8; }
.oracle-stream b span { position: static; left: auto; top: auto; color: inherit; opacity: 1; font: 600 44px/1 var(--serif); animation: none; transform: none; }
.oracle-stream.is-ziwei::before { inset: 16px; border-style: dashed; transform: none; animation-duration: 18s; }
.oracle-stream.is-ziwei::after { inset: 48px; transform: none; animation-duration: 11s; }
.oracle-stream.is-ziwei b { text-shadow: 0 0 24px rgba(155,119,68,.34); }
.oracle-stream.is-western-natal {
  background:
    radial-gradient(circle at 50% 46%,rgba(214,176,106,.2),transparent 25%),
    radial-gradient(circle,rgba(32,32,61,.07),transparent 66%);
}
.oracle-stream.is-western-natal::before { inset: 13px; border-style: dashed; transform: scaleY(.72) rotate(18deg); animation-duration: 14s; }
.oracle-stream.is-western-natal::after { inset: 47px; transform: scaleY(.72) rotate(-34deg); animation-duration: 9s; }
.oracle-stream.is-western-natal i {
  position: absolute;
  inset: 42% -18% -20%;
  border-radius: 50%;
  background: repeating-radial-gradient(ellipse at 50% 116%,transparent 0 18px,rgba(155,119,68,.14) 19px 20px);
  animation: natalTerrainFlow 8s ease-in-out infinite alternate;
}
.oracle-stream.is-western-natal b { text-shadow: 0 0 26px rgba(155,119,68,.44); }
.oracle-stream.is-western-whole-sign {
  background:
    radial-gradient(circle at 50% 48%,rgba(214,176,106,.2),transparent 27%),
    repeating-radial-gradient(ellipse at 50% 50%,transparent 0 29px,rgba(155,119,68,.08) 30px 31px);
}
.oracle-stream.is-western-whole-sign::before { inset: 10px; border-style: dashed; animation-duration: 16s; }
.oracle-stream.is-western-whole-sign::after { inset: 43px; border-style: dotted; transform: rotate(-15deg); animation-duration: 10s; }
.oracle-stream.is-western-whole-sign i {
  position: absolute;
  inset: 40% -20% -22%;
  border-radius: 50%;
  background: repeating-radial-gradient(ellipse at 50% 118%,transparent 0 17px,rgba(155,119,68,.16) 18px 19px);
  animation: natalTerrainFlow 7s ease-in-out infinite alternate;
}
.oracle-stream.is-western-whole-sign b { text-shadow: 0 0 28px rgba(155,119,68,.48); }
.oracle-stream.is-western-tarot {
  background:
    radial-gradient(circle at 50% 42%,rgba(218,181,111,.24),transparent 28%),
    repeating-radial-gradient(ellipse at 50% 112%,transparent 0 18px,rgba(124,80,43,.12) 19px 20px),
    linear-gradient(155deg,#f4e7c6,#b3844e 65%,#4b2c20);
}
.oracle-stream.is-western-tarot::before { inset: 12px; border-style: dashed; transform: scaleY(.66) rotate(18deg); animation-duration: 13s; }
.oracle-stream.is-western-tarot::after { inset: 46px; border-style: dotted; transform: scaleY(.7) rotate(-32deg); animation-duration: 8s; }
.oracle-stream.is-western-tarot i {
  position:absolute;left:50%;top:50%;width:42px;height:72px;border:1px solid rgba(95,55,29,.48);border-radius:5px;
  box-shadow:-58px 12px 0 -1px rgba(242,224,185,.62),58px 12px 0 -1px rgba(242,224,185,.62);
  transform:translate(-50%,-50%);animation:oraclePulse 2s ease-in-out infinite;
}
.oracle-stream.is-western-tarot b { color:#6f3f24;text-shadow:0 0 26px rgba(255,234,187,.58); }
.oracle-stream-match { background: radial-gradient(circle,rgba(155,119,68,.16),transparent 64%); }
.oracle-stream-match b { font-family: var(--serif); font-size: 34px; }
.result-seal { display: grid; width: 90px; height: 90px; margin-bottom: 25px; place-items: center; border: 1px solid rgba(155,119,68,.34); border-radius: 50%; color: var(--gold); font: 38px var(--serif); }
.result-actions { display: flex; gap: 10px; margin-top: 30px; }
.comparison-error > p:last-of-type { max-width: 460px; }
.share-card-panel { display: grid; width: min(100%, 440px); gap: 12px; margin-top: 28px; border: 1px solid var(--line); border-radius: 18px; background: #f5f3ed; padding: 14px; text-align: left; }
.share-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--indigo); font-size: 11px; font-weight: 650; }
.share-card-heading small { color: var(--gold); font: 10px Georgia,serif; letter-spacing: .08em; }
.share-card-panel canvas { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; border-radius: 12px; background: #171727; box-shadow: 0 18px 42px rgba(24,23,39,.15); }
.share-card-panel.is-card-revealing { perspective: 1200px; }
.share-card-panel canvas.share-card-celestial-drop {
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  will-change: transform, opacity, filter;
  animation: shareCardCelestialDrop 5s cubic-bezier(.16,.78,.22,1) both;
}
.share-card-panel canvas.share-card-meteor-arrival {
  transform-origin: 50% 50%;
  will-change: transform, opacity, filter, box-shadow;
  animation: shareCardMeteorArrival 5s cubic-bezier(.16,.82,.2,1) both;
}
.share-card-panel p { margin: 0; color: var(--ink-soft); font-size: 10px; line-height: 1.7; text-align: center; }
.share-card-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.share-card-action { width: 100%; min-height: 42px; padding-inline: 12px; font-size: 11px; }
.share-download { grid-column: 1 / -1; border: 1px solid rgba(39,40,79,.18); background: transparent; color: var(--indigo); }
.share-wechat { border: 1px solid rgba(7,145,75,.24); background: rgba(7,193,96,.06); color: #087a43; }
.share-x { border: 1px solid rgba(15,20,25,.22); background: rgba(15,20,25,.05); color: #0f1419; }
.share-instagram { border: 1px solid rgba(193,53,132,.24); background: rgba(193,53,132,.05); color: #9b246b; }
.share-card-panel .share-action-hint { color: #706d65; font-size: 9px; }
.report-reader-dialog .dialog-top { height: 88px; }
.report-reader-dialog iframe { display: block; width: 100%; height: calc(90vh - 88px); border: 0; background: var(--canvas); }
.export-form { display: grid; gap: 18px; padding: 26px; }
@keyframes oracleOrbit { to { rotate: 360deg; } }
@keyframes oracleFlow { 0%,100% { opacity:.18; transform: translate(0,0) scale(.82) rotate(-8deg); } 48% { opacity:.82; transform: translate(var(--x),var(--y)) scale(1.06) rotate(7deg); } }
@keyframes oraclePulse { 50% { opacity:.45; transform: scale(.84); } }
@keyframes natalTerrainFlow { 50% { opacity:.48; transform: translateY(-10px) scaleX(1.08); } }
@keyframes shareCardCelestialDrop {
  0% { opacity: 0; filter: blur(10px) brightness(1.35); transform: translate3d(0,-92vh,0) rotateY(-1080deg) scale(.72); }
  14% { opacity: 1; }
  68% { filter: blur(0) brightness(1.08); transform: translate3d(0,20px,0) rotateY(-270deg) scale(1.025); }
  82% { transform: translate3d(0,-12px,0) rotateY(-96deg) scale(.992); }
  93% { filter: blur(0) brightness(1); transform: translate3d(0,5px,0) rotateY(-20deg) scale(1.004); }
  100% { opacity: 1; filter: none; transform: translate3d(0,0,0) rotateY(0) scale(1); }
}
@keyframes shareCardMeteorArrival {
  0% { opacity: 0; filter: blur(15px) brightness(2.2) saturate(.65); transform: translate3d(-118vw,-76vh,0) rotateZ(-32deg) scale(.08); box-shadow: -150px -100px 90px rgba(255,219,150,.78); }
  13% { opacity: 1; }
  48% { filter: blur(7px) brightness(1.65) saturate(.8); transform: translate3d(-28vw,-18vh,0) rotateZ(-14deg) scale(.48); box-shadow: -110px -72px 72px rgba(255,207,121,.55); }
  76% { filter: blur(1px) brightness(1.18); transform: translate3d(18px,12px,0) rotateZ(2.5deg) scale(1.035); box-shadow: -42px -26px 42px rgba(196,135,69,.28); }
  90% { filter: none; transform: translate3d(-7px,-5px,0) rotateZ(-.8deg) scale(.992); box-shadow: 0 18px 42px rgba(24,23,39,.15); }
  100% { opacity: 1; filter: none; transform: translate3d(0,0,0) rotateZ(0) scale(1); box-shadow: 0 18px 42px rgba(24,23,39,.15); }
}
@keyframes dailyOrbitBloom { 0%{opacity:0;filter:blur(16px) brightness(1.8);transform:scale(.12) rotate(-540deg)} 68%{opacity:1;filter:blur(1px) brightness(1.12);transform:scale(1.04) rotate(14deg)} 100%{opacity:1;filter:none;transform:none} }
@keyframes dailyInkRipple { 0%{opacity:0;filter:blur(28px) contrast(1.8);transform:scale(.72)} 38%{opacity:.7;filter:blur(13px);transform:scale(.9)} 82%{opacity:1;filter:blur(1px);transform:scale(1.02)} 100%{filter:none;transform:none} }
@keyframes dailyLuminousPath { 0%{opacity:0;filter:blur(18px) brightness(2.4);transform:translate3d(-100vw,-65vh,0) rotate(-28deg) scale(.08)} 72%{opacity:1;filter:blur(2px) brightness(1.2);transform:translate3d(14px,9px,0) rotate(2deg) scale(1.03)} 100%{filter:none;transform:none} }
@keyframes dailyAuroraFold { 0%{opacity:0;filter:hue-rotate(70deg) blur(13px);transform:rotateX(-88deg) scale(.7)} 58%{opacity:1;filter:hue-rotate(16deg) blur(2px);transform:rotateX(14deg) scale(1.03)} 100%{filter:none;transform:none} }
@keyframes dailyCelestialTurn { 0%{opacity:0;filter:blur(12px) brightness(1.7);transform:rotateY(-900deg) scale(.42)} 75%{opacity:1;filter:blur(1px);transform:rotateY(-42deg) scale(1.02)} 100%{filter:none;transform:none} }
@keyframes dailyRisingConstellation { 0%{opacity:0;clip-path:circle(2% at 50% 100%);filter:blur(15px);transform:translateY(70vh) scale(.54)} 70%{opacity:1;clip-path:circle(80% at 50% 50%);filter:blur(1px);transform:translateY(-10px) scale(1.02)} 100%{clip-path:circle(100%);filter:none;transform:none} }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 110; max-width: min(360px, calc(100% - 32px)); border: 1px solid var(--line); border-radius: 12px; background: #20203c; box-shadow: 0 16px 50px rgba(24,24,44,.18); color: #f4efe2; font-size: 12px; padding: 13px 17px; }

.footer { display: flex; min-height: 76px; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 10px; letter-spacing: 0.12em; }

@media (max-width: 1600px) {
  .auth-gate { grid-template-columns: minmax(320px, .8fr) minmax(520px, 1.2fr); }
  .auth-card h1 { font-size: clamp(38px, 3.6vw, 48px); }
}

@media (max-width: 1060px) {
  :root { --sidebar-width: 238px; }
  .section-wrap { width: min(calc(100% - 48px), 980px); }
  .system-card { padding: 28px; }
  .roots-copy { padding-right: 46px; }
}

@media (max-width: 820px) {
  .auth-gate { grid-template-columns: 1fr; }
  .auth-visual { display: none; }
  .auth-panel { min-height: 100svh; justify-content: flex-start; padding: 92px 24px 46px; }
  .auth-toolbar { inset: 18px 20px auto; }
  .auth-brand { display: flex; }
  .auth-card { margin: auto 0; }
  .sidebar {
    width: min(310px, 86vw);
    transform: translateX(-102%);
    transition: transform 240ms ease;
  }

  body.menu-open .sidebar { transform: translateX(0); }

  .mobile-bar {
    position: fixed;
    inset: 0 0 auto;
    z-index: 30;
    display: flex;
    height: 64px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
    background: rgba(246, 243, 235, 0.86);
    padding: 0 20px;
    backdrop-filter: blur(18px);
  }

  .mobile-brand { gap: 9px; }
  .mobile-brand strong { font-size: 18px; }
  .mobile-actions { display: flex; align-items: center; gap: 8px; }
  .language-switch.compact { width: auto; min-width: 48px; min-height: 36px; padding: 0 10px; }

  .menu-toggle {
    display: flex;
    width: 38px;
    height: 36px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.42);
    cursor: pointer;
  }

  .menu-toggle span { width: 15px; height: 1px; background: var(--ink); transition: transform 180ms ease; }
  body.menu-open .menu-toggle span:first-child { transform: translateY(3.5px) rotate(45deg); }
  body.menu-open .menu-toggle span:last-child { transform: translateY(-3.5px) rotate(-45deg); }

  .scrim {
    position: fixed;
    inset: 0;
    z-index: 35;
    border: 0;
    background: rgba(20, 19, 16, 0.28);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
  }

  body.menu-open .scrim { display: block; opacity: 1; pointer-events: auto; }
  .main { margin-left: 0; padding-top: 64px; }
  .workspace-bar { display: none; }
  .section-wrap { width: min(calc(100% - 40px), 740px); }
  .hero { min-height: 680px; padding-top: 90px; }
  .hero-orbit { right: 50%; top: 50px; width: 330px; opacity: 0.14; }
  .hero h1 { max-width: 620px; }
  .system-grid { grid-template-columns: 1fr; }
  .system-card { min-height: auto; }
  .section-heading { grid-template-columns: 1fr; gap: 20px; }
  .roots-card { grid-template-columns: 1fr; }
  .roots-visual { min-height: 330px; }
  .celestial-disc { width: 250px; }
  .roots-copy { padding: 50px; }
  .guide-grid { grid-template-columns: 1fr; }
  .guide-grid li { min-height: auto; }
  .guide-grid li + li { border-left: 0; padding-left: 0; }
  .footer { width: calc(100% - 40px); }
  .admin-wrap { width: min(calc(100% - 40px), 740px); }
  .account-card dl { grid-template-columns: repeat(2, 1fr); }
  .daily-oracle-wrap,
  .eastern-tools-wrap,
  .reports-wrap { width: min(calc(100% - 40px), 740px); }
  .daily-oracle-heading { grid-template-columns:1fr;gap:18px; }
  .daily-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .eastern-tools-heading { grid-template-columns: 1fr; gap: 18px; }
  .eastern-tool-grid { grid-template-columns: 1fr; }
  .eastern-tool-card { min-height: 230px; }
  .tool-symbol { margin: 25px 0 20px; }
}

@media (max-width: 580px) {
  .tarot-selected-slots { grid-template-columns: 1fr; }
  .tarot-selected-card { min-height: 82px; }
  .tarot-deck-grid { grid-template-columns: repeat(8,minmax(28px,1fr)); }
  .auth-panel { padding-inline: 18px; }
  .auth-card h1,
  .onboarding-card h1 { font-size: 38px; }
  .onboarding { place-items: start center; padding: 18px 12px; }
  .onboarding-card { min-height: calc(100svh - 36px); border-radius: 18px; padding: 30px 22px; }
  .field-action { grid-template-columns: 1fr 106px; }
  .section-wrap { width: calc(100% - 32px); }
  .mobile-bar { padding-inline: 16px; }
  .hero { min-height: 650px; padding-block: 84px 70px; }
  .hero h1 { margin-top: 18px; font-size: clamp(48px, 16vw, 67px); line-height: 1.08; }
  .hero-lead { font-size: 15px; line-height: 1.85; }
  .hero-actions { width: 100%; flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .hero-orbit { right: 50%; top: 35px; width: 320px; }
  .systems-section,
  .roots-section,
  .guide-section,
  .comparison-section { padding-block: 78px; }
  .section-heading { margin-bottom: 28px; }
  .section-heading h2,
  .roots-copy h2 { font-size: 34px; }
  .section-heading > p { font-size: 13px; }
  .system-card { border-radius: 19px; padding: 25px 22px; }
  .card-kicker { margin-top: 36px; }
  .system-card h3 { font-size: 29px; }
  .roots-section { padding-top: 6px; }
  .roots-card { border-radius: 20px; }
  .roots-visual { min-height: 290px; }
  .celestial-disc { width: 210px; }
  .roots-copy { padding: 36px 24px 40px; }
  .roots-list > div { grid-template-columns: 1fr; gap: 5px; }
  .guide-section { padding-top: 8px; }
  .guide-grid li { gap: 15px; padding-right: 0; }
  .comparison-section { padding-top: 8px; padding-bottom: 90px; }
  .table-shell { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  table,
  tbody,
  tr,
  td { display: block; width: 100%; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  tbody { display: grid; gap: 12px; }
  tr { overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
  td { display: grid; grid-template-columns: 105px 1fr; gap: 13px; border-top: 1px solid var(--line); font-size: 12px; padding: 15px 17px; }
  td:first-child { border-top: 0; font-size: 14px; }
  td + td { border-left: 0; }
  td::before { color: var(--gold); content: attr(data-label); font-family: var(--sans); font-size: 10px; font-weight: 650; letter-spacing: 0.04em; }
  .page-placeholder { padding: 90px 20px; }
  .placeholder-symbol { width: 92px; height: 92px; }
  .footer { min-height: 92px; align-items: flex-start; justify-content: center; flex-direction: column; gap: 4px; }
  .workspace-actions { gap: 5px; }
  .admin-page { padding: 58px 0 90px; }
  .admin-wrap { width: calc(100% - 32px); }
  .admin-heading { align-items: flex-start; }
  .admin-heading h1 { font-size: 42px; }
  .account-card { grid-template-columns: minmax(0, 1fr) auto; padding: 20px 17px; }
  .account-card-identity p { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .account-card dl { grid-template-columns: 1fr; }
  .account-card dl > div { display: grid; grid-template-columns: 100px 1fr; gap: 12px; border-top: 1px solid var(--line); padding: 10px 0; }
  .account-card dd { margin: 0; }
  .account-dialog,
  .contact-dialog,
  .assessment-dialog,
  .daily-oracle-dialog,
  .export-dialog { width: 100%; max-width: none; max-height: 92svh; margin: auto 0 0; border-radius: 20px 20px 0 0; }
  .report-reader-dialog { width: 100%; height: 100svh; max-height: 100svh; margin: 0; border: 0; border-radius: 0; }
  .report-reader-dialog iframe { height: calc(100svh - 88px); }
  .dialog-scroll { max-height: calc(92svh - 92px); padding-inline: 18px; }
  .dialog-top { padding-inline: 18px; }
  .profile-form.two-column { grid-template-columns: 1fr; }
  .profile-form .span-two { grid-column: auto; }
  .daily-oracle-page,
  .eastern-tools-page,
  .reports-page { padding: 54px 0 90px; }
  .daily-oracle-wrap,
  .eastern-tools-wrap,
  .reports-wrap { width: calc(100% - 32px); }
  .daily-oracle-heading h1 { font-size:36px; }
  .daily-quote-card { min-height:140px;padding:23px; }
  .daily-quote-card p { font-size:21px; }
  .daily-choice-grid { grid-template-columns:1fr; }
  .daily-choice-card { min-height:205px; }
  .daily-oracle-dialog[open] { height:92svh; }
  .daily-oracle-dialog-body { padding:20px 16px 28px; }
  .eastern-tools-heading h1,
  .reports-heading h1 { max-width: 100%; overflow-wrap: anywhere; font-size: 36px; line-height: 1.16; }
  .eastern-tools-heading .kicker { max-width: 100%; overflow-wrap: anywhere; line-height: 1.7; }
  .eastern-tool-card { min-height: 220px; padding: 21px; }
  .tool-copy strong { font-size: 25px; }
  .reports-heading { align-items: flex-start; }
  .report-card { grid-template-columns: 1fr; gap: 18px; padding: 20px 17px; }
  .report-card-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .report-card-actions .button { width: 100%; }
  .assessment-body { min-height: 0; padding: 24px 18px; }
  .assessment-dialog[open] { height: 92svh; }
  .assessment-start-action { padding: 10px 18px max(14px, env(safe-area-inset-bottom)); }
  .assessment-profile { grid-template-columns: 1fr; }
  .assessment-profile div + div { border-top: 1px solid var(--line); }
  .decision-time-card { grid-template-columns: 1fr; }
  .decision-time-card strong { justify-self: start; }
  .decision-lines li { grid-template-columns: 44px 76px minmax(82px,1fr) 58px; gap: 5px; }
  .decision-cast-actions { grid-template-columns: 1fr; }
  .oracle-stream { width: 220px; height: 200px; }
  .result-actions { width: 100%; flex-direction: column; }
  .result-actions .button { width: 100%; }
  .share-card-panel { width: 100%; padding: 10px; }
  .toast { right: 16px; bottom: 16px; left: 16px; }
}

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