/* RANK Audit public form and progress. Builds on report.css (the .rank-report variables and type). */
.rank-audit-app{background:transparent;padding:0}
.rank-audit-app .ra-form,.rank-audit-app .ra-progress{max-width:760px;margin:0 auto;background:var(--paper);padding:44px 48px;display:flex;flex-direction:column;gap:28px;border:1px solid var(--line)}
.rank-audit-app .ra-form-head{display:flex;flex-direction:column;gap:12px}
.rank-audit-app .ra-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.rank-audit-app .ra-f{display:flex;flex-direction:column;gap:6px;margin:0}
.rank-audit-app .ra-f.ra-wide{grid-column:1/-1}
.rank-audit-app .ra-f span{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.rank-audit-app .ra-f em{font-style:normal;font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.rank-audit-app .ra-f input,.rank-audit-app .ra-f select{font:inherit;font-size:15px;color:var(--ink);background:#fff;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:10px 0;width:100%;box-shadow:none;outline:none;-webkit-appearance:none;appearance:none}
.rank-audit-app .ra-f select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:24px}
.rank-audit-app .ra-f input:focus,.rank-audit-app .ra-f select:focus{border-bottom:2px solid var(--blue);padding-bottom:9px}
.rank-audit-app .ra-f input::placeholder{color:var(--soft)}
.rank-audit-app .ra-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.rank-audit-app .ra-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.rank-audit-app .ra-actions .small{max-width:36ch}
.rank-audit-app .ra-btn{font:inherit;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--ink);border:0;border-radius:0;padding:16px 26px;cursor:pointer}
.rank-audit-app .ra-btn:hover{background:var(--blue)}
.rank-audit-app .ra-btn:disabled{opacity:.5;cursor:wait}
.rank-audit-app .ra-btn:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.rank-audit-app .ra-error{color:var(--bad);font-weight:600;margin:0}
.rank-audit-app #ra-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.rank-audit-app #ra-steps li{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);color:var(--soft);font-size:14px;font-weight:600}
.rank-audit-app #ra-steps li i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--soft);flex:none}
.rank-audit-app #ra-steps li.now{color:var(--ink)}
.rank-audit-app #ra-steps li.now i{border-color:var(--blue);background:var(--blue);animation:ra-pulse 1s ease-in-out infinite alternate}
.rank-audit-app #ra-steps li.done{color:var(--ink)}
.rank-audit-app #ra-steps li.done i{border-color:var(--good);background:var(--good)}
.rank-audit-app #ra-steps li.skip{text-decoration:line-through}
@keyframes ra-pulse{from{opacity:.35}to{opacity:1}}
.rank-audit-app .ra-toolbar{max-width:210mm;margin:0 auto 18px;display:flex;align-items:center;gap:22px}
.rank-audit-app .ra-link{font-weight:700;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.rank-audit-app #ra-report .sheet{margin-left:auto;margin-right:auto}
.rank-audit-app #ra-report{background:var(--desk);padding:28px 16px;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.rank-audit-app .ra-toolbar{position:relative}
.rank-audit-app #ra-report:empty{display:none}
.rank-audit-app [hidden]{display:none!important}
@media (max-width:640px){
  .rank-audit-app .ra-form,.rank-audit-app .ra-progress{padding:28px 18px}
  .rank-audit-app .ra-fields{grid-template-columns:1fr}
}
@media print{
  .rank-audit-app #ra-report{background:#fff;padding:0;width:auto;margin:0}
}
.rank-audit-app .ra-toolbar{flex-wrap:wrap}
.rank-audit-app .ra-btn-line{background:#fff;color:var(--ink);border:1px solid var(--ink);padding:14px 20px}
.rank-audit-app .ra-btn-line:hover{background:var(--ink);color:#fff}

/* style="plain": sits inside a page section and takes the site's own fonts and form look, with no panel behind it. */
.rank-audit-app.ra-plain{font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}
.rank-audit-app.ra-plain .ra-form{max-width:960px;margin:0;padding:0;background:none;border:0;gap:24px;font-family:inherit}
.rank-audit-app.ra-plain .ra-progress{max-width:1180px;margin:0;padding:0;background:none;border:0;font-family:inherit}
.rank-audit-app.ra-plain .ra-fields{gap:16px}
.rank-audit-app.ra-plain .ra-f span{font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:.1em;color:var(--muted)}
.rank-audit-app.ra-plain .ra-f input,.rank-audit-app.ra-plain .ra-f select{font-family:inherit;font-size:16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background-color:#fff;transition:border-color .2s}
.rank-audit-app.ra-plain .ra-f select{padding-right:36px;background-position:calc(100% - 20px) 55%,calc(100% - 15px) 55%}
.rank-audit-app.ra-plain .ra-f input:focus,.rank-audit-app.ra-plain .ra-f select:focus{border:1px solid var(--ink);padding-bottom:14px}
.rank-audit-app.ra-plain .ra-btn{font-family:inherit;font-size:16px;font-weight:700;letter-spacing:0;text-transform:none;border-radius:999px;padding:16px 28px;transition:transform .25s,background .25s}
.rank-audit-app.ra-plain .ra-btn:hover{transform:translateY(-2px);background:#262A33}
.rank-audit-app.ra-plain .ra-btn-line{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.rank-audit-app.ra-plain .ra-btn-line:hover{background:var(--ink);color:#fff}
.rank-audit-app.ra-plain .small,.rank-audit-app.ra-plain .ra-actions .small{font-family:inherit;font-size:14px;color:var(--muted)}
.rank-audit-app.ra-plain #ra-steps li{font-family:inherit;font-size:16px}
.rank-audit-app.ra-plain .ra-progress .h2{font-family:inherit;font-size:clamp(32px,4vw,56px);text-transform:none;letter-spacing:-.045em;line-height:1}
.rank-audit-app.ra-plain .ra-progress .label{font-family:inherit}
.rank-audit-app.ra-plain .ra-toolbar{max-width:none;margin:0 0 24px}
.rank-audit-app.ra-plain #ra-report{margin-top:clamp(40px,6vh,72px)}

/* Progress screen: status on the left, a preview of the report filling in on the right */
.rank-audit-app{container-type:inline-size}
.rank-audit-app .ra-progress{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:clamp(32px,5vw,72px);align-items:start;max-width:1100px}
.rank-audit-app #ra-progress-site{overflow-wrap:anywhere;color:var(--ink)!important}
.rank-audit-app .ra-progress .label{color:var(--ink)!important}
.rank-audit-app .ra-progress[hidden]{display:none!important}
.rank-audit-app .ra-status{display:flex;flex-direction:column;gap:22px;min-width:0}
.rank-audit-app .ra-meter{display:flex;flex-direction:column;gap:10px}
.rank-audit-app .ra-meter-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.rank-audit-app .ra-meter-top b{font-size:clamp(44px,5vw,64px);font-weight:800;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.rank-audit-app .ra-meter-top span{font-size:14px;font-weight:600;color:var(--muted)}
.rank-audit-app .ra-track{height:6px;background:var(--line);border-radius:999px;overflow:hidden}
.rank-audit-app .ra-track i{display:block;height:100%;width:0;background:var(--blue);border-radius:999px;transition:width .25s linear;position:relative;overflow:hidden}
.rank-audit-app .ra-track i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:ra-sweep 1.4s linear infinite}
@keyframes ra-sweep{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.rank-audit-app .ra-now{margin:0;font-size:15px;font-weight:600;color:var(--ink);min-height:1.5em}
.rank-audit-app #ra-steps li{padding:10px 0;font-size:14.5px}
.rank-audit-app .ra-tip{margin:0;padding:14px 16px;background:rgba(8,120,255,.06);border-left:3px solid var(--blue);font-size:14px;line-height:1.5;color:var(--ink)}
.rank-audit-app .ra-tip span{font-weight:700;margin-right:4px}
.rank-audit-app .ra-tip em{font-style:normal}
/* report preview */
.rank-audit-app .ra-skel{position:sticky;top:120px}
.rank-audit-app .ra-skel-sheet{background:#fff;aspect-ratio:210/297;padding:8% 8% 6%;box-shadow:0 1px 0 var(--line),0 24px 60px -30px rgba(14,16,20,.35);display:flex;flex-direction:column;gap:7%;overflow:hidden}
.rank-audit-app .ra-skel i{display:block;height:9px;border-radius:3px;background:linear-gradient(90deg,#ECEBE6 25%,#F6F5F1 50%,#ECEBE6 75%);background-size:300% 100%;animation:ra-shimmer 1.6s ease-in-out infinite}
@keyframes ra-shimmer{from{background-position:100% 0}to{background-position:0 0}}
.rank-audit-app .ra-skel i.big{height:20px}
.rank-audit-app .ra-skel i.thin{height:6px}
.rank-audit-app .ra-skel .w30{width:30%}.rank-audit-app .ra-skel .w40{width:40%}.rank-audit-app .ra-skel .w60{width:60%}.rank-audit-app .ra-skel .w70{width:70%}.rank-audit-app .ra-skel .w80{width:80%}.rank-audit-app .ra-skel .w90{width:90%}
.rank-audit-app .ra-skel-hdr{display:flex;align-items:center;justify-content:space-between}
.rank-audit-app .ra-skel-hdr img{height:18px;width:auto}
.rank-audit-app .ra-skel-hero{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}
.rank-audit-app .ra-skel-hero > div:first-child{display:flex;flex-direction:column;gap:9px}
.rank-audit-app .ra-skel-dev{aspect-ratio:4/3;border-radius:6px;background:#ECEBE6;animation:ra-pulse 1.4s ease-in-out infinite alternate}
.rank-audit-app .ra-skel-scores{display:grid;grid-template-columns:1.3fr repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.rank-audit-app .ra-skel-scores span{display:grid;place-items:center;padding:16% 0;border-left:1px solid var(--line)}
.rank-audit-app .ra-skel-scores span:first-child{border-left:0}
.rank-audit-app .ra-skel-scores span i{width:56%;height:22px}
.rank-audit-app .ra-skel-scores span.o i{width:60%;height:34px}
.rank-audit-app .ra-skel-pair{display:grid;grid-template-columns:1fr 1fr;gap:8%}
.rank-audit-app .ra-skel-pair > div,.rank-audit-app .ra-skel-box{display:flex;flex-direction:column;gap:8px}
.rank-audit-app .ra-skel-box{background:var(--wash);padding:6%}
@container (max-width:820px){
  .ra-progress{grid-template-columns:1fr!important}
  .ra-skel{position:static!important;max-width:320px}
}
@media (prefers-reduced-motion:reduce){.rank-audit-app .ra-skel i,.rank-audit-app .ra-track i::after,.rank-audit-app .ra-skel-dev{animation:none}}

/* PDF: front.js copies the sheets into #ra-print-root at the top of <body>; print shows only that */
#ra-print-root{display:none}
@media print{
  html.ra-printing,html.ra-printing body{margin:0!important;padding:0!important;background:#fff!important}
  html.ra-printing body > *:not(#ra-print-root){display:none!important}
  html.ra-printing #ra-print-root{display:block!important;position:static!important;visibility:visible!important;padding:0!important;margin:0!important;background:#fff!important}
  html.ra-printing #ra-print-root *{visibility:visible!important}
}
/* Keep progress and toolbar text readable when the form sits inside a coloured page section */
.rank-audit-app .ra-progress .small,.rank-audit-app .ra-toolbar .small{color:var(--muted)!important}
.rank-audit-app .ra-progress #ra-steps li.now,.rank-audit-app .ra-progress #ra-steps li.done,.rank-audit-app .ra-progress .ra-now{color:var(--ink)!important}