:root { color-scheme: dark; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body.jd { margin: 0; min-height: 100vh; background: #000; color: #fff; font: 500 16px/1.45 system-ui, -apple-system, Roboto, Arial, sans-serif; }
.jd main { width: 100%; max-width: 480px; margin: 0 auto; padding: 6px 16px 32px; display: flex; flex-direction: column; gap: 14px; }
.jd-top { min-height: 52px; display: flex; align-items: center; }
.logo { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.logo .icon { width: 34px; height: 34px; display: block; }
.logo .word { width: 96px; height: 18px; fill: #fff; display: block; }
.jd p, .jd h1, .jd h2, .jd dl { margin: 0; }
.jd-kind { font: 700 16px/1.2 system-ui, -apple-system, Roboto, Arial, sans-serif; color: #4ade80; }
.jd h1 { margin-top: -6px; font: 700 27px/1.18 system-ui, -apple-system, Roboto, Arial, sans-serif; overflow-wrap: anywhere; }
.jd-org { font-weight: 600; color: #c9ced8; margin-top: -6px; }
.jd-facts { display: grid; border-radius: 12px; overflow: hidden; background: #12151b; box-shadow: inset 0 0 0 1.5px #2c3340; }
.jd-facts div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 12px 14px; }
.jd-facts div + div { border-top: 1.5px solid #2c3340; }
.jd-facts dt { color: #c9ced8; font-weight: 600; }
.jd-facts dd { margin: 0; font-weight: 700; text-align: right; }
.jd form { margin: 0; }
.jd-go { display: block; width: 100%; min-height: 58px; padding: 8px 16px; border: 0; border-radius: 14px; background: #15803d; color: #fff; cursor: pointer;
  font: 700 21px/1.15 system-ui, -apple-system, Roboto, Arial, sans-serif; box-shadow: 0 2px 0 #0c5a2a; transition: transform .15s ease; }
.jd-go:active { transform: translateY(1px); }
.jd-go:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.jd-by { text-align: center; color: #c9ced8; font-size: 15px; margin-top: -4px; }
.jd section { display: grid; gap: 8px; padding: 14px 16px; border-radius: 12px; background: #12151b; box-shadow: inset 0 0 0 1.5px #2c3340; }
.jd h2 { font: 700 18px/1.25 system-ui, -apple-system, Roboto, Arial, sans-serif; }
.jd ul, .jd ol { margin: 0; padding-left: 22px; display: grid; gap: 6px; color: #e6e9ef; }
.jd li b { color: #fff; }
.jd-closed { padding: 12px 14px; border-radius: 12px; background: #2a1414; box-shadow: inset 0 0 0 1.5px #6b2b2b; color: #fde2e2; font-weight: 600; }
.jd-fine { text-align: center; color: #9aa3b2; font-size: 13.5px; }

/* Public listing pages and the free CV form share the calm friend-page layout. */
a { color: #86efac; text-underline-offset: 3px; overflow-wrap: anywhere; }
.jd main { max-width: 640px; }
.jd .jd-top a { color: white; }
.jd .jd-facts dt { flex: 0 0 95px; }
.jd .jd-facts dd { overflow-wrap: anywhere; min-width: 0; }
.jd .jd-go { text-align: center; text-decoration: none; }
.jd nav.browse { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.jd details { padding: 12px 0; }
.jd details[open] { display: grid; gap: 12px; }
.jd summary { cursor: pointer; padding: 8px 0; }
.jd .listings { display: grid; gap: 14px; }
.jd article { padding: 16px; background: #12151b; border: 1px solid #2c3340; border-radius: 12px; display: grid; gap: 6px; }
.jd article h2 { font-size: 20px; }
.jd article h2 a { color: #fff; }
.jd footer { border-top: 1px solid #2c3340; padding-top: 16px; font-size: 14px; color: #b8c0cd; display: grid; gap: 12px; }
.jd .pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; }
.jd form { display: grid; gap: 16px; }
.jd label { display: grid; gap: 6px; }
.jd input, .jd select { width: 100%; min-height: 48px; background: #12151b; border: 1px solid #8491a5; border-radius: 8px; color: #fff; font: inherit; padding: 10px 12px; }
.jd input::placeholder { color: #aeb8c8; opacity: 1; }
.jd label.check { display: flex; align-items: center; gap: 10px; }
.jd label.check input { width: 24px; min-height: 24px; }
.jd .error { color: #fecaca; }
@media(min-width: 800px) { .jd main { padding-top: 16px; } }

.jd details:not([open]) > :not(summary) { display: none; }
.jd .stick { position: sticky; bottom: 8px; background: #000; padding: 8px 0; }