/* ── 全域像素中文字型：Fusion Pixel 12px（繽紛像素體，SIL OFL 授權） ──
   消除預設字體的抽離感；12 的倍數字級渲染最銳利 */
@font-face{
  font-family:'FusionPixel';
  font-style:normal;font-weight:400;font-display:swap;
  src:url('../assets/fonts/fusion-pixel-tc.woff2') format('woff2');
}
/* ───────────────────────────────────────
   base.css — 版面、HUD、共用標籤
─────────────────────────────────────── */
*{margin:0;padding:0;box-sizing:border-box}
body{background:#0a0a0a;display:flex;justify-content:center;align-items:center;height:100vh;overflow:hidden}

/* ── 游標：永久顯示，圓潤可愛風（圓頭、飽滿、暖黃 + 桃粉高光） ─
   不用方塊堆疊，改用 SVG path 多邊形：頭部斜邊削兩個段差顯圓潤    */
body, #wrap, canvas, #ui{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 16 16' shape-rendering='geometricPrecision'><path d='M2 2 Q2 1 3 1.5 L11 7.5 Q12 8 11 8.5 L7.5 8.5 L9.5 12 Q10 13 9 13.5 L7.5 14 Q6.5 14.3 6 13.3 L4 9.5 L2.5 11 Q1.5 11.7 1.5 10.5 L1.5 2.5 Q1.5 2 2 2 Z' fill='%23ffd058' stroke='%23222' stroke-width='1' stroke-linejoin='round'/><path d='M2.8 2.8 L2.8 5.5' stroke='%23ffefb0' stroke-width='1' stroke-linecap='round'/><ellipse cx='3.5' cy='3.8' rx='0.6' ry='1' fill='%23ffd6e0' opacity='0.7'/></svg>") 2 2, default;
}
.cursor-pointer,
button, .ec-hint, .fc-hint, .mc-hint,
#ev2-popup .p-btn,
[role="button"]{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 16 16' shape-rendering='geometricPrecision'><path d='M2 2 Q2 1 3 1.5 L11 7.5 Q12 8 11 8.5 L7.5 8.5 L9.5 12 Q10 13 9 13.5 L7.5 14 Q6.5 14.3 6 13.3 L4 9.5 L2.5 11 Q1.5 11.7 1.5 10.5 L1.5 2.5 Q1.5 2 2 2 Z' fill='%23ffe88a' stroke='%23222' stroke-width='1' stroke-linejoin='round'/><path d='M2.8 2.8 L2.8 5.5' stroke='%23ffffff' stroke-width='1' stroke-linecap='round'/><ellipse cx='3.5' cy='3.8' rx='0.6' ry='1' fill='%23ffd6e0' opacity='0.8'/></svg>") 2 2, pointer;
}
.cursor-grab{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 16 16' shape-rendering='geometricPrecision'><rect x='3' y='6' width='9' height='7' rx='2.5' fill='%23ffd058' stroke='%23222' stroke-width='1' stroke-linejoin='round'/><rect x='4' y='3' width='1.5' height='5' rx='0.75' fill='%23ffd058' stroke='%23222' stroke-width='1'/><rect x='6' y='2' width='1.5' height='6' rx='0.75' fill='%23ffd058' stroke='%23222' stroke-width='1'/><rect x='8' y='2.5' width='1.5' height='5.5' rx='0.75' fill='%23ffd058' stroke='%23222' stroke-width='1'/><rect x='10' y='3.5' width='1.5' height='4.5' rx='0.75' fill='%23ffd058' stroke='%23222' stroke-width='1'/><ellipse cx='5' cy='8.5' rx='1' ry='0.6' fill='%23ffe890' opacity='0.7'/></svg>") 8 8, grab;
}
#wrap{position:relative;width:480px;height:270px}
canvas{position:absolute;top:0;left:0;display:block;image-rendering:pixelated;image-rendering:crisp-edges;width:100%;height:100%}
/* 素材檢視器內的 canvas/img 不繼承全域定位樣式 */
#asset-viewer canvas, #asset-viewer img{
  position:static !important; top:auto !important; left:auto !important;
  width:auto; height:auto;
  image-rendering:pixelated; image-rendering:crisp-edges;
}
#c2{pointer-events:none}
/* 場景內清晰文字層：夾在背景 canvas 與角色 canvas 之間 → 文字清楚且永遠在角色後方 */
#scene-labels{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;font-family:'FusionPixel','Microsoft JhengHei',sans-serif}
#scene-labels .sl{position:absolute;transform:translate(-50%,-50%);white-space:nowrap}
.sl-title2{font-size:12px;letter-spacing:5px;color:#f2e6c4;font-weight:bold}
.sl-en{font-size:5.5px;letter-spacing:2px;color:#9fb2cc;font-family:monospace}
.sl-cap{font-size:6.5px;color:#22304a;font-weight:bold;letter-spacing:1px}
.sl-desk{font-size:7px;color:#e8d8a8;font-weight:bold;letter-spacing:2px}
.sl-shop{font-size:7.5px;color:#fff;font-weight:bold;letter-spacing:1px;text-shadow:0 1px 2px rgba(0,0,0,.85)}
#ui{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;
    font-family:'FusionPixel','Microsoft JhengHei','PingFang TC','Heiti TC',sans-serif}

/* HUD */
#hud{position:absolute;top:0;left:0;width:100%;height:16px;background:rgba(0,0,0,0.82);
     display:flex;align-items:center;padding:0 8px;gap:10px;font-size:9.5px;color:#e0c878;
     white-space:nowrap;border-bottom:1px solid #3a2e10}
#hud b{color:#ffe040;text-shadow:0 0 4px rgba(255,220,0,.4)}

/* 互動提示泡泡 */
.bbl{position:absolute;transform:translate(-50%,-100%);background:rgba(0,0,0,0.92);border:1px solid;
     padding:3px 8px;font-size:9px;font-weight:bold;white-space:nowrap;border-radius:2px;text-shadow:0 1px 2px #000}

/* 地點標籤 — 預設隱藏（修正：標題畫面左上角不再出現 NPC 名字） */
.loc{position:absolute;transform:translateX(-50%);font-size:8.5px;font-weight:bold;color:#ffe066;
     white-space:nowrap;background:#171410;border:1px solid #6a5530;box-shadow:0 0 0 2px #0a0806;
     padding:1px 6px;display:none}

#tower-title{position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:9.5px;font-weight:bold;
     color:#dfe6f2;white-space:nowrap;letter-spacing:3px;background:#1a202c;border:1px solid #3c4658;
     box-shadow:0 0 0 2px #0c0e14;padding:3px 12px;z-index:40}

#elev-hint{position:absolute;font-size:8.5px;color:#70d8ff;background:rgba(0,0,0,.88);
     border:1px solid #70d8ff;padding:2px 7px;transform:translateX(-50%);white-space:nowrap;display:none}

/* 樓層指示器 */
#floor-ind{display:none!important}
#floor-ind .fi{width:16px;height:11px;border:1px solid #5a5a66;background:rgba(0,0,0,.25);border-radius:1px}
#floor-ind .fi.cur{background:#ffe040;border-color:#ffe040;box-shadow:0 0 6px rgba(255,224,64,.8)}
#floor-ind .fi.locked{border-color:#33333c;background:rgba(0,0,0,.5)}
#floor-ind .fi-locked-perm{height:7px;border-style:dashed;border-color:#2c2c34;background:rgba(0,0,0,.5)}

/* NPC 標籤 */
#npc-label{position:absolute;transform:translateX(-50%);font-size:8.5px;font-weight:bold;white-space:nowrap;
     background:#171410;border:1px solid #6a5530;box-shadow:0 0 0 2px #0a0806;padding:1px 6px;display:none;z-index:45}
#npc-bubble{position:absolute;transform:translate(-50%,-100%);background:rgba(0,0,0,0.92);border:1px solid #f8e030;
     color:#f8e030;padding:3px 8px;font-size:9px;font-weight:bold;white-space:nowrap;border-radius:2px;display:none;z-index:60}

/* 電梯轉場 DOM 文字（修正：原 canvas 文字像素化問題） */
#elev-ov{position:absolute;top:0;left:0;width:100%;height:100%;display:none;pointer-events:none;z-index:80}
#elev-ov.on{display:block}
#elev-ov-main{position:absolute;top:10%;left:50%;transform:translateX(-50%);font-size:11px;color:#ffe070;
     letter-spacing:3px;text-shadow:0 0 10px rgba(255,224,112,.5);animation:elevPulse 1.2s ease-in-out infinite}
#elev-ov-sub{position:absolute;top:33%;left:50%;transform:translateX(-50%);font-size:8px;color:#a0b4c8;letter-spacing:1px}
#elev-ov-floor{position:absolute;top:46%;left:64%;font-size:13px;color:#ffe040;font-family:'FusionPixel',monospace;
     font-weight:bold;background:rgba(0,0,0,.6);border:1px solid #7090b0;padding:2px 8px;letter-spacing:1px}
@keyframes elevPulse{0%,100%{opacity:.55}50%{opacity:1}}

/* 浮動台詞層（不阻塞的對話：第一關放置成功、攤位呢喃等） */
#float-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:70}
.float-line{position:absolute;transform:translate(-50%,-100%);max-width:230px;text-align:left;
     background:rgba(8,6,2,0.92);border:1px solid;padding:4px 9px;font-size:9px;font-weight:bold;
     line-height:1.55;border-radius:2px;text-shadow:0 1px 2px #000;
     animation:floatIn .25s ease-out}
.float-line.out{animation:floatOut .4s ease-in forwards}
@keyframes floatIn{from{opacity:0;transform:translate(-50%,-80%)}to{opacity:1;transform:translate(-50%,-100%)}}
@keyframes floatOut{from{opacity:1}to{opacity:0;transform:translate(-50%,-120%)}}
@keyframes blink{0%,65%{opacity:1}66%,100%{opacity:0}}

/* 標題畫面 */
#title-ui{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;
     align-items:center;justify-content:center;gap:0}
#title-main{font-family:'FusionPixel','Microsoft JhengHei',sans-serif;
  font-size:48px;color:#f2efe6;letter-spacing:10px;margin-top:-52px;text-indent:10px;
  text-shadow:0 3px 0 #10131e,3px 0 0 #10131e,3px 3px 0 #10131e,6px 6px 0 rgba(0,0,0,.45)}

#title-start{font-size:11px;color:#e8c860;margin-top:44px;text-shadow:1px 1px 0 #11141f,-1px -1px 0 #11141f;letter-spacing:2px;animation:blink 1s step-end infinite}
#title-ver{position:absolute;bottom:8px;left:10px;font-size:8px;color:#6a5638;font-family:'FusionPixel',monospace}




/* 大廳工人呢喃：低調版浮動台詞（不搶玩家焦點） */
.float-line.subtle{font-size:7px;font-weight:normal;color:#b3a88e!important;
  background:rgba(12,10,6,.62);border-color:rgba(150,130,95,.4);padding:2px 6px;max-width:170px}

/* 城市場景地名（清晰 DOM，位於角色層之下） */
.sl-plaque{font-size:8px;color:#f8d040;font-weight:bold;letter-spacing:3px}
.sl-fishsign{font-size:8px;color:#eaf4fa;font-weight:bold;letter-spacing:4px}