/* finleydelouche.net/jobs and /jobs/manage, on top of site.css (.net look: navy, flag gold and red, mono accents). */
.jobs-page .mast .jump { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 18px 0 0; font-family: var(--mono); font-size: 0.86rem; }
.jobs-page .mast .jump a { color: #fff; text-decoration-color: var(--bright); }
.jobs-page .section { max-width: 64rem; }
.jobs-page .meta { font-family: var(--mono); font-size: 0.86rem; color: var(--quiet); margin: 0 0 12px; }

.btn { display: inline-block; border: 0; cursor: pointer; padding: 12px 18px; font: 500 0.92rem/1.2 var(--mono); text-decoration: none;
  background: var(--blue); color: #fff; box-shadow: inset 0 -2px 0 var(--bright); }
.btn:hover { color: #fff; background: var(--navy); }
.btn.alt { background: var(--surface); color: var(--ink); border: 1px solid var(--rule); box-shadow: none; }
.btn.alt:hover { border-color: var(--navy); color: var(--ink); }
.btn:disabled { opacity: 0.6; cursor: progress; }

.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 0 0 16px; }
.filters label { display: grid; gap: 4px; font-family: var(--mono); font-size: 0.8rem; color: var(--quiet); }
.filters .grow { flex: 1 1 14rem; }
.filters select, .filters input, .signup input:not([type=checkbox]):not([type=radio]) {
  font: inherit; font-size: 1rem; color: var(--ink); background: var(--surface); border: 1px solid var(--field-line); border-radius: 0; padding: 9px 10px; width: 100%; }
.filters select:focus, .filters input:focus, .signup input:focus { outline: 2px solid var(--gold); outline-offset: 1px; }

.jobs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.jobs li { padding: 12px 2px; border-bottom: 1px solid var(--rule); display: grid; gap: 2px; }
.jobs .t { font-size: 1.12rem; line-height: 1.35; }
.jobs .t a { text-decoration-color: var(--rule); }
.jobs .t a:hover { text-decoration-color: var(--gold); }
.jobs .d { font-size: 0.95rem; color: var(--quiet); overflow-wrap: anywhere; }
.jobs .tags { display: flex; flex-wrap: wrap; gap: 6px; font-family: var(--mono); font-size: 0.74rem; }
.jobs .tags span { padding: 2px 7px; border: 1px solid var(--rule); color: var(--quiet); }
.jobs .tags .remote { border-color: var(--bright); background: #FDF6E3; color: var(--ink); }
.jobs .tags .new { border-color: var(--red); color: var(--red); }
.jobs .empty { color: var(--quiet); }

.signup { max-width: 46rem; display: grid; gap: 14px; }
.signup label { display: grid; gap: 4px; font-weight: 500; }
.signup .row { display: grid; gap: 14px; }
@media (min-width: 560px) { .signup .row { grid-template-columns: 1fr 1fr; align-items: end; } }
.signup fieldset { border: 1px solid var(--rule); margin: 0; padding: 10px 14px 14px; }
.signup legend { font-weight: 500; padding: 0 4px; }
.signup .opt { font-weight: 400; color: var(--quiet); font-size: 0.92rem; }
.signup .picks { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.signup .pick { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.signup .pick input { width: 18px; height: 18px; margin: 4px 0 0; flex: none; accent-color: var(--blue); }
.signup .tick { padding: 10px 0; }
.signup .status { margin: 0; min-height: 1.2em; font-size: 1rem; }
.signup .status.err, .jobs-page .meta.err { color: var(--err); }
.signup .status.ok { color: var(--ok); font-weight: 600; }
.signup .privacy { margin: 0; font-size: 0.92rem; color: var(--quiet); }
.signup .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.jobs-page #stop-box h2 { margin-top: 36px; }