/* ===== TumaCV v4 ===== */
/* Tools menu: the nav scrolls on phones only, so the dropdown isn't clipped on desktop */
@media (min-width:761px){.app-nav{overflow:visible}}

/* A4 previews always scale to their column */
.sheet[data-fit]{padding:0!important;overflow:hidden;max-width:820px}

/* Job card: full ad and status */
.job-ad{margin-top:10px}
.job-ad summary{cursor:pointer;font-weight:600;color:var(--jac-deep);font-size:.9rem}
.job-ad-text{white-space:pre-line;font-size:.9rem;color:var(--ink-2);background:var(--mist);border-radius:12px;padding:12px 14px;margin:8px 0;max-height:320px;overflow:auto}
.job.has-status{border-color:var(--blue-soft)}
.tabs-3{grid-template-columns:repeat(3,1fr)!important}

/* Result: three scores */
.score3-card{grid-template-columns:auto 1fr}
.score3{display:flex;align-items:center;gap:10px}
.s3-arrow{font:800 1.4rem var(--display);color:var(--muted)}
.pot{width:96px;height:96px;border-radius:50%;border:3px dashed var(--green);display:grid;place-content:center;text-align:center}
.pot b{font:800 1.9rem/1 var(--display);color:var(--green)}
.pot span{font-size:.72rem;color:var(--muted)}
.diffs{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:10px}
.diffs li{display:grid;gap:4px;padding:12px 14px;border-radius:14px;background:var(--mist)}
.diff-area{font-size:.72rem;font-weight:700;color:var(--jac-deep)}
.diffs s{color:#A2231D;opacity:.75;font-size:.9rem}
.diff-new{color:#155f3d;font-weight:600}
.diff-new::before{content:"→ ";color:var(--green)}
.quickfix .qf{padding:14px 0;border-top:1px solid var(--line-2)}
.quickfix .qf:first-of-type{border-top:0;padding-top:4px}
.quickfix .qf>b{display:block;margin-bottom:6px}
.quickfix .chips{margin:8px 0 10px}
.quickfix .grid-3{gap:8px}
.qf.is-done{opacity:.7}
.qf-done{color:var(--green);font-weight:700;margin:8px 0 0}
@media (max-width:760px){
  .score3-card{grid-template-columns:1fr}
  .score3{justify-content:space-between;width:100%}
  .score3 .ring{--size:84px!important}
  .score3 .s3-main .ring{--size:104px!important}
  .pot{width:78px;height:78px}.pot b{font-size:1.5rem}
  .s3-arrow{font-size:1rem}
}

/* Typing effect */
.typing::after{content:"▍";color:var(--jac);animation:pulse .9s infinite;margin-left:1px}

/* Outreach */
.outreach-review{background:#fff;border:2px solid var(--green);border-radius:18px;padding:16px 18px;margin-bottom:20px}
.ocards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-top:14px}
.ocard{transition:opacity .35s, transform .35s}
.ocard .mailview{box-shadow:none}
.ocard .mv-body{max-height:300px}
.ocard-actions{margin-top:10px}
.ocard.is-busy{opacity:.7}
.ocard.is-sent .mailview{border-color:var(--green)}
.ocard.is-skipped{opacity:0;transform:scale(.96)}
.o-state{font-weight:700;color:var(--green)}
.o-row{display:grid;grid-template-columns:22px 40px minmax(0,1fr);gap:12px;align-items:center;padding:10px 8px;border-bottom:1px solid var(--line-2);margin:0;font-weight:500;cursor:pointer}
.o-row input{width:20px;height:20px;accent-color:var(--jac)}
.o-row .logo-tile{width:40px;height:40px}
.o-main{display:grid;min-width:0}
.o-main b,.o-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agree{margin-top:14px;background:var(--yellow-soft);border-radius:12px;padding:10px 12px}
.auto-box{margin-top:14px;padding:12px;border-radius:12px;background:var(--jac-soft)}
@media (max-width:760px){.ocards{grid-template-columns:1fr}}

/* Landing proof: activity ticker */
.proof-right{display:grid;gap:10px;justify-items:start}
.ticker{display:flex;align-items:center;gap:10px;font-size:.92rem;background:var(--mist);border-radius:999px;padding:8px 14px;max-width:100%}
.ticker-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:none;animation:pulse 1.6s infinite}
.ticker-text{transition:opacity .35s, transform .35s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ticker-text.out{opacity:0;transform:translateY(-4px)}
@media (max-width:760px){.ticker{border-radius:14px;align-items:flex-start}.ticker-text{white-space:normal}}

/* Template list + full gallery */
.tpl-list{display:grid;gap:4px;margin-top:10px}
.tpl-opt{display:flex;gap:10px;align-items:center;margin:0;padding:8px 10px;border-radius:10px;cursor:pointer;font-weight:500}
.tpl-opt:has(input:checked){background:var(--jac-soft)}
.tpl-opt input{accent-color:var(--jac)}
.tpl-opt small{color:var(--muted)}
.tpl-modal-bg{align-items:stretch;justify-content:center;padding:20px}
.tpl-modal{background:var(--mist);border-radius:20px;width:min(1200px,100%);max-height:100%;overflow:auto;padding:18px;animation:sheetUp .22s ease}
.tpl-modal-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;position:sticky;top:-18px;background:var(--mist);padding:6px 0 12px;z-index:2}
.tpl-full-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}
.tpl-full{margin:0;display:grid;gap:10px;align-content:start;padding:12px;border-radius:16px;background:#fff;border:2px solid transparent}
.tpl-full.is-current{border-color:var(--jac)}
.tpl-full .sheet{max-width:none;box-shadow:0 2px 10px rgba(20,33,61,.12)}
@media (max-width:760px){.tpl-modal-bg{padding:0}.tpl-modal{border-radius:0;padding:12px}.tpl-full-grid{grid-template-columns:1fr}}

/* Interview: mic in the answer box, score card */
.answer-wrap{position:relative}
.answer-wrap textarea{padding-right:58px}
.mic-btn{position:absolute;right:8px;bottom:10px;width:42px;height:42px;border-radius:50%;border:0;background:var(--jac);color:#fff;display:grid;place-items:center;cursor:pointer}
.mic-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.coach.is-listening .mic-btn{background:var(--red);animation:pulse 1s infinite}
.scorecard .sc-title{font:800 1.1rem var(--display);margin-bottom:4px}
.stars.big{font-size:1.4rem}