.header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin: calc(8 * var(--rpx)) 0 calc(28 * var(--rpx));
}

.header-copy {
  min-width: 0;
  flex: 1;
}

.header-title {
  font-size: calc(44 * var(--rpx));
  font-weight: 800;
  line-height: 1.2;
}

.header-subtitle {
  margin-top: calc(10 * var(--rpx));
  color: #8f959e;
  font-size: calc(26 * var(--rpx));
}

.language-picker {
  margin: calc(2 * var(--rpx)) calc(2 * var(--rpx)) 0 calc(20 * var(--rpx));
  flex-shrink: 0;
}

.language-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(78 * var(--rpx));
  height: calc(78 * var(--rpx));
  box-sizing: border-box;
  background: #ffffff;
  border: calc(3 * var(--rpx)) solid #1677ff;
  border-radius: 50%;
  box-shadow: 0 calc(7 * var(--rpx)) calc(18 * var(--rpx)) rgba(22, 119, 255, 0.2);
}

.language-button-icon {
  font-size: calc(39 * var(--rpx));
  line-height: 1;
}

.language-button-arrow {
  position: absolute;
  right: calc(-5 * var(--rpx));
  bottom: calc(-5 * var(--rpx));
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(29 * var(--rpx));
  height: calc(29 * var(--rpx));
  color: #ffffff;
  background: #1677ff;
  border: calc(3 * var(--rpx)) solid #f3f5f7;
  border-radius: 50%;
  font-size: calc(18 * var(--rpx));
  font-weight: 800;
  line-height: 1;
}

.identity-loading {
  padding: calc(60 * var(--rpx)) calc(24 * var(--rpx));
  color: #8f959e;
  text-align: center;
}

.binding-card {
  padding: calc(44 * var(--rpx)) calc(32 * var(--rpx));
  text-align: center;
}

.binding-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(92 * var(--rpx));
  height: calc(92 * var(--rpx));
  margin: 0 auto;
  color: #ffffff;
  background: linear-gradient(145deg, #1677ff, #16a34a);
  border-radius: calc(28 * var(--rpx));
  font-size: calc(42 * var(--rpx));
  font-weight: 800;
}

.binding-title {
  margin-top: calc(28 * var(--rpx));
  font-size: calc(36 * var(--rpx));
  font-weight: 800;
}

.binding-desc {
  margin-top: calc(18 * var(--rpx));
  color: #646a73;
  font-size: calc(25 * var(--rpx));
  line-height: 1.65;
}

.application-input,
.application-picker {
  height: calc(84 * var(--rpx));
  margin-top: calc(22 * var(--rpx));
  padding: 0 calc(22 * var(--rpx));
  box-sizing: border-box;
  color: #243047;
  background: #f4f7fb;
  border: calc(2 * var(--rpx)) solid #dce6f2;
  border-radius: calc(15 * var(--rpx));
  font-size: calc(25 * var(--rpx));
  line-height: calc(84 * var(--rpx));
  text-align: left;
}
.application-picker { color: #1767c6; font-weight: 800; }
.note-input { margin-top: calc(14 * var(--rpx)); }
.application-submit { min-height: calc(86 * var(--rpx)); margin-top: calc(22 * var(--rpx)); color: #fff; background: linear-gradient(145deg,#2585f5,#0d63c9); border-radius: calc(15 * var(--rpx)); font-size: calc(27 * var(--rpx)); font-weight: 900; }
.application-pending { display:flex; justify-content:center; align-items:center; gap:calc(12 * var(--rpx)); margin-top:calc(28 * var(--rpx)); padding:calc(22 * var(--rpx)); color:#176b38; background:#eaf8ee; border-radius:calc(15 * var(--rpx)); font-size:calc(25 * var(--rpx)); font-weight:850; }
.pending-dot { width:calc(16 * var(--rpx)); height:calc(16 * var(--rpx)); background:#18a957; border-radius:50%; box-shadow:0 0 0 calc(7 * var(--rpx)) rgba(24,169,87,.12); }

.bind-code {
  margin: calc(30 * var(--rpx)) auto 0;
  color: #1457a6;
  font-size: calc(64 * var(--rpx));
  font-weight: 800;
  letter-spacing: calc(12 * var(--rpx));
}

.binding-warning {
  margin-top: calc(26 * var(--rpx));
  padding: calc(20 * var(--rpx));
  color: #b42318;
  background: #fff1f0;
  border-radius: calc(14 * var(--rpx));
  font-size: calc(24 * var(--rpx));
}

.account-hint {
  margin-top: calc(12 * var(--rpx));
  color: #a0a5ad;
  font-size: calc(21 * var(--rpx));
}

.refresh-identity-button {
  margin-top: calc(30 * var(--rpx));
  min-height: calc(88 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(18 * var(--rpx));
  color: #1457a6;
  background: #eaf3ff;
  border-radius: calc(16 * var(--rpx));
  font-weight: 700;
  line-height: 1.35;
}

.identity-card,
.status-card,
.compact-status-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(24 * var(--rpx));
}

.compact-status-card {
  min-height: calc(116 * var(--rpx));
  padding: calc(22 * var(--rpx)) calc(24 * var(--rpx));
}

.compact-status-block {
  min-width: 0;
}

.employee-block {
  width: 34%;
}

.task-block {
  flex: 1;
}

.compact-divider {
  width: calc(2 * var(--rpx));
  height: calc(62 * var(--rpx));
  margin: 0 calc(22 * var(--rpx));
  background: #e8ebef;
}

.compact-time {
  margin-left: calc(14 * var(--rpx));
  text-align: right;
}

.compact-status-card .status-name,
.compact-status-card .status-task,
.compact-status-card .status-time {
  margin-top: calc(5 * var(--rpx));
  font-size: calc(30 * var(--rpx));
  line-height: 1.2;
}

.compact-status-card .status-name,
.compact-status-card .status-task {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.location-strip {
  display: flex;
  align-items: center;
  min-height: calc(58 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
  padding: calc(8 * var(--rpx)) calc(18 * var(--rpx));
  box-sizing: border-box;
  border-radius: calc(14 * var(--rpx));
  font-size: calc(21 * var(--rpx));
  line-height: 1.35;
}

.location-strip.inside { color: #147a38; background: #eaf8ee; }
.location-strip.outside { color: #b42318; background: #fff1f0; }
.location-strip.readonly { color: #5b6472; background: #edf0f4; }
.location-dot { width: calc(14 * var(--rpx)); height: calc(14 * var(--rpx)); margin-right: calc(10 * var(--rpx)); background: currentColor; border-radius: 50%; }

.attendance-scan-card { display:flex; align-items:center; justify-content:space-between; gap:calc(18 * var(--rpx)); margin-top:calc(16 * var(--rpx)); padding:calc(20 * var(--rpx)) calc(22 * var(--rpx)); border:calc(2 * var(--rpx)) solid #d8e7f7; }
.attendance-scan-card.clocked-in { border-color:#bce5c9; background:linear-gradient(145deg,#ffffff,#effbf3); }
.attendance-scan-copy { min-width:0; flex:1; }
.attendance-scan-title { color:#243047; font-size:calc(25 * var(--rpx)); font-weight:900; }
.attendance-scan-subtitle { margin-top:calc(6 * var(--rpx)); overflow:hidden; color:#7c8797; font-size:calc(19 * var(--rpx)); white-space:nowrap; text-overflow:ellipsis; }
.attendance-scan-button { width:calc(210 * var(--rpx)); min-height:calc(70 * var(--rpx)); margin:0; padding:0 calc(12 * var(--rpx)); color:#fff; border-radius:calc(13 * var(--rpx)); font-size:calc(23 * var(--rpx)); font-weight:900; line-height:calc(70 * var(--rpx)); }
.attendance-scan-button.clock-in { background:linear-gradient(145deg,#2585f5,#0d63c9); }
.attendance-scan-button.clock-out { background:linear-gradient(145deg,#23a35a,#138342); }

.identity-copy,
.status-main {
  min-width: 0;
  flex: 1;
}

.verified-badge {
  max-width: calc(220 * var(--rpx));
  margin-left: calc(16 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(18 * var(--rpx));
  color: #16823b;
  background: #eaf8ee;
  border-radius: calc(999 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}

.status-card {
  margin-top: calc(18 * var(--rpx));
}

.status-label {
  color: #8f959e;
  font-size: calc(23 * var(--rpx));
}

.status-name {
  margin-top: calc(8 * var(--rpx));
  font-size: calc(36 * var(--rpx));
  font-weight: 800;
}

.status-right {
  margin-left: calc(18 * var(--rpx));
  flex-shrink: 0;
  text-align: right;
}

.status-task {
  margin-top: calc(8 * var(--rpx));
  font-size: calc(30 * var(--rpx));
  font-weight: 700;
}

.status-task.active {
  color: #16823b;
}

.status-time {
  margin-top: calc(8 * var(--rpx));
  color: #1f2329;
  font-size: calc(30 * var(--rpx));
  font-weight: 700;
}

.task-title {
  margin-top: calc(38 * var(--rpx));
}

.task-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(20 * var(--rpx));
}

.task-button {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(128 * var(--rpx));
  height: calc(128 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(14 * var(--rpx));
  box-sizing: border-box;
  color: #0f5fb8;
  background: linear-gradient(145deg, #f1f7ff, #dcecff);
  border: calc(2 * var(--rpx)) solid #c9e0ff;
  border-radius: calc(22 * var(--rpx));
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(20, 87, 166, 0.1);
  line-height: 1.12;
}

.task-button[disabled] {
  color: #89919c;
  background: #eef1f4;
  border-color: #dfe3e8;
  box-shadow: none;
}

.task-button:active {
  opacity: 0.82;
  transform: scale(0.98);
}

.task-button.current {
  color: #ffffff;
  background: linear-gradient(145deg, #20b85a, #13843f);
  border-color: #13843f;
  box-shadow: 0 calc(10 * var(--rpx)) calc(22 * var(--rpx)) rgba(19, 132, 63, 0.24);
}

.task-label {
  width: 100%;
  font-size: calc(32 * var(--rpx));
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
  letter-spacing: calc(.4 * var(--rpx));
  text-shadow: 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.72);
  overflow-wrap: break-word;
  word-break: break-word;
}

.lang-zh .task-label {
  font-size: calc(39 * var(--rpx));
  letter-spacing: calc(1.5 * var(--rpx));
}

.lang-en .task-label {
  font-size: calc(31 * var(--rpx));
}

.lang-es .task-label,
.lang-de .task-label,
.lang-ro .task-label,
.lang-bg .task-label,
.lang-tr .task-label,
.lang-vi .task-label {
  font-size: calc(29 * var(--rpx));
}

.task-button.current .task-label { text-shadow: 0 calc(1 * var(--rpx)) calc(2 * var(--rpx)) rgba(0,0,0,.2); }

.switch-tip {
  margin-top: calc(22 * var(--rpx));
  color: #8f959e;
  text-align: center;
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
}

.stop-button {
  margin-top: calc(24 * var(--rpx));
  min-height: calc(88 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(18 * var(--rpx));
  color: #b42318;
  background: #fff1f0;
  border-radius: calc(18 * var(--rpx));
  font-weight: 700;
  line-height: 1.35;
}

.utility-actions {
  display: flex;
  flex-direction: column;
  gap: calc(16 * var(--rpx));
  margin: calc(28 * var(--rpx)) 0 calc(24 * var(--rpx));
}

.utility-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: calc(84 * var(--rpx));
  margin: 0;
  padding: calc(10 * var(--rpx)) calc(20 * var(--rpx));
  border-radius: calc(17 * var(--rpx));
  box-sizing: border-box;
  font-size: calc(27 * var(--rpx));
  font-weight: 850;
  line-height: 1.3;
}

.forgot-button {
  color: #6b4500;
  background: linear-gradient(145deg, #fff8df, #ffe8a3);
  border: calc(2 * var(--rpx)) solid #f3c545;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(189, 135, 0, .12);
}

.forgot-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: calc(38 * var(--rpx));
  height: calc(38 * var(--rpx));
  margin-right: calc(12 * var(--rpx));
  color: #fff;
  background: #d48806;
  border-radius: 50%;
  font-weight: 900;
}

.unloading-button {
  color: #006d75;
  background: linear-gradient(145deg, #edfffc, #cff7f1);
  border: calc(2 * var(--rpx)) solid #73d9cf;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(0,109,117,.1);
}

.dashboard-button {
  color: #3730a3;
  background: linear-gradient(145deg, #f3f2ff, #dedcff);
  border: calc(2 * var(--rpx)) solid #aaa5ef;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(55,48,163,.1);
}

.utility-actions .share-button {
  color: #166534;
  background: linear-gradient(145deg, #f1fff5, #d8f8e1);
  border: calc(2 * var(--rpx)) solid #8bdda2;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(22,101,52,.1);
}

.page > .dashboard-button {
  min-height: calc(88 * var(--rpx));
  margin: calc(34 * var(--rpx)) 0 calc(18 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(22 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  font-weight: 800;
}

.page > .share-button {
  min-height: calc(88 * var(--rpx));
  margin: 0 0 calc(24 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(22 * var(--rpx));
  color: #1457a6;
  background: #eaf3ff;
  border-radius: calc(18 * var(--rpx));
  font-weight: 800;
}

/* 1.2.0 compact home layout */
.unbound-language-row {
  display: flex;
  justify-content: flex-end;
  margin: calc(4 * var(--rpx)) calc(4 * var(--rpx)) calc(18 * var(--rpx));
}

.compact-status-card {
  align-items: center;
  margin-top: 0;
  padding: calc(20 * var(--rpx)) calc(18 * var(--rpx)) calc(20 * var(--rpx)) calc(22 * var(--rpx));
}

.compact-status-card .employee-block { width: 31%; }
.compact-status-card .task-block { min-width: calc(120 * var(--rpx)); }
.compact-status-card .compact-divider { margin: 0 calc(16 * var(--rpx)); }
.compact-status-card .status-label { font-size: calc(20 * var(--rpx)); }
.compact-status-card .status-name,
.compact-status-card .status-task,
.compact-status-card .status-time { font-size: calc(29 * var(--rpx)); }

.compact-language-picker {
  margin-left: calc(16 * var(--rpx));
  flex-shrink: 0;
}

.compact-language-button {
  width: calc(68 * var(--rpx));
  height: calc(68 * var(--rpx));
}

.compact-language-button .language-button-icon { font-size: calc(33 * var(--rpx)); }

.manager-dashboard-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: calc(88 * var(--rpx));
  margin: 0;
  padding: calc(10 * var(--rpx)) calc(24 * var(--rpx)) calc(10 * var(--rpx)) calc(92 * var(--rpx));
  overflow: visible;
  box-sizing: border-box;
  color: #ffe7a1;
  background: linear-gradient(145deg, #252525 0%, #050505 68%, #1a1306 100%);
  border: calc(2 * var(--rpx)) solid #c89b2c;
  border-radius: calc(17 * var(--rpx));
  box-shadow: 0 calc(9 * var(--rpx)) calc(22 * var(--rpx)) rgba(0, 0, 0, .24), inset 0 calc(1 * var(--rpx)) 0 rgba(255, 235, 166, .22);
  font-size: calc(29 * var(--rpx));
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: calc(.4 * var(--rpx));
  text-shadow: 0 calc(1 * var(--rpx)) calc(2 * var(--rpx)) rgba(0,0,0,.8);
}

.manager-dashboard-button::after { border: none; }

.manager-crown {
  position: absolute;
  left: calc(-14 * var(--rpx));
  top: calc(-30 * var(--rpx));
  z-index: 3;
  width: calc(112 * var(--rpx));
  height: calc(112 * var(--rpx));
  filter: drop-shadow(0 calc(7 * var(--rpx)) calc(7 * var(--rpx)) rgba(0, 0, 0, .35));
  pointer-events: none;
}

.manager-button-text {
  display: block;
  max-width: 100%;
  font-size: calc(29 * var(--rpx));
  font-weight: 900;
  white-space: normal;
}

.standalone-manager-button { margin: calc(42 * var(--rpx)) 0 calc(24 * var(--rpx)); }

.my-hours-section { margin-top: calc(28 * var(--rpx)); }
.my-hours-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(24 * var(--rpx));
  border: calc(2 * var(--rpx)) solid #c9e0ff;
}
.my-hours-title { color: #143d70; font-size: calc(31 * var(--rpx)); font-weight: 900; }
.my-hours-subtitle { margin-top: calc(6 * var(--rpx)); color: #7b8796; font-size: calc(22 * var(--rpx)); }
.my-hours-toggle { margin-left: calc(18 * var(--rpx)); color: #1667c5; font-size: calc(24 * var(--rpx)); font-weight: 850; white-space: nowrap; }
.hours-content { margin-top: calc(16 * var(--rpx)); }
.hours-card { margin-top: calc(16 * var(--rpx)); padding: calc(24 * var(--rpx)); }
.hours-card:first-child { margin-top: 0; }
.hours-card-header { display: flex; justify-content: space-between; align-items: center; }
.hours-card-title { color: #1f2329; font-size: calc(29 * var(--rpx)); font-weight: 900; }
.hours-picker { padding: calc(13 * var(--rpx)) calc(18 * var(--rpx)); color: #1457a6; background: #eaf3ff; border-radius: calc(13 * var(--rpx)); font-size: calc(23 * var(--rpx)); font-weight: 850; }
.hours-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: calc(24 * var(--rpx)); color: #646a73; font-size: calc(23 * var(--rpx)); }
.hours-total-value { color: #0f5fb8; font-size: calc(40 * var(--rpx)); font-weight: 900; letter-spacing: calc(1 * var(--rpx)); }
.hours-meta { margin: calc(8 * var(--rpx)) 0 calc(15 * var(--rpx)); color: #8f959e; font-size: calc(20 * var(--rpx)); line-height: 1.45; }
.hours-task-row { display: flex; justify-content: space-between; align-items: center; min-height: calc(58 * var(--rpx)); border-top: calc(1 * var(--rpx)) solid #edf0f3; color: #30343a; font-size: calc(24 * var(--rpx)); font-weight: 750; }
.hours-task-count { color: #8f959e; font-size: calc(20 * var(--rpx)); }
.hours-task-time { margin-left: calc(12 * var(--rpx)); color: #16823b; font-weight: 900; white-space: nowrap; }
.hours-empty { padding: calc(34 * var(--rpx)) calc(12 * var(--rpx)) calc(12 * var(--rpx)); color: #969da7; text-align: center; font-size: calc(23 * var(--rpx)); }

.auto-login-footer {
  margin: calc(30 * var(--rpx)) 0 calc(12 * var(--rpx));
  color: #9ba1aa;
  font-size: calc(21 * var(--rpx));
  line-height: 1.5;
  text-align: center;
}

/* 1.2.2 floating three-column task console */
.task-panel {
  position: relative;
  margin-top: calc(30 * var(--rpx));
  padding: calc(28 * var(--rpx)) calc(22 * var(--rpx)) calc(24 * var(--rpx));
  overflow: visible;
  border: calc(1 * var(--rpx)) solid rgba(223, 231, 241, .94);
  border-radius: calc(28 * var(--rpx));
  box-shadow: 0 calc(22 * var(--rpx)) calc(58 * var(--rpx)) rgba(34, 61, 96, .13), 0 calc(4 * var(--rpx)) calc(14 * var(--rpx)) rgba(34, 61, 96, .06);
}

.task-panel::before {
  content: "";
  position: absolute;
  left: calc(36 * var(--rpx));
  right: calc(36 * var(--rpx));
  bottom: calc(-16 * var(--rpx));
  z-index: -1;
  height: calc(36 * var(--rpx));
  background: rgba(43, 80, 125, .1);
  border-radius: 50%;
  filter: blur(calc(16 * var(--rpx)));
}

.task-panel.sort-mode {
  border-color: #8abcf7;
  box-shadow: 0 calc(22 * var(--rpx)) calc(60 * var(--rpx)) rgba(19, 104, 219, .18), inset 0 0 0 calc(2 * var(--rpx)) rgba(67, 142, 235, .08);
}

.task-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: calc(12 * var(--rpx));
  min-height: calc(54 * var(--rpx));
  margin-bottom: calc(22 * var(--rpx));
  flex-wrap: wrap;
}

.task-title {
  margin: 0;
  color: #172033;
  font-size: calc(34 * var(--rpx));
  font-weight: 900;
}

.sort-controls {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--rpx));
  margin-left: auto;
}

.sort-toggle,
.reset-sort-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(50 * var(--rpx));
  padding: 0 calc(14 * var(--rpx));
  box-sizing: border-box;
  color: #697588;
  background: #f3f6fa;
  border: calc(1 * var(--rpx)) solid #e0e6ee;
  border-radius: calc(999 * var(--rpx));
  font-size: calc(20 * var(--rpx));
  font-weight: 800;
  line-height: 1.15;
}

.sort-toggle.active {
  color: #ffffff;
  background: linear-gradient(135deg, #2585f5, #0c60c9);
  border-color: #0c60c9;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(12, 96, 201, .2);
}

.reset-sort-button { color: #9a6400; background: #fff7df; border-color: #f0d58c; }
.sort-toggle-icon { margin-left: calc(8 * var(--rpx)); font-size: calc(27 * var(--rpx)); font-weight: 900; }
.sort-hint {
  margin: calc(-6 * var(--rpx)) 0 calc(18 * var(--rpx));
  padding: calc(13 * var(--rpx)) calc(16 * var(--rpx));
  color: #175ca6;
  background: #edf6ff;
  border: calc(1 * var(--rpx)) dashed #a9cef5;
  border-radius: calc(14 * var(--rpx));
  font-size: calc(20 * var(--rpx));
  font-weight: 700;
  text-align: center;
}

.task-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(14 * var(--rpx));
}

.task-button {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 0;
  min-height: calc(172 * var(--rpx));
  height: calc(172 * var(--rpx));
  margin: 0;
  padding: calc(13 * var(--rpx)) calc(7 * var(--rpx)) calc(10 * var(--rpx));
  overflow: hidden;
  box-sizing: border-box;
  color: #243148;
  background: linear-gradient(150deg, #fbfdff, #eef5ff);
  border: calc(2 * var(--rpx)) solid #e1e9f4;
  border-radius: calc(21 * var(--rpx));
  box-shadow: 0 calc(8 * var(--rpx)) calc(20 * var(--rpx)) rgba(44, 82, 128, .08), inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.9);
  line-height: 1.08;
}

.task-button::before {
  content: "";
  position: absolute;
  left: calc(16 * var(--rpx));
  right: calc(16 * var(--rpx));
  top: 0;
  height: calc(4 * var(--rpx));
  background: linear-gradient(90deg, transparent, rgba(54,126,221,.42), transparent);
  border-radius: calc(999 * var(--rpx));
}

.task-button:active,
.task-button-hover { opacity: 1; transform: translateY(calc(1 * var(--rpx))) scale(.975); }
.task-icon { width: calc(60 * var(--rpx)); height: calc(60 * var(--rpx)); flex: none; margin-bottom: calc(9 * var(--rpx)); }

.task-label {
  position: relative;
  z-index: 2;
  display: -webkit-box;
  width: 100%;
  max-height: calc(76 * var(--rpx));
  overflow: hidden;
  color: inherit;
  font-size: calc(24 * var(--rpx));
  font-weight: 850;
  line-height: 1.14;
  letter-spacing: 0;
  text-align: center;
  text-shadow: none;
  word-break: break-word;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.lang-zh .task-label { font-size: calc(29 * var(--rpx)); font-weight: 900; letter-spacing: calc(.4 * var(--rpx)); }
.lang-en .task-label { font-size: calc(24 * var(--rpx)); }
.lang-vi .task-label { font-size: calc(23 * var(--rpx)); }
.lang-es .task-label,
.lang-de .task-label,
.lang-ro .task-label,
.lang-bg .task-label,
.lang-tr .task-label { font-size: calc(22 * var(--rpx)); }

.task-tone-blue { background: linear-gradient(150deg,#fbfdff,#eaf3ff); border-color: #d6e5fb; }
.task-tone-green { background: linear-gradient(150deg,#fbfffd,#e9f9f0); border-color: #d5efe1; }
.task-tone-cyan { background: linear-gradient(150deg,#fbfeff,#e9f7fc); border-color: #d5eaf2; }
.task-tone-purple { background: linear-gradient(150deg,#fefcff,#f2ebfc); border-color: #e4d8f5; }
.task-tone-orange { background: linear-gradient(150deg,#fffdf9,#fff2e4); border-color: #f3e2d0; }
.task-tone-slate { background: linear-gradient(150deg,#fcfdff,#edf2f8); border-color: #dce5ef; }
.task-tone-red { background: linear-gradient(150deg,#fffdfd,#fff0ef); border-color: #f3dada; }
.task-tone-violet { background: linear-gradient(150deg,#fefcff,#f2ebfb); border-color: #e6daf5; }
.task-tone-royal { background: linear-gradient(150deg,#fbfdff,#ebf3ff); border-color: #d8e5f7; }
.task-tone-amber { background: linear-gradient(150deg,#fffefa,#fff4e8); border-color: #f2e2cf; }
.task-tone-gold { background: linear-gradient(150deg,#fffef9,#fff6e7); border-color: #f2e4c4; }
.task-tone-emerald { background: linear-gradient(150deg,#fbfffd,#e8faf1); border-color: #d1efdf; }
.task-tone-indigo { background: linear-gradient(150deg,#fbfdff,#edf2ff); border-color: #dbe3f7; }
.task-tone-rose { background: linear-gradient(150deg,#fffdfd,#ffeff4); border-color: #f3d9e1; }
.task-tone-mint { background: linear-gradient(150deg,#fbfffc,#e8f9ef); border-color: #cfead9; }

.task-button.current {
  color: #ffffff;
  background: linear-gradient(145deg, #1cb765, #0b7e45);
  border-color: #0b7e45;
  box-shadow: 0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(11,126,69,.28), inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.25);
}
.task-button.current::before { background: rgba(255,255,255,.62); }
.task-button.current .task-icon { padding: calc(5 * var(--rpx)); background: rgba(255,255,255,.94); border-radius: calc(15 * var(--rpx)); box-sizing: border-box; }
.task-button.current .task-label { text-shadow: 0 calc(1 * var(--rpx)) calc(2 * var(--rpx)) rgba(0,0,0,.18); }
.task-button[disabled] { color: #929aa6; background: #eef1f4; border-color: #e1e5ea; box-shadow: none; }
.task-button[disabled] .task-icon { filter: grayscale(1); opacity: .52; }
.task-button[disabled]::before { display: none; }
.task-button.disabled { color: #929aa6; background: #eef1f4; border-color: #e1e5ea; box-shadow: none; }
.task-button.disabled .task-icon { filter: grayscale(1); opacity: .52; }
.task-button.disabled::before { display: none; }
.task-button.disabled.task-button-hover { transform: none; opacity: 1; }

.sort-task-button { user-select: none; }
.sort-task-button .drag-handle {
  position: absolute;
  right: calc(9 * var(--rpx));
  top: calc(7 * var(--rpx));
  color: #9aa7b8;
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
  letter-spacing: calc(-4 * var(--rpx));
}
.task-hide-control {
  position:absolute;
  left:calc(7 * var(--rpx));
  top:calc(6 * var(--rpx));
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:center;
  width:calc(42 * var(--rpx));
  height:calc(42 * var(--rpx));
  color:#ffffff;
  background:#ef4444;
  border:calc(3 * var(--rpx)) solid #ffffff;
  border-radius:50%;
  box-shadow:0 calc(5 * var(--rpx)) calc(12 * var(--rpx)) rgba(190,35,45,.24);
  font-size:calc(30 * var(--rpx));
  font-weight:900;
  line-height:1;
}
.hidden-task-panel {
  margin-top:calc(20 * var(--rpx));
  padding:calc(20 * var(--rpx));
  border:calc(2 * var(--rpx)) dashed #cbd8e8;
  border-radius:calc(20 * var(--rpx));
  background:#f7faff;
}
.hidden-task-heading { color:#52657d; font-size:calc(23 * var(--rpx)); font-weight:900; }
.hidden-task-list { display:flex; flex-wrap:wrap; gap:calc(12 * var(--rpx)); margin-top:calc(14 * var(--rpx)); }
.hidden-task-chip {
  display:flex;
  align-items:center;
  gap:calc(6 * var(--rpx));
  min-height:calc(52 * var(--rpx));
  padding:0 calc(16 * var(--rpx)) 0 calc(10 * var(--rpx));
  color:#1d5fae;
  background:#ffffff;
  border:calc(1 * var(--rpx)) solid #bdd5ef;
  border-radius:calc(999 * var(--rpx));
  font-size:calc(21 * var(--rpx));
  font-weight:850;
  box-shadow:0 calc(5 * var(--rpx)) calc(12 * var(--rpx)) rgba(45,87,134,.06);
}
.restore-symbol { color:#0f9f6e; font-size:calc(30 * var(--rpx)); font-weight:900; }
.hidden-task-tip { margin-top:calc(13 * var(--rpx)); color:#8a97a8; font-size:calc(19 * var(--rpx)); }
.sort-task-button.dragging {
  z-index: 8;
  transform: scale(1.055);
  border-color: #4f9bf0;
  box-shadow: 0 calc(18 * var(--rpx)) calc(38 * var(--rpx)) rgba(20,104,214,.23);
  opacity: .92;
}
.sort-task-button.drag-over { border-color: #4f9bf0; }

.switch-tip { margin: calc(20 * var(--rpx)) calc(6 * var(--rpx)) 0; color: #8993a1; font-size: calc(20 * var(--rpx)); }
.stop-button { margin-top: calc(22 * var(--rpx)); }

.utility-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: calc(96 * var(--rpx)) calc(96 * var(--rpx));
  gap: calc(16 * var(--rpx));
  margin: calc(36 * var(--rpx)) 0 calc(26 * var(--rpx));
}

.utility-button {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  min-height: calc(96 * var(--rpx));
  height: calc(96 * var(--rpx));
  margin: 0;
  padding: calc(11 * var(--rpx)) calc(38 * var(--rpx)) calc(11 * var(--rpx)) calc(17 * var(--rpx));
  box-sizing: border-box;
  border-radius: calc(20 * var(--rpx));
  text-align: left;
  box-shadow: 0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(35,62,97,.09);
}

.forgot-button {
  height: calc(96 * var(--rpx));
  padding: calc(11 * var(--rpx)) calc(38 * var(--rpx)) calc(11 * var(--rpx)) calc(17 * var(--rpx));
  color: #714b00;
  background: linear-gradient(145deg,#fffdf5,#ffedba);
  border: calc(2 * var(--rpx)) solid #efd071;
}

.forgot-entry-icon {
  color: #ffffff;
  background: linear-gradient(145deg,#f2ae00,#cb7900);
  border-radius: 48% 48% 48% 12%;
  box-shadow: 0 calc(7 * var(--rpx)) calc(16 * var(--rpx)) rgba(193,116,0,.2);
  font-size: calc(36 * var(--rpx));
  font-weight: 900;
}

.unloading-button {
  color: #006a70;
  background: linear-gradient(145deg,#f1fffd,#d7f8f3);
  border: calc(2 * var(--rpx)) solid #96dfd7;
}

.utility-actions .manager-dashboard-button {
  grid-column: 1 / 3;
  min-height: calc(96 * var(--rpx));
  height: calc(96 * var(--rpx));
  padding: calc(11 * var(--rpx)) calc(38 * var(--rpx)) calc(11 * var(--rpx)) calc(17 * var(--rpx));
  color: #ffe8a8;
  background: linear-gradient(145deg,#222326,#070708 72%,#211807);
  border: calc(2 * var(--rpx)) solid #b98b2d;
  border-radius: calc(20 * var(--rpx));
  box-shadow: 0 calc(12 * var(--rpx)) calc(26 * var(--rpx)) rgba(0,0,0,.23), inset 0 calc(1 * var(--rpx)) 0 rgba(255,239,184,.16);
}

.staff-actions {
  grid-template-rows:calc(96 * var(--rpx));
}

.utility-icon {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(56 * var(--rpx));
  height: calc(56 * var(--rpx));
  margin-right: calc(14 * var(--rpx));
  flex: none;
}
.utility-icon img { width: calc(56 * var(--rpx)); height: calc(56 * var(--rpx)); }
.utility-copy { min-width: 0; flex: 1; }
.utility-title { display: -webkit-box; max-height: calc(58 * var(--rpx)); overflow: hidden; font-size: calc(25 * var(--rpx)); font-weight: 900; line-height: 1.15; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.utility-subtitle { margin-top: calc(5 * var(--rpx)); color: rgba(54,73,94,.66); font-size: calc(18 * var(--rpx)); font-weight: 650; line-height: 1.15; overflow-wrap: anywhere; }
.manager-subtitle { color: rgba(255,234,178,.68); }
.manager-button-text { max-width: none; color: inherit; font-size: calc(25 * var(--rpx)); white-space: normal; }
.utility-arrow { position: absolute; right: calc(15 * var(--rpx)); top: 50%; margin-top: calc(-18 * var(--rpx)); font-size: calc(36 * var(--rpx)); font-weight: 500; line-height: calc(36 * var(--rpx)); }
.crown-entry-icon { overflow: visible; }
.crown-entry-icon .manager-crown {
  position: static;
  width: calc(73 * var(--rpx));
  height: calc(73 * var(--rpx));
  filter: drop-shadow(0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(0,0,0,.32));
}
.standalone-manager-button .manager-button-text { font-size: calc(29 * var(--rpx)); }

.visitor-actions { grid-template-columns: 1fr; grid-template-rows: calc(96 * var(--rpx)) calc(96 * var(--rpx)); }
.visitor-actions .unloading-button,
.visitor-actions .manager-dashboard-button { grid-column: 1; }

@media (max-width: 360px) {
  .task-panel { padding-left: calc(18 * var(--rpx)); padding-right: calc(18 * var(--rpx)); }
  .task-grid { gap: calc(11 * var(--rpx)); }
  .task-button { min-height: calc(164 * var(--rpx)); height: calc(164 * var(--rpx)); }
  .task-icon { width: calc(54 * var(--rpx)); height: calc(54 * var(--rpx)); }
  .lang-zh .task-label { font-size: calc(27 * var(--rpx)); }
  .lang-en .task-label,.lang-vi .task-label { font-size: calc(21 * var(--rpx)); }
  .lang-es .task-label,.lang-de .task-label,.lang-ro .task-label,.lang-bg .task-label,.lang-tr .task-label { font-size: calc(20 * var(--rpx)); }
  .utility-title,.manager-button-text { font-size: calc(22 * var(--rpx)); }
  .utility-subtitle { font-size: calc(16 * var(--rpx)); }
}

.role-preview-banner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:calc(16 * var(--rpx));
  margin:0 0 calc(18 * var(--rpx));
  padding:calc(18 * var(--rpx)) calc(20 * var(--rpx));
  box-sizing:border-box;
  color:#704d00;
  background:linear-gradient(135deg,#fff8dc,#ffecad);
  border:calc(1 * var(--rpx)) solid #f0cc62;
  border-radius:calc(18 * var(--rpx));
  box-shadow:0 calc(8 * var(--rpx)) calc(20 * var(--rpx)) rgba(150,104,0,.12);
}
.role-preview-copy { flex:1; min-width:0; }
.role-preview-title { font-size:calc(24 * var(--rpx)); font-weight:950; }
.role-preview-hint { margin-top:calc(4 * var(--rpx)); font-size:calc(18 * var(--rpx)); line-height:1.35; }
.role-preview-banner button { flex:0 0 auto; min-width:calc(92 * var(--rpx)); min-height:calc(52 * var(--rpx)); margin:0; padding:0 calc(16 * var(--rpx)); color:#fff; font-size:calc(20 * var(--rpx)); font-weight:900; line-height:calc(52 * var(--rpx)); background:#9b6b00; border-radius:calc(12 * var(--rpx)); }

/* 1.2.4 首页抬头、身份卡和数据看板 */
.brand-header {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  color: #ffffff;
  background: linear-gradient(135deg, #0868e8 0%, #2388ff 72%, #55a9ff 100%);
  box-shadow: 0 calc(10 * var(--rpx)) calc(26 * var(--rpx)) rgba(9, 88, 191, .18);
}

.brand-copy {
  width: 100%;
  padding-left: calc(34 * var(--rpx));
  padding-bottom: calc(16 * var(--rpx));
  box-sizing: border-box;
  text-align: left;
}

.brand-title {
  font-size: calc(38 * var(--rpx));
  font-weight: 950;
  line-height: 1.16;
  letter-spacing: calc(.5 * var(--rpx));
  text-shadow: 0 calc(2 * var(--rpx)) calc(5 * var(--rpx)) rgba(0, 47, 116, .18);
}

.brand-subtitle {
  margin-top: calc(7 * var(--rpx));
  color: rgba(255, 255, 255, .88);
  font-size: calc(20 * var(--rpx));
  font-weight: 650;
  letter-spacing: calc(.4 * var(--rpx));
  line-height: 1.2;
}

.profile-status-card {
  display: flex;
  align-items: center;
  min-height: calc(124 * var(--rpx));
  padding: calc(22 * var(--rpx)) calc(24 * var(--rpx));
  box-sizing: border-box;
}

.profile-avatar-wrap {
  position: relative;
  width: calc(86 * var(--rpx));
  height: calc(86 * var(--rpx));
  margin-right: calc(20 * var(--rpx));
  flex: none;
}

.profile-avatar {
  width: calc(86 * var(--rpx));
  height: calc(86 * var(--rpx));
  box-sizing: border-box;
  background: #eef2f7;
  border: calc(4 * var(--rpx)) solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 calc(7 * var(--rpx)) calc(18 * var(--rpx)) rgba(32, 63, 104, .16);
}

.profile-avatar-edit {
  position: absolute;
  right: calc(-2 * var(--rpx));
  bottom: calc(-2 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(30 * var(--rpx));
  height: calc(30 * var(--rpx));
  color: #ffffff;
  background: #1677ff;
  border: calc(3 * var(--rpx)) solid #ffffff;
  border-radius: 50%;
  font-size: calc(22 * var(--rpx));
  font-weight: 900;
  line-height: 1;
}

.profile-main { min-width: 0; flex: 1; }
.profile-name-row { display: flex; align-items: center; min-width: 0; }
.profile-name {
  max-width: 63%;
  overflow: hidden;
  color: #17233a;
  font-size: calc(34 * var(--rpx));
  font-weight: 900;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-role {
  margin-left: calc(13 * var(--rpx));
  padding: calc(6 * var(--rpx)) calc(12 * var(--rpx));
  color: #1765c2;
  background: #eaf3ff;
  border-radius: calc(9 * var(--rpx));
  font-size: calc(19 * var(--rpx));
  font-weight: 850;
  line-height: 1;
}
.profile-role.role-manager { color: #9a6300; background: #fff4d1; }
.profile-role.role-visitor { color: #6d4ac1; background: #f1ebff; }
.profile-task-row { margin-top: calc(11 * var(--rpx)); color: #687386; font-size: calc(23 * var(--rpx)); line-height: 1.25; }
.profile-task-value { color: #27354b; font-weight: 800; }
.profile-task-value.active { color: #078147; }
.profile-task-time { margin-left: calc(5 * var(--rpx)); color: #8a94a4; }
.profile-status-card .compact-language-picker { margin-left: calc(14 * var(--rpx)); flex: none; }

.home-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: calc(22 * var(--rpx)) 0 calc(26 * var(--rpx));
  padding: calc(22 * var(--rpx)) calc(12 * var(--rpx));
  box-sizing: border-box;
}

.home-metric {
  position: relative;
  min-width: 0;
  padding: 0 calc(13 * var(--rpx));
  box-sizing: border-box;
  border-right: calc(1 * var(--rpx)) solid #e9edf3;
}
.home-metric:last-child { border-right: 0; }
.metric-icon { font-size: calc(25 * var(--rpx)); font-weight: 900; line-height: 1; }
.metric-blue { color: #287ff0; }
.metric-green { color: #19ae87; }
.metric-orange { color: #f28b2c; }
.metric-purple { color: #8d4de1; }
.metric-label {
  margin-top: calc(10 * var(--rpx));
  overflow: hidden;
  color: #596579;
  font-size: calc(19 * var(--rpx));
  font-weight: 750;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.metric-value {
  margin-top: calc(8 * var(--rpx));
  overflow: hidden;
  color: #1e3454;
  font-size: calc(28 * var(--rpx));
  font-weight: 950;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.metric-link {
  margin-top: calc(9 * var(--rpx));
  overflow: hidden;
  color: #8b96a7;
  font-size: calc(17 * var(--rpx));
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notice-metric.has-notice {
  z-index: 3;
  margin: calc(-12 * var(--rpx)) 0;
  padding-top: calc(12 * var(--rpx));
  padding-bottom: calc(12 * var(--rpx));
  color: #ffffff;
  background: linear-gradient(145deg, #ff3f4d, #c80018 72%, #a90012);
  border: calc(3 * var(--rpx)) solid #ffffff;
  border-radius: calc(17 * var(--rpx));
  box-shadow: 0 0 0 calc(5 * var(--rpx)) rgba(235, 27, 45, .2), 0 calc(10 * var(--rpx)) calc(28 * var(--rpx)) rgba(190, 0, 20, .42);
  animation: noticePulse 1.25s ease-in-out infinite;
}
.notice-metric.has-notice .metric-icon,
.notice-metric.has-notice .metric-label,
.notice-metric.has-notice .metric-value,
.notice-metric.has-notice .metric-link { color: #ffffff; }
.notice-metric.has-notice .metric-icon {
  display:flex;
  align-items:center;
  justify-content:center;
  width:calc(34 * var(--rpx));
  height:calc(34 * var(--rpx));
  color:#c60017;
  background:#ffffff;
  border-radius:50%;
  font-size:calc(25 * var(--rpx));
  font-weight:950;
  animation:noticeIconFlash .72s ease-in-out infinite alternate;
}
.notice-metric.has-notice .metric-label { font-weight:900; }
.notice-metric.has-notice .metric-value {
  font-size:calc(36 * var(--rpx));
  font-weight:950;
  text-shadow:0 calc(2 * var(--rpx)) calc(6 * var(--rpx)) rgba(83,0,7,.35);
}
.notice-metric.has-notice .metric-link { color:#fff2b9; font-weight:850; }
.notice-alert-badge {
  position:absolute;
  z-index:5;
  right:calc(-9 * var(--rpx));
  top:calc(-13 * var(--rpx));
  min-width:calc(52 * var(--rpx));
  padding:calc(5 * var(--rpx)) calc(9 * var(--rpx));
  box-sizing:border-box;
  color:#b30015;
  background:#fff36b;
  border:calc(3 * var(--rpx)) solid #ffffff;
  border-radius:calc(999 * var(--rpx));
  box-shadow:0 calc(5 * var(--rpx)) calc(13 * var(--rpx)) rgba(112,0,10,.3);
  font-size:calc(15 * var(--rpx));
  font-weight:950;
  letter-spacing:calc(1 * var(--rpx));
  line-height:1;
  text-align:center;
}

@keyframes noticePulse {
  0%,100% { transform:scale(1); box-shadow:0 0 0 calc(4 * var(--rpx)) rgba(235,27,45,.16),0 calc(9 * var(--rpx)) calc(24 * var(--rpx)) rgba(190,0,20,.34); }
  50% { transform:scale(1.055); box-shadow:0 0 0 calc(11 * var(--rpx)) rgba(255,47,65,.23),0 calc(13 * var(--rpx)) calc(33 * var(--rpx)) rgba(190,0,20,.52); }
}
@keyframes noticeIconFlash {
  from { opacity:.62; transform:scale(.9); }
  to { opacity:1; transform:scale(1.13); }
}

@media (max-width: 360px) {
  .brand-title { font-size: calc(34 * var(--rpx)); }
  .brand-subtitle { font-size: calc(18 * var(--rpx)); }
  .profile-name { font-size: calc(30 * var(--rpx)); }
  .profile-avatar-wrap,.profile-avatar { width: calc(78 * var(--rpx)); height: calc(78 * var(--rpx)); }
  .home-overview { padding-left: calc(7 * var(--rpx)); padding-right: calc(7 * var(--rpx)); }
  .home-metric { padding-left: calc(8 * var(--rpx)); padding-right: calc(8 * var(--rpx)); }
  .metric-label { font-size: calc(17 * var(--rpx)); }
  .metric-value { font-size: calc(24 * var(--rpx)); }
  .metric-link { font-size: calc(15 * var(--rpx)); }
}

/* V1.3.2-R8 统一高质感视觉系统：仅覆盖样式，不改变任何业务逻辑 */
.brand-header {
  position: relative;
  z-index: 1;
  overflow: hidden;
  background: linear-gradient(180deg, #0d5ee8 0%, #1677f2 48%, #5aaaff 100%);
  box-shadow: none;
}
.brand-header::after {
  content: "";
  position: absolute;
  right: calc(-110 * var(--rpx));
  bottom: calc(-160 * var(--rpx));
  width: calc(440 * var(--rpx));
  height: calc(300 * var(--rpx));
  border: calc(54 * var(--rpx)) solid rgba(255,255,255,.10);
  border-radius: 50%;
  transform: rotate(-12deg);
  pointer-events: none;
}
.brand-copy { position: relative; z-index: 1; padding-left: calc(38 * var(--rpx)); padding-bottom: calc(20 * var(--rpx)); }
.brand-copy-single { padding-bottom: 0; }
.brand-title { font-size: calc(41 * var(--rpx)); font-weight: 950; letter-spacing: calc(.7 * var(--rpx)); text-shadow: 0 calc(3 * var(--rpx)) calc(10 * var(--rpx)) rgba(0,38,102,.24); }
.brand-subtitle { margin-top: calc(8 * var(--rpx)); color: rgba(255,255,255,.91); font-size: calc(21 * var(--rpx)); font-weight: 720; letter-spacing: calc(.7 * var(--rpx)); }

.page {
  min-height: calc(100vh - calc(160 * var(--rpx)));
  padding: calc(22 * var(--rpx)) calc(28 * var(--rpx)) calc(54 * var(--rpx));
  background: linear-gradient(180deg, #5aaaff calc(0 * var(--rpx)), #cfe5ff calc(150 * var(--rpx)), #edf5ff calc(310 * var(--rpx)), #f4f7fb calc(540 * var(--rpx)), #f4f7fb 100%);
}
.page > .card,
.profile-status-card,
.attendance-scan-card,
.home-overview,
.task-panel {
  border: calc(1 * var(--rpx)) solid rgba(218,230,245,.92);
  box-shadow: 0 calc(16 * var(--rpx)) calc(42 * var(--rpx)) rgba(31,74,130,.10), inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.96);
}
.profile-status-card {
  min-height: calc(132 * var(--rpx));
  padding: calc(23 * var(--rpx)) calc(25 * var(--rpx));
  background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,251,255,.98));
  border-radius: calc(26 * var(--rpx));
  backdrop-filter: blur(calc(18 * var(--rpx)));
}
.profile-avatar-wrap,.profile-avatar { width: calc(90 * var(--rpx)); height: calc(90 * var(--rpx)); }
.profile-avatar { border-width: calc(5 * var(--rpx)); box-shadow: 0 calc(9 * var(--rpx)) calc(24 * var(--rpx)) rgba(24,73,135,.18); }
.profile-name { color:#14223a; font-size:calc(36 * var(--rpx)); font-weight:950; letter-spacing:calc(.3 * var(--rpx)); }
.profile-role { padding:calc(7 * var(--rpx)) calc(13 * var(--rpx)); color:#1165d5; background:#e6f1ff; border:calc(1 * var(--rpx)) solid #cfE3ff; border-radius:calc(10 * var(--rpx)); }
.profile-task-row { color:#76849a; font-size:calc(23 * var(--rpx)); }
.profile-task-value { color:#23334d; }
.compact-language-button { background:linear-gradient(145deg,#ffffff,#edf6ff); border-color:#2685f4; box-shadow:0 calc(9 * var(--rpx)) calc(22 * var(--rpx)) rgba(25,107,221,.18); }
.language-button-arrow { border-color:#ffffff; }

.location-strip {
  min-height: calc(62 * var(--rpx));
  margin-top: calc(16 * var(--rpx));
  padding: calc(9 * var(--rpx)) calc(20 * var(--rpx));
  background: linear-gradient(90deg,#e7fbef,#effcf6);
  border: calc(1 * var(--rpx)) solid #c8eed7;
  border-radius: calc(18 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  box-shadow: 0 calc(7 * var(--rpx)) calc(18 * var(--rpx)) rgba(29,142,82,.06);
}
.attendance-scan-card {
  min-height: calc(108 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
  padding: calc(20 * var(--rpx)) calc(22 * var(--rpx)) calc(20 * var(--rpx)) calc(25 * var(--rpx));
  background: rgba(255,255,255,.97);
  border-radius: calc(24 * var(--rpx));
}
.attendance-scan-title { color:#17243a; font-size:calc(27 * var(--rpx)); font-weight:950; }
.attendance-scan-subtitle { color:#8793a5; }
.attendance-scan-button { min-width:calc(210 * var(--rpx)); min-height:calc(70 * var(--rpx)); border-radius:calc(17 * var(--rpx)); background:linear-gradient(135deg,#2688ff,#0c63d8); box-shadow:0 calc(9 * var(--rpx)) calc(22 * var(--rpx)) rgba(13,99,216,.22); }
.attendance-scan-button.clock-out,.attendance-scan-card.clocked-in .attendance-scan-button { background:linear-gradient(135deg,#12ad72,#087c50); }

.home-overview {
  margin: calc(22 * var(--rpx)) 0 calc(26 * var(--rpx));
  padding: calc(24 * var(--rpx)) calc(12 * var(--rpx));
  background: rgba(255,255,255,.98);
  border-radius: calc(26 * var(--rpx));
}
.home-metric { padding:0 calc(14 * var(--rpx)); border-color:#e7edf5; }
.metric-icon { display:flex; align-items:center; justify-content:center; width:calc(34 * var(--rpx)); height:calc(34 * var(--rpx)); border-radius:calc(11 * var(--rpx)); font-size:calc(22 * var(--rpx)); }
.metric-blue { color:#176deb; background:#eaf2ff; }
.metric-green { color:#0ca67c; background:#e8faf5; }
.metric-orange { color:#f17e22; background:#fff1e5; }
.metric-purple { color:#8a4ce0; background:#f2eaff; }
.metric-label { color:#59687d; font-weight:800; }
.metric-value { color:#142a4a; font-size:calc(30 * var(--rpx)); font-weight:950; }
.metric-link { color:#8794a7; font-weight:650; }

.task-panel {
  margin-top: calc(28 * var(--rpx));
  padding: calc(28 * var(--rpx)) calc(23 * var(--rpx)) calc(26 * var(--rpx));
  background: rgba(255,255,255,.985);
  border-radius: calc(30 * var(--rpx));
  box-shadow: 0 calc(22 * var(--rpx)) calc(58 * var(--rpx)) rgba(25,66,117,.13), 0 calc(4 * var(--rpx)) calc(14 * var(--rpx)) rgba(25,66,117,.06), inset 0 calc(1 * var(--rpx)) 0 #fff;
}
.task-panel::before { background:rgba(30,68,117,.11); }
.task-title { color:#14223a; font-size:calc(35 * var(--rpx)); font-weight:950; letter-spacing:calc(.3 * var(--rpx)); }
.sort-toggle,.reset-sort-button { min-height:calc(54 * var(--rpx)); padding:0 calc(16 * var(--rpx)); background:#f2f6fb; border-color:#dce6f1; font-weight:850; }
.sort-toggle.active { background:linear-gradient(135deg,#2688ff,#0d64d8); }
.sort-hint { color:#1766c4; background:linear-gradient(90deg,#eef7ff,#f5faff); border-color:#a7cff7; }
.task-grid { gap: calc(15 * var(--rpx)); }
.task-button {
  min-height: calc(176 * var(--rpx));
  height: calc(176 * var(--rpx));
  padding: calc(14 * var(--rpx)) calc(7 * var(--rpx)) calc(11 * var(--rpx));
  border-radius: calc(23 * var(--rpx));
  box-shadow: 0 calc(10 * var(--rpx)) calc(25 * var(--rpx)) rgba(38,79,129,.085), inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.98);
}
.task-button::before { left:calc(22 * var(--rpx)); right:calc(22 * var(--rpx)); height:calc(3 * var(--rpx)); opacity:.72; }
.task-icon { width:calc(62 * var(--rpx)); height:calc(62 * var(--rpx)); margin-bottom:calc(10 * var(--rpx)); filter: drop-shadow(0 calc(5 * var(--rpx)) calc(7 * var(--rpx)) rgba(37,81,139,.12)); }
.task-label { color:#1c2a42; font-weight:900; letter-spacing:calc(.2 * var(--rpx)); }
.lang-zh .task-label { font-size:calc(30 * var(--rpx)); }
.task-button.current { background:linear-gradient(145deg,#19b978,#078555); border-color:#078555; box-shadow:0 calc(14 * var(--rpx)) calc(30 * var(--rpx)) rgba(7,133,85,.27); }
.task-button.current .task-label { color:#fff; }
.task-button.disabled,.task-button[disabled] { background:#eef2f6; border-color:#e0e6ed; }
.hidden-task-panel { background:linear-gradient(145deg,#f8fbff,#eef6ff); }
.stop-button { min-height:calc(84 * var(--rpx)); color:#fff; background:linear-gradient(135deg,#ff5c65,#d92d3a); border-radius:calc(18 * var(--rpx)); font-size:calc(27 * var(--rpx)); font-weight:900; box-shadow:0 calc(9 * var(--rpx)) calc(22 * var(--rpx)) rgba(204,40,54,.2); }

.utility-actions {
  grid-template-columns: repeat(3,minmax(0,1fr));
  grid-template-rows: calc(132 * var(--rpx));
  gap: calc(15 * var(--rpx));
  margin: calc(34 * var(--rpx)) 0 calc(25 * var(--rpx));
}
.utility-button,
.forgot-button,
.utility-actions .manager-dashboard-button {
  grid-column:auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  min-width:0;
  min-height:calc(132 * var(--rpx));
  height:calc(132 * var(--rpx));
  padding:calc(14 * var(--rpx)) calc(7 * var(--rpx)) calc(13 * var(--rpx));
  border-radius:calc(23 * var(--rpx));
  text-align:center;
  box-shadow:0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(34,69,111,.10), inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.85);
}
.forgot-button { color:#714800; background:linear-gradient(150deg,#fffdf5,#ffefc5); border-color:#efd27d; }
.unloading-button { color:#006d69; background:linear-gradient(150deg,#f7fffe,#dcf8f3); border-color:#9bdfd5; }
.utility-actions .manager-dashboard-button {
  color:#ffe8a8;
  background:linear-gradient(145deg,#222326,#070708 72%,#211807);
  border-color:#b98b2d;
  box-shadow:0 calc(12 * var(--rpx)) calc(26 * var(--rpx)) rgba(0,0,0,.23), inset 0 calc(1 * var(--rpx)) 0 rgba(255,239,184,.16);
}
.utility-icon { width:calc(48 * var(--rpx)); height:calc(48 * var(--rpx)); margin:0 0 calc(7 * var(--rpx)); }
.utility-icon img { width:calc(48 * var(--rpx)); height:calc(48 * var(--rpx)); }
.forgot-entry-icon { width:calc(48 * var(--rpx)); height:calc(48 * var(--rpx)); font-size:calc(31 * var(--rpx)); }
.utility-copy { width:100%; }
.utility-title,.manager-button-text { width:100%; max-height:calc(52 * var(--rpx)); font-size:calc(21 * var(--rpx)); line-height:1.17; text-align:center; }
.utility-subtitle { display:none; }
.utility-arrow { display:none; }
.crown-entry-icon .manager-crown { width:calc(66 * var(--rpx)); height:calc(66 * var(--rpx)); }
.staff-actions,.visitor-actions { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:calc(132 * var(--rpx)); }
.visitor-actions .unloading-button,.visitor-actions .manager-dashboard-button { grid-column:auto; }
.auto-login-footer { color:#94a0b1; }

@media (max-width:360px) {
  .page { padding-left:calc(22 * var(--rpx)); padding-right:calc(22 * var(--rpx)); }
  .task-panel { padding-left:calc(17 * var(--rpx)); padding-right:calc(17 * var(--rpx)); }
  .task-grid { gap:calc(11 * var(--rpx)); }
  .task-button { min-height:calc(164 * var(--rpx)); height:calc(164 * var(--rpx)); }
  .utility-actions { gap:calc(10 * var(--rpx)); }
  .utility-title,.manager-button-text { font-size:calc(18 * var(--rpx)); }
}

/* V1.4.0：卸柜职员入口、成长等级与更清晰的签到/任务进行态 */
.activity-level-badge {
  display:flex;
  align-items:center;
  gap:calc(3 * var(--rpx));
  min-width:0;
  padding:calc(3 * var(--rpx)) calc(8 * var(--rpx));
  border-radius:calc(999 * var(--rpx));
  color:#8a5a08;
  background:linear-gradient(135deg,rgba(255,249,220,.96),rgba(246,209,108,.5));
  box-shadow:inset 0 calc(2 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.9),0 calc(3 * var(--rpx)) calc(8 * var(--rpx)) rgba(153,102,18,.16);
  font-size:calc(19 * var(--rpx));
  font-weight:900;
  white-space:nowrap;
}
.activity-symbol { text-shadow:0 calc(1 * var(--rpx)) calc(2 * var(--rpx)) rgba(91,55,5,.2),0 0 calc(6 * var(--rpx)) rgba(255,216,81,.58); }
.activity-sun,.activity-crown { color:#d88c00; }
.activity-moon { color:#3976c8; text-shadow:0 0 calc(7 * var(--rpx)) rgba(80,151,255,.5); }
.activity-star { color:#eea600; }
.activity-level-number { color:#66410a; font-size:calc(17 * var(--rpx)); }

.unloading-staff-portal {
  display:grid;
  grid-template-columns:1fr;
  gap:calc(18 * var(--rpx));
  margin-top:calc(18 * var(--rpx));
  padding:calc(22 * var(--rpx));
  border-radius:calc(30 * var(--rpx));
  background:rgba(255,255,255,.87);
  box-shadow:0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(35,76,124,.15),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.98);
}
.unloading-portal-button {
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  height:calc(150 * var(--rpx));
  margin:0;
  padding:0 calc(36 * var(--rpx));
  border:0;
  border-radius:calc(25 * var(--rpx));
  font-size:calc(34 * var(--rpx));
  font-weight:950;
  letter-spacing:calc(1 * var(--rpx));
  box-shadow:inset 0 calc(7 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.75),inset calc(-8 * var(--rpx)) calc(-12 * var(--rpx)) calc(22 * var(--rpx)) rgba(34,80,107,.15),0 calc(12 * var(--rpx)) calc(25 * var(--rpx)) rgba(26,84,120,.17);
}
.unloading-portal-button::after { border:0; }
.unloading-portal-button img { position:absolute; left:calc(42 * var(--rpx)); z-index:3; width:calc(86 * var(--rpx)); height:calc(86 * var(--rpx)); }
.unloading-portal-button span { position:relative; z-index:3; }
.unloading-record-entry { color:#075f61; background:linear-gradient(145deg,#e9fffb,#afeedc 55%,#79cfbd); }
.hourly-work-entry { color:#744a05; background:linear-gradient(145deg,#fff9df,#ffe094 55%,#efbd56); }
.portal-static-light { position:absolute; left:-10%; top:-45%; width:62%; height:190%; transform:rotate(-22deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.82),transparent); filter:blur(calc(8 * var(--rpx))); }

.attendance-scan-button.crystal-attendance-button.clock-in {
  background:linear-gradient(145deg,#169d6f 0%,#087f59 48%,#04593f 100%) !important;
  box-shadow:inset 0 calc(7 * var(--rpx)) calc(6 * var(--rpx)) rgba(197,255,231,.42),inset calc(-8 * var(--rpx)) calc(-12 * var(--rpx)) calc(22 * var(--rpx)) rgba(0,43,29,.34),0 calc(13 * var(--rpx)) calc(27 * var(--rpx)) rgba(3,104,69,.31) !important;
}
.attendance-scan-button.crystal-attendance-button.clock-out,
.attendance-scan-card.clocked-in .attendance-scan-button.crystal-attendance-button {
  background:linear-gradient(145deg,#369bd0 0%,#177db6 48%,#075b91 100%) !important;
}
.attendance-scan-button.crystal-attendance-button {
  height:calc(82 * var(--rpx)) !important;
  min-height:calc(82 * var(--rpx)) !important;
}
.attendance-scan-button .glass-button-label {
  display:flex;
  align-items:center;
  justify-content:center;
  height:calc(66 * var(--rpx));
  line-height:calc(66 * var(--rpx));
  font-size:calc(42 * var(--rpx)) !important;
  font-weight:950;
  letter-spacing:calc(1 * var(--rpx));
  text-shadow:0 calc(4 * var(--rpx)) calc(7 * var(--rpx)) rgba(0,38,48,.55),0 calc(-2 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.45),0 0 calc(12 * var(--rpx)) rgba(255,255,255,.42);
}
.lang-en .attendance-scan-button .glass-button-label,
.lang-vi .attendance-scan-button .glass-button-label { font-size:calc(30 * var(--rpx)) !important; letter-spacing:0; }
.lang-es .attendance-scan-button .glass-button-label,
.lang-de .attendance-scan-button .glass-button-label,
.lang-ro .attendance-scan-button .glass-button-label,
.lang-bg .attendance-scan-button .glass-button-label,
.lang-tr .attendance-scan-button .glass-button-label { font-size:calc(25 * var(--rpx)) !important; letter-spacing:calc(-.5 * var(--rpx)); }

.task-button.current > .grid-crystal-fx::before {
  left:-85% !important;
  top:-70% !important;
  width:42% !important;
  height:240% !important;
  opacity:.92 !important;
  background:linear-gradient(90deg,transparent,rgba(235,255,247,.34) 25%,rgba(255,255,255,.97) 50%,rgba(190,255,226,.36) 75%,transparent) !important;
  filter:blur(calc(5 * var(--rpx))) !important;
  transform:rotate(-38deg) !important;
  animation:activeTaskDiagonalLight 3.8s ease-in-out infinite !important;
}
@keyframes activeTaskDiagonalLight {
  0%,18% { left:-85%; top:35%; opacity:0; }
  26% { opacity:.95; }
  70% { left:150%; top:-125%; opacity:.82; }
  82%,100% { left:150%; top:-125%; opacity:0; }
}

/* V1.3.2-R9 图标、无边框任务卡与独立快捷入口 */
.language-button-icon { display:flex; align-items:center; justify-content:center; width:calc(52 * var(--rpx)); height:calc(52 * var(--rpx)); }
.language-icon-image { width:calc(52 * var(--rpx)); height:calc(52 * var(--rpx)); filter:drop-shadow(0 calc(5 * var(--rpx)) calc(7 * var(--rpx)) rgba(19,79,163,.18)); }
.language-button-arrow {
  right:calc(5 * var(--rpx));
  bottom:calc(3 * var(--rpx));
  width:calc(22 * var(--rpx));
  height:calc(22 * var(--rpx));
  color:#0e3f88;
  background:transparent;
  border:0;
  font-size:calc(18 * var(--rpx));
  text-shadow:0 calc(1 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.9);
}
.profile-avatar-edit {
  right:calc(-3 * var(--rpx));
  bottom:calc(-3 * var(--rpx));
  width:calc(36 * var(--rpx));
  height:calc(36 * var(--rpx));
  padding:0;
  overflow:visible;
  background:transparent;
  border:calc(3 * var(--rpx)) solid #fff;
  box-shadow:0 calc(5 * var(--rpx)) calc(13 * var(--rpx)) rgba(20,79,159,.25);
}
.profile-avatar-edit img { width:calc(36 * var(--rpx)); height:calc(36 * var(--rpx)); border-radius:50%; }
.metric-icon {
  width:calc(40 * var(--rpx));
  height:calc(40 * var(--rpx));
  overflow:visible;
  background:transparent;
  border-radius:0;
}
.metric-icon-image { width:calc(40 * var(--rpx)); height:calc(40 * var(--rpx)); filter:drop-shadow(0 calc(5 * var(--rpx)) calc(7 * var(--rpx)) rgba(31,76,133,.14)); }
.notice-metric.has-notice .metric-icon { width:calc(40 * var(--rpx)); height:calc(40 * var(--rpx)); background:transparent; }
.notice-metric.has-notice .metric-icon-image { filter:drop-shadow(0 calc(5 * var(--rpx)) calc(7 * var(--rpx)) rgba(91,0,10,.24)); }

.task-button,
.sort-task-button {
  border:0 !important;
  box-shadow:0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(35,74,121,.10),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.94);
}
.task-button::before { display:none; }
.task-icon {
  width:calc(70 * var(--rpx));
  height:calc(70 * var(--rpx));
  margin-bottom:calc(9 * var(--rpx));
  filter:drop-shadow(0 calc(7 * var(--rpx)) calc(8 * var(--rpx)) rgba(27,67,118,.20)) saturate(1.08);
}
.task-button.disabled .task-icon,
.task-button[disabled] .task-icon { filter:drop-shadow(0 calc(5 * var(--rpx)) calc(6 * var(--rpx)) rgba(45,61,84,.12)) saturate(.62); opacity:.74; }
.task-button.disabled,.task-button[disabled] { border:0 !important; background:linear-gradient(150deg,#f7f9fc,#e9eef4); }
.task-button.current { border:0 !important; box-shadow:0 calc(15 * var(--rpx)) calc(33 * var(--rpx)) rgba(7,133,85,.28),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.22); }

.shortcut-zone {
  position:relative;
  margin:calc(46 * var(--rpx)) 0 calc(26 * var(--rpx));
  padding:calc(46 * var(--rpx)) calc(18 * var(--rpx)) calc(18 * var(--rpx));
  overflow:visible;
  background:rgba(255,255,255,.98);
  border-radius:calc(29 * var(--rpx));
  box-shadow:0 calc(18 * var(--rpx)) calc(44 * var(--rpx)) rgba(29,68,116,.11),inset 0 calc(1 * var(--rpx)) 0 #fff;
}
.shortcut-zone::before {
  content:"";
  position:absolute;
  left:calc(34 * var(--rpx));
  right:calc(34 * var(--rpx));
  top:calc(-22 * var(--rpx));
  height:calc(1 * var(--rpx));
  background:linear-gradient(90deg,transparent,rgba(78,121,176,.28),transparent);
}
.utility-actions {
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:calc(154 * var(--rpx));
  gap:calc(14 * var(--rpx));
  margin:0;
  overflow:visible;
}
.utility-button,
.forgot-button,
.utility-actions .manager-dashboard-button {
  min-height:calc(154 * var(--rpx));
  height:calc(154 * var(--rpx));
  padding:calc(18 * var(--rpx)) calc(8 * var(--rpx)) calc(16 * var(--rpx));
  overflow:visible;
  border:0 !important;
  border-radius:calc(23 * var(--rpx));
  box-shadow:0 calc(12 * var(--rpx)) calc(27 * var(--rpx)) rgba(38,72,113,.12),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.80);
}
.forgot-button { background:linear-gradient(150deg,#fffdf5,#ffefc4); }
.unloading-button { background:linear-gradient(150deg,#f6fffd,#d9f8f2); }
.utility-icon { width:calc(62 * var(--rpx)); height:calc(62 * var(--rpx)); margin:0 0 calc(9 * var(--rpx)); }
.utility-icon img { width:calc(62 * var(--rpx)); height:calc(62 * var(--rpx)); filter:drop-shadow(0 calc(7 * var(--rpx)) calc(8 * var(--rpx)) rgba(30,70,117,.18)); }
.forgot-entry-icon { background:transparent; border-radius:0; box-shadow:none; }
.forgot-entry-icon img { width:calc(62 * var(--rpx)); height:calc(62 * var(--rpx)); }
.utility-title,.manager-button-text {
  display:-webkit-box;
  width:100%;
  max-height:calc(57 * var(--rpx));
  color:inherit;
  font-size:calc(22 * var(--rpx));
  font-weight:950;
  line-height:1.2;
  text-align:center;
  overflow-wrap:anywhere;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.lang-zh .utility-title { font-size:calc(24 * var(--rpx)); }
.lang-de .utility-title,.lang-ro .utility-title,.lang-bg .utility-title,.lang-tr .utility-title { font-size:calc(18 * var(--rpx)); }
.utility-actions .manager-dashboard-button {
  position:relative;
  color:#ffe7a2;
  background:linear-gradient(145deg,#292A2D 0%,#070708 67%,#281B05 100%);
  box-shadow:0 calc(15 * var(--rpx)) calc(32 * var(--rpx)) rgba(0,0,0,.28),inset 0 calc(2 * var(--rpx)) 0 rgba(255,239,184,.19),inset 0 calc(-1 * var(--rpx)) 0 rgba(196,143,35,.32);
}
.manager-dashboard-button .utility-copy { margin-top:calc(64 * var(--rpx)); }
.crown-entry-icon {
  position:absolute;
  left:50%;
  top:calc(-46 * var(--rpx));
  z-index:4;
  width:calc(100 * var(--rpx));
  height:calc(100 * var(--rpx));
  margin:0;
  overflow:visible;
  transform:translateX(-50%);
}
.crown-entry-icon .manager-crown {
  width:calc(100 * var(--rpx));
  height:calc(100 * var(--rpx));
  transform:rotate(-17deg) scale(1.12);
  filter:drop-shadow(0 calc(9 * var(--rpx)) calc(8 * var(--rpx)) rgba(0,0,0,.38)) drop-shadow(0 0 calc(8 * var(--rpx)) rgba(255,207,80,.45));
  animation:crownRoyalFloat 2.6s ease-in-out infinite;
}
.crown-entry-icon::before,.crown-entry-icon::after {
  content:"✦";
  position:absolute;
  z-index:6;
  color:#fff5b5;
  font-size:calc(25 * var(--rpx));
  font-weight:900;
  text-shadow:0 0 calc(6 * var(--rpx)) #fff,0 0 calc(12 * var(--rpx)) #ffd95b,0 0 calc(20 * var(--rpx)) #e7a51c;
  animation:crownSpark 1.35s ease-in-out infinite alternate;
}
.crown-entry-icon::before { left:calc(-4 * var(--rpx)); top:calc(16 * var(--rpx)); }
.crown-entry-icon::after { right:calc(-6 * var(--rpx)); top:calc(2 * var(--rpx)); animation-delay:.55s; }
.manager-dashboard-button::before {
  content:"";
  position:absolute;
  left:calc(13 * var(--rpx));
  right:calc(13 * var(--rpx));
  top:calc(10 * var(--rpx));
  height:calc(42 * var(--rpx));
  background:linear-gradient(105deg,transparent 15%,rgba(255,237,170,.17) 43%,transparent 69%);
  border-radius:calc(18 * var(--rpx));
  animation:goldSweep 2.9s ease-in-out infinite;
  pointer-events:none;
}
.manager-dashboard-button::after { border:0; }
.staff-actions,.visitor-actions { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:calc(154 * var(--rpx)); }

@keyframes crownRoyalFloat {
  0%,100% { transform:rotate(-17deg) translateY(0) scale(1.12); }
  50% { transform:rotate(-14deg) translateY(calc(-5 * var(--rpx))) scale(1.16); }
}
@keyframes crownSpark { from { opacity:.25; transform:scale(.65) rotate(0); } to { opacity:1; transform:scale(1.18) rotate(35deg); } }
@keyframes goldSweep { 0%,35% { transform:translateX(-45%); opacity:0; } 55% { opacity:1; } 85%,100% { transform:translateX(45%); opacity:0; } }

@media (max-width:360px) {
  .shortcut-zone { padding-left:calc(12 * var(--rpx)); padding-right:calc(12 * var(--rpx)); }
  .utility-actions { gap:calc(10 * var(--rpx)); }
  .utility-button,.forgot-button,.utility-actions .manager-dashboard-button { min-height:calc(148 * var(--rpx)); height:calc(148 * var(--rpx)); padding-left:calc(5 * var(--rpx)); padding-right:calc(5 * var(--rpx)); }
  .utility-title,.manager-button-text,.lang-zh .utility-title { font-size:calc(19 * var(--rpx)); }
  .lang-de .utility-title,.lang-ro .utility-title,.lang-bg .utility-title,.lang-tr .utility-title { font-size:calc(16 * var(--rpx)); }
  .crown-entry-icon,.crown-entry-icon .manager-crown { width:calc(91 * var(--rpx)); height:calc(91 * var(--rpx)); }
}

/* V1.3.2 R10: production 3D icons and full-width vertical shortcut stack */
.task-icon {
  width:calc(78 * var(--rpx));
  height:calc(78 * var(--rpx));
  margin-bottom:calc(7 * var(--rpx));
  filter:drop-shadow(0 calc(9 * var(--rpx)) calc(10 * var(--rpx)) rgba(26,62,108,.20)) saturate(1.08) contrast(1.02);
}
.task-button.disabled .task-icon,
.task-button[disabled] .task-icon {
  opacity:.66;
  filter:drop-shadow(0 calc(7 * var(--rpx)) calc(8 * var(--rpx)) rgba(34,56,87,.15)) saturate(.88) contrast(.98);
}
.metric-icon-image {
  width:calc(46 * var(--rpx));
  height:calc(46 * var(--rpx));
  filter:drop-shadow(0 calc(7 * var(--rpx)) calc(8 * var(--rpx)) rgba(26,65,116,.20)) saturate(1.06);
}
.profile-avatar-edit img,
.language-icon-image { filter:drop-shadow(0 calc(6 * var(--rpx)) calc(7 * var(--rpx)) rgba(24,73,143,.20)); }

.shortcut-zone {
  margin:calc(50 * var(--rpx)) 0 calc(28 * var(--rpx));
  padding:calc(28 * var(--rpx)) calc(24 * var(--rpx)) calc(28 * var(--rpx));
  border-radius:calc(30 * var(--rpx));
  overflow:visible;
}
.utility-actions,
.staff-actions,
.visitor-actions {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:none;
  grid-auto-rows:calc(128 * var(--rpx));
  gap:calc(28 * var(--rpx));
  width:100%;
  margin:0;
  overflow:visible;
}
.utility-button,
.forgot-button,
.utility-actions .manager-dashboard-button,
.staff-actions .utility-button,
.visitor-actions .utility-button {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  grid-column:1;
  width:100%;
  min-width:0;
  min-height:calc(128 * var(--rpx));
  height:calc(128 * var(--rpx));
  margin:0;
  padding:calc(18 * var(--rpx)) calc(58 * var(--rpx)) calc(18 * var(--rpx)) calc(24 * var(--rpx));
  box-sizing:border-box;
  overflow:visible;
  border:0 !important;
  border-radius:calc(24 * var(--rpx));
}
.utility-icon {
  position:relative;
  width:calc(86 * var(--rpx));
  height:calc(86 * var(--rpx));
  margin:0 calc(22 * var(--rpx)) 0 0;
  flex:0 0 calc(86 * var(--rpx));
}
.utility-icon img,
.forgot-entry-icon img {
  width:calc(86 * var(--rpx));
  height:calc(86 * var(--rpx));
  filter:drop-shadow(0 calc(9 * var(--rpx)) calc(11 * var(--rpx)) rgba(25,66,112,.22)) saturate(1.08);
}
.utility-copy {
  min-width:0;
  margin:0;
  flex:1;
  text-align:left;
}
.utility-title,
.manager-button-text,
.lang-zh .utility-title {
  max-height:calc(68 * var(--rpx));
  font-size:calc(29 * var(--rpx));
  line-height:1.12;
  text-align:left;
  -webkit-line-clamp:2;
}
.lang-de .utility-title,
.lang-ro .utility-title,
.lang-bg .utility-title,
.lang-tr .utility-title { font-size:calc(24 * var(--rpx)); }
.utility-subtitle {
  margin-top:calc(6 * var(--rpx));
  font-size:calc(20 * var(--rpx));
  line-height:1.15;
  text-align:left;
}
.utility-arrow {
  right:calc(22 * var(--rpx));
  color:currentColor;
  opacity:.72;
}
.utility-actions .manager-dashboard-button {
  position:relative;
  margin-top:calc(10 * var(--rpx));
  padding-left:calc(154 * var(--rpx));
  color:#ffe6a0;
  background:linear-gradient(145deg,#2b2b2d 0%,#070708 62%,#261a04 100%);
  box-shadow:0 calc(18 * var(--rpx)) calc(36 * var(--rpx)) rgba(0,0,0,.30),inset 0 calc(2 * var(--rpx)) 0 rgba(255,239,184,.20),inset 0 calc(-1 * var(--rpx)) 0 rgba(196,143,35,.38);
}
.manager-dashboard-button .utility-copy { margin:0; }
.crown-entry-icon {
  position:absolute;
  left:calc(24 * var(--rpx));
  top:calc(-24 * var(--rpx));
  z-index:5;
  width:calc(118 * var(--rpx));
  height:calc(118 * var(--rpx));
  margin:0;
  overflow:visible;
  transform:none;
  flex:none;
}
.crown-entry-icon .manager-crown {
  width:calc(118 * var(--rpx));
  height:calc(118 * var(--rpx));
  transform:rotate(-17deg) scale(1.12);
  filter:drop-shadow(0 calc(10 * var(--rpx)) calc(9 * var(--rpx)) rgba(0,0,0,.42)) drop-shadow(0 0 calc(10 * var(--rpx)) rgba(255,207,80,.58));
  animation:crownRoyalFloat 2.6s ease-in-out infinite;
}
.crown-entry-icon::before { left:calc(-4 * var(--rpx)); top:calc(14 * var(--rpx)); }
.crown-entry-icon::after { right:calc(-8 * var(--rpx)); top:calc(-1 * var(--rpx)); }

@media (max-width:360px) {
  .shortcut-zone { padding:calc(24 * var(--rpx)) calc(18 * var(--rpx)); }
  .utility-actions,.staff-actions,.visitor-actions { grid-auto-rows:calc(122 * var(--rpx)); gap:calc(25 * var(--rpx)); }
  .utility-button,.forgot-button,.utility-actions .manager-dashboard-button {
    min-height:calc(122 * var(--rpx));
    height:calc(122 * var(--rpx));
    padding:calc(15 * var(--rpx)) calc(48 * var(--rpx)) calc(15 * var(--rpx)) calc(18 * var(--rpx));
  }
  .utility-icon,.utility-icon img,.forgot-entry-icon img { width:calc(78 * var(--rpx)); height:calc(78 * var(--rpx)); }
  .utility-icon { flex-basis:calc(78 * var(--rpx)); margin-right:calc(16 * var(--rpx)); }
  .utility-title,.manager-button-text,.lang-zh .utility-title { font-size:calc(26 * var(--rpx)); }
  .lang-de .utility-title,.lang-ro .utility-title,.lang-bg .utility-title,.lang-tr .utility-title { font-size:calc(21 * var(--rpx)); }
  .utility-subtitle { font-size:calc(17 * var(--rpx)); }
  .utility-actions .manager-dashboard-button { padding-left:calc(137 * var(--rpx)); }
  .crown-entry-icon,.crown-entry-icon .manager-crown { width:calc(106 * var(--rpx)); height:calc(106 * var(--rpx)); }
  .crown-entry-icon { left:calc(20 * var(--rpx)); top:calc(-20 * var(--rpx)); }
}

/* V1.3.2 R11: distinct task palettes, clean profile/language controls, equal shortcuts */
.profile-avatar-placeholder {
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  color:#ffffff;
  background:linear-gradient(145deg,#62a9ff,#126bd7);
  font-size:calc(48 * var(--rpx));
  font-weight:500;
  line-height:1;
  box-shadow:0 calc(9 * var(--rpx)) calc(24 * var(--rpx)) rgba(24,73,135,.18),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.40);
}
.language-button,
.compact-language-button {
  width:calc(66 * var(--rpx));
  height:calc(66 * var(--rpx));
  padding:0;
  background:transparent !important;
  border:0 !important;
  border-radius:0;
  box-shadow:none !important;
}
.language-button-icon {
  width:calc(64 * var(--rpx));
  height:calc(64 * var(--rpx));
}
.language-icon-image {
  width:calc(64 * var(--rpx));
  height:calc(64 * var(--rpx));
  filter:drop-shadow(0 calc(7 * var(--rpx)) calc(9 * var(--rpx)) rgba(25,80,158,.24)) saturate(1.08);
}
.language-button-arrow { display:none !important; }

.task-button,
.sort-task-button {
  position:relative;
  overflow:hidden;
  border:0 !important;
  box-shadow:0 calc(13 * var(--rpx)) calc(29 * var(--rpx)) rgba(38,73,116,.11),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.92);
}
.task-button::after,
.sort-task-button::after {
  content:"";
  position:absolute;
  left:calc(10 * var(--rpx));
  right:calc(10 * var(--rpx));
  top:calc(5 * var(--rpx));
  height:42%;
  border-radius:calc(20 * var(--rpx));
  background:linear-gradient(180deg,rgba(255,255,255,.50),rgba(255,255,255,0));
  pointer-events:none;
}
.task-button > div,
.task-button > img,
.sort-task-button > div,
.sort-task-button > img { position:relative; z-index:1; }
.task-button.task-tone-blue,.sort-task-button.task-tone-blue,.task-button.task-tone-blue.disabled { background:linear-gradient(150deg,#f8fbff,#d9eaff); }
.task-button.task-tone-green,.sort-task-button.task-tone-green,.task-button.task-tone-green.disabled { background:linear-gradient(150deg,#f7fffa,#d9f4e5); }
.task-button.task-tone-cyan,.sort-task-button.task-tone-cyan,.task-button.task-tone-cyan.disabled { background:linear-gradient(150deg,#f6fdff,#d7f1f8); }
.task-button.task-tone-purple,.sort-task-button.task-tone-purple,.task-button.task-tone-purple.disabled { background:linear-gradient(150deg,#fcf9ff,#eadcff); }
.task-button.task-tone-orange,.sort-task-button.task-tone-orange,.task-button.task-tone-orange.disabled { background:linear-gradient(150deg,#fffaf4,#ffe4c7); }
.task-button.task-tone-slate,.sort-task-button.task-tone-slate,.task-button.task-tone-slate.disabled { background:linear-gradient(150deg,#fbfcfe,#dfe8f2); }
.task-button.task-tone-red,.sort-task-button.task-tone-red,.task-button.task-tone-red.disabled { background:linear-gradient(150deg,#fff9f8,#ffdcd9); }
.task-button.task-tone-violet,.sort-task-button.task-tone-violet,.task-button.task-tone-violet.disabled { background:linear-gradient(150deg,#fbf8ff,#e6d8fa); }
.task-button.task-tone-royal,.sort-task-button.task-tone-royal,.task-button.task-tone-royal.disabled { background:linear-gradient(150deg,#f7faff,#d8e4ff); }
.task-button.task-tone-amber,.sort-task-button.task-tone-amber,.task-button.task-tone-amber.disabled { background:linear-gradient(150deg,#fffaf1,#ffe8bd); }
.task-button.task-tone-gold,.sort-task-button.task-tone-gold,.task-button.task-tone-gold.disabled { background:linear-gradient(150deg,#fffdf3,#ffedb7); }
.task-button.task-tone-emerald,.sort-task-button.task-tone-emerald,.task-button.task-tone-emerald.disabled { background:linear-gradient(150deg,#f5fffa,#d1f2e1); }
.task-button.task-tone-indigo,.sort-task-button.task-tone-indigo,.task-button.task-tone-indigo.disabled { background:linear-gradient(150deg,#f8f9ff,#dce1ff); }
.task-button.task-tone-rose,.sort-task-button.task-tone-rose,.task-button.task-tone-rose.disabled { background:linear-gradient(150deg,#fff8fb,#ffdce8); }
.task-button.task-tone-mint,.sort-task-button.task-tone-mint,.task-button.task-tone-mint.disabled { background:linear-gradient(150deg,#f7fff9,#d9f5df); }

.utility-actions,
.staff-actions,
.visitor-actions {
  display:flex !important;
  flex-direction:column;
  align-items:stretch !important;
  justify-content:flex-start;
  gap:calc(30 * var(--rpx));
  width:100%;
  margin:0;
  overflow:visible;
}
.utility-actions > .utility-button,
.staff-actions > .utility-button,
.visitor-actions > .utility-button,
.utility-actions > .forgot-button,
.utility-actions > .manager-dashboard-button {
  display:flex;
  flex:0 0 calc(142 * var(--rpx));
  flex-direction:column;
  align-self:stretch !important;
  align-items:center;
  justify-content:center;
  width:auto !important;
  min-width:100% !important;
  max-width:none !important;
  min-height:calc(142 * var(--rpx));
  height:calc(142 * var(--rpx));
  max-height:calc(142 * var(--rpx));
  margin:0 !important;
  padding:calc(12 * var(--rpx)) calc(26 * var(--rpx)) !important;
  box-sizing:border-box;
  text-align:center;
}
.utility-actions .utility-icon {
  width:calc(70 * var(--rpx));
  height:calc(70 * var(--rpx));
  margin:0 0 calc(3 * var(--rpx));
  flex:0 0 calc(70 * var(--rpx));
}
.utility-actions .utility-icon img,
.utility-actions .forgot-entry-icon img {
  width:calc(70 * var(--rpx));
  height:calc(70 * var(--rpx));
}
.utility-actions .utility-copy,
.utility-actions .manager-dashboard-button .utility-copy {
  width:100%;
  min-width:0;
  margin:0;
  flex:0 0 auto;
  text-align:center;
}
.utility-actions .utility-title,
.utility-actions .manager-button-text,
.lang-zh .utility-actions .utility-title {
  width:100%;
  max-height:calc(40 * var(--rpx));
  font-size:calc(29 * var(--rpx));
  line-height:1.15;
  text-align:center;
  -webkit-line-clamp:1;
}
.lang-de .utility-actions .utility-title,
.lang-ro .utility-actions .utility-title,
.lang-bg .utility-actions .utility-title,
.lang-tr .utility-actions .utility-title { font-size:calc(23 * var(--rpx)); }
.utility-actions .utility-subtitle,
.utility-actions .utility-arrow { display:none !important; }

/* V1.4.1：卸柜双入口等宽、名片标签放大、进行中任务光点沿边缘巡航 */
.unloading-staff-portal { width:100%; box-sizing:border-box; padding:0; background:transparent; box-shadow:none; }
.unloading-portal-button { width:100%; box-sizing:border-box; }
.profile-role { padding:calc(8 * var(--rpx)) calc(15 * var(--rpx)); font-size:calc(24 * var(--rpx)) !important; line-height:1.15; }
.activity-level-badge { padding:calc(6 * var(--rpx)) calc(11 * var(--rpx)); font-size:calc(23 * var(--rpx)); }
.activity-level-number { font-size:calc(21 * var(--rpx)); }
.task-button.current > .grid-crystal-fx::before { left:-23% !important; top:-32% !important; width:69% !important; height:176% !important; opacity:.74 !important; transform:rotate(-20deg) !important; animation:none !important; }
.task-button.current .grid-crystal-orbit { display:block !important; position:absolute !important; z-index:9 !important; inset:calc(5 * var(--rpx)) !important; border-radius:0 !important; animation:none !important; pointer-events:none; }
.task-button.current .grid-crystal-orbit::before { content:""; position:absolute; left:0; top:0; width:calc(13 * var(--rpx)); height:calc(13 * var(--rpx)); border-radius:50%; background:#fff !important; filter:none !important; box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),calc(-10 * var(--rpx)) 0 calc(12 * var(--rpx)) rgba(187,255,230,.58),calc(-23 * var(--rpx)) 0 calc(18 * var(--rpx)) rgba(108,255,198,.28); animation:activeTaskEdgeOrbit 4.8s linear infinite !important; }
@keyframes activeTaskEdgeOrbit {
  0% { left:0; top:0; box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),0 calc(13 * var(--rpx)) calc(13 * var(--rpx)) rgba(187,255,230,.56),0 calc(28 * var(--rpx)) calc(21 * var(--rpx)) rgba(108,255,198,.26); }
  24% { left:calc(100% - calc(13 * var(--rpx))); top:0; box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),calc(-12 * var(--rpx)) 0 calc(13 * var(--rpx)) rgba(187,255,230,.56),calc(-28 * var(--rpx)) 0 calc(21 * var(--rpx)) rgba(108,255,198,.26); }
  49% { left:calc(100% - calc(13 * var(--rpx))); top:calc(100% - calc(13 * var(--rpx))); box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),0 calc(-12 * var(--rpx)) calc(13 * var(--rpx)) rgba(187,255,230,.56),0 calc(-28 * var(--rpx)) calc(21 * var(--rpx)) rgba(108,255,198,.26); }
  74% { left:0; top:calc(100% - calc(13 * var(--rpx))); box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),calc(12 * var(--rpx)) 0 calc(13 * var(--rpx)) rgba(187,255,230,.56),calc(28 * var(--rpx)) 0 calc(21 * var(--rpx)) rgba(108,255,198,.26); }
  100% { left:0; top:0; box-shadow:0 0 calc(7 * var(--rpx)) calc(3 * var(--rpx)) rgba(226,255,246,.98),0 0 calc(18 * var(--rpx)) calc(8 * var(--rpx)) rgba(93,255,193,.78),0 calc(13 * var(--rpx)) calc(13 * var(--rpx)) rgba(187,255,230,.56),0 calc(28 * var(--rpx)) calc(21 * var(--rpx)) rgba(108,255,198,.26); }
}
.utility-actions .manager-dashboard-button {
  position:relative;
  padding:calc(12 * var(--rpx)) calc(26 * var(--rpx)) !important;
}
.utility-actions .manager-dashboard-button .crown-entry-icon {
  position:absolute;
  left:calc(24 * var(--rpx));
  top:calc(-24 * var(--rpx));
  width:calc(118 * var(--rpx));
  height:calc(118 * var(--rpx));
  margin:0;
  flex:none;
}

@media (max-width:360px) {
  .utility-actions,.staff-actions,.visitor-actions { gap:calc(26 * var(--rpx)); }
  .utility-actions > .utility-button,
  .staff-actions > .utility-button,
  .visitor-actions > .utility-button,
  .utility-actions > .forgot-button,
  .utility-actions > .manager-dashboard-button {
    flex-basis:calc(136 * var(--rpx));
    min-height:calc(136 * var(--rpx));
    height:calc(136 * var(--rpx));
    max-height:calc(136 * var(--rpx));
  }
  .utility-actions .utility-title,.utility-actions .manager-button-text,.lang-zh .utility-actions .utility-title { font-size:calc(27 * var(--rpx)); }
  .lang-de .utility-actions .utility-title,.lang-ro .utility-actions .utility-title,.lang-bg .utility-actions .utility-title,.lang-tr .utility-actions .utility-title { font-size:calc(21 * var(--rpx)); }
}

/* V1.3.2 R14: 签到补签与卸柜记录使用皇家立体悬浮图标，移除皇冠横向扫光 */
.utility-actions .forgot-button,
.utility-actions .unloading-button { position:relative; overflow:visible !important; }
.utility-actions .forgot-entry-icon,
.utility-actions .unloading-entry-icon {
  position:absolute;
  z-index:6;
  left:calc(22 * var(--rpx));
  top:calc(-22 * var(--rpx));
  width:calc(112 * var(--rpx));
  height:calc(112 * var(--rpx));
  margin:0;
  overflow:visible;
  flex:none;
}
.utility-actions .forgot-entry-icon img,
.utility-actions .unloading-entry-icon img {
  width:calc(112 * var(--rpx));
  height:calc(112 * var(--rpx));
  transform:rotate(-8deg) scale(1.04);
  filter:drop-shadow(0 calc(11 * var(--rpx)) calc(10 * var(--rpx)) rgba(80,56,4,.27)) drop-shadow(0 0 calc(10 * var(--rpx)) rgba(255,205,61,.34)) saturate(1.17) contrast(1.05);
  animation:shortcutRoyalFloat 2.7s ease-in-out infinite;
}
.utility-actions .unloading-entry-icon img {
  transform:rotate(-5deg) scale(1.03);
  filter:drop-shadow(0 calc(11 * var(--rpx)) calc(10 * var(--rpx)) rgba(0,80,65,.24)) drop-shadow(0 0 calc(10 * var(--rpx)) rgba(54,224,187,.30)) saturate(1.16) contrast(1.04);
  animation-delay:.38s;
}
.utility-actions .forgot-entry-icon::before,
.utility-actions .forgot-entry-icon::after,
.utility-actions .unloading-entry-icon::before,
.utility-actions .unloading-entry-icon::after {
  content:"✦";
  position:absolute;
  z-index:8;
  color:#fff7c7;
  font-size:calc(23 * var(--rpx));
  font-weight:900;
  text-shadow:0 0 calc(6 * var(--rpx)) #fff,0 0 calc(12 * var(--rpx)) #ffd550,0 0 calc(19 * var(--rpx)) #e89b11;
  animation:crownSpark 1.35s ease-in-out infinite alternate;
}
.utility-actions .unloading-entry-icon::before,
.utility-actions .unloading-entry-icon::after { color:#dffff7; text-shadow:0 0 calc(6 * var(--rpx)) #fff,0 0 calc(12 * var(--rpx)) #50e4c3,0 0 calc(19 * var(--rpx)) #0da98b; }
.utility-actions .forgot-entry-icon::before,
.utility-actions .unloading-entry-icon::before { left:0; top:calc(16 * var(--rpx)); }
.utility-actions .forgot-entry-icon::after,
.utility-actions .unloading-entry-icon::after { right:calc(-4 * var(--rpx)); top:calc(-2 * var(--rpx)); animation-delay:.55s; }
.utility-actions .manager-dashboard-button::before {
  display:none !important;
  content:none !important;
  animation:none !important;
}
@keyframes shortcutRoyalFloat {
  0%,100% { transform:rotate(-8deg) translateY(0) scale(1.04); }
  50% { transform:rotate(-5deg) translateY(calc(-6 * var(--rpx))) scale(1.09); }
}
@media (max-width:360px) {
  .utility-actions .forgot-entry-icon,
  .utility-actions .unloading-entry-icon,
  .utility-actions .forgot-entry-icon img,
  .utility-actions .unloading-entry-icon img { width:calc(101 * var(--rpx)); height:calc(101 * var(--rpx)); }
  .utility-actions .forgot-entry-icon,
  .utility-actions .unloading-entry-icon { left:calc(18 * var(--rpx)); top:calc(-18 * var(--rpx)); }
}

/* V1.3.2 R20: approved borderless icon grid shared by all eight languages */
.task-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:calc(176 * var(--rpx));
  column-gap:calc(4 * var(--rpx));
  row-gap:calc(12 * var(--rpx));
}
.task-button,
.sort-task-button,
.task-button.task-tone-blue,.sort-task-button.task-tone-blue,.task-button.task-tone-blue.disabled,
.task-button.task-tone-green,.sort-task-button.task-tone-green,.task-button.task-tone-green.disabled,
.task-button.task-tone-cyan,.sort-task-button.task-tone-cyan,.task-button.task-tone-cyan.disabled,
.task-button.task-tone-purple,.sort-task-button.task-tone-purple,.task-button.task-tone-purple.disabled,
.task-button.task-tone-orange,.sort-task-button.task-tone-orange,.task-button.task-tone-orange.disabled,
.task-button.task-tone-slate,.sort-task-button.task-tone-slate,.task-button.task-tone-slate.disabled,
.task-button.task-tone-red,.sort-task-button.task-tone-red,.task-button.task-tone-red.disabled,
.task-button.task-tone-violet,.sort-task-button.task-tone-violet,.task-button.task-tone-violet.disabled,
.task-button.task-tone-royal,.sort-task-button.task-tone-royal,.task-button.task-tone-royal.disabled,
.task-button.task-tone-amber,.sort-task-button.task-tone-amber,.task-button.task-tone-amber.disabled,
.task-button.task-tone-gold,.sort-task-button.task-tone-gold,.task-button.task-tone-gold.disabled,
.task-button.task-tone-emerald,.sort-task-button.task-tone-emerald,.task-button.task-tone-emerald.disabled,
.task-button.task-tone-indigo,.sort-task-button.task-tone-indigo,.task-button.task-tone-indigo.disabled,
.task-button.task-tone-rose,.sort-task-button.task-tone-rose,.task-button.task-tone-rose.disabled,
.task-button.task-tone-mint,.sort-task-button.task-tone-mint,.task-button.task-tone-mint.disabled {
  min-height:calc(176 * var(--rpx));
  height:calc(176 * var(--rpx));
  padding:calc(13 * var(--rpx)) calc(5 * var(--rpx)) calc(9 * var(--rpx));
  overflow:visible;
  color:#1c2b43;
  background:transparent !important;
  border:0 !important;
  border-radius:0;
  box-shadow:none !important;
}
.task-button::before,
.task-button::after,
.sort-task-button::before,
.sort-task-button::after { display:none !important; content:none !important; }
.task-icon,
.task-button.current .task-icon {
  width:calc(92 * var(--rpx));
  height:calc(92 * var(--rpx));
  margin-bottom:calc(8 * var(--rpx));
  padding:0;
  background:transparent;
  border-radius:0;
  filter:drop-shadow(0 calc(9 * var(--rpx)) calc(10 * var(--rpx)) rgba(29,66,115,.20)) saturate(1.08);
}
.task-button.current {
  color:#087d53;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.task-button.current .task-label { color:#087d53; text-shadow:0 0 calc(14 * var(--rpx)) rgba(20,177,117,.20); }
.task-button.disabled,
.task-button[disabled] {
  color:#7f8997;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.task-button.disabled .task-icon,
.task-button[disabled] .task-icon { filter:drop-shadow(0 calc(7 * var(--rpx)) calc(8 * var(--rpx)) rgba(45,61,84,.12)) saturate(.70); opacity:.78; }
.task-label {
  max-height:calc(60 * var(--rpx));
  font-size:calc(25 * var(--rpx));
  line-height:1.18;
  -webkit-line-clamp:2;
}
.lang-zh .task-label { font-size:calc(29 * var(--rpx)); }
.lang-en .task-label { font-size:calc(23 * var(--rpx)); }
.lang-vi .task-label { font-size:calc(22 * var(--rpx)); }
.lang-es .task-label,
.lang-de .task-label,
.lang-ro .task-label,
.lang-bg .task-label,
.lang-tr .task-label { font-size:calc(20 * var(--rpx)); }
.sort-task-button.dragging {
  background:rgba(238,246,255,.88) !important;
  border-radius:calc(20 * var(--rpx));
  box-shadow:0 calc(18 * var(--rpx)) calc(38 * var(--rpx)) rgba(20,104,214,.20) !important;
}
.sort-task-button.drag-over { outline:calc(3 * var(--rpx)) solid rgba(43,136,244,.28); outline-offset:calc(-3 * var(--rpx)); border-radius:calc(20 * var(--rpx)); }
.task-hide-control {
  left:calc(2 * var(--rpx));
  top:calc(2 * var(--rpx));
  width:calc(46 * var(--rpx));
  height:calc(46 * var(--rpx));
  z-index:15;
}

@media (max-width:360px) {
  .task-grid { grid-auto-rows:calc(168 * var(--rpx)); column-gap:0; row-gap:calc(8 * var(--rpx)); }
  .task-button,.sort-task-button { min-height:calc(168 * var(--rpx)); height:calc(168 * var(--rpx)); }
  .task-icon,.task-button.current .task-icon { width:calc(84 * var(--rpx)); height:calc(84 * var(--rpx)); }
  .lang-zh .task-label { font-size:calc(27 * var(--rpx)); }
  .lang-en .task-label,.lang-vi .task-label { font-size:calc(20 * var(--rpx)); }
  .lang-es .task-label,.lang-de .task-label,.lang-ro .task-label,.lang-bg .task-label,.lang-tr .task-label { font-size:calc(18 * var(--rpx)); }
}

/* V1.3.2 R21: approved satin-light raised buttons */
.task-grid {
  grid-auto-rows:calc(190 * var(--rpx));
  gap:calc(14 * var(--rpx));
}
.task-button,
.sort-task-button,
.task-button.task-tone-blue,.sort-task-button.task-tone-blue,.task-button.task-tone-blue.disabled,
.task-button.task-tone-green,.sort-task-button.task-tone-green,.task-button.task-tone-green.disabled,
.task-button.task-tone-cyan,.sort-task-button.task-tone-cyan,.task-button.task-tone-cyan.disabled,
.task-button.task-tone-purple,.sort-task-button.task-tone-purple,.task-button.task-tone-purple.disabled,
.task-button.task-tone-orange,.sort-task-button.task-tone-orange,.task-button.task-tone-orange.disabled,
.task-button.task-tone-slate,.sort-task-button.task-tone-slate,.task-button.task-tone-slate.disabled,
.task-button.task-tone-red,.sort-task-button.task-tone-red,.task-button.task-tone-red.disabled,
.task-button.task-tone-violet,.sort-task-button.task-tone-violet,.task-button.task-tone-violet.disabled,
.task-button.task-tone-royal,.sort-task-button.task-tone-royal,.task-button.task-tone-royal.disabled,
.task-button.task-tone-amber,.sort-task-button.task-tone-amber,.task-button.task-tone-amber.disabled,
.task-button.task-tone-gold,.sort-task-button.task-tone-gold,.task-button.task-tone-gold.disabled,
.task-button.task-tone-emerald,.sort-task-button.task-tone-emerald,.task-button.task-tone-emerald.disabled,
.task-button.task-tone-indigo,.sort-task-button.task-tone-indigo,.task-button.task-tone-indigo.disabled,
.task-button.task-tone-rose,.sort-task-button.task-tone-rose,.task-button.task-tone-rose.disabled,
.task-button.task-tone-mint,.sort-task-button.task-tone-mint,.task-button.task-tone-mint.disabled {
  min-height:calc(190 * var(--rpx));
  height:calc(190 * var(--rpx));
  padding:calc(14 * var(--rpx)) calc(5 * var(--rpx)) calc(12 * var(--rpx));
  overflow:hidden;
  background:linear-gradient(145deg,#ffffff 0%,#fdfefe 42%,#f3f7fc 100%) !important;
  border:calc(1 * var(--rpx)) solid rgba(190,207,226,.42) !important;
  border-radius:calc(22 * var(--rpx));
  box-shadow:
    inset calc(3 * var(--rpx)) calc(3 * var(--rpx)) calc(4 * var(--rpx)) rgba(255,255,255,.98),
    inset calc(-3 * var(--rpx)) calc(-4 * var(--rpx)) calc(7 * var(--rpx)) rgba(155,178,205,.18),
    0 calc(11 * var(--rpx)) calc(20 * var(--rpx)) rgba(49,78,116,.16),
    0 calc(3 * var(--rpx)) calc(6 * var(--rpx)) rgba(54,84,121,.10) !important;
}
.task-button::before,
.sort-task-button::before {
  content:"" !important;
  position:absolute;
  inset:calc(1 * var(--rpx));
  z-index:0;
  display:block !important;
  height:auto;
  border-radius:calc(21 * var(--rpx));
  background:
    radial-gradient(circle at 13% 4%,rgba(255,255,255,.99) 0%,rgba(255,255,255,.76) 24%,rgba(255,255,255,0) 58%),
    linear-gradient(145deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.57) 37%,rgba(218,237,255,.19) 53%,rgba(255,255,255,0) 72%);
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.96),inset calc(3 * var(--rpx)) 0 calc(4 * var(--rpx)) rgba(255,255,255,.74);
  pointer-events:none;
}
.task-button::after,
.sort-task-button::after {
  content:"" !important;
  position:absolute;
  left:calc(12 * var(--rpx));
  right:24%;
  top:calc(7 * var(--rpx));
  z-index:0;
  display:block !important;
  height:42%;
  border-radius:calc(18 * var(--rpx)) calc(30 * var(--rpx)) calc(48 * var(--rpx)) calc(18 * var(--rpx));
  background:linear-gradient(155deg,rgba(255,255,255,.85),rgba(228,242,255,.22) 58%,rgba(255,255,255,0));
  opacity:.92;
  pointer-events:none;
}
.task-button > div,
.task-button > img,
.sort-task-button > div,
.sort-task-button > img { position:relative; z-index:2; }
.task-button:active,
.task-button-hover {
  transform:translateY(calc(3 * var(--rpx))) scale(.985);
  box-shadow:
    inset calc(4 * var(--rpx)) calc(5 * var(--rpx)) calc(9 * var(--rpx)) rgba(139,163,190,.19),
    inset calc(-2 * var(--rpx)) calc(-2 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.92),
    0 calc(5 * var(--rpx)) calc(9 * var(--rpx)) rgba(49,78,116,.12) !important;
}
.task-button.current,
.task-button.disabled,
.task-button[disabled] {
  background:linear-gradient(145deg,#ffffff 0%,#fdfefe 42%,#f3f7fc 100%) !important;
  border-color:rgba(190,207,226,.42) !important;
  box-shadow:
    inset calc(3 * var(--rpx)) calc(3 * var(--rpx)) calc(4 * var(--rpx)) rgba(255,255,255,.98),
    inset calc(-3 * var(--rpx)) calc(-4 * var(--rpx)) calc(7 * var(--rpx)) rgba(155,178,205,.18),
    0 calc(11 * var(--rpx)) calc(20 * var(--rpx)) rgba(49,78,116,.16),
    0 calc(3 * var(--rpx)) calc(6 * var(--rpx)) rgba(54,84,121,.10) !important;
}
.sort-task-button.dragging {
  background:linear-gradient(145deg,#ffffff,#edf6ff) !important;
  box-shadow:0 calc(19 * var(--rpx)) calc(40 * var(--rpx)) rgba(20,104,214,.24),inset calc(3 * var(--rpx)) calc(3 * var(--rpx)) calc(5 * var(--rpx)) #fff !important;
}

@media (max-width:360px) {
  .task-grid { grid-auto-rows:calc(180 * var(--rpx)); gap:calc(10 * var(--rpx)); }
  .task-button,.sort-task-button { min-height:calc(180 * var(--rpx)); height:calc(180 * var(--rpx)); border-radius:calc(20 * var(--rpx)); }
  .task-button::before,.sort-task-button::before { border-radius:calc(19 * var(--rpx)); }
}

/* V1.3.2 R22: left-aligned royal shortcuts, gold notice bell and clock-out reminder */
.utility-actions > .utility-button,
.staff-actions > .utility-button,
.visitor-actions > .utility-button,
.utility-actions > .forgot-button,
.utility-actions > .manager-dashboard-button {
  position:relative;
  flex-basis:calc(142 * var(--rpx));
  min-height:calc(142 * var(--rpx));
  height:calc(142 * var(--rpx));
  max-height:calc(142 * var(--rpx));
  padding:calc(12 * var(--rpx)) calc(26 * var(--rpx)) !important;
  overflow:visible !important;
}
.utility-actions .forgot-entry-icon,
.utility-actions .unloading-entry-icon,
.utility-actions .manager-dashboard-button .crown-entry-icon {
  position:absolute;
  left:calc(14 * var(--rpx));
  top:50%;
  z-index:8;
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
  margin:0;
  transform:translateY(-50%);
  overflow:visible;
  flex:none;
}
.utility-actions .forgot-entry-icon img,
.utility-actions .unloading-entry-icon img,
.utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
}
.utility-actions .manager-dashboard-button .crown-entry-icon {
  left:calc(9 * var(--rpx));
  width:calc(134 * var(--rpx));
  height:calc(134 * var(--rpx));
}
.utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
  width:calc(134 * var(--rpx));
  height:calc(134 * var(--rpx));
}
.utility-actions .utility-copy,
.utility-actions .manager-dashboard-button .utility-copy {
  position:absolute;
  left:calc(145 * var(--rpx));
  right:calc(26 * var(--rpx));
  top:50%;
  width:auto;
  min-width:0;
  transform:translateY(-50%);
  text-align:center;
}
.utility-actions .utility-title,
.utility-actions .manager-button-text,
.lang-zh .utility-actions .utility-title {
  display:-webkit-box;
  width:100%;
  max-height:calc(82 * var(--rpx));
  overflow:hidden;
  color:#654400;
  font-family:"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:calc(35 * var(--rpx));
  font-weight:950;
  line-height:1.18;
  letter-spacing:calc(1.4 * var(--rpx));
  text-align:center;
  text-shadow:0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.92),0 calc(5 * var(--rpx)) calc(10 * var(--rpx)) rgba(135,91,0,.22),0 0 calc(8 * var(--rpx)) rgba(255,211,88,.18);
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.utility-actions .unloading-button .utility-title {
  color:#006d67;
  text-shadow:0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.94),0 calc(5 * var(--rpx)) calc(10 * var(--rpx)) rgba(0,105,97,.20),0 0 calc(8 * var(--rpx)) rgba(62,225,202,.18);
}
.utility-actions .manager-dashboard-button .manager-button-text {
  color:#ffe59a;
  text-shadow:0 calc(2 * var(--rpx)) 0 rgba(255,250,216,.30),0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) rgba(68,38,0,.82),0 0 calc(10 * var(--rpx)) rgba(255,196,45,.42);
}
.lang-en .utility-actions .utility-title,
.lang-vi .utility-actions .utility-title { font-size:calc(29 * var(--rpx)); letter-spacing:calc(.6 * var(--rpx)); }
.lang-es .utility-actions .utility-title,
.lang-de .utility-actions .utility-title,
.lang-ro .utility-actions .utility-title,
.lang-bg .utility-actions .utility-title,
.lang-tr .utility-actions .utility-title { font-size:calc(25 * var(--rpx)); letter-spacing:calc(.2 * var(--rpx)); }

.metric-gold {
  color:#b87a00;
  background:linear-gradient(145deg,#fff9dc,#ffe7a0);
  box-shadow:inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.96),0 calc(5 * var(--rpx)) calc(10 * var(--rpx)) rgba(184,122,0,.12);
}
.notice-metric .metric-icon-image,
.notice-metric.has-notice .metric-icon-image {
  filter:grayscale(1) sepia(1) saturate(7) hue-rotate(354deg) brightness(1.10) contrast(1.04) drop-shadow(0 calc(5 * var(--rpx)) calc(7 * var(--rpx)) rgba(137,87,0,.27));
}

.attendance-scan-card.clocked-in { min-height:calc(128 * var(--rpx)); }
.clock-out-reminder-bubble {
  display:inline-flex;
  align-items:center;
  gap:calc(7 * var(--rpx));
  max-width:100%;
  min-height:calc(34 * var(--rpx));
  margin-top:calc(9 * var(--rpx));
  padding:calc(4 * var(--rpx)) calc(12 * var(--rpx)) calc(4 * var(--rpx)) calc(6 * var(--rpx));
  box-sizing:border-box;
  overflow:hidden;
  color:#8a5a00;
  background:linear-gradient(145deg,#fffbe8,#ffefb6);
  border:calc(1 * var(--rpx)) solid rgba(225,172,43,.46);
  border-radius:calc(999 * var(--rpx));
  box-shadow:inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.96),0 calc(5 * var(--rpx)) calc(12 * var(--rpx)) rgba(167,111,0,.10);
  font-size:calc(18 * var(--rpx));
  font-weight:850;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clock-out-reminder-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  width:calc(24 * var(--rpx));
  height:calc(24 * var(--rpx));
  flex:0 0 calc(24 * var(--rpx));
  color:#ffffff;
  background:linear-gradient(145deg,#f2b31e,#c98200);
  border-radius:50%;
  box-shadow:0 calc(3 * var(--rpx)) calc(7 * var(--rpx)) rgba(150,92,0,.20);
  font-size:calc(17 * var(--rpx));
  font-weight:950;
  line-height:1;
}

@media (max-width:360px) {
  .utility-actions > .utility-button,
  .staff-actions > .utility-button,
  .visitor-actions > .utility-button,
  .utility-actions > .forgot-button,
  .utility-actions > .manager-dashboard-button {
    flex-basis:calc(136 * var(--rpx));
    min-height:calc(136 * var(--rpx));
    height:calc(136 * var(--rpx));
    max-height:calc(136 * var(--rpx));
  }
  .utility-actions .forgot-entry-icon,
  .utility-actions .unloading-entry-icon { left:calc(11 * var(--rpx)); width:calc(114 * var(--rpx)); height:calc(114 * var(--rpx)); }
  .utility-actions .forgot-entry-icon img,
  .utility-actions .unloading-entry-icon img { width:calc(114 * var(--rpx)); height:calc(114 * var(--rpx)); }
  .utility-actions .manager-dashboard-button .crown-entry-icon { left:calc(7 * var(--rpx)); width:calc(121 * var(--rpx)); height:calc(121 * var(--rpx)); }
  .utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown { width:calc(121 * var(--rpx)); height:calc(121 * var(--rpx)); }
  .utility-actions .utility-copy,
  .utility-actions .manager-dashboard-button .utility-copy { left:calc(130 * var(--rpx)); right:calc(18 * var(--rpx)); }
  .utility-actions .utility-title,
  .utility-actions .manager-button-text,
  .lang-zh .utility-actions .utility-title { font-size:calc(31 * var(--rpx)); }
  .lang-en .utility-actions .utility-title,
  .lang-vi .utility-actions .utility-title { font-size:calc(25 * var(--rpx)); }
  .lang-es .utility-actions .utility-title,
  .lang-de .utility-actions .utility-title,
  .lang-ro .utility-actions .utility-title,
  .lang-bg .utility-actions .utility-title,
  .lang-tr .utility-actions .utility-title { font-size:calc(22 * var(--rpx)); }
  .clock-out-reminder-bubble { font-size:calc(16 * var(--rpx)); }
}

/* V1.3.3: equal shortcut icons, on-demand location and equal home modules */
.utility-actions .forgot-entry-icon,
.utility-actions .unloading-entry-icon,
.utility-actions .manager-dashboard-button .crown-entry-icon {
  left:calc(14 * var(--rpx));
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
}
.utility-actions .forgot-entry-icon img,
.utility-actions .unloading-entry-icon img,
.utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
}
.utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
  animation:crownEqualFloat 2.6s ease-in-out infinite;
}
.utility-actions .utility-copy,
.utility-actions .manager-dashboard-button .utility-copy {
  left:calc(145 * var(--rpx));
  right:calc(26 * var(--rpx));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.utility-actions .utility-title,
.utility-actions .manager-button-text {
  margin:0 auto;
  text-align:center;
}
@keyframes crownEqualFloat {
  0%,100% { transform:rotate(-17deg) translateY(0) scale(1.04); }
  50% { transform:rotate(-14deg) translateY(calc(-5 * var(--rpx))) scale(1.09); }
}
.location-strip.location-active {
  animation:locationHintIn .18s ease-out both;
}
.location-strip.location-active .location-dot {
  animation:locationDotPulse 1.05s ease-in-out infinite;
}
@keyframes locationHintIn {
  from { opacity:0; transform:translateY(calc(-5 * var(--rpx))); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes locationDotPulse {
  0%,100% { opacity:.45; transform:scale(.76); }
  50% { opacity:1; transform:scale(1.16); }
}
.profile-status-card,
.attendance-scan-card,
.attendance-scan-card.clocked-in,
.home-overview {
  min-height:calc(190 * var(--rpx));
  height:calc(190 * var(--rpx));
  box-sizing:border-box;
}
.home-overview { align-items:center; }

@media (max-width:360px) {
  .utility-actions .forgot-entry-icon,
  .utility-actions .unloading-entry-icon,
  .utility-actions .manager-dashboard-button .crown-entry-icon {
    left:calc(11 * var(--rpx));
    width:calc(114 * var(--rpx));
    height:calc(114 * var(--rpx));
  }
  .utility-actions .forgot-entry-icon img,
  .utility-actions .unloading-entry-icon img,
  .utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
    width:calc(114 * var(--rpx));
    height:calc(114 * var(--rpx));
  }
  .utility-actions .utility-copy,
  .utility-actions .manager-dashboard-button .utility-copy { left:calc(130 * var(--rpx)); right:calc(18 * var(--rpx)); }
  .profile-status-card,
  .attendance-scan-card,
  .attendance-scan-card.clocked-in,
  .home-overview { min-height:calc(184 * var(--rpx)); height:calc(184 * var(--rpx)); }
}

/* V1.3.4: compact illuminated identity card, matching attendance card and unified globe */
.profile-status-card {
  position:relative;
  min-height:calc(164 * var(--rpx));
  height:calc(164 * var(--rpx));
  padding:calc(17 * var(--rpx)) calc(20 * var(--rpx));
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 16%,rgba(78,166,255,.20) 0,rgba(78,166,255,0) 30%),
    radial-gradient(circle at 5% 110%,rgba(112,222,205,.16) 0,rgba(112,222,205,0) 42%),
    linear-gradient(135deg,rgba(255,255,255,.995),rgba(244,250,255,.985) 52%,rgba(237,247,255,.98));
  border:calc(1 * var(--rpx)) solid rgba(199,222,248,.86);
  box-shadow:0 calc(15 * var(--rpx)) calc(36 * var(--rpx)) rgba(23,86,162,.14),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.98),inset calc(-4 * var(--rpx)) calc(-5 * var(--rpx)) calc(13 * var(--rpx)) rgba(96,153,215,.08);
}
.profile-status-card::before {
  content:"";
  position:absolute;
  left:-12%;
  top:-38%;
  width:78%;
  height:94%;
  border-radius:50%;
  background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,255,255,.14));
  transform:rotate(-9deg);
  pointer-events:none;
}
.profile-status-card::after {
  content:"";
  position:absolute;
  right:calc(28 * var(--rpx));
  bottom:calc(-51 * var(--rpx));
  width:calc(150 * var(--rpx));
  height:calc(105 * var(--rpx));
  border-radius:50%;
  background:rgba(72,151,244,.11);
  filter:blur(calc(18 * var(--rpx)));
  pointer-events:none;
}
.profile-status-card > div,
.profile-status-card > wx-picker { position:relative; z-index:2; }
.profile-avatar-wrap { width:calc(88 * var(--rpx)); height:calc(88 * var(--rpx)); margin-right:calc(17 * var(--rpx)); }
.profile-avatar { width:calc(88 * var(--rpx)); height:calc(88 * var(--rpx)); }
.profile-name { font-size:calc(32 * var(--rpx)); }
.profile-task-row { margin-top:calc(7 * var(--rpx)); font-size:calc(20 * var(--rpx)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-warehouse-row {
  display:flex;
  align-items:center;
  min-width:0;
  margin-top:calc(5 * var(--rpx));
  color:#6e7f95;
  font-size:calc(18 * var(--rpx));
  line-height:1.2;
  white-space:nowrap;
}
.profile-warehouse-dot {
  width:calc(10 * var(--rpx));
  height:calc(10 * var(--rpx));
  margin-right:calc(7 * var(--rpx));
  flex:none;
  background:linear-gradient(145deg,#36a3ff,#1265d0);
  border-radius:50%;
  box-shadow:0 0 calc(10 * var(--rpx)) rgba(31,125,230,.42);
}
.profile-warehouse-label { flex:none; font-weight:750; }
.profile-warehouse-name { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.profile-status-card .compact-language-picker { margin-left:calc(8 * var(--rpx)); margin-right:calc(-5 * var(--rpx)); }

.attendance-scan-card,
.attendance-scan-card.clocked-in {
  min-height:calc(164 * var(--rpx));
  height:calc(164 * var(--rpx));
  padding-top:calc(16 * var(--rpx));
  padding-bottom:calc(16 * var(--rpx));
  box-sizing:border-box;
}
.attendance-scan-title { line-height:1.22; }
.attendance-scan-subtitle { margin-top:calc(4 * var(--rpx)); }
.clock-out-reminder-bubble { margin-top:calc(7 * var(--rpx)); }
.home-overview { min-height:calc(190 * var(--rpx)); height:calc(190 * var(--rpx)); }

.language-button,
.compact-language-button {
  width:calc(120 * var(--rpx));
  height:calc(120 * var(--rpx));
  min-width:calc(120 * var(--rpx));
  min-height:calc(120 * var(--rpx));
}
.language-button-icon,
.language-icon-image {
  width:calc(116 * var(--rpx));
  height:calc(116 * var(--rpx));
}
.language-icon-image {
  filter:drop-shadow(0 calc(10 * var(--rpx)) calc(13 * var(--rpx)) rgba(25,80,158,.28)) saturate(1.12);
}
.metric-gold {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

@media (max-width:360px) {
  .profile-status-card,
  .attendance-scan-card,
  .attendance-scan-card.clocked-in { min-height:calc(158 * var(--rpx)); height:calc(158 * var(--rpx)); }
  .home-overview { min-height:calc(184 * var(--rpx)); height:calc(184 * var(--rpx)); }
  .language-button,.compact-language-button { width:calc(112 * var(--rpx)); height:calc(112 * var(--rpx)); min-width:calc(112 * var(--rpx)); min-height:calc(112 * var(--rpx)); }
  .language-button-icon,.language-icon-image { width:calc(108 * var(--rpx)); height:calc(108 * var(--rpx)); }
  .profile-name { font-size:calc(29 * var(--rpx)); }
  .profile-task-row { font-size:calc(18 * var(--rpx)); }
  .profile-warehouse-row { font-size:calc(16 * var(--rpx)); }
}

/* V1.3.5: prominent running task, flat grid and flowing glass actions */
.profile-warehouse-row {
  margin-top:calc(10 * var(--rpx));
  color:#53677f;
  font-size:calc(22 * var(--rpx));
  font-weight:700;
}
.profile-warehouse-label { font-weight:850; }
.profile-warehouse-dot { display:none !important; }

.attendance-scan-title {
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:calc(2 * var(--rpx));
  font-size:calc(27 * var(--rpx));
}
.attendance-inline-time {
  color:#62748a;
  font-size:calc(21 * var(--rpx));
  font-weight:800;
  white-space:nowrap;
}
.clock-out-reminder-bubble {
  min-height:calc(42 * var(--rpx));
  margin-top:calc(13 * var(--rpx));
  padding:calc(6 * var(--rpx)) calc(15 * var(--rpx)) calc(6 * var(--rpx)) calc(7 * var(--rpx));
  font-size:calc(22 * var(--rpx));
  font-weight:900;
}
.clock-out-reminder-mark { width:calc(28 * var(--rpx)); height:calc(28 * var(--rpx)); flex-basis:calc(28 * var(--rpx)); font-size:calc(20 * var(--rpx)); }

.metric-value {
  width:100%;
  overflow:visible;
  font-size:calc(25 * var(--rpx));
  letter-spacing:calc(-.6 * var(--rpx));
  line-height:1.08;
  text-overflow:clip;
  white-space:nowrap;
}

.task-title.has-current-task {
  position:relative;
  padding-left:calc(25 * var(--rpx));
  color:#07865f;
}
.task-title.has-current-task::before {
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:calc(14 * var(--rpx));
  height:calc(14 * var(--rpx));
  margin-top:calc(-7 * var(--rpx));
  background:#10b981;
  border-radius:50%;
  box-shadow:0 0 0 calc(6 * var(--rpx)) rgba(16,185,129,.13),0 0 calc(17 * var(--rpx)) rgba(16,185,129,.48);
  animation:currentTaskDot 1.25s ease-in-out infinite;
}
@keyframes currentTaskDot {
  0%,100% { opacity:.66; transform:scale(.84); }
  50% { opacity:1; transform:scale(1.16); }
}

.task-grid {
  gap:calc(1 * var(--rpx)) !important;
  padding:0;
  overflow:hidden;
  background:rgba(169,188,211,.44);
  border:0;
  border-radius:calc(22 * var(--rpx));
  box-shadow:0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(37,72,115,.09),inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.9);
}
.task-button,
.sort-task-button,
.task-button.task-tone-blue,.sort-task-button.task-tone-blue,.task-button.task-tone-blue.disabled,
.task-button.task-tone-green,.sort-task-button.task-tone-green,.task-button.task-tone-green.disabled,
.task-button.task-tone-cyan,.sort-task-button.task-tone-cyan,.task-button.task-tone-cyan.disabled,
.task-button.task-tone-purple,.sort-task-button.task-tone-purple,.task-button.task-tone-purple.disabled,
.task-button.task-tone-orange,.sort-task-button.task-tone-orange,.task-button.task-tone-orange.disabled,
.task-button.task-tone-slate,.sort-task-button.task-tone-slate,.task-button.task-tone-slate.disabled,
.task-button.task-tone-red,.sort-task-button.task-tone-red,.task-button.task-tone-red.disabled,
.task-button.task-tone-violet,.sort-task-button.task-tone-violet,.task-button.task-tone-violet.disabled,
.task-button.task-tone-royal,.sort-task-button.task-tone-royal,.task-button.task-tone-royal.disabled,
.task-button.task-tone-amber,.sort-task-button.task-tone-amber,.task-button.task-tone-amber.disabled,
.task-button.task-tone-gold,.sort-task-button.task-tone-gold,.task-button.task-tone-gold.disabled,
.task-button.task-tone-emerald,.sort-task-button.task-tone-emerald,.task-button.task-tone-emerald.disabled,
.task-button.task-tone-indigo,.sort-task-button.task-tone-indigo,.task-button.task-tone-indigo.disabled,
.task-button.task-tone-rose,.sort-task-button.task-tone-rose,.task-button.task-tone-rose.disabled,
.task-button.task-tone-mint,.sort-task-button.task-tone-mint,.task-button.task-tone-mint.disabled {
  min-height:calc(190 * var(--rpx));
  height:calc(190 * var(--rpx));
  margin:0;
  padding:calc(13 * var(--rpx)) calc(5 * var(--rpx)) calc(10 * var(--rpx));
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(245,249,253,.99)) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.task-button::before,.task-button::after,
.sort-task-button::before,.sort-task-button::after { display:none !important; content:none !important; }
.sorting-grid { overflow:visible; background:transparent; border-radius:0; box-shadow:none; gap:calc(2 * var(--rpx)) !important; }
.sorting-grid .sort-task-button { overflow:visible; }
.task-icon,.task-button.current .task-icon { width:calc(82 * var(--rpx)); height:calc(82 * var(--rpx)); margin-bottom:calc(5 * var(--rpx)); }
.task-button.current {
  color:#fff;
  background:linear-gradient(145deg,#23c99b 0%,#0b9c76 54%,#08745c 100%) !important;
  box-shadow:inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.35),inset 0 calc(-10 * var(--rpx)) calc(24 * var(--rpx)) rgba(0,78,61,.20),0 calc(8 * var(--rpx)) calc(19 * var(--rpx)) rgba(7,132,99,.24) !important;
}
.task-button.current .task-label {
  color:#fff;
  font-weight:950;
  text-shadow:0 calc(2 * var(--rpx)) calc(5 * var(--rpx)) rgba(0,64,51,.30);
}
.task-running-label {
  position:relative;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:calc(27 * var(--rpx));
  margin-top:calc(5 * var(--rpx));
  padding:calc(2 * var(--rpx)) calc(12 * var(--rpx));
  color:#075c48;
  background:rgba(255,255,255,.90);
  border-radius:calc(999 * var(--rpx));
  box-shadow:0 calc(3 * var(--rpx)) calc(8 * var(--rpx)) rgba(0,67,52,.15);
  font-size:calc(17 * var(--rpx));
  font-weight:950;
  line-height:1.2;
}

.utility-actions .forgot-entry-icon img { width:calc(142 * var(--rpx)); height:calc(142 * var(--rpx)); }
.utility-actions .unloading-entry-icon img { width:calc(126 * var(--rpx)); height:calc(126 * var(--rpx)); }
.utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown {
  width:calc(100 * var(--rpx));
  height:calc(100 * var(--rpx));
  animation:crownBalancedFloat 2.6s ease-in-out infinite;
}
@keyframes crownBalancedFloat {
  0%,100% { transform:rotate(-15deg) translateY(0) scale(1); }
  50% { transform:rotate(-13deg) translateY(calc(-4 * var(--rpx))) scale(1.04); }
}

@media (max-width:360px) {
  .metric-value { font-size:calc(22 * var(--rpx)); letter-spacing:calc(-1 * var(--rpx)); }
  .task-button,.sort-task-button { min-height:calc(180 * var(--rpx)); height:calc(180 * var(--rpx)); }
  .task-icon,.task-button.current .task-icon { width:calc(76 * var(--rpx)); height:calc(76 * var(--rpx)); }
  .clock-out-reminder-bubble { font-size:calc(19 * var(--rpx)); }
  .utility-actions .forgot-entry-icon img { width:calc(128 * var(--rpx)); height:calc(128 * var(--rpx)); }
  .utility-actions .unloading-entry-icon img { width:calc(114 * var(--rpx)); height:calc(114 * var(--rpx)); }
  .utility-actions .manager-dashboard-button .crown-entry-icon .manager-crown { width:calc(91 * var(--rpx)); height:calc(91 * var(--rpx)); }
}

/* V1.3.6: layered green attendance glass and crystal shortcut materials */
.attendance-scan-button.crystal-attendance-button,
.attendance-scan-button.crystal-attendance-button.clock-in,
.attendance-scan-button.crystal-attendance-button.clock-out,
.attendance-scan-card.clocked-in .attendance-scan-button.crystal-attendance-button {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-width:calc(222 * var(--rpx));
  height:calc(76 * var(--rpx));
  min-height:calc(76 * var(--rpx));
  padding:0 calc(17 * var(--rpx));
  color:#fff;
  background:linear-gradient(148deg,#4cf0b4 0%,#1fc58d 34%,#0ba06d 67%,#05724d 100%) !important;
  border:calc(2 * var(--rpx)) solid rgba(199,255,232,.78) !important;
  border-radius:calc(22 * var(--rpx));
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.56),
    inset calc(7 * var(--rpx)) 0 calc(16 * var(--rpx)) rgba(145,255,213,.25),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(18 * var(--rpx)) rgba(0,72,47,.32),
    0 0 0 calc(7 * var(--rpx)) rgba(17,178,120,.10),
    0 calc(13 * var(--rpx)) calc(25 * var(--rpx)) rgba(3,116,76,.30),
    0 calc(25 * var(--rpx)) calc(43 * var(--rpx)) rgba(18,128,93,.14) !important;
  font-size:calc(24 * var(--rpx));
  font-weight:950;
  line-height:calc(76 * var(--rpx));
  text-shadow:0 calc(2 * var(--rpx)) calc(4 * var(--rpx)) rgba(0,65,43,.48),0 calc(-1 * var(--rpx)) calc(1 * var(--rpx)) rgba(255,255,255,.34);
  animation:attendanceCrystalPulse 2.8s ease-in-out infinite;
}
.attendance-scan-button.crystal-attendance-button::before,
.attendance-scan-button.crystal-attendance-button::after { content:none !important; display:none !important; border:0 !important; }
.attendance-glass-depth,
.attendance-glass-toplight,
.attendance-glass-leftlight,
.attendance-glass-reflection,
.attendance-glass-sweep {
  position:absolute;
  pointer-events:none;
}
.attendance-glass-depth {
  z-index:1;
  inset:calc(4 * var(--rpx));
  border-radius:calc(18 * var(--rpx));
  border:calc(1 * var(--rpx)) solid rgba(255,255,255,.24);
  box-shadow:inset 0 calc(2 * var(--rpx)) calc(6 * var(--rpx)) rgba(255,255,255,.42),inset 0 calc(-5 * var(--rpx)) calc(10 * var(--rpx)) rgba(0,72,46,.22);
}
.attendance-glass-toplight {
  z-index:2;
  left:9%;
  right:9%;
  top:calc(5 * var(--rpx));
  height:calc(29 * var(--rpx));
  border-radius:calc(999 * var(--rpx)) calc(999 * var(--rpx)) 55% 55%;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.20) 58%,rgba(255,255,255,0));
  filter:blur(calc(.6 * var(--rpx)));
}
.attendance-glass-leftlight {
  z-index:2;
  left:calc(-8 * var(--rpx));
  top:calc(10 * var(--rpx));
  width:calc(31 * var(--rpx));
  height:calc(47 * var(--rpx));
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.78) 0%,rgba(204,255,233,.32) 38%,rgba(255,255,255,0) 72%);
  filter:blur(calc(5 * var(--rpx)));
}
.attendance-glass-reflection {
  z-index:2;
  right:calc(3 * var(--rpx));
  bottom:calc(2 * var(--rpx));
  width:calc(56 * var(--rpx));
  height:calc(35 * var(--rpx));
  border-radius:50%;
  border-right:calc(3 * var(--rpx)) solid rgba(224,255,243,.62);
  border-bottom:calc(2 * var(--rpx)) solid rgba(224,255,243,.43);
  filter:blur(calc(2 * var(--rpx)));
  transform:rotate(-12deg);
}
.attendance-glass-sweep {
  z-index:3;
  top:-48%;
  left:-62%;
  width:45%;
  height:205%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),rgba(255,255,255,.72),rgba(255,255,255,.10),transparent);
  filter:blur(calc(3 * var(--rpx)));
  transform:rotate(17deg);
  animation:attendanceCrystalSweep 2.7s ease-in-out infinite;
}
.attendance-scan-button .glass-button-label { position:relative; z-index:5; }
.attendance-scan-button.crystal-attendance-button:active {
  transform:translateY(calc(3 * var(--rpx))) scale(.99);
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(7 * var(--rpx)) rgba(0,77,49,.22),inset 0 calc(-2 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.32),0 calc(6 * var(--rpx)) calc(13 * var(--rpx)) rgba(3,116,76,.25) !important;
}
@keyframes attendanceCrystalSweep {
  0%,24% { left:-62%; opacity:0; }
  35% { opacity:.92; }
  68%,100% { left:128%; opacity:0; }
}
@keyframes attendanceCrystalPulse {
  0%,100% { filter:brightness(.98) saturate(1.02); }
  50% { filter:brightness(1.07) saturate(1.08); }
}

.utility-actions > .utility-button {
  isolation:isolate;
  overflow:hidden !important;
  border-width:calc(1 * var(--rpx)) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.72),
    inset calc(6 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(255,255,255,.24),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(19 * var(--rpx)) rgba(31,55,91,.12),
    0 0 0 calc(1 * var(--rpx)) rgba(255,255,255,.78),
    0 calc(12 * var(--rpx)) calc(23 * var(--rpx)) rgba(30,63,104,.17),
    0 calc(26 * var(--rpx)) calc(44 * var(--rpx)) rgba(39,78,126,.10) !important;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.utility-actions > .forgot-button {
  border-color:rgba(255,230,150,.58) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.82),
    inset calc(7 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(255,247,208,.42),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(169,120,15,.12),
    0 0 0 calc(1 * var(--rpx)) rgba(255,249,224,.90),
    0 calc(12 * var(--rpx)) calc(24 * var(--rpx)) rgba(158,111,13,.17),
    0 calc(27 * var(--rpx)) calc(46 * var(--rpx)) rgba(119,91,28,.10) !important;
}
.utility-actions > .unloading-button {
  border-color:rgba(163,242,228,.58) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.82),
    inset calc(7 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(223,255,249,.42),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(7,132,113,.12),
    0 0 0 calc(1 * var(--rpx)) rgba(231,255,251,.90),
    0 calc(12 * var(--rpx)) calc(24 * var(--rpx)) rgba(4,128,108,.17),
    0 calc(27 * var(--rpx)) calc(46 * var(--rpx)) rgba(21,106,94,.10) !important;
}
.utility-actions > .manager-dashboard-button {
  border-color:rgba(220,181,83,.48) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.18),
    inset calc(8 * var(--rpx)) 0 calc(18 * var(--rpx)) rgba(255,218,107,.11),
    inset calc(-8 * var(--rpx)) calc(-12 * var(--rpx)) calc(22 * var(--rpx)) rgba(0,0,0,.72),
    0 0 0 calc(1 * var(--rpx)) rgba(255,218,118,.31),
    0 calc(12 * var(--rpx)) calc(25 * var(--rpx)) rgba(43,31,4,.38),
    0 calc(29 * var(--rpx)) calc(48 * var(--rpx)) rgba(58,39,0,.18) !important;
}
.utility-actions > .utility-button::after { border:0 !important; }
.utility-actions > .utility-button:active {
  transform:translateY(calc(4 * var(--rpx))) scale(.992);
  filter:brightness(.98);
}
.shortcut-crystal-fx {
  position:absolute;
  z-index:2;
  inset:0;
  overflow:hidden;
  border-radius:inherit;
  pointer-events:none;
}
.shortcut-crystal-fx::before {
  content:"";
  position:absolute;
  left:5%;
  right:5%;
  top:calc(5 * var(--rpx));
  height:52%;
  border-radius:calc(999 * var(--rpx)) calc(999 * var(--rpx)) 48% 48%;
  background:linear-gradient(180deg,rgba(255,255,255,.68) 0%,rgba(255,255,255,.20) 58%,rgba(255,255,255,0) 100%);
  opacity:.76;
  filter:blur(calc(1 * var(--rpx)));
}
.shortcut-crystal-fx::after {
  content:"";
  position:absolute;
  right:calc(-2 * var(--rpx));
  bottom:calc(5 * var(--rpx));
  width:25%;
  height:44%;
  border-radius:50%;
  border-right:calc(4 * var(--rpx)) solid rgba(255,255,255,.45);
  border-bottom:calc(3 * var(--rpx)) solid rgba(255,255,255,.24);
  filter:blur(calc(3 * var(--rpx)));
  transform:rotate(-10deg);
}
.manager-dashboard-button .shortcut-crystal-fx::before { opacity:.25; }
.manager-dashboard-button .shortcut-crystal-fx::after { border-color:rgba(255,223,127,.32); }
.shortcut-crystal-glint {
  position:absolute;
  top:-55%;
  left:-43%;
  width:30%;
  height:220%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),rgba(255,255,255,.62),rgba(255,255,255,.08),transparent);
  filter:blur(calc(4 * var(--rpx)));
  transform:rotate(16deg);
  animation:shortcutCrystalSweep 3.8s ease-in-out infinite;
}
.manager-dashboard-button .shortcut-crystal-glint { background:linear-gradient(90deg,transparent,rgba(255,225,133,.05),rgba(255,234,164,.38),rgba(255,225,133,.05),transparent); }
.utility-actions .utility-icon,
.utility-actions .utility-copy,
.utility-actions .utility-arrow { z-index:4; }
.utility-actions .utility-title {
  text-shadow:0 calc(2 * var(--rpx)) calc(3 * var(--rpx)) rgba(255,255,255,.55),0 calc(5 * var(--rpx)) calc(9 * var(--rpx)) rgba(64,78,93,.16);
}
.utility-actions .manager-dashboard-button .utility-title {
  text-shadow:0 calc(-1 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,245,195,.50),0 calc(3 * var(--rpx)) calc(7 * var(--rpx)) rgba(0,0,0,.82),0 0 calc(15 * var(--rpx)) rgba(255,207,67,.24);
}
@keyframes shortcutCrystalSweep {
  0%,30% { left:-43%; opacity:0; }
  41% { opacity:.85; }
  69%,100% { left:122%; opacity:0; }
}

@media (max-width:360px) {
  .attendance-scan-button.crystal-attendance-button { min-width:calc(206 * var(--rpx)); height:calc(72 * var(--rpx)); min-height:calc(72 * var(--rpx)); font-size:calc(22 * var(--rpx)); }
}

/* V1.3.7: homepage identity card material follows role rank */
.profile-status-card.profile-rank-staff {
  background:radial-gradient(circle at 92% 12%,rgba(85,212,174,.18),transparent 31%),linear-gradient(135deg,#ffffff 0%,#f1fbf7 54%,#e8f7f2 100%);
  border-color:rgba(161,221,202,.80);
}
.profile-status-card.profile-rank-leader {
  background:radial-gradient(circle at 91% 8%,rgba(64,178,255,.26),transparent 32%),linear-gradient(135deg,#ffffff 0%,#eaf6ff 52%,#ddecff 100%);
  border-color:rgba(133,194,244,.82);
  box-shadow:0 calc(16 * var(--rpx)) calc(38 * var(--rpx)) rgba(31,116,192,.18),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.98),inset calc(-5 * var(--rpx)) calc(-7 * var(--rpx)) calc(15 * var(--rpx)) rgba(44,121,190,.09);
}
.profile-status-card.profile-rank-leader .profile-role { color:#0b65aa; background:rgba(210,235,255,.92); }
.profile-status-card.profile-rank-manager {
  background:radial-gradient(circle at 91% 5%,rgba(156,111,255,.28),transparent 34%),linear-gradient(135deg,#ffffff 0%,#f1edff 52%,#e5ddff 100%);
  border-color:rgba(163,139,235,.82);
  box-shadow:0 calc(17 * var(--rpx)) calc(39 * var(--rpx)) rgba(88,62,176,.20),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.98),inset calc(-6 * var(--rpx)) calc(-8 * var(--rpx)) calc(16 * var(--rpx)) rgba(86,56,174,.11);
}
.profile-status-card.profile-rank-manager .profile-role { color:#613bb4; background:rgba(229,220,255,.92); }
.profile-status-card.profile-rank-executive {
  background:radial-gradient(circle at 88% 0%,rgba(255,205,78,.22),transparent 36%),linear-gradient(136deg,#202b41 0%,#111a2d 52%,#2b2112 100%);
  border-color:rgba(226,184,76,.70);
  box-shadow:0 calc(19 * var(--rpx)) calc(43 * var(--rpx)) rgba(11,19,34,.28),inset 0 calc(2 * var(--rpx)) 0 rgba(255,239,187,.22),inset calc(-7 * var(--rpx)) calc(-9 * var(--rpx)) calc(18 * var(--rpx)) rgba(0,0,0,.42);
}
.profile-status-card.profile-rank-executive::before { background:linear-gradient(145deg,rgba(255,237,181,.20),rgba(255,255,255,0)); }
.profile-status-card.profile-rank-executive::after { background:rgba(238,184,52,.18); }
.profile-status-card.profile-rank-executive .profile-name { color:#fff7da; text-shadow:0 calc(2 * var(--rpx)) calc(7 * var(--rpx)) rgba(0,0,0,.50); }
.profile-status-card.profile-rank-executive .profile-role { color:#ffe59a; background:rgba(187,133,20,.19); border:calc(1 * var(--rpx)) solid rgba(237,194,82,.40); }
.profile-status-card.profile-rank-executive .profile-warehouse-row { color:#c6ceda; }
.profile-status-card.profile-rank-executive .profile-avatar { border-color:#f3d77f; box-shadow:0 0 0 calc(5 * var(--rpx)) rgba(226,181,62,.12),0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(0,0,0,.38); }
.profile-status-card.profile-rank-diamond {
  background:radial-gradient(circle at 86% -5%,rgba(79,222,255,.34),transparent 36%),radial-gradient(circle at 5% 120%,rgba(139,104,255,.30),transparent 42%),linear-gradient(136deg,#111a38 0%,#1b315b 50%,#10263f 100%);
  border-color:rgba(124,224,255,.78);
  box-shadow:0 0 0 calc(4 * var(--rpx)) rgba(83,210,255,.07),0 calc(20 * var(--rpx)) calc(45 * var(--rpx)) rgba(18,46,91,.34),inset 0 calc(2 * var(--rpx)) 0 rgba(218,249,255,.30),inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(3,13,39,.43);
}
.profile-status-card.profile-rank-diamond::before { background:linear-gradient(145deg,rgba(215,249,255,.36),rgba(255,255,255,0)); }
.profile-status-card.profile-rank-diamond::after { background:rgba(91,218,255,.21); box-shadow:0 0 calc(32 * var(--rpx)) rgba(91,218,255,.22); }
.profile-status-card.profile-rank-diamond .profile-name { color:#f2fcff; text-shadow:0 0 calc(16 * var(--rpx)) rgba(105,225,255,.34),0 calc(3 * var(--rpx)) calc(8 * var(--rpx)) rgba(0,0,0,.48); }
.profile-status-card.profile-rank-diamond .profile-role { color:#bcf4ff; background:rgba(64,179,224,.16); border:calc(1 * var(--rpx)) solid rgba(113,225,255,.48); box-shadow:0 0 calc(13 * var(--rpx)) rgba(83,213,255,.12); }
.profile-status-card.profile-rank-diamond .profile-warehouse-row { color:#bdd2e7; }
.profile-status-card.profile-rank-diamond .profile-avatar { border-color:#a8efff; box-shadow:0 0 0 calc(5 * var(--rpx)) rgba(96,220,255,.13),0 0 calc(23 * var(--rpx)) rgba(81,216,255,.28),0 calc(11 * var(--rpx)) calc(25 * var(--rpx)) rgba(0,0,0,.36); }

/* V1.3.8: individual role materials, two attendance colors and perimeter light */
.profile-status-card[class*="profile-role-card-"] {
  border-width:calc(2 * var(--rpx));
  box-shadow:
    inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.42),
    inset calc(7 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(255,255,255,.12),
    inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(21 * var(--rpx)) rgba(24,45,72,.16),
    0 0 0 calc(5 * var(--rpx)) rgba(104,174,239,.06),
    0 calc(18 * var(--rpx)) calc(39 * var(--rpx)) rgba(23,69,121,.22),
    0 calc(30 * var(--rpx)) calc(55 * var(--rpx)) rgba(25,72,126,.10);
}
.profile-status-card[class*="profile-role-card-"]::before {
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.08) 58%,rgba(255,255,255,0));
  filter:blur(calc(1 * var(--rpx)));
}
.profile-status-card[class*="profile-role-card-"]::after {
  width:calc(190 * var(--rpx));
  height:calc(125 * var(--rpx));
  right:calc(6 * var(--rpx));
  bottom:calc(-66 * var(--rpx));
  filter:blur(calc(24 * var(--rpx)));
}
.profile-status-card[class*="profile-role-card-"] .profile-avatar {
  border-width:calc(5 * var(--rpx));
  box-shadow:0 0 0 calc(5 * var(--rpx)) rgba(102,182,236,.10),0 0 calc(24 * var(--rpx)) rgba(78,161,221,.20),0 calc(12 * var(--rpx)) calc(25 * var(--rpx)) rgba(24,62,102,.24);
}
.profile-role-card-developer {
  color:#effcff;
  background:radial-gradient(circle at 86% -8%,rgba(83,229,255,.43),transparent 35%),radial-gradient(circle at 8% 120%,rgba(148,105,255,.35),transparent 43%),linear-gradient(136deg,#0b1432 0%,#19335f 51%,#0b263f 100%) !important;
  border-color:rgba(127,230,255,.88) !important;
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(223,251,255,.34),inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(24 * var(--rpx)) rgba(3,10,34,.56),0 0 0 calc(6 * var(--rpx)) rgba(85,212,255,.09),0 0 calc(32 * var(--rpx)) rgba(76,218,255,.25),0 calc(22 * var(--rpx)) calc(47 * var(--rpx)) rgba(17,46,91,.40) !important;
}
.profile-role-card-developer::after { background:rgba(82,220,255,.40) !important; box-shadow:0 0 calc(42 * var(--rpx)) rgba(82,220,255,.35); }
.profile-role-card-developer .profile-name { color:#f1fcff; text-shadow:0 0 calc(18 * var(--rpx)) rgba(105,229,255,.43),0 calc(4 * var(--rpx)) calc(9 * var(--rpx)) rgba(0,0,0,.52); }
.profile-role-card-developer .profile-role { color:#c3f5ff; background:rgba(70,190,231,.18); border:calc(1 * var(--rpx)) solid rgba(116,228,255,.55); box-shadow:0 0 calc(17 * var(--rpx)) rgba(78,220,255,.20); }
.profile-role-card-developer .profile-warehouse-row { color:#bfd9eb; }
.profile-role-card-developer .profile-avatar { border-color:#a9f1ff; box-shadow:0 0 0 calc(6 * var(--rpx)) rgba(102,226,255,.15),0 0 calc(31 * var(--rpx)) rgba(89,218,255,.43),0 calc(13 * var(--rpx)) calc(28 * var(--rpx)) rgba(0,0,0,.40); }

.profile-role-card-ceo {
  background:radial-gradient(circle at 86% 0%,rgba(255,207,77,.35),transparent 38%),linear-gradient(136deg,#15130f 0%,#251b08 51%,#090909 100%) !important;
  border-color:rgba(245,199,76,.84) !important;
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,235,168,.31),inset calc(-10 * var(--rpx)) calc(-13 * var(--rpx)) calc(24 * var(--rpx)) rgba(0,0,0,.76),0 0 0 calc(6 * var(--rpx)) rgba(235,184,54,.08),0 0 calc(30 * var(--rpx)) rgba(240,188,55,.18),0 calc(22 * var(--rpx)) calc(47 * var(--rpx)) rgba(30,21,4,.46) !important;
}
.profile-role-card-ceo::after { background:rgba(242,185,45,.35) !important; }
.profile-role-card-ceo .profile-name,.profile-role-card-warehouse_manager .profile-name { color:#fff4cf; text-shadow:0 0 calc(15 * var(--rpx)) rgba(244,194,66,.24),0 calc(4 * var(--rpx)) calc(9 * var(--rpx)) rgba(0,0,0,.65); }
.profile-role-card-ceo .profile-role { color:#ffe49a; background:rgba(196,141,25,.20); border:calc(1 * var(--rpx)) solid rgba(242,198,82,.54); }
.profile-role-card-ceo .profile-warehouse-row,.profile-role-card-warehouse_manager .profile-warehouse-row { color:#d9ccb0; }
.profile-role-card-ceo .profile-avatar { border-color:#f4d36a; box-shadow:0 0 0 calc(6 * var(--rpx)) rgba(239,190,56,.14),0 0 calc(28 * var(--rpx)) rgba(235,181,42,.33),0 calc(13 * var(--rpx)) calc(28 * var(--rpx)) rgba(0,0,0,.48); }

.profile-role-card-executive_director {
  background:radial-gradient(circle at 88% 0%,rgba(212,231,255,.31),transparent 37%),linear-gradient(136deg,#202f4c,#13213a 53%,#273752) !important;
  border-color:rgba(186,211,239,.82) !important;
}
.profile-role-card-executive_director::after { background:rgba(148,193,239,.32) !important; }
.profile-role-card-executive_director .profile-name,.profile-role-card-regional_manager .profile-name { color:#eef6ff; text-shadow:0 calc(3 * var(--rpx)) calc(8 * var(--rpx)) rgba(0,0,0,.50); }
.profile-role-card-executive_director .profile-role { color:#e1efff; background:rgba(170,202,238,.16); border:calc(1 * var(--rpx)) solid rgba(192,219,247,.47); }
.profile-role-card-executive_director .profile-warehouse-row,.profile-role-card-regional_manager .profile-warehouse-row { color:#c1d2e5; }

.profile-role-card-regional_manager {
  background:radial-gradient(circle at 90% 0%,rgba(78,160,255,.39),transparent 36%),linear-gradient(136deg,#1d4b8d,#153567 52%,#142b4f) !important;
  border-color:rgba(115,181,255,.80) !important;
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(214,237,255,.32),inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(21 * var(--rpx)) rgba(6,32,74,.42),0 0 0 calc(5 * var(--rpx)) rgba(78,157,255,.08),0 0 calc(28 * var(--rpx)) rgba(67,151,255,.19),0 calc(20 * var(--rpx)) calc(43 * var(--rpx)) rgba(24,70,130,.33) !important;
}
.profile-role-card-regional_manager::after { background:rgba(68,155,255,.34) !important; }
.profile-role-card-regional_manager .profile-role { color:#dcebff; background:rgba(113,176,255,.17); border:calc(1 * var(--rpx)) solid rgba(148,198,255,.50); }

.profile-role-card-warehouse_manager {
  background:radial-gradient(circle at 90% 0%,rgba(232,168,70,.34),transparent 36%),linear-gradient(136deg,#353028,#29231b 52%,#181614) !important;
  border-color:rgba(211,163,87,.80) !important;
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,236,198,.28),inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(22 * var(--rpx)) rgba(0,0,0,.60),0 0 0 calc(5 * var(--rpx)) rgba(211,153,66,.07),0 0 calc(27 * var(--rpx)) rgba(218,151,53,.16),0 calc(20 * var(--rpx)) calc(43 * var(--rpx)) rgba(47,34,16,.36) !important;
}
.profile-role-card-warehouse_manager::after { background:rgba(216,146,48,.32) !important; }
.profile-role-card-warehouse_manager .profile-role { color:#ffdf9c; background:rgba(185,119,35,.19); border:calc(1 * var(--rpx)) solid rgba(226,169,86,.48); }
.profile-role-card-warehouse_manager .profile-avatar { border-color:#e5bc72; box-shadow:0 0 0 calc(6 * var(--rpx)) rgba(219,161,66,.13),0 0 calc(27 * var(--rpx)) rgba(215,149,47,.28),0 calc(13 * var(--rpx)) calc(28 * var(--rpx)) rgba(0,0,0,.43); }

.profile-role-card-supervisor {
  background:radial-gradient(circle at 90% 0%,rgba(161,119,255,.39),transparent 36%),linear-gradient(136deg,#ffffff,#f0eaff 53%,#e2d7ff) !important;
  border-color:rgba(164,137,232,.84) !important;
  box-shadow:inset 0 calc(3 * var(--rpx)) calc(2 * var(--rpx)) #fff,inset calc(-8 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(85,55,165,.14),0 0 0 calc(5 * var(--rpx)) rgba(142,106,230,.07),0 0 calc(27 * var(--rpx)) rgba(132,91,233,.16),0 calc(19 * var(--rpx)) calc(41 * var(--rpx)) rgba(91,67,161,.25) !important;
}
.profile-role-card-supervisor::after { background:rgba(129,85,230,.25) !important; }
.profile-role-card-supervisor .profile-role { color:#6740ba; background:rgba(225,215,255,.94); border:calc(1 * var(--rpx)) solid rgba(153,126,226,.50); }
.profile-role-card-supervisor .profile-avatar { border-color:#c6b2ff; box-shadow:0 0 0 calc(6 * var(--rpx)) rgba(141,106,235,.12),0 0 calc(27 * var(--rpx)) rgba(126,88,222,.26),0 calc(12 * var(--rpx)) calc(25 * var(--rpx)) rgba(64,40,130,.25); }

.profile-role-card-shift_leader {
  background:radial-gradient(circle at 90% 0%,rgba(78,151,255,.36),transparent 36%),linear-gradient(136deg,#ffffff,#eaf3ff 54%,#d9e8ff) !important;
  border-color:rgba(119,171,235,.84) !important;
}
.profile-role-card-shift_leader::after { background:rgba(72,139,235,.24) !important; }
.profile-role-card-shift_leader .profile-role { color:#275fba; background:rgba(216,233,255,.94); border:calc(1 * var(--rpx)) solid rgba(112,163,226,.47); }

.profile-role-card-group_leader {
  background:radial-gradient(circle at 90% 0%,rgba(77,201,225,.35),transparent 36%),linear-gradient(136deg,#ffffff,#eaf9fb 54%,#d9f0f5) !important;
  border-color:rgba(119,199,216,.82) !important;
}
.profile-role-card-group_leader::after { background:rgba(64,186,211,.23) !important; }
.profile-role-card-group_leader .profile-role { color:#14768c; background:rgba(214,244,248,.94); border:calc(1 * var(--rpx)) solid rgba(103,190,207,.47); }

.profile-role-card-staff {
  background:radial-gradient(circle at 90% 0%,rgba(86,215,177,.31),transparent 36%),linear-gradient(136deg,#ffffff,#f1fbf7 54%,#e6f5ef) !important;
  border-color:rgba(154,217,198,.82) !important;
}
.profile-role-card-staff::after { background:rgba(72,190,155,.21) !important; }
.profile-role-card-staff .profile-role { color:#217a61; background:rgba(219,246,237,.95); border:calc(1 * var(--rpx)) solid rgba(120,201,176,.45); }

.profile-role-card-unloading_staff {
  background:radial-gradient(circle at 90% 0%,rgba(39,191,181,.34),transparent 36%),linear-gradient(136deg,#ffffff,#eaf8f7 54%,#d9efed) !important;
  border-color:rgba(104,193,185,.82) !important;
}
.profile-role-card-unloading_staff::after { background:rgba(28,174,165,.23) !important; }
.profile-role-card-unloading_staff .profile-role { color:#087c74; background:rgba(210,243,240,.95); border:calc(1 * var(--rpx)) solid rgba(91,184,176,.47); }

.profile-role-card-external_regulator {
  background:radial-gradient(circle at 90% 0%,rgba(125,168,200,.30),transparent 36%),linear-gradient(136deg,#ffffff,#f1f5f8 54%,#e1e8ee) !important;
  border-color:rgba(158,181,200,.82) !important;
}
.profile-role-card-external_regulator::after { background:rgba(100,143,177,.21) !important; }
.profile-role-card-external_regulator .profile-role { color:#486779; background:rgba(224,234,241,.95); border:calc(1 * var(--rpx)) solid rgba(139,169,190,.48); }

.profile-role-card-visitor {
  background:linear-gradient(136deg,#ffffff,#f5f6f8 54%,#e9ecf0) !important;
  border-color:rgba(198,205,214,.84) !important;
  filter:saturate(.82);
}
.profile-role-card-visitor::after { background:rgba(141,151,164,.18) !important; }
.profile-role-card-visitor .profile-role { color:#687381; background:rgba(232,235,239,.96); border:calc(1 * var(--rpx)) solid rgba(181,190,200,.50); }

.attendance-scan-button.crystal-attendance-button {
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:calc(29 * var(--rpx));
  font-weight:950;
  letter-spacing:calc(.8 * var(--rpx));
}
.attendance-scan-button.crystal-attendance-button.clock-in {
  background:linear-gradient(148deg,#57f3ba 0%,#22c98f 34%,#0ca16e 67%,#05704b 100%) !important;
  border-color:rgba(201,255,233,.86) !important;
  box-shadow:inset 0 calc(6 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.61),inset calc(8 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(145,255,213,.27),inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(20 * var(--rpx)) rgba(0,72,47,.35),0 0 0 calc(8 * var(--rpx)) rgba(17,178,120,.11),0 0 calc(25 * var(--rpx)) rgba(27,225,157,.22),0 calc(15 * var(--rpx)) calc(29 * var(--rpx)) rgba(3,116,76,.34) !important;
  text-shadow:0 calc(3 * var(--rpx)) calc(5 * var(--rpx)) rgba(0,65,43,.58),0 calc(-2 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.43),0 0 calc(12 * var(--rpx)) rgba(185,255,230,.26);
}
.attendance-scan-button.crystal-attendance-button.clock-out,
.attendance-scan-card.clocked-in .attendance-scan-button.crystal-attendance-button {
  background:linear-gradient(148deg,#ffb15d 0%,#ff7b45 35%,#e94d37 68%,#b82d2f 100%) !important;
  border-color:rgba(255,224,185,.88) !important;
  box-shadow:inset 0 calc(6 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.58),inset calc(8 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(255,205,139,.27),inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(20 * var(--rpx)) rgba(111,13,24,.37),0 0 0 calc(8 * var(--rpx)) rgba(232,79,49,.11),0 0 calc(25 * var(--rpx)) rgba(255,106,55,.22),0 calc(15 * var(--rpx)) calc(29 * var(--rpx)) rgba(156,36,37,.34) !important;
  text-shadow:0 calc(3 * var(--rpx)) calc(5 * var(--rpx)) rgba(104,19,25,.62),0 calc(-2 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.40),0 0 calc(12 * var(--rpx)) rgba(255,219,173,.28);
}
.attendance-glass-sweep {
  inset:calc(3 * var(--rpx)) !important;
  width:auto !important;
  height:auto !important;
  background:none !important;
  filter:none !important;
  transform:none;
  border-radius:calc(20 * var(--rpx));
  animation:attendancePerimeterOrbit 5.4s linear infinite !important;
}
.attendance-glass-sweep::before {
  content:"";
  position:absolute;
  left:30%;
  top:calc(-7 * var(--rpx));
  width:40%;
  height:calc(15 * var(--rpx));
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.96) 0%,rgba(255,255,255,.52) 38%,rgba(255,255,255,0) 75%);
  filter:blur(calc(2 * var(--rpx)));
  box-shadow:0 0 calc(15 * var(--rpx)) rgba(255,255,255,.72);
}
@keyframes attendancePerimeterOrbit { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
.lang-en .attendance-scan-button.crystal-attendance-button,
.lang-vi .attendance-scan-button.crystal-attendance-button { font-size:calc(24 * var(--rpx)); letter-spacing:0; }
.lang-es .attendance-scan-button.crystal-attendance-button,
.lang-de .attendance-scan-button.crystal-attendance-button,
.lang-ro .attendance-scan-button.crystal-attendance-button,
.lang-bg .attendance-scan-button.crystal-attendance-button,
.lang-tr .attendance-scan-button.crystal-attendance-button { font-size:calc(21 * var(--rpx)); letter-spacing:calc(-.4 * var(--rpx)); }

.shortcut-crystal-glint {
  inset:calc(5 * var(--rpx)) !important;
  width:auto !important;
  height:auto !important;
  background:none !important;
  filter:none !important;
  transform:none;
  border-radius:inherit;
  animation:shortcutPerimeterOrbit 7.6s linear infinite !important;
}
.shortcut-crystal-glint::before {
  content:"";
  position:absolute;
  left:31%;
  top:calc(-8 * var(--rpx));
  width:38%;
  height:calc(18 * var(--rpx));
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.95),rgba(255,255,255,.48) 42%,rgba(255,255,255,0) 76%);
  filter:blur(calc(3 * var(--rpx)));
  box-shadow:0 0 calc(18 * var(--rpx)) rgba(255,255,255,.64);
}
.manager-dashboard-button .shortcut-crystal-glint::before { background:radial-gradient(ellipse,rgba(255,238,174,.95),rgba(255,206,85,.48) 42%,rgba(255,211,103,0) 76%); box-shadow:0 0 calc(20 * var(--rpx)) rgba(255,202,59,.58); }
@keyframes shortcutPerimeterOrbit { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
.utility-actions .manager-dashboard-button::before { animation:none !important; transform:none !important; }

.task-button,.sort-task-button {
  box-shadow:inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.82),inset calc(6 * var(--rpx)) 0 calc(15 * var(--rpx)) rgba(255,255,255,.42),inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(19 * var(--rpx)) rgba(60,88,121,.13),0 calc(9 * var(--rpx)) calc(18 * var(--rpx)) rgba(37,70,110,.13),0 calc(20 * var(--rpx)) calc(36 * var(--rpx)) rgba(39,78,126,.08) !important;
}
.task-button.current { box-shadow:inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.37),inset calc(6 * var(--rpx)) 0 calc(15 * var(--rpx)) rgba(168,255,226,.17),inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(19 * var(--rpx)) rgba(0,65,50,.29),0 calc(11 * var(--rpx)) calc(23 * var(--rpx)) rgba(7,132,99,.28),0 calc(21 * var(--rpx)) calc(39 * var(--rpx)) rgba(7,100,78,.12) !important; }
.task-button > .grid-crystal-fx,.sort-task-button > .grid-crystal-fx {
  position:absolute !important;
  z-index:1 !important;
  inset:0;
  overflow:hidden;
  border-radius:inherit;
  pointer-events:none;
}
.grid-crystal-fx::before {
  content:"";
  position:absolute;
  z-index:1;
  left:5%;
  right:5%;
  top:calc(4 * var(--rpx));
  height:48%;
  border-radius:calc(999 * var(--rpx)) calc(999 * var(--rpx)) 46% 46%;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.20) 59%,rgba(255,255,255,0));
  opacity:.78;
  filter:blur(calc(1 * var(--rpx)));
}
.grid-crystal-fx::after {
  content:"";
  position:absolute;
  z-index:1;
  right:calc(-2 * var(--rpx));
  bottom:calc(4 * var(--rpx));
  width:31%;
  height:42%;
  border-radius:50%;
  border-right:calc(3 * var(--rpx)) solid rgba(255,255,255,.50);
  border-bottom:calc(2 * var(--rpx)) solid rgba(255,255,255,.27);
  filter:blur(calc(2 * var(--rpx)));
}
.grid-crystal-orbit {
  position:absolute !important;
  z-index:2 !important;
  inset:calc(4 * var(--rpx));
  border-radius:inherit;
  animation:gridPerimeterOrbit 7.6s linear infinite;
}
.grid-crystal-orbit::before {
  content:"";
  position:absolute;
  left:28%;
  top:calc(-7 * var(--rpx));
  width:44%;
  height:calc(15 * var(--rpx));
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.96),rgba(191,224,255,.46) 42%,rgba(255,255,255,0) 76%);
  filter:blur(calc(2 * var(--rpx)));
  box-shadow:0 0 calc(16 * var(--rpx)) rgba(156,210,255,.55);
}
.task-button > .task-icon,.task-button > .task-label,.task-button > .task-running-label,
.sort-task-button > .task-icon,.sort-task-button > .task-label { position:relative; z-index:4; }
.task-button.disabled .grid-crystal-orbit,.task-button[disabled] .grid-crystal-orbit { display:none; }
@keyframes gridPerimeterOrbit { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
.sorting-grid .sort-task-button { overflow:visible !important; }
.sorting-grid .sort-task-button > .grid-crystal-fx { overflow:hidden; }
.sorting-grid .task-hide-control {
  position:absolute !important;
  left:calc(-10 * var(--rpx)) !important;
  top:calc(-10 * var(--rpx)) !important;
  z-index:40 !important;
  width:calc(48 * var(--rpx));
  height:calc(48 * var(--rpx));
  padding:0;
  color:#fff;
  background:linear-gradient(145deg,#ff636b,#df2935);
  border:calc(4 * var(--rpx)) solid #fff;
  border-radius:50%;
  box-shadow:0 calc(8 * var(--rpx)) calc(17 * var(--rpx)) rgba(190,27,40,.36),inset 0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.43);
  font-size:calc(32 * var(--rpx));
  line-height:calc(44 * var(--rpx));
}

/* V1.3.9：取消动态流光，改为静态聚光；上下班双色与快捷入口居中 */
.attendance-scan-button.crystal-attendance-button,
.attendance-scan-button.crystal-attendance-button.clock-in,
.attendance-scan-button.crystal-attendance-button.clock-out,
.attendance-scan-card.clocked-in .attendance-scan-button.crystal-attendance-button {
  animation:none !important;
}
.attendance-scan-button.crystal-attendance-button.clock-out,
.attendance-scan-card.clocked-in .attendance-scan-button.crystal-attendance-button {
  background:linear-gradient(148deg,#b9ebff 0%,#79d2fb 32%,#45afe6 66%,#2584c4 100%) !important;
  border-color:rgba(225,248,255,.94) !important;
  box-shadow:inset 0 calc(6 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.72),inset calc(8 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(219,246,255,.38),inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(20 * var(--rpx)) rgba(18,91,145,.28),0 0 0 calc(8 * var(--rpx)) rgba(91,190,237,.11),0 calc(15 * var(--rpx)) calc(29 * var(--rpx)) rgba(29,119,177,.28) !important;
  text-shadow:0 calc(3 * var(--rpx)) calc(5 * var(--rpx)) rgba(18,84,133,.56),0 calc(-2 * var(--rpx)) calc(2 * var(--rpx)) rgba(255,255,255,.52),0 0 calc(12 * var(--rpx)) rgba(225,248,255,.36);
}
.attendance-glass-sweep,
.shortcut-crystal-glint,
.grid-crystal-orbit {
  display:none !important;
  animation:none !important;
}
.utility-actions > .utility-button,
.utility-actions > .utility-button::before,
.utility-actions > .utility-button::after,
.shortcut-crystal-fx,
.shortcut-crystal-fx::before,
.shortcut-crystal-fx::after {
  animation:none !important;
}

.task-grid {
  gap:calc(1 * var(--rpx)) !important;
  overflow:hidden;
  background:rgba(158,181,207,.52) !important;
  border:0 !important;
  border-radius:calc(22 * var(--rpx));
  box-shadow:0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(37,72,115,.09),inset 0 calc(1 * var(--rpx)) 0 rgba(255,255,255,.9) !important;
}
.task-button,.sort-task-button {
  border:0 !important;
  border-radius:0 !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(4 * var(--rpx)) rgba(255,255,255,.72),inset calc(-5 * var(--rpx)) calc(-7 * var(--rpx)) calc(13 * var(--rpx)) rgba(68,96,128,.08) !important;
}
.task-button.current {
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(4 * var(--rpx)) rgba(255,255,255,.36),inset calc(-6 * var(--rpx)) calc(-8 * var(--rpx)) calc(15 * var(--rpx)) rgba(0,72,54,.24) !important;
}
.task-button > .grid-crystal-fx::before,
.sort-task-button > .grid-crystal-fx::before {
  left:-24% !important;
  right:auto !important;
  top:-34% !important;
  width:70% !important;
  height:178% !important;
  border-radius:0 !important;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.16) 28%,rgba(255,255,255,.72) 50%,rgba(255,255,255,.14) 72%,rgba(255,255,255,0)) !important;
  opacity:.74 !important;
  filter:blur(calc(6 * var(--rpx))) !important;
  transform:rotate(-20deg) !important;
}
.task-button > .grid-crystal-fx::after,
.sort-task-button > .grid-crystal-fx::after {
  right:calc(5 * var(--rpx));
  bottom:calc(5 * var(--rpx));
  border-color:rgba(255,255,255,.36);
}
.sorting-grid {
  gap:calc(2 * var(--rpx)) !important;
  overflow:visible !important;
  background:transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.utility-actions .utility-copy,
.utility-actions .manager-dashboard-button .utility-copy {
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:0 !important;
  z-index:6 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100% !important;
  padding:0 calc(146 * var(--rpx));
  box-sizing:border-box;
  transform:none !important;
  text-align:center !important;
  pointer-events:none;
}
.utility-actions .utility-title,
.utility-actions .manager-button-text,
.lang-zh .utility-actions .utility-title {
  width:100%;
  text-align:center !important;
}
.utility-actions .utility-subtitle,
.utility-actions .utility-arrow { display:none !important; }

@media (max-width:360px) {
  .utility-actions .utility-copy,
  .utility-actions .manager-dashboard-button .utility-copy { padding:0 calc(124 * var(--rpx)); }
}

/* V1.4.2：卸柜入口与名片同宽；姓名、职位和等级按内容自动换行 */
.unloading-staff-portal {
  display:flex !important;
  flex-direction:column;
  align-items:stretch;
  width:calc(calc(750 * var(--rpx)) - calc(56 * var(--rpx))) !important;
  max-width:calc(calc(750 * var(--rpx)) - calc(56 * var(--rpx))) !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.unloading-staff-portal > .unloading-portal-button {
  align-self:stretch;
  justify-self:stretch;
  width:calc(calc(750 * var(--rpx)) - calc(56 * var(--rpx))) !important;
  min-width:calc(calc(750 * var(--rpx)) - calc(56 * var(--rpx))) !important;
  max-width:calc(calc(750 * var(--rpx)) - calc(56 * var(--rpx))) !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.profile-status-card {
  height:auto !important;
  min-height:calc(164 * var(--rpx)) !important;
  padding-top:calc(20 * var(--rpx));
  padding-bottom:calc(20 * var(--rpx));
}
.profile-name-row {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:calc(9 * var(--rpx)) calc(12 * var(--rpx));
  min-width:0;
}
.profile-name {
  flex:0 0 auto;
  max-width:100% !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:normal !important;
  overflow-wrap:anywhere;
}
.profile-meta-row {
  display:flex;
  align-items:center;
  flex:0 0 auto;
  flex-wrap:wrap;
  gap:calc(8 * var(--rpx));
  max-width:100%;
}
.profile-meta-row .profile-role { max-width:100%; margin-left:0 !important; white-space:normal; }
.profile-meta-row .activity-level-badge { flex:none; }

/* V1.4.3：进行中任务只保留沿边缘运动的光点拖尾，不叠加静态聚光 */
.task-button.current > .grid-crystal-fx::before,
.task-button.current > .grid-crystal-fx::after {
  content:none !important;
  display:none !important;
  animation:none !important;
}

/* V1.4.4：职级名片强区分、等级居中与拣货分类选择层 */
.profile-role-card-staff {
  color:#29493e;
  background:radial-gradient(circle at 88% 5%,rgba(124,229,167,.24),transparent 34%),linear-gradient(138deg,#fff 0%,#f4fff7 53%,#e8f6ec 100%) !important;
  border-color:rgba(143,207,165,.76) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) #fff,inset calc(-8 * var(--rpx)) calc(-11 * var(--rpx)) calc(22 * var(--rpx)) rgba(48,129,76,.08),0 0 calc(22 * var(--rpx)) rgba(85,188,122,.10),0 calc(17 * var(--rpx)) calc(36 * var(--rpx)) rgba(46,94,65,.16) !important;
}
.profile-role-card-staff .profile-role { color:#2a7650; background:rgba(225,247,233,.96); border-color:rgba(123,194,148,.54); }
.profile-role-card-group_leader {
  color:#123f50;
  background:radial-gradient(circle at 88% 2%,rgba(74,222,235,.45),transparent 36%),linear-gradient(138deg,#f8ffff 0%,#dff8fb 50%,#bee7ec 100%) !important;
  border-color:rgba(67,176,193,.90) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) #fff,inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(23 * var(--rpx)) rgba(18,111,127,.16),0 0 calc(28 * var(--rpx)) rgba(45,187,206,.19),0 calc(19 * var(--rpx)) calc(40 * var(--rpx)) rgba(23,101,115,.23) !important;
}
.profile-role-card-group_leader .profile-role { color:#086f82; background:rgba(206,243,248,.97); border-color:rgba(62,164,181,.66); }
.profile-role-card-shift_leader {
  color:#f4f8ff;
  background:radial-gradient(circle at 88% 0%,rgba(108,181,255,.55),transparent 37%),linear-gradient(138deg,#315eaa 0%,#214c91 53%,#163568 100%) !important;
  border-color:rgba(128,188,255,.94) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) rgba(235,247,255,.48),inset calc(-10 * var(--rpx)) calc(-13 * var(--rpx)) calc(24 * var(--rpx)) rgba(5,27,68,.37),0 0 calc(31 * var(--rpx)) rgba(70,151,242,.24),0 calc(21 * var(--rpx)) calc(43 * var(--rpx)) rgba(15,54,111,.34) !important;
}
.profile-role-card-shift_leader .profile-name,.profile-role-card-shift_leader .profile-warehouse { color:#f4f8ff; text-shadow:0 calc(3 * var(--rpx)) calc(8 * var(--rpx)) rgba(8,30,67,.42); }
.profile-role-card-shift_leader .profile-role { color:#edf6ff; background:rgba(113,175,246,.27); border-color:rgba(175,215,255,.72); }
.profile-role-card-unloading_staff {
  color:#5b3b1e;
  background:radial-gradient(circle at 88% 0%,rgba(255,198,88,.48),transparent 37%),linear-gradient(138deg,#fffdf8 0%,#fff0ca 52%,#e9c983 100%) !important;
  border-color:rgba(217,160,57,.91) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) #fff,inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(23 * var(--rpx)) rgba(137,84,12,.17),0 0 calc(29 * var(--rpx)) rgba(233,167,51,.20),0 calc(19 * var(--rpx)) calc(41 * var(--rpx)) rgba(110,72,18,.25) !important;
}
.profile-role-card-unloading_staff .profile-role { color:#8a5705; background:rgba(255,239,188,.97); border-color:rgba(208,151,47,.65); }
.activity-level-badge { display:flex; align-items:center; justify-content:center; text-align:center; line-height:1; box-sizing:border-box; }

.task-button.current .grid-crystal-orbit { display:block !important; }
.picking-variant-overlay {
  position:absolute !important;
  z-index:20 !important;
  inset:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(145deg,rgba(24,119,226,.97),rgba(29,84,176,.98));
  backdrop-filter:blur(calc(8 * var(--rpx)));
}
.picking-variant-choice {
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  padding:calc(12 * var(--rpx));
  box-sizing:border-box;
  color:#fff;
  font-size:calc(23 * var(--rpx));
  font-weight:950;
  line-height:1.24;
  text-align:center;
  text-shadow:0 calc(3 * var(--rpx)) calc(7 * var(--rpx)) rgba(3,39,91,.48);
  box-shadow:inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.22),inset calc(-5 * var(--rpx)) calc(-7 * var(--rpx)) calc(13 * var(--rpx)) rgba(6,45,103,.24);
}
.picking-variant-choice + .picking-variant-choice { border-left:calc(1 * var(--rpx)) solid rgba(220,239,255,.48); }
.picking-variant-choice:active { background:rgba(83,189,255,.42); }
.task-button.current .task-running-label { max-width:94%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:calc(18 * var(--rpx)); }

/* V1.4.5：拣货选项纵向排布，职级名片互换，光点沿网格线带拖尾巡航 */
.picking-variant-overlay { grid-template-columns:1fr; grid-template-rows:1fr 1fr; }
.picking-variant-choice + .picking-variant-choice { border-left:0; border-top:calc(1 * var(--rpx)) solid rgba(220,239,255,.58); }

.profile-role-card-group_leader {
  color:#5b3b1e;
  background:radial-gradient(circle at 88% 0%,rgba(255,198,88,.48),transparent 37%),linear-gradient(138deg,#fffdf8 0%,#fff0ca 52%,#e9c983 100%) !important;
  border-color:rgba(217,160,57,.91) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) #fff,inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(23 * var(--rpx)) rgba(137,84,12,.17),0 0 calc(29 * var(--rpx)) rgba(233,167,51,.20),0 calc(19 * var(--rpx)) calc(41 * var(--rpx)) rgba(110,72,18,.25) !important;
}
.profile-role-card-group_leader::after { background:rgba(224,160,47,.30) !important; }
.profile-role-card-group_leader .profile-role { color:#8a5705; background:rgba(255,239,188,.97); border-color:rgba(208,151,47,.65); }
.profile-role-card-unloading_staff {
  color:#123f50;
  background:radial-gradient(circle at 88% 2%,rgba(74,222,235,.45),transparent 36%),linear-gradient(138deg,#f8ffff 0%,#dff8fb 50%,#bee7ec 100%) !important;
  border-color:rgba(67,176,193,.90) !important;
  box-shadow:inset 0 calc(4 * var(--rpx)) calc(3 * var(--rpx)) #fff,inset calc(-9 * var(--rpx)) calc(-12 * var(--rpx)) calc(23 * var(--rpx)) rgba(18,111,127,.16),0 0 calc(28 * var(--rpx)) rgba(45,187,206,.19),0 calc(19 * var(--rpx)) calc(40 * var(--rpx)) rgba(23,101,115,.23) !important;
}
.profile-role-card-unloading_staff::after { background:rgba(43,190,207,.29) !important; }
.profile-role-card-unloading_staff .profile-role { color:#086f82; background:rgba(206,243,248,.97); border-color:rgba(62,164,181,.66); }

.task-grid { overflow:visible !important; }
.task-button.current { z-index:7 !important; overflow:visible !important; }
.task-button.current > .grid-crystal-fx { z-index:12 !important; overflow:visible !important; }
.task-button.current .grid-crystal-orbit {
  display:block !important;
  inset:calc(-10 * var(--rpx)) !important;
  overflow:visible !important;
}
.task-button.current .grid-crystal-orbit::before {
  width:calc(20 * var(--rpx)) !important;
  height:calc(20 * var(--rpx)) !important;
  background:radial-gradient(circle,#fff 0 24%,#caffeb 38%,#45ffc1 67%,rgba(38,246,176,0) 100%) !important;
  filter:drop-shadow(0 0 calc(9 * var(--rpx)) rgba(109,255,205,.98)) !important;
  animation:activeTaskGridLineOrbit 5.4s linear infinite !important;
}
@keyframes activeTaskGridLineOrbit {
  0%,100% { left:0; top:0; box-shadow:0 0 calc(10 * var(--rpx)) calc(5 * var(--rpx)) rgba(218,255,242,.98),0 0 calc(24 * var(--rpx)) calc(11 * var(--rpx)) rgba(63,255,188,.82),0 calc(16 * var(--rpx)) calc(14 * var(--rpx)) rgba(169,255,224,.72),0 calc(34 * var(--rpx)) calc(23 * var(--rpx)) rgba(70,255,189,.42),0 calc(52 * var(--rpx)) calc(31 * var(--rpx)) rgba(29,209,151,.18); }
  25% { left:calc(100% - calc(20 * var(--rpx))); top:0; box-shadow:0 0 calc(10 * var(--rpx)) calc(5 * var(--rpx)) rgba(218,255,242,.98),0 0 calc(24 * var(--rpx)) calc(11 * var(--rpx)) rgba(63,255,188,.82),calc(-16 * var(--rpx)) 0 calc(14 * var(--rpx)) rgba(169,255,224,.72),calc(-34 * var(--rpx)) 0 calc(23 * var(--rpx)) rgba(70,255,189,.42),calc(-52 * var(--rpx)) 0 calc(31 * var(--rpx)) rgba(29,209,151,.18); }
  50% { left:calc(100% - calc(20 * var(--rpx))); top:calc(100% - calc(20 * var(--rpx))); box-shadow:0 0 calc(10 * var(--rpx)) calc(5 * var(--rpx)) rgba(218,255,242,.98),0 0 calc(24 * var(--rpx)) calc(11 * var(--rpx)) rgba(63,255,188,.82),0 calc(-16 * var(--rpx)) calc(14 * var(--rpx)) rgba(169,255,224,.72),0 calc(-34 * var(--rpx)) calc(23 * var(--rpx)) rgba(70,255,189,.42),0 calc(-52 * var(--rpx)) calc(31 * var(--rpx)) rgba(29,209,151,.18); }
  75% { left:0; top:calc(100% - calc(20 * var(--rpx))); box-shadow:0 0 calc(10 * var(--rpx)) calc(5 * var(--rpx)) rgba(218,255,242,.98),0 0 calc(24 * var(--rpx)) calc(11 * var(--rpx)) rgba(63,255,188,.82),calc(16 * var(--rpx)) 0 calc(14 * var(--rpx)) rgba(169,255,224,.72),calc(34 * var(--rpx)) 0 calc(23 * var(--rpx)) rgba(70,255,189,.42),calc(52 * var(--rpx)) 0 calc(31 * var(--rpx)) rgba(29,209,151,.18); }
}

/* Leave uses a coral palette while retaining the shared shortcut geometry. */
.profile-meta-row .activity-level-badge { flex:0 1 auto; max-width:100%; white-space:normal; padding:calc(8 * var(--rpx)) calc(12 * var(--rpx)); }
.activity-level-number { white-space:normal; line-height:1.4; overflow-wrap:break-word; }
.utility-actions > .leave-button {
  color:#8f352c;
  background:linear-gradient(148deg,#fff5f0 0%,#ffd7c8 48%,#f4ad98 100%) !important;
  border-color:rgba(236,153,129,.70) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.82),
    inset calc(7 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(255,236,227,.42),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(154,62,40,.14),
    0 0 0 calc(1 * var(--rpx)) rgba(255,239,232,.90),
    0 calc(12 * var(--rpx)) calc(24 * var(--rpx)) rgba(161,67,46,.17),
    0 calc(27 * var(--rpx)) calc(46 * var(--rpx)) rgba(144,60,42,.10) !important;
}
.utility-actions .leave-button .utility-title {
  color:#8f352c;
  text-shadow:0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.94),0 calc(5 * var(--rpx)) calc(10 * var(--rpx)) rgba(154,62,40,.20);
}
.utility-actions .leave-button .utility-icon img {
  filter:hue-rotate(155deg) drop-shadow(0 calc(11 * var(--rpx)) calc(10 * var(--rpx)) rgba(154,62,40,.25)) saturate(1.12);
}

/* Daily KPI shares shortcut geometry, floating icons and crystal highlights. */
.utility-actions > .daily-kpi-button {
  background:linear-gradient(148deg,#faf5ff 0%,#eee0ff 48%,#d9bdf5 100%) !important;
  border-color:rgba(205,168,240,.70) !important;
  box-shadow:
    inset 0 calc(5 * var(--rpx)) calc(5 * var(--rpx)) rgba(255,255,255,.82),
    inset calc(7 * var(--rpx)) 0 calc(17 * var(--rpx)) rgba(247,234,255,.42),
    inset calc(-7 * var(--rpx)) calc(-10 * var(--rpx)) calc(20 * var(--rpx)) rgba(106,48,151,.14),
    0 0 0 calc(1 * var(--rpx)) rgba(248,237,255,.90),
    0 calc(12 * var(--rpx)) calc(24 * var(--rpx)) rgba(113,57,159,.17),
    0 calc(27 * var(--rpx)) calc(46 * var(--rpx)) rgba(103,52,147,.10) !important;
}
.utility-actions .daily-kpi-button .utility-title {
  color:#63358e;
  text-shadow:0 calc(2 * var(--rpx)) 0 rgba(255,255,255,.94),0 calc(5 * var(--rpx)) calc(10 * var(--rpx)) rgba(105,51,151,.20),0 0 calc(8 * var(--rpx)) rgba(191,135,242,.18);
}
.utility-actions .daily-kpi-entry-icon {
  position:absolute;
  left:calc(14 * var(--rpx));
  top:50%;
  z-index:8;
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
  margin:0;
  transform:translateY(-50%);
  overflow:visible;
  flex:none;
}
.utility-actions .daily-kpi-entry-icon img {
  width:calc(126 * var(--rpx));
  height:calc(126 * var(--rpx));
  filter:hue-rotate(45deg) drop-shadow(0 calc(11 * var(--rpx)) calc(10 * var(--rpx)) rgba(89,38,132,.25)) drop-shadow(0 0 calc(10 * var(--rpx)) rgba(187,123,240,.34)) saturate(1.16) contrast(1.04);
  animation:shortcutRoyalFloat 2.7s ease-in-out infinite;
  animation-delay:.6s;
}
.utility-actions .daily-kpi-entry-icon::before,
.utility-actions .daily-kpi-entry-icon::after {
  content:"✦";
  position:absolute;
  z-index:8;
  color:#faf0ff;
  font-size:calc(23 * var(--rpx));
  font-weight:900;
  text-shadow:0 0 calc(6 * var(--rpx)) #fff,0 0 calc(12 * var(--rpx)) #d6a5ff,0 0 calc(19 * var(--rpx)) #9353ca;
  animation:crownSpark 1.35s ease-in-out infinite alternate;
}
.utility-actions .daily-kpi-entry-icon::before { left:0; top:calc(16 * var(--rpx)); }
.utility-actions .daily-kpi-entry-icon::after { right:calc(-4 * var(--rpx)); top:calc(-2 * var(--rpx)); animation-delay:.55s; }
@media (max-width:360px) {
  .utility-actions .daily-kpi-entry-icon { left:calc(11 * var(--rpx)); width:calc(114 * var(--rpx)); height:calc(114 * var(--rpx)); }
  .utility-actions .daily-kpi-entry-icon img { width:calc(114 * var(--rpx)); height:calc(114 * var(--rpx)); }
}