:root{
  --gold:#e8c87a;
  --gold-deep:#b8923c;
  --ink:#0c0a08;
  --panel:rgba(18,14,10,.82);
  --line:rgba(232,200,122,.55);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;width:100%;overflow:hidden;background:#000;}
body{
  font-family:"KaiTi","STKaiti","楷体","Songti SC","SimSun",serif;
  color:#f3ead6;user-select:none;-webkit-user-select:none;
  position:relative;
}
/* 背景 */
#bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
  transition:opacity .6s ease, transform 8s ease-out;transform:scale(1.04);
  filter:saturate(1.05) contrast(1.02);
}
#bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 30%,rgba(0,0,0,0) 30%,rgba(0,0,0,.55) 100%);}
/* 立绘 */
#stage{position:absolute;inset:0;overflow:hidden;}
.sprite{
  position:absolute;bottom:-2%;height:82%;max-height:760px;
  object-fit:contain;object-position:bottom center;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.6));
  transition:opacity .5s ease, transform .5s ease, filter .5s ease;
  transform:translateY(8px);opacity:0;
}
.sprite.show{opacity:1;transform:translateY(0);}
.sprite.dim{filter:drop-shadow(0 8px 24px rgba(0,0,0,.6)) brightness(.5) saturate(.7);}
.sprite.active{filter:drop-shadow(0 10px 30px rgba(232,200,122,.45)) brightness(1.05);}
.pos-left{left:6%;}
.pos-center{left:50%;transform:translateX(-50%) translateY(8px);}
.pos-center.show{transform:translateX(-50%) translateY(0);}
.pos-center.dim{transform:translateX(-50%);}
.pos-center.active{transform:translateX(-50%);}
.pos-right{right:6%;}
/* 顶部 HUD */
#hud{position:absolute;top:14px;right:18px;display:flex;gap:14px;
  font-size:15px;z-index:6;text-shadow:0 1px 3px #000;letter-spacing:1px;}
#hud .stat{background:var(--panel);border:1px solid var(--line);
  border-radius:20px;padding:4px 12px;color:var(--gold);}
/* 对话框 */
#dialog{
  position:absolute;left:50%;bottom:34px;transform:translateX(-50%);
  width:min(960px,92%);min-height:168px;z-index:5;cursor:pointer;
  background:linear-gradient(180deg,rgba(20,15,10,.55),rgba(12,9,6,.92));
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 18px 50px rgba(0,0,0,.6);
  padding:22px 30px 26px;
  opacity:0;transition:opacity .4s ease;
}
#dialog.show{opacity:1;}
#name{
  position:absolute;top:-18px;left:26px;padding:5px 22px;
  font-size:20px;font-weight:bold;letter-spacing:2px;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep));
  color:#1a1206;border-radius:8px 8px 4px 4px;
  box-shadow:0 4px 12px rgba(0,0,0,.5);border:1px solid #fff3d0;
}
#name.hidden{display:none;}
#text{font-size:21px;line-height:1.95;letter-spacing:1px;
  text-shadow:0 2px 6px rgba(0,0,0,.85);min-height:96px;}
#hint{position:absolute;right:24px;bottom:12px;font-size:14px;color:var(--gold);
  opacity:.75;animation:blink 1.3s infinite;}
@keyframes blink{50%{opacity:.25;}}
/* 选项 */
#choices{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  z-index:7;display:none;flex-direction:column;gap:16px;width:min(620px,88%);}
#choices.show{display:flex;}
.choice{
  font-family:inherit;font-size:20px;letter-spacing:1px;cursor:pointer;
  padding:16px 26px;color:#f3ead6;text-align:center;line-height:1.5;
  background:linear-gradient(180deg,rgba(30,22,14,.92),rgba(16,11,7,.96));
  border:1px solid var(--line);border-radius:12px;
  box-shadow:0 6px 20px rgba(0,0,0,.5);
  transition:all .18s ease;
}
.choice:hover{background:linear-gradient(180deg,rgba(232,200,122,.92),rgba(184,146,60,.96));
  color:#1a1206;transform:translateY(-2px) scale(1.02);
  box-shadow:0 10px 28px rgba(232,200,122,.4);}
/* 标题页 */
#title{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  background:radial-gradient(ellipse at 50% 40%,rgba(40,20,10,.4),rgba(0,0,0,.92));}
#title h1{font-size:64px;letter-spacing:14px;color:var(--gold);
  text-shadow:0 0 30px rgba(232,200,122,.6),0 4px 10px #000;margin-bottom:8px;}
#title .sub{font-size:22px;letter-spacing:8px;color:#d8c39a;margin-bottom:54px;
  opacity:.85;}
#title .btn{font-family:inherit;font-size:24px;letter-spacing:6px;cursor:pointer;
  padding:14px 60px;color:#1a1206;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep));
  border:none;border-radius:40px;box-shadow:0 8px 30px rgba(232,200,122,.45);
  transition:transform .15s ease,box-shadow .15s ease;}
#title .btn:hover{transform:translateY(-3px) scale(1.04);
  box-shadow:0 14px 40px rgba(232,200,122,.6);}
#title .tip{margin-top:40px;font-size:15px;color:#9c8a66;letter-spacing:2px;
  line-height:1.9;max-width:560px;}
/* 结局页 */
#ending{position:absolute;inset:0;z-index:15;display:none;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:40px;
  background:rgba(0,0,0,.86);}
#ending.show{display:flex;}
#ending h2{font-size:46px;letter-spacing:10px;color:var(--gold);
  text-shadow:0 0 24px rgba(232,200,122,.5);margin-bottom:24px;}
#ending .recap{font-size:18px;line-height:2;color:#e7dcc2;max-width:680px;
  margin-bottom:30px;letter-spacing:1px;}
#ending .recap b{color:var(--gold);}
#ending .btn{font-family:inherit;font-size:20px;letter-spacing:4px;cursor:pointer;
  padding:12px 44px;color:#1a1206;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep));
  border:none;border-radius:30px;box-shadow:0 8px 24px rgba(232,200,122,.4);}
#ending .btn:hover{transform:translateY(-2px);}
/* 右上角小工具 */
#tools{position:absolute;top:14px;left:18px;z-index:6;display:flex;gap:10px;}
#tools .t{font-size:13px;color:var(--gold);cursor:pointer;background:var(--panel);
  border:1px solid var(--line);border-radius:18px;padding:4px 12px;letter-spacing:1px;}
#tools .t:hover{background:rgba(232,200,122,.2);}
.fade-bg{opacity:0!important;}
