:root {
  color-scheme: light;
  --field-teal: #008b8f;
  --field-teal-deep: #005f68;
  --field-teal-dark: #003d46;
  --field-ink: #08263a;
  --field-muted: #67808c;
  --field-line: rgba(0, 61, 70, 0.12);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--field-teal); }
body {
  min-width: 320px;
  min-height: 100%;
  margin: 0;
  background:
    radial-gradient(circle at 5% 0%, rgba(56, 215, 203, 0.5), transparent 34%),
    linear-gradient(165deg, #009a9d 0%, var(--field-teal) 45%, var(--field-teal-deep) 100%);
  color: #fff;
  -webkit-font-smoothing: antialiased;
  transition: background .24s ease;
}

body[data-home-theme="dark"] {
  background:
    radial-gradient(circle at 8% 0%, rgba(16, 142, 153, .48), transparent 34%),
    radial-gradient(circle at 100% 86%, rgba(0, 35, 53, .5), transparent 42%),
    linear-gradient(165deg, #075f70 0%, #004f62 48%, #003b50 100%);
}

body:not(.auth-verified),
body:not(.field-route-ready) { visibility: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; text-decoration: none; }

.field-app-shell {
  width: min(100%, 560px);
  min-height: 100svh;
  margin: 0 auto;
  padding: max(18px, env(safe-area-inset-top)) 18px calc(104px + env(safe-area-inset-bottom));
}

.field-view { display: none; }
body[data-field-view="home"] .field-view[data-field-view="home"],
body[data-field-view="financing"] .field-view[data-field-view="financing"],
body[data-field-view="websites"] .field-view[data-field-view="websites"],
body[data-field-view="resources"] .field-view[data-field-view="resources"],
body[data-field-view="weekly-pay"] .field-view[data-field-view="weekly-pay"],
body[data-field-view="my-card"] .field-view[data-field-view="my-card"],
body[data-field-view="updates"] .field-view[data-field-view="updates"] { display: block; }
.field-view.is-active { animation: field-view-in .18s ease-out; }
body.field-route-restoring .field-view.is-active { animation: none; }
@keyframes field-view-in { from { opacity: 0; transform: translateX(10px); } }

.field-tool-page { min-height: 100svh; }
.field-tool-header {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  margin: 0 0 24px;
  padding-top: 3px;
}
.field-tool-header-no-back { grid-template-columns: minmax(0, 1fr); }
.field-tool-header > button {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0 0 4px;
  border: 1px solid rgba(255, 255, 255, .52);
  border-radius: 15px;
  background: rgba(255, 255, 255, .16);
  color: #fff;
  font-size: 34px;
  line-height: 1;
  cursor: pointer;
  backdrop-filter: blur(10px);
}
.field-tool-header > div { min-width: 0; }
.field-tool-header p { margin: 0 0 3px; color: rgba(255,255,255,.76); font-size: 10px; font-weight: 950; letter-spacing: .16em; }
.field-tool-header h1 { margin: 0; color: #fff; font-size: 31px; line-height: 1; letter-spacing: -.035em; }
.field-tool-header .field-links-title { display: flex; align-items: center; gap: 9px; }
.field-links-title img { width: 68px; height: 68px; object-fit: contain; }
.field-links-title span { font-family: "Arial Black", Inter, ui-sans-serif, system-ui, sans-serif; font-size: 34px; font-style: italic; font-weight: 950; letter-spacing: -.055em; }
.field-tool-page .field-hub-grid { gap: 11px; }
.field-tool-page .field-hub-card { min-height: 72px; padding: 15px 16px; box-shadow: 0 11px 26px rgba(0,45,51,.14); }
.field-tool-page .field-hub-card > strong { font-size: 15px; }

.field-app-header,
.field-app-brand,
.field-section-heading { display: flex; align-items: center; }

.field-app-header { justify-content: space-between; gap: 18px; }
.field-app-brand { width: 46px; height: 46px; }
.field-app-brand img { width: 46px; height: 46px; border-radius: 13px; box-shadow: 0 8px 22px rgba(0, 45, 51, .22); }
.field-install-button {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  background: rgba(255,255,255,.17);
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  backdrop-filter: blur(10px);
}

.field-app-welcome { padding: 24px 3px 24px; }
.field-app-welcome > p { margin: 0 0 6px; color: rgba(255,255,255,.78); font-size: 13px; font-weight: 750; }
.field-app-welcome h1 { max-width: 430px; margin: 0; font-size: clamp(31px, 9vw, 45px); line-height: 1.03; letter-spacing: -.045em; }
.field-app-welcome h1 span::before { content: " "; }
.field-notification-setup {
  width: 100%;
  min-height: 76px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 48px;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 13px 14px;
  border: 1px solid var(--field-line);
  border-radius: 18px;
  color: var(--field-ink);
  background: #fff;
  text-align: left;
  box-shadow: 0 8px 21px rgba(2,61,70,.07);
  cursor: pointer;
}
.field-notification-setup[hidden] { display: none; }
.field-notification-setup:disabled { opacity: .72; cursor: wait; }
.field-notification-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: var(--field-teal-deep); background: #e8f8f5; }
.field-notification-icon svg { width: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.field-notification-setup > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.field-notification-setup strong { font-size: 14px; }
.field-notification-setup small { color: var(--field-muted); font-size: 11px; line-height: 1.3; }
.field-notification-toggle { width: 46px; height: 27px; display: flex; align-items: center; padding: 3px; border-radius: 999px; background: #cbd9da; transition: background .18s ease; }
.field-notification-toggle i { width: 21px; height: 21px; display: block; border-radius: 50%; background: #fff; box-shadow: 0 2px 7px rgba(0,38,43,.2); transition: transform .18s ease; }
.field-notification-setup[data-enabled="true"] .field-notification-toggle { background: var(--field-teal); }
.field-notification-setup[data-enabled="true"] .field-notification-toggle i { transform: translateX(19px); }
.field-logout-button { width: 100%; min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 14px; border: 1px solid #efc9c5; border-radius: 16px; background: #fff; color: #b42318; font-size: 14px; font-weight: 850; cursor: pointer; }
.field-logout-button:disabled { opacity: .68; cursor: wait; }
.field-logout-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.field-theme-setting { margin-bottom: 14px; }
.field-theme-heading { display: grid; gap: 3px; margin-bottom: 10px; }
.field-theme-heading > strong { font-size: 14px; }
.field-theme-heading > small { color: var(--field-muted); font-size: 11px; }
.field-theme-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.field-theme-options > button {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--field-line);
  border-radius: 16px;
  background: #fff;
  color: var(--field-ink);
  text-align: left;
  cursor: pointer;
}
.field-theme-options > button[aria-pressed="true"] { border-color: rgba(0, 139, 143, .52); background: #ecf9f7; box-shadow: 0 0 0 2px rgba(0, 139, 143, .1); }
.field-theme-options > button > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.field-theme-options strong { overflow: hidden; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.field-theme-options small { color: var(--field-muted); font-size: 9px; line-height: 1.2; }
.field-theme-options b { color: transparent; font-size: 16px; }
.field-theme-options > button[aria-pressed="true"] b { color: var(--field-teal); }
.field-theme-preview { width: 42px; height: 42px; display: grid; grid-template-columns: repeat(3, 1fr); align-content: end; gap: 3px; padding: 7px; border-radius: 12px; background: linear-gradient(145deg, #11aaa9, #008b8f); }
.field-theme-preview.is-dark { background: linear-gradient(145deg, #07687a, #003e53); }
.field-theme-preview i { height: 18px; border-radius: 3px; background: rgba(255, 255, 255, .95); }
.field-theme-preview i:nth-child(2) { height: 13px; }
.field-theme-preview i:nth-child(3) { height: 9px; }
.field-nav-preview { align-content: center; border: 1px solid rgba(0, 61, 70, .1); background: #f7fbfb; }
.field-nav-preview.is-dark { border-color: transparent; background: #004f62; }
.field-nav-preview i,
.field-nav-preview i:nth-child(2),
.field-nav-preview i:nth-child(3) { width: 7px; height: 7px; justify-self: center; border-radius: 50%; background: #008b8f; }
.field-nav-preview.is-dark i { background: #fff; }
.field-nav-preview i:first-child { width: 11px; height: 20px; border-radius: 5px; }
.field-primary-actions { display: grid; gap: 11px; }
.field-action-card {
  width: 100%;
  min-height: 88px;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 17px;
  border: 1px solid transparent;
  border-radius: 21px;
  background: #fff;
  color: var(--field-ink);
  text-align: left;
  box-shadow: 0 18px 24px -16px rgba(0,45,51,.3);
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease;
}
.field-action-card:active { transform: scale(.985); box-shadow: 0 13px 20px -15px rgba(0,45,51,.28); }
.field-action-icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 16px;
  color: #fff;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.36),transparent 34%),
    linear-gradient(145deg,#63c4c7,#00979d 58%,#006f75);
  box-shadow:
    0 9px 18px rgba(0,151,157,.24),
    inset 0 1px 0 rgba(255,255,255,.4),
    inset 0 -5px 10px rgba(0,45,51,.08);
}
.field-action-icon svg { width: 27px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.field-action-card > span:nth-child(2) { min-width: 0; display: grid; gap: 4px; }
.field-action-card strong { font-size: 17px; letter-spacing: -.015em; }
.field-action-card small { overflow: hidden; color: var(--field-muted); font-size: 12px; font-weight: 650; line-height: 1.3; text-overflow: ellipsis; }
.field-action-card > b { color: #78a0a4; font-size: 29px; font-weight: 400; }
.field-my-card-page {
  width: min(calc(100% - 10px),720px);
  min-height: calc(100svh - 10px);
  margin: 5px auto 0;
  padding: 12px 10px calc(104px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg,#eef7f6 0%,#f7fbfb 100%);
}
body[data-field-view="my-card"] { padding: 0; }
.field-my-card-header {
  min-height: 0;
  display: flex;
  align-items: center;
  margin: 0 0 10px;
  padding: 22px 17px;
  border-radius: 20px;
  color: #fff;
  background:
    radial-gradient(circle at 78% 12%,rgba(5,191,196,.34),transparent 28%),
    radial-gradient(circle at 7% 88%,rgba(5,191,196,.3),transparent 38%),
    linear-gradient(180deg,rgba(255,255,255,.06),transparent 32%),
    linear-gradient(180deg,#002233 0%,#004f58 62%,#05bfc4 100%);
}
.field-my-card-header h1 { margin: 0; font-size: clamp(27px,8vw,38px); font-weight: 800; line-height: 1.05; letter-spacing: 0; }
.field-my-card-status { min-height: 250px; display: grid; place-items: center; margin: 0; color: #5c7479; font-size: 12px; font-weight: 850; text-align: center; }
.field-my-card-status:empty { display: none; }
.field-my-card-content { display: grid; gap: 12px; }
.field-my-card-content[hidden] { display: none; }
.field-my-card-preview { min-height: 146px; display: grid; grid-template-columns: 82px minmax(0,360px); align-items: center; justify-content: center; gap: 17px; padding: 20px; border: 1px solid rgba(255,255,255,.8); border-radius: 25px; background: rgba(255,255,255,.98); box-shadow: 0 17px 38px rgba(0,61,70,.15); }
.field-my-card-photo-column { position: relative; width: 82px; height: 82px; }
.field-my-card-photo { width: 82px; height: 82px; display: grid; place-items: center; overflow: hidden; border-radius: 23px; color: #fff; background: radial-gradient(circle at 28% 18%,rgba(255,255,255,.35),transparent 30%),linear-gradient(145deg,#5ac8cb,#008b8f 62%,#004f58); box-shadow: 0 12px 24px rgba(0,111,117,.2); }
.field-my-card-photo[role="button"] { cursor: zoom-in; }
.field-my-card-photo[role="button"]:focus-visible { outline: 3px solid rgba(0,174,180,.35); outline-offset: 3px; }
.field-my-card-photo img { width: 100%; height: 100%; object-fit: cover; }
.field-my-card-photo span { font-size: 27px; font-weight: 950; }
.field-my-card-profile { min-width: 0; }
.field-my-card-profile small { color: #00898e; font-size: 8px; font-weight: 950; letter-spacing: .14em; }
.field-my-card-profile h2 { margin: 4px 0 3px; overflow: hidden; color: var(--field-ink); font-size: 23px; line-height: 1.04; letter-spacing: -.04em; text-overflow: ellipsis; }
.field-my-card-profile p { margin: 0; color: var(--field-muted); font-size: 11px; font-weight: 800; }
.field-my-card-profile > span { display: block; margin-top: 7px; overflow: hidden; color: #2e5f67; font-size: 9px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.field-my-card-photo-actions { position: absolute; left: 50%; bottom: -30px; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 4px; transform: translateX(-50%); }
.field-my-card-photo-actions button { width: 28px; height: 28px; display: inline-grid; place-items: center; padding: 0; border: 1px solid #cfe0e0; border-radius: 50%; color: #006f75; background: #fff; box-shadow: 0 5px 12px rgba(0,61,70,.1); font: inherit; cursor: pointer; }
.field-my-card-photo-actions button:disabled { opacity: .6; cursor: wait; }
.field-my-card-photo-actions button[hidden] { display: none; }
.field-my-card-photo-actions svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.field-my-card-history-card { padding: 17px; border: 1px solid #d8e6e6; border-radius: 23px; background: #fff; box-shadow: 0 11px 28px rgba(0,61,70,.09); }
.field-my-card-history-heading small { color: #00898e; font-size: 8px; font-weight: 950; letter-spacing: .14em; }
.field-my-card-history-heading h3 { margin: 4px 0 0; color: var(--field-ink); font-size: 16px; line-height: 1.15; }
.field-my-card-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.field-my-card-actions :is(button,a) { min-height: 51px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 13px; border: 1px solid #cfe0e0; border-radius: 16px; color: #006f75; background: #fff; box-shadow: 0 8px 20px rgba(0,61,70,.07); font: inherit; font-size: 12px; font-weight: 900; text-decoration: none; cursor: pointer; }
.field-my-card-actions :is(button,a).primary { border-color: #008b8f; color: #fff; background: linear-gradient(135deg,#008b8f,#05bfc4); box-shadow: 0 11px 23px rgba(0,139,143,.2); }
.field-my-card-actions svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.field-my-card-feedback { min-height: 17px; margin: 0 4px; color: #007d83; font-size: 10px; font-weight: 850; text-align: center; }
.field-my-card-feedback:empty { display: none; }
.field-my-card-utility-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.field-my-card-utility-actions .field-my-card-activity-button { margin: 0; }
.field-my-card-activity-button { width: 100%; min-height: 51px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 11px 13px; border: 1px solid #cfe0e0; border-radius: 16px; color: #006f75; background: #fff; box-shadow: 0 8px 20px rgba(0,61,70,.07); font: inherit; font-size: 12px; font-weight: 900; cursor: pointer; }
.field-my-card-activity-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.field-my-card-history-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.field-my-card-history-heading > div { min-width: 0; }
.field-my-card-history-heading h3 { margin-top: 0; }
.field-my-card-history-heading p { margin: 5px 0 0; color: var(--field-muted); font-size: 11px; font-weight: 700; line-height: 1.3; }
.field-my-card-history-accordion > summary { list-style: none; cursor: pointer; user-select: none; }
.field-my-card-history-accordion > summary::-webkit-details-marker { display: none; }
.field-my-card-history-chevron { width: 21px; height: 21px; flex: 0 0 auto; fill: none; stroke: #00858a; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; }
.field-my-card-history-accordion[open] .field-my-card-history-chevron { transform: rotate(180deg); }
.field-my-card-history-toolbar { display: flex; justify-content: flex-end; margin-top: 12px; }
.field-my-card-history-toolbar button { padding: 7px 10px; border: 1px solid #cfe0e0; border-radius: 10px; color: #007d83; background: #f8fbfb; font: inherit; font-size: 9px; font-weight: 900; cursor: pointer; }
.field-my-card-history { display: grid; gap: 8px; margin-top: 13px; }
.field-my-card-history > p { margin: 0; padding: 14px 4px 4px; color: #6a8186; font-size: 11px; font-weight: 750; text-align: center; }
.field-my-card-history-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 12px; border-radius: 14px; background: #f2f8f8; }
.field-my-card-history-item > div { min-width: 0; display: grid; gap: 4px; }
.field-my-card-history-item strong { overflow: hidden; color: var(--field-ink); font-size: 11px; line-height: 1.3; text-overflow: ellipsis; }
.field-my-card-history-item span { color: #6a8186; font-size: 9px; font-weight: 750; }
.field-my-card-history-item b { padding: 6px 8px; border-radius: 999px; color: #007d83; background: #dff2f1; font-size: 8px; white-space: nowrap; }
.field-my-card-add-name { padding: 7px 9px; border: 0; border-radius: 999px; color: #fff; background: #008f94; font: inherit; font-size: 8px; font-weight: 900; white-space: nowrap; cursor: pointer; }
.field-my-card-add-name[hidden] { display: none; }
.field-my-card-name-form { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }
.field-my-card-name-form[hidden] { display: none; }
.field-my-card-name-form input { min-width: 0; min-height: 36px; padding: 8px 10px; border: 1px solid #cfe0e0; border-radius: 10px; color: var(--field-ink); background: #fff; font: inherit; font-size: 10px; font-weight: 750; outline: 0; }
.field-my-card-name-form button { min-width: 52px; border: 0; border-radius: 10px; color: #fff; background: #008f94; font: inherit; font-size: 9px; font-weight: 900; cursor: pointer; }
.field-my-card-text-dialog { width: min(calc(100% - 28px),430px); margin: auto; padding: 0; border: 0; border-radius: 26px; color: var(--field-ink); background: #fff; box-shadow: 0 28px 80px rgba(0,39,46,.34); }
.field-my-card-text-dialog::backdrop { background: rgba(0,42,48,.58); backdrop-filter: blur(5px); }
.field-my-card-text-dialog form { display: grid; gap: 18px; padding: 22px; }
.field-my-card-text-dialog header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.field-my-card-text-dialog header small { color: #00898e; font-size: 9px; font-weight: 950; letter-spacing: .14em; }
.field-my-card-text-dialog header h2 { margin: 5px 0 0; font-size: 23px; line-height: 1.08; }
.field-my-card-text-dialog header > button { width: 34px; height: 34px; display: grid; place-items: center; padding: 0; border: 1px solid #cfe0e0; border-radius: 11px; color: #006f75; background: #f5fafa; font: inherit; font-size: 25px; line-height: 1; cursor: pointer; }
.field-my-card-text-dialog label { display: grid; gap: 7px; color: #587178; font-size: 10px; font-weight: 850; }
.field-my-card-text-dialog input { width: 100%; min-height: 54px; padding: 12px 14px; border: 1px solid #bfd8d9; border-radius: 16px; color: var(--field-ink); background: #f7fbfb; font: inherit; font-size: 18px; font-weight: 850; letter-spacing: .02em; outline: 0; }
.field-my-card-text-dialog input:focus { border-color: #00aeb4; box-shadow: 0 0 0 4px rgba(0,174,180,.12); }
.field-my-card-send-button { min-height: 52px; border: 1px solid #008b8f; border-radius: 16px; color: #fff; background: linear-gradient(135deg,#008b8f,#05bfc4); box-shadow: 0 11px 23px rgba(0,139,143,.2); font: inherit; font-size: 13px; font-weight: 900; cursor: pointer; }
.field-my-card-send-button:disabled { opacity: .6; cursor: wait; }
.field-my-card-text-dialog form > p { min-height: 14px; margin: -8px 0 0; color: #a42539; font-size: 9px; font-weight: 800; text-align: center; }
.field-my-card-activity-dialog { margin: auto; overflow-y: auto; }
.field-my-card-activity-dialog-content { display: grid; gap: 12px; }
.field-my-card-activity-dialog .field-my-card-name-form { position: static; }
.field-my-card-qr-dialog { margin: auto; overflow-y: auto; }
.field-my-card-qr-popup-content { display: grid; justify-items: center; gap: 13px; padding: 5px 4px 3px; text-align: center; }
.field-my-card-qr-popup-content img { width: min(72vw,290px); aspect-ratio: 1; padding: 12px; border: 1px solid #d8e6e6; border-radius: 24px; background: #fff; box-shadow: 0 14px 32px rgba(0,61,70,.11); object-fit: contain; }
.field-my-card-photo-dialog { margin: auto; overflow-y: auto; }
.field-my-card-photo-popup { width: min(76vw,320px); aspect-ratio: 1; display: grid; place-items: center; margin: 0 auto; overflow: hidden; border-radius: 28px; color: #fff; background: radial-gradient(circle at 28% 18%,rgba(255,255,255,.35),transparent 30%),linear-gradient(145deg,#5ac8cb,#008b8f 62%,#004f58); box-shadow: 0 16px 36px rgba(0,61,70,.16); }
.field-my-card-photo-popup img { width: 100%; height: 100%; object-fit: cover; }
.field-my-card-photo-popup span { font-size: 72px; font-weight: 950; }

.field-resources { margin-top: 28px; }
.field-section-heading { margin: 0 3px 13px; }
.field-section-heading h2 { margin: 0; font-size: 23px; letter-spacing: -.025em; }
.field-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.field-resource-grid :is(a, button) {
  position: relative;
  min-height: 64px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 17px;
  background: #fff;
  color: var(--field-ink);
  box-shadow: 0 9px 24px rgba(0,45,51,.12);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.field-resource-grid :is(a, button):last-child:nth-child(odd) { grid-column: 1 / -1; }
.field-resource-grid .field-resource-quick-quotes:last-child:nth-child(odd),
.field-resource-grid .field-resource-intelligence:last-child:nth-child(odd) { grid-column: auto; }
.field-resource-grid :is(a, button) strong { min-width: 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; }
.field-resource-grid :is(a, button) b { color: #88a5aa; font-size: 22px; font-weight: 400; }
.field-resource-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #64748b; background: #eef2f6; }
.field-resource-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.field-resource-icon-wrap { position: relative; width: 38px; height: 38px; display: block; }
.field-resource-icon:is(.is-financing, .is-websites, .is-resources, .is-updates, .is-quick-quotes) {
  color: #fff;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.36), transparent 34%),
    linear-gradient(145deg, var(--field-resource-highlight), var(--field-resource-mid) 58%, var(--field-resource-deep));
  border: 1px solid rgba(255,255,255,.22);
  box-shadow:
    0 8px 16px rgba(var(--field-resource-shadow),.24),
    inset 0 1px 0 rgba(255,255,255,.4),
    inset 0 -5px 10px rgba(0,45,51,.08);
}
.field-resource-icon:is(.is-financing, .is-websites, .is-resources, .is-updates, .is-quick-quotes) {
  --field-resource-highlight: #63c4c7;
  --field-resource-mid: #00979d;
  --field-resource-deep: #006f75;
  --field-resource-shadow: 0,151,157;
}
.field-resource-icon.is-intelligence {
  --field-resource-highlight: #63c4c7;
  --field-resource-mid: #00979d;
  --field-resource-deep: #006f75;
  color: #fff;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.36),transparent 34%),
    linear-gradient(145deg,var(--field-resource-highlight),var(--field-resource-mid) 58%,var(--field-resource-deep));
}
.field-resource-icon.is-intelligence img { width:23px; height:23px; display:block; object-fit:contain; }
.field-update-count { position: absolute; z-index: 1; top: -7px; right: -7px; min-width: 21px; height: 21px; display: inline-grid; place-items: center; padding: 0 5px; border: 2px solid #fff; border-radius: 999px; color: #fff; background: #e04456; box-shadow: 0 5px 12px rgba(151,30,49,.25); font-size: 9px; font-weight: 950; line-height: 1; }
.field-update-count[hidden] { display: none; }

.field-bottom-nav {
  position: fixed;
  z-index: 30;
  right: 10px;
  bottom: max(10px, env(safe-area-inset-bottom));
  left: 10px;
  width: min(calc(100% - 20px), 540px);
  min-height: 70px;
  display: grid;
  grid-template-columns: repeat(var(--field-nav-count, 5), 1fr);
  gap: 4px;
  margin: auto;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 23px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 18px 48px rgba(0,37,43,.25);
  backdrop-filter: blur(18px);
}
.field-bottom-nav a,
.field-bottom-nav button { display: grid; place-items: center; align-content: center; gap: 3px; border: 0; border-radius: 16px; background: transparent; color: #245c63; font-size: 10px; font-weight: 850; cursor: pointer; }
.field-bottom-nav .active { background: #004f62; color: #fff; }
.field-bottom-nav svg { width: 22px; height: 22px; color: #006e74; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.field-bottom-nav .active svg { color: #fff; }
.field-bottom-nav .field-settings-gear { color: #006e74; fill: currentColor; stroke: none; }
.field-bottom-nav .field-settings-gear circle { fill: #fff; }

body[data-nav-theme="dark"] .field-bottom-nav {
  border-color: rgba(255, 255, 255, .16);
  background: rgba(0, 63, 78, .96);
  box-shadow: 0 18px 48px rgba(0, 26, 38, .4);
}
body[data-nav-theme="dark"] .field-bottom-nav a,
body[data-nav-theme="dark"] .field-bottom-nav button { color: rgba(255, 255, 255, .74); }
body[data-nav-theme="dark"] .field-bottom-nav svg,
body[data-nav-theme="dark"] .field-bottom-nav .field-settings-gear { color: #fff; }
body[data-nav-theme="dark"] .field-bottom-nav .field-settings-gear circle { fill: #004f62; }
body[data-nav-theme="dark"] .field-bottom-nav .active { background: #fff; color: #004f62; }
body[data-nav-theme="dark"] .field-bottom-nav .active svg { color: #004f62; }

.field-sheet {
  width: min(calc(100% - 20px), 520px);
  max-height: min(82svh, 760px);
  margin: auto auto 10px;
  padding: 25px 20px calc(24px + env(safe-area-inset-bottom));
  border: 0;
  border-radius: 28px;
  background: #f7fbfb;
  color: var(--field-ink);
  box-shadow: 0 28px 90px rgba(0,34,39,.38);
}
.field-settings-sheet { overflow-y: auto; }
.field-sheet::backdrop { background: rgba(0,39,45,.56); backdrop-filter: blur(4px); }
.field-sheet[open] { animation: field-sheet-in .2s ease-out; }
@keyframes field-sheet-in { from { opacity: 0; transform: translateY(22px); } }
.field-sheet form { position: absolute; top: 17px; right: 17px; }
.field-sheet-close { width: 38px; height: 38px; border: 0; border-radius: 50%; background: #e7f1f1; color: #42636a; font-size: 25px; cursor: pointer; }
.field-sheet > p { margin: 2px 0 5px; color: var(--field-teal); font-size: 10px; font-weight: 950; letter-spacing: .16em; }
.field-sheet h2 { max-width: calc(100% - 48px); margin: 0 0 20px; font-size: 25px; line-height: 1.08; letter-spacing: -.03em; }
.field-sheet-actions { display: grid; gap: 10px; }
.field-sheet-actions a { min-height: 76px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; padding: 15px 17px; border: 1px solid var(--field-line); border-radius: 17px; background: #fff; box-shadow: 0 8px 21px rgba(2,61,70,.07); }
.field-sheet-actions strong { font-size: 16px; }
.field-sheet-actions span { grid-column: 1; color: var(--field-muted); font-size: 12px; font-weight: 650; }
.field-sheet-actions b { grid-column: 2; grid-row: 1 / span 2; color: #7f9fa4; font-size: 25px; font-weight: 400; }
.field-sheet-groups { display: grid; gap: 18px; }
.field-sheet-group { display: grid; gap: 9px; }
.field-sheet-group h3 { margin: 0 3px; color: #007d83; font-size: 11px; font-weight: 950; letter-spacing: .13em; text-transform: uppercase; }

.field-hub-grid { display: grid; gap: 9px; }
.field-hub-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid var(--field-line);
  border-radius: 16px;
  background: #fff;
  color: var(--field-ink);
  box-shadow: 0 7px 18px rgba(2,61,70,.06);
}
.field-hub-card > strong { min-width: 0; font-size: 14px; line-height: 1.25; }
.field-product-resource-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.field-product-resource-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  color: #fff;
}
.field-product-resource-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}
.field-product-resource-icon.is-battery {
  background: linear-gradient(145deg, #f97316, #fb923c);
  box-shadow: 0 9px 18px rgba(249,115,22,.18), inset 0 1px 0 rgba(255,255,255,.32);
}
.field-product-resource-icon.is-solar {
  background: linear-gradient(145deg, #f59e0b, #fbbf24);
  box-shadow: 0 9px 18px rgba(245,158,11,.18), inset 0 1px 0 rgba(255,255,255,.32);
}
.field-product-resource-icon.is-windows {
  background: linear-gradient(145deg, #14b8a6, #2dd4bf);
  box-shadow: 0 9px 18px rgba(20,184,166,.18), inset 0 1px 0 rgba(255,255,255,.32);
}
.field-product-resource-icon.is-hvac {
  background: linear-gradient(145deg, #3b82f6, #38bdf8);
  box-shadow: 0 9px 18px rgba(59,130,246,.18), inset 0 1px 0 rgba(255,255,255,.32);
}
.field-product-resource-icon.is-roofing {
  background: linear-gradient(145deg, #475569, #64748b);
  box-shadow: 0 9px 18px rgba(71,85,105,.18), inset 0 1px 0 rgba(255,255,255,.32);
}
.field-product-resource-icon.is-pay {
  background: linear-gradient(145deg, #075f67, #00adb2);
  box-shadow: 0 9px 18px rgba(0,139,143,.22), inset 0 1px 0 rgba(255,255,255,.34);
}

.field-weekly-pay-page { color: var(--field-ink); }
.field-weekly-pay-page > .field-tool-header { color: #fff; }
.field-weekly-pay-page > .field-tool-header p { margin-top: 6px; }
.field-weekly-pay-filter {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid rgba(154,231,228,.38);
  border-radius: 22px;
  background: linear-gradient(135deg, #004c58, #006f76);
  box-shadow: 0 14px 30px rgba(0,45,51,.22);
  color: #fff;
}
.field-weekly-pay-filter > p { margin: 0 0 12px; color: #b9e6e5; font-size: 10px; font-weight: 950; letter-spacing: .15em; }
.field-weekly-pay-filter > div { display: grid; gap: 10px; }
.field-weekly-pay-filter label { display: grid; gap: 6px; color: #b9e6e5; font-size: 9px; font-weight: 950; letter-spacing: .1em; }
.field-weekly-pay-filter select {
  width: 100%; min-height: 50px; padding: 0 38px 0 14px; border: 1px solid rgba(185,230,229,.44); border-radius: 14px;
  appearance: none; background: rgba(0,53,62,.46) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23fff' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center;
  color: #fff; font-weight: 850;
}
.field-weekly-pay-status { margin: 18px 0; color: rgba(255,255,255,.86); font-weight: 800; text-align: center; }
.field-weekly-pay-status:empty { display: none; }
.field-weekly-pay-content { display: grid; gap: 14px; }
.field-weekly-pay-weeks { display: flex; gap: 9px; padding-bottom: 4px; overflow-x: auto; scrollbar-width: none; }
.field-weekly-pay-weeks::-webkit-scrollbar { display: none; }
.field-weekly-pay-week {
  min-width: 138px; padding: 12px; border: 1px solid var(--field-line); border-radius: 15px; background: #f6fafa; color: #405869; text-align: left; cursor: pointer;
}
.field-weekly-pay-week strong, .field-weekly-pay-week span { display: block; }
.field-weekly-pay-week strong { margin-bottom: 4px; font-size: 12px; }
.field-weekly-pay-week span { font-size: 11px; font-weight: 800; }
.field-weekly-pay-week[aria-current="true"] { border-color: #00aeb3; background: #fff9e9; box-shadow: 0 0 0 3px rgba(0,174,179,.17); color: var(--field-ink); }
.field-weekly-pay-summary { display: grid; gap: 10px; }
.field-weekly-pay-metric, .field-weekly-pay-payout, .field-weekly-pay-appointments {
  padding: 17px; border: 1px solid var(--field-line); border-radius: 19px; background: #fff; box-shadow: 0 10px 24px rgba(2,61,70,.09);
}
.field-weekly-pay-metric { border-color: color-mix(in srgb, var(--metric-color, #008b8f) 50%, white); background: var(--metric-background, #fff); }
.field-weekly-pay-metric.is-informational { --metric-color: #08777c; border-color: #9ccfd0; background: linear-gradient(145deg, #fbffff, #edf8f7); }
.field-weekly-pay-metric > p, .field-weekly-pay-payout > p { margin: 0 0 8px; color: #637887; font-size: 10px; font-weight: 950; letter-spacing: .05em; text-transform: uppercase; }
.field-weekly-pay-metric h3, .field-weekly-pay-payout h3 { margin: 0; font-size: 27px; letter-spacing: -.04em; }
.field-weekly-pay-metric footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; }
.field-weekly-pay-metric footer span { padding: 5px 9px; border-radius: 999px; color: var(--metric-color); background: rgba(255,255,255,.72); font-size: 10px; font-weight: 950; }
.field-weekly-pay-metric footer strong { color: #526a76; font-size: 11px; }
.field-weekly-pay-payout { position: relative; background: linear-gradient(145deg, #f5fbfb, #e9f6f6); }
.field-weekly-pay-payout button { position: absolute; top: 13px; right: 13px; width: 38px; height: 38px; border: 0; border-radius: 12px; background: #fff; color: #08777c; font-size: 20px; cursor: pointer; }
.field-weekly-pay-payout > span { display: block; margin-top: 6px; color: #607786; font-size: 12px; font-weight: 850; }
.field-weekly-pay-appointments h2 { margin: 0 0 9px; font-size: 19px; line-height: 1.15; }
.field-weekly-pay-appointment-list { display: grid; gap: 8px; }
.field-weekly-pay-appointment { position: relative; width: 100%; padding: 13px; padding-right: 92px; border: 1px solid transparent; border-radius: 14px; background: #f2f7f7; color: var(--field-ink); font: inherit; text-align: left; cursor: pointer; }
.field-weekly-pay-appointment:hover { border-color: #9cd5d5; background: #edf9f8; }
.field-weekly-pay-appointment:focus-visible { border-color: #008b8f; outline: 3px solid rgba(0,139,143,.18); }
.field-weekly-pay-appointment strong, .field-weekly-pay-appointment span { display: block; }
.field-weekly-pay-appointment span { margin-top: 4px; color: #657c87; font-size: 11px; font-weight: 700; line-height: 1.4; }
.field-weekly-pay-appointment .field-weekly-pay-sit-status { position: absolute; top: 11px; right: 11px; margin: 0; padding: 5px 8px; border-radius: 999px; background: #e7eeee; color: #61747b; font-size: 9px; font-weight: 950; line-height: 1; white-space: nowrap; }
.field-weekly-pay-sit-status.is-sat { background: #daf4e9; color: #087958; }
.field-weekly-pay-sit-status.is-not-sat, .field-weekly-pay-sit-status.is-no-show { background: #fde6e8; color: #ad2730; }
.field-weekly-pay-empty { margin: 4px 0 0; padding: 20px; border: 1px dashed #c6dada; border-radius: 14px; color: #6a8089; font-size: 12px; font-weight: 800; text-align: center; }
.field-weekly-pay-dialog .field-weekly-pay-form { position: static; display: grid; gap: 13px; padding: 18px; }
.field-weekly-pay-form > p { margin: 0; color: #5e7580; font-size: 12px; font-weight: 850; }
.field-weekly-pay-form label { display: grid; gap: 6px; color: #526b76; font-size: 11px; font-weight: 900; }
.field-weekly-pay-form input { min-height: 49px; padding: 0 13px; border: 1px solid #c8dbdc; border-radius: 13px; color: var(--field-ink); font: inherit; }
.field-weekly-pay-form > div { display: grid; gap: 9px; }
.field-weekly-pay-form button { min-height: 48px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #08777c, #0aafb3); color: #fff; font-weight: 900; cursor: pointer; }
.field-weekly-pay-form button.secondary { border: 1px solid #c9dddd; background: #fff; color: #08777c; }
.field-weekly-pay-dialog-status { min-height: 18px; color: #08777c !important; }
.field-weekly-pay-dialog-status.is-error { color: #b4232c !important; }
.field-weekly-pay-appointment-dialog { max-height: min(90svh, 760px); overflow-y: auto; }
.field-weekly-pay-appointment-head > p { margin-right: 42px; }
.field-weekly-pay-appointment-head h2 { padding-right: 36px; font-size: 24px; line-height: 1.08; }
.field-weekly-pay-appointment-details { display: grid; gap: 10px; }
.field-weekly-pay-appointment-details article { min-width: 0; padding: 14px; border: 1px solid #cce5e5; border-radius: 15px; background: #fff; }
.field-weekly-pay-appointment-details span, .field-weekly-pay-appointment-details strong { display: block; }
.field-weekly-pay-appointment-details span { margin-bottom: 5px; color: #08777c; font-size: 10px; font-weight: 950; text-transform: uppercase; }
.field-weekly-pay-appointment-details strong { overflow-wrap: anywhere; color: var(--field-ink); font-size: 14px; line-height: 1.3; }
.field-weekly-pay-appointment-actions { display: grid; grid-template-columns: 1fr 1.35fr; gap: 9px; margin-top: 14px; }
.field-weekly-pay-appointment-actions form { position: static; margin: 0; }
.field-weekly-pay-appointment-actions :is(button, a) { width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #08777c, #0aafb3); color: #fff; font: inherit; font-size: 12px; font-weight: 900; text-align: center; cursor: pointer; }
.field-weekly-pay-appointment-actions button.secondary { border: 1px solid #c9dddd; background: #fff; color: #08777c; }

@media (min-width: 520px) {
  .field-weekly-pay-filter > div { grid-template-columns: 1fr 1.5fr; }
  .field-weekly-pay-summary { grid-template-columns: 1fr 1fr; }
  .field-weekly-pay-form > div { grid-template-columns: 1fr 1fr; }
  .field-weekly-pay-appointment-details { grid-template-columns: 1fr 1fr; }
  .field-weekly-pay-appointment-details .is-wide { grid-column: 1 / -1; }
}
.field-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.field-hub-card:has(> .field-hub-card-meta) {
  grid-template-areas: "title meta" "actions actions";
}
.field-hub-card.field-hub-card-linked {
  grid-template-areas: "title meta";
}
.field-hub-card:has(> .field-hub-card-meta) > strong { grid-area: title; }
.field-hub-card:has(> .field-hub-card-meta) > div:not(.field-hub-card-meta) { grid-area: actions; justify-content: flex-start; }
.field-hub-card.field-hub-card-linked > .field-hub-card-meta {
  align-self: center;
  transform: translateY(3px);
}
:is(.field-view[data-field-view="financing"], .field-view[data-field-view="websites"], .field-view[data-field-view="resources"]) .field-hub-card > div:not(.field-hub-card-meta) { display: none; }
:is(.field-view[data-field-view="financing"], .field-view[data-field-view="websites"], .field-view[data-field-view="resources"]) .field-hub-card.is-selectable {
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
:is(.field-view[data-field-view="financing"], .field-view[data-field-view="websites"], .field-view[data-field-view="resources"]) .field-hub-card.is-selectable:active { transform: scale(.985); }
:is(.field-view[data-field-view="financing"], .field-view[data-field-view="websites"], .field-view[data-field-view="resources"]) .field-hub-card.is-selectable:focus-visible {
  border-color: #00aeb3;
  outline: 3px solid rgba(0,174,179,.2);
  outline-offset: 2px;
  box-shadow: 0 10px 24px rgba(2,61,70,.14);
}
.field-hub-card > .field-hub-card-meta {
  grid-area: meta;
  min-height: 0;
  justify-self: end;
  padding: 3px 0;
  border: 0;
  border-radius: 0;
  color: #08777c;
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.25;
  text-align: right;
  text-decoration: none;
  white-space: nowrap;
}
.field-hub-card > .field-hub-card-meta[hidden] { display: none !important; }
.field-hub-card > div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.field-hub-card :is(a, button) {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid #007d83;
  border-radius: 999px;
  background: #008b8f;
  color: #fff;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
}
.field-hub-card :is(a, button).secondary { background: #fff; color: #00767c; }
.field-hub-card > .field-phone-meta {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 7px;
}
.field-hub-card > .field-phone-meta.has-helper {
  display: grid;
  grid-template-columns: 28px auto;
  grid-template-areas: "copy phone" ". helper";
  gap: 3px 7px;
  align-items: center;
  justify-items: start;
}
.field-hub-card > .field-phone-meta.has-helper > .field-phone-copy { grid-area: copy; }
.field-hub-card > .field-phone-meta.has-helper > a[href^="tel:"] { grid-area: phone; }
.field-hub-card > .field-phone-meta.has-helper > .field-hub-card-helper {
  grid-area: helper;
  color: #516d78;
  font-size: 10px;
  font-weight: 850;
}
.field-hub-card > .field-phone-meta > a {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: inherit;
  text-decoration: none;
}
.field-hub-card > .field-phone-meta > .field-phone-copy {
  width: 28px;
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #007d83;
  transition: color .16s ease, transform .16s ease;
}
.field-phone-copy svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.field-phone-copy:active { transform: scale(.94); }
.field-phone-copy:focus-visible { outline: 2px solid rgba(0, 139, 143, .4); outline-offset: 1px; }
.field-hub-card > .field-phone-meta > .field-phone-copy.is-copied {
  background: transparent;
  color: #05aeb2;
  transform: scale(1.08);
}
.field-copy-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.field-sheet:has(> .field-sheet-accent-header) { padding-top: 0; }
.field-checklist-sheet { overflow: auto; }
.field-sheet-accent-header {
  position: relative;
  margin: 0 -20px 20px;
  padding: 25px 20px 23px;
  border-radius: 28px 28px 0 0;
  background: linear-gradient(135deg, #003d46 0%, #005f68 100%);
  color: #fff;
}
.field-sheet-accent-header > p { margin: 2px 0 5px; color: rgba(255,255,255,.72); font-size: 10px; font-weight: 950; letter-spacing: .16em; }
.field-sheet-accent-header h2 { margin-bottom: 0; color: #fff; }
.field-sheet-accent-header .field-sheet-close { border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.14); color: #fff; }
.field-checklist-edit {
  position: absolute;
  top: 19px;
  right: 67px;
  min-width: 54px;
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 999px;
  color: #fff;
  background: rgba(255,255,255,.13);
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}
.field-checklist-edit:hover,.field-checklist-edit:focus-visible { border-color: #fff; background: rgba(255,255,255,.22); outline: 0; }
.field-checklist { display: grid; gap: 9px; }
.field-checklist label { min-height: 68px; display: grid; grid-template-columns: 25px 1fr; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--field-line); border-radius: 16px; background: #fff; cursor: pointer; }
.field-checklist input { width: 22px; height: 22px; margin: 0; accent-color: var(--field-teal); }
.field-checklist label > span { display: grid; gap: 3px; }
.field-checklist strong { font-size: 14px; }
.field-checklist small { color: var(--field-muted); font-size: 11px; line-height: 1.35; }
.field-checklist label:has(input:checked) { border-color: rgba(0,139,143,.32); background: #ecf9f7; }
.field-checklist label:has(input:checked) strong { color: #5f7478; text-decoration: line-through; }
.field-checklist-reset { width: 100%; min-height: 46px; margin-top: 13px; border: 1px solid var(--field-line); border-radius: 14px; background: #fff; color: var(--field-teal-deep); font-weight: 850; cursor: pointer; }
.field-checklist-editor { display: grid; gap: 9px; }
.field-checklist-editor-row { min-height: 58px; display: grid; grid-template-columns: minmax(0,1fr) 40px; align-items: center; gap: 9px; padding: 9px; border: 1px solid var(--field-line); border-radius: 15px; background: #fff; }
.field-checklist-editor-row input { width: 100%; min-height: 40px; padding: 8px 11px; border: 1px solid #c9dadd; border-radius: 10px; color: var(--field-ink); background: #f9fcfc; font: inherit; font-size: 13px; font-weight: 800; }
.field-checklist-editor-row input:focus { border-color: #008b8f; outline: 0; box-shadow: 0 0 0 3px rgba(0,139,143,.12); }
.field-checklist-editor-row button { width: 38px; height: 38px; border: 1px solid #e4c9cd; border-radius: 10px; color: #a23949; background: #fff5f6; font-size: 22px; cursor: pointer; }
.field-checklist-add { width: 100%; min-height: 44px; margin-top: 10px; border: 1px dashed #68bfc1; border-radius: 13px; color: #006e74; background: #edf9f8; font: inherit; font-size: 12px; font-weight: 900; cursor: pointer; }
.field-checklist-feedback { min-height: 18px; margin: 9px 2px 0; color: #527176; font-size: 10px; font-weight: 800; }
.field-checklist-feedback:empty { display: none; }
.field-checklist-feedback.is-error { color: #a42539; }
.field-checklist-sheet.is-editing .field-checklist,.field-checklist-sheet.is-editing .field-checklist-reset { display: none; }
.field-install-steps { display: grid; gap: 14px; margin: 0; padding: 0 0 0 22px; color: #49646b; font-size: 14px; line-height: 1.5; }

.field-updates-page { padding-bottom: 105px; background: linear-gradient(180deg,#eaf7f6 0,#f7fbfb 190px); }
.field-updates-header {
  min-height: 0;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  margin-bottom: 15px;
  padding: 17px;
  border: 0;
  border-radius: 20px;
  color: #fff;
  background:
    radial-gradient(circle at 78% 12%, rgba(5,191,196,.34), transparent 28%),
    radial-gradient(circle at 7% 88%, rgba(5,191,196,.3), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 32%),
    linear-gradient(180deg,#002233 0%,#004f58 62%,#05bfc4 100%);
  box-shadow: none;
}
.field-updates-header h1 { color: #fff; font-size: clamp(27px,8vw,34px); font-weight: 800; }
.field-updates-header-count { padding: 7px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: #fff; background: rgba(0,45,52,.24); font-size: 9px; font-weight: 900; white-space: nowrap; }
.field-updates-status { margin: 12px 4px; color: var(--field-muted); font-size: 12px; font-weight: 800; }
.field-updates-status:empty { display: none; }
.field-updates-list { display: grid; gap: 11px; }
.field-update-card { width: 100%; display: grid; gap: 13px; padding: 16px; border: 1px solid #d7e6e7; border-radius: 19px; color: var(--field-ink); background: #fff; box-shadow: 0 10px 26px rgba(0,55,61,.08); font: inherit; text-align: left; cursor: pointer; }
.field-update-card.is-read { background: #f8fbfb; box-shadow: 0 7px 18px rgba(0,55,61,.05); }
.field-update-card-top { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 11px; }
.field-update-card-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(145deg,#5fc7c8,#00979d 58%,#006f75); }
.field-update-card-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.field-update-card-top strong,.field-update-card-top small { display: block; }
.field-update-card-top strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.field-update-card-top small { margin-top: 4px; color: #658086; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.field-update-card-top em { padding: 5px 8px; border-radius: 999px; color: #fff; background: #008b8f; font-size: 8px; font-style: normal; font-weight: 950; text-transform: uppercase; }
.field-update-card.is-read .field-update-card-top em { color: #587176; background: #e8f0f0; }
.field-update-card-preview { color: #49636a; font-size: 11px; font-weight: 650; line-height: 1.55; }
.field-update-card-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid #e6eeee; color: #789095; }
.field-update-card-footer time { font-size: 9px; font-weight: 800; }
.field-update-card-footer b { color: #008b8f; font-size: 22px; font-weight: 500; }
.field-updates-empty { display: grid; gap: 5px; padding: 30px 20px; border: 1px solid #d7e6e7; border-radius: 18px; background: #fff; text-align: center; }
.field-updates-empty span { color: var(--field-muted); font-size: 11px; }
.field-update-sheet { overflow-y: auto; }
.field-update-sheet .field-sheet-accent-header { margin-bottom: 0; }
.field-update-sheet .field-sheet-accent-header > p { max-width: calc(100% - 48px); }
.field-update-detail-body { padding: 20px 2px 6px; color: #294a52; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.field-update-detail-body :is(h1,h2,h3,h4) { margin: 18px 0 8px; color: var(--field-ink); line-height: 1.2; }
.field-update-detail-body :is(p,ul,ol,blockquote) { margin: 0 0 13px; }
.field-update-detail-body img { max-width: 100%; height: auto; border-radius: 12px; }
.field-update-detail-body a { color: #007d83; font-weight: 850; text-decoration: underline; }
.field-update-detail-feedback { min-height: 17px; margin: 5px 2px; color: #a42539; font-size: 10px; font-weight: 800; }
.field-update-detail-feedback:empty { display: none; }
.field-update-detail-actions { display: flex; justify-content: flex-end; margin-top: 10px; }
.field-update-read-button { width: auto; min-width: 112px; min-height: 44px; padding: 10px 18px; border: 1px solid #008b8f; border-radius: 14px; color: #fff; background: linear-gradient(135deg,#008b8f,#05bfc4); box-shadow: 0 12px 24px rgba(0,139,143,.2); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: transform .16s ease,background .16s ease,box-shadow .16s ease; }
.field-update-read-button:hover,.field-update-read-button:focus-visible { border-color: #003d46; background: linear-gradient(135deg,#003d46,#008b8f); outline: 0; transform: translateY(-1px); }

[data-access][hidden],
[data-access-any][hidden] { display: none !important; }

@media (min-width: 700px) {
  body { padding: 24px; }
  .field-app-shell { min-height: calc(100svh - 48px); border: 1px solid rgba(255,255,255,.22); border-radius: 34px; box-shadow: 0 30px 90px rgba(0,36,42,.25); }
  .field-app-shell.field-my-card-page { border: 0; }
}

@media (max-width: 720px) {
  .field-my-card-header h1 { font-size: clamp(27px,8vw,34px); }
}

@media (min-width: 721px) {
  .field-my-card-page {
    width: min(calc(100% - 24px),720px);
    min-height: calc(100svh - 24px);
    margin-top: 12px;
  }
}

@media (max-width: 360px) {
  .field-app-shell { padding-inline: 13px; }
  .field-action-card { grid-template-columns: 46px minmax(0,1fr) auto; padding: 14px; }
  .field-action-icon { width: 46px; height: 46px; }
  .field-bottom-nav { right: 6px; left: 6px; width: calc(100% - 12px); }
}

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