@font-face {
  font-family: Sora;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src:
    url(./sora-latin-400-normal-CRt88UEn.woff2) format("woff2"),
    url(./sora-latin-400-normal-OW7qkl5a.woff) format("woff");
}
@font-face {
  font-family: Sora;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src:
    url(./sora-latin-700-normal-9waGdLWo.woff2) format("woff2"),
    url(./sora-latin-700-normal-BKPfQAnC.woff) format("woff");
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src:
    url(./figtree-latin-400-normal-g7Dtegnw.woff2) format("woff2"),
    url(./figtree-latin-400-normal-BD4aNku5.woff) format("woff");
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src:
    url(./figtree-latin-500-normal-BWnGEVsr.woff2) format("woff2"),
    url(./figtree-latin-500-normal-B_yy1phn.woff) format("woff");
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src:
    url(./figtree-latin-600-normal-Cv_xCTDl.woff2) format("woff2"),
    url(./figtree-latin-600-normal-BM_oTo4n.woff) format("woff");
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src:
    url(./figtree-latin-700-normal-th6qEP7c.woff2) format("woff2"),
    url(./figtree-latin-700-normal-BCCt2T1q.woff) format("woff");
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src:
    url(./figtree-latin-800-normal-30yxI7TZ.woff2) format("woff2"),
    url(./figtree-latin-800-normal-B7vj2UK8.woff) format("woff");
}
@font-face {
  font-family: IBM Plex Mono;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src:
    url(./ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2) format("woff2"),
    url(./ibm-plex-mono-latin-400-normal-CvHOgSBP.woff) format("woff");
}
@font-face {
  font-family: Bowlby One SC;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src:
    url(./bowlby-one-sc-latin-400-normal-S0-WUI6t.woff2) format("woff2"),
    url(./bowlby-one-sc-latin-400-normal-Cvshkqyr.woff) format("woff");
}
@font-face {
  font-family: Montserrat;
  font-style: italic;
  font-display: swap;
  font-weight: 900;
  src:
    url(./montserrat-latin-900-italic-1mKAuaW_.woff2) format("woff2"),
    url(./montserrat-latin-900-italic-CwYbzBdp.woff) format("woff");
}
@font-face {
  font-family: Archivo Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url(./archivo-vietnamese-standard-normal-rJmnGBSt.woff2)
    format("woff2-variations");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: Archivo Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url(./archivo-latin-ext-standard-normal-7khWdh9v.woff2)
    format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: Archivo Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url(./archivo-latin-standard-normal-DY7AcnAa.woff2)
    format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: IBM Plex Mono;
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src:
    url(./ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2) format("woff2"),
    url(./ibm-plex-mono-latin-500-normal-CB9ihrfo.woff) format("woff");
}
:root {
  --bg: #f4f2ed;
  --surface: #ffffff;
  --surface2: #faf8f4;
  --line: #e5e0d6;
  --line2: #eeeae2;
  --ink: #0e1a2b;
  --muted: #5b687a;
  --faint: #8591a2;
  --navy: #0c2340;
  --navy2: #153259;
  --navyInk: #c3cddc;
  --navyActive: #1f4272;
  --accent: #16365f;
  --accentInk: #ffffff;
  --accentSoft: #e8ecf3;
  --brass: #2563eb;
  --brassSoft: #e6eefd;
  --ok: #157a4b;
  --okSoft: #e2f3ea;
  --warn: #955800;
  --warnSoft: #fcf1dc;
  --bad: #b3302a;
  --badSoft: #fae7e5;
  --violet: #5e45bf;
  --violetSoft: #eeeafb;
  --chrome: #0a1322;
  --chromeInk: #d5deea;
  --shadow: 0 1px 2px rgba(14, 26, 43, 0.05), 0 6px 18px rgba(14, 26, 43, 0.06);
  --r: 12px;
  --font: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0b111b;
    --surface: #121a27;
    --surface2: #0f1622;
    --line: #243145;
    --line2: #1b2536;
    --ink: #e5ebf4;
    --muted: #9ca9bb;
    --faint: #718097;
    --navy: #0a1830;
    --navy2: #132746;
    --navyInk: #a9b9cf;
    --navyActive: #1c3963;
    --accent: #6ea8ff;
    --accentInk: #061229;
    --accentSoft: #13254a;
    --brass: #6ea8ff;
    --brassSoft: #13254a;
    --ok: #52c28e;
    --okSoft: #11301f;
    --warn: #e6ae52;
    --warnSoft: #33270f;
    --bad: #f07f75;
    --badSoft: #3a1714;
    --violet: #ab9bf4;
    --violetSoft: #251e47;
    --chrome: #060b14;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b111b;
  --surface: #121a27;
  --surface2: #0f1622;
  --line: #243145;
  --line2: #1b2536;
  --ink: #e5ebf4;
  --muted: #9ca9bb;
  --faint: #718097;
  --navy: #0a1830;
  --navy2: #132746;
  --navyInk: #a9b9cf;
  --navyActive: #1c3963;
  --accent: #6ea8ff;
  --accentInk: #061229;
  --accentSoft: #13254a;
  --brass: #6ea8ff;
  --brassSoft: #13254a;
  --ok: #52c28e;
  --okSoft: #11301f;
  --warn: #e6ae52;
  --warnSoft: #33270f;
  --bad: #f07f75;
  --badSoft: #3a1714;
  --violet: #ab9bf4;
  --violetSoft: #251e47;
  --chrome: #060b14;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
* {
  box-sizing: border-box;
}
html,
body {
  background: var(--bg);
  margin: 0;
}
body {
  color: var(--ink);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
h1,
h2,
h3 {
  margin: 0;
  text-wrap: balance;
  letter-spacing: -0.012em;
}
p {
  margin: 0;
}
a {
  color: var(--accent);
}
.mono {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-size: 0.92em;
}
.muted {
  color: var(--muted);
}
.faint {
  color: var(--faint);
}
.small {
  font-size: 12.5px;
}
.row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none;
    animation: none;
  }
}
.pbar {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 40;
  background: var(--chrome);
  color: var(--chromeInk);
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 16px;
  flex-wrap: wrap;
}
.pbar-name {
  font-weight: 700;
  font-size: 13px;
  display: flex;
  gap: 8px;
  align-items: center;
  white-space: nowrap;
  color: #fff;
}
.pbar-tag {
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8494ab;
  border: 1px solid #26354c;
  border-radius: 999px;
  padding: 2px 8px;
  font-weight: 600;
}
.seg {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
  flex: 1 1 auto;
  min-width: 0;
}
.seg button {
  background: transparent;
  border: 0;
  color: #a2b2c7;
  padding: 7px 12px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
  cursor: pointer;
}
.seg button:hover {
  color: #fff;
  background: #152238;
}
.seg button[aria-current="true"] {
  background: #20324f;
  color: #fff;
}
.pbar-note {
  font-size: 12px;
  color: #8494ab;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .pbar-note {
    display: none;
  }
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
  padding: 9px 14px;
  font-weight: 600;
  cursor: pointer;
  min-height: 40px;
  text-decoration: none;
  color: var(--ink);
  white-space: nowrap;
}
.btn:hover {
  border-color: var(--faint);
}
.btn.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accentInk);
}
.btn.primary:hover {
  filter: brightness(1.08);
}
.btn.navy {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}
.btn.danger {
  color: var(--bad);
}
.btn.block {
  width: 100%;
}
.btn.sm {
  min-height: 32px;
  padding: 5px 10px;
  font-size: 13px;
  border-radius: 8px;
}
.btn.lg {
  min-height: 50px;
  font-size: 15px;
  border-radius: 12px;
}
.btn.ghost {
  background: transparent;
  border-color: transparent;
  color: var(--accent);
  padding-inline: 6px;
}
.btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}
.iconbtn {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: none;
  color: var(--ink);
}
.iconbtn .dot {
  position: absolute;
  top: 8px;
  right: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--bad);
  border: 2px solid var(--surface);
}
.card,
.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 9px;
  border-radius: 999px;
  white-space: nowrap;
  line-height: 1.6;
}
.itile {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex: none;
}
.t-blue {
  background: var(--accentSoft);
  color: var(--accent);
}
.t-green {
  background: var(--okSoft);
  color: var(--ok);
}
.t-amber {
  background: var(--warnSoft);
  color: var(--warn);
}
.t-red {
  background: var(--badSoft);
  color: var(--bad);
}
.t-violet {
  background: var(--violetSoft);
  color: var(--violet);
}
.t-grey {
  background: var(--line2);
  color: var(--muted);
}
.av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 10.5px;
  font-weight: 700;
  flex: none;
  letter-spacing: 0.02em;
}
.avs {
  display: flex;
}
.avs .av {
  border: 2px solid var(--surface);
  margin-left: -7px;
}
.avs .av:first-child {
  margin-left: 0;
}
.eyebrow {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--faint);
}
.bar {
  height: 6px;
  background: var(--line2);
  border-radius: 6px;
  overflow: hidden;
}
.bar i {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 6px;
}
.bar.ok i {
  background: var(--ok);
}
.field {
  display: grid;
  gap: 6px;
}
.field > label,
.flabel {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
}
input,
select,
textarea {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 10px;
  padding: 9px 12px;
  min-height: 42px;
  width: 100%;
}
textarea {
  min-height: 84px;
  resize: vertical;
}
input[type="checkbox"] {
  padding: 0;
  min-height: 0;
}
input:focus,
select:focus,
textarea:focus {
  outline: 2px solid var(--accentSoft);
  border-color: var(--accent);
}
.err {
  color: var(--bad);
  font-size: 13px;
  font-weight: 600;
}
.grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 560px) {
  .grid2 {
    grid-template-columns: 1fr;
  }
}
.dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px 18px;
  margin: 0;
}
.dl dt {
  color: var(--muted);
}
.dl dd {
  margin: 0;
  font-weight: 600;
  min-width: 0;
}
.empty {
  padding: 22px;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
}
.toast {
  position: fixed;
  left: 50%;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  transform: translate(-50%);
  background: var(--chrome);
  color: #fff;
  padding: 10px 16px;
  border-radius: 10px;
  z-index: 90;
  font-weight: 600;
  font-size: 13px;
  box-shadow: 0 10px 30px #00000040;
  max-width: calc(100% - 32px);
}
.overlay {
  position: fixed;
  inset: 0;
  background: #060c1685;
  z-index: 85;
  display: grid;
  place-items: center;
  padding: 16px;
}
.overlay {
  height: 100vh;
  height: 100dvh;
  bottom: auto;
}
.modal {
  background: var(--surface);
  border-radius: 16px;
  width: min(580px, 100%);
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  box-shadow: 0 24px 70px #0000004d;
}
.modal-h {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 2;
}
.modal-h h2 {
  font-size: 17px;
  font-weight: 700;
  margin-top: 2px;
}
.modal-b {
  padding: 20px;
  display: grid;
  gap: 16px;
}
.modal-f {
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  position: sticky;
  bottom: 0;
  background: var(--surface);
  flex-wrap: wrap;
}
@media (max-width: 600px) {
  .overlay {
    padding: 0;
    place-items: end stretch;
  }
  .modal {
    border-radius: 16px 16px 0 0;
    max-height: 94vh;
    max-height: 94dvh;
    width: 100%;
  }
  .modal-f {
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  }
}
.steps {
  display: flex;
  gap: 6px;
  padding: 0 20px 14px;
  border-bottom: 1px solid var(--line);
}
.steps i {
  height: 4px;
  flex: 1;
  border-radius: 4px;
  background: var(--line);
}
.steps i.on {
  background: var(--accent);
}
.opt {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
  background: var(--surface);
  text-align: left;
  width: 100%;
}
.opt:hover {
  border-color: var(--faint);
}
.opt[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accentSoft);
}
.seg2 {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.seg2 button {
  flex: 1 1 90px;
  padding: 8px 6px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
  line-height: 1.25;
}
.seg2 button small {
  display: block;
  font-weight: 500;
  color: var(--muted);
  font-size: 11.5px;
}
.seg2 button[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accentSoft);
  color: var(--accent);
}
.seg2 button[aria-pressed="true"] small {
  color: var(--accent);
}
.checks {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.checks label {
  display: flex;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 6px 10px 6px 6px;
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
}
.checks input {
  width: 18px;
  height: 18px;
  min-height: 0;
  accent-color: var(--accent);
}
.success {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 10px;
  padding: 10px 0;
}
.success .big {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
}
.bk {
  max-width: 1040px;
  margin: 0 auto;
  padding-block: 20px 40px;
  padding-inline: 16px;
}
.bk-hero {
  position: relative;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  height: 230px;
  background: #9ec3e8;
}
.bk-hero > svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.bk-brand {
  position: absolute;
  left: 22px;
  top: 22px;
  display: flex;
  gap: 14px;
  align-items: center;
  color: #fff;
  background: #0916289e;
  backdrop-filter: blur(6px);
  padding: 10px 18px 10px 10px;
  border-radius: 12px;
  max-width: calc(100% - 44px);
}
.bk-logo {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  border: 1.5px solid rgba(255, 255, 255, 0.7);
  display: grid;
  place-items: center;
  flex: none;
}
.bk-name {
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2;
}
.bk-tag {
  font-size: 13px;
  opacity: 0.85;
}
.bk-intro {
  margin: -44px 20px 0;
  position: relative;
  padding: 22px 24px;
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  box-shadow: var(--shadow);
}
.bk-intro h1 {
  font-size: 25px;
  font-weight: 800;
}
.bk-intro p {
  color: var(--muted);
  margin-top: 6px;
  max-width: 58ch;
}
.chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.chip {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  font-size: 12.5px;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 10px;
  color: var(--muted);
  font-weight: 500;
}
.bk-cta {
  display: grid;
  gap: 6px;
  justify-items: start;
}
.sec {
  margin-top: 30px;
}
.sec-h {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.sec-h h2 {
  font-size: 19px;
  font-weight: 700;
  margin-top: 2px;
}
.svc-list {
  display: grid;
  gap: 10px;
}
.svc {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--ink);
}
.svc:hover {
  border-color: var(--accent);
}
.svc-main {
  flex: 1;
  min-width: 0;
}
.svc-name {
  font-weight: 700;
  font-size: 15px;
}
.svc-desc {
  color: var(--muted);
  font-size: 13px;
}
.svc-price {
  text-align: right;
  white-space: nowrap;
}
.svc-price small {
  display: block;
  color: var(--faint);
  font-size: 11px;
}
.svc-price b {
  font-size: 16px;
}
.three {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
@media (max-width: 820px) {
  .three {
    grid-template-columns: 1fr;
  }
}
.step-card {
  padding: 18px;
  display: grid;
  gap: 6px;
}
.step-n {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--accent);
  font-weight: 500;
}
.review {
  padding: 18px;
  display: grid;
  gap: 10px;
  align-content: start;
}
.stars {
  color: #d99a00;
  display: flex;
  gap: 2px;
}
.promise {
  padding: 20px 22px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
}
.area-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bk-foot {
  margin-top: 32px;
  background: var(--navy);
  color: var(--navyInk);
  border-radius: 12px;
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
}
@media (max-width: 600px) {
  .bk-hero {
    height: 170px;
    border-radius: 12px 12px 0 0;
  }
  .bk-brand {
    left: 12px;
    top: 12px;
    max-width: calc(100% - 24px);
  }
  .bk-name {
    font-size: 16px;
  }
  .bk-intro {
    margin: -30px 8px 0;
    padding: 18px;
  }
  .bk-intro h1 {
    font-size: 21px;
  }
  .bk-cta {
    justify-items: stretch;
    width: 100%;
  }
  .svc {
    padding: 12px;
  }
}
.ops {
  display: grid;
  grid-template-columns: 228px minmax(0, 1fr);
  min-height: calc(100vh - 52px);
}
.ops-side {
  background: var(--navy);
  color: var(--navyInk);
  display: flex;
  flex-direction: column;
  padding: 16px 12px;
  gap: 10px;
}
.side-brand {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #fff;
  padding: 4px 8px 12px;
}
.side-brand b {
  display: block;
  font-size: 15px;
  line-height: 1.2;
}
.side-brand small {
  font-size: 10.5px;
  color: var(--navyInk);
}
.side-nav {
  display: grid;
  gap: 2px;
}
.side-nav button,
.side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 0;
  color: var(--navyInk);
  padding: 9px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 600;
  font-size: 13.5px;
  text-align: left;
  width: 100%;
}
.side-nav button:hover,
.side-link:hover {
  background: var(--navy2);
  color: #fff;
}
.side-nav button[aria-current="true"] {
  background: var(--navyActive);
  color: #fff;
}
.side-nav .count {
  margin-left: auto;
  background: #fff;
  color: var(--navy);
  font-size: 11px;
  border-radius: 999px;
  padding: 0 7px;
  font-weight: 700;
}
.side-foot {
  margin-top: auto;
  display: grid;
  gap: 4px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 12px;
}
.ws {
  font-size: 12.5px;
  color: #fff;
  font-weight: 600;
  padding: 2px 10px 8px;
  line-height: 1.3;
}
.ws small {
  display: block;
  color: var(--navyInk);
  font-weight: 500;
  font-size: 11.5px;
}
.me {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 4px 10px 8px;
  color: #fff;
  font-size: 13px;
  line-height: 1.2;
}
.me small {
  display: block;
  color: var(--navyInk);
  font-size: 11.5px;
}
.ops-main {
  padding: 20px 24px 48px;
  min-width: 0;
}
.ops-top {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}
.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 12px;
  flex: 0 1 400px;
  color: var(--faint);
}
.search input {
  border: 0;
  min-height: 38px;
  padding: 0;
  background: transparent;
  color: var(--ink);
}
.search input:focus {
  outline: none;
}
.ph {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.ph h1 {
  font-size: 23px;
  font-weight: 800;
}
.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.stat {
  padding: 14px;
  display: flex;
  gap: 12px;
  align-items: center;
  cursor: pointer;
  text-align: left;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--ink);
}
.stat:hover {
  border-color: var(--faint);
}
.stat-l {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.stat-v {
  font-size: 25px;
  font-weight: 800;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.stat-s {
  font-size: 11.5px;
  color: var(--faint);
}
@media (max-width: 1100px) {
  .stats {
    grid-template-columns: repeat(2, 1fr);
  }
}
.panel-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  gap: 10px;
  flex-wrap: wrap;
}
.panel-h h2 {
  font-size: 15px;
  font-weight: 700;
}
.jobcards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
  gap: 12px;
  padding: 0 16px 16px;
}
.jc {
  padding: 14px;
  display: grid;
  gap: 10px;
  cursor: pointer;
  text-align: left;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--ink);
}
.jc:hover {
  border-color: var(--faint);
}
.jc-top {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: start;
}
.tbl-wrap {
  overflow-x: auto;
}
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}
th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--faint);
  text-align: left;
  font-weight: 700;
  padding: 8px 16px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
td {
  padding: 11px 16px;
  border-bottom: 1px solid var(--line2);
  vertical-align: middle;
}
tr:last-child td {
  border-bottom: 0;
}
tr.click {
  cursor: pointer;
}
tr.click:hover td {
  background: var(--surface2);
}
.two {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  gap: 16px;
  margin-top: 16px;
  align-items: start;
}
@media (max-width: 1150px) {
  .two {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 1150px) {
  .home-two > .stack:last-child {
    order: -1;
  }
}
.stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-content: start;
}
.filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.fbtn {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  color: var(--muted);
}
.fbtn[aria-pressed="true"] {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}
.req {
  padding: 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}
.req-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media (max-width: 760px) {
  .req {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .req-actions {
    grid-column: 1/-1;
    justify-content: flex-start;
  }
}
.note {
  background: var(--surface2);
  border: 1px solid var(--line2);
  border-radius: 10px;
  padding: 10px 12px;
  color: var(--muted);
  font-size: 13px;
  margin-top: 8px;
}
.list {
  display: grid;
}
.li {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px 16px;
  border-top: 1px solid var(--line2);
}
.li-main {
  flex: 1;
  min-width: 0;
}
.week-wrap {
  overflow-x: auto;
  padding-bottom: 4px;
}
.week {
  display: grid;
  grid-template-columns: repeat(7, minmax(128px, 1fr));
  gap: 8px;
  min-width: 920px;
}
.day {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px;
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 200px;
}
.day.today {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.day-h {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.blk {
  border-radius: 8px;
  padding: 8px;
  font-size: 12px;
  cursor: pointer;
  text-align: left;
  border: 0;
  display: grid;
  gap: 2px;
  line-height: 1.3;
}
.blk b {
  font-size: 12.5px;
}
@media (max-width: 760px) {
  .week {
    min-width: 0;
    grid-template-columns: 1fr;
  }
  .day {
    min-height: 0;
  }
}
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 12px;
}
.tm {
  padding: 16px;
  display: grid;
  gap: 10px;
}
.set-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 1000px) {
  .set-grid {
    grid-template-columns: 1fr;
  }
}
.pad {
  padding: 0 16px 16px;
  display: grid;
  gap: 12px;
}
.price-in {
  width: 96px;
  min-height: 34px;
  padding: 5px 8px;
}
.sw {
  width: 18px;
  height: 18px;
  min-height: 0;
  accent-color: var(--accent);
}
@media (max-width: 860px) {
  .ops {
    grid-template-columns: minmax(0, 1fr);
  }
  .ops-side {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 12px;
    gap: 6px;
  }
  .side-brand {
    padding: 0 6px;
  }
  .side-nav {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
    flex-basis: 100%;
    min-width: 0;
    width: 100%;
  }
  .side-nav button {
    white-space: nowrap;
    width: auto;
  }
  .side-foot {
    display: none;
  }
  .ops-main {
    padding: 16px 16px 40px;
  }
  .ph h1 {
    font-size: 20px;
  }
}
.fwrap {
  display: flex;
  gap: 36px;
  justify-content: center;
  align-items: flex-start;
  padding: 24px 16px 40px;
  flex-wrap: wrap;
}
.fside {
  width: 300px;
  max-width: 100%;
  display: grid;
  gap: 14px;
  padding-top: 24px;
}
.fside h2 {
  font-size: 22px;
  font-weight: 800;
}
.phone {
  width: 390px;
  max-width: 100%;
  height: 800px;
  border-radius: 46px;
  border: 10px solid #0a1322;
  background: var(--bg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 30px 60px #0a132238;
}
.p-status {
  display: flex;
  justify-content: space-between;
  padding: 12px 26px 4px;
  font-size: 13px;
  font-weight: 700;
}
.p-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 6px 16px 16px;
  display: grid;
  grid-auto-rows: max-content;
  gap: 14px;
  align-content: start;
}
.p-tabs {
  display: flex;
  border-top: 1px solid var(--line);
  background: var(--surface);
  padding-bottom: 6px;
}
.p-tabs button {
  flex: 1;
  padding: 9px 0 8px;
  background: transparent;
  border: 0;
  display: grid;
  justify-items: center;
  gap: 2px;
  font-size: 11px;
  font-weight: 600;
  color: var(--faint);
  cursor: pointer;
}
.p-tabs button[aria-current="true"] {
  color: var(--accent);
}
.f-title {
  font-size: 24px;
  font-weight: 800;
}
.fjob {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  color: var(--ink);
}
.fjob.next {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accentSoft);
}
.fjob.dim {
  opacity: 0.62;
}
.map {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  height: 170px;
  background: var(--surface2);
}
.map svg {
  display: block;
  width: 100%;
  height: 100%;
}
.notice {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}
.notice.amber {
  background: var(--warnSoft);
  color: var(--warn);
}
.notice.lock {
  background: var(--surface);
  border: 1px dashed var(--line);
  color: var(--muted);
  font-weight: 500;
}
.notice svg {
  flex: none;
  margin-top: 1px;
}
.frow {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.cl {
  display: grid;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.cl label {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line2);
  cursor: pointer;
  font-weight: 500;
}
.cl label:last-child {
  border-bottom: 0;
}
.cl input {
  width: 22px;
  height: 22px;
  min-height: 0;
  accent-color: var(--ok);
  flex: none;
}
.cl input:checked + span {
  color: var(--faint);
  text-decoration: line-through;
}
.photos {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.ph-slot {
  border: 1.5px dashed var(--line);
  border-radius: 12px;
  aspect-ratio: 1/1;
  display: grid;
  place-items: center;
  overflow: hidden;
  position: relative;
  background: var(--surface);
  cursor: pointer;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 600;
  max-width: 100%;
  text-align: center;
  align-content: center;
  gap: 4px;
}
.ph-slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ph-slot input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  min-height: 0;
}
.sticky-cta {
  position: sticky;
  bottom: -16px;
  padding: 12px 0 16px;
  margin-bottom: -16px;
  background: linear-gradient(to bottom, transparent, var(--bg) 28%);
  display: grid;
  gap: 6px;
}
.sec-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
  font-size: 13.5px;
  margin-bottom: -6px;
}
@media (max-width: 560px) {
  .fwrap {
    padding: 0;
    gap: 0;
  }
  .fside {
    width: 100%;
    padding: 12px 16px;
    gap: 8px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
  }
  .fside .desk {
    display: none;
  }
  .phone {
    border: 0;
    border-radius: 0;
    height: calc(100vh - 150px);
    min-height: 560px;
    box-shadow: none;
    width: 100%;
  }
  .p-status {
    display: none;
  }
}
.rp-wrap {
  padding: 20px 16px 48px;
  display: grid;
  gap: 14px;
  justify-items: center;
}
.rp-pick {
  width: min(760px, 100%);
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--muted);
}
.rp-pick select {
  width: auto;
  flex: 1 1 240px;
}
.rp {
  width: min(760px, 100%);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.rp-top {
  background: var(--navy);
  color: #fff;
  padding: 18px 24px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.rp-body {
  padding: 22px 24px 26px;
  display: grid;
  gap: 24px;
}
.rp-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 600px) {
  .rp-meta {
    grid-template-columns: 1fr 1fr;
  }
  .rp-body {
    padding: 18px;
  }
}
.meta-l {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--faint);
  font-weight: 700;
}
.ba {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ba figure {
  margin: 0;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--surface2);
  max-width: 100%;
  display: grid;
  place-items: center;
  color: var(--faint);
  font-size: 12.5px;
}
.ba img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.tag {
  position: absolute;
  left: 10px;
  top: 10px;
  background: #0a1322c7;
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 6px;
}
.ba-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}
.dots {
  display: flex;
  gap: 6px;
}
.dots button {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 0;
  background: var(--line);
  padding: 0;
  cursor: pointer;
}
.dots button[aria-current="true"] {
  background: var(--accent);
}
.done-list div {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--line2);
}
.done-list div:last-child {
  border-bottom: 0;
}
.pay {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  flex-wrap: wrap;
}
.quote {
  border-left: 3px solid var(--line);
  padding: 2px 0 2px 14px;
  color: var(--muted);
}
.cn {
  max-width: 1120px;
  margin: 0 auto;
  padding-block: 24px 48px;
  padding-inline: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}
.tpls {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 12px;
}
.tpl {
  padding: 16px;
  display: grid;
  gap: 8px;
  align-content: start;
}
.login-wrap {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding-block: 32px;
  padding-inline: 16px;
}
.login {
  width: min(440px, 100%);
  padding: 24px;
  display: grid;
  gap: 14px;
  box-shadow: var(--shadow);
}
.login h1 {
  font-size: 21px;
  font-weight: 800;
}
.login-brand {
  display: flex;
  gap: 10px;
  align-items: center;
  color: var(--ink);
}
.login-brand b {
  display: block;
  font-size: 15px;
  line-height: 1.2;
}
.login-brand small {
  font-size: 11px;
  color: var(--muted);
}
.fapp {
  max-width: 560px;
  margin: 0 auto;
  height: 100vh;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  border-inline: 1px solid var(--line);
}
.fbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 12px 10px 16px;
  padding-top: calc(10px + env(safe-area-inset-top, 0px));
  background: var(--navy);
  color: #fff;
}
.fbar .btn.ghost {
  color: #fff;
}
.fbar-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fapp .p-scroll {
  padding: 16px;
}
.fapp .p-tabs {
  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
}
.fapp .sticky-cta {
  bottom: -16px;
}
@media (max-width: 560px) {
  .fapp {
    border-inline: 0;
  }
}
.hub-card {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  text-decoration: none;
  color: var(--ink);
}
.hub-card:hover {
  border-color: var(--accent);
}
.hub-card p {
  margin-top: 2px;
}
.fback {
  background: transparent;
  border: 0;
  color: #fff;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  cursor: pointer;
  margin-left: -6px;
  flex: none;
}
.fback:hover {
  background: #ffffff1f;
}
.demobar {
  position: sticky;
  top: 0;
  z-index: 55;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 12px;
  padding-top: calc(5px + env(safe-area-inset-top, 0px));
  background: #fff1cc;
  color: #5e4300;
  font-size: 12.5px;
  font-weight: 600;
  border-bottom: 1px solid #ebd28e;
}
.demobar button,
.demobar a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: 0;
  color: #5e4300;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  padding: 4px 6px;
  border-radius: 6px;
  min-height: 28px;
}
.demobar button:hover,
.demobar a:hover {
  background: #5e43001a;
}
body.has-demobar .fapp {
  height: calc(100vh - 39px);
  height: calc(100dvh - 39px);
}
body.has-demobar .fbar {
  padding-top: 10px;
}
body.has-demobar .login-wrap {
  min-height: calc(100vh - 39px);
}
.demo-try {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  background: var(--surface2);
}
.hiw-step {
  padding: 20px;
  display: grid;
  gap: 10px;
  align-content: start;
}
.hiw-step h3 {
  font-size: 17px;
  font-weight: 800;
}
.hiw-step .btn {
  justify-self: start;
  margin-top: 4px;
}
.ticks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}
.ticks li {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 8px;
  align-items: start;
  font-size: 13.5px;
  line-height: 1.45;
}
.tick {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--okSoft);
  color: var(--ok);
  margin-top: 1px;
}
.hiw-note {
  border-top: 1px solid var(--line2);
  padding-top: 10px;
  font-size: 12.5px;
  color: var(--muted);
}
.aud-card {
  padding: 22px;
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.aud {
  grid-template-columns: 1fr 1fr;
  gap: 10px 22px;
}
.closing {
  background: var(--navy);
  color: #fff;
  border-radius: 14px;
  padding: 22px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
@media (max-width: 760px) {
  .aud-card,
  .aud {
    grid-template-columns: 1fr;
  }
  .closing .btn {
    width: 100%;
  }
}
.step-edit {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  margin: 0;
  display: grid;
  gap: 10px;
  min-width: 0;
}
.step-edit legend {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  padding: 0 6px;
}
.bpage {
  background: var(--bg);
  color: var(--ink);
  min-height: 100vh;
  padding-inline: 16px;
  padding-block: 56px 40px;
}
.bp-wrap {
  max-width: 760px;
  margin: 0 auto;
  display: grid;
  gap: 72px;
}
.bp-hero {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 18px;
}
.bp-logo {
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow:
    0 12px 34px #1418201f,
    0 0 0 9px color-mix(in srgb, var(--surface) 65%, transparent);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.bp-logo img {
  width: 80%;
  height: 80%;
  object-fit: contain;
}
.bp-mono {
  font-size: 36px;
  font-weight: 800;
  color: var(--brandText);
  letter-spacing: -0.03em;
}
.bp-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 999px;
  padding: 6px 15px;
  font-size: 12px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--brandText);
}
.bp-label i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--brand);
}
.bp-hero h1 {
  font-size: clamp(34px, 6.6vw, 60px);
  line-height: 1.03;
  letter-spacing: -0.037em;
  font-weight: 800;
  max-width: 15ch;
}
.bp-lede {
  font-size: clamp(16px, 2.3vw, 19px);
  line-height: 1.6;
  color: var(--muted);
  max-width: 54ch;
}
.bp-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 4px;
}
.bp-cta .btn.lg {
  padding-inline: 26px;
  border-radius: 999px;
}
.bp-cta .btn.ghost {
  color: var(--ink);
  padding-inline: 14px;
}
.bp-proof {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 14px;
  color: var(--muted);
}
.bp-proof b {
  color: var(--ink);
}
.bp-proof span {
  color: var(--faint);
}
.bp-rule {
  width: 128px;
  height: 14px;
  margin-top: 4px;
}
.bp-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.bp-link {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 10px 18px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
}
.bp-link:hover {
  border-color: var(--brand);
}
.bp-sec {
  display: grid;
  gap: 24px;
}
.bp-head {
  display: grid;
  gap: 8px;
  text-align: center;
  justify-items: center;
}
.bp-eyebrow {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--brandText);
}
.bp-head h2 {
  font-size: clamp(26px, 4.2vw, 38px);
  letter-spacing: -0.028em;
  line-height: 1.1;
  font-weight: 800;
  max-width: 20ch;
}
.bp-muted {
  color: var(--muted);
}
.bpage .tick {
  background: var(--accentSoft);
  color: var(--brandText);
}
.bp-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  border-top: 1px solid var(--line);
}
.bp-steps > li {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 18px;
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
}
.bp-steps > li > div {
  display: grid;
  gap: 10px;
}
.bp-num {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--accentSoft);
  color: var(--brandText);
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 18px;
}
.bp-steps h3 {
  font-size: 21px;
  font-weight: 800;
  letter-spacing: -0.018em;
}
.bp-note {
  font-size: 13px;
  color: var(--faint);
}
.bp-services {
  display: grid;
  border-top: 1px solid var(--line);
}
.bp-svc {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 30px;
  gap: 18px;
  align-items: center;
  padding: 20px 4px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  text-align: left;
  cursor: pointer;
  color: var(--ink);
  font: inherit;
}
.bp-svc > div:first-child {
  display: grid;
  gap: 4px;
}
.bp-svc > div:first-child b {
  font-size: 17px;
}
.bp-price {
  text-align: right;
  display: grid;
  line-height: 1.25;
}
.bp-price b {
  font-size: 17px;
}
.bp-price small {
  color: var(--faint);
  font-size: 12px;
}
.bp-go {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  color: var(--ink);
}
.bp-svc:hover .bp-go,
.bp-svc:focus-visible .bp-go {
  background: var(--brand);
  border-color: var(--brand);
  color: var(--accentInk);
}
.bp-aud {
  grid-template-columns: 1fr 1fr;
  gap: 12px 28px;
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}
.bp-form {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 22px 60px #14182017;
  overflow: hidden;
  max-width: 620px;
  width: 100%;
  margin: 0 auto;
}
.bp-steps-bar {
  display: grid;
  gap: 8px;
  padding: 20px 24px 0;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--brandText);
}
.bp-steps-bar .steps i.on {
  background: var(--brand);
}
.bp-form-b {
  padding: 18px 24px;
  display: grid;
  gap: 14px;
}
.bp-form-b h3 {
  font-size: 18px;
  font-weight: 800;
}
.bp-form-f {
  padding: 14px 24px 18px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.bp-area {
  justify-items: center;
  text-align: center;
  gap: 8px;
}
.bp-area p {
  color: var(--muted);
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.bp-area p span {
  color: var(--faint);
}
.bp-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  border-top: 1px solid var(--line);
  padding-top: 22px;
  font-size: 13px;
  color: var(--muted);
}
.bp-powered {
  color: var(--faint);
}
@media (max-width: 600px) {
  .bpage {
    padding-block: 36px 32px;
  }
  .bp-wrap {
    gap: 56px;
  }
  .bp-logo {
    width: 96px;
    height: 96px;
  }
  .bp-steps > li {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 14px;
  }
  .bp-num {
    width: 38px;
    height: 38px;
    font-size: 16px;
  }
  .bp-aud {
    grid-template-columns: 1fr;
  }
  .bp-svc {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .bp-go {
    display: none;
  }
  .bp-cta .btn.lg {
    width: 100%;
  }
  .bp-form-b,
  .bp-form-f,
  .bp-steps-bar {
    padding-inline: 16px;
  }
}
.brand-edit {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface2);
}
.brand-logo {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
  overflow: hidden;
  flex: none;
  font-weight: 800;
  color: var(--muted);
}
.brand-logo img {
  width: 80%;
  height: 80%;
  object-fit: contain;
}
.bp-phone {
  font-size: 14.5px;
  color: var(--muted);
}
.bp-phone a {
  color: var(--brandText);
  font-weight: 700;
}
.bp-phone b {
  color: var(--ink);
  font-weight: 600;
  margin-left: 4px;
}
.stars {
  display: inline-flex;
  gap: 1px;
  color: #e0a100;
  vertical-align: -2px;
}
.stars .off {
  color: var(--line);
}
.stars svg {
  fill: currentColor;
}
.bp-reviews {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px 36px;
  border-top: 1px solid var(--line);
  padding-top: 28px;
}
.bp-review {
  margin: 0;
  display: grid;
  gap: 10px;
  align-content: start;
}
.bp-review blockquote {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
}
.bp-review figcaption {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--muted);
}
.bp-review figcaption span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  color: var(--brandText);
  font-weight: 600;
}
.bp-review figcaption a {
  color: inherit;
}
@media (max-width: 600px) {
  .bp-reviews {
    grid-template-columns: 1fr;
    gap: 26px;
  }
}
.rv-group {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}
.rv-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--line2);
  align-items: start;
}
.rv-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.rv-body {
  color: var(--ink);
  font-size: 13.5px;
}
.rv-form {
  display: grid;
  gap: 12px;
}
.ed-h {
  font-size: 14px;
  font-weight: 800;
  margin-top: 6px;
}
@media (max-width: 700px) {
  .rv-row {
    grid-template-columns: 1fr;
  }
}
.rate {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface2);
}
.rate-stars {
  display: flex;
  gap: 6px;
}
.rate-stars button {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
  cursor: pointer;
  color: var(--line);
  display: grid;
  place-items: center;
}
.rate-stars button[aria-pressed="true"] {
  color: #e0a100;
  border-color: #e0a100;
}
.rate-stars svg {
  fill: currentColor;
}
.modal:has(.wide-editor) {
  width: min(1040px, 100%);
}
.bp-preview {
  max-width: 760px;
  margin: -24px auto 28px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px dashed var(--line);
  background: var(--surface);
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}
.rtag {
  display: inline-flex;
  vertical-align: -2px;
  margin-left: 6px;
  color: var(--violet);
}
.blk .rtag {
  color: inherit;
  margin-left: 4px;
}
.linkbtn {
  background: none;
  border: 0;
  padding: 0;
  color: var(--accent);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.check-line {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.check-line input {
  width: 18px;
  height: 18px;
  flex: none;
  margin: 0;
}
.notice:not(.amber):not(.lock):not(.violet) {
  background: var(--surface2);
  color: var(--ink);
  border: 1px solid var(--line);
}
.notice.violet {
  background: var(--violetSoft);
  color: var(--violet);
}
.btn.ghost.danger {
  color: var(--bad);
}
.btn.danger-fill {
  background: var(--bad);
  border-color: var(--bad);
  color: #fff;
}
.pill svg {
  vertical-align: -2px;
}
.offline-bar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  background: var(--warnSoft);
  color: var(--warn);
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}
.offline-bar.syncing {
  background: var(--accentSoft);
  color: var(--accent);
}
.freq-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.freq-opts label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  background: var(--card, #fff);
}
.freq-opts input {
  margin: 0;
}
.freq-opts label:has(input:checked) {
  border-color: var(--brand, var(--accent));
  box-shadow: 0 0 0 1px var(--brand, var(--accent));
}
.bp-freq {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--brandText, var(--accent));
}
.vr-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mail {
  border-top: 1px solid var(--line2);
}
.mail summary {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
}
.mail summary::-webkit-details-marker {
  display: none;
}
.mail-s {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.mail-b {
  padding: 4px 16px 16px;
  margin-left: 16px;
  border-left: 3px solid var(--line);
  font-size: 14px;
}
.mail-b p {
  margin: 0 0 10px;
}
.pay-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface2);
}
.pay-methods {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pay-methods li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: var(--surface);
}
.pay-opt {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  text-decoration: none;
  color: var(--ink);
}
.pay-opt b {
  display: block;
}
.pay-mark {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
  background: var(--surface2);
  color: var(--ink);
}
.bp-pay {
  display: grid;
  gap: 8px;
  justify-items: center;
  margin-top: 10px;
}
.bp-pay .pay-methods {
  justify-content: center;
}
.board {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(200px, 1fr);
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
  align-items: start;
}
.board-col {
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
  display: grid;
  gap: 8px;
  min-width: 0;
}
.board-h {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
  padding: 2px 4px 4px;
}
.board-h .small {
  width: 100%;
}
.dcard {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  display: grid;
}
.dcard.dim {
  opacity: 0.6;
}
.dcard-main {
  display: grid;
  gap: 4px;
  text-align: left;
  background: none;
  border: 0;
  padding: 10px 12px 6px;
  font: inherit;
  color: var(--ink);
  cursor: pointer;
  min-width: 0;
}
.dcard-main b {
  font-size: 14px;
  line-height: 1.3;
}
.dcard-main .bad {
  color: var(--bad);
}
.dcard-move {
  display: flex;
  justify-content: space-between;
  padding: 0 6px 6px;
}
.iconbtn.sm {
  width: 28px;
  height: 28px;
  min-height: 28px;
}
.task-check {
  width: 18px;
  height: 18px;
  flex: none;
  margin: 0;
}
.strike {
  text-decoration: line-through;
}
.opt input[type="radio"] {
  margin: 0;
}
.bp-extra {
  font-size: 13px;
  color: var(--muted);
  font-weight: 600;
}
.crumbs {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--faint);
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.crumbs button {
  background: none;
  border: 0;
  padding: 0;
  color: var(--accent);
  font-weight: 600;
  cursor: pointer;
}
.crumbs span {
  color: var(--muted);
  font-weight: 600;
}
.ws-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.ws-head h1 {
  font-size: 23px;
  font-weight: 800;
}
.tabs {
  display: flex;
  gap: 2px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 16px;
  overflow-x: auto;
  scrollbar-width: none;
}
.tabs button {
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 10px 14px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
  margin-bottom: -1px;
}
.tabs button:hover {
  color: var(--ink);
}
.tabs button[aria-selected="true"] {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.toolbar .search {
  flex: 0 1 320px;
}
.fcount {
  font-size: 11.5px;
  opacity: 0.7;
  margin-left: 2px;
}
.cell-main {
  display: flex;
  gap: 12px;
  align-items: center;
}
.nowrap {
  white-space: nowrap;
}
.tr {
  text-align: right;
  color: var(--faint);
}
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.li.click {
  cursor: pointer;
}
.li.click:hover {
  background: var(--surface2);
}
.li-side {
  text-align: right;
}
.howto {
  margin: 0;
  padding: 0 16px 16px 36px;
  display: grid;
  gap: 12px;
}
.howto li {
  padding-left: 4px;
}
.howto li b {
  display: block;
}
.mod-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 10px;
  padding: 0 16px 16px;
}
.mod {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface2);
}
.mod > svg {
  flex: none;
  margin-top: 2px;
  color: var(--accent);
}
.mod.pick {
  cursor: pointer;
  background: var(--surface);
}
.mod.pick input {
  margin: 3px 0 0;
  width: 16px;
  height: 16px;
  min-height: 0;
  accent-color: var(--accent);
  flex: none;
}
.mod.pick:has(input:checked) {
  border-color: var(--accent);
  background: var(--accentSoft);
}
.mtags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.mtag {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--muted);
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 1px 7px;
  white-space: nowrap;
}
button.tpl {
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  width: 100%;
}
button.tpl:hover {
  border-color: var(--faint);
  box-shadow: var(--shadow);
}
button.tpl[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accentSoft);
}
.tpl p {
  min-height: 3.9em;
}
.stages {
  list-style: none;
  margin: 0;
  padding: 0 16px 16px;
  display: grid;
  gap: 8px;
  counter-reset: st;
}
.stages > li {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--surface2);
}
.stages ul {
  margin: 6px 0 0;
  padding-left: 18px;
  font-size: 13px;
  display: grid;
  gap: 3px;
}
.quote-box {
  border-left: 3px solid var(--accent);
  background: var(--surface2);
  padding: 12px 14px;
  border-radius: 0 10px 10px 0;
  display: grid;
  gap: 4px;
}
.stepper {
  list-style: none;
  margin: 0;
  padding: 16px 20px;
  display: flex;
  gap: 8px;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
  scrollbar-width: none;
}
.stepper li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--faint);
  white-space: nowrap;
  flex: 1;
}
.stepper li span {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--line);
  font-size: 12px;
  flex: none;
}
.stepper li.on {
  color: var(--ink);
}
.stepper li.on span {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accentInk);
}
.stepper li.done {
  color: var(--muted);
}
.stepper li.done span {
  border-color: var(--ok);
  background: var(--okSoft);
  color: var(--ok);
}
.wz-body {
  padding: 20px;
  display: grid;
  gap: 14px;
}
.wz-body h2 {
  font-size: 18px;
  font-weight: 800;
}
.wz-form {
  display: grid;
  gap: 14px;
  max-width: 560px;
}
.wz-nav {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 16px;
  margin-top: 4px;
}
.opt.big {
  align-items: flex-start;
  padding: 16px;
}
.grp-h {
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--faint);
  font-weight: 700;
  margin-top: 6px;
}
.slug-in {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  padding-left: 12px;
}
.slug-in input {
  border: 0;
  background: transparent;
  padding-left: 2px;
}
.slug-in:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.review-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  background: var(--surface2);
  max-width: 640px;
}
@media (max-width: 600px) {
  .stepper li {
    flex: none;
  }
  .stepper li:not(.on) {
    font-size: 0;
    gap: 0;
  }
  .wz-body {
    padding: 16px;
  }
  .ws-head h1 {
    font-size: 20px;
  }
}
.slug-in input:focus {
  outline: none;
  border: 0;
}
@media (max-width: 700px) {
  .tbl-rows thead {
    display: none;
  }
  .tbl-rows,
  .tbl-rows tbody {
    display: block;
    width: 100%;
  }
  .tbl-rows tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--line2);
    align-items: start;
  }
  .tbl-rows td {
    padding: 0;
    border: 0;
    min-width: 0;
  }
  .tbl-rows td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  .tbl-rows td:nth-child(5) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }
  .tbl-rows td:nth-child(2),
  .tbl-rows td:nth-child(3) {
    grid-column: 1/-1;
    font-size: 12.5px;
    padding-left: 48px;
    color: var(--muted);
  }
  .tbl-rows td:nth-child(4),
  .tbl-rows td:nth-child(6) {
    display: none;
  }
  .tbl-rows td[colspan] {
    grid-column: 1/-1;
    padding: 0;
  }
}
button.tpl {
  display: flex;
  flex-direction: column;
}
button.tpl .mtags {
  margin-top: auto;
}
.side-link {
  text-decoration: none;
}
.board-empty {
  border: 1.5px dashed var(--line);
  border-radius: 10px;
  padding: 14px;
  text-align: center;
  font-size: 12.5px;
  color: var(--faint);
}
.fme {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff1a;
  border: 0;
  color: #fff;
  border-radius: 999px;
  padding: 3px 12px 3px 3px;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  flex: none;
}
.fme .av {
  background: #fff;
  color: var(--navy);
}
.fme:hover {
  background: #ffffff2e;
}
.imp {
  display: grid;
  gap: 12px;
}
.imp-table {
  max-height: 420px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.imp-table th {
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 1;
}
.imp-table td {
  padding: 8px 12px;
  font-size: 13px;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.imp-skip td {
  opacity: 0.55;
}
.imp-done {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--okSoft);
}
.imp-fails {
  border: 1px solid var(--line);
  border-radius: 10px;
}
.imp-fails .li:first-child {
  border-top: 0;
}
.tl-wrap {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.tl-add {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}
.tl-add textarea {
  min-height: 44px;
  resize: vertical;
}
.tl-next {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  background: var(--accentSoft);
  border-radius: 10px;
  padding: 8px 12px;
}
.tl {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  position: relative;
}
.tl > li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 0;
  position: relative;
}
.tl > li:not(:last-child):before {
  content: "";
  position: absolute;
  left: 12px;
  top: 32px;
  bottom: -4px;
  width: 1.5px;
  background: var(--line);
}
.tl-dot {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: grid;
  place-items: center;
}
.tl-body {
  font-size: 13.5px;
  display: grid;
  gap: 2px;
  min-width: 0;
}
.tl-note {
  white-space: pre-wrap;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 10px;
  margin-bottom: 4px;
}
@media (max-width: 560px) {
  .tl-add {
    flex-direction: column;
    align-items: stretch;
  }
}
.rep-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
  margin-top: 16px;
}
.hbars {
  display: grid;
  gap: 10px;
}
.hbar {
  display: grid;
  grid-template-columns: minmax(90px, 150px) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}
.hbar-l {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
}
.hbar-t {
  height: 10px;
  background: var(--line2);
  border-radius: 6px;
  overflow: hidden;
}
.hbar-t i {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 6px;
}
.hbar-v {
  font-size: 12.5px;
  white-space: nowrap;
}
.vchart {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 6px;
  align-items: end;
  height: 200px;
  padding-top: 18px;
}
.vcol {
  display: grid;
  grid-template-rows: auto 1fr auto;
  height: 100%;
  align-items: end;
  justify-items: center;
  gap: 4px;
  min-width: 0;
}
.vcol i {
  display: block;
  width: 70%;
  max-width: 38px;
  background: var(--accent);
  border-radius: 6px 6px 2px 2px;
  align-self: end;
}
.vval {
  font-size: 10.5px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  max-width: 100%;
}
.vlab {
  font-size: 11px;
  color: var(--faint);
}
@media (max-width: 600px) {
  .vval {
    display: none;
  }
  .vchart {
    height: 150px;
    gap: 3px;
  }
}
.top-new {
  min-height: 40px;
}
@media (max-width: 560px) {
  .top-new span {
    display: none;
  }
}
.role-sel {
  width: auto;
  min-height: 32px;
  padding: 4px 8px;
  font-size: 13px;
}
@media (max-width: 700px) {
  .tbl-team thead {
    display: none;
  }
  .tbl-team,
  .tbl-team tbody {
    display: block;
    width: 100%;
  }
  .tbl-team tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--line2);
    align-items: center;
  }
  .tbl-team td {
    padding: 0;
    border: 0;
    min-width: 0;
  }
  .tbl-team td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  .tbl-team td:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
  }
  .tbl-team td:nth-child(2) {
    grid-column: 1;
  }
  .tbl-team td:nth-child(4) {
    display: none;
  }
  .tbl-team td:nth-child(5) {
    grid-column: 2;
    text-align: right;
  }
}
.li.wrap {
  flex-wrap: wrap;
}
.li.wrap .li-main {
  flex: 1 1 170px;
}
.stat {
  min-width: 0;
}
.stat > div {
  min-width: 0;
}
.stat-v {
  overflow-wrap: anywhere;
}
@media (max-width: 420px) {
  .stats {
    gap: 8px;
  }
  .stat {
    padding: 12px;
    gap: 10px;
  }
  .stat .itile {
    width: 34px;
    height: 34px;
  }
  .stat-v {
    font-size: 21px;
  }
}
:root {
  --shadow-sm: 0 1px 2px rgba(14, 26, 43, 0.04),
    0 2px 8px rgba(14, 26, 43, 0.04);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  }
}
:root[data-theme="dark"] {
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.panel,
.stat {
  box-shadow: var(--shadow-sm);
  border-color: var(--line2);
}
.stat {
  border-radius: 14px;
  padding: 16px;
}
.panel {
  border-radius: 14px;
}
.brand-mark {
  flex: none;
  display: block;
}
.side-brand {
  gap: 12px;
}
.ops-side {
  background: linear-gradient(180deg, var(--navy) 0%, #0b2140 100%);
}
.topme {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 12px;
  margin-left: 4px;
  border-left: 1px solid var(--line);
  line-height: 1.2;
}
.topme b {
  display: block;
  font-size: 13px;
}
.topme small {
  display: block;
  font-size: 11.5px;
  color: var(--muted);
  text-transform: capitalize;
}
@media (max-width: 1000px) {
  .topme {
    display: none;
  }
}
.board {
  gap: 10px;
}
.board-col {
  background: var(--surface2);
  border: 0;
  border-radius: 12px;
  padding: 8px;
  min-height: 340px;
  align-content: start;
}
.board-h {
  padding: 6px 6px 8px;
  border-bottom: 2px solid var(--line);
  margin-bottom: 2px;
}
.board-h b {
  font-size: 14px;
}
.dcard {
  border: 1px solid var(--line2);
  box-shadow: var(--shadow-sm);
  border-radius: 10px;
  transition:
    box-shadow 0.15s,
    transform 0.15s;
}
.dcard:hover {
  box-shadow: 0 4px 14px #0e1a2b1a;
}
.dcard-move {
  align-items: center;
  padding: 4px 8px 8px;
}
.dcard-move .av {
  width: 24px;
  height: 24px;
  font-size: 9.5px;
}
.dcard-main .warn {
  color: var(--warn);
}
.sbar-wrap {
  display: grid;
  gap: 12px;
}
.hero-n {
  display: grid;
  gap: 2px;
}
.hero-v {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.sbar {
  display: flex;
  gap: 2px;
  height: 14px;
  border-radius: 4px;
  overflow: hidden;
}
.sbar i {
  display: block;
  min-width: 4px;
  border-radius: 2px;
}
.sb-open {
  background: var(--accent);
}
.sb-won {
  background: var(--ok);
}
.sb-lost {
  background: var(--faint);
}
.legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.legend b {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.legend .sw {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  display: inline-block;
}
.funnel {
  display: grid;
  gap: 8px;
}
.fn-row {
  display: grid;
  grid-template-columns: minmax(80px, 130px) minmax(0, 1fr) 28px 36px;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}
.fn-l {
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fn-t {
  height: 12px;
  background: var(--line2);
  border-radius: 4px;
  overflow: hidden;
}
.fn-t i {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 4px;
}
.fn-v,
.fn-p {
  text-align: right;
}
.login-brand {
  gap: 12px;
}
@media (min-width: 861px) {
  .ops-side {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
  }
}
.board-h .pill {
  font-size: 11px;
  line-height: 1.35;
  padding: 1px 8px;
}
@media (max-width: 700px) {
  .tbl-act thead {
    display: none;
  }
  .tbl-act,
  .tbl-act tbody {
    display: block;
    width: 100%;
  }
  .tbl-act tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 12px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--line2);
  }
  .tbl-act td {
    padding: 0;
    border: 0;
  }
  .tbl-act td:nth-child(2) {
    grid-column: 1;
    grid-row: 1;
    font-weight: 600;
  }
  .tbl-act td:nth-child(1) {
    grid-column: 1;
    grid-row: 2;
    font-size: 12px;
  }
  .tbl-act td:nth-child(3) {
    grid-column: 2;
    grid-row: 1/3;
    align-self: center;
  }
}
@media (min-width: 861px) {
  .demobar ~ #app .ops-side {
    top: 38px;
    height: calc(100vh - 38px);
  }
}
.lbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}
.lbar .lq {
  flex: 0 1 260px;
}
.lbar .lq input {
  min-height: 34px;
}
.lf select {
  min-height: 34px;
  padding: 5px 30px 5px 10px;
  font-size: 13px;
  width: auto;
  max-width: 200px;
}
.lbar-r {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.bulk {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  background: var(--accentSoft);
  border: 1px solid var(--accent);
  border-radius: 12px;
  padding: 8px 12px;
  margin-bottom: 12px;
  font-size: 13px;
}
.bulk b {
  margin-right: 6px;
  color: var(--accent);
}
.ltable .ck {
  width: 36px;
  padding-right: 0;
}
.ltable .ck input {
  width: 16px;
  height: 16px;
  min-height: 0;
  accent-color: var(--accent);
  cursor: pointer;
}
.ltable tr.sel td {
  background: var(--accentSoft);
}
.th-sort {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
  cursor: pointer;
}
.th-sort:hover {
  color: var(--ink);
}
.lcount {
  margin-top: 8px;
}
.tags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.tagc {
  font-size: 11px;
  font-weight: 600;
  color: var(--violet);
  background: var(--violetSoft);
  border-radius: 6px;
  padding: 1px 7px;
}
.manage {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.cf-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
@media (max-width: 700px) {
  .ltable .hsm {
    display: none;
  }
  .lbar-r {
    margin-left: 0;
  }
  .lbar .lq {
    flex: 1 1 100%;
  }
}
.seg-t {
  display: inline-flex;
  background: var(--line2);
  border-radius: 10px;
  padding: 3px;
  gap: 2px;
}
.seg-t button {
  border: 0;
  background: transparent;
  padding: 6px 14px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 13px;
  color: var(--muted);
  cursor: pointer;
}
.seg-t button[aria-selected="true"] {
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}
.bad {
  color: var(--bad);
}
.warn {
  color: var(--warn);
}
.bell-wrap {
  position: relative;
}
.nbadge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  background: var(--bad);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border: 2px solid var(--bg);
}
.bell-panel {
  position: absolute;
  right: 0;
  top: 46px;
  width: 360px;
  max-width: calc(100vw - 24px);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 14px 40px #0e1a2b2e;
  z-index: 60;
  overflow: hidden;
}
.bell-h {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line2);
}
.bell-list {
  max-height: 420px;
  overflow-y: auto;
}
.bell-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--line2);
  padding: 10px 14px;
  cursor: pointer;
  color: var(--ink);
  font: inherit;
}
.bell-item .li-main {
  display: grid;
  gap: 1px;
}
.bell-item.unread {
  background: var(--accentSoft);
}
.bell-item:hover {
  background: var(--surface2);
}
.topme {
  background: none;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  cursor: pointer;
  text-align: left;
  color: var(--ink);
  font: inherit;
}
.topme:hover b {
  color: var(--accent);
}
.setup {
  margin-bottom: 16px;
  border-color: var(--accent);
}
.chk {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid var(--line);
  display: grid;
  place-items: center;
  flex: none;
  color: #fff;
}
.chk.on {
  background: var(--ok);
  border-color: var(--ok);
}
.li-main.done b {
  color: var(--muted);
  text-decoration: line-through;
  font-weight: 500;
}
.help-li {
  width: 100%;
  background: none;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  text-align: left;
  font: inherit;
  color: var(--ink);
}
.help-steps {
  margin: 0;
  padding: 0 20px 18px 38px;
  display: grid;
  gap: 10px;
  line-height: 1.55;
}
.thread {
  display: grid;
  gap: 10px;
  margin: 10px 0;
}
.msg {
  border: 1px solid var(--line2);
  border-radius: 12px;
  padding: 10px 12px;
  background: var(--surface2);
  max-width: 92%;
}
.msg.hop {
  background: var(--accentSoft);
  border-color: transparent;
  justify-self: end;
}
.msg-b {
  white-space: pre-wrap;
  margin-top: 4px;
}
.acct {
  display: grid;
  gap: 16px;
  max-width: 760px;
}
.copy-row {
  display: flex;
  gap: 8px;
}
.copy-row input {
  font-size: 12px;
}
.side-link[aria-current="true"] {
  background: var(--navyActive);
  color: #fff;
}
.f-page .ph h1 {
  font-size: 22px;
}
.f-page .two {
  grid-template-columns: minmax(0, 1fr);
}
.f-page {
  display: grid;
  gap: 12px;
}
.sel-li {
  background: var(--accentSoft);
}
.svc-li.off .li-main {
  opacity: 0.6;
}
.svc-act {
  flex-wrap: nowrap;
  gap: 4px;
}
.icon-pick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ip input,
.tp input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.ip .itile {
  width: 36px;
  height: 36px;
  border: 2px solid transparent;
  cursor: pointer;
}
.ip input:checked + .itile {
  border-color: var(--accent);
}
.ip input:focus-visible + .itile,
.tp input:focus-visible + .tdot {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.tdot {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
}
.tp input:checked + .tdot {
  border-color: var(--ink);
}
.stage-ed {
  display: grid;
  gap: 8px;
}
.se-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line2);
  border-radius: 10px;
  padding: 10px;
  background: var(--surface2);
}
.se-n {
  padding-top: 10px;
  color: var(--faint);
}
.se-main {
  display: grid;
  gap: 6px;
}
.se-act {
  display: flex;
  gap: 4px;
  align-items: center;
}
@media (max-width: 600px) {
  .se-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .se-n {
    display: none;
  }
  .svc-li {
    flex-wrap: wrap;
  }
}
.viewas {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  background: var(--violetSoft);
  color: var(--violet);
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 13px;
}
.viewas span {
  flex: 1;
  min-width: 200px;
}
.hp {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.li-side.hp {
  justify-content: flex-end;
  max-width: 50%;
}
.health-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  border: 1px solid var(--line2);
  border-radius: 10px;
  padding: 10px;
  background: var(--surface2);
}
.health-grid > div {
  display: grid;
  gap: 2px;
}
.plan-row {
  flex-wrap: wrap;
}
.grid-plan {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 170px 150px minmax(160px, 1.4fr);
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.money-in {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 8px;
  background: var(--surface);
}
.money-in input {
  border: 0;
  background: transparent;
  padding: 6px 0;
  min-height: 38px;
  min-width: 0;
}
@media (max-width: 800px) {
  .grid-plan,
  .health-grid {
    grid-template-columns: 1fr 1fr;
  }
}
.money-in span {
  white-space: nowrap;
}
.grid-plan {
  grid-template-columns: minmax(120px, 1fr) 190px 170px minmax(160px, 1.4fr);
}
@media (max-width: 800px) {
  .grid-plan {
    grid-template-columns: 1fr 1fr;
  }
}
#askroot .ask-ov {
  z-index: 90;
}
.modal.ask {
  max-width: 420px;
}
.ask-b {
  padding: 22px 22px 6px;
}
.ask-b h2 {
  font-size: 17px;
  margin: 0 0 6px;
}
.ask-b p {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.5;
}
.ask-b .field {
  margin-top: 4px;
}
.checks label.off {
  opacity: 0.5;
  cursor: not-allowed;
}
.ops-main {
  padding-top: 0;
}
.ops-top {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  margin: 0 -24px 22px;
  padding: 10px 24px;
  min-height: 62px;
}
.demobar ~ #app .ops-top {
  top: 38px;
}
.ops-top .search {
  max-width: 420px;
  flex: 1 1 auto;
  background: var(--bg);
}
.ops-top .search input {
  background: transparent;
}
.nav-sec {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ffffff6b;
  padding: 14px 10px 4px;
}
.side-nav {
  gap: 1px;
}
.side-nav button {
  padding: 8px 10px;
}
.lbar {
  flex-wrap: nowrap;
  gap: 6px;
}
.lbar .lq {
  flex: 0 1 240px;
  min-width: 150px;
}
.lbar .lf {
  flex: 0 1 auto;
  min-width: 0;
}
.lf select {
  max-width: 160px;
  width: 100%;
  text-overflow: ellipsis;
}
.lbar-r {
  flex-wrap: nowrap;
  gap: 6px;
}
.lbar-r .lf select {
  max-width: 140px;
}
.lbar .iconbtn.sm {
  width: 34px;
  height: 34px;
  min-height: 34px;
}
.lbar .iconbtn.danger {
  color: var(--bad);
}
@media (max-width: 1100px) {
  .lbar {
    flex-wrap: wrap;
  }
}
.acct {
  max-width: 1080px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
}
.acct-col {
  display: grid;
  gap: 16px;
  align-content: start;
}
@media (max-width: 900px) {
  .acct {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 860px) {
  .nav-sec {
    display: none;
  }
  .ops-top {
    margin: 0 -16px 16px;
    padding: 10px 16px;
    position: static;
  }
}
.paid-li {
  gap: 12px;
}
.paid-r {
  display: grid;
  justify-items: end;
  line-height: 1.25;
  white-space: nowrap;
}
.iconbtn.sm.tb {
  width: 32px;
  height: 32px;
}
@media (max-width: 600px) {
  .paid-li .pill {
    display: none;
  }
}
@media (max-width: 700px) {
  .lbar {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .lbar .lq {
    grid-column: 1/-1;
  }
  .lbar .lf select,
  .lbar-r .lf select {
    max-width: none;
  }
  .lbar-r {
    grid-column: 1/-1;
    margin-left: 0;
  }
  .lbar-r .lf {
    flex: 1 1 auto;
  }
}
.ring {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: none;
}
.ring svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.ring circle {
  fill: none;
  stroke-width: 6;
}
.ring-bg {
  stroke: var(--line);
}
.ring-fg {
  stroke: var(--ok);
  stroke-linecap: round;
  transition: stroke-dasharray 0.4s;
}
.ring b {
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.start-prog .ring b {
  font-size: 18px;
}
.setup-card {
  margin-bottom: 16px;
  background: linear-gradient(100deg, var(--surface) 55%, var(--accentSoft));
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
}
.setup-card-b {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px 18px;
}
.setup-card-b .eyebrow {
  margin-bottom: 2px;
}
.setup-card-b b {
  font-size: 15px;
}
.setup-card-a {
  flex-wrap: nowrap;
}
@media (max-width: 760px) {
  .setup-card-b {
    flex-wrap: wrap;
  }
  .setup-card-a {
    width: 100%;
  }
}
.start-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 16px;
  align-items: start;
}
@media (max-width: 1000px) {
  .start-grid {
    grid-template-columns: 1fr;
  }
}
.steps {
  display: grid;
}
.step {
  display: flex;
  gap: 14px;
  padding: 14px 16px;
  border-top: 1px solid var(--line);
}
.step:first-child {
  border-top: 0;
}
.step-n {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--line);
  display: grid;
  place-items: center;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted);
  flex: none;
  background: var(--surface);
}
.step.done .step-n {
  background: var(--ok);
  border-color: var(--ok);
  color: #fff;
}
.step.done .step-m > div > b {
  color: var(--muted);
  font-weight: 600;
}
.step-m {
  flex: 1;
  min-width: 0;
}
.step-m p {
  margin: 4px 0 10px;
  max-width: 60ch;
  line-height: 1.5;
}
.step-a {
  gap: 8px;
  align-items: center;
}
.side-nav .count.prog {
  background: #ffffff24;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.welcome {
  margin: -1px;
}
.welcome-top {
  background: radial-gradient(
    120% 140% at 50% -20%,
    #2a4a78 0%,
    var(--navy) 62%
  );
  color: #fff;
  padding: 28px 26px 24px;
  border-radius: 16px 16px 0 0;
  text-align: center;
  display: grid;
  justify-items: center;
  gap: 10px;
}
.welcome-top h2 {
  font-size: 22px;
  margin: 4px 0 0;
  color: #fff;
}
.welcome-top p {
  margin: 0;
  color: #ffffffd1;
  max-width: 44ch;
  line-height: 1.55;
  font-size: 14px;
}
.welcome-top b {
  color: #fff;
}
.welcome-b {
  padding: 14px 18px 4px;
}
.welcome-pts .li {
  padding-inline: 0;
}
.modal:has(.welcome) {
  max-width: 480px;
  overflow: hidden;
}
.step-a .linkbtn {
  color: var(--muted);
  text-decoration: none;
  margin-left: auto;
  font-weight: 600;
}
.step-a .linkbtn:hover {
  color: var(--accent);
}
.lead-h {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px 16px 0;
}
.lead-b {
  padding: 10px 16px 16px 68px;
  display: grid;
  gap: 10px;
}
.lead-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.lead-msg {
  margin: 0;
  padding: 10px 12px;
  background: var(--bg);
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.55;
  max-width: 70ch;
}
.lead-note input {
  flex: 1 1 260px;
  min-height: 34px;
  font-size: 13px;
}
.lead-a {
  gap: 8px;
}
@media (max-width: 700px) {
  .lead-b {
    padding-left: 16px;
  }
}
.login-wrap {
  align-content: center;
  gap: 18px;
  background: radial-gradient(60% 50% at 85% 0%, #dce8fb, #dce8fb00 70%),
    radial-gradient(50% 50% at 0% 100%, #e6eaf0, #e6eaf000 70%),
    linear-gradient(180deg, #f7f4ee, #fffdf9);
}
.login {
  border-radius: 20px;
  padding: 30px 28px;
  border-color: #e5e0d6;
  box-shadow:
    0 1px 2px #0e1a2b0d,
    0 24px 60px #0f2b4c1f;
}
.login h1 {
  font-size: 24px;
  letter-spacing: -0.02em;
}
.login .btn.primary {
  min-height: 46px;
  border-radius: 12px;
  background: linear-gradient(180deg, #16365f, #0c2340);
  color: #fff;
  box-shadow: 0 8px 20px #0c234038;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .login .btn.primary {
    background: var(--accent);
    color: var(--accentInk);
  }
}
:root[data-theme="dark"] .login .btn.primary {
  background: var(--accent);
  color: var(--accentInk);
}
.login-foot {
  margin: 0;
  text-align: center;
  font-size: 14px;
  color: var(--muted);
}
.login-foot a {
  color: var(--accent);
  font-weight: 700;
  text-decoration: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .login-wrap {
    background: radial-gradient(60% 50% at 85% 0%, #12306a, #3a2e1700 70%),
      var(--bg);
  }
}
:root[data-theme="dark"] .login-wrap {
  background: radial-gradient(60% 50% at 85% 0%, #12306a, #3a2e1700 70%),
    var(--bg);
}
.bpage.bp2 {
  padding: 0;
  min-height: 100vh;
}
.bp2 .bp-preview {
  max-width: none;
  margin: 0;
  border: 0;
  border-bottom: 1px dashed var(--line);
  border-radius: 0;
}
.bp2-in {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 24px;
}
.bp2 h1,
.bp2 h2,
.bp2 h3 {
  text-wrap: balance;
  letter-spacing: -0.025em;
}
.bp2 p {
  text-wrap: pretty;
}
.bp2-nav {
  position: sticky;
  top: 0;
  z-index: 40;
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: saturate(1.5) blur(14px);
  -webkit-backdrop-filter: saturate(1.5) blur(14px);
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.demobar ~ #app .bp2-nav {
  top: 38px;
}
.bp2-nav-in {
  display: flex;
  align-items: center;
  gap: 20px;
  height: 64px;
}
.bp2-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--ink);
  min-width: 0;
}
.bp2-brand b {
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bp2-logo {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  border: 1px solid var(--line);
  flex: none;
}
.bp2-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.bp2-logo .bp-mono {
  font-size: 13px;
  font-weight: 800;
  color: var(--brandText);
  background: none;
  width: auto;
  height: auto;
  box-shadow: none;
  border: 0;
}
.bp2-links {
  display: flex;
  gap: 2px;
  margin-left: 8px;
}
.bp2-links a {
  text-decoration: none;
  color: var(--muted);
  font-weight: 600;
  font-size: 14.5px;
  padding: 7px 11px;
  border-radius: 9px;
}
.bp2-links a:hover {
  color: var(--ink);
  background: var(--surface2);
}
.bp2-nav .btn {
  margin-left: auto;
  flex: none;
}
@media (max-width: 820px) {
  .bp2-links {
    display: none;
  }
}
.bp2 .btn.primary {
  box-shadow: 0 8px 20px color-mix(in srgb, var(--brand) 28%, transparent);
}
.bp2 .btn.lg {
  border-radius: 14px;
}
.bp2-hero {
  position: relative;
  overflow: hidden;
  padding: 56px 0 72px;
}
.bp2-hero-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(
      55% 60% at 90% 0%,
      color-mix(in srgb, var(--brand) 16%, transparent),
      transparent 70%
    ),
    radial-gradient(
      45% 55% at 0% 100%,
      color-mix(in srgb, var(--brand) 9%, transparent),
      transparent 70%
    );
}
.bp2-hero-bg:after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(
      color-mix(in srgb, var(--brand) 6%, transparent) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--brand) 6%, transparent) 1px,
      transparent 1px
    );
  background-size: 44px 44px;
  mask-image: radial-gradient(60% 60% at 30% 20%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(
    60% 60% at 30% 20%,
    #000 20%,
    transparent 75%
  );
}
.bp2-hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
  gap: 56px;
  align-items: start;
}
.bp2-copy {
  padding-top: 28px;
}
.bp2-copy h1 {
  font-size: clamp(36px, 4.6vw, 58px);
  font-weight: 800;
  line-height: 1.05;
  margin: 18px 0 0;
  color: var(--ink);
}
.bp2-lede {
  font-size: clamp(17px, 1.5vw, 19px);
  color: var(--muted);
  line-height: 1.6;
  margin: 18px 0 0;
  max-width: 34em;
}
.bp2-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}
.bp2-ghost {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
}
.bp2-mob {
  display: none;
}
.bp2-proof {
  list-style: none;
  padding: 0;
  margin: 26px 0 0;
  display: grid;
  gap: 10px;
}
.bp2-proof li {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 15px;
  color: var(--muted);
}
.bp2-proof b {
  color: var(--ink);
}
.bp2 .bp-phone {
  margin-top: 18px;
  text-align: left;
}
.bp2 .bp-links {
  justify-content: flex-start;
  margin-top: 18px;
}
.bp2-formcol {
  scroll-margin-top: 84px;
}
.bp2-card {
  max-width: none;
  margin: 0;
  border-radius: 22px;
  box-shadow:
    0 1px 2px #1418200d,
    0 30px 70px color-mix(in srgb, var(--brand) 16%, rgba(20, 24, 32, 0.12));
}
.bp2-pay {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: var(--muted);
  margin: 14px 0 0;
  text-align: center;
}
@media (max-width: 960px) {
  .bp2-hero-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .bp2-copy {
    padding-top: 0;
  }
  .bp2-hero {
    padding: 32px 0 48px;
  }
  .bp2-mob {
    display: inline-flex;
  }
}
.bp2-sec {
  padding: 88px 0;
}
.bp2-soft {
  background: linear-gradient(180deg, var(--surface2), var(--bg));
}
.bp2-head {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 44px;
}
.bp2-head h2 {
  font-size: clamp(28px, 3.4vw, 42px);
  font-weight: 800;
  margin: 10px 0 0;
  color: var(--ink);
}
.bp2-head p {
  margin: 14px 0 0;
  font-size: 16.5px;
}
@media (max-width: 700px) {
  .bp2-sec {
    padding: 60px 0;
  }
  .bp2-head {
    margin-bottom: 30px;
  }
}
.bp2-svcs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.bp2-svc {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 1px 2px #1418200a;
  transition:
    transform 0.15s,
    box-shadow 0.15s,
    border-color 0.15s;
}
.bp2-svc:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--brand) 40%, var(--line));
  box-shadow: 0 18px 40px #14182014;
}
.bp2-svc h3 {
  font-size: 19px;
  font-weight: 700;
  margin: 6px 0 0;
  color: var(--ink);
}
.bp2-svc p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.55;
}
.bp2-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
}
.bp2-tags:empty {
  display: none;
}
.bp2-svc-f {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.bp2-price b {
  display: block;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ink);
  line-height: 1.1;
}
.bp2-price small {
  color: var(--muted);
  font-size: 12.5px;
}
.bp2-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}
.bp2-steps > li {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 26px 24px;
  display: grid;
  gap: 10px;
  align-content: start;
}
.bp2-num {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--accentSoft);
  color: var(--brandText);
  font-weight: 800;
  font-size: 17px;
  margin-bottom: 6px;
}
.bp2-steps h3 {
  font-size: 19px;
  font-weight: 700;
  margin: 0;
  color: var(--ink);
}
.bp2-steps p {
  margin: 0;
  font-size: 14.5px;
}
.bp2-steps .ticks {
  margin-top: 4px;
}
.bp2-steps .bp-note {
  margin: 4px 0 0;
}
.bp2-reviews {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.bp2-review {
  margin: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.bp2-review blockquote {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
}
.bp2-review figcaption {
  margin-top: auto;
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 13.5px;
}
.bp2-review figcaption b {
  display: block;
  color: var(--ink);
}
.bp2-review figcaption span {
  display: flex;
  gap: 5px;
  align-items: center;
  color: var(--muted);
}
.bp2-review figcaption a {
  color: var(--muted);
}
.bp2-review figcaption .bp2-av {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--accentSoft);
  color: var(--brandText);
  font-weight: 800;
  font-size: 13px;
  display: grid;
  place-items: center;
  flex: none;
}
.bp2-chips {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 900px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}
.bp2-chips li {
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 16px 9px 10px;
  font-weight: 600;
  font-size: 14.5px;
  color: var(--ink);
}
.bp2-close {
  background: radial-gradient(
      60% 90% at 0% 0%,
      color-mix(in srgb, var(--brand) 70%, #fff 0%),
      transparent 70%
    ),
    linear-gradient(
      135deg,
      var(--brand),
      color-mix(in srgb, var(--brand) 60%, #050b16)
    );
  color: var(--accentInk);
  padding: 64px 0;
}
.bp2-close-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
}
.bp2-close h2 {
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 800;
  margin: 0;
  color: inherit;
}
.bp2-close p {
  margin: 10px 0 0;
  opacity: 0.85;
  font-size: 16px;
}
.bp2-close .bp2-area {
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 14px;
}
.bp2-inv {
  background: var(--accentInk);
  color: var(--brand);
  border: 0;
  box-shadow: 0 12px 30px #0000002e;
}
.bp2-inv:hover {
  filter: brightness(0.97);
}
.bp2-foot {
  padding: 28px 0 40px;
  font-size: 13.5px;
  color: var(--muted);
}
.bp2-foot-in {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  align-items: center;
}
.bp2-foot a {
  color: var(--muted);
}
.bp2-foot .bp-powered {
  margin-left: auto;
}
.bp2-brand.small b {
  font-size: 14px;
}
.bp2-brand.small .bp2-logo {
  width: 28px;
  height: 28px;
  border-radius: 8px;
}
@media (max-width: 600px) {
  .bp2-in {
    padding: 0 16px;
  }
  .bp2-foot .bp-powered {
    margin-left: 0;
  }
  .bp2-nav .btn {
    padding-inline: 12px;
  }
}
.bp2 .bp-steps-bar .steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.bp2 .bp-steps-bar .steps i {
  height: 4px;
  border-radius: 4px;
  background: var(--line);
  display: block;
}
.bp2 .bp-steps-bar .steps i.on {
  background: var(--brand);
}
.bp2-pay {
  justify-content: flex-start;
  text-align: left;
  align-items: flex-start;
  line-height: 1.45;
}
.bp2-pay svg {
  flex: none;
  margin-top: 2px;
}
.bp2-reviews {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.bp2-review {
  flex: 1 1 300px;
  max-width: 372px;
}
.bp2-close-in > div {
  flex: 1 1 480px;
}
.grid-plan {
  grid-template-columns: minmax(110px, 1fr) 170px 160px 120px minmax(
      150px,
      1.3fr
    );
}
@media (max-width: 900px) {
  .grid-plan {
    grid-template-columns: 1fr 1fr;
  }
}
.demobar {
  background: #0b1322;
  color: #aebbcd;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  min-height: 38px;
  padding: 5px 14px;
  padding-top: calc(5px + env(safe-area-inset-top, 0px));
  font-size: 12.5px;
  font-weight: 500;
  box-shadow: 0 1px #0003;
}
.demobar button,
.demobar a {
  color: #d9e2ee;
  font-weight: 600;
  padding: 4px 9px;
  border-radius: 7px;
  border: 1px solid transparent;
}
.demobar button:hover,
.demobar a:hover {
  background: #ffffff12;
  border-color: #ffffff14;
}
.demobar a[data-demo-all] {
  border-color: #ffffff1f;
}
.demobar-mid {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.demobar-mid b {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #9cc0ff;
  background: #3b82f629;
  border: 1px solid rgba(96, 150, 255, 0.25);
  border-radius: 999px;
  padding: 2px 8px;
}
.demobar-mid span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 560px) {
  .demobar-mid span {
    display: none;
  }
}
.seat-card {
  margin-bottom: 16px;
}
.seat-card.full {
  border-color: color-mix(in srgb, var(--warn) 45%, var(--line));
}
.seat-b {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 14px 16px;
}
.seat-b .bar {
  height: 6px;
}
.bar.warn i {
  background: var(--warn);
}
.seat-note {
  margin: 0;
  padding: 0 16px 14px;
}
.plan-pick {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}
.plan-opt {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  display: grid;
  gap: 6px;
  align-content: start;
}
.plan-opt.on {
  border-color: var(--accent);
  background: var(--accentSoft);
}
.plan-opt p {
  margin: 0;
}
.plan-price {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.plan-price small {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.plan-opt {
  display: flex;
  flex-direction: column;
}
.plan-opt .btn {
  margin-top: auto;
}
.plan-opt p {
  margin-bottom: 8px;
}
.rc-btn {
  cursor: pointer;
  justify-self: start;
}
.rc-prev {
  display: flex;
  gap: 12px;
  align-items: flex-end;
}
.rc-prev img {
  width: 120px;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--line);
}
.rc-full img {
  display: block;
  max-width: 100%;
  max-height: 60vh;
  border-radius: 12px;
  border: 1px solid var(--line);
  margin: 0 auto;
}
.pm-styles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}
.pm-style {
  position: relative;
  display: grid;
  gap: 4px;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 12px;
  cursor: pointer;
  background: var(--surface);
}
.pm-style input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.pm-style:has(input:checked) {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accentSoft);
}
.pm-style:has(input:focus-visible) {
  outline: 3px solid var(--accent);
}
.pm-sw {
  display: flex;
  gap: 4px;
  height: 34px;
  margin-bottom: 6px;
}
.pm-sw i {
  flex: 1;
  border-radius: 6px;
}
.st-card-fresh .pm-sw i:nth-child(1) {
  background: #faf6ee;
}
.st-card-fresh .pm-sw i:nth-child(2) {
  background: #1f6f5c;
}
.st-card-fresh .pm-sw i:nth-child(3) {
  background: #e6f0ec;
}
.st-card-bold .pm-sw i:nth-child(1) {
  background: #0e1522;
}
.st-card-bold .pm-sw i:nth-child(2) {
  background: #22c55e;
}
.st-card-bold .pm-sw i:nth-child(3) {
  background: #1b2638;
}
.st-card-professional .pm-sw i:nth-child(1) {
  background: #f4f7fb;
}
.st-card-professional .pm-sw i:nth-child(2) {
  background: #1e3a8a;
}
.st-card-professional .pm-sw i:nth-child(3) {
  background: #0b1b3a;
}
.st-card-elegant .pm-sw i:nth-child(1) {
  background: #faf6ee;
}
.st-card-elegant .pm-sw i:nth-child(2) {
  background: #8c6a4f;
}
.st-card-elegant .pm-sw i:nth-child(3) {
  background: #efe6dc;
}
.st-card-bold b {
  font-family: "Oswald", var(--font);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.st-card-professional b,
.st-card-elegant b {
  font-family: Georgia, serif;
}
.pm-pick {
  cursor: pointer;
  justify-self: start;
  width: max-content;
}
.pm-pick.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.pm-th {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface2);
}
.pm-th img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pm-x {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 0;
  background: #0009;
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.pm-cover .pm-th {
  width: min(520px, 100%);
  aspect-ratio: 21/8;
}
.pm-about .pm-th {
  width: 200px;
  aspect-ratio: 4/5;
}
.pm-about-row {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.pm-gal {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}
.pm-gal:empty {
  display: none;
}
.pm-gi {
  display: grid;
  gap: 6px;
}
.pm-gi .pm-th {
  aspect-ratio: 4/3;
}
.pm-gi input {
  min-height: 32px;
  font-size: 12.5px;
  padding: 5px 8px;
}
.pm-mv {
  position: absolute;
  left: 6px;
  bottom: 6px;
  display: flex;
  gap: 4px;
}
.pm-mv button {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 0;
  background: #0009;
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.pm-mem {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
}
.pm-mem-ph {
  width: 84px;
  flex: none;
}
.pm-mem-ph .pm-th {
  width: 84px;
  height: 84px;
  border-radius: 50%;
}
.pm-mem-ph .pm-pick {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  padding: 0;
  font-size: 12px;
}
.pm-ini {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: var(--accentSoft);
  display: grid;
  place-items: center;
  font-weight: 800;
}
.pm-mem-f {
  flex: 1;
  display: grid;
  gap: 8px;
  min-width: 0;
}
@media (max-width: 600px) {
  .pm-mem {
    flex-wrap: wrap;
  }
}
#pmTeam > .btn {
  justify-self: start;
}
.tool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}
.tool {
  position: relative;
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap: 10px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  cursor: pointer;
  transition:
    border-color 0.15s,
    background 0.15s;
}
.tool input[type="checkbox"] {
  margin: 3px 0 0;
  width: 17px;
  height: 17px;
  min-height: 0;
  accent-color: var(--accent);
  flex: none;
}
.tool-ic {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: var(--surface2);
  color: var(--muted);
}
.tool-t {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.tool-t b {
  font-size: 14.5px;
}
.tool-note {
  font-size: 12px;
  font-weight: 600;
  color: var(--faint);
}
.tool.on {
  border-color: var(--accent);
  background: var(--accentSoft);
}
.tool.on .tool-ic {
  background: var(--accent);
  color: var(--accentInk, #fff);
}
.tool.off {
  cursor: default;
  opacity: 0.62;
}
.tool.on.off {
  opacity: 0.9;
}
[data-form="tools"] .row,
[data-form="modules"] > div:last-child {
  margin-top: 14px;
}
#wzTools {
  margin-top: 6px;
}
.notice[hidden],
.err[hidden] {
  display: none;
}
.pm-logo-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 760px) {
  .pm-logo-row {
    grid-template-columns: 1fr;
  }
}
.pm-logo-prev {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 68px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  overflow: hidden;
}
.pm-logo-prev b {
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.pm-logo-prev.bgk-warm {
  background: #faf6ee;
  color: #1c2330;
}
.pm-logo-prev.bgk-cool {
  background: #f4f7fb;
  color: #142033;
}
.pm-logo-prev.bgk-dark {
  background: #0e1522;
  color: #eef2f7;
  border-color: #26324a;
}
.pm-fake-btn {
  margin-left: auto;
  flex: none;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 10px;
  border-radius: 8px;
  background: var(--accent);
  color: var(--accentInk, #fff);
}
.pm-lg {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 44px;
  height: 44px;
}
.pm-lg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.pm-lg.wide,
.pm-lg.wide img {
  width: auto;
  height: 38px;
  max-width: 180px;
}
.pm-lg.plate {
  background: #fff;
  padding: 4px 7px;
  border-radius: 9px;
  box-shadow: 0 1px 2px #0000001f;
}
.pm-lg.mono {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--accentSoft);
  font-weight: 800;
  font-size: 14px;
  color: var(--accent);
}
.pm-logo-side {
  gap: 8px;
}
.pm-logo-side .check-line {
  font-size: 13.5px;
}
.pm-hint {
  display: block;
  line-height: 1.45;
}
.opt-tag {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--faint);
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 1px 8px;
  margin-left: 6px;
  vertical-align: middle;
  text-transform: none;
  letter-spacing: 0;
}
.pm-opt-note {
  margin: 0 0 4px;
}
.pm-cover .pm-th {
  width: min(560px, 100%);
  aspect-ratio: 21/9;
}
.pm-cover.pos-top .pm-th img {
  object-position: 50% 15%;
}
.pm-cover.pos-center .pm-th img {
  object-position: 50% 50%;
}
.pm-cover.pos-bottom .pm-th img {
  object-position: 50% 85%;
}
.pm-pos {
  gap: 6px;
  margin: 8px 0;
}
.pm-pos .fbtn {
  min-height: 30px;
  padding: 4px 10px;
  font-size: 12.5px;
}
.pm-mem-ph .pm-th img {
  object-position: 50% 25%;
}
.pm-about .pm-th img {
  object-position: 50% 30%;
}
.pm-logo-side .flabel {
  display: flex;
  align-items: center;
  gap: 6px;
}
.pm-logo-side .flabel .opt-tag {
  margin-left: 0;
}
.pm-fake-btn {
  background: var(--pv, var(--accent));
  color: #fff;
}
@media (max-width: 520px) {
  .pm-fake-btn {
    display: none;
  }
}
details.later {
  margin-top: 18px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--surface2);
}
details.later summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--muted);
}
details.later .tpls {
  margin-top: 12px;
}
.pm-faq {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
}
.pm-faq textarea {
  min-height: 56px;
}
.st-card-editorial .pm-sw i:nth-child(1) {
  background: #f6f3ec;
}
.st-card-editorial .pm-sw i:nth-child(2) {
  background: #0f2b4c;
}
.st-card-editorial .pm-sw i:nth-child(3) {
  background: #fff;
  border: 1px solid #e3ddd0;
}
.st-card-studio .pm-sw i:nth-child(1) {
  background: #0a0a0a;
}
.st-card-studio .pm-sw i:nth-child(2) {
  background: #fff;
  border: 1px solid #ddd;
}
.st-card-studio .pm-sw i:nth-child(3) {
  background: #f1f1f1;
}
.st-card-luxe .pm-sw i:nth-child(1) {
  background: #0a0a0a;
}
.st-card-luxe .pm-sw i:nth-child(2) {
  background: #d9a53f;
}
.st-card-luxe .pm-sw i:nth-child(3) {
  background: #1a1a1a;
}
.st-card-spotlight .pm-sw i:nth-child(1) {
  background: #0b1220;
}
.st-card-spotlight .pm-sw i:nth-child(2) {
  background: #2f6be0;
}
.st-card-spotlight .pm-sw i:nth-child(3) {
  background: #fff;
}
.st-card-playful .pm-sw i:nth-child(1) {
  background: #fff4dc;
  border: 1px solid #ebd3a0;
}
.st-card-playful .pm-sw i:nth-child(2) {
  background: #f2b300;
}
.st-card-playful .pm-sw i:nth-child(3) {
  background: #3a2213;
}
.st-card-playful b {
  font-family: "Bowlby One SC", var(--font);
  font-weight: 400;
  letter-spacing: 0.01em;
}
.st-card-festive .pm-sw i:nth-child(1) {
  background: #0a0f1e;
}
.st-card-festive .pm-sw i:nth-child(2) {
  background: #d7362b;
}
.st-card-festive .pm-sw i:nth-child(3) {
  background: #2e9c5a;
}
.st-card-festive b {
  font-family: "Montserrat", var(--font);
  font-style: italic;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.st-card-card .pm-sw i:nth-child(1) {
  background: #0e1522;
}
.st-card-card .pm-sw i:nth-child(2) {
  background: #2563eb;
}
.st-card-card .pm-sw i:nth-child(3) {
  background: #151e2e;
}
.imp {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  background: linear-gradient(180deg, var(--accentSoft), var(--surface) 70%);
  display: grid;
  gap: 12px;
  margin-bottom: 10px;
}
.imp-h p {
  margin: 4px 0 0;
}
.imp-row {
  display: flex;
  gap: 8px;
}
.imp-row input {
  flex: 1;
  min-width: 0;
}
.imp-found {
  display: grid;
  gap: 8px;
}
.imp-item {
  display: grid;
  grid-template-columns: auto 170px 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  cursor: pointer;
}
.imp-item input {
  width: 17px;
  height: 17px;
  min-height: 0;
  accent-color: var(--accent);
}
.imp-k {
  font-weight: 600;
  font-size: 14px;
}
.imp-v {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.imp-v .small {
  overflow: hidden;
  text-overflow: ellipsis;
}
.imp-logo {
  width: 40px;
  height: 40px;
  object-fit: contain;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--line);
}
.imp-cover {
  width: 120px;
  height: 52px;
  object-fit: cover;
  border-radius: 6px;
}
.imp-photos {
  display: flex;
  gap: 4px;
  align-items: center;
}
.imp-photos img {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 6px;
}
.imp-sw {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid var(--line);
}
@media (max-width: 640px) {
  .imp-item {
    grid-template-columns: auto 1fr;
  }
  .imp-v {
    grid-column: 2;
  }
  .imp-row {
    flex-direction: column;
  }
}
.side-nav button[aria-current="true"] {
  box-shadow: inset 3px 0 0 var(--brass);
}
.ring .ring-fg {
  stroke: var(--brass);
}
.setup-card {
  border-color: color-mix(in srgb, var(--brass) 35%, var(--line));
}
.wm {
  font-family: "Sora", var(--font);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.wm span {
  font-weight: 400;
  color: #2563eb;
}
.ops-side .wm span,
.welcome-top .wm span {
  color: #7db0ff;
}
.card.clock {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
}
.card.clock.on {
  border-color: color-mix(in srgb, var(--ok) 40%, var(--line));
  background: color-mix(in srgb, var(--okSoft) 55%, var(--surface));
}
.ts-grid {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}
.ts-grid th,
.ts-grid td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line2);
  text-align: left;
  white-space: nowrap;
}
.ts-grid th {
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  font-weight: 700;
}
.ts-grid td.num,
.ts-grid th.num {
  text-align: right;
  font-family: var(--mono);
}
.ts-grid tr.flag td {
  background: var(--warnSoft);
}
.ts-scroll {
  overflow-x: auto;
}
.ts-log {
  margin: 6px 0 0;
  padding-left: 16px;
  color: var(--muted);
  font-size: 12.5px;
}
.ts-pay {
  gap: 10px;
}
.ts-pay .li-main {
  flex: 1;
  min-width: 120px;
}
.ts-pay select {
  width: 130px;
  flex: none;
  min-height: 36px;
}
.ts-pay input {
  flex: none;
  min-height: 36px;
}
.op-group {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  margin-top: 6px;
}
.op-group p {
  margin: 0 0 2px;
}
.pay-card {
  padding: 16px 18px;
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.pay-top {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}
.pay-total {
  display: grid;
  justify-items: end;
  gap: 2px;
}
.pay-total b {
  font-size: 22px;
  font-family: var(--mono);
}
.pay-brk {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  font-size: 13px;
  color: var(--muted);
}
.pay-brk b {
  color: var(--ink);
  font-family: var(--mono);
  font-weight: 600;
}
.pay-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}
.pay-adj {
  display: grid;
  gap: 3px;
  font-size: 12px;
  color: var(--muted);
}
.pay-adj input {
  width: 100px;
  min-height: 34px;
}
.pay-types {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 8px;
}
.pay-types .opt[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.notice.warn {
  background: var(--warnSoft);
  color: var(--warn);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  gap: 6px;
  align-items: flex-start;
}
@media (max-width: 600px) {
  .pay-top {
    flex-direction: column;
  }
  .pay-total {
    justify-items: start;
  }
}
.msg {
  padding: 14px 16px;
  display: grid;
  gap: 10px;
}
.msg-h {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.msg-r {
  border-left: 3px solid var(--accent);
  padding: 4px 0 4px 12px;
}
.msg-r p {
  margin: 4px 0 0;
  white-space: pre-wrap;
}
.sr-list {
  display: grid;
  gap: 10px;
}
.sr {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 8px;
  align-items: start;
}
@media (max-width: 700px) {
  .sr {
    grid-template-columns: 1fr auto;
  }
  .sr textarea {
    grid-column: 1 / -1;
  }
}
.pp-svc {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
}
.pp-svc summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
}
.pp-svc p {
  margin: 6px 0;
}
.pp-svc-grid {
  display: grid;
  gap: 8px;
}
.pp-svc-grid label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  font-size: 13.5px;
}
.pp-svc-grid input {
  width: 110px;
  min-height: 34px;
}
.avail {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  cursor: pointer;
  white-space: nowrap;
}
.avail input {
  accent-color: #22c55e;
}
.chat-wrap {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 14px;
  align-items: start;
}
.chat-list {
  display: grid;
  padding: 6px;
}
.chat-li {
  display: grid;
  gap: 2px;
  text-align: left;
  border: 0;
  background: none;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.chat-li.on,
.chat-li:hover {
  background: var(--accentSoft);
}
.chat-main {
  display: grid;
}
.chat-msgs {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  max-height: 52vh;
  overflow: auto;
}
.chat-b {
  max-width: 75%;
  display: grid;
  gap: 3px;
}
.chat-b p {
  margin: 0;
  padding: 9px 12px;
  border-radius: 14px;
  white-space: pre-wrap;
}
.chat-b span {
  font-size: 11px;
  color: var(--faint);
}
.chat-b.me {
  justify-self: end;
  text-align: right;
}
.chat-b.me p {
  background: var(--navy);
  color: #fff;
}
.chat-b.them p {
  background: var(--bg);
}
.chat-send {
  display: flex;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--line2);
}
.chat-send input {
  flex: 1;
}
@media (max-width: 800px) {
  .chat-wrap {
    grid-template-columns: 1fr;
  }
  .avail span {
    display: none;
  }
}
.rw-edit {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 10px;
  align-items: end;
}
.rw-edit .field:first-child {
  grid-column: 1 / -1;
}
@media (max-width: 600px) {
  .rw-edit {
    grid-template-columns: 1fr;
  }
}
.rw-box {
  display: grid;
  gap: 14px;
}
.lead-call {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}
.lead-sched {
  gap: 8px;
  flex-wrap: wrap;
}
.lead-sched input[type="date"],
.lead-sched select {
  width: auto;
  min-height: 36px;
  padding: 6px 10px;
}
.rw-edit .field[hidden] {
  display: none;
}
.grid3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 760px) {
  .grid3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 480px) {
  .grid3 {
    grid-template-columns: 1fr;
  }
}
.bk-person {
  display: grid;
  gap: 10px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.bk-person:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.bk-person .check-line {
  display: flex;
  align-items: center;
  gap: 8px;
}
.bk-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
@media (max-width: 900px) {
  .bk-days {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.bk-day {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
}
.bk-day span {
  display: flex;
  align-items: center;
  gap: 6px;
}
.bk-day input[type="time"] {
  min-height: 32px;
  padding: 4px 6px;
  font-size: 13px;
}
.bk-day.off input[type="time"] {
  opacity: 0.4;
}
.blk.blk-off {
  background: repeating-linear-gradient(
    135deg,
    var(--surface2),
    var(--surface2) 6px,
    var(--surface) 6px,
    var(--surface) 12px
  );
  color: var(--muted);
  border: 1px dashed var(--line);
  cursor: default;
}
.li select.bk-mode {
  width: auto;
  max-width: 260px;
  flex: none;
}
.bk-times {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  gap: 8px;
}
.bk-times button {
  padding: 10px 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
}
.bk-times button[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accentInk);
}
.bk-times button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 40%, transparent);
}
.bk-dates {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.bk-dates button[disabled] {
  opacity: 0.4;
  cursor: default;
}
@media (max-width: 520px) {
  .bk-dates {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.grid-plan {
  grid-template-columns: minmax(110px, 1fr) 150px 150px 140px 110px minmax(
      140px,
      1.3fr
    );
}
.grid-plan .plan-waive {
  grid-column: 1/-1;
  margin: 0;
}
@media (max-width: 1100px) {
  .grid-plan {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (max-width: 700px) {
  .grid-plan {
    grid-template-columns: 1fr 1fr;
  }
}
.blk.blk-off .blk-x {
  align-self: flex-start;
  margin-top: 4px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}
.blk.blk-off .blk-x:hover {
  color: var(--ink, inherit);
}
.setup-meter {
  height: 6px;
  border-radius: 999px;
  background: var(--line2, #e5e7eb);
  overflow: hidden;
  margin-top: 6px;
  max-width: 140px;
}
.setup-meter i {
  display: block;
  height: 100%;
  background: var(--ok, #157a4b);
  border-radius: inherit;
}
.setup-meter.lg {
  width: 160px;
  max-width: none;
}
.setup-count {
  flex: none;
  min-width: 160px;
}
.setup-groups {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
  padding: 16px;
}
.setup-group {
  border: 1px solid var(--line2, #e5e7eb);
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.setup-group h3 {
  margin: 0;
  font-size: 14px;
}
.setup-item {
  font-weight: 500;
  font-size: 14px;
  align-items: flex-start;
}
.setup-item input {
  margin-top: 2px;
}
.ok-text {
  color: var(--ok, #157a4b);
  font-weight: 700;
}
.pb-wrap {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 14px;
  max-width: 1000px;
}
.pb .pad {
  padding-top: 4px;
}
.pb-list {
  margin: 0;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  line-height: 1.5;
}
.pb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.pb-table th,
.pb-table td {
  text-align: left;
  vertical-align: top;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line2, #e5e7eb);
  line-height: 1.45;
}
.pb-table th {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted, #6b7280);
}
.pb-say {
  margin: 0 0 12px;
  padding: 12px 16px;
  border-left: 3px solid var(--accent, #1b5bd0);
  background: var(--surface2, #f5f7fa);
  border-radius: 0 10px 10px 0;
  line-height: 1.55;
}
.pb-label {
  margin: 12px 0 6px;
  font-weight: 700;
  font-size: 13px;
}
.pb-label:first-child {
  margin-top: 0;
}
@media (max-width: 700px) {
  .pb-table td.nowrap {
    white-space: normal;
  }
}
.sheet {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: var(--surface, #fff);
}
.sheet textarea {
  width: 100%;
  min-height: 96px;
  font: inherit;
}
.sheet-h {
  font-weight: 700;
  font-size: 13px;
  margin-top: 4px;
  color: var(--muted);
}
.sheet-row {
  display: grid;
  gap: 6px;
  align-items: center;
}
.sheet-row.m {
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 64px 36px;
}
.sheet-row.t {
  grid-template-columns: 72px minmax(0, 1fr) minmax(0, 1.2fr) 36px;
}
.sheet-row.t > :nth-child(1) {
  grid-column: 1 / 4;
  grid-row: 1;
}
.sheet-row.t > :nth-child(2) {
  grid-column: 1;
  grid-row: 2;
}
.sheet-row.t > :nth-child(3) {
  grid-column: 2;
  grid-row: 2;
}
.sheet-row.t > :nth-child(4) {
  grid-column: 3;
  grid-row: 2;
}
.sheet-row.t > :nth-child(5) {
  grid-column: 4;
  grid-row: 1;
}
.sheet-row.t + .sheet-row.t {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
}
.sheet-row input {
  min-width: 0;
  width: 100%;
}
.sheet-row .cost {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
}
.sheet-row .cost span {
  color: var(--muted);
  font-size: 13px;
}
.wt-box {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--surface2, #f7f8fa);
}
.wt-box h4 {
  margin: 0;
  font-size: 13.5px;
}
.wt-box table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}
.wt-box td {
  padding: 4px 6px 4px 0;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.wt-box td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.q-list {
  display: grid;
  gap: 8px;
}
.q-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface2);
}
.q-row > input[name^="q_label_"] {
  grid-column: 1/-1;
}
.q-row[hidden] {
  display: none;
}
.q-row .check-line {
  white-space: nowrap;
}
@media (max-width: 520px) {
  .q-opts-row {
    gap: 6px;
  }
}
.answers {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 4px 16px;
  margin: 0;
}
.answers dt {
  font-size: 13px;
  color: var(--muted);
  font-weight: 500;
}
.answers dd {
  margin: 0;
  font-weight: 600;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
@media (max-width: 520px) {
  .answers {
    grid-template-columns: minmax(0, 1fr);
  }
  .answers dd {
    margin-bottom: 6px;
  }
}
.bq {
  display: grid;
  gap: 12px;
}
.bq .seg2 button {
  min-height: 40px;
}
.auto-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line2);
}
.auto-row .itile {
  width: 34px;
  height: 34px;
}
.auto-row .row {
  margin-top: 6px;
  gap: 8px;
}
.auto-row select {
  width: auto;
  min-width: 0;
  padding: 6px 30px 6px 10px;
}
.mini-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px 18px;
}
.mini-stats > div {
  display: grid;
  gap: 2px;
}
.mini-stats b {
  font-size: 24px;
}
.modal:has(.camp-grid) {
  width: min(1000px, 100%);
}
.camp-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.mail-prev {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  margin-top: 6px;
}
.mail-prev-h {
  display: grid;
  gap: 2px;
  padding: 10px 14px;
  background: var(--surface2);
  border-bottom: 1px solid var(--line);
}
.mail-prev-b {
  max-height: 520px;
  overflow: auto;
  color: #1c2330;
}
.mail-prev-b > div {
  transform: none;
}
@media (max-width: 820px) {
  .camp-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .mini-stats {
    gap: 8px;
    padding: 12px 14px 16px;
  }
  .mini-stats b {
    font-size: 20px;
  }
}
.conn-logo {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex: none;
  font-weight: 800;
  font-size: 15px;
  color: #fff;
}
.conn-logo.qb {
  background: #2ca01c;
  letter-spacing: -0.04em;
}
.conn-logo.wh {
  background: var(--navy, #0c2340);
}
.wh-form {
  border-top: 1px solid var(--line2);
}
.wh-doc summary {
  cursor: pointer;
  font-weight: 600;
}
.wh-li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
}
.wh-li .wh-acts {
  grid-column: 2/-1;
  gap: 6px;
}
.opt-more {
  border-top: 1px solid var(--line);
  padding-top: 12px;
  margin-top: 4px;
}
.opt-more > summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
  color: var(--muted);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.opt-more > summary::-webkit-details-marker {
  display: none;
}
.opt-more > summary:before {
  content: "+";
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  border: 1px solid var(--line);
  font-size: 13px;
  line-height: 1;
}
.opt-more[open] > summary:before {
  content: "−";
}
.opt-more[open] > summary {
  margin-bottom: 10px;
}
.bstats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}
.bstats > div {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--surface);
}
.bstats span {
  display: block;
  font-size: 12px;
  color: var(--muted);
}
.bstats b {
  font-size: 22px;
  font-variant-numeric: tabular-nums;
}
.bspark {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 44px;
  margin-top: 12px;
}
.bspark i {
  flex: 1;
  background: color-mix(in srgb, var(--accent) 55%, transparent);
  border-radius: 2px 2px 0 0;
  min-height: 2px;
}
.sub-tabs {
  margin: -4px 0 18px;
}
.grid-partner {
  display: grid;
  grid-template-columns: 1.2fr 1.4fr 0.8fr 90px auto auto;
  gap: 8px;
  align-items: center;
}
.grid-partner input,
.grid-partner select {
  min-width: 0;
}
@media (max-width: 820px) {
  .grid-partner {
    grid-template-columns: 1fr 1fr;
  }
}
.viewsw {
  display: inline-flex;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface);
}
.viewsw button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  background: transparent;
  padding: 8px 12px;
  font-weight: 600;
  font-size: 13px;
  color: var(--muted);
  cursor: pointer;
}
.viewsw button + button {
  border-left: 1px solid var(--line);
}
.viewsw button[aria-pressed="true"] {
  background: var(--ink);
  color: var(--bg);
}
.dm {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 14px;
  align-items: start;
}
.dm-map {
  position: relative;
}
.daymap {
  height: min(64vh, 620px);
  min-height: 380px;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface2);
  z-index: 0;
}
.daymap.dm-plain,
.daymap:empty {
  background-color: var(--surface2);
  background-image: linear-gradient(var(--line2) 1px, transparent 1px),
    linear-gradient(90deg, var(--line2) 1px, transparent 1px);
  background-size: 44px 44px;
}
.dm-wait {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  z-index: 2;
}
.dm-pin {
  border-radius: 50%;
  background: currentColor;
  border: 2.5px solid var(--surface);
  box-shadow: 0 4px 12px #0e1a2b59;
  font-size: 14px;
  cursor: pointer;
}
.dm-pin b {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-weight: 800;
  color: #fff;
}
.dm-side {
  align-self: start;
}
.dm-list {
  display: grid;
  max-height: min(46vh, 430px);
  overflow-y: auto;
  border-top: 1px solid var(--line2);
}
.dm-stop {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 16px;
  border: 0;
  border-bottom: 1px solid var(--line2);
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: var(--ink);
  font: inherit;
}
.dm-stop:hover {
  background: var(--surface2);
}
.dm-n {
  flex: 0 0 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
}
.dm-n.off {
  background: var(--surface2);
  color: var(--faint);
  border: 1px dashed var(--line);
}
.dm-t {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 1px;
}
.dm-t b {
  font-size: 13.5px;
}
.dm-t .small {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.daymap .leaflet-popup-content {
  margin: 12px 14px;
  font: inherit;
  font-size: 13px;
  line-height: 1.45;
  color: #0e1a2b;
}
.daymap.leaflet-container {
  font: inherit;
}
@media (max-width: 900px) {
  .dm {
    grid-template-columns: 1fr;
  }
  .daymap {
    height: 52vh;
    min-height: 300px;
  }
  .dm-list {
    max-height: none;
  }
}
.opts {
  display: grid;
  gap: 8px;
}
.opts label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  cursor: pointer;
  font-size: 13.5px;
  line-height: 1.45;
}
.opts label:has(input:checked) {
  border-color: var(--accent);
  background: var(--surface2);
}
.opts input {
  width: 18px;
  height: 18px;
  min-height: 0;
  margin-top: 2px;
  accent-color: var(--accent);
  flex: 0 0 auto;
}
.modal.ask.rv {
  max-width: 560px;
}
.rv-b {
  padding: 16px 20px 2px;
}
.rv-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  margin: 0 0 12px;
  font-size: 13.5px;
}
.rv-meta dt {
  color: var(--muted);
}
.rv-meta dd {
  margin: 0;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.rv-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: min(300px, 38vh);
  overflow: auto;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  font-size: 13.5px;
  line-height: 1.55;
}
.rv-note {
  margin: 10px 0 12px;
}
.rv-f {
  align-items: center;
}
.rv-sp {
  flex: 1;
}
.rv-alt {
  padding: 0 20px 14px;
  text-align: right;
}
.linkbtn.danger {
  color: var(--bad);
}
@media (max-width: 560px) {
  .rv-f .btn {
    flex: 1 1 100%;
    justify-content: center;
  }
  .rv-sp {
    display: none;
  }
  .rv-alt {
    text-align: center;
  }
}
.rv-copy {
  display: grid;
  gap: 8px;
  margin: 10px 0 4px;
}
.rv-crow {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 10px;
  align-items: center;
  font-size: 13.5px;
}
.rv-crow b {
  overflow-wrap: anywhere;
  font-weight: 600;
}
.rv-cmsg {
  grid-template-columns: 64px 1fr auto;
}
.rv-cmsg .btn {
  grid-column: 3;
}
.rv-ta {
  width: 100%;
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px;
  background: var(--surface2);
  color: var(--ink);
  resize: vertical;
}
.rv-nothing {
  margin: 4px 0 12px;
}
.rv-nothing summary {
  cursor: pointer;
  color: var(--accent);
  font-weight: 700;
}
.rv-alt {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}
.trybar {
  background: #0b1322;
  color: #c9d4e3;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
}
.trybar-in {
  max-width: 1180px;
  margin: 0 auto;
  padding: 10px 16px;
  display: flex;
  gap: 12px 20px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.trybar-l {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 280px;
}
.trybar-l b {
  color: #fff;
  font-size: 14px;
}
.trybar-s {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  max-width: 100%;
  padding-bottom: 2px;
  scrollbar-width: thin;
}
.trybar-s a {
  flex: 0 0 auto;
  color: #dce5f2;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  padding: 5px 12px;
  font-weight: 600;
}
.trybar-s a[aria-current] {
  background: #fff;
  color: #0b1322;
  border-color: #fff;
}
.hub-styles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 14px;
}
.hub-style {
  display: block;
  color: inherit;
  text-decoration: none;
  overflow: hidden;
  padding: 0;
}
.hub-style img {
  display: block;
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
  object-position: top;
  border-bottom: 1px solid var(--line);
  background: var(--surface2);
}
.hub-style div {
  padding: 12px 14px;
}
.hub-style p {
  margin: 4px 0 0;
}
.demo-guide .demo-steps {
  margin: 0;
  padding: 4px 20px 6px 40px;
  display: grid;
  gap: 10px;
  line-height: 1.55;
}
.demo-guide .demo-steps a {
  font-weight: 700;
}
.demo-guide .demo-tip {
  padding: 0 20px 18px;
  margin: 0;
}
.demo-end {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  padding: 6px 0 18px;
}
@media (max-width: 860px) {
  .side-foot {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
    padding: 2px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    margin-top: 2px;
  }
  .side-foot .ws {
    display: none;
  }
  .side-foot .side-link {
    width: auto;
    padding: 6px 10px;
    font-size: 13px;
    gap: 6px;
  }
}
.pm-savebar {
  position: sticky;
  bottom: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 0;
  margin-top: 8px;
  background: var(--surface);
  border-top: 1px solid var(--line);
}
.pm-dirty-note.on {
  color: var(--warn);
  font-weight: 600;
}
.seg2.wdays button {
  flex: 1 1 44px;
  min-width: 44px;
  padding-inline: 4px;
}
.sv-sec {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.sv-form > .sv-sec:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.sv-sec > div {
  display: grid;
  gap: 2px;
}
.sv-sec b {
  font-size: 15px;
}
.sv-n {
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--accentSoft);
  color: var(--accent);
  font-weight: 800;
  font-size: 12.5px;
  display: grid;
  place-items: center;
}
.mode-pick {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 8px;
}
.mode-opt {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
  background: var(--surface);
}
.mode-opt input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.mode-opt:has(input:checked) {
  border-color: var(--accent);
  background: var(--accentSoft);
}
.mode-opt:has(input:focus-visible) {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.sv-form:has(input[name="pricing_mode"][value="quote"]:checked) .price-f,
.sv-form:has(input[name="pricing_mode"][value="free"]:checked) .price-f {
  display: none;
}
.sv-form .bk-note {
  display: none;
  margin-top: 6px;
}
.sv-form:has(input[name="book_how"][value="request"]:checked) .bk-note-req,
.sv-form:has(input[name="book_how"][value="instant"]:checked) .bk-note-inst {
  display: block;
}
.sv-form .lbl-from {
  display: none;
}
.sv-form:has(input[name="pricing_mode"][value="from"]:checked) .lbl-from {
  display: inline;
}
.sv-form:has(input[name="pricing_mode"][value="from"]:checked) .lbl-fixed {
  display: none;
}
.sv-form .rec-only {
  display: none;
}
.sv-form:has(.checks input[name^="freq_"]:not([name="freq_once"]):checked)
  .rec-only {
  display: grid;
}
.q-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.q-opts-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: flex-end;
}
.q-mini {
  display: grid;
  gap: 3px;
  font-size: 12px;
  color: var(--muted);
  flex: 1 1 150px;
}
.q-mini span {
  font-weight: 600;
}
.q-row .q-opts {
  display: none;
}
.q-row:has(select[name^="q_type_"] option[value="choice"]:checked) .q-opts {
  display: grid;
}
.amber-t {
  color: var(--warn);
}
.il-head,
.il-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px 110px 36px;
  gap: 8px;
  align-items: center;
}
.il-head {
  margin-bottom: -4px;
}
@media (max-width: 520px) {
  .il-head {
    display: none;
  }
  .il-row {
    grid-template-columns: minmax(0, 1fr) 56px 90px 36px;
  }
}
.pay-lines {
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
}
.pay-lines td {
  padding: 8px 0;
  border-top: 1px solid var(--line);
}
.pay-lines td:last-child {
  text-align: right;
  white-space: nowrap;
}
.pay-lines .pay-tot td {
  font-weight: 800;
  border-top: 2px solid var(--ink);
}
.pay-note {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--surface2);
  font-size: 14.5px;
}
.hr-list {
  display: grid;
  gap: 8px;
}
.hr-row {
  display: grid;
  grid-template-columns: 140px auto 1fr;
  align-items: center;
  gap: 10px 16px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.hr-row .check-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.hr-times,
.hr-break {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.hr-break .check-line {
  font-weight: 500;
}
.hr-row input[type="time"],
.hr-win input[type="time"] {
  min-height: 36px;
  padding: 4px 8px;
  width: auto;
}
.hr-row.off .hr-times,
.hr-row.off .hr-break {
  opacity: 0.35;
  pointer-events: none;
}
.hr-on {
  display: flex;
  align-items: center;
  gap: 8px;
}
.hr-sub {
  display: grid;
  gap: 8px;
  padding-top: 6px;
  border-top: 1px solid var(--line);
}
.hr-sub h3 {
  margin: 6px 0 0;
  font-size: 16px;
}
.hr-win {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 8px;
}
.hr-break:not(:has(input[type="checkbox"]:checked)) input[type="time"],
.hr-break:not(:has(input[type="checkbox"]:checked)) .muted {
  display: none;
}
@media (max-width: 700px) {
  .hr-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .hr-break {
    padding-left: 2px;
  }
  .hr-win {
    grid-template-columns: auto auto auto;
    justify-content: start;
    padding-bottom: 6px;
  }
  .hr-win input:first-child {
    grid-column: 1/-1;
  }
  .hr-row input[type="time"],
  .hr-win input[type="time"] {
    min-height: 34px;
    font-size: 14px;
  }
}
.tx-svcs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 6px 14px;
}
.tx-svcs .check-line {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ph-fix {
  cursor: default;
  border-style: solid;
}
.ph-x {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 0;
  background: #0009;
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  min-height: 0;
}
.ph-mv {
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: 6px;
  border: 0;
  border-radius: 8px;
  background: #0009;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 4px;
  cursor: pointer;
  min-height: 0;
}
.dm-pin.t-d0 {
  color: #db2777;
}
.dm-pin.t-d1 {
  color: #2563eb;
}
.dm-pin.t-d2 {
  color: #16a34a;
}
.dm-pin.t-d3 {
  color: #d97706;
}
.dm-pin.t-d4 {
  color: #7c3aed;
}
.dm-pin.t-d5 {
  color: #dc2626;
}
.dm-pin.t-d6 {
  color: #0891b2;
}
.dm-pin.t-d0 b,
.dm-pin.t-d1 b,
.dm-pin.t-d2 b,
.dm-pin.t-d3 b,
.dm-pin.t-d4 b,
.dm-pin.t-d5 b,
.dm-pin.t-d6 b {
  font-size: 12px;
  letter-spacing: -0.02em;
}
.area-days {
  display: grid;
  gap: 6px;
  padding: 10px 14px 0;
}
.area-day {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.area-day b {
  flex: 1;
  font-weight: 600;
}
.area-day i,
.area-chips i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  flex: none;
}
.area-day:disabled {
  opacity: 0.45;
  cursor: default;
}
.area-day.on {
  border-color: var(--ink, #0c2340);
}
.area-hint {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface2);
}
.area-hint > svg {
  flex: none;
  margin-top: 2px;
  color: var(--muted);
}
.area-hint > div {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.area-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.area-chips .fbtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.ad-rows {
  display: grid;
  gap: 8px;
}
.ad-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px minmax(0, 170px);
  gap: 8px;
}
@media (max-width: 560px) {
  .ad-row {
    grid-template-columns: minmax(0, 1fr) 80px;
  }
  .ad-row select {
    grid-column: 1/-1;
  }
}
.pm-secs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 10px 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.pm-secs .check-line {
  font-weight: 500;
}
.ops-tabbar,
.side-close {
  display: none;
}
@media (max-width: 860px) {
  .ops-side {
    display: none;
  }
  .ops.more-open .ops-side {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    position: fixed;
    inset: 0;
    z-index: 70;
    overflow-y: auto;
    padding: 16px 16px calc(96px + env(safe-area-inset-bottom, 0px));
  }
  .ops.more-open .side-nav {
    display: grid;
    overflow: visible;
    flex-basis: auto;
  }
  .ops.more-open .side-nav button {
    width: 100%;
    padding: 12px;
    font-size: 15px;
  }
  .ops.more-open .nav-sec {
    display: block;
  }
  .ops.more-open .side-foot {
    display: grid;
  }
  .ops.more-open .side-close {
    display: grid;
    place-items: center;
    margin-left: auto;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 0;
    background: #ffffff14;
    color: #fff;
    cursor: pointer;
  }
  .side-brand {
    width: 100%;
  }
  .ops-main {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
  .ops-tabbar {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    background: var(--surface);
    border-top: 1px solid var(--line);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  }
  .ops-tabbar button {
    flex: 1;
    position: relative;
    display: grid;
    justify-items: center;
    gap: 3px;
    background: none;
    border: 0;
    padding: 6px 0 4px;
    color: var(--faint);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    min-width: 0;
  }
  .ops-tabbar button span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .ops-tabbar button[aria-current="true"] {
    color: var(--accent);
  }
  .tb-badge {
    position: absolute;
    top: 2px;
    left: calc(50% + 6px);
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--bad);
    color: #fff;
    font-style: normal;
    font-size: 10.5px;
    font-weight: 700;
    display: grid;
    place-items: center;
  }
}
.cl-prog {
  height: 4px;
  background: var(--line2);
}
.cl-prog i {
  display: block;
  height: 100%;
  background: var(--ok);
  transition: width 0.25s ease;
}
.cl label {
  padding: 15px 16px;
  gap: 14px;
  min-height: 56px;
  transition: background 0.12s;
}
.cl label:active {
  background: var(--surface2);
}
.cl input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.cl-box {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--faint) 70%, var(--line));
  display: grid;
  place-items: center;
  flex: none;
  color: transparent;
  background: var(--surface);
  transition:
    background 0.15s,
    border-color 0.15s,
    transform 0.15s;
}
.cl-box svg {
  width: 15px;
  height: 15px;
  stroke-width: 3;
}
.cl input:checked + .cl-box {
  background: var(--ok);
  border-color: var(--ok);
  color: #fff;
  transform: scale(1.04);
  text-decoration: none;
}
.cl input:focus-visible + .cl-box {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.cl-t {
  flex: 1;
  line-height: 1.4;
}
.cl input:checked ~ .cl-t {
  color: var(--muted);
  text-decoration: none;
}
.cl.all-done {
  border-color: color-mix(in srgb, var(--ok) 45%, var(--line));
}
.sec-label .cl-done {
  color: var(--ok);
  font-weight: 700;
}
@media (prefers-reduced-motion: reduce) {
  .cl-box,
  .cl-prog i {
    transition: none;
  }
}
.fieldapp .fapp {
  border-inline: 0;
}
.fieldapp .mono {
  font-family: inherit;
  font-variant-numeric: tabular-nums;
  font-size: inherit;
}
.fieldapp .fbar {
  padding: 12px 14px 12px 16px;
  padding-top: calc(12px + env(safe-area-inset-top, 0px));
}
.fbar-logo {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
  flex: none;
}
.fieldapp .fbar-name {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.fieldapp .sec-label {
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: -4px;
}
.fieldapp .sec-label .mono,
.fieldapp .sec-label .cl-done {
  letter-spacing: 0;
  text-transform: none;
  font-size: 13px;
}
.fieldapp .sec-label {
  gap: 10px;
  flex-wrap: wrap;
}
.fieldapp .sec-label .small {
  letter-spacing: 0;
  text-transform: none;
  font-size: 12.5px;
  font-weight: 500;
}
.fieldapp .fjob,
.fieldapp .frow,
.fieldapp .card,
.fieldapp .cl {
  border-radius: 18px;
}
.fieldapp .f-title {
  letter-spacing: -0.02em;
}
.fieldapp .btn.lg {
  border-radius: 14px;
  min-height: 50px;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) body.fieldapp {
    --bg: #f2f3f5;
    --surface: #ffffff;
    --surface2: #f8f9fb;
    --line: #e5e7eb;
    --line2: #eef0f3;
    --ink: #111827;
    --muted: #5b6474;
    --faint: #8a93a3;
    --accent: #1f2a44;
    --accentSoft: #e8ebf2;
    --navy: #1f2a44;
    --warnSoft: #fef3e2;
    --okSoft: #e3f4ea;
  }
}
:root[data-theme="light"] body.fieldapp {
  --bg: #f2f3f5;
  --surface: #ffffff;
  --surface2: #f8f9fb;
  --line: #e5e7eb;
  --line2: #eef0f3;
  --ink: #111827;
  --muted: #5b6474;
  --faint: #8a93a3;
  --accent: #1f2a44;
  --accentSoft: #e8ebf2;
  --navy: #1f2a44;
  --warnSoft: #fef3e2;
  --okSoft: #e3f4ea;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) body.fieldapp .fbar {
    background: #fff;
    color: #111827;
    border-bottom: 1px solid #e5e7eb;
  }
}
:root[data-theme="light"] body.fieldapp .fbar {
  background: #fff;
  color: #111827;
  border-bottom: 1px solid #e5e7eb;
}
body.fieldapp .fbar-logo {
  background: #f3f4f6;
  color: #1f2a44;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) body.fieldapp .fback,
  :root:not([data-theme="dark"]) body.fieldapp .fme {
    color: #111827;
  }
  :root:not([data-theme="dark"]) body.fieldapp .fme {
    background: #f3f4f6;
  }
  :root:not([data-theme="dark"]) body.fieldapp .fme .av {
    background: #1f2a44;
    color: #fff;
  }
  :root:not([data-theme="dark"]) body.fieldapp .fback:hover {
    background: #f3f4f6;
  }
  :root:not([data-theme="dark"]) body.fieldapp .fjob,
  :root:not([data-theme="dark"]) body.fieldapp .frow,
  :root:not([data-theme="dark"]) body.fieldapp .card,
  :root:not([data-theme="dark"]) body.fieldapp .cl {
    border-color: #e8eaee;
    box-shadow:
      0 1px 2px #0f172a0a,
      0 8px 24px #0f172a0d;
  }
  :root:not([data-theme="dark"]) body.fieldapp .btn.primary {
    background: #1f2a44;
    border-color: #1f2a44;
    color: #fff;
  }
}
:root[data-theme="light"] body.fieldapp .fback,
:root[data-theme="light"] body.fieldapp .fme {
  color: #111827;
}
:root[data-theme="light"] body.fieldapp .fme {
  background: #f3f4f6;
}
:root[data-theme="light"] body.fieldapp .fme .av {
  background: #1f2a44;
  color: #fff;
}
:root[data-theme="light"] body.fieldapp .btn.primary {
  background: #1f2a44;
  border-color: #1f2a44;
  color: #fff;
}
body.doc .rp-meta {
  background: #f8f9fb;
  border-radius: 14px;
  padding: 16px 18px;
  gap: 14px 20px;
}
body.doc .rp-meta b {
  color: #111827;
}
body.doc .rp-body > div > .between > b,
body.doc .rp-body .between > b:first-child {
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 700;
}
body.doc .done-list li,
body.doc .done-list > div {
  border-color: #eef0f3;
}
body.doc .quote {
  border-left-color: #d1d5db;
  color: #374151;
}
body.doc .pay {
  border-color: #e5e7eb;
  border-radius: 16px;
}
body.doc input,
body.doc textarea,
body.doc select {
  border-color: #e5e7eb;
  background: #fff;
}
body.doc input.mono,
body.doc .mono {
  font-family: inherit;
  font-variant-numeric: tabular-nums;
}
body.doc .bar {
  background: #eef0f3;
}
.bp-prospect {
  position: relative;
  z-index: 60;
  background: #0c2340;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
}
.bp-prospect-in {
  max-width: 1120px;
  margin: 0 auto;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.bp-prospect b {
  font-weight: 700;
}
.bp-prospect-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: #0c2340;
  font-weight: 700;
  text-decoration: none;
}
.bp-prospect-btn:hover {
  background: #e8eefb;
}
@media (max-width: 560px) {
  .bp-prospect {
    font-size: 13px;
  }
  .bp-prospect-in {
    padding: 10px 14px;
  }
  .bp-prospect-btn {
    min-height: 34px;
    padding: 0 14px;
  }
}
.cl .cl-item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line2);
}
.cl .cl-item:last-child {
  border-bottom: 0;
}
.cl .cl-item label {
  flex: 1;
  min-width: 0;
  border-bottom: 0;
}
.cl-skipbtn {
  flex: none;
  margin-right: 10px;
  padding: 6px 10px;
  min-height: 34px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.cl-skipbtn:active {
  background: var(--surface2);
}
.cl-item.skipped .cl-box {
  background: var(--surface2);
  border-color: var(--faint);
  color: var(--muted);
}
.cl-item.skipped .cl-t {
  color: var(--muted);
}
.cl-why {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--warn, #b45309);
  margin-top: 2px;
}
.dd-pin i,
.dd-dot {
  display: block;
  border-radius: 50%;
  background: var(--dd, #94a3b8);
}
.dd-pin i {
  width: 100%;
  height: 100%;
  border: 2.5px solid #fff;
  box-shadow: 0 2px 6px #0e1a2b59;
  box-sizing: border-box;
  cursor: pointer;
}
.dd-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  flex: none;
  vertical-align: -1px;
  box-shadow: inset 0 0 0 1.5px #fff9;
}
.s-not_home {
  --dd: #94a3b8;
}
.s-flyer {
  --dd: #2563eb;
}
.s-not_interested {
  --dd: #dc2626;
}
.s-come_back {
  --dd: #d97706;
}
.s-interested {
  --dd: #16a34a;
}
.s-no_soliciting {
  --dd: #111827;
}
.dd-pin.s-no_soliciting i,
.dd-dot.s-no_soliciting {
  background: repeating-linear-gradient(135deg, #111827 0 3px, #4b5563 3px 5px);
}
.dd-dot.cust {
  border-radius: 4px;
  background: #16365f;
}
.dd-cust {
  border-radius: 7px;
  background: #16365f;
  border: 2px solid #fff;
  box-shadow: 0 2px 8px #0e1a2b59;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.92;
}
.dd-cust b {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
}
.dd-me i {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #2563eb;
  border: 3px solid #fff;
  box-shadow: 0 0 0 6px #2563eb38;
  box-sizing: border-box;
}
.dd-draft i {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #0e1a2b;
  border: 3px solid #fff;
  box-shadow: 0 4px 12px #0e1a2b66;
  box-sizing: border-box;
}
.dd-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  font-size: 13px;
  color: var(--muted);
}
.dd-legend > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.dd-opts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.dd-opts button {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  font: inherit;
  color: var(--text);
  cursor: pointer;
  min-height: 56px;
}
.dd-opts button .dd-dot {
  margin-top: 4px;
}
.dd-opts button > span:last-child {
  display: grid;
  gap: 2px;
  line-height: 1.25;
}
.dd-opts button[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent);
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}
.dd-lead {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 12px;
  background: color-mix(in srgb, #16a34a 7%, var(--surface));
  border: 1px solid color-mix(in srgb, #16a34a 25%, var(--line));
}
.dd-map {
  height: min(60vh, 600px);
  min-height: 340px;
}
.dd-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.dd-stat {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
}
.dd-stat b {
  display: block;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.dd-stat span {
  font-size: 13px;
  color: var(--muted);
}
.dd-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.dd-bar select {
  width: auto;
  min-width: 0;
}
@media (max-width: 640px) {
  .dd-opts {
    grid-template-columns: 1fr;
  }
  .dd-stats {
    grid-template-columns: 1fr 1fr;
  }
}
.fieldapp .dd-map {
  height: 42vh;
  min-height: 280px;
  border-radius: 18px;
}
.dd-actions,
.md-days {
  display: grid;
  gap: 8px;
}
.dtag {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, #2563eb 12%, var(--surface));
  color: #1d4ed8;
  vertical-align: 2px;
  white-space: nowrap;
}
.dtag.lbl {
  background: color-mix(in srgb, #7c3aed 12%, var(--surface));
  color: #6d28d9;
}
.s-quoted {
  --dd: #7c3aed;
}
.dd-area-lbl span {
  position: absolute;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
  color: #1e3a8a;
  background: #ffffffe0;
  padding: 2px 8px;
  border-radius: 999px;
  box-shadow: 0 1px 4px #0e1a2b2e;
  pointer-events: none;
}
.dd-search {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
}
.dd-search input {
  flex: 1;
  min-width: 0;
}
.dd-results {
  display: grid;
  gap: 4px;
  margin-top: 6px;
}
.dd-results button {
  display: flex;
  gap: 8px;
  align-items: center;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  font: inherit;
  color: var(--text);
  cursor: pointer;
}
.dd-area {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line2);
}
.dd-area:last-child {
  border-bottom: 0;
}
.dd-mine {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-radius: 14px;
  background: color-mix(in srgb, #2563eb 8%, var(--surface));
  border: 1px solid color-mix(in srgb, #2563eb 30%, var(--line));
}
.q-line {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--line2);
  border-radius: 12px;
}
.ed-form {
  display: grid;
  gap: 14px;
}
.ed-import {
  border: 1px dashed var(--line);
  border-radius: 14px;
  padding: 0 16px;
  background: var(--surface2);
}
.ed-import > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px 0;
  cursor: pointer;
}
.ed-import > summary::-webkit-details-marker,
.ed-card > summary::-webkit-details-marker,
.ed-sec-d > summary::-webkit-details-marker {
  display: none;
}
.ed-import[open] > summary {
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.ed-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  overflow: hidden;
}
.ed-card > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  cursor: pointer;
}
.ed-card > summary:hover {
  background: var(--surface2);
}
.ed-n {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--navy, #0c2340);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 14px;
  flex: none;
}
.ed-ct {
  display: grid;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.ed-ct b {
  font-size: 16px;
}
.ed-ct span {
  font-size: 13.5px;
  color: var(--muted);
}
.ed-chev {
  color: var(--faint);
  transition: transform 0.2s;
}
.ed-card[open] > summary .ed-chev {
  transform: rotate(180deg);
}
.ed-card[open] > summary {
  border-bottom: 1px solid var(--line);
}
.ed-body {
  padding: 18px;
  display: grid;
  gap: 14px;
}
.ed-secs {
  display: grid;
  gap: 8px;
}
.ed-sec {
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: start;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px 10px;
  background: var(--surface);
}
.ed-sec:has(.ed-switch input:not(:checked)) .ed-sec-t b {
  color: var(--faint);
}
.ed-sec:has(.ed-switch input:not(:checked)) {
  background: var(--surface2);
}
.ed-sec-mv {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 28px;
}
.ed-sec-mv .iconbtn {
  width: 28px;
  height: 22px;
}
.ed-switch {
  position: relative;
  display: inline-flex;
  margin-top: 9px;
  cursor: pointer;
}
.ed-switch input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.ed-switch i {
  width: 40px;
  height: 24px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  transition: background 0.15s;
}
.ed-switch i:after {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px #00000040;
  transition: transform 0.15s;
}
.ed-switch input:checked + i {
  background: var(--accent);
}
.ed-switch input:checked + i:after {
  transform: translate(16px);
}
.ed-switch input:focus-visible + i {
  outline: 3px solid var(--accentSoft);
}
.ed-sec-d > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 2px;
  cursor: pointer;
}
.ed-sec-t {
  display: grid;
  flex: 1;
  min-width: 0;
}
.ed-sec-t b {
  font-size: 15px;
}
.ed-sec-t span {
  font-size: 13px;
  color: var(--muted);
}
.ed-edit {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  white-space: nowrap;
}
.ed-sec-d[open] .ed-edit svg {
  transform: rotate(180deg);
}
.ed-sec-b {
  display: grid;
  gap: 12px;
  padding: 6px 2px 10px;
}
.ed-sec-b > p.small.faint {
  margin: 0;
}
.ed-sec-foot {
  margin: 4px 0 0;
}
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.pm-up {
  gap: 8px;
}
.pm-spin {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: pmSpin 0.8s linear infinite;
  display: inline-block;
}
@keyframes pmSpin {
  to {
    transform: rotate(360deg);
  }
}
@media (max-width: 640px) {
  .ed-body {
    padding: 14px;
  }
  .ed-sec {
    grid-template-columns: auto 1fr;
  }
  .ed-sec-mv {
    display: none;
  }
  .ed-card > summary {
    padding: 14px;
  }
}
.sv-form .grid2 {
  align-items: start;
}
.wm,
.hm-brand > span,
.hm-fbrand .hm-brand > span {
  font-family:
    Archivo Variable,
    Figtree,
    sans-serif;
  font-stretch: 75%;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.wm span {
  font-weight: 700;
}
.hm-brand > span {
  font-size: 22px;
}
.hm-brand > span i {
  font-style: normal;
  font-weight: 700;
  color: #2563eb;
}
.hm-brand.light > span i {
  color: #8db2ff;
}
.bun-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 6px 14px;
}

/* Month calendar for exact open times (Oct 2026) */
.hs-cal-wrap { display: grid; gap: 14px; align-items: start; }
@media (min-width: 640px) { .hs-cal-wrap { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } .hs-cal-wrap .bk-times { grid-template-columns: 1fr 1fr; max-height: 340px; overflow: auto; padding-right: 2px; } }
.hc-head { display: flex; align-items: center; justify-content: space-between; margin: 2px 0 8px; }
.hc-head b { font-size: 16px; }
.hc-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; text-align: center; }
.hc-wd { font-size: 11.5px; font-weight: 700; color: var(--muted); padding: 2px 0 4px; letter-spacing: .04em; }
.hc-day { display: grid; place-items: center; aspect-ratio: 1; max-height: 46px; width: 100%; border-radius: 999px; font: inherit; font-size: 14px; color: var(--faint, #9aa1ab); border: 0; background: none; }
.hc-day.past { opacity: .45; }
.hc-day.today { text-decoration: underline; text-underline-offset: 3px; }
.hc-day.open { cursor: pointer; font-weight: 800; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.hc-day.open:hover { background: color-mix(in srgb, var(--accent) 22%, transparent); }
.hc-day.open[aria-pressed="true"] { background: var(--accent); color: var(--accentInk, #fff); }
.hc-day.open:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 40%, transparent); outline-offset: 1px; }

/* Guided 3 step editor (Oct 2026) */
.ed-guide { display: grid; gap: 2px; padding: 12px 16px; border-radius: 14px; background: var(--accentSoft); }
.ed-guide b { font-size: 15px; }
.ed-next { display: flex; justify-content: flex-end; padding-top: 4px; }
.ed-more-h { margin: 10px 2px -4px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.ed-more-h + .ed-card .ed-n { background: var(--surface2); color: var(--muted); border: 1px solid var(--line); }
.pm-styles { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 8px; }
.pm-style { padding: 9px 10px; gap: 2px; }
.pm-style .pm-sw { height: 22px; margin-bottom: 4px; }
.pm-style .small.muted { display: none; }
.pm-style:has(input:checked) { grid-column: span 2; }
.pm-style:has(input:checked) .small.muted { display: block; }

/* Quick-add question chips (Oct 2026) */
.q-presets { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 2px 0 8px; }
.q-presets > span { margin-right: 4px; }
.q-chip { font: inherit; font-size: 13px; font-weight: 600; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; }
.q-chip:hover { border-color: var(--accent); color: var(--accent); }
.q-chip.q-chip-done { background: var(--accentSoft); border-color: var(--accent); color: var(--accent); }

.hs-feat { display: none; }
.ed-form:has(input[name="style"][value="plans"]:checked) .hs-feat { display: grid; }

/* ===== Plans look (Oct 2026). Bold type, plan price cards, numbered steps, address bar. ===== */
.st-card-plans .pm-sw i:nth-child(1) { background: #0a1a33; }
.st-card-plans .pm-sw i:nth-child(2) { background: #18c964; }
.st-card-plans .pm-sw i:nth-child(3) { background: #2f7bff; }
.st-plans {
  --pn-deep: color-mix(in srgb, var(--brand) 14%, #071530);
  --pn-deep2: color-mix(in srgb, var(--brand) 22%, #0b2147);
  font-family: Figtree, system-ui, sans-serif;
}
.st-plans h1, .st-plans h2, .st-plans .bp2-svc h3, .st-plans .bp2-steps h3, .st-plans .bp2-price b, .st-plans .bp2-num, .st-plans .bp2-close h2 {
  font-family: "Archivo Variable", Archivo, Figtree, sans-serif;
  font-weight: 900;
  letter-spacing: -0.025em;
}
.st-plans h1 { line-height: 0.98; }
.st-plans .bp2-head h2, .st-plans .bp2-about-copy h2, .st-plans .bp2-req h2 { font-size: clamp(32px, 4.2vw, 52px); line-height: 1; }
.st-plans .btn { border-radius: 999px; font-weight: 800; }
.st-plans .btn.primary { background: var(--brand); border-color: var(--brand); color: var(--accentInk); box-shadow: 0 8px 22px color-mix(in srgb, var(--brand) 35%, transparent); }
.st-plans .btn.primary:hover { filter: brightness(1.05); }
.st-plans .bp-eyebrow { display: inline-block; background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brandText); border-radius: 999px; padding: 5px 12px 4px; font-weight: 800; letter-spacing: 0.1em; }

/* Hero: deep band, white type */
.st-plans .bp2-hero { background: var(--pn-deep); padding: 64px 0 84px; }
.st-plans .bp2-hero-bg { background: radial-gradient(50% 70% at 92% 0%, color-mix(in srgb, var(--brand) 38%, transparent), transparent 70%), radial-gradient(40% 60% at 0% 100%, color-mix(in srgb, #2f7bff 30%, transparent), transparent 70%); }
.st-plans .bp2-hero-bg:after { background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); }
.st-plans .bp2-copy { --ink: #fff; --muted: rgba(255,255,255,.78); --line: rgba(255,255,255,.22); --surface: rgba(255,255,255,.06); color: #fff; }
.st-plans .bp2-copy h1 { font-size: clamp(42px, 5.6vw, 76px); color: #fff; }
.st-plans .bp2-copy .bp2-ghost { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.4); }
.st-plans .bp2-copy .bp-label { background: rgba(255,255,255,.1); color: #fff; }
.st-plans .bp2-copy a { color: #fff; }
.st-plans .bp2-hero .bp2-card { box-shadow: 0 30px 70px rgba(0,0,0,.35); border: 0; }
.st-plans .bp2-hero .bp2-pay, .st-plans .bp2-hero .bp2-formcol > p { color: rgba(255,255,255,.75); }

/* Address bar */
.hs-addr { display: flex; gap: 6px; margin-top: 26px; padding: 6px; background: #fff; border-radius: 999px; max-width: 540px; box-shadow: 0 14px 34px rgba(0,0,0,.25); }
.hs-addr input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; padding: 0 16px; color: #0b1324; }
.hs-addr input::placeholder { color: #6b7280; }
.hs-addr .btn { flex: none; }
.st-plans .bp2-cta { margin-top: 16px; }

/* Plan cards */
.st-plans .bp2-svcs { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 18px; align-items: stretch; padding-top: 14px; }
.st-plans .bp2-svc { position: relative; border: 2px solid var(--line); border-radius: 24px; padding: 26px 24px 22px; }
.st-plans .bp2-svc .itile, .st-plans .bp2-svc .svc-tile { display: none; }
.st-plans .bp2-svc h3 { font-size: 22px; margin: 0; }
.st-plans .bp2-svc-f { flex-direction: column; align-items: stretch; border-top: 0; padding-top: 6px; gap: 14px; }
.st-plans .bp2-price b { font-size: 44px; line-height: 1; color: var(--ink); display: inline; }
.st-plans .bp2-price small { font-size: 14px; margin-left: 6px; }
.st-plans .bp2-price .bp-from { display: block; margin: 0 0 4px; }
.st-plans .bp2-svc-f .btn { width: 100%; justify-content: center; padding-top: 13px; padding-bottom: 13px; }
.st-plans .bp2-svc .tick, .st-plans .ticks li:before { color: var(--brandText); }
.st-plans .bp2-svc.is-featured { border-color: var(--brand); box-shadow: 0 22px 50px color-mix(in srgb, var(--brand) 28%, transparent); transform: translateY(-8px); }
.st-plans .bp2-svc.is-featured:hover { transform: translateY(-10px); }
.st-plans .bp2-pop { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: var(--brand); color: var(--accentInk); font-weight: 900; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; padding: 6px 14px; border-radius: 999px; white-space: nowrap; }
.bp2-pop { display: none; }
.st-plans .bp2-pop { display: inline-block; }

/* How it works: numbered band */
.st-plans #how { background: var(--pn-deep); --ink: #fff; --muted: rgba(255,255,255,.75); color: #fff; }
.st-plans #how .bp-eyebrow { background: rgba(255,255,255,.1); color: #fff; }
.st-plans #how .bp2-steps > li { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.14); }
.st-plans #how .bp-note, .st-plans #how .ticks { color: rgba(255,255,255,.8); }
.st-plans .bp2-num { width: 62px; height: 62px; border-radius: 50%; background: var(--brand); color: var(--accentInk); font-size: 28px; }

/* Closing and request bands */
.st-plans .bp2-close { background: var(--brand); color: var(--accentInk); }
.st-plans .bp2-close h2, .st-plans .bp2-close p { color: var(--accentInk); }
.st-plans .bp2-close .btn.primary { background: var(--pn-deep); color: #fff; border-color: var(--pn-deep); box-shadow: none; }

@media (max-width: 760px) {
  .st-plans .bp2-hero { padding: 36px 0 56px; }
  .st-plans .bp2-copy h1 { font-size: clamp(38px, 11vw, 52px); }
  .hs-addr { flex-direction: column; border-radius: 18px; padding: 8px; }
  .hs-addr input { padding: 12px 10px; }
  .hs-addr .btn { width: 100%; justify-content: center; }
  .st-plans .bp2-svc.is-featured { transform: none; }
}

.st-plans .bp2-cta .btn, .st-plans .bp2-nav .btn { border-radius: 999px; }

/* Brand colors (Oct 2026) */
.hs-colors { display: grid; gap: 10px; }
.hs-crow { display: grid; gap: 8px; }
.hs-cpick { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; width: fit-content; }
.hs-cpick input[type=color] { width: 46px; height: 46px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: none; cursor: pointer; }
.hs-cpick input[type=color]::-webkit-color-swatch-wrapper { padding: 3px; }
.hs-cpick input[type=color]::-webkit-color-swatch { border: 0; border-radius: 9px; }
.hs-cpick span { display: grid; line-height: 1.2; }
.hs-hex { font-family: "IBM Plex Mono", ui-monospace, monospace; color: var(--muted); font-size: 12.5px; }
.hs-sw { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.hs-sw:empty { display: none; }
.hs-sw-l { font-size: 12px; font-weight: 700; color: var(--muted); margin-right: 2px; }
.hs-sw-gap { width: 1px; height: 22px; background: var(--line); margin: 0 4px; }
.hs-chip { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--line); background: var(--c); cursor: pointer; padding: 0; }
.hs-chip:hover { transform: scale(1.1); }
.hs-c2 { display: none; padding-left: 2px; }
.hs-colors:has([name=br_color2_on]:checked) .hs-c2 { display: grid; }
/* Exact open time: inline hours and preview */
.hs-inst { display: none; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; margin-top: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface2, var(--surface)); }
.sv-form:has(input[name=book_how][value=instant]:checked) .hs-inst { display: grid; }
.hs-inst-l { display: grid; gap: 8px; align-content: start; }
.hs-inst-t { font-size: 14.5px; }
.hs-hrs { display: grid; gap: 6px; }
.hs-hr { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; align-items: center; }
.hs-hr input[type=time] { min-width: 0; padding: 7px 8px; }
.hs-hr.off input[type=time], .hs-hr.off .muted { opacity: .35; }
.hs-inst-r { display: grid; gap: 6px; align-content: start; }
.hs-mc { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); padding: 12px; display: grid; gap: 8px; }
.hs-mc-h { display: flex; justify-content: space-between; font-size: 13px; }
.hs-mc-g { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; text-align: center; font-size: 11px; }
.hs-mc-g i { font-style: normal; color: var(--muted); font-weight: 700; }
.hs-mc-d { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; color: var(--faint, #9aa1ab); }
.hs-mc-d.on { color: var(--accent); font-weight: 800; background: color-mix(in srgb, var(--accent) 12%, transparent); }
.hs-mc-d.sel { background: var(--accent); color: var(--accentInk, #fff); }
.hs-mc-t { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.hs-mc-t span { border: 1px solid var(--line); border-radius: 8px; text-align: center; font-size: 11.5px; font-weight: 700; padding: 5px 0; }
.hs-mc-t span.sel { background: var(--accent); border-color: var(--accent); color: var(--accentInk, #fff); }
@media (max-width: 640px) { .hs-inst { grid-template-columns: 1fr; } .hs-inst-r { display: none; } }

/* Second brand color (Oct 2026). Only applies when the owner sets one. */
.bp2 :where(.bp-eyebrow) { color: var(--brand2Text, var(--brandText)); }
.bp2 :where(.bp2-num) { background: color-mix(in srgb, var(--brand2, var(--brand)) 16%, transparent); color: var(--brand2Text, var(--brandText)); }
.bp2 :where(.bp2-hero-bg) { background: radial-gradient(55% 60% at 90% 0%, color-mix(in srgb, var(--brand) 16%, transparent), transparent 70%), radial-gradient(45% 55% at 0% 100%, color-mix(in srgb, var(--brand2, var(--brand)) 14%, transparent), transparent 70%); }
.st-plans { --pn-deep: var(--brand2, color-mix(in srgb, var(--brand) 14%, #071530)); }
.st-plans .bp2-num { background: var(--brand); color: var(--accentInk); }
.st-plans .bp2-hero-bg { background: radial-gradient(50% 70% at 92% 0%, color-mix(in srgb, var(--brand) 38%, transparent), transparent 70%), radial-gradient(40% 60% at 0% 100%, color-mix(in srgb, #2f7bff 30%, transparent), transparent 70%); }

.hs-inst { grid-template-columns: 1fr; }
.hs-inst-r { max-width: 320px; }
.hs-hr { grid-template-columns: 70px minmax(112px, 150px) auto minmax(112px, 150px); }
@media (max-width: 640px) { .hs-inst-r { display: grid; } .hs-hr { grid-template-columns: 62px minmax(0, 1fr) auto minmax(0, 1fr); } }

.hs-hr { justify-content: start; }

/* Simpler service editor (Oct 2026) */
.sv-guide { display: grid; gap: 2px; padding: 12px 14px; border-radius: 14px; background: var(--accentSoft); margin-bottom: 4px; }
.sv-guide span { font-size: 13.5px; color: var(--muted); }
.sv-fold { border: 1px solid var(--line); border-radius: 14px; padding: 0 14px; background: var(--surface); }
.sv-fold > summary { cursor: pointer; padding: 12px 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sv-fold > summary::-webkit-details-marker { display: none; }
.sv-fold > summary::before { content: "+"; display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--surface2, #f2f4f7); font-weight: 800; color: var(--muted); }
.sv-fold[open] > summary::before { content: "−"; }
.sv-fold-b { padding: 0 0 14px; }
.sv-fold-big { margin-top: 6px; }

/* Convert a preview: billing choices */
.pv-opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pv-opt{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1.5px solid #E2E8F0;border-radius:12px;padding:12px;cursor:pointer;font-weight:400}
.pv-opt:has(input:checked){border-color:#0C2340;box-shadow:0 0 0 1px #0C2340}
.pv-opt input[type=radio]{appearance:auto;-webkit-appearance:radio;width:18px!important;height:18px!important;min-height:0!important;padding:0!important;margin:2px 0 0!important;flex:none;border:0!important;box-shadow:none!important;background:none!important;accent-color:#0C2340}
.pv-opt span{display:grid;gap:2px}.pv-opt b{font-size:14px}.pv-opt small{color:#64748B;font-size:12.5px;line-height:1.35}
@media (max-width:760px){.pv-opts{grid-template-columns:1fr}}
.q-more{display:contents}.q-more>summary{list-style:none;cursor:pointer}.q-more>summary::-webkit-details-marker{display:none}.q-more[open]>summary{display:none}

/* Your page (Oct 2026) */
.yp-link{padding:20px 22px}
.yp-url{display:flex;align-items:center;gap:10px;font-size:18px;word-break:break-all}
.yp-dot{width:10px;height:10px;border-radius:50%;background:#16A34A;box-shadow:0 0 0 4px rgba(22,163,74,.15);flex:none}.yp-dot.off{background:#94A3B8;box-shadow:none}
.yp-stat{font-size:13px;color:var(--muted,#64748B);align-self:center;margin-left:auto}
.yp-qr{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:1px solid var(--line,#E5E7EB)}
.yp-qr img{border-radius:12px;border:1px solid var(--line,#E5E7EB);background:#fff;image-rendering:pixelated}
.yp-qr p{margin:4px 0 10px}
.yp-bar{height:6px;border-radius:999px;background:var(--line,#E5E7EB);overflow:hidden;margin:18px 0 12px}.yp-bar i{display:block;height:100%;background:#16A34A;border-radius:999px}
.yp-parts{display:grid;gap:10px}
.yp-part{display:flex;align-items:center;gap:14px;width:100%;text-align:left;font:inherit;background:var(--card,#fff);border:1px solid var(--line,#E5E7EB);border-radius:16px;padding:16px 18px;cursor:pointer;color:inherit}
.yp-part:hover{border-color:#CBD5E1}
.yp-ck{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none;font-weight:800;font-size:14px;background:var(--bg2,#F1F5F9);color:var(--muted,#64748B)}
.yp-part.done .yp-ck{background:#16A34A;color:#fff}
.yp-t{flex:1;min-width:0;display:grid;gap:2px}.yp-t b{font-size:16px}.yp-t span{font-size:13.5px;color:var(--muted,#64748B);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.yp-go{display:flex;align-items:center;gap:4px;font-size:14px;font-weight:700;color:var(--accent,#0C2340);flex:none}
@media (max-width:600px){.yp-stat{margin-left:0;width:100%}}
.yp-h{font-size:14px;margin:22px 0 10px;color:var(--muted,#64748B);font-weight:700}

/* Quick service editor */
.sv-quick .svq-h{font-weight:700;font-size:14px;margin:6px 0 -4px;color:var(--ink,#0B1220)}
.sv-quick .mode-pick{gap:8px}
.sv-quick .mode-opt{padding:10px 12px}
.sv-quick .mode-opt .small{display:none}
.sv-quick .mode-opt:has(input:checked) .small{display:block}
.sv-quick .bk-note{display:none!important}
.svq-more{border:1px solid var(--line,#E5E7EB);border-radius:14px;padding:4px 16px;background:var(--card,#fff)}
.svq-more>summary{cursor:pointer;list-style:none;display:grid;gap:2px;padding:12px 0}
.svq-more>summary::-webkit-details-marker{display:none}
.svq-more>summary b:after{content:" +";color:var(--accent,#2563EB)}
.svq-more[open]>summary b:after{content:" \2212"}
.svq-more[open]{padding-bottom:16px}
.svq-often .svq-x{display:none}
.svq-often{align-items:center}
.sv-quick .mode-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.sv-quick > .field > .small.faint,.sv-quick > .grid2 .small.faint{display:none}

/* Money and Grow on phones (Oct 2026): names get the width, buttons drop underneath */
.hs-how{border:1px solid var(--line,#E5E7EB);border-radius:12px;padding:10px 14px;background:var(--card,#fff)}
.hs-how>summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--accent,#0C2340)}
.hs-how[open]>summary{margin-bottom:6px}
@media (max-width:600px){
  .panel .list > .li{flex-wrap:wrap}
  .panel .list > .li > .li-main{flex:1 1 calc(100% - 56px);min-width:0}
  .panel .list > .li > .row:last-child{margin-left:auto}
  .tbl-wrap,.panel table{display:block;overflow-x:auto}
}

/* Questions, made simple */
.qs .q-row.qs-empty{display:none!important}
.qs .q-row{border-radius:12px}
.qs .q-row:has(.qs-sum):not(.qs-open) > :not(.qs-sum){display:none!important}
.qs .q-row:has(.qs-sum):not(.qs-open){padding:0;background:none;border:0}
.qs-sum{display:flex;align-items:center;gap:6px;padding:10px 12px;border:1px solid var(--line,#E5E7EB);border-radius:12px;background:var(--card,#fff)}
.qs .q-row.qs-open .qs-sum{border:0;padding:0 0 8px;background:none}
.qs-t{flex:1;min-width:0;display:grid;gap:1px}.qs-t b{font-size:14.5px}.qs-t small{color:var(--muted,#64748B);font-size:12.5px}
.qs .q-list{display:grid;gap:8px;margin:10px 0}
.qs.qs-none .q-list{margin:0}

/* Polish (Oct 2026): checkboxes, collapsed sections and save rows */
input[type="checkbox"]{accent-color:var(--accent,#0C2340);width:18px;height:18px;flex:none;cursor:pointer}
.check-line{display:flex;align-items:flex-start;gap:10px;line-height:1.4}
.check-line input[type="checkbox"]{margin-top:1px}
/* A collapsed section on its own reads as one tidy row, with a real button-like plus */
.panel > details.opt-more.pad{border-top:0;margin:0;padding:16px 18px}
.panel > details.opt-more.pad > summary{color:var(--ink,#0B1220);font-size:15px}
.opt-more > summary:before{width:24px;height:24px;border-radius:50%;border:0;background:var(--accentSoft,#E8EEF8);color:var(--accent,#0C2340);font-weight:800;font-size:15px}
.opt-more > summary:hover{color:var(--accent,#0C2340)}
.panel > details.opt-more.pad:not([open]){padding-bottom:16px}
/* Save rows at the bottom of a form: a quiet divider so the buttons feel anchored */
form.pad > .row:last-child:has(button[type="submit"]),form.stack > .row:last-child:has(button[type="submit"]){border-top:1px solid var(--line,#E5E7EB);padding-top:16px;margin-top:6px}
.pay-ot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pay-ot .opt{text-align:left}
@media (max-width:600px){.pay-ot{grid-template-columns:1fr}}
/* Setup card (Oct 2026, refined) */
.setup-card{position:relative;overflow:hidden;background:linear-gradient(100deg,var(--surface) 40%,color-mix(in srgb,var(--accentSoft) 75%,var(--surface)) 100%);border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));box-shadow:0 1px 2px rgba(15,23,42,.04),0 6px 18px -10px rgba(15,23,42,.12)}
.setup-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.85}
.setup-card-b{padding:18px 22px 18px 24px;gap:18px;align-items:center}
.setup-card .ring{width:60px;height:60px}
.setup-card .ring circle{stroke-width:5}
.setup-card .ring-bg{stroke:color-mix(in srgb,var(--accent) 10%,var(--surface2))}
.setup-card .ring .ring-fg{stroke:var(--accent)}
.setup-card .ring b{font-size:14px;font-weight:700;color:var(--ink)}
.setup-card-b .eyebrow{margin-bottom:4px;letter-spacing:.08em}
.setup-card-b b{font-size:16px;color:var(--ink)}
.setup-card-b .li-main .small{margin-top:2px}
.setup-card-a{gap:4px;align-items:center}
.setup-card-a .btn.primary{padding-left:16px;padding-right:16px}
.setup-card-a .btn.ghost{display:inline-flex;align-items:center;gap:4px;color:var(--ink)}
.setup-card-a .btn.ghost svg{opacity:.6;transition:transform .15s}
.setup-card-a .btn.ghost:hover svg{transform:translateX(2px);opacity:1}
@media (max-width:760px){.setup-card-b{flex-wrap:wrap;align-items:flex-start}.setup-card-a{width:100%;padding-left:78px}}

/* Week (Oct 2026) */
.wk-nav{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden;height:40px}
.wk-nav button{border:0;background:transparent;color:var(--ink);font:inherit;font-size:13px;font-weight:600;padding:0 12px;display:inline-flex;align-items:center;cursor:pointer}
.wk-nav button+button{border-left:1px solid var(--line)}
.wk-nav button:hover{background:var(--surface2)}
.week-empty{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:11px 14px;border-radius:12px;background:var(--surface);border:1px dashed var(--line);color:var(--muted);font-size:13.5px}
.week{gap:10px}
.day{border-radius:14px;padding:12px;min-height:220px;gap:8px;grid-template-rows:auto;align-content:start;position:relative}
.day.past{background:color-mix(in srgb,var(--surface) 55%,transparent)}
.day.past .dn,.day.past .dw{opacity:.6}
.day-h{display:flex;align-items:center;gap:8px;justify-content:flex-start;padding-bottom:8px;border-bottom:1px solid var(--line2);margin-bottom:2px}
.day-h .dw{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.day-h .dn{font-size:18px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1;margin-left:auto;order:2}
.day-h .dc{font-size:11px;font-weight:600;color:var(--muted);order:1}
.day.today{border-color:var(--line);box-shadow:none}
.day.today .day-h .dn{background:var(--accent);color:#fff;border-radius:999px;min-width:30px;height:30px;padding:0 6px;display:grid;place-items:center;font-size:15px}
.day.today .day-h .dw{color:var(--accent)}
.day-open{font-size:12.5px;color:var(--faint)}
.day-add{display:inline-flex;align-items:center;justify-content:center;gap:5px;width:100%;margin-top:2px;padding:7px;border:1px dashed var(--line);border-radius:9px;background:transparent;color:var(--muted);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:opacity .15s,border-color .15s,color .15s}
.day-add:hover{border-color:var(--accent);color:var(--accent);background:var(--accentSoft)}
@media (hover:hover){.day .day-add{opacity:0}.day:hover .day-add,.day-add:focus-visible{opacity:1}}
@media (max-width:760px){.day{min-height:0}.day-add{opacity:1}}
.day-h{min-height:39px}
.day.today{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
/* Roles (Oct 2026) */
.title-in{display:block;width:100%;max-width:200px;margin-top:6px;padding:5px 8px;font:inherit;font-size:12.5px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink)}
.title-in:focus{outline:2px solid color-mix(in srgb,var(--accent) 35%,transparent);border-color:var(--accent)}
.mem-title{color:var(--ink);font-weight:600}
.role-what{max-width:260px;margin-top:4px;line-height:1.35}
.role-guide .rg-list{display:grid;gap:0}
.rg-row{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line2);font-size:13px;line-height:1.4}
.rg-row:first-child{border-top:0;padding-top:0}
.rg-row span{color:var(--muted)}
.rg-pay{margin-top:14px;padding:12px;border-radius:10px;background:var(--surface2);align-items:flex-start}
.rg-pay>span{display:grid;gap:2px}
.cs-row{gap:12px;padding:10px 0}
@media (max-width:760px){.rg-row{grid-template-columns:1fr;gap:2px}}
.topme small{text-transform:none}
/* Field quotes and Find a pro toggle (Oct 2026) */
.fq-open{margin-top:10px}
.fq{margin-top:14px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--accentSoft) 45%,var(--surface));display:grid;gap:12px}
.fq-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.fq-h b{display:block;font-size:16px}
.fq-k{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:2px}
.fq-f{display:grid;gap:6px}
.fq-f>span{font-size:13px;font-weight:600;color:var(--muted)}
.fq-f select,.fq-line input{font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);width:100%;min-width:0}
.fq-line{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:8px;align-items:center}
.fq-line .cost{display:flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding-left:10px}
.fq-line .cost input{border:0;padding-left:2px;background:transparent}
.fq-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:10px;border-top:1px solid var(--line)}
.fq-total b{font-size:22px;font-variant-numeric:tabular-nums}
.fq-tip{display:flex;gap:8px;align-items:center;color:var(--muted);margin:0}
.fq-warn{color:var(--warn);margin:0}.fq-mat{margin:0}
.fq-done{grid-template-columns:auto 1fr;align-items:start;background:var(--okSoft);border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}
.fq-done .fq-ic{width:36px;height:36px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center}
.fq-done b{font-size:16px}.fq-done p{margin:4px 0 0}
.fq-acts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.yp-dir{padding:14px 16px}
.yp-dir .check-line{align-items:flex-start;gap:10px}
.yp-dir .check-line>span{display:grid;gap:2px}
@media (max-width:420px){.fq-line{grid-template-columns:minmax(0,1fr) 104px auto}}
/* Get discovered (Oct 2026) */
.yp-disc{padding:20px 22px;display:grid;gap:18px}
.yd-h{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.yd-h h2{margin:0 0 4px;font-size:17px}
.yd-h p{margin:0;max-width:62ch;line-height:1.5}
.yd-sw{display:inline-flex;align-items:center;gap:10px;cursor:pointer;flex:none;padding-top:2px}
.yd-sw input{position:absolute;opacity:0;width:1px;height:1px}
.yd-track{position:relative;width:44px;height:26px;border-radius:999px;background:var(--line);transition:background .15s}
.yd-track:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.25);transition:transform .15s}
.yd-sw input:checked+.yd-track{background:var(--ok)}
.yd-sw input:checked+.yd-track:after{transform:translateX(18px)}
.yd-sw input:focus-visible+.yd-track{outline:2px solid var(--accent);outline-offset:2px}
.yd-sw input:disabled+.yd-track{opacity:.5}
.yd-lbl{font-weight:700;font-size:14px;min-width:24px}
.yd-sec{display:grid;gap:4px;padding-top:16px;border-top:1px solid var(--line2)}
.yd-sec>b{font-size:14px}
.yd-zips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.yd-zip{display:inline-flex;align-items:center;gap:4px;padding:5px 6px 5px 11px;border-radius:999px;background:var(--accentSoft);color:var(--ink);font-weight:600;font-size:13.5px;font-variant-numeric:tabular-nums}
.yd-zip button{display:grid;place-items:center;width:20px;height:20px;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer;padding:0}
.yd-zip button:hover{background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--ink)}
.yd-zips input{flex:1;min-width:140px;border:0;outline:0;background:transparent;font:inherit;font-size:14px;padding:6px 4px;color:var(--ink)}
.yd-svcs{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.yd-svc{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:13.5px;font-weight:600;cursor:pointer;user-select:none}
.yd-svc:has(input:checked){border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:var(--accentSoft)}
.yd-svc input{margin:0;accent-color:var(--accent)}
.yd-f{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding-top:16px;border-top:1px solid var(--line2)}
.yd-f .btn.ghost{margin-left:auto}
@media (max-width:640px){.yd-h{flex-direction:column;gap:12px}.yd-f .btn.ghost{margin-left:0}}
