/* ================= 人生：模式选择 · 开场 · 剧情一句话 · 结局画面（js/life/life-ui.js） =================
   全屏画面在弹窗（60）和设置菜单（65）之上、toast（80）之下；底是悉尼港夜景（LifeArt.skyline）。
   字：标题 serif、正文雅黑；金额 .num。只用 tokens，不引外部资源，不用虚线、不发光。 */

.lf-screen{position:fixed;inset:0;z-index:78;display:none;overflow:hidden;color:var(--tx-1);
  background:radial-gradient(ellipse 80% 55% at 50% 100%,rgba(255,190,120,.10),transparent 62%),
             linear-gradient(180deg,#040509 0%,#0a0e15 55%,#120f10 100%);}
.lf-screen.on{display:flex;animation:lfIn .35s ease;}
.lf-screen::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 75% 70% at 50% 42%,transparent 45%,rgba(0,0,0,.55) 100%);}
.lf-screen .lf-sky{position:absolute;left:0;right:0;bottom:0;width:100%;height:46%;pointer-events:none;}
.lf-screen.dawn{background:radial-gradient(ellipse 90% 50% at 50% 100%,rgba(255,196,128,.20),transparent 64%),
                            linear-gradient(180deg,#0a0c12 0%,#191820 50%,#34271f 100%);}
.lf-screen.cold{background:radial-gradient(ellipse 80% 45% at 50% 100%,rgba(140,170,210,.07),transparent 60%),
                            linear-gradient(180deg,#030406 0%,#070a0f 60%,#0a0c11 100%);}
.lf-screen.cold .lf-sky{opacity:.5;filter:saturate(.35);}
@keyframes lfIn{from{opacity:0}to{opacity:1}}
.lf-x{position:absolute;top:14px;right:16px;z-index:3;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid transparent;border-radius:var(--r-1);background:transparent;color:var(--cream-500);cursor:pointer;transition:color .15s ease,border-color .15s ease;}
.lf-x:hover{color:var(--cream-100);border-color:var(--brass-900);}
.lf-x .ic{width:18px;height:18px;fill:currentColor;}
html.lf-leaving body::after{content:"";position:fixed;inset:0;z-index:200;background:#000;}

/* ---------- 模式选择 ---------- */
.lf-modes-in{position:relative;z-index:2;margin:auto;display:flex;flex-direction:column;align-items:center;gap:22px;
  width:min(1080px,100%);padding:24px 28px calc(var(--vh) * 12);}
.lf-mark{font-family:var(--serif);font-size:34px;letter-spacing:.3em;padding-left:.3em;color:var(--brass-300);}
.lf-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%;}
.lf-card{display:flex;flex-direction:column;padding:0;text-align:left;cursor:pointer;color:inherit;font:inherit;overflow:hidden;
  border:1px solid var(--brass-900);border-radius:var(--r-2);background:linear-gradient(180deg,#1b1410,#100b08);
  box-shadow:var(--hi-warm),var(--shadow-2);transition:border-color .15s ease,box-shadow .15s ease;}
.lf-card:hover{border-color:var(--brass-700);}
.lf-card.sel{border-color:var(--brass-500);box-shadow:0 0 0 1px var(--brass-500),var(--hi-warm),var(--shadow-3);}
.lf-art{display:block;aspect-ratio:280/160;background:#000;border-bottom:1px solid var(--brass-900);}
.lf-art svg{display:block;width:100%;height:100%;}
.lf-tx{display:flex;flex-direction:column;gap:4px;padding:14px 16px 14px;}
.lf-tx b{font-family:var(--serif);font-weight:400;font-size:20px;letter-spacing:.06em;color:var(--cream-100);}
.lf-tx > span{font-size:14px;color:var(--cream-300);}
.lf-tx small{font-family:var(--serif);font-size:13px;letter-spacing:.04em;color:var(--brass-300);}
.lf-tx em{display:flex;align-items:center;gap:6px;min-height:18px;margin-top:4px;font-style:normal;font-size:12px;color:var(--cream-500);}
.lf-tx em .ic{width:14px;height:14px;fill:currentColor;color:var(--brass-500);}
.lf-card.locked{cursor:default;}
.lf-card.locked .lf-art{filter:grayscale(.85) brightness(.42);}
.lf-card.locked .lf-tx b,.lf-card.locked .lf-tx > span,.lf-card.locked .lf-tx small{color:var(--cream-700);}
.lf-card.locked.sel{border-color:var(--brass-700);box-shadow:var(--hi-warm),var(--shadow-2);}
.lf-bar{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;}
.lf-bar .sp{flex:1;}
.lf-amtrow{display:flex;align-items:center;gap:10px;}
.lf-amtrow small{font-size:12px;color:var(--cream-500);}
.lf-amt{width:150px;height:36px;text-align:right;}
.lf-warn{font-size:13px;color:var(--bad);}
.lf-back .ic{width:16px;height:16px;fill:currentColor;}

/* ---------- 开场 ---------- */
.lf-intro{background:#030305;}
.lf-intro .lf-sky{opacity:.32;}
.lf-intro-in{position:relative;z-index:2;margin:auto;display:flex;flex-direction:column;align-items:center;gap:14px;
  padding:24px 28px calc(var(--vh) * 10);text-align:center;}
.lf-intro-in p{margin:0;font-family:var(--serif);font-size:22px;letter-spacing:.06em;line-height:1.6;color:var(--cream-100);
  opacity:0;animation:lfIn .35s ease forwards;}
.lf-intro-in p + p{font-size:18px;color:var(--cream-300);}
.lf-intro-in .btn{margin-top:26px;opacity:0;animation:lfIn .35s ease forwards;}

/* ---------- 结局 ---------- */
.lf-end-in{position:relative;z-index:2;margin:auto;display:flex;flex-direction:column;align-items:center;gap:14px;
  max-width:820px;padding:24px 28px calc(var(--vh) * 16);text-align:center;}
.lf-kick{font-size:12px;letter-spacing:.24em;color:var(--cream-500);}
.lf-title{margin:0;padding-left:.18em;font-family:var(--serif);font-weight:400;font-size:44px;letter-spacing:.18em;color:var(--brass-100);}
.lf-end.cold .lf-title{color:var(--cream-100);}
.lf-rule{width:160px;height:1px;background:linear-gradient(90deg,transparent,var(--brass-500),transparent);}
.lf-stats{display:grid;grid-template-columns:repeat(5,auto);margin-top:4px;border:1px solid var(--hairline);border-radius:var(--r-2);
  background:rgba(8,6,4,.6);box-shadow:var(--hi-warm);}
.lf-stats div{display:flex;flex-direction:column;gap:4px;padding:10px 18px;border-left:1px solid var(--hairline);}
.lf-stats div:first-child{border-left:0;}
.lf-stats small{font-size:12px;letter-spacing:.12em;color:var(--cream-500);}
.lf-stats b{font-size:18px;font-weight:400;color:var(--cream-100);white-space:nowrap;}
.lf-debts{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:6px 14px;font-size:13px;color:var(--cream-300);}
.lf-debts small{font-size:12px;color:var(--cream-500);}
.lf-debts b{font-weight:400;color:var(--bad);}
.lf-epi{max-width:600px;margin:6px 0 0;font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.75;color:var(--cream-300);}
.lf-note{display:flex;flex-direction:column;align-items:center;gap:4px;max-width:600px;font-size:13px;line-height:1.6;color:var(--cream-500);}   /* 别的线的几句事实（陨落线：借过多少、骗过多少） */
.lf-unlock{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--brass-300);}
.lf-unlock .ic{width:16px;height:16px;fill:currentColor;}
.lf-acts{margin-top:8px;}
.lf-ga{font-size:12px;letter-spacing:.06em;color:var(--cream-700);}

/* ---------- 剧情一句话（下三分之一；层级在 .modal 60 之下，弹窗一出来就被盖住，life-ui 的 guardCap 同时把它收起来） ---------- */
.lf-cap{position:fixed;left:0;right:0;bottom:calc(var(--vh) * 16);z-index:58;display:flex;justify-content:center;pointer-events:none;
  opacity:0;transition:opacity .35s ease;}
.lf-cap.in{opacity:1;}
.lf-cap-in{pointer-events:auto;cursor:pointer;padding:14px 72px;text-align:center;
  background:linear-gradient(90deg,transparent,rgba(6,4,3,.8) 18%,rgba(6,4,3,.8) 82%,transparent);}
.lf-cap small{display:block;margin-bottom:6px;padding-left:.3em;font-size:12px;letter-spacing:.3em;color:var(--brass-300);}
.lf-cap p{margin:0;font-family:var(--serif);font-size:20px;letter-spacing:.05em;line-height:1.6;color:var(--cream-100);}

/* ---------- 小对话框（收手 / 上岸 / 借钱）· 补钱 ---------- */
.lf-dlg .modal-box .mb{padding:28px 26px 18px;}
.lf-dq{display:flex;flex-direction:column;gap:10px;text-align:center;}
.lf-big{font-family:var(--serif);font-size:30px;letter-spacing:.12em;color:var(--brass-100);}
.lf-q{font-size:14px;line-height:1.7;color:var(--cream-300);}
.lf-say{margin:0;font-size:15px;line-height:1.7;text-align:left;color:var(--cream-100);}
.lf-dlg .mf .btn b{font-weight:400;margin-left:4px;}
.lf-top{display:flex;flex-direction:column;align-items:stretch;gap:12px;}
.lf-top .seg{align-self:flex-start;}
.lf-top .lf-amt{width:100%;}

/* ---------- 矮窗口 / 手机 ---------- */
@container vp (max-height:680px){
  .lf-art{aspect-ratio:280/118;}
  .lf-modes-in{gap:14px;padding-bottom:calc(var(--vh) * 6);}
  .lf-mark{font-size:26px;}
  .lf-title{font-size:36px;}
}
html.m .lf-screen{overflow-y:auto;}
html.m .lf-modes-in{margin:0 auto;gap:10px;padding:10px 12px;}
html.m .lf-mark{display:none;}
html.m .lf-cards{gap:10px;}
html.m .lf-art{aspect-ratio:280/96;}
html.m .lf-tx{padding:8px 10px;}
html.m .lf-tx b{font-size:16px;}
html.m .lf-bar{flex-wrap:wrap;}
html.m .lf-title{font-size:30px;}
html.m .lf-stats{grid-template-columns:repeat(3,auto);}
html.m .lf-stats div:nth-child(4){border-left:0;}
html.m .lf-end-in,html.m .lf-intro-in{margin:0 auto;padding:14px 12px;}
/* ================= 生活随机事件（js/life/events-ui.js） =================
   消息走 LoopUI 的一行通知和信封（css/loop.css），这里只补两处：信封里选择题的结果一行、右上角事件消息的来源名。 */
.ml-msg span em.res{display:block;margin-top:3px;font-style:normal;font-size:12px;color:var(--tx-3);}
.lp-pop.k-life .tx small{color:var(--tx-3);letter-spacing:.04em;}
