/* Opright's canonical visual layer. Read design.md before adding interface styles. */
@font-face{font-family:"Michroma";src:url("/fonts/michroma.woff") format("woff");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Bruno Ace";src:url("/fonts/bruno-ace.woff") format("woff");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Montserrat";src:url("/fonts/montserrat.woff") format("woff");font-style:normal;font-weight:100 900;font-display:swap}

:root{
  color-scheme:light;
  --ds-sage:#8e9a74;--ds-cream:#f6f3ec;--ds-beige:#e9e3d7;--ds-gray:#eee;
  --ds-ink:#252821;--ds-action:#526340;--ds-panel-green:#526340;--ds-panel-text:#F6F3EC;--ds-action-hover:#3e4e30;--ds-paper:#fdfcf9;
  --ds-muted:#5c6255;--ds-line:#d4d6cb;--ds-input-line:#818a75;
  --ds-success:#3f5c37;--ds-success-soft:#e5eadd;--ds-danger:#963e36;--ds-danger-soft:#f6e9e5;
  --ds-warning:#785421;--ds-warning-soft:#f3eadb;
  --ds-font-heading:"Michroma","Segoe UI",sans-serif;
  --ds-font-wordmark:"Bruno Ace","Segoe UI",sans-serif;
  --ds-font-body:"Montserrat","Segoe UI",Arial,sans-serif;
  --ds-radius:24px;--ds-radius-sm:14px;--ds-shadow:0 4px 18px rgb(37 40 33 / 4%);
  --ds-shadow-raised:0 16px 48px rgb(37 40 33 / 13%);
  --opright-night:var(--ds-ink);--opright-navy:var(--ds-ink);--opright-panel:#343a2d;
  --opright-blue:var(--ds-action);--opright-cyan:var(--ds-sage);--opright-royal:var(--ds-action-hover);
  --opright-ice:var(--ds-beige);--opright-wash:var(--ds-gray);--opright-line:var(--ds-line);
  --opright-muted:var(--ds-muted);--opright-gradient:var(--ds-action);--opright-radius:var(--ds-radius);
  --navy:var(--ds-ink);--green:var(--ds-action);--bg:var(--ds-gray);--paper:var(--ds-paper);
  --muted:var(--ds-muted);--line:var(--ds-line);--danger:var(--ds-danger);--ok:var(--ds-success);
  --ink:var(--ds-ink);--wash:var(--ds-gray);--soft-green:var(--ds-success-soft);
  --brand:var(--ds-ink);--accent:var(--ds-action);--canvas:var(--ds-gray);
  --site-ink:var(--ds-ink);--site-green:var(--ds-action);--site-lime:var(--ds-sage);
  --site-cream:var(--ds-cream);--site-line:var(--ds-line);
  --workspace-canvas:var(--ds-gray);--workspace-surface:var(--ds-paper);--workspace-border:var(--ds-line);
  --workspace-muted:var(--ds-muted);--workspace-radius:var(--ds-radius);
  --workspace-shadow:var(--ds-shadow);--workspace-shadow-sm:var(--ds-shadow);
  --guide-navy:var(--ds-ink);--guide-green:var(--ds-action);--support-navy:var(--ds-ink);
  --platform-ink:var(--ds-ink);--platform-navy:var(--ds-ink);--platform-navy-2:#343a2d;
  --platform-green:var(--ds-action);--platform-green-dark:var(--ds-action-hover);
  --platform-soft:var(--ds-gray);--platform-mint:var(--ds-success-soft);--platform-white:var(--ds-paper);
  --platform-muted:var(--ds-muted);--platform-line:var(--ds-line);--platform-radius:var(--ds-radius);
  --platform-shadow:var(--ds-shadow);--platform-red:var(--ds-danger);--platform-red-soft:var(--ds-danger-soft);
  --platform-amber:var(--ds-warning);--platform-amber-soft:var(--ds-warning-soft);
}
#appView,#modal,#guideRoot,.oprightGuideRoot{
  --ui-ink:var(--ds-ink);--ui-green:var(--ds-action);--ui-green-dark:var(--ds-action-hover);
  --ui-canvas:var(--ds-gray);--ui-surface:var(--ds-paper);--ui-surface-soft:var(--ds-cream);
  --ui-border:var(--ds-line);--ui-muted:var(--ds-muted);--ui-radius:var(--ds-radius);
  --ui-radius-sm:var(--ds-radius-sm);--ui-shadow:var(--ds-shadow);--ui-shadow-strong:var(--ds-shadow-raised);
}
html,body{background:var(--ds-gray);color:var(--ds-ink);-webkit-font-smoothing:antialiased}
body,#appView,#modal,#guideRoot,.platformBody,.clientBody{font-family:var(--ds-font-body)!important;font-size:16px;line-height:1.5}
button,input,select,textarea{font-family:var(--ds-font-body)!important}
h1,h2,h3,h4,h5,h6,[role=heading],.workspaceLoadingName,.pricingPlanName,
.workspaceDesktopBrand>span,.marketingBrand>span,.legalBrand>span,.platformBrand strong,.site-header .brand>span,.footer .brand>span{
  font-family:var(--ds-font-heading)!important;font-weight:400!important;font-style:normal!important;
  letter-spacing:.01em!important;line-height:1.35!important;font-synthesis:none;
}
h1,h2,h3,h4,h5,h6{overflow-wrap:anywhere;text-wrap:balance}
.workspaceLoadingName,.oprightWordmark,.workspaceDesktopBrand>span,.marketingBrand>span,.legalBrand>span,.platformBrand strong,.site-header .brand>span,.footer .brand>span{font-family:var(--ds-font-wordmark)!important;font-weight:400!important;font-style:normal!important;font-synthesis:none;text-transform:uppercase!important;letter-spacing:.08em!important}
/* Formal workspace and policy surfaces use the standard reading font. */
:is(#settings,.legalLayout,#contactSupportPanel,#legalPrivacyPanel,#requiredLegalConsent,.privacyChoicesForm),
body:has(#settings.view.active) :is(#sheet,#workspaceLeaveDialog),
:is([data-platform-panel="support"],[data-platform-panel="privacy"]){--ds-font-heading:var(--ds-font-body)}
:is(#settings,.legalLayout,#contactSupportPanel,#legalPrivacyPanel,#requiredLegalConsent,.privacyChoicesForm) :is(h1,h2,h3,h4,h5,h6,[role=heading],.settingsHubCopy strong),
body:has(#settings.view.active) :is(#sheet,#workspaceLeaveDialog) :is(h1,h2,h3,h4,h5,h6,[role=heading]),
:is([data-platform-panel="support"],[data-platform-panel="privacy"]) :is(h1,h2,h3,h4,h5,h6,[role=heading]),
body:has(:is([data-platform-panel="support"],[data-platform-panel="privacy"]).active) #platformPageTitle{
  font-family:var(--ds-font-body)!important;font-weight:600!important;letter-spacing:0!important;
}
body{letter-spacing:.005em}
/* Shared containment keeps long names, errors, and translated text readable. */
[hidden]:not([hidden="until-found"]){display:none!important}
:is(main,section,article,form,label,fieldset){min-width:0}
:is(input,select,textarea){max-width:100%;scroll-margin-block:96px}
:is(.error,.notice,.hint,.clientAlert,.contactStatus){overflow-wrap:anywhere}
:is(button,.primary,.secondary,.clientButton,.clientSecondary){touch-action:manipulation}
:is(button,.primary,.secondary,.clientButton,.clientSecondary):disabled{opacity:.65}
:is(.card,.workCard,.clientRecord,.platformTable) :is(strong,small,span){overflow-wrap:anywhere}
:is(.right,.clientTotals,.platformMetric,.workMetric,.homeMetric){font-variant-numeric:tabular-nums}
.brandTagline{font-family:var(--ds-font-body);font-weight:400;letter-spacing:.22em;text-transform:uppercase}
strong,b{font-weight:700}
p{line-height:1.6}
:is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--ds-action)!important;outline-offset:3px}
::selection{background:var(--ds-sage);color:var(--ds-ink)}
:is(input,textarea,select){accent-color:var(--ds-action)}
:is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]){
  font-size:16px!important;line-height:1.5;min-height:48px;border:1px solid var(--ds-input-line);
  border-radius:var(--ds-radius-sm);background:var(--ds-paper);color:var(--ds-ink);box-shadow:none;
}
input::placeholder,textarea::placeholder{color:var(--ds-muted);opacity:1}
input,textarea,select{font-weight:400!important}
#appView :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),#sheet :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]){border-color:var(--ds-input-line)!important}
:is(.form,.panel,.authbox,.clientPanel,.platformForm) label{font-size:14px!important;font-weight:600;line-height:1.5}
:is(.hint,.error,.notice,.clientHint){font-size:14px!important;line-height:1.55}
:is(.primary,.secondary,.success,.danger,.marketingButton,.platformButton,.pricingCta,.clientButton,.clientSecondary){
  min-height:44px;border-radius:999px!important;padding:11px 20px;font-size:16px;font-weight:600;
  letter-spacing:0;line-height:1.35;box-shadow:none!important;
  transition:background-color 140ms ease,border-color 140ms ease;
}
:is(.primary,.marketingButton,.pricingCta,.platformButtonPrimary,.clientButton,.workspaceLeaveSave,.guideSend,.oprightGuideSend){
  background:var(--ds-action)!important;color:var(--ds-cream)!important;border-color:var(--ds-action)!important;
}
:is(.primary,.marketingButton,.pricingCta,.platformButtonPrimary,.clientButton,.workspaceLeaveSave):not(:disabled):hover{
  background:var(--ds-action-hover)!important;color:var(--ds-cream)!important;
}
:is(.secondary,.platformButtonSecondary,.clientSecondary){background:var(--ds-beige)!important;color:var(--ds-ink)!important;border-color:var(--ds-line)!important}
:is(.secondary,.platformButtonSecondary,.clientSecondary):not(:disabled):hover{background:#dcd5c8!important}
:is(.success){background:var(--ds-success-soft)!important;color:var(--ds-success)!important}
:is(.danger,.platformButtonDanger){background:var(--ds-danger-soft)!important;color:var(--ds-danger)!important}
:is(button,a):not(:disabled):hover{opacity:1;filter:none;transform:none}
button:disabled{cursor:not-allowed}
#appView :is(button.primary,button.secondary,button.success,button.danger),#sheet :is(button.primary,button.secondary,button.danger,button.success){font-size:16px!important;font-weight:600!important;min-height:44px}
button[aria-busy=true]{cursor:wait}
:is(.link,.marketingTextLink,.clientFooter a){color:var(--ds-action)!important}
:is(.paid,.notice){color:var(--ds-success)!important}
:is(.unpaid,.error){color:var(--ds-danger)!important}
/* Shapes and opaque surfaces shared by late-mounted feature modules. */
#appView :is(.panel,.card,.stat,.form,.settingsHubCard,.workCard,.homeRouteCard,.homeQuietCard,
.migrationSourceCard,.migrationFileCard,.migrationMapping,.migrationReview,.migrationHistorySection),
:is(.platformCard,.platformMetric,.platformTableCard,.clientPanel,.clientCard,.clientShell,.legalArticle,.trustCard){
  background:var(--ds-paper);border-color:var(--ds-line)!important;border-radius:var(--ds-radius)!important;box-shadow:var(--ds-shadow)!important;
}
#appView :is(.panel,.form){padding:24px;gap:16px}
#appView :is(.cards){gap:12px}
#appView .card{padding:20px;align-items:center}
#appView .card strong{font-size:17px;line-height:1.4}
#appView .card{gap:16px;text-align:left;flex-wrap:wrap}
#appView .card>div:first-child{min-width:0;flex:1 1 140px}
#appView .card .right{flex:0 1 auto;min-width:min-content;max-width:100%;margin-left:auto}
#appView .card .right>strong{white-space:nowrap}
#appView .card :is(strong,span){white-space:normal;overflow-wrap:anywhere}
#appView button.card:hover{background:var(--ds-cream);border-color:var(--ds-input-line)!important}
#appView .invoiceCard .right>span{display:inline-block;margin-top:6px;padding:4px 10px;border-radius:999px;background:var(--ds-beige);color:var(--ds-muted)!important;font-size:12px!important;font-weight:600}
#appView .invoiceCard[data-payment-tone="good"] .right>span{background:var(--ds-success-soft);color:var(--ds-success)!important}
#appView .invoiceCard[data-payment-tone="waiting"] .right>span{background:var(--ds-warning-soft);color:var(--ds-warning)!important}
#appView .invoiceCard[data-payment-tone="alert"] .right>span{background:var(--ds-danger-soft);color:var(--ds-danger)!important}
#appView .invoiceDateHeading{padding:12px 4px 0;font-size:14px;font-weight:600;color:var(--ds-muted)}
.error:empty,.notice:empty{display:none}
.workspaceEmpty{display:grid;justify-items:start;gap:12px;padding:32px;border:1px dashed var(--ds-line);border-radius:var(--ds-radius);background:var(--ds-cream)}
.workspaceEmpty>strong{font-size:18px;font-weight:600}
.workspaceEmpty>p{margin:0;color:var(--ds-muted);max-width:52ch}
.workPageHeader{margin:0 0 24px}
.workPageHeader h1{margin:0;font-size:36px}
.workPageHeader p{max-width:65ch;margin:12px 0 0;color:var(--ds-muted)}
#appView .workNav{gap:8px;scroll-padding:4px}
#appView .workNav button{min-height:44px;font-size:14px;flex-shrink:0}
:is(.workPill,.clientPill){background:var(--ds-beige);color:var(--ds-muted);font-weight:600}
:is(.workPill,.clientPill).good{background:var(--ds-success-soft);color:var(--ds-success)}
:is(.workPill,.clientPill).waiting{background:var(--ds-warning-soft);color:var(--ds-warning)}
:is(.workPill,.clientPill).alert{background:var(--ds-danger-soft);color:var(--ds-danger)}
#appView :is(.card span,.homeMetric>span,.settingsHubCard p){font-size:14px!important;line-height:1.5}
#appView :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,
.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero),.platformHero,.clientHero,.legalArticleHeader{
  background:var(--ds-ink)!important;color:var(--ds-cream);border:0!important;border-radius:var(--ds-radius)!important;box-shadow:none!important;
}
#appView :is(.hero,.settingsHubIntro,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.helpHero,.supportHero) h1,
#appView :is(.hero,.settingsHubIntro,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.helpHero,.supportHero) h2,
.platformHero h1,.clientHero h1,.legalArticleHeader h1{color:var(--ds-cream)!important}
#appView :is(.hero,.settingsHubIntro,.paymentOverview,.migrationHero,.helpHero,.supportHero)>p,
.platformHero p,.clientHero p,.legalArticleHeader p{color:var(--ds-beige)!important}
#appView :is(.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.settingsHubIntro,.helpHero,.supportHero)::before,
#appView :is(.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.settingsHubIntro,.helpHero,.supportHero)::after,
.clientHero::after,.platformHero::after{content:none!important}
/* Workspace shell: cream navigation, quiet canvas, charcoal selection. */
body:has(#appView:not(.hidden)){background:var(--ds-gray)}
#appView .top{background:var(--ds-cream)!important;color:var(--ds-ink);border:0;box-shadow:none;backdrop-filter:none}
#appView .workspaceBrand,#appView .workspaceBrandCopy>strong{color:var(--ds-ink)!important}
#appView .workspaceBrandCopy>strong{font-size:18px;line-height:1.4;letter-spacing:0}
#appView .workspaceHeaderButton{background:var(--ds-paper)!important;color:var(--ds-ink)!important;border:1px solid var(--ds-line);border-radius:50%;width:44px;height:44px;box-shadow:none}
#appView .tabs{background:var(--ds-cream)!important;border-color:var(--ds-line);backdrop-filter:none;box-shadow:none}
#appView .tabs button:not(.hidden){color:var(--ds-muted)!important;border-radius:999px;box-shadow:none;font-weight:600}
#appView .tabs button.active{background:var(--ds-ink)!important;color:var(--ds-cream)!important;box-shadow:none!important}
#appView .tabs button:not(.hidden):not(.active):hover{background:var(--ds-beige)!important;color:var(--ds-ink)!important}
#appView .tabs button>span{font-family:var(--ds-font-body);letter-spacing:0}
#appView .workspaceDesktopBrand{color:var(--ds-ink);text-transform:none;letter-spacing:0}
#appView main{max-width:1280px;padding-top:28px}
#appView .section{margin-block:24px 16px;gap:16px;flex-wrap:wrap}
#appView .section h1,#appView #home .homeTitleCopy h1{font-size:36px}
#appView .section h2{font-size:26px}
#appView #home .homePageHeader{margin:0 0 24px}
#appView #home .homeDateBadge{background:var(--ds-beige);color:var(--ds-ink);border:0;border-radius:999px;font-size:14px;padding:10px 16px}
#appView #home .homeCommandDeck{padding:28px;margin:0;display:flex;flex-direction:column;justify-content:space-between;min-height:208px}
#appView #home .homeCommandTop{align-items:flex-start;gap:16px}
#appView #home .homeCommandCopy h1{font-size:28px;line-height:1.3!important}
#appView #home .homeHeroActions{margin-top:28px;gap:12px;flex-wrap:wrap}
#appView #home .homeNewJob{background:var(--ds-sage)!important;color:var(--ds-ink)!important;border:0!important;font-size:16px!important;min-height:44px}
#appView #home .homeHeroSchedule{color:var(--ds-cream)!important;font-size:16px;min-height:44px;background:none;border:1px solid #7f8971;border-radius:999px;padding:10px 18px}
#appView #home .homeDayStatus{color:var(--ds-cream);background:#424a37;font-size:12px;border:0}
#appView #home .homeMetrics{margin:0;padding:12px;background:var(--ds-cream);border-radius:var(--ds-radius);gap:0;align-content:center;grid-template-columns:repeat(3,minmax(0,1fr))}
#appView #home .homeMetric{padding:24px 16px!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;min-height:0}
#appView #home .homeMetric+.homeMetric{border-left:1px solid var(--ds-line)!important}
#appView #home .homeMetric b{font-family:var(--ds-font-body);font-size:clamp(24px,2.5vw,32px);font-weight:600;color:var(--ds-ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;line-height:1.4!important;text-overflow:clip!important;max-width:100%;overflow-wrap:normal}
#appView #home .homeMetricIcon{display:none}
#appView #home .homeRoutePanel{margin:0;padding:24px}
#appView #home .homeRouteHead{margin-bottom:20px;gap:16px}
#appView #home .homeRouteHeading h2{font-size:26px}
#appView #home .homeRouteSummary{font-size:14px;color:var(--ds-muted)}
#appView #home .homeRouteBadge{background:var(--ds-beige);color:var(--ds-ink);font-size:14px;border:0}
#appView #home .homeRouteCanvas{border-radius:18px;background:var(--ds-gray)}
#appView #home .homeRoutePanel.is-empty #homeRouteCanvas{background:var(--ds-cream);border:1px dashed var(--ds-line);border-radius:18px}
#appView #home #homeRouteCanvas .homeQuietState{padding:28px 20px;min-height:180px}
#appView #home #homeRouteCanvas .homeQuietIcon{background:var(--ds-beige);color:var(--ds-action)}
#appView #home #homeRouteCanvas .homeQuietState h3{color:var(--ds-ink)}
#appView #home .homeRouteList{gap:12px}
#appView #home .homeRouteCard{border-radius:16px!important;box-shadow:none!important;background:var(--ds-cream)}
#appView #home .homeRecentHeader{margin:0;display:flex!important;align-items:center;justify-content:space-between;flex-wrap:wrap}
#appView #home .homeRecentHeader>div:first-child{flex:1 1 140px!important}
#appView #home .homeRecentTools{width:auto!important;max-width:100%;flex:0 1 auto!important;flex-wrap:wrap;justify-content:flex-end}
#appView #home #homeScope:empty{display:none}
#appView #home :is(.homeTitleCopy>span,.homeSectionEyebrow,.homeRouteEyebrow,.homeQuietEyebrow){display:none}
#appView #home #goInvoices{font-size:14px;min-height:44px;border-radius:999px;padding:8px 16px;background:var(--ds-beige)}
#appView :is(.settingsHubSectionTitle,.analyticsEyebrow){font-size:14px;letter-spacing:0;font-weight:600}
#appView .settingsHubCard{padding:20px;min-height:112px}
#appView .settingsHubCopy strong{font-family:var(--ds-font-heading);font-size:18px;font-weight:400;line-height:1.35;letter-spacing:0}
#appView .settingsHubCard .settingsHubIcon{display:none}
#appView #settingsHub .settingsHubCard{display:grid;grid-template-columns:24px minmax(0,1fr) 14px;gap:12px;align-items:center}
#appView #settingsHub .settingsHubCard .settingsHubIcon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:transparent;border:0;border-radius:0;color:var(--ds-action)}
#appView #settingsHub .settingsHubIcon svg{display:block;width:24px;height:24px;flex:none}
#appView #settingsHub .settingsHubCategoryGrid{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
@media(max-width:600px){#appView #settingsHub .settingsHubCategoryGrid{grid-template-columns:minmax(0,1fr)}#appView #settingsHub .settingsHubCard{grid-template-columns:24px minmax(0,1fr);min-height:64px;padding:16px}#appView #settingsHub .settingsHubCopy strong{font-size:16px}}
#appView .settingsHubIntro{padding:24px}
#appView :is(.settingsHubEyebrow,.paymentEyebrow,.plannerEyebrow,.scheduleEyebrow){display:none}
#appView .settingsHubGrid{gap:16px}
#appView :is(.settingsHubHelpCard,.statsTileFeatured){background:var(--ds-beige)!important}
#appView :is(.stat b,.statsTile b,.analyticsMetric strong,.paymentMetric strong),.platformMetric strong{font-variant-numeric:tabular-nums}
/* Forms, sheets, customer documents, and save controls. */
.sheet,.authbox,.workspaceLeaveCard{background:var(--ds-paper);border:1px solid var(--ds-line);border-radius:24px!important;box-shadow:var(--ds-shadow-raised)}
#sheet{padding:24px}
#sheet .modalhead{gap:16px;align-items:flex-start}
#sheet .modalhead h2{font-size:28px;padding-right:8px}
:is(.close,.signInClose,.workspaceLeaveKeep){background:var(--ds-beige);color:var(--ds-ink)}
.close{min-width:44px;min-height:44px;flex-shrink:0}
#sheet .form{padding:20px;border-radius:20px}
#sheet :is(label,.hint,.card span){font-size:14px!important}
.workspaceUnsavedBar{background:var(--ds-ink)!important;color:var(--ds-cream);border:1px solid #5c6255;border-radius:20px;box-shadow:var(--ds-shadow-raised)}
.workspaceUnsavedBar button{background:var(--ds-sage)!important;color:var(--ds-ink)!important;border-radius:999px;font-size:16px}
.workspaceUnsavedBar span{color:var(--ds-beige)!important}
.workspaceLeaveCard h2{font-size:28px}
.workspaceLeaveActions button{min-height:48px;border-radius:999px}
.workspaceLoadingCard{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.workspaceLoadingScreen{background:var(--ds-cream)!important;color:var(--ds-ink);backdrop-filter:none}
.workspaceLoadingScreen.is-skeleton{background:var(--ds-gray)!important}
.workspaceLoadingMessage{color:var(--ds-muted)!important;font-size:14px}
.workspaceLoadingRetry{background:var(--ds-action);color:var(--ds-cream);border-radius:999px;font-size:16px}
.guideOrb,.guideOrb canvas{background:transparent!important}
.oprightGuideLauncher,.guideLauncher{background:var(--ds-ink)!important;color:var(--ds-cream);box-shadow:var(--ds-shadow-raised)!important}
.guidePanel,.oprightGuidePanel{background:var(--ds-paper);border-color:var(--ds-line);border-radius:24px}
.guideHeader,.oprightGuideHeader{background:var(--ds-cream);color:var(--ds-ink)}
/* Public website follows the same materials and type, with a wider reading rhythm. */
body:has(#appView.hidden),.marketingSite{background:var(--ds-cream)!important;color:var(--ds-ink)}
.marketingNav{background:var(--ds-cream)!important;border-bottom:1px solid var(--ds-line);color:var(--ds-ink);backdrop-filter:none;box-shadow:none}
.marketingBrand,.marketingBrand span{color:var(--ds-ink)!important;text-transform:none;letter-spacing:0}
.marketingBrand span{font-size:22px}
.marketingLinks a,.marketingSignIn,.marketingActions .marketingSignIn{color:var(--ds-ink)!important}
.marketingLinks a:hover,.marketingTextLink:hover{color:var(--ds-action-hover)!important;text-decoration:underline}
.marketingActions .marketingSignIn{background:var(--ds-beige);border:0;border-radius:999px;padding:12px 20px;font-size:16px}
.marketingHero{background:var(--ds-cream)!important;color:var(--ds-ink);gap:56px;padding-block:72px}
.marketingHero h1{font-size:clamp(38px,5vw,64px);color:var(--ds-ink)!important;line-height:1.15!important}
.marketingHeroCopy>p,.marketingExistingCustomer,.marketingProof{color:var(--ds-muted)!important}
.marketingHeroCopy>p{font-size:18px;max-width:520px}
.marketingHeroCopy>.marketingTrialNote,.marketingHeroCopy>.marketingExistingCustomer{font-size:14px!important}
.showcaseWindow{background:var(--ds-paper)!important;color:var(--ds-ink);border:0;border-radius:28px;box-shadow:var(--ds-shadow-raised)}
.showcaseChrome{background:var(--ds-beige)!important;color:var(--ds-ink)!important;border:0;padding:20px 24px}
.showcaseChrome>b{font-size:14px;font-weight:600;color:var(--ds-ink)}
.showcaseChrome>span.showcaseExample:nth-child(2){color:var(--ds-muted)}
.showcaseSection>span:first-child,.showcaseSection>span:last-child{color:var(--ds-muted)}
.showcaseExample{color:var(--ds-muted)}
.showcaseContent{padding:24px}
.showcaseHeader h2,.showcaseMetrics strong,.showcaseJob strong,.showcaseJob>b{color:var(--ds-ink)!important}
.showcaseHeader h2{font-size:26px}
.showcaseChip{background:var(--ds-beige)!important;color:var(--ds-ink)!important;border:0}
.showcaseMetrics{background:var(--ds-sage);border:0;border-radius:18px;padding:20px;margin-block:20px}
.showcaseMetrics span,.showcaseSection,.showcaseJob small,.showcaseTime{color:var(--ds-muted)!important}
.showcaseMetrics span{color:var(--ds-ink)!important}
.showcaseMetrics strong{font-size:32px;font-weight:600}
.showcaseJob{border-color:var(--ds-line)}
.showcaseCaption{color:var(--ds-muted);font-size:14px}
.tradeStrip{background:var(--ds-beige);border-color:var(--ds-line)}
.tradeStrip>div>span,.tradeStrip>span{color:var(--ds-ink)}
.featureSection,.pricingSection,.faqSection{background:var(--ds-cream);color:var(--ds-ink)}
.sectionIntro h2,.industrySection .sectionIntro h2,.closingSection h2{color:var(--ds-ink);font-size:clamp(30px,3.4vw,42px)}
.sectionIntro>p,.featureCard p,.industrySection .sectionIntro>p{color:var(--ds-muted)}
.featureGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;border:0}
.featureCard{display:block;padding:28px;background:var(--ds-paper);border:0;border-radius:24px;box-shadow:none}
.featureCategory{display:block;font-size:14px;color:var(--ds-muted);margin-bottom:12px}
.featureCard h3{color:var(--ds-ink);font-size:24px}
.industrySection{background:var(--ds-gray);color:var(--ds-ink)}
.industryPills>a{color:var(--ds-ink);border-color:var(--ds-line)}
.billingToggle{background:var(--ds-beige);border:0;border-radius:999px;padding:5px}
.billingToggle>button{border-radius:999px;font-size:16px}
.billingToggle>button.active{background:var(--ds-ink);color:var(--ds-cream)}
.pricingGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;border:0;overflow:visible;background:none;border-radius:0}
.pricingCard,.pricingCard.featured{background:var(--ds-paper);border:0!important;border-radius:24px;padding:28px 24px;box-shadow:var(--ds-shadow)}
.pricingCard.featured{background:var(--ds-beige)}
.pricingPlanName,.pricingAmount>b{color:var(--ds-ink)}
.pricingPlanName{font-size:26px}
.pricingPlanSummary,.pricingBilled,.pricingAmount>span,.pricingFeatureList>li,.pricingFootnote{color:var(--ds-muted)}
.pricingAmount>b{font-size:40px;font-family:var(--ds-font-body);font-variant-numeric:tabular-nums}
.pricingFeatureList{gap:12px}
.installSection{background:var(--ds-ink)!important;color:var(--ds-cream)}
.installSection .sectionIntro h2{color:var(--ds-cream)}
.installDeviceTabs>button{background:none;color:var(--ds-cream);border:1px solid var(--ds-sage);border-radius:999px;font-size:16px}
.installDeviceTabs>button.active{background:var(--ds-sage);color:var(--ds-ink);border-color:var(--ds-sage)}
.installStep{border-color:#5c6255}
.faqCard{background:none;border-color:var(--ds-line)}
.faqCard summary{color:var(--ds-ink)}
.faqCard p{color:var(--ds-muted)}
.closingSection{background:var(--ds-beige)!important;color:var(--ds-ink)}
.closingSection p{color:var(--ds-muted)}
.marketingFooter{background:var(--ds-cream)!important;color:var(--ds-muted);border-color:var(--ds-line)}
.marketingFooter a,.marketingFooter .marketingBrand{color:var(--ds-ink)!important}
.marketingSite .signInSection:not([hidden]){background:var(--ds-gray)!important}
.signInPitch{background:var(--ds-sage)!important;color:var(--ds-ink);border-radius:24px;padding:32px}
.signInPitch h2,.signInPitch p{color:var(--ds-ink)!important}
.signInSection .authbox{border-radius:24px!important;background:var(--ds-paper);box-shadow:none}
.authboxHeading h1{font-size:30px}
.signInClose{background:var(--ds-beige)!important;color:var(--ds-ink)!important;border-radius:50%}
.publicMenu>summary{border-radius:999px;background:var(--ds-paper);color:var(--ds-ink);border-color:var(--ds-input-line)}
.publicMenu>nav{background:var(--ds-paper);border-radius:20px;border-color:var(--ds-line);box-shadow:var(--ds-shadow-raised)}
.publicMenu>nav>a{color:var(--ds-ink);border-radius:12px}
.publicMenu>nav>a:hover{background:var(--ds-beige)}
/* Platform suites, SEO pages, and legal/customer surfaces. */
.platformBody,.platformGate{background:var(--ds-gray)!important}
.platformGateCard{background:var(--ds-cream);border-radius:28px;padding:40px}
.platformSidebar{background:var(--ds-cream)!important;color:var(--ds-ink);border:0;box-shadow:none}
.platformBrand strong,.platformBrand small,.platformNavLabel{color:var(--ds-ink)}
.platformNav button{color:var(--ds-muted);border-radius:999px;font-weight:600}
.platformNav button.active{background:var(--ds-ink)!important;color:var(--ds-cream);box-shadow:none}
.platformNav button:not(.active):hover{background:var(--ds-beige)}
.platformTopbar{background:var(--ds-gray);border-color:var(--ds-line);box-shadow:none}
.platformHero{padding:28px}
.platformHero h1{font-size:36px}
.platformEyebrow{display:none}
.platformMetric{background:var(--ds-cream);padding:24px}
.platformTableCard{overflow-x:auto}
:is(.platformTable,table) th{font-family:var(--ds-font-body);font-size:14px;font-weight:600;letter-spacing:0}
.platformTable th{background:var(--ds-beige);color:var(--ds-ink)}
.platformTable td{font-size:14px;border-color:var(--ds-line)}
.platformModalCard{background:var(--ds-paper);border-radius:24px;box-shadow:var(--ds-shadow-raised)}
.legalTopbar{background:var(--ds-cream)!important;color:var(--ds-ink);border-color:var(--ds-line)}
.legalBrand,.legalTopbar nav a,.legalTopbar nav a:hover,.legalTopbar nav a:focus{color:var(--ds-ink)}
.legalSidebar p{color:var(--ds-muted);font-size:16px}
.legalArticleHeader>div{color:var(--ds-beige)}
.legalSidebar>div{background:var(--ds-cream)!important;color:var(--ds-ink);border-radius:24px}
.legalSidebar a,.legalSidebarEyebrow{color:var(--ds-ink)}
.legalSidebar a.active{background:var(--ds-beige);color:var(--ds-ink)}
.legalArticleBody{color:var(--ds-ink)}
.legalArticleBody a,.legalArticleFooter a{color:var(--ds-action)}
.legalArticleFooter{background:var(--ds-cream);border-color:var(--ds-line);color:var(--ds-muted)}
.clientHero{background:var(--ds-ink);border-radius:24px}
.clientPanel h2{font-size:26px}
.clientEyebrow{display:none}
.clientSummary article{background:var(--ds-cream);border:0;border-radius:20px}
.clientSignatureField canvas{background:var(--ds-paper);border-color:var(--ds-input-line)}
.clientPackage{background:var(--ds-cream);border-color:var(--ds-line);border-radius:20px;box-shadow:none}
.clientPackage.selected{background:var(--ds-beige);border-color:var(--ds-action);box-shadow:inset 0 0 0 1px var(--ds-action)}
.clientPackage:focus-within{outline:3px solid var(--ds-action);outline-offset:3px}
.clientBrandMark{flex-shrink:0;background:var(--ds-beige);color:var(--ds-action)}
.clientBrand>span:last-child{min-width:0;overflow-wrap:anywhere}
.clientRecord>div:first-child,.clientLine>div:first-child{min-width:0;flex:1}
.clientRecordAside{flex:0 1 45%;min-width:0}
.clientRecordAside :is(strong,span,a){overflow-wrap:anywhere}
.clientActions :is(button,a){white-space:normal;text-align:center}
.clientSignatureClear{min-height:44px;padding:8px 12px;font-size:14px}
.clientTotalRow{gap:16px;font-variant-numeric:tabular-nums}
.clientTotalRow>span:last-child{white-space:nowrap}
.clientAlert.error{background:var(--ds-danger-soft);color:var(--ds-danger)}
.clientLoading span{animation:none;background:var(--ds-beige);border:0;border-radius:10px;width:100%;max-width:320px;height:72px}
/* Shared logo fitting does not crop company artwork. */
:is(.marketingBrand,.workspaceBrand,.workspaceDesktopBrand,.legalBrand,.platformBrand)>img,
.workspaceLoadingBrand img,.authboxHeading>img{object-fit:contain;object-position:center;box-sizing:border-box;padding:4px;border-radius:12px;background:var(--ds-ink);box-shadow:none}
#appView .workspaceBrand>img,#brandLogoPreview,#sheet .invoicehead img{background:var(--ds-paper);object-fit:contain}
@media(min-width:1060px){
  #appView{padding-left:0!important}
  #appView .tabs{position:fixed;top:20px;bottom:20px;left:20px;right:auto;width:216px;height:auto;max-height:calc(100dvh - 40px);padding:24px 16px;border:0;border-radius:28px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;overscroll-behavior:contain}
  #appView .workspaceDesktopBrand{position:static;inset:auto;display:flex;align-items:center;gap:10px;margin:0 0 24px;padding:0 4px;flex-shrink:0}
  #appView .workspaceDesktopBrand img{width:40px;height:40px;max-width:40px}
  #appView .workspaceDesktopBrand>span{font-size:18px!important}
  #appView .tabs button:not(.hidden){display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;max-width:none;min-height:48px;flex:0 0 auto;padding:12px 16px}
  #appView .tabs button>span{font-size:16px!important;margin:0}
  #appView .tabs button[data-view=settings]{margin-top:auto}
  #appView .top{margin-left:256px;width:calc(100% - 276px);height:88px;padding:20px 20px;background:var(--ds-gray)!important}
  #appView>.downgradeTestBanner,#appView>.subscriptionReadOnlyBanner{margin:0 40px 24px 276px}
  #appView main{width:calc(100% - 276px);max-width:1440px;margin:0 20px 0 256px;padding:12px 20px 48px}
  #appView #home.active{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px}
  #appView #home>:not(.homeCommandDeck):not(.homeMetrics){grid-column:1/-1}
  #appView #home .homePageHeader{margin:0}
  #appView #home .homeCommandDeck,#appView #home .homeMetrics{height:100%}
  .platformSidebar{top:20px;bottom:20px;left:20px;height:calc(100dvh - 40px);border-radius:28px}
}
@media(max-width:1059px){
  #appView main{padding:24px 20px calc(112px + env(safe-area-inset-bottom,0px));width:100%}
  #appView #home .homeCommandDeck{margin-bottom:16px;min-height:180px;padding:24px}
  #appView #home .homeMetrics{margin-bottom:16px}
  #appView #home .homeRoutePanel{margin-bottom:24px}
  #appView #home .homeRecentHeader{margin-bottom:16px}
  #appView .tabs button.active{border-radius:16px}
  #appView .tabs button:not(.hidden){padding-inline:2px!important}
  #appView .tabs button>span{font-weight:600!important;white-space:normal!important;overflow-wrap:anywhere;overflow:visible!important;text-overflow:clip!important;max-width:100%!important}
  .platformSidebar{border-radius:0}
  .pricingGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  #appView .top{padding-inline:16px;gap:12px}
  #appView .workspaceBrandCopy>strong{font-size:16px;max-width:42vw;white-space:normal;line-height:1.25}
  #appView .workspaceHeaderActions{gap:6px}
  #appView main{padding-inline:16px}
  #appView .section h1,#appView #home .homeTitleCopy h1{font-size:30px}
  #appView #home .homeCommandCopy h1{font-size:26px}
  #appView #home .homeCommandDeck{padding:20px}
  #appView #home .homeMetric{padding:20px 12px!important}
  #appView #home .homeMetric b{font-size:30px}
  #appView #home .homeMetric>span{font-size:14px!important}
  #appView #home .homeMetrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  #appView #home .homeMetric:last-child{grid-column:1/-1;border-left:0!important;border-top:1px solid var(--ds-line)!important;padding-block:16px!important}
  #appView #home .homeRoutePanel,#appView :is(.panel,.form){padding:20px}
  #appView .card{padding:16px;border-radius:20px!important}
  #appView .tabs button>span{font-size:12px!important}
  #sheet{padding:20px 16px max(24px,env(safe-area-inset-bottom,0px));border-radius:24px 24px 0 0!important}
  #sheet .modalhead h2{font-size:26px}
  .marketingNav{padding-inline:16px;gap:10px}
  .marketingBrand span{font-size:23px}
  .marketingHero{padding:40px 20px;gap:32px}
  .marketingHero h1{font-size:38px}
  .marketingHeroCopy>p{font-size:17px}
  .marketingSection{padding:48px 20px}
  .featureGrid,.pricingGrid{grid-template-columns:1fr}
  .featureCard,.pricingCard{padding:24px}
  .industryInner{padding:48px 20px;gap:28px}
  .showcaseChrome{padding:16px 20px;gap:12px;flex-wrap:wrap}
  .showcaseContent{padding:20px}
  .showcaseHeader h2{font-size:24px}
  .pricingPlanSummary,.pricingBilled{min-height:0}
  .signInPitch{padding:24px}
  .platformHero h1{font-size:30px}
  .platformGateCard{padding:28px 24px}
  .clientPanel,.clientHero{padding:24px 20px}
}
@media(max-width:360px){
  #appView #home .homePageHeader{flex-direction:column;align-items:flex-start;gap:12px}
  #appView #home .homeTitleCopy{width:100%}
  #appView .tabs{display:grid!important;grid-template-columns:44px 58px 44px 54px minmax(68px,1fr) 44px!important;gap:0!important;padding-inline:4px!important;overflow-x:auto;scrollbar-width:none}
  #appView #home .homeMetrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  #appView #home .homeMetric:last-child{grid-column:1/-1;border-left:0!important;border-top:1px solid var(--ds-line)!important}
  #appView .workspaceBrandCopy>strong{max-width:calc(100vw - 146px);font-weight:600}
  #appView .workspaceHeaderButton{width:40px;min-width:40px}
  .showcaseJob{grid-template-columns:42px minmax(0,1fr) 48px;gap:8px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{
  html,body,#sheet,.sheet,.invoice,.clientPanel{background:#fff!important;color:#252821!important;box-shadow:none!important}
  h1,h2,h3{break-after:avoid}
  .invoice,.clientPanel{border-radius:0!important}
}

/* Home map: broad map surface, floating controls, and a scrollable visit rail. */
#appView #home #homeRoutePanel{padding:0!important;margin:0 0 24px;border:0;overflow:hidden;background:var(--ds-cream);box-shadow:none}
#appView #home .homeRouteMapStage{position:relative;isolation:isolate;min-width:0}
#appView #home #homeRouteCanvas{position:relative;top:auto;display:block;width:100%;height:520px;min-height:520px;max-height:none;border:0;border-radius:24px 24px 0 0;background:var(--ds-gray)}
#appView #home #homeRoutePanel .homeRouteHead{position:absolute;z-index:2;inset:20px 20px auto;display:flex;align-items:center;gap:16px;margin:0;padding:20px 24px;background:var(--ds-paper);border:1px solid var(--ds-line);border-radius:20px;box-shadow:var(--ds-shadow-raised)}
#appView #home #homeRoutePanel .homeRouteHeading h2{margin:0;font-size:24px}
#appView #home #homeRoutePanel .homeRouteSummary{margin:8px 0 0;font-size:14px}
#appView #home .homeRouteMapActions{position:absolute;z-index:2;inset:auto 20px 40px;display:flex;justify-content:space-between;gap:8px;pointer-events:none}
#appView #home .homeRouteMapActions button{pointer-events:auto;min-height:44px;padding:12px 18px!important;font-size:14px;font-weight:600;background:var(--ds-paper)!important;color:var(--ds-ink)!important;border:1px solid var(--ds-line);border-radius:999px;box-shadow:var(--ds-shadow)}
#appView #home .homeRouteMapActions button:disabled{color:var(--ds-muted)!important}
#appView #home .homeRouteLocationStatus{position:absolute;z-index:2;inset:auto 20px 96px;margin:0;padding:12px;background:var(--ds-paper);border-radius:12px;font-size:14px}
#appView #home #homeRouteCanvas .leaflet-top.leaflet-right{top:150px}
#appView #home #homeRouteCanvas .leaflet-tile-pane{filter:saturate(.35)}
#appView #home #homeRouteCanvas .leaflet-control-attribution{font-size:11px;background:var(--ds-paper);color:var(--ds-ink)}
#appView #home #homeRoutePanel .homeRouteStops{display:block;padding:20px;min-width:0}
#appView #home #homeRoutePanel .homeRouteStopsHead{margin:0 0 12px}
#appView #home #homeRoutePanel .homeRouteStopsHead h3{margin:0;font-size:18px}
#appView #home #homeRouteList{display:flex;min-width:0;max-width:100%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding:0;padding:0 0 12px;align-items:start}
#appView #home #homeRouteList .homeRouteStop{flex:0 0 max(280px,calc((100% - 24px)/3));height:auto;margin:0;padding:16px;background:var(--ds-paper);border:1px solid var(--ds-line);border-radius:16px;scroll-snap-align:start;min-width:0}
#appView #home #homeRouteList .homeQuietState{flex:1 0 100%;min-height:144px;background:var(--ds-beige);border-radius:16px;padding:24px;scroll-snap-align:start}
#appView #home #homeRoutePanel.is-empty #homeRouteList{overflow-x:hidden}
#appView #home #homeRoutePanel.is-empty .homeRouteStopsHead{display:none}
#appView #home #recent .invoiceCard{padding:16px;gap:12px}
#appView #home #recent .invoiceCard strong{white-space:normal;overflow-wrap:anywhere}
#appView #home .homeTitleCopy h1,#appView #home .homeCommandCopy h1{margin:0}
@media(max-width:600px){
  #appView #home #homeRouteCanvas{height:460px;min-height:460px}
  #appView #home #homeRoutePanel .homeRouteHead{inset:12px 12px auto;padding:16px;gap:8px;align-items:flex-start;flex-wrap:wrap}
  #appView #home #homeRoutePanel .homeRouteHeading{flex:1 1 180px}
  #appView #home #homeRoutePanel .homeRouteHeading h2{font-size:20px}
  #appView #home #homeRoutePanel .homeRouteBadge{font-size:12px;padding:6px 8px}
  #appView #home .homeRouteMapActions{inset:auto 12px 32px}
  #appView #home .homeRouteMapActions button{padding:10px 12px!important;font-size:13px}
  #appView #home #homeRoutePanel .homeRouteStops{padding:16px}
  #appView #home #homeRouteList .homeRouteStop{flex-basis:92%}
  #appView #home .homeRecentTools{justify-content:flex-start;gap:8px}
}

#appView #home #homeRoutePending{min-height:520px;margin:0 0 24px}
@media(max-width:600px){#appView #home #homeRoutePending{min-height:460px}}
#appView #home #homeRouteList .routeRowActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;overflow:visible}
#appView #home #homeRouteList .routeRowActions :is(button,a){min-width:0;min-height:44px;padding:8px!important;font-size:14px!important;line-height:1.3;white-space:normal;overflow-wrap:normal;text-align:center}
#appView #home #homeRouteList .routeNextApps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#appView #home #homeRouteList .routeNextApps a{min-height:44px}

/* Shared green feature panels. Keep ink text on inset light controls. */
@media screen{
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar){background:var(--ds-panel-green)!important;color:var(--ds-panel-text)!important;--muted:var(--ds-panel-text);--workspace-muted:var(--ds-panel-text);--support-muted:var(--ds-panel-text)}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(h1,h2,h3,h4,h5,h6,p,span,strong,b,small,label,a,button,dt,dd,li){color:var(--ds-panel-text)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(input,select,textarea){color:var(--ds-ink)!important;background:var(--ds-paper)!important;color-scheme:light}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(input,textarea)::placeholder{color:var(--ds-muted)!important;opacity:1}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(.primary,.secondary,.platformButton,.clientButton,.homeNewJob,.plannerTodayButton,.plannerDayArrow,.installDeviceTabs>button,.workspaceLeaveKeep,.workspaceLeaveSave){background:var(--ds-cream)!important;color:var(--ds-ink)!important;border-color:var(--ds-cream)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(.primary,.secondary,.platformButton,.clientButton,.homeNewJob,.plannerTodayButton,.plannerDayArrow,.installDeviceTabs>button,.workspaceLeaveKeep,.workspaceLeaveSave) :is(span,strong,small){color:var(--ds-ink)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(button.active,button.is-active,button[aria-pressed="true"],button[aria-selected="true"]){background:var(--ds-cream)!important;color:var(--ds-ink)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(button.active,button.is-active,button[aria-pressed="true"],button[aria-selected="true"]) :is(span,strong,b,small){color:var(--ds-ink)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(.settingsHubRolePill,.homeDayStatus){background:var(--ds-action-hover)!important;color:var(--ds-panel-text)!important;border-color:var(--ds-cream)!important}
:is(#appView #home,#appView #calendar,#appView,#sheet,body) :is(.hero,.settingsHubIntro,.homeCommandDeck,.scheduleCommandDeck,.plannerCommandDeck,.paymentOverview,.migrationHero,.settingsHelpHero,.helpHero,.supportHero,.workHero,.quoteWorkspaceAside,.quoteReviewTotal,.quotePresentationIntro,.quotePresentationTotal,.priceBookExplainer,.serviceCatalogIntro,.servicePreview,.billingConsentSummary,.launchAccessBanner,.platformHero,.platformDrawerHero,.clientHero,.legalArticleHeader,.installSection,.workspaceSaveToast,.workspaceUnsavedBar) :is(button,a,input,select,textarea):focus-visible{outline:3px solid var(--ds-cream)!important;outline-offset:3px}
}

/* Light payment status pills need their own text colors inside green panels. */
#appView #paymentSettingsPanel .paymentOverview .paymentStatus{
  background:var(--ds-beige)!important;color:var(--ds-ink)!important;
  max-width:100%;white-space:normal;overflow-wrap:anywhere;
}
#appView #paymentSettingsPanel .paymentOverview .paymentStatus.ready{
  background:var(--ds-success-soft)!important;color:var(--ds-success)!important;
}
#appView #paymentSettingsPanel .paymentOverview .paymentStatus.action{
  background:var(--ds-warning-soft)!important;color:var(--ds-warning)!important;
}

/* Clients groups customer records and invoices without changing their routes. */
#appView .tabs .clientRouteAlias{display:none!important}
#appView .clientsPageHeading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
#appView .clientsPageHeading h1{margin:0}
#appView .clientsSections{display:flex;gap:4px;padding:4px;background:var(--ds-beige);border-radius:999px}
#appView .clientsSections button{min-height:44px;padding:10px 18px;border:0;border-radius:999px;background:transparent;color:var(--ds-ink);font-size:16px}
#appView .clientsSections button[aria-current="page"]{background:var(--ds-action);color:var(--ds-cream)}
#appView .clientsSections button[hidden]{display:none!important}
.clientsListTools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.clientSearchField{position:relative;flex:1;min-width:min(100%,280px)}
#appView #customers .clientSearchField #search{margin:0;width:100%;max-width:none;min-width:0;padding-right:52px}
.clientSearchClear{position:absolute;right:4px;top:50%;transform:translateY(-50%)!important;width:44px;height:44px;min-height:44px;border:0;border-radius:50%;background:transparent;color:var(--ds-muted);font-size:24px}
.clientSearchClear:hover{background:var(--ds-beige)}
.clientSearchField input::-webkit-search-cancel-button{display:none}
.listResultCount{margin:0;color:var(--ds-muted);font-size:14px;font-variant-numeric:tabular-nums}
.invoiceListTools{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,240px);gap:16px;padding:20px;margin:0 0 20px;border:1px solid var(--ds-line);border-radius:20px;background:var(--ds-cream)}
.invoiceListTools label{display:grid;gap:8px;font-size:14px;font-weight:600}
.invoiceListTools :is(input,select){width:100%;margin:0}
@media(max-width:600px){
  #appView :is(#customers,#invoices) .clientsPageHeading{display:flex;flex-wrap:wrap}
  #appView :is(#customers,#invoices) .clientsPageHeading h1{flex:1 0 auto;max-width:100%;font-size:28px;overflow-wrap:normal}
  #appView #customers .clientsHeadingActions{flex:0 1 auto;width:max-content;max-width:100%;margin-left:auto}
  #appView :is(#customers,#invoices) .clientsSections{flex-basis:100%;flex-wrap:wrap}
  .workPageHeader h1{font-size:30px}
  .workPageHeader{margin-bottom:16px}
  .invoiceListTools{grid-template-columns:1fr;padding:16px;gap:12px}
  .clientsListTools{gap:8px;margin-bottom:16px}
  .listResultCount{width:100%}
  .workspaceEmpty{padding:24px 20px}
  #appView .card{padding:16px;gap:12px;align-items:flex-start}
  #appView .card .right{max-width:100%}
  .clientActions>*{flex:1 1 180px}
  .clientPanel h2{font-size:22px}
  .clientRecord{flex-wrap:wrap}
  .clientRecordAside{margin-left:auto}
  .marketingHero h1{font-size:clamp(30px,8.5vw,38px)}
}
@media(max-width:1059px){#appView .tabs{height:auto;grid-template-columns:repeat(var(--visible-tabs,5),minmax(0,1fr))!important}#appView .tabs button{height:auto;min-height:68px}#appView main{padding-bottom:calc(max(112px,9em) + env(safe-area-inset-bottom,0px))}}
@media(max-width:600px){#appView .clientsPageHeading{gap:12px;margin-bottom:16px}#appView .clientsSections{width:100%}#appView .clientsSections button{flex:1;min-width:0}}

/* Light dialogs and Guide chrome must not inherit feature-panel text colors. */
#workspaceLeaveDialog{background:rgba(37,40,33,.48)!important}
#workspaceLeaveDialog .workspaceLeaveCard{background:var(--ds-paper)!important;color:var(--ds-ink)!important}
#workspaceLeaveDialog .workspaceLeaveCard :is(h2,p){color:var(--ds-ink)!important}
#workspaceLeaveDialog .workspaceLeaveSave{background:var(--ds-action)!important;color:var(--ds-cream)!important}
#workspaceLeaveDialog .workspaceLeaveDiscard{background:var(--ds-danger-soft)!important;color:var(--ds-danger)!important;border-color:var(--ds-danger)!important}
#workspaceLeaveDialog .workspaceLeaveKeep{background:var(--ds-beige)!important;color:var(--ds-ink)!important}
#guideRoot #guidePanel .guideHeader :is(.guideIdentity span,.guideIdentity strong,.guideIconButton){color:var(--ds-ink)!important}
#guideRoot #guidePanel .guideIdentity>div>span{color:var(--ds-muted)!important}
#appView #settingsHelpCenter .helpHeroCopy{max-width:100%;padding-right:0}
#appView #settingsHelpSearchStatus[hidden]{display:none!important}
#appView :is(#customers,#invoices)>.section{margin-top:0;margin-bottom:16px}
#appView #customers>.section:not(:has(button:not([hidden]):not(.hidden))),#appView .invoicesPageHeader:has(#invoiceScope:empty),#appView .invoicesPageHeader:has(#invoiceScope>.hidden){display:none}
.guidedFlow{position:fixed!important;inset:0!important;margin:0!important;width:100%!important;max-width:none!important;height:100dvh!important;max-height:none!important;border:0!important;border-radius:0!important;padding:0!important;background:var(--ds-cream)!important;color:var(--ds-ink)!important;box-sizing:border-box;overflow:hidden!important}
.guidedFlow[open]{display:flex!important;flex-direction:column}
.guidedFlow::backdrop{background:var(--ds-gray)}
.guidedFlowHeader,.guidedFlowFooter{flex:none;background:var(--ds-cream);padding:16px max(20px,env(safe-area-inset-right)) 16px max(20px,env(safe-area-inset-left));border-bottom:1px solid var(--ds-line);display:flex;gap:16px;align-items:center;justify-content:space-between}
.guidedFlowHeader{padding-top:max(16px,env(safe-area-inset-top))}
.guidedFlowHeader h2,.guidedFlow h3,.guidedFlow h4{font-family:var(--ds-font-body)!important;font-weight:600!important;letter-spacing:normal!important;color:var(--ds-ink)!important}
.guidedFlowHeader h2{font-size:22px!important;margin:0;overflow-wrap:anywhere}
.guidedFlow button{min-height:44px;font-size:16px;white-space:normal}
.guidedFlowProgress{width:min(100% - 40px,640px);margin:20px auto 0;font-size:14px;color:var(--ds-muted)}
.guidedFlowBody{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px 20px 40px}
.guidedFlowBody>*,.guidedFlowBody form{max-width:640px!important;margin-left:auto!important;margin-right:auto!important;width:100%;box-sizing:border-box}
.guidedFlowBody .autoTaxSteps{border:0;margin:0;padding:0}
.guidedFlowBody form{display:block!important}
.guidedFlow [data-guided-step]{display:grid;gap:20px;min-width:0}
.guidedFlow [data-guided-hidden],.guidedFlow [hidden]{display:none!important}
.guidedFlow label{display:grid;gap:12px;font-size:18px;line-height:1.5;color:var(--ds-ink)}
.guidedFlow label.check{display:flex;align-items:flex-start;gap:12px}
.guidedFlow input:not([type=checkbox]):not([type=radio]),.guidedFlow textarea,.guidedFlow select{box-sizing:border-box;width:100%;min-width:0;min-height:48px;font-size:16px;color:var(--ds-ink);background:var(--ds-paper);border:1px solid var(--ds-input-line);border-radius:12px;padding:12px}
.guidedFlowFooter{border-top:1px solid var(--ds-line);border-bottom:0;padding-bottom:max(16px,env(safe-area-inset-bottom));flex-wrap:wrap}
.guidedFlowFooter p{font-size:12px;line-height:1.5;margin:0;max-width:420px;color:var(--ds-muted)}
.guidedFlowFooter>div{display:flex;gap:12px;margin-left:auto}
@media(max-width:600px){.guidedFlowHeader h2{font-size:18px!important}.guidedFlowHeader{align-items:flex-start}.guidedFlowHeader button{flex:none;max-width:130px}.guidedFlowFooter p{flex-basis:100%}.guidedFlowBody{padding-top:20px}.guidedFlowFooter>div{width:100%;justify-content:space-between}}

/* Reload-only controls: retained text is the no-CSS fallback; ARIA/title name the action.
   The pseudo-element never changes the click target or replaces existing event handlers. */
button.reloadIconButton.reloadIconButton,
#appView button.reloadIconButton.reloadIconButton,
#sheet button.reloadIconButton.reloadIconButton {
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 44px !important; width:44px !important; min-width:44px !important; max-width:44px !important;
  height:44px !important; min-height:44px !important; padding:0 !important; gap:0 !important;
  font-size:0 !important; line-height:0 !important; letter-spacing:0 !important;
  vertical-align:middle; overflow:hidden;
}
button.reloadIconButton::before {
  content:""; display:block; flex:none; width:20px; height:20px; pointer-events:none;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 8a8 8 0 1 0 0 8 M20 3v5h-5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 8a8 8 0 1 0 0 8 M20 3v5h-5'/%3E%3C/svg%3E") center / contain no-repeat;
}
button.reloadIconButton[hidden], button.reloadIconButton.hidden { display:none !important; }
button.reloadIconButton:focus-visible { outline:3px solid var(--ds-action); outline-offset:3px; }
button.reloadIconButton[aria-busy="true"]::before { animation:oprightReloadSpin 1s linear infinite; }
@keyframes oprightReloadSpin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { button.reloadIconButton[aria-busy="true"]::before { animation:none; } }
@media (forced-colors:active) { button.reloadIconButton::before { forced-color-adjust:none; background:ButtonText; } }