/* ==========================================================================
   西部牛来世界 —— 水墨西部 · 纸与铁锈
   ========================================================================== */
:root{
  --ink:#241a12;
  --paper:#f2e6cc;
  --paper-dim:#c9b795;
  --wood:#3a2717;
  --wood2:#5f4327;
  --gold:#e8b64c;
  --rust:#c0562e;
  --scar:#a888ff;
  --panel:rgba(30,20,12,.82);
  --hair:rgba(232,214,170,.22);
}
*{box-sizing:border-box}
/* .thumb/.retina/.ag-plan 上有 display:block|grid，会盖掉 UA 的 [hidden]{display:none}，
   所以显式补一条，否则 hidden 属性形同虚设（会露出图片的 alt 占位框）。 */
[hidden]{display:none!important}
html,body{margin:0;height:100%;overflow:hidden;background:#120c07}
body{
  font-family:"Noto Serif SC","Songti SC",serif;
  color:var(--paper);
  -webkit-user-select:none;user-select:none;
  cursor:crosshair;
}
#cv{position:fixed;inset:0;width:100%;height:100%;display:block}

/* ------------------------------------------------------------------ HUD */
#hud{position:fixed;inset:0;pointer-events:none;font-size:13px}
.panel{
  position:absolute;pointer-events:auto;
  background:var(--panel);
  border:1px solid var(--hair);
  box-shadow:0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,240,200,.07);
  backdrop-filter:blur(6px);
}
.panel header{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:9px 12px;border-bottom:1px solid var(--hair);
}
.panel .who{font-weight:600;letter-spacing:.06em}
.panel .realm{color:var(--gold);font-size:12px;letter-spacing:.14em}

/* 左上 */
#stats{top:16px;left:16px;width:262px}
.realm-desc{padding:7px 12px 2px;font-size:11px;line-height:1.6;color:var(--paper-dim);font-style:italic}
.bar{position:relative;height:15px;margin:7px 12px;background:#1b1108;border:1px solid #4a3520;overflow:hidden}
.fill{position:absolute;inset:0;width:50%;transition:width .18s linear}
.fill.hp{background:linear-gradient(180deg,#e8705a,#a8321f)}
.fill.sta{background:linear-gradient(180deg,#e8cf6a,#9c8020)}
.fill.aura{background:linear-gradient(180deg,#f0a34a,#a85818)}
.btxt{position:absolute;inset:0;text-align:center;font-size:10px;line-height:15px;
  font-family:"JetBrains Mono",monospace;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.money,.eggs{padding:2px 12px;font-size:12px;color:var(--paper-dim)}
.money b{color:var(--gold);font-family:"JetBrains Mono",monospace;font-size:14px}
.eggs{padding-bottom:10px}
.eggs b{color:var(--gold);font-family:"JetBrains Mono",monospace}

/* 左下 */
#questbox{left:16px;bottom:52px;width:262px}
#quest{padding:10px 12px;font-size:12px;line-height:1.75;color:#f0dfb8}

/* 右上 */
#place{top:16px;right:16px;width:212px;padding:10px 12px 12px;text-align:right}
.clock{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--paper-dim);letter-spacing:.08em}
.rname{font-size:19px;font-weight:600;margin-top:4px;letter-spacing:.04em}
.ren{font-family:"JetBrains Mono",monospace;font-size:9.5px;color:var(--gold);letter-spacing:.22em;margin-top:2px}
.rhours{font-size:11px;color:var(--paper-dim);margin:3px 0 9px;font-style:italic}
#minimap{width:188px;height:188px;border:1px solid var(--hair);display:block;filter:saturate(.85)}

/* 右下 */
#side{right:16px;bottom:52px;width:308px;max-height:62vh;display:flex;flex-direction:column}
.tabs{display:flex;border-bottom:1px solid var(--hair)}
.tabs button{
  flex:1;background:none;border:0;border-right:1px solid var(--hair);
  color:var(--paper-dim);font-family:inherit;font-size:11.5px;padding:8px 0;cursor:pointer;
  letter-spacing:.05em;transition:.15s;
}
.tabs button:last-child{border-right:0}
.tabs button:hover{color:var(--paper);background:rgba(255,220,150,.06)}
.tabs button.on{color:var(--gold);background:rgba(255,200,110,.10)}
.pane{display:none;overflow-y:auto;padding:10px 12px;font-size:11.5px;line-height:1.75}
.pane.on{display:block}
.pane::-webkit-scrollbar{width:5px}
.pane::-webkit-scrollbar-thumb{background:rgba(232,182,76,.3)}
.line{padding:3px 0;border-bottom:1px dotted rgba(232,214,170,.10);color:#e2d3ae}
.line.good{color:#b9d69a}
.line.bad{color:#e88a72}
.line.boom{color:var(--gold);font-weight:600}
.line.dim{color:#9a8a6c}
.line.dao{color:#c9b4ff}

/* Agent 面板 */
.ag-head{font-size:12.5px;font-weight:600;letter-spacing:.05em;display:flex;align-items:center;gap:7px}
.dot{width:7px;height:7px;border-radius:50%;background:#6a5c48;display:inline-block}
.dot.on{background:#8ede7a;box-shadow:0 0 8px #8ede7a}
.dot.think{background:var(--gold);box-shadow:0 0 8px var(--gold);animation:pulse .7s infinite alternate}
@keyframes pulse{to{opacity:.35}}
#ag-toggle{margin-left:auto;background:rgba(232,182,76,.14);border:1px solid rgba(232,182,76,.45);
  color:var(--gold);font-family:inherit;font-size:10.5px;padding:3px 9px;cursor:pointer;letter-spacing:.04em}
#ag-toggle:hover{background:rgba(232,182,76,.28)}
.ag-sub{font-size:10.5px;color:#9a8a6c;margin:3px 0 7px;font-family:"JetBrains Mono",monospace}
.retina{display:grid;gap:1px;width:100%;aspect-ratio:16/10;margin-bottom:6px;
  border:1px solid var(--hair);padding:2px;background:#120c07}
.retina i{display:block;width:100%;height:100%}
.thumb{width:100%;display:block;border:1px solid var(--hair);image-rendering:pixelated;margin-bottom:8px;opacity:.9}
.ag-plan{border-top:1px solid var(--hair);padding-top:7px}
.kv{display:flex;gap:7px;padding:2px 0;font-size:11px;color:#e2d3ae}
.kv b{flex:0 0 30px;color:var(--gold);font-weight:600}
.kv.reason{color:#c2b190;font-style:italic}
.ag-note{margin-top:8px;font-size:10px;color:#7f7159;line-height:1.6;border-top:1px dotted var(--hair);padding-top:6px}

/* 按键条 */
#keys{
  position:absolute;left:50%;bottom:14px;transform:translateX(-50%);
  font-size:11px;color:#a8967a;letter-spacing:.03em;
  background:rgba(20,13,8,.6);border:1px solid var(--hair);padding:6px 14px;
  pointer-events:auto;white-space:nowrap;
}
#keys b{color:var(--gold);font-family:"JetBrains Mono",monospace;font-size:10.5px}

/* ------------------------------------------------------------- 对话 */
#dlg{
  position:fixed;left:50%;bottom:64px;transform:translateX(-50%);
  width:min(680px,84vw);background:rgba(26,17,10,.94);
  border:1px solid rgba(232,182,76,.34);
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  display:flex;flex-direction:column;z-index:30;
}
#dlg.hidden,#map.hidden{display:none}
.dlg-head{display:flex;align-items:flex-start;gap:14px;padding:11px 14px;border-bottom:1px solid var(--hair)}
#dlg-name{font-size:16px;font-weight:600}
#dlg-title{font-size:11px;color:var(--paper-dim);margin-top:2px}
#dlg-mood{margin-left:auto;font-size:10.5px;color:var(--gold);font-family:"JetBrains Mono",monospace;padding-top:4px}
#dlg-close{background:none;border:0;color:var(--paper-dim);font-size:22px;line-height:1;cursor:pointer;padding:0 2px}
#dlg-close:hover{color:var(--rust)}
#dlg-body{padding:12px 14px;max-height:34vh;overflow-y:auto;font-size:13.5px;line-height:1.9}
#dlg-body::-webkit-scrollbar{width:5px}
#dlg-body::-webkit-scrollbar-thumb{background:rgba(232,182,76,.3)}
#dlg-body .npc{color:#f2e2bc;margin:5px 0;padding-left:12px;border-left:2px solid rgba(232,182,76,.4)}
#dlg-body .me{color:#a8c4d8;margin:9px 0 5px;font-size:12.5px}
#dlg-body .pending{opacity:.45;font-style:italic}
#dlg-input{
  border:0;border-top:1px solid var(--hair);background:rgba(0,0,0,.25);
  color:var(--paper);font-family:inherit;font-size:13px;padding:11px 14px;outline:none;
}
#dlg-input::placeholder{color:#7f7159}

/* ------------------------------------------------------------- 方志 */
#map{
  position:fixed;inset:6vh 8vw;z-index:40;overflow-y:auto;
  background:rgba(22,15,9,.96);border:1px solid rgba(232,182,76,.3);
  box-shadow:0 30px 80px rgba(0,0,0,.7);padding:0 0 30px;
}
.map-head{position:sticky;top:0;background:rgba(22,15,9,.98);padding:20px 32px 14px;
  border-bottom:1px solid var(--hair);display:flex;align-items:baseline;gap:16px;z-index:2}
.map-head h2{margin:0;font-size:22px;letter-spacing:.1em;font-weight:600}
.map-head span{font-size:11px;color:#7f7159;font-family:"JetBrains Mono",monospace}
#map-body{padding:18px 32px;columns:2;column-gap:34px}
.mr{break-inside:avoid;margin-bottom:20px;border-left:2px solid rgba(232,182,76,.28);padding-left:14px}
.mr.unseen{opacity:.36;border-color:rgba(232,214,170,.15)}
.mr-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.mr-h b{font-size:15px}
.mr-h span{font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--gold);letter-spacing:.18em}
.mr-h em{font-size:10.5px;color:#8f7f63}
.mr p{margin:6px 0 0;font-size:12.5px;line-height:1.85;color:#ddcda8}
.mr q{display:block;margin-top:7px;font-size:12px;color:#a8967a;font-style:italic;line-height:1.8}
.mr.eggs p{margin:3px 0;color:#8f7f63}
.mr.eggs p.got{color:var(--gold)}

/* ------------------------------------------------------------- 开场 */
#splash{
  position:fixed;inset:0;z-index:60;display:grid;place-items:center;
  background:radial-gradient(ellipse at 50% 40%,#3a2314 0%,#150d07 62%,#0a0603 100%);
  cursor:pointer;transition:opacity .8s;
}
#splash.gone{opacity:0;pointer-events:none}
.sp-inner{max-width:760px;padding:0 34px;text-align:center}
.sp-kicker{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.36em;color:var(--scar);margin-bottom:18px}
.sp-inner h1{margin:0;font-size:clamp(38px,7vw,72px);font-weight:900;letter-spacing:.1em;
  background:linear-gradient(180deg,#ffeab4,#d0863a 70%,#8a4a18);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 6px 30px rgba(200,120,40,.25)}
.sp-en{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.5em;color:#9a8a6c;margin:10px 0 26px}
.sp-lead{font-size:14px;line-height:2.1;color:#d8c8a4;margin:0 0 30px}
.sp-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left;margin-bottom:34px}
.sp-cols div{border-top:1px solid rgba(232,182,76,.3);padding-top:11px}
.sp-cols b{display:block;font-size:13px;color:var(--gold);margin-bottom:5px}
.sp-cols span{font-size:11.5px;line-height:1.8;color:#a8967a}
.sp-go{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.3em;color:#7f7159;animation:blink 2s infinite}
@keyframes blink{50%{opacity:.3}}

@media(max-width:1100px){
  #side{display:none}
  #map-body{columns:1}
  .sp-cols{grid-template-columns:1fr}
}

/* ------------------------------------------------------- 角色 Context 面板 */
.ctxbox{border-left-color:var(--scar)}
.ctxnote{font-size:11.5px;color:#a8967a;font-style:italic}
.ctx{margin:12px 0 0;padding-left:10px;border-left:1px solid rgba(168,136,255,.32)}
.ctx b{font-size:13px;color:#e2d3ae}
.ctx em{display:block;font-family:"JetBrains Mono",monospace;font-size:9.5px;
  color:var(--scar);letter-spacing:.05em;margin:2px 0 4px;font-style:normal}
.ctx ul{margin:0;padding-left:16px}
.ctx li{font-size:11.5px;line-height:1.7;color:#c2b190;margin:1px 0}
.ctx li.empty{color:#6f6350;font-style:italic}

/* ------------------------------------------------------- 过场 CG */
#cut{position:fixed;inset:0;z-index:50;pointer-events:none;color:var(--paper)}
#cut.hidden{display:none}
#cut .bar{position:absolute;left:0;right:0;height:11vh;background:#000;
  box-shadow:0 0 40px rgba(0,0,0,.9)}
#cut .bar.top{top:0} #cut .bar.bottom{bottom:0}
#cut-title{position:absolute;top:13vh;left:0;right:0;text-align:center;
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.42em;
  color:rgba(232,182,76,.75);text-transform:uppercase}
#cut-sub{position:absolute;left:0;right:0;bottom:14vh;text-align:center;padding:0 8vw}
#cut-who{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.24em;
  color:var(--gold);margin-bottom:8px;min-height:14px}
#cut-line{font-size:clamp(17px,2.3vw,26px);line-height:1.8;
  text-shadow:0 2px 14px rgba(0,0,0,.9);min-height:1.8em}
#cut-hint{position:absolute;bottom:4.2vh;left:0;right:0;text-align:center;
  font-size:10.5px;color:#6f6350;font-family:"JetBrains Mono",monospace;letter-spacing:.1em}
body.in-cut #hud,body.in-cut #dlg,body.in-cut #map{opacity:0;pointer-events:none;transition:opacity .4s}
.mainq{display:block;color:var(--gold);font-family:"JetBrains Mono",monospace;
  font-size:10px;letter-spacing:.16em;margin-bottom:5px}
.sideq{margin-top:8px;padding-top:7px;border-top:1px dotted var(--hair);
  font-size:11px;color:#a8967a;line-height:1.7}


/* ------------------------------------------------------- 访客 Key / 声明 */
.sp-key{border-top:1px solid rgba(232,182,76,.28);border-bottom:1px solid rgba(232,182,76,.28);
  padding:16px 0;margin:0 0 22px;text-align:left}
.sp-key .kt{font-size:12.5px;color:var(--gold);margin-bottom:7px;letter-spacing:.04em}
.sp-key .kd{font-size:11.5px;line-height:1.85;color:#a8967a;margin-bottom:11px}
.sp-key .kd b{color:#d8c8a4;font-weight:600}
.sp-key .kd a{color:var(--gold)}
.krow{display:flex;gap:8px;flex-wrap:wrap}
#key-input{flex:1;min-width:220px;background:rgba(0,0,0,.35);border:1px solid var(--hair);
  color:var(--paper);font-family:"JetBrains Mono",monospace;font-size:12px;padding:8px 11px;outline:none}
#key-input:focus{border-color:rgba(232,182,76,.5)}
.krow button{background:rgba(232,182,76,.14);border:1px solid rgba(232,182,76,.45);color:var(--gold);
  font-family:inherit;font-size:12px;padding:8px 14px;cursor:pointer;letter-spacing:.04em}
.krow button:hover{background:rgba(232,182,76,.28)}
.krow button.ghost{background:none;border-color:var(--hair);color:#8f7f63}
#key-msg{font-size:11px;margin-top:9px;min-height:15px;color:#8f7f63;font-family:"JetBrains Mono",monospace}
#key-msg.ok{color:#b9d69a} #key-msg.bad{color:#e88a72}
.sp-legal{display:flex;gap:16px;align-items:center;justify-content:center;flex-wrap:wrap;
  font-size:10.5px;color:#6f6350;font-family:"JetBrains Mono",monospace;letter-spacing:.06em;margin-bottom:14px}
.sp-legal a{color:#8f7f63;text-decoration:none}
.sp-legal a:hover{color:var(--gold)}
