/* 千年端游模式 · 嵌入 index.html 的隔离样式（#qn-overlay 作用域） */
/* ============ 千年端游经典风格 ============ */
/* 主背景 深墨绿 */
/* 面板底 */
/* 面板高亮底 */
/* 边框线 */
/* 描金 */
/* 主文字 */
/* 活力/绿 */
/* 内功 蓝 */
/* 外功 橙 */
/* 武功 紫 */
/* 头部 红 */
/* 手部 黄 */
/* 脚部 绿 */
/* 顶部状态 */
/* 中部地图 */
/* 底部按钮 */
/* 弹层面板 */
/* 弹窗 */


@font-face {
  font-family: 'HanYiZhongYuan';
  src: url('font/汉仪中圆简.ttf') format('truetype');
  font-weight: normal; font-style: normal; font-display: swap;
}#qn-overlay{
  --c-bg:#0f1410;         
  --c-panel:#16241a;      
  --c-panel2:#1c2f22;     
  --c-line:#3a5a3a;       
  --c-gold:#d4af37;       
  --c-gold2:#b8912f;
  --c-txt:#d8e6d2;        
  --c-txt-dim:#8aa884;
  --c-green:#5ab45f;      
  --c-cyan:#4fc3f7;       
  --c-orange:#ff9f43;     
  --c-purple:#b57bff;     
  --c-red:#e57373;        
  --c-hand:#ffd54f;       
  --c-foot:#81c784;       
  --c-hp:#e57373;
  --c-mp:#4fc3f7;
  --btn-h:42px;
}#qn-overlay{position:fixed;inset:0;z-index:9999;max-width:520px;height:100dvh;margin:0 auto;display:none;flex-direction:column;
  background:rgba(12,18,13,.97);border-left:2px solid var(--c-line);border-right:2px solid var(--c-line);
  box-shadow:0 0 30px rgba(0,0,0,.6);}#qn-overlay #topbar{padding:6px 10px 4px;background:linear-gradient(180deg,#1d2c1e,#131d14);
  border-bottom:1px solid var(--c-line);flex-shrink:0;}#qn-overlay .char-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:15px;}#qn-overlay .char-line .nm{color:#fff;font-weight:bold;}#qn-overlay .tag{font-size:11px;color:var(--c-gold);border:1px solid var(--c-gold);border-radius:3px;padding:0 5px;}#qn-overlay .stat-mini{font-size:11px;color:var(--c-txt-dim);}#qn-overlay .stat-mini b{color:var(--c-txt);}#qn-overlay .bars{margin-top:4px;display:flex;flex-direction:column;gap:2px;}#qn-overlay .bar-row{display:flex;align-items:center;gap:6px;font-size:11px;}#qn-overlay .bar-row .lab{width:34px;color:var(--c-txt-dim);flex-shrink:0;text-align:right;}#qn-overlay .bar{flex:1;height:13px;background:#0a120b;border:1px solid #2c442c;border-radius:2px;overflow:hidden;position:relative;}#qn-overlay .bar i{display:block;height:100%;transition:width .4s;}#qn-overlay .bar span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:9px;color:#fff;text-shadow:0 1px 2px #000;}#qn-overlay .bar-row .val{width:58px;color:var(--c-txt-dim);font-size:10px;flex-shrink:0;}#qn-overlay .bar.vit i{background:linear-gradient(180deg,#6fce74,#3f9e46);}#qn-overlay .bar.inn i{background:linear-gradient(180deg,#6fd6ff,#2f8fd0);}#qn-overlay .bar.out i{background:linear-gradient(180deg,#ffbe7a,#e07b2a);}#qn-overlay .bar.wg i{background:linear-gradient(180deg,#cba4ff,#8a5cd8);}#qn-overlay .bar.hd i{background:linear-gradient(180deg,#ff9a9a,#d14b4b);}#qn-overlay .bar.hn i{background:linear-gradient(180deg,#ffe08a,#d8a72e);}#qn-overlay .bar.ft i{background:linear-gradient(180deg,#a3e6b0,#4ca75c);}#qn-overlay .bar.gq i{background:linear-gradient(180deg,#9fe8ff,#2f7fd0);}#qn-overlay .bar.qi i{background:linear-gradient(180deg,#ffe08a,#c98a2e);}#qn-overlay .realm-row{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:11px;color:var(--c-txt-dim);flex-wrap:wrap;}#qn-overlay .realm-row .bonus{color:#ffd700;}#qn-overlay .realm-row button{font-size:11px;}#qn-overlay .attack-row{display:flex;gap:10px;margin-top:3px;font-size:11px;flex-wrap:wrap;}#qn-overlay .attack-row .g{color:var(--c-txt-dim);}#qn-overlay .attack-row .g b{color:#ffd57a;}#qn-overlay #maparea{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;}#qn-overlay .map-head{display:flex;align-items:center;gap:6px;padding:5px 10px;background:#101910;border-bottom:1px solid var(--c-line);font-size:12px;flex-shrink:0;}#qn-overlay .map-head .loc{color:#9fe8a5;font-weight:bold;}#qn-overlay .map-head .coord{color:var(--c-txt-dim);font-size:11px;}#qn-overlay .grid-wrap{flex:1;display:flex;align-items:center;justify-content:center;background:
  radial-gradient(ellipse at 50% 30%, rgba(70,120,70,.18), rgba(10,16,11,.9)), #0b130c;
  padding:6px;overflow:hidden;}#qn-overlay #grid{display:grid;gap:1px;background:#223722;border:2px solid #3a5a3a;box-shadow:0 0 14px rgba(0,0,0,.5);}#qn-overlay .cell{background:#121f14;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--c-txt-dim);}#qn-overlay .cell.wall{background:#0a100b;}#qn-overlay .cell.me{background:#0f3f1a;color:#7dff8a;text-shadow:0 0 6px #2faa3f;}#qn-overlay .cell.npc{background:#233a20;color:#ffd75a;}#qn-overlay .cell.mob{background:#33201a;color:#ff8a6a;}#qn-overlay .cell.mine{background:#2e2a12;color:#ffe08a;}#qn-overlay .cell.boss{background:#4a1020;color:#ff5a5a;}#qn-overlay .map-foot{flex-shrink:0;padding:4px 10px;background:#101910;border-top:1px solid var(--c-line);font-size:11px;color:var(--c-txt-dim);}#qn-overlay .map-foot .qk{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px;}#qn-overlay .qk-btn{border:1px solid #3a6a3a;background:#1c2f1c;color:#bfe8b6;border-radius:3px;padding:1px 8px;font-size:11px;}#qn-overlay .qk-btn.cur{border-color:var(--c-gold);color:var(--c-gold);background:#2a2410;}#qn-overlay #btns{flex-shrink:0;display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:6px;background:#111a12;border-top:1px solid var(--c-line);}#qn-overlay #btns button{
  height:var(--btn-h);font-family:inherit;font-size:14px;color:var(--c-txt);
  background:linear-gradient(180deg,#2c452c,#1d321d);border:1px solid #3f633f;border-radius:5px;
  box-shadow:0 2px 4px rgba(0,0,0,.4);cursor:pointer;transition:filter .15s;}#qn-overlay #btns button:active{filter:brightness(1.3);}#qn-overlay #btns button.gold{color:#ffe08a;border-color:var(--c-gold);background:linear-gradient(180deg,#3a3315,#241f0d);}#qn-overlay #move{flex-shrink:0;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px 6px 8px;background:#0e150f;border-top:1px solid var(--c-line);}#qn-overlay #move button{height:34px;font-family:inherit;font-size:12px;color:#9fd29a;background:#182418;border:1px solid #2e482e;border-radius:4px;cursor:pointer;}#qn-overlay #move button.center{background:#241f0d;color:var(--c-gold);border-color:var(--c-gold);}#qn-overlay #move button:active{filter:brightness(1.4);}#qn-overlay #panel{position:absolute;inset:0;z-index:50;background:rgba(8,12,9,.97);display:none;flex-direction:column;}#qn-overlay #panel.show{display:flex;}#qn-overlay #panel .ph{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:linear-gradient(180deg,#1f3120,#16221a);
  border-bottom:1px solid var(--c-line);flex-shrink:0;}#qn-overlay #panel .ph .t{color:var(--c-gold);font-size:16px;letter-spacing:2px;}#qn-overlay #panel .ph button{font-family:inherit;font-size:12px;color:#cfe8c8;background:#233723;border:1px solid #3f633f;border-radius:4px;padding:4px 10px;cursor:pointer;}#qn-overlay #panel .pb{flex:1;overflow-y:auto;padding:8px;}#qn-overlay .psec{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px;}#qn-overlay .psec button{font-family:inherit;font-size:12px;color:#bfe6b6;background:#1b2d1b;border:1px solid #365236;border-radius:4px;padding:4px 10px;cursor:pointer;}#qn-overlay .psec button.on{border-color:var(--c-gold);color:var(--c-gold);background:#2a2410;}#qn-overlay .pitem{display:flex;align-items:center;gap:8px;padding:6px 8px;border-bottom:1px solid rgba(70,110,70,.25);font-size:13px;}#qn-overlay .pitem .nm{flex:1;}#qn-overlay .pitem .info{color:var(--c-txt-dim);font-size:11px;}#qn-overlay .pitem button{font-family:inherit;font-size:11px;color:#bfe6b6;background:#203420;border:1px solid #3f633f;border-radius:3px;padding:2px 8px;cursor:pointer;}#qn-overlay .pitem button.on{border-color:var(--c-gold);color:var(--c-gold);}#qn-overlay .tier1{color:#9fe8a5;}#qn-overlay .tier2{color:#6fd6ff;}#qn-overlay .tier3{color:#ffb56b;}#qn-overlay .tierz{color:#ff7ad9;}#qn-overlay .empty{color:var(--c-txt-dim);text-align:center;padding:20px;font-size:13px;}#qn-overlay h3.sec-t{color:#9fd29a;font-size:13px;margin:8px 0 4px;border-left:3px solid var(--c-gold);padding-left:6px;}#qn-overlay .row{display:flex;justify-content:space-between;padding:5px 2px;border-bottom:1px solid rgba(70,110,70,.2);font-size:13px;}#qn-overlay .row .l{color:var(--c-txt-dim);}#qn-overlay .row .r{color:#ffe08a;}#qn-overlay .tip{color:#8aa884;font-size:11px;margin-top:6px;line-height:1.6;}#qn-overlay .desc{font-size:11px;color:var(--c-txt-dim);margin-top:2px;line-height:1.5;}#qn-overlay .reward{color:#ffd57a;}#qn-modal{position:absolute;inset:0;z-index:99;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;}#qn-modal.show{display:flex;}#qn-overlay .mbox{width:88%;max-height:70%;overflow-y:auto;background:linear-gradient(180deg,#1c2c1d,#14201a);border:2px solid var(--c-gold);border-radius:8px;padding:14px;box-shadow:0 0 30px rgba(0,0,0,.7);}#qn-overlay .mbox h4{color:var(--c-gold);text-align:center;margin-bottom:10px;letter-spacing:2px;}#qn-overlay .mbox .close{display:block;margin:12px auto 0;font-family:inherit;font-size:13px;color:#cfe8c8;background:#233723;border:1px solid #3f633f;border-radius:4px;padding:6px 24px;cursor:pointer;}#qn-overlay .scrollbar::-webkit-scrollbar{width:6px;height:6px;}#qn-overlay .scrollbar::-webkit-scrollbar-thumb{background:#3a5a3a;border-radius:3px;}

/* ===== 端游覆盖层新增：地图信息/战斗/复活 ===== */
#qn-overlay .map-desc{font-size:11px;color:#9fb59a;margin-top:2px;line-height:1.5;}
#qn-overlay #qn-log{font-size:11px;color:#cfe0c8;margin-top:4px;line-height:1.6;max-height:76px;overflow-y:auto;border-top:1px dashed #3a5a3a;padding-top:4px;}
#qn-overlay #qn-log .log-line{white-space:pre-wrap;word-break:break-all;}
#qn-overlay #qn-log .log-ok{color:#9fe8a5;}
#qn-overlay #qn-log .log-warn{color:#ffd08a;}
#qn-overlay #qn-log .log-err{color:#ff8a8a;}
#qn-overlay #qn-combat{position:absolute;inset:0;z-index:30;background:rgba(10,16,11,.96);display:flex;flex-direction:column;padding:10px;}
#qn-overlay #qn-combat .c-head{font-size:14px;color:#ffd700;text-align:center;margin-bottom:6px;}
#qn-overlay #qn-combat .c-mine,#qn-overlay #qn-combat .c-mob{font-size:12px;margin:4px 0;}
#qn-overlay #qn-combat .c-bbar{height:12px;border:1px solid #5a7a5a;border-radius:3px;overflow:hidden;background:#1a241a;margin-top:2px;}
#qn-overlay #qn-combat .c-bbar i{display:block;height:100%;}
#qn-overlay #qn-combat .c-log{flex:1;overflow-y:auto;font-size:11px;color:#cfe0c8;line-height:1.7;margin:6px 0;border:1px solid #2e4a2e;border-radius:4px;padding:6px;background:#0d150d;}
#qn-overlay #qn-combat .c-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;}
#qn-overlay #qn-combat .c-actions button{font-family:inherit;font-size:12px;padding:6px 12px;border-radius:4px;border:1px solid #4a6a4a;background:#1c2f22;color:#dff0da;cursor:pointer;}
#qn-overlay #qn-combat .c-actions button:active{background:#2c4a2c;}
#qn-overlay #qn-combat .c-actions button.stop{border-color:#a03;color:#ff9a9a;}
#qn-overlay #qn-combat .c-actions button.gold{border-color:#d4af37;color:#ffd700;}
#qn-overlay #qn-combat .c-actions button.mv{color:#9fd8ff;}
#qn-overlay #qn-reving{position:absolute;inset:0;z-index:40;background:rgba(30,8,8,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
#qn-overlay #qn-reving .rv-title{font-size:20px;color:#ff6a6a;margin-bottom:8px;}
#qn-overlay #qn-reving .rv-num{font-size:34px;color:#ffd700;margin-bottom:6px;}
#qn-overlay #qn-reving .rv-tip{font-size:12px;color:#d8b8b8;line-height:1.8;}
#qn-overlay #panel-body2{display:none;}
#qn-overlay #panel-subhead{display:none;justify-content:space-between;align-items:center;padding:4px 8px;border-bottom:1px solid #3a5a3a;}
#qn-overlay #panel-subhead .t{font-size:13px;color:#ffd700;}
#qn-overlay .psec{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px;}
#qn-overlay .psec button{font-family:inherit;font-size:12px;padding:3px 9px;border-radius:3px;border:1px solid #3a5a3a;background:#1c2f22;color:#cfe0c8;cursor:pointer;}
#qn-overlay .psec button.on{background:#d4af37;color:#1a1a1a;border-color:#d4af37;font-weight:bold;}
#qn-overlay .pitem{display:flex;align-items:center;gap:6px;padding:6px 4px;border-bottom:1px dashed #2e4a2e;font-size:12px;}
#qn-overlay .pitem .nm{flex:0 0 auto;min-width:96px;color:#ffd700;}
#qn-overlay .pitem .nm.tier1{color:#9fe8a5;}
#qn-overlay .pitem .nm.tier2{color:#7fd0ff;}
#qn-overlay .pitem .nm.tier3{color:#ff9ad5;}
#qn-overlay .pitem .info{flex:1;color:#cfe0c8;line-height:1.5;}
#qn-overlay .pitem button{font-family:inherit;font-size:11px;padding:2px 8px;border-radius:3px;border:1px solid #3a5a3a;background:#233a28;color:#dff0da;cursor:pointer;flex:0 0 auto;}
#qn-overlay .pitem button.on{background:#d4af37;color:#1a1a1a;border-color:#d4af37;}
#qn-overlay .row{display:flex;justify-content:space-between;padding:5px 4px;border-bottom:1px dashed #2e4a2e;font-size:12px;}
#qn-overlay .row .l{color:#9fb59a;}
#qn-overlay .row .r{color:#ffe08a;}
#qn-overlay .sec-t{color:#ffd700;font-size:14px;margin:6px 0;border-bottom:1px solid #3a5a3a;padding-bottom:3px;}
#qn-overlay .tip{color:#8fb28a;font-size:11px;line-height:1.7;margin:6px 0;}
#qn-overlay .empty{color:#7a8f77;font-size:13px;text-align:center;padding:22px 0;}
#qn-overlay .reward{color:#ffd08a;}
#qn-overlay #qn-near{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;}
#qn-overlay #qn-near .nr{display:flex;flex-wrap:wrap;gap:3px;align-items:center;font-size:11px;margin-right:8px;}
#qn-overlay #qn-near .nt{color:#9fb59a;flex:0 0 auto;}
#qn-overlay #qn-near button{font-family:inherit;font-size:11px;padding:1px 7px;border-radius:3px;border:1px solid #3a5a3a;background:#1c2f22;color:#cfe0c8;cursor:pointer;}
#qn-overlay #qn-near button i{font-style:normal;color:#8aa884;font-size:10px;margin-left:3px;}

/* ===== 千年主界面新增样式：境界加减行 ===== */
#qn-overlay .realm-acts{display:flex;align-items:center;gap:6px;margin-top:3px;flex-wrap:wrap;}
#qn-overlay .realm-acts button{font-family:inherit;font-size:11px;color:var(--c-txt);background:#1d2f1d;border:1px solid #3f633f;border-radius:3px;padding:2px 8px;cursor:pointer;}
#qn-overlay .realm-acts button:active{filter:brightness(1.3);}

/* ===== 移动端竖屏适配（压缩顶栏/按钮，给地图网格留出空间） ===== */
@media (max-width:560px){
  #qn-overlay{max-width:100%;border-left:none;border-right:none;}
  #qn-overlay #topbar{padding:4px 8px 2px;}
  #qn-overlay .char-line{gap:5px;font-size:13px;}
  #qn-overlay .char-line .tag{font-size:10px;padding:0 4px;}
  #qn-overlay .char-line .stat-mini{font-size:10px;}
  #qn-overlay .realm-row{gap:5px;margin-top:2px;font-size:10px;}
  #qn-overlay .realm-acts{gap:4px;margin-top:2px;}
  #qn-overlay .realm-acts button{font-size:10px;padding:1px 6px;}
  #qn-overlay .bars{margin-top:2px;gap:1px;}
  #qn-overlay .bar-row{gap:4px;font-size:9px;}
  #qn-overlay .bar-row .lab{width:24px;font-size:9px;}
  #qn-overlay .bar{height:9px;}
  #qn-overlay .bar span{font-size:7px;}
  #qn-overlay .bar-row .val{width:42px;font-size:9px;}
  #qn-overlay .attack-row{gap:6px;margin-top:2px;font-size:9px;}
  #qn-overlay .map-head{padding:3px 8px;font-size:11px;gap:4px;}
  #qn-overlay .map-head .coord{font-size:10px;}
  #qn-overlay .map-foot{padding:2px 8px;font-size:10px;}
  #qn-overlay #qn-near{gap:2px;margin-top:2px;}
  #qn-overlay #qn-near .nr{font-size:10px;margin-right:4px;}
  #qn-overlay #qn-near button{font-size:10px;padding:1px 5px;}
  #qn-overlay #qn-log{font-size:10px;max-height:52px;}
  #qn-overlay .map-desc{font-size:10px;}
  #qn-overlay #btns{padding:4px;gap:3px;}
  #qn-overlay #btns button{height:38px;font-size:13px;}
  #qn-overlay #move{padding:3px 4px 6px;gap:3px;}
  #qn-overlay #move button{height:30px;font-size:11px;}
  #qn-overlay .grid-wrap{padding:4px;}
}

/* ===== 千年中间信息视图（NPC 对话 / 打坐 / 系统信息，嵌入地图区，空闲自动回地图） ===== */
#qn-overlay #qn-center-info{position:absolute;inset:0;z-index:25;background:rgba(10,16,11,.94);display:none;flex-direction:column;padding:8px 10px;box-sizing:border-box;}
#qn-overlay #qn-center-info .ci-head{font-size:13px;color:#ffd700;text-align:center;margin-bottom:6px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #3a5a3a;padding-bottom:4px;}
#qn-overlay #qn-center-info .ci-head .ci-x{cursor:pointer;color:#ff8a7a;font-weight:bold;padding:0 4px;}
#qn-overlay #qn-center-info .ci-body{flex:1;overflow-y:auto;font-size:12px;color:#cfe0c8;line-height:1.7;}
#qn-overlay #qn-center-info .ci-line{padding:2px 0;border-bottom:1px dashed #243a24;}
#qn-overlay #qn-center-info .ci-line.log-ok{color:#9fe8a5;}
#qn-overlay #qn-center-info .ci-line.log-err{color:#ff8a7a;}
#qn-overlay #qn-center-info .ci-line.log-warn{color:#ffd75a;}
@media (max-width:560px){
  #qn-overlay #qn-center-info{padding:6px 8px;}
  #qn-overlay #qn-center-info .ci-body{font-size:11px;}
  #qn-overlay #qn-center-info .ci-head{font-size:12px;}
}
