:root { --navy:#082c4c; --navy-deep:#041d35; --emerald:#008c78; --emerald-pale:#e8f6f2; --white:#fff; --ink:#142236; --muted:#5e6b7a; --line:#d7e0e8; --pale:#f4f8fa; --danger:#8e2433; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--pale); font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; } a { color:var(--navy); } .site-header { background:var(--navy-deep); color:#fff; min-height:70px; display:flex; align-items:center; padding:0 max(24px,calc((100vw - 1080px)/2)); gap:16px; } .brand { color:#fff; text-decoration:none; font-size:1.45rem; font-weight:800; letter-spacing:-.04em; } .brand span { color:#45c5ad; } .tagline { color:#bbd0e1; font-size:.88rem; border-left:1px solid #466078; padding-left:15px; } .header-action { margin-left:auto; color:#fff; background:transparent; border:1px solid #5c7891; border-radius:5px; padding:8px 12px; font:inherit; font-weight:700; cursor:pointer; } .container { max-width:1080px; margin:0 auto; padding:42px 24px 64px; } .narrow { max-width:800px; } .hero { max-width:840px; margin:0 0 28px; } h1 { color:var(--navy-deep); font-size:clamp(2.1rem,5vw,3.8rem); line-height:1.06; letter-spacing:-.05em; margin:0 0 18px; } h2 { color:var(--navy-deep); margin:0 0 10px; } h3 { margin:.15rem 0 .25rem; } h4 { margin:14px 0 5px; } .eyebrow,.source { color:var(--emerald); font-weight:800; letter-spacing:.09em; font-size:.76rem; margin:0 0 7px; } .workflow { display:grid; grid-template-columns:repeat(5,1fr); padding:0; margin:0 0 28px; list-style:none; background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; } .workflow li { padding:14px; display:flex; align-items:center; border-right:1px solid var(--line); } .workflow li:last-child { border-right:0; } .workflow span { color:var(--navy); font-weight:750; } .notice { background:#edf5f7; border-left:4px solid var(--emerald); padding:18px 20px; margin:24px 0; border-radius:4px; } .critical { border-left-color:var(--danger); background:#fff2f3; } form,fieldset { background:var(--white); border:1px solid var(--line); border-radius:10px; } form { padding:24px; } fieldset { padding:20px; margin:0 0 18px; } legend { color:var(--navy); font-weight:800; padding:0 7px; } label { display:block; font-weight:650; margin:0 0 14px; } input,textarea,select { display:block; width:100%; margin-top:6px; border:1px solid #aebdca; border-radius:5px; padding:10px 11px; font:inherit; color:var(--ink); background:#fff; } textarea { min-height:96px; resize:vertical; } input:focus,textarea:focus,select:focus { outline:3px solid #a9dcd1; border-color:var(--emerald); } .form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; } .choice-row { display:flex; gap:22px; flex-wrap:wrap; } .choice-row label,.consent { font-weight:500; } .choice-row input,.consent input { display:inline; width:auto; margin:0 7px 0 0; accent-color:var(--emerald); } .file-input { border:1px dashed #7f94a5; border-radius:6px; padding:14px; } .file-input input { border:0; padding:8px 0 0; } .help,.attempts,.muted { color:var(--muted); font-size:.9rem; } .primary,.secondary,.outline { border-radius:5px; font:inherit; font-weight:750; cursor:pointer; text-decoration:none; display:inline-block; text-align:center; } .primary { background:var(--emerald); color:#fff; border:1px solid var(--emerald); padding:12px 18px; } .primary:hover { background:#006f60; } .primary:disabled { opacity:.65; cursor:wait; } .secondary,.outline { color:var(--navy); background:#fff; border:1px solid #8aa2b7; padding:9px 13px; } .bot-trap { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; } #results,.workspace-panel { margin-top:34px; scroll-margin-top:20px; } .results-heading,.section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin:24px 0 14px; } .profile-card,.workspace-panel { background:#fff; border:1px solid var(--line); border-radius:12px; padding:24px; } .profile-summary { max-width:780px; font-size:1.04rem; } .profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 26px; } .compact-list { margin:5px 0; padding-left:20px; } .compact-list li { margin:3px 0; } .status-pill { background:var(--emerald-pale); color:#006b5d; border:1px solid #a9dcd1; border-radius:999px; padding:6px 10px; font-size:.8rem; font-weight:800; white-space:nowrap; } .status-pill.warn { background:#fff4df; border-color:#dac38d; color:#785914; } .source-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(165px,1fr)); gap:9px; margin:14px 0 20px; } .source-status { display:grid; gap:2px; background:#fff; border:1px solid var(--line); border-radius:8px; padding:11px 12px; font-size:.82rem; color:var(--muted); } .source-status strong { color:var(--navy); } .status-ok { color:#08715f; } .status-warn { color:var(--danger); } .vacancy { background:#fff; border:1px solid var(--line); border-radius:10px; padding:20px; margin:12px 0; display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:22px; } .vacancy h3 { font-size:1.25rem; margin-bottom:7px; } .vacancy-topline { display:flex; align-items:center; justify-content:space-between; gap:15px; } .fit-badge { display:inline-grid; place-items:center; min-width:68px; padding:7px 10px; color:#fff; background:var(--navy); border-radius:999px; font-weight:850; } .fit-badge.large { font-size:1.15rem; min-width:88px; } .vacancy-meta { display:flex; gap:6px 16px; flex-wrap:wrap; color:var(--muted); margin:5px 0; } .vacancy-meta span { position:relative; } .verdict { color:#006f60; font-weight:800; margin:8px 0; } .score-row { display:flex; gap:6px; flex-wrap:wrap; margin:9px 0; } .score-row span { background:#edf3f6; border-radius:4px; padding:4px 7px; font-size:.79rem; font-weight:700; } .match-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } .vacancy-summary { max-width:760px; color:var(--muted); margin:12px 0; } .vacancy-actions { display:flex; flex-direction:column; gap:9px; align-self:start; } details { background:#fff; border:1px solid var(--line); border-radius:7px; padding:11px 13px; margin:13px 0 0; } summary { cursor:pointer; color:var(--navy); font-weight:750; } .loading-panel { display:flex; align-items:center; gap:18px; background:#fff; border:1px solid var(--line); border-radius:10px; padding:24px; } .spinner { width:34px; height:34px; border:4px solid #cde5df; border-top-color:var(--emerald); border-radius:50%; animation:spin .8s linear infinite; flex:none; } @keyframes spin { to { transform:rotate(360deg); } } .document-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } .document-card { border:1px solid var(--line); border-radius:9px; padding:18px; background:#fbfdfe; } .document-card p { margin:7px 0; } .review-card { grid-column:1/-1; background:#f1f8f6; } .gap-item { padding:9px 0; border-bottom:1px solid var(--line); } .outcome-row { display:flex; gap:12px; align-items:end; margin:20px 0; } .outcome-row label { margin:0; min-width:260px; } .saved-item { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 0; border-bottom:1px solid var(--line); } footer { background:var(--navy-deep); color:#c7d7e5; padding:24px; text-align:center; font-size:.9rem; } footer a { color:#77d9c7; } .footer-button { color:#77d9c7; background:transparent; border:0; padding:0; text-decoration:underline; font:inherit; cursor:pointer; } .loading { color:var(--navy); font-weight:700; } .admin-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; } .admin-card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:15px; margin:12px 0; } .admin-meta { display:flex; flex-wrap:wrap; gap:10px 18px; font-size:.88rem; color:var(--muted); margin-bottom:10px; } pre { max-height:520px; overflow:auto; white-space:pre-wrap; background:#071d32; color:#e5f4f1; padding:15px; border-radius:6px; font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace; } @media (max-width:760px) { .container { padding:28px 15px 48px; } .workflow { grid-template-columns:1fr; } .workflow li { border-right:0; border-bottom:1px solid var(--line); } .form-grid,.profile-grid,.match-columns,.document-tabs { grid-template-columns:1fr; } .vacancy { grid-template-columns:1fr; } .vacancy-actions { display:grid; grid-template-columns:1fr; } .review-card { grid-column:auto; } .outcome-row { align-items:stretch; flex-direction:column; } .outcome-row label { min-width:0; } .site-header { flex-wrap:wrap; padding-top:12px; padding-bottom:12px; } .tagline { display:none; } h1 { font-size:2.2rem; } }