.languageGate{
  align-items:center!important;
  padding:calc(24px + env(safe-area-inset-top)) 28px calc(24px + env(safe-area-inset-bottom))!important;
  background:#f5f5f1!important;
  color:#111!important;
}
.languagePanel{
  width:min(100%,340px)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.languagePanel:after{display:none!important;content:none!important}
.languageMark{
  width:auto!important;
  height:auto!important;
  display:block!important;
  margin:0 0 36px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#111!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
}
.languagePanel h1{
  margin:0 0 22px!important;
  color:#111!important;
  font-size:26px!important;
  letter-spacing:-.045em!important;
}
.languagePanel h1 span{
  margin-left:7px;
  color:#8a8a86;
  font-size:14px;
  font-weight:600;
  letter-spacing:0;
}
.languagePanel button,
.languagePanel button+button{
  width:100%!important;
  height:54px!important;
  margin:8px 0 0!important;
  padding:0 15px!important;
  border:1px solid #d8d8d2!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#111!important;
  box-shadow:none!important;
  text-align:left!important;
  font-size:15px!important;
  font-weight:800!important;
}
.languagePanel button:active{
  background:#111!important;
  color:#fff!important;
}

/* Worker attendance — calm hierarchy, one action system */
.hero{
  margin:2px 14px 0!important;
  padding:21px 20px 15px!important;
  border-radius:26px!important;
  background:linear-gradient(145deg,#111315 0%,#191c1f 58%,#22262a 100%)!important;
  box-shadow:0 20px 42px rgba(18,22,25,.16)!important;
}
.heroStatusRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.heroEyebrow{
  color:#8f969a;
  font-size:8px;
  font-weight:850;
  letter-spacing:.13em;
}
.hero .statusPill{
  gap:6px;
  min-height:27px;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.1)!important;
  background:rgba(255,255,255,.055)!important;
  color:#eef1ef!important;
  font-size:8px!important;
  letter-spacing:.01em;
}
.hero .statusPill:before{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#a8afb0;
  content:"";
}
.hero .statusPill.ready:before{background:#78d7ae;box-shadow:0 0 0 4px rgba(120,215,174,.1)}
.hero .statusPill.live:before{background:#7fbcff;box-shadow:0 0 0 4px rgba(127,188,255,.1)}
.hero .statusPill.pending:before{background:#efc169;box-shadow:0 0 0 4px rgba(239,193,105,.1)}
.heroSiteBlock{margin-top:27px}
.hero .heroSiteBlock h2{
  margin:0!important;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:#fff;
  font-size:29px!important;
  line-height:1.08;
  letter-spacing:-.04em!important;
}
.hero .heroMeta{
  min-height:17px;
  margin-top:8px!important;
  color:#a4aaad!important;
  font-size:9px!important;
}
.hero .primaryHero{
  height:52px!important;
  margin-top:23px!important;
  border-radius:15px!important;
  background:#f5f6f4!important;
  box-shadow:none!important;
  color:#101214!important;
  font-size:12px!important;
  letter-spacing:.01em;
}
.heroUtilities{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:7px;
  border-top:1px solid rgba(255,255,255,.085);
}
.heroUtilities.single{grid-template-columns:1fr}
.heroUtility{
  height:38px;
  border:0;
  background:transparent;
  color:#b7bdc0;
  font-size:8px;
  font-weight:800;
}
.heroUtility+ .heroUtility{border-left:1px solid rgba(255,255,255,.085)}
.heroUtility:active{color:#fff;background:rgba(255,255,255,.035)}
.homeIdentity{min-width:0}
.homeIdentity h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.homeCompany{
  display:block;
  max-width:240px;
  margin:5px 0 0;
  padding:0;
  overflow:hidden;
  border:0;
  background:transparent;
  color:#777c7a;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
  font-weight:750;
  text-align:left;
}
.homeCompany span{margin-left:3px;color:#aaa}
.emptyChoice{
  margin:10px 0 4px;
   padding:26px 16px;
  border-radius:16px;
  background:#f5f5f1;
  color:#777;
  text-align:center;
  font-size:10px;
}

/* Conversations — clear people, names and message rhythm */
.chatRow{padding:14px 2px!important;gap:12px!important}
.chatAvatar{
  flex:0 0 46px;
  width:46px!important;
  height:46px!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#171a1d,#30363a)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
  font-size:10px!important;
  letter-spacing:.02em;
}
.chatAvatar.site{border-radius:16px!important;color:#fff!important}
.chatMain b{display:block;font-size:11px!important}
.chatMain small{
  max-width:250px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:8px!important;
}
.conversationHead{
  display:flex;
  align-items:center;
  gap:13px;
  padding:20px 16px 17px;
  border-bottom:1px solid var(--line);
}
.conversationAvatar{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(145deg,#171a1d,#30363a);
  color:#fff;
  font-size:10px;
  font-weight:900;
}
.conversationHead h1{margin:0;font-size:18px;letter-spacing:-.025em}
.conversationHead p{margin:3px 0 0;color:var(--muted);font-size:8px}
.messageThread{padding:18px 14px 100px}
.messageRow{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:0 0 17px;
}
.messageRow.me{flex-direction:row-reverse}
.messageAvatar{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:11px;
  background:#e8e9e5;
  color:#303336;
  font-size:8px;
  font-weight:900;
}
.messageRow.me .messageAvatar{background:#1b1e20;color:#fff}
.messageAvatar img{width:100%;height:100%;object-fit:cover}
.messageStack{display:flex;max-width:76%;flex-direction:column;align-items:flex-start}
.messageRow.me .messageStack{align-items:flex-end}
.messageSender{margin:0 2px 5px;color:#696e70;font-size:8px;font-weight:800}
.messageBubble{
  padding:11px 13px;
  border-radius:5px 16px 16px;
  background:#eef0ec;
  color:#17191a;
  font-size:10px;
  line-height:1.48;
  box-shadow:inset 0 0 0 1px rgba(20,24,26,.025);
}
.messageRow.me .messageBubble{border-radius:16px 5px 16px 16px;background:#17191b;color:#fff}
.messageTime{margin:5px 2px 0;color:#a0a4a4;font-size:7px}
.threadEmpty{padding:42px 0;color:#969a99;text-align:center;font-size:9px}
.chatComposer{
  position:fixed;
  left:50%;
  bottom:0;
  z-index:6;
  width:min(460px,100%);
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  padding:9px 12px calc(9px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);
  background:rgba(251,251,248,.94);
  backdrop-filter:blur(20px);
}
.chatComposer input{height:44px;min-width:0;padding:0 14px;border:1px solid #d9dbd7;border-radius:14px;background:#fff;outline:0}
.chatComposer input:focus{border-color:#989d9b}
.chatComposer button{height:44px;padding:0 16px;border:0;border-radius:14px;background:#17191b;color:#fff;font-size:10px;font-weight:900}

/* Requests — the tab is the list; details are one tap away */
.requestInline{padding:2px 14px 24px}
.requestInlineHead{display:flex;align-items:center;justify-content:space-between;padding:12px 1px 13px}
.requestInlineHead b{display:block;font-size:15px}
.requestInlineHead small{display:block;margin-top:2px;color:var(--muted);font-size:8px}
.requestInlineHead button{height:34px;padding:0 11px;border:0;border-radius:11px;background:#17191b;color:#fff;font-size:9px;font-weight:900}
.requestInlineTabs{display:flex;gap:7px;overflow:auto;padding:0 0 12px;scrollbar-width:none}
.requestInlineTabs::-webkit-scrollbar{display:none}
.requestInlineTabs button{height:33px;padding:0 11px;white-space:nowrap;border:1px solid var(--line);border-radius:11px;background:#fff;color:#747877;font-size:8px;font-weight:850}
.requestInlineTabs button.on{border-color:#17191b;background:#17191b;color:#fff}
.requestCardList{display:grid;gap:9px}
.requestCard{
  width:100%;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  padding:13px;
  border:1px solid #e0e2de;
  border-radius:17px;
  background:rgba(255,255,255,.82);
  box-shadow:0 8px 24px rgba(20,24,26,.035);
  text-align:left;
}
.requestCardIcon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#eef0ec;color:#373b3c;font-size:10px;font-weight:900}
.requestCardIcon.large{width:48px;height:48px;border-radius:15px}
.requestCardMain{min-width:0}
.requestCardTitle{display:flex;align-items:center;justify-content:space-between;gap:8px}
.requestCardTitle strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
.requestCardMain small{display:block;margin-top:3px;color:var(--muted);font-size:7px}
.requestCardMain p{margin:4px 0 0;overflow:hidden;color:#4f5353;font-size:8px;text-overflow:ellipsis;white-space:nowrap}
.requestChevron{color:#a9adab;font-size:17px}
.requestEmpty{padding:42px 0;color:#969a99;text-align:center;font-size:9px}
.requestDetail{padding:24px 16px}
.requestDetailTop{display:flex;align-items:center;gap:13px;padding-bottom:20px}
.requestDetailTop small{color:var(--muted);font-size:8px}
.requestDetailTop h1{margin:3px 0 0;font-size:20px;letter-spacing:-.035em}
.requestDetailStatus,.requestDetailRow{display:flex;align-items:center;justify-content:space-between;padding:14px 1px;border-top:1px solid var(--line);font-size:9px}
.requestDetailStatus span,.requestDetailRow span{color:var(--muted)}
.requestDetailBody{margin-top:8px;padding:16px;border-radius:16px;background:#f1f2ee}
.requestDetailBody small{color:var(--muted);font-size:8px}
.requestDetailBody p{margin:7px 0 0;font-size:11px;line-height:1.55}
.requestDetailMeta{display:flex;justify-content:space-between;margin-top:14px;color:#9a9e9d;font-size:7px}
