/* base.css — 變數、頂欄、卡片、按鈕 */
:root{
  --bg:#f4f6fb; --panel:#ffffff; --line:#e4e9f3; --tx:#1c2b45; --tx2:#67748c;
  --acc:#2563c8; --acc2:#1c4e9c; --good:#0e9f76; --bad:#d4494c; --warn:#b07a12;
  --fs:1.2; /* 字級倍率（拉霸控制）；預設 120%、上限 150%，JS 載入後以使用者存的值覆寫 */
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100vh}
body{background:radial-gradient(1200px 600px at 75% -15%,#e6eefc 0%,var(--bg) 60%);
  color:var(--tx);font-family:"Segoe UI","PingFang TC","Microsoft JhengHei",system-ui,sans-serif}
/* ---------- 頂欄 ---------- */
header{display:flex;align-items:center;gap:12px 16px;padding:14px 26px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.85);backdrop-filter:blur(10px);position:sticky;top:0;z-index:50;flex-wrap:wrap}
.logo{font-weight:600;letter-spacing:.5px;font-size:calc(16px * var(--fs))}
.spacer{flex:1}
.who{color:var(--tx2);font-size:calc(13px * var(--fs))}
.fsbox{display:flex;align-items:center;gap:9px;color:var(--tx2);font-size:12.5px;
  border:1px solid var(--line);border-radius:99px;padding:4px 12px;background:#fff}
.fsbox .a1{font-size:11px}.fsbox .a2{font-size:16px}
/* 軌道 165px／14 檔＝每檔 11.8px。太短(110px→7.9px)拉不住中間檔位，太長會佔掉頁首 */
.fsbox input{width:165px;height:16px;accent-color:var(--acc);cursor:pointer}
/* 百分比只在拉動時淡入，平時不佔視覺 */
.fsbox .pct{width:0;overflow:hidden;opacity:0;text-align:right;font-variant-numeric:tabular-nums;
  font-size:11.5px;transition:opacity .15s,width .15s}
.fsbox.dragging .pct{width:32px;opacity:1}
.btn-ghost{border:1px solid var(--line);background:#fff;color:var(--tx2);border-radius:9px;
  padding:7px 14px;font-size:calc(13px * var(--fs));cursor:pointer}
.btn-ghost:hover{color:var(--acc);border-color:var(--acc)}
/* ---------- 版面 ---------- */
main{max-width:1180px;margin:0 auto;padding:26px 26px 60px}
main.wide{max-width:1480px}
.hidden{display:none!important}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 34px rgba(28,54,104,.08)}
/* ---------- 登入／基本資料 ---------- */
/* 146＝頁首＋main 上下邊距；扣少了會多出幾 px 長出沒必要的捲軸 */
#view-login,#view-profile{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 146px)}
/* 寬度用半速跟隨（fs=1→400、fs=1.7→526），全速跟隨會讓每一檔的視覺跳動過大 */
.login-box{width:calc(400px * (0.55 + var(--fs) * 0.45));max-width:94vw;padding:36px 38px}
.login-box h1{font-size:calc(20px * var(--fs));margin:0 0 4px;font-weight:600}
.login-box .sub{color:var(--tx2);font-size:calc(13px * var(--fs));margin:0 0 22px;line-height:1.7}
.login-box label{display:block;font-size:calc(12.5px * var(--fs));color:var(--tx2);margin:0 0 5px}
.login-box input{width:100%;padding:calc(12px * var(--fs)) 14px;border:1px solid var(--line);border-radius:10px;
  font-size:calc(15px * var(--fs));margin-bottom:14px;background:#fbfcfe;color:var(--tx)}
.login-box input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(37,99,200,.12)}
.btn-main{width:100%;padding:calc(12px * var(--fs));border:0;border-radius:10px;color:#fff;
  font-size:calc(15px * var(--fs));font-weight:600;
  cursor:pointer;background:linear-gradient(135deg,var(--acc),var(--acc2));letter-spacing:2px}
.btn-main:hover{filter:brightness(1.1)}
.btn-main:disabled{opacity:.45;cursor:default;filter:none}
.err{color:var(--bad);font-size:calc(13px * var(--fs));margin:0 0 12px;min-height:18px;line-height:1.6}

/* 載入中 */
.loading{color:var(--tx2);text-align:center;padding:80px 0;font-size:calc(14px * var(--fs));letter-spacing:2px}