.access-page, #convert-dialog {
  --blue: #2d57ee;
  --ink: #151c32;
}
[hidden] {
  display: none !important;
}
.preview-banner {
  padding: 10px 20px;
  text-align: center;
  font:
    500 13px/1.5 Arial,
    sans-serif;
  background: #eef1ff;
  color: #30489c;
}
#convert-dialog {
  font:
    16px/1.6 Arial,
    sans-serif;
  width: min(92vw, 520px);
  padding: 36px;
  border: 1px solid #e3e7f0;
  border-radius: 24px;
  color: var(--ink);
  box-shadow: 0 32px 100px #13234430;
}
#convert-dialog::backdrop {
  background: #101d4055;
  backdrop-filter: blur(4px);
}
#close-convert {
  position: absolute;
  right: 14px;
  top: 9px;
  background: none;
  border: 0;
  font-size: 28px;
  cursor: pointer;
}
#convert-dialog h2 {
  font-size: 28px;
  margin: 12px 0;
}
#convert-dialog label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  margin: 14px 0 6px;
}
#convert-dialog input,
#convert-dialog select {
  display: block;
  max-width: 100%;
  width: 100%;
  padding: 12px;
  border: 1px solid #d7ddeb;
  border-radius: 9px;
  background: white;
}
#convert-dialog .upload-button {
  margin-top: 20px;
  display: inline-flex;
  padding: 14px 24px;
  border: 0;
  border-radius: 10px;
  background: var(--blue);
  color: white;
  font: 600 15px Arial;
  cursor: pointer;
  text-decoration: none;
}
#convert-dialog button:disabled {
  opacity: 0.5;
  cursor: default;
}
#file-summary {
  overflow-wrap: anywhere;
  font-size: 14px;
}
#job-status {
  min-height: 25px;
}
#convert-dialog .retention-note {
  font-size: 12px;
  color: #647089;
  margin: 24px 0 0;
}
.access-page {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: #f4f6fc;
  color: var(--ink);
  font:
    16px/1.6 Arial,
    sans-serif;
}
.access-card {
  max-width: 440px;
  margin: 30px;
  padding: 42px;
  background: white;
  border: 1px solid #e4e8f2;
  border-radius: 22px;
}
.access-card h1 {
  font-size: 30px;
  letter-spacing: -1px;
}
.wordmark {
  font-size: 25px;
  font-weight: 800;
  color: var(--ink);
  text-decoration: none;
}
.wordmark span {
  color: var(--blue);
}
.access-card .eyebrow, #convert-dialog .eyebrow {
  font-size: 11px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: #5b6c8a;
  margin-top: 35px;
}
.access-card label {
  display: block;
  margin-top: 20px;
  font-size: 14px;
  font-weight: 600;
}
.access-card input {
  box-sizing: border-box;
  width: 100%;
  padding: 13px;
  border: 1px solid #ccd4e5;
  border-radius: 8px;
  font: inherit;
}
.access-card button {
  width: 100%;
  margin-top: 16px;
  padding: 13px;
  background: var(--blue);
  color: white;
  border: 0;
  border-radius: 8px;
  font: 600 15px Arial;
  cursor: pointer;
}
#auth-status {
  font-size: 14px;
  color: #5f6d86;
}
@media (max-width: 600px) {
  /* Existing mobile fit for the longer MakeYourFile brand. */
  .brand { font-size:20px; }
  .nav-button { white-space:nowrap; }
  #convert-dialog {
    padding: 26px;
  }
  .access-card {
    padding: 28px;
    margin: 16px;
  }
  .preview-banner {
    font-size: 11px;
  }
}

/* Converter v1: native picker, readable mobile controls and honest processing states. */
#convert-dialog { box-sizing:border-box; width:min(calc(100vw - 24px),570px); max-height:calc(100dvh - 24px); overflow:auto; padding:32px; }
#convert-dialog * { box-sizing:border-box; }
#convert-dialog #close-convert { width:44px;height:44px;right:8px;top:8px; }
#convert-dialog h2 { font-size:28px;line-height:1.2;padding-right:15px; }
#conversion-note { color:#526078;line-height:1.5; }
#convert-dialog .file-label { position:relative;display:flex;align-items:center;justify-content:center;min-height:58px;border:1.5px dashed #acb9dd;border-radius:12px;background:#f7f9ff;font-size:16px;cursor:pointer; }
#convert-dialog #file-input { position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;padding:0; }
#convert-dialog .file-label:focus-within { outline:3px solid #2d57ee;outline-offset:3px; }
#convert-dialog select { font:inherit;min-height:48px; }
#convert-dialog #start-convert { width:100%;justify-content:center;font-size:16px;min-height:48px;margin-top:12px; }
.field-note { font-size:14px;color:#526078;line-height:1.5;overflow-wrap:anywhere; }
.conversion-steps { display:flex;gap:10px;list-style:none;padding:0;margin:24px 0 14px;font-size:14px;color:#67748b; }
.conversion-steps li { flex:1;border-bottom:3px solid #e8ecf5;padding-bottom:9px; }
.conversion-steps [aria-current] { color:#254bc9;border-color:#2d57ee;font-weight:700; }
#upload-progress { width:100%;height:12px;accent-color:#2d57ee; }
#processing-indicator { width:24px;height:24px;border:3px solid #dce4ff;border-top-color:#2d57ee;border-radius:50%;animation:convert-spin 1s linear infinite; }
@keyframes convert-spin { to{transform:rotate(360deg);} }
.result-actions { display:flex;flex-wrap:wrap;align-items:center;gap:12px; }
#convert-dialog .result-actions .upload-button { margin-top:0;font-size:16px; }
#convert-dialog .secondary-button { background:white;border:1px solid #b9c6e1;color:#254bc9;padding:12px 18px;border-radius:10px;font:600 15px Arial;min-height:46px;cursor:pointer; }
#convert-dialog .text-button { padding:12px 0;background:none;border:0;color:#254bc9;text-decoration:underline;font:inherit;min-height:44px;cursor:pointer; }
#convert-dialog .retention-note { font-size:13px;line-height:1.5; }
.conversion-limits { margin-top:18px;border-top:1px solid #e5e9f2;padding-top:15px;font-size:13px;color:#526078; }
.conversion-limits summary { font-size:14px;cursor:pointer;min-height:32px; }
.conversion-limits a { color:#254bc9;text-decoration:underline; }
.preview-banner a { margin-left:12px;text-decoration:underline;font-weight:600; }
.drag-active { outline:3px solid #2d57ee;outline-offset:3px; }
#download-file[aria-disabled="true"] { opacity:.65;pointer-events:none; }
@media(max-width:600px){#convert-dialog{padding:26px 22px;}#convert-dialog h2{font-size:25px;}.result-actions{align-items:stretch;flex-direction:column;}.result-actions a,.result-actions button{text-align:center;justify-content:center;}.conversion-steps{gap:8px;font-size:13px;}}
@media(prefers-reduced-motion:reduce){#processing-indicator{animation:none;}}



#availability-dialog { box-sizing:border-box;width:min(calc(100vw - 32px),520px);max-height:calc(100dvh - 32px);overflow:auto;padding:32px;border:1px solid #e3e7f0;border-radius:24px;color:var(--ink);font:16px/1.6 var(--font); }
#availability-dialog::backdrop { background:#101d4055;backdrop-filter:blur(4px); }
#availability-dialog form { position:absolute;right:8px;top:8px; }
#availability-dialog button { width:44px;height:44px;border:0;background:none;font-size:28px;cursor:pointer; }
#availability-dialog h2 { font-size:26px;line-height:1.25;padding-right:16px; }
#availability-dialog a { color:var(--blue);text-decoration:underline; }

/* Center within the visual viewport without disabling browser zoom. */
#convert-dialog {
 position:fixed;inset:auto;margin:0;max-width:none;
 width:min(calc(var(--cv-width,100vw) - 24px),570px);
 max-height:calc(var(--cv-height,100dvh) - 24px);
 left:calc(var(--cv-left,0px) + var(--cv-width,100vw) / 2);
 top:calc(var(--cv-top,0px) + var(--cv-height,100dvh) / 2);
 transform:translate(-50%,-50%);
}

.account-link{font-size:16px;font-weight:600;color:#43516c;text-decoration:none;white-space:nowrap}.account-link:hover{text-decoration:underline}
@media(max-width:600px){.header-end .account-link{font-size:15px}}

/* A calm, centered conversion journey. Progress is driven only by job state. */
#convert-dialog { text-align:center;padding:38px 30px 30px; }
#convert-dialog h2 { padding:0;font-size:28px;letter-spacing:-.6px;margin:14px 0 8px; }
#conversion-note { overflow-wrap:anywhere;color:#68748b;font-size:16px;line-height:1.5; }
#convert-dialog #file-controls,#convert-dialog .conversion-limits { text-align:left; }
#convert-dialog .conversion-limits { margin-top:20px; }
#conversion-visual { position:relative;width:88px;height:88px;margin:18px auto 6px;border-radius:28px;background:#eef1ff;color:#4058e8; }
#conversion-visual .conversion-symbol { width:64px;height:64px;margin:12px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round; }
/* Keep the rounded outline fixed: only the stroke travels around its path. */
#conversion-visual .conversion-orbit { position:absolute;inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px);margin:0;fill:none;stroke:#7283ef;stroke-width:2;stroke-linecap:round; }
.conversion-orbit rect { stroke-dasharray:22 78;animation:convert-orbit 2.4s linear infinite; }
@keyframes convert-orbit { to { stroke-dashoffset:-100; } }
.conversion-check { display:none; }
#convert-dialog[data-stage="ready"] #conversion-visual { background:#d5f1e3;color:#268468; }
#convert-dialog[data-stage="ready"] .conversion-orbit { display:none; }
#convert-dialog[data-stage="ready"] .conversion-document { display:none; }
#convert-dialog[data-stage="ready"] .conversion-check { display:block;stroke-dasharray:45;stroke-dashoffset:0;animation:convert-check .4s ease-out; }
#convert-dialog .conversion-steps { justify-content:center;gap:0;margin:22px auto;max-width:380px; }
#convert-dialog .conversion-steps li { display:flex;flex-direction:column;align-items:center;position:relative;border:0;gap:7px;padding:0;font-size:13px; }
#convert-dialog .conversion-steps li:not(:last-child)::after { content:"";position:absolute;left:calc(50% + 21px);top:16px;width:calc(100% - 42px);height:2px;background:#e4e9f3;transition:background .3s; }
#convert-dialog .step-dot { display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f0f3f8;color:#7b879b;font-size:14px;transition:background .3s,color .3s,box-shadow .3s; }
#convert-dialog [aria-current="step"] .step-dot { background:#4058e8;color:white;box-shadow:0 0 0 5px #eef1ff; }
#convert-dialog [data-done="true"] .step-dot,#convert-dialog[data-stage="ready"] [aria-current] .step-dot { background:#d5f1e3;color:#268468;box-shadow:none; }
#convert-dialog [data-done="true"]::after { background:#a8ddc5; }
#convert-dialog #upload-progress { display:block;max-width:300px;height:7px;margin:0 auto 18px;border:0;border-radius:12px;overflow:hidden; }
#upload-progress::-webkit-progress-bar { background:#edf0f8;border-radius:12px; }
#upload-progress::-webkit-progress-value { background:#4058e8;border-radius:12px;transition:width .25s ease; }
#upload-progress::-moz-progress-bar { background:#4058e8;border-radius:12px; }
#processing-indicator { margin:0 auto 16px; }
#job-status { font-size:16px;line-height:1.5;margin:14px 0 8px; }
#job-expiry { font-size:12px;line-height:1.5;margin:10px auto 20px;max-width:370px; }
#ready-email-form { text-align:left;margin:20px auto 14px;max-width:380px; }
#convert-dialog #ready-email-form label { font-size:14px;margin-bottom:7px; }
#convert-dialog #ready-email { font:16px/1.4 Arial,sans-serif;min-height:52px; }
#ready-email:focus { outline:3px solid #dfe5ff;border-color:#4058e8; }
#ready-email-help { font-size:12px;margin-top:7px; }
#ready-email-error { font-size:14px;line-height:1.4;color:#a32e38;margin-top:8px; }
#convert-dialog .result-actions { justify-content:center;max-width:380px;margin:auto; }
#convert-dialog .result-actions .upload-button { width:100%;justify-content:center;min-height:52px;font-size:16px; }
@keyframes convert-check { from{stroke-dashoffset:45}to{stroke-dashoffset:0} }
@media(max-width:600px){#convert-dialog{padding:34px 22px 26px;}#convert-dialog h2{font-size:26px;}#conversion-visual{width:76px;height:76px;border-radius:24px;margin-top:16px;}#conversion-visual .conversion-symbol{margin:6px;}#convert-dialog .conversion-steps{margin:20px auto;}#job-expiry{font-size:12px;}}
@media(prefers-reduced-motion:reduce){#convert-dialog *,#convert-dialog *::after{animation:none!important;transition:none!important;}}

/* Mobile disclosure stays in the header; desktop navigation keeps its original layout. */
.mobile-menu-toggle,.mobile-menu { display:none; }
@media(max-width:880px) {
 .mobile-nav-enabled { position:relative;z-index:20; }
 .mobile-nav-enabled .header-inner { justify-content:space-between; }
 .mobile-nav-enabled .desktop-nav,.mobile-nav-enabled .header-end { display:none; }
 .mobile-menu-toggle { display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid #dfe3ee;border-radius:10px;background:#f7f8ff;color:#4058e8;cursor:pointer; }
 .mobile-menu-toggle:focus-visible { outline:3px solid #4058e8;outline-offset:3px; }
 .mobile-menu-toggle svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round; }
 .menu-close,[aria-expanded="true"] .menu-bars { display:none; }
 [aria-expanded="true"] .menu-close { display:block; }
 .mobile-menu { display:block;position:absolute;top:100%;left:0;right:0;padding:12px 24px 18px;background:#fff;border-bottom:1px solid #e4e8f1;box-shadow:0 16px 24px #1b2c5712;animation:menu-reveal .18s ease-out; }
 .mobile-menu nav { display:flex;flex-direction:column;max-width:740px;margin:auto; }
 .mobile-menu a { display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:10px 8px;font-size:17px;font-weight:550;border-radius:8px; }
 .mobile-menu a:hover { background:#f2f4ff;color:#4058e8; }
 .mobile-menu-language { display:block;max-width:740px;margin:8px auto 0;padding:12px 8px 0;border-top:1px solid #edf0f5;color:#697386;font-size:14px; }
}
@keyframes menu-reveal { from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)} }
@media(prefers-reduced-motion:reduce){.mobile-menu{animation:none;}}