/* 最后一颗糖 · 样式（全部限定在 .lc-root 下；淡入用纯 CSS 动画，不会卡在透明态） */

.lc-root {
  position: fixed; inset: 0; z-index: 63;
  display: flex; align-items: flex-start; justify-content: center;
  padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(96, 40, 20, .38), transparent 62%),
    rgba(6, 5, 8, .94);
  overflow: auto; -webkit-overflow-scrolling: touch;
  animation: lcIn .28s ease-out both;
}
@keyframes lcIn { from { opacity: 0 } to { opacity: 1 } }
.lc-root[hidden] { display: none !important; }
html.lc-locked { overflow: hidden; }

.lc-stage {
  width: min(620px, 100%); margin: auto; padding: 14px 14px 18px;
  border: 1px solid rgba(196, 108, 40, .42); border-radius: 4px 16px 4px 4px;
  background: linear-gradient(170deg, rgba(22, 16, 14, .97), rgba(10, 8, 10, .98));
  box-shadow: 0 24px 70px rgba(0, 0, 0, .68), inset 0 0 0 1px rgba(255, 255, 255, .03);
  color: #EDE4DC; font-family: var(--font-body, Georgia, "Songti SC", serif);
}
.lc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.lc-head small { display: block; font-size: 9.5px; letter-spacing: .22em; color: rgba(226, 178, 130, .72); }
.lc-head h2 { margin: 3px 0 0; font-size: 20px; letter-spacing: .12em; color: #FBF0E6; }
.lc-sub { margin: 4px 0 0; font-size: 11.5px; color: #E8B27C; }
.lc-close {
  min-width: 38px; min-height: 34px; cursor: pointer; font: inherit; font-size: 15px;
  color: #E0CFC2; background: rgba(255, 255, 255, .04); border: 1px solid rgba(196, 150, 110, .32); border-radius: 3px;
}
.lc-close:hover { background: rgba(196, 108, 40, .24); color: #fff; }

.lc-primary {
  min-height: 46px; padding: 12px 18px; cursor: pointer; font: inherit; font-size: 14px; letter-spacing: .08em;
  color: #FFF6EC; border: 1px solid rgba(240, 196, 150, .5); border-radius: 3px 12px 3px 3px;
  background: linear-gradient(120deg, #7a3a12, #b8621f 60%, #7a3a12);
  box-shadow: 0 8px 22px rgba(184, 98, 31, .32);
  transition: transform .16s ease, filter .16s ease;
}
.lc-primary:hover { transform: translateY(-1px); filter: brightness(1.08); }
.lc-primary:focus-visible { outline: 2px solid #F0C496; outline-offset: 3px; }

/* 规则页 */
.lc-rules h3 { margin: 8px 0 6px; font-size: 15px; letter-spacing: .1em; color: #F6E9DC; }
.lc-rulelist { margin: 0 0 10px; padding-left: 20px; }
.lc-rulelist li { margin-bottom: 7px; font-size: 12.5px; line-height: 1.75; color: rgba(232, 220, 210, .92); }
.lc-rulelist b { color: #FBD9B4; }
.lc-hintline { margin: 0 0 12px; font-size: 11.5px; color: #CBAE94; }
.lc-begin { width: 100%; }

/* 牌桌 */
.lc-board { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: center; margin: 12px 0 10px; }
.lc-side { text-align: center; }
.lc-side .lc-label { display: block; font-size: 11px; letter-spacing: .14em; color: rgba(226, 200, 178, .78); }
.lc-side .lc-total { display: block; font-size: 26px; color: #FBF0E6; line-height: 1.2; }
.lc-side .lc-detail { display: block; font-size: 10px; color: rgba(214, 190, 170, .78); }
.lc-side .lc-detail i { font-style: normal; color: #FBD9B4; }
.lc-face { width: 54px; height: 54px; object-fit: cover; border-radius: 50%; border: 1px solid rgba(196, 108, 40, .5); }
.lc-pile { text-align: center; padding: 6px 10px; border-radius: 4px; background: rgba(255, 255, 255, .03); border: 1px solid rgba(196, 150, 110, .22); }
.lc-pile-num { display: block; font-size: 34px; color: #FFD9A8; line-height: 1.1; }
.lc-pile-label { display: block; font-size: 10px; letter-spacing: .12em; color: rgba(226, 200, 178, .72); }
.lc-dots { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; margin-top: 6px; }
.lc-dots i { width: 5px; height: 5px; border-radius: 50%; background: rgba(255, 255, 255, .1); }
.lc-dots i.is-on { background: #E8A24B; box-shadow: 0 0 5px rgba(232, 162, 75, .6); }

.lc-roundline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 10px; font-size: 11px; letter-spacing: .06em; color: rgba(220, 202, 186, .82); }
.lc-leftline { color: #E8B27C; }

.lc-say { display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px; margin-bottom: 12px;
  border-left: 2px solid rgba(196, 108, 40, .55); background: rgba(255, 255, 255, .022); }
.lc-say.is-lie { border-left-color: rgba(226, 183, 205, .6); }
.lc-sayface { width: 34px; height: 34px; object-fit: cover; border-radius: 50%; flex: 0 0 auto; }
.lc-saytext { margin: 0; font-size: 13.5px; line-height: 1.75; color: #F4E8DC; }

.lc-pick { padding: 10px; border: 1px solid rgba(150, 130, 110, .22); border-radius: 4px; background: rgba(255, 255, 255, .025); }
.lc-picklabel { display: flex; justify-content: space-between; font-size: 12px; color: rgba(220, 205, 190, .88); }
.lc-out { font-size: 20px; color: #FFD9A8; }
.lc-range { width: 100%; margin: 10px 0; accent-color: #B8621F; height: 32px; }
.lc-quick { display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; margin-bottom: 10px; }
.lc-quick button {
  min-height: 38px; cursor: pointer; font: inherit; font-size: 12px;
  color: #E8DCD0; background: rgba(255, 255, 255, .05); border: 1px solid rgba(196, 150, 110, .3); border-radius: 3px;
}
.lc-quick button:hover { background: rgba(196, 108, 40, .26); border-color: #F0C496; color: #fff; }
.lc-submit { width: 100%; }

.lc-result { margin-top: 12px; padding: 11px; border: 1px solid rgba(150, 130, 110, .22); border-radius: 4px; background: rgba(255, 255, 255, .025); }
.lc-formula { margin: 0 0 7px; font-size: 13px; color: #F2E6DA; }
.lc-formula b { color: #FFD9A8; font-size: 15px; }
.lc-tag { padding: 1px 7px; border-radius: 999px; font-size: 10px; background: rgba(196, 108, 40, .25); border: 1px solid rgba(240, 196, 150, .45); color: #FFE3C0; }
.lc-react { margin: 0 0 10px; font-size: 13px; color: #E8B27C; }
.lc-next { width: 100%; }

.lc-histbox { margin-top: 12px; border-top: 1px solid rgba(150, 130, 110, .18); padding-top: 9px; }
.lc-histbox summary { cursor: pointer; font-size: 12px; letter-spacing: .1em; color: #E8B27C; }
.lc-histlist { margin: 8px 0 0; padding-left: 18px; }
.lc-histlist li { margin-bottom: 6px; font-size: 11.5px; line-height: 1.65; color: rgba(228, 214, 202, .9); }
.lc-hmeta { display: block; font-size: 10.5px; color: rgba(200, 170, 140, .82); }
.lc-histnote { margin: 8px 0 0; font-size: 11px; color: rgba(210, 190, 172, .72); }

.lc-overtitle { margin: 6px 0 8px; font-size: 21px; letter-spacing: .14em; color: #FBF0E6; }
.lc-overtext { margin: 0 0 13px; font-size: 13px; line-height: 1.85; color: rgba(232, 220, 210, .92); }
.lc-final { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 13px; }
.lc-final div { padding: 8px 10px; border-radius: 3px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(150, 130, 110, .22); }
.lc-final span { display: block; font-size: 10px; color: rgba(214, 196, 180, .76); }
.lc-final b { font-size: 17px; color: #FBF0E6; }
.lc-logbox { margin-bottom: 13px; }
.lc-logbox summary { cursor: pointer; font-size: 12px; letter-spacing: .1em; color: #E8B27C; }
.lc-loglist { margin: 8px 0 0; padding-left: 18px; }
.lc-loglist li { margin-bottom: 5px; font-size: 11.5px; line-height: 1.7; color: rgba(228, 214, 202, .9); }
.lc-again { width: 100%; }

/* 夜谈入口 */
.lc-night-entry {
  display: block !important; width: auto; min-height: 44px; margin: 10px 14px 0; padding: 10px 12px;
  cursor: pointer; text-align: left; font: inherit; font-size: 13px;
  color: #F7E4D2; border: 1px solid rgba(240, 196, 150, .42); border-left: 3px solid rgba(255, 214, 168, .85);
  border-radius: 3px 10px 3px 3px;
  background: linear-gradient(120deg, rgba(122, 58, 18, .5), rgba(20, 14, 12, .5));
}
.lc-night-entry:hover { border-color: #F0C496; color: #fff; }
.lc-night-entry:focus-visible { outline: 2px solid #F0C496; outline-offset: 3px; }
.lc-night-entry[hidden] { display: none !important; }

@media (max-width: 520px) {
  .lc-stage { padding: 11px 11px 15px; }
  .lc-head h2 { font-size: 18px; }
  .lc-board { grid-template-columns: 1fr auto 1fr; gap: 5px; }
  .lc-side .lc-total { font-size: 22px; }
  .lc-pile-num { font-size: 28px; }
  .lc-quick { grid-template-columns: repeat(5, 1fr); }
  .lc-final { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .lc-root { animation: none !important; opacity: 1 !important; }
  .lc-primary { transition: none !important; }
  .lc-primary:hover { transform: none; }
}