.hd-right{display:flex;align-items:center;gap:11px;flex-shrink:0;margin-left:auto;}
.hd-logout{background:#D62311;border:1px solid #741208;color:#fff;padding:6px 14px;border-radius:20px;font-size:12.5px;cursor:pointer;display:flex;align-items:center;gap:5px;flex-shrink:0;}
.hd-logout:hover{background:#741208;}
/* ============ 基础 ============ */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { -webkit-text-size-adjust:100%; }
body {
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    background:#eef2f7; color:#1a2f4a; font-size:16px; line-height:1.5;
    max-width:560px; margin:0 auto; min-height:100vh; position:relative;
    padding-bottom:76px;
}
/* ============ 顶栏 ============ */
header {
    background:#FCFDFF; color:#1a2f4a;
    padding:10px 14px; position:sticky; top:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    border-bottom:2px solid #2d6cb5;
    box-shadow:0 3px 12px rgba(30,60,110,.508);
}
header .brand-logo { height:38px; width:auto; max-width:45%; display:block; object-fit:contain; flex-shrink:1; }
header .hd-welcome { font-size:12.5px; color:#2d6cb5; background:#eaf2fc; border:1px solid #cfe0f5; padding:5px 12px; border-radius:20px; white-space:nowrap; overflow:visible; text-overflow:clip; flex-shrink:1; min-width:0; font-weight:600; }
/* ============ 行程管理 ============ */
.trip-row { display:flex; flex-direction:column; gap:8px; padding:2px 0 6px; }
.trip-li { display:flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid #e2eaf4; border-radius:12px; background:#f8fafd; cursor:pointer; }
.trip-li.on { border-color:#2d6cb5; background:#eaf2fc; }
.trip-li .no { flex:0 0 auto; font-size:12.5px; color:#2d6cb5; background:#fff; border:1px solid #2d6cb5; padding:2px 8px; border-radius:20px; font-weight:700; white-space:nowrap; }
.trip-li .nm { flex:1; font-size:14.5px; color:#1a2f4a; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trip-li .arr { flex:0 0 auto; color:#9aa7b8; }
.trip-li.on .arr { color:#2d6cb5; }
.trip-modal { position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:min(88%,340px); background:#fff; border-radius:16px; z-index:100; padding:16px 18px; box-shadow:0 10px 40px rgba(10,30,60,.25); display:none; }
.trip-modal.show { display:block; }
.trip-modal .tm-hd { display:flex; align-items:center; justify-content:space-between; font-size:16px; font-weight:700; color:#fff; background:#2d6cb5; margin:-16px -18px 12px; padding:13px 18px; }
.trip-modal .tm-hd .x { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(255,255,255,.22); color:#fff; cursor:pointer; }
.trip-modal .tm-hd .tm-acts { display:flex; align-items:center; gap:8px; }
.trip-modal .tm-hd .del-x { background:rgba(224,82,82,.92); color:#fff; }
#tripEditModal .tm-hd b i { margin-right:4px; }
.trip-modal .tm-lb { font-size:13px; color:#7f8c9c; margin-bottom:6px; }
.trip-modal input.tm-name { width:100%; box-sizing:border-box; border:1px solid #dbe4ef; border-radius:8px; padding:10px 12px; font-size:15px; outline:none; }
.trip-modal input.tm-name:focus { border-color:#2d6cb5; }
.trip-modal .tm-scroll { max-height:calc(100vh - 150px); overflow-y:auto; padding-right:2px; }
.trip-modal .grp-t { margin-top:12px; }
.trip-modal .set-item { padding:9px 0; }
.trip-modal .tm-cb { display:flex; align-items:flex-start; gap:6px; font-size:12.5px; color:#7f8c9c; margin-top:12px; line-height:1.5; }
.trip-modal .tm-cb input { margin-top:2px; }
/* ===== 旅行报告 ===== */
.rp-hero { text-align:center; padding:6px 0 4px; }
.rp-big { font-size:34px; font-weight:800; color:#2d6cb5; line-height:1.1; }
.rp-big small { font-size:15px; font-weight:600; margin-left:2px; }
.rp-lb { font-size:12px; color:#7f8c9c; margin-top:4px; }
.rp-grid { display:flex; margin:12px 0 4px; }
.rp-grid > div { flex:1; text-align:center; background:#f2f6fb; border-radius:10px; padding:10px 4px; }
.rp-grid b { display:block; font-size:16px; color:#1a2f4a; }
.rp-grid span { font-size:11.5px; color:#7f8c9c; }
.rp-t { font-size:13px; font-weight:700; color:#2d6cb5; margin:16px 0 8px; }
.rp-r2 { margin-bottom:11px; }
.rp-r2-top { margin-bottom:3px; font-size:12.5px; color:#48586a; }
.rp-r2-top .rp-v { color:#1a2f4a; font-weight:600; margin-left:6px; }
.rp-r2-top span:first-child { font-size:12.5px; color:#48586a; }
.rp-r2-top .rp-v { font-size:12.5px; font-weight:600; color:#1a2f4a; white-space:nowrap; }
.rp-r2-top .rp-v small { font-size:11px; font-weight:400; color:#9aa7b8; margin-left:4px; }
.rp-r2 .rp-bar { height:10px; background:#eef3f9; border-radius:6px; }
.rp-r2 .rp-bar i { display:block; height:100%; border-radius:6px; }
.rp-max { margin:10px 0 2px; font-size:12.5px; color:#5a6b82; text-align:center; }
.rp-max b { color:#e67e22; }
#reportModal { left:10px !important; right:10px !important; top:auto !important; bottom:0 !important; width:auto !important; transform:none !important; border-radius:18px 18px 0 0; max-height:calc(100vh - 30px); }
#reportModal .tm-scroll { max-height:calc(100vh - 100px); overflow-y:auto; overflow-x:hidden; padding-bottom:30px; scrollbar-width:none; }
#reportModal .tm-scroll::-webkit-scrollbar { display:none; }
/* ============ 演示模式横幅 ============ */
.demo-banner { background:#fff7e6; color:#b9770e; font-size:12px; text-align:center; padding:6px 10px; border-bottom:1px solid #f5e3c0; }
/* ============ 卡片 ============ */
.card { background:#fff; border-radius:1px 10px 20px 10px; margin:22px 14px; padding:0 16px 14px; box-shadow:0 2px 10px rgba(30,60,110,.06); overflow:hidden; }
.card h3 { font-size:15px; color:#fff; background:#2d6cb5; margin:0 -16px 10px; padding:11px 16px; display:flex; align-items:center; gap:7px; }
.card h3 i { color:#fff; }
.card h3 .trip-seq { margin-left:auto; font-size:12px; color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35); padding:3px 10px; border-radius:20px; font-weight:600; white-space:nowrap; }
/* 账单页成员状况标题深蓝头条 */
#tab-bills .card { padding:0; overflow:hidden; }
#tab-bills .card h3 { background:#2d6cb5; color:#fff; margin:0; padding:11px 14px; border-radius:0; }
#tab-bills .card h3 i { color:#fff; }
#tab-bills .card h3 .trip-seq { color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35); }
#tab-bills .settle-tip { padding:10px 14px 0; margin:0; }
#tab-bills #memStatus { padding:0 14px 18px; }
/* ============ 概览 ============ */
.ov-top { display:flex; align-items:flex-end; justify-content:center; }
.ov-today { font-size:13px; color:#7f8c9c; text-align:center; }
.ov-today b { font-size:32px; color:#e67e22; font-weight:800; margin-left:4px; }
.ov-sum { font-size:13px; color:#7f8c9c; }
.ov-sum b { font-size:20px; color:#1a2f4a; margin-left:4px; }
.ov-avg { display:inline-block; margin-top:6px; font-size:12.5px; color:#2d6cb5; background:#eaf2fc; padding:3px 10px; border-radius:20px; }
.ov-mid { display:flex; align-items:center; justify-content:space-between; margin-top:4px; }
.ov-mid .ov-avg { margin-top:0; }
.bar-wrap { margin-top:10px; height:10px; background:#e8edf4; border-radius:8px; overflow:hidden; }
.bar { height:100%; background:linear-gradient(90deg,#4e8cd5,#2d6cb5); border-radius:8px; transition:width .3s; }
.bar-warn { background:linear-gradient(90deg,#f5b041,#e67e22) !important; }
.bar-over { background:linear-gradient(90deg,#e74c3c,#c0392b) !important; }
.bar-tip { font-size:12px; color:#7f8c9c; margin-top:6px; display:flex; justify-content:space-between; }
/* ============ 分类小计 ============ */
.cat-mini { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:4px; }
.cat-mini .it { text-align:center; padding:8px 2px; border-radius:10px; background:#f6f9fc; }
.cat-mini .ic { font-size:17px; }
.cat-mini .nm { font-size:12px; color:#5a6b82; margin-top:2px; }
.cat-mini .am { font-size:12.5px; font-weight:700; color:#1a2f4a; }
/* ============ 记一笔按钮 ============ */
.btn-add {
    display:flex; align-items:center; justify-content:space-between;
    background:linear-gradient(135deg,#0893B7,#0EB3CC); color:#fff;
    font-size:16px; font-weight:700; letter-spacing:1px;
    padding:14px 18px; border-radius:1px 10px 10px 1px; margin:12px 14px; box-shadow:0 4px 14px rgba(45,108,181,.3);
    cursor:pointer; user-select:none;
}
.btn-add .ba-l { display:flex; align-items:center; gap:9px; }
.btn-add .ba-l i { font-size:19px; }
.btn-add .ba-arr { display:flex; align-items:center; font-size:15px; animation:pulseArrow 1.3s ease-in-out infinite; }
@keyframes pulseArrow { 0%,100%{ transform:translateX(0); opacity:.55; } 50%{ transform:translateX(5px); opacity:1; } }
.btn-add:active { transform:scale(.98); }
.btn-add.disabled { background:linear-gradient(135deg,#9aa8b8,#b6c2cf); box-shadow:none; opacity:.85; }
.btn-add.disabled:active { transform:none; }
.btn-add.disabled .ba-arr { animation:none; opacity:.5; }
.btn-mini.disabled { opacity:.5; filter:grayscale(.45); }
/* ============ 账单 ============ */
.day-grp { margin:22px 14px; background:#fff; border-radius:1px 10px 20px 10px; border:1px solid #e8eef6; box-shadow:0 2px 8px rgba(30,60,110,.08); overflow:hidden; }
.day-hd { display:flex; align-items:center; justify-content:space-between; font-size:13px; color:#fff; background:#2d6cb5; padding:11px 14px; margin:0; }
.day-hd .dh-lb { font-weight:700; color:#fff; font-size:13.5px; }
.dh-sum { font-size:12px; color:#eaf2fc; background:#2662A7; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:3px 11px; }
.dh-odo { font-size:12px; color:#FFFD00; font-weight:700; }
.dh-sum b { color:#fff; font-size:13.5px; }
.rec { display:flex; align-items:flex-start; flex-wrap:wrap; gap:6px; background:#FCFDFF; border-radius:10px; padding:10px 12px; margin-bottom:10px; box-shadow:0 2px 5px rgba(30,60,110,.105); border-bottom :0.6px solid    #447DC0;cursor:pointer; }
.rec:active { background:#f6f9fc; }
.day-grp .rec { background:transparent; border-radius:0; box-shadow:none; margin:0; border-bottom:1px solid #f0f4f9; padding:11px 14px; }
.day-grp .rec:last-child { border-bottom:none; }
.day-foot { text-align:right; padding:12px 14px 16px; }
.day-more { text-align:center; padding:8px; color:#2d6cb5; font-size:13px; cursor:pointer; background:#f5f8fc; margin:6px 28px;border-radius:28px;}
.day-grp .rec .ric { margin-top:0; }
.rec .ric { width:30px; height:30px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:13px; color:#fff; flex:0 0 auto; margin-top:-8px; }
.rec .rbody { flex:1; min-width:0; }
.rec .rt { font-size:15.5px; font-weight:700; line-height:22px; display:flex; align-items:center; gap:6px; }
.rec .ram { font-size:17px; font-weight:700; color:#e74c3c; white-space:nowrap; flex:0 0 auto; line-height:22px; }
.chev { width:7px; height:7px; border-top:1.6px solid #407ABE; border-right:1.6px solid #407ABE; transform:rotate(45deg); flex:0 0 auto; margin-left:2px; margin-top:7px; }
.rec .rs { flex:1 1 100%; order:3; display:flex; align-items:center; gap:5px; margin-top:2px; font-size:12px; color:#9aa7b8; line-height:1; }
.rec .rs .shared { font-size:9.5px; background:#eaf2fc; color:#2d6cb5; border-radius:999px; padding:3px 6px; flex:0 0 auto; line-height:1; }
.rec .rs .solo { background:#fdf0ec; color:#c0392b; }
.rec .rs .rdate { white-space:nowrap; }
.rec .rs .rp { margin-left:auto; white-space:nowrap; text-align:right; color:#5a6b82; }
.rec .rs .rp-sep { display:inline-block; width:1px; height:10px; background:#d5dde8; vertical-align:-1px; }
.empty { text-align:center; color:#9aa7b8; padding:40px 20px; font-size:14px; }
.empty i { font-size:40px; display:block; margin-bottom:12px; color:#c8d4e4; }
/* ============ 成员消费状况（账单页） ============ */
.settle-tip { display:flex; flex-wrap:wrap; gap:6px; margin:-2px 0 10px; }
.st-badge { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; color:#2d6cb5; background:#eaf2fc; border:1px solid #cfe0f6; border-radius:20px; padding:3px 10px; }
.st-badge.mgr { color:#7d4fbf; background:#f3ecfd; border-color:#e0d0f7; }
.mst-row { display:flex; align-items:center; gap:10px; padding:11px 2px; border-bottom:1px dashed #e4ebf3; }
.mst-row:last-child { border-bottom:none; }
.mst-avatar { width:36px; height:36px; border-radius:50%; background:linear-gradient(135deg,#2d6cb5,#4e8cd5); color:#fff; font-size:15px; font-weight:700; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.mst-info { flex:1; min-width:0; }
.mi-1 { display:flex; align-items:baseline; gap:6px; }
.mi-1 .mst-who { font-size:15px; font-weight:700; color:#1a2f4a; white-space:nowrap; }
.mi-1 small { font-size:12px; color:#9aa7b8; flex:0 0 auto; }
.mi-1 .bal { margin-left:auto; font-size:17px; font-weight:700; color:#1a2f4a; white-space:nowrap; }
.mi-1 .bal.ok { color:#08AF43; }
.mi-1 .bal.warn { color:#FF8B00; }
.mi-1 .bal.bad { color:#F31A02; }
.mi-2 { display:flex; align-items:center; gap:12px; margin-top:4px; font-size:12px; color:#7f8c9c; white-space:nowrap; }
.mi-2 .mi b { color:#34495e; font-size:12.5px; margin-left:2px; }
.mst-pill { display:inline-block; font-size:12px; font-weight:700; border-radius:999px; padding:2px 9px; margin-left:auto; }
.mst-pill.ok { color:#16a34a; background:#e7f7ee; }
.mst-pill.warn { color:#e67e22; background:#fef3e6; }
.mst-pill.bad { color:#c0392b; background:#fdf0ec; }
.mst-total { margin-top:10px; padding-top:10px; border-top:2px solid #e4ebf3; display:flex; gap:10px; }
.mt-b { flex:1; background:#D5FBFF; border-radius:10px; padding:9px 12px; text-align:center; }
.mt-b span { display:block; font-size:12px; color:#7f8c9c; }
.mt-b b { font-size:15px; color:#1a2f4a; }
/* ============ 分摊 ============ */
.split-hero { text-align:center; padding:6px 0 10px; }
.split-hero .big { font-size:34px; font-weight:800; color:#2d6cb5; }
.split-hero .lb { font-size:12.5px; color:#7f8c9c; margin-top:2px; }
.sp-note { font-size:12px; color:#9aa7b8; margin-top:2px; line-height:1.5; }
.split-hero .per { font-size:15px; font-weight:700; color:#e67e22; margin-top:4px; }
.mem-row { padding:10px 0; border-bottom:1px dashed #e4ebf3; }
.mem-row:last-child { border-bottom:none; }
.mem-row .mr-hd { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.mem-row .name-pill { display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:700; color:#2d6cb5; background:#eaf2fc; border:1px solid #cfe0f6; padding:3px 12px; border-radius:20px; }
.mem-row .name-pill i { font-size:12px; }
.mem-row .amt { font-size:13px; color:#7f8c9c; white-space:nowrap; }
.mem-row .amt b { font-size:16px; margin-left:3px; }
.mem-row .mr-sub { display:flex; align-items:center; gap:12px; margin-top:7px; margin-left:20px;font-size:12.5px; color:#7f8c9c; flex-wrap:wrap; }
.mem-row .mr-sub .pos, .mem-row .mr-sub .neg { font-weight:700; }
.settled-pill { display:inline-block; font-size:12px; font-weight:700; color:#fff; background:#e05252; padding:2px 10px; border-radius:20px; }
.settle-ev { margin-top:10px; background:#f6f9fc; border-radius:10px; padding:10px 12px; }
.settle-ev b { font-size:12.5px; color:#7f8c9c; display:block; margin-bottom:6px; }
.settle-ev .ev-imgs { display:flex; gap:8px; flex-wrap:wrap; }
.settle-ev .ev-imgs img { width:72px; height:72px; object-fit:cover; border-radius:8px; border:1px solid #e2eaf4; cursor:pointer; }
.pos { color:#27ae60; } .neg { color:#c0392b; } .zero { color:#9aa7b8; }
.settle { margin-top:12px; background:#f6f9fc; border-radius:10px; padding:12px; font-size:13.5px; color:#34495e; line-height:1.8; }
.settle b { color:#2d6cb5; }
/* ============ 我的 ============ */
.set-item { display:flex; justify-content:space-between; align-items:center; padding:11px 0; border-bottom:1px solid #f0f4f9; gap:10px; }
.set-item:last-child { border-bottom:none; }
.set-item .lb { font-size:14.5px; display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.set-item .lb i { color:#2d6cb5; width:20px; text-align:center; }
.set-item select { font-size:14px; color:#2d6cb5; border:1px solid #dbe4ef; border-radius:8px; padding:6px 8px; background:#fff; max-width:62%; }
.set-item .val { font-size:14px; color:#1a2f4a; font-weight:600; text-align:right; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px 10px; margin-top:8px; }
.form-grid label { font-size:12px; color:#7f8c9c; display:block; }
.form-grid input, .form-grid select { width:100%; font-size:14px; border:1px solid #dbe4ef; border-radius:8px; padding:8px 9px; margin-top:3px; outline:none; color:#1a2f4a; background:#fff; }
.form-grid input:focus { border-color:#2d6cb5; }
.btn-row { display:flex; gap:10px; margin-top:10px; }
.btn-mini { flex:1; text-align:center; padding:10px 0; border-radius:10px; font-size:14px; font-weight:600; cursor:pointer; }
.btn-mini.b1 { background:#DBFAFF; color:#2d6cb5; }
.btn-mini.b2 { background:#fdf0ec; color:#c0392b; }
.mem-card { border:1px solid #e8eef6; border-radius:12px; padding:12px; margin-bottom:10px; background:#fbfcfe; }
.mem-hd { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.mem-hd .mem-name { font-size:16px; font-weight:700; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mem-hd .role-tag { font-size:12px; background:#eaf2fc; color:#2d6cb5; border-radius:10px; padding:2px 8px; flex:0 0 auto; }
.mem-hd .prepay-tag { font-size:12px; font-weight:700; background:#e7f7ee; color:#16a34a; border-radius:10px; padding:2px 8px; flex:0 0 auto; }
.mem-hd .del { color:#c0392b; font-size:15px; padding:6px; cursor:pointer; flex:0 0 auto; }
.toggle-pill { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:700; color:#2d6cb5; background:#eaf2fc; border:1px solid #cfe0f6; padding:3px 10px; border-radius:20px; cursor:pointer; flex:0 0 auto; }
.mem-body { display:none; }
.mem-card.open .mem-body { display:block; }
.mem-card.open .toggle-pill i { transform:rotate(180deg); }
/* 分组标题（成员卡 / 行程参数） */
.grp-t { font-size:12px; color:#2d6cb5; font-weight:700; margin:12px 0 2px; letter-spacing:.5px; }
.mem-card > .grp-t:first-of-type { margin-top:8px; }
.help { font-size:15px; color:#5a6b82; line-height:1.9; }
.help p { margin-bottom:8px; }
.help p:last-child { margin-bottom:0; }
.help b { color:#2d6cb5; }
/* ============ 底部 Tab ============ */
nav {
    position:fixed; bottom:0; left:0; right:0; margin:0 auto; max-width:560px;
    background:#fff; border-top:1px solid #e6ecf3; display:flex; z-index:60;
    box-shadow:0 -4px 16px rgba(45,108,181,.12);
    padding-bottom:env(safe-area-inset-bottom);
}
nav a { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:10px 0 9px; color:#9aa7b8; font-size:12px; line-height:1; text-decoration:none; cursor:pointer; border-top:1px solid #DFE8F3;}
nav a i { font-size:20px; line-height:1; }
nav a.on { color:#2d6cb5; font-weight:700; }
/* ============ 登录 ============ */
.login-wrap { min-height:100vh; background:linear-gradient(160deg,#2d6cb5,#4e8cd5); display:flex; align-items:center; justify-content:center; padding:20px; }
.login-box { background:#fff; border-radius:20px; padding:30px 24px; width:100%; max-width:360px; text-align:center; box-shadow:0 10px 40px rgba(20,40,80,.3); }
.login-logo { width:64px; height:64px; border-radius:50%; background:linear-gradient(135deg,#2d6cb5,#4e8cd5); color:#fff; font-size:28px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; }
.login-logo img { width:64px; height:64px; border-radius:50%; object-fit:cover; }
.captcha-row { display:flex; gap:10px; align-items:center; margin-bottom:10px; }
.captcha-q { background:#eef3fa; border:1px solid #d5e0ee; border-radius:10px; padding:0 14px; font-size:15px; font-weight:700; color:#2d6cb5; white-space:nowrap; height:46px; display:flex; align-items:center; box-sizing:border-box; flex-shrink:0; }
.captcha-row input { flex:1 !important; height:46px !important; box-sizing:border-box; margin-bottom:0 !important; padding:11px 12px; }
.login-box h1 { font-size:22px; color:#1a2f4a; }
.login-sub { font-size:13px; color:#7f8c9c; margin:6px 0 18px; }
.login-tabs { display:flex; background:#f2f6fb; border-radius:12px; padding:4px; margin-bottom:16px; }
.login-tabs span { flex:1; padding:8px 0; border-radius:9px; font-size:14px; font-weight:600; color:#7f8c9c; cursor:pointer; }
.login-tabs span.on { background:#fff; color:#2d6cb5; box-shadow:0 1px 4px rgba(30,60,110,.12); }
.login-form input { width:100%; font-size:15px; border:1px solid #dbe4ef; border-radius:10px; padding:11px 12px; margin-bottom:10px; outline:none; color:#1a2f4a; background:#f8fafd; }
.login-form input:focus { border-color:#2d6cb5; background:#fff; }
.btn-login { width:100%; background:linear-gradient(135deg,#2d6cb5,#4e8cd5); color:#fff; font-size:16px; font-weight:700; letter-spacing:4px; border:none; border-radius:12px; padding:13px 0; cursor:pointer; margin-top:4px; }
.login-msg { font-size:13px; color:#c0392b; min-height:18px; margin-top:10px; }
.login-demo { margin-top:8px; font-size:13px; color:#2d6cb5; cursor:pointer; }
.login-tip { font-size:12px; color:#9aa7b8; margin-top:8px; line-height:1.7; }
/* ============ 记账弹层 ============ */
.mask { position:fixed; inset:0; background:rgba(12,22,42,.78); z-index:80; opacity:0; pointer-events:none; transition:opacity .25s; }
.mask.show { opacity:1; pointer-events:auto; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
#sheet, #sheet-detail {
    position:fixed; left:0; right:0; bottom:0; margin:0 auto; max-width:560px; z-index:90;
    background:#fff; border-radius:20px 20px 0 0; transform:translateY(105%); transition:transform .28s ease;
    max-height:88vh; overflow-y:auto; padding:0 18px 22px; padding-bottom:calc(22px + env(safe-area-inset-bottom));
}
#sheet.show, #sheet-detail.show { transform:translateY(0); }
.sh-hd { position:sticky; top:0; z-index:5; background:linear-gradient(135deg,#2d6cb5,#4e8cd5); color:#fff; display:flex; justify-content:space-between; align-items:center; margin:0 -18px 12px; padding:14px 18px; border-radius:18px 18px 0 0; }
.sh-hd b { font-size:17px; color:#fff; display:flex; align-items:center; gap:8px; }
.sh-hd b i { font-size:15px; }
.sh-hd .x { width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.22); color:#fff; font-size:14px; display:flex; align-items:center; justify-content:center; padding:0; cursor:pointer; }
.sheet-lb { font-size:14px; color:#4889D6; margin:18px 0 10px; font-weight:700; display:flex; align-items:center; border-bottom:1px dashed #D7E8FC; padding-bottom:3px; }
.sheet-lb::before { content:''; width:4px; height:14px; border-radius:2px; background:#2d6cb5; margin-right:4px; flex:0 0 auto; }
.sheet-lb .dim { margin-left:auto; font-weight:500; font-size:12px; color:#9aa7b8; }
.amt-input { display:flex; align-items:center; background:#f2f6fb; border-radius:12px; padding:8px 14px; }
.amt-input .y { font-size:22px; color:#2d6cb5; font-weight:700; }
.amt-input input { flex:1; border:none; background:transparent; font-size:32px; font-weight:800; color:#1a2f4a; outline:none; min-width:0; }
.odo-input { display:flex; align-items:center; background:#f4f8fd; border:1px solid #dce7f4; border-radius:10px; padding:10px 12px; margin-bottom:10px; }
.odo-input label { font-size:13px; color:#7f8c9c; margin-right:6px; white-space:nowrap; flex-shrink:0; }
.odo-input input { flex:1; border:none; outline:none; background:transparent; font-size:16px; color:#1a2f4a; min-width:0; }
.ov-car { font-size:13px; color:#4a5a6a; background:#f4f8fd; border-radius:10px; padding:9px 12px; margin-top:10px; line-height:1.7; }
.ov-car b { color:#e67e22; }
.ov-car-sub { font-size:12px; color:#9aa7b8; }
/* 消费时间 */
.day-chips { display:flex; flex-wrap:wrap; gap:8px; padding-bottom:4px; }
.day-chip { flex:0 0 auto; background:#f6f9fc; border:1px solid #e4ebf3; color:#34495e; font-size:13.5px; padding:4px 17px; border-radius:30px; cursor:pointer; white-space:nowrap; }
.day-chip.sel { background:#2d6cb5; border-color:#2d6cb5; color:#fff; font-weight:700; }
.day-chip.d-hide, .cat-mchip.d-hide { display:none; }
.day-chip.more, .cat-mchip.more { border-style:dashed; border-color:#2d6cb5; color:#2d6cb5; font-weight:600; background:#f0f6ff; }
.day-chip.more.end, .cat-mchip.more.end { margin-left:auto; }
/* 圆点分隔（CSS 绘制，不受字体字形影响，避免个别设备把字符渲染成方框） */
.d-dot { display:inline-block; width:4px; height:4px; border-radius:50%; background:currentColor; margin:0 6px; vertical-align:middle; }
.day-date { font-size:13px; color:#246ABB; margin-top:6px;margin-left:16px; font-weight:550;}
/* 分类两级 */
.cat-main { display:flex; flex-wrap:wrap; gap:8px; padding-bottom:6px; }
.cat-mchip { flex:0 0 auto; display:flex; align-items:center; gap:6px; background:#f6f9fc; border:1px solid #e4ebf3; color:#34495e; font-size:13.5px; padding:4px 17px; border-radius:30px; cursor:pointer; }
.cat-mchip i { font-size:13px; }
.cat-mchip.sel { background:#eaf2fc; border-color:#2d6cb5; color:#2d6cb5; font-weight:700; order:-1; }
.cat-grid { display:flex; flex-wrap:wrap; gap:8px; }
.cat-cell { text-align:center; padding:4px 10px; border-radius:8px; background:#f6f9fc; border-bottom:2px solid transparent; cursor:pointer; }
.cat-cell .cn { font-size:12.5px; }
.cat-cell.sel { background:#eaf2fc; border-color:#2d6cb5; }
.cat-cell.sel .cn { color:#2d6cb5; font-weight:700; }
/* 人员 */
.pay-row { display:flex; flex-wrap:wrap; gap:8px; }
.pay-chip { background:#f6f9fc; border:1px solid #e4ebf3; color:#34495e; font-size:13.5px; padding:4px 17px; border-radius:30px; cursor:pointer; display:flex; align-items:center; gap:6px; }
.pay-chip i { color:#2d6cb5; }
.pay-chip.sel { background:#eaf2fc; border-color:#2d6cb5; color:#2d6cb5; font-weight:700; }
/* 图片 */
.img-row { display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; }
.img-slot { position:relative; flex:0 0 auto; }
.img-slot img { width:84px; height:84px; object-fit:cover; border-radius:10px; display:block; border:1px solid #e4ebf3; }
.img-slot .rm { position:absolute; top:-7px; right:-7px; width:22px; height:22px; border-radius:50%; background:#c0392b; color:#fff; font-size:12px; line-height:22px; text-align:center; cursor:pointer; }
.img-add { width:84px; height:84px; border:1.5px dashed #c8d4e4; border-radius:10px; color:#7f8c9c; font-size:12px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; flex:0 0 auto; }
.img-add i { font-size:20px; }
.feel-row { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:8px; }
.feel-tag { padding:2px 10px; border-radius:6px; font-size:13px;font-weight:500;  border:1.5px solid #dbe4ef; background:#fff; color:#48586a; cursor:pointer; }
.feel-tag.good { background:#E9FFF2;border-color:#27ae60; color:#27ae60; }
.feel-tag.mid {background:#FFF6E9; border-color:#f39c12; color:#f39c12; }
.feel-tag.bad {background:#FFEBE9; border-color:#e74c3c; color:#e74c3c; }
.feel-tag.on { background:#2d6cb5; color:#fff; border-color:#2d6cb5; }
.note-input { width:100%; font-size:15px; border:1px solid #dbe4ef; border-radius:10px; padding:10px 12px; outline:none; color:#1a2f4a; resize:vertical; min-height:76px; box-sizing:border-box; }
.note-input:focus { border-color:#2d6cb5; }
.note-wrap { position:relative; }
.note-count { position:absolute; right:10px; bottom:8px; font-size:11px; color:#9aa7b8; pointer-events:none; background:rgba(255,255,255,.85); padding:0 4px; border-radius:4px; }
/* 消费明细（按类别动态显示） */
.detail-fields { background:#f7fafd; border:1px solid #e8eef7; border-radius:10px; padding:10px 12px; margin-top:10px;margin-bottom:4px; }
.detail-fields .df-row { display:flex; gap:8px; align-items:center; margin-bottom:6px; }
.detail-fields .df-row:last-child { margin-bottom:0; }
.detail-fields .df-lb { font-size:13.2px; color:#757575; font-weight:600; flex:0 0 auto; white-space:nowrap; }
.detail-fields input { flex:1; min-width:0; border:1px solid #dbe4ef; border-radius:2px; padding:7px 10px; font-size:14px; outline:none; background:#fff; color:#1a2f4a; }
.detail-fields input:focus { border-color:#2d6cb5; }
.btn-save {
    width:100%; margin-top:36px; background:linear-gradient(135deg,#2d6cb5,#4e8cd5); color:#fff;
    font-size:17px; font-weight:700; letter-spacing:3px; border:none; border-radius:12px;
    padding:14px 0; cursor:pointer;
}
.btn-save:active { transform:scale(.98); }
/* ============ 详情弹层 ============ */
.det-row { display:flex; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid #f0f4f9; font-size:14.5px; }
.det-row .lb { color:#7f8c9c; flex:0 0 auto;font-weight:600;  }
.det-row .vl { text-align:right; color:#1a2f4a; font-weight:500; word-break:break-all; }
.det-block { padding:10px 0; border-bottom:1px solid #f0f4f9; }
.det-block .lb { font-size:12px; color:#7f8c9c; margin-bottom:6px; }
.det-imgs { display:flex; gap:8px; flex-wrap:wrap; }
.det-imgs img { width:96px; height:96px; object-fit:cover; border-radius:10px; cursor:pointer; }
/* ============ 图片查看 ============ */
.img-viewer { position:fixed; inset:0; background:rgba(10,18,32,.92); z-index:150; display:none; align-items:center; justify-content:center; touch-action:manipulation; user-select:none; -webkit-tap-highlight-color:transparent; }
.img-viewer.show { display:flex; }
.img-viewer img { max-width:94%; max-height:88%; border-radius:8px; }
.img-viewer .x { position:absolute; top:16px; right:18px; color:#fff; font-size:26px; cursor:pointer; padding:8px; }
.v-nav { position:absolute; top:50%; transform:translateY(-50%); color:#fff; font-size:26px; cursor:pointer; width:46px; height:46px; background:rgba(255,255,255,.14); border-radius:50%; display:flex; align-items:center; justify-content:center; z-index:2; }
.v-prev { left:14px; }
.v-next { right:14px; }
.v-nav.hide { display:none; }
.v-page { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); color:#fff; font-size:14px; font-weight:600; background:rgba(0,0,0,.5); padding:4px 16px; border-radius:16px; z-index:2; }
/* ============ Toast ============ */
#toast {
    position:fixed; left:50%; top:46%; transform:translate(-50%,-50%); z-index:120;
    background:rgba(26,47,74,.92); color:#fff; font-size:14.5px; padding:12px 22px; border-radius:12px;
    opacity:0; pointer-events:none; transition:opacity .25s; max-width:78%; text-align:center;
}
#toast.show { opacity:1; }
/* ============ 桌面适配 ============ */
@media (min-width:561px){
    nav { border-radius:14px 14px 0 0; }
    #sheet, #sheet-detail { border-radius:0 0 18px 18px; bottom:12px; }
}
/* ============ 页脚品牌 ============ */
.page-footer { text-align:center; padding:20px 16px 6px; }
.page-footer img { height:150px; width:auto; max-width:100%; object-fit:contain; border-radius: 10px; }
.page-footer .footer-slogan { margin-top:6px; font-size:14px; color:#009AC0; font-weight:600; letter-spacing:1px; }

/* 使用说明弹窗：从底部弹出，距顶30px，三边贴边 */
#helpModal { left:0; right:0; bottom:0; top:30px; width:100%; transform:none; height:calc(100vh - 30px); max-height:none; padding:0; border-radius:16px 16px 0 0; display:none; margin:0; overflow:hidden; }
#helpModal.show { display:block; }
#helpModal .tm-hd { margin:0; padding:14px 16px; border-radius:16px 16px 0 0; flex-shrink:0; }
#helpModal .tm-bd { flex:1 !important; max-height:none !important; overflow-y:scroll !important; -webkit-overflow-scrolling:touch; font-size:14px; line-height:1.8; padding:20px 20px 30px !important; }
#helpModal .tm-bd::-webkit-scrollbar { width:6px; }
#helpModal .tm-bd::-webkit-scrollbar-thumb { background:#c5d3e8; border-radius:3px; }
#helpModal .tm-bd::-webkit-scrollbar-track { background:transparent; }
#helpModal .help p { margin:0 0 14px; }