/*
 * 施工端统一样式：与后台同一套颜色；大字、大按钮、大图标
 * 1rem = 屏宽/3.75（375px 宽时 1rem = 100px），在 css.css、today.css 之后加载
 */
:root {
  --app-bg: #F3F2EF;
  --app-card: #FFFFFF;
  --app-ink: #18223A;
  --app-muted: #5B6474;
  --app-line: #E4E1DA;
  --app-brand: #8A6A25;
  --app-brand-dark: #6B5119;
  --app-brand-soft: #F5EEDF;
  --app-ok: #1E7B3C;
  --app-ok-soft: #E3F1E8;
  --app-warn: #C2410C;
  --app-warn-soft: #FFF1E6;
  --app-danger: #B42318;
  --app-blue: #1D4F8A;
  --app-blue-soft: #E6EEF8;
}

/* ---------- 底色、字体 ---------- */
html body {
  background: var(--app-bg) !important;
  color: var(--app-ink);
  font-family: 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, 'PingFang SC', 'Noto Sans SC', sans-serif;
  font-size: 0.16rem;
  line-height: 1.45;
  height: auto;
  min-height: 100vh;
}
body.has-tabs { padding-bottom: calc(0.86rem + env(safe-area-inset-bottom)) !important; }

/* ---------- 顶栏：白色、大标题、大的返回按钮 ---------- */
html body .page-top {
  position: sticky;
  top: 0;
  z-index: 50;
  margin: 0 -0.15rem 0.14rem;
  padding: 0.1rem 0.15rem;
  min-height: 0.6rem;
  background: var(--app-bg);
  width: auto;
}
html body .page-top .page-top-left {
  color: var(--app-ink) !important;
  font-size: 0.22rem;
  font-weight: 700;
  margin-left: 0 !important;
}
html body .page-top .page-top-left img.go-back {
  width: 0.44rem;
  height: 0.44rem;
  padding: 0.12rem;
  margin: 0 0.04rem 0 -0.1rem;
  box-sizing: border-box;
  filter: brightness(0) saturate(0);
  opacity: .8;
}
html body .page-top .page-top-right .page-top-btn {
  width: 0.44rem;
  height: 0.44rem;
  margin: 0 0 0 0.04rem;
  border-radius: 0.12rem;
}
html body .page-top .page-top-right .page-top-btn img {
  width: 0.24rem !important;
  height: 0.24rem;
  filter: brightness(0);
  opacity: .75;
}
html body .page-top .page-top-right .page-top-btn .red-dot { top: 0.08rem; right: 0.08rem; width: 0.1rem; height: 0.1rem; background: var(--app-danger); }

/* ---------- 按钮 ---------- */
html body .btn, html body a.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
  width: 100%;
  min-height: 0.56rem;
  margin-left: 0;
  transform: none;
  border-radius: 0.14rem;
  background: var(--app-brand);
  color: #fff;
  font-size: 0.18rem;
  font-weight: 700;
  line-height: 1.2;
  box-shadow: none;
}
html body .btn:active { transform: scale(.98); }
html body .btn.no { display: flex; width: 100%; margin-left: 0; transform: none; font-size: 0.18rem; line-height: 1.2; border-radius: 0.14rem; background: #B9BCC4; box-shadow: none; }

/* ---------- 卡片和列表 ---------- */
html body .items .item, html body .main .list .item, html body .list .item {
  background: var(--app-card);
  border-radius: 0.16rem;
  box-shadow: 0 0.01rem 0.03rem rgba(21, 25, 42, .06);
  border: 0;
}
html body .item-empty {
  background: var(--app-card);
  border-radius: 0.16rem;
  box-shadow: none;
  min-height: 2rem;
}
html body .item-empty .text { width: auto; font-size: 0.16rem; color: var(--app-muted); }

/* ---------- 底部弹层（表单、选择）---------- */
html body .modal {
  height: auto;
  max-height: 88vh;
  overflow-y: auto;
  padding: 0.2rem 0.16rem calc(0.2rem + env(safe-area-inset-bottom));
  border-radius: 0.2rem 0.2rem 0 0;
  box-shadow: 0 -0.04rem 0.2rem rgba(21, 25, 42, .15);
}
html body .modal .icon-x { height: 0.18rem; top: 0.2rem; right: 0.2rem; padding: 0; }
html body .bk-cover { position: fixed; background: rgba(21, 25, 42, .45); }

/* 表单输入：至少 52px 高、17px 字 */
html body .modal input[type=text], html body .modal input[type=number], html body .modal input[type=tel],
html body .modal textarea, html body .modal select, html body form input[type=text], html body form input[type=password] {
  min-height: 0.52rem;
  font-size: 0.17rem;
  color: var(--app-ink);
  border: 0.01rem solid #C9CDD4;
  border-radius: 0.12rem;
  background: #fff;
  padding: 0 0.14rem;
  box-sizing: border-box;
}
html body .modal textarea { padding: 0.12rem 0.14rem; min-height: 0.9rem; }

/* 提示框 */
html body .toast .toast-box { background: var(--app-ink); box-shadow: none; }
html body .options-modal .option { background: var(--app-brand); box-shadow: none; border-radius: 0.14rem; font-size: 0.19rem; }

/* layui 弹窗按钮大一点 */
.layui-layer-dialog .layui-layer-content { font-size: 0.17rem !important; line-height: 1.5 !important; }
.layui-layer-btn a { height: 0.46rem !important; line-height: 0.46rem !important; padding: 0 0.2rem !important; font-size: 0.17rem !important; border-radius: 0.12rem !important; }
.layui-layer-btn .layui-layer-btn0 { background: var(--app-brand) !important; border-color: var(--app-brand) !important; }
.layui-layer-msg .layui-layer-content { font-size: 0.17rem !important; }

/* ---------- 底部导航：四个大图标 ---------- */
.app-tabs {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: #fff;
  border-top: 0.01rem solid var(--app-line);
  padding-bottom: env(safe-area-inset-bottom);
}
.app-tab {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.03rem;
  min-height: 0.7rem;
  color: var(--app-muted);
  font-size: 0.13rem;
  font-weight: 600;
  -webkit-tap-highlight-color: transparent;
}
.app-tab svg { width: 0.28rem; height: 0.28rem; }
.app-tab.is-on { color: var(--app-brand); }
.app-tab .app-dot { position: absolute; top: 0.1rem; left: 55%; width: 0.1rem; height: 0.1rem; border-radius: 50%; background: var(--app-danger); }

/* ---------- 大图块（项目页功能入口）---------- */
.app-tiles {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.12rem;
  margin-bottom: 0.18rem;
}
.app-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.12rem;
  min-height: 1.14rem;
  padding: 0.16rem;
  border-radius: 0.18rem;
  background: var(--app-card);
  color: var(--app-ink);
  box-shadow: 0 0.01rem 0.03rem rgba(21, 25, 42, .06);
  -webkit-tap-highlight-color: transparent;
}
.app-tile:active { transform: scale(.98); }
.app-tile-icon {
  width: 0.56rem;
  height: 0.56rem;
  border-radius: 0.16rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.app-tile-icon svg { width: 0.32rem; height: 0.32rem; }
.app-tile-label { font-size: 0.19rem; font-weight: 700; }
.app-tile .app-dot { position: absolute; top: 0.14rem; right: 0.14rem; width: 0.12rem; height: 0.12rem; border-radius: 50%; background: var(--app-danger); }
.tone-gold .app-tile-icon { background: var(--app-brand-soft); color: var(--app-brand-dark); }
.tone-blue .app-tile-icon { background: var(--app-blue-soft); color: var(--app-blue); }
.tone-green .app-tile-icon { background: var(--app-ok-soft); color: var(--app-ok); }
.tone-orange .app-tile-icon { background: var(--app-warn-soft); color: var(--app-warn); }
.tone-ink .app-tile-icon { background: #EAEBEE; color: var(--app-ink); }

/* ---------- 通用块 ---------- */
.app-card {
  background: var(--app-card);
  border-radius: 0.18rem;
  padding: 0.16rem;
  margin-bottom: 0.14rem;
  box-shadow: 0 0.01rem 0.03rem rgba(21, 25, 42, .06);
}
.app-title { font-size: 0.21rem; font-weight: 700; color: var(--app-ink); }
.app-sub { font-size: 0.15rem; color: var(--app-muted); margin-top: 0.04rem; display: flex; align-items: center; gap: 0.06rem; }
.app-sub svg { width: 0.18rem; height: 0.18rem; flex: none; }
.app-section { font-size: 0.15rem; font-weight: 700; color: var(--app-muted); margin: 0.06rem 0.02rem 0.1rem; }
.app-pill { display: inline-flex; align-items: center; gap: 0.06rem; padding: 0.05rem 0.12rem; border-radius: 0.2rem; font-size: 0.15rem; font-weight: 600; }
.app-pill.ok { background: var(--app-ok-soft); color: var(--app-ok); }
.app-pill.warn { background: var(--app-warn-soft); color: var(--app-warn); }
.app-pill.grey { background: #EAEBEE; color: var(--app-muted); }
.app-row-btn {
  display: flex;
  align-items: center;
  gap: 0.14rem;
  min-height: 0.64rem;
  padding: 0 0.16rem;
  background: var(--app-card);
  color: var(--app-ink);
  font-size: 0.18rem;
  font-weight: 600;
  border-bottom: 0.01rem solid #F0EEEA;
}
.app-row-btn:first-child { border-radius: 0.18rem 0.18rem 0 0; }
.app-row-btn:last-child { border-radius: 0 0 0.18rem 0.18rem; border-bottom: 0; }
.app-row-btn:only-child { border-radius: 0.18rem; }
.app-row-btn .app-tile-icon { width: 0.42rem; height: 0.42rem; border-radius: 0.12rem; }
.app-row-btn .app-tile-icon svg { width: 0.24rem; height: 0.24rem; }
.app-row-btn > span:not(.app-tile-icon) { flex: 1; }
.app-row-btn em { font-style: normal; font-size: 0.15rem; font-weight: 400; color: var(--app-muted); }
.app-row-btn .chev { width: 0.2rem; height: 0.2rem; color: #B3B6C1; }
.app-group { margin-bottom: 0.16rem; box-shadow: 0 0.01rem 0.03rem rgba(21, 25, 42, .06); border-radius: 0.18rem; }
.app-big-outline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
  width: 100%;
  min-height: 0.56rem;
  border-radius: 0.14rem;
  border: 0.02rem solid #E4C7C3;
  background: #fff;
  color: var(--app-danger);
  font-size: 0.18rem;
  font-weight: 700;
}

/* ---------- 项目列表 ---------- */
.app-project { display: block; }
.app-project + .app-project { margin-top: 0.12rem; }
.app-project-top { display: flex; align-items: flex-start; gap: 0.1rem; }
.app-project-top .app-title { flex: 1; font-size: 0.19rem; }
.app-project .chev { width: 0.22rem; height: 0.22rem; color: #B3B6C1; flex: none; margin-top: 0.03rem; }
.app-project .app-pill { margin-top: 0.1rem; }

/* ---------- 任务列表（项目页） ---------- */
body.renwu .main { background: transparent !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; }
body.renwu .main .flag { display: none; }
body.renwu .main .list .item { padding: 0.16rem !important; margin-bottom: 0.12rem !important; }
body.renwu .main .list .item .line-1-1 { font-size: 0.19rem !important; font-weight: 700; color: var(--app-ink) !important; }
body.renwu .main .list .item .line-1-2 { font-size: 0.14rem !important; }
body.renwu .main .list .item .line-2, body.renwu .main .list .item .line-4 { font-size: 0.15rem !important; color: var(--app-muted) !important; }
body.renwu .main .list .item .line-2 img { width: 0.18rem !important; height: auto; margin-right: 0.06rem; }
body.renwu .main .list .item .btn { margin-top: 0.14rem; }

/* ---------- 今日：拍照面板更直观 ---------- */
.photo-sheet-head { display: flex; align-items: center; gap: 0.12rem; }
.photo-sheet-head .app-tile-icon { background: var(--app-warn-soft); color: var(--app-warn); }
.photo-big {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
  width: 100%;
  min-height: 1.5rem;
  margin-top: 0.16rem;
  border: 0.02rem dashed #C9CDD4;
  border-radius: 0.18rem;
  background: #FAFAF8;
  color: var(--app-ink);
  font-size: 0.19rem;
  font-weight: 700;
}
.photo-big svg { width: 0.56rem; height: 0.56rem; color: var(--app-brand); }
#photo-grid:not(:empty) + .photo-big { min-height: 0.64rem; flex-direction: row; font-size: 0.17rem; }
#photo-grid:not(:empty) + .photo-big svg { width: 0.28rem; height: 0.28rem; }
#photo-grid:empty ~ #photo-submit { display: none; }
.app-pill svg { width: 0.18rem; height: 0.18rem; flex: none; }
.app-profile { display: flex; align-items: center; gap: 0.14rem; }
.app-profile img { width: 0.64rem; height: 0.64rem; border-radius: 50%; object-fit: cover; background: var(--app-brand-soft); flex: none; }
.app-lang { display: grid; gap: 0.1rem; margin-top: 0.14rem; }
.app-lang button { min-height: 0.56rem; border-radius: 0.14rem; border: 0.02rem solid var(--app-line); background: #fff; font-size: 0.18rem; font-weight: 600; color: var(--app-ink); }
.app-lang button.is-on { border-color: var(--app-brand); background: var(--app-brand-soft); color: var(--app-brand-dark); }
.app-profile .chev { width: 0.22rem; height: 0.22rem; color: #B3B6C1; flex: none; }
.app-big-outline svg { width: 0.22rem; height: 0.22rem; flex: none; }
/* 子页面的分页标签：字大一点、间距大一点 */
html body .tabs { box-shadow: none; border-radius: 0.14rem; padding: 0.06rem 0.08rem; display: flex; gap: 0.04rem; }
html body .tabs .tab { font-size: 0.15rem; padding: 0.08rem 0.08rem; border-radius: 0.1rem; flex: 1; text-align: center; }
html body .tabs .tab.active { background: var(--app-brand-soft); }
html body .tabs .tab.active .tab-text { color: var(--app-brand-dark); font-weight: 700; }
/* layui 按钮（如修改密码页）统一成大按钮 */
html body .layui-btn { height: 0.52rem; line-height: 0.52rem; border-radius: 0.14rem; font-size: 0.17rem; font-weight: 700; background: var(--app-brand); padding: 0 0.2rem; }
html body .layui-btn-primary { background: #fff; color: var(--app-ink); border: 0.01rem solid #C9CDD4; }

/* 任务卡片：去掉时间线，状态做成标签 */
body.renwu .main .list .item { margin-top: 0 !important; padding-left: 0.16rem !important; padding-right: 0.16rem !important; }
body.renwu .main .list .item:after, body.renwu .main .list .item .line-1:before, body.renwu .main .list .item .line-1:after { display: none !important; }
body.renwu .main .list .item .line-1-2 { display: inline-block; padding: 0.03rem 0.1rem; border-radius: 0.2rem; background: #EAEBEE; font-weight: 700; margin-bottom: 0.06rem; }
body.renwu .main .list .item.green .line-1 .line-1-2 { background: var(--app-ok-soft); color: var(--app-ok) !important; }
body.renwu .main .list .item.blue .line-1 .line-1-2 { background: var(--app-brand-soft); color: var(--app-brand-dark) !important; }
body.renwu .main .list .item.red .line-1 .line-1-2 { background: #FDECEC; color: var(--app-danger) !important; }
body.renwu .main .list .item.red .line-1 .line-1-1 { color: var(--app-ink) !important; }
html body .tabs .tab, html body .tabs .tab .tab-text { font-size: 0.15rem !important; }

/* ---------- 登录页：与后台同色，输入框和按钮加大 ---------- */
body.index .login-langs a { color: var(--app-ink) !important; font-weight: 600; }
body.index .login-langs a.active { background: var(--app-brand) !important; color: #fff !important; }
body.index .login-logo { width: auto !important; height: 0.6rem !important; max-width: 100%; object-fit: contain; }
body.index .login-slogan { color: var(--app-ink) !important; }
body.index .form { width: 100%; }
body.index .form .input-group { margin-bottom: 0.12rem; }
body.index .form .input-group input {
  height: 0.56rem !important;
  padding: 0 0.16rem !important;
  border: 0.01rem solid #C9CDD4 !important;
  border-radius: 0.14rem;
  background: #fff !important;
  font-size: 0.17rem !important;
  color: var(--app-ink);
}
body.index .form .input-group.input-group-2 .eye { top: 0.19rem; right: 0.18rem; width: 0.2rem; }
body.index .form .forget { color: var(--app-brand-dark) !important; font-size: 0.16rem !important; font-weight: 600; margin-bottom: 0.3rem !important; }
body.index .form .btn, body.index .form .btn:hover {
  width: 100% !important;
  min-height: 0.58rem;
  background: var(--app-brand) !important;
  box-shadow: none !important;
  font-size: 0.19rem;
  display: flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1.2 !important;
}
body.index .brand { display: none; }
body.index .login-install { color: var(--app-brand-dark) !important; font-weight: 600; }

/* ---------- 大按钮、选项、分步表单（票据、材料、请假、消息共用）---------- */
.app-hero {
  display: flex; align-items: center; justify-content: center; gap: 0.14rem;
  width: 100%; min-height: 1.1rem; margin-bottom: 0.12rem; padding: 0 0.2rem;
  border: 0; border-radius: 0.2rem; background: var(--app-brand); color: #fff;
  font-size: 0.22rem; font-weight: 700; box-shadow: 0 0.04rem 0.12rem rgba(138, 106, 37, .25);
  -webkit-tap-highlight-color: transparent;
}
.app-hero svg { width: 0.44rem; height: 0.44rem; flex: none; }
.app-hero:active, .app-choice:active, .app-second:active { transform: scale(.98); }
.app-second {
  display: flex; align-items: center; gap: 0.14rem; width: 100%; min-height: 0.76rem;
  margin-bottom: 0.12rem; padding: 0 0.18rem; border: 0.02rem solid var(--app-line); border-radius: 0.2rem;
  background: #fff; color: var(--app-ink); font-size: 0.19rem; font-weight: 700; text-align: left;
}
.app-second .app-tile-icon { width: 0.48rem; height: 0.48rem; border-radius: 0.14rem; flex: none; }
.app-second .app-tile-icon svg { width: 0.28rem; height: 0.28rem; }
.app-second > span:not(.app-tile-icon):not(.app-count) { flex: 1; }
.app-second .chev { width: 0.22rem; height: 0.22rem; color: #B3B6C1; flex: none; }
.app-count { min-width: 0.3rem; height: 0.3rem; padding: 0 0.09rem; border-radius: 0.15rem; background: var(--app-brand-soft); color: var(--app-brand-dark); font-size: 0.16rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }

/* 全屏分步页 */
.app-screen { position: fixed; inset: 0; z-index: 900; background: var(--app-bg); display: none; flex-direction: column; }
.app-screen.is-open { display: flex; }
.app-screen-head { display: flex; align-items: center; gap: 0.1rem; min-height: 0.64rem; padding: 0 0.12rem; background: #fff; border-bottom: 0.01rem solid var(--app-line); }
.app-screen-head button { width: 0.48rem; height: 0.48rem; border: 0; background: transparent; color: var(--app-ink); display: flex; align-items: center; justify-content: center; }
.app-screen-head button svg { width: 0.26rem; height: 0.26rem; }
.app-screen-head h2 { flex: 1; margin: 0; font-size: 0.2rem; font-weight: 700; }
.app-screen-head .app-steps { font-size: 0.15rem; color: var(--app-muted); font-weight: 600; padding-right: 0.06rem; }
.app-screen-body { flex: 1; overflow-y: auto; padding: 0.18rem 0.15rem; -webkit-overflow-scrolling: touch; }
.app-screen-foot { padding: 0.12rem 0.15rem calc(0.12rem + env(safe-area-inset-bottom)); background: #fff; border-top: 0.01rem solid var(--app-line); display: flex; gap: 0.1rem; }
.app-screen-foot .btn { margin: 0 !important; flex: 1; }
.app-ask { font-size: 0.24rem; font-weight: 700; line-height: 1.3; margin: 0.04rem 0.02rem 0.16rem; }
.app-hint { font-size: 0.16rem; color: var(--app-muted); margin: -0.08rem 0.02rem 0.16rem; }

/* 大选项 */
.app-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 0.12rem; margin-bottom: 0.16rem; }
.app-choices.one { grid-template-columns: 1fr; }
.app-choice {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.08rem;
  min-height: 1.02rem; padding: 0.12rem 0.08rem; border: 0.02rem solid var(--app-line); border-radius: 0.18rem;
  background: #fff; color: var(--app-ink); font-size: 0.18rem; font-weight: 700; text-align: center; line-height: 1.25;
  -webkit-tap-highlight-color: transparent;
}
.app-choices.one .app-choice { flex-direction: row; justify-content: flex-start; min-height: 0.72rem; padding: 0 0.16rem; text-align: left; gap: 0.14rem; }
.app-choice svg { width: 0.36rem; height: 0.36rem; color: var(--app-brand); flex: none; }
.app-choices.one .app-choice svg { width: 0.3rem; height: 0.3rem; }
.app-choice em { font-style: normal; font-size: 0.14rem; font-weight: 600; color: var(--app-muted); }
.app-choice.is-on { border-color: var(--app-brand); background: var(--app-brand-soft); color: var(--app-brand-dark); box-shadow: inset 0 0 0 0.01rem var(--app-brand); }
.app-choice.is-on::after { content: ''; position: absolute; top: 0.1rem; right: 0.1rem; width: 0.22rem; height: 0.22rem; border-radius: 50%; background: var(--app-brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/70% no-repeat; }
.app-choice.tone-ok svg { color: var(--app-ok); }
.app-choice.tone-blue svg { color: var(--app-blue); }

/* 大输入框 */
.app-field { display: block; margin-bottom: 0.14rem; }
.app-field > span { display: block; font-size: 0.16rem; font-weight: 600; color: var(--app-muted); margin: 0 0.02rem 0.06rem; }
.app-field input, .app-field textarea {
  display: block; width: 100%; box-sizing: border-box; min-height: 0.58rem; padding: 0 0.16rem;
  border: 0.02rem solid var(--app-line); border-radius: 0.14rem; background: #fff; font-size: 0.2rem; color: var(--app-ink);
}
.app-field textarea { padding: 0.14rem 0.16rem; min-height: 1.1rem; font-size: 0.18rem; }
.app-field input:focus, .app-field textarea:focus { outline: none; border-color: var(--app-brand); }
.app-field.big input { min-height: 0.7rem; font-size: 0.3rem; font-weight: 700; }

/* 数量加减 */
.app-stepper { display: flex; align-items: center; gap: 0.08rem; }
.app-stepper button { width: 0.56rem; height: 0.56rem; border-radius: 0.14rem; border: 0.02rem solid var(--app-line); background: #fff; font-size: 0.28rem; font-weight: 700; color: var(--app-ink); line-height: 1; }
.app-stepper button.plus { background: var(--app-brand); border-color: var(--app-brand); color: #fff; }
.app-stepper output { min-width: 0.56rem; text-align: center; font-size: 0.26rem; font-weight: 700; }

/* 票据确认卡 */
.app-receipt-photo { width: 100%; max-height: 2.2rem; object-fit: contain; border-radius: 0.14rem; background: #fff; margin-bottom: 0.14rem; }
.app-ai { display: flex; align-items: center; gap: 0.08rem; padding: 0.1rem 0.14rem; border-radius: 0.14rem; background: var(--app-blue-soft); color: var(--app-blue); font-size: 0.16rem; font-weight: 600; margin-bottom: 0.14rem; }
.app-ai svg { width: 0.22rem; height: 0.22rem; flex: none; }
.app-ai.warn { background: var(--app-warn-soft); color: var(--app-warn); }
.app-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.16rem; min-height: 3rem; font-size: 0.2rem; font-weight: 700; color: var(--app-ink); }
.app-loading i { width: 0.56rem; height: 0.56rem; border-radius: 50%; border: 0.05rem solid var(--app-brand-soft); border-top-color: var(--app-brand); animation: app-spin .8s linear infinite; }
@keyframes app-spin { to { transform: rotate(360deg); } }

/* 记录列表（票据、请假、材料单）*/
.app-rec { display: flex; align-items: center; gap: 0.12rem; }
.app-rec img.thumb { width: 0.64rem; height: 0.64rem; border-radius: 0.12rem; object-fit: cover; background: #EAEBEE; flex: none; }
.app-rec-main { flex: 1; min-width: 0; }
.app-rec-main b { display: block; font-size: 0.2rem; }
.app-rec-main small { display: block; font-size: 0.15rem; color: var(--app-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-rec .app-pill { flex: none; }
.app-pill.red { background: #FDECEC; color: var(--app-danger); }
.app-pill.gold { background: var(--app-brand-soft); color: var(--app-brand-dark); }

/* 消息 */
.app-msg { display: flex; align-items: center; gap: 0.12rem; padding: 0.14rem 0.14rem; background: #fff; border-bottom: 0.01rem solid #F0EEEA; color: var(--app-ink); }
.app-msg:first-child { border-radius: 0.18rem 0.18rem 0 0; }
.app-msg:last-child { border-radius: 0 0 0.18rem 0.18rem; border-bottom: 0; }
.app-msg:only-child { border-radius: 0.18rem; }
.app-msg .app-tile-icon { width: 0.48rem; height: 0.48rem; border-radius: 50%; flex: none; }
.app-msg .app-tile-icon svg { width: 0.26rem; height: 0.26rem; }
.app-msg-main { flex: 1; min-width: 0; }
.app-msg-main b { display: block; font-size: 0.18rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-msg.is-new .app-msg-main b { font-weight: 800; }
.app-msg-main small { font-size: 0.14rem; color: var(--app-muted); }
.app-msg .new-dot { width: 0.12rem; height: 0.12rem; border-radius: 50%; background: var(--app-danger); flex: none; }
.app-msg .chev { width: 0.2rem; height: 0.2rem; color: #B3B6C1; flex: none; }
.app-tab .app-badge { position: absolute; top: 0.04rem; left: 52%; min-width: 0.22rem; height: 0.22rem; padding: 0 0.06rem; box-sizing: border-box; border-radius: 0.11rem; background: var(--app-danger); color: #fff; font-size: 0.13rem; font-weight: 700; line-height: 0.22rem; text-align: center; }
.app-more { display: block; width: 100%; min-height: 0.56rem; border: 0; border-radius: 0.14rem; background: #fff; color: var(--app-brand-dark); font-size: 0.17rem; font-weight: 700; margin-top: 0.1rem; }

/* 材料行 */
.app-mat { display: flex; align-items: center; gap: 0.12rem; padding: 0.14rem; background: #fff; border-radius: 0.16rem; margin-bottom: 0.1rem; border: 0.02rem solid transparent; }
.app-mat.is-on { border-color: var(--app-brand); background: #FFFCF6; }
.app-mat-main { flex: 1; min-width: 0; }
.app-mat-main b { display: block; font-size: 0.19rem; line-height: 1.25; }
.app-mat-main small { display: block; font-size: 0.14rem; color: var(--app-muted); margin-top: 0.02rem; }
.app-chips { display: flex; flex-wrap: wrap; gap: 0.08rem; margin-bottom: 0.14rem; }
.app-chips button { min-height: 0.48rem; padding: 0 0.16rem; border-radius: 0.24rem; border: 0.02rem solid var(--app-line); background: #fff; font-size: 0.17rem; font-weight: 600; color: var(--app-ink); }
.app-chips button.is-on { border-color: var(--app-brand); background: var(--app-brand-soft); color: var(--app-brand-dark); }
.app-summary { background: #fff; border-radius: 0.18rem; padding: 0.06rem 0.16rem; margin-bottom: 0.14rem; }
.app-summary div { display: flex; justify-content: space-between; gap: 0.12rem; padding: 0.12rem 0; border-bottom: 0.01rem solid #F0EEEA; font-size: 0.17rem; }
.app-summary div:last-child { border-bottom: 0; }
.app-summary span { color: var(--app-muted); }
.app-summary b { text-align: right; }

/* 进度照片：缩略图格 */
.app-shots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.08rem; }
.app-shot, .app-shot-add { position: relative; display: block; aspect-ratio: 1 / 1; border-radius: 0.12rem; overflow: hidden; background: #EAEBEE; }
.app-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.app-shot .vid { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: #2B2D33; color: #fff; }
.app-shot .vid svg { width: 0.36rem; height: 0.36rem; }
.app-shot button { position: absolute; top: 0.04rem; right: 0.04rem; width: 0.36rem; height: 0.36rem; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .6); color: #fff; font-size: 0.24rem; line-height: 1; }
.app-shot-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.04rem; background: #fff; border: 0.02rem dashed var(--app-brand); color: var(--app-brand-dark); font-size: 0.16rem; font-weight: 700; box-sizing: border-box; text-align: center; line-height: 1.2; padding: 0.04rem; }
.app-shot-add svg { width: 0.32rem; height: 0.32rem; }
.app-day { font-size: 0.17rem; font-weight: 700; margin-bottom: 0.1rem; }

/* 两三个选项的切换条（记录页、项目筛选）*/
.app-seg { display: flex; gap: 0.06rem; padding: 0.05rem; margin-bottom: 0.14rem; background: #fff; border-radius: 0.16rem; }
.app-seg button { flex: 1; min-height: 0.5rem; border: 0; border-radius: 0.12rem; background: transparent; font-size: 0.16rem; font-weight: 700; color: var(--app-muted); padding: 0 0.04rem; }
.app-seg button.is-on { background: var(--app-brand); color: #fff; }

/* 记录卡片里的大按钮、物品清单、分组标题 */
.app-card-btn { display: flex !important; align-items: center; justify-content: center; width: 100% !important; margin: 0.12rem 0 0 !important; min-height: 0.56rem; transform: none !important; box-sizing: border-box; }
.app-rec span.thumb { width: 0.64rem; height: 0.64rem; border-radius: 0.12rem; background: #EAEBEE; flex: none; }
.app-lines { list-style: none; margin: 0.1rem 0 0; padding: 0.08rem 0 0; border-top: 0.01rem solid #F0EEEA; }
.app-lines li { display: flex; justify-content: space-between; gap: 0.1rem; padding: 0.05rem 0; font-size: 0.16rem; }
.app-lines li b { flex: none; }
.app-group-title { font-size: 0.17rem; font-weight: 700; color: var(--app-muted); margin: 0.04rem 0.02rem 0.1rem; }
.app-second-note { font-style: normal; font-size: 0.15rem; font-weight: 600; color: var(--app-danger); }
.app-count.hot { background: var(--app-danger); color: #fff; }
.app-chips-scroll { flex-wrap: nowrap; overflow-x: auto; margin-left: -0.15rem; margin-right: -0.15rem; padding: 0 0.15rem; scrollbar-width: none; }
.app-chips-scroll::-webkit-scrollbar { display: none; }
.app-chips-scroll button { flex: none; }
label.btn { cursor: pointer; }
.app-rec-main small { white-space: normal; }

/* 平板、电脑：页面保持手机宽度居中，固定定位的元素跟着 body */
@media (min-width: 600px) {
  html { height: 100%; overflow: hidden; background: #DEDBD3; }
  body { width: 420px; max-width: 420px; height: 100vh; margin: 0 auto !important; overflow-y: auto; transform: translateZ(0); box-shadow: 0 0 30px rgba(0,0,0,.12); }
  .layui-layer { left: 50% !important; margin-left: 0; transform: translateX(-50%); max-width: 400px; }
  .layui-layer-shade { width: 100% !important; }
  body .today-date { margin-top: 0.06rem; }
}
