/* 灯下 — home page (web/js/lamp.js). Only active under html[data-lamp="on"]; off restores 「今晚」. */
html:not([data-lamp="on"]) .lamp,
html:not([data-lamp="on"]) .lamp-callgo { display: none !important; }
html[data-lamp="on"] [data-view=tonight] > :not(.lamp) { display: none !important; }

:root[data-lamp="on"] {
  --lamp-warm: #f2dfae;
  --lamp-veil: linear-gradient(180deg, rgba(8,12,30,0) 22%, rgba(8,12,30,.5) 50%, rgba(6,9,24,.9) 74%, rgba(6,9,24,.97));
  --lamp-paper: color-mix(in srgb, var(--yx-sheet-solid, #19223d) 74%, transparent);
  --lamp-ja: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", "Noto Serif CJK JP", serif;
}
:root[data-lamp="on"][data-theme="soft-anime"] {
  --lamp-warm: #f3b9c9;
  --lamp-veil: linear-gradient(180deg, rgba(255,244,247,0) 22%, rgba(255,240,244,.45) 50%, rgba(255,243,246,.9) 74%, rgba(255,246,248,.97));
  --lamp-paper: rgba(255,255,255,.72);
}

/* ---------- sidebar names with a small note ---------- */
:root[data-lamp="on"] .sidebar nav a .lamp-nm { display: flex; flex-direction: column; line-height: 1.25; }
:root[data-lamp="on"] .sidebar nav a .lamp-nm small { font-size: 10.5px; letter-spacing: .14em; color: var(--yx-ink-faint); margin-top: 3px; font-family: "Noto Serif SC", "Source Han Serif SC", serif; font-weight: 400; }
:root[data-lamp="on"] .sidebar nav a.active .lamp-nm small { color: var(--yx-ink-soft); }

/* ---------- layout ---------- */
.lamp { max-width: 1180px; }
.lamp-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 22px; align-items: stretch; }
.lamp-col { display: grid; gap: 18px; grid-template-rows: 1fr auto; }
.lamp .soft-card { margin: 0 !important; }
.lamp h3 { font-family: var(--yx-display, serif); font-weight: 600; font-size: 16px; letter-spacing: .24em; margin: 0; color: var(--yx-ink); display: flex; align-items: baseline; gap: 12px; }
.lamp h3 small, .lamp-kana { font-family: var(--yx-kana, serif); font-weight: 400; font-size: 11px; letter-spacing: .42em; color: var(--yx-accent); }

/* ---------- 入夜: the one place to begin, set over her portrait ---------- */
.lamp-enter { position: relative; min-height: 452px; padding: 0 !important; overflow: hidden; display: flex; align-items: flex-end; isolation: isolate; }
.lamp-art { position: absolute !important; inset: 0; z-index: -2; }
.lamp-art .art-image { opacity: 1 !important; object-position: var(--x, 50%) 24%; }
.lamp-veil { position: absolute; inset: 0; z-index: -1; background: var(--lamp-veil); }
/* a lamp just out of frame: warm light pooling at the upper right */
.lamp-halo { position: absolute; z-index: -1; right: -12%; top: -18%; width: 62%; aspect-ratio: 1; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--lamp-warm) 30%, transparent), transparent); mix-blend-mode: screen; opacity: .55; }
:root[data-theme="soft-anime"] .lamp-halo { mix-blend-mode: normal; opacity: .4; }
.lamp-body { position: relative; width: 100%; padding: 30px 32px 26px; }
.lamp-body h2 { font-family: var(--yx-display, serif) !important; font-weight: 600; font-size: 30px !important; letter-spacing: .2em !important; margin: 8px 0 6px !important; color: var(--yx-ink); text-shadow: 0 1px 18px rgba(0,0,0,.35); }
:root[data-theme="soft-anime"] .lamp-body h2 { text-shadow: 0 1px 14px rgba(255,255,255,.7); }
.lamp-sub { margin: 0 0 18px; color: var(--yx-ink-soft); font-size: 13.5px; letter-spacing: .08em; }
.lamp-row { display: flex; gap: 12px; margin: 0; }
.lamp-row input { flex: 1; min-width: 0; padding: 13px 18px !important; font-size: 14px; border-radius: 999px !important; background: var(--lamp-paper) !important; backdrop-filter: blur(6px); }
.lamp-go { position: relative; overflow: hidden; display: inline-flex !important; align-items: center; justify-content: center; gap: 14px; padding: 12px 30px !important; border-radius: 999px !important; font-family: var(--yx-display, serif) !important; letter-spacing: .42em !important; font-size: 15px !important; white-space: nowrap; text-decoration: none; }
.lamp-go::after { content: ''; width: 24px; height: 1px; background: currentColor; opacity: .6; transition: width .6s cubic-bezier(.16,1,.3,1); }
.lamp-go:hover::after { width: 34px; }
.lamp-go::before { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.32) 50%, transparent 65%); transform: translateX(-120%); transition: transform 1.1s cubic-bezier(.16,1,.3,1); }
.lamp-go:hover::before { transform: translateX(120%); }
.lamp-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.lamp-chip { display: inline-flex !important; align-items: center; gap: 7px; padding: 5px 14px !important; border-radius: 999px !important; font-size: 12px !important; letter-spacing: .06em !important; min-height: 0 !important; background: var(--lamp-paper) !important; }
.lamp-chip b { font-weight: 400; opacity: .7; }
.lamp-chip[aria-expanded="true"], .lamp-chip[aria-pressed="true"] { border-color: var(--yx-accent) !important; }
.lamp-chip[aria-pressed="true"] b { color: var(--yx-accent); opacity: 1; }
.lamp-chip:disabled { opacity: .5; }
.lamp-pop { margin-top: 10px; padding: 14px 16px; border: 1px solid var(--yx-rule-strong); border-radius: 10px; background: var(--lamp-paper); backdrop-filter: blur(10px); display: grid; gap: 10px; animation: lamp-unfold .45s cubic-bezier(.16,1,.3,1); }
.lamp-pop[hidden] { display: none; }
.lamp-pop label { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); align-items: center; gap: 12px; margin: 0; font-size: 12.5px; color: var(--yx-ink-soft); }
.lamp-pop select { margin: 0; padding: 6px 10px; font-size: 12.5px; }
.lamp-range { grid-template-columns: 3em minmax(0, 1fr) !important; }
.lamp-range input { margin: 0; }
.lamp-seg { display: flex; gap: 6px; }
.lamp-seg button { padding: 4px 14px !important; min-height: 0 !important; border-radius: 999px !important; font-size: 12px !important; letter-spacing: .1em !important; background: none !important; }
.lamp-seg button[aria-pressed="true"] { border-color: var(--yx-accent) !important; color: var(--yx-ink) !important; background: var(--yx-sheet-hover, rgba(255,255,255,.08)) !important; }
.lamp-fine { margin: 14px 0 0; font-size: 11.5px; letter-spacing: .1em; color: var(--yx-ink-faint); }

/* an open chip panel lifts the text off her face */
.lamp-veil::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; background: linear-gradient(180deg, transparent, rgba(6,9,24,.72) 30%); }
:root[data-theme="soft-anime"] .lamp-veil::after { background: linear-gradient(180deg, transparent, rgba(255,244,247,.82) 30%); }
.lamp-enter:has(.lamp-pop:not([hidden])) .lamp-veil::after { opacity: 1; }

/* ---------- 上一夜: one line she said, signed like a letter ---------- */
.lamp-last { position: relative; overflow: hidden; display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 1fr auto auto; column-gap: 22px; min-height: 236px; }
.lamp-last h3 { grid-column: 1 / -1; }
.lamp-say { grid-column: 1; align-self: center; margin: 14px 0 10px; position: relative; z-index: 1; }
.lamp-say .ja { display: block; font-family: var(--lamp-ja); font-size: 21px; line-height: 1.75; letter-spacing: .12em; color: var(--yx-ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lamp-say .zh { display: block; margin-top: 6px; font-size: 12.5px; color: var(--yx-ink-soft); letter-spacing: .12em; line-height: 1.8; }
.lamp-ps { grid-column: 1; margin: 0 0 11px; padding: 8px 12px; border-left: 1.5px solid color-mix(in srgb, var(--yx-accent) 68%, transparent); background: color-mix(in srgb, var(--lamp-paper) 55%, transparent); border-radius: 0 8px 8px 0; font-size: 12.5px; line-height: 1.7; color: var(--yx-ink-soft); letter-spacing: .08em; display: flex; align-items: baseline; gap: 10px; position: relative; z-index: 1; }
.lamp-ps[hidden] { display: none !important; }
.lamp-ps-tag { flex: none; font-family: var(--yx-display, serif); font-size: 11px; letter-spacing: .22em; color: var(--yx-accent); }
.lamp-sign { grid-column: 2; grid-row: 2 / 5; justify-self: end; align-self: end; display: flex; flex-direction: column; align-items: center; gap: 10px; position: relative; z-index: 1; }
.lamp-sign span { writing-mode: vertical-rl; font-family: var(--lamp-ja); font-size: 12px; letter-spacing: .42em; color: var(--yx-ink-soft); }
.lamp-sign i { width: 19px; height: 19px; border: 1px solid var(--yx-accent); border-radius: 3px; display: grid; place-items: center; font-style: normal; font-size: 10.5px; color: var(--yx-accent); font-family: var(--lamp-ja); opacity: .85; }
.lamp-foot { grid-column: 1; display: flex; align-items: center; gap: 14px; padding-top: 12px; border-top: 1px solid var(--yx-rule); font-size: 12px; letter-spacing: .12em; color: var(--yx-ink-faint); position: relative; z-index: 1; }
.lamp-foot a, .lamp-her a { margin-left: auto; font-size: 12px; letter-spacing: .2em; color: var(--yx-accent) !important; text-decoration: none; white-space: nowrap; }
.lamp-foot a:hover, .lamp-her a:hover { text-decoration: underline; text-underline-offset: 4px; }
.lamp-mark { position: absolute; right: -26px; top: -26px; width: 150px; height: 150px; pointer-events: none; display: none; }
.lamp-mark-moon { fill: var(--lamp-warm); opacity: .16; filter: drop-shadow(0 0 18px var(--lamp-warm)); }
.lamp-mark-petal { fill: #e58ea8; opacity: .12; right: -38px; top: -38px; }
:root:not([data-theme="soft-anime"]) .lamp-mark-moon,
:root[data-theme="soft-anime"] .lamp-mark-petal { display: block; }
.lamp-empty .lamp-sign, .lamp-empty .lamp-foot, .lamp-empty .ja { display: none !important; }
.lamp-empty .lamp-say .zh { font-family: var(--yx-display, serif); font-size: 15px; letter-spacing: .2em; color: var(--yx-ink-soft); }

/* ---------- 伊人 ---------- */
.lamp-her-row { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
.lamp-avatar { flex: none; width: 56px; height: 56px; border-radius: 50%; box-shadow: 0 0 0 1px var(--yx-rule-strong), 0 0 0 5px color-mix(in srgb, var(--yx-glow, #f2dfae) 12%, transparent); background: var(--lamp-paper); }
.lamp-avatar .art-image { opacity: 1 !important; }
.lamp-her-text { min-width: 0; }
.lamp-her-text b { display: block; font-family: var(--yx-display, serif); font-weight: 600; letter-spacing: .3em; font-size: 18px; color: var(--yx-ink); }
.lamp-her-text b.lamp-unset { font-size: 15px; letter-spacing: .2em; color: var(--yx-ink-soft); }
.lamp-her-text span { display: block; font-size: 12px; color: var(--yx-ink-soft); margin-top: 4px; letter-spacing: .06em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 三件小事 (until the first night or 知道了) ---------- */
.lamp > .lamp-three { margin-top: 22px !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center; padding: 18px 8px !important; }
.lamp-three[hidden] { display: none !important; }
.lamp-three > div { padding: 2px 24px; }
.lamp-three > div + div { border-left: 1px solid var(--yx-rule); }
.lamp-three .lamp-kana { display: block; font-size: 10.5px; margin-bottom: 6px; }
.lamp-three b { display: block; font-family: var(--yx-display, serif); font-weight: 600; letter-spacing: .16em; font-size: 15px; color: var(--yx-ink); margin-bottom: 4px; }
.lamp-three p { margin: 0; font-size: 12.5px; color: var(--yx-ink-soft); line-height: 1.8; }
.lamp-three-ok { border: 0 !important; border-left: 1px solid var(--yx-rule) !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; padding: 8px 22px !important; font-size: 12px !important; letter-spacing: .3em !important; color: var(--yx-ink-faint) !important; min-height: 0 !important; }

/* ---------- 夜话 before the night: the way back ---------- */
.lamp-callgo { margin: 16px auto 0; width: max-content; padding: 9px 24px !important; border-radius: 999px !important; letter-spacing: .3em !important; font-family: var(--yx-display, serif); text-decoration: none; display: inline-block; }
html[data-lamp-idle="off"] .lamp-callgo { display: none !important; }
/* 樱语's text window: the way back sits at its lower right, like a choice in a visual novel */
:root[data-theme="soft-anime"] .subtitle-area .lamp-callgo { position: absolute; right: 30px; bottom: 26px; margin: 0; z-index: 2; }
/* before the night the quick input only says it is not open yet; the way back takes its place */
html[data-lamp="on"][data-lamp-idle="on"] .tm-say { display: none !important; }

/* ---------- motion: slow and quiet; nothing moves without 轻柔动态 ---------- */
@keyframes lamp-rise { from { opacity: 0; transform: translateY(14px); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes lamp-unfold { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes lamp-drift { from { scale: 1.02; translate: 0 0; } to { scale: 1.08; translate: -1.2% -1%; } }
@keyframes lamp-breathe { 0%, 100% { opacity: .42; } 50% { opacity: .66; } }
@keyframes lamp-ink { from { clip-path: inset(0 100% 0 0); opacity: .2; } to { clip-path: inset(0 0 0 0); opacity: 1; } }
@keyframes lamp-stamp { 0% { opacity: 0; transform: scale(1.5) rotate(-8deg); } 60% { opacity: .95; transform: scale(.94) rotate(0); } 100% { opacity: .85; transform: none; } }
@keyframes lamp-turn { to { rotate: 360deg; } }
@media (prefers-reduced-motion: no-preference) {
  body[data-motion="gentle"] .lamp > *, body[data-motion="gentle"] .lamp-grid > *, body[data-motion="gentle"] .lamp-col > * { animation: lamp-rise 1.1s cubic-bezier(.16,1,.3,1) both; }
  body[data-motion="gentle"] .lamp-grid > :first-child { animation-delay: .12s; }
  body[data-motion="gentle"] .lamp-col > :first-child { animation-delay: .26s; }
  body[data-motion="gentle"] .lamp-col > :last-child { animation-delay: .38s; }
  body[data-motion="gentle"] .lamp > .lamp-three { animation-delay: .52s; }
  body[data-motion="gentle"] .lamp-art .art-image { animation: lamp-drift 46s ease-in-out infinite alternate; }
  body[data-motion="gentle"] .lamp-halo { animation: lamp-breathe 7s ease-in-out infinite; }
  body[data-motion="gentle"] .lamp-ink .ja { animation: lamp-ink 2.4s cubic-bezier(.45,0,.2,1) .5s both; }
  body[data-motion="gentle"] .lamp-ink .zh { animation: lamp-rise 1.2s ease 1.9s both; }
  body[data-motion="gentle"] .lamp-ink .lamp-sign i { animation: lamp-stamp .9s cubic-bezier(.2,.8,.3,1) 2.4s both; }
  body[data-motion="gentle"] .lamp-mark-petal { animation: lamp-turn 140s linear infinite; }
}

/* ---------- narrow ---------- */
@media (max-width: 850px) {
  .lamp-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lamp-col { gap: 16px; grid-template-rows: none; }
  .lamp-enter { min-height: 470px; }
  .lamp-art .art-image { object-position: var(--x, 50%) 8%; }
  :root[data-lamp="on"] { --lamp-veil: linear-gradient(180deg, rgba(8,12,30,0) 12%, rgba(8,12,30,.55) 36%, rgba(6,9,24,.92) 58%, rgba(6,9,24,.98)); }
  :root[data-lamp="on"][data-theme="soft-anime"] { --lamp-veil: linear-gradient(180deg, rgba(255,244,247,0) 12%, rgba(255,240,244,.55) 36%, rgba(255,243,246,.93) 58%, rgba(255,246,248,.98)); }
  .lamp-body { padding: 24px 20px 20px; }
  .lamp-body h2 { font-size: 24px !important; letter-spacing: .14em !important; }
  .lamp-row { flex-direction: column; }
  .lamp-go { width: 100%; }
  .lamp-say .ja { font-size: 18px; }
  .lamp > .lamp-three { grid-template-columns: minmax(0, 1fr); padding: 6px 4px !important; }
  .lamp-three > div { padding: 12px 16px; }
  .lamp-three > div + div { border-left: 0; border-top: 1px solid var(--yx-rule); }
  .lamp-three-ok { border-left: 0 !important; border-top: 1px solid var(--yx-rule) !important; width: 100%; }
}

/* ---------- 伊人：灯下快捷切换人设胶囊 ---------- */
.lamp-quick-personas {
  display: flex; flex-wrap: wrap; gap: 7px;
  margin-top: 12px; padding-top: 11px;
  border-top: 1px dashed var(--yx-rule);
}
.lamp-p-pill {
  display: inline-flex !important; align-items: center; gap: 6px;
  padding: 3px 11px 3px 4px !important; min-height: 0 !important;
  border-radius: 999px !important; font-size: 12px !important;
  letter-spacing: .08em !important; background: var(--lamp-paper) !important;
  border: 1px solid var(--yx-rule) !important; color: var(--yx-ink-soft) !important;
  box-shadow: none !important; cursor: pointer;
  transition: border-color .25s ease, color .25s ease, background .25s ease;
}
.lamp-p-pill:hover:not(:disabled) {
  border-color: var(--yx-rule-strong) !important; color: var(--yx-ink) !important;
}
.lamp-p-pill.on {
  border-color: color-mix(in srgb, var(--lamp-warm) 78%, transparent) !important;
  background: color-mix(in srgb, var(--lamp-warm) 13%, var(--lamp-paper)) !important;
  color: var(--yx-ink) !important;
}
.lamp-p-pill img {
  width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex-shrink: 0;
}
.lamp-p-pill:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- 立绘呈现：清晰立绘 / 朦胧剪影 (html[data-veil="silhouette"]) ---------- */
:root[data-veil="silhouette"] :is(.lamp-art .art-image, .hero-art .art-image, .call-presence .art-image) {
  filter: blur(11px) brightness(.44) contrast(1.16) saturate(.38);
  opacity: .72 !important;
  transition: filter .8s ease, opacity .8s ease;
}
:root[data-theme="soft-anime"][data-veil="silhouette"] :is(.lamp-art .art-image, .hero-art .art-image, .call-presence .art-image) {
  filter: blur(11px) brightness(.96) contrast(.92) saturate(.52) sepia(.12);
  opacity: .68 !important;
}