/* ONEMORE · 高通透液态玻璃 v2
   取消 WP 磁贴与莫兰迪四色色块；桌面端工作台 / 手机端单列导航。 */

:root {
  --hg-ink: #263044;
  --hg-muted: #6E7890;
  --hg-brand: #6477D8;
  --hg-brand-2: #9B8CE3;
  --hg-line: rgba(255, 255, 255, 0.62);
  --hg-glass: rgba(255, 255, 255, 0.39);
  --hg-glass-strong: rgba(255, 255, 255, 0.64);
  --hg-glass-subtle: rgba(255, 255, 255, 0.26);
  --hg-shadow: 0 20px 54px rgba(55, 73, 137, 0.16), 0 4px 14px rgba(61, 76, 133, 0.08);
  --hg-shadow-float: 0 14px 30px rgba(65, 82, 150, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.56);
  --hg-radius: 22px;
  --hg-radius-sm: 15px;
  /* 控制玻璃特效成本：大面积内容使用轻模糊，Dock/弹窗仍保留质感。 */
  --hg-blur: 14px;
}

/* v8 welcome: share the live home canvas; intentionally lightweight for Android WebView. */
#welcomeOverlay.welcome-glass-overlay {
  background:rgba(242,240,234,.14) !important;
  animation:none !important;
  backdrop-filter:blur(4px) saturate(108%) !important;
  -webkit-backdrop-filter:blur(4px) saturate(108%) !important;
}
#welcomeOverlay.welcome-glass-overlay::before,
#welcomeOverlay.welcome-glass-overlay::after,
#welcomeOverlay .welcome-orb { display:none !important; }
#welcomeOverlay .welcome-glass-card {
  width:min(100% - 28px,460px) !important;
  padding:22px 16px 20px !important;
  border:1px solid rgba(255,255,255,.76) !important;
  border-radius:30px !important;
  color:#324333 !important;
  background:rgba(246,247,239,.40) !important;
  box-shadow:0 14px 36px rgba(57,66,47,.15),inset 0 1px 0 rgba(255,255,255,.82) !important;
  backdrop-filter:blur(12px) saturate(116%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(116%) !important;
}
#welcomeOverlay .welcome-logo { width:82px !important; height:82px !important; margin-bottom:10px !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
#welcomeOverlay .welcome-brand { color:#354637 !important; text-shadow:none !important; font-size:29px !important; }
#welcomeOverlay .welcome-family-label { margin:12px 0 7px !important; color:#5a705d !important; text-shadow:none !important; }
#welcomeOverlay .welcome-family { gap:8px 5px !important; padding:10px 8px !important; border-radius:22px !important; background:rgba(255,255,255,.29) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.68) !important; backdrop-filter:blur(8px) !important; -webkit-backdrop-filter:blur(8px) !important; }
#welcomeOverlay .welcome-family-member { color:#405542 !important; text-shadow:none !important; }
#welcomeOverlay .welcome-family-member i { width:39px !important; height:39px !important; box-shadow:0 5px 12px rgba(54,72,52,.13),inset 0 1px 0 rgba(255,255,255,.6) !important; }
#welcomeOverlay .welcome-glass-card .welcome-enter { min-height:54px !important; margin-top:17px !important; color:#fff !important; background:rgba(80,112,84,.68) !important; box-shadow:0 8px 20px rgba(49,76,53,.16),inset 0 1px 0 rgba(255,255,255,.5) !important; backdrop-filter:blur(8px) !important; -webkit-backdrop-filter:blur(8px) !important; }

/* Mobile home: announcements are a glanceable summary, not a second full card. */
@media (max-width:768px) {
  body[data-page="home"] .notice-board { padding:8px 10px !important; margin-bottom:8px !important; border-radius:17px !important; }
  body[data-page="home"] .notice-board-head { min-height:28px; margin-bottom:4px !important; align-items:center !important; }
  body[data-page="home"] .notice-bell { width:25px !important; height:25px !important; border-radius:9px !important; }
  body[data-page="home"] .notice-bell svg { width:14px !important; height:14px !important; }
  body[data-page="home"] .notice-eyebrow, body[data-page="home"] .notice-live { display:none !important; }
  body[data-page="home"] .notice-title { margin:0 !important; font-size:14px !important; line-height:1 !important; }
  body[data-page="home"] .notice-message { display:flex; align-items:center; gap:8px; min-height:34px; padding:6px 8px !important; border-radius:11px !important; }
  body[data-page="home"] .notice-message-content { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px !important; line-height:1.25 !important; }
  body[data-page="home"] .notice-message-footer { flex:0 0 auto; min-height:0; margin:0 !important; }
  body[data-page="home"] .notice-message-meta { display:none !important; }
  body[data-page="home"] .notice-receipt { margin:0 !important; }
  body[data-page="home"] .notice-receive-btn { min-height:26px; padding:0 9px; font-size:11px; }
  body[data-page="home"] .notice-received { font-size:10px !important; }
  body[data-page="home"] .notice-receipt-admin { display:none !important; }
}

/* Liquid Glass refinement v6.1 — mobile visual consistency and safe overlays. */
@media (max-width:768px) {
  /* Keep the daily "add customer" action legible above the pale material layer. */
  body[data-page="daily"] .add-row button,
  body[data-page="daily"] .mobile-add-row button {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:46px !important;
    color:#fff !important;
    background:rgba(58,91,67,.92) !important;
    border:1px solid rgba(255,255,255,.45) !important;
    box-shadow:0 8px 18px rgba(36,68,45,.20), inset 0 1px 0 rgba(255,255,255,.28) !important;
    text-shadow:0 1px 1px rgba(20,42,26,.20) !important;
  }

  /* Member uses the same 14px mobile edge as the daily report. */
  body[data-page="member"] .member-app {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:12px 14px calc(110px + env(safe-area-inset-bottom)) !important;
    box-sizing:border-box !important;
  }
  body[data-page="member"] .member-sidebar,
  body[data-page="member"] .detail-panel { width:100% !important; max-width:none !important; }

  /* A profile sheet is a focused task: the floating dock must never cover it. */
  #om-tabbar.om-dock-v3 {
    transition:transform .30s cubic-bezier(.2,.8,.2,1), opacity .20s ease !important;
  }
  body.profile-sheet-open #om-tabbar {
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(calc(100% + 34px)) !important;
  }

  /* Remove the old rectangular page backdrop; make the welcome area a single rounded material plane. */
  body[data-page="home"] .portal {
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  body[data-page="home"] .home-overview {
    margin:12px 12px 14px !important;
    padding:16px !important;
    overflow:hidden !important;
    border:1px solid rgba(255,255,255,.68) !important;
    border-radius:28px !important;
    background:rgba(248,247,240,.34) !important;
    box-shadow:0 14px 30px rgba(50,58,46,.10), inset 0 1px 0 rgba(255,255,255,.70) !important;
    backdrop-filter:blur(16px) saturate(118%) !important;
    -webkit-backdrop-filter:blur(16px) saturate(118%) !important;
  }
}

/* Leave approval inbox: a compact operational queue, visible only to administrators. */
.leave-approval-inbox{margin:0 0 12px;padding:12px 14px;border:1px solid rgba(255,255,255,.78);border-radius:19px;background:linear-gradient(145deg,rgba(255,255,252,.72),rgba(228,239,227,.48));box-shadow:0 10px 24px rgba(57,81,60,.10),inset 0 1px rgba(255,255,255,.88);backdrop-filter:blur(18px) saturate(1.12);-webkit-backdrop-filter:blur(18px) saturate(1.12)}
.leave-request-confirm-mask{z-index:16000!important;background:rgba(48,39,29,.32)!important;backdrop-filter:blur(17px) saturate(1.15)!important;-webkit-backdrop-filter:blur(17px) saturate(1.15)!important}
.leave-request-confirm{width:min(330px,calc(100vw - 42px));padding:26px 24px 22px;text-align:center;border:1px solid rgba(255,255,255,.82);border-radius:27px;background:linear-gradient(145deg,rgba(255,255,252,.84),rgba(224,239,226,.72));box-shadow:0 25px 72px rgba(47,36,25,.28),inset 0 1px rgba(255,255,255,.94);backdrop-filter:blur(28px) saturate(1.2);-webkit-backdrop-filter:blur(28px) saturate(1.2)}
.leave-request-confirm-icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 12px;border:1px solid rgba(255,255,255,.74);border-radius:17px;background:linear-gradient(135deg,#5a8964,#83a98b);box-shadow:0 8px 18px rgba(58,102,69,.22),inset 0 1px rgba(255,255,255,.36);color:#fff;font-size:25px;font-weight:800}.leave-request-confirm small{color:#9a7b50;font-size:10px;font-weight:800;letter-spacing:.15em}.leave-request-confirm h3{margin:6px 0 8px;color:#304234;font-size:20px;line-height:1.2}.leave-request-confirm p{margin:0;color:#6c7568;font-size:13px;line-height:1.65}.leave-request-confirm button{width:100%;min-height:43px;margin-top:19px;border:1px solid rgba(255,255,255,.72);border-radius:14px;background:#4e7357;box-shadow:0 8px 16px rgba(53,89,61,.18),inset 0 1px rgba(255,255,255,.28);color:#fff;font-size:14px;font-weight:750;cursor:pointer}
.leave-approval-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;color:#75816f;font-size:11px}.leave-approval-head small{display:block;color:#9a7b50;font-size:9px;font-weight:800;letter-spacing:.14em}.leave-approval-head strong{display:block;margin-top:2px;color:#314234;font-size:15px}.leave-approval-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid rgba(105,133,106,.12)}.leave-approval-item b{color:#354337;font-size:13px}.leave-approval-item span,.leave-approval-item em{display:block;margin-top:2px;color:#7b806f;font-size:11px;font-style:normal}.leave-approval-actions{display:flex;gap:7px;flex-shrink:0}.leave-approval-actions button{min-height:31px;padding:0 11px;border-radius:11px;font-size:12px;font-weight:700;cursor:pointer}.leave-reject-btn{border:1px solid rgba(172,108,96,.22);background:rgba(255,250,247,.64);color:#a16158}.leave-approve-btn{border:1px solid rgba(255,255,255,.74);background:#4e7357;color:#fff;box-shadow:0 5px 12px rgba(53,89,61,.18)}

/* Welcome uses the same calm spa material, rather than the former purple gradient and decorative orbs. */
.welcome-glass-overlay {
  background:rgba(38,48,38,.24) url('assets/spa-material-background-v1.png') center/cover !important;
  background-blend-mode:soft-light !important;
  backdrop-filter:blur(18px) saturate(110%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(110%) !important;
}
.welcome-glass-overlay .welcome-orb { display:none !important; }
.welcome-glass-card {
  color:#243128 !important;
  border:1px solid rgba(255,255,255,.76) !important;
  border-radius:32px !important;
  background:rgba(248,247,240,.52) !important;
  box-shadow:0 28px 68px rgba(31,43,33,.20), inset 0 1px 0 rgba(255,255,255,.82) !important;
  backdrop-filter:blur(28px) saturate(125%) brightness(1.06) !important;
  -webkit-backdrop-filter:blur(28px) saturate(125%) brightness(1.06) !important;
}
.welcome-glass-card .welcome-enter,
.welcome-enter {
  color:#fff !important;
  border:1px solid rgba(255,255,255,.42) !important;
  background:rgba(58,91,67,.90) !important;
  box-shadow:0 10px 24px rgba(36,68,45,.22), inset 0 1px 0 rgba(255,255,255,.28) !important;
}

html { background: #E7ECFF; }

body {
  color: var(--hg-ink) !important;
  background:
    radial-gradient(circle at 4% 5%, rgba(129, 157, 255, 0.64), transparent 26rem),
    radial-gradient(circle at 90% 2%, rgba(224, 180, 255, 0.58), transparent 29rem),
    radial-gradient(circle at 84% 88%, rgba(153, 231, 220, 0.50), transparent 27rem),
    radial-gradient(circle at 12% 89%, rgba(255, 222, 179, 0.48), transparent 25rem),
    linear-gradient(135deg, #DCE6FF 0%, #F7EDFF 44%, #DFF7F4 100%) !important;
  background-attachment: scroll !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 降低页面转场期间的大面积合成与重绘；保留视觉层次但避免每张卡都高成本模糊。 */
.header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
.modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box,
.login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card,
.perf-panel, .chart-card, .summary-card, #attendanceBoard {
  backdrop-filter: blur(14px) saturate(125%);
  -webkit-backdrop-filter: blur(14px) saturate(125%);
  box-shadow: 0 12px 28px rgba(55,73,137,.12), 0 2px 8px rgba(61,76,133,.06) !important;
}

@media (max-width:768px) {
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box,
  .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card,
  .perf-panel, .chart-card, .summary-card, #attendanceBoard {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(255,255,255,.74) !important;
  }
}

/* v4 material system: restrained liquid glass without changing page structure. */
:root {
  --om-ink: #26312a;
  --om-muted: #6c756d;
  --om-accent: #58755c;
  --om-accent-strong: #405d49;
  --om-canvas: #f2f0ea;
  --om-surface: rgba(255, 255, 255, .62);
  --om-glass: rgba(248, 249, 244, .48);
  --om-glass-strong: rgba(255, 255, 252, .72);
  --om-line: rgba(255, 255, 255, .76);
  --om-shadow: 0 18px 42px rgba(47, 55, 45, .10), 0 2px 8px rgba(47, 55, 45, .06);
  --om-shadow-float: 0 24px 56px rgba(41, 50, 40, .15), 0 4px 14px rgba(41, 50, 40, .08);
}

html { background: var(--om-canvas) !important; }
body {
  color: var(--om-ink) !important;
  background: #f2f0ea !important;
  background-image: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,252,.62), rgba(234,239,230,.34));
}

/* Reset the old blue/purple material treatment without changing dimensions. */
.header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
.admin-section, .dm-toolbar, .table-card, .search-box, .login-box, .stat-card,
.clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card,
.summary-card, #attendanceBoard, .portal-header, .result-box, .detail-card,
.admin-card, .data-card, .home-overview, .notice-board, .home-room-board,
.home-leaderboard, .profile-sheet, .room-status-confirm-dialog {
  border-color: rgba(255,255,255,.72) !important;
  background: var(--om-surface) !important;
  box-shadow: 0 10px 26px rgba(47,55,45,.075), inset 0 1px 0 rgba(255,255,255,.64) !important;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .modal, .profile-sheet, .room-status-confirm-dialog, .welcome-glass-card,
  #om-tabbar.om-dock-v3, .home-clock-status, .home-attendance-status,
  .home-status-card, .portal-account, .date-nav-btn, .back-btn {
    background: var(--om-glass) !important;
    backdrop-filter: blur(22px) saturate(122%) brightness(1.04) !important;
    -webkit-backdrop-filter: blur(22px) saturate(122%) brightness(1.04) !important;
  }
}

/* Only interaction surfaces float; records and tables remain grounded. */
.modal, .profile-sheet, .room-status-confirm-dialog, .welcome-glass-card,
#om-tabbar.om-dock-v3, .portal-account, .home-status-card {
  border: 1px solid var(--om-line) !important;
  box-shadow: var(--om-shadow-float), inset 0 1px 0 rgba(255,255,255,.86) !important;
}
.modal, .profile-sheet, .room-status-confirm-dialog { border-radius: 24px !important; }
.table-card, .dm-table, .perf-table, .admin-table, .calendar { box-shadow: none !important; }
.dm-table th, .perf-table th, .admin-table th, .calendar th {
  color: #4c5e4f !important;
  background: rgba(223, 230, 219, .58) !important;
}
.dm-table tbody tr:hover td, .perf-table tbody tr:hover td, .admin-table tbody tr:hover td {
  background: rgba(239, 244, 235, .78) !important;
}

/* Unified controls: quiet by default, tactile only on interaction. */
button, a, input, select, textarea, .om-dock-item {
  -webkit-tap-highlight-color: transparent;
}
button, .btn, .save-btn, .login-btn, .notice-publish-btn, .attendance-save,
.room-status-confirm-save, .room-status-confirm-cancel, .date-nav-btn, .back-btn,
.view-tab, .perf-tab, .portal-account, .home-status-card, .home-revenue-card,
.room-status-item, .om-dock-item {
  transition: transform .22s cubic-bezier(.2,.8,.2,1), background-color .22s ease,
    box-shadow .22s ease, border-color .22s ease, opacity .18s ease !important;
}
button:active, .btn:active, .save-btn:active, .login-btn:active, .notice-publish-btn:active,
.attendance-save:active, .room-status-confirm-save:active, .room-status-confirm-cancel:active,
.date-nav-btn:active, .back-btn:active, .portal-account:active, .home-status-card:active,
.home-revenue-card:active, .room-status-item:active, .om-dock-item:active {
  transform: scale(.975) !important;
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible { outline: 2px solid rgba(64,93,73,.72) !important; outline-offset: 3px; }

.login-btn, .save-btn, .notice-publish-btn, .attendance-save, .room-status-confirm-save,
.btn-clock, .perf-tab.active, .view-tab.active {
  color: #fff !important;
  background: var(--om-accent-strong) !important;
  border-color: rgba(255,255,255,.42) !important;
  box-shadow: 0 8px 18px rgba(49,78,56,.20), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
input, select, textarea, .admin-table td input, .admin-table td select {
  color: var(--om-ink) !important;
  border-color: rgba(91,106,91,.20) !important;
  background: rgba(255,255,252,.68) !important;
  box-shadow: inset 0 1px 1px rgba(61,72,59,.04) !important;
}

/* Home: preserve composition while making only its important state controls glass. */
body[data-page="home"] .portal { max-width: 480px; }
body[data-page="home"] .portal-compact-bar { color: var(--om-ink); }
body[data-page="home"] .portal-account {
  border-radius: 999px !important;
  color: var(--om-ink) !important;
}
body[data-page="home"] .home-overview,
body[data-page="home"] .notice-board,
body[data-page="home"] .home-room-board,
body[data-page="home"] .home-leaderboard {
  border-color: rgba(255,255,255,.62) !important;
  background: rgba(255,255,252,.44) !important;
}
body[data-page="home"] .home-status-card {
  border-radius: 20px !important;
  color: var(--om-ink) !important;
}
body[data-page="home"] .home-status-icon,
body[data-page="home"] .home-metric-icon {
  color: var(--om-accent) !important;
  background: rgba(219,229,216,.54) !important;
}
body[data-page="home"] .home-revenue-card {
  color: var(--om-ink) !important;
  border: 1px solid rgba(255,255,255,.68) !important;
  background: rgba(255,255,252,.54) !important;
  box-shadow: 0 10px 24px rgba(47,55,45,.06), inset 0 1px 0 rgba(255,255,255,.7) !important;
}
body[data-page="home"] .home-revenue-card b,
body[data-page="home"] .home-status-card b,
body[data-page="home"] .notice-title,
body[data-page="home"] .home-room-board h2,
body[data-page="home"] .home-leaderboard h2 { color: var(--om-ink) !important; }
body[data-page="home"] .notice-eyebrow, body[data-page="home"] .home-room-board small,
body[data-page="home"] .home-leaderboard-eyebrow { color: #70826f !important; }
body[data-page="home"] .notice-live i, body[data-page="home"] .home-leaderboard-live i {
  background: #6d9872 !important;
  box-shadow: 0 0 0 3px rgba(109,152,114,.14) !important;
}

/* Floating dock stays the one persistent glass object on phone screens. */
#om-tabbar.om-dock-v3 {
  border-color: rgba(255,255,255,.82) !important;
  background: rgba(246,247,241,.64) !important;
  box-shadow: 0 18px 44px rgba(43,52,42,.16), inset 0 1px 0 rgba(255,255,255,.86) !important;
}
#om-tabbar.om-dock-v3 .om-dock-item { color: #687268 !important; }
#om-tabbar.om-dock-v3 .om-dock-item.is-active {
  color: #385943 !important;
  background: rgba(223,232,219,.64) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.64) !important;
}

/* Dialogs get material depth and remain accessible. */
.room-status-confirm-mask, .profile-sheet-mask, .modal-mask {
  background: rgba(37,45,37,.26) !important;
  backdrop-filter: blur(8px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(108%) !important;
}
.room-status-confirm-dialog::before, .welcome-glass-card::before { display: none !important; }
.room-status-confirm-eyebrow, .room-status-confirm-room { color: #6a7d69 !important; }
.room-status-confirm-dialog h2 { color: var(--om-ink) !important; }
.room-status-confirm-flow { background: rgba(255,255,252,.48) !important; }

/* Respect accessibility and lower-end devices: the hierarchy remains without expensive blur. */
@media (prefers-reduced-motion: reduce), (update: slow) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (prefers-contrast: more) {
  body { color: #172017 !important; background: #f7f5ef !important; }
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .admin-section, .dm-toolbar, .table-card, .search-box, .login-box, .stat-card,
  .clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card,
  .summary-card, #attendanceBoard, .portal-header, .result-box, .detail-card,
  .admin-card, .data-card, .home-overview, .notice-board, .home-room-board,
  .home-leaderboard { background: #fffefa !important; border-color: #889187 !important; }
}
@media (max-width: 768px) {
  body::before { background: rgba(255,255,252,.18); }
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .admin-section, .dm-toolbar, .table-card, .search-box, .login-box, .stat-card,
  .clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card,
  .summary-card, #attendanceBoard, .portal-header, .result-box, .detail-card,
  .admin-card, .data-card, .home-overview, .notice-board, .home-room-board,
  .home-leaderboard { background: rgba(255,255,252,.78) !important; }
  #om-tabbar.om-dock-v3 { backdrop-filter: blur(14px) saturate(115%) !important; -webkit-backdrop-filter: blur(14px) saturate(115%) !important; }
}

/* Secondary records and administration views use the same material language as the main workspace. */
.admin-container,.daily-container,.detail-container { position:relative; z-index:1; }
.admin-container { max-width:940px !important; padding:28px 24px 110px !important; }
.admin-header,.daily-header { padding:12px 14px; border:1px solid rgba(255,255,255,.76); border-radius:18px; background:rgba(255,255,255,.36); box-shadow:var(--hg-shadow); }
.admin-card,.summary-card,.data-card,.detail-container .detail-card { border:1px solid rgba(255,255,255,.82) !important; border-radius:22px !important; background:linear-gradient(145deg,rgba(255,255,255,.67),rgba(244,247,255,.34)) !important; box-shadow:var(--hg-shadow) !important; }
.admin-table th,.data-table th { background:rgba(86,103,204,.13) !important; color:#5164b7 !important; }
.admin-table td input,.admin-table td select,.date-picker-wrap input { border-color:rgba(255,255,255,.86) !important; background:rgba(255,255,255,.66) !important; border-radius:12px !important; }
.back-btn,.date-nav-btn { border:1px solid rgba(255,255,255,.78) !important; background:rgba(255,255,255,.50) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.82); }
.detail-container { max-width:1100px !important; padding:25px 22px 110px !important; }
.detail-container .member-header-left .name { font-size:29px; color:#26385e; }
.detail-container .balance-big { color:#5268dd !important; font-size:32px; }
.detail-container .info-item { padding:12px 14px; border:1px solid rgba(255,255,255,.72); border-radius:15px; background:rgba(255,255,255,.42); }
@media(max-width:768px){.admin-container,.daily-container,.detail-container{padding:14px 12px 102px !important}.admin-card,.summary-card,.data-card,.detail-container .detail-card{border-radius:19px !important}.admin-header,.daily-header{padding:9px 10px}.detail-container .member-header-left .name{font-size:24px}.detail-container .balance-big{font-size:28px}.detail-container .info-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}.admin-table{min-width:650px}}

/* Performance profile: mobile favors stable, opaque material over expensive real-time compositing. */
@media (min-width:769px) {
  .header,.view-tabs,.card,.calendar,.today-leaves,.staff-card,.overview-item,.modal,.login-box,.admin-section,.dm-toolbar,.table-card,.search-box,.login-card,.stat-card,.clock-card,.history-card,.member-detail,.member-card,.perf-panel,.chart-card,.summary-card,#attendanceBoard {
    backdrop-filter:blur(8px) saturate(118%) !important;
    -webkit-backdrop-filter:blur(8px) saturate(118%) !important;
  }
  #om-tabbar.om-dock-v3 { backdrop-filter:blur(10px) saturate(125%) !important; -webkit-backdrop-filter:blur(10px) saturate(125%) !important; }
}
@media (max-width:768px) {
  html { scroll-behavior:auto !important; }
  body { background:#edf2ff !important; }
  #om-watermark { opacity:.58; background-size:760px 520px; }
  .header,.view-tabs,.card,.calendar,.today-leaves,.staff-card,.overview-item,.modal,.login-box,.admin-section,.dm-toolbar,.table-card,.search-box,.login-card,.stat-card,.clock-card,.history-card,.member-detail,.member-card,.perf-panel,.chart-card,.summary-card,#attendanceBoard,.portal-header,.result-box,.detail-card {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:0 3px 10px rgba(61,76,133,.07) !important;
  }
  .member-item,.member-quick-item,.mobile-record-card,.history-card,.leave-badge,.portal-card { box-shadow:none !important; }
  .desktop-glass-rail { display:none !important; }
  #om-tabbar.om-dock-v3 { contain:layout paint style; transform:translateZ(0); }
  .dm-table,.calendar table,.perf-table { contain:paint; }
}
@media (prefers-reduced-motion: reduce), (update: slow) {
  *,*::before,*::after { animation:none !important; transition:none !important; }
}

/* Compact layouts become vertical records, including WebViews that report a wide phone viewport. */
@media (max-width:1200px) {
  body[data-page="perf"] [style*="overflow-x:auto"] { overflow-x:visible !important; }
  body[data-page="perf"] .perf-mobile-today,
  body[data-page="perf"] .perf-mobile-dashboard,
  body[data-page="perf"] .perf-mobile-input,
  body[data-page="perf"] .perf-mobile-staff,
  body[data-page="perf"] .perf-mobile-employee { display:block; width:100% !important; min-width:0 !important; background:transparent !important; box-shadow:none !important; }
  body[data-page="perf"] .perf-mobile-today thead,
  body[data-page="perf"] .perf-mobile-dashboard thead,
  body[data-page="perf"] .perf-mobile-input thead,
  body[data-page="perf"] .perf-mobile-staff thead,
  body[data-page="perf"] .perf-mobile-employee thead { display:none; }
  body[data-page="perf"] .perf-mobile-today tbody,
  body[data-page="perf"] .perf-mobile-dashboard tbody,
  body[data-page="perf"] .perf-mobile-input tbody,
  body[data-page="perf"] .perf-mobile-staff tbody,
  body[data-page="perf"] .perf-mobile-employee tbody { display:block; }
  body[data-page="perf"] .perf-mobile-today tr,
  body[data-page="perf"] .perf-mobile-dashboard tr,
  body[data-page="perf"] .perf-mobile-input tr,
  body[data-page="perf"] .perf-mobile-staff tr,
  body[data-page="perf"] .perf-mobile-employee tr { display:grid; grid-template-columns:1fr 1fr; gap:0; margin:0 0 12px; padding:7px; border:1px solid rgba(255,255,255,.86); border-radius:18px; background:rgba(255,255,255,.90); box-shadow:0 5px 14px rgba(61,76,133,.07); }
  body[data-page="perf"] .perf-mobile-today td,
  body[data-page="perf"] .perf-mobile-dashboard td,
  body[data-page="perf"] .perf-mobile-input td,
  body[data-page="perf"] .perf-mobile-staff td,
  body[data-page="perf"] .perf-mobile-employee td { display:flex !important; min-width:0; min-height:42px; padding:7px 8px !important; align-items:center; justify-content:space-between; gap:7px; border:0 !important; border-bottom:1px solid rgba(81,104,220,.08) !important; white-space:normal !important; text-align:right !important; font-size:12px; }
  body[data-page="perf"] .perf-mobile-today td::before,
  body[data-page="perf"] .perf-mobile-dashboard td::before,
  body[data-page="perf"] .perf-mobile-input td::before,
  body[data-page="perf"] .perf-mobile-staff td::before,
  body[data-page="perf"] .perf-mobile-employee td::before { content:attr(data-mobile); flex:0 0 auto; color:#74809a; font-size:11px; text-align:left; }
  body[data-page="perf"] .perf-mobile-today td:first-child,
  body[data-page="perf"] .perf-mobile-dashboard td:first-child,
  body[data-page="perf"] .perf-mobile-input td:first-child,
  body[data-page="perf"] .perf-mobile-staff td:first-child,
  body[data-page="perf"] .perf-mobile-employee td:first-child { grid-column:1 / -1; color:#273756; font-weight:760 !important; font-size:15px; background:rgba(85,103,218,.07); border-radius:12px; }
  body[data-page="perf"] .perf-mobile-input td input,
  body[data-page="perf"] .perf-mobile-input td select,
  body[data-page="perf"] .perf-mobile-staff td input { width:112px !important; max-width:62%; min-height:31px; font-size:13px !important; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(1)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(1)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(1)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(1)::before { content:'员工'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(2)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(2)::before { content:'出勤'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(3)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(3)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(7)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(3)::before { content:'正常排钟'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(4)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(4)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(8)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(4)::before { content:'点加钟'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(5)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(5)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(9)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(5)::before { content:'加班上钟'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(6)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(6)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(10)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(6)::before { content:'加班时长'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(7)::before, body[data-page="perf"] .perf-mobile-dashboard td:nth-child(2)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(6)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(2)::before { content:'总钟数'; }
  body[data-page="perf"] .perf-mobile-today td:nth-child(8)::before { content:'实际提成'; } body[data-page="perf"] .perf-mobile-today td:nth-child(9)::before { content:'保底/天'; } body[data-page="perf"] .perf-mobile-today td:nth-child(10)::before { content:'业绩奖金'; } body[data-page="perf"] .perf-mobile-today td:nth-child(11)::before { content:'激励奖金'; } body[data-page="perf"] .perf-mobile-today td:nth-child(12)::before { content:'其他'; } body[data-page="perf"] .perf-mobile-today td:nth-child(13)::before { content:'备注'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(7)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(11)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(7)::before { content:'充值金额'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(8)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(12)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(8)::before { content:'业绩奖金'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(9)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(13)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(9)::before { content:'激励奖金'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(10)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(14)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(10)::before { content:'其他'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(11)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(15)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(11)::before { content:'薪资'; }
  body[data-page="perf"] .perf-mobile-dashboard td:nth-child(12)::before, body[data-page="perf"] .perf-mobile-input td:nth-child(16)::before, body[data-page="perf"] .perf-mobile-employee td:nth-child(12)::before { content:'备注'; }
  body[data-page="perf"] .perf-mobile-input td:nth-child(3)::before { content:'班次'; } body[data-page="perf"] .perf-mobile-input td:nth-child(4)::before { content:'上班'; } body[data-page="perf"] .perf-mobile-input td:nth-child(5)::before { content:'下班'; }
  body[data-page="perf"] .perf-mobile-staff td:nth-child(1)::before { content:'姓名'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(2)::before { content:'角色'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(3)::before { content:'门店'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(4)::before { content:'基准提成'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(5)::before { content:'每日餐补'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(6)::before { content:'住宿'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(7)::before { content:'保底'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(8)::before { content:'应出勤'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(9)::before { content:'实际出勤'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(10)::before { content:'每天保底'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(11)::before { content:'备注'; } body[data-page="perf"] .perf-mobile-staff td:nth-child(12)::before { content:'操作'; }
  body[data-page="perf"] .perf-mobile-employee td[colspan] { grid-column:1 / -1; justify-content:center; } body[data-page="perf"] .perf-mobile-employee td[colspan]::before { display:none; }
}

/* All-system finishing pass: shared compositional rhythm for home, performance, leave, daily and attendance. */
body[data-page="performance"] .perf-app,
body[data-page="leave"] .container,
body[data-page="clock"] .clock-container { position:relative; z-index:1; }
body[data-page="performance"] .login-grid {
  width:min(620px,calc(100% - 32px)); margin:34px auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px;
}
body[data-page="performance"] .login-card {
  min-height:136px; display:flex; flex-direction:column; justify-content:center; border:1px solid rgba(255,255,255,.84) !important;
  border-radius:22px !important; background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(242,246,255,.42)) !important;
  box-shadow:0 14px 32px rgba(70,88,160,.13),inset 0 1px 0 rgba(255,255,255,.86) !important;
}
body[data-page="performance"] .login-card:hover { transform:translateY(-4px); box-shadow:0 20px 42px rgba(70,88,160,.19),inset 0 1px 0 rgba(255,255,255,.9) !important; }
body[data-page="performance"] .login-card .avatar { box-shadow:0 8px 18px rgba(87,102,201,.24),inset 0 1px 0 rgba(255,255,255,.42); }
body[data-page="performance"] .perf-tabs { gap:7px; padding:5px; border-radius:18px; background:rgba(255,255,255,.40); border:1px solid rgba(255,255,255,.72); }
body[data-page="performance"] .perf-tab { border-radius:13px !important; }
body[data-page="performance"] .perf-tab.active { background:linear-gradient(135deg,#5268dd,#9178e6) !important; box-shadow:0 7px 16px rgba(74,93,206,.24); }
body[data-page="performance"] .perf-table { overflow:hidden; border:1px solid rgba(255,255,255,.78); border-radius:18px; }
body[data-page="performance"] .salary-detail { border:1px solid rgba(255,255,255,.78); border-radius:20px; background:rgba(255,255,255,.48); box-shadow:var(--hg-shadow); }

body[data-page="leave"] .leave-page-bar { gap:12px; }
body[data-page="leave"] .leave-control-strip { padding:9px 12px; border:1px solid rgba(255,255,255,.74); border-radius:18px; background:rgba(255,255,255,.34); }
body[data-page="leave"] .overview-item { min-height:88px; display:flex; flex-direction:column; justify-content:center; }
body[data-page="leave"] .overview-value { color:#5168dc !important; font-weight:760; }
body[data-page="leave"] .calendar { border-radius:22px; overflow:auto; border:1px solid rgba(255,255,255,.78); box-shadow:var(--hg-shadow); }
body[data-page="leave"] .calendar th { background:linear-gradient(135deg,rgba(78,96,203,.92),rgba(137,115,220,.86)) !important; }
body[data-page="leave"] .leave-badge { box-shadow:0 4px 10px rgba(111,97,173,.18); }

body[data-page="daily"] .dm-toolbar { position:relative; padding:15px 18px !important; }
body[data-page="daily"] .stats-row .stat-card { min-height:72px; border-radius:18px !important; }
body[data-page="daily"] .stat-card .stat-icon { border-radius:13px; }
body[data-page="daily"] .dm-table th { letter-spacing:.15px; }
body[data-page="daily"] .dm-table tbody tr:hover td { background:rgba(235,240,255,.72) !important; }
body[data-page="daily"] .sum-row td { background:rgba(224,230,255,.72) !important; }

body[data-page="clock"] .clock-container { width:min(980px,calc(100% - 32px)); margin:0 auto; padding:34px 0 112px; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(300px,.85fr); gap:22px; }
body[data-page="clock"] .clock-card { min-height:338px; border-radius:28px !important; background:linear-gradient(145deg,rgba(255,255,255,.74),rgba(244,247,255,.42)) !important; box-shadow:0 22px 48px rgba(70,88,160,.15),inset 0 1px 0 rgba(255,255,255,.9) !important; }
body[data-page="clock"] .clock-time { color:#3e51b8 !important; letter-spacing:-1px; }
body[data-page="clock"] .btn-clock { border-radius:17px !important; background:linear-gradient(135deg,#5268dd,#9178e6) !important; box-shadow:0 12px 22px rgba(74,93,206,.25),inset 0 1px 0 rgba(255,255,255,.44); }
body[data-page="clock"] .history-card { border:1px solid rgba(255,255,255,.78); border-radius:17px !important; background:rgba(255,255,255,.48) !important; }

@media (max-width:768px) {
  body[data-page="performance"] .login-grid { width:calc(100% - 28px); grid-template-columns:repeat(2,minmax(0,1fr)); margin:22px auto 100px; gap:11px; }
  body[data-page="performance"] .login-card { min-height:122px; border-radius:19px !important; }
  body[data-page="performance"] .perf-tabs { overflow-x:auto; padding:4px; }
  body[data-page="performance"] .perf-tab { white-space:nowrap; flex:0 0 auto; }
  body[data-page="leave"] .container { padding:14px 12px 100px !important; }
  body[data-page="leave"] .overview { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:9px !important; }
  body[data-page="leave"] .overview-item { min-height:76px; padding:11px !important; }
  body[data-page="daily"] .dm-container { padding:12px 10px 100px !important; }
  body[data-page="daily"] .stats-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px !important; }
  body[data-page="daily"] .stats-row .stat-card { min-height:65px; padding:10px !important; }
  body[data-page="clock"] .clock-container { width:100%; box-sizing:border-box; margin:0; padding:16px 13px 102px; display:block; }
  body[data-page="clock"] .clock-card { min-height:0; padding:25px 18px !important; border-radius:23px !important; }
  body[data-page="clock"] .history-title { margin-top:18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

/* 欢迎页：独立的高通透液态玻璃欢迎层。 */
.welcome-glass-overlay {
  position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center;
  overflow:hidden; cursor:pointer;
  background:
    radial-gradient(circle at 8% 10%, rgba(130,157,255,.72), transparent 28rem),
    radial-gradient(circle at 91% 8%, rgba(229,182,255,.65), transparent 31rem),
    radial-gradient(circle at 82% 88%, rgba(135,229,213,.60), transparent 30rem),
    radial-gradient(circle at 12% 84%, rgba(255,211,168,.52), transparent 27rem),
    linear-gradient(135deg,#DDE7FF 0%,#F9EEFF 48%,#DDF8F2 100%);
}
.welcome-glass-card {
  position:relative; width:min(410px, calc(100vw - 40px)); overflow:hidden;
  padding:46px 36px 38px; text-align:center; color:#263044; cursor:default;
  border:1px solid rgba(255,255,255,.78); border-radius:32px;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(255,255,255,.28));
  box-shadow:0 28px 70px rgba(61,76,133,.24), inset 0 1px 0 rgba(255,255,255,.88);
  backdrop-filter:blur(30px) saturate(155%); -webkit-backdrop-filter:blur(30px) saturate(155%);
}
.welcome-glass-card::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.35),transparent 38%); pointer-events:none; }
.welcome-orb { position:absolute; border-radius:50%; filter:blur(1px); opacity:.7; pointer-events:none; }
.welcome-orb-a { width:180px; height:180px; top:-76px; left:-70px; background:radial-gradient(circle at 40% 40%,rgba(255,255,255,.9),rgba(132,153,250,.30) 46%,transparent 70%); }
.welcome-orb-b { width:170px; height:170px; right:-70px; bottom:-76px; background:radial-gradient(circle at 40% 40%,rgba(255,255,255,.9),rgba(121,220,203,.30) 46%,transparent 70%); }
.welcome-logo { position:relative; z-index:1; width:88px; height:88px; object-fit:contain; padding:10px; margin:0 auto 20px; display:block; border-radius:28px; background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.88); box-shadow:0 12px 24px rgba(65,82,150,.17), inset 0 1px 0 #fff; }
.welcome-brand { position:relative; z-index:1; font-size:30px; line-height:1.1; font-weight:850; letter-spacing:3px; color:#293450; }
.welcome-slogan { position:relative; z-index:1; margin-top:12px; color:#596681; font-size:17px; letter-spacing:4px; font-weight:500; }
.welcome-divider { position:relative; z-index:1; width:54px; height:2px; margin:24px auto 20px; border-radius:9px; background:linear-gradient(90deg,#6679DD,#A999E9); }
.welcome-note { position:relative; z-index:1; color:#68738A; font-size:14px; letter-spacing:.8px; }
.welcome-enter { position:relative; z-index:1; width:100%; margin-top:30px; padding:14px 20px; border:1px solid rgba(255,255,255,.70); border-radius:17px; color:white; background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 14px 26px rgba(100,119,216,.30), inset 0 1px 0 rgba(255,255,255,.38); font:700 15px/1 inherit; letter-spacing:1px; cursor:pointer; transition:transform .18s ease, box-shadow .18s ease; }
.welcome-enter:hover { transform:translateY(-2px); box-shadow:0 18px 30px rgba(100,119,216,.38), inset 0 1px 0 rgba(255,255,255,.42); }
.welcome-enter span { margin-left:8px; font-size:18px; vertical-align:-1px; }
@media (max-width:480px) {
  .welcome-glass-card { width:calc(100vw - 42px); padding:40px 26px 30px; border-radius:28px; backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(255,255,255,.82); }
  .welcome-logo { width:78px; height:78px; border-radius:24px; }
  .welcome-brand { font-size:25px; letter-spacing:2.5px; }
  .welcome-slogan { font-size:15px; letter-spacing:3px; }
}

/* 手机欢迎页是独立的入场画面：整屏承载，而不是悬在背景上的半张卡片。 */
@media (max-width:768px) {
  .welcome-glass-overlay { align-items:stretch; min-height:100dvh; }
  .welcome-glass-card {
    width:100vw; min-height:100dvh; box-sizing:border-box; margin:0; padding:calc(env(safe-area-inset-top) + 82px) 32px calc(env(safe-area-inset-bottom) + 58px);
    border:0; border-radius:0; background:linear-gradient(145deg,rgba(255,255,255,.48),rgba(255,255,255,.18));
    box-shadow:none; display:flex; flex-direction:column; justify-content:center;
  }
  .welcome-logo { width:92px; height:92px; padding:11px; margin-bottom:23px; }
  .welcome-enter { margin-top:42px; min-height:58px; border-radius:20px; font-size:16px; }
}

/* 通用高通透玻璃语言 */
.header,
.view-tabs,
.card,
.calendar,
.today-leaves,
.staff-card,
.overview-item,
.modal,
.login-box,
.admin-section,
.dm-toolbar,
.table-card,
.search-box,
.login-card,
.stat-card,
.clock-card,
.history-card,
.member-detail,
.member-card,
.perf-panel,
.chart-card,
.summary-card,
#attendanceBoard {
  color: var(--hg-ink) !important;
  background: var(--hg-glass) !important;
  border: 1px solid var(--hg-line) !important;
  box-shadow: var(--hg-shadow) !important;
  backdrop-filter: blur(var(--hg-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--hg-blur)) saturate(145%);
}

/* 现网底部导航由 tabbar.js 注入：将其纳入玻璃风格，而不是重复创建导航。 */
#om-tabbar { background: rgba(255,255,255,.54) !important; border-top: 1px solid rgba(255,255,255,.78) !important; box-shadow: 0 -10px 28px rgba(65,82,150,.12) !important; backdrop-filter: blur(20px) saturate(150%); -webkit-backdrop-filter: blur(20px) saturate(150%); }
#om-tabbar a { color: var(--hg-muted) !important; }
#om-tabbar a[style*="color:#C9A876"] { color: var(--hg-brand) !important; }
.toast { z-index: 10002 !important; }
.lock-overlay, .modal-overlay { z-index: 10001 !important; }

.header {
  background: rgba(255, 255, 255, 0.38) !important;
  color: var(--hg-ink) !important;
  border-radius: 0 0 var(--hg-radius) var(--hg-radius);
  box-shadow: 0 10px 34px rgba(76, 90, 160, 0.12) !important;
}
.header *, .header .month-label, .header .user-selector, .header .sync-status { color: var(--hg-ink) !important; }
.month-nav, .user-selector {
  background: rgba(255, 255, 255, 0.34) !important;
  border: 1px solid rgba(255, 255, 255, 0.66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.month-nav button { background: rgba(255,255,255,.48) !important; color: var(--hg-ink) !important; padding:8px 16px !important; min-width:64px !important; white-space:nowrap !important; }

.btn-primary, .login-btn, .save-btn, .today-btn, .add-row button {
  background: linear-gradient(135deg, #6477D8, #9B8CE3) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .48) !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 24px rgba(100,119,216,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
}
.btn-outline, .logout-btn, .nav-btn, .unlock-btn {
  color: var(--hg-ink) !important;
  background: rgba(255,255,255,.38) !important;
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 13px !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.form-control, .login-input, .search-input, .admin-table td input, .add-account input, .date-section input {
  color: var(--hg-ink) !important;
  background: rgba(255,255,255,.50) !important;
  border: 1px solid rgba(255,255,255,.76) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68);
}
.form-control:focus, .login-input:focus, .search-input:focus, .date-section input:focus {
  box-shadow: 0 0 0 4px rgba(100,119,216,.17), inset 0 1px 0 rgba(255,255,255,.8) !important;
  border-color: rgba(100,119,216,.45) !important;
}

.modal-overlay, .lock-overlay {
  background: rgba(50, 61, 116, 0.22) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.modal, .lock-dialog { background: var(--hg-glass-strong) !important; border: 1px solid var(--hg-line) !important; box-shadow: var(--hg-shadow-float) !important; }

/* 门户桌面端：不再是色块磁贴，改为玻璃工作台入口。 */
.portal { max-width: 1180px !important; padding: 34px 28px 90px !important; }
.portal-header { text-align: left !important; margin-bottom: 28px !important; padding: 24px 26px !important; border-radius: var(--hg-radius) !important; background: var(--hg-glass) !important; border: 1px solid var(--hg-line) !important; box-shadow: var(--hg-shadow) !important; backdrop-filter: blur(var(--hg-blur)) saturate(145%); -webkit-backdrop-filter: blur(var(--hg-blur)) saturate(145%); }
.portal-logo { width: 56px !important; height: 56px !important; float: left; margin: 0 16px 0 0 !important; background: rgba(255,255,255,.58) !important; border: 1px solid var(--hg-line); box-shadow: none !important; }
.portal-title { font-size: 25px !important; color: var(--hg-ink) !important; letter-spacing: .5px !important; padding-top: 2px; }
.portal-subtitle { color: var(--hg-muted) !important; font-size: 13px !important; }
.portal-header::after { content: "电脑端 · 门店工作台"; display: block; clear: both; color: var(--hg-brand); font-size: 12px; margin-top: 11px; }
.top-bar { background: rgba(255,255,255,.32); border: 1px solid var(--hg-line); padding: 10px 14px !important; border-radius: 15px; margin-bottom: 18px !important; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.portal-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px !important; }
.portal-group-title { grid-column: 1 / -1; color: var(--hg-muted) !important; font-size: 13px !important; padding: 5px 2px !important; margin: 12px 0 -6px !important; text-transform: none !important; letter-spacing: .3px !important; }
.portal-card, .portal-card.t-gold, .portal-card.t-green, .portal-card.t-pink, .portal-card.t-brown {
  min-height: 156px !important;
  align-items: flex-end !important;
  padding: 20px !important;
  color: var(--hg-ink) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.52), rgba(255,255,255,.22)) !important;
  border: 1px solid rgba(255,255,255,.70) !important;
  border-radius: var(--hg-radius) !important;
  box-shadow: var(--hg-shadow) !important;
  backdrop-filter: blur(var(--hg-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--hg-blur)) saturate(145%);
}
.portal-card::before { content: ""; position: absolute; width: 96px; height: 96px; top: 12px; right: 12px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.90), rgba(167,180,255,.22) 45%, transparent 68%); pointer-events:none; }
.portal-card:nth-of-type(2)::before { background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(171,229,221,.25) 45%, transparent 68%); }
.portal-card:nth-of-type(3)::before { background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(230,179,255,.26) 45%, transparent 68%); }
.portal-card:nth-of-type(4)::before { background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(255,212,169,.25) 45%, transparent 68%); }
.portal-card:hover { transform: translateY(-4px) !important; opacity: 1 !important; box-shadow: var(--hg-shadow-float) !important; }
.portal-card-icon { position: absolute; top: 18px; left: 18px; width: 42px !important; height: 42px !important; background: rgba(255,255,255,.48) !important; color: transparent !important; border: 1px solid rgba(255,255,255,.72); border-radius: 14px !important; font-size: 0 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
.portal-card-icon::after { content: ""; display:block; width:15px; height:15px; margin:12px; border-radius: 5px; background: linear-gradient(135deg, var(--hg-brand), var(--hg-brand-2)); }
.portal-card-title { color: var(--hg-ink) !important; font-size: 18px !important; font-weight: 720 !important; z-index:1; }
.portal-card-desc { color: var(--hg-muted) !important; z-index:1; }
.portal-card-arrow { color: var(--hg-brand) !important; z-index:1; }
#attendanceBoard { grid-column: span 2; min-height: 156px; border-left: 1px solid var(--hg-line) !important; border-radius: var(--hg-radius) !important; padding: 20px !important; }
#attendanceBoard span { color: var(--hg-ink) !important; }

/* 业务页：桌面端统一为多栏工作台，表格/数据不做过度透明。 */
.container, .dm-container, .member-app, .perf-app { max-width: 1440px !important; }
.member-app { grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) !important; gap: 20px !important; }
.dm-toolbar { border-radius: var(--hg-radius) !important; padding: 14px 18px !important; }
.store-tabs, .clock-status, .stat-item { background: rgba(255,255,255,.30) !important; border: 1px solid rgba(255,255,255,.58) !important; border-radius: 13px !important; }
.store-tab { color: var(--hg-muted) !important; border-radius: 11px !important; }
.store-tab.active { color:#fff !important; background: linear-gradient(135deg,#6477D8,#9B8CE3) !important; box-shadow: 0 7px 15px rgba(100,119,216,.24) !important; }
.stats-row, .stat-grid { gap: 14px !important; }
.stat-card, .stats-row .stat-card, .stat-grid .stat-card, .stats-row .stat-card:nth-child(n), .stat-grid .stat-card:nth-child(n) { background: rgba(255,255,255,.35) !important; color: var(--hg-ink) !important; }
.stats-row .stat-card .stat-val, .stats-row .stat-card .stat-lbl, .stat-grid .stat-card .stat-num, .stat-grid .stat-card .stat-label { color: var(--hg-ink) !important; text-shadow:none !important; }
.table-card { background: rgba(255,255,255,.46) !important; border-radius: var(--hg-radius) !important; }
table th, .dm-table th { background: rgba(77, 91, 157, .72) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
table td, .dm-table td { background: rgba(255,255,255,.55) !important; }
table tr:nth-child(even) td { background: rgba(255,255,255,.40) !important; }

/* 电脑端：固定侧边玻璃导航。手机端不显示此结构。 */
.desktop-glass-rail { display:none; }
@media (min-width: 769px) {
  .desktop-glass-rail { display:flex; position:fixed; z-index:9000; left:22px; top:50%; transform:translateY(-50%); width:76px; padding:13px 8px; flex-direction:column; gap:8px; border-radius:26px; background:rgba(255,255,255,.42); border:1px solid rgba(255,255,255,.72); box-shadow:var(--hg-shadow); backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%); }
  .desktop-glass-rail .rail-brand { width:40px; height:40px; margin:0 auto 6px; border-radius:15px; background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 8px 16px rgba(100,119,216,.28); }
  .desktop-glass-rail a { width:58px; min-height:50px; padding:7px 2px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; border-radius:16px; color:var(--hg-muted); font-size:10px; text-decoration:none; transition:.2s ease; }
  .desktop-glass-rail a::before { content:""; width:17px; height:17px; border-radius:6px; background:rgba(100,119,216,.20); }
  .desktop-glass-rail a:hover, .desktop-glass-rail a.active { color:var(--hg-brand); background:rgba(255,255,255,.52); box-shadow:inset 0 1px 0 rgba(255,255,255,.7); }
  .desktop-glass-rail a.active::before { background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 4px 9px rgba(100,119,216,.24); }
  .desktop-glass-rail ~ .portal, .desktop-glass-rail ~ .container, .desktop-glass-rail ~ .dm-container, .desktop-glass-rail ~ .member-app, .desktop-glass-rail ~ .perf-app, .desktop-glass-rail ~ .clock-container, .desktop-glass-rail ~ #app .container, .desktop-glass-rail ~ #perfApp .perf-app { width:calc(100% - 128px) !important; margin-left:112px !important; margin-right:16px !important; }
  .desktop-glass-rail ~ .header { width:calc(100% - 128px) !important; margin-left:112px !important; margin-right:16px !important; }
  .desktop-glass-rail ~ #app .container, .desktop-glass-rail ~ #perfApp .perf-app { max-width:none !important; }
  .desktop-glass-rail ~ .member-app, .desktop-glass-rail ~ #perfApp .perf-app, .desktop-glass-rail ~ #app .container { margin-top:16px !important; }
  /* 日报桌面工作区：不限制为居中窄栏，铺满左侧导航后的有效桌面宽度。 */
  .desktop-glass-rail ~ .dm-container { width:calc(100vw - 132px) !important; max-width:none !important; margin:16px 16px 16px 112px !important; padding:0 !important; }
  .desktop-glass-rail ~ .dm-container .dm-toolbar, .desktop-glass-rail ~ .dm-container .stats-row, .desktop-glass-rail ~ .dm-container .desktop-daily { width:100% !important; }
  .desktop-glass-rail ~ .dm-container .table-card { width:100% !important; }
}

/* 手机：不复用桌面网格。改为单列、底部玻璃导航、紧凑工具栏。 */
.mobile-glass-nav { display: none; }

@media (max-width: 768px) {
  :root { --hg-blur: 18px; --hg-radius: 19px; }
  body { background-attachment: scroll !important; }
  .portal { padding: 18px 14px 110px !important; }
  .container, .dm-container, .member-app, .perf-app, .clock-container { padding-bottom: 96px !important; }
  .portal-header { text-align: center !important; padding: 21px 16px !important; margin-bottom: 16px !important; }
  .portal-logo { float:none; display:block; margin:0 auto 9px !important; width:52px !important; height:52px !important; }
  .portal-title { font-size:21px !important; }
  .portal-header::after { content:"手机端 · 快捷入口"; margin-top:7px; }
  .portal-cards { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .portal-group-title { margin: 10px 2px -2px !important; }
  .portal-card, .portal-card.t-gold, .portal-card.t-green, .portal-card.t-pink, .portal-card.t-brown { min-height: 122px !important; padding: 15px !important; border-radius: 18px !important; }
  .portal-card:nth-child(2) { grid-column: span 2; min-height: 106px !important; }
  .portal-card-icon { top: 13px; left:13px; width:36px !important; height:36px !important; }
  .portal-card-icon::after { width:13px; height:13px; margin:10px; border-radius:4px; }
  .portal-card-title { font-size:15px !important; }
  .portal-card::before { transform: scale(.72); transform-origin: top right; }
  #attendanceBoard { grid-column: span 2; min-height: auto; padding: 15px !important; border-radius:18px !important; }

  .header { border-radius: 0 0 18px 18px; }
  .header-content { flex-wrap:wrap; }
  .member-app { display:block !important; padding: 12px !important; }
  .member-app > * { margin-bottom:12px; }
  .container, .dm-container, .perf-app { padding: 12px !important; }
  .dm-toolbar { gap:8px; padding:12px !important; }
  .date-section { order: 2; width:100%; margin-left:0 !important; justify-content:space-between; }
  .date-section input { flex:1; }
  .stats-row { display:grid !important; grid-template-columns:1fr 1fr !important; gap:10px !important; }
  .stat-grid { grid-template-columns:1fr 1fr !important; gap:10px !important; }
  .stat-card { min-width:0; padding:12px !important; border-radius:16px !important; }
  .table-card { border-radius:18px !important; max-height: none !important; }
  .clock-container { padding:14px !important; }
  .clock-card { padding:22px 16px !important; border-radius:20px !important; }
  .clock-time { font-size:42px !important; }

  .mobile-glass-nav { display:flex; position:fixed; left:14px; right:14px; bottom: max(12px, env(safe-area-inset-bottom)); height:64px; align-items:center; justify-content:space-around; border-radius:22px; background:rgba(255,255,255,.54); border:1px solid rgba(255,255,255,.78); box-shadow:var(--hg-shadow-float); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%); z-index:8000; }
  .mobile-glass-nav a { font-size:10px; color:var(--hg-muted); text-decoration:none; text-align:center; min-width:48px; }
  .mobile-glass-nav a::before { content:""; display:block; margin:0 auto 4px; width:17px; height:17px; border-radius:6px; background:rgba(100,119,216,.28); }
  .mobile-glass-nav a.active { color:var(--hg-brand); font-weight:700; }
  .mobile-glass-nav a.active::before { background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 4px 8px rgba(100,119,216,.27); }
}

@media (max-width: 480px) {
  :root { --hg-blur: 0px; }
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item, .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box, .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card, .summary-card, #attendanceBoard, .portal-card, .portal-header, .top-bar {
    backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:rgba(255,255,255,.76) !important;
  }
  .portal-card::before { opacity:.5; }
  .mobile-glass-nav { backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(255,255,255,.88); }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item, .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box, .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card, .summary-card, #attendanceBoard, .portal-card, .portal-header, .top-bar { background:rgba(255,255,255,.88) !important; }
}

/* 日报手机端卡片录入：保留卡片模式，避免回退到横向 22 列工作台。 */
.mobile-record-card, .mobile-add-row, .mobile-editor, .mobile-field-group { border-color: rgba(255,255,255,.72) !important; box-shadow: 0 10px 26px rgba(65,82,150,.11); }
.mobile-record-card, .mobile-add-row, .mobile-field-group { background: rgba(255,255,255,.50) !important; backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); }
.mobile-editor { background: rgba(239,244,255,.88) !important; border: 1px solid rgba(255,255,255,.80); backdrop-filter: blur(28px) saturate(145%); -webkit-backdrop-filter: blur(28px) saturate(145%); }
.mobile-add-row, .mobile-done { background: linear-gradient(135deg,#6477D8,#9B8CE3) !important; color: #fff !important; }
.mobile-editor-mask { background: rgba(50,61,116,.26) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.mobile-field input, .mobile-field select { border-color: rgba(255,255,255,.78) !important; background: rgba(255,255,255,.60) !important; }
@media (max-width:480px) {
  .mobile-record-card, .mobile-add-row, .mobile-field-group, .mobile-editor { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:rgba(255,255,255,.84) !important; }
}

/* 首页门店通知：置于考勤展板上方，所有伙伴均可看到最新一条通知。 */
.notice-board {
  position:relative;
  overflow:hidden;
  margin:0 0 18px;
  padding:18px 20px;
  color:#263044;
  border:1px solid rgba(255,255,255,.80);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(255,255,255,.28));
  box-shadow:0 16px 38px rgba(61,76,133,.15), inset 0 1px 0 rgba(255,255,255,.84);
  backdrop-filter:blur(27px) saturate(155%);
  -webkit-backdrop-filter:blur(27px) saturate(155%);
}
.notice-board::before {
  content:"";
  position:absolute;
  width:210px;
  height:210px;
  top:-118px;
  right:-78px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.90) 0,rgba(160,146,235,.28) 35%,transparent 70%);
  pointer-events:none;
}
.notice-board::after {
  content:"";
  position:absolute;
  width:145px;
  height:145px;
  left:-58px;
  bottom:-104px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.74) 0,rgba(129,218,204,.22) 38%,transparent 70%);
  pointer-events:none;
}
.notice-board-head { position:relative; z-index:1; display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:13px; }
.notice-board-title-wrap { display:flex; align-items:center; gap:10px; }
.notice-bell { display:grid; place-items:center; flex:0 0 auto; width:40px; height:40px; border:1px solid rgba(255,255,255,.82); border-radius:14px; color:#fff; background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 8px 17px rgba(100,119,216,.28), inset 0 1px 0 rgba(255,255,255,.42); }
.notice-bell svg { width:20px; height:20px; }
.notice-eyebrow { color:#6477D8; font-size:10px; font-weight:800; letter-spacing:1.2px; line-height:1.1; }
.notice-title { margin-top:3px; color:#2D3A54; font-size:18px; font-weight:780; line-height:1.1; }
.notice-board-actions { display:flex; align-items:center; gap:9px; }
.notice-live { display:inline-flex; align-items:center; gap:5px; padding:6px 9px; border:1px solid rgba(255,255,255,.68); border-radius:999px; color:#5F6D85; background:rgba(255,255,255,.38); font-size:11px; font-weight:650; white-space:nowrap; }
.notice-live i { width:6px; height:6px; border-radius:50%; background:#72C9B5; box-shadow:0 0 0 3px rgba(114,201,181,.16); }
.notice-compose-toggle { min-height:31px; padding:0 11px; border:1px solid rgba(255,255,255,.76); border-radius:11px; color:#fff; background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 7px 14px rgba(100,119,216,.21); font:700 12px/1 inherit; cursor:pointer; }
.notice-board-content { position:relative; z-index:1; }
.notice-message { padding:12px 14px; border:1px solid rgba(255,255,255,.66); border-radius:15px; background:rgba(255,255,255,.30); box-shadow:inset 0 1px 0 rgba(255,255,255,.65); }
.notice-message-content { color:#35425C; font-size:14px; font-weight:560; line-height:1.7; word-break:break-word; }
.notice-message-meta { display:flex; gap:10px; margin-top:8px; color:#748199; font-size:11px; }
.notice-message-meta span + span::before { content:"·"; margin-right:10px; color:#A4AEC0; }
.notice-receipt { display:flex; align-items:center; justify-content:flex-end; min-height:30px; margin-top:9px; }
.notice-receive-btn { min-height:29px; padding:0 12px; border:1px solid rgba(100,119,216,.24); border-radius:999px; color:#5166C6; background:rgba(255,255,255,.58); box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 4px 10px rgba(100,119,216,.10); font:750 12px/1 inherit; cursor:pointer; }
.notice-receive-btn:active { transform:scale(.96); }
.notice-received { padding:6px 10px; border-radius:999px; color:#4F9B86; background:rgba(111,201,181,.13); font-size:11px; font-weight:750; }
.notice-receipt-admin { justify-content:flex-start; gap:8px; flex-wrap:wrap; padding-top:8px; border-top:1px solid rgba(100,119,216,.10); }
.notice-receipt-count { padding:5px 8px; border-radius:999px; color:#5668B4; background:rgba(100,119,216,.10); font-size:11px; font-weight:760; }
.notice-receipt-names { color:#718099; font-size:11px; line-height:1.5; }
.notice-receipt-names.is-empty { color:#A5AEBB; }
.notice-empty { display:flex; align-items:center; justify-content:center; min-height:42px; gap:8px; color:#748199; font-size:13px; }
.notice-empty-icon { display:grid; place-items:center; width:28px; height:28px; border-radius:10px; color:#6477D8; background:rgba(255,255,255,.50); font-size:10px; font-weight:750; }
.notice-admin-panel { position:relative; z-index:1; margin-top:12px; padding-top:13px; border-top:1px solid rgba(255,255,255,.58); }
.notice-admin-caption { margin:0 0 7px; color:#5B6982; font-size:12px; font-weight:720; }
.notice-admin-panel textarea { display:block; box-sizing:border-box; width:100%; min-height:76px; resize:vertical; padding:11px 12px; border:1px solid rgba(255,255,255,.78); border-radius:13px; outline:none; color:#33415C; background:rgba(255,255,255,.45); box-shadow:inset 0 1px 0 rgba(255,255,255,.74); font:13px/1.6 inherit; }
.notice-admin-panel textarea:focus { border-color:rgba(100,119,216,.48); box-shadow:0 0 0 3px rgba(100,119,216,.14), inset 0 1px 0 rgba(255,255,255,.78); }
.notice-admin-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; color:#77839A; font-size:11px; }
.notice-publish-btn { min-height:36px; padding:0 14px; border:1px solid rgba(255,255,255,.72); border-radius:12px; color:#fff; background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 8px 16px rgba(100,119,216,.22); font:700 13px/1 inherit; cursor:pointer; }
.notice-push-option { display:inline-flex; align-items:center; gap:5px; min-height:32px; padding:0 9px; border:1px solid rgba(105,126,216,.18); border-radius:11px; color:#5D6D8D; background:rgba(255,255,255,.42); font-size:11px; white-space:nowrap; }
.notice-push-option input { width:15px; height:15px; accent-color:#687BD8; }

/* Receipt state shares a compact footer with the publish metadata. */
.notice-message { padding-bottom:10px; }
.notice-message-content { line-height:1.58; }
.notice-message-footer { display:flex; align-items:center; gap:8px; min-height:16px; margin-top:7px; }
.notice-message-meta { display:inline-flex !important; align-items:center; gap:10px; flex:0 1 auto; margin:0 !important; color:#748199; font-size:11px; white-space:nowrap; }
.notice-receipt { display:inline-flex !important; align-items:center; min-height:0 !important; margin:0 0 0 auto !important; vertical-align:middle; color:#748199 !important; font-size:11px !important; font-weight:400 !important; line-height:1.3 !important; white-space:nowrap; }
.notice-received { display:inline !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; color:#748199 !important; font-size:11px !important; font-weight:400 !important; line-height:1.3 !important; white-space:nowrap; box-shadow:none !important; }
.notice-message-footer .notice-receipt-admin { width:100%; margin:0 !important; padding-top:6px; }
.notice-history { display:grid; gap:7px; margin-top:12px; }
.notice-history-item { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:10px 11px; border:1px solid rgba(255,255,255,.54); border-radius:12px; background:rgba(255,255,255,.22); }
.notice-history-time { margin-bottom:3px; color:#7A879D; font-size:10px; }
.notice-history-content { color:#4B5870; font-size:12px; line-height:1.55; word-break:break-word; }
.notice-history-item button { flex:0 0 auto; padding:3px 7px; border:0; border-radius:8px; color:#B45E69; background:rgba(224,133,145,.13); font-size:11px; cursor:pointer; }
.notice-history-empty { padding:8px; color:#7A879D; font-size:12px; text-align:center; }

/* Confirmed daily performance is server-locked; make the same state unambiguous in the admin grid. */
.perf-row-locked { background:rgba(81,151,126,.08) !important; }
.perf-row-locked input,
.perf-row-locked select { pointer-events:none; opacity:.48; filter:saturate(.7); }

/* 会员、业绩与休假：移除重复页面标题，把操作收进内容区，留给数据更大的显示面积。 */
.leave-page-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0 0 12px;
}
.leave-page-bar .view-tabs {
  display:flex;
  align-items:stretch;
  gap:6px;
  padding:5px;
  margin:0 !important;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.72);
  border-radius:16px;
  background:rgba(255,255,255,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.76), 0 8px 18px rgba(61,76,133,.08);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}
.leave-page-bar .view-tab {
  min-width:126px;
  min-height:38px;
  padding:0 16px;
  border:1px solid transparent !important;
  border-radius:11px !important;
  color:#65728A !important;
  background:transparent !important;
  box-shadow:none !important;
  font:700 14px/38px inherit;
  transition:color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.leave-page-bar .view-tab.active {
  color:#fff !important;
  background:linear-gradient(135deg,#6477D8,#9B8CE3) !important;
  border-color:rgba(255,255,255,.62) !important;
  box-shadow:0 8px 17px rgba(100,119,216,.28), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
.leave-page-bar .view-tab:not(.active):hover { color:#465572 !important; background:rgba(255,255,255,.48) !important; transform:translateY(-1px); }
.leave-control-strip {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin:0;
}
.leave-control-strip .month-nav {
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px;
  border-radius:14px;
}
.leave-control-strip .month-nav button {
  width:30px;
  height:30px;
  padding:0;
  border:0;
  border-radius:9px;
  cursor:pointer;
  font-size:17px;
  line-height:1;
}
.leave-control-strip .month-nav .leave-today-btn {
  width:auto;
  padding:0 10px;
  font-size:12px;
  font-weight:650;
}
.leave-control-strip .month-label {
  min-width:86px;
  text-align:center;
  color:var(--hg-ink) !important;
  font-size:13px;
  font-weight:750;
}
.leave-control-strip .user-selector,
.leave-user-chip,
.leave-sync-chip {
  min-height:40px;
  box-sizing:border-box;
  padding:0 12px;
  border-radius:13px;
  color:var(--hg-ink) !important;
  background:rgba(255,255,255,.42) !important;
  border:1px solid rgba(255,255,255,.70) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68);
  font:600 13px/38px inherit;
}
.leave-control-strip select.user-selector { line-height:normal; cursor:pointer; }
.leave-sync-chip { display:inline-flex; align-items:center; color:#427A70 !important; }
.leave-sync-chip::before { content:""; width:7px; height:7px; margin-right:6px; border-radius:50%; background:#71BFAE; box-shadow:0 0 0 3px rgba(113,191,174,.16); }

/* 会员页：独立的高通透档案工作台。 */
.member-glass-app {
  align-items:start;
  gap:18px !important;
}
.member-sidebar { min-width:0; }
.member-search-card,
.member-result-card,
.member-detail-panel .detail-card,
.member-detail-panel .chart-card {
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(255,255,255,.26)) !important;
  box-shadow:0 16px 38px rgba(61,76,133,.14), inset 0 1px 0 rgba(255,255,255,.78) !important;
  backdrop-filter:blur(25px) saturate(155%);
  -webkit-backdrop-filter:blur(25px) saturate(155%);
}
.member-search-card::before,
.member-detail-panel .detail-card::before,
.member-detail-panel .chart-card::before {
  content:"";
  position:absolute;
  top:-75px;
  right:-62px;
  width:172px;
  height:172px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.84) 0,rgba(151,171,255,.24) 37%,transparent 70%);
  pointer-events:none;
}
.member-search-card { padding:18px !important; border-radius:22px !important; }
.member-search-label { position:relative; z-index:1; display:flex; align-items:center; gap:8px; margin:0 0 12px; color:#33415E; font-size:14px; font-weight:780; letter-spacing:.3px; }
.member-search-orb { width:10px; height:10px; border-radius:4px; background:linear-gradient(135deg,#6477D8,#A394E8); box-shadow:0 3px 8px rgba(100,119,216,.32); }
.member-search-card .search-input { position:relative; z-index:1; min-height:46px; border:1px solid rgba(255,255,255,.82) !important; background:rgba(255,255,255,.54) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.86); }
.member-search-card .search-hint { position:relative; z-index:1; margin-top:7px; color:#65728A !important; }
.member-search-card .type-tabs { position:relative; z-index:1; gap:7px; margin-top:14px; }
.member-search-card .type-tab { min-height:36px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.72) !important; background:rgba(255,255,255,.40) !important; color:#5D6B84 !important; border-radius:11px !important; font-weight:650; }
.member-search-card .type-tab.active { color:#fff !important; border-color:rgba(255,255,255,.64) !important; background:linear-gradient(135deg,#6477D8,#9B8CE3) !important; box-shadow:0 8px 16px rgba(100,119,216,.25); }
.member-search-card .dm-btn-add { position:relative; z-index:1; min-height:42px; border:1px solid rgba(255,255,255,.62) !important; border-radius:13px !important; background:linear-gradient(135deg,#6477D8,#9B8CE3) !important; box-shadow:0 10px 20px rgba(100,119,216,.25), inset 0 1px 0 rgba(255,255,255,.35); }
.member-result-card { border-radius:22px !important; }
.member-result-card .result-header { padding:13px 16px; border-bottom:1px solid rgba(255,255,255,.60) !important; color:#53617B !important; font-weight:700; }
.member-result-dot { display:inline-block; width:8px; height:8px; margin:0 7px 1px 0; border-radius:50%; background:#8BD1C2; box-shadow:0 0 0 3px rgba(139,209,194,.16); vertical-align:middle; }
.member-result-card .result-count { padding:3px 8px; border-radius:999px; color:#53617B !important; background:rgba(255,255,255,.50); }
.member-result-card .result-list { scrollbar-color:rgba(100,119,216,.35) transparent; scrollbar-width:thin; }
.member-result-card .member-item { min-height:56px; padding:11px 14px; border-bottom:1px solid rgba(255,255,255,.52) !important; background:rgba(255,255,255,.17); }
.member-result-card .member-item:hover { background:rgba(255,255,255,.52) !important; transform:translateX(2px); }
.member-result-card .member-item.active { border-left-color:#6477D8 !important; background:rgba(100,119,216,.12) !important; }
.member-result-card .member-info .name { color:#34415A; }
.member-result-card .member-info .meta,
.member-result-card .member-status .label { color:#748097 !important; }
.member-result-card .member-status .num { color:#6477D8 !important; }
.member-result-card .member-badge { border:1px solid rgba(255,255,255,.72); box-shadow:inset 0 1px 0 rgba(255,255,255,.76); }
.member-detail-panel { gap:16px !important; }
.member-detail-panel .detail-card,
.member-detail-panel .chart-card { padding:20px !important; border-radius:22px !important; }
.member-detail-panel .detail-empty { position:relative; z-index:1; min-height:260px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#63708A !important; }
.member-empty-orb { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 14px; border:1px solid rgba(255,255,255,.82); border-radius:20px; color:#6477D8; background:rgba(255,255,255,.48); box-shadow:0 10px 20px rgba(83,100,170,.13), inset 0 1px 0 #fff; font-size:13px; font-weight:800; }
.member-detail-panel .member-header { position:relative; z-index:1; border-bottom-color:rgba(255,255,255,.65) !important; }
.member-detail-panel .member-header-left .name { color:#2E3B55; }
.member-detail-panel .section-title { position:relative; z-index:1; display:inline-block; padding:7px 11px; border:1px solid rgba(255,255,255,.72); border-radius:11px; background:linear-gradient(135deg,#6477D8,#9B8CE3) !important; box-shadow:0 7px 14px rgba(100,119,216,.20); }
.member-detail-panel .info-grid,
.member-detail-panel .progress-wrap,
.member-detail-panel .chart-title,
.member-detail-panel .stat-row,
.member-detail-panel .records-table { position:relative; z-index:1; }
.member-detail-panel .info-item { padding:10px; border:1px solid rgba(255,255,255,.58); border-radius:13px; background:rgba(255,255,255,.26); }
.member-detail-panel .info-item .label { color:#78849A !important; }
.member-detail-panel .info-item .value { color:#35415A; }
.member-detail-panel .chart-title { color:#35415A !important; }
.member-detail-panel .chart-title::before { background:linear-gradient(#6477D8,#9B8CE3) !important; }
.member-detail-panel .stat-box,
.member-detail-panel .freq-item { border:1px solid rgba(255,255,255,.58); background:rgba(255,255,255,.29) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.62); }
.member-detail-panel .records-table { overflow:hidden; border:1px solid rgba(255,255,255,.55); border-radius:13px; }
.member-detail-panel .records-table th { color:#52607A !important; background:rgba(255,255,255,.44) !important; }
.member-detail-panel .records-table td { background:rgba(255,255,255,.22) !important; border-bottom-color:rgba(255,255,255,.5) !important; }

/* 会员分类列表：用独立玻璃层承载每个类别，避免原米色条状底纹与整体主题割裂。 */
/* 日报桌面表格：从传统白色网格升级为连续的液态玻璃工作台。 */
body[data-page="daily"] .table-card {
  position:relative;
  overflow:auto;
  border:1px solid rgba(255,255,255,.84) !important;
  border-radius:22px !important;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(255,255,255,.26)) !important;
  box-shadow:0 18px 40px rgba(61,76,133,.16), inset 0 1px 0 rgba(255,255,255,.88) !important;
  backdrop-filter:blur(26px) saturate(155%);
  -webkit-backdrop-filter:blur(26px) saturate(155%);
}
body[data-page="daily"] .table-card::before {
  content:"";
  position:absolute;
  z-index:0;
  top:-100px;
  right:-70px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.88),rgba(150,170,255,.22) 42%,transparent 71%);
  pointer-events:none;
}
body[data-page="daily"] .table-card::after {
  z-index:20;
  width:30px;
  background:linear-gradient(90deg,transparent,rgba(226,235,255,.72)) !important;
}
body[data-page="daily"] .dm-table { position:relative; z-index:1; }
body[data-page="daily"] .dm-table th {
  color:#fff !important;
  background:linear-gradient(135deg,rgba(93,111,197,.93),rgba(139,125,213,.88)) !important;
  border-right-color:rgba(255,255,255,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30);
}
body[data-page="daily"] .dm-table th.group-start { border-left-color:rgba(255,255,255,.72) !important; }
body[data-page="daily"] .dm-table td {
  color:#34415A !important;
  border-bottom-color:rgba(255,255,255,.54) !important;
  border-right-color:rgba(255,255,255,.40) !important;
  background:rgba(255,255,255,.30) !important;
}
body[data-page="daily"] .dm-table tbody tr:nth-child(even) td { background:rgba(247,249,255,.42) !important; }
body[data-page="daily"] .dm-table tbody tr:hover td { background:rgba(255,255,255,.64) !important; }
body[data-page="daily"] .dm-table .sticky-col { background:rgba(249,251,255,.70) !important; }
body[data-page="daily"] .dm-table tr:hover .sticky-col { background:rgba(255,255,255,.80) !important; }
body[data-page="daily"] .dm-table th.sticky-col { background:linear-gradient(135deg,rgba(93,111,197,.96),rgba(139,125,213,.93)) !important; }
body[data-page="daily"] .dm-table .sticky-customer { box-shadow:4px 0 11px rgba(82,98,170,.12); }
body[data-page="daily"] .dm-table td input,
body[data-page="daily"] .dm-table td select { color:#33415C !important; background:transparent !important; }
body[data-page="daily"] .dm-table td input:focus,
body[data-page="daily"] .dm-table td select:focus { background:rgba(100,119,216,.12) !important; box-shadow:inset 0 0 0 1px rgba(100,119,216,.32); }
body[data-page="daily"] .dm-table .sum-row,
body[data-page="daily"] .dm-table .sum-row td { color:#5361A8 !important; background:rgba(232,237,255,.68) !important; border-top-color:rgba(100,119,216,.50) !important; }
body[data-page="daily"] .dm-table .add-row,
body[data-page="daily"] .dm-table .add-row td { background:rgba(255,255,255,.40) !important; }

/* 打卡：上下班按钮使用同一套柔和玻璃操作语言，保留状态辨识但去除生硬色块。 */
body[data-page="clock"] .btn-clock {
  position:relative;
  overflow:hidden;
  min-height:60px;
  border:1px solid rgba(255,255,255,.78) !important;
  color:#fff !important;
  box-shadow:0 14px 28px rgba(80,96,180,.21), inset 0 1px 0 rgba(255,255,255,.44) !important;
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
}
body[data-page="clock"] .btn-clock::before { content:""; position:absolute; width:180px; height:100px; top:-64px; left:-34px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.58),transparent 68%); pointer-events:none; }
body[data-page="clock"] .btn-clock-in { background:linear-gradient(135deg,rgba(100,119,216,.94),rgba(155,140,227,.90)) !important; }
body[data-page="clock"] .btn-clock-out { background:linear-gradient(135deg,rgba(91,183,169,.90),rgba(104,151,218,.90)) !important; }
body[data-page="clock"] .btn-clock:hover { transform:translateY(-2px); box-shadow:0 18px 32px rgba(80,96,180,.28), inset 0 1px 0 rgba(255,255,255,.50) !important; }
body[data-page="clock"] .btn-clock:disabled { background:rgba(137,147,174,.46) !important; color:rgba(255,255,255,.76) !important; box-shadow:none !important; }

.member-detail-panel .member-category-card {
  padding:15px 16px !important;
  border-color:rgba(255,255,255,.78) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.64),rgba(248,250,255,.30)) !important;
  box-shadow:0 14px 30px rgba(61,76,133,.11), inset 0 1px 0 rgba(255,255,255,.88) !important;
}
.member-category-card .card-header {
  position:relative;
  z-index:1;
  margin-bottom:10px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.66);
}
.member-category-card .card-count { color:#748097 !important; font-size:12px; }
.member-category-card .member-quick-list { position:relative; z-index:1; gap:7px; }
.member-category-card .member-quick-item {
  min-height:38px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:12px;
  color:#39465F !important;
  background:rgba(255,255,255,.38) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.74);
}
.member-category-card .member-quick-item:nth-child(odd) { background:rgba(255,255,255,.48) !important; }
.member-category-card .member-quick-item:hover {
  color:#33415E !important;
  background:rgba(255,255,255,.76) !important;
  box-shadow:0 7px 16px rgba(61,76,133,.12), inset 0 1px 0 rgba(255,255,255,.90);
  transform:translateY(-1px);
}
.member-category-card .member-quick-no { color:#758199 !important; }
.member-category-card .member-quick-more {
  color:#6477D8 !important;
  border-top-color:rgba(100,119,216,.18) !important;
}

@media (min-width:769px) {
  body[data-page="member"] .member-app,
  body[data-page="perf"] .perf-app { margin-top:24px !important; }
  body[data-page="leave"] #app .container { margin-top:24px !important; }
  body[data-page="leave"] .leave-control-strip { min-height:42px; }
  .member-glass-app .member-sidebar { position:sticky; top:18px; max-height:calc(100vh - 154px); overflow:auto; padding-right:3px; }
  .member-glass-app .result-list { max-height:calc(100vh - 390px); }
}

@media (max-width:768px) {
  .notice-board { margin:0 0 12px; padding:15px; border-radius:19px; }
  .notice-board-head { align-items:center; margin-bottom:10px; }
  .notice-bell { width:36px; height:36px; border-radius:13px; }
  .notice-bell svg { width:18px; height:18px; }
  .notice-title { font-size:16px; }
  .notice-live { padding:5px 7px; font-size:10px; }
  .notice-compose-toggle { min-height:30px; padding:0 9px; font-size:11px; }
  .notice-message { padding:11px 12px; border-radius:13px; }
  .notice-message-content { font-size:13px; }
  .notice-admin-actions { align-items:flex-start; flex-direction:column; }
  .member-glass-app { display:flex !important; flex-direction:column; gap:12px !important; padding:12px !important; }
  .member-glass-app .member-sidebar { display:contents; }
  .member-glass-app .member-search-card { order:1; margin:0 !important; padding:15px !important; border-radius:19px !important; }
  .member-glass-app .member-result-card { order:2; margin:0 !important; border-radius:19px !important; }
  .member-glass-app .member-detail-panel { order:3; }
  .member-glass-app .detail-card,
  .member-glass-app .chart-card { padding:15px !important; border-radius:19px !important; }
  .member-glass-app .result-list { max-height:42vh; }
  .member-glass-app .member-item { min-height:62px; padding:12px 13px; }
  .member-glass-app .member-search-card::before,
  .member-glass-app .member-detail-panel .detail-card::before,
  .member-glass-app .member-detail-panel .chart-card::before { opacity:.68; transform:scale(.75); transform-origin:top right; }
  /* 手机只保留检索与查询结果；会员档案与桌面分类列表不在窄屏重复呈现。 */
  body[data-page="member"] .member-glass-app {
    width:calc(100% - 24px) !important;
    max-width:560px !important;
    margin:0 auto !important;
    padding:12px 0 96px !important;
    align-items:stretch !important;
  }
  body[data-page="member"] .member-glass-app .member-search-card,
  body[data-page="member"] .member-glass-app .member-result-card {
    width:100% !important;
    box-sizing:border-box;
  }
  body[data-page="member"] .member-glass-app .member-detail-panel { display:none !important; }
  body[data-page="member"] .member-glass-app .member-search-card { padding:16px !important; }
  body[data-page="member"] .member-glass-app .member-result-card { min-height:0; }
  body[data-page="member"] .member-glass-app .result-list { max-height:calc(100vh - 350px); min-height:190px; }
  body[data-page="member"] .member-glass-app .member-item { min-height:64px; padding:13px 14px; }
  .leave-page-bar { display:block; margin:0 0 10px; }
  .leave-page-bar .view-tabs { margin:0 0 8px !important; }
  .leave-control-strip { justify-content:flex-start; gap:8px; margin:0; }
  .leave-control-strip .month-nav { width:100%; justify-content:space-between; }
  .leave-control-strip .user-selector,
  .leave-user-chip { flex:1 1 180px; }
  .leave-sync-chip { min-height:36px; font-size:12px; line-height:34px; }
}

/* 桌面端：macOS 风格底部 Dock。全站使用同一套六项导航，不再显示左侧导航轨道。 */
.desktop-glass-rail { display:none !important; }
@media (min-width:769px) {
  body { padding-bottom:116px !important; }
  #om-tabbar.om-dock {
    position:fixed !important;
    left:50% !important;
    right:auto !important;
    bottom:18px !important;
    width:min(720px, calc(100vw - 48px)) !important;
    min-height:72px;
    padding:8px 12px !important;
    transform:translateX(-50%);
    border:1px solid rgba(255,255,255,.82) !important;
    border-radius:24px !important;
    background:rgba(255,255,255,.58) !important;
    box-shadow:0 18px 42px rgba(61,76,133,.22), inset 0 1px 0 rgba(255,255,255,.74) !important;
    backdrop-filter:blur(26px) saturate(155%);
    -webkit-backdrop-filter:blur(26px) saturate(155%);
  }
  #om-tabbar.om-dock a { flex:1 1 0; padding:7px 5px 6px; border-radius:16px; transition:background .18s ease, transform .18s ease; }
  #om-tabbar.om-dock a:hover { background:rgba(255,255,255,.56); transform:translateY(-2px); }
  #om-tabbar.om-dock a[style*="color:#C9A876"] { background:rgba(255,255,255,.66); box-shadow:inset 0 1px 0 rgba(255,255,255,.82); }
  #om-tabbar.om-dock svg { width:21px; height:21px; }
  #om-tabbar.om-dock a div { font-size:11px !important; margin-top:3px !important; }

  /* 首页工作台铺满有效桌面宽度，避免出现左侧窄栏和大面积空白。 */
  .portal {
    width:calc(100vw - 48px) !important;
    max-width:none !important;
    margin:0 24px !important;
    padding:24px 0 24px !important;
  }
  .portal-header { margin-bottom:20px !important; padding:20px 24px !important; }
  .portal-header::after { content:"ONEMORE · 门店工作台"; }
  .portal-compact-bar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:50px;
    margin:0 0 16px;
    padding:7px 8px 7px 16px;
    border:1px solid rgba(255,255,255,.68);
    border-radius:18px;
    background:rgba(255,255,255,.34);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
  }
  .portal-date { color:#53617B; font-size:13px; font-weight:650; }
  .portal-account {
    position:relative;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    padding:0;
    border:1px solid rgba(255,255,255,.86);
    border-radius:50%;
    color:#fff;
    background:linear-gradient(135deg,rgba(100,119,216,.96),rgba(155,140,227,.92));
    box-shadow:0 10px 20px rgba(82,98,184,.26), inset 0 1px 0 rgba(255,255,255,.48);
    cursor:pointer;
    font-family:inherit;
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  }
  .portal-account::after { content:"退出"; position:absolute; margin-top:62px; padding:4px 7px; border-radius:8px; color:#53617B; background:rgba(255,255,255,.78); box-shadow:0 4px 10px rgba(61,76,133,.10); font-size:10px; font-weight:700; opacity:0; pointer-events:none; transform:translateY(-3px); transition:opacity .18s ease, transform .18s ease; }
  .portal-account:hover { transform:translateY(-2px) scale(1.04); filter:saturate(1.08); box-shadow:0 14px 25px rgba(82,98,184,.34), inset 0 1px 0 rgba(255,255,255,.54); }
  .portal-account:hover::after { opacity:1; transform:translateY(0); }
  .portal-account-name { max-width:42px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:800; letter-spacing:.15px; text-transform:lowercase; }
  .portal-account-id, .portal-account-action { display:none !important; }
  #userName { font-size:inherit; }
  .portal #portalView > div[style*="display:grid"] { gap:14px !important; margin-bottom:24px !important; }
  .portal #portalView > div[style*="display:grid"] > a {
    min-height:128px !important;
    padding:18px !important;
    border-radius:18px !important;
    border:1px solid rgba(255,255,255,.58);
    box-shadow:0 14px 32px rgba(61,76,133,.13);
  }

  /* 所有业务页：全宽工作台。留出 24px 两侧呼吸空间和底部 Dock 空间。 */
  .container,
  .dm-container,
  .member-app,
  .perf-app,
  .clock-container,
  #app .container,
  #perfApp .perf-app {
    width:calc(100vw - 48px) !important;
    max-width:none !important;
    margin-left:24px !important;
    margin-right:24px !important;
  }
  .dm-container { margin-top:16px !important; padding:0 0 18px !important; }
  .member-app, .perf-app, .clock-container, #app .container, #perfApp .perf-app { margin-top:16px !important; }
  .clock-container { max-width:none !important; display:grid; grid-template-columns:minmax(360px, 1fr) minmax(320px, .8fr); gap:18px; align-items:start; }
  .clock-container #loginView, .clock-container #clockView { grid-column:1; grid-row:1 / span 2; margin-bottom:0 !important; }
  .clock-container .history-title, .clock-container #historyList { grid-column:2; }
  .clock-container .history-title { margin:0 0 -10px !important; }
  .clock-container #historyList .history-card { margin-bottom:8px !important; }
  .member-app { grid-template-columns:minmax(320px, 28%) minmax(0, 1fr) !important; }
  .perf-app { padding:0 0 18px !important; }
  .header { width:100% !important; max-width:none !important; margin:0 !important; }
  #app .container { padding-left:0 !important; padding-right:0 !important; }

  /* 考勤信息采用高对比玻璃卡，避免浅色背景上看不清文字。 */
  #attendanceBoard.attendance-board {
    grid-column:auto !important;
    min-height:0 !important;
    margin:0 0 20px !important;
    padding:20px 22px !important;
    color:#263044 !important;
    background:rgba(255,255,255,.72) !important;
    border:1px solid rgba(255,255,255,.90) !important;
    box-shadow:0 16px 38px rgba(61,76,133,.15) !important;
  }
  .attendance-board-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
  .attendance-eyebrow { color:#6477D8; font-size:10px; font-weight:800; letter-spacing:1.2px; margin-bottom:2px; }
  .attendance-title { color:#263044 !important; font-size:20px !important; font-weight:760 !important; }
  .attendance-date { color:#53617B !important; font-size:13px !important; font-weight:650; padding:6px 10px; border-radius:10px; background:rgba(100,119,216,.12); }
  .attendance-date-controls { display:flex; align-items:center; justify-content:flex-end; gap:6px; }
  .attendance-date-switch { min-height:29px; padding:0 9px; border:1px solid rgba(100,119,216,.18); border-radius:9px; color:#5B6982; background:rgba(255,255,255,.54); font:700 11px/1 inherit; cursor:pointer; }
  .attendance-date-switch.active { color:#fff; border-color:rgba(255,255,255,.72); background:linear-gradient(135deg,#6477D8,#9B8CE3); box-shadow:0 5px 12px rgba(100,119,216,.22); }
  .attendance-list { font-size:14px !important; color:#263044 !important; }
  .attendance-list > div { gap:16px !important; align-items:stretch !important; }
  .attendance-list > div > div {
    padding:13px 14px !important;
    border:1px solid rgba(100,119,216,.14);
    border-radius:14px;
    background:rgba(255,255,255,.60) !important;
  }
  #attendanceBoard span, #attendanceBoard b, #attendanceBoard div { color:#263044 !important; }
  #attendanceBoard [style*="color:rgba"] { color:#53617B !important; }
  #attendanceBoard [style*="background:rgba"] { background:rgba(100,119,216,.09) !important; }
  #attendanceBoard select {
    min-height:28px;
    color:#263044 !important;
    background:rgba(255,255,255,.92) !important;
    border:1px solid rgba(100,119,216,.24) !important;
  }
  #attendanceBoard option { color:#263044; background:#fff; }
  .attendance-save {
    width:100%; margin-top:12px; padding:10px; border:0; border-radius:12px;
    color:white; background:linear-gradient(135deg,#6477D8,#9B8CE3); font-size:14px; font-weight:700; cursor:pointer;
  }
}

/* 首页考勤展板：门店与排班标签建立清晰的信息层级。 */
#attendanceBoard .attendance-store-name {
  display:inline-flex;
  align-items:center;
  min-height:29px;
  margin:0 0 8px;
  padding:0 11px;
  border:1px solid rgba(100,119,216,.20);
  border-radius:10px;
  color:#4054B8 !important;
  background:linear-gradient(135deg,rgba(100,119,216,.15),rgba(155,140,227,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  font-size:16px !important;
  font-weight:800 !important;
  letter-spacing:.8px;
  line-height:29px;
}
#attendanceBoard .attendance-shift-label {
  margin-top:9px;
  padding-top:8px;
  border-top:1px dashed rgba(100,119,216,.30);
  color:#5667BD !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.3px;
}

/* Attendance roster: store-specific service order is part of the daily schedule, not a hidden setting. */
#attendanceBoard .attendance-roster-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
#attendanceBoard .attendance-store-card { min-width:0; padding:14px !important; border:1px solid rgba(100,119,216,.16) !important; border-radius:16px !important; background:linear-gradient(145deg,rgba(255,255,255,.87),rgba(242,245,255,.74)) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
#attendanceBoard .attendance-store-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:11px; }
#attendanceBoard .attendance-store-subtitle { margin:2px 0 0 2px; color:#7B879E !important; font-size:11px !important; font-weight:650; }
#attendanceBoard .attendance-store-count { flex:0 0 auto; padding:4px 7px; border-radius:8px; color:#5B68A8 !important; background:rgba(100,119,216,.10) !important; font-size:10px !important; font-weight:800; }
#attendanceBoard .attendance-roster-columns, #attendanceBoard .attendance-roster-row { display:grid; grid-template-columns:minmax(82px,1.05fr) minmax(88px,1fr) minmax(88px,1fr) 56px; gap:7px; align-items:center; }
#attendanceBoard .attendance-roster-columns { margin-bottom:5px; padding:0 7px; color:#8490A8 !important; font-size:10px !important; font-weight:800; letter-spacing:.25px; }
#attendanceBoard .attendance-roster-row { min-height:45px; margin:5px 0; padding:5px 7px; border-radius:11px; background:rgba(100,119,216,.07) !important; }
#attendanceBoard .attendance-teacher { display:flex; align-items:center; min-width:0; gap:7px; font-size:13px !important; font-weight:800; }
#attendanceBoard .attendance-teacher b { display:grid; place-items:center; flex:0 0 23px; width:23px; height:23px; border-radius:8px; color:#5367CF !important; background:rgba(255,255,255,.92) !important; font-size:10px !important; }
#attendanceBoard .attendance-teacher span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#attendanceBoard .attendance-roster-row select { width:100%; min-width:0; min-height:33px; padding:0 7px; border-radius:9px !important; font-size:12px !important; }
#attendanceBoard .attendance-order-actions { display:flex; justify-content:flex-end; gap:4px; }
#attendanceBoard .attendance-order-actions button { display:grid; place-items:center; width:24px; height:28px; padding:0; border:1px solid rgba(100,119,216,.20); border-radius:8px; color:#5669CB !important; background:rgba(255,255,255,.86) !important; font-size:14px; font-weight:800; cursor:pointer; }
#attendanceBoard .attendance-order-actions button:active { transform:translateY(1px); background:rgba(225,230,255,.96) !important; }
#attendanceBoard .attendance-shift-chip, #attendanceBoard .attendance-status-chip { display:inline-flex; align-items:center; min-height:28px; padding:0 8px; border-radius:8px; color:#51607B !important; background:rgba(255,255,255,.74) !important; font-size:12px !important; font-weight:750; }
#attendanceBoard .attendance-status-chip.is-leave { color:#B16678 !important; background:rgba(255,225,232,.80) !important; }
#attendanceBoard .attendance-roster-readonly { grid-template-columns:minmax(82px,1.05fr) minmax(88px,1fr) minmax(88px,1fr); }
#attendanceBoard .attendance-order-note { margin-top:9px; padding-top:9px; border-top:1px dashed rgba(100,119,216,.24); color:#74809A !important; font-size:11px !important; line-height:1.45; }
/* Performance administrators keep their complete worksheet on compact screens; only employee views become cards. */
@media (max-width:1200px) {
  body[data-page="perf"] .perf-app.perf-admin-table .perf-admin-table-scroll,
  body[data-page="perf"] .perf-app.perf-admin-table [style*="overflow-x:auto"] { overflow-x:auto !important; -webkit-overflow-scrolling:touch; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff { display:table !important; width:100% !important; background:rgba(255,255,255,.90) !important; box-shadow:0 5px 14px rgba(61,76,133,.07) !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today { min-width:1050px !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard { min-width:1000px !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input { min-width:1230px !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff { min-width:1000px !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today thead,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard thead,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input thead,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff thead { display:table-header-group !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today tbody,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard tbody,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input tbody,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff tbody { display:table-row-group !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today tr,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard tr,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input tr,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff tr { display:table-row !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today td,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard td,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input td,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff td { display:table-cell !important; min-height:0 !important; padding:6px !important; border:1px solid var(--border) !important; border-radius:0 !important; white-space:nowrap !important; text-align:center !important; font-size:12px !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today td::before,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard td::before,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input td::before,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff td::before { display:none !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-today td:first-child,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-dashboard td:first-child,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input td:first-child,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff td:first-child { font-size:12px !important; background:transparent !important; }
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input td input,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-input td select,
  body[data-page="perf"] .perf-app.perf-admin-table .perf-mobile-staff td input { width:auto !important; max-width:none !important; min-height:26px; font-size:11px !important; }
}
@media (max-width:768px) {
  #attendanceBoard .attendance-roster-grid { grid-template-columns:1fr; gap:10px; }
  #attendanceBoard .attendance-store-card { padding:12px !important; border-radius:14px !important; }
  #attendanceBoard .attendance-roster-columns, #attendanceBoard .attendance-roster-row { grid-template-columns:minmax(74px,1fr) minmax(76px,.95fr) minmax(76px,.95fr) 52px; gap:5px; }
  #attendanceBoard .attendance-roster-columns { padding:0 4px; font-size:9px !important; }
  #attendanceBoard .attendance-roster-row { min-height:42px; padding:4px; }
  #attendanceBoard .attendance-teacher { gap:5px; font-size:12px !important; }
  #attendanceBoard .attendance-roster-row select { min-height:31px; padding:0 4px; font-size:11px !important; }
  #attendanceBoard .attendance-order-actions button { width:22px; height:27px; }
  #attendanceBoard .attendance-roster-readonly { grid-template-columns:minmax(74px,1fr) minmax(76px,.95fr) minmax(76px,.95fr); }
}
@media (max-width:768px) {
  #attendanceBoard .attendance-store-name { min-height:27px; margin-bottom:7px; padding:0 10px; border-radius:9px; font-size:15px !important; line-height:27px; }
  #attendanceBoard .attendance-shift-label { margin-top:8px; padding-top:7px; font-size:12px !important; }
}

/* Dock v3：独立的 macOS 液态玻璃组件，六项入口始终作为一组固定在底部中央。 */
#om-tabbar.om-dock-v3 {
  position:fixed !important;
  z-index:9999 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  gap:8px !important;
  box-sizing:border-box !important;
  border:1px solid rgba(255,255,255,.82) !important;
  background:rgba(255,255,255,.54) !important;
  box-shadow:0 18px 42px rgba(61,76,133,.25), inset 0 1px 0 rgba(255,255,255,.80) !important;
  backdrop-filter:blur(28px) saturate(165%) !important;
  -webkit-backdrop-filter:blur(28px) saturate(165%) !important;
}
#om-tabbar.om-dock-v3 .om-dock-item {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  color:#8E97AC !important;
  border-radius:14px !important;
  transition:transform .18s ease, color .18s ease !important;
  background:transparent !important;
}
#om-tabbar.om-dock-v3 .om-dock-icon {
  position:relative;
  display:grid;
  place-items:center;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
#om-tabbar.om-dock-v3 .om-dock-icon::after { display:none !important; }
#om-tabbar.om-dock-v3 .om-dock-icon svg { width:100%; height:100%; position:relative; z-index:1; }
#om-tabbar.om-dock-v3 .om-dock-label { font-weight:600; letter-spacing:.1px; white-space:nowrap; opacity:.85; }
#om-tabbar.om-dock-v3 .om-dock-item:hover { transform:translateY(-3px); }
#om-tabbar.om-dock-v3 .om-dock-item.is-active { color:#3D50BC !important; background:transparent !important; }
#om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-label { opacity:1; font-weight:700; }
#om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { background:transparent !important; box-shadow:none !important; }
#om-tabbar.om-dock-v3 .icon-home { color:#6579E1; }
#om-tabbar.om-dock-v3 .icon-daily { color:#A977D6; }
#om-tabbar.om-dock-v3 .icon-member { color:#37A79B; }
#om-tabbar.om-dock-v3 .icon-clock { color:#DB8C65; }
#om-tabbar.om-dock-v3 .icon-perf { color:#D3658B; }
#om-tabbar.om-dock-v3 .icon-leave { color:#6D86C9; }

/* 手机仍为紧凑底部导航；考勤使用单列，防止两家店信息挤在一起。 */
@media (min-width:769px) {
  #om-tabbar.om-dock-v3 {
    left:50% !important;
    right:auto !important;
    bottom:18px !important;
    width:auto !important;
    min-width:680px !important;
    height:88px !important;
    padding:10px 14px 9px !important;
    transform:translateX(-50%) !important;
    border-radius:28px !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item { width:auto !important; height:62px !important; padding:4px 14px 3px !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { width:30px; height:30px; }
  #om-tabbar.om-dock-v3 .om-dock-label { margin-top:3px; font-size:12px; }
}

@media (max-width:768px) {
  #om-tabbar.om-dock-v3 {
    left:12px !important;
    right:12px !important;
    bottom:max(10px, env(safe-area-inset-bottom)) !important;
    height:66px !important;
    padding:6px 4px !important;
    border-radius:21px !important;
    gap:1px !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item { flex:1 1 0; height:52px; min-width:0; padding:3px 1px; }
  #om-tabbar.om-dock-v3 .om-dock-icon { width:26px; height:26px; }
  #om-tabbar.om-dock-v3 .om-dock-label { margin-top:3px; font-size:10px; }
  /* 手机首页顶部必须是一行：日期固定左侧，账户圆圈固定最右侧。 */
  .portal-compact-bar {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100%;
    box-sizing:border-box;
    min-height:48px;
    margin-bottom:12px;
    padding:5px 7px 5px 12px;
    border-radius:15px;
  }
  .portal-date { font-size:11px; white-space:nowrap; }
  .portal-account { margin-left:auto; flex:0 0 auto; }
  .portal-account {
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    border:1px solid rgba(255,255,255,.86);
    border-radius:50%;
    color:#fff;
    background:linear-gradient(135deg,rgba(100,119,216,.96),rgba(155,140,227,.92));
    box-shadow:0 8px 16px rgba(82,98,184,.24), inset 0 1px 0 rgba(255,255,255,.46);
  }
  .portal-account-name { max-width:33px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; font-weight:800; text-transform:lowercase; }
  .portal-account-id, .portal-account-action, .portal-account::after { display:none !important; }
  .leave-page-bar .view-tabs { width:100%; box-sizing:border-box; gap:5px; }
  .leave-page-bar .view-tab { flex:1 1 0; min-width:0; min-height:36px; padding:0 8px; font-size:13px; line-height:36px; }
  #attendanceBoard.attendance-board { background:rgba(255,255,255,.82) !important; color:#263044 !important; }
  .attendance-board-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
  .attendance-eyebrow { color:#6477D8; font-size:9px; font-weight:800; letter-spacing:1px; }
  .attendance-title, .attendance-date { color:#263044 !important; }
  .attendance-date-controls { width:100%; justify-content:flex-start; flex-wrap:wrap; margin-top:7px; }
  .attendance-date { font-size:11px !important; }
  .attendance-date-switch { min-height:28px; padding:0 9px; font-size:11px; }
  .attendance-list > div { display:block !important; }
  .attendance-list > div > div { margin-bottom:8px; padding:10px !important; border-radius:10px; background:rgba(100,119,216,.08) !important; }
  #attendanceBoard span, #attendanceBoard b, #attendanceBoard div { color:#263044 !important; }
  #attendanceBoard [style*="color:rgba"] { color:#53617B !important; }
  #attendanceBoard [style*="background:rgba"] { background:rgba(100,119,216,.08) !important; }
  #attendanceBoard select { color:#263044 !important; background:rgba(255,255,255,.94) !important; }
}

/* 最终性能覆盖：手机端 Dock 和列表不再做实时背景采样，减少点击切换时的 GPU 合成压力。 */
#om-tabbar.om-dock-v3 {
  contain: layout paint style;
  will-change: transform;
}
#om-tabbar.om-dock-v3 .om-dock-item { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

/* Compact attendance header mirrors the announcement board hierarchy. */
#attendanceBoard.attendance-board { padding:16px 18px !important; margin-bottom:14px !important; }
#attendanceBoard .attendance-board-head { align-items:center; margin-bottom:10px; }
#attendanceBoard .attendance-heading { display:flex; align-items:center; gap:10px; min-width:0; }
#attendanceBoard .attendance-heading-icon { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:13px; color:#fff !important; background:linear-gradient(135deg,#6477D8,#9B8CE3) !important; box-shadow:0 8px 16px rgba(100,119,216,.22); font-size:21px; font-weight:800; }
#attendanceBoard .attendance-eyebrow { margin:0 0 1px; font-size:9px; letter-spacing:1.1px; }
#attendanceBoard .attendance-title { font-size:18px !important; line-height:1.1; }
#attendanceBoard .attendance-date-controls { margin-left:auto; width:auto; flex-wrap:nowrap; justify-content:flex-end; }
#attendanceBoard .attendance-date { padding:5px 8px; font-size:11px !important; white-space:nowrap; }
#attendanceBoard .attendance-store-card { padding:11px !important; border-radius:14px !important; }
#attendanceBoard .attendance-store-card-head { margin-bottom:7px; }
#attendanceBoard .attendance-store-name { min-height:25px; margin:0; padding:0 9px; font-size:14px !important; line-height:25px; }
#attendanceBoard .attendance-roster-columns { margin-bottom:2px; }
#attendanceBoard .attendance-roster-row { min-height:39px; margin:4px 0; padding:4px 6px; }
#attendanceBoard .attendance-teacher { font-size:12px !important; }
#attendanceBoard .attendance-shift-chip, #attendanceBoard .attendance-status-chip { min-height:25px; font-size:11px !important; }
#attendanceBoard .attendance-title { color:#2D3A54 !important; font-size:18px !important; font-weight:780 !important; }
#attendanceBoard .attendance-roster-row { min-height:35px; margin:3px 0; padding:3px 6px; }
#attendanceBoard .attendance-teacher b { flex-basis:21px; width:21px; height:21px; font-size:9px !important; }
#attendanceBoard .attendance-shift-chip, #attendanceBoard .attendance-status-chip { min-height:23px; }
@media (max-width:768px) {
  #attendanceBoard.attendance-board { padding:14px 13px !important; margin-bottom:10px !important; }
  #attendanceBoard .attendance-board-head { gap:7px; }
  #attendanceBoard .attendance-heading-icon { flex-basis:34px; width:34px; height:34px; border-radius:11px; font-size:18px; }
  #attendanceBoard .attendance-title { font-size:17px !important; }
  #attendanceBoard .attendance-date-controls { margin-top:0; gap:4px; }
  #attendanceBoard .attendance-date-switch { min-height:26px; padding:0 7px; font-size:10px; }
  #attendanceBoard .attendance-date { padding:4px 6px; font-size:10px !important; }
  #attendanceBoard .attendance-list > div > div { margin-bottom:6px; padding:0 !important; background:transparent !important; }
  #attendanceBoard .attendance-store-card { padding:10px !important; }
  #attendanceBoard .attendance-title { color:#2D3A54 !important; font-size:16px !important; font-weight:780 !important; }
  #attendanceBoard .attendance-roster-row { min-height:33px; margin:3px 0; padding:3px 5px; }
  #attendanceBoard .attendance-shift-chip, #attendanceBoard .attendance-status-chip { min-height:22px; padding:0 7px; }
}
@media (min-width:769px) {
  #om-tabbar.om-dock-v3 { backdrop-filter:blur(16px) saturate(140%) !important; -webkit-backdrop-filter:blur(16px) saturate(140%) !important; box-shadow:0 12px 30px rgba(61,76,133,.18), inset 0 1px 0 rgba(255,255,255,.76) !important; }
  body[data-page="daily"] .table-card { backdrop-filter:blur(12px) saturate(125%); -webkit-backdrop-filter:blur(12px) saturate(125%); box-shadow:0 12px 28px rgba(61,76,133,.12), inset 0 1px 0 rgba(255,255,255,.82) !important; }
}
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:rgba(255,255,255,.86) !important; box-shadow:0 10px 24px rgba(61,76,133,.16), inset 0 1px 0 rgba(255,255,255,.80) !important; }
  body[data-page="daily"] .table-card, .mobile-record-card, .mobile-add-row, .mobile-field-group, .mobile-editor, .mobile-editor-mask { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  body[data-page="daily"] .table-card { background:rgba(255,255,255,.78) !important; box-shadow:0 10px 24px rgba(61,76,133,.10) !important; }
  body[data-page="daily"] .mobile-record-card {
    border-color:rgba(255,255,255,.84) !important;
    background:rgba(255,255,255,.88) !important;
    box-shadow:0 6px 16px rgba(61,76,133,.08) !important;
  }
  body[data-page="daily"] .mobile-record-card:active { background:rgba(235,239,255,.96) !important; }
}

/* 手机版日报高通透液态玻璃：不改变三行紧凑清单，只增强层次、边界和高光。 */
@media (max-width:768px) {
  body[data-page="daily"] .dm-container {
    position:relative;
    isolation:isolate;
  }
  body[data-page="daily"] .dm-container::before,
  body[data-page="daily"] .dm-container::after {
    content:"";
    position:fixed;
    z-index:-1;
    border-radius:50%;
    pointer-events:none;
  }
  body[data-page="daily"] .dm-container::before {
    width:240px;
    height:240px;
    top:74px;
    right:-126px;
    background:radial-gradient(circle,rgba(155,140,227,.34) 0,rgba(155,140,227,.12) 42%,transparent 71%);
  }
  body[data-page="daily"] .dm-container::after {
    width:210px;
    height:210px;
    top:48%;
    left:-125px;
    background:radial-gradient(circle,rgba(101,203,187,.25) 0,rgba(101,203,187,.08) 44%,transparent 72%);
  }
  body[data-page="daily"] .dm-toolbar {
    position:relative;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.88) !important;
    border-radius:18px !important;
    background:linear-gradient(145deg,rgba(255,255,255,.75),rgba(245,248,255,.45)) !important;
    box-shadow:0 14px 30px rgba(70,85,158,.16),inset 0 1px 0 rgba(255,255,255,.92) !important;
    backdrop-filter:blur(18px) saturate(145%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
  }
  body[data-page="daily"] .dm-toolbar::after {
    content:"";
    position:absolute;
    top:0;
    left:12%;
    width:62%;
    height:1px;
    background:rgba(255,255,255,.92);
    pointer-events:none;
  }
  body[data-page="daily"] .store-tabs {
    border:1px solid rgba(255,255,255,.68) !important;
    background:rgba(100,119,216,.10) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.66);
  }
  body[data-page="daily"] .store-tab { color:#596681 !important; }
  body[data-page="daily"] .store-tab.active {
    background:linear-gradient(135deg,#7183E7,#A294E6) !important;
    box-shadow:0 6px 13px rgba(100,119,216,.26),inset 0 1px 0 rgba(255,255,255,.48) !important;
  }
  body[data-page="daily"] .date-section input,
  body[data-page="daily"] .nav-btn,
  body[data-page="daily"] .today-btn,
  body[data-page="daily"] .btn-save {
    border:1px solid rgba(255,255,255,.76) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 4px 10px rgba(70,85,158,.09);
  }
  body[data-page="daily"] .stats-row { gap:8px !important; }
  body[data-page="daily"] .stat-card {
    overflow:hidden;
    border:1px solid rgba(255,255,255,.78) !important;
    background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(238,242,255,.35)) !important;
    box-shadow:0 9px 20px rgba(70,85,158,.10),inset 0 1px 0 rgba(255,255,255,.88) !important;
    backdrop-filter:blur(15px) saturate(140%) !important;
    -webkit-backdrop-filter:blur(15px) saturate(140%) !important;
  }
  body[data-page="daily"] .stat-icon {
    border:1px solid rgba(255,255,255,.72);
    background:linear-gradient(135deg,rgba(100,119,216,.78),rgba(155,140,227,.68)) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  }
  body[data-page="daily"] .mobile-add-row,
  body[data-page="daily"] .mobile-record-card {
    position:relative;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.86) !important;
    background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(244,247,255,.44)) !important;
    box-shadow:0 11px 24px rgba(70,85,158,.13),inset 0 1px 0 rgba(255,255,255,.90) !important;
    backdrop-filter:blur(17px) saturate(148%) !important;
    -webkit-backdrop-filter:blur(17px) saturate(148%) !important;
  }
  body[data-page="daily"] .mobile-record-card::before {
    content:"";
    position:absolute;
    top:0;
    left:10px;
    right:32%;
    height:1px;
    background:rgba(255,255,255,.92);
    pointer-events:none;
  }
  body[data-page="daily"] .mobile-record-card:active {
    transform:scale(.99);
    background:linear-gradient(145deg,rgba(238,241,255,.94),rgba(255,255,255,.68)) !important;
  }
  body[data-page="daily"] .mobile-editor-mask {
    background:rgba(55,65,118,.29) !important;
    backdrop-filter:blur(10px) saturate(125%) !important;
    -webkit-backdrop-filter:blur(10px) saturate(125%) !important;
  }
  body[data-page="daily"] .mobile-editor {
    border:1px solid rgba(255,255,255,.86) !important;
    background:linear-gradient(150deg,rgba(249,250,255,.93),rgba(229,235,255,.78)) !important;
    box-shadow:0 -14px 36px rgba(55,65,118,.22),inset 0 1px 0 rgba(255,255,255,.92) !important;
    backdrop-filter:blur(24px) saturate(150%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(150%) !important;
  }
  body[data-page="daily"] .mobile-field-group {
    border:1px solid rgba(255,255,255,.80) !important;
    background:rgba(255,255,255,.50) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
  }
  body[data-page="daily"] .mobile-field input,
  body[data-page="daily"] .mobile-field select {
    border-color:rgba(255,255,255,.82) !important;
    background:rgba(255,255,255,.68) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.78);
  }
}
@media (max-width:480px) {
  /* 小屏手机用更高不透明度模拟玻璃，避免实时模糊拖慢操作。 */
  body[data-page="daily"] .dm-toolbar,
  body[data-page="daily"] .stat-card,
  body[data-page="daily"] .mobile-add-row,
  body[data-page="daily"] .mobile-record-card,
  body[data-page="daily"] .mobile-editor,
  body[data-page="daily"] .mobile-field-group {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  body[data-page="daily"] .dm-toolbar { background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(244,247,255,.82)) !important; }
  body[data-page="daily"] .stat-card,
  body[data-page="daily"] .mobile-add-row,
  body[data-page="daily"] .mobile-record-card { background:linear-gradient(145deg,rgba(255,255,255,.90),rgba(245,248,255,.80)) !important; }
  body[data-page="daily"] .mobile-editor { background:linear-gradient(150deg,rgba(250,251,255,.97),rgba(232,237,255,.93)) !important; }
}

/* 移动端最终性能覆盖：不使用实时背景模糊、固定伪元素或重阴影。
   用不透明玻璃色和彩色渐变保留当前视觉，减少每帧合成与重绘。 */
@media (max-width:768px) {
  body { background-attachment:scroll !important; }
  body::before, body::after,
  body[data-page="daily"] .dm-container::before,
  body[data-page="daily"] .dm-container::after { display:none !important; }
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box,
  .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card,
  .perf-panel, .chart-card, .summary-card, #attendanceBoard,
  body[data-page="daily"] .mobile-record-card, body[data-page="daily"] .mobile-add-row,
  body[data-page="daily"] .mobile-editor, body[data-page="daily"] .mobile-editor-mask,
  body[data-page="daily"] .mobile-field-group {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:0 4px 12px rgba(61,76,133,.07) !important;
  }
  #om-tabbar.om-dock-v3 {
    contain:layout paint style;
    transform:translateZ(0);
    backface-visibility:hidden;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:0 6px 16px rgba(61,76,133,.12) !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item { transition:transform .1s ease,background .1s ease,color .1s ease !important; }
  #om-nav-hint {
    position:fixed; left:50%; bottom:98px; width:38px; height:3px; border-radius:8px;
    transform:translateX(-50%); z-index:9999; pointer-events:none;
    background:linear-gradient(90deg,#6477D8,#9B8CE3); opacity:.7;
    animation:om-nav-pulse .42s ease-out both;
  }
}
@keyframes om-nav-pulse { 0%{opacity:0;transform:translateX(-50%) scaleX(.25);} 35%{opacity:.82;} 100%{opacity:0;transform:translateX(-50%) scaleX(1);} }

@media (prefers-reduced-motion: no-preference) {
  #om-tabbar.om-dock-v3 .om-dock-item { transition:transform .14s ease, background .14s ease, color .14s ease !important; }
}

/* 日报桌面自适应：工作区固定在可视区域内，表格内部滚动，避免 12 寸笔记本出现整页上下滚动。
   Dock 顶部预留 124px；dvh 会随浏览器工具栏、缩放及不同分辨率实时调整。 */
@media (min-width:769px) {
  html:has(body[data-page="daily"]), body[data-page="daily"] { height:100%; overflow:hidden; }
  body[data-page="daily"] .dm-container {
    box-sizing:border-box;
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr);
    gap:10px;
    height:calc(100dvh - 124px) !important;
    min-height:0;
    margin-top:12px !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  body[data-page="daily"] .dm-toolbar,
  body[data-page="daily"] .stats-row { margin-bottom:0 !important; }
  body[data-page="daily"] .desktop-daily { min-height:0; overflow:hidden; }
  body[data-page="daily"] .desktop-daily .table-card {
    box-sizing:border-box;
    height:100% !important;
    min-height:0;
    max-height:none !important;
    overflow:auto !important;
  }
}

/* 典型 12-13 寸笔记本（约 768-820px 高）使用紧凑密度，但仍保持桌面宽表与全部字段。 */
@media (min-width:769px) and (max-height:820px) {
  body[data-page="daily"] .dm-container { gap:7px; height:calc(100dvh - 116px) !important; margin-top:8px !important; }
  body[data-page="daily"] .dm-toolbar { min-height:42px; padding:8px 12px !important; }
  body[data-page="daily"] .store-tab { padding:6px 13px; }
  body[data-page="daily"] .date-section input { padding:5px 8px; }
  body[data-page="daily"] .nav-btn,
  body[data-page="daily"] .today-btn,
  body[data-page="daily"] .btn { padding:5px 10px; }
  body[data-page="daily"] .stats-row { gap:7px !important; }
  body[data-page="daily"] .stat-card { min-height:48px; padding:8px 11px; gap:8px; }
  body[data-page="daily"] .stat-icon { width:28px; height:28px; font-size:14px; }
  body[data-page="daily"] .stat-val { font-size:18px; }
  body[data-page="daily"] .stat-lbl { font-size:10px; }
  body[data-page="daily"] .dm-table th { padding:6px 4px; }
  body[data-page="daily"] .dm-table td input,
  body[data-page="daily"] .dm-table td select { padding:6px 3px; }
}

/* v4 · ice-blue Apple liquid glass. Visual-only overrides: no page structure, API, or data field changes. */
:root { --hg-ink:#24314c; --hg-muted:#6b7894; --hg-brand:#5368d8; --hg-brand-2:#9375e5; --hg-glass:rgba(255,255,255,.43); --hg-glass-strong:rgba(255,255,255,.70); --hg-line:rgba(255,255,255,.82); --hg-shadow:0 18px 48px rgba(71,88,160,.14), inset 0 1px 0 rgba(255,255,255,.84); }
body { background:radial-gradient(ellipse 44rem 30rem at 7% -8%,rgba(119,148,255,.45),transparent 66%),radial-gradient(ellipse 38rem 27rem at 92% 4%,rgba(184,174,255,.42),transparent 68%),radial-gradient(ellipse 42rem 30rem at 78% 102%,rgba(153,219,246,.34),transparent 68%),linear-gradient(135deg,#eaf0ff 0%,#f8f9ff 47%,#e8f3ff 100%) !important; }
.portal-header,.dm-toolbar,.search-box,.result-box,.detail-card,.table-card,.perf-panel,.chart-card,.summary-card,.member-detail,.card,.calendar,.today-leaves,.staff-card,.overview-item { position:relative; overflow:hidden; border-color:rgba(255,255,255,.86) !important; background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(245,248,255,.30)) !important; box-shadow:var(--hg-shadow) !important; }
.portal-header::before,.dm-toolbar::before,.search-box::before,.result-box::before,.detail-card::before,.table-card::before,.perf-panel::before,.chart-card::before,.summary-card::before,.member-detail::before { content:""; position:absolute; left:8%; top:0; width:54%; height:1px; background:rgba(255,255,255,.96); pointer-events:none; }
.member-item,.member-quick-item,.mobile-record-card,.stat-box { border:1px solid rgba(255,255,255,.72) !important; background:rgba(255,255,255,.46) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.78); }
.member-item:hover,.member-quick-item:hover { transform:translateY(-1px); background:rgba(242,245,255,.90) !important; }
.member-item.active { background:linear-gradient(135deg,rgba(238,241,255,.94),rgba(250,247,255,.78)) !important; border-left:3px solid #6477e5 !important; }
.stat-card,.stats-row .stat-card,.stat-grid .stat-card { background:linear-gradient(145deg,rgba(255,255,255,.61),rgba(235,240,255,.33)) !important; }
.btn-primary,.login-btn,.save-btn,.today-btn,.add-row button,.btn-save { background:linear-gradient(135deg,#5067d8 0%,#8876e4 100%) !important; box-shadow:0 10px 20px rgba(74,93,206,.27),inset 0 1px 0 rgba(255,255,255,.46) !important; }
table th,.dm-table th { background:linear-gradient(135deg,rgba(70,88,176,.90),rgba(112,101,191,.84)) !important; }
table td,.dm-table td { background:rgba(255,255,255,.66) !important; }
@media (min-width:769px) { .desktop-glass-rail { width:72px; padding:12px 7px; background:rgba(255,255,255,.52); box-shadow:0 18px 46px rgba(70,88,160,.18),inset 0 1px 0 rgba(255,255,255,.88); } .desktop-glass-rail .rail-brand { background:linear-gradient(145deg,#5368d8,#9979e8); } #om-tabbar.om-dock-v3 { background:rgba(255,255,255,.66) !important; border-color:rgba(255,255,255,.90) !important; } }
@media (max-width:768px) { body { background:linear-gradient(150deg,#eef2ff 0%,#fafbff 52%,#eaf4ff 100%) !important; } .portal-header,.dm-toolbar,.search-box,.result-box,.detail-card,.table-card,.perf-panel,.chart-card,.summary-card,.member-detail,.card,.calendar,.today-leaves,.staff-card,.overview-item { background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(244,247,255,.80)) !important; box-shadow:0 8px 22px rgba(71,88,160,.10),inset 0 1px 0 rgba(255,255,255,.9) !important; } .member-app,.perf-app,.dm-container,.container { width:100% !important; max-width:100% !important; box-sizing:border-box; } .member-item { min-height:66px; } .member-status .num,.balance-big { color:#5267d7 !important; } #om-tabbar.om-dock-v3 { background:rgba(255,255,255,.92) !important; border-color:rgba(255,255,255,.94) !important; } }

/* Member workspace: promote the existing data into a clear desktop master-detail experience. */
@media (min-width:901px) {
  body[data-page="member"] .member-app { grid-template-columns:330px minmax(0,1fr) !important; gap:22px !important; padding:26px 32px 116px !important; }
  body[data-page="member"] .member-sidebar { position:sticky; top:24px; align-self:start; max-height:calc(100dvh - 48px); display:flex; flex-direction:column; }
  body[data-page="member"] .member-search-card { flex:0 0 auto; }
  body[data-page="member"] .member-result-card { min-height:0; flex:1; display:flex; flex-direction:column; }
  body[data-page="member"] .result-list { max-height:none; flex:1; }
  body[data-page="member"] .detail-panel { min-width:0; }
  body[data-page="member"] .detail-card { padding:24px !important; border-radius:25px !important; }
  body[data-page="member"] .member-header { padding-bottom:18px; margin-bottom:18px; }
  body[data-page="member"] .member-header-left .name { font-size:27px; letter-spacing:-.3px; }
  body[data-page="member"] .balance-big { font-size:32px; color:#5168dc; }
  body[data-page="member"] .info-grid { gap:10px; }
  body[data-page="member"] .info-item { padding:12px 14px; border-radius:15px; background:rgba(255,255,255,.42); border:1px solid rgba(255,255,255,.7); }
  body[data-page="member"] .chart-card { border-radius:25px !important; }
}

/* 手机日期控件：文字始终在按钮正中央，避免不同 WebView 的默认基线造成视觉偏移。 */
@media (max-width:768px) {
  body[data-page="perf"] .month-nav .perf-date-button {
    display:grid !important;
    place-items:center !important;
    text-align:center !important;
    line-height:1 !important;
  }

  /* 日报：门店独占第一行；第二行左侧日期/今天，右侧老师筛选。 */
  body[data-page="daily"] .dm-toolbar {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:"stores stores" "date therapist" !important;
    align-items:center !important;
    gap:8px 9px !important;
  }
  body[data-page="daily"] .store-tabs { grid-area:stores; justify-self:start; }
  body[data-page="daily"] .date-section {
    grid-area:date;
    width:auto !important;
    margin:0 !important;
    justify-content:flex-start !important;
    gap:4px !important;
  }
  body[data-page="daily"] .therapist-filter { grid-area:therapist; justify-self:end; white-space:nowrap; }
  body[data-page="daily"] .date-display {
    width:110px !important;
    min-width:110px !important;
    box-sizing:border-box !important;
    padding:7px 3px !important;
    display:grid !important;
    place-items:center !important;
    text-align:center !important;
    line-height:1 !important;
    white-space:nowrap !important;
    font-size:12px !important;
  }
  body[data-page="daily"] .nav-btn { width:26px; min-width:26px; padding:7px 0 !important; }
  body[data-page="daily"] .today-btn { margin-left:0 !important; min-width:38px; padding:7px 7px !important; font-size:11px !important; }
}
body[data-page="member"] .member-search-label { font-weight:750; letter-spacing:.2px; }
body[data-page="member"] .search-input { border-radius:16px !important; }
body[data-page="member"] .type-tabs { padding:3px; border-radius:15px; background:rgba(235,239,255,.58); }
body[data-page="member"] .type-tab { min-width:0; border-radius:12px; }
body[data-page="member"] .type-tab.active { background:linear-gradient(135deg,#5268dd,#9178e6); box-shadow:0 8px 16px rgba(78,96,206,.25); }
body[data-page="member"] .member-category-card { margin-bottom:15px; }
body[data-page="member"] .card-header { padding-bottom:11px; border-bottom:1px solid rgba(103,122,191,.11); }
body[data-page="member"] .detail-empty { min-height:390px; display:grid; place-items:center; align-content:center; gap:13px; }
@media (max-width:768px) {
  body[data-page="member"] .member-app { display:flex !important; flex-direction:column; padding:12px !important; gap:12px !important; overflow-x:hidden; }
  body[data-page="member"] .member-app > div:first-child { order:1; width:100%; min-width:0; }
  body[data-page="member"] .member-app > div:last-child { order:2; width:100%; min-width:0; }
  body[data-page="member"] .type-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; overflow:hidden; }
  body[data-page="member"] .type-tab { width:100%; padding:9px 2px; font-size:13px; white-space:nowrap; }
  body[data-page="member"] .member-result-card { max-height:48dvh; }
  body[data-page="member"] .result-list { max-height:calc(48dvh - 54px); }
  body[data-page="member"] .member-item { padding:13px 12px; }
  body[data-page="member"] .detail-card { padding:17px !important; border-radius:20px !important; }
  body[data-page="member"] .member-header { gap:12px; align-items:flex-start; }
  body[data-page="member"] .member-header-left .name { font-size:23px; }
  body[data-page="member"] .balance-big { font-size:27px; }
  body[data-page="member"] .info-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-page="member"] .info-item { min-width:0; overflow:hidden; }
  body[data-page="member"] .info-item .value { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}

/* Performance finishing pass (2026-07-20).
   Preserve the glass language while avoiding costly live blur during scrolling. */
@media (min-width:769px) {
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box,
  .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card,
  .perf-panel, .chart-card, .summary-card, #attendanceBoard {
    backdrop-filter:blur(6px) saturate(116%) !important;
    -webkit-backdrop-filter:blur(6px) saturate(116%) !important;
    box-shadow:0 9px 22px rgba(55,73,137,.10), 0 2px 6px rgba(61,76,133,.05) !important;
  }
  #om-tabbar.om-dock, #om-tabbar.om-dock-v3 {
    backdrop-filter:blur(8px) saturate(122%) !important;
    -webkit-backdrop-filter:blur(8px) saturate(122%) !important;
    box-shadow:0 12px 28px rgba(61,76,133,.15), inset 0 1px 0 rgba(255,255,255,.76) !important;
  }
  body[data-page="daily"] .dm-table,
  body[data-page="performance"] .perf-table,
  body[data-page="leave"] .calendar { contain:paint; }
}

/* Android app shells sometimes report a tablet-width viewport on a phone.  Capability
   detection ensures that those touch devices still get the low-compositing mobile style. */
@media (hover:none) and (pointer:coarse) {
  .header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item,
  .modal, .login-box, .admin-section, .dm-toolbar, .table-card, .search-box,
  .login-card, .stat-card, .clock-card, .history-card, .member-detail, .member-card,
  .perf-panel, .chart-card, .summary-card, #attendanceBoard,
  .mobile-record-card, .mobile-add-row, .mobile-editor, .mobile-editor-mask,
  .mobile-field-group, .portal-header, .result-box, .detail-card {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:0 4px 12px rgba(61,76,133,.08) !important;
  }
  #om-tabbar.om-dock, #om-tabbar.om-dock-v3, .mobile-glass-nav {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background:rgba(255,255,255,.90) !important;
    box-shadow:0 7px 18px rgba(61,76,133,.13) !important;
  }
  .dm-table, .calendar table, .perf-table { contain:paint; }

  /* Keep mobile content clear of the persistent dock. */
  body[data-page="clock"] .clock-page,
  body[data-page="leave"] .leave-page,
  body[data-page="perf"] .perf-page,
  body[data-page="member"] .member-glass-app,
  body[data-page="daily"] .daily-page { padding-bottom:132px !important; }

  /* Home notification: preserve the title hierarchy on narrow admin screens. */
  .notice-board-head { align-items:flex-start; gap:10px; }
  .notice-board-actions { gap:7px; flex-shrink:0; }
  .notice-eyebrow { font-size:10px; letter-spacing:1.1px; white-space:nowrap; }
  .notice-compose-toggle { min-width:72px; padding:8px 10px; font-size:12px; }

  /* Member search should reveal results without an unnecessary oversized hero. */
  .member-search-card { padding:14px !important; }
  .member-search-card .add-member-btn, .member-search-card .add-btn { min-height:42px; }

  /* Keep administrator performance navigation readable and let the table scroll intentionally. */
  .perf-tabs { overflow-x:auto; scrollbar-width:none; white-space:nowrap; }
  .perf-tabs::-webkit-scrollbar { display:none; }
  .perf-tabs > * { flex:0 0 auto; }
  .perf-table { min-width:max-content; }

  /* Leave calendar labels and the staff selector must not be hidden by the dock. */
  body[data-page="leave"] .calendar, body[data-page="leave"] .today-leaves { margin-bottom:20px; }
}

/* Mobile home refinement: quiet pearl/lilac glass, dense information and a true icon dock. */
body.profile-sheet-open { overflow:hidden; }
body[data-page="home"] .home-leaderboard { display:none; }
body[data-page="home"] .home-clock-entry { display:none; }
body[data-page="home"] .home-overview { display:none; }
.portal-avatar { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; flex:0 0 34px; color:#fff; font:700 14px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; background:linear-gradient(135deg,#8d9ce9,#b18add); background-size:cover; background-position:center; border:1px solid rgba(255,255,255,.85); box-shadow:0 5px 15px rgba(87,104,184,.24), inset 0 1px 1px rgba(255,255,255,.48); }
.profile-sheet-mask { position:fixed; inset:0; z-index:12000; display:grid; align-items:end; background:rgba(35,42,87,.24); }
.profile-sheet-mask[hidden] { display:none !important; }
.profile-sheet { width:min(100%,560px); margin:0 auto; padding:10px 18px calc(20px + env(safe-area-inset-bottom)); border-radius:28px 28px 0 0; color:#26315b; background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,244,255,.94)); border:1px solid rgba(255,255,255,.95); box-shadow:0 -18px 55px rgba(45,58,125,.20); }
.profile-sheet-handle { width:38px; height:4px; border-radius:99px; margin:0 auto 17px; background:rgba(99,112,168,.24); }
.profile-sheet-hero { display:flex; align-items:center; gap:13px; min-height:66px; margin-bottom:17px; }
.profile-avatar-button { position:relative; width:62px; height:62px; padding:0; flex:0 0 62px; border:0; background:transparent; cursor:pointer; }
.profile-avatar-input { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); border:0; white-space:nowrap; }
.profile-avatar-large { width:62px; height:62px; border-radius:50%; display:grid; place-items:center; color:#fff; font:700 23px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; background:linear-gradient(135deg,#8d9ce9,#b18add); background-size:cover; background-position:center; border:2px solid rgba(255,255,255,.92); box-shadow:0 8px 20px rgba(87,104,184,.22); overflow:hidden; }
.profile-avatar-button i { position:absolute; right:-5px; bottom:-2px; padding:3px 5px; border-radius:8px; color:#fff; font:600 9px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; font-style:normal; background:#6477d8; box-shadow:0 3px 8px rgba(67,83,180,.25); }
.profile-user-name { font-size:19px; font-weight:760; letter-spacing:-.25px; }
.profile-user-role { margin-top:4px; color:#7b87aa; font:600 10px/1.2 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; letter-spacing:.75px; }
.profile-close { margin-left:auto; width:38px; height:38px; border:0; border-radius:50%; color:#7580a5; font-size:26px; line-height:1; background:rgba(235,239,255,.72); cursor:pointer; }
.profile-action-group { display:flex; align-items:center; gap:12px; min-height:69px; padding:12px 13px 12px 15px; border:1px solid rgba(255,255,255,.9); border-radius:18px; background:rgba(245,247,255,.72); box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
.profile-action-copy { display:grid; min-width:0; gap:5px; }
.profile-action-copy b { font-size:14px; }
.profile-action-copy span { color:#7d88aa; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-action-button { margin-left:auto; min-width:64px; height:34px; border:0; border-radius:12px; color:#5367cc; font-weight:700; background:rgba(220,226,255,.76); }
.phone-binding-panel { display:grid; grid-template-columns:minmax(0,1fr) 92px; gap:9px; margin-top:10px; padding:13px; border-radius:17px; background:rgba(237,241,255,.7); }
.phone-binding-panel label { display:grid; gap:5px; color:#68769c; font-size:11px; }
.phone-binding-panel input { width:100%; box-sizing:border-box; height:37px; padding:0 10px; border:1px solid rgba(174,185,231,.48); border-radius:11px; outline:0; color:#354164; background:rgba(255,255,255,.88); }
.phone-binding-panel button { align-self:end; height:37px; border:0; border-radius:11px; color:#fff; font-size:12px; background:linear-gradient(135deg,#6a7fe2,#9079d4); }
.phone-binding-panel p { grid-column:1/-1; margin:0; color:#8993b1; font-size:10px; line-height:1.45; }
.profile-logout { width:100%; height:45px; margin-top:12px; border:1px solid rgba(232,133,156,.2); border-radius:15px; color:#c76580; font-weight:700; background:rgba(255,239,243,.76); }

@media (max-width:768px) {
  body[data-page="home"] .home-leaderboard { display:block; position:relative; overflow:hidden; margin:0 0 12px; padding:14px; border:1px solid rgba(255,255,255,.88); border-radius:22px; background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(236,240,255,.55)); box-shadow:0 9px 25px rgba(82,95,162,.11),inset 0 1px 0 rgba(255,255,255,.86); }
  body[data-page="home"] .home-leaderboard::before { content:""; position:absolute; width:150px; height:150px; right:-68px; top:-84px; border-radius:50%; background:radial-gradient(circle,rgba(202,180,255,.32),rgba(202,180,255,0) 70%); pointer-events:none; }
  body[data-page="home"] .home-leaderboard-head { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 2px 11px; }
  body[data-page="home"] .home-leaderboard-eyebrow { color:#7785c7; font-size:9px; font-weight:800; letter-spacing:1.1px; }
  body[data-page="home"] .home-leaderboard h2 { margin:3px 0 0; color:#303c6c; font-size:16px; font-weight:780; line-height:1.1; }
  body[data-page="home"] .home-leaderboard-live { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; color:#71809d; border:1px solid rgba(255,255,255,.68); border-radius:999px; background:rgba(255,255,255,.38); font-size:10px; font-weight:700; white-space:nowrap; }
  body[data-page="home"] .home-leaderboard-live i { width:5px; height:5px; border-radius:50%; background:#70c5aa; box-shadow:0 0 0 3px rgba(112,197,170,.14); }
  body[data-page="home"] .home-leaderboard-list { position:relative; z-index:1; display:grid; gap:7px; }
  body[data-page="home"] .home-leader-card { display:flex; align-items:center; min-height:50px; gap:9px; padding:7px 9px; border:1px solid rgba(255,255,255,.72); border-radius:16px; background:rgba(255,255,255,.35); box-shadow:inset 0 1px 0 rgba(255,255,255,.66); }
  body[data-page="home"] .home-leader-rank { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border-radius:10px; color:#fff; font-size:14px; background:linear-gradient(135deg,#e6ae63,#cc8d56); box-shadow:0 5px 11px rgba(208,147,83,.2); }
  body[data-page="home"] .home-leader-recharge .home-leader-rank { background:linear-gradient(135deg,#aa83df,#7f86db); }
  body[data-page="home"] .home-leader-overtime .home-leader-rank { background:linear-gradient(135deg,#dc997a,#ca7279); }
  body[data-page="home"] .home-leader-avatar { display:grid; place-items:center; width:33px; height:33px; flex:0 0 33px; overflow:hidden; color:#fff; border:1.5px solid rgba(255,255,255,.92); border-radius:50%; background:#8d9ce9 linear-gradient(135deg,#8d9ce9,#b18add); background-size:cover; background-position:center; box-shadow:0 3px 8px rgba(87,104,184,.17); font-size:12px; font-weight:750; }
  body[data-page="home"] .home-leader-copy { display:grid; gap:2px; min-width:0; }
  body[data-page="home"] .home-leader-copy small { color:#8993ae; font-size:9px; font-weight:650; line-height:1.1; }
  body[data-page="home"] .home-leader-copy b { overflow:hidden; color:#35416d; font-size:13px; font-weight:780; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
  body[data-page="home"] .home-leader-card strong { margin-left:auto; color:#5b69b4; font-size:14px; font-weight:800; white-space:nowrap; }
  body[data-page="home"] .home-leader-card.is-empty { opacity:.72; }
  body[data-page="home"] .home-leader-card.is-empty .home-leader-copy { flex:1; }
  body[data-page="home"] .home-leader-card.is-empty strong { color:#9aa2b5; font-size:11px; font-weight:650; }
  body[data-page="home"] .home-leaderboard-empty { padding:15px; text-align:center; color:#8e98b2; font-size:12px; }
  body[data-page="home"] .portal { position:relative; }
  body[data-page="home"] .portal-compact-bar { position:absolute !important; top:11px; right:14px; z-index:2; width:46px; min-height:46px !important; margin:0 !important; }
  body[data-page="home"] .portal-date { display:none !important; }
  body[data-page="home"] .home-overview { display:block; margin:3px 0 17px; padding:12px 2px 0; }
  body[data-page="home"] .home-overview-hero { padding:0 9px; }
  body[data-page="home"] .home-overview-date { display:block; margin-bottom:7px; color:#8793bd; font-size:11px; font-weight:700; letter-spacing:.4px; }
  body[data-page="home"] .home-overview h1 { margin:0; color:#242f65; font-size:31px; line-height:1.12; font-weight:820; letter-spacing:-1px; }
  body[data-page="home"] .home-overview p { margin:8px 0 18px; color:#7785b5; font-size:13px; }
  body[data-page="home"] .home-status-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  body[data-page="home"] .home-status-card { display:flex; align-items:center; gap:10px; min-width:0; min-height:66px; padding:10px 10px; box-sizing:border-box; border:1px solid rgba(255,255,255,.88); border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(235,240,255,.55)); box-shadow:0 8px 20px rgba(76,91,159,.09),inset 0 1px 0 rgba(255,255,255,.9); }
  body[data-page="home"] a.home-status-card { text-decoration:none; }
  body[data-page="home"] .home-status-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:50%; color:#fff; font-size:20px; line-height:1; background:linear-gradient(135deg,#8c99ed,#aa89df); box-shadow:0 5px 13px rgba(92,104,211,.25),inset 0 1px 1px rgba(255,255,255,.55); }
  body[data-page="home"] .home-status-icon svg { width:19px; height:19px; }
  body[data-page="home"] .home-status-card div { display:grid; gap:4px; min-width:0; }
  body[data-page="home"] .home-status-card small { color:#7d89b0; font-size:10px; white-space:nowrap; }
  body[data-page="home"] .home-status-card b { color:#34416f; font-size:13px; white-space:nowrap; }
  body[data-page="home"] .home-status-card i { display:inline-block; width:8px; height:8px; margin-left:4px; border-radius:50%; background:#43bc61; }
  body[data-page="home"] .home-status-card i.is-rest { background:#91a0c8; }
  body[data-page="home"] .home-status-card i.is-leave { background:#d49bad; }
  body[data-page="home"] .home-revenue-card { position:relative; display:flex; justify-content:space-between; align-items:center; min-height:142px; margin-top:12px; padding:21px; box-sizing:border-box; overflow:hidden; text-decoration:none; border:1px solid rgba(255,255,255,.94); border-radius:25px; background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(235,240,255,.6)); box-shadow:0 12px 28px rgba(74,88,163,.13),inset 0 1px 0 rgba(255,255,255,.94); }
  body[data-page="home"] .home-revenue-card div { position:relative; z-index:1; display:grid; gap:7px; }
  body[data-page="home"] .home-revenue-card small { color:#7280b1; font-size:13px; }
  body[data-page="home"] .home-revenue-card b { color:#27346e; font-size:36px; line-height:1; letter-spacing:-1px; }
  body[data-page="home"] .home-revenue-card span { color:#7d8bd0; font-size:11px; }
  body[data-page="home"] .home-revenue-line { position:absolute !important; right:18px; bottom:30px; display:flex !important; align-items:end; gap:5px; height:58px; opacity:.92; }
  body[data-page="home"] .home-revenue-line i { display:block; width:13px; border-radius:10px 10px 3px 3px; background:linear-gradient(#6c7ee5,rgba(127,142,242,.18)); }
  body[data-page="home"] .home-revenue-line i:nth-child(1){height:20px}.home-revenue-line i:nth-child(2){height:31px}.home-revenue-line i:nth-child(3){height:43px}.home-revenue-line i:nth-child(4){height:57px}
  body[data-page="home"] .home-revenue-card { min-height:66px; height:66px; margin-top:10px; padding:6px 4px; justify-content:stretch; border-radius:20px; }
  body[data-page="home"] .home-revenue-card .home-metric { flex:1 1 0; display:grid; grid-template-columns:34px minmax(0,1fr); grid-template-rows:auto auto; column-gap:8px; row-gap:1px; min-width:0; padding:0 8px; }
  body[data-page="home"] .home-revenue-card .home-metric + .home-metric { border-left:1px solid rgba(116,130,197,.14); }
  body[data-page="home"] .home-revenue-card .home-metric-icon { grid-row:1 / 3; display:grid; place-items:center; width:32px; height:32px; align-self:center; border-radius:12px; color:#6578dd; background:linear-gradient(135deg,rgba(221,227,255,.95),rgba(244,238,255,.82)); }
  body[data-page="home"] .home-revenue-card .home-contribution .home-metric-icon { color:#bd75a1; background:linear-gradient(135deg,rgba(255,228,240,.92),rgba(247,235,255,.8)); }
  body[data-page="home"] .home-revenue-card .home-metric-icon svg { width:18px; height:18px; }
  body[data-page="home"] .home-revenue-card .home-metric small { align-self:end; font-size:11px; white-space:nowrap; }
  body[data-page="home"] .home-revenue-card .home-metric b { align-self:start; font-size:18px; letter-spacing:-.35px; white-space:nowrap; }
  body[data-page="home"] .home-revenue-card .home-revenue-line { display:none !important; }
  body[data-page="home"] { min-height:100dvh; background:radial-gradient(circle at 94% 3%,rgba(182,199,255,.54),transparent 33%),radial-gradient(circle at 0 45%,rgba(238,210,255,.39),transparent 32%),linear-gradient(160deg,#f7f8ff 0%,#edf2ff 48%,#f8f6fe 100%); }
  body[data-page="home"] .portal { max-width:650px !important; padding:14px 13px calc(94px + env(safe-area-inset-bottom)) !important; }
  body[data-page="home"] .portal-compact-bar { min-height:48px; margin:0 1px 13px !important; }
  body[data-page="home"] .portal-date { color:#2f3a67; font-size:14px !important; font-weight:740; letter-spacing:-.15px; }
  body[data-page="home"] .portal-account { display:flex !important; align-items:center; gap:8px; min-width:44px; min-height:44px; padding:3px !important; border-radius:50% !important; background:transparent !important; }
  body[data-page="home"] .portal-account-name { display:none !important; }
  body[data-page="home"] .notice-board, body[data-page="home"] #attendanceBoard.attendance-board { overflow:hidden; border:1px solid rgba(255,255,255,.88) !important; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(238,242,255,.49)) !important; box-shadow:0 9px 25px rgba(82,95,162,.11),inset 0 1px 0 rgba(255,255,255,.84) !important; }
body[data-page="home"] .notice-board { padding:15px 15px 13px !important; margin-bottom:12px !important; border-radius:22px !important; }
  body[data-page="home"] .notice-board-head { margin-bottom:10px !important; }
  body[data-page="home"] .notice-bell, body[data-page="home"] .attendance-heading-icon { width:32px !important; height:32px !important; border-radius:12px !important; }
  body[data-page="home"] .notice-title, body[data-page="home"] .attendance-title { color:#303c6c !important; font-size:16px !important; font-weight:780 !important; }
  body[data-page="home"] .notice-eyebrow, body[data-page="home"] .attendance-eyebrow { color:#8490b9 !important; font-size:9px !important; letter-spacing:1px !important; }
body[data-page="home"] .notice-live { padding:5px 7px !important; color:#8590b4 !important; font-size:10px !important; background:rgba(245,247,255,.7); }

/* 首页首屏优先让关键信息一眼可见：通知保持完整内容，但收紧标题、正文和外框。 */
body[data-page="home"] .notice-board { padding:11px 12px 10px !important; margin-bottom:9px !important; border-radius:18px !important; }
body[data-page="home"] .notice-board-head { gap:9px; margin-bottom:6px !important; }
body[data-page="home"] .notice-bell { width:28px !important; height:28px !important; border-radius:10px !important; }
body[data-page="home"] .notice-bell svg { width:15px; height:15px; }
body[data-page="home"] .notice-title { font-size:14px !important; }
body[data-page="home"] .notice-eyebrow { font-size:8px !important; letter-spacing:.85px !important; }
body[data-page="home"] .notice-live { padding:4px 6px !important; font-size:9px !important; }
body[data-page="home"] .notice-message { padding:8px 10px 7px !important; border-radius:12px; }
body[data-page="home"] .notice-message-content { font-size:12px; line-height:1.45; }
body[data-page="home"] .notice-message-footer { margin-top:5px; }
body[data-page="home"] .notice-message-meta,
body[data-page="home"] .notice-receipt,
body[data-page="home"] .notice-received { font-size:10px !important; }
  body[data-page="home"] #attendanceBoard.attendance-board { padding:14px 14px 12px !important; margin-bottom:10px !important; border-radius:22px !important; }
  body[data-page="home"] #attendanceBoard .attendance-board-head { margin-bottom:8px !important; }
  body[data-page="home"] .attendance-date { color:#6171b6 !important; font-size:11px !important; }
  body[data-page="home"] .attendance-store-card { padding:11px !important; margin-top:8px !important; border-radius:16px !important; background:rgba(255,255,255,.48) !important; border-color:rgba(255,255,255,.72) !important; }
  body[data-page="home"] .attendance-store-card-head { min-height:24px; }
  body[data-page="home"] .attendance-store-name { color:#3f4d82; font-size:13px !important; font-weight:760; }
  body[data-page="home"] .attendance-roster-columns { margin-top:6px !important; padding:0 4px 4px !important; font-size:9px !important; }
  body[data-page="home"] .attendance-roster-row { min-height:38px !important; padding:4px 4px !important; }
  body[data-page="home"] .attendance-teacher b { width:22px !important; height:22px !important; font-size:9px !important; }
  body[data-page="home"] .attendance-teacher span { font-size:12px !important; }
  body[data-page="home"] .attendance-shift-chip, body[data-page="home"] .attendance-status-chip { min-height:24px !important; padding:3px 6px !important; font-size:10px !important; }
  body[data-page="home"] #attendanceBoard:not(.is-expanded) .attendance-list { max-height:none; overflow:visible; mask-image:none; -webkit-mask-image:none; }
  body[data-page="home"] .attendance-expand { display:none; }
  body[data-page="home"] .attendance-expand span { margin-left:4px; font-size:18px; vertical-align:-1px; }
  #om-tabbar.om-dock-v3 { height:62px !important; padding:5px max(10px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left)) !important; border-radius:22px 22px 0 0 !important; }
  #om-tabbar.om-dock-v3 .om-dock-item { height:52px !important; padding:0 !important; justify-content:center !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { width:25px !important; height:25px !important; }
  #om-tabbar.om-dock-v3 .om-dock-label { display:none !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { transform:translateY(-1px) scale(1.08); }
}

/* Android WebView can report a non-zero safe-area while its system navigation bar is
   already outside the WebView. Keep the icon-only dock to one deliberate 64px rail. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 {
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:auto !important;
    min-height:0 !important;
    max-height:64px !important;
    height:64px !important;
    padding:6px 12px !important;
    gap:0 !important;
    align-items:center !important;
    justify-content:space-around !important;
    border-radius:22px 22px 0 0 !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item {
    flex:1 1 0 !important;
    min-height:0 !important;
    height:48px !important;
    margin:0 !important;
    align-self:center !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-icon { width:27px !important; height:27px !important; }
}

/* Home summary owns these functions; the detailed panels open only on demand. */
.attendance-detail-close { display:none; }
@media (max-width:768px) {
  body[data-page="home"] button.home-status-card { width:100%; text-align:left; font:inherit; cursor:pointer; }
  body[data-page="home"] .home-clock-entry { display:none !important; }
  body[data-page="home"] #attendanceBoard { display:none !important; }
  body[data-page="home"] #attendanceBoard.is-home-detail { display:block !important; }
  body[data-page="home"] .attendance-detail-close { display:none; }
  body[data-page="home"] #attendanceBoard.is-home-detail .attendance-detail-close { display:block; width:auto; margin:0 0 8px; padding:0; border:0; color:#6b7bd2; font-size:12px; font-weight:720; background:transparent; }
}

/* v7 final cascade: the bottom dock is a thin refractive layer, never an opaque white bar. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 { overflow:hidden !important; isolation:isolate !important; background:rgba(225,232,220,.18) !important; border:1px solid rgba(255,255,255,.58) !important; box-shadow:0 12px 32px rgba(37,49,38,.13),inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(54,76,57,.11) !important; backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important; -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important; }
  #om-tabbar.om-dock-v3::before { z-index:0; background:linear-gradient(112deg,rgba(255,255,255,.34),rgba(255,255,255,.04) 45%,rgba(204,223,199,.15)) !important; }
  #om-tabbar.om-dock-v3 .om-dock-liquid { opacity:1 !important; border-color:rgba(255,255,255,.48) !important; background:rgba(184,207,179,.26) !important; box-shadow:0 4px 10px rgba(42,69,47,.08),inset 0 1px 0 rgba(255,255,255,.64),inset 0 -1px 0 rgba(73,105,77,.07) !important; backdrop-filter:blur(12px) saturate(130%); -webkit-backdrop-filter:blur(12px) saturate(130%); }
  #om-tabbar.om-dock-v3 .om-dock-liquid::after { background:linear-gradient(180deg,rgba(255,255,255,.29),transparent 48%) !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { filter:grayscale(.18) sepia(.25) hue-rotate(68deg) saturate(.7) !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { filter:sepia(.45) hue-rotate(68deg) saturate(.95) drop-shadow(0 2px 3px rgba(47,77,52,.12)) !important; }
}

/* v8 welcome final cascade: shares the home canvas and avoids expensive image decoding. */
#welcomeOverlay.welcome-glass-overlay { background:rgba(242,240,234,.14) !important; animation:none !important; backdrop-filter:blur(4px) saturate(108%) !important; -webkit-backdrop-filter:blur(4px) saturate(108%) !important; }
#welcomeOverlay.welcome-glass-overlay::before,#welcomeOverlay.welcome-glass-overlay::after,#welcomeOverlay .welcome-orb { display:none !important; }
#welcomeOverlay .welcome-glass-card { width:min(100% - 28px,460px) !important; padding:22px 16px 20px !important; border:1px solid rgba(255,255,255,.76) !important; border-radius:30px !important; color:#324333 !important; background:rgba(246,247,239,.40) !important; box-shadow:0 14px 36px rgba(57,66,47,.15),inset 0 1px 0 rgba(255,255,255,.82) !important; backdrop-filter:blur(12px) saturate(116%) !important; -webkit-backdrop-filter:blur(12px) saturate(116%) !important; }
#welcomeOverlay .welcome-logo { width:82px !important; height:82px !important; margin-bottom:10px !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
#welcomeOverlay .welcome-brand { color:#354637 !important; text-shadow:none !important; font-size:29px !important; }
#welcomeOverlay .welcome-family-label { margin:12px 0 7px !important; color:#5a705d !important; text-shadow:none !important; }
#welcomeOverlay .welcome-family { gap:8px 5px !important; padding:10px 8px !important; border-radius:22px !important; background:rgba(255,255,255,.29) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.68) !important; backdrop-filter:blur(8px) !important; -webkit-backdrop-filter:blur(8px) !important; }
#welcomeOverlay .welcome-family-member { color:#405542 !important; text-shadow:none !important; }
#welcomeOverlay .welcome-family-member i { width:39px !important; height:39px !important; box-shadow:0 5px 12px rgba(54,72,52,.13),inset 0 1px 0 rgba(255,255,255,.6) !important; }
#welcomeOverlay .welcome-glass-card .welcome-enter { min-height:54px !important; margin-top:17px !important; color:#fff !important; background:rgba(80,112,84,.68) !important; box-shadow:0 8px 20px rgba(49,76,53,.16),inset 0 1px 0 rgba(255,255,255,.5) !important; backdrop-filter:blur(8px) !important; -webkit-backdrop-filter:blur(8px) !important; }

/* v7.4b always wins: liquid welcome action after every legacy colour override. */
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter {
  position:relative !important; overflow:hidden !important; color:#f7fbff !important; font-weight:800 !important;
  background:linear-gradient(112deg,rgba(16,46,80,.50),rgba(57,89,132,.30) 48%,rgba(88,141,174,.35)) !important;
  border:1px solid rgba(255,255,255,.76) !important;
  box-shadow:0 17px 34px rgba(63,78,102,.18),inset 0 1px 0 rgba(255,255,255,.88),inset 0 -1px 0 rgba(72,91,116,.13) !important;
  backdrop-filter:blur(30px) saturate(150%) brightness(1.10) !important;
  -webkit-backdrop-filter:blur(30px) saturate(150%) brightness(1.10) !important;
}
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(112deg,rgba(255,255,255,.42),rgba(255,255,255,.05) 42%,rgba(217,255,255,.22)); }
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter:active { transform:scale(.975); box-shadow:0 8px 18px rgba(58,69,172,.22),inset 0 1px 0 rgba(255,255,255,.52) !important; }

/* v7.4 final welcome action: a refractive glass capsule, never a solid green button. */
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter {
  position:relative !important;
  overflow:hidden !important;
  color:#f7fbff !important;
  background:linear-gradient(112deg,rgba(16,46,80,.50),rgba(57,89,132,.30) 48%,rgba(88,141,174,.35)) !important;
  border:1px solid rgba(255,255,255,.76) !important;
  box-shadow:0 17px 34px rgba(58,69,172,.23),inset 0 1px 0 rgba(255,255,255,.74),inset 0 -1px 0 rgba(49,65,155,.16) !important;
  backdrop-filter:blur(30px) saturate(185%) brightness(1.08) !important;
  -webkit-backdrop-filter:blur(30px) saturate(185%) brightness(1.08) !important;
}
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(112deg,rgba(255,255,255,.42),rgba(255,255,255,.05) 42%,rgba(217,255,255,.22)); }
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter span { position:relative; z-index:1; }
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter { text-shadow:0 1px 10px rgba(26,39,110,.42); }
body[data-page="home"] #welcomeOverlay .welcome-glass-card .welcome-enter:active { transform:scale(.975); box-shadow:0 8px 18px rgba(58,69,172,.22),inset 0 1px 0 rgba(255,255,255,.52) !important; }

/* v7.1 welcome: a translucent arrival scene, with refracted spa light behind the family. */
.welcome-glass-overlay {
  isolation:isolate;
  background:
    linear-gradient(138deg, rgba(42,65,49,.25), rgba(231,236,222,.10) 42%, rgba(99,132,108,.24)),
    url('assets/spa-material-background-v1.png') center/cover !important;
  backdrop-filter:blur(10px) saturate(128%) !important;
  -webkit-backdrop-filter:blur(10px) saturate(128%) !important;
}
.welcome-glass-overlay::before,
.welcome-glass-overlay::after {
  content:""; position:absolute; z-index:-1; pointer-events:none; border-radius:50%; filter:blur(34px); opacity:.78;
}
.welcome-glass-overlay::before { width:58vw; height:58vw; min-width:290px; min-height:290px; left:-18vw; top:8vh; background:rgba(223,242,213,.58); }
.welcome-glass-overlay::after { width:62vw; height:62vw; min-width:320px; min-height:320px; right:-26vw; bottom:-6vh; background:rgba(166,203,178,.48); }
.welcome-glass-card {
  overflow:hidden !important;
  background:linear-gradient(145deg,rgba(255,255,255,.40),rgba(240,247,235,.14) 55%,rgba(218,234,220,.25)) !important;
  border-color:rgba(255,255,255,.74) !important;
  box-shadow:0 30px 76px rgba(27,49,32,.20), inset 0 1px 0 rgba(255,255,255,.86), inset 0 -1px 0 rgba(60,96,64,.11) !important;
  backdrop-filter:blur(34px) saturate(155%) brightness(1.06) !important;
  -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.06) !important;
}
.welcome-glass-card::before { display:block !important; background:linear-gradient(118deg,rgba(255,255,255,.40),rgba(255,255,255,.04) 40%,rgba(203,230,207,.17)) !important; }
.welcome-family { background:linear-gradient(145deg,rgba(255,255,255,.44),rgba(218,236,218,.15)) !important; border-color:rgba(255,255,255,.72) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.86),inset 0 -1px 0 rgba(60,96,64,.09),0 12px 28px rgba(44,69,48,.11) !important; backdrop-filter:blur(20px) saturate(145%) !important; -webkit-backdrop-filter:blur(20px) saturate(145%) !important; }
.welcome-glass-card .welcome-enter, .welcome-enter { background:linear-gradient(115deg,rgba(53,94,62,.86),rgba(78,119,82,.72)) !important; box-shadow:0 12px 28px rgba(32,70,43,.20),inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(31,75,42,.18) !important; backdrop-filter:blur(16px) saturate(135%); -webkit-backdrop-filter:blur(16px) saturate(135%); }
@media (max-width:768px) {
  .welcome-glass-card { background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(243,249,240,.08) 55%,rgba(199,225,202,.16)) !important; }
}

/* v7.2: remove the milky full-screen sheet—the arrival screen must reveal its coloured layer. */
.welcome-glass-overlay {
  background:
    radial-gradient(ellipse 72% 54% at 6% 7%, rgba(255,224,168,.66), transparent 69%),
    radial-gradient(ellipse 68% 56% at 100% 28%, rgba(164,219,194,.68), transparent 71%),
    radial-gradient(ellipse 85% 68% at 52% 102%, rgba(99,151,130,.62), transparent 70%),
    linear-gradient(145deg, #6c8e7c 0%, #aac6ad 43%, #d8d6b9 100%) !important;
  background-blend-mode:screen,screen,soft-light,normal !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.welcome-glass-overlay::before { width:72vw; height:72vw; min-width:390px; min-height:390px; left:-30vw; top:22vh; opacity:.52; background:rgba(255,250,230,.74); filter:blur(54px); }
.welcome-glass-overlay::after { width:82vw; height:82vw; min-width:430px; min-height:430px; right:-38vw; bottom:-15vh; opacity:.43; background:rgba(49,113,88,.72); filter:blur(62px); }
.welcome-glass-card {
  background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(251,255,247,.025) 54%,rgba(218,245,226,.10)) !important;
  border-color:rgba(255,255,255,.36) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34), inset 0 -1px 0 rgba(31,72,48,.10) !important;
  backdrop-filter:blur(13px) saturate(138%) brightness(1.03) !important;
  -webkit-backdrop-filter:blur(13px) saturate(138%) brightness(1.03) !important;
}
.welcome-glass-card::before { opacity:.78; background:linear-gradient(118deg,rgba(255,255,255,.24),rgba(255,255,255,.015) 44%,rgba(239,255,228,.08)) !important; }
.welcome-brand { color:#173d32 !important; text-shadow:0 2px 16px rgba(255,255,255,.25); }
.welcome-slogan,.welcome-note { color:#355c4b !important; text-shadow:0 1px 10px rgba(255,255,255,.42); }
.welcome-family-label { color:#416453 !important; }
.welcome-family {
  background:linear-gradient(145deg,rgba(255,255,255,.32),rgba(235,250,236,.12)) !important;
  border-color:rgba(255,255,255,.52) !important;
  box-shadow:0 14px 32px rgba(24,61,39,.13),inset 0 1px 0 rgba(255,255,255,.63),inset 0 -1px 0 rgba(41,93,58,.10) !important;
  backdrop-filter:blur(24px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(150%) !important;
}
.welcome-family-member { color:#254d3b !important; text-shadow:0 1px 6px rgba(255,255,255,.42); }
.welcome-glass-card .welcome-enter,.welcome-enter { background:linear-gradient(115deg,rgba(25,81,53,.70),rgba(66,128,88,.61)) !important; border-color:rgba(255,255,255,.48) !important; box-shadow:0 14px 30px rgba(20,63,38,.22),inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(13,59,35,.18) !important; }

/* v7.3 welcome: actual liquid glass—coloured light lives behind floating materials, never a green frosted sheet. */
.welcome-glass-overlay {
  background:
    radial-gradient(ellipse 76% 55% at -8% 2%, rgba(139,179,255,.92), transparent 67%),
    radial-gradient(ellipse 68% 57% at 107% 10%, rgba(245,191,255,.76), transparent 68%),
    radial-gradient(ellipse 78% 55% at 84% 103%, rgba(104,224,223,.72), transparent 70%),
    radial-gradient(ellipse 65% 54% at 12% 94%, rgba(255,211,145,.68), transparent 69%),
    linear-gradient(145deg,#5c79ab 0%,#c9c5df 48%,#8cc9c7 100%) !important;
  background-size:130% 130%, 125% 125%, 128% 128%, 132% 132%,100% 100% !important;
  animation:welcome-liquid-light 16s ease-in-out infinite alternate;
}
@keyframes welcome-liquid-light { from { background-position:0% 0%,100% 0%,100% 100%,0% 100%,center; } to { background-position:16% 8%,86% 14%,86% 82%,13% 85%,center; } }
.welcome-glass-overlay::before { width:58vw; height:58vw; min-width:320px; min-height:320px; left:-25vw; top:29vh; opacity:.48; background:rgba(255,255,255,.84); filter:blur(64px); }
.welcome-glass-overlay::after { width:68vw; height:68vw; min-width:370px; min-height:370px; right:-34vw; bottom:-19vh; opacity:.40; background:rgba(83,87,223,.75); filter:blur(70px); }
.welcome-glass-card {
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.welcome-glass-card::before { display:none !important; }
.welcome-logo {
  background:linear-gradient(145deg,rgba(255,255,255,.57),rgba(255,255,255,.18)) !important;
  border-color:rgba(255,255,255,.74) !important;
  box-shadow:0 18px 34px rgba(39,65,128,.20),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(87,95,160,.12) !important;
  backdrop-filter:blur(24px) saturate(165%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(165%) !important;
}
.welcome-brand { color:#f7fbff !important; text-shadow:0 3px 18px rgba(0,10,30,.54); }
.welcome-slogan,.welcome-note { color:rgba(245,250,255,.92) !important; text-shadow:0 2px 12px rgba(0,10,30,.48); }
.welcome-family-label { color:rgba(237,247,255,.88) !important; text-shadow:0 2px 10px rgba(0,10,30,.42); }
.welcome-family {
  background:linear-gradient(142deg,rgba(14,35,62,.44),rgba(37,69,105,.24) 54%,rgba(88,111,152,.19)) !important;
  border-color:rgba(231,247,255,.68) !important;
  box-shadow:0 22px 46px rgba(0,10,28,.32),inset 0 1px 0 rgba(255,255,255,.62),inset 0 -1px 0 rgba(133,192,224,.17) !important;
  backdrop-filter:blur(34px) saturate(155%) brightness(1.10) !important;
  -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.10) !important;
}
.welcome-family-member { color:#f4f8ff !important; text-shadow:0 2px 8px rgba(0,12,34,.54); }
.welcome-family-member i { background:linear-gradient(145deg,rgba(80,119,155,.92),rgba(24,52,82,.92)) !important; border-color:rgba(239,249,255,.84) !important; box-shadow:0 8px 20px rgba(0,10,28,.32),inset 0 1px 0 rgba(255,255,255,.72) !important; }
.welcome-glass-card .welcome-enter,.welcome-enter {
  background:linear-gradient(115deg,rgba(57,82,174,.56),rgba(126,105,205,.42) 48%,rgba(56,159,170,.45)) !important;
  border-color:rgba(255,255,255,.72) !important;
  box-shadow:0 16px 34px rgba(48,62,154,.25),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(43,58,142,.16) !important;
  backdrop-filter:blur(28px) saturate(170%) brightness(1.08) !important;
  -webkit-backdrop-filter:blur(28px) saturate(170%) brightness(1.08) !important;
}
@media (prefers-reduced-motion:reduce) { .welcome-glass-overlay { animation:none; } }

/* v6.1 final cascade: mobile repairs must win over legacy page-specific material rules. */
@media (max-width:768px) {
  body[data-page="daily"] .add-row button,
  body[data-page="daily"] .mobile-add-row,
  body[data-page="daily"] .mobile-add-row button { display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:46px !important; color:#fff !important; background:rgba(58,91,67,.92) !important; border:1px solid rgba(255,255,255,.45) !important; box-shadow:0 8px 18px rgba(36,68,45,.20),inset 0 1px 0 rgba(255,255,255,.28) !important; text-shadow:0 1px 1px rgba(20,42,26,.20) !important; }
  body[data-page="member"] .member-app { width:100% !important; max-width:none !important; margin:0 !important; padding:12px 14px calc(110px + env(safe-area-inset-bottom)) !important; box-sizing:border-box !important; }
  body[data-page="member"] .member-sidebar, body[data-page="member"] .detail-panel { width:100% !important; max-width:none !important; }
  #om-tabbar.om-dock-v3 { transition:transform .30s cubic-bezier(.2,.8,.2,1),opacity .20s ease !important; }
  body.profile-sheet-open #om-tabbar { opacity:0 !important; pointer-events:none !important; transform:translateY(calc(100% + 34px)) !important; }
  body[data-page="home"] .portal { background:transparent !important; border:0 !important; box-shadow:none !important; }
  body[data-page="home"] .home-overview { margin:12px 12px 14px !important; padding:16px !important; overflow:hidden !important; border:1px solid rgba(255,255,255,.68) !important; border-radius:28px !important; background:rgba(248,247,240,.34) !important; box-shadow:0 14px 30px rgba(50,58,46,.10),inset 0 1px 0 rgba(255,255,255,.70) !important; backdrop-filter:blur(16px) saturate(118%) !important; -webkit-backdrop-filter:blur(16px) saturate(118%) !important; }
}
.welcome-glass-overlay { background:linear-gradient(180deg,rgba(1,10,25,.08),rgba(1,10,25,.30)),url('assets/welcome-liquid-v1.png?v=20260729-deepglass') center/cover no-repeat !important; animation:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.welcome-glass-overlay .welcome-orb { display:none !important; }
.welcome-glass-card { color:#263a70 !important; border-color:transparent !important; background:transparent !important; box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.welcome-glass-card .welcome-enter, .welcome-enter { color:#f7fbff !important; border:1px solid rgba(237,248,255,.76) !important; background:linear-gradient(112deg,rgba(16,46,80,.50),rgba(57,89,132,.30) 48%,rgba(88,141,174,.35)) !important; box-shadow:0 18px 38px rgba(0,10,28,.30),inset 0 1px 0 rgba(255,255,255,.66),inset 0 -1px 0 rgba(129,202,235,.17) !important; text-shadow:0 2px 9px rgba(0,9,25,.64) !important; backdrop-filter:blur(30px) saturate(160%) brightness(1.08) !important; -webkit-backdrop-filter:blur(30px) saturate(160%) brightness(1.08) !important; }

/* v6.2: Home follows the report's single 14px safe edge—never portal padding plus card margin. */
@media (max-width:768px) {
  body[data-page="home"] .portal { width:100% !important; max-width:none !important; margin:0 !important; padding:12px 14px calc(110px + env(safe-area-inset-bottom)) !important; box-sizing:border-box !important; }
  body[data-page="home"] .home-overview { margin:0 0 14px !important; }
}

/* Avatar is one clean circle. The surrounding account button has no second ring. */
@media (max-width:768px) {
  body[data-page="home"] .portal-account { width:48px !important; min-width:48px !important; height:48px !important; min-height:48px !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
  body[data-page="home"] .portal-avatar { width:48px !important; height:48px !important; flex-basis:48px !important; border:1px solid rgba(255,255,255,.82) !important; border-radius:50% !important; box-shadow:0 7px 18px rgba(42,58,44,.18),inset 0 1px 0 rgba(255,255,255,.42) !important; }
}

/* Local cropper: drag to compose, zoom deliberately, then save a compact 360px avatar. */
body.avatar-crop-open { overflow:hidden; }
.avatar-crop-mask { position:fixed; z-index:14000; inset:0; display:grid; place-items:center; padding:22px; box-sizing:border-box; background:rgba(25,34,27,.40); backdrop-filter:blur(15px) saturate(115%); -webkit-backdrop-filter:blur(15px) saturate(115%); }
.avatar-crop-mask[hidden] { display:none !important; }
.avatar-crop-sheet { width:min(100%,380px); padding:20px; border:1px solid rgba(255,255,255,.74); border-radius:30px; color:#26352a; background:rgba(248,247,240,.80); box-shadow:0 26px 64px rgba(25,38,29,.28),inset 0 1px 0 rgba(255,255,255,.82); backdrop-filter:blur(26px) saturate(120%); -webkit-backdrop-filter:blur(26px) saturate(120%); }
.avatar-crop-head { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.avatar-crop-head small { color:#7b8b7a; font-size:9px; font-weight:800; letter-spacing:1.1px; }
.avatar-crop-head h2 { margin:3px 0 0; font-size:20px; line-height:1.15; }
.avatar-crop-head button { display:grid; place-items:center; width:34px; height:34px; padding:0; border:1px solid rgba(255,255,255,.72); border-radius:50%; color:#657265; background:rgba(255,255,255,.46); font-size:24px; line-height:1; }
.avatar-crop-sheet > p { margin:8px 0 17px; color:#738073; font-size:12px; }
.avatar-crop-stage { width:280px; height:280px; max-width:100%; margin:0 auto; overflow:hidden; border:3px solid rgba(255,255,255,.88); border-radius:50%; background:#e8e5dc; box-shadow:0 11px 25px rgba(43,58,45,.18),inset 0 0 0 1px rgba(54,81,59,.12); touch-action:none; cursor:grab; }
.avatar-crop-stage:active { cursor:grabbing; }
.avatar-crop-stage canvas { display:block; width:100%; height:100%; }
.avatar-crop-zoom { display:grid; grid-template-columns:32px minmax(0,1fr) 32px; align-items:center; gap:8px; margin:17px 2px 18px; color:#718071; font-size:10px; text-align:center; }
.avatar-crop-zoom input { width:100%; accent-color:#58755c; }
.avatar-crop-actions { display:grid; grid-template-columns:1fr 1.35fr; gap:10px; }
.avatar-crop-actions button { min-height:44px; border-radius:15px; font:750 13px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; }
.avatar-crop-cancel { border:1px solid rgba(204,213,202,.9); color:#657265; background:rgba(255,255,255,.50); }
.avatar-crop-confirm { border:1px solid rgba(255,255,255,.46); color:#fff; background:#405d49; box-shadow:0 8px 18px rgba(49,78,56,.20),inset 0 1px 0 rgba(255,255,255,.26); }

/* Render the saved crop as an actual image, not a CSS background that could apply its own crop. */
.portal-avatar,.profile-avatar-large { overflow:hidden !important; }
.portal-avatar .custom-avatar-image,.profile-avatar-large .custom-avatar-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }

/* v7 dock: a thin refractive layer that belongs to the photographed spa surface below it. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 {
    overflow:hidden !important;
    isolation:isolate !important;
    background:rgba(225,232,220,.18) !important;
    border:1px solid rgba(255,255,255,.58) !important;
    box-shadow:0 12px 32px rgba(37,49,38,.13),inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(54,76,57,.11) !important;
    backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important;
    -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important;
  }
  #om-tabbar.om-dock-v3::before { z-index:0; background:linear-gradient(112deg,rgba(255,255,255,.34),rgba(255,255,255,.04) 45%,rgba(204,223,199,.15)) !important; }
  #om-tabbar.om-dock-v3 .om-dock-liquid { opacity:1 !important; border-color:rgba(255,255,255,.48) !important; background:rgba(184,207,179,.26) !important; box-shadow:0 4px 10px rgba(42,69,47,.08),inset 0 1px 0 rgba(255,255,255,.64),inset 0 -1px 0 rgba(73,105,77,.07) !important; backdrop-filter:blur(12px) saturate(130%); -webkit-backdrop-filter:blur(12px) saturate(130%); }
  #om-tabbar.om-dock-v3 .om-dock-liquid::after { background:linear-gradient(180deg,rgba(255,255,255,.29),transparent 48%) !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { filter:grayscale(.18) sepia(.25) hue-rotate(68deg) saturate(.7) !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { filter:sepia(.45) hue-rotate(68deg) saturate(.95) drop-shadow(0 2px 3px rgba(47,77,52,.12)) !important; }
}

/* v4 final cascade: must remain last while historical page rules are retained. */
:root { --om-ink:#26312a; --om-muted:#6c756d; --om-accent:#58755c; --om-accent-strong:#405d49; --om-canvas:#f2f0ea; --om-surface:rgba(255,255,252,.62); --om-glass:rgba(248,249,244,.52); --om-line:rgba(255,255,255,.76); --om-shadow:0 18px 42px rgba(47,55,45,.10),0 2px 8px rgba(47,55,45,.06); }
html, body { background:#f2f0ea !important; color:var(--om-ink) !important; }
body { background-image:none !important; }
body::before { background:linear-gradient(115deg,rgba(255,255,252,.62),rgba(234,239,230,.34)) !important; }
.welcome-glass-overlay { background:linear-gradient(180deg,rgba(1,10,25,.08),rgba(1,10,25,.30)),url('assets/welcome-liquid-v1.png?v=20260729-deepglass') center/cover no-repeat !important; }
.welcome-orb { display:none !important; }
.admin-card, .summary-card, .data-card, .detail-container .detail-card,
.header, .view-tabs, .card, .calendar, .today-leaves, .staff-card, .overview-item, .modal,
.login-box, .admin-section, .dm-toolbar, .table-card, .search-box, .login-card, .stat-card,
.clock-card, .history-card, .member-detail, .member-card, .perf-panel, .chart-card,
#attendanceBoard, .portal-header, .result-box, .detail-card, .home-overview, .notice-board,
.home-room-board, .home-leaderboard, .profile-sheet, .room-status-confirm-dialog {
  border-color:var(--om-line) !important;
  background:var(--om-surface) !important;
  box-shadow:0 10px 26px rgba(47,55,45,.075),inset 0 1px 0 rgba(255,255,255,.64) !important;
}
.admin-card,.summary-card,.data-card,.detail-container .detail-card,
body[data-page="performance"] .login-card, body[data-page="clock"] .clock-card,
body[data-page="leave"] .calendar { background:var(--om-surface) !important; }
.modal, .profile-sheet, .room-status-confirm-dialog,
#om-tabbar.om-dock-v3, .portal-account, .home-status-card {
  background:var(--om-glass) !important;
  border:1px solid var(--om-line) !important;
  box-shadow:0 24px 56px rgba(41,50,40,.15),0 4px 14px rgba(41,50,40,.08),inset 0 1px 0 rgba(255,255,255,.86) !important;
  backdrop-filter:blur(22px) saturate(122%) brightness(1.04) !important;
  -webkit-backdrop-filter:blur(22px) saturate(122%) brightness(1.04) !important;
}
.room-status-confirm-dialog::before,.welcome-glass-card::before { display:none !important; }
.modal,.profile-sheet,.room-status-confirm-dialog { border-radius:24px !important; }
.table-card,.dm-table,.perf-table,.admin-table,.calendar { box-shadow:none !important; }
.dm-table th,.perf-table th,.admin-table th,.calendar th { color:#4c5e4f !important; background:rgba(223,230,219,.58) !important; }
.dm-table tbody tr:hover td,.perf-table tbody tr:hover td,.admin-table tbody tr:hover td { background:rgba(239,244,235,.78) !important; }
.login-btn,.save-btn,.notice-publish-btn,.attendance-save,.room-status-confirm-save,.btn-clock,
.perf-tab.active,.view-tab.active { color:#fff !important; background:var(--om-accent-strong) !important; border-color:rgba(255,255,255,.42) !important; box-shadow:0 8px 18px rgba(49,78,56,.20),inset 0 1px 0 rgba(255,255,255,.28) !important; }
input,select,textarea,.admin-table td input,.admin-table td select { color:var(--om-ink) !important; border-color:rgba(91,106,91,.20) !important; background:rgba(255,255,252,.68) !important; }
button,.btn,.save-btn,.login-btn,.notice-publish-btn,.attendance-save,.room-status-confirm-save,.room-status-confirm-cancel,.date-nav-btn,.back-btn,.view-tab,.perf-tab,.portal-account,.home-status-card,.home-revenue-card,.room-status-item,.om-dock-item { transition:transform .22s cubic-bezier(.2,.8,.2,1),background-color .22s ease,box-shadow .22s ease,border-color .22s ease,opacity .18s ease !important; -webkit-tap-highlight-color:transparent; }
button:active,.btn:active,.save-btn:active,.login-btn:active,.notice-publish-btn:active,.attendance-save:active,.room-status-confirm-save:active,.room-status-confirm-cancel:active,.date-nav-btn:active,.back-btn:active,.portal-account:active,.home-status-card:active,.home-revenue-card:active,.room-status-item:active,.om-dock-item:active { transform:scale(.975) !important; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid rgba(64,93,73,.72) !important; outline-offset:3px; }
body[data-page="home"] .home-overview,body[data-page="home"] .notice-board,body[data-page="home"] .home-room-board,body[data-page="home"] .home-leaderboard { background:rgba(255,255,252,.44) !important; border-color:rgba(255,255,255,.62) !important; }
body[data-page="home"] .home-status-card { color:var(--om-ink) !important; border-radius:20px !important; }
body[data-page="home"] .home-status-icon,body[data-page="home"] .home-metric-icon { color:var(--om-accent) !important; background:rgba(219,229,216,.54) !important; }
body[data-page="home"] .home-revenue-card { color:var(--om-ink) !important; border:1px solid rgba(255,255,255,.68) !important; background:rgba(255,255,252,.54) !important; box-shadow:0 10px 24px rgba(47,55,45,.06),inset 0 1px 0 rgba(255,255,255,.7) !important; }
body[data-page="home"] .home-revenue-card b,body[data-page="home"] .home-status-card b,body[data-page="home"] .notice-title,body[data-page="home"] .home-room-board h2,body[data-page="home"] .home-leaderboard h2 { color:var(--om-ink) !important; }
body[data-page="home"] .notice-eyebrow,body[data-page="home"] .home-room-board small,body[data-page="home"] .home-leaderboard-eyebrow { color:#70826f !important; }
#om-tabbar.om-dock-v3 { border-color:rgba(255,255,255,.82) !important; background:rgba(246,247,241,.64) !important; box-shadow:0 18px 44px rgba(43,52,42,.16),inset 0 1px 0 rgba(255,255,255,.86) !important; }
#om-tabbar.om-dock-v3 .om-dock-item { color:#687268 !important; }
#om-tabbar.om-dock-v3 .om-dock-item.is-active { color:#385943 !important; background:rgba(223,232,219,.64) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.64) !important; }
.room-status-confirm-mask,.profile-sheet-mask,.modal-mask { background:rgba(37,45,37,.26) !important; backdrop-filter:blur(8px) saturate(108%) !important; -webkit-backdrop-filter:blur(8px) saturate(108%) !important; }
@media (prefers-reduced-motion:reduce),(update:slow) { *,*::before,*::after { animation:none !important; transition:none !important; } }
@media (prefers-contrast:more) { body { color:#172017 !important; background:#f7f5ef !important; } .header,.view-tabs,.card,.calendar,.today-leaves,.staff-card,.overview-item,.admin-section,.dm-toolbar,.table-card,.search-box,.login-box,.stat-card,.clock-card,.history-card,.member-detail,.member-card,.perf-panel,.chart-card,.summary-card,#attendanceBoard,.portal-header,.result-box,.detail-card,.admin-card,.data-card,.home-overview,.notice-board,.home-room-board,.home-leaderboard { background:#fffefa !important; border-color:#889187 !important; } }
@media (max-width:768px) { body::before { background:rgba(255,255,252,.18) !important; } .header,.view-tabs,.card,.calendar,.today-leaves,.staff-card,.overview-item,.admin-section,.dm-toolbar,.table-card,.search-box,.login-box,.stat-card,.clock-card,.history-card,.member-detail,.member-card,.perf-panel,.chart-card,.summary-card,#attendanceBoard,.portal-header,.result-box,.detail-card,.admin-card,.data-card,.home-overview,.notice-board,.home-room-board,.home-leaderboard { background:rgba(255,255,252,.78) !important; } #om-tabbar.om-dock-v3 { backdrop-filter:blur(14px) saturate(115%) !important; -webkit-backdrop-filter:blur(14px) saturate(115%) !important; } }

/* v4 semantic color finish: reserve vivid color for actual operational status only. */
.store-tab.active,.today-btn,.btn-save,.daily-import-btn,.add-row button,.notice-compose-toggle,
.notice-publish-btn,.attendance-save,.room-status-confirm-save,.login-btn,.save-btn,.btn-clock {
  background:#405d49 !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(49,78,56,.20),inset 0 1px 0 rgba(255,255,255,.28) !important;
}
.dm-table th,.dm-table th.sticky-col { background:#405d49 !important; color:#fff !important; }
.dm-table .group-start { border-left-color:#a9c1a8 !important; }
.sum-row,.sum-row td { background:rgba(226,234,223,.72) !important; color:#405d49 !important; border-top-color:#91ab91 !important; }
.portal-avatar,.profile-avatar-large { background:#58755c !important; box-shadow:0 5px 15px rgba(49,78,56,.22),inset 0 1px 1px rgba(255,255,255,.48) !important; }
body[data-page="home"] .home-status-icon,body[data-page="home"] .notice-bell,body[data-page="home"] .attendance-heading-icon { background:#58755c !important; color:#fff !important; box-shadow:0 5px 13px rgba(49,78,56,.20),inset 0 1px 1px rgba(255,255,255,.42) !important; }
body[data-page="home"] .home-revenue-card .home-contribution .home-metric-icon,body[data-page="home"] .home-revenue-card .home-metric-icon { color:#58755c !important; background:rgba(219,229,216,.64) !important; }
body[data-page="home"] .home-overview-date,body[data-page="home"] .home-overview h1,body[data-page="home"] .home-overview p,body[data-page="home"] .portal-date,body[data-page="home"] .notice-title,body[data-page="home"] .attendance-title { color:var(--om-ink) !important; }
body[data-page="home"] .notice-board,body[data-page="home"] #attendanceBoard.attendance-board,body[data-page="home"] .home-leaderboard { background:rgba(255,255,252,.58) !important; }
/* Home notice: remove the last lilac highlight so its material matches the jade-gold system. */
body[data-page="home"] .notice-board { box-shadow:0 15px 34px rgba(72,83,57,.14),inset 0 1px 0 rgba(255,255,255,.88) !important; }
body[data-page="home"] .notice-board::before { background:radial-gradient(circle,rgba(255,255,255,.80) 0,rgba(196,174,126,.18) 38%,transparent 70%) !important; }
body[data-page="home"] .notice-board::after { background:radial-gradient(circle,rgba(255,255,255,.62) 0,rgba(125,166,141,.16) 40%,transparent 70%) !important; }
body[data-page="home"] .notice-live { color:#617667 !important; background:rgba(250,251,245,.52) !important; border-color:rgba(255,255,255,.74) !important; }
body[data-page="home"] .notice-message { background:rgba(255,255,252,.36) !important; border-color:rgba(255,255,255,.70) !important; }
body[data-page="home"] .notice-message-content { color:#40382e !important; }
body[data-page="home"] .notice-message-meta,body[data-page="home"] .notice-received { color:#897962 !important; }
body[data-page="home"] .home-leaderboard::before { display:none !important; }
body[data-page="home"] .home-leader-rank,body[data-page="home"] .home-leader-recharge .home-leader-rank,body[data-page="home"] .home-leader-overtime .home-leader-rank { background:#6f8b70 !important; box-shadow:none !important; }
body[data-page="home"] .home-leader-avatar { background:#7e9a7d !important; box-shadow:none !important; }
body[data-page="home"] .home-leader-card strong { color:#4d6c52 !important; }
#om-tabbar.om-dock-v3 .om-dock-icon { filter:grayscale(.35) sepia(.35) hue-rotate(68deg) saturate(.75) !important; }
#om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { filter:sepia(.55) hue-rotate(68deg) saturate(.85) !important; }

/* v5 mobile material hierarchy: one real background, continuous content, few glass objects. */
:root {
  --bg:#e9e4d9 !important;
  --card-bg:rgba(250,248,241,.48) !important;
  --primary:#456850 !important;
  --primary-light:#a8bca6 !important;
  --primary-dark:#31503b !important;
  --primary-bg:rgba(222,231,217,.64) !important;
  --accent:#a8bca6 !important;
  --accent-green:#a8c9a0 !important;
  --accent-blue:#b5c8bd !important;
  --accent-purple:#bdcdbb !important;
  --text:#243128 !important;
  --text-light:#728075 !important;
  --border:rgba(255,255,255,.56) !important;
}
body[data-page] {
  background:#e9e4d9 !important;
  color:#243128 !important;
}
body[data-page]::before {
  z-index:-2 !important;
  opacity:.52;
  background:#e9e4d9 url('assets/spa-material-background-v1.png') center center / cover no-repeat !important;
}
body[data-page]::after {
  content:"";
  position:fixed;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:rgba(245,242,234,.30);
}

/* Browser chrome and controls use one family, never the historical purple theme. */
body[data-page] .type-tab.active, body[data-page] .view-tab.active,
body[data-page] .perf-tab.active, body[data-page] .store-tab.active,
body[data-page] .today-btn, body[data-page] .btn-save,
body[data-page] .dm-btn-add, body[data-page] .action-btn.primary {
  color:#fff !important;
  background:rgba(58,91,67,.88) !important;
  border-color:rgba(255,255,255,.46) !important;
  box-shadow:0 7px 16px rgba(36,68,45,.20),inset 0 1px 0 rgba(255,255,255,.30) !important;
}
body[data-page] .type-tab, body[data-page] .view-tab, body[data-page] .perf-tab,
body[data-page] .store-tab, body[data-page] .date-display, body[data-page] .nav-btn,
body[data-page] .month-nav button, body[data-page] .perf-date-button {
  color:#55675a !important;
  background:rgba(250,249,244,.45) !important;
  border-color:rgba(255,255,255,.66) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68) !important;
}
body[data-page] .member-search-orb, body[data-page] .member-result-dot,
body[data-page] .notice-live i, body[data-page] .home-leaderboard-live i { background:#7ca881 !important; }
body[data-page] .balance-big, body[data-page] .result-count,
body[data-page] .member-status .num, body[data-page] .stat-box .num,
body[data-page] .home-leader-card strong { color:#456850 !important; }

/* Data sits on a continuous surface; lists use separators instead of stacked white slabs. */
@media (max-width:768px) {
  body[data-page] .portal, body[data-page] .dm-container, body[data-page] .perf-app,
  body[data-page] .member-app, body[data-page] .container, body[data-page] .clock-container {
    position:relative;
    z-index:0;
  }
  body[data-page] .mobile-record-card, body[data-page] .member-item,
  body[data-page] .member-quick-item, body[data-page] .history-card,
  body[data-page] .salary-detail, body[data-page] .info-item,
  body[data-page] .leave-detail-card, body[data-page] .today-leaves > *,
  body[data-page] .home-leader-card {
    background:rgba(249,248,242,.36) !important;
    border:1px solid rgba(255,255,255,.50) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.50) !important;
  }
  body[data-page] .mobile-record-card, body[data-page] .member-item,
  body[data-page] .member-quick-item { border-radius:16px !important; }
  body[data-page] .stat-card, body[data-page] .overview-item,
  body[data-page] .summary-card, body[data-page] .search-box,
  body[data-page] .result-box, body[data-page] .calendar,
  body[data-page] .detail-card, body[data-page] .clock-card,
  body[data-page] .perf-panel, body[data-page] .table-card {
    background:rgba(248,247,240,.42) !important;
    border:1px solid rgba(255,255,255,.58) !important;
    box-shadow:0 12px 28px rgba(62,67,53,.08),inset 0 1px 0 rgba(255,255,255,.65) !important;
    backdrop-filter:blur(11px) saturate(112%) !important;
    -webkit-backdrop-filter:blur(11px) saturate(112%) !important;
  }
  body[data-page="daily"] .dm-toolbar,
  body[data-page="performance"] .perf-tabs,
  body[data-page="leave"] .leave-control-strip,
  body[data-page="member"] .type-tabs {
    background:rgba(247,247,241,.44) !important;
    border:1px solid rgba(255,255,255,.68) !important;
    box-shadow:0 11px 26px rgba(61,67,53,.08),inset 0 1px 0 rgba(255,255,255,.72) !important;
    backdrop-filter:blur(18px) saturate(115%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(115%) !important;
  }
  body[data-page="daily"] .stat-card { color:#243128 !important; }
  body[data-page="daily"] .stat-card.t-gold, body[data-page="daily"] .stat-card.t-green,
  body[data-page="daily"] .stat-card.t-pink, body[data-page="daily"] .stat-card.t-brown {
    color:#243128 !important;
    background:rgba(248,247,240,.46) !important;
  }
  body[data-page="daily"] .stat-val { color:#243128 !important; }
  body[data-page="daily"] .stat-lbl { color:#728075 !important; }
  body[data-page="daily"] .stat-icon { color:#456850 !important; background:rgba(218,230,215,.62) !important; }
  body[data-page="daily"] .mobile-record-card { backdrop-filter:blur(9px) saturate(108%) !important; -webkit-backdrop-filter:blur(9px) saturate(108%) !important; }
  body[data-page="leave"] .calendar { background:rgba(248,247,240,.34) !important; }
  body[data-page="leave"] .calendar td { background:rgba(255,255,255,.18) !important; }
  body[data-page="leave"] .calendar th { background:transparent !important; color:#526257 !important; }
  body[data-page="performance"] .perf-table tr,
  body[data-page="performance"] .salary-detail { background:rgba(249,248,242,.34) !important; }
  body[data-page="member"] .member-item.active { background:rgba(214,228,210,.58) !important; border-left-color:#668e6c !important; }
  body[data-page="member"] .dm-btn-add { background:rgba(58,91,67,.88) !important; }

  /* The dock is the thickest material: curved edge light, actual translucency, no pastel rainbow. */
  #om-tabbar.om-dock-v3 {
    background:rgba(247,247,241,.46) !important;
    border:1px solid rgba(255,255,255,.82) !important;
    box-shadow:0 20px 46px rgba(47,55,43,.20),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(98,112,93,.10) !important;
    backdrop-filter:blur(26px) saturate(128%) brightness(1.08) !important;
    -webkit-backdrop-filter:blur(26px) saturate(128%) brightness(1.08) !important;
  }
  #om-tabbar.om-dock-v3::before {
    content:"";
    position:absolute;
    inset:1px;
    pointer-events:none;
    border-radius:inherit;
    background:linear-gradient(115deg,rgba(255,255,255,.42),transparent 42%,rgba(255,255,255,.13));
  }
  #om-tabbar.om-dock-v3 .om-dock-item { position:relative; z-index:1; color:#6e7b70 !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active {
    color:#31503b !important;
    background:rgba(210,224,208,.54) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 4px 10px rgba(51,78,57,.08) !important;
  }
}

/* Keep the photographic material behind the app itself, not behind an opaque body. */
body[data-page] {
  background-color:#ddd6c8 !important;
  background-image:url('assets/spa-material-background-v1.png') !important;
  background-position:center top !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}
body[data-page]::before { display:none !important; }
body[data-page]::after { display:none !important; }
@media (max-width:768px) {
  body[data-page] { background-attachment:scroll !important; }
  body[data-page] .mobile-record-card, body[data-page] .member-item,
  body[data-page] .member-quick-item, body[data-page] .history-card,
  body[data-page] .salary-detail, body[data-page] .info-item,
  body[data-page] .leave-detail-card, body[data-page] .today-leaves > *,
  body[data-page] .home-leader-card { background:rgba(249,248,242,.24) !important; }
  body[data-page] .stat-card, body[data-page] .overview-item,
  body[data-page] .summary-card, body[data-page] .search-box,
  body[data-page] .result-box, body[data-page] .calendar,
  body[data-page] .detail-card, body[data-page] .clock-card,
  body[data-page] .perf-panel, body[data-page] .table-card { background:rgba(248,247,240,.30) !important; }
}

/* v6 Dock: clear glass body with a moving liquid selection lens. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 {
    overflow:hidden !important;
    isolation:isolate;
    background:rgba(235,239,232,.30) !important;
    border-color:rgba(255,255,255,.74) !important;
    box-shadow:0 22px 48px rgba(42,50,39,.19), inset 0 1px 0 rgba(255,255,255,.92), inset 0 -1px 0 rgba(77,94,73,.15) !important;
    backdrop-filter:blur(30px) saturate(140%) brightness(1.12) !important;
    -webkit-backdrop-filter:blur(30px) saturate(140%) brightness(1.12) !important;
  }
  #om-tabbar.om-dock-v3::before {
    z-index:0;
    background:linear-gradient(115deg,rgba(255,255,255,.58),rgba(255,255,255,.07) 46%,rgba(215,228,212,.20)) !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-liquid {
    position:absolute;
    z-index:0;
    top:8px;
    left:0;
    width:var(--om-liquid-w,56px);
    height:calc(100% - 16px);
    border:1px solid rgba(255,255,255,.58);
    border-radius:999px;
    pointer-events:none;
    opacity:.96;
    transform:translate3d(var(--om-liquid-x,8px),0,0) scale(.94);
    background:rgba(188,208,185,.42);
    box-shadow:0 5px 12px rgba(55,82,59,.10),inset 0 1px 0 rgba(255,255,255,.76),inset 0 -1px 0 rgba(75,108,78,.08);
  }
  #om-tabbar.om-dock-v3 .om-dock-liquid::after {
    content:"";
    position:absolute;
    inset:1px 12%;
    border-radius:inherit;
    background:linear-gradient(180deg,rgba(255,255,255,.38),transparent 46%);
  }
  #om-tabbar.om-dock-v3 .om-dock-liquid.is-ready {
    transform:translate3d(var(--om-liquid-x,8px),0,0) scale(1);
    transition:transform .48s cubic-bezier(.18,.92,.22,1.12),width .42s cubic-bezier(.18,.92,.22,1),opacity .2s ease;
  }
  #om-tabbar.om-dock-v3 .om-dock-item,
  #om-tabbar.om-dock-v3 .om-dock-item.is-active {
    z-index:1;
    background:transparent !important;
    box-shadow:none !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item:active .om-dock-icon { transform:scale(.86); }
  #om-tabbar.om-dock-v3 .om-dock-icon { transition:transform .26s cubic-bezier(.2,.9,.2,1),color .26s ease,filter .26s ease; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { transform:translateY(-1px) scale(1.06); filter:sepia(.55) hue-rotate(68deg) saturate(.95) drop-shadow(0 3px 4px rgba(55,82,59,.13)) !important; }
}
@media (prefers-reduced-motion:reduce) {
  #om-tabbar.om-dock-v3 .om-dock-liquid.is-ready, #om-tabbar.om-dock-v3 .om-dock-icon { transition:none !important; }
}

/* Desktop home uses its own alignment rules; do not inherit compact phone sizing. */
@media (min-width:769px) {
  body[data-page="home"] .portal-account {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:auto;
    min-width:88px;
    height:48px;
    padding:0 10px 0 6px;
    border-radius:16px;
  }
  body[data-page="home"] .portal-avatar { flex:0 0 34px; }
  body[data-page="home"] .portal-account-name { display:block; max-width:76px; line-height:1; }
  body[data-page="home"] .notice-board-actions { align-items:center; }
  body[data-page="home"] .notice-compose-toggle,
  body[data-page="home"] .attendance-date-switch {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
  }
  body[data-page="home"] .notice-compose-toggle { min-width:104px; min-height:38px; }
  body[data-page="home"] .attendance-date-controls { align-items:center; }
  body[data-page="home"] .attendance-date-switch { min-width:48px; min-height:34px; }
  body[data-page="home"] .attendance-expand { display:none !important; }
}

@media (max-width:768px) {
  body.attendance-detail-route[data-page="home"] .home-overview,
  body.attendance-detail-route[data-page="home"] #noticeBoard { display:none !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard { display:block !important; margin-top:54px !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard .attendance-detail-close { display:block; width:auto; margin:0 0 8px; padding:0; border:0; color:#6b7bd2; font-size:12px; font-weight:720; background:transparent; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard .attendance-expand { display:none; }
}

/* Attendance opens as a dedicated mobile subpage rather than expanding below Home. */
@media (max-width:768px) {
  body.attendance-detail-route[data-page="home"] .home-overview,
  body.attendance-detail-route[data-page="home"] #noticeBoard { display:none !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard { display:block !important; margin-top:54px !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard .attendance-detail-close { display:block; width:auto; margin:0 0 8px; padding:0; border:0; color:#6b7bd2; font-size:12px; font-weight:720; background:transparent; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard .attendance-expand { display:none; }
}

/* The attendance route is a true subpage: no leaderboard/home content remains behind it. */
@media (max-width:768px) {
  body.attendance-detail-route[data-page="home"] .portal-compact-bar,
  body.attendance-detail-route[data-page="home"] .home-overview,
  body.attendance-detail-route[data-page="home"] #noticeBoard,
  body.attendance-detail-route[data-page="home"] #homeLeaderboard,
  body.attendance-detail-route[data-page="home"] .home-clock-entry { display:none !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard { display:block !important; margin-top:10px !important; }
  body.attendance-detail-route[data-page="home"] #attendanceBoard .attendance-detail-close { display:block; }
}

/* 首页房间状态：两店并列，一眼区分使用、闲置和待打扫。 */
.home-room-board { margin:12px 0; padding:14px; border:1px solid rgba(255,255,255,.88); border-radius:22px; background:linear-gradient(145deg,rgba(255,255,255,.74),rgba(239,244,255,.48)); box-shadow:0 10px 25px rgba(71,88,160,.10),inset 0 1px 0 rgba(255,255,255,.94); }
.home-room-board-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 2px 11px; }
.home-room-board-head small { display:block; color:#8b96bb; font-size:9px; font-weight:800; letter-spacing:1.1px; }
.home-room-board-head h2 { margin:2px 0 0; color:#35416d; font-size:17px; line-height:1.12; }
.home-room-hint { color:#8190be; font-size:11px; font-weight:650; }
.home-room-board-content { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.room-store-card { min-width:0; padding:9px; border:1px solid rgba(255,255,255,.84); border-radius:17px; background:rgba(255,255,255,.48); box-shadow:inset 0 1px 0 rgba(255,255,255,.84); }
.room-store-title { margin:0 0 7px; color:#5368d8; font-size:13px; font-weight:780; }
.room-status-list { display:grid; gap:6px; }
.room-status-item { display:flex; align-items:center; justify-content:space-between; gap:5px; width:100%; min-height:33px; padding:6px 7px; box-sizing:border-box; color:#33405f; border:1px solid rgba(214,221,242,.70); border-radius:11px; background:rgba(255,255,255,.58); text-align:left; font:inherit; }
.room-status-item b { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:720; }
.room-status-item.is-editable { cursor:pointer; transition:transform .14s ease,box-shadow .14s ease; }
.room-status-item.is-editable:active { transform:scale(.98); }
.room-status-tag { display:inline-flex; align-items:center; flex:0 0 auto; gap:3px; padding:3px 5px; border-radius:9px; font-size:9px; font-weight:750; white-space:nowrap; }
.room-status-tag i { width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 0 2px rgba(255,255,255,.7); }
.room-status-tag.in_use { color:#c75464; background:rgba(244,198,205,.66); }
.room-status-tag.idle { color:#328d64; background:rgba(194,235,212,.70); }
.room-status-tag.cleaning { color:#a97917; background:rgba(255,231,167,.74); }
.room-status-item.in_use.is-editable:hover { border-color:rgba(199,84,100,.42); box-shadow:0 5px 12px rgba(199,84,100,.12); }
.room-status-item.idle.is-editable:hover { border-color:rgba(50,141,100,.42); box-shadow:0 5px 12px rgba(50,141,100,.12); }
.room-status-item.cleaning.is-editable:hover { border-color:rgba(169,121,23,.42); box-shadow:0 5px 12px rgba(169,121,23,.12); }
.home-room-loading { grid-column:1/-1; padding:16px; color:#8793b7; text-align:center; font-size:12px; }

/* Room changes are deliberate: show a compact glass confirmation before writing shared status. */
body.room-status-confirm-open { overflow:hidden; }
.room-status-confirm-mask { position:fixed; z-index:13000; inset:0; display:grid; place-items:center; padding:20px; box-sizing:border-box; background:rgba(37,48,94,.26); backdrop-filter:blur(9px) saturate(125%); -webkit-backdrop-filter:blur(9px) saturate(125%); }
.room-status-confirm-mask[hidden] { display:none !important; }
.room-status-confirm-dialog { position:relative; box-sizing:border-box; width:min(100%,390px); padding:22px; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:24px; color:#33405f; background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(235,240,255,.78)); box-shadow:0 22px 60px rgba(48,62,128,.28),inset 0 1px 0 rgba(255,255,255,.95); }
.room-status-confirm-dialog::before { content:""; position:absolute; width:130px; height:130px; top:-76px; right:-50px; border-radius:50%; background:rgba(172,185,255,.24); filter:blur(18px); pointer-events:none; }
.room-status-confirm-close { position:absolute; top:12px; right:12px; z-index:1; display:grid; place-items:center; width:30px; height:30px; padding:0; border:1px solid rgba(255,255,255,.82); border-radius:50%; color:#7180a7; background:rgba(255,255,255,.5); font-size:21px; line-height:1; cursor:pointer; }
.room-status-confirm-eyebrow { position:relative; color:#7785c7; font-size:9px; font-weight:800; letter-spacing:1.1px; }
.room-status-confirm-dialog h2 { position:relative; margin:5px 35px 0 0; color:#303d6a; font-size:19px; line-height:1.25; }
.room-status-confirm-room { position:relative; margin:7px 0 16px; color:#7b88aa; font-size:13px; font-weight:650; }
.room-status-confirm-flow { position:relative; display:flex; align-items:center; justify-content:center; gap:10px; padding:14px 10px; border:1px solid rgba(255,255,255,.8); border-radius:16px; background:rgba(255,255,255,.42); box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.room-status-confirm-state { display:inline-flex; align-items:center; justify-content:center; min-width:66px; min-height:30px; padding:0 9px; border-radius:10px; font-size:12px; font-weight:760; }
.room-status-confirm-state.in_use { color:#b74759; background:rgba(244,198,205,.74); }
.room-status-confirm-state.idle { color:#287d58; background:rgba(194,235,212,.78); }
.room-status-confirm-state.cleaning { color:#936815; background:rgba(255,231,167,.82); }
.room-status-confirm-arrow { color:#8390bc; font-size:19px; }
.room-status-confirm-actions { display:grid; grid-template-columns:1fr 1.25fr; gap:9px; margin-top:17px; }
.room-status-confirm-actions button { min-height:42px; border-radius:13px; font:700 13px/1 inherit; cursor:pointer; }
.room-status-confirm-cancel { border:1px solid rgba(203,212,239,.8); color:#7180a4; background:rgba(255,255,255,.56); }
.room-status-confirm-save { border:1px solid rgba(255,255,255,.82); color:#fff; background:#687bd8; box-shadow:0 8px 16px rgba(93,108,204,.24); }
.room-status-confirm-actions button:disabled { cursor:wait; opacity:.6; }
@media (max-width:480px) { .home-room-board { margin:10px 0; padding:11px; border-radius:19px; } .home-room-board-content { gap:7px; } .room-store-card { padding:7px; border-radius:14px; } .room-status-list { gap:5px; } .room-status-item { min-height:31px; padding:5px 6px; } .room-status-item b { font-size:11px; } .room-status-tag { padding:3px 4px; font-size:8px; } }

/* Desktop homepage: the same live board sits below store notices, with both
   stores visible at once and no phone-style vertical stacking. */
@media (min-width:769px) {
  body[data-page="home"] .home-room-board { margin:0 0 18px; padding:18px 20px 20px; border-radius:24px; }
  body[data-page="home"] .home-room-board-head { margin:0 2px 14px; }
  body[data-page="home"] .home-room-board-head h2 { font-size:19px; }
  body[data-page="home"] .home-room-board-content { gap:14px; }
  body[data-page="home"] .room-store-card { padding:13px; border-radius:18px; }
  body[data-page="home"] .room-store-title { margin-bottom:10px; font-size:14px; }
  body[data-page="home"] .room-status-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  body[data-page="home"] .room-status-item { min-height:38px; padding:7px 9px; }
}

/* Leave calendar on phones: keep the calendar itself, move staff controls and explanations to desktop administration. */
@media (max-width:768px) {
  body[data-page="leave"] .leave-control-strip .user-selector,
  body[data-page="leave"] .leave-control-strip .leave-sync-chip,
  body[data-page="leave"] .leave-mobile-helper,
  body[data-page="leave"] .leave-mobile-legend { display:none !important; }
  body[data-page="leave"] .leave-control-strip { padding:8px 9px; }
}

/* Dense mobile leave calendar: surface more dates and staff before the dock. */
@media (max-width:768px) {
  body[data-page="leave"] .container { padding:8px 8px calc(82px + env(safe-area-inset-bottom)) !important; }
  body[data-page="leave"] .leave-page-bar { margin:0 0 6px; }
  body[data-page="leave"] .leave-page-bar .view-tabs { margin:0 0 6px !important; }
  body[data-page="leave"] .leave-page-bar .view-tab { min-height:42px; padding:0 8px; border-radius:15px; font-size:13px; line-height:42px; }
  body[data-page="leave"] .leave-control-strip { padding:5px 7px; border-radius:15px; }
  body[data-page="leave"] .leave-control-strip .month-nav { min-height:34px; }
  body[data-page="leave"] .leave-control-strip .month-nav button { width:28px; height:28px; min-width:28px !important; padding:0 !important; }
  body[data-page="leave"] .leave-control-strip .month-nav .leave-today-btn { width:auto; min-width:52px !important; padding:0 8px !important; }
  body[data-page="leave"] .leave-mobile-guide-card { display:none !important; }
  body[data-page="leave"] .overview { gap:6px !important; margin:0 0 8px; }
  body[data-page="leave"] .overview-item { min-height:60px; padding:7px 6px !important; border-radius:16px; }
  body[data-page="leave"] .overview-value { font-size:20px; line-height:1.05; }
  body[data-page="leave"] .overview-label { margin-top:2px; font-size:10px; line-height:1.25; }
  body[data-page="leave"] .calendar { margin:0; padding:0 !important; border-radius:18px; }
  body[data-page="leave"] .calendar table { min-width:620px !important; }
  body[data-page="leave"] .calendar th.sticky-col { width:82px !important; min-width:82px !important; padding:5px !important; font-size:12px !important; }
  body[data-page="leave"] .calendar th:not(.sticky-col) { width:34px !important; min-width:34px !important; padding:2px !important; font-size:10px !important; }
  body[data-page="leave"] .calendar td { min-width:34px !important; height:32px !important; padding:1px !important; }
  body[data-page="leave"] .calendar td.sticky-col { width:82px !important; min-width:82px !important; padding:4px 6px !important; }
  body[data-page="leave"] .calendar .leave-badge { padding:2px 5px !important; font-size:10px !important; }
}

/* The primary mobile navigation is a floating glass capsule, not a full-width footer. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 {
    left:24px !important;
    right:24px !important;
    bottom:16px !important;
    height:72px !important;
    max-height:72px !important;
    padding:8px 12px !important;
    border:1px solid rgba(255,255,255,.94) !important;
    border-radius:36px !important;
    background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(238,241,255,.78)) !important;
    box-shadow:0 14px 34px rgba(67,81,151,.17),inset 0 1px 0 rgba(255,255,255,.96) !important;
  }
  #om-tabbar.om-dock-v3 .om-dock-item { height:54px !important; border-radius:27px !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { width:28px !important; height:28px !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { filter:drop-shadow(0 3px 5px rgba(82,99,205,.18)); }
  body[data-page="home"] .home-clock-entry { display:flex; align-items:center; gap:12px; min-height:68px; margin:0 0 12px; padding:11px 14px; box-sizing:border-box; text-decoration:none; color:#35416d; border:1px solid rgba(255,255,255,.9); border-radius:21px; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(238,242,255,.52)); box-shadow:0 8px 21px rgba(82,95,162,.09),inset 0 1px 0 rgba(255,255,255,.88); }
  body[data-page="home"] .home-clock-entry-icon { display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; color:#d28b64; border-radius:14px; background:linear-gradient(135deg,rgba(255,244,235,.98),rgba(255,224,205,.74)); box-shadow:inset 0 1px 0 rgba(255,255,255,.86); }
  body[data-page="home"] .home-clock-entry-icon svg { width:22px; height:22px; }
  body[data-page="home"] .home-clock-entry-copy { display:grid; gap:2px; min-width:0; }
  body[data-page="home"] .home-clock-entry-copy small { color:#9a8a8a; font-size:9px; font-weight:750; letter-spacing:1px; }
  body[data-page="home"] .home-clock-entry-copy b { color:#394674; font-size:15px; font-weight:780; }
  body[data-page="home"] .home-clock-entry-copy em { color:#8791ae; font-size:11px; font-style:normal; }
  body[data-page="home"] .home-clock-entry-arrow { margin-left:auto; color:#8290cf; font-size:30px; font-weight:300; line-height:1; }
  body[data-page="home"] .home-clock-entry { display:none !important; }
  body[data-page="home"] #attendanceBoard { display:none !important; }
  body[data-page="home"] #attendanceBoard.is-home-detail { display:block !important; }
  body[data-page="home"] .attendance-detail-close { display:none; }
  body[data-page="home"] #attendanceBoard.is-home-detail .attendance-detail-close { display:block; width:auto; margin:0 0 8px; padding:0; border:0; color:#6b7bd2; font-size:12px; font-weight:720; background:transparent; }
}

/* v7 dock final: a thin refractive layer, never an opaque white bar. */
@media (max-width:768px) {
  #om-tabbar.om-dock-v3 { overflow:hidden !important; isolation:isolate !important; background:rgba(225,232,220,.18) !important; border:1px solid rgba(255,255,255,.58) !important; box-shadow:0 12px 32px rgba(37,49,38,.13),inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(54,76,57,.11) !important; backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important; -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.03) !important; }
  #om-tabbar.om-dock-v3::before { z-index:0; background:linear-gradient(112deg,rgba(255,255,255,.34),rgba(255,255,255,.04) 45%,rgba(204,223,199,.15)) !important; }
  #om-tabbar.om-dock-v3 .om-dock-liquid { opacity:1 !important; border-color:rgba(255,255,255,.48) !important; background:rgba(184,207,179,.26) !important; box-shadow:0 4px 10px rgba(42,69,47,.08),inset 0 1px 0 rgba(255,255,255,.64),inset 0 -1px 0 rgba(73,105,77,.07) !important; backdrop-filter:blur(12px) saturate(130%); -webkit-backdrop-filter:blur(12px) saturate(130%); }
  #om-tabbar.om-dock-v3 .om-dock-liquid::after { background:linear-gradient(180deg,rgba(255,255,255,.29),transparent 48%) !important; }
  #om-tabbar.om-dock-v3 .om-dock-icon { filter:grayscale(.18) sepia(.25) hue-rotate(68deg) saturate(.7) !important; }
  #om-tabbar.om-dock-v3 .om-dock-item.is-active .om-dock-icon { filter:sepia(.45) hue-rotate(68deg) saturate(.95) drop-shadow(0 2px 3px rgba(47,77,52,.12)) !important; }
}