Showcase

ML/AI engineer portfolio website, built by DeepSeek V4.1 Flash 1017

Hostedvia OpenCodeOpenRouter
Running live in your browserNew tab
Speed
215tok/s
First token included
Written
98.2Ktokens
Time to build
7m 36s
Cost to build
$0.06
DeepSeek V4.1 Flash 1017's builds and scores
Show the code the model wrote
HTML28,469 characters
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mira Kovač — Senior Machine Learning Engineer</title>
<meta name="description" content="Mira Kovač is a senior machine learning engineer in Berlin, building retrieval and ranking systems for search, audio, and HR software.">
<meta name="theme-color" content="#060907">
<meta property="og:title" content="Mira Kovač — Senior Machine Learning Engineer">
<meta property="og:description" content="Retrieval and ranking systems that survive production. Berlin.">
<meta property="og:type" content="profile">
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%23060907'/%3E%3Crect x='6.5' y='6.5' width='19' height='19' fill='none' stroke='%2346e07e'/%3E%3Crect x='13' y='13' width='6' height='6' fill='%2346e07e'/%3E%3C/svg%3E">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&amp;display=swap" rel="stylesheet">
<style>
  :root {
    --bg: #060907;
    --line: #19231d;
    --line-strong: #26352b;
    --text: #d9e4dc;
    --muted: #8b9d91;
    --dim: #6f8276;
    --green: #46e07e;
    --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --shell: 1120px;
    --pad: clamp(20px, 4.5vw, 48px);
  }

  * { box-sizing: border-box; }

  html {
    background: var(--bg);
    color-scheme: dark;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
  }

  body {
    margin: 0;
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
    font-family: var(--mono);
    font-size: 15px;
    line-height: 1.65;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  ::selection {
    background: var(--green);
    color: var(--bg);
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  :focus-visible {
    outline: 1px solid var(--green);
    outline-offset: 4px;
  }

  .shell {
    width: 100%;
    max-width: var(--shell);
    margin-inline: auto;
    padding-inline: var(--pad);
  }

  .skip {
    position: fixed;
    top: -80px;
    left: 16px;
    z-index: 20;
    padding: 10px 14px;
    background: var(--green);
    color: var(--bg);
    font-size: 12px;
  }

  .skip:focus {
    top: 16px;
  }

  /* — top bar — */

  .topbar {
    border-bottom: 1px solid var(--line);
  }

  .topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 64px;
  }

  .brand {
    font-size: 13px;
    letter-spacing: -0.01em;
    color: var(--text);
  }

  .brand span {
    color: var(--green);
  }

  .status {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--muted);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .status-dot {
    width: 6px;
    height: 6px;
    background: var(--green);
    outline: 1px solid var(--line-strong);
    outline-offset: 3px;
  }

  /* — hero — */

  .hero {
    padding-block: clamp(64px, 9vw, 116px) clamp(56px, 7vw, 88px);
  }

  .eyebrow-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: clamp(26px, 3.5vw, 38px);
  }

  .eyebrow {
    margin: 0;
    color: var(--green);
    font-size: 11px;
    letter-spacing: 0.17em;
    text-transform: uppercase;
  }

  .eyebrow::before {
    content: "// ";
    color: var(--dim);
  }

  .binary {
    margin: 0;
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.16em;
    white-space: nowrap;
  }

  h1 {
    margin: 0 0 clamp(28px, 3.5vw, 38px);
    color: #e8f0ea;
    font-size: clamp(3rem, 9vw, 7.4rem);
    font-weight: 400;
    line-height: 0.98;
    letter-spacing: -0.06em;
  }

  .cursor {
    display: inline-block;
    width: 0.46em;
    height: 0.075em;
    margin-left: 0.06em;
    background: var(--green);
    vertical-align: baseline;
    animation: blink 1.15s steps(1, end) infinite;
  }

  @keyframes blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0.18; }
  }

  .lede {
    max-width: 62ch;
    margin: 0 0 clamp(40px, 5.5vw, 64px);
    color: var(--muted);
    font-size: clamp(15px, 1.4vw, 17px);
    line-height: 1.75;
  }

  .lede em {
    color: var(--text);
    font-style: normal;
  }

  .meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }

  .meta > div {
    min-width: 0;
    padding: 16px 24px 18px;
    border-left: 1px solid var(--line);
  }

  .meta > div:first-child {
    padding-left: 0;
    border-left: 0;
  }

  .meta dt {
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
  }

  .meta dd {
    margin: 6px 0 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 13px;
  }

  /* — sections — */

  .section {
    padding-top: clamp(76px, 8.5vw, 112px);
  }

  .section-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: clamp(30px, 4vw, 48px);
  }

  .section-num {
    color: var(--green);
    font-size: 11px;
    letter-spacing: 0.06em;
  }

  .section-head h2 {
    margin: 0;
    color: var(--text);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: lowercase;
    white-space: nowrap;
  }

  .section-line {
    flex: 1;
    height: 1px;
    background: var(--line);
  }

  .section-note {
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.13em;
    text-transform: lowercase;
    white-space: nowrap;
  }

  /* — timeline — */

  .timeline {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .job {
    position: relative;
    display: grid;
    grid-template-columns: 96px 1px minmax(0, 1fr);
    column-gap: clamp(20px, 3vw, 32px);
    padding-bottom: clamp(40px, 4.5vw, 56px);
  }

  .job:last-child {
    padding-bottom: 0;
  }

  .job::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(96px + clamp(20px, 3vw, 32px));
    width: 1px;
    background: var(--line-strong);
  }

  .job:last-child::before {
    bottom: auto;
    height: 9px;
  }

  .job-year {
    padding-top: 1px;
    font-size: 12px;
    line-height: 1.4;
  }

  .year {
    display: block;
    color: var(--green);
    font-size: 13px;
    letter-spacing: 0.01em;
  }

  .year-end {
    display: block;
    margin-top: 4px;
    color: var(--dim);
    font-size: 11px;
    letter-spacing: 0.03em;
  }

  .job-rail {
    position: relative;
    width: 1px;
  }

  .job-rail::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 50%;
    width: 7px;
    height: 7px;
    background: var(--green);
    transform: translate(-50%, -50%);
  }

  .job-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
  }

  .company {
    margin: 0;
    color: var(--text);
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.025em;
  }

  .job-place {
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .job-role {
    margin: 3px 0 16px;
    color: var(--muted);
    font-size: 12px;
  }

  .job-role .sep {
    padding-inline: 5px;
    color: var(--dim);
  }

  .job-points {
    display: grid;
    gap: 9px;
    max-width: 72ch;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .job-points li {
    position: relative;
    padding-left: 18px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.7;
  }

  .job-points li::before {
    content: "";
    position: absolute;
    top: 0.76em;
    left: 0;
    width: 4px;
    height: 4px;
    border: 1px solid var(--green);
  }

  .job-points strong {
    color: var(--text);
    font-weight: 500;
  }

  /* — skills — */

  .chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .chip {
    padding: 8px 13px;
    border: 1px solid var(--line-strong);
    color: var(--muted);
    font-size: 12px;
    line-height: 1.4;
  }

  .chip::before {
    content: "/";
    margin-right: 6px;
    color: var(--dim);
  }

  /* — projects — */

  .projects {
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--line);
    list-style: none;
  }

  .projects li {
    margin: 0;
  }

  .project {
    display: grid;
    grid-template-columns: 36px minmax(150px, 200px) minmax(0, 1fr) auto;
    align-items: baseline;
    column-gap: 24px;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
  }

  .project-index {
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.08em;
  }

  .project-name {
    color: var(--text);
    font-size: 15px;
    letter-spacing: -0.01em;
    transition: color 160ms ease;
  }

  .project-desc {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
  }

  .project-meta {
    display: flex;
    align-items: baseline;
    gap: 10px;
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.1em;
    white-space: nowrap;
  }

  .arrow {
    display: inline-block;
    color: var(--dim);
    transition: transform 160ms ease, color 160ms ease;
  }

  .project:hover .project-name,
  .project:focus-visible .project-name {
    color: var(--green);
  }

  .project:hover .arrow,
  .project:focus-visible .arrow {
    color: var(--green);
    transform: translate(2px, -2px);
  }

  /* — publication — */

  .paper {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(24px, 4vw, 48px);
    padding: clamp(24px, 3.4vw, 36px);
    border: 1px solid var(--line-strong);
  }

  .paper::before {
    content: "";
    position: absolute;
    top: -1px;
    bottom: -1px;
    left: -1px;
    width: 2px;
    background: var(--green);
  }

  .paper-label {
    margin: 0 0 14px;
    color: var(--green);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: lowercase;
  }

  .paper-title {
    max-width: 38ch;
    margin: 0;
    color: var(--text);
    font-size: clamp(18px, 2.2vw, 23px);
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: -0.025em;
  }

  .paper-authors {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 12px;
  }

  .paper-note {
    max-width: 58ch;
    margin: 14px 0 0;
    color: var(--dim);
    font-size: 12px;
    line-height: 1.7;
  }

  .paper-side {
    align-self: start;
    min-width: 136px;
    padding-left: clamp(20px, 3vw, 32px);
    border-left: 1px solid var(--line);
    text-align: right;
  }

  .paper-venue {
    display: block;
    color: var(--text);
    font-size: 13px;
    white-space: nowrap;
  }

  .paper-track {
    display: block;
    margin-top: 6px;
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    white-space: nowrap;
  }

  /* — contact — */

  .contact-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: clamp(32px, 4.5vw, 48px);
  }

  .contact-title {
    max-width: 23ch;
    margin: 0;
    color: var(--text);
    font-size: clamp(1.75rem, 4vw, 2.9rem);
    font-weight: 400;
    line-height: 1.22;
    letter-spacing: -0.04em;
  }

  .contact-title .q {
    color: var(--green);
  }

  .contact-copy {
    max-width: 36ch;
    margin: 0 0 5px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
    text-align: right;
  }

  .contact-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--line);
  }

  .contact-cell {
    min-width: 0;
    padding: 18px 20px 20px;
    background: var(--bg);
  }

  .contact-cell:first-child {
    padding-left: 0;
  }

  .contact-label {
    display: block;
    margin-bottom: 7px;
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.13em;
    text-transform: lowercase;
  }

  .contact-value {
    display: inline-block;
    max-width: 100%;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 12px;
    transition: color 160ms ease;
  }

  a.contact-value:hover {
    color: var(--green);
  }

  .contact-value .arrow {
    margin-left: 3px;
    font-size: 10px;
  }

  a.contact-value:hover .arrow {
    color: var(--green);
    transform: translate(2px, -2px);
  }

  /* — footer — */

  .footer {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px 32px;
    margin-top: clamp(76px, 9vw, 120px);
    padding-block: 24px 36px;
    border-top: 1px solid var(--line);
    color: var(--dim);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: lowercase;
  }

  .footer p {
    margin: 0;
  }

  .prompt {
    color: var(--muted);
    letter-spacing: 0;
    text-transform: none;
  }

  .prompt .block {
    color: var(--green);
  }

  @media (max-width: 980px) {
    .project {
      grid-template-columns: 32px minmax(130px, 170px) minmax(0, 1fr) auto;
      column-gap: 18px;
    }
  }

  @media (max-width: 820px) {
    .contact-intro {
      display: block;
    }

    .contact-copy {
      margin-top: 18px;
      text-align: left;
    }
  }

  @media (max-width: 860px) {
    .meta {
      grid-template-columns: 1fr 1fr;
    }

    .meta > div {
      padding: 14px 16px 16px;
    }

    .meta > div:nth-child(odd) {
      padding-left: 0;
      border-left: 0;
    }

    .meta > div:nth-child(n + 3) {
      border-top: 1px solid var(--line);
    }
  }

  @media (max-width: 760px) {
    .meta dd {
      font-size: 12px;
    }

    .job {
      display: block;
      position: relative;
      padding: 0 0 40px 24px;
    }

    .job:last-child {
      padding-bottom: 0;
    }

    .job::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 3px;
      width: 1px;
      background: var(--line-strong);
    }

    .job:last-child::before {
      bottom: auto;
      height: 8px;
    }

    .job::after {
      content: "";
      position: absolute;
      top: 4px;
      left: 0;
      width: 7px;
      height: 7px;
      background: var(--green);
    }

    .job-year {
      display: flex;
      align-items: baseline;
      gap: 8px;
      margin-bottom: 7px;
      padding: 0;
    }

    .year {
      font-size: 11px;
    }

    .year-end {
      margin: 0;
      font-size: 10px;
    }

    .job-rail {
      display: none;
    }

    .job-head {
      gap: 12px;
    }

    .company {
      font-size: 18px;
    }

    .job-role {
      margin-bottom: 14px;
    }

    .job-points li {
      font-size: 13.5px;
    }

    .project {
      grid-template-columns: 26px minmax(0, 1fr) auto;
      row-gap: 6px;
      padding-block: 17px;
    }

    .project-desc {
      grid-column: 2 / -1;
      grid-row: 2;
    }

    .project-meta {
      grid-column: 3;
      grid-row: 1;
    }

    .paper {
      grid-template-columns: 1fr;
    }

    .paper-side {
      padding-top: 18px;
      padding-left: 0;
      border-top: 1px solid var(--line);
      border-left: 0;
      text-align: left;
    }

    .contact-row {
      grid-template-columns: 1fr 1fr;
    }

    .contact-cell {
      padding: 16px 16px 18px;
    }

    .contact-cell:nth-child(odd) {
      padding-left: 0;
    }
  }

  @media (max-width: 600px) {
    .binary,
    .section-note {
      display: none;
    }

    .topbar-inner {
      min-height: 58px;
    }

    .status {
      font-size: 9px;
      letter-spacing: 0.1em;
    }

    .eyebrow {
      font-size: 10px;
    }

    .section-head {
      gap: 12px;
    }
  }

  @media (max-width: 440px) {
    .contact-row {
      grid-template-columns: 1fr;
    }

    .contact-cell {
      padding: 14px 0 16px;
    }

    .contact-cell + .contact-cell {
      border-top: 1px solid var(--line);
    }

    .footer {
      display: block;
    }

    .footer p + p {
      margin-top: 8px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .cursor {
      animation: none;
    }

    .project-name,
    .arrow,
    .contact-value {
      transition: none;
    }
  }

  @media print {
    :root {
      --bg: #fff;
      --line: #d4ddd6;
      --line-strong: #b8c4ba;
      --text: #101512;
      --muted: #303b34;
      --dim: #5d6860;
      --green: #0b6e37;
    }

    html,
    body {
      background: #fff;
      color: var(--text);
      color-scheme: light;
      font-size: 10.5pt;
    }

    .shell {
      max-width: none;
      padding-inline: 0;
    }

    .topbar,
    .footer,
    .skip,
    .binary,
    .cursor {
      display: none;
    }

    .hero {
      padding-block: 0 24px;
    }

    h1 {
      color: var(--text);
      font-size: 38pt;
      margin-bottom: 16px;
    }

    .lede {
      margin-bottom: 24px;
      font-size: 10.5pt;
    }

    .meta > div {
      padding-block: 8px;
    }

    .section {
      padding-top: 24px;
    }

    .section-head {
      margin-bottom: 16px;
      break-after: avoid;
    }

    .job {
      padding-bottom: 20px;
      break-inside: avoid;
    }

    .paper,
    .contact-row {
      break-inside: avoid;
    }

    .job-points li {
      font-size: 9.5pt;
      line-height: 1.55;
    }

    .chips {
      gap: 5px;
    }

    .chip {
      padding: 4px 8px;
      font-size: 9pt;
    }

    .project {
      padding-block: 10px;
    }

    .paper {
      padding: 18px;
    }

    .contact-intro {
      margin-bottom: 18px;
    }

    .contact-title {
      font-size: 22pt;
    }

    .contact-row {
      background: var(--line);
    }

    .contact-cell {
      background: #fff;
      padding-block: 10px;
    }

    a {
      color: var(--text);
    }
  }

  @page {
    margin: 16mm;
  }
</style>
</head>
<body>
<a class="skip" href="#main">Skip to content</a>

<header class="topbar">
  <div class="shell topbar-inner">
    <a class="brand" href="#top" aria-label="Mira Kovač, back to top">mira<span>.</span>kovac</a>
    <p class="status"><span class="status-dot" aria-hidden="true"></span>Open to staff roles</p>
  </div>
</header>

<main id="main">
  <section class="hero shell" id="top" aria-labelledby="name">
    <div class="eyebrow-row">
      <p class="eyebrow">Senior machine learning engineer</p>
      <p class="binary" aria-hidden="true">01001101 01001011 / MK</p>
    </div>

    <h1 id="name">Mira Kovač<span class="cursor" aria-hidden="true"></span></h1>

    <p class="lede">I build retrieval and ranking systems that survive contact with production. Nine years across fashion search, audio, and HR software — most of it Python, PyTorch, and <em>the occasional argument about evaluation</em>.</p>

    <dl class="meta">
      <div>
        <dt>Base</dt>
        <dd>Berlin, DE</dd>
      </div>
      <div>
        <dt>Focus</dt>
        <dd>Retrieval &amp; ranking</dd>
      </div>
      <div>
        <dt>Experience</dt>
        <dd>2017 — now</dd>
      </div>
      <div>
        <dt>Currently</dt>
        <dd>Personio</dd>
      </div>
    </dl>
  </section>

  <section class="shell section" id="experience" aria-labelledby="experience-title">
    <div class="section-head">
      <span class="section-num" aria-hidden="true">[01]</span>
      <h2 id="experience-title">Experience</h2>
      <span class="section-line" aria-hidden="true"></span>
      <span class="section-note">2017 → now</span>
    </div>

    <ol class="timeline">
      <li class="job">
        <div class="job-year">
          <span class="year">2017</span>
          <span class="year-end">— 2020</span>
        </div>
        <div class="job-rail" aria-hidden="true"></div>
        <div class="job-body">
          <div class="job-head">
            <h3 class="company">Zalando</h3>
            <span class="job-place">Berlin</span>
          </div>
          <p class="job-role">machine learning engineer<span class="sep">/</span>search relevance</p>
          <ul class="job-points">
            <li>Rebuilt query understanding for fashion search with a character-level tagger; zero-result queries dropped from <strong>9.4% to 3.1%</strong>.</li>
            <li>Shipped a two-tower retrieval model over <strong>40M article embeddings</strong>, lifting similar-items click-through by <strong>6.2%</strong> in a four-week test.</li>
            <li>Built the offline evaluation harness (NDCG@10, recall@100) that became the release gate for every search model.</li>
          </ul>
        </div>
      </li>

      <li class="job">
        <div class="job-year">
          <span class="year">2020</span>
          <span class="year-end">— 2023</span>
        </div>
        <div class="job-rail" aria-hidden="true"></div>
        <div class="job-body">
          <div class="job-head">
            <h3 class="company">Spotify</h3>
            <span class="job-place">Berlin</span>
          </div>
          <p class="job-role">senior machine learning engineer<span class="sep">/</span>podcast ranking</p>
          <ul class="job-points">
            <li>Led ranking for podcast recommendations on Home; replaced a GBDT ranker with a sequence transformer and gained <strong>+3.8% podcast consumption</strong>.</li>
            <li>Cut p99 feature latency from <strong>180 ms to 45 ms</strong> by moving feature assembly into a Go service with precomputed embeddings.</li>
            <li>Added editorial and freshness constraints to the ranker, cutting already-consumed impressions by <strong>27%</strong> with no engagement loss.</li>
          </ul>
        </div>
      </li>

      <li class="job">
        <div class="job-year">
          <span class="year">2023</span>
          <span class="year-end">— now</span>
        </div>
        <div class="job-rail" aria-hidden="true"></div>
        <div class="job-body">
          <div class="job-head">
            <h3 class="company">Personio</h3>
            <span class="job-place">Berlin</span>
          </div>
          <p class="job-role">senior machine learning engineer<span class="sep">/</span>talent matching</p>
          <ul class="job-points">
            <li>Own candidate–role matching for <strong>6,000+ SMB customers</strong>; hard-negative mining and a tuned encoder raised recall@20 by <strong>19%</strong>.</li>
            <li>Introduced a model registry and shadow deploys on Kubernetes, taking rollback time from hours to <strong>under ten minutes</strong>.</li>
            <li>Mentor three engineers and run the applied-ML review board; the team ships roughly <strong>one model a month</strong>.</li>
          </ul>
        </div>
      </li>
    </ol>
  </section>

  <section class="shell section" id="skills" aria-labelledby="skills-title">
    <div class="section-head">
      <span class="section-num" aria-hidden="true">[02]</span>
      <h2 id="skills-title">Skills</h2>
      <span class="section-line" aria-hidden="true"></span>
      <span class="section-note">08 tools</span>
    </div>

    <ul class="chips" aria-label="Tools and skills">
      <li class="chip">python</li>
      <li class="chip">pytorch</li>
      <li class="chip">sql / spark</li>
      <li class="chip">retrieval &amp; ranking</li>
      <li class="chip">llm fine-tuning</li>
      <li class="chip">evaluation</li>
      <li class="chip">ray</li>
      <li class="chip">kubernetes</li>
    </ul>
  </section>

  <section class="shell section" id="projects" aria-labelledby="projects-title">
    <div class="section-head">
      <span class="section-num" aria-hidden="true">[03]</span>
      <h2 id="projects-title">Projects</h2>
      <span class="section-line" aria-hidden="true"></span>
      <span class="section-note">03 projects</span>
    </div>

    <ul class="projects">
      <li>
        <a class="project" href="https://github.com/mirakovac/latent-space" target="_blank" rel="noopener noreferrer">
          <span class="project-index">01</span>
          <span class="project-name">latent.space</span>
          <span class="project-desc">Semantic search over 4,200 papers and notes; two-tower embeddings, one VPS.</span>
          <span class="project-meta">2024 <span class="arrow" aria-hidden="true">↗</span></span>
        </a>
      </li>
      <li>
        <a class="project" href="https://github.com/mirakovac/tokencost" target="_blank" rel="noopener noreferrer">
          <span class="project-index">02</span>
          <span class="project-name">tokencost</span>
          <span class="project-desc">A CLI that prices prompts across providers; used daily by my team.</span>
          <span class="project-meta">2023 <span class="arrow" aria-hidden="true">↗</span></span>
        </a>
      </li>
      <li>
        <a class="project" href="https://github.com/mirakovac/berlin-ml" target="_blank" rel="noopener noreferrer">
          <span class="project-index">03</span>
          <span class="project-name">berlin.ml</span>
          <span class="project-desc">The applied-ML meetup I co-run: 600 members, two talks a month, no sponsors.</span>
          <span class="project-meta">2022 <span class="arrow" aria-hidden="true">↗</span></span>
        </a>
      </li>
    </ul>
  </section>

  <section class="shell section" id="publication" aria-labelledby="publication-title">
    <div class="section-head">
      <span class="section-num" aria-hidden="true">[04]</span>
      <h2 id="publication-title">Publication</h2>
      <span class="section-line" aria-hidden="true"></span>
      <span class="section-note">01 paper</span>
    </div>

    <article class="paper">
      <div class="paper-main">
        <p class="paper-label">peer-reviewed / recsys ’24</p>
        <h3 class="paper-title">Hard Negatives for Small Catalogs: Contrastive Retrieval in Hiring Search</h3>
        <p class="paper-authors">Mira Kovač, Jonas Lindner, Anne Weber</p>
        <p class="paper-note">What worked — and what quietly broke — when we moved from BM25 to a contrastive dual-encoder for catalogs of 6,000 customers instead of 60 million items.</p>
      </div>
      <div class="paper-side">
        <span class="paper-venue">RecSys 2024</span>
        <span class="paper-track">industry track</span>
      </div>
    </article>
  </section>

  <section class="shell section" id="contact" aria-labelledby="contact-title">
    <div class="section-head">
      <span class="section-num" aria-hidden="true">[05]</span>
      <h2 id="contact-title">Contact</h2>
      <span class="section-line" aria-hidden="true"></span>
      <span class="section-note">berlin, de</span>
    </div>

    <div class="contact-intro">
      <h3 class="contact-title">Have a retrieval problem worth solving<span class="q">?</span></h3>
      <p class="contact-copy">Open to staff roles in Berlin or remote across CET ±2. I answer real messages, usually within a day.</p>
    </div>

    <div class="contact-row">
      <div class="contact-cell">
        <span class="contact-label">email</span>
        <a class="contact-value" href="mailto:hello@mirakovac.dev">hello@mirakovac.dev<span class="arrow" aria-hidden="true">↗</span></a>
      </div>
      <div class="contact-cell">
        <span class="contact-label">github</span>
        <a class="contact-value" href="https://github.com/mirakovac" target="_blank" rel="noopener noreferrer">@mirakovac<span class="arrow" aria-hidden="true">↗</span></a>
      </div>
      <div class="contact-cell">
        <span class="contact-label">linkedin</span>
        <a class="contact-value" href="https://www.linkedin.com/in/mirakovac" target="_blank" rel="noopener noreferrer">in/mirakovac<span class="arrow" aria-hidden="true">↗</span></a>
      </div>
      <div class="contact-cell">
        <span class="contact-label">based in</span>
        <span class="contact-value">Berlin, Germany</span>
      </div>
    </div>
  </section>
</main>

<footer class="shell footer">
  <p>© 2026 Mira Kovač</p>
  <p>last updated 10 / 2026</p>
  <p class="prompt">mira@berlin:~$ <span class="block" aria-hidden="true">▌</span></p>
</footer>

</body>
</html>

Watch the test

Video tests of this model on coding and agent work.

DeepSeek V4.1 Flash First Test | Better V4 Flash? | Coding with OpenCode, Frontend & Agentic Work11 Sep 2026

Same prompt, other models

9 more
Compare side by side

One email when a new model lands on the board or in the showcase. Unsubscribe anytime.