/* eng 工程師入口 共用設計系統
   - 中文優先: 基準字級 17px、letter-spacing 放大、行高 1.7
   - Header 內容固定置中欄 (桌機不貼齊左右兩緣)
   - 禁用 border-left 強調條 */
:root {
  --brand: #2B1B16; --brand2: #3F3D3C; --accent: #F4B449;
  --bg: #f6f5f3; --ink: #2b2b2b; --muted: #8a8378; --line: #e8e4dd;
  --ok: #1d7a46; --warn: #b45309; --bad: #c0392b;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { font-size: 17px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: "Noto Sans TC", -apple-system, "Microsoft JhengHei", "Helvetica Neue", sans-serif;
  letter-spacing: .045em; line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* ── Header (深色橫幅滿版, 內容置中欄; PWA 狀態列 safe-area) ── */
.ehd { background: linear-gradient(135deg, var(--brand), var(--brand2)); color: #fff;
       padding-top: env(safe-area-inset-top); }
/* 簽名: 「水平尺」琥珀刻度線 — 全站一致的品牌記憶點 */
.ehd::after { content: ''; display: block; height: 3px;
              background: linear-gradient(90deg, var(--accent) 0%, #e08e0b 45%, rgba(224,142,11,.25) 75%, transparent 100%); }
.ehd-in { max-width: 720px; margin: 0 auto; padding: 1rem 1.1rem; display: flex; align-items: center; gap: .8rem; }
.ehd a.back { color: var(--accent); text-decoration: none; font-size: 1.4rem; line-height: 1; padding: .1rem .35rem .2rem; }
.ehd .t { flex: 1; font-size: 1.15rem; font-weight: 700; letter-spacing: .09em; }
.ehd .t .sub { display: block; font-size: .76rem; color: var(--accent); font-weight: 400; letter-spacing: .16em; margin-top: .12rem; }
.ehd .who { font-size: .85rem; color: rgba(255,255,255,.88); letter-spacing: .05em; white-space: nowrap; }
.ehd .who a { color: rgba(255,255,255,.5); text-decoration: none; font-size: .76rem; margin-left: .55rem; }
.ehd a.act { background: var(--accent); color: var(--brand); font-weight: 700; text-decoration: none;
             border-radius: 10px; padding: .45rem .95rem; font-size: .9rem; letter-spacing: .08em; white-space: nowrap; }

/* ── 內容欄 (與 header 同寬置中) ── */
.ewrap { max-width: 720px; margin: 0 auto; padding: 1.1rem 1rem; }

/* ── App 感: 觸控回饋 ── */
a, button { -webkit-tap-highlight-color: transparent; }
a:active, button:active { opacity: .88; }
a.card:active, a.wo:active, a.sv:active, .btn:active, .quick a:active { transform: scale(.97); transition: transform .06s; }

/* ── 底部導覽列 (App tab bar) ── */
.bnav-spacer { height: calc(70px + env(safe-area-inset-bottom)); }
.bnav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
        background: #fff; border-top: 1px solid var(--line);
        box-shadow: 0 -4px 16px rgba(43,27,22,.06); }
.bnav-in { max-width: 720px; margin: 0 auto; display: flex; align-items: stretch;
           padding-bottom: env(safe-area-inset-bottom); }
.bnav a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .18rem;
          padding: .5rem 0 .45rem; text-decoration: none; color: #a69e91;
          font-size: .74rem; font-weight: 700; letter-spacing: .1em; }
.bnav a .ic { font-size: 1.4rem; line-height: 1.15; padding: .12rem .85rem; border-radius: 12px;
              transition: background .15s; }
.bnav a.on { color: var(--brand); }
.bnav a.on .ic { background: rgba(244,180,73,.22); }   /* 琥珀 pill 指示當前頁 */
.bnav a:active .ic { transform: scale(.9); }

/* 工單編號 / 日期時間 等數據: 等寬數字對齊 */
.code, .num, time { font-variant-numeric: tabular-nums; }

/* 扁平線條圖示 (engIcon): 1em 隨文字、繼承文字色 */
.eic { width: 1em; height: 1em; vertical-align: -0.14em; flex-shrink: 0; }
.bnav a .eic { width: 1.35rem; height: 1.35rem; display: block; margin: 0 auto; }
.ehd .t .eic { width: 1.15em; height: 1.15em; margin-right: .15em; }
/* 中央「＋新增」FAB */
.bnav a.add .ic { width: 50px; height: 50px; margin-top: -20px; border-radius: 50%;
                  background: var(--accent); color: var(--brand);
                  display: flex; align-items: center; justify-content: center;
                  font-size: 1.7rem; font-weight: 700;
                  box-shadow: 0 5px 14px rgba(244,180,73,.5); border: 3px solid #fff; }
.bnav a.add { color: #b45309; }

/* 場勘未讀提示: 沒看過的新場勘會一直掛著, 看完才消失 */
.bnav .ic { position: relative; display: inline-block; }
.bnav-dot {
    position: absolute; top: -5px; right: -10px;
    min-width: 17px; height: 17px; padding: 0 4px;
    background: #dc2626; color: #fff; border-radius: 9px;
    font-size: 10px; line-height: 17px; font-weight: 700; text-align: center;
    box-shadow: 0 0 0 2px #fff;
}
