/* The CV tool (src/tools/cv). Builds on app.css: nothing under 15px, tap
   targets 48px and up, Vantum blue on white, no gradients. */

/* The questions: four screens, big taps */
.cv-flow .link-btn,.cv-page .link-btn{min-height:56px}
.cv-flow{display:flex;flex-direction:column;flex:1}
.cv-head{display:flex;align-items:center;gap:12px;margin:-4px 0 22px}
.cv-back{display:grid;place-items:center;width:56px;height:56px;margin-left:-14px;border-radius:12px;flex:0 0 56px}
.cv-back:active{background:var(--grey)}
.cv-head .progress{height:10px;border-radius:5px}
.cv-count{flex:0 0 auto;font-family:Mono,monospace;font-size:15px;font-weight:600;color:var(--blue)}
.cv-kicker{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700;color:var(--blue)}
.cv-kicker .icon{width:22px;height:22px}
.cv-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cv-tile{justify-content:center;min-height:64px;padding:10px 12px;font-size:18px;font-weight:600;line-height:1.2;text-align:center}
.cv-tile.on,.cv-tile[aria-pressed=true]{border-color:var(--blue);background:var(--blue);color:#fff}
.cv-step .btn.outline.on{background:var(--blue-soft)}
.cv-step [data-none] .cv-tick{width:22px;height:22px;color:var(--line)}
.cv-step [data-none].on .cv-tick{color:var(--blue)}
.cv-quick{display:flex;flex-wrap:wrap;gap:8px}
.cv-quick button{min-height:48px;padding:8px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;font-size:16px;font-weight:500;cursor:pointer}
.cv-quick button:active{background:var(--blue-soft)}
.cv-school{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.cv-school .choice{justify-content:center;min-height:56px;padding:8px;font-size:16px;font-weight:600;line-height:1.2;text-align:center}
.cv-school .choice.on,.cv-school .choice[aria-pressed=true]{border-color:var(--blue);background:var(--blue-soft);color:var(--blue)}
/* The make button stays on screen, so nobody has to find it by scrolling. */
.cv-step [data-make]{position:sticky;bottom:12px;z-index:2;box-shadow:0 8px 22px #1a3bd240}
.cv-making{flex:1}
.cv-making .spinner{width:56px;height:56px;border-width:6px}

/* The finished CV */
.cv-ready{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;color:var(--good)}
.cv-ready .icon{width:26px;height:26px;padding:3px;border-radius:50%;background:var(--good);color:#fff;stroke-width:3}
.cv-preview{display:block;border:1px solid var(--line)}
.cv-preview .cv-svg,.cv-svg{display:block;width:100%;height:auto}
.cv-lock{display:flex;align-items:flex-start;gap:10px}
.cv-lock .icon{width:22px;height:22px;margin-top:1px;color:var(--blue)}
.cv-designs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cv-designs .choice{min-height:58px;padding:10px 12px;font-size:17px}
.cv-designs .choice .icon{width:20px;height:20px;color:var(--blue)}
.cv-swatch{width:24px;height:24px;border-radius:6px;flex:0 0 24px}
.cv-done{display:grid;place-items:center;width:84px;height:84px;margin:0 auto;border-radius:50%;background:var(--blue);color:#fff}
.cv-done .icon{width:44px;height:44px;stroke-width:3}

@media(max-width:340px){.cv-designs{grid-template-columns:1fr}.cv-tile{font-size:17px}.cv-school .choice{font-size:15px}}

.cv-last>*+*{margin-top:16px}

/* The finished CV and the download: one move (the jobs), the rest smaller, the looks folded */
.cv-move{min-height:76px;font-size:21px}
.cv-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cv-two .btn{min-height:64px;font-size:16px;padding:10px 12px}
.cv-more{border-radius:14px;background:var(--grey)}
.cv-more summary{display:flex;align-items:center;gap:10px;min-height:56px;padding:0 16px;font-size:17px;font-weight:600;color:var(--blue);cursor:pointer;list-style:none}
.cv-more summary::-webkit-details-marker{display:none}
.cv-more summary .icon{width:20px;height:20px}
.cv-more>*:not(summary){margin:0 12px 12px}
@media(max-width:340px){.cv-two{grid-template-columns:1fr}}