/* Shared with fupay.io: approved wordmark, forest green and mint. */
@font-face {
  font-family:"DM Sans"; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("/fonts/dm-sans-latin.woff2") format("woff2");
}
@font-face {
  font-family:Manrope; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("/fonts/manrope-latin.woff2") format("woff2");
}
:root {
  --nav:#153f35; --nav-dark:#10382e; --nav-muted:#65776d;
  --ink:#172c27; --muted:#65776d; --line:#e0eae5;
  --canvas:#f7fbfa; --teal:#21745f; --teal-soft:#e9f6ee;
  --font:"DM Sans","PingFang SC","Microsoft YaHei",sans-serif;
  --display:Manrope,"PingFang SC","Microsoft YaHei",sans-serif;
  --data:"DM Sans","PingFang SC","Microsoft YaHei",sans-serif;
  --radius:16px; --shadow:0 18px 60px #153f3512;
}
body { font-size:14px; }
h1,h2,h3 { font-family:var(--display); color:var(--ink); }
h1 { font-weight:600; letter-spacing:-.035em; }
.mono { font-family:"SFMono-Regular",Menlo,Consolas,monospace; }
.amount { font-family:var(--display); font-variant-numeric:tabular-nums; }
::selection { color:#143d34; background:#c9f0e5; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {
  outline:2px solid #278675; outline-offset:3px;
}
.brand { flex-direction:column; align-items:flex-start; gap:8px; color:var(--nav); }
.brand-wordmark {
  display:block; flex:none; width:124px; height:45px; background:currentColor;
  -webkit-mask:url("/fupay-wordmark.png") center/contain no-repeat;
  mask:url("/fupay-wordmark.png") center/contain no-repeat;
}
.brand-text { display:contents; }
.brand-name {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}
.brand-note { margin:0; color:var(--muted); font-size:9px; letter-spacing:1.8px; }
.boot-state .brand-wordmark { color:var(--nav); }
.sidebar { background:#fff; color:var(--ink); border-right:1px solid var(--line); }
.nav-label,.nav-group-label { color:var(--muted); font-size:10px; letter-spacing:.08em; }
.nav-item { color:#526b60; border-radius:10px; font-size:13px; }
.nav-item:hover { color:var(--nav); background:#f2f8f4; }
.nav-item.active { color:var(--nav); background:#eaf5ee; box-shadow:none; font-weight:600; }
.nav-item.active:before { background:#64bea2; }
.nav-count { background:#edf4ef; color:#39715c; }
.nav-item.active .nav-count { background:#d7ecdf; }
.sidebar-footer { color:var(--muted); border-top-color:var(--line); }
.sidebar-footer p:first-child { display:none; }
.sidebar-footer .button.link { color:var(--nav); }
.topbar { background:#ffffffed; border-bottom-color:var(--line); }
.topbar-kicker { color:var(--muted); }
.topbar-title>strong { font-weight:550; }
.user-avatar { color:#246b53; background:#eaf5ee; border-color:#dcebe1; }
.auth-status { color:#6c8377; }
.topbar .button { border-radius:24px; }
.preview-rail { background:#fafaf4; border-color:#e9eadd; color:#7b7656; }
.preview-rail .button.link { color:#536e5e; }
.eyebrow { color:#5a7063; font-size:10px; font-weight:550; letter-spacing:.12em; }
.page-heading p,.client-workpage .client-page-heading p { color:var(--muted); }
.button { border-radius:24px; font-weight:500; transition:background .16s,border-color .16s,box-shadow .16s; }
.button:hover { transform:none; }
.button:not(.primary):not(.danger):not(.link) { border-color:#dce7df; background:#fff; color:#294e42; }
.button:not(.primary):not(.danger):not(.link):hover { background:#f2f8f4; border-color:#c2d9cc; }
.button.primary { background:var(--nav); border-color:var(--nav); color:#fff; box-shadow:none; }
.button.primary:hover { background:#205443; border-color:#205443; }
.client-shell .button.primary,.client-login .button.primary {
  color:#103e32; border-color:transparent; background:linear-gradient(110deg,#66c5c6,#69d9ab);
}
.client-shell .button.primary:hover,.client-login .button.primary:hover {
  background:linear-gradient(110deg,#58c0c2,#55d19c); box-shadow:0 5px 16px #54bba51a;
}
.button.link { color:var(--teal); border-radius:6px; }
.button.danger { color:var(--red); }
.panel,.metric-card,.staff-page-stats,.client-overview .client-metrics { box-shadow:none; border-color:var(--line); }
.panel-header { border-color:var(--line); }
.panel-footer { background:#fbfdfb; }
thead,th { background:#f7faf7; color:#5a7063; }
td { color:#294b3e; border-color:#e8efea; }
tbody tr:hover { background:#f7fbf8; }
.table-order,.table-client,.staff-review-facts dd,.staff-approval-facts dd,.drawer-facts dd,
.client-profile-facts dd,.client-facts dd { color:#294b3e; }
.search-box { background:#fff; border-color:var(--line); border-radius:24px; }
.queue-tabs,.staff-review-filters,.settlement-filter-tabs { border-color:var(--line); }
.queue-tabs button.active,.queue-tabs button[aria-pressed="true"] { color:var(--nav); border-bottom-color:#5cb496; }
.badge { border-radius:20px; font-weight:500; }
.badge.teal { color:#24674d; background:#e8f5ec; border-color:#d5eadd; }
.field input,.field select,.field textarea,.search-box input { color:var(--ink); }
.field input,.field select,.field textarea { background:#fff; border-color:#d6e3da; border-radius:10px; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:#5b9c83; box-shadow:0 0 0 3px #65b59612; }
.field label,.compliance-fieldset legend { color:#3c5a4c; }
input[type="checkbox"],input[type="radio"] { accent-color:#21745f; }
.compliance-fieldset,.action-panel,.status-box,.staff-approval-card { border-color:var(--line); border-radius:12px; }
.staff-decision-context { background:#f2f8f3; border-color:#dceade; }
.staff-decision-context strong,.staff-order-toolbar strong,.staff-approval-card>h3 { color:#315c47; }
.drawer,.modal { border-color:var(--line); box-shadow:var(--shadow); }
.drawer-header,.modal-header { background:#fff; border-bottom-color:var(--line); }
.drawer-header h2,.client-drawer .drawer-header h2,.staff-review-drawer .drawer-header h2 { color:var(--nav); font-family:var(--display); }
.drawer-section-nav,.staff-order-toolbar { background:#f7fbf8; border-color:var(--line); }
.drawer-section-nav button.active,.drawer-section-nav button[aria-current="true"] { color:var(--nav); border-color:#5cb496; }
.drawer-footer,.modal-footer,.client-detail-footer,.client-form-actions { background:#fff; border-color:var(--line); }
.client-detail-drawer .client-order-amounts>div { background:#f2f9f4; border-color:#dcece1; border-radius:12px; }
.client-detail-drawer .client-order-amounts strong,.client-detail-drawer .client-order-amounts dd { color:var(--nav); font-family:var(--display); }
.client-overview .client-account-heading h1,.client-workpage .client-page-heading h1 { color:var(--nav); font-weight:600; letter-spacing:-.035em; }
.client-overview .client-identity-line { color:var(--muted); }
.client-overview .client-account-heading p { font-size:13px; }
.client-trade-entry {
  border:1px solid #dcebe1; border-radius:16px; background:linear-gradient(110deg,#f0f8f1,#f6fcf9);
}
.client-trade-entry h2 { color:var(--nav); font-family:var(--display); font-size:22px; }
.client-trade-entry .client-trade-scope strong { color:#315e4b; font-family:var(--display); font-weight:550; }
.client-trade-entry .client-trade-scope span { color:#6b8476; }
.client-trade-entry .client-trade-actions>.button:not(.link) { min-height:44px; }
.client-overview .client-metrics { border-radius:14px; }
.client-overview .client-metric { border-color:var(--line); }
.client-overview .client-metric:hover:not(:disabled),.client-overview .client-metric.active { background:#f2f9f4; }
.client-overview .client-metric strong { font-family:var(--display); color:var(--nav); font-weight:500; letter-spacing:-.04em; }
.client-overview .client-task strong,.client-overview .client-task h3,.client-overview .client-shortcut { color:#315443; }
.client-overview .client-task,.client-overview .client-shortcut { border-color:#e8efea; }
.client-overview .client-shortcut:hover { background:#f5faf6; }
.client-profile-update-note,.client-wallet-card,.client-order-card { border-color:var(--line); }
.staff-page-stats { border-radius:14px; }
.staff-page-stats>div { border-color:var(--line); }
.staff-page-stats>div>strong,.staff-kpi strong,.metric-value { color:var(--nav); font-family:var(--display); font-weight:500; }
.login-screen.portal-login-compact { border-color:var(--line); border-radius:20px; box-shadow:0 18px 70px #153f3508; }
.portal-login-compact .login-intro { background:#edf6ee; color:var(--nav); }
.portal-login-compact .login-brand { color:var(--nav); }
.portal-login-compact .login-brand .brand-note { color:#698371; margin:0; }
.portal-login-compact .portal-login-identity h1 { color:var(--nav); font-weight:600; }
.portal-login-compact .portal-login-identity>.eyebrow,.portal-login-compact .portal-login-identity>p:first-child { color:#63867a; }
.portal-login-compact .portal-login-identity>p:last-child { color:#65776d; }
.portal-login-compact .login-bottomline .button.link { color:#3f7259; }
.portal-login-compact .login-card h2 { color:var(--nav); }
.portal-login-compact .preview-note { background:#f8faf5; border-color:#e4eadc; color:#6d795c; border-radius:10px; }
.portal-login-compact .login-brand .brand-name { position:absolute; }
.empty-state { color:#72887a; }
.loading-line { background:linear-gradient(90deg,#66c5c6,#69d9ab); }
@media(min-width:761px) {
  .shell { grid-template-columns:232px minmax(0,1fr); }
  .sidebar { width:232px; padding:29px 16px 22px; }
  .sidebar .brand { padding:0 16px 26px; }
  .topbar { min-height:76px; padding:14px 34px; }
  .main-content { padding:30px 34px 40px; }
  .preview-rail { padding-left:34px; padding-right:34px; }
  .loading-line { left:232px; }
  .client-overview .client-account-heading h1,.client-workpage .client-page-heading h1 { font-size:29px; }
  .client-overview .client-account-heading { margin-bottom:22px; }
}
@media(max-width:760px) {
  .sidebar { background:#fff; border-top:1px solid var(--line); border-right:0; }
  .nav-item.active { color:var(--nav); background:#eaf5ee; }
  .nav-item { font-size:11px; }
  .brand-wordmark { width:108px; height:39px; }
  .topbar { min-height:68px; }
  .topbar-kicker { font-size:0; line-height:0; margin-bottom:5px; }
  .topbar-kicker:before {
    content:""; display:block; width:64px; height:23px; background:var(--nav);
    -webkit-mask:url("/fupay-wordmark.png") center/contain no-repeat;
    mask:url("/fupay-wordmark.png") center/contain no-repeat;
  }
  .preview-rail { font-size:10px; }
  .client-overview .client-account-heading h1,.client-workpage .client-page-heading h1 { font-size:26px; }
  .client-trade-entry { padding:20px 18px; border-radius:14px; }
  .client-trade-entry h2 { font-size:20px; }
  .client-overview .client-metric strong { font-size:26px; }
  .login-screen.portal-login-compact { margin-top:22px; border-radius:16px; }
  .portal-login-compact .login-topline { padding-right:88px; }
  .portal-login-compact .login-bottomline { top:24px; }
  .portal-login-compact .login-bottomline .button.link { font-size:9px; }
  .portal-login-compact .portal-login-identity { margin-top:25px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation-duration:.01ms!important; transition-duration:.01ms!important; }
}
