*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#101722;font-family:system-ui,sans-serif}body{position:fixed;inset:0}#stage{position:fixed;inset:0;width:100%;height:100%;touch-action:none;box-shadow:none}#stage canvas{display:block;width:100%!important;height:100%!important;touch-action:none}#loading,#toast{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);max-width:85vw;padding:18px 24px;border-radius:12px;color:white;background:#172333ed;text-align:center;z-index:5}#toast{top:22%;pointer-events:none}footer{position:fixed;bottom:8px;left:0;right:0;color:#b5c0cfcc;font-size:12px;text-align:center;pointer-events:none;z-index:4}@media(max-width:600px){footer{display:none}}
.mp-root{position:fixed;inset:0;pointer-events:none;z-index:6;font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif}
.mp-root button,.mp-root input,.mp-card,.mp-modal{pointer-events:auto}
.mp-entry{position:fixed;left:12px;top:max(96px,14vh);padding:10px 18px;border:3px solid #2b3a57;border-radius:999px;background:linear-gradient(#7fd4ff,#2f86e0);color:#fff;font-size:16px;font-weight:900;letter-spacing:1px;box-shadow:0 5px 0 #1f5fa8;text-shadow:0 2px 0 #2b3a57;cursor:pointer}
.mp-entry:active{transform:translateY(3px);box-shadow:0 2px 0 #1f5fa8}
.mp-entry[hidden]{display:none}
.mp-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(40,110,180,.4)}
.mp-modal[hidden]{display:none}
.mp-card{width:min(360px,100%);max-height:92vh;overflow:auto;padding:22px 20px;border-radius:26px;background:linear-gradient(#ffffff,#eef5fb);color:#2b3a57;border:4px solid #2b3a57;box-shadow:0 8px 0 #b9c9d8;text-align:center}
.mp-card h2{margin:0 0 6px;font-size:24px;font-weight:900;color:#ffb21f;-webkit-text-stroke:1.5px #2b3a57;text-shadow:0 3px 0 #2b3a57}
.mp-sub{margin:4px 0 14px;color:#4b6a8a;font-size:13px;font-weight:600}
.mp-field{display:flex;align-items:center;gap:10px;margin:10px 0 14px;text-align:left}
.mp-field span{flex:none;color:#4b6a8a;font-size:14px;font-weight:700}
.mp-card input{flex:1;min-width:0;padding:10px 12px;border-radius:14px;border:3px solid #2b3a57;background:#fff;color:#2b3a57;font-size:16px;font-weight:700;outline:none}
.mp-card input:focus{border-color:#2f86e0}
.mp-btn{display:block;width:100%;margin:10px 0;padding:11px 14px;border:3px solid #2b3a57;border-radius:999px;background:linear-gradient(#7fd4ff,#2f86e0);color:#fff;font-size:17px;font-weight:900;box-shadow:0 5px 0 #1f5fa8;text-shadow:0 2px 0 rgba(43,58,87,.6);cursor:pointer}
.mp-btn:active{transform:translateY(3px);box-shadow:0 2px 0 #1f5fa8}
.mp-btn:disabled{opacity:.55;cursor:default;transform:none}
.mp-primary{background:linear-gradient(#ffe46b,#ffae1f);color:#5a2c00;box-shadow:0 5px 0 #c96f00;text-shadow:none}
.mp-primary:active{box-shadow:0 2px 0 #c96f00}
.mp-ghost{background:transparent;border-color:transparent;box-shadow:none;color:#4b6a8a;text-shadow:none}
.mp-small{display:inline-block;width:auto;padding:6px 14px;font-size:13px}
.mp-row{display:flex;gap:8px;align-items:center}
.mp-row .mp-btn{width:auto;margin:0;flex:none}
.mp-or{margin:14px 0 8px;color:#7a8aa0;font-size:12px;font-weight:700}
.mp-error{min-height:18px;margin:8px 0 0;color:#e03131;font-size:13px;font-weight:700}
.mp-room-code{font-size:44px;font-weight:900;letter-spacing:10px;color:#2b3a57;margin:4px 0}
.mp-list,.mp-result{list-style:none;margin:14px 0;padding:0;text-align:left}
.mp-list li,.mp-result li{display:flex;align-items:center;gap:10px;padding:9px 12px;margin:8px 0;border-radius:16px;background:#f2f7fc;border:3px solid #c3d3e2;font-weight:700}
.mp-list li span,.mp-result li span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-list em,.mp-result em{font-style:normal;font-size:12px;color:#c26a00;font-weight:800}
.mp-empty{color:#9fb3c6;justify-content:center;border-style:dashed!important}
.mp-result b{width:26px;text-align:center}
.mp-dot{flex:none;width:14px;height:14px;border-radius:50%;border:2px solid #2b3a57}
.mp-board{position:fixed;right:10px;top:max(84px,12vh);min-width:150px;max-width:46vw;padding:8px 10px;border-radius:16px;background:#fff;border:3px solid #2b3a57;box-shadow:0 4px 0 #b9c9d8;color:#2b3a57;font-size:13px;font-weight:700}
.mp-board[hidden]{display:none}
.mp-board-title{color:#c26a00;font-size:12px;margin-bottom:4px;font-weight:900}
.mp-board-row{display:flex;align-items:center;gap:6px;padding:2px 0}
.mp-board-row span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-board-row em{font-style:normal;color:#2f86e0;font-weight:900}
.mp-out{opacity:.45;text-decoration:line-through}
.mp-labels{position:fixed;inset:0;overflow:hidden}
.mp-label{position:absolute;left:0;top:0;padding:2px 10px;border-radius:10px;border:3px solid #2b3a57;background:#fff;color:#2b3a57;font-size:12px;font-weight:900;white-space:nowrap}
.mp-label[hidden]{display:none}
.mp-countdown{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);font-size:110px;font-weight:900;color:#ffd43b;-webkit-text-stroke:5px #2b3a57;text-shadow:0 8px 0 #2b3a57}
.mp-countdown[hidden]{display:none}

/* ---- 联机弹窗适配矮屏（16:9 手机 / 微信内置浏览器） ---- */
/* 1. 用真实可视高度（dvh）限制弹窗，老浏览器退回 vh；
   2. 卡片 margin:auto 居中——内容比屏幕高时从顶部开始、可整页滚动，不会上下都被裁掉 */
.mp-modal{align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(10px,env(safe-area-inset-top)) 12px max(10px,env(safe-area-inset-bottom))}
.mp-card{margin:auto;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px)}
/* 矮屏：收紧间距和字号 */
@media (max-height:740px){
  .mp-card{padding:14px 16px;border-radius:22px;box-shadow:0 6px 0 #b9c9d8}
  .mp-card h2{font-size:21px;margin-bottom:2px}
  .mp-sub{margin:2px 0 8px;font-size:12px}
  .mp-field{margin:6px 0 8px}
  .mp-card input{padding:8px 10px;font-size:15px;border-radius:12px}
  .mp-btn{margin:7px 0;padding:8px 12px;font-size:16px;box-shadow:0 4px 0 #1f5fa8}
  .mp-primary{box-shadow:0 4px 0 #c96f00}
  .mp-ghost{box-shadow:none}
  .mp-small{padding:5px 12px;font-size:13px}
  .mp-or{margin:8px 0 4px}
  .mp-error{min-height:14px;margin:4px 0 0}
  .mp-room-code{font-size:34px;letter-spacing:8px;margin:0}
  .mp-list,.mp-result{margin:8px 0}
  .mp-list li,.mp-result li{padding:6px 10px;margin:5px 0;border-radius:13px}
}
@media (max-height:560px){
  .mp-card{padding:10px 14px}
  .mp-card h2{font-size:18px}
  .mp-sub{font-size:11px;margin:0 0 6px}
  .mp-btn{margin:5px 0;padding:7px 10px;font-size:15px}
  .mp-room-code{font-size:28px;letter-spacing:6px}
  .mp-list li,.mp-result li{padding:5px 10px;margin:4px 0}
  .mp-countdown{font-size:80px}
}

/* ---- 账号弹窗（web/account.js，复用 mp-* 样式） ---- */
.mp-field span{min-width:3.4em;text-align:left}
.acct-name{font-size:30px;letter-spacing:1px;word-break:break-all}

/* ---- 只用白色主题：禁止浏览器/系统深色模式自动反色 ---- */
:root{color-scheme:light only}
html,body{background:#bfe3ff}
#loading,#toast{background:#ffffff;color:#2b3a57;border:3px solid #2b3a57;box-shadow:0 5px 0 #b9c9d8;font-weight:800}
.mp-card{background:linear-gradient(#ffffff,#eef5fb)!important;color:#2b3a57!important}
.mp-card input{background:#ffffff!important;color:#2b3a57!important;-webkit-text-fill-color:#2b3a57;caret-color:#2f86e0}
.mp-card input::placeholder{color:#9fb3c6;-webkit-text-fill-color:#9fb3c6;opacity:1}
.mp-card input:-webkit-autofill{-webkit-box-shadow:0 0 0 40px #ffffff inset;-webkit-text-fill-color:#2b3a57}
.mp-list li,.mp-result li{background:#f2f7fc;color:#2b3a57}
.mp-board,.mp-label{background:#ffffff;color:#2b3a57}

/* ---- 账号弹窗 SVG 图标 ---- */
.acct-label{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.acct-ico{width:22px;height:22px;flex:none}
.acct-face{display:block;width:78px;height:auto;margin:6px auto 2px}
@media (max-height:560px){.acct-face{width:56px}}

/* ---- 每日签到面板（web/checkin.js） ---- */
.ci-card{width:min(380px,100%)}
.ci-head{display:flex;align-items:center;justify-content:center;gap:8px}
.ci-head h2{margin:0}
.ci-icon{width:40px;height:40px}
.ci-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0 6px}
.ci-day{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 6px;border:3px solid #c3d3e2;border-radius:14px;background:#f2f7fc;color:#4b6a8a;font-size:12px;font-weight:800}
.ci-day b{font-size:12px;color:#2b3a57}
.ci-day span{line-height:1.2;text-align:center}
.ci-pic{height:34px;display:flex;align-items:center;justify-content:center;gap:4px}
.ci-pic img{height:28px;width:auto}
.ci-pic .ci-shoe{height:34px}
.ci-big{grid-column:span 2;background:linear-gradient(#fff6d6,#ffe9a8);border-color:#e3a21a}
.ci-today{border-color:#ffae1f;background:#fff3cc;box-shadow:0 0 0 3px #ffe46b;animation:ci-pulse 1.2s ease-in-out infinite}
@keyframes ci-pulse{50%{transform:scale(1.05)}}
@media (prefers-reduced-motion:reduce){.ci-today{animation:none}}
.ci-claimed{opacity:.55}
.ci-check{position:absolute;right:5px;top:1px;font-style:normal;font-size:18px;font-weight:900;color:#37b24d}
.ci-got{margin:6px 0 0;color:#2f9e44;font-weight:900}
@media (max-height:560px){.ci-grid{gap:6px;margin:6px 0 4px}.ci-day{padding:5px 3px 4px}.ci-pic{height:26px}.ci-pic img{height:22px}.ci-pic .ci-shoe{height:26px}.ci-icon{width:30px;height:30px}}

/* ---- 双人对战道具栏（右侧） ---- */
.mp-items{position:fixed;right:8px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:7}
.mp-items[hidden]{display:none}
.mp-item{width:72px;padding:6px 4px 5px;border:3px solid #2b3a57;border-radius:16px;background:linear-gradient(#ffffff,#e6f1fb);color:#2b3a57;box-shadow:0 4px 0 #b9c9d8;display:flex;flex-direction:column;align-items:center;gap:1px;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.mp-item:active{transform:translateY(3px);box-shadow:0 1px 0 #b9c9d8}
.mp-item img{width:40px;height:40px;object-fit:contain}
.mp-item b{font-size:12px;font-weight:900;white-space:nowrap}
.mp-item-price{font-size:11px;font-weight:800;color:#c26a00}
.mp-item-poor{opacity:.45;filter:grayscale(.7)}
@media (max-height:560px){.mp-item{width:62px}.mp-item img{width:32px;height:32px}}

/* ---- 房间：胜利距离设置 ---- */
.mp-goal{margin:8px 0 4px;padding:8px 10px;border:3px solid #ffd43b;border-radius:16px;background:#fffbe6}
.mp-goal-title{font-size:13px;font-weight:900;color:#c26a00;margin-bottom:6px}
.mp-goal-row{display:flex;gap:6px;justify-content:center;margin:4px 0}
.mp-goal-btn{flex:1;min-width:0;padding:6px 4px;border:3px solid #2b3a57;border-radius:12px;background:#ffffff;color:#2b3a57;font-size:14px;font-weight:900;cursor:pointer}
.mp-goal-on{background:linear-gradient(#ffe46b,#ffae1f);color:#5a2c00}
.mp-card input.mp-goal-input{flex:2;padding:6px 8px;font-size:14px}
.mp-goal-show{margin:8px 0;font-size:15px;font-weight:900;color:#c26a00}