/* ============================================================================
   Résumé Tailor — redesign (feed-first). App-shell + feed cards + a full
   restyle of shared components so every page stays consistent and unbroken.
   ========================================================================= */
:root{
  --navy:#0F172A; --navy-2:#1E293B; --navy-line:#243146;
  --canvas:#F4F7FC; --surface:#FFFFFF; --ink:#0F172A; --muted:#5B6B7C; --faint:#94A3B8;
  --brand:#2563EB; --brand-d:#1D4ED8; --brand-soft:#EFF4FF;
  --ok:#059669; --ok-soft:#ECFDF5; --ok-line:#A7F3D0;
  --amber:#B45309; --amber-soft:#FFF7ED; --amber-line:#FED7AA;
  --red:#B32638; --red-soft:#FEF2F2;
  --warn:#9A6700; --warn-bg:#FFF8E6; --warn-line:#F0DCA8;
  --line:#E4EAF2; --track:#E8EDF4;
  --font:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:14px; --r-sm:10px; --sh:0 1px 2px rgba(15,23,42,.05),0 12px 30px -16px rgba(15,23,42,.16);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--canvas);line-height:1.55;-webkit-font-smoothing:antialiased}
h1{font-size:1.55rem;font-weight:800;letter-spacing:-.02em;margin:0 0 .3rem}
h2{font-weight:700}
a{color:var(--brand)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.muted{color:var(--muted);font-weight:400}
.hint{color:var(--muted);font-size:.9rem}
svg{display:block}

/* ── app shell ─────────────────────────────────────────────────────────── */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.side{background:var(--navy);color:#CBD5E1;display:flex;flex-direction:column;padding:22px 15px;position:sticky;top:0;height:100vh}
.side-brand{display:flex;align-items:center;gap:11px;padding:2px 8px 20px;border-bottom:1px solid var(--navy-line);margin-bottom:14px}
.side-mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#2563EB,#38BDF8);color:#fff;font-weight:800;font-size:14px;display:grid;place-items:center}
.side-word{font-weight:700;color:#fff;font-size:15px;letter-spacing:-.01em}
.side-nav{display:flex;flex-direction:column;gap:3px;flex:1}
.side-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:#93A2B5;text-decoration:none;font-weight:500;font-size:14px;transition:background .15s,color .15s}
.side-nav a:hover{background:var(--navy-2);color:#E2E8F0}
.side-nav a.active{background:var(--brand);color:#fff;box-shadow:0 6px 16px -6px rgba(37,99,235,.7)}
.side-nav a .ni{width:19px;height:19px;flex-shrink:0}
.side-nav a.active .ni{color:#fff}
.side-user{display:flex;align-items:center;gap:10px;padding:12px 8px 0;border-top:1px solid var(--navy-line);margin-top:12px}
.side-avatar{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#6366F1,#2563EB);color:#fff;font-weight:700;font-size:13px;display:grid;place-items:center;flex-shrink:0}
.su-meta{display:flex;flex-direction:column;font-size:12.5px}
.su-name{color:#E2E8F0;font-weight:600}
.linklike{background:none;border:none;color:#8595A9;font:inherit;font-size:11.5px;padding:2px 0;cursor:pointer;text-align:start}
.linklike:hover{color:#CBD5E1}

.content{max-width:1040px;margin:0 auto;padding:30px 40px 64px}
.content.layout-density{max-width:1760px}
.content.layout-density #feed-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.content.layout-density #feed-list>.jc{margin-top:0}
.content.layout-density .feed-load-more{grid-column:1/-1}
/* Density cards: lift the score ring into the header corner so the summary,
   chips and actions span the full card width. In a 340px cell the ring's flex
   column otherwise leaves a dead left gutter under it and the body leans right. */
.content.layout-density .jc-lead{position:absolute;top:21px;inset-inline-start:22px;padding-top:0}
.content.layout-density .jc-head{min-height:64px;padding-inline-start:74px}
.content.layout-focus{max-width:1500px}

/* ── buttons ───────────────────────────────────────────────────────────── */
button,.button,.btn{font-family:var(--font);cursor:pointer;text-decoration:none}
button,.button{display:inline-flex;align-items:center;gap:.4rem;padding:.58rem 1.15rem;border:none;border-radius:10px;
  background:var(--brand);color:#fff;font-size:.92rem;font-weight:600;transition:background .15s,box-shadow .15s,transform .05s}
button:hover,.button:hover{background:var(--brand-d);box-shadow:0 6px 16px -8px rgba(37,99,235,.6)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.6;cursor:wait}
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border:1px solid transparent;border-radius:10px;font-size:13.5px;font-weight:600;transition:all .15s}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 6px 16px -8px rgba(37,99,235,.6)}
.btn-primary:hover{background:var(--brand-d);transform:translateY(-1px)}
.btn-ghost{background:var(--brand-soft);color:var(--brand-d);border-color:#DCE7FF}
.btn-ghost:hover{background:#E0EAFF;box-shadow:none}
.btn-quiet{background:transparent;color:var(--muted);border-color:var(--line)}
.btn-quiet:hover{background:#F1F5F9;color:var(--ink);box-shadow:none}
.btn-applied{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-line)}
.button.secondary,button.secondary{background:#EAF1FA;color:var(--brand-d);box-shadow:none}
.button.secondary:hover,button.secondary:hover{background:#DCE8F7}
button.link{background:none;color:var(--muted);padding:.55rem .5rem;font-weight:600;box-shadow:none}
button.link:hover{background:none;color:var(--red);box-shadow:none}

/* ── forms ─────────────────────────────────────────────────────────────── */
form{margin:1.15rem 0}
input[type="url"],textarea{width:100%;padding:.62rem .8rem;border:1px solid var(--line);border-radius:10px;font-size:.95rem;font-family:var(--font);background:var(--surface);margin-bottom:.75rem}
input[type="url"]:focus,textarea:focus,select:focus,.company-search:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
textarea{font-family:var(--mono)}
input[type="file"]{display:block;margin-bottom:.75rem}
/* Use the feed column width; auto-fit must not shrink the whole page to its contents. */
.content:has(>.filters){width:100%;min-width:0}
/* Fit six filters across a wide feed; wrap before select values become cramped. */
.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:1rem;align-items:end;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.15rem;box-shadow:var(--sh)}
.filters label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);display:flex;flex-direction:column;gap:.35rem}
.filters select,select{padding:.5rem .6rem;border:1px solid var(--line);border-radius:9px;background:var(--surface);font-size:.9rem;font-family:var(--font);color:var(--ink);cursor:pointer}
/* Keep the native select interaction, with equal-height controls in WebKit too. */
.filters select{width:100%;min-height:40px;appearance:none;-webkit-appearance:none;padding-inline-end:2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%235B6B7C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .65rem center}
[dir="rtl"] .filters select{background-position:left .65rem center}
.company-filter{position:relative;min-width:0;z-index:10}
.company-filter-title{display:block;margin-bottom:.35rem;color:var(--muted);font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.company-picker summary{min-height:40px;padding:.5rem .6rem;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.5rem;list-style:none}
.company-picker summary::-webkit-details-marker{display:none}
.company-picker summary:focus-visible{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
.company-picker[open] summary{border-color:var(--brand)}
.company-picker-chevron{color:var(--muted);font-size:.72rem;transition:transform .15s}
.company-picker[open] .company-picker-chevron{transform:rotate(180deg)}
.company-panel{position:absolute;top:calc(100% + 8px);inset-inline-start:0;z-index:30;width:max(100%,280px);max-height:min(380px,70vh);overflow:auto;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 18px 38px -16px rgba(15,23,42,.35)}
.company-panel-tools{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.company-search{min-width:0;width:100%;padding:.55rem .65rem;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit}
.company-all,.company-clear{white-space:nowrap;font-size:.8rem;font-weight:700}
.company-options{display:flex;flex-direction:column;gap:8px}
.company-option{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:9px}
.company-option[hidden]{display:none}
.company-option input{width:18px;height:18px;flex:none;margin:0;accent-color:var(--brand)}
.company-option input:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.filters .company-option label{display:flex;flex:1;align-items:center;align-self:stretch;min-width:0;color:var(--ink);font-size:.88rem;font-weight:600;letter-spacing:0;text-transform:none;cursor:pointer}
.company-apply{width:100%;justify-content:center;margin-top:12px}
.company-chips{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:-.15rem}
.company-chips-title{color:var(--muted);font-size:.76rem;font-weight:700}
.company-chip{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:4px 10px;border:1px solid #DCE7FF;border-radius:999px;background:var(--brand-soft);color:var(--brand-d);font-size:.8rem;font-weight:600;text-decoration:none}
.company-chip:hover{background:#E0EAFF}
.company-chip:focus-visible,.company-all:focus-visible,.company-clear:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.company-empty a{font-weight:700}
.control-row{display:flex;align-items:flex-start;justify-content:flex-end;gap:.6rem;margin:-.35rem 0 1.15rem}
.control-picker-wrapper{position:relative;min-width:0}
.control-picker summary{min-height:38px;padding:.5rem .65rem;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font-size:.86rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.6rem;list-style:none}
.control-picker summary::-webkit-details-marker{display:none}
.control-picker summary:focus-visible{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
.control-picker[open] summary{border-color:var(--brand)}
.control-picker-leading{display:flex;align-items:center;gap:.45rem;min-width:0}
.control-picker-leading .ni{width:18px;height:18px;flex:none;color:var(--muted)}
.control-picker-value{white-space:nowrap}
.control-picker-chevron{color:var(--muted);font-size:.72rem;transition:transform .15s}
.control-picker[open] .control-picker-chevron{transform:rotate(180deg)}
.control-picker-panel{position:absolute;top:calc(100% + 8px);z-index:30;inline-size:max(100%,240px);max-inline-size:calc(100vw - 36px);max-height:min(380px,70vh);overflow:auto;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 18px 38px -16px rgba(15,23,42,.35)}
.locale-picker-panel{inset-inline-start:0}
.layout-picker-panel{inset-inline-end:0}
.locale-option{margin:0}
.locale-option button,.layout-option{display:flex;align-items:center;width:100%;min-height:40px;padding:.5rem .65rem;border:0;border-radius:8px;background:transparent;color:var(--ink);font-size:.86rem;font-weight:600;text-align:start;text-decoration:none;box-shadow:none}
.locale-option button:hover,.layout-option:hover{background:#F1F5F9;color:var(--ink);box-shadow:none}
.locale-option button:focus-visible,.layout-option:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.locale-option button[aria-current="true"],.layout-option.active{background:var(--brand-soft);color:var(--brand-d)}
.login .locale-picker-wrapper{width:100%;margin-top:1.15rem}
.login .locale-picker-panel{inline-size:100%}

/* ── focus master/detail feed ──────────────────────────────────────────── */
.focus-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.8fr);gap:22px;align-items:start}
.focus-feed{min-width:0}
.focus-pane{position:sticky;top:30px;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1rem;display:flex;flex-direction:column;max-height:calc(100vh - 60px)}
.focus-pane-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);padding-bottom:.7rem;margin-bottom:.85rem;flex:none}
#focus-detail{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-inline-end:2px}
.focus-pane-header h2{font-size:1rem;margin:0}
.focus-detail-close{padding:.35rem .65rem}
.focus-empty{margin:.25rem 0}
#focus-detail .job-details{border:0;background:transparent;padding:0}
#focus-detail .job-details-dismiss{display:none}
.focus-layout .jc.selected{border-color:var(--brand);box-shadow:0 0 0 2px rgba(37,99,235,.14),var(--sh)}

/* ── insights analytics companion rail ─────────────────────────────────── */
.content.layout-insights{max-width:1760px}
.ins-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,380px);gap:24px;align-items:start;margin-top:14px}
.ins-feed{min-width:0}
.rail{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px;min-width:0;max-height:calc(100vh - 32px);overflow-y:auto;overscroll-behavior:contain;padding-inline-end:2px}
.rail>.card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--sh)}
.rail>.card h3{font-size:.82rem;font-weight:800;color:var(--ink);margin:0;display:flex;align-items:center;gap:8px}
.rail>.card>h3,.rail>.card>.gap-card-heading{padding-inline-end:24px}
.rail>.card .hint{font-size:.74rem;color:var(--muted);margin:3px 0 12px}
.card-min{position:absolute;top:13px;inset-inline-end:13px;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0;flex:none;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--muted);font-size:1.05rem;line-height:1;font-weight:700;cursor:pointer;transition:background .12s,color .12s,border-color .12s}
.card-min:hover{background:var(--track);color:var(--ink);border-color:var(--muted)}
.card-min:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.rail>.card.is-min{padding-bottom:15px}
.rail>.card.is-min>*:not(h3):not(.gap-card-heading):not(.card-min){display:none}
.dbar{display:flex;flex-direction:column;gap:9px}
.dbar .row{display:grid;grid-template-columns:116px 1fr 26px;align-items:center;gap:9px;font-size:.8rem}
.dbar .nm{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dbar .track{height:8px;background:var(--track);border-radius:99px;overflow:hidden}
.dbar .fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),#60A5FA)}
.dbar .vv{font-family:var(--mono);font-size:.72rem;color:var(--muted);text-align:end}
.domain-bars .row{grid-template-columns:142px 1fr 26px}
.distro{display:flex;height:14px;border-radius:99px;overflow:hidden;margin:12px 0 10px;background:var(--track)}
.distro i{display:block;height:100%}
.distro .score-5,.legend .score-5{background:var(--ok)}
.distro .score-4,.legend .score-4{background:#34A76F}
.distro .score-3,.legend .score-3{background:var(--amber)}
.distro .score-2,.legend .score-2{background:#D97706}
.distro .score-1,.legend .score-1{background:var(--red)}
.legend{display:flex;flex-direction:column;gap:5px;font-size:.78rem;color:var(--muted)}
.legend .li{display:flex;align-items:center;gap:8px}
.legend .dot{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.co-list{display:flex;flex-direction:column;gap:2px;margin-top:8px}
.co-list .co{display:flex;align-items:center;gap:10px;padding:6px 4px;font-size:.84rem;border-bottom:1px solid var(--line)}
.co-list .co:last-child{border-bottom:0}
.co .cm{width:26px;height:26px;border-radius:7px;background:var(--brand);color:#fff;font-weight:700;font-size:11px;display:grid;place-items:center;flex-shrink:0}
.co .cn{flex:1;color:var(--ink);font-weight:500}
.co .cc{min-width:24px;border-radius:99px;background:var(--brand-soft);padding:2px 7px;font-family:var(--mono);font-size:.76rem;color:var(--brand-d);text-align:center}
.ins-empty{color:var(--muted);font-size:.8rem;margin:10px 0 0}
.gap-card{background:linear-gradient(135deg,var(--surface),var(--brand-soft))!important}
.gap-card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.coming-next{border:1px solid var(--line);border-radius:99px;background:var(--surface);color:var(--brand-d);padding:2px 8px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}

/* ── status / indicators ───────────────────────────────────────────────── */
.status{color:var(--muted);font-weight:500}
.htmx-indicator{display:none;opacity:1}
.htmx-indicator.htmx-request,.htmx-request .htmx-indicator{display:inline-flex;opacity:1}
.spinner{display:inline-block;width:.9rem;height:.9rem;border:2px solid var(--line);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite;vertical-align:-.1rem}
@keyframes spin{to{transform:rotate(360deg)}}
.flash{color:var(--ok);font-weight:600}
.warn{color:var(--warn);font-weight:500}
.error{color:var(--red)}
.errors{color:var(--red);background:var(--red-soft);border:1px solid #F2C4CB;padding:.75rem 1.1rem;border-radius:10px}
.notice{color:var(--warn);background:var(--warn-bg);border:1px solid var(--warn-line);padding:.65rem .95rem;border-radius:10px}
.badge{display:inline-block;padding:.14rem .6rem;border-radius:999px;font-size:.78rem;font-weight:700}
.badge-score-5{background:var(--ok-soft);color:var(--ok)}.badge-score-4{background:#E9F6EF;color:#2f7d55}
.badge-score-3{background:var(--amber-soft);color:var(--amber)}.badge-score-2,.badge-score-1{background:var(--red-soft);color:var(--red)}

/* ── generic result container (non-feed pages + removed-card swaps) ─────── */
.result{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.3rem;margin-top:1rem;box-shadow:var(--sh)}
.result h2{margin-top:0;font-size:1.15rem}

/* ── feed card ─────────────────────────────────────────────────────────── */
.jc{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:19px 22px;margin-top:14px;box-shadow:var(--sh);transition:box-shadow .18s,transform .12s}
.jc:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(15,23,42,.06),0 20px 40px -18px rgba(15,23,42,.26)}
.jc-row{display:flex;gap:18px;align-items:flex-start}
.jc-lead{padding-top:2px}
.ring{width:60px;height:60px;border-radius:50%;background:conic-gradient(var(--tone) var(--deg,0deg),var(--track) 0);display:grid;place-items:center;flex-shrink:0}
.ring-in{width:46px;height:46px;border-radius:50%;background:var(--surface);display:grid;place-items:center;font-weight:800;font-size:17px;line-height:1}
.ring-in small{font-size:9px;color:var(--faint);font-weight:600}
.ring-hi{--tone:var(--ok)}.ring-mid{--tone:var(--amber)}.ring-lo{--tone:var(--red)}
.jc-body{flex:1;min-width:0}
.jc-head{display:flex;align-items:center;gap:12px;padding-inline-end:30px}
.jc-avatar{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,#6366F1,#2563EB);color:#fff;font-weight:700;font-size:22px;display:grid;place-items:center;flex-shrink:0}
.jc-avatar--logo{background:#fff;border:1px solid #E5E7EB;padding:4px;box-sizing:border-box;overflow:hidden}
.jc-avatar--logo img{width:100%;height:100%;object-fit:contain;display:block}
.jc-head h2{margin:0;font-size:1.05rem;font-weight:700;letter-spacing:-.01em}
.jc-meta{margin:.1rem 0 0;font-size:.82rem;color:var(--muted);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.band{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:999px}
.band-hi{background:var(--ok-soft);color:var(--ok)}.band-mid{background:var(--amber-soft);color:var(--amber)}.band-lo{background:var(--red-soft);color:var(--red)}
.jc-why{margin:.7rem 0 0;font-size:.9rem;color:#3f4b5a;max-width:66ch}
.jc-skills{display:flex;flex-direction:column;gap:5px;margin-top:.7rem;max-width:72ch}
.chip{display:flex;align-items:flex-start;gap:8px;font-size:.9rem;font-weight:500;color:var(--ink);line-height:1.45}
/* English fallback keeps LTR text, while its marker starts at the card's RTL edge. */
[dir="rtl"] .jc-skills .chip[dir="auto"]{flex-direction:row-reverse}
.chip::before{flex-shrink:0;font-weight:800;font-size:1.15rem;line-height:1.3}
.chip-ok::before{content:"✓";color:var(--ok)}
.chip-gap::before{content:"−";color:var(--red)}  /* present = green ✓ · missing = red − · text hangs past the marker */
.chip-work-condition::before{content:"•";color:var(--ink);font-size:1rem;line-height:1.5}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:.95rem 0 0}
/* star toggle pinned to the card's top-right */
button.star{position:absolute;top:.75rem;inset-inline-end:.85rem;background:none;border:none;padding:.2rem .3rem;min-height:0;font-size:1.4rem;line-height:1;color:#C6D0DC;box-shadow:none;cursor:pointer}
button.star:hover{background:none;color:#E0A800;box-shadow:none;transform:none}
button.star.starred{color:#F0B429}
/* tailoring result + details render below the row, full width */
.tailor-slot:not(:empty){margin-top:.85rem;border-top:1px solid var(--line);padding-top:.7rem}
.job-details-slot:not(:empty){margin-top:1rem}

/* ── job details (JobFacts) panel ──────────────────────────────────────── */
.job-details{border:1px solid var(--line);border-radius:12px;background:#FBFCFE;padding:.9rem 1.05rem}
.job-details summary{cursor:pointer;font-weight:700}
.job-details-dismiss{background:none;color:var(--muted);font-weight:600;padding:.4rem .5rem;box-shadow:none}
.job-details-dismiss:hover{background:#F1F5F9;color:var(--ink);box-shadow:none}
.job-facts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:1rem 0}
.job-fact{display:flex;flex-direction:column;gap:.15rem}
.job-fact-label{color:var(--muted);font-size:.8rem;font-weight:700}
.evidence-list blockquote{border-inline-start:3px solid var(--brand-soft);color:var(--muted);margin:.35rem 0 0;padding-inline-start:.65rem}
.keyword-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.keyword-chips span,.review-fact-key{background:var(--brand-soft);color:var(--brand-d);border-radius:999px;padding:.22rem .55rem;font-size:.8rem;font-weight:600}
.coverage{color:var(--muted);font-size:.85rem}.fit{font-weight:700}
.raw-jd{background:var(--surface);border:1px solid var(--line);border-radius:8px;max-height:24rem;overflow:auto;padding:.8rem;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}

/* ── owner review ──────────────────────────────────────────────────────── */
.eyebrow{color:var(--brand-d);font-size:.72rem;font-weight:800;letter-spacing:.1em;margin:0;text-transform:uppercase}
.review-header{margin-bottom:1rem}
.review-tabs{display:flex;gap:.55rem;margin:1rem 0 1.5rem;flex-wrap:wrap}
.review-tabs a{border:1px solid var(--line);border-radius:999px;color:inherit;padding:.5rem .8rem;text-decoration:none}
.review-tabs a.active{background:var(--navy);border-color:var(--navy);color:#fff}
.review-tabs span{opacity:.72}
.review-reason-group>h2{font-size:1rem;text-transform:capitalize}
.review-item{background:var(--surface);border:1px solid var(--line);border-radius:14px;margin:0 0 1rem;padding:1rem;box-shadow:var(--sh)}
.review-item-heading{display:flex;justify-content:space-between;gap:1rem}
.review-item-heading h3{margin:.15rem 0 0}
.review-claim{display:grid;grid-template-columns:9rem 1fr;gap:.35rem .8rem}
.review-claim dt{color:var(--muted);font-weight:700}
.review-claim dd{margin:0;overflow-wrap:anywhere}
.review-actions{display:flex;align-items:end;gap:.75rem;margin-top:1rem}
.review-actions form:first-child{display:flex;align-items:end;flex-wrap:wrap;gap:.55rem}
.review-actions label{display:flex;flex-direction:column;gap:.2rem}
.review-empty{background:#F0F5FB;border-radius:12px;padding:1rem}

/* ── page enhancements (subtitle, form panels, preview, entrance) ──────── */
.page-sub{color:var(--muted);font-size:.95rem;margin:-.05rem 0 1.25rem}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.25rem 1.4rem;box-shadow:var(--sh);margin:1rem 0}
.panel>h2:first-child{margin-top:0}
.panel>form:last-child,.panel>form:only-child{margin-bottom:0}
.preview{background:#FBFCFE;border:1px solid var(--line);border-radius:8px;padding:.9rem;max-height:22rem;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:.85rem;color:var(--muted)}
@keyframes card-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.jc{animation:card-in .34s cubic-bezier(.22,.61,.36,1) both}

/* ── stacked form (Personal Info etc.): label · hint · full-width field ── */
.stack-form label{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.15rem;font-weight:600;font-size:.9rem;color:var(--ink)}
.stack-form label small{font-weight:400;color:var(--muted);font-size:.8rem;line-height:1.45}
.stack-form textarea,.stack-form select{font-weight:400;font-size:.92rem;width:100%;max-width:100%}
.stack-form>button[type="submit"]{margin-top:.15rem}

/* ── removed-card (hide/applied) with an Undo ── */
.card-removed{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap}
.card-removed .flash{margin:0}

/* ── job-details dismiss control ── */
.job-details-dismiss{display:flex;justify-content:flex-end;margin-bottom:.6rem}

/* ── login ─────────────────────────────────────────────────────────────── */
.login{max-width:24rem;margin:8vh auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;box-shadow:var(--sh)}

/* ── responsive ────────────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){*{transition:none!important}.jc{animation:none}.jc:hover,.btn-primary:hover{transform:none}}
/* Stack secondary panes before their minimum widths squeeze the job cards. The
   desktop sidebar remains visible here, so the mobile breakpoint is too late. */
@media(max-width:1199px){
  .focus-layout{grid-template-columns:minmax(0,1fr)}
  .focus-pane{position:static;max-height:none}
  #focus-detail{overflow:visible;overscroll-behavior:auto}
  .ins-grid{grid-template-columns:minmax(0,1fr)}
  .rail{position:static;max-height:none;overflow:visible}
}
@media(max-width:860px){
  .app{grid-template-columns:1fr}
  .side{flex-direction:row;height:auto;position:static;align-items:center;gap:12px;padding:10px 14px;overflow-x:auto}
  .side-brand{border:none;margin:0;padding:0 6px 0 0}.side-word{display:none}
  .side-nav{flex-direction:row;gap:4px;overflow-x:auto}
  .side-nav a{padding:8px 10px;white-space:nowrap}.side-nav a span{display:none}
  .side-user{border:none;margin:0;padding:0;margin-inline-start:auto}.su-meta{display:none}
  .content{padding:22px 18px 50px}
  .ins-grid{grid-template-columns:1fr}
  .rail{position:static;max-height:none;overflow:visible}
}
@media(max-width:560px){
  h1{font-size:1.3rem}
  input[type="url"],textarea,.filters select,select{font-size:16px}
  .filters{grid-template-columns:1fr;align-items:stretch}.filters select{width:100%}
  .company-panel{inset-inline-end:0;width:auto}
  .control-picker-panel{inset-inline-start:0;inset-inline-end:0;inline-size:auto}
  .control-row{justify-content:flex-start;flex-wrap:wrap}
  .content.layout-density #feed-list{grid-template-columns:minmax(0,1fr)}
  .jc-row{flex-direction:column;gap:12px}.jc-head{padding-inline-end:34px}
  form button[type="submit"]{width:100%}
  .actions .btn{flex:1 1 8rem;justify-content:center}
  .job-facts-grid{grid-template-columns:1fr}
  .review-tabs,.review-actions,.review-item-heading{align-items:stretch;flex-direction:column}
  .review-claim{grid-template-columns:1fr}
}