/* Shared Imager visual system: restrained surfaces, one blue accent, and calm motion. */
:root {
  color-scheme: light;
  --brand-blue: #4969df;
  --brand-blue-hover: #3857cd;
  --brand-blue-soft: #eef2ff;
  --brand: var(--brand-blue);
  --lime: var(--brand-blue);
  --ink: #1d1d1f;
  --muted: #6e6e73;
  --line: #e5e5ea;
  --paper: #ffffff;
  --surface-soft: #f5f5f7;
  --surface-tint: #fafafd;
  --shadow-soft: 0 8px 28px rgb(29 29 31 / 6%);
  --shadow-card: 0 16px 36px rgb(29 29 31 / 8%);
  --radius-card: 18px;
  --radius-control: 12px;
  --motion-fast: 160ms;
  --motion-standard: 240ms;
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --text: var(--ink);
  --bg: var(--paper);
  --surface: var(--paper);
  --surface-2: var(--surface-soft);
  --lime: var(--brand-blue);
  --lime-dim: var(--brand-blue-hover);
}

html { color-scheme: light; scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a, button, input, select, textarea, .document-tool-card, .tool-card, .steps article {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--ease-out);
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid rgb(73 105 223 / 35%);
  outline-offset: 3px;
}

.upload-gesture-active {
  outline: 3px dashed var(--brand-blue, #4969df) !important;
  outline-offset: 3px;
  background-color: var(--brand-blue-soft, #eef2ff) !important;
}

.landing-header, .site-header, .topbar {
  background: rgb(255 255 255 / 92%);
  border-color: var(--line);
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
}

.landing-brand, .site-header .brand, .topbar .brand { color: var(--ink); }
.landing-brand img, .site-header .brand img { background: var(--brand-blue); border-radius: 10px; }
.topbar .brand .brand-mark { background: var(--brand-blue); border-radius: 11px; box-shadow: none; }
.topbar .brand strong { color: var(--ink); }
.topbar .brand span { color: var(--muted); }

.landing-nav a, .site-header nav a { color: #424245; }
.landing-nav a:hover, .site-header nav a:hover { color: var(--brand-blue); }
.landing-nav .nav-account, .button-primary, .primary-btn, .nav-cta, .plan-select {
  border-color: var(--brand-blue);
  background: var(--brand-blue);
  color: #fff;
  box-shadow: none;
}
.primary-cta { color: #fff; }
.primary-cta:hover { color: #fff; }
.landing-nav .nav-account:hover, .button-primary:hover, .primary-btn:hover, .plan-select:hover {
  border-color: var(--brand-blue-hover);
  background: var(--brand-blue-hover);
  color: #fff;
  box-shadow: 0 6px 18px rgb(73 105 223 / 18%);
}
.button-primary span, .landing-nav .nav-account span { color: #fff; }
.button-secondary, .ghost-btn, .site-header nav .nav-cta {
  border-color: var(--line);
  background: #fff;
  color: #424245;
}
.button-secondary:hover, .ghost-btn:hover, .site-header nav .nav-cta:hover {
  border-color: #c8c8ce;
  background: var(--surface-soft);
}

.landing-hero { --brand: var(--brand-blue); }
.hero-copy h1 em, .eyebrow, .text-link, .card-link, .primary-cta, .seo-directory a { color: var(--brand-blue); }
.hero-copy h1 { color: var(--ink); }
.hero-copy>.eyebrow span { background: var(--brand-blue); box-shadow: 0 0 0 5px var(--brand-blue-soft); }
.tool-section, .directory { background: var(--surface-soft); }
.tool-group-heading { margin: 38px 0 0; padding-top: 30px; border-top: 1px solid var(--line); }
.tool-group-heading:first-of-type { margin-top: 30px; padding-top: 0; border-top: 0; }
.tool-group-heading h3 { margin: 0; color: var(--ink); font-size: 24px; letter-spacing: -.035em; }
.tool-group-heading>p:last-child { margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.tool-group-heading .eyebrow { margin-bottom: 7px; }
.document-grid { margin-bottom: 10px; }
.tool-tab.active { color: var(--brand-blue); }
.tool-tab.active:after { background: var(--brand-blue); }
.tool-card, .steps article, .floating-card, .privacy-banner, .content-section, .related, .seo-directory-groups section {
  border-color: var(--line);
  border-radius: var(--radius-card);
  box-shadow: none;
}
.tool-card:hover, .document-tool-card:hover {
  transform: translateY(-2px);
  border-color: #cbd4fa;
  box-shadow: var(--shadow-soft);
}
.icon-blue, .step-symbol, .privacy-mark, .float-icon.purple { background: var(--brand-blue-soft); color: var(--brand-blue); }
.tool-more { background: #eceef5; }
.tool-more a, .directory-links a:hover, .card-link:hover { color: var(--brand-blue-hover); }
.directory-links a { border-radius: 999px; border-color: var(--line); }
.privacy-banner { background: linear-gradient(110deg, #f5f7ff, #fff 72%); }

.app-shell, .workspace, .mode-panel { color: var(--ink); }
.workspace { background: #fff; }
.mode-tabs { border-color: var(--line); }
.mode-tab { color: var(--muted); }
.mode-tab.active { color: var(--ink); }
.mode-tab.active:after { background: var(--brand-blue); }
.document-tool-grid { gap: 16px; }
.document-tool-card {
  border-color: var(--line);
  border-radius: var(--radius-card);
  background: #fff;
  box-shadow: none;
}
.document-tool-icon { border-radius: 13px; }
.document-tool-arrow { color: #86868b; }
.utility-heading h1, .panel-head h1, .panel-head h2 { color: var(--ink); }
.file-convert-direction, .file-convert-dropzone, .file-convert-settings, .utility-settings,
.pdf-organizer-dialog, .pricing-card, .membership-plan, .account-dialog,
.pdf-organizer-page, .document-tool-card, .asset-card, .control-panel, .content-grid > * {
  border-color: var(--line);
}
.file-convert-direction, .utility-settings, .pdf-organizer-dialog, .membership-plan,
.account-dialog, .control-panel, .content-grid > * { background: #fff; }
.file-convert-dropzone { background: var(--surface-tint); }
.file-convert-direction:hover, .file-convert-direction.active { border-color: #aebbf3; background: var(--brand-blue-soft); }
.account-trigger { border-radius: 999px; }
.primary-btn, .ghost-btn, .mode-tab, .document-tool-card, .file-convert-direction { border-radius: var(--radius-control); }

.site-footer, .landing-footer { border-color: var(--line); }
.site-footer a:hover, .landing-footer a:hover { color: var(--brand-blue); }
.landing-hero .primary-cta, .landing-hero .primary-cta:hover { color: #fff; }

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

/* SEO page actions sit on a solid blue surface. */
.primary-cta, .primary-cta * { color: #fff; }

/* Keep every shared blue primary action readable on all site pages. */
:is(.primary-btn,.button-primary,.primary-cta,.nav-cta,.plan-select:not(.secondary),.landing-nav .nav-account,.landing-header-actions .nav-account,.account-dialog #accountSubmit,.pricing-selection>button.is-ready,.document-launch-button),
:is(.primary-btn,.button-primary,.primary-cta,.nav-cta,.plan-select:not(.secondary),.landing-nav .nav-account,.landing-header-actions .nav-account,.account-dialog #accountSubmit,.pricing-selection>button.is-ready,.document-launch-button):is(:hover,:focus-visible,:active){
  color:#fff!important;
  -webkit-text-fill-color:#fff;
}

.account-referral-card{margin:18px 0;padding:16px;border:1px solid var(--line,#e2e5ec);border-radius:14px;background:var(--surface-tint,#f7f8fc)}
.account-referral-card h3{margin:0 0 5px;font-size:15px}
.account-referral-card .account-copy{margin:5px 0;color:var(--muted,#707782)}
.account-invite-code-row,.account-referral-input-row{display:flex;align-items:center;gap:9px}
.account-invite-code-row{margin:12px 0}
.account-invite-code-row code{flex:1;min-width:0;overflow-wrap:anywhere;padding:10px 12px;border:1px dashed #aab7ed;border-radius:9px;background:#fff;color:#3554c4;font-size:16px;font-weight:750;letter-spacing:.08em}
.account-referral-card button{flex:0 0 auto;min-height:38px;padding:8px 12px;border:1px solid #d5dbea;border-radius:9px;background:#fff;color:#3554c4;font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.account-referral-card button:hover{border-color:#4969df;background:#f5f7ff}
.account-referral-card label{display:block;margin:10px 0 6px;font-size:12px;font-weight:650}
.account-referral-input{width:100%;min-width:0;box-sizing:border-box;padding:10px 11px;border:1px solid #d5dae2;border-radius:9px;background:#fff;color:#252a32;font:inherit;font-size:13px;letter-spacing:.04em}
.account-referral-input:focus-visible{outline:2px solid rgb(73 105 223 / 35%);outline-offset:2px}
.account-referral-input-row .account-referral-input{flex:1}
.account-referral-input-row button{min-width:58px}
.account-referral-card [hidden]{display:none!important}
@media(max-width:380px){.account-invite-code-row,.account-referral-input-row{align-items:stretch;flex-direction:column}.account-referral-card button{width:100%}}

/* Give the signed-in account view a clear status-first hierarchy on every page. */
.account-dialog{width:min(680px,calc(100vw - 32px));padding:36px;}
.account-dialog h2{margin:4px 0 0;font-size:clamp(27px,4vw,34px);letter-spacing:-.035em;}
.account-profile{padding-top:12px;}
.account-welcome{margin:11px 0 24px;font-size:15px;}
.account-welcome strong{color:#252b36;font-weight:700;}
.account-profile-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(190px,1fr);gap:14px;margin:0 0 18px;}
.account-membership-card,.account-device-card{display:flex;min-height:132px;box-sizing:border-box;flex-direction:column;align-items:flex-start;justify-content:center;padding:20px 22px;border:1px solid #e0e5ef;border-radius:18px;background:linear-gradient(140deg,#f7f9ff,#fff 72%);}
.account-membership-card{position:relative;isolation:isolate;overflow:hidden;border-color:#dbe4fb;background:linear-gradient(135deg,#f2f6ff 0%,#fff 70%);}
.account-membership-card::after{position:absolute;z-index:0;pointer-events:none;right:-28px;bottom:-48px;width:130px;height:130px;border:1px solid #dce6ff;border-radius:50%;content:"";box-shadow:0 0 0 18px #edf2ff88,0 0 0 38px #f3f6ff88;}
.account-membership-card>*{position:relative;z-index:1;}
.account-card-kicker{color:#778195;font-size:12px;font-weight:650;letter-spacing:.045em;}
.account-membership-line{display:flex;align-items:center;gap:8px;min-height:38px;margin:11px 0 4px;}
.account-membership-line strong{margin:0;color:#3559cd;font-size:25px;letter-spacing:-.025em;}
.account-membership-crown{font-size:20px;}
.account-membership-card small,.account-device-card small{color:#788193;font-size:12px;line-height:1.5;}
.account-membership-card small:empty{display:none;}
.account-device-card{background:#fff;}
.account-device-card strong{margin:12px 0 6px;color:#273246;font-size:24px;letter-spacing:-.02em;}
.account-profile-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:3px;}
.account-profile-footer .account-copy{max-width:390px;margin:0;}
.account-profile-footer #accountLogout{flex:none;min-height:42px;padding:0 17px;border:1px solid #d8deea;border-radius:10px;background:#fff;color:#454d5b;font:inherit;font-size:13px;cursor:pointer;transition:background .15s ease,border-color .15s ease;}
.account-profile-footer #accountLogout:hover{border-color:#b9c7e8;background:#f7f9ff;}
#accountProfileStatus{margin:10px 0 0;color:#53617a;font-size:13px;}
@media(max-width:560px){.account-dialog{padding:26px 20px}.account-profile-grid{grid-template-columns:1fr}.account-membership-card,.account-device-card{min-height:112px;padding:17px}.account-profile-footer{align-items:flex-start;flex-direction:column}.account-profile-footer #accountLogout{width:100%;}}