/* ===========================================================
   吉娃娃开炮 · 僵尸狗围城  —  UI 样式
   逻辑分辨率 240x420，--u = 1 个逻辑像素对应的实际 px
   =========================================================== */

:root{
  --ink:#e8eef5;
  --ink-dim:#9aa7b8;
  --panel:#141a24;
  --panel2:#1d2530;
  --line:#2c3644;
  --red:#ff4d5e;
  --green:#5ce07a;
  --blue:#5aa9ff;
  --purple:#c07bff;
  --gold:#ffb347;
  --goo:#8fd94b;
}

*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
[hidden]{ display:none !important; }

html,body{
  margin:0; padding:0; height:100%; overflow:hidden;
  background:#05070b;
  color:var(--ink);
  font-family:"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  user-select:none;
  -webkit-user-select:none;
  touch-action:none;
}

#app{
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 50% 0%, #16202c 0%, #05070b 70%);
}

#frame{
  --u:2px;
  position:relative;
  /* 尺寸由 JS 按视口等比算出（保证 240:420 永不变形），这里是初始兜底值 */
  width:240px;
  height:420px;
  max-width:100%;
  max-height:100%;
  overflow:hidden;
  background:#0e1218;
  box-shadow:0 0 0 calc(var(--u)*1) #232c38, 0 0 calc(var(--u)*14) rgba(0,0,0,.85);
  font-size:calc(var(--u)*6.6);
  line-height:1.25;
}

#cv{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
  image-rendering:pixelated;
  image-rendering:-moz-crisp-edges;
  image-rendering:crisp-edges;
  background:#0e1218;
}

/* ===================== HUD ===================== */
#hud{
  position:absolute; inset:0;
  pointer-events:none;
  display:flex; flex-direction:column;
}
.top{
  padding:calc(var(--u)*3) calc(var(--u)*4) 0;
  display:flex; flex-direction:column; gap:calc(var(--u)*2);
}
.chips{ display:flex; gap:calc(var(--u)*2); align-items:center; flex-wrap:wrap; }
.chip{
  display:inline-flex; align-items:center; gap:calc(var(--u)*1.5);
  padding:calc(var(--u)*1.2) calc(var(--u)*3);
  background:rgba(8,12,18,.72);
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  font-size:calc(var(--u)*6); font-weight:700;
  letter-spacing:.02em;
  text-shadow:0 calc(var(--u)*1) 0 rgba(0,0,0,.7);
}
.chip b{ font-weight:800; }
.chip .ico{ font-size:calc(var(--u)*6); }
.chip i{ font-style:normal; font-weight:800; }
.chip.gold i{ color:var(--gold); }
.chip.food i{ color:var(--goo); }
.chip.idle{
  background:rgba(92,224,122,.16);
  border-color:var(--green);
  color:var(--green);
  animation:pulse 1.6s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.42} }

.bar{
  position:relative;
  height:calc(var(--u)*8);
  background:rgba(4,7,11,.82);
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  overflow:hidden;
  box-shadow:inset 0 0 0 calc(var(--u)*1) rgba(0,0,0,.5);
}
.bar>i{
  position:absolute; left:0; top:0; bottom:0; width:100%;
  transform-origin:left center;
  transition:width .12s linear;
  background:var(--green);
}
.bar>span{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:calc(var(--u)*5.4); font-weight:800;
  letter-spacing:.03em;
  text-shadow:0 0 calc(var(--u)*2) #000, 0 0 calc(var(--u)*3) #000;
}
.bar.hp>i{ background:linear-gradient(90deg,#ff5a6a,#ff8a6a); }
.bar.xp{ height:calc(var(--u)*5.4); }
.bar.xp>i{ background:linear-gradient(90deg,#5aa9ff,#8fd9ff); }
.bar.foe{
  height:calc(var(--u)*7);
  border-color:#5a2a2f;
}
.bar.foe>i{ background:linear-gradient(90deg,#7a1f2b,#c02a3a); }
.bar.foe>span{ color:#ffc9cf; }
.bar.wave{ height:calc(var(--u)*3.2); border:none; background:rgba(4,7,11,.6); }
.bar.wave>i{ background:linear-gradient(90deg,#ffb347,#ffe08a); }

/* Boss 血条 */
.boss{
  margin:calc(var(--u)*3) calc(var(--u)*4) 0;
  padding:calc(var(--u)*2);
  background:rgba(12,6,10,.86);
  border:calc(var(--u)*1) solid #6d2b36;
  border-radius:calc(var(--u)*2);
  box-shadow:0 calc(var(--u)*2) calc(var(--u)*6) rgba(0,0,0,.6);
}
.boss .bname{
  font-size:calc(var(--u)*6.4); font-weight:900; color:#ffb0b8;
  text-align:center; letter-spacing:.06em;
  margin-bottom:calc(var(--u)*1.5);
  text-shadow:0 0 calc(var(--u)*4) rgba(255,60,80,.55);
}
.bar.bosshp{ height:calc(var(--u)*8); border-color:#8a3241; }
.bar.bosshp>i{ background:linear-gradient(90deg,#ff2d4a,#ff7a4d); }

.toast{
  margin:calc(var(--u)*3) auto 0;
  padding:calc(var(--u)*2) calc(var(--u)*4);
  background:rgba(10,14,20,.86);
  border:calc(var(--u)*1) solid var(--gold);
  border-radius:calc(var(--u)*2);
  font-size:calc(var(--u)*6); font-weight:800;
  color:#ffe6b0;
  opacity:0; transform:translateY(calc(var(--u)*-3));
  transition:opacity .22s, transform .22s;
  max-width:90%; text-align:center;
}
.toast.on{ opacity:1; transform:translateY(0); }

/* ===================== 底部操作 ===================== */
.pad{
  position:absolute; left:0; right:0; bottom:0;
  padding:calc(var(--u)*4) calc(var(--u)*4) calc(var(--u)*6);
  display:flex; align-items:flex-end; justify-content:space-between; gap:calc(var(--u)*3);
  background:linear-gradient(180deg, rgba(5,7,11,0) 0%, rgba(5,7,11,.82) 55%, rgba(5,7,11,.96) 100%);
}
.pad button{
  font-family:inherit; cursor:pointer; border:none;
  background:transparent; color:var(--ink);
}
.pill{
  flex:0 0 auto;
  min-width:calc(var(--u)*30);
  padding:calc(var(--u)*3) calc(var(--u)*3);
  background:linear-gradient(180deg,#243040,#182130)!important;
  border:calc(var(--u)*1) solid #3a4a5e!important;
  border-radius:calc(var(--u)*2);
  font-size:calc(var(--u)*6.2); font-weight:800;
  box-shadow:0 calc(var(--u)*2) 0 #0d131b;
  transition:transform .08s, filter .16s;
}
.pill.small{ min-width:calc(var(--u)*20); font-size:calc(var(--u)*6); }
.pill:active{ transform:translateY(calc(var(--u)*1.5)); box-shadow:none; }
.pill.on{
  background:linear-gradient(180deg,#2f6b3f,#1d4a2a)!important;
  border-color:var(--green)!important;
  color:#c9ffd8;
}

.ult{
  position:relative;
  flex:1 1 auto;
  min-width:calc(var(--u)*54);
  padding:calc(var(--u)*4) calc(var(--u)*2) calc(var(--u)*3);
  background:linear-gradient(180deg,#4a5a1f,#2c3a10)!important;
  border:calc(var(--u)*1) solid #8fc22a!important;
  border-radius:calc(var(--u)*3);
  box-shadow:0 calc(var(--u)*2) 0 #131a06, 0 0 calc(var(--u)*8) rgba(143,217,75,.28);
  display:flex; flex-direction:column; align-items:center; gap:calc(var(--u)*.5);
  transition:transform .08s, filter .16s;
}
.ult .em{ font-size:calc(var(--u)*11); line-height:1; }
.ult .lb{ font-size:calc(var(--u)*5.4); font-weight:800; color:#dfff9f; letter-spacing:.04em; }
.ult .cnt{
  position:absolute; top:calc(var(--u)*-2); right:calc(var(--u)*-2);
  min-width:calc(var(--u)*11); height:calc(var(--u)*11);
  display:flex; align-items:center; justify-content:center;
  background:#8fd94b; color:#101804;
  border:calc(var(--u)*1) solid #e9ffc4;
  border-radius:calc(var(--u)*6);
  font-size:calc(var(--u)*6.4); font-weight:900;
  box-shadow:0 calc(var(--u)*1.5) calc(var(--u)*3) rgba(0,0,0,.55);
}
.ult:active{ transform:translateY(calc(var(--u)*1.5)); box-shadow:none; }
.ult.empty{ filter:grayscale(.72) brightness(.72); }
.ult.ready{ animation:ultGlow 1.4s ease-in-out infinite; }
@keyframes ultGlow{
  0%,100%{ box-shadow:0 calc(var(--u)*2) 0 #131a06, 0 0 calc(var(--u)*6) rgba(143,217,75,.25); }
  50%{ box-shadow:0 calc(var(--u)*2) 0 #131a06, 0 0 calc(var(--u)*14) rgba(143,217,75,.85); }
}

/* ===================== BOSS 横幅 ===================== */
.banner{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:calc(var(--u)*2);
  background:radial-gradient(circle at 50% 50%, rgba(120,10,24,.5), rgba(5,7,11,.86));
  animation:bannerIn .5s ease-out;
  pointer-events:none;
}
@keyframes bannerIn{ from{opacity:0; transform:scale(1.14)} to{opacity:1; transform:scale(1)} }
.banner .bwarn{
  font-size:calc(var(--u)*7); font-weight:900; letter-spacing:.5em;
  color:#ff5c72; text-indent:.5em;
  animation:pulse .5s steps(2,end) infinite;
}
.banner .btitle{
  font-size:calc(var(--u)*15); font-weight:900; letter-spacing:.08em;
  color:#fff; text-align:center; padding:0 calc(var(--u)*4);
  text-shadow:0 0 calc(var(--u)*3) #ff2d4a, 0 0 calc(var(--u)*10) #ff2d4a;
}
.banner .bsub{
  font-size:calc(var(--u)*6.4); font-weight:800; color:#ffd0d6; letter-spacing:.3em;
}

/* ===================== 遮罩菜单 ===================== */
.ov{
  position:absolute; inset:0;
  background:rgba(4,6,10,.96);
  backdrop-filter:blur(calc(var(--u)*2));
  -webkit-backdrop-filter:blur(calc(var(--u)*2));
  overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  z-index:20;
  animation:fadeIn .16s ease-out;
}
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }
.ovbox{
  min-height:100%;
  padding:calc(var(--u)*8) calc(var(--u)*6);
  display:flex; flex-direction:column; justify-content:center;
  gap:calc(var(--u)*5);
}

.mtitle{ text-align:center; }
.mtitle h1{
  margin:0 0 calc(var(--u)*2);
  font-size:calc(var(--u)*17); font-weight:900; letter-spacing:.04em;
  color:#fff;
  text-shadow:0 calc(var(--u)*1) 0 #7a1f2b, 0 0 calc(var(--u)*9) rgba(255,90,110,.5);
}
.mtitle h2{
  margin:0 0 calc(var(--u)*3);
  font-size:calc(var(--u)*11); font-weight:900; letter-spacing:.04em;
  color:#fff; text-shadow:0 calc(var(--u)*1) 0 #2a3a4e;
}
.mtitle p{ margin:0; color:var(--ink-dim); font-size:calc(var(--u)*6.2); line-height:1.6; }
.mtitle .dogline{
  font-size:calc(var(--u)*10); letter-spacing:calc(var(--u)*1.5);
  color:var(--goo); margin:calc(var(--u)*2) 0;
  text-shadow:0 0 calc(var(--u)*6) rgba(143,217,75,.55);
}

.btnrow{ display:flex; flex-direction:column; gap:calc(var(--u)*4); }
.mbtn{
  width:100%; cursor:pointer; font-family:inherit;
  padding:calc(var(--u)*5) calc(var(--u)*4);
  background:linear-gradient(180deg,#26364a,#18212e);
  border:calc(var(--u)*1) solid #3d5169;
  border-radius:calc(var(--u)*2);
  color:var(--ink); font-size:calc(var(--u)*8); font-weight:900; letter-spacing:.05em;
  box-shadow:0 calc(var(--u)*2.5) 0 #0c1118;
  transition:transform .08s;
}
.mbtn:active{ transform:translateY(calc(var(--u)*2)); box-shadow:none; }
.mbtn.primary{
  background:linear-gradient(180deg,#8fd94b,#4f8a1d);
  border-color:#d6ff9a; color:#0d1405;
  box-shadow:0 calc(var(--u)*2.5) 0 #22330a, 0 0 calc(var(--u)*8) rgba(143,217,75,.4);
}
.mbtn.danger{
  background:linear-gradient(180deg,#ff5a6a,#a5202f);
  border-color:#ffb3bc; color:#fff;
}
.mbtn.ghost{
  background:linear-gradient(180deg,#1b2431,#121924);
  border-color:#2f3d4e; color:var(--ink-dim);
  font-size:calc(var(--u)*6.6);
}

/* -------- 肉鸽卡牌 -------- */
.cards{ display:flex; flex-direction:column; gap:calc(var(--u)*4); }
.card{
  position:relative; cursor:pointer;
  padding:calc(var(--u)*4) calc(var(--u)*4) calc(var(--u)*4) calc(var(--u)*5);
  background:linear-gradient(135deg,#1c2533,#131a24);
  border:calc(var(--u)*1) solid var(--line);
  border-left:calc(var(--u)*2.5) solid var(--line);
  border-radius:calc(var(--u)*2);
  box-shadow:0 calc(var(--u)*2) 0 rgba(0,0,0,.45);
  transition:transform .08s;
  animation:cardIn .22s ease-out backwards;
}
@keyframes cardIn{ from{opacity:0; transform:translateX(calc(var(--u)*6))} to{opacity:1;transform:none} }
.card:active{ transform:scale(.985); }
.card .ct{
  display:flex; align-items:center; gap:calc(var(--u)*2.5);
  font-size:calc(var(--u)*8.4); font-weight:900; margin-bottom:calc(var(--u)*1.5);
}
.card .ct .ci{ font-size:calc(var(--u)*11); line-height:1; }
.card .cd{ color:#c6d2e0; font-size:calc(var(--u)*6.2); line-height:1.5; }
.card .tag{
  display:inline-block; margin-top:calc(var(--u)*2);
  padding:calc(var(--u)*.8) calc(var(--u)*2.6);
  border-radius:calc(var(--u)*4);
  font-size:calc(var(--u)*5.2); font-weight:800;
  background:rgba(255,255,255,.08); color:var(--ink-dim);
}
.card.t1{ border-left-color:#cfd6dd; } .card.t1 .ct{ color:#e6ecf3; }
.card.t2{ border-left-color:var(--blue); } .card.t2 .ct{ color:#9dcbff; }
.card.t3{ border-left-color:var(--purple); } .card.t3 .ct{ color:#dcb4ff; }
.card.t4{
  border-left-color:var(--gold);
  background:linear-gradient(135deg,#33260f,#1b1710);
  box-shadow:0 0 calc(var(--u)*9) rgba(255,179,71,.35), 0 calc(var(--u)*2) 0 rgba(0,0,0,.45);
}
.card.t4 .ct{ color:#ffd694; }

/* -------- 战利品 / 结算 -------- */
.loot{ display:flex; flex-direction:column; gap:calc(var(--u)*2.5); }
.lrow{
  display:flex; justify-content:space-between; align-items:center; gap:calc(var(--u)*3);
  padding:calc(var(--u)*3) calc(var(--u)*3.5);
  background:rgba(20,26,36,.85);
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  font-size:calc(var(--u)*6.4);
}
.lrow .lv{ color:var(--ink-dim); font-weight:700; }
.lrow .rv{ font-weight:900; color:var(--gold); }
.lrow.item{ border-color:#4a3a1a; }

.stats{
  display:grid; grid-template-columns:1fr 1fr; gap:calc(var(--u)*2) calc(var(--u)*3);
}
.st{
  display:flex; justify-content:space-between; gap:calc(var(--u)*2);
  padding:calc(var(--u)*2) calc(var(--u)*2.6);
  background:rgba(20,26,36,.7);
  border:calc(var(--u)*1) solid #232e3c;
  border-radius:calc(var(--u)*1.5);
  font-size:calc(var(--u)*5.8);
}
.st b{ font-weight:900; color:#fff; }
.st span{ color:var(--ink-dim); }

/* -------- 装备面板 -------- */
.eqgrid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:calc(var(--u)*2.5);
}
.slot{
  cursor:pointer;
  padding:calc(var(--u)*2.5) calc(var(--u)*1.5);
  background:rgba(18,24,33,.8);
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  text-align:center;
  min-height:calc(var(--u)*40);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:calc(var(--u)*1);
}
.slot .sn{ font-size:calc(var(--u)*5.2); color:var(--ink-dim); font-weight:700; }
.slot .si{ font-size:calc(var(--u)*10); line-height:1; }
.slot .sp{ font-size:calc(var(--u)*5.8); font-weight:900; }
.slot.filled{ border-width:calc(var(--u)*1.5); background:rgba(26,34,46,.92); }

.inv{ display:flex; flex-direction:column; gap:calc(var(--u)*2); }
.irow{
  display:flex; align-items:center; gap:calc(var(--u)*2.5);
  padding:calc(var(--u)*2.5) calc(var(--u)*3);
  background:rgba(18,24,33,.85);
  border:calc(var(--u)*1) solid var(--line);
  border-left-width:calc(var(--u)*2);
  border-radius:calc(var(--u)*1.5);
  cursor:pointer;
}
.irow .inm{ flex:1 1 auto; min-width:0; }
.irow .inm .n1{ font-size:calc(var(--u)*6.2); font-weight:900; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.irow .inm .n2{ font-size:calc(var(--u)*5); color:var(--ink-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.irow .ipw{ font-size:calc(var(--u)*6); font-weight:900; color:var(--gold); text-align:right; }
.irow.on{ background:rgba(40,56,32,.75); border-color:var(--green); }
.empty-note{
  padding:calc(var(--u)*6) calc(var(--u)*3);
  text-align:center; color:var(--ink-dim); font-size:calc(var(--u)*6);
}

.sectitle{
  display:flex; align-items:center; gap:calc(var(--u)*2);
  font-size:calc(var(--u)*6.6); font-weight:900; color:#dbe5f0;
  margin:calc(var(--u)*1) 0 calc(var(--u)*-1.5);
}
.sectitle::after{
  content:''; flex:1 1 auto; height:calc(var(--u)*1);
  background:linear-gradient(90deg,#2c3644,transparent);
}

.hintline{ text-align:center; color:var(--ink-dim); font-size:calc(var(--u)*5.4); line-height:1.7; }
.kbd{
  display:inline-block; padding:0 calc(var(--u)*1.5);
  background:#232e3c; border-radius:calc(var(--u)*1);
  color:#dbe5f0; font-weight:800;
}

/* 小屏微调：避免底部按钮过分拥挤 */
@media (max-height:560px){
  .ult .em{ font-size:calc(var(--u)*9); }
}

/* ===================== 挂机场景面板 ===================== */
.idlepanel{
  display:flex; flex-direction:column; gap:calc(var(--u)*1.8);
  padding:calc(var(--u)*3) calc(var(--u)*3.5);
  background:rgba(12,26,10,.84);
  border:calc(var(--u)*1) solid #3f7a2c;
  border-radius:calc(var(--u)*2);
  box-shadow:0 calc(var(--u)*2) calc(var(--u)*7) rgba(0,0,0,.5);
}
.idlepanel .ih{
  font-size:calc(var(--u)*6.6); font-weight:900; color:#c9ff8f; letter-spacing:.06em;
  text-shadow:0 0 calc(var(--u)*4) rgba(143,217,75,.45);
}
.idlepanel .ir{
  display:flex; justify-content:space-between; align-items:center; gap:calc(var(--u)*2);
  font-size:calc(var(--u)*5.8);
}
.idlepanel .ir span{ color:#a9c79a; font-weight:700; }
.idlepanel .ir b{ color:#fff; font-weight:900; }
.idlepanel .inote{
  font-size:calc(var(--u)*5.2); color:#9db98f; line-height:1.5;
}
.bar.kib{ height:calc(var(--u)*4.4); border-color:#4c7a2a; }
.bar.kib>i{ background:linear-gradient(90deg,#8fd94b,#d6ff9a); }

/* ===================== 登录界面 ===================== */
.login{
  position:absolute; inset:0; z-index:40;
  background:linear-gradient(180deg,#0c1723 0%,#070a10 60%,#05070b 100%);
  overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  animation:fadeIn .22s ease-out;
}
.login .lbox{
  min-height:100%;
  padding:calc(var(--u)*10) calc(var(--u)*6);
  display:flex; flex-direction:column; justify-content:center;
  gap:calc(var(--u)*5);
}
.ltitle{ text-align:center; }
.ltitle .lpaw{ font-size:calc(var(--u)*22); line-height:1; margin-bottom:calc(var(--u)*1.5); }
.ltitle h1{
  margin:0 0 calc(var(--u)*2);
  font-size:calc(var(--u)*15); font-weight:900; letter-spacing:.05em; color:#fff;
  text-shadow:0 calc(var(--u)*1) 0 #7a1f2b, 0 0 calc(var(--u)*9) rgba(255,90,110,.45);
}
.ltitle p{ margin:0; color:var(--ink-dim); font-size:calc(var(--u)*5.8); }

.acclist{ display:flex; flex-direction:column; gap:calc(var(--u)*3); }
.acc{
  display:flex; align-items:center; gap:calc(var(--u)*3);
  padding:calc(var(--u)*3.4) calc(var(--u)*3.4);
  background:linear-gradient(135deg,#1b2634,#131a24);
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  cursor:pointer; text-align:left; width:100%;
  font-family:inherit; color:var(--ink);
  box-shadow:0 calc(var(--u)*2) 0 rgba(0,0,0,.45);
  transition:transform .08s;
}
.acc:active{ transform:scale(.985); }
.acc.cur{ border-color:var(--green); box-shadow:0 0 calc(var(--u)*7) rgba(92,224,122,.28); }
.acc .ava{ font-size:calc(var(--u)*11); line-height:1; }
.acc .am{ flex:1 1 auto; min-width:0; }
.acc .an{ font-size:calc(var(--u)*7); font-weight:900; color:#fff; }
.acc .as{ font-size:calc(var(--u)*5); color:var(--ink-dim); }
.acc .al{ font-size:calc(var(--u)*5.2); color:var(--gold); font-weight:800; }
.acc .lock{ font-size:calc(var(--u)*7.5); opacity:.65; }
.acc-del{
  flex:0 0 auto; cursor:pointer; background:transparent; border:none;
  color:#6c7789; font-size:calc(var(--u)*9); padding:0 calc(var(--u)*1);
  font-family:inherit; line-height:1;
}
.acc-del:hover{ color:var(--red); }

.lform{ display:flex; flex-direction:column; gap:calc(var(--u)*2.6); }
.lform label{ font-size:calc(var(--u)*5.6); color:var(--ink-dim); font-weight:700; }
.lform input{
  width:100%; font-family:inherit;
  padding:calc(var(--u)*3.4) calc(var(--u)*3.4);
  background:#0e141d; color:#fff;
  border:calc(var(--u)*1) solid var(--line);
  border-radius:calc(var(--u)*2);
  font-size:calc(var(--u)*7); font-weight:800;
  outline:none;
}
.lform input:focus{ border-color:var(--blue); }
.lform .ferr{ color:var(--red); font-size:calc(var(--u)*5.4); font-weight:700; min-height:calc(var(--u)*6); }
.lbtns{ display:flex; flex-direction:column; gap:calc(var(--u)*3); }
.lrow2{ display:flex; gap:calc(var(--u)*2.5); }
.lrow2 .mbtn{ flex:1 1 0; }

/* 通关 / 死亡界面上的小狗插画行 */
.dogline2{
  font-size:calc(var(--u)*7.5); letter-spacing:calc(var(--u)*.8);
  color:#ffd166; margin:calc(var(--u)*2) 0;
  text-shadow:0 0 calc(var(--u)*6) rgba(255,179,71,.5);
}