:root {
  --bg: #061722;
  --surface: #0a2230;
  --surface-2: #0e2a39;
  --line: rgba(151, 191, 209, 0.14);
  --text: #eff8f5;
  --muted: #87a3b0;
  --green: #61dc85;
  --green-deep: #1a9e54;
  --cyan: #51c9e8;
  --amber: #ffc35c;
  --red: #ff7f8e;
  --violet: #b29aff;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  color-scheme: dark;
}

* { box-sizing: border-box; }

html {
  background: #031019;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: #031019;
  color: var(--text);
  font-family: Inter, ui-rounded, "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

button, input, select { font: inherit; }
button, a, label { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }

.app-shell {
  position: relative;
  width: 100%;
  max-width: 540px;
  min-height: 100dvh;
  margin: 0 auto;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% -5%, rgba(45, 166, 111, 0.16), transparent 26rem),
    linear-gradient(180deg, #071b27 0%, var(--bg) 38%, #05151f 100%);
  box-shadow: 0 0 80px rgba(0, 0, 0, 0.45);
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: calc(68px + env(safe-area-inset-top, 0px));
  padding: calc(10px + env(safe-area-inset-top, 0px)) 18px 10px;
  background: rgba(6, 23, 34, 0.84);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(20px) saturate(130%);
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  background: none;
  border: 0;
  text-align: left;
}

.brand img {
  width: 38px;
  height: 38px;
  object-fit: cover;
  border-radius: 11px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.36);
}

.brand span { display: grid; gap: 1px; }
.brand b { font-size: 13px; letter-spacing: 0.12em; }
.brand small { color: var(--muted); font-size: 10px; letter-spacing: 0.04em; }
.topbar-actions { display: flex; align-items: center; gap: 7px; }
.notification-bell { position: relative; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; background: rgba(255,255,255,.045); border: 1px solid var(--line); border-radius: 13px; font-size: 16px; }
.notification-bell.has-unread { background: rgba(255,195,92,.08); border-color: rgba(255,195,92,.28); animation: bell-pulse 2.4s ease-in-out infinite; }
.notification-bell > b { position: absolute; top: -5px; right: -5px; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; color: #281603; background: var(--amber); border: 2px solid #071b27; border-radius: 999px; font-size: 8px; font-weight: 950; }

.sync-pill {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  color: #a7bbb9;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 750;
}

.sync-pill > span { color: var(--green); font-size: 9px; }
.sync-saving > span, .sync-loading > span { color: var(--amber); animation: pulse 1s infinite; }
.sync-offline > span, .sync-error > span { color: var(--red); }

.offline-status {
  display: grid;
  gap: 3px;
  margin: 9px 12px 0;
  padding: 10px 12px;
  color: #b9cfda;
  background: rgba(255, 195, 92, 0.08);
  border: 1px solid rgba(255, 195, 92, 0.2);
  border-radius: 13px;
  font-size: 9px;
  line-height: 1.4;
}
.offline-status strong { color: var(--amber); font-size: 10px; }

.content { padding-bottom: calc(88px + var(--safe-bottom)); }
.screen { min-height: calc(100dvh - 154px); padding: 20px 16px 30px; animation: enter 220ms ease-out; }

.hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  min-height: 190px;
  padding: 25px 22px 22px;
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 92% 10%, rgba(137, 238, 155, 0.22), transparent 8rem),
    linear-gradient(135deg, #0c5a3d 0%, #0b3f37 55%, #0a2d33 100%);
  border: 1px solid rgba(115, 228, 147, 0.26);
  border-radius: 24px;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.24);
}

.hero::after {
  content: "PV";
  position: absolute;
  right: -6px;
  top: -30px;
  color: rgba(255, 255, 255, 0.045);
  font-size: 132px;
  font-weight: 900;
  letter-spacing: -0.09em;
  transform: rotate(-7deg);
}

.hero > * { position: relative; z-index: 1; }
.hero h1 { max-width: 270px; margin: 8px 0 8px; font-size: clamp(26px, 7vw, 36px); line-height: 1.02; letter-spacing: -0.04em; }
.hero p { margin: 0; color: #b9d5ca; font-size: 12px; }
.eyebrow { color: #91b0bb; font-size: 10px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.hero .eyebrow { color: #99f0b3; }

.hero-add, .round-add {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: var(--green);
  color: #052115;
  border: 0;
  box-shadow: 0 9px 28px rgba(33, 192, 92, 0.3);
}

.hero-add { width: 64px; height: 64px; border-radius: 22px; }
.hero-add > span:first-child { font-size: 27px; line-height: 20px; }
.hero-add > span:last-child { font-size: 9px; font-weight: 900; text-transform: uppercase; }
.round-add { width: 45px; height: 45px; border-radius: 15px; font-size: 27px; }

.metrics-scroll {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(142px, 44%);
  gap: 10px;
  margin: 12px -16px 0;
  padding: 0 16px 8px;
  overflow-x: auto;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}
.metrics-scroll::-webkit-scrollbar { display: none; }

.metric {
  min-height: 110px;
  padding: 16px;
  scroll-snap-align: start;
  background: rgba(11, 36, 49, 0.88);
  border: 1px solid var(--line);
  border-top-color: rgba(97, 220, 133, 0.55);
  border-radius: 17px;
}
.metric > span { color: #8ca5ae; font-size: 9px; font-weight: 800; letter-spacing: 0.08em; }
.metric strong { display: block; margin: 9px 0 3px; font-size: 24px; letter-spacing: -0.04em; }
.metric small { color: var(--muted); font-size: 10px; }
.metric-blue { border-top-color: rgba(81, 201, 232, 0.7); }
.metric-blue strong { color: var(--cyan); }
.metric-amber { border-top-color: rgba(255, 195, 92, 0.75); }
.metric-amber strong { color: var(--amber); }

.weather-launch {
  display: grid;
  grid-template-columns: 49px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin-top: 7px;
  padding: 14px;
  text-align: left;
  background: linear-gradient(135deg, rgba(24, 104, 130, .5), rgba(20, 61, 76, .72));
  border: 1px solid rgba(81, 201, 232, .25);
  border-radius: 18px;
}
.weather-launch-icon { display: grid; place-items: center; width: 49px; height: 49px; background: rgba(81,201,232,.1); border: 1px solid rgba(81,201,232,.18); border-radius: 15px; font-size: 25px; }
.weather-launch > span:nth-child(2) { display: grid; gap: 2px; min-width: 0; }
.weather-launch small { color: #72cfe6; font-size: 8px; font-style: normal; font-weight: 850; letter-spacing: .08em; }
.weather-launch strong { font-size: 15px; }
.weather-launch em { overflow: hidden; color: #8fb0bc; font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.weather-launch > b { color: var(--cyan); font-size: 26px; font-weight: 400; }
.calculator-launch { margin-top: 8px; background: linear-gradient(135deg, rgba(65, 103, 78, .58), rgba(16, 61, 48, .76)); border-color: rgba(97, 220, 133, .24); }
.calculator-launch .weather-launch-icon { background: rgba(97,220,133,.1); border-color: rgba(97,220,133,.18); }
.calculator-launch small, .calculator-launch > b { color: var(--green); }
.rental-launch { margin-top: 8px; background: linear-gradient(135deg, rgba(85, 58, 20, .76), rgba(30, 39, 45, .92)); border-color: rgba(255, 195, 92, .24); }
.rental-launch .weather-launch-icon { background: rgba(255,195,92,.1); border-color: rgba(255,195,92,.2); }
.rental-launch small, .rental-launch > b { color: var(--amber); }

.warning-heading { margin-top: 24px; }
.operational-alerts { display: grid; gap: 7px; }
.alert-button { display: grid; grid-template-columns: 26px 1fr 34px; align-items: center; gap: 7px; min-height: 43px; padding: 7px 10px; background: rgba(10,34,47,.72); border: 1px solid var(--line); border-radius: 13px; text-align: left; }
.alert-button > span { font-size: 15px; text-align: center; }
.alert-button em { color: #bdd0d8; font-size: 10px; font-style: normal; font-weight: 700; }
.alert-button strong { display: grid; place-items: center; width: 31px; height: 27px; border-radius: 9px; font-size: 11px; }
.alert-red strong { color: var(--red); background: rgba(255,127,142,.1); }.alert-red { border-left-color: rgba(255,127,142,.55); }
.alert-amber strong { color: var(--amber); background: rgba(255,195,92,.1); }.alert-amber { border-left-color: rgba(255,195,92,.55); }
.alert-yellow strong { color: #d7cf35; background: rgba(215,207,53,.1); }.alert-yellow { border-left-color: rgba(215,207,53,.55); }
.alert-blue strong { color: var(--cyan); background: rgba(81,201,232,.1); }.alert-blue { border-left-color: rgba(81,201,232,.55); }

.section-heading, .screen-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.section-heading { margin: 27px 3px 13px; }
.section-heading.compact { margin-top: 24px; }
.section-heading h2, .screen-title h1 { margin: 4px 0 0; letter-spacing: -0.035em; }
.section-heading h2 { font-size: 20px; }
.screen-title { min-height: 64px; margin-bottom: 18px; }
.screen-title h1 { font-size: 29px; }

.count-badge {
  display: grid;
  place-items: center;
  min-width: 29px;
  height: 29px;
  padding: 0 8px;
  color: var(--green);
  background: rgba(97, 220, 133, 0.09);
  border: 1px solid rgba(97, 220, 133, 0.22);
  border-radius: 10px;
  font-size: 12px;
  font-weight: 800;
}
.count-badge.large { min-width: 45px; height: 40px; font-size: 14px; }

.job-list { display: grid; gap: 10px; }
.job-card {
  display: grid;
  grid-template-columns: 60px 1fr;
  min-width: 0;
  overflow: hidden;
  background: rgba(10, 34, 47, 0.92);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.13);
}
.job-card-editable { cursor: pointer; transition: border-color 160ms ease, transform 160ms ease, background 160ms ease; }
.job-card-editable:active { transform: scale(.992); background: rgba(12, 42, 57, .96); }
.job-card-editable:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.job-time { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 18px 7px; background: rgba(255, 255, 255, 0.018); border-right: 1px solid var(--line); }
.job-time strong { font-size: 11px; text-transform: capitalize; }
.job-time > span { width: 5px; height: 35px; border-radius: 999px; }
.job-main { min-width: 0; padding: 15px 14px 13px; }
.job-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.job-title-row h3 { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.job-title-row b { color: #dff7e5; font-size: 13px; }
.job-main > p { margin: 5px 0 9px; color: #afc2cb; font-size: 11px; }
.job-meta { display: grid; gap: 4px; color: var(--muted); font-size: 10px; }
.job-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-meta span:first-child > span { color: var(--cyan); margin-right: 3px; }
.job-actions { display: flex; align-items: center; gap: 7px; margin-top: 11px; }
.status { margin-right: auto; padding: 5px 8px; border-radius: 999px; font-size: 8px; font-weight: 850; text-transform: uppercase; }
.status.planned { color: #91e8aa; background: rgba(97, 220, 133, 0.09); }
.status.waiting { color: #ffd17c; background: rgba(255, 195, 92, 0.1); }
.status.done { color: #9eb2bc; background: rgba(158, 178, 188, 0.1); }
.job-actions a, .job-actions button { display: grid; place-items: center; width: 30px; height: 30px; color: var(--cyan); background: rgba(81, 201, 232, 0.08); border: 1px solid rgba(81, 201, 232, 0.14); border-radius: 9px; text-decoration: none; }
.job-actions button.edit { color: var(--cyan); }
.job-actions button.complete { color: var(--green); background: rgba(97, 220, 133, 0.08); border-color: rgba(97, 220, 133, 0.16); }

.bottom-nav {
  position: fixed;
  z-index: 40;
  left: 50%;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: min(540px, 100%);
  min-height: calc(66px + var(--safe-bottom));
  padding: 6px 7px var(--safe-bottom);
  transform: translateX(-50%);
  background: rgba(5, 19, 28, 0.93);
  border-top: 1px solid var(--line);
  backdrop-filter: blur(24px) saturate(145%);
}
.bottom-nav button { display: grid; justify-items: center; align-content: center; gap: 3px; min-width: 0; padding: 6px 2px; color: #66818e; background: none; border: 0; border-radius: 12px; }
.bottom-nav button > span:first-child { font-size: 21px; line-height: 20px; font-weight: 500; }
.bottom-nav button > span:last-child { overflow: hidden; max-width: 100%; font-size: 8px; font-weight: 750; text-overflow: ellipsis; }
.bottom-nav button.active { color: var(--green); background: rgba(97, 220, 133, 0.06); }

.calendar-card { padding: 15px 12px 12px; background: rgba(10, 34, 47, 0.92); border: 1px solid var(--line); border-radius: 22px; }
.month-nav { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; margin-bottom: 16px; }
.month-nav strong { text-align: center; text-transform: capitalize; font-size: 15px; }
.month-nav button { width: 36px; height: 36px; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; font-size: 25px; }
.weekdays, .month-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.weekdays span { padding: 5px 0 8px; color: #6e8995; font-size: 9px; font-weight: 800; text-align: center; }
.day { display: grid; place-items: center; align-content: center; gap: 4px; aspect-ratio: 1; min-width: 0; padding: 0; background: transparent; border: 1px solid transparent; border-radius: 13px; font-size: 12px; }
.day.today { color: var(--green); font-weight: 900; }
.day.selected { background: rgba(97, 220, 133, 0.12); border-color: rgba(97, 220, 133, 0.34); color: #effff3; font-weight: 900; }
.day i { display: flex; justify-content: center; gap: 2px; height: 3px; }
.day i b { width: 3px; height: 3px; border-radius: 50%; }

.search { display: flex; align-items: center; gap: 9px; height: 48px; margin-bottom: 12px; padding: 0 14px; color: var(--cyan); background: rgba(10, 34, 47, 0.9); border: 1px solid var(--line); border-radius: 15px; }
.search > span { font-size: 22px; }
.search input { width: 100%; color: var(--text); background: none; border: 0; outline: 0; font-size: 13px; }
.search input::placeholder { color: #69828e; }
.filter-row { display: flex; gap: 7px; margin: 0 -16px 12px; padding: 0 16px; overflow-x: auto; scrollbar-width: none; }
.filter-row::-webkit-scrollbar { display: none; }
.filter-row button { flex: 0 0 auto; padding: 8px 12px; color: #809ba7; background: transparent; border: 1px solid var(--line); border-radius: 999px; font-size: 10px; font-weight: 700; }
.filter-row button.active { color: #dff9e6; background: rgba(97, 220, 133, 0.1); border-color: rgba(97, 220, 133, 0.3); }
.result-count { margin: 0 4px 10px; color: #6f8995; font-size: 10px; }

.client-list { display: grid; gap: 9px; }
.client-card { display: grid; grid-template-columns: 43px minmax(0,1fr) 38px; align-items: center; gap: 11px; padding: 12px; background: rgba(10, 34, 47, 0.9); border: 1px solid var(--line); border-radius: 16px; }
.avatar { display: grid; place-items: center; width: 43px; height: 43px; color: var(--green); background: rgba(97,220,133,.1); border: 1px solid rgba(97,220,133,.18); border-radius: 14px; font-weight: 900; }
.client-card h3 { margin: 0; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.client-card p { margin: 4px 0; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.client-card small { color: #6e8c98; font-size: 9px; }
.client-card a { display: grid; place-items: center; width: 36px; height: 36px; color: var(--cyan); background: rgba(81,201,232,.08); border-radius: 12px; text-decoration: none; }
.client-card-open { cursor: pointer; }.client-card-open > b { color: #668391; font-size: 20px; }

.module-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.module { min-height: 115px; padding: 16px; background: rgba(10, 34, 47, 0.9); border: 1px solid var(--line); border-radius: 18px; }
.module-button { width: 100%; color: var(--text); text-align: left; cursor: pointer; }
.module span { color: var(--muted); font-size: 10px; }
.module strong { display: block; margin: 10px 0 2px; font-size: 29px; }
.module small { color: #66808d; font-size: 9px; }
.module-cyan { border-top-color: rgba(81,201,232,.6); }.module-cyan strong { color: var(--cyan); }
.module-amber { border-top-color: rgba(255,195,92,.6); }.module-amber strong { color: var(--amber); }
.module-violet { border-top-color: rgba(178,154,255,.6); }.module-violet strong { color: var(--violet); }
.module-red { border-top-color: rgba(255,127,142,.6); }.module-red strong { color: var(--red); }
.finance-card { margin-top: 10px; padding: 19px; background: linear-gradient(135deg, rgba(25,111,76,.58), rgba(10,53,52,.72)); border: 1px solid rgba(97,220,133,.22); border-radius: 20px; }
.finance-card > span { color: #a9cabc; font-size: 10px; }.finance-card > strong { display: block; margin: 6px 0 14px; font-size: 30px; }.finance-card div { display: flex; justify-content: space-between; color: #8fb2a6; }
.data-card { display: grid; gap: 9px; margin-top: 10px; padding: 19px; background: rgba(10,34,47,.92); border: 1px solid var(--line); border-radius: 20px; }
.data-card h2 { margin: 4px 0 7px; font-size: 19px; }.data-card p { margin: 0 0 8px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.data-button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 43px; color: #c7d7de; background: transparent; border: 1px solid var(--line); border-radius: 13px; font-size: 11px; font-weight: 800; }
.data-button.primary { color: #052115; background: var(--green); border-color: var(--green); }
.sms-settings-card, .client-sms-button { display: grid; grid-template-columns: 42px minmax(0,1fr) 16px; align-items: center; gap: 10px; width: 100%; min-height: 66px; margin-top: 10px; padding: 10px 12px; color: var(--text); text-align: left; background: rgba(81,201,232,.055); border: 1px solid rgba(81,201,232,.17); border-radius: 16px; }.sms-settings-card > span:first-child, .client-sms-button > span:first-child { display: grid; place-items: center; width: 42px; height: 42px; background: rgba(81,201,232,.08); border-radius: 12px; font-size: 20px; }.sms-settings-card > span:nth-child(2), .client-sms-button > span:nth-child(2) { display: grid; gap: 3px; min-width: 0; }.sms-settings-card strong, .client-sms-button strong { font-size: 11px; }.sms-settings-card small, .client-sms-button small { color: #7196a5; font-size: 8px; line-height: 1.35; }.sms-settings-card > b, .client-sms-button > b { color: var(--cyan); font-size: 21px; }
.deleted-archive-card { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 66px; margin-top: 10px; padding: 10px 12px; color: var(--text); text-align: left; background: rgba(255,127,142,.05); border: 1px solid rgba(255,127,142,.16); border-radius: 16px; }.deleted-archive-card > span:first-child { display: grid; place-items: center; width: 42px; height: 42px; background: rgba(255,127,142,.08); border-radius: 12px; font-size: 20px; }.deleted-archive-card > span:nth-child(2) { display: grid; gap: 3px; }.deleted-archive-card strong { font-size: 11px; }.deleted-archive-card small { color: #9a7279; font-size: 8px; line-height: 1.35; }.deleted-archive-card > b { min-width: 25px; padding: 5px 7px; color: #ffc0c8; background: rgba(255,127,142,.1); border-radius: 9px; font-size: 10px; text-align: center; }
.install-card { display: grid; grid-template-columns: 47px 1fr; gap: 12px; align-items: center; margin-top: 10px; padding: 14px; background: rgba(255,255,255,.025); border: 1px dashed rgba(151,191,209,.18); border-radius: 18px; }
.logo-mini img { width: 47px; height: 47px; object-fit: cover; border-radius: 14px; }.install-card h3 { margin: 0 0 4px; font-size: 13px; }.install-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.4; }

.empty { display: grid; justify-items: center; padding: 32px 20px; text-align: center; background: rgba(10,34,47,.52); border: 1px dashed rgba(151,191,209,.17); border-radius: 18px; }
.empty > div { display: grid; place-items: center; width: 42px; height: 42px; color: var(--green); background: rgba(97,220,133,.08); border-radius: 14px; font-size: 22px; }.empty h3 { margin: 12px 0 5px; font-size: 15px; }.empty p { max-width: 270px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }.empty button { margin-top: 14px; padding: 9px 13px; color: #052115; background: var(--green); border: 0; border-radius: 11px; font-size: 10px; font-weight: 800; }

.onboarding-backdrop, .sheet-backdrop {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  place-items: end center;
  padding: 14px;
  background: rgba(2, 10, 15, 0.76);
  backdrop-filter: blur(14px);
}
.onboarding { width: min(100%, 480px); padding: 29px 24px calc(24px + var(--safe-bottom)); background: #09202c; border: 1px solid rgba(151,191,209,.2); border-radius: 28px; box-shadow: 0 24px 70px rgba(0,0,0,.45); text-align: center; }
.onboarding img { width: 76px; height: 76px; margin-bottom: 14px; object-fit: cover; border-radius: 22px; box-shadow: 0 12px 35px rgba(0,0,0,.35); }
.onboarding h1 { margin: 8px auto 10px; max-width: 330px; font-size: 29px; line-height: 1.03; letter-spacing: -.045em; }.onboarding p { max-width: 370px; margin: 0 auto 20px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.onboard-primary, .onboard-secondary { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; border-radius: 14px; font-size: 11px; font-weight: 850; }
.onboard-primary { color: #052115; background: var(--green); }.onboard-secondary { margin-top: 8px; color: #b8cbd3; background: transparent; border: 1px solid var(--line); }
.onboarding small { display: block; margin-top: 13px; color: #617d89; font-size: 8px; }

.sheet-backdrop { padding: 0; }
.sheet { width: min(100%, 540px); max-height: 92dvh; padding: 9px 18px calc(18px + var(--safe-bottom)); overflow-y: auto; background: #09202c; border: 1px solid rgba(151,191,209,.2); border-bottom: 0; border-radius: 28px 28px 0 0; box-shadow: 0 -24px 70px rgba(0,0,0,.43); animation: sheet-up 260ms ease-out; }
.sheet-handle { width: 39px; height: 4px; margin: 1px auto 15px; background: #36515d; border-radius: 999px; }
.sheet-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }.sheet-title h2 { margin: 4px 0 0; font-size: 23px; }.sheet-title button { width: 36px; height: 36px; color: #97acb5; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; font-size: 24px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.form-grid label { display: grid; gap: 6px; color: #88a2ad; font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }.form-grid label.wide { grid-column: 1 / -1; }
.form-grid input, .form-grid select, .form-grid textarea { min-width: 0; height: 45px; padding: 0 12px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 12px; outline: none; font: inherit; font-size: 12px; text-transform: none; letter-spacing: 0; }.form-grid textarea { height: 86px; padding-top: 12px; resize: vertical; }.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { border-color: rgba(97,220,133,.55); box-shadow: 0 0 0 3px rgba(97,220,133,.07); }
.form-grid label.form-check { display: flex; grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 10px; min-height: 45px; padding: 10px 12px; color: #b7cbd4; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; text-transform: none; letter-spacing: 0; }
.form-grid label.form-check input { width: 19px; height: 19px; padding: 0; accent-color: var(--green); }
.edit-help { margin: -6px 0 14px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.photo-summary { margin-top: 10px; padding: 10px 12px; color: #a8bdc6; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; font-size: 9px; }
.save-job { width: 100%; min-height: 49px; margin-top: 16px; color: #052115; background: var(--green); border: 0; border-radius: 14px; font-size: 12px; font-weight: 900; }
.delete-job { width: 100%; min-height: 44px; margin-top: 9px; color: #ffacb6; background: rgba(255,127,142,.06); border: 1px solid rgba(255,127,142,.2); border-radius: 13px; font-size: 10px; font-weight: 850; }
.delete-confirm { margin-top: 10px; padding: 13px; background: rgba(255,127,142,.07); border: 1px solid rgba(255,127,142,.22); border-radius: 14px; }.delete-confirm > strong { color: #ffc2ca; font-size: 11px; }.delete-confirm > p { margin: 6px 0 11px; color: #a8888f; font-size: 9px; line-height: 1.45; }.delete-confirm > div { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }.delete-confirm button { min-height: 39px; color: #a9bbc2; background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 10px; font-size: 9px; font-weight: 850; }.delete-confirm button.confirm { color: #2b070c; background: var(--red); border-color: var(--red); }
.delete-confirm textarea { width: 100%; min-height: 76px; margin: 0 0 10px; padding: 10px 11px; color: var(--text); background: #0d2633; border: 1px solid rgba(255,127,142,.2); border-radius: 10px; outline: none; font: inherit; font-size: 10px; line-height: 1.45; resize: vertical; }.delete-confirm button:disabled { opacity: .45; }

.weather-sheet { max-height: 95dvh; }
.weather-toolbar { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-bottom: 12px; }
.weather-toolbar label { display: grid; gap: 5px; color: #88a2ad; font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.weather-toolbar select, .weather-toolbar button { height: 42px; padding: 0 11px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 12px; font-size: 11px; }
.weather-toolbar button { align-self: end; color: var(--cyan); font-weight: 800; }
.weather-loading, .weather-error, .weather-warning, .weather-all-good, .weather-cache-note { padding: 13px; border-radius: 13px; font-size: 10px; line-height: 1.45; }
.weather-loading { color: #a9c2cd; background: rgba(255,255,255,.035); }
.weather-error { color: #ffc0c8; background: rgba(255,127,142,.09); border: 1px solid rgba(255,127,142,.2); }
.weather-cache-note { color: #b9cfda; background: rgba(81,201,232,.07); border: 1px solid rgba(81,201,232,.16); }
.weather-warning { margin: 9px 0; color: #ffd18a; background: rgba(255,195,92,.08); border: 1px solid rgba(255,195,92,.18); }
.weather-all-good { margin: 9px 0; color: #a5edb9; background: rgba(97,220,133,.08); border: 1px solid rgba(97,220,133,.16); }
.weather-summary { display: grid; grid-template-columns: 50px 1fr auto; align-items: center; gap: 11px; padding: 14px; background: linear-gradient(135deg, rgba(25,98,112,.58), rgba(12,48,62,.84)); border: 1px solid rgba(81,201,232,.2); border-radius: 18px; }
.weather-summary > span { font-size: 32px; }.weather-summary > div { display: grid; gap: 2px; min-width: 0; }.weather-summary small { color: #8fcde0; font-size: 8px; font-weight: 850; letter-spacing: .06em; }.weather-summary strong { font-size: 21px; }.weather-summary p { margin: 0; overflow: hidden; color: #9fb9c3; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.weather-summary > b { padding: 6px 7px; border-radius: 8px; font-size: 8px; }
.summary-good > b, .weather-good > b { color: var(--green); background: rgba(97,220,133,.1); }.summary-caution > b, .weather-caution > b { color: var(--amber); background: rgba(255,195,92,.1); }.summary-danger > b, .weather-danger > b { color: var(--red); background: rgba(255,127,142,.1); }.summary-hot > b, .weather-hot > b { color: #ffb55d; background: rgba(255,181,93,.1); }
.weather-days { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(137px, 45%); gap: 8px; margin: 0 -18px; padding: 4px 18px 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }.weather-days::-webkit-scrollbar { display: none; }
.weather-card { display: grid; align-content: start; justify-items: center; min-height: 221px; padding: 13px 10px; scroll-snap-align: start; background: rgba(10,34,47,.9); border: 1px solid var(--line); border-top-width: 2px; border-radius: 16px; text-align: center; }.weather-good { border-top-color: rgba(97,220,133,.65); }.weather-caution, .weather-hot { border-top-color: rgba(255,195,92,.7); }.weather-danger { border-top-color: rgba(255,127,142,.7); }
.weather-card small { color: #8aa6b1; font-size: 8px; text-transform: capitalize; }.weather-card > span { margin: 8px 0 4px; font-size: 27px; }.weather-card > strong { font-size: 16px; }.weather-card p { margin: 7px 0; color: #8ea9b4; font-size: 9px; line-height: 1.6; }.weather-card > b { padding: 5px 7px; border-radius: 7px; font-size: 8px; }.weather-card em { margin-top: 8px; color: #6f8994; font-size: 8px; font-style: normal; line-height: 1.4; }
.weather-recommendations { padding: 15px; background: rgba(10,34,47,.84); border: 1px solid var(--line); border-radius: 17px; }.weather-recommendations > p { margin: 7px 0 11px; color: #a1b8c1; font-size: 10px; line-height: 1.45; }.weather-recommendations > div { display: grid; gap: 7px; }.weather-recommendations > div span { display: flex; justify-content: space-between; gap: 8px; color: #8fa9b4; font-size: 9px; }.weather-recommendations b { color: #dceae5; white-space: nowrap; }.weather-source { margin: 11px 2px 0; color: #5e7b88; font-size: 8px; text-align: right; }

.calculator-backdrop { z-index: 130; }
.calculator-sheet { max-height: 96dvh; }
.calculator-intro { margin: -5px 0 12px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.calculator-card { margin-bottom: 10px; padding: 14px; background: rgba(10,34,47,.88); border: 1px solid var(--line); border-radius: 16px; }
.problem-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 10px; }
.problem-grid label, .service-picker label { position: relative; display: flex; align-items: center; gap: 7px; min-width: 0; color: #8ea9b4; background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: 11px; font-size: 9px; line-height: 1.3; }
.problem-grid label { min-height: 44px; padding: 8px; }
.problem-grid label.checked, .service-picker label.checked { color: #dff7e6; background: rgba(97,220,133,.08); border-color: rgba(97,220,133,.28); }
.problem-grid input, .service-picker input { width: 16px; height: 16px; flex: 0 0 auto; accent-color: var(--green); }
.calculator-recommendation { margin-top: 9px; padding: 9px 10px; color: #91dab0; background: rgba(97,220,133,.06); border: 1px solid rgba(97,220,133,.14); border-radius: 10px; font-size: 9px; line-height: 1.45; }
.calculator-basics { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.calculator-basics label { display: grid; gap: 5px; color: #829da8; font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }.calculator-basics label:last-child { grid-column: 1 / -1; }
.calculator-basics input, .calculator-basics select { min-width: 0; height: 42px; padding: 0 10px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 11px; font-size: 11px; text-transform: none; }
.calculator-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 8px; padding: 4px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 13px; }.calculator-tabs button { min-height: 37px; color: #7894a0; background: transparent; border: 0; border-radius: 9px; font-size: 9px; font-weight: 800; }.calculator-tabs button.active { color: #062116; background: var(--green); }
.service-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.service-picker label { min-height: 52px; padding: 8px; }.service-picker label > span { display: grid; gap: 2px; min-width: 0; }.service-picker label small { color: #698691; font-size: 7px; }.service-picker label > b { margin-left: auto; color: #9eb7c1; font-size: 8px; white-space: nowrap; }
.package-picker { display: grid; gap: 7px; margin-bottom: 10px; }.package-picker button { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 65px; padding: 10px 12px; text-align: left; background: rgba(10,34,47,.88); border: 1px solid var(--line); border-radius: 14px; }.package-picker button.active { background: rgba(97,220,133,.08); border-color: rgba(97,220,133,.32); }.package-picker span { display: grid; gap: 3px; }.package-picker strong { font-size: 11px; }.package-picker small { color: #78929e; font-size: 8px; line-height: 1.35; }.package-picker b { color: var(--green); font-size: 10px; white-space: nowrap; }
.calculator-result { margin-bottom: 10px; padding: 16px; background: linear-gradient(135deg, rgba(18,78,62,.68), rgba(9,50,49,.85)); border: 1px solid rgba(97,220,133,.22); border-radius: 18px; }.calculator-result.error { background: rgba(10,34,47,.88); border-color: var(--line); }.calculator-result > strong { display: block; margin: 5px 0 10px; color: #dff9e7; font-size: 31px; letter-spacing: -.04em; }.calculator-result > p { margin: 0; color: #ffd18a; font-size: 10px; line-height: 1.45; }.calculator-result > div { display: grid; gap: 6px; }.calculator-result > div span, .calculator-result li { display: flex; justify-content: space-between; gap: 8px; color: #91afa4; font-size: 9px; }.calculator-result b { color: #e1f2e8; white-space: nowrap; }.calculator-result ul { display: grid; gap: 5px; margin: 11px 0 0; padding: 10px 0 0; border-top: 1px solid rgba(151,191,209,.12); list-style: none; }
.calculator-apply { width: 100%; min-height: 50px; color: #052115; background: var(--green); border: 0; border-radius: 14px; font-size: 11px; font-weight: 900; }.calculator-apply:disabled { color: #698079; background: #183229; opacity: .7; }
.calculator-settings-note { display: block; margin: 9px 3px 2px; color: #587481; font-size: 7px; line-height: 1.45; text-align: center; }
.new-job-calculator { display: grid; grid-template-columns: 40px 1fr 16px; align-items: center; gap: 9px; width: 100%; min-height: 58px; margin-top: 12px; padding: 9px 11px; text-align: left; background: rgba(97,220,133,.07); border: 1px solid rgba(97,220,133,.18); border-radius: 13px; }.new-job-calculator > span:first-child { display: grid; place-items: center; width: 40px; height: 40px; background: rgba(97,220,133,.08); border-radius: 11px; font-size: 20px; }.new-job-calculator > span:nth-child(2) { display: grid; gap: 2px; }.new-job-calculator strong { font-size: 11px; }.new-job-calculator small { color: #78998c; font-size: 8px; }.new-job-calculator > b { color: var(--green); font-size: 21px; }
.calculation-applied { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; margin-top: 8px; padding: 10px 12px; background: rgba(97,220,133,.06); border: 1px solid rgba(97,220,133,.14); border-radius: 12px; }.calculation-applied > span { color: #91dfaa; font-size: 9px; font-weight: 800; }.calculation-applied > strong { color: #dff7e6; font-size: 12px; }.calculation-applied > small { grid-column: 1 / -1; overflow: hidden; color: #6f8f83; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.client-sms-button { margin-top: 9px; border-radius: 13px; }

.sms-template-sheet, .sms-composer-sheet { max-height: 96dvh; }
.sms-template-intro { margin: -5px 0 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.sms-placeholder-help { display: grid; gap: 5px; margin-bottom: 12px; padding: 11px 12px; color: #7fa8b8; background: rgba(81,201,232,.045); border: 1px solid rgba(81,201,232,.14); border-radius: 12px; }.sms-placeholder-help strong { color: #b4d6e1; font-size: 9px; }.sms-placeholder-help span { overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 8px; line-height: 1.55; }
.sms-template-list { display: grid; gap: 10px; }.sms-template-list label, .sms-message-editor { display: grid; gap: 6px; color: #91aab5; font-size: 9px; font-weight: 850; }.sms-template-list textarea, .sms-message-editor textarea { width: 100%; min-height: 103px; padding: 11px 12px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 12px; outline: none; font: inherit; font-size: 10px; line-height: 1.5; resize: vertical; }.sms-template-list textarea:focus, .sms-message-editor textarea:focus { border-color: rgba(81,201,232,.48); box-shadow: 0 0 0 3px rgba(81,201,232,.06); }
.sms-template-item { display: grid; gap: 8px; padding: 11px; background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: 14px; }.sms-template-toolbar { display: grid; grid-template-columns: 75px minmax(0,1fr) auto; gap: 7px; align-items: end; }.sms-template-toolbar label { gap: 4px; }.sms-template-toolbar input, .sms-template-toolbar select { width: 100%; height: 39px; padding: 0 9px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 9px; font-size: 10px; }.sms-template-toolbar button { min-height: 39px; padding: 0 9px; color: #ffadb7; background: rgba(255,127,142,.05); border: 1px solid rgba(255,127,142,.16); border-radius: 9px; font-size: 8px; font-weight: 800; }
.sms-add-template { width: 100%; min-height: 44px; margin-top: 11px; color: #9fe9b5; background: rgba(97,220,133,.06); border: 1px solid rgba(97,220,133,.17); border-radius: 12px; font-size: 10px; font-weight: 850; }
.sms-reset { width: 100%; min-height: 41px; margin-top: 11px; color: #8ba6b1; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; font-size: 9px; font-weight: 800; }
.sms-composer-backdrop { z-index: 140; }
.sms-kind-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 12px; }.sms-kind-grid button { display: grid; place-items: center; gap: 4px; min-height: 58px; padding: 7px 4px; color: #77939f; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 11px; font-size: 8px; font-weight: 800; line-height: 1.15; }.sms-kind-grid button span { font-size: 17px; }.sms-kind-grid button.active { color: #dff8e6; background: rgba(97,220,133,.08); border-color: rgba(97,220,133,.27); }
.sms-message-editor textarea { min-height: 150px; }
.sms-recipient { display: grid; grid-template-columns: 70px 1fr; gap: 3px 9px; margin-top: 10px; padding: 11px 12px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; }.sms-recipient span { grid-row: 1 / 3; align-self: center; color: #6e8a96; font-size: 8px; font-weight: 850; text-transform: uppercase; }.sms-recipient strong { font-size: 10px; }.sms-recipient small { color: #78949f; font-size: 9px; }
.sms-error { margin-top: 9px; padding: 10px; color: #ffc0c8; background: rgba(255,127,142,.08); border: 1px solid rgba(255,127,142,.19); border-radius: 11px; font-size: 9px; }
.sms-send { width: 100%; min-height: 49px; margin-top: 12px; color: #052115; background: var(--green); border: 0; border-radius: 14px; font-size: 11px; font-weight: 900; }.sms-send:disabled { color: #71817b; background: #173228; opacity: .7; }.sms-send-note { margin: 9px 4px 0; color: #607c87; font-size: 8px; line-height: 1.45; text-align: center; }

.client-detail-card { display: grid; gap: 6px; padding: 13px; color: #9db3bc; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 14px; font-size: 10px; }.client-value-row, .rental-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }.client-value-row > div, .rental-summary > div { display: grid; gap: 4px; padding: 12px; background: rgba(97,220,133,.045); border: 1px solid rgba(97,220,133,.13); border-radius: 12px; }.client-value-row small, .rental-summary small { color: #789189; font-size: 8px; }.client-value-row strong, .rental-summary strong { color: #c9f0d5; font-size: 15px; }.client-job-history { display: grid; gap: 6px; margin-top: 10px; }.client-job-history > div { display: grid; grid-template-columns: 52px minmax(0,1fr) auto; gap: 8px; padding: 9px 10px; background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: 10px; }.client-job-history span { color: #75909a; font-size: 8px; }.client-job-history strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.client-job-history b { color: var(--green); font-size: 9px; }

.rental-editor-backdrop { z-index: 145; }.tool-rentals-sheet, .rental-editor-sheet, .deleted-archive-sheet { max-height: 96dvh; }.tool-icon-preview { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 10px; margin-bottom: 11px; padding: 11px; background: rgba(255,195,92,.05); border: 1px solid rgba(255,195,92,.14); border-radius: 14px; }.tool-icon-preview > span { display: grid; place-items: center; width: 48px; height: 48px; background: rgba(255,195,92,.09); border-radius: 13px; font-size: 25px; }.tool-icon-preview > div { display: grid; gap: 4px; }.tool-icon-preview strong { font-size: 12px; }.tool-icon-preview small { color: #b69b68; font-size: 9px; }.rental-total { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding: 12px; color: #839ba5; background: rgba(255,195,92,.055); border: 1px solid rgba(255,195,92,.15); border-radius: 12px; font-size: 9px; }.rental-total strong { color: var(--amber); font-size: 17px; }.new-rental-button { width: 100%; min-height: 46px; margin: 10px 0; color: #302100; background: var(--amber); border: 0; border-radius: 13px; font-size: 10px; font-weight: 900; }.rental-list { display: grid; gap: 8px; }.rental-list > button { display: grid; grid-template-columns: 45px minmax(0,1fr) auto; align-items: center; gap: 9px; width: 100%; min-height: 74px; padding: 10px; color: var(--text); text-align: left; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 14px; }.rental-tool-icon { display: grid; place-items: center; width: 45px; height: 45px; background: rgba(255,195,92,.08); border-radius: 12px; font-size: 22px; }.rental-list > button > span:nth-child(2) { display: grid; gap: 3px; min-width: 0; }.rental-list strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.rental-list small, .rental-list em { color: #728c97; font-size: 8px; font-style: normal; }.rental-list em { color: #b5a069; }.rental-list b { color: var(--amber); font-size: 10px; white-space: nowrap; }
.rental-quick-form { padding-bottom: calc(20px + env(safe-area-inset-bottom)); }.rental-form-step { display: grid; gap: 10px; margin-bottom: 12px; padding: 12px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 16px; }.rental-step-title { display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 9px; }.rental-step-title > span { display: grid; place-items: center; width: 30px; height: 30px; color: #052115; background: var(--green); border-radius: 10px; font-size: 11px; font-weight: 950; }.rental-step-title > div { display: grid; gap: 2px; }.rental-step-title strong { font-size: 11px; }.rental-step-title small { color: #77919c; font-size: 8px; }.rental-tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; }.rental-tool-grid button { position: relative; display: grid; grid-template-columns: 31px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 2px 7px; min-height: 62px; padding: 8px 28px 8px 8px; color: var(--text); text-align: left; background: #0d2936; border: 1px solid rgba(151,191,209,.13); border-radius: 12px; }.rental-tool-grid button > span { grid-row: 1 / 3; display: grid; place-items: center; width: 31px; height: 31px; background: rgba(255,195,92,.08); border-radius: 9px; font-size: 17px; }.rental-tool-grid button strong { overflow: hidden; font-size: 9px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }.rental-tool-grid button small { color: #8ba0a8; font-size: 7px; }.rental-tool-grid button b { position: absolute; top: 7px; right: 7px; display: grid; place-items: center; width: 17px; height: 17px; color: #78909a; background: rgba(255,255,255,.04); border-radius: 6px; font-size: 10px; }.rental-tool-grid button.selected { background: rgba(97,220,133,.09); border-color: rgba(97,220,133,.48); box-shadow: inset 0 0 0 1px rgba(97,220,133,.08); }.rental-tool-grid button.selected b { color: #052115; background: var(--green); }.rental-date-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.65fr); gap: 8px; }.rental-date-grid label, .rental-field { display: grid; gap: 5px; color: #88a2ad; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }.rental-date-grid input, .rental-field input, .rental-field select { width: 100%; min-width: 0; height: 45px; padding: 0 11px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 11px; outline: none; font: inherit; font-size: 11px; text-transform: none; letter-spacing: 0; }.rental-date-grid input:focus, .rental-field input:focus, .rental-field select:focus { border-color: rgba(97,220,133,.55); box-shadow: 0 0 0 3px rgba(97,220,133,.07); }.rental-calculation { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 10px 11px; background: rgba(255,195,92,.055); border: 1px solid rgba(255,195,92,.14); border-radius: 11px; }.rental-calculation > div { display: grid; gap: 3px; }.rental-calculation > div:last-child { text-align: right; }.rental-calculation small { color: #9a895f; font-size: 8px; }.rental-calculation strong { color: #dfca91; font-size: 10px; }.rental-calculation > div:last-child strong { color: var(--amber); font-size: 16px; }.rental-phone-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 7px; }.rental-phone-row > button { min-height: 45px; padding: 0 12px; color: #c8d8df; background: rgba(255,255,255,.045); border: 1px solid var(--line); border-radius: 11px; font-size: 9px; font-weight: 850; }.rental-contact-note { margin: -1px 1px 0; color: #6f8994; font-size: 8px; line-height: 1.45; }.rental-extra { margin-bottom: 12px; padding: 0 11px; background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: 13px; }.rental-extra summary { padding: 12px 0; color: #a8bdc5; cursor: pointer; font-size: 9px; font-weight: 850; list-style-position: inside; }.rental-extra summary span { float: right; color: #667e88; font-size: 8px; font-weight: 600; }.rental-extra[open] .form-grid { padding-bottom: 12px; }.rental-sms-ready { display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 9px; padding: 11px; background: rgba(97,220,133,.055); border: 1px solid rgba(97,220,133,.16); border-radius: 13px; }.rental-sms-ready > span { display: grid; place-items: center; width: 35px; height: 35px; background: rgba(97,220,133,.09); border-radius: 10px; font-size: 17px; }.rental-sms-ready > div { display: grid; gap: 3px; }.rental-sms-ready strong { color: #c9efd5; font-size: 10px; }.rental-sms-ready small { color: #79988a; font-size: 8px; line-height: 1.35; }.rental-inline-error { padding: 10px 11px; color: #ffd1c8; background: rgba(255,91,76,.08); border: 1px solid rgba(255,91,76,.2); border-radius: 11px; font-size: 9px; }.rental-save-sms { min-height: 53px; font-size: 11px; }

.archive-loss { display: grid; gap: 4px; padding: 15px; background: linear-gradient(135deg, rgba(105,36,51,.65), rgba(64,31,43,.72)); border: 1px solid rgba(255,127,142,.2); border-radius: 16px; }.archive-loss span { color: #d2a2a9; font-size: 9px; }.archive-loss strong { color: #ffd0d5; font-size: 27px; }.archive-loss small { color: #a77f85; font-size: 8px; }.archive-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 10px 0; padding: 4px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; }.archive-tabs button { min-height: 36px; color: #78919b; background: transparent; border: 0; border-radius: 9px; font-size: 9px; font-weight: 800; }.archive-tabs button.active { color: #2b070c; background: var(--red); }.archive-list { display: grid; gap: 8px; }.archive-list details { background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: 13px; overflow: hidden; }.archive-list summary { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 11px; cursor: pointer; list-style: none; }.archive-list summary::-webkit-details-marker { display: none; }.archive-list summary > span:first-child { font-size: 18px; }.archive-list summary > span:nth-child(2) { display: grid; gap: 3px; }.archive-list summary strong { font-size: 10px; }.archive-list summary small { color: #728b96; font-size: 8px; }.archive-list summary b { color: #ffadb7; font-size: 10px; }.archive-list details > div { padding: 0 12px 11px; border-top: 1px solid rgba(151,191,209,.08); }.archive-list p { margin: 8px 0 0; color: #8ea6b0; font-size: 9px; line-height: 1.5; }.archive-list p strong { color: #b8cbd2; }

.alert-description { margin: -5px 0 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.alert-total { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 10px 12px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; }.alert-total span { color: #829eaa; font-size: 9px; }.alert-total strong { color: var(--amber); font-size: 16px; }
.alert-job-list { padding-bottom: 8px; }.alert-job { display: grid; gap: 6px; }.arrival-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: -2px 8px 5px; }.arrival-actions button { min-height: 38px; border-radius: 11px; font-size: 8px; font-weight: 800; }.arrival-message { color: #9edff0; background: rgba(81,201,232,.07); border: 1px solid rgba(81,201,232,.16); }.arrival-notify { color: #a7edba; background: rgba(97,220,133,.07); border: 1px solid rgba(97,220,133,.16); }
.notification-sheet { max-height: 94dvh; }
.notification-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 10px; padding: 4px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 13px; }
.notification-tabs button { min-height: 39px; color: #7894a0; background: transparent; border: 0; border-radius: 9px; font-size: 10px; font-weight: 850; }.notification-tabs button.active { color: #062116; background: var(--green); }.notification-tabs b { margin-left: 4px; }
.read-all { width: 100%; min-height: 38px; margin-bottom: 9px; color: #9fe9b5; background: rgba(97,220,133,.06); border: 1px solid rgba(97,220,133,.16); border-radius: 11px; font-size: 9px; font-weight: 850; }
.notification-list { display: grid; gap: 8px; }
.notification-item { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 66px; padding: 11px 12px; text-align: left; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 14px; }
.notification-item:disabled { opacity: 1; }.notification-item.unread { background: rgba(255,195,92,.055); border-color: rgba(255,195,92,.19); }.notification-dot { width: 7px; height: 7px; background: #526d79; border-radius: 999px; }.notification-item.unread .notification-dot { background: var(--amber); box-shadow: 0 0 0 4px rgba(255,195,92,.08); }.notification-item > span:nth-child(2) { display: grid; gap: 5px; min-width: 0; }.notification-item strong { color: #d9e8e5; font-size: 10px; line-height: 1.38; }.notification-item small { color: #6f8b97; font-size: 8px; }.notification-item em { color: #728d98; font-size: 8px; font-style: normal; font-weight: 800; }.notification-item.unread em { color: var(--amber); }
.notification-empty { padding: 28px 18px; color: #86a1ac; background: rgba(255,255,255,.02); border: 1px dashed var(--line); border-radius: 14px; font-size: 10px; line-height: 1.5; text-align: center; }
.device-identity { display: grid; gap: 6px; margin-top: 12px; padding: 12px; color: #8ba5b0; background: rgba(81,201,232,.035); border: 1px solid rgba(81,201,232,.13); border-radius: 13px; font-size: 9px; font-weight: 800; }.device-identity input { width: 100%; height: 41px; padding: 0 11px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 10px; outline: none; font-size: 11px; }.device-identity small { color: #587681; font-size: 8px; font-weight: 500; line-height: 1.4; }
.notification-note { margin: 11px 3px 0; color: #55717d; font-size: 8px; line-height: 1.45; text-align: center; }
.notification-detail-sheet { max-height: 95dvh; }
.audit-hero { padding: 14px; background: linear-gradient(135deg, rgba(17,68,77,.72), rgba(10,42,55,.92)); border: 1px solid rgba(81,201,232,.16); border-radius: 16px; }.audit-hero h3 { margin: 9px 0 11px; font-size: 14px; line-height: 1.35; }.audit-hero > div { display: grid; gap: 5px; color: #91aab5; font-size: 9px; }.audit-hero b { color: #c5d8df; }.audit-action { display: inline-flex; padding: 5px 8px; color: #9ce9b1; background: rgba(97,220,133,.09); border-radius: 999px; font-size: 8px; font-weight: 900; text-transform: uppercase; }.audit-action.action-deleted { color: #ffb4bd; background: rgba(255,127,142,.1); }.audit-action.action-updated { color: #ffd18a; background: rgba(255,195,92,.1); }
.audit-section { margin-top: 12px; }.audit-section > .eyebrow { display: block; margin: 0 2px 7px; }.audit-changes, .audit-details { display: grid; gap: 6px; margin: 0; }.audit-changes > div { display: grid; grid-template-columns: minmax(72px,.8fr) minmax(0,1fr) 12px minmax(0,1fr); align-items: center; gap: 6px; padding: 9px 10px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 11px; }.audit-changes strong { color: #a9bec7; font-size: 8px; }.audit-changes span { overflow-wrap: anywhere; color: #819aa5; font-size: 8px; }.audit-changes b { color: var(--amber); font-size: 10px; text-align: center; }
.audit-details > div { display: grid; grid-template-columns: 105px minmax(0,1fr); gap: 9px; padding: 8px 10px; background: rgba(255,255,255,.02); border-bottom: 1px solid rgba(151,191,209,.09); }.audit-details dt { color: #718d99; font-size: 8px; font-weight: 800; }.audit-details dd { margin: 0; overflow-wrap: anywhere; color: #c0d1d7; font-size: 9px; line-height: 1.4; }
.open-audit-job { width: 100%; min-height: 47px; margin-top: 14px; color: #052115; background: var(--green); border: 0; border-radius: 13px; font-size: 10px; font-weight: 900; }.deleted-audit-note { margin-top: 12px; padding: 11px; color: #c49198; background: rgba(255,127,142,.06); border: 1px solid rgba(255,127,142,.16); border-radius: 12px; font-size: 9px; line-height: 1.45; }
.toast { position: fixed; z-index: 150; left: 50%; bottom: calc(82px + var(--safe-bottom)); width: max-content; max-width: calc(100% - 36px); padding: 11px 15px; transform: translateX(-50%); color: #e8f4ef; background: #173646; border: 1px solid rgba(151,191,209,.2); border-radius: 13px; box-shadow: 0 12px 35px rgba(0,0,0,.35); font-size: 10px; font-weight: 750; text-align: center; animation: toast-in 180ms ease-out; }

@keyframes enter { from { opacity: 0; transform: translateY(5px); } }
@keyframes sheet-up { from { transform: translateY(100%); } }
@keyframes toast-in { from { opacity: 0; transform: translate(-50%, 8px); } }
@keyframes pulse { 50% { opacity: .3; } }
@keyframes bell-pulse { 0%, 85%, 100% { transform: rotate(0); } 90% { transform: rotate(-8deg); } 95% { transform: rotate(8deg); } }

@media (min-width: 600px) {
  body { padding: 20px 0; }
  .app-shell { min-height: calc(100dvh - 40px); border: 1px solid rgba(151,191,209,.12); border-radius: 30px; }
  .bottom-nav { bottom: 20px; border-radius: 0 0 30px 30px; }
  .onboarding-backdrop, .sheet-backdrop { place-items: center; }
  .sheet { border: 1px solid rgba(151,191,209,.2); border-radius: 28px; }
}

@media (max-width: 370px) {
  .topbar { padding-left: 12px; padding-right: 12px; }
  .brand small { display: none; }
  .sync-pill { padding-left: 8px; padding-right: 8px; }
  .screen { padding-left: 12px; padding-right: 12px; }
  .hero { min-height: 175px; padding: 20px 16px; }
  .hero-add { width: 57px; height: 57px; border-radius: 19px; }
  .job-card { grid-template-columns: 54px 1fr; }
  .metrics-scroll { margin-left: -12px; margin-right: -12px; padding-left: 12px; padding-right: 12px; }
}

.job-actions button.remove { margin-left: auto; color: #ff8e83; background: rgba(255,91,76,.07); border-color: rgba(255,91,76,.18); font-size: 18px; }
.job-actions button.message { color: var(--amber); background: rgba(255,195,92,.08); border-color: rgba(255,195,92,.18); font-size: 13px; }
.employee-notice-launch { background: linear-gradient(135deg, rgba(25,75,66,.88), rgba(25,42,51,.94)); border-color: rgba(97,220,133,.2); }
.employee-notice-launch .weather-launch-icon { background: rgba(97,220,133,.1); border-color: rgba(97,220,133,.2); }
.employee-notice-launch small, .employee-notice-launch > b { color: var(--green); }
.upcoming-rent-heading { margin-top: 22px; }
.home-rental-list { display: grid; gap: 8px; }
.home-rental-list > button { display: grid; grid-template-columns: 16px minmax(0,1fr) auto; align-items: center; gap: 9px; width: 100%; min-height: 62px; padding: 10px; color: var(--text); text-align: left; background: rgba(255,195,92,.035); border: 1px solid rgba(255,195,92,.12); border-radius: 13px; }
.home-rental-colors { display: grid; gap: 3px; }
.home-rental-colors i { width: 5px; height: 12px; border-radius: 4px; }
.home-rental-list > button > span:nth-child(2) { display: grid; gap: 4px; min-width: 0; }
.home-rental-list strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.home-rental-list small { overflow: hidden; color: #7f98a2; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.home-rental-list b { color: var(--amber); font-size: 10px; white-space: nowrap; }
.home-rental-empty { padding: 13px; color: #708994; text-align: center; background: rgba(255,255,255,.02); border: 1px dashed var(--line); border-radius: 12px; font-size: 9px; }

.rental-calendar-panel { display: grid; gap: 9px; margin: 4px 0 15px; padding: 11px; background: rgba(255,255,255,.022); border: 1px solid var(--line); border-radius: 15px; }
.rental-calendar-filter label { display: grid; gap: 5px; color: #829ca7; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.rental-calendar-filter select { width: 100%; height: 43px; padding: 0 11px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 11px; outline: none; font: inherit; font-size: 10px; text-transform: none; }
.rental-month-nav { display: grid; grid-template-columns: 35px 1fr 35px; align-items: center; gap: 6px; }
.rental-month-nav button { display: grid; place-items: center; width: 35px; height: 35px; color: #9eb3bc; background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 10px; }
.rental-month-nav strong { text-align: center; font-size: 11px; text-transform: capitalize; }
.rental-weekdays, .rental-month-grid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 4px; }
.rental-weekdays span { color: #67808b; text-align: center; font-size: 7px; font-weight: 850; }
.rental-calendar-day { display: grid; align-content: space-between; min-width: 0; min-height: 45px; padding: 5px 3px; color: #a8bcc4; background: rgba(255,255,255,.025); border: 1px solid transparent; border-radius: 9px; }
.rental-calendar-day.blank { background: transparent; }
.rental-calendar-day.today { border-color: rgba(255,195,92,.35); }
.rental-calendar-day.selected { color: #071d15; background: var(--green); border-color: var(--green); }
.rental-calendar-day > span { font-size: 8px; font-weight: 850; }
.rental-calendar-day > i { display: flex; justify-content: center; flex-wrap: wrap; gap: 2px; min-height: 9px; font-style: normal; }
.rental-calendar-day > i b { width: 7px; height: 7px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; }
.rental-calendar-day > i em { color: inherit; font-size: 6px; font-style: normal; }
.rental-calendar-legend { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 2px; }
.rental-calendar-legend button { display: inline-flex; align-items: center; gap: 5px; min-height: 27px; padding: 4px 7px; color: #93aab3; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 8px; font-size: 7px; }
.rental-calendar-legend i { width: 8px; height: 8px; border-radius: 50%; }
.rental-day-heading { display: flex; align-items: center; justify-content: space-between; padding-top: 8px; border-top: 1px solid var(--line); }
.rental-day-heading span { color: #78929c; font-size: 8px; }
.rental-day-heading strong { font-size: 9px; }
.rental-day-list { display: grid; gap: 6px; }
.rental-day-list > button { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: 7px; width: 100%; padding: 8px; color: var(--text); text-align: left; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 10px; }
.rental-day-list > button > span:first-child { display: grid; gap: 2px; }
.rental-day-list > button > span:first-child i { width: 11px; height: 4px; border-radius: 3px; }
.rental-day-list > button > span:nth-child(2) { display: grid; gap: 3px; min-width: 0; }
.rental-day-list strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.rental-day-list small { color: #758d97; font-size: 7px; }
.rental-day-list b { color: var(--amber); font-size: 8px; }
.rental-register-heading { margin-top: 4px; }

.completion-backdrop, .job-delete-backdrop { z-index: 155; }
.completion-sheet, .job-delete-sheet { max-height: 94dvh; }
.completion-client, .delete-job-summary { display: grid; gap: 4px; padding: 12px; background: rgba(97,220,133,.045); border: 1px solid rgba(97,220,133,.14); border-radius: 13px; }
.completion-client span, .delete-job-summary span { color: #78928a; font-size: 8px; }
.completion-client strong, .delete-job-summary strong { font-size: 11px; }
.completion-client small { color: #92aaa2; font-size: 9px; }
.delete-job-summary b { color: #ff9c91; font-size: 9px; }
.completion-message { display: grid; gap: 6px; margin-top: 11px; color: #88a2ad; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.completion-message textarea { min-height: 220px; padding: 12px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 12px; outline: none; font: inherit; font-size: 10px; line-height: 1.55; resize: vertical; text-transform: none; letter-spacing: 0; }
.job-delete-sheet .completion-message textarea { min-height: 92px; }
.completion-message textarea:focus { border-color: rgba(97,220,133,.55); box-shadow: 0 0 0 3px rgba(97,220,133,.07); }
.completion-note { color: #718a94; font-size: 8px; line-height: 1.5; }
.completion-actions { display: grid; grid-template-columns: 1fr 1.2fr; gap: 8px; margin-top: 12px; }
.completion-actions button { min-height: 49px; padding: 8px; color: #a9bec6; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; font-size: 9px; font-weight: 850; }
.completion-actions button.send { color: #052115; background: var(--green); border-color: var(--green); }
.completion-actions button.delete { color: #fff; background: #9e4037; border-color: #b85045; }
.completion-actions button:disabled { opacity: .42; }

.employee-notice-backdrop { z-index: 155; }
.employee-notice-sheet { max-height: 96dvh; }
.employee-notice-intro { color: #849ca6; font-size: 9px; line-height: 1.5; }
.employee-select-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 10px 0; }
.employee-select-actions button { min-height: 37px; color: #a8bdc5; background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 10px; font-size: 8px; font-weight: 850; }
.employee-contact-list { display: grid; gap: 8px; }
.employee-contact-list > div { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); align-items: end; gap: 8px; padding: 9px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; }
.employee-contact-list > div.selected { background: rgba(97,220,133,.055); border-color: rgba(97,220,133,.2); }
.employee-check { display: grid; grid-template-columns: 20px 25px minmax(0,1fr); align-items: center; gap: 5px; min-height: 43px; }
.employee-check input { width: 18px; height: 18px; accent-color: var(--green); }
.employee-check > span { font-size: 16px; }
.employee-check strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.employee-phone { display: grid; gap: 4px; color: #78929d; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.employee-phone input { width: 100%; min-width: 0; height: 41px; padding: 0 9px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 9px; outline: none; font: inherit; font-size: 10px; text-transform: none; }
.employee-phone input:focus { border-color: rgba(97,220,133,.55); }
.employee-schedule-count { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding: 10px; color: #829ba5; background: rgba(81,201,232,.04); border: 1px solid rgba(81,201,232,.13); border-radius: 11px; font-size: 8px; }
.employee-schedule-count strong { color: var(--cyan); font-size: 11px; }
.employee-message-preview { display: grid; gap: 6px; margin-top: 10px; color: #88a2ad; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.employee-message-preview textarea { min-height: 245px; padding: 12px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 12px; outline: none; font: inherit; font-size: 10px; line-height: 1.5; resize: vertical; text-transform: none; letter-spacing: 0; }
.employee-message-preview textarea:focus { border-color: rgba(97,220,133,.55); box-shadow: 0 0 0 3px rgba(97,220,133,.07); }
.employee-send-button { min-height: 52px; }

.rental-date-grid select { width: 100%; min-width: 0; height: 45px; padding: 0 11px; color: var(--text); background: #0d2a38; border: 1px solid rgba(151,191,209,.16); border-radius: 11px; outline: none; font: inherit; font-size: 11px; }
.rental-date-grid select:focus { border-color: rgba(97,220,133,.55); box-shadow: 0 0 0 3px rgba(97,220,133,.07); }
.rental-date-grid label.rental-days-field { grid-column: 1 / -1; }

.form-grid .job-dropdown-field { display: grid; gap: 6px; }
.form-grid .job-dropdown-field.wide { grid-column: 1 / -1; }
.form-grid .job-dropdown-field > label { color: #88a2ad; font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.job-choice-chips { display: flex; flex-wrap: wrap; gap: 6px; min-height: 27px; }
.job-choice-chips > button { display: inline-flex; align-items: center; gap: 7px; min-height: 29px; padding: 5px 8px 5px 10px; color: #c9efd5; background: rgba(97,220,133,.08); border: 1px solid rgba(97,220,133,.22); border-radius: 999px; font-size: 9px; font-weight: 800; text-align: left; }
.job-choice-chips > button b { display: grid; place-items: center; width: 17px; height: 17px; color: #8cb99a; background: rgba(0,0,0,.18); border-radius: 50%; font-size: 12px; }
.job-choice-chips.employee-chips > button { color: #d5c7f6; background: rgba(192,156,255,.08); border-color: rgba(192,156,255,.2); }
.job-choice-chips > small { padding: 6px 2px; color: #6f8994; font-size: 8px; }

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

/* WEB REQUESTS DEV */
.website-requests-sheet { max-height: 92dvh; }
.website-request-list { display: grid; gap: 10px; overflow-y: auto; padding-bottom: 12px; }
.website-request-card { display: grid; gap: 9px; padding: 13px; background: rgba(10,34,47,.94); border: 1px solid var(--line); border-radius: 16px; }
.website-request-head { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 8px; }
.website-request-head > span { font-size: 20px; }
.website-request-head > div { display: grid; gap: 2px; min-width: 0; }
.website-request-head strong { font-size: 12px; }
.website-request-head small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.website-request-head b { color: var(--amber); font-size: 8px; }
.website-request-card p { margin: 0; color: #b6cbd4; font-size: 9px; line-height: 1.45; }
.website-availability { padding: 7px 9px; border-radius: 10px; font-size: 9px; font-weight: 850; }
.website-free { color: var(--green); background: rgba(97,220,133,.08); border: 1px solid rgba(97,220,133,.2); }
.website-busy { color: var(--red); background: rgba(255,127,142,.08); border: 1px solid rgba(255,127,142,.2); }
.website-review, .website-info, .website-error { color: var(--amber); background: rgba(255,195,92,.08); border: 1px solid rgba(255,195,92,.2); }
.website-request-actions { display: flex; gap: 7px; }
.website-request-actions button { flex: 1; min-height: 38px; border: 1px solid rgba(97,220,133,.22); border-radius: 11px; background: rgba(97,220,133,.1); color: var(--green); font-size: 9px; font-weight: 850; }
.website-request-actions button:disabled { opacity: .4; }
.website-request-actions button.danger { color: var(--red); background: rgba(255,127,142,.08); border-color: rgba(255,127,142,.18); }


/* WORKFLOW FIX26 – iPhone website live messages */
.message-bell { color: var(--green); }
.messages-backdrop { z-index: 190; align-items: stretch; }
.messages-sheet { width: min(760px, 100%); max-height: 100dvh; height: 100dvh; margin: 0 auto; border-radius: 0; overflow: hidden; }
.messages-sync-note { margin: 0 0 10px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.messages-search { display: grid; gap: 5px; margin-bottom: 9px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.messages-search input { width: 100%; }
.messages-mobile-layout { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; height: calc(100dvh - 180px); }
.messages-client-list { display: grid; align-content: start; gap: 7px; overflow-y: auto; min-height: 0; padding: 2px 1px 12px; }
.messages-client { display: grid; gap: 5px; width: 100%; padding: 12px; text-align: left; background: rgba(11,36,49,.9); border: 1px solid var(--line); border-radius: 15px; }
.messages-client > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.messages-client strong { overflow: hidden; color: #edf8fb; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.messages-client small { color: #7e9aa5; font-size: 9px; }
.messages-client p { overflow: hidden; margin: 0; color: #aac0c8; font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.messages-client.active { border-color: rgba(97,220,133,.55); background: rgba(20,69,55,.72); }
.chat-status { flex: 0 0 auto; padding: 4px 7px; color: #9fb5be; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 999px; font-size: 8px; font-style: normal; font-weight: 900; letter-spacing: .04em; }
.status-new { color: #7ef0a0; border-color: rgba(97,220,133,.35); }
.status-active { color: #7bdcf0; border-color: rgba(81,201,232,.35); }
.status-waiting_client { color: #ffd17a; border-color: rgba(255,195,92,.35); }
.status-closed { color: #7e9199; }
.messages-thread-panel { display: none; min-height: 0; }
.messages-client-list.has-selection + .messages-thread-panel { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; position: absolute; inset: 0; z-index: 3; background: #071b27; }
.messages-mobile-layout { position: relative; }
.messages-thread-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 10px 2px 10px; border-bottom: 1px solid var(--line); }
.messages-thread-head > div { display: grid; gap: 2px; min-width: 0; }
.messages-thread-head strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.messages-thread-head small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.messages-back { padding: 7px 8px; color: var(--cyan); background: rgba(81,201,232,.07); border: 1px solid rgba(81,201,232,.18); border-radius: 10px; font-size: 10px; }
.messages-thread { display: flex; flex-direction: column; gap: 8px; overflow-y: auto; min-height: 0; padding: 12px 3px; }
.chat-bubble { align-self: flex-start; max-width: 88%; padding: 10px 11px; background: rgba(255,255,255,.045); border: 1px solid var(--line); border-radius: 14px 14px 14px 5px; }
.chat-bubble.operator { align-self: flex-end; background: rgba(42,132,80,.18); border-color: rgba(97,220,133,.28); border-radius: 14px 14px 5px 14px; }
.chat-bubble.pending { opacity: .7; border-style: dashed; }
.chat-bubble small { display: block; margin-bottom: 4px; color: #7f9aa5; font-size: 8px; font-weight: 850; }
.chat-bubble p { margin: 0; color: #e3eff2; font-size: 12px; line-height: 1.45; white-space: pre-wrap; }
.messages-compose { display: grid; gap: 7px; padding: 9px 2px 4px; border-top: 1px solid var(--line); }
.messages-compose textarea { min-height: 70px; max-height: 110px; resize: vertical; }
.messages-compose > div { display: flex; gap: 7px; }
.messages-send { flex: 1; color: #052114; background: var(--green); border-color: var(--green); font-weight: 900; }
.messages-close-chat { color: #ffb1ab; background: rgba(223,78,65,.08); border-color: rgba(223,78,65,.28); }
.messages-closed { padding: 12px; color: #8fa3ab; text-align: center; border-top: 1px solid var(--line); }
.messages-empty { display: grid; gap: 5px; place-items: center; min-height: 180px; color: var(--muted); text-align: center; }
.messages-empty strong { color: #d7e8ed; }
@media (min-width: 680px) {
  .messages-sheet { height: min(760px, 92dvh); margin: auto; border-radius: 24px; }
  .messages-mobile-layout { grid-template-columns: 280px minmax(0, 1fr); gap: 10px; height: calc(min(760px, 92dvh) - 180px); }
  .messages-thread-panel { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; position: static !important; }
  .messages-client-list.has-selection + .messages-thread-panel { position: static; inset: auto; }
  .messages-back { display: none; }
}

/* FIX60D_MAIN_WEBSITE_REQUESTS */
.website-request-launch {
  margin-top: 8px;
  background: linear-gradient(135deg, rgba(20, 73, 86, .90), rgba(17, 42, 51, .96));
  border-color: rgba(81, 201, 232, .28);
}
.website-request-launch .weather-launch-icon {
  background: rgba(81, 201, 232, .11);
  border-color: rgba(81, 201, 232, .22);
}
.website-request-launch small,
.website-request-launch > b {
  color: var(--cyan);
}
.website-request-launch > b {
  min-width: 28px;
  text-align: center;
}

/* FIX60G_WEBSITE_REQUESTS_DESKTOP_PARITY */
.website-parity-note{margin:0 0 12px;color:var(--muted);font-size:12px;line-height:1.45}
.website-workflow-actions{display:grid;grid-template-columns:1fr;gap:7px;margin-top:10px}
.website-workflow-actions button,.website-planner-panel button,.website-manual-time button,.website-service-scope button{min-height:42px;border-radius:11px;border:1px solid rgba(111,179,198,.22);background:rgba(12,41,53,.92);color:var(--text);font-weight:800;text-align:left;padding:9px 11px}
.website-workflow-actions button.primary{border-color:rgba(86,219,134,.38);background:rgba(26,104,65,.34);color:#9ef0b7}
.website-workflow-actions button.danger{border-color:rgba(255,129,139,.38);color:#ff9da5}
.website-workflow-actions button:disabled,.website-planner-panel button:disabled{opacity:.42}
.website-planner-panel{margin-top:10px;padding:11px;border-radius:12px;border:1px solid rgba(255,195,92,.24);background:rgba(36,31,20,.44);display:grid;gap:8px}
.website-planner-panel>strong{color:#ffd37d}.website-planner-panel>p{margin:0;color:var(--muted);font-size:12px}.website-planner-panel button.secondary{opacity:.72;text-align:center}
.website-manual-time,.website-service-scope{display:grid;gap:7px;padding:9px;border-radius:10px;background:rgba(4,25,34,.55)}
.website-manual-time input,.website-service-scope textarea{width:100%;box-sizing:border-box;background:#061821;color:var(--text);border:1px solid rgba(111,179,198,.24);border-radius:9px;padding:10px;font:inherit}.website-service-scope textarea{min-height:72px}
.website-action-pending{margin-top:9px;padding:9px 10px;border-radius:9px;background:rgba(255,195,92,.10);border:1px solid rgba(255,195,92,.22);color:#ffd37d;font-size:12px;font-weight:800}
.website-action-result{margin-top:9px;padding:10px;border-radius:10px;font-size:12px}.website-action-result.ok{background:rgba(47,184,103,.10);border:1px solid rgba(47,184,103,.25)}.website-action-result.error{background:rgba(255,91,103,.10);border:1px solid rgba(255,91,103,.25)}
.website-action-result p{white-space:pre-wrap;margin:5px 0 0}.website-action-result pre{white-space:pre-wrap;font:inherit;background:rgba(0,0,0,.18);padding:9px;border-radius:8px}.website-sms-link{display:block;margin-top:8px;padding:10px;border-radius:9px;text-decoration:none;text-align:center;font-weight:900;background:#55dc86;color:#03150b}

/* FIX60I_SELECTIVE_WEBSITE_REQUEST_ACTIONS */
.website-selective-note {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(81, 201, 232, .08);
  border: 1px solid rgba(81, 201, 232, .18);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.website-selective-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  margin-top: 10px;
}
.website-selective-actions button {
  min-height: 42px;
  padding: 9px 11px;
  border-radius: 11px;
  border: 1px solid rgba(111, 179, 198, .22);
  background: rgba(12, 41, 53, .92);
  color: var(--text);
  font-weight: 800;
  text-align: left;
}
.website-selective-actions button.primary {
  border-color: rgba(86, 219, 134, .38);
  background: rgba(26, 104, 65, .34);
  color: #9ef0b7;
}
.website-selective-actions button.danger {
  border-color: rgba(255, 129, 139, .38);
  color: #ff9da5;
}
.website-selective-actions button:disabled {
  opacity: .42;
}
.website-readonly-badge {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 9px;
  text-align: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted);
  background: rgba(255,255,255,.035);
  border: 1px dashed rgba(255,255,255,.10);
}

/* FIX60J_FORCE_SELECTIVE_FRESH_8778 */
.website-selective-note {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(81, 201, 232, .08);
  border: 1px solid rgba(81, 201, 232, .18);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.website-selective-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  margin-top: 10px;
}
.website-selective-actions button {
  min-height: 42px;
  padding: 9px 11px;
  border-radius: 11px;
  border: 1px solid rgba(111, 179, 198, .22);
  background: rgba(12, 41, 53, .92);
  color: var(--text);
  font-weight: 800;
  text-align: left;
}
.website-selective-actions button.primary {
  border-color: rgba(86, 219, 134, .38);
  background: rgba(26, 104, 65, .34);
  color: #9ef0b7;
}
.website-selective-actions button.danger {
  border-color: rgba(255, 129, 139, .38);
  color: #ff9da5;
}
.website-selective-actions button:disabled {
  opacity: .42;
}
.website-readonly-badge {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 9px;
  text-align: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted);
  background: rgba(255,255,255,.035);
  border: 1px dashed rgba(255,255,255,.10);
}