@charset "UTF-8";
/* 小卜：紫色主光、轻阅读界面。只改变展示，沿用现有排盘与解读流程。 */
:root {
  --bg: #0e0a18;
  --paper: #191324;
  --panel-soft: #22192f;
  --panel-deep: #100c1b;
  --ink: #f7f1ff;
  --muted: #bdb2cd;
  --subtle: #a496b7;
  --line: #3b2d4e;
  --violet: #c5a6ff;
  --hot-pink: #f5a0d3;
  --cyan: #88dfe2;
  --warm: #e4c68e;
  --green: var(--violet);
  --sage: #201d32;
  --purple: #2e1b44;
  --pink: #311d35;
  --glow-violet: 0 8px 38px #7f37c51a;
  --glow-cyan: 0 0 20px #88dfe20b;
  --cyber-lift: 0 16px 40px #08040d40;
}

html { background: var(--bg); scrollbar-color: #66507e var(--bg); }
body {
  background: radial-gradient(ellipse 60% 460px at 90% 0, #7136a022, transparent 90%), var(--bg);
  background-attachment: scroll;
}
::selection { background: #7547a8; color: #fff; }
button, a, input, select, textarea { touch-action: manipulation; }
input, select, textarea, .gate-entry input, .question-box textarea, .pair-share-link input {
  background: #120e1d;
  border-color: #514160;
  border-radius: 13px;
  caret-color: var(--violet);
  transition: border-color .18s, box-shadow .18s;
}
input:focus, select:focus, textarea:focus {
  border-color: #c29aff;
  box-shadow: 0 0 0 3px #ba84ff22;
}
input::placeholder, textarea::placeholder { color: #a99ab9; }
input[type=checkbox], input[type=radio], .consent input, .feedback-item input { accent-color: #bb8af1; }
button:focus-visible, a:focus-visible, summary:focus-visible, .chart-scroll:focus-visible {
  outline: 2px solid #e3cfff;
  outline-offset: 4px;
}
.eyebrow { color: var(--violet); letter-spacing: 1.1px; }
.text-button { color: #d5b8ff; border-color: #755293; }
.text-button:hover { color: #f4d5ff; border-color: #d2a8ff; }
.button { min-height: 46px; border-radius: 15px; font-weight: 650; letter-spacing: .02em; }
.button.primary {
  background: linear-gradient(118deg, #b798ff, #d8adf3 60%, #efb1d6);
  border-color: #e5caff66;
  color: #21112d;
  box-shadow: 0 6px 24px #ad6cff2b, inset 0 1px #fff5;
}
.button.primary:hover {
  background: linear-gradient(118deg, #c7adff, #e2bcfa 60%, #f5c2e0);
  box-shadow: 0 8px 28px #ad6cff3a, inset 0 1px #fff5;
}
.button.secondary { background: #24192f; border-color: #5d456f; color: #e7d9f7; }
.button.secondary:hover { background: #31203f; border-color: #b58bda; }
.button.small { border-radius: 12px; }
.icon-button { background: #241a31; border-color: #594168; color: #d2c1e0; }
.icon-button:hover { background: #39254a; }
.avatar { background: #2b1c3c; border-color: #78599a; color: #dfc5ff; box-shadow: none; }
.pill { background: #312042; border-color: #63487b; color: #e1c7ff; }
.pill i { background: #cfb0ff; box-shadow: 0 0 10px #cda3ff55; }
.skip-link { border-color: var(--violet); }

/* 导航：固定的方向感，清楚的当前页。 */
.sidebar { background: linear-gradient(180deg, #191022, #100c18 75%); border-right-color: #362642; }
.sidebar nav { gap: 5px; }
.sidebar nav a { min-height: 43px; border: 1px solid transparent; border-radius: 13px; color: #bfb1ce; }
.sidebar nav a:hover { color: #f4eaff; background: #291b38; }
.sidebar nav a.active {
  background: linear-gradient(100deg, #65409255, #40245044);
  border-color: #8460a26b;
  color: #ebd7ff;
  box-shadow: inset 3px 0 #c19aee;
}
.sidebar nav .active .nav-icon { color: #d8b6ff; }
.nav-dot { background: #e0bfff; box-shadow: 0 0 10px #d6aaff55; }
.side-caption, .nav-caption, .demo-label { color: #aa98ba; }
.side-note { background: linear-gradient(140deg, #251932, #1b1424); border: 1px solid #3b2b4b; }
.side-note span { color: #decbed; }
.side-note p, .profile-link small { color: #ac9abd; }
.topbar { background: #100c18ed; border-bottom-color: #34263f; }
.topbar #breadcrumb { color: #b7a6c7; }
.top-actions .today-date { color: #b7a6c7; }
.page-heading { margin-bottom: 25px; }
.page-heading h1 { letter-spacing: -.02em; }
.page-heading p { max-width: 52em; }
.section-head { margin-top: 32px; margin-bottom: 15px; }
.section-head h2 { font-size: 17px; letter-spacing: 0; }
.section-head a { color: #d6b7f8; }
.main-footer { color: #9d8aaf; }

/* 首页：有色彩的入口、安静的文字区，装饰只放在边缘。 */
.hero {
  border: 1px solid #9b6ac26e;
  border-radius: 26px;
  padding: 34px 36px;
  background:
    radial-gradient(ellipse 45% 90% at 100% 70%, #b34bbf33, transparent 90%),
    radial-gradient(ellipse 45% 95% at 65% 0, #7c41c144, transparent 95%),
    linear-gradient(115deg, #21152e, #1c112a 52%, #2c1740);
  box-shadow: inset 0 1px #e8c5ff14, 0 14px 50px #13071f55;
}
.hero::before {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: -185px;
  bottom: -230px;
  border: 40px solid #dd8ded0b;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
}
.hero::after { background: linear-gradient(120deg, transparent 52%, #f4c8ff06 53%, transparent 76%); }
.hero h2 { font-size: clamp(30px, 3vw, 43px); line-height: 1.42; letter-spacing: -.025em; }
.hero-accent { color: #ddb8ff; }
.hero p { color: #cbbbdc; font-size: 14px; line-height: 1.9; max-width: 34em; }
.hero .eyebrow { color: #ceb6e2; font-size: 11px; letter-spacing: 1px; }
.hero .pill { color: #e2c8fa; background: #4c2e6259; border-color: #a577c955; }
.hero .hero-buttons { gap: 12px; }
.hero .hero-buttons > .button, .hero .hero-buttons > .text-button {
  border-radius: 15px;
  height: 48px;
  min-height: 48px;
  padding: 0 21px;
}
.hero .hero-buttons > .text-button { background: #291c39; border-color: #705483; color: #e0d1ec; }
.hero .hero-buttons > .text-button:hover { background: #392548; border-color: #c19ee0; color: #f5e8ff; }
.hero .orbit { opacity: 1; }
.orbit svg { filter: drop-shadow(0 0 22px #bd76e522); }
.orbit #orb stop:first-child { stop-color: #623a81; }
.orbit #orb stop:last-child { stop-color: #251435; }
.orbit svg circle[fill="url(#orb)"] { stroke: #be91dd; stroke-width: 1.2; }
.orbit .orbit-ring-wide ellipse { stroke: #c197ec; }
.orbit .orbit-ring-tall ellipse { stroke: #cd83b9; }
.orbit-label { fill: #e1c8f3; }
.orbit-caption { color: #baa5cb; }
.home-choices { gap: 16px; }
.choice-card.relation, .choice-card.career, .home-choices .choice-card.nature {
  background: radial-gradient(ellipse at 100% 0, var(--choice-glow, #a578ff1c), transparent 68%), #1c1527;
  border: 1px solid #4e365f;
  border-radius: 22px;
  box-shadow: inset 0 1px #f3d5ff09;
  padding: 27px;
  min-height: 224px;
}
.choice-card.relation { --card-accent: #f4afd6; --choice-glow: #b8548b30; }
.choice-card.career { --card-accent: #c6b0ff; --choice-glow: #7c4bcc38; }
.home-choices .choice-card.nature { --card-accent: #9bdfe0; --choice-glow: #437e8c28; }
.choice-card:hover { transform: translateY(-3px); box-shadow: var(--cyber-lift); }
.choice-card .card-kicker { color: #b9a6cc; font-size: 11px; letter-spacing: .07em; }
.choice-card h3 { font-size: 23px; line-height: 1.45; margin: 14px 0 10px; max-width: calc(100% - 34px); }
.choice-card p { font-size: 13px; color: #c1b2ce; max-width: 90%; }
.choice-card .card-link { font-size: 13px; margin-top: 22px; }
.choice-card .symbol, .choice-card.career .symbol, .home-choices .choice-card.nature .symbol {
  width: 43px;
  height: 43px;
  border-radius: 15px;
  border-color: #ffffff2b;
  background: linear-gradient(140deg, #ffffff16, #ffffff03);
  box-shadow: inset 0 1px #ffffff2b, 0 5px 15px #07030b22;
  color: var(--card-accent);
}
.below-grid > .surface:first-child { background: #1b1325; border-color: #4f355e; border-radius: 22px; }
.journey-step { padding-top: 18px; padding-bottom: 18px; border-bottom-color: #45324f; }
.journey-step h3 { font-size: 14px; }
.journey-step p { font-size: 12px; line-height: 1.8; }
.step-no { color: #c59ce9; }
.quote-card { border-radius: 22px; background: linear-gradient(145deg, #2c1938, #1b1426); border-color: #593765; }
.quote-card blockquote { font-size: 22px; line-height: 1.7; }

/* 可复用的首页快捷入口。 */
.home-entry-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0 6px; }
.home-entry-button {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 78px;
  padding: 15px 18px;
  border: 1px solid #483057;
  border-radius: 17px;
  background: #1c1426;
  text-align: left;
  transition: border-color .18s, background .18s;
}
.home-entry-button:hover { border-color: #a67bcc; background: #2a1b38; }
.home-entry-button > i, .home-entry-button > .entry-icon { font-style: normal; color: #d5adfa; font-size: 25px; width: 30px; flex: none; }
.home-entry-button strong { display: block; font-size: 14px; color: #eee0f8; }
.home-entry-button small { display: block; font-size: 11px; color: #b8a6c7; margin-top: 3px; }
.home-quick-start { border-color: #553b65; background: linear-gradient(125deg, #281936, #191222); }

/* 其余流程共用的面板与表单，不改变报告文档内部排版。 */
.surface, .question-box, .saved-report, .career-result, .explore-card, .loading {
  border-color: #43304f;
  background: #1a1423;
  border-radius: 20px;
  box-shadow: inset 0 1px #ffffff05;
}
.surface-title h3 { font-size: 15px; }
.question-box { border-color: #59406b; padding: 25px; }
.question-box label { font-size: 14px; color: #e5d6f0; }
.question-box textarea { line-height: 1.85; }
.question-actions small { font-size: 12px; line-height: 1.8; }
.prompt-chips { gap: 8px; }
.prompt-chips button { min-height: 38px; font-size: 12px; padding: 8px 13px; background: #2a1e36; border-color: #5f426f; color: #d7c5e5; }
.prompt-chips button:hover { color: #f1ddff; background: #3a2450; border-color: #b387d3; }
.mode-intro, .mode-intro.timeline, .mode-intro.career, .liuyao-intro {
  background: radial-gradient(ellipse at 100% 0, #8f4dc52a, transparent 70%), #24162f;
  border-color: #664278;
  border-radius: 23px;
  box-shadow: inset 0 1px #e9c6ff0e;
}
.mode-intro.relationship { background: radial-gradient(ellipse at 100% 0, #aa4b8d2d, transparent 70%), #271629; border-color: #734468; }
.mode-intro p { font-size: 13px; line-height: 1.85; max-width: 52em; }
.mode-intro.career .intro-symbol { color: #ceb0ff; }
.liuyao-intro .intro-symbol { color: #b6b6f0; }
.empty-state { padding: 46px 24px; }
.empty-state p { font-size: 14px; line-height: 1.85; }
.segmented { background: #170f21; border-color: #4b345b; padding: 4px; border-radius: 13px; }
.segmented button { min-height: 38px; border-radius: 9px; color: #baa5cb; }
.segmented button.active { background: #4e3066; color: #f3e1ff; box-shadow: inset 0 1px #e3beff1c; }
.saved-report:hover, .career-result:hover, .explore-card:hover { background: #2b1b38; border-color: #a77bca; }
.form-help, .consent { color: #bdadca; line-height: 1.85; }
.dialog { background: #1a1224; border-color: #74518b; border-radius: 23px; box-shadow: 0 28px 90px #0009; }
.dialog::backdrop { background: #08040dc9; backdrop-filter: blur(5px); }
.dialog-head h2 { color: #f0e4fb; }
.toast { background: #342042; border-color: #ad7bca; color: #f2e3ff; }

/* 命盘：颜色分层，但不以颜色代替原有标注。 */
.chart-toolbar { gap: 16px; }
.chart-grid { background: #493353; border-color: #624170; border-radius: 17px; overflow: hidden; }
.palace { background: #1a1226; }
.palace h3 { color: #ddbef4; }
.palace .stars { color: #eee2f9; }
.palace .minor { color: #b7a3c9; }
.chart-center { background: radial-gradient(ellipse at 50% 20%, #54306a55, transparent 95%), #21142d; }
.chart-center p { color: #c7b5d7; }
.chart-center .pill { background: #392247; color: #dab9ef; border-color: #725186; }
.pillar { background: linear-gradient(165deg, #30203e, #1c1426); border-color: #624374; border-radius: 16px; }
.pillar b { color: #d8b8ff; }
.pillar small, .pillar p { color: #c1afcf; }

/* 关系、邀请与私人空间。 */
.pair-profile { background: #25172f; border-color: #594064; border-radius: 15px; }
.pair-profile strong { color: #ebd4fa; }
.pair-invite-card { background: linear-gradient(125deg, #2e1a3b, #211329); border-color: #7a4b86; border-radius: 20px; }
.pair-private { border-color: #9d7ab3; }
.pair-share-link input { color: #dcbff4; }
.pair-guest-sheet { background: #1c1426; border-color: #78518c; box-shadow: 0 18px 60px #09030f30; }
.pair-guest-privacy { background: #30203c; border-color: #79578d; }
.pair-guest-privacy strong { color: #e1c3f7; }
.pair-guest h1 { font-weight: 700; }
.pair-guest-symbol { color: #cfacf4; }
.pair-guest-brand { color: #bcabd0; }
.profile-summary, .profile-details { border-color: #594067; }
.private-memory-item, .memory-turn { border-color: #4b345d; }
.memory-selection button { background: #2c1d3c; border-color: #74508d; }

/* 对话保持高对比阅读，输入区有明确边界。 */
.chat-welcome { background: linear-gradient(115deg, #2a1937, #1b1425); border-color: #654477; }
.chat-welcome p { font-size: 13px; }
.chat-question { background: #3b2550; border-color: #77558b; color: #f1e4fb; border-radius: 20px 20px 5px 20px; }
.chat-question p { font-size: 14px; }
.chat-question > span, .chat-reply > span { color: #c9b0df; }
.chat-reply { background: #191323; border-color: #473152; border-radius: 5px 20px 20px; }
.chat-composer { box-shadow: 0 -6px 30px #0e081522; }
.chat-handoff { background: #2b1b38; border-color: #79528b; border-radius: 16px; }
.calendar-chat-context, .chart-chat-context { color: #d6b7ee; }

/* 日历、职业资料、商城以及六爻。 */
.calendar-week { color: #b7a3c9; }
.calendar-days button { min-height: 42px; border-radius: 12px; }
.calendar-days button:hover { background: #352143; }
.calendar-days button.selected { background: #c19ae8; color: #23112d; box-shadow: 0 4px 14px #c58bf022; }
.daily-detail h2 { color: #eedffb; }
.daily-almanac { gap: 12px; }
.daily-almanac > div { background: #1b2930; border-color: #47616a; border-radius: 15px; }
.daily-almanac > div:last-child { background: #321d33; border-color: #704769; }
.daily-almanac p { color: #cebddb; }
.daily-mine > p, .daily-note p { font-size: 13px; }
.career-result { padding: 20px; }
.career-result strong { color: #e9cef9; }
.career-result p { font-size: 13px; }
.career-library-entry summary { min-height: 32px; }
.shop-art {
  background: radial-gradient(ellipse at 40% 35%, #a25bd550, transparent 65%), linear-gradient(140deg, #3e2052, #20152d);
  border-color: #8c5ba4;
  border-radius: 25px;
  box-shadow: inset 0 1px #e6c6ff20;
}
.shop-art img { filter: drop-shadow(0 18px 25px #07020c50); }
.shop-preview { border-radius: 25px; }
.liuyao-cast-main, .liuyao-change { background: #21162d; border-color: #5c3c6d; border-radius: 20px; }
.liuyao-cast-grid h3 { color: #e7ccf7; }
.liuyao-bar i { background: #c5a1ed; box-shadow: 0 0 10px #c1a0ed12; }
.liuyao-line.is-moving .liuyao-bar i { background: #f3a5d4; box-shadow: none; }
.liuyao-line.is-moving .liuyao-line-detail { color: #f6b5dc; }
.liuyao-calendar { color: #c8afd9; }
.liuyao-history-item.active { background: #382347; }
.liuyao-history-item { min-height: 58px; border-color: #483153; }
.liuyao-history-item > span:last-child { color: #d5b3f4; }
.free-reading-progress-label { background: #312042; border-color: #73538d; color: #e1c4fb; }
.free-reading-progress-label::before { background: #cfadf2; }
.free-reading-progress-track, .liuyao-progress-track { background: #382344; box-shadow: none; }
.free-reading-progress-track > span, .liuyao-progress-track > span { background: linear-gradient(90deg, transparent, #bb8dee 28%, #f0a2d4 75%, transparent); }
.free-reading-progress-steps .is-done { color: #ccb7df; }
.free-reading-progress-steps .is-done > span { color: #ddc4f1; border-color: #9575af; background: #382448; }
.free-reading-progress-steps .is-current { color: #f0d8ff; }

/* 邀请码入口与品牌一致，保留表单的可读性。 */
.gate { background: #100b18; }
.gate-story {
  background: radial-gradient(ellipse at 85% 35%, #9a45b52c, transparent 58%), linear-gradient(145deg, #291435, #160e22 76%);
  border-right-color: #563065;
}
.gate-story::after { border-color: #bc80de2b; }
.gate-copy h1 { color: #f4e6ff; }
.gate-copy p { color: #cbb4da; }
.gate-art b { background: radial-gradient(circle, #61387c, #281537); border-color: #b084ca; box-shadow: 0 0 45px #a661c925; }
.gate-art i, .gate-art i:nth-child(2) { border-color: #ab78cf; }
.gate-art i:nth-child(3) { border-color: #e19dc7; }
.gate-entry { background: #120c1b; }
.gate-entry form { max-width: 360px; }
.gate-entry .button { min-height: 50px; }
.gate-entry small { font-size: 11px; color: #aa94bb; }

@media (hover: none) {
  .choice-card:hover { transform: none; box-shadow: none; }
}
@media (min-width: 1450px) {
  .hero { padding: 40px 42px; }
  .choice-card h3 { font-size: 25px; }
}
@media (max-width: 900px) and (min-width: 651px) {
  .hero { padding: 28px; }
  .hero h2 { font-size: 31px; }
  .hero p { font-size: 13px; }
  .home-entry-strip { gap: 9px; }
  .home-entry-button { padding: 13px; gap: 8px; }
  .home-entry-button small { font-size: 10px; }
}
@media (max-width: 650px) {
  .topbar { height: 72px; padding: 0 20px; background: #130d1cf5; }
  .top-actions { gap: 10px; }
  .workspace { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  main { padding: 24px 18px 8px; }
  .page-heading { margin-bottom: 22px; }
  .page-heading h1 { font-size: 27px; line-height: 1.45; }
  .page-heading p { font-size: 13px; margin-top: 8px; }
  .page-heading .eyebrow { font-size: 10px; letter-spacing: .08em; margin-bottom: 10px; }
  .hero { padding: 25px 23px 26px; border-radius: 24px; min-height: 355px; }
  .hero h2 { font-size: 31px; line-height: 1.45; max-width: 9em; }
  .hero p { font-size: 13px; line-height: 1.85; max-width: 27em; margin: 15px 0 22px; }
  .hero .eyebrow { font-size: 10px; margin: 18px 0 13px; max-width: 70%; }
  .hero .pill { font-size: 10px; }
  .hero .orbit { top: 3px; right: -43px; width: 190px; height: 190px; opacity: .42; }
  .hero .hero-buttons { flex-wrap: nowrap; gap: 10px; }
  .hero .hero-buttons > .button, .hero .hero-buttons > .text-button { padding: 0 15px; min-height: 48px; height: 48px; font-size: 13px; gap: 12px; }
  .hero .hero-buttons > .button { flex: 1; }
  .home-entry-strip { gap: 8px; margin-top: 13px; }
  .home-entry-button { min-height: 89px; padding: 12px 6px; flex-direction: column; justify-content: center; gap: 5px; text-align: center; border-radius: 15px; }
  .home-entry-button strong { font-size: 12px; }
  .home-entry-button small { font-size: 10px; line-height: 1.6; margin-top: 2px; }
  .home-entry-button > i, .home-entry-button > .entry-icon { width: auto; font-size: 21px; line-height: 1.2; }
  .section-head { margin-top: 29px; gap: 12px; }
  .section-head h2 { font-size: 17px; }
  .section-head span, .section-head a { font-size: 11px; }
  .choices.home-choices { gap: 13px; }
  .home-choices .choice-card { padding: 23px; min-height: 187px; border-radius: 22px; }
  .home-choices .choice-card h3 { font-size: 22px; margin: 13px 0 10px; max-width: calc(100% - 38px); }
  .choice-card .card-kicker { font-size: 10px; }
  .choice-card p { font-size: 13px; max-width: 95%; }
  .choice-card .card-link { font-size: 13px; margin-top: 19px; }
  .choice-card .symbol, .choice-card.career .symbol, .home-choices .choice-card.nature .symbol { right: 20px; top: 21px; width: 40px; height: 40px; }
  .surface, .question-box, .loading { border-radius: 20px; }
  .surface { padding: 22px 20px; }
  .mode-intro { padding: 23px 21px; border-radius: 22px; }
  .mode-intro h2 { font-size: 24px; }
  .mode-intro p { font-size: 13px; }
  .question-box { padding: 22px 18px; }
  .question-box textarea, .chat-composer textarea, input, select { font-size: 16px; }
  .question-actions small { font-size: 11px; }
  .prompt-chips button { min-height: 42px; font-size: 12px; padding: 8px 12px; }
  .button.small, .page-heading .button, .report-head .button { min-height: 42px; font-size: 12px; padding: 9px 13px; }
  .icon-button { width: 40px; height: 40px; }
  .dialog { padding: 24px 20px; }
  .dialog-head .icon-button { width: 44px; height: 44px; flex: none; }
  .form-help, .consent { font-size: 12px; }
  .mobile-nav {
    background: #160e21f2;
    border-top-color: #75509066;
    box-shadow: 0 -8px 30px #08030d55;
    backdrop-filter: blur(14px);
    padding: 9px 8px calc(10px + env(safe-area-inset-bottom));
  }
  .mobile-nav a { position: relative; color: #b2a0c3; min-height: 48px; padding-top: 3px; font-size: 22px; border-radius: 13px; }
  .mobile-nav a span { font-size: 11px; margin-top: 2px; line-height: 1.6; }
  .mobile-nav a.active { color: #e5caff; background: #8553bd25; text-shadow: 0 0 14px #c697fc30; }
  .mobile-nav a.active::before { content: ""; position: absolute; top: -5px; height: 2px; width: 18px; left: calc(50% - 9px); background: #c7a1f4; border-radius: 10px; }
  .chart-scroll { margin: 0 -5px; border-radius: 16px; }
  .chart-grid { border-radius: 16px; }
  .chart-note { font-size: 11px; line-height: 1.8; }
  .daily-calendar { padding: 21px 16px; }
  .calendar-days button { min-height: 44px; }
  .daily-almanac p { font-size: 13px; }
  .pair-invite-actions .button { flex: 1 1 120px; }
  .pair-guest-sheet { padding: 27px 20px; border-radius: 24px; }
  .pair-guest-privacy { padding: 17px; }
  .pair-guest-privacy p { font-size: 13px; }
  .pair-guest-sheet .button { min-height: 48px; }
  .chat-question { max-width: 94%; }
  .chat-welcome { padding: 21px 19px; }
  .chat-reply { padding: 20px 18px; }
  .liuyao-current, .liuyao-history { padding: 22px 18px; }
  .liuyao-cast-main, .liuyao-change { padding: 23px; }
  .liuyao-line-detail, .liuyao-position { font-size: 11px; }
  .liuyao-history-item strong { font-size: 14px; }
  .liuyao-history-item small { font-size: 11px; }
  .free-reading-progress { padding: 28px 21px; }
  .free-reading-progress .free-reading-progress-copy { font-size: 13px; }
  .gate-story { padding: 25px 25px 28px; border-bottom-color: #68417d; }
  .gate-copy { padding-top: 32px; }
  .gate-copy h1 { font-size: 36px; }
  .gate-copy p { font-size: 13px; }
  .gate-entry { padding: 28px 25px 36px; }
  .gate-entry form { max-width: none; }
  .gate-entry p { font-size: 13px; }
  .gate-entry small { font-size: 11px; }
  .gate-art { opacity: .36; }
  .main-footer { font-size: 10px; line-height: 1.8; padding: 25px 20px; }
}
@media (max-width: 360px) {
  main { padding-left: 14px; padding-right: 14px; }
  .hero { padding-left: 20px; padding-right: 20px; }
  .hero h2 { font-size: 28px; }
  .hero .hero-buttons > .button, .hero .hero-buttons > .text-button { padding: 0 12px; gap: 8px; }
  .topbar { padding: 0 17px; }
  .topbar .today-date { font-size: 9px; }
  .section-head span { max-width: 9em; text-align: right; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .free-reading-progress-track > span, .liuyao-progress-track > span { transform: none; width: 100%; opacity: .65; }
}
@media print {
  body { color: #251d2d; background: #fff; }
  .hero, .surface, .question-box, .mode-intro, .choice-card { background: #fff !important; box-shadow: none !important; color: #251d2d; }
}

/* 完整字标只用于首页左上角和邀请登录；其他场景沿用独立白色 X。 */
.home-brand-lockup { display: none; width: 160px; height: 69px; object-fit: contain; flex: none; }
.gate-brand > .home-brand-lockup,
body[data-page="home"] .sidebar .brand > .home-brand-lockup,
body[data-page="home"] .mobile-brand > .home-brand-lockup { display: block; }
.gate-brand > span,
body[data-page="home"] .sidebar .brand > span,
body[data-page="home"] .mobile-brand > span { display: none; }
.gate-brand { gap: 0; }
body[data-page="home"] .sidebar .brand { width: calc(100% - 16px); margin-inline: 8px; gap: 0; }
body[data-page="home"] .sidebar .brand > .home-brand-lockup { width: min(160px, 100%); height: auto; aspect-ratio: 1912 / 823; }
body[data-page="home"] .mobile-brand { gap: 0; flex: none; }
@media (max-width: 650px) {
  .gate-brand > .home-brand-lockup { width: 140px; height: 60px; }
  body[data-page="home"] .mobile-brand > .home-brand-lockup { width: 112px; height: 48px; }
}
@media print {
  .home-brand-lockup,
  .gate-brand > .home-brand-lockup,
  body[data-page="home"] .sidebar .brand > .home-brand-lockup,
  body[data-page="home"] .mobile-brand > .home-brand-lockup { display: none !important; }
  .gate-brand > span,
  body[data-page="home"] .sidebar .brand > span,
  body[data-page="home"] .mobile-brand > span { display: block; }
  .gate-brand > .brand-mark,
  body[data-page="home"] .sidebar .brand > .brand-mark,
  body[data-page="home"] .mobile-brand > .brand-mark { display: grid; }
  .gate-brand,
  body[data-page="home"] .sidebar .brand,
  body[data-page="home"] .mobile-brand { gap: 12px; }
}